:root{color-scheme:dark;--bg:#0d1424;--panel:#151f33;--panel2:#1c2940;--line:#2c3850;--muted:#a5b3c9;--text:#edf2fa;--gold:#ffce72;--blue:#87b9ff;--green:#62e4c0;--danger:#ff9b8a;--t-correct:#1d7a5f;--t-present:#8a6212;--t-absent:#3a4558}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 50% -15%,#1b2a48 0,transparent 42%),var(--bg);color:var(--text);font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
.site-bar{max-width:960px;margin:auto;padding:18px 24px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line);font-size:14px;font-weight:700}
main{max-width:640px;margin:auto;padding:26px 16px 48px}
.intro{text-align:center;margin-bottom:18px}.eyebrow{color:var(--gold);font-size:12px;font-weight:800;letter-spacing:.14em;margin:0}
.intro h1{font:600 clamp(36px,7vw,56px)/1.05 Georgia,serif;margin:8px 0}.edition{color:var(--muted);margin:0}
.game-shell{background:rgba(21,31,51,.94);border:1px solid var(--line);border-radius:18px;padding:clamp(14px,4vw,28px);box-shadow:0 20px 50px #05091466}
.game-topline{display:flex;gap:16px;justify-content:space-between;align-items:flex-start}.game-topline h2{font:600 22px/1.2 Georgia,serif;margin:0 0 6px}.game-topline p{color:var(--muted);margin:0;font-size:14px}
.score{display:flex;align-items:baseline;gap:6px;white-space:nowrap;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:8px 14px}.score strong{font-size:22px;color:var(--green)}.score span{color:var(--muted);font-size:13px}
.board{display:grid;grid-template-rows:repeat(6,1fr);gap:6px;width:min(330px,100%);margin:20px auto 8px}
.row{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.tile{aspect-ratio:1;display:grid;place-items:center;border:2px solid var(--line);border-radius:8px;font:800 clamp(22px,7vw,32px)/1 system-ui;text-transform:uppercase;background:#111a2c;color:var(--text)}
.tile.filled{border-color:#5d7398}
.tile.correct{background:var(--t-correct);border-color:var(--t-correct);color:#fff}
.tile.present{background:var(--t-present);border-color:var(--t-present);color:#fff}
.tile.absent{background:var(--t-absent);border-color:var(--t-absent);color:#d9e1ee}
.tile.correct::after,.tile.present::after{content:"";}
.row.shake{animation:shake .35s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.status{min-height:26px;text-align:center;color:var(--gold);font-weight:800;margin:8px 0}
.keyboard{display:flex;flex-direction:column;gap:6px;max-width:520px;margin:10px auto 0}
.krow{display:flex;gap:5px;justify-content:center}
.key{flex:1 1 0;min-width:0;height:52px;padding:0;border:1px solid #40577a;border-radius:8px;background:#263c5e;color:var(--text);font:800 clamp(13px,3.6vw,17px)/1 system-ui;cursor:pointer;touch-action:manipulation}
.key.wide{flex:1.6 1 0;font-size:12px}
.key:hover,.key:focus-visible{background:#34527f;outline:2px solid var(--gold);outline-offset:1px}
.key.correct{background:var(--t-correct);border-color:var(--t-correct)}.key.present{background:var(--t-present);border-color:var(--t-present)}.key.absent{background:#1a2234;border-color:#2a3446;color:#7f8ba0}
.actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:18px}
.actions button{appearance:none;background:#263c5e;color:var(--text);border:1px solid #40577a;border-radius:10px;padding:11px 17px;font:700 14px/1 system-ui;cursor:pointer}
.actions button:hover{background:#34527f}.actions button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.actions button.quiet{background:transparent;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0 0;text-align:center}
.stats div{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:8px 4px}
.stats dt{color:var(--muted);font-size:12px}.stats dd{margin:0;font-size:20px;font-weight:800}
.how{margin-top:24px;color:var(--muted)}.how h2{font:600 20px/1.2 Georgia,serif;color:var(--text);margin:0 0 6px}
.chip{display:inline-block;border-radius:5px;padding:0 6px;color:#fff;font-weight:700}.chip.c{background:var(--t-correct)}.chip.p{background:var(--t-present)}.chip.a{background:var(--t-absent)}
footer{max-width:960px;margin:auto;padding:22px 24px 34px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;text-align:center}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(max-width:480px){.game-topline{display:block}.score{width:max-content;margin-top:10px}.key{height:48px}.krow{gap:4px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}