:root{--ink:#153047;--muted:#6d7d8b;--paper:#f8f5ed;--card:#fffdf8;--line:#d6ded8;--exact:#287d73;--present:#d59c34;--absent:#a9b2b4;--coral:#e6745f}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 13% 10%,#e9efdc 0,transparent 27rem),radial-gradient(circle at 89% 86%,#f6e1c6 0,transparent 29rem),var(--paper);font-family:"DM Sans",sans-serif}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.24;background-image:linear-gradient(90deg,transparent 49%,#c4c8bd 50%,transparent 51%);background-size:72px 72px;mask-image:linear-gradient(#0001,#0000 75%)}button,input,select{font:inherit}button{cursor:pointer}.game-shell{position:relative;max-width:840px;margin:auto;padding:26px 28px 30px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid #cad4cc;padding-bottom:19px}.brand{display:flex;gap:10px;align-items:center}.brand-mark{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:var(--ink);color:#fff;font-weight:800;font-size:23px;transform:rotate(-7deg);box-shadow:3px 3px 0 #d9ad5b}.eyebrow,.modal-kicker{display:block;color:#a05b45;font:500 10px "DM Mono",monospace;letter-spacing:1.4px}.brand h1{font-size:19px;margin:1px 0 0;letter-spacing:-.7px}.header-actions{display:flex;align-items:center;gap:9px}.icon-button{width:35px;height:35px;border-radius:50%;border:1px solid #bac9c2;background:transparent;color:var(--ink);font-weight:800}.new-button{border:0;border-radius:10px;padding:9px 13px;background:#e7ede5;color:var(--ink);font-size:12px;font-weight:700}.match-strip{margin:22px 0 0;display:grid;grid-template-columns:135px 1fr 88px;align-items:center;gap:13px}.turn-card,.score-card{background:#e8eee9;border-radius:11px;padding:9px 11px}.turn-card span,.score-card span{display:block;color:#73847f;font:10px "DM Mono",monospace;letter-spacing:.7px}.turn-card strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px}.turn-card small{font-size:10px;color:#7f8c91}.score-card{text-align:center;background:var(--ink);color:#fff}.score-card span{color:#b8d0c8}.score-card strong{font-size:20px}.stage-track{display:flex;gap:5px;justify-content:center}.stage{width:29px;height:29px;display:grid;place-items:center;border:1px solid #c5d0c8;border-radius:50%;color:#8b989a;font:12px "DM Mono",monospace;background:#fffaf1}.stage.active{background:var(--exact);color:#fff;border-color:var(--exact);box-shadow:0 0 0 4px #dcebe4}.stage.done{background:#d7a13f;color:#fff;border-color:#d7a13f}.hero{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:28px 0 22px}.status-line{margin:0 0 7px;color:var(--coral);font:500 11px "DM Mono",monospace;letter-spacing:.55px}.hero h2{margin:0;font-size:clamp(28px,5vw,43px);line-height:1;letter-spacing:-2px}.hero h2 em{font-style:normal;color:var(--exact)}.subtitle{color:var(--muted);font-size:14px;margin:11px 0 0}.progress-card{flex:none;background:var(--ink);color:#fff;padding:12px 18px;border-radius:4px 16px 4px 16px;text-align:center;box-shadow:4px 4px 0 #d9ad5b}.progress-card span{display:block;font:10px "DM Mono",monospace;letter-spacing:1px;color:#b8d0c8}.progress-card strong{font-size:25px;line-height:1.12}.board-wrap{display:flex;justify-content:center}.board{display:grid;gap:7px}.tile{width:57px;height:57px;border:2px solid #c7d0ca;border-radius:8px;background:var(--card);display:grid;place-items:center;font:500 28px "DM Mono",monospace;color:var(--ink);transition:transform .16s,border-color .16s,background .16s,color .16s}.tile.filled{border-color:#68817b;transform:scale(1.03)}.tile.pop{animation:pop .14s ease}.tile.reveal{animation:flip .55s ease forwards}.tile.exact,.tile.present,.tile.absent{color:#fff;border-color:transparent}.tile.exact{background:var(--exact)}.tile.present{background:var(--present)}.tile.absent{background:var(--absent)}@keyframes pop{50%{transform:scale(1.13)}}@keyframes flip{50%{transform:rotateX(90deg)}}.message{height:22px;text-align:center;margin:14px 0 9px;color:#b54e42;font-weight:700;font-size:13px}.keyboard-wrap{max-width:610px;margin:auto}.keyboard{display:flex;flex-direction:column;gap:7px}.key-row{display:flex;justify-content:center;gap:5px}.key{height:43px;min-width:35px;padding:0 8px;border:0;border-radius:7px;background:#dce4dd;color:var(--ink);font:500 15px "DM Mono",monospace;box-shadow:inset 0 -2px #c3cec4}.key.wide{font:700 11px "DM Sans",sans-serif;min-width:67px}.key.exact,.key.present,.key.absent{color:#fff;box-shadow:none}.key.exact{background:var(--exact)}.key.present{background:var(--present)}.key.absent{background:var(--absent)}.legend{display:flex;justify-content:center;gap:17px;margin-top:18px;color:var(--muted);font-size:11px}.legend span{display:flex;align-items:center;gap:6px}.legend-swatch{width:11px;height:11px;border-radius:3px}.legend-swatch.exact{background:var(--exact)}.legend-swatch.present{background:var(--present)}.legend-swatch.absent{background:var(--absent)}.records{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px auto 0;max-width:560px}.records div{background:#fffaf1;border:1px solid #dce4dd;border-radius:9px;padding:9px;text-align:center}.records span{display:block;font:9px "DM Mono",monospace;color:#7d8d8c;letter-spacing:.5px}.records strong{font-size:12px}.modal{max-width:465px;width:calc(100% - 32px);border:0;border-radius:20px;padding:29px;background:var(--card);color:var(--ink);box-shadow:0 18px 60px #1d302b55}.modal::backdrop{background:#183039a6;backdrop-filter:blur(3px)}.modal h2{font-size:29px;letter-spacing:-1.4px;margin:6px 0 15px}.modal ol{padding-left:21px;color:#586c76;line-height:1.55;font-size:14px}.close-dialog{position:absolute;right:15px;top:11px;border:0;background:none;font-size:27px;color:#59706e}.examples{display:grid;gap:7px;margin:18px 0}.examples>div{display:flex;align-items:center;gap:3px}.examples p{margin:0 0 0 8px;color:#617178;font-size:12px}.mini{width:25px;height:25px;display:grid;place-items:center;background:#e3e9e4;border-radius:3px;font:12px "DM Mono",monospace}.mini.exact{background:var(--exact);color:#fff}.mini.present{background:var(--present);color:#fff}.modal-start{width:100%;border:0;border-radius:10px;background:var(--ink);color:#fff;padding:13px;font-weight:700;margin-top:8px}.setup-modal label{display:grid;gap:6px;margin:11px 0;color:#536a72;font-size:12px;font-weight:700}.setup-modal input,.setup-modal select{border:1px solid #ccd8d0;border-radius:8px;padding:10px;background:white;color:var(--ink);font-weight:500}.setup-note{color:#708087;font-size:12px;line-height:1.4}.result-modal{text-align:center}.result-modal p:not(.modal-kicker){color:var(--muted);margin:0 0 18px}.answer-pill{border-radius:9px;padding:12px;background:#e6eee8;font:10px "DM Mono",monospace;letter-spacing:1px;color:#62776e}.answer-pill strong{display:block;color:var(--exact);font:700 22px "DM Sans",sans-serif;letter-spacing:1px;margin-top:3px}@media(max-width:560px){.game-shell{padding:18px 13px 22px}.eyebrow{font-size:8px}.brand h1{font-size:17px}.new-button{padding:8px 9px;font-size:11px}.match-strip{grid-template-columns:105px 1fr 65px;gap:8px}.turn-card,.score-card{padding:7px}.turn-card strong{font-size:13px}.stage{width:25px;height:25px}.hero{padding:25px 4px 21px;align-items:start}.subtitle{max-width:225px;font-size:12px}.progress-card{padding:9px 10px}.progress-card strong{font-size:20px}.tile{width:calc((100vw - 56px) / var(--length));height:calc((100vw - 56px) / var(--length));max-width:50px;max-height:50px;font-size:24px}.key{min-width:27px;height:41px;padding:0 5px;font-size:13px}.key.wide{min-width:54px;font-size:10px}.legend{gap:10px;font-size:10px}.header-actions{gap:5px}.icon-button{width:32px;height:32px}.records{gap:5px}.records span{font-size:8px}.records strong{font-size:11px}}@media(max-width:355px){.key{min-width:24px;padding:0 4px}.key.wide{min-width:48px}.hero h2{font-size:27px}}