:root{--ink: #20263d;--tile-face: #ffffff;--tile-found: #fff6d6;--primary: #ff5da2;--primary-ink: #ffffff;--secondary: #3dc6c3;--focus: #1b75ff;--card: rgba(255, 255, 255, .86);--bg-a: #5b8cff;--bg-b: #93b2ff;--radius-tile: 22px;--radius-card: 28px;--radius-pill: 999px;--shadow-tile: 0 8px 20px rgba(32, 38, 61, .18);--shadow-card: 0 12px 40px rgba(32, 38, 61, .22);--pad-top: calc(16px + env(safe-area-inset-top)) ;--pad-right: calc(16px + env(safe-area-inset-right)) ;--pad-bottom: calc(16px + env(safe-area-inset-bottom)) ;--pad-left: calc(16px + env(safe-area-inset-left)) ;--font: "Comic Neue", ui-rounded, "SF Pro Rounded", "Nunito", system-ui, sans-serif}@property --bg-a{syntax: "<color>"; inherits: true; initial-value: #5b8cff;}@property --bg-b{syntax: "<color>"; inherits: true; initial-value: #93b2ff;}@font-face{font-family:Comic Neue;src:url(/fonts/comic-neue-400.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Comic Neue;src:url(/fonts/comic-neue-700.woff2) format("woff2");font-weight:700;font-display:swap}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}html{touch-action:manipulation;-webkit-text-size-adjust:100%}body{font-family:var(--font);color:var(--ink);background:var(--bg-a);min-height:100dvh;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#app{position:relative;z-index:1;min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit;color:inherit;border:none;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}button:focus-visible{outline:4px solid var(--focus);outline-offset:3px}input{font-family:inherit}.screen{flex:1;display:flex;flex-direction:column;min-height:100dvh;padding:var(--pad-top) var(--pad-right) var(--pad-bottom) var(--pad-left)}.icon-btn{width:48px;height:48px;display:grid;place-items:center;color:#fff;opacity:.75;transition:transform .12s ease,opacity .12s ease}.icon-btn:hover{opacity:.95}.icon-btn:active{transform:scale(.88);opacity:1}.icon-btn svg{display:block;filter:drop-shadow(0 1px 2px rgba(32,38,61,.35))}.card{background:var(--card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none;background:radial-gradient(120% 120% at 20% 10%,var(--bg-b),transparent 60%),linear-gradient(160deg,var(--bg-a),var(--bg-b));background-size:140% 140%,100% 100%;transition:--bg-a .6s ease,--bg-b .6s ease}.bg__blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;will-change:transform}.bg__blob--1{width:46vmax;height:46vmax;left:-12vmax;top:-10vmax;background:#ffffff80}.bg__blob--2{width:40vmax;height:40vmax;right:-14vmax;top:30%;background:#ffffff52}.bg__blob--3{width:34vmax;height:34vmax;left:20%;bottom:-16vmax;background:#ffffff47}@media(prefers-reduced-motion:no-preference){.bg{animation:bg-drift 26s ease-in-out infinite alternate}.bg__blob--1{animation:blob-1 34s ease-in-out infinite alternate}.bg__blob--2{animation:blob-2 28s ease-in-out infinite alternate}.bg__blob--3{animation:blob-3 40s ease-in-out infinite alternate}}@keyframes bg-drift{0%{background-position:0% 0%,0% 0%}to{background-position:100% 100%,0% 0%}}@keyframes blob-1{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(6vmax,8vmax,0) scale(1.15)}}@keyframes blob-2{0%{transform:translateZ(0) scale(1.1)}to{transform:translate3d(-8vmax,-6vmax,0) scale(.95)}}@keyframes blob-3{0%{transform:translateZ(0) scale(.95)}to{transform:translate3d(5vmax,-7vmax,0) scale(1.2)}}.screen__topbar{display:flex;justify-content:space-between;align-items:center;min-height:52px}.entry__center{flex:1;display:flex;align-items:center;justify-content:center}.entry__card{width:min(440px,100%);padding:28px 24px 24px;display:flex;flex-direction:column;gap:16px;text-align:center}.entry__title{font-size:clamp(28px,8vw,40px);font-weight:800;color:var(--ink)}.entry__sub{font-size:16px;opacity:.7;margin-top:-6px}.entry__input{width:100%;padding:16px 18px;font-size:24px;font-weight:700;text-align:center;color:var(--ink);background:#fff;border:3px solid rgba(32,38,61,.12);border-radius:var(--radius-tile);transition:border-color .15s ease}.entry__input::placeholder{color:#20263d59;font-weight:600}.entry__input:focus{outline:none;border-color:var(--secondary)}.entry__modes-label{font-size:15px;font-weight:700;opacity:.7;margin-top:2px;margin-bottom:-6px}.entry__modes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.pill{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 6px;border-radius:var(--radius-tile);background:#20263d0f;border:3px solid transparent;transition:background .15s ease,border-color .15s ease,transform .1s ease}.pill:active{transform:scale(.96)}.pill[aria-pressed=true]{background:#3dc6c329;border-color:var(--secondary)}.pill__label{font-size:22px;font-weight:800;color:var(--ink)}.pill__hint{font-size:12px;font-weight:600;opacity:.6}.entry__go{margin-top:4px;padding:18px;font-size:24px;font-weight:800;color:var(--primary-ink);background:var(--primary);border-radius:var(--radius-pill);box-shadow:0 8px 20px #ff5da266;transition:transform .1s ease,opacity .15s ease,box-shadow .15s ease}.entry__go:active{transform:scale(.97)}.entry__go:disabled{opacity:.4;box-shadow:none;cursor:not-allowed}.play{height:100dvh;overflow:hidden}.play--scroll{overflow-y:auto;overscroll-behavior:contain}.grid-wrap{flex:1;display:flex;align-items:center;justify-content:center;min-height:0}.play--scroll .grid-wrap{flex:none;align-items:flex-start;padding-block:8px}.grid{display:grid;grid-template-columns:repeat(2,var(--tile, 120px));gap:var(--gap, 16px);justify-content:center}.tile{width:var(--tile, 120px);height:var(--tile, 120px);display:grid;place-items:center;background:var(--tile-face);border-radius:var(--radius-tile);box-shadow:var(--shadow-tile);transition:transform .12s ease,background .3s ease}.tile:active{transform:scale(.95)}.tile--center{grid-column:1 / -1;justify-self:center}.tile__glyph{font-size:calc(var(--tile, 120px) * .5);font-weight:800;line-height:1;color:var(--ink);letter-spacing:-.02em}.tile.double .tile__glyph{font-size:calc(var(--tile, 120px) * .34)}.tile--found{background:var(--tile-found);cursor:default}.tile--found .tile__glyph{color:var(--primary)}@media(prefers-reduced-motion:no-preference){.tile--found{animation:tile-pop .26s cubic-bezier(.34,1.56,.64,1)}}@keyframes tile-pop{0%{transform:scale(1)}40%{transform:scale(1.22) rotate(-4deg)}70%{transform:scale(.94) rotate(2deg)}to{transform:scale(1) rotate(0)}}.win__center{flex:1;display:flex;align-items:center;justify-content:center}.win__card{width:min(440px,100%);padding:36px 28px 28px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.win__burst{font-size:72px;line-height:1}.win__label{font-size:18px;font-weight:600;opacity:.7}.win__word{font-size:clamp(36px,12vw,60px);font-weight:800;color:var(--primary);letter-spacing:-.01em;word-break:break-word}.win__again{margin-top:12px;padding:18px 32px;font-size:24px;font-weight:800;color:var(--primary-ink);background:var(--secondary);border-radius:var(--radius-pill);box-shadow:0 8px 20px #3dc6c366;transition:transform .1s ease}.win__again:active{transform:scale(.97)}@media(prefers-reduced-motion:no-preference){.win__burst{animation:win-bounce 1.4s ease-in-out infinite}.win__card{animation:win-pop-in .4s cubic-bezier(.34,1.56,.64,1)}}@keyframes win-bounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.08)}}@keyframes win-pop-in{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}