:root{font-family:system-ui,sans-serif;color:#edf4ff;background:#101b2d;color-scheme:dark}*{box-sizing:border-box}body{margin:0}main{padding:20px;max-width:970px;margin:auto}h1{font-size:28px;margin:0 0 8px}p{color:#b9c9df;line-height:1.5}.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}button,select{font:inherit;color:white;background:#22334e;border:1px solid #52637e;border-radius:8px;padding:9px;cursor:pointer}.toolbar label{font-size:14px}button:focus-visible,select:focus-visible{outline:3px solid #82efd6;outline-offset:2px}.play{display:grid;grid-template-columns:minmax(0,1fr) 175px;gap:24px;align-items:start}#grid{display:grid;gap:2px;touch-action:none;user-select:none;background:#26364f;padding:4px;border-radius:12px}.cell{aspect-ratio:1;border:0;border-radius:3px;padding:0;background:#17263d;font-size:clamp(11px,2.4vw,23px);font-weight:700}.cell.found{background:#1c6058;color:#baffdc}.cell.selected{background:#ffdc87;color:#14263f}.cell.hint{background:#b4a1f5;color:#17263d}.cell:focus-visible{outline-offset:-3px}h2{font-size:17px;margin:0 0 12px}ul{padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}li{border:1px solid #435976;padding:6px 8px;border-radius:6px;font-size:13px}li.done{text-decoration:line-through;color:#96dbbc;border-color:#317360}.help{font-size:13px}#status{color:#ffe394;min-height:28px}@media(max-width:620px){main{padding:12px}.play{grid-template-columns:1fr;gap:16px}.cell{font-size:clamp(11px,3.4vw,22px)}.toolbar label{display:flex;align-items:center;gap:5px}.help{margin-bottom:0}}