:root{--bg-0:#0b0d20;--bg-1:#12153a;--card:#ffffff0f;--card-border:#ffffff1f;--ink:#f4f2ff;--muted:#a6a9d6;--accent1:#7c5cff;--accent2:#ff5cae;--accent3:#3ddcf7;--radius:22px}*{box-sizing:border-box}html,body{background:var(--bg-0);min-height:100%;color:var(--ink);margin:0;font-family:Rubik,Segoe UI,Arial,sans-serif}[hidden]{display:none!important}.shell{text-align:center;max-width:1080px;margin:0 auto;padding:56px 20px 80px}h1{background:linear-gradient(90deg, var(--accent3), var(--accent1) 45%, var(--accent2));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0 0 12px;font-family:Fredoka,sans-serif;font-size:clamp(32px,5.5vw,52px);font-weight:700}.subtitle,.soon{color:var(--muted);margin:0 0 12px;font-size:clamp(15px,2vw,18px)}.back{color:var(--muted);margin-bottom:24px;font-size:14px;text-decoration:none;display:inline-block}.back:hover{color:var(--ink)}.back:focus-visible{outline:3px solid var(--accent3);outline-offset:3px;border-radius:6px}.layout{text-align:right;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);align-items:start;gap:24px;margin-top:24px;display:grid}.stage-view{border-radius:var(--radius);background:radial-gradient(circle at 50% 35%, #7c5cff2e, transparent 65%), var(--card);border:1px solid var(--card-border);cursor:grab;height:min(70vh,560px);min-height:300px;overflow:hidden}.stage-view:active{cursor:grabbing}.panel{border-radius:var(--radius);background:var(--card);border:1px solid var(--card-border);flex-direction:column;gap:16px;padding:20px;display:flex}.row,.pills{flex-wrap:wrap;gap:10px;display:flex}.row>.btn{flex:120px}.btn,.pill{font:inherit;color:var(--ink);cursor:pointer;background:#ffffff14;border:1px solid #ffffff2e;border-radius:999px;min-height:44px;padding:0 14px;font-weight:600;transition:background .2s,border-color .2s,opacity .2s}.btn:hover:not(:disabled),.pill:hover:not(:disabled){background:#ffffff29}.btn:disabled,.pill:disabled{opacity:.4;cursor:not-allowed}.btn:focus-visible,.pill:focus-visible,input[type=range]:focus-visible{outline:3px solid var(--accent3);outline-offset:3px}.btn--primary{background:linear-gradient(90deg, var(--accent1), var(--accent2));border-color:#0000}.btn--primary:hover:not(:disabled){background:linear-gradient(90deg,#8d70ff,#ff75bb)}.pill--on{background:var(--accent1);border-color:var(--accent1)}.status{min-height:3em;color:var(--ink);margin:0;font-size:16px;line-height:1.5}.notation{color:var(--accent3);letter-spacing:.04em;font-family:Fredoka,Rubik,sans-serif;font-weight:600}.speed{color:var(--muted);gap:8px;font-size:14px;display:grid}.speed input{width:100%;accent-color:var(--accent1);min-height:24px}.speed__value{color:var(--ink)}.hint{color:var(--muted);margin:0;font-size:13.5px;line-height:1.6}@media (width<=760px){.layout{grid-template-columns:minmax(0,1fr)}.stage-view{height:min(52vh,420px)}}@media (prefers-reduced-motion:reduce){.btn,.pill{transition:none}}.stages{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.stage{color:var(--muted);border:1px solid #ffffff24;border-radius:999px;padding:4px 10px;font-size:12.5px;line-height:1.3}.stage__num{font-family:Fredoka,Rubik,sans-serif;font-weight:600}.stage--now{color:var(--ink);background:var(--accent1);border-color:var(--accent1);font-weight:600}.stage--done{color:var(--ink);border-color:#3ddcf780}.stage--done:before{content:"✓ ";color:var(--accent3)}.step{background:#7c5cff1f;border:1px solid #7c5cff59;border-radius:16px;gap:6px;padding:14px 16px;display:grid}.step__title{margin:0;font-family:Fredoka,Rubik,sans-serif;font-size:17px;font-weight:600}.step__case{color:var(--accent3);margin:0;font-size:14px;font-weight:600}.step__why{color:var(--ink);margin:0;font-size:14px;line-height:1.55}.step__alg{word-spacing:.2em;overflow-wrap:anywhere;margin:0;font-size:15px}.step__count{color:var(--muted);margin:0;font-size:12.5px}.error{color:#ff8d8d;margin:0;font-weight:600}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.lessons{gap:6px;margin:0;padding:0;list-style:none;display:grid}.lessons__item{text-align:right;width:100%;min-height:44px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:1px solid #ffffff1f;border-radius:14px;align-items:center;gap:10px;padding:0 14px;font-size:14px;display:flex}.lessons__item:hover:not(:disabled){color:var(--ink);background:#ffffff14}.lessons__item:disabled{opacity:.5;cursor:not-allowed}.lessons__item:focus-visible{outline:3px solid var(--accent3);outline-offset:3px}.lessons__item--now{color:var(--ink);border-color:var(--accent1);background:#7c5cff33;font-weight:600}.lessons__mark{color:var(--accent3);text-align:center;flex-shrink:0;width:1.2em}.lesson{gap:10px;display:grid}.lesson__title{margin:0;font-family:Fredoka,Rubik,sans-serif;font-size:20px;font-weight:600}.lesson__goal{color:var(--accent3);margin:0;font-size:14px;font-weight:600;line-height:1.5}.lesson__p{color:var(--ink);margin:0;font-size:14.5px;line-height:1.7}.lesson__practice{color:var(--ink);margin:0;font-size:14.5px;line-height:1.6}.lesson__hint{background:#3ddcf71f;border:1px solid #3ddcf766;border-radius:12px;margin:0;padding:10px 14px}.lesson__done{background:#33d17a24;border:1px solid #33d17a80;border-radius:12px;flex-wrap:wrap;align-items:center;gap:10px;margin:0;padding:12px 14px;font-weight:600;display:flex}.algs{gap:8px;margin:0;padding:0;list-style:none;display:grid}.algs li{background:#0000004d;border:1px solid #ffffff1a;border-radius:12px;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:10px 14px;display:flex}.algs__name{color:var(--muted);font-size:13px}.algs .notation{word-spacing:.25em;overflow-wrap:anywhere;font-size:16px}.algs__note{color:var(--muted);flex-basis:100%;font-size:12.5px}.pad{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;display:grid}.pad__key{min-width:0;padding:0}.pad__prime{grid-column:1/-1}@media (width<=760px){.pad{grid-template-columns:repeat(3,minmax(0,1fr))}}.stage-view{background:radial-gradient(circle at 50% 35%, #7c5cff2e, transparent 65%), var(--bg-1);position:sticky;top:16px}@media (width<=760px){.stage-view{z-index:5;height:min(40vh,320px);min-height:220px;top:8px}}.entry{gap:12px;display:grid}.palette{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.swatch{cursor:pointer;border:3px solid #ffffff40;border-radius:50%;width:44px;height:44px;padding:0}.swatch--on{border-color:var(--ink);box-shadow:0 0 0 3px var(--accent1)}.swatch:focus-visible{outline:3px solid var(--accent3);outline-offset:3px}.palette__name{color:var(--muted);font-size:13.5px}.net{background:#00000059;border-radius:14px;grid-template-rows:repeat(3,auto);grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px;display:grid}.net__face{align-content:start;gap:2px;display:grid;position:relative}.net__sticker{aspect-ratio:1;cursor:pointer;border:1px solid #00000080;border-radius:4px;width:100%;min-width:0;padding:0}.net__sticker--empty{background:repeating-linear-gradient(45deg,#1d2048,#1d2048 4px,#14163a 4px 8px)}.net__sticker:disabled{cursor:default;opacity:.85}.net__sticker:focus-visible{outline:3px solid var(--accent3);outline-offset:1px;z-index:1;position:relative}.net__label{pointer-events:none;color:#0000008c;place-items:center;font-family:Fredoka,sans-serif;font-size:11px;font-weight:700;display:grid;position:absolute;inset:0}.timed{gap:12px;display:grid}.clock{text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.02em;margin:0;font:700 clamp(40px,9vw,56px)/1.1 Fredoka,Rubik,sans-serif}.clock--running{color:var(--accent3)}.clock--done{color:#33d17a}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;display:grid}.stats div{background:#0000004d;border:1px solid #ffffff1a;border-radius:12px;padding:10px 14px}.stats dt{color:var(--muted);font-size:12.5px}.stats dd{font-variant-numeric:tabular-nums;margin:2px 0 0;font:600 20px/1.2 Fredoka,Rubik,sans-serif}.recent{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.recent li{font-variant-numeric:tabular-nums;border:1px solid #ffffff24;border-radius:999px;padding:4px 12px;font-size:13.5px}.backup{border-top:1px solid #ffffff1f;padding-top:12px}.backup summary{cursor:pointer;min-height:32px;font-weight:600}.backup summary:focus-visible{outline:3px solid var(--accent3);outline-offset:3px;border-radius:6px}.backup .row{margin-top:10px}.backup__file{justify-content:center;align-items:center;display:inline-flex;position:relative}.backup__file:focus-within{outline:3px solid var(--accent3);outline-offset:3px}