:root{--bg:#101521;--surface:#1c2535;--text:#f2f5fb;--muted:#aab8ca;--accent:#77e3c1;--grid:#263244;--radius:16px;--font:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font)}.layout{width:min(100% - 32px,460px);margin:32px auto}header{margin-bottom:22px}.eyebrow,.label,footer{font-size:.7rem;letter-spacing:.16em;font-weight:700;color:var(--muted)}h1{font-size:2.5rem;letter-spacing:-.05em;margin:.15em 0}h1 span{color:var(--accent)}header p{color:var(--muted);margin:0}.cabinet{background:var(--surface);border-radius:var(--radius);padding:18px}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.top strong{display:block;font-size:1.5rem;font-variant-numeric:tabular-nums}.status{color:var(--accent);font-size:.85rem}.board-wrap{position:relative;width:min(100%,300px);margin:auto}.board{display:grid;grid-template-columns:repeat(10,1fr);aspect-ratio:1/2;background:#0d1420;border:1px solid var(--grid)}.cell{border:1px solid var(--grid)}.cell.I{background:#64d8e8}.cell.O{background:#f3d16a}.cell.T{background:#c493ed}.cell.S{background:#8cdb98}.cell.Z{background:#f28c8c}.cell.J{background:#799eea}.cell.L{background:#f2ad70}.overlay{position:absolute;inset:0;display:grid;place-items:center;text-align:center;background:#101521e8}.overlay[hidden]{display:none}.overlay h2{font-size:1.8rem;margin:0}.overlay p{color:var(--muted);font-size:.85rem}button{font:inherit;color:var(--text);background:#34445a;border:1px solid #51637a;border-radius:10px;cursor:pointer;min-height:48px;touch-action:manipulation}button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.primary{background:var(--accent);color:#10231e;border:0;font-weight:800;padding:0 22px}.controls{display:grid;grid-template-columns:repeat(4,1fr) 1.4fr;gap:8px;margin-top:16px}.controls button{font-size:1.3rem;font-weight:700}.controls .drop{font-size:.75rem;letter-spacing:.06em}.hint{text-align:center;color:var(--muted);font-size:.68rem;line-height:1.5;margin:12px 0 0}footer{text-align:center;margin:22px 0}@media(max-width:400px){.layout{margin:18px auto}.cabinet{padding:12px}.controls{gap:5px}}
