:root{--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--radius-sm:10px;--radius-md:12px;--radius-lg:14px;--radius-pill:999px;--radius:var(--radius-lg);--tap:48px;--max:1080px;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, Menlo, Consolas, monospace;--fs-base:16px;--lh-base:1.55;--ease-out:ease-out;--motion-fast:.15s;--motion-base:.25s;--motion-spin:.8s;--lvl-beginner:#22c55e;--lvl-intermediate:#3b82f6;--lvl-advanced:#a855f7;--on-warn:#1a1200;--handle-ring:#fff;--overlay:#0009;--shadow-handle:0 1px 4px #00000080;--shadow-pop:0 8px 28px #00000073;--bg:#0b1218;--surface:#111a22;--surface-2:#17232e;--border:#243543;--text:#e6eef5;--muted:#9fb3c2;--accent:#2dd4bf;--accent-ink:#04201c;--good:#22c55e;--bad:#ef4444;--warn:#f59e0b;--link:#5eead4;--shadow:0 1px 2px #00000059;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg:#f4f7fa;--surface:#fff;--surface-2:#eef3f7;--border:#d6dee6;--text:#0f1b26;--muted:#52667a;--accent:#0d9488;--accent-ink:#fff;--good:#15803d;--bad:#b91c1c;--warn:#b45309;--link:#0f766e;--shadow:0 1px 2px #0f1b2614;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:light){:root:not([data-theme]){--bg:#f4f7fa;--surface:#fff;--surface-2:#eef3f7;--border:#d6dee6;--text:#0f1b26;--muted:#52667a;--accent:#0d9488;--accent-ink:#fff;--good:#15803d;--bad:#b91c1c;--warn:#b45309;--link:#0f766e;--shadow:0 1px 2px #0f1b2614;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);font:var(--fs-base)/var(--lh-base) var(--font-sans);margin:0}a{color:var(--link)}h1{margin:.4rem 0 .6rem;font-size:1.6rem;line-height:1.2}h2{margin:1.6rem 0 .6rem;font-size:1.2rem}h3{margin:.2rem 0;font-size:1.02rem}p{margin:.5rem 0}.muted{color:var(--muted)}.good{color:var(--good)}.bad{color:var(--bad)}.skip{background:var(--accent);color:var(--accent-ink);z-index:50;padding:.6rem 1rem;position:absolute;top:0;left:-999px}.skip:focus{top:8px;left:8px}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.app{flex-direction:column;min-height:100dvh;display:flex}.topbar{z-index:20;background:color-mix(in srgb, var(--bg) 92%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);align-items:center;gap:.75rem;padding:.5rem 1rem;display:flex;position:sticky;top:0}.brand{color:var(--text);align-items:center;gap:.5rem;font-size:1.05rem;font-weight:700;text-decoration:none;display:flex}.logo{border-radius:var(--radius-sm);background:var(--accent);width:34px;height:34px;color:var(--accent-ink);place-items:center;display:inline-grid}.topnav{gap:.25rem;margin-left:1rem;display:none}.topnav a{border-radius:var(--radius-sm);color:var(--muted);padding:.55rem .9rem;font-weight:600;text-decoration:none}.topnav a.active,.topnav a:hover{color:var(--text);background:var(--surface-2)}.top-actions{align-items:center;gap:.5rem;margin-left:auto;display:flex}.icon-btn{width:var(--tap);height:var(--tap);border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;font-size:1.2rem}.main{width:100%;max-width:var(--max);flex:1;margin:0 auto;padding:1rem 1rem 6.5rem}.footer{text-align:center;color:var(--muted);border-top:1px solid var(--border);padding:1rem 1rem 6rem;font-size:.85rem}.footer p{margin:.25rem 0}.footer .disclaimer{color:var(--text);font-size:.9rem;font-weight:600}.tabbar{z-index:30;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom);grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.tabbar a{min-height:58px;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:.72rem;font-weight:600;text-decoration:none;display:flex}.tabbar a.active{color:var(--accent)}.chip{border-radius:var(--radius-pill);background:var(--surface-2);min-height:36px;color:var(--text);border:1px solid var(--border);align-items:center;gap:.25rem;padding:.25rem .8rem;font-size:.9rem;text-decoration:none;display:inline-flex}.chip.accent{background:color-mix(in srgb, var(--accent) 18%, var(--surface));border-color:var(--accent)}.badge{border-radius:var(--radius-pill);background:var(--surface-2);color:var(--muted);border:1px solid var(--border);padding:.1rem .6rem;font-size:.78rem;font-weight:600;display:inline-block}.badge.warn{color:var(--warn);border-color:var(--warn)}.badge.xp{color:var(--accent)}.badge.lvl-beginner{color:var(--lvl-beginner)}.badge.lvl-intermediate{color:var(--lvl-intermediate)}.badge.lvl-advanced{color:var(--lvl-advanced)}.code{font-family:var(--font-mono);color:var(--muted);font-size:.8rem}.row{align-items:center;display:flex}.between{justify-content:space-between;gap:.5rem}.wrap{flex-wrap:wrap}.gap{gap:.5rem}.btn{min-height:var(--tap);border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface-2);color:var(--text);font:inherit;cursor:pointer;justify-content:center;align-items:center;padding:.5rem 1.1rem;font-weight:700;text-decoration:none;display:inline-flex}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.btn.big{min-height:52px;font-size:1.05rem}.btn.danger{color:var(--bad);border-color:var(--bad)}.btn:disabled{opacity:.5;cursor:not-allowed}button.link{color:var(--link);font:inherit;cursor:pointer;background:0 0;border:0;min-height:40px;padding:.5rem 0;text-decoration:underline}.hero{padding:1.2rem 0 .5rem}.hero h1{font-size:1.9rem}.hero p{color:var(--muted);max-width:60ch;margin-bottom:1rem}.stats{grid-template-columns:repeat(3,1fr);gap:.6rem;margin:1rem 0;display:grid}.stat{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);color:var(--text);text-align:center;flex-direction:column;align-items:center;padding:.9rem .4rem;text-decoration:none;display:flex}.stat .num{color:var(--accent);font-size:1.6rem;font-weight:800}.stat .lbl{color:var(--muted);font-size:.78rem}.grid{grid-template-columns:1fr;gap:.8rem;display:grid}.grid.spaced{margin-top:1rem}.card{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);color:var(--text);flex-direction:column;gap:.5rem;padding:1rem;text-decoration:none;display:flex}a.card:hover{border-color:var(--accent)}.card h3{font-size:1.05rem}.card .btn{align-self:flex-start}.level.lvl-beginner{border-top:4px solid var(--lvl-beginner)}.level.lvl-intermediate{border-top:4px solid var(--lvl-intermediate)}.level.lvl-advanced{border-top:4px solid var(--lvl-advanced)}.more{color:var(--accent);font-weight:700}.quiz-card{gap:.6rem}.status{font-size:.8rem;font-weight:700}.status.done{color:var(--good)}.status.partial{color:var(--warn)}.status.new{color:var(--muted)}.plain{margin:.3rem 0;padding:0;list-style:none}.plain li{border-bottom:1px solid var(--border);padding:.45rem 0}.plain li:last-child{border:0}.rules{grid-template-columns:auto 1fr;gap:.25rem .75rem;margin:0;font-size:.92rem;display:grid}.rules dt{color:var(--accent);font-weight:700}.rules dd{margin:0}.steps{padding-left:1.2rem}.steps li{margin:.5rem 0}.state{text-align:center;color:var(--muted);padding:1.2rem}.state.error{color:var(--bad)}.spinner{border:2px solid var(--border);border-top-color:var(--accent);width:1em;height:1em;animation:spin var(--motion-spin) linear infinite;vertical-align:-2px;border-radius:50%;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.page-head .sub{color:var(--muted)}.filters{gap:.6rem;margin-bottom:.8rem;display:grid}.seg{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);display:flex;overflow:hidden}.seg button{min-height:var(--tap);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;flex:1;padding:0 .4rem;font-weight:700}.seg button.on{background:var(--accent);color:var(--accent-ink)}select,input[type=search],input[type=number]{min-height:var(--tap);border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit;max-width:100%;padding:0 .8rem}input[type=search]{width:100%}.form{max-width:520px}.form label{gap:.3rem;display:grid}.form label span{font-weight:600}.form select{width:100%}.form .check{align-items:center;gap:.6rem;display:flex}.form .check input{width:24px;height:24px}.quiz h1{font-size:1.35rem}.crumbs{margin:.2rem 0 .4rem}.crumbs a{padding:.5rem 0;display:inline-block}.prompt{margin:.4rem 0 .8rem;font-size:1.05rem}.hint{color:var(--muted);font-size:.9rem}.chart-wrap{border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);margin:.5rem 0;position:relative;overflow:hidden}.chart{touch-action:manipulation;width:100%}.chart-pick{cursor:crosshair}.chart-badge{z-index:5;pointer-events:none;color:var(--muted);background:color-mix(in srgb, var(--surface) 85%, transparent);border-radius:var(--radius-pill);border:1px solid var(--border);padding:2px 8px;font-size:.7rem;font-weight:700;position:absolute;top:8px;right:64px}.options{gap:.6rem;margin:.8rem 0;padding:0;list-style:none;display:grid}.option{text-align:left;border-radius:var(--radius-md);border:2px solid var(--border);background:var(--surface);width:100%;min-height:56px;color:var(--text);font:inherit;cursor:pointer;padding:.7rem 1rem}.option.selected{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, var(--surface))}.option.right{border-color:var(--good);background:color-mix(in srgb, var(--good) 16%, var(--surface))}.option.wrong{border-color:var(--bad);background:color-mix(in srgb, var(--bad) 14%, var(--surface))}.option:disabled{cursor:default;color:var(--text)}.plan{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);gap:.6rem;margin:.8rem 0;padding:.8rem;display:grid}.plan legend{padding:0 .4rem;font-weight:700}.field{border-radius:var(--radius-sm);grid-template-columns:110px 1fr;align-items:center;gap:.5rem;padding:.2rem;display:grid}.field.active{background:color-mix(in srgb, var(--accent) 12%, transparent);outline:2px solid var(--accent)}.field input{width:100%}.rr{font-size:1.05rem}.problem{color:var(--bad);font-weight:600}.actions{margin:1rem 0}.actions .btn{width:100%}.result{color:var(--text);border-radius:var(--radius);border:2px solid var(--border);background:var(--surface);margin:1rem 0;padding:1rem}.result.good{border-color:var(--good)}.result.mid{border-color:var(--warn)}.result.bad{border-color:var(--bad)}.result h2{margin:0}.score{font-size:1.8rem;font-weight:800}.result.good .score,.result.good h2{color:var(--good)}.result.mid .score,.result.mid h2{color:var(--warn)}.result.bad .score,.result.bad h2{color:var(--bad)}.checks{gap:.35rem;margin:.6rem 0;padding:0;list-style:none;display:grid}.checks li{gap:.6rem;display:flex}.checks .ok span:first-child{color:var(--good);font-weight:800}.checks .no span:first-child{color:var(--bad);font-weight:800}.explain{background:var(--surface-2);border-radius:var(--radius-md);margin:.8rem 0;padding:.2rem 1rem .6rem}.links{margin:.6rem 0}.disclaimer{color:var(--muted);font-size:.85rem}.disclaimer.subtle{text-align:center;margin-top:1.2rem}.result-disclaimer{margin-top:.6rem;font-weight:600}.xp-line{margin:.3rem 0}.mini{background:var(--surface-2);border-radius:var(--radius-sm);width:100%;height:72px}.mini .up line{stroke:var(--good)}.mini .up rect{fill:var(--good)}.mini .down line{stroke:var(--bad)}.mini .down rect{fill:var(--bad)}.mini line{stroke-width:1.2px}.clamp{-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.bar-row{margin:.6rem 0}.bar{background:var(--surface-2);border-radius:var(--radius-pill);border:1px solid var(--border);height:10px;overflow:hidden}.bar.big{height:14px}.bar span{background:var(--accent);border-radius:var(--radius-pill);height:100%;display:block}.session-list{gap:.5rem;margin:1rem 0;padding:0;list-style:none;display:grid}.session-list li{flex-direction:row}.review-item{gap:.1rem;display:grid}.lesson h2,.lesson h3{margin-top:1.2rem}.lesson blockquote{border-left:4px solid var(--accent);background:var(--surface-2);border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin:.8rem 0;padding:.4rem 1rem}.lesson code{background:var(--surface-2);border-radius:4px;padding:0 .3rem}.explain h2,.explain h3{font-size:1rem}.explain blockquote{border-left:3px solid var(--accent);color:var(--muted);margin:.5rem 0;padding-left:.8rem}.legal{white-space:pre-wrap;word-break:break-word;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);font:.8rem/1.45 var(--font-mono);max-height:60vh;padding:1rem;overflow:auto}@media (width>=640px){.grid{grid-template-columns:repeat(2,1fr)}.levels{grid-template-columns:repeat(3,1fr)}.filters{grid-template-columns:auto 1fr;align-items:center}.filters input[type=search]{grid-column:1/-1}.actions .btn{width:auto}h1{font-size:1.9rem}.quiz h1{font-size:1.6rem}}@media (width>=900px){.topnav{display:flex}.tabbar{display:none}.main{padding-bottom:3rem}.footer{padding-bottom:2rem}.grid{grid-template-columns:repeat(3,1fr)}.hero h1{font-size:2.4rem}.quiz,.lesson{max-width:860px;margin:0 auto}}@media (prefers-reduced-motion:reduce){.spinner{animation:none}}.card.soon{opacity:.6}.chart-stage{width:100%;position:relative}.draw-layer{touch-action:none;cursor:crosshair;z-index:3;-webkit-user-select:none;user-select:none;position:absolute;top:0;left:0}.draw-layer.idle{touch-action:pan-y pinch-zoom;cursor:pointer}.draw-layer.idle .draw-handle{opacity:.55}.draw-toolbar{align-items:center;gap:var(--space-3);padding:var(--space-2);margin:0;display:flex}.draw-toggle{white-space:nowrap;min-height:40px;padding:.3rem .9rem}.draw-toolbar-hint{font-size:.85rem;line-height:1.3}.draw-handle{background:var(--warn);border:3px solid var(--handle-ring);width:22px;height:22px;box-shadow:var(--shadow-handle);pointer-events:none;border-radius:50%;margin:-11px 0 0 -11px;position:absolute}.draw-handle:after{content:"";border:1px dashed color-mix(in srgb, var(--warn) 60%, transparent);border-radius:50%;position:absolute;inset:-12px}.draw-layer.dragging .draw-handle{transform:scale(1.15)}.legend{color:var(--muted);flex-wrap:wrap;gap:.25rem .9rem;margin:.4rem 0 0;padding:0;font-size:.85rem;list-style:none;display:flex}.legend li{align-items:center;gap:.35rem;display:inline-flex}.legend .sw{border-radius:2px;width:18px;height:4px;display:inline-block}.ctx-chart{margin-top:.75rem}.ctx-chart h3{color:var(--muted);margin:0 0 .25rem;font-size:.9rem;font-weight:600}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.problem{color:var(--bad);margin:.35rem 0;font-weight:600}.toasts{left:50%;bottom:calc(76px + env(safe-area-inset-bottom));z-index:60;pointer-events:none;gap:.5rem;width:min(440px,100vw - 1.5rem);display:grid;position:fixed;transform:translate(-50%)}.toast{pointer-events:auto;border-radius:var(--radius);background:var(--surface);border:1px solid var(--accent);box-shadow:var(--shadow-pop);animation:toast-in var(--motion-base) var(--ease-out);grid-template-columns:auto 1fr auto;align-items:center;gap:.7rem;padding:.7rem .8rem;display:grid}.toast-icon{font-size:1.6rem}.toast .icon-btn{width:36px;height:36px;font-size:1.1rem}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.toast{animation:none}}.badges{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem;margin:.5rem 0 1rem;padding:0;list-style:none;display:grid}.badge-card{border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);justify-items:start;gap:.2rem;padding:.7rem;font-size:.85rem;display:grid}.badge-card .b-icon{font-size:1.6rem}.badge-card.earned{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--surface))}.badge-card.locked{opacity:.7}.badge-card.locked .b-icon{filter:grayscale()}.modal-back{z-index:70;background:var(--overlay);place-items:center;padding:.75rem;display:grid;position:fixed;inset:0;overflow:auto}.modal{gap:.7rem;width:min(560px,100%);max-height:calc(100vh - 1.5rem);display:grid;overflow:auto}.modal h2{margin:0}.table{border-collapse:collapse;width:100%;font-size:.9rem}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:.35rem .4rem}.radio-group{border:1px solid var(--border);border-radius:var(--radius);gap:.5rem;padding:.6rem .8rem;display:grid}.radio-group label{align-items:flex-start;gap:.5rem;min-height:40px;display:flex}.draw-fields{margin:.6rem 0}.draw-fields summary{cursor:pointer;align-items:center;min-height:40px;font-weight:600;display:flex}.plan-grid{grid-template-columns:1fr;gap:.4rem;margin-top:.5rem;display:grid}.draw-fields .field{grid-template-columns:130px 1fr}.locked-badges{margin-top:.75rem}.locked-badges>summary{cursor:pointer;min-height:44px;color:var(--accent);align-items:center;padding:.6rem 0;display:flex}.preview-banner{background:var(--warn);color:var(--on-warn);text-align:center;padding:.5rem 1rem;font-weight:600}.preview-banner .linklike{color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;min-height:32px;text-decoration:underline}.center{justify-content:center}.load-more{margin:var(--space-5) 0}.coach{margin:.8rem 0}.coach-reply{background:color-mix(in srgb, var(--accent) 10%, var(--surface));border:1px solid var(--accent);border-radius:var(--radius-md);padding:.2rem 1rem .6rem}.coach-reply h3{font-size:1rem}