:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#24231f;background:#f7f5ef;line-height:1.4}*{box-sizing:border-box}body{margin:0}main{width:min(100% - 24px,560px);margin:auto;min-height:100vh;padding:20px 0 28px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dedbd1;padding-bottom:10px}.eyebrow{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#77736a;margin:0}h1{font-family:Georgia,serif;font-size:2rem;margin:2px 0}.actions{display:flex;gap:6px}.actions button,.share,dialog button{border:1px solid #cbc7bc;border-radius:8px;background:#fffdf8;padding:9px 12px;cursor:pointer;font-weight:700}.actions button{font-size:1.15rem;width:42px;height:42px}.mode{text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:#77736a;margin:2px 0 0}.message{height:24px;text-align:center;font-weight:700;margin:2px 0}.answer-panel{text-align:center;margin:4px auto 18px}.answer-panel p{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:#77736a;margin:0 0 7px}.answer{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;width:min(100%,400px);margin:auto}.answer span{aspect-ratio:1;display:grid;place-items:center;background:#24231f;color:#fff;font-size:clamp(1.7rem,6vw,2.55rem);font-weight:900;border-radius:4px}.board{display:grid;gap:7px;width:min(100%,400px);margin:0 auto 10px}.slot-row{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;border:0;padding:0;background:transparent;cursor:pointer;width:100%}.tile{aspect-ratio:1;display:grid;place-items:center;border:2px solid transparent;border-radius:3px;font-size:clamp(1.7rem,6vw,2.55rem);font-weight:800;color:#fff}.tile.valid{background:#c8ab37}.tile.valid-locked{background:#6f916f}.tile.invalid{background:#d35f5f}.tile.unused{background:#fffdf8;border-color:#d7d3c9;color:#24231f}.tile.editing{background:#fbfaf6;border-color:#827d72;color:#24231f}.slot-row.selected .tile.unused{border:2px dashed #827d72}.slot-row:focus-visible{outline:3px solid #365e87;outline-offset:4px}.score{text-align:center;font-size:1.05rem;font-weight:800;margin:0 0 16px}.keyboard{display:grid;gap:7px}.key-row{display:flex;gap:5px;justify-content:center}.key{min-width:clamp(28px,8.7vw,44px);height:48px;border:0;border-radius:6px;background:#dfddd5;color:#24231f;font-weight:800;font-size:1.1rem;cursor:pointer}.key.wide{min-width:clamp(48px,13vw,66px);font-size:.9rem}.key:focus-visible,button:focus-visible{outline:3px solid #365e87;outline-offset:2px}.share-wrap{text-align:center;margin-top:18px}.share{background:#24231f;color:#fff}.share:disabled{opacity:.4;cursor:not-allowed}dialog{border:0;border-radius:14px;padding:24px;max-width:360px;color:#24231f;background:#fffdf8;box-shadow:0 12px 50px #0003}dialog::backdrop{background:#24231f80}@media(max-width:560px){main{padding-top:6px;padding-bottom:8px}header{padding-bottom:4px}.eyebrow{font-size:.54rem}h1{font-size:1.42rem}.actions{gap:2px}.actions button{width:32px;height:32px;padding:4px;font-size:.9rem}.mode{font-size:.58rem;margin:0}.message{height:16px;font-size:.74rem;margin:0}.answer-panel{margin:0 auto 8px}.answer-panel p{font-size:.62rem;margin-bottom:4px}.answer{width:min(100%,292px);gap:4px}.answer span{font-size:1.25rem}.board{width:min(100%,292px);gap:4px;margin-bottom:6px}.slot-row{gap:4px}.tile{font-size:1.25rem}.score{font-size:.92rem;margin-bottom:8px}.keyboard,.key-row{gap:3px}.key{height:35px;font-size:.88rem}.key.wide{font-size:.68rem}.share-wrap{margin-top:8px}.share{padding:6px 9px;font-size:.76rem}}@media(prefers-reduced-motion:no-preference){.tile{transition:transform .12s ease}.slot-row:hover .tile{transform:translateY(-1px)}}.lock-status{text-align:center;margin:0 auto 14px;color:#365e87;font-size:.86rem;font-weight:800}.slot-row:disabled{cursor:default}.slot-row:disabled:hover .tile{transform:none}#confetti{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:10}.confetti-piece{position:absolute;top:-12px;left:var(--confetti-x);width:9px;height:16px;background:var(--confetti-colour);opacity:0;animation:confetti-fall 2.2s ease-out var(--confetti-delay) forwards;transform:rotate(var(--confetti-rotation))}@keyframes confetti-fall{0%{opacity:1;transform:translateY(0) rotate(0)}to{opacity:0;transform:translateY(105vh) rotate(720deg)}}@media(prefers-reduced-motion:reduce){#confetti{display:none}}
