:root{--page-bg:#1a1a2e;--panel-bg:#16213e;--surface:#0f3460;--accent:#e94560;--text:#e0e0e0;--muted:#9aa3b8;--ok:#2ecc71;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{background:var(--page-bg);color:var(--text);font-family:var(--font);margin:0;padding:0}body{justify-content:center;align-items:flex-start;min-height:100vh;padding:16px 12px 36px;display:flex}main.rubik{background:var(--panel-bg);border:1px solid var(--surface);border-radius:14px;width:100%;max-width:1000px;padding:16px 16px 12px}h1{text-align:center;margin:4px 0 2px;font-size:1.1rem;font-weight:700}.sub{text-align:center;color:var(--muted);margin:0 0 14px;font-size:.76rem;line-height:1.5}.layout{flex-wrap:wrap;align-items:flex-start;gap:18px;display:flex}.stage{flex:2 460px;min-width:260px}.side{flex-direction:column;flex:300px;gap:12px;min-width:250px;display:flex}@media (min-width:900px){.side{flex-basis:330px}}.canvas-wrap{aspect-ratio:1;border:1px solid var(--surface);background:radial-gradient(circle at 50% 32%,#223055 0%,#121a2e 72%);border-radius:12px;width:100%;max-width:560px;margin:0 auto;position:relative;overflow:hidden}#cube-canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}#cube-canvas.dragging{cursor:grabbing}.faces button{min-height:34px}@media (max-width:780px){.faces button{min-height:40px;font-size:.82rem}.faces{gap:6px}.controls button,.actions button{min-height:42px}}.badge{letter-spacing:.3px;color:var(--muted);border:1px solid var(--surface);background:#0f3460d9;border-radius:999px;padding:3px 10px;font-size:.7rem;font-weight:600;position:absolute;top:9px;left:9px}.badge.solved{color:var(--ok);border-color:var(--ok);background:#2ecc7129}#gl-error{text-align:center;color:var(--accent);justify-content:center;align-items:center;padding:18px;font-size:.82rem;line-height:1.6;display:none;position:absolute;inset:0}.controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}button{font-family:var(--font);border:1px solid var(--surface);background:var(--surface);color:var(--text);cursor:pointer;border-radius:9px;padding:9px 13px;font-size:.8rem}button:hover:not(:disabled){border-color:var(--accent)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button,.badge,.faces h3{-webkit-user-select:none;user-select:none}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.ghost{background:0 0}label.speed{color:var(--muted);align-items:center;gap:6px;font-size:.76rem;display:flex}input[type=range]{width:120px;accent-color:var(--accent)}.solver-chip{border:1px solid var(--surface);color:var(--muted);background:#0f346066;border-radius:999px;padding:3px 9px;font-size:.7rem}.solver-chip.ready{color:var(--ok);border-color:var(--ok);background:#2ecc711f}.solver-chip.failed{color:var(--accent);border-color:var(--accent);background:#e945601f}.speed-row{color:var(--muted);align-items:center;gap:8px;font-size:.76rem;display:flex}.speed-value{font-variant-numeric:tabular-nums;min-width:62px}.status{min-height:38px;color:var(--muted);background:#0f346080;border-radius:9px;padding:9px 11px;font-size:.76rem;line-height:1.55}.status b{color:var(--text)}.status .err{color:var(--accent)}.faces{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;display:grid}.faces.slices{margin-top:4px}.faces .face-group.slice h3{color:var(--muted)}.faces .face-group.slice button{border-style:dashed}.face-group{flex-direction:column;gap:4px;min-width:0;display:flex}.face-group h3{text-align:center;color:var(--muted);letter-spacing:.5px;margin:0;font-size:.66rem;font-weight:600}.face-group button{width:100%;padding:6px 0;font-size:.7rem}.moves{border-top:1px solid var(--surface);padding-top:9px}.moves h2{color:var(--muted);justify-content:space-between;gap:8px;margin:0 0 6px;font-size:.76rem;font-weight:600;display:flex}#move-list{font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:4px;max-height:92px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}#move-list li{border:1px solid var(--surface);background:#0f3460a6;border-radius:6px;padding:2px 7px;font-size:.72rem}#move-list li.future{opacity:.45}#move-list li.now{border-color:var(--accent);color:#fff}.hint{color:#6f7789;text-align:center;margin:12px 0 0;font-size:.7rem;line-height:1.6}.hint kbd{font-family:var(--font);border:1px solid var(--surface);color:var(--text);background:#0f346099;border-radius:5px;padding:1px 5px;font-size:.68rem}@media (max-width:780px){main.rubik{padding:12px 11px 10px}.faces{grid-template-columns:repeat(3,minmax(0,1fr))}h1{font-size:1rem}}