:root{color:#17292e;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--page:#f5f1e8;--surface:#fffaf0;--surface-strong:#fff;--ink:#17292e;--muted:#667174;--line:#d7cec0;--accent:#27474f;--accent-ink:#fff;--correct:#2f6f5e;--present:#bd7b2f;--absent:#6d7477;--shadow:#27474f1f;background:#f5f1e8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body[data-theme=bright]{--page:#eef7f3;--surface:#fff;--surface-strong:#fefefe;--ink:#14282f;--muted:#607078;--line:#c9d9dc;--accent:#155e75;--accent-ink:#fff;--correct:#12805c;--present:#c45f2d;--absent:#677985;--shadow:#155e7524}body[data-theme=contrast]{--page:#101315;--surface:#181d20;--surface-strong:#22282c;--ink:#f5f7f7;--muted:#bec8ca;--line:#4f5a60;--accent:#f4d35e;--accent-ink:#111315;--correct:#28a36f;--present:#f4a742;--absent:#707b82;--shadow:#00000047}*{box-sizing:border-box}html{background:var(--page);min-height:100%}body{background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 260px), var(--page);min-height:100svh;color:var(--ink);margin:0}button,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:default}#app{min-height:100svh}.shell{width:min(100%,460px);min-height:100svh;padding:max(12px, env(safe-area-inset-top)) 14px max(12px, env(safe-area-inset-bottom));grid-template-rows:auto auto auto auto auto auto;gap:8px;margin:0 auto;display:grid}.topbar{justify-content:space-between;align-items:center;gap:14px;display:flex}.eyebrow{color:var(--muted);letter-spacing:0;text-transform:uppercase;margin:0 0 2px;font-size:.75rem;font-weight:800}h1{color:var(--ink);letter-spacing:0;margin:0;font-size:1.82rem;line-height:1}.brand-logo{vertical-align:-.03em;margin-right:.1em;font-size:.9em;display:inline-block}.icon-button,.secondary-button,.modebar button,.themebar button,.debug-actions button{border:1px solid var(--line);background:var(--surface);min-height:40px;color:var(--ink);box-shadow:0 6px 18px var(--shadow);border-radius:8px;font-weight:850}.icon-button{min-width:66px;padding:0 12px}.link-button{place-items:center;display:grid}.home-shell{grid-template-rows:auto 1fr;align-content:start}.game-home{align-content:start;gap:12px;padding-top:12px;display:grid}.game-card{border:1px solid var(--line);background:var(--surface);min-height:142px;box-shadow:0 10px 24px var(--shadow);border-radius:8px;align-content:center;gap:8px;padding:18px;display:grid}.game-card span{color:var(--accent);text-transform:uppercase;font-size:.78rem;font-weight:900}.game-card strong{font-size:1.35rem;line-height:1.1}.game-card small{color:var(--muted);font-size:.95rem;font-weight:750}.modebar,.themebar{grid-template-columns:1fr 1fr auto;gap:7px;display:grid}.themebar{grid-template-columns:repeat(3,1fr)}.modebar button,.themebar button{box-shadow:none;padding:0 10px}.modebar .is-active,.themebar .is-active{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}.new-practice{width:62px}.grid{justify-self:center;gap:5px;width:min(100%,330px);padding:3px 0;display:grid}.grid-row{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;display:grid}.tile{aspect-ratio:1;border:2px solid var(--line);background:color-mix(in srgb, var(--surface) 78%, transparent);min-height:0;color:var(--ink);text-transform:uppercase;border-radius:7px;place-items:center;font-size:1.65rem;font-weight:950;line-height:1;display:grid}.tile.has-letter{border-color:color-mix(in srgb, var(--accent) 42%, var(--line));background:var(--surface-strong)}.tile.correct,.tile.present,.tile.absent{color:#fff;border-color:#0000}.tile.correct{background:var(--correct)}.tile.present{background:var(--present)}.tile.absent{background:var(--absent)}.message{min-height:23px;color:var(--accent);text-align:center;margin:0;font-size:.94rem;font-weight:850}body[data-theme=contrast] .message{color:var(--accent)}.keyboard{gap:5px;display:grid}.key-row{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:4px;display:grid}.key{background:var(--surface-strong);min-width:0;min-height:42px;color:var(--ink);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 12%, transparent), 0 5px 12px var(--shadow);touch-action:manipulation;border:0;border-radius:7px;font-size:.88rem;font-weight:950}.key.is-wide{min-width:46px;padding:0 6px;font-size:.68rem}.key:active:not(:disabled){transform:translateY(1px)}.key.correct,.key.present,.key.absent{color:#fff}.key.correct{background:var(--correct)}.key.present{background:var(--present)}.key.absent{background:var(--absent)}.key:disabled{opacity:.96}.stats-panel,.debug-panel{border:1px solid var(--line);background:color-mix(in srgb, var(--surface) 88%, transparent);border-radius:8px;gap:12px;padding:12px;display:grid}.result-line,.debug-heading{justify-content:space-between;align-items:center;gap:10px;display:flex}.result-line strong,.debug-heading strong{font-size:1rem}.result-line span,.debug-heading span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:800}.stat-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.stat-grid span{background:var(--surface-strong);border-radius:8px;place-items:center;min-height:60px;display:grid}.stat-grid strong{font-size:1.2rem}.stat-grid small{color:var(--muted);text-transform:uppercase;font-size:.68rem;font-weight:800}.distribution{gap:5px;display:grid}.dist-row{grid-template-columns:18px 1fr;align-items:center;gap:8px;font-size:.78rem;font-weight:850;display:grid}.dist-row div{background:color-mix(in srgb, var(--line) 48%, transparent);border-radius:6px;height:22px;overflow:hidden}.dist-row i{background:var(--accent);min-width:24px;height:100%;color:var(--accent-ink);place-items:center end;padding-right:7px;font-style:normal;display:grid}.secondary-button{width:100%}.compact-button{width:auto;min-height:34px;box-shadow:none;padding:0 12px}.den-shell{grid-template-rows:auto auto auto auto auto auto auto auto}.den-score{border:1px solid var(--line);background:color-mix(in srgb, var(--surface) 88%, transparent);border-radius:8px;gap:6px;padding:10px;display:grid}.den-score div:first-child{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.den-score strong{font-size:1.15rem}.den-score span,.den-score p{color:var(--muted);font-size:.8rem;font-weight:850}.den-score p{margin:0}.den-score p.is-found{color:var(--correct)}.den-progress{background:color-mix(in srgb, var(--line) 58%, transparent);border-radius:999px;height:9px;overflow:hidden}.den-progress i{border-radius:inherit;background:var(--accent);height:100%;display:block}.den-current{place-items:center;gap:3px;min-height:58px;display:grid}.den-current span{min-height:29px;color:var(--ink);letter-spacing:0;font-size:1.45rem;font-weight:950;line-height:1}.den-current small{min-height:18px;color:var(--accent);font-size:.88rem;font-weight:850}.den-hive{--den-cell:min(19vw, 74px);width:min(100%, calc(var(--den-cell) * 3.25));height:calc(var(--den-cell) * 3.18);justify-self:center;position:relative}.den-cell{width:var(--den-cell);height:calc(var(--den-cell) * .88);background:var(--surface-strong);color:var(--ink);clip-path:polygon(25% 4%,75% 4%,100% 50%,75% 96%,25% 96%,0 50%);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 14%, transparent), 0 8px 14px var(--shadow);transform:translate(-50%, -50%) translate(var(--x), var(--y));touch-action:manipulation;border:0;place-items:center;font-size:1.28rem;font-weight:950;display:grid;position:absolute;top:50%;left:50%}.den-cell.is-center{background:var(--accent);color:var(--accent-ink)}.den-cell:active{filter:brightness(.96)}.cell-0{--x:0px;--y:calc(var(--den-cell) * -1.06)}.cell-1{--x:calc(var(--den-cell) * -.9);--y:calc(var(--den-cell) * -.53)}.cell-2{--x:calc(var(--den-cell) * .9);--y:calc(var(--den-cell) * -.53)}.cell-3{--x:0px;--y:0px}.cell-4{--x:calc(var(--den-cell) * -.9);--y:calc(var(--den-cell) * .53)}.cell-5{--x:calc(var(--den-cell) * .9);--y:calc(var(--den-cell) * .53)}.cell-6{--x:0px;--y:calc(var(--den-cell) * 1.06)}.den-actions{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.den-actions button{border:1px solid var(--line);background:var(--surface);min-height:42px;color:var(--ink);box-shadow:0 6px 14px var(--shadow);border-radius:8px;font-weight:900}.den-found{border:1px solid var(--line);background:color-mix(in srgb, var(--surface) 88%, transparent);border-radius:8px;gap:8px;padding:10px;display:grid}.found-list{flex-wrap:wrap;gap:6px;min-height:44px;max-height:92px;display:flex;overflow:auto}.found-list span,.found-list em{background:var(--surface-strong);color:var(--ink);border-radius:6px;padding:5px 7px;font-size:.76rem;font-style:normal;font-weight:850}.found-list em{color:var(--muted)}.debug-answer-list{max-height:120px;color:var(--muted);margin:0;font-size:.78rem;line-height:1.45;overflow:auto}.den-debug-actions{grid-template-columns:repeat(3,1fr)}.debug-inputs{grid-template-columns:1fr 1.35fr;gap:8px;display:grid}.debug-inputs label{color:var(--muted);text-transform:uppercase;gap:5px;font-size:.72rem;font-weight:850;display:grid}.debug-inputs input{border:1px solid var(--line);background:var(--surface-strong);min-width:0;min-height:40px;color:var(--ink);border-radius:8px;padding:0 10px;font-weight:850}.debug-actions{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}.debug-actions button{min-width:0;box-shadow:none;padding:0 4px;font-size:.76rem}@media (width>=700px){.shell{padding-top:32px;padding-bottom:32px}}@media (width<=360px){.shell{gap:9px;padding-left:9px;padding-right:9px}h1{font-size:1.72rem}.tile{border-radius:7px;font-size:1.55rem}.key{border-radius:7px;min-height:43px;font-size:.84rem}.key.is-wide{font-size:.66rem}.debug-actions{grid-template-columns:repeat(3,1fr)}}@media (height<=700px){.shell{padding-top:max(8px, env(safe-area-inset-top));padding-bottom:max(8px, env(safe-area-inset-bottom));gap:6px}.eyebrow{font-size:.68rem}h1{font-size:1.55rem}.icon-button,.secondary-button,.modebar button,.themebar button,.debug-actions button{min-height:34px}.grid{gap:4px;width:min(100%,282px);padding:1px 0}.grid-row{gap:4px}.tile{border-radius:6px;font-size:1.35rem}.message{min-height:20px;font-size:.86rem}.keyboard,.key-row{gap:4px}.key{min-height:40px;font-size:.82rem}.key.is-wide{min-width:44px;font-size:.62rem}.den-score{gap:4px;padding:8px}.den-current{min-height:45px}.den-current span{min-height:24px;font-size:1.24rem}.den-hive{--den-cell:min(17vw, 62px)}.den-actions button{min-height:36px}.found-list{max-height:68px}}
