:root{--bg:#121214;--surface:#1c1c1f;--text:#f4f4f5;--muted:#a1a1aa;--line:#2e2e33;--tile-border:#3a3a40;--tile-filled:#5b5b63;--key:#75757e;--key-text:#f4f4f5;--correct:#1fa37a;--present:#e3b028;--absent:#3a3a3f;--on-color:#fff;--bar:#3a3a3f;--radius:6px;--font:"Helvetica Neue", Arial, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:light){:root{--bg:#fff;--surface:#fff;--text:#18181b;--muted:#6b6b73;--line:#e4e4e7;--tile-border:#d4d4d8;--tile-filled:#87878f;--key:#dcdce1;--key-text:#18181b;--absent:#787c7e;--bar:#787c7e;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;margin:0}#root{max-width:520px;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);-webkit-user-select:none;user-select:none;flex-direction:column;margin:0 auto;display:flex}button{font:inherit;color:inherit;cursor:pointer}.topbar{border-bottom:1px solid var(--line);flex-shrink:0;justify-content:space-between;align-items:center;height:56px;padding:0 8px;display:flex}.logo{letter-spacing:-.5px;margin:0;font-family:Georgia,Times New Roman,serif;font-size:30px;font-weight:800}.icon-btn{background:0 0;border:0;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.icon-btn:active{background:var(--line)}.icon-btn svg,.share-btn svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:26px;height:26px}.icon-btn svg .fill{fill:currentColor}.game{flex:1;place-items:center;min-height:0;display:grid;container-type:size}.board{aspect-ratio:5/6;grid-template-rows:repeat(6,1fr);gap:5px;width:min(340px,100cqw - 32px,83.3333cqh - 20px);display:grid}.row{grid-template-columns:repeat(5,1fr);gap:5px;display:grid}.row.shake{animation:.5s shake}.row.win .tile{animation:bounce .6s ease calc(var(--i) * 90ms) both}.tile{border:2px solid var(--tile-border);border-radius:var(--radius);text-transform:uppercase;place-items:center;font-size:min(2.1rem,8cqw);font-weight:800;line-height:1;display:grid}.tile.filled{border-color:var(--tile-filled);animation:.1s pop}.tile.active{border-color:var(--tile-filled);border-bottom-width:5px}.tile.correct,.tile.present,.tile.absent{color:var(--on-color);border-color:#0000}.tile.correct{background:var(--correct)}.tile.present{background:var(--present)}.tile.absent{background:var(--absent)}.tile.flip{animation:flip .5s ease calc(var(--i) * .25s) both}@keyframes pop{50%{transform:scale(1.1)}}@keyframes flip{0%{border-color:var(--tile-filled);color:var(--text);background:0 0;transform:rotateX(0)}49%{border-color:var(--tile-filled);color:var(--text);background:0 0;transform:rotateX(-90deg)}50%{transform:rotateX(-90deg)}to{transform:rotateX(0)}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(3px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}@keyframes bounce{0%,20%{transform:translateY(0)}40%{transform:translateY(-28px)}50%{transform:translateY(4px)}60%{transform:translateY(-12px)}80%{transform:translateY(2px)}to{transform:translateY(0)}}.keyboard{flex-direction:column;flex-shrink:0;gap:8px;padding:0 6px 8px;display:flex}.krow{justify-content:center;gap:6px;display:flex}.key{border-radius:var(--radius);background:var(--key);max-width:44px;height:58px;color:var(--key-text);text-transform:uppercase;touch-action:manipulation;border:0;flex:1;place-items:center;padding:0;font-size:1.15rem;font-weight:700;transition:background-color .2s;display:grid}.key:active{filter:brightness(1.25)}.key.wide{letter-spacing:.3px;flex:1.5;max-width:66px;font-size:.75rem}.key.correct,.key.present,.key.absent{color:var(--on-color)}.key.correct{background:var(--correct)}.key.present{background:var(--present)}.key.absent{background:var(--absent)}.key svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linejoin:round;stroke-linecap:round;width:24px;height:24px}@media (height<=640px){.key{height:48px}.keyboard{gap:6px}}.toast-stack{top:calc(72px + env(safe-area-inset-top));z-index:20;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;left:50%;transform:translate(-50%)}.toast{background:var(--text);color:var(--bg);white-space:nowrap;border-radius:6px;padding:12px 16px;font-size:.95rem;font-weight:700;transition:opacity .3s}.toast.hide{opacity:0}.sheet{width:min(500px,100vw);max-width:100vw;max-height:100dvh;padding:20px 20px calc(24px + env(safe-area-inset-bottom));background:var(--surface);color:var(--text);border:0;border-radius:16px 16px 0 0;margin:auto auto 0;overflow-y:auto;box-shadow:0 -6px 30px #00000059}.sheet[open]{animation:.25s ease-out slide-up}.sheet::backdrop{background:#0000008c}@keyframes slide-up{0%{opacity:0;transform:translateY(40px)}}@media (height>=760px) and (width>=520px){.sheet{border-radius:16px;margin:auto}}.sheet h2{border-bottom:1px solid var(--line);margin:4px 0 16px;padding-bottom:14px;font-family:Georgia,Times New Roman,serif;font-size:1.9rem}.sheet h3{letter-spacing:1.2px;text-transform:uppercase;margin:22px 0 12px;font-size:.85rem}.sheet p{margin:0 0 12px;line-height:1.45}.close{background:0 0;border:0;border-radius:50%;width:40px;height:40px;font-size:1.2rem;position:absolute;top:12px;right:12px}.close:active{background:var(--line)}.stats-row{text-align:center;border-bottom:1px solid var(--line);grid-template-columns:repeat(5,1fr);gap:4px;padding-bottom:18px;display:grid}.stat b{font-size:1.9rem;font-weight:400;line-height:1.15;display:block}.stat span{color:var(--muted);font-size:.72rem;line-height:1.2;display:block}.dist{flex-direction:column;gap:6px;display:flex}.dist-row{align-items:center;gap:8px;font-size:.95rem;font-weight:700;display:flex}.dist-row>span{text-align:center;width:12px}.dist-bar{background:var(--bar);color:#fff;text-align:right;border-radius:3px;min-width:26px;padding:3px 8px;font-size:.9rem;transition:width .6s}.dist-bar.today{background:var(--correct)}.share-area{border-top:1px solid var(--line);align-items:center;gap:16px;margin-top:22px;padding-top:18px;display:flex}.next{text-align:center;flex:1}.next span{color:var(--muted);text-transform:uppercase;letter-spacing:.8px;font-size:.8rem;display:block}.next b{font-variant-numeric:tabular-nums;font-size:1.8rem;font-weight:400}.share-btn{background:var(--correct);color:#fff;border:0;border-radius:26px;flex:1;justify-content:center;align-items:center;gap:8px;height:52px;font-size:1.05rem;font-weight:700;display:flex}.share-btn:active{filter:brightness(.9)}.share-btn svg{width:22px;height:22px}.share-preview{background:var(--bg);border:1px solid var(--line);font-family:var(--font);white-space:pre-wrap;-webkit-user-select:text;user-select:text;border-radius:10px;margin:16px 0 0;padding:12px 14px;font-size:.95rem;line-height:1.25}.example{margin:6px 0 16px}.example p{margin:6px 0 14px;font-size:.95rem}.mini{gap:4px;display:flex}.mini .t{border:2px solid var(--tile-filled);text-transform:uppercase;border-radius:5px;place-items:center;width:38px;height:38px;font-size:1.2rem;font-weight:800;display:grid}.mini .t.correct,.mini .t.present,.mini .t.absent{color:#fff;border-color:#0000}.mini .t.correct{background:var(--correct)}.mini .t.present{background:var(--present)}.mini .t.absent{background:var(--absent)}.muted{color:var(--muted);font-size:.92rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation-duration:.01ms!important;animation-delay:0s!important}}
