:root{--bg: #101E1C;--panel: #182B28;--border: #2E4A45;--text: #EDE4CE;--muted: #8FA69F;--hit: #3F7D5A;--near: #C08A2E;--miss: #2A3F3B;--accent: #E2582A;--silly: #E8508D;--font-brand: "Alfa Slab One", Georgia, "Times New Roman", serif;--font-ui: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--radius: 10px;--gap: 6px;--maxw: 520px}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font-ui);-webkit-text-size-adjust:100%;overscroll-behavior:none}body{-webkit-tap-highlight-color:transparent}#root{min-height:100%;min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit;color:inherit;border:none;background:none;cursor:pointer}.app{flex:1;display:flex;flex-direction:column;width:100%;max-width:var(--maxw);margin:0 auto;padding:0 12px env(safe-area-inset-bottom)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 2px 10px;border-bottom:1px solid var(--border)}.wordmark{font-family:var(--font-brand);font-size:1.75rem;line-height:1;letter-spacing:.01em;-webkit-user-select:none;user-select:none}.wordmark .wor{color:var(--text)}.wordmark .dubb{color:var(--accent)}.wordmark.sm{font-size:1.25rem}.wordmark.lg{font-size:2.75rem}.topbar-right{display:flex;align-items:center;gap:8px}.who{font-size:.8rem;color:var(--muted);max-width:9ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconbtn{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:var(--radius);padding:7px 11px;font-size:.8rem;font-weight:500;white-space:nowrap}.iconbtn:active{transform:scale(.97)}.iconbtn.on{border-color:var(--accent);color:var(--accent)}.silly-banner{margin:10px 0 2px;padding:8px 12px;border-radius:var(--radius);background:color-mix(in srgb,var(--silly) 16%,var(--panel));border:1px solid color-mix(in srgb,var(--silly) 55%,var(--border));color:var(--silly);font-weight:700;font-size:.78rem;letter-spacing:.14em;text-align:center;text-transform:uppercase}.board-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 0;min-height:0}.board{display:grid;grid-template-rows:repeat(6,1fr);gap:var(--gap);width:min(100%,330px)}.row{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gap)}.tile{aspect-ratio:1;display:grid;place-items:center;font-size:clamp(1.4rem,8vw,2rem);font-weight:700;text-transform:uppercase;border:2px solid var(--border);border-radius:8px;background:transparent;color:var(--text);-webkit-user-select:none;user-select:none}.tile.filled{border-color:var(--muted);animation:pop .11s ease-out}.tile.h{background:var(--hit);border-color:var(--hit)}.tile.n{background:var(--near);border-color:var(--near)}.tile.m{background:var(--miss);border-color:var(--miss);color:var(--muted)}.tile.h,.tile.n{color:#fff}.tile.revealed{animation:flip .42s ease forwards}.tile.revealed:nth-child(1){animation-delay:0ms}.tile.revealed:nth-child(2){animation-delay:90ms}.tile.revealed:nth-child(3){animation-delay:.18s}.tile.revealed:nth-child(4){animation-delay:.27s}.tile.revealed:nth-child(5){animation-delay:.36s}.row.bad{animation:shake .38s ease}.row.win .tile{animation:bounce .52s ease}.row.win .tile:nth-child(2){animation-delay:70ms}.row.win .tile:nth-child(3){animation-delay:.14s}.row.win .tile:nth-child(4){animation-delay:.21s}.row.win .tile:nth-child(5){animation-delay:.28s}@keyframes pop{0%{transform:scale(.9)}to{transform:scale(1)}}@keyframes flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(7px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-14px)}70%{transform:translateY(3px)}}@media (prefers-reduced-motion: reduce){.tile,.row,.tile.revealed,.row.win .tile{animation:none!important}}.keyboard{display:flex;flex-direction:column;gap:7px;padding:8px 0 14px}.kbrow{display:flex;gap:5px;justify-content:center}.kbrow .spacer{flex:.5}.key{flex:1;min-width:0;height:52px;border-radius:7px;background:var(--panel);border:1px solid var(--border);color:var(--text);font-size:.95rem;font-weight:600;text-transform:uppercase;display:grid;place-items:center;transition:background .12s ease,color .12s ease}.key.wide{flex:1.6;font-size:.72rem;letter-spacing:.04em}.key:active{transform:translateY(1px)}.key.h{background:var(--hit);border-color:var(--hit);color:#fff}.key.n{background:var(--near);border-color:var(--near);color:#fff}.key.m{background:var(--miss);border-color:var(--miss);color:var(--muted)}.key[disabled]{opacity:.45}.toast{position:fixed;left:50%;top:78px;transform:translate(-50%);z-index:40;background:var(--text);color:var(--bg);font-weight:700;font-size:.85rem;padding:9px 16px;border-radius:999px;box-shadow:0 8px 24px #00000073;animation:toastin .16s ease;pointer-events:none}@keyframes toastin{0%{opacity:0;transform:translate(-50%,-6px)}}.endcard{margin:4px 0 10px;padding:14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);text-align:center}.endcard .verdict{font-size:1.05rem;font-weight:700;margin-bottom:6px}.endcard .answer{font-family:var(--font-brand);font-size:1.9rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin:2px 0 8px}.endcard.silly .answer{color:var(--silly)}.endcard .pts{color:var(--muted);font-size:.85rem}.endcard .pts b{font-family:var(--font-mono);color:var(--text);font-size:1rem}.login{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px 4px 40px;text-align:center}.login p{color:var(--muted);margin:0;font-size:.9rem;max-width:30ch}.login form{display:flex;flex-direction:column;gap:10px;width:min(100%,320px)}.field{width:100%;padding:13px 14px;font-family:inherit;font-size:1rem;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:var(--radius)}.field::placeholder{color:var(--muted)}.field:focus{outline:none;border-color:var(--accent)}.primary{padding:13px 14px;border-radius:var(--radius);background:var(--accent);color:#fff;font-size:1rem;font-weight:700}.primary:disabled{opacity:.55}.err{color:var(--silly);font-size:.85rem;min-height:1.2em;margin:0}.choices{display:flex;flex-direction:column;gap:9px;width:min(100%,320px)}.choices .wide-btn{padding:12px 14px;font-size:.9rem}.linkbtn{color:var(--muted);text-decoration:underline;font-size:.82rem;padding:4px}.linkbtn.accent{color:var(--accent);font-size:inherit}.sb{padding:12px 0 28px}.tabs{display:flex;gap:5px;padding:4px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:14px}.tabs button{flex:1;padding:8px 4px;border-radius:7px;font-size:.82rem;font-weight:600;color:var(--muted)}.tabs button.on{background:var(--accent);color:#fff}.panel{border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);overflow:hidden;margin-bottom:16px}.panel h2{margin:0;padding:11px 13px;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:600;border-bottom:1px solid var(--border)}.rank-head,.rank-row{display:grid;grid-template-columns:1.6rem 1fr 2.6rem 3.1rem 2.6rem 2.2rem;gap:5px;align-items:center;padding:9px 13px;font-size:.83rem}.rank-head{font-size:.64rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border)}.rank-row{border-bottom:1px solid color-mix(in srgb,var(--border) 55%,transparent);width:100%;text-align:left}.rank-row:last-of-type{border-bottom:none}.rank-row.me{background:color-mix(in srgb,var(--accent) 9%,transparent)}.rank-row .r{font-family:var(--font-mono);color:var(--muted)}.rank-row .nm{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank-row .num{font-family:var(--font-mono);text-align:right}.rank-row .pts{color:var(--accent);font-weight:700}.streak{color:var(--muted);font-size:.72rem;white-space:nowrap}.streak.hot{color:var(--accent)}.detail{padding:4px 13px 14px;border-bottom:1px solid var(--border)}.detail .lbl{font-size:.64rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}.strip{display:flex;gap:3px;flex-wrap:wrap}.sq{width:17px;height:17px;border-radius:4px;border:1px solid var(--border);background:transparent;display:grid;place-items:center;font-family:var(--font-mono);font-size:.55rem;color:#fff}.sq.solved{background:var(--hit);border-color:var(--hit)}.sq.missed{background:var(--miss);border-color:var(--miss);color:var(--muted)}.sq.silly.solved{background:var(--silly);border-color:var(--silly)}.empty{padding:16px 13px;color:var(--muted);font-size:.85rem}.today-row{display:flex;align-items:center;gap:11px;padding:11px 13px;border-bottom:1px solid color-mix(in srgb,var(--border) 55%,transparent)}.today-row:last-child{border-bottom:none}.today-row .who2{flex:1;min-width:0}.today-row .who2 .n{font-weight:600;font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.today-row .who2 .s{font-size:.72rem;color:var(--muted)}.today-row .who2 .s b{font-family:var(--font-mono);color:var(--accent)}.mini{display:grid;gap:2px}.mini .mrow{display:grid;grid-template-columns:repeat(5,7px);gap:2px}.mini i{width:7px;height:7px;border-radius:2px;background:var(--miss)}.mini i.h{background:var(--hit)}.mini i.n{background:var(--near)}.locked{padding:18px 13px;color:var(--muted);font-size:.85rem;text-align:center;line-height:1.5}.locked b{color:var(--text)}.foot{text-align:center;color:var(--muted);font-size:.7rem;padding:6px 0 18px}.foot button{color:var(--muted);text-decoration:underline;font-size:inherit}