:root{--bg: #f5f3ee;--bg-dot: #e3ded2;--surface: #fffefb;--surface-2: #f1eee7;--surface-3: #e9e5dc;--border: #e5e0d5;--border-strong: #d2cbbd;--text: #1f1d1a;--text-muted: #625d55;--text-faint: #a19b90;--accent: #2c55d6;--accent-strong: #2144b5;--accent-soft: #e8edfb;--accent-text: #ffffff;--marker: #f5c542;--marker-soft: #fdf3d3;--py: #2c55d6;--js: #b97f00;--js-soft: #fbf0d0;--ts: #2f74c0;--ts-soft: #e2eefa;--web: #c4532a;--web-soft: #fbe6dc;--tools: #2e8a6b;--tools-soft: #dcf1e8;--term-bg: #16181d;--term-fg: #e6e6e3;--ok: #1e7c4c;--ok-soft: #e2f1e7;--bad: #c0402e;--bad-soft: #fbe8e3;--warn: #8f5f08;--warn-soft: #fbf0d8;--ring: var(--accent);--ring-track: var(--surface-3);--code-bg: #fcfbf8;--code-active: #f3f1ec;--code-select: #d9e2fb;--error-line: #fbe2dc;--step-line: #e3eafc;--changed: #fdf0c4;--syn-keyword: #9b2fae;--syn-string: #2c7a36;--syn-number: #b0550a;--syn-comment: #8f8a80;--syn-function: #2350c9;--syn-def: #0d7184;--syn-operator: #5e5950;--shadow-sm: 0 1px 0 rgba(40, 32, 20, .04);--shadow: 0 1px 2px rgba(40, 32, 20, .05), 0 4px 14px -6px rgba(40, 32, 20, .12);--shadow-lg: 0 2px 4px rgba(40, 32, 20, .05), 0 16px 32px -12px rgba(40, 32, 20, .18);--radius-sm: 8px;--radius: 12px;--radius-lg: 18px;--sans: "IBM Plex Sans KR", "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", system-ui, sans-serif;--mono: "JetBrains Mono", "D2Coding", "Cascadia Code", Consolas, "SF Mono", Menlo, monospace;--base-size: 16px;--code-size: 14.5px;color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #131416;--bg-dot: #23252a;--surface: #1b1d21;--surface-2: #23262b;--surface-3: #2c3036;--border: #2d3036;--border-strong: #3b3f47;--text: #ecebe6;--text-muted: #a9a59d;--text-faint: #6f6c66;--accent: #7d9dff;--accent-strong: #9bb4ff;--accent-soft: #1f2947;--accent-text: #0d1323;--marker: #f2c84f;--marker-soft: #3a3016;--py: #7d9dff;--js: #f0c04d;--js-soft: #362c12;--ts: #6eaaf0;--ts-soft: #182c44;--web: #f08a62;--web-soft: #3d2117;--tools: #5fcfa6;--tools-soft: #14322a;--term-bg: #0d0e11;--ok: #5cc98d;--ok-soft: #16301f;--bad: #ff8b7b;--bad-soft: #3a1e1a;--warn: #efb850;--warn-soft: #352914;--code-bg: #17191c;--code-active: #1f2226;--code-select: #2c3a5f;--error-line: #45211d;--step-line: #22305a;--changed: #463a14;--syn-keyword: #d49af3;--syn-string: #93d393;--syn-number: #f2aa62;--syn-comment: #77736c;--syn-function: #86b2ff;--syn-def: #66d1dd;--syn-operator: #a9a59d;--shadow-sm: none;--shadow: 0 1px 2px rgba(0, 0, 0, .35);--shadow-lg: 0 12px 30px -10px rgba(0, 0, 0, .6);color-scheme:dark}}:root[data-theme=dark]{--bg: #131416;--bg-dot: #23252a;--surface: #1b1d21;--surface-2: #23262b;--surface-3: #2c3036;--border: #2d3036;--border-strong: #3b3f47;--text: #ecebe6;--text-muted: #a9a59d;--text-faint: #6f6c66;--accent: #7d9dff;--accent-strong: #9bb4ff;--accent-soft: #1f2947;--accent-text: #0d1323;--marker: #f2c84f;--marker-soft: #3a3016;--py: #7d9dff;--js: #f0c04d;--js-soft: #362c12;--ts: #6eaaf0;--ts-soft: #182c44;--ok: #5cc98d;--ok-soft: #16301f;--bad: #ff8b7b;--bad-soft: #3a1e1a;--warn: #efb850;--warn-soft: #352914;--code-bg: #17191c;--code-active: #1f2226;--code-select: #2c3a5f;--error-line: #45211d;--step-line: #22305a;--changed: #463a14;--syn-keyword: #d49af3;--syn-string: #93d393;--syn-number: #f2aa62;--syn-comment: #77736c;--syn-function: #86b2ff;--syn-def: #66d1dd;--syn-operator: #a9a59d;--shadow-sm: none;--shadow: 0 1px 2px rgba(0, 0, 0, .35);--shadow-lg: 0 12px 30px -10px rgba(0, 0, 0, .6);color-scheme:dark}:root[data-font=small]{--base-size: 15px;--code-size: 13.5px}:root[data-font=large]{--base-size: 18px;--code-size: 16.5px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:var(--base-size);line-height:1.7;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:3px}h1,h2,h3{line-height:1.3;letter-spacing:-.02em;font-weight:700}h1{font-size:1.75em;margin:.2em 0 .4em}h2{font-size:1.25em}code,pre{font-family:var(--mono);font-variant-ligatures:none}.muted{color:var(--text-muted)}.small{font-size:.85em}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}::selection{background:var(--code-select)}.icon{flex:none;display:inline-block;vertical-align:-.18em}.with-icon{display:inline-flex;align-items:center;gap:.4em}.app{min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:20px;padding:0 24px;height:60px;background:color-mix(in srgb,var(--bg) 86%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--border)}.brand{font-weight:700;color:var(--text);white-space:nowrap;display:flex;align-items:center;gap:10px;letter-spacing:-.02em}.brand:hover{text-decoration:none}.logo-mark{flex:none;display:block}.tabs{display:flex;gap:2px;flex:1;justify-content:center}.tabs a{position:relative;padding:7px 14px;border-radius:999px;color:var(--text-muted);font-weight:500;font-size:.95em;display:flex;align-items:center;gap:6px;transition:color .15s,background .15s}.tabs a:hover{color:var(--text);background:var(--surface-2);text-decoration:none}.tabs a.active{color:var(--text);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border),var(--shadow-sm);font-weight:600}.tab-icon{display:none}.py-status{display:flex;align-items:center;gap:7px;font-size:.78em;color:var(--text-muted);white-space:nowrap;padding:4px 10px;border-radius:999px;background:var(--surface-2)}.py-status .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 20%,transparent)}.py-status.loading .dot{background:var(--warn);box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 20%,transparent);animation:pulse 1s infinite alternate}.py-status.busy .dot{background:var(--accent)}.py-status.error .dot{background:var(--bad)}@keyframes pulse{0%{opacity:.35}to{opacity:1}}.storage-warn{background:var(--warn-soft);color:var(--warn);padding:8px 20px;font-size:.9em}main{flex:1;width:100%}.page{max-width:880px;margin:0 auto;padding:32px 24px 72px}.page.narrow{max-width:640px}@media (max-width: 720px){.topbar{padding:0 14px;gap:8px;height:54px;-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--bg)}.tabs{position:fixed;bottom:0;left:0;right:0;z-index:20;background:var(--surface);border-top:1px solid var(--border);justify-content:space-around;gap:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom))}.tabs a{flex-direction:column;gap:2px;font-size:.7em;padding:4px 6px;flex:1;text-align:center;border-radius:10px}.tabs a:hover{background:none}.tabs a.active{background:none;box-shadow:none;color:var(--accent)}.tabs a.active .tab-icon{background:var(--accent-soft)}.tab-icon{display:grid;place-items:center;width:48px;height:28px;border-radius:999px;transition:background .15s}.py-status{margin-left:auto}.page{padding:20px 16px 104px}h1{font-size:1.45em}}@media (max-width: 380px){.brand-name{display:none}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 16px;border-radius:10px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-weight:600;font-size:.95em;cursor:pointer;white-space:nowrap;box-shadow:var(--shadow-sm);transition:background .15s,border-color .15s,transform .08s,box-shadow .15s}.btn:hover{background:var(--surface-2);text-decoration:none}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:default}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text);box-shadow:0 1px color-mix(in srgb,var(--accent) 60%,black),0 4px 12px -6px var(--accent)}.btn.primary:hover{background:var(--accent-strong);border-color:var(--accent-strong)}.btn.ghost{background:transparent;border-color:transparent;box-shadow:none;color:var(--text-muted)}.btn.ghost:hover{background:var(--surface-2);color:var(--text)}.btn.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,var(--border))}.btn.small{min-height:34px;padding:0 12px;font-size:.86em;border-radius:9px}.btn.big{min-height:52px;padding:0 26px;font-size:1.05em;border-radius:12px}.btn.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.link{background:none;border:none;color:var(--accent);cursor:pointer;padding:0;font-size:.88em;font-weight:500}.link:hover{text-decoration:underline;text-underline-offset:3px}.hero{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 32px;margin-bottom:14px;border-radius:var(--radius-lg);border:1px solid var(--border);background:radial-gradient(circle at 1px 1px,var(--bg-dot) 1px,transparent 1.4px) 0 0 / 18px 18px,var(--surface);box-shadow:var(--shadow)}.hero-text{min-width:0}.hero h1{font-size:2em;margin:6px 0 8px;line-height:1.22}.hero p.muted{margin:0;max-width:34em}.eyebrow{margin:0;color:var(--accent);font-weight:700;font-size:.8em;letter-spacing:.06em;text-transform:uppercase}.ring{position:relative;flex:none;display:inline-grid;place-items:center}.ring svg{position:absolute;top:0;right:0;bottom:0;left:0}.ring-label{position:relative;display:grid;justify-items:center;line-height:1.1}.ring-label strong{font-size:1.5em;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.ring-label strong small{font-size:.55em;font-weight:600;color:var(--text-muted);margin-left:1px}.ring-label span{font-size:.72em;color:var(--text-muted);font-weight:600}.next-lesson{position:relative;display:grid;gap:4px;margin:0 0 12px;padding:22px 24px;border-radius:var(--radius-lg);background:var(--accent);color:var(--accent-text);overflow:hidden;box-shadow:0 10px 28px -14px var(--accent);transition:transform .15s,box-shadow .15s}.next-lesson:after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent-text) 16%,transparent),transparent 70%);pointer-events:none}.next-lesson:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 14px 32px -14px var(--accent)}.next-meta{font-size:.85em;opacity:.85;display:flex;align-items:center;gap:8px}.next-meta .track-dot{background:var(--marker)}.next-title{font-size:1.4em;font-weight:700;letter-spacing:-.02em}.next-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px}.next-time{display:inline-flex;align-items:center;gap:6px;font-size:.85em;opacity:.85}.next-cta{display:inline-flex;align-items:center;gap:6px;font-weight:700;padding:8px 16px;border-radius:999px;background:var(--accent-text);color:var(--accent)}.done-all{display:flex;align-items:center;gap:8px;padding:14px 18px;border-radius:var(--radius);background:var(--ok-soft);color:var(--ok);font-weight:600;margin:0 0 12px}.track-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--py);flex:none}.track-dot.js{background:var(--js)}.track-card{display:flex;align-items:center;gap:14px;padding:14px 18px;margin-bottom:16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);color:var(--text);box-shadow:var(--shadow-sm);transition:border-color .15s,transform .15s}.track-card:hover{text-decoration:none;border-color:var(--js);transform:translateY(-1px)}.track-card.teaser{background:linear-gradient(100deg,var(--js-soft),var(--surface) 70%)}.track-card>.icon{color:var(--text-faint)}.track-card-text{flex:1;min-width:0;display:grid;line-height:1.45}.track-card-text strong{font-size:1.02em}.track-badge{flex:none;font-family:var(--mono);font-weight:700;font-size:.78em;padding:6px 9px;border-radius:9px;background:var(--js);color:var(--surface);letter-spacing:.02em}.track-pct{font-size:.85em;color:var(--text-muted);font-variant-numeric:tabular-nums}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}.stat{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;display:grid;align-content:start;box-shadow:var(--shadow-sm)}.stat-icon{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}.stat-icon.flame{background:var(--marker-soft);color:var(--warn)}.stat-icon.ok{background:var(--ok-soft);color:var(--ok)}.stat-value{font-size:1.7em;font-weight:700;line-height:1.2;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.stat-value small{font-size:.5em;color:var(--text-muted);font-weight:600;margin-left:2px;letter-spacing:0}.stat-label{color:var(--text-muted);font-size:.82em}.section-title{display:flex;align-items:center;gap:8px;font-size:.95em;color:var(--text-muted);margin:0 0 10px;font-weight:600;letter-spacing:0}.unit-group{margin-bottom:26px}.unit-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.unit-card{display:grid;gap:6px;padding:14px 16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);color:var(--text);height:100%;box-shadow:var(--shadow-sm);transition:border-color .15s,transform .15s,box-shadow .15s}.unit-card:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow)}.unit-card.js:hover{border-color:var(--js)}.unit-card.complete .unit-no{color:var(--ok)}.unit-no{display:inline-flex;align-items:center;gap:4px;font-size:.76em;color:var(--text-muted);font-weight:700;letter-spacing:.02em}.unit-title{font-weight:600;line-height:1.4}.bar{display:block;height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}.bar>span{display:block;height:100%;background:var(--ok);border-radius:3px;transition:width .4s ease}.unit-card.js .bar>span,.unit-section.js .bar>span{background:var(--js)}.track-tabs{display:inline-flex;gap:4px;padding:4px;border-radius:14px;background:var(--surface-2);border:1px solid var(--border);margin:4px 0 12px;max-width:100%;overflow-x:auto}.track-tabs button{display:inline-flex;align-items:center;gap:8px;border:none;background:none;padding:8px 16px;border-radius:10px;cursor:pointer;color:var(--text-muted);font-weight:600;white-space:nowrap}.track-tabs button.on{background:var(--surface);color:var(--text);box-shadow:var(--shadow)}.track-count{font-size:.78em;font-weight:600;color:var(--text-faint);font-variant-numeric:tabular-nums}.curriculum .intro{margin:0 0 12px;max-width:40em}.big-bar{height:8px;border-radius:4px;margin-bottom:8px}.unit-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px 22px 14px;margin:16px 0;scroll-margin-top:76px;box-shadow:var(--shadow-sm)}.unit-head-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.unit-count{display:inline-flex;align-items:center;gap:4px;font-size:.8em;color:var(--text-muted);font-weight:600;font-variant-numeric:tabular-nums}.unit-section.complete .unit-count{color:var(--ok)}.unit-section header h2{margin:4px 0;font-size:1.3em}.unit-section header p{margin:0 0 14px;font-size:.94em}.unit-section.planned{background:transparent;border-style:dashed;padding:14px 22px;box-shadow:none}.unit-section.planned h2{font-size:1.02em;color:var(--text-muted)}.unit-section.planned p{margin:0;font-size:.88em}.lesson-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:2px}.lesson-list.timeline li{position:relative}.lesson-list.timeline li:not(:last-child):before{content:"";position:absolute;left:27px;top:44px;bottom:-14px;width:2px;border-radius:1px;background:var(--border)}.lesson-list.timeline li.done:not(:last-child):before{background:color-mix(in srgb,var(--ok) 45%,var(--border))}.lesson-row{position:relative;display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:12px;color:var(--text);transition:background .12s}a.lesson-row:hover{background:var(--surface-2);text-decoration:none}.lesson-row.locked{color:var(--text-faint)}li.current .lesson-row{background:var(--accent-soft)}.lesson-icon{position:relative;z-index:1;flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:2px solid var(--border-strong);font-weight:700;font-size:.82em;color:var(--text-muted);font-variant-numeric:tabular-nums}.lesson-icon.done{background:var(--ok);border-color:var(--ok);color:var(--surface)}.lesson-icon.current{background:var(--accent);border-color:var(--accent);color:var(--accent-text);box-shadow:0 0 0 4px var(--accent-soft)}.lesson-icon.locked{background:var(--surface-2);border-color:var(--border);color:var(--text-faint)}.lesson-icon.project:not(.done):not(.locked){border-color:var(--marker);color:var(--warn);background:var(--marker-soft)}.lesson-icon.project.current{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.lesson-icon.quiz{border-radius:10px}.lesson-text{display:grid;flex:1;line-height:1.45;min-width:0}.lesson-title{font-weight:600}.stars-inline{display:inline-flex;gap:1px;margin-left:8px;vertical-align:-2px;color:var(--surface-3)}.stars-inline .icon{stroke-width:1.4;color:var(--border-strong)}.stars-inline .icon.on{color:var(--marker)}.badge{display:inline-flex;align-items:center;gap:4px;font-size:.74em;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--surface-2);color:var(--text-muted);letter-spacing:.01em}.badge.now{background:var(--accent);color:var(--accent-text)}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.ai{background:#f1e8fb;color:#7a2fb5}:root[data-theme=dark] .badge.ai{background:#2c1f42;color:#d0aaff}@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .badge.ai{background:#2c1f42;color:#d0aaff}}.badge.kind-code,.badge.kind-fix{background:var(--accent-soft);color:var(--accent)}.badge.kind-predict{background:var(--marker-soft);color:var(--warn)}.badge.kind-choice{background:var(--surface-3);color:var(--text-muted)}.lesson-top{margin-bottom:18px}.crumb{font-size:.82em;color:var(--text-muted);font-weight:600}.crumb:hover{color:var(--accent)}.lesson-top h1{margin:4px 0 14px}.steps{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}.step{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:36px;height:36px;padding:0 11px;border-radius:18px;border:1px solid var(--border);background:var(--surface);cursor:pointer;font-weight:600;font-size:.84em;color:var(--text-muted);transition:border-color .12s,background .12s}.step:hover{border-color:var(--border-strong)}.step.passed{background:var(--ok-soft);border-color:transparent;color:var(--ok)}.step.current{border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.lesson-summary{display:flex;align-items:center;gap:6px;color:var(--text-muted);font-size:.88em;margin-top:0}.lesson-body,.exercise{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:10px 28px 24px;box-shadow:var(--shadow-sm)}.exercise{padding-top:18px}.lesson-nav{display:flex;justify-content:space-between;margin-top:20px;gap:12px}.md p,.md li{margin:.55em 0}.md strong{font-weight:700}.md code{background:var(--surface-2);border:1px solid var(--border);padding:0 5px;border-radius:5px;font-size:.88em}.md pre{background:var(--code-bg);border:1px solid var(--border);padding:12px 14px;border-radius:10px;overflow-x:auto;line-height:1.55}.md pre code{background:none;border:none;padding:0}.md blockquote{margin:1.1em 0;padding:12px 16px;background:var(--marker-soft);border-left:3px solid var(--marker);border-radius:0 10px 10px 0}.md blockquote p{margin:0}.md h3{margin:1.6em 0 .4em;font-size:1.1em;display:flex;align-items:center;gap:8px}.md h3:before{content:"";width:4px;height:1em;border-radius:2px;background:var(--accent)}.md table{border-collapse:separate;border-spacing:0;margin:.9em 0;border:1px solid var(--border);border-radius:10px;overflow:hidden;font-size:.92em;display:block;max-width:100%;overflow-x:auto}.md th,.md td{border-bottom:1px solid var(--border);padding:7px 12px;text-align:left}.md th{background:var(--surface-2);font-weight:600}.md tr:last-child td{border-bottom:none}.md mark{background:linear-gradient(transparent 55%,var(--marker) 55%);color:inherit}.example{margin:14px 0}.example>.pair-label,.pair-side>.pair-label{margin-bottom:6px}.done-card{text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:36px 20px;display:grid;gap:10px;justify-items:center;box-shadow:var(--shadow)}.done-card h2{margin:0;font-size:1.5em}.stars{font-size:2.6em;letter-spacing:6px;color:var(--surface-3);line-height:1}.stars .on{color:var(--marker);text-shadow:0 2px 10px color-mix(in srgb,var(--marker) 50%,transparent)}.pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:16px 0;align-items:start}.pair-side{min-width:0;display:grid;align-content:start}.pair-label{justify-self:start;display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.72em;font-weight:700;letter-spacing:.02em;padding:2px 9px;border-radius:6px;background:var(--accent-soft);color:var(--py)}.pair-label:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.pair-label.js{background:var(--js-soft);color:var(--js)}.pair-label.ts{background:var(--ts-soft);color:var(--ts)}.pair .code-editor{border-top-width:3px}.pair-side:first-child .code-editor{border-top-color:var(--py)}.pair-side:last-child .code-editor{border-top-color:var(--js)}.pair-side:last-child:has(.pair-label.ts) .code-editor{border-top-color:var(--ts)}@media (max-width: 760px){.pair{grid-template-columns:1fr;gap:10px}}.code-editor{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--code-bg)}.code-editor:focus-within{border-color:color-mix(in srgb,var(--accent) 60%,var(--border));box-shadow:0 0 0 3px var(--accent-soft)}.code-editor .cm-editor{min-height:calc(var(--min-lines, 3) * 1.55em + 16px)}.code-editor .cm-scroller{line-height:1.55;font-family:var(--mono)!important}.code-editor.readonly .cm-activeLine,.code-editor.readonly .cm-activeLineGutter{background:transparent}.code-runner{display:grid;gap:8px}.runner-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:2px}.spacer{flex:1}.symbol-bar{display:none;gap:4px;overflow-x:auto;scrollbar-width:none;padding:2px 0}.symbol-bar button{flex:none;min-width:40px;height:38px;border-radius:8px;border:1px solid var(--border);background:var(--surface);font-family:var(--mono);font-size:.92em;cursor:pointer;box-shadow:var(--shadow-sm)}.symbol-bar button:active{background:var(--surface-3)}@media (pointer: coarse),(max-width: 720px){.code-runner:not(.compact)>.symbol-bar{display:flex}.code-runner.compact:focus-within>.symbol-bar{display:flex}}.console{border-radius:10px;background:var(--code-bg);border:1px solid var(--border);overflow:hidden}.console-out{position:relative;font-family:var(--mono);font-size:var(--code-size);white-space:pre-wrap;padding:10px 14px;min-height:2.6em;max-height:360px;overflow-y:auto;line-height:1.55}.console-out:before{content:"출력";display:block;font-family:var(--sans);font-size:.68em;font-weight:700;letter-spacing:.06em;color:var(--text-faint);margin-bottom:2px}.console-empty,.console-note{color:var(--text-faint);font-family:var(--sans);font-size:.88em}.console-note{display:block}.out-err{color:var(--bad)}.out-prompt{color:var(--text-muted)}.out-input{color:var(--accent);font-weight:600}.console-input{display:flex;gap:8px;align-items:center;padding:8px 10px;border-top:1px solid var(--border);background:var(--surface)}.console-input span{color:var(--accent);font-weight:700}.console-input input{flex:1;min-width:0;height:36px;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:var(--code-bg);color:var(--text);font-family:var(--mono);font-size:16px}.console-warn{margin:0;padding:8px 14px;background:var(--warn-soft);color:var(--warn);font-size:.88em}.error-box{background:var(--bad-soft);padding:12px 16px;border-top:1px solid color-mix(in srgb,var(--bad) 25%,transparent)}.grade .error-box,.code-exercise>.error-box{border-radius:10px;border:none;margin-top:8px}.error-head{display:flex;gap:8px;align-items:center;font-size:.8em;font-weight:700}.error-type{color:var(--bad);font-family:var(--mono);background:color-mix(in srgb,var(--bad) 12%,transparent);padding:1px 7px;border-radius:5px}.error-line{color:var(--text-muted)}.error-title{font-weight:700;margin:6px 0 4px}.error-code{margin:6px 0;padding:8px 10px;background:var(--surface);border-radius:8px;overflow-x:auto;font-size:.88em}.error-detail,.error-tip{margin:4px 0;font-size:.92em}.error-tip{display:flex;gap:6px;align-items:flex-start}.error-tip .icon{margin-top:.25em;color:var(--warn)}.error-actions{display:flex;gap:16px;margin-top:6px}.error-raw{margin:6px 0 0;font-size:.8em;white-space:pre-wrap;color:var(--text-muted)}.exercise-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}.exercise-count{margin-left:auto;font-size:.82em;color:var(--text-muted);font-variant-numeric:tabular-nums}.prompt{margin-bottom:12px}.grade{margin-top:4px;border-radius:12px;padding:12px 16px;border:1px solid var(--border)}.grade.pass{background:var(--ok-soft);border-color:transparent}.grade.fail{background:var(--surface)}.grade-summary{margin:0 0 6px;font-weight:700}.grade.pass .grade-summary{color:var(--ok)}.grade.fail .grade-summary{color:var(--bad)}.case-list{list-style:none;margin:0;padding:0;font-size:.92em}.case-list .pass{color:var(--ok)}.case-list .fail{color:var(--bad)}.case-detail{margin-top:10px;font-size:.92em}.case-detail p{margin:6px 0}.diff{display:grid;grid-template-columns:1fr 1fr;gap:8px}.diff pre,.actual pre{margin:4px 0 0;padding:8px 10px;background:var(--code-bg);border:1px solid var(--border);border-radius:8px;white-space:pre-wrap;font-size:.9em}.diff-label{font-size:.76em;font-weight:700;color:var(--text-muted);letter-spacing:.02em}.check-fail code{background:var(--surface-2);padding:1px 5px;border-radius:4px}.style-msg{color:var(--bad);margin:6px 0 0;font-size:.92em}@media (max-width: 560px){.diff{grid-template-columns:1fr}}.success{margin-top:12px;padding:12px 16px;border-radius:12px;background:var(--ok-soft);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 25%,transparent)}.wrong{margin-top:12px;padding:12px 16px;border-radius:12px;background:var(--bad-soft);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 22%,transparent)}.explain{margin-top:12px;padding:12px 16px;border-radius:12px;background:var(--surface-2)}.explain strong{font-size:.8em;color:var(--text-muted);letter-spacing:.02em}.explain .md p:first-child{margin-top:4px}.hints{margin-top:12px;display:grid;gap:8px;justify-items:start}.hint{padding:10px 14px;border-radius:12px;background:var(--marker-soft);width:100%;border:1px solid color-mix(in srgb,var(--marker) 35%,transparent)}.hint .md,.hint .md p{display:inline;margin:0}.hint-no{font-weight:700;font-size:.8em;color:var(--warn);margin-right:6px}.solution{margin-top:12px;display:grid;gap:6px}.solution strong{font-size:.82em;color:var(--text-muted)}.solution p{margin:0;font-size:.9em}.predict>.code-editor{margin-bottom:10px}.choices{display:grid;gap:8px;margin:12px 0}.choice{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:11px 14px;border-radius:12px;border:1px solid var(--border);background:var(--surface);cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s}.choice:hover:not(:disabled){border-color:var(--border-strong);background:var(--surface-2)}.choice.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent)}.choice.right{border-color:var(--ok);background:var(--ok-soft);box-shadow:0 0 0 1px var(--ok)}.choice.wrong{border-color:var(--bad);background:var(--bad-soft);box-shadow:0 0 0 1px var(--bad);color:var(--text);margin-top:0}.choice pre{margin:0;font-size:var(--code-size);white-space:pre-wrap}.choice .md p{margin:0}.choice-no{flex:none;width:24px;height:24px;border-radius:7px;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--border);font-size:.78em;font-weight:700;color:var(--text-muted);margin-top:1px}.choice.selected .choice-no{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.choice.right .choice-no{background:var(--ok);border-color:var(--ok);color:var(--surface)}.choice.wrong .choice-no{background:var(--bad);border-color:var(--bad);color:var(--surface)}.predict-input{width:100%;font-family:var(--mono);font-size:var(--code-size);padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--code-bg);color:var(--text);margin:8px 0}.actual{margin-top:10px}.setting{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:6px 22px 18px;margin-bottom:16px;box-shadow:var(--shadow-sm)}.setting h2{font-size:1.02em}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0;flex-wrap:wrap}.row.check{justify-content:flex-start}.row.check input{width:18px;height:18px;accent-color:var(--accent)}.row-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.segmented{display:inline-flex;background:var(--surface-2);border:1px solid var(--border);border-radius:11px;padding:3px}.segmented button{border:none;background:none;padding:6px 12px;border-radius:8px;cursor:pointer;font-size:.9em;color:var(--text-muted)}.segmented button.on{background:var(--surface);color:var(--text);font-weight:600;box-shadow:var(--shadow)}@media (max-width: 560px){.lesson-body,.exercise{padding-left:16px;padding-right:16px;border-radius:14px}.hero{padding:22px 20px;gap:14px}.hero h1{font-size:1.55em}.hero .ring{width:76px!important;height:76px!important}.hero .ring svg{width:76px;height:76px}.unit-section{padding:18px 14px 10px}.lesson-list.timeline li:not(:last-child):before{left:27px}.stats{gap:8px}.stat{padding:12px}.stat-icon{display:none}.next-lesson{padding:18px}}.topbar{top:env(safe-area-inset-top,0px)}.confirm{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;background:var(--warn-soft)}.confirm-q{font-size:.9em}.tutor{margin-top:16px;border:1px solid var(--border);border-radius:14px;background:var(--surface);overflow:hidden}.tutor-head{width:100%;display:flex;align-items:center;gap:8px;padding:11px 14px;border:none;background:var(--surface-2);cursor:pointer;text-align:left}.tutor-icon{color:var(--accent);font-size:1.1em}.tutor-title{font-weight:700}.tutor-head .muted{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tutor-chevron{color:var(--text-muted)}.tutor-body{padding:12px 14px 14px;display:grid;gap:10px}.tutor-setup{background:var(--accent-soft);border-radius:10px;padding:10px 14px;font-size:.92em}.tutor-setup p,.tutor-setup ol{margin:4px 0}.tutor-list{display:grid;gap:8px;max-height:460px;overflow-y:auto;padding-right:2px}.tutor-msg{padding:9px 13px;border-radius:14px;font-size:.95em;min-width:0}.tutor-msg p{margin:.3em 0}.tutor-msg.user{background:var(--accent);color:var(--accent-text);justify-self:end;max-width:85%;border-bottom-right-radius:4px}.tutor-msg.user code{background:color-mix(in srgb,var(--accent-text) 18%,transparent);border-color:transparent;color:inherit}.tutor-msg.model{background:var(--surface-2);max-width:100%;border-bottom-left-radius:4px}.tutor-msg.model .md pre{background:var(--code-bg);border:1px solid var(--border)}.tutor-msg.error{background:var(--warn-soft);color:var(--warn)}.tutor-msg.streaming{opacity:.92}.tutor-actions{display:flex;flex-wrap:wrap;gap:6px}.tutor-ask{display:flex;gap:8px;align-items:flex-end}.tutor-ask textarea{flex:1;min-width:0;resize:vertical;padding:8px 10px;border-radius:10px;border:1px solid var(--border);background:var(--code-bg);color:var(--text);font:inherit;font-size:16px;line-height:1.4}.tutor-clear{justify-self:start}.field{display:grid;gap:4px;margin:10px 0}.field label{font-weight:600;font-size:.92em}.field input,.field select{height:40px;padding:0 12px;border-radius:10px;border:1px solid var(--border);background:var(--code-bg);color:var(--text);font-family:var(--mono);font-size:15px;min-width:0}.field-row{display:flex;gap:8px}.field-row input{flex:1}.ok-text{color:var(--ok)}.bad-text{color:var(--bad)}.tab-badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--bad);color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center}@media (max-width: 720px){.tab-badge{position:absolute;top:0;right:calc(50% - 26px);box-shadow:0 0 0 2px var(--surface)}}.review-cta{display:flex;align-items:center;gap:14px;margin:0 0 12px;padding:14px 18px;border-radius:var(--radius);background:var(--marker-soft);color:var(--text);border:1px solid color-mix(in srgb,var(--marker) 50%,transparent);transition:transform .15s}.review-cta:hover{text-decoration:none;transform:translateY(-1px)}.review-cta-text{display:grid;line-height:1.45;min-width:0}.review-cta-count{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--marker);color:#3a2b00;font-weight:800;font-size:1.1em;font-variant-numeric:tabular-nums}.review-cta-go{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-weight:700;color:var(--warn);white-space:nowrap}.review-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.review-bar{margin:4px 0 8px}.review-from{margin:0 0 8px}.empty-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;display:grid;gap:12px;justify-items:start;box-shadow:var(--shadow-sm)}.empty-card p{margin:0}.empty-title{font-weight:700;font-size:1.1em}.card-q{display:grid;gap:8px}.card-q>.badge{justify-self:start}.card-q .prompt{margin-bottom:4px}.grade-buttons{margin-top:16px;padding-top:14px;border-top:1px solid var(--border);display:grid;gap:8px;justify-items:start}.grade-buttons .row-buttons{margin:0}.choice.answer{border-color:var(--ok);box-shadow:0 0 0 1px var(--ok)}.choice:disabled{cursor:default}.badge.kind-fill{background:var(--ok-soft);color:var(--ok)}.fill{display:grid;gap:8px}.fill-code{margin:0;padding:12px 14px;border-radius:10px;background:var(--code-bg);border:1px solid var(--border);font-size:var(--code-size);line-height:1.6;white-space:pre-wrap;overflow-x:auto}.fill-blank{display:inline-block;min-width:3ch;padding:0 6px;border-radius:6px;background:var(--accent-soft);color:var(--accent);font-weight:700;border-bottom:2px solid var(--accent)}.fill-blank.right{background:var(--ok-soft);color:var(--ok);border-color:var(--ok)}.fill-blank.wrong{background:var(--bad-soft);color:var(--bad);border-color:var(--bad)}.fill-input{height:42px;padding:0 12px;border-radius:10px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-family:var(--mono);font-size:16px;max-width:360px;width:100%}.fill-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.fill-expect pre{margin:4px 0 0;padding:8px 10px;background:var(--code-bg);border:1px solid var(--border);border-radius:8px;white-space:pre-wrap;font-size:.9em}.score{font-size:2.6em;margin:0;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.quiz-wrong{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:4px 16px 10px;margin-bottom:10px}.app-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;padding:8px 16px;background:var(--accent-soft);font-size:.9em}.stepper{border:1px solid color-mix(in srgb,var(--accent) 50%,var(--border));border-radius:14px;padding:12px 14px;background:var(--surface);display:grid;gap:10px;outline:none;box-shadow:0 0 0 3px var(--accent-soft)}.stepper-head{display:flex;align-items:center;gap:10px}.stepper-say{margin:0;font-weight:600;font-size:.94em}.stepper-controls{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.stepper-range{flex:1;min-width:120px;accent-color:var(--accent)}.stepper-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:10px}@media (max-width: 640px){.stepper-grid{grid-template-columns:1fr}}.stepper-frames{display:grid;gap:8px;align-content:start}.frame{border:1px solid var(--border);border-radius:10px;padding:8px 10px;background:var(--code-bg);min-width:0}.frame.active{border-color:var(--accent)}.frame-title{font-size:.78em;font-weight:700;color:var(--text-muted);margin-bottom:4px}.vars{width:100%;border-collapse:collapse;font-size:.9em;table-layout:fixed}.vars th{text-align:left;font-family:var(--mono);font-weight:600;width:32%;padding:3px 6px 3px 0;vertical-align:top;overflow-wrap:anywhere}.vars td{padding:3px 4px;vertical-align:top;overflow-wrap:anywhere}.vars td:last-child{width:22%;text-align:right}.vars tr.changed{background:var(--changed)}.vars code{font-size:.95em}.stepper-out pre{margin:0;padding:8px 10px;min-height:2.4em;max-height:220px;overflow:auto;background:var(--code-bg);border:1px solid var(--border);border-radius:10px;white-space:pre-wrap;font-size:.9em}.stepper-input textarea{flex:1;min-width:0;font-family:var(--mono);font-size:15px;padding:6px 10px;border-radius:8px;border:1px solid var(--border);background:var(--code-bg);color:var(--text)}.extra{margin-top:12px}.extra-box{border:1px dashed color-mix(in srgb,var(--accent) 60%,var(--border));border-radius:14px;padding:12px 14px;display:grid;gap:10px}.extra-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.page-tabs{margin-bottom:10px}.page-tabs a{padding:6px 14px;border-radius:8px;color:var(--text-muted);font-size:.9em}.page-tabs a.on{background:var(--surface);color:var(--text);font-weight:600;box-shadow:var(--shadow)}.page-tabs a:hover{text-decoration:none}.lang-toggle{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0;font-size:.9em}.dissect-result,.dissect-quiz{margin-top:20px}.dissect-result h2,.dissect-quiz h2{font-size:1.1em;margin:20px 0 8px}.concept-groups{display:grid;gap:12px}.concept-group{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:10px 14px}.concept-list{display:grid;gap:6px}.concept-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.concept-explain{flex-basis:100%;color:var(--text-muted)}.concept-explain p{margin:2px 0 6px}.concept-chip{display:inline-flex;align-items:center;gap:6px;padding:2px 4px 2px 10px;border-radius:999px;font-size:.85em;border:1px solid var(--border);background:var(--surface-2)}.concept-chip .concept-unit{font-size:.76em;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--surface)}.concept-chip.learned{background:var(--ok-soft);border-color:transparent;color:var(--ok)}.concept-chip.current{background:var(--accent-soft);border-color:transparent;color:var(--accent)}.concept-chip.later{color:var(--text-muted)}.concept-chip.outside{background:var(--warn-soft);border-color:transparent;color:var(--warn)}.warn-box{margin-top:12px;padding:10px 14px;border-radius:12px;background:var(--warn-soft)}.warn-box p{margin:4px 0 0}.line-list{list-style:none;padding:0;margin:0;display:grid;gap:6px}.line-list li{display:grid;grid-template-columns:2.5em minmax(0,1fr);gap:2px 10px;padding:8px 10px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.line-no{color:var(--text-faint);font-family:var(--mono);font-size:.85em;text-align:right;padding-top:2px}.line-code{font-size:.88em;overflow-x:auto;white-space:pre;background:none;padding:0}.line-chips{grid-column:2;display:flex;flex-wrap:wrap;gap:4px}.quick-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}@media (max-width: 560px){.quick-row{grid-template-columns:1fr}}.quick-card{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);color:var(--text);box-shadow:var(--shadow-sm);transition:border-color .15s,transform .15s}.quick-card>span:last-child{display:grid;line-height:1.45;min-width:0}.quick-card:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-1px)}.quick-icon{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}.mini-week{display:flex;gap:3px;margin-top:8px}.mini-week span{width:10px;height:10px;border-radius:3px;background:var(--surface-3)}.mini-week span.on{background:var(--ok)}.stats-link{display:inline-flex;align-items:center;gap:6px;margin:0 0 24px;font-weight:600;font-size:.9em}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:6px 22px 18px;margin-bottom:16px;box-shadow:var(--shadow-sm)}.panel h2{font-size:1.05em}.heatmap-wrap{overflow-x:auto}.heatmap{display:flex;gap:3px;width:max-content}.heatmap-days,.heatmap-col{display:grid;grid-template-rows:repeat(7,14px);gap:3px}.heatmap-days span{font-size:10px;line-height:14px;color:var(--text-faint);padding-right:4px}.cell{display:inline-block;width:14px;height:14px;border-radius:3px;background:var(--surface-3)}.cell.l1{background:color-mix(in srgb,var(--ok) 30%,var(--surface-3))}.cell.l2{background:color-mix(in srgb,var(--ok) 55%,var(--surface-3))}.cell.l3{background:color-mix(in srgb,var(--ok) 78%,var(--surface-3))}.cell.l4{background:var(--ok)}.cell.lx{background:transparent}.cell.today{outline:2px solid var(--accent);outline-offset:-1px}.heatmap-legend{display:flex;align-items:center;gap:3px;margin-top:8px}.week-dots{display:flex;gap:8px;flex-wrap:wrap}.week-dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--text-muted);font-size:.85em;font-weight:700}.week-dot.on{background:var(--ok);color:var(--surface)}.week-dot.today{box-shadow:0 0 0 2px var(--accent)}.week-list{margin:12px 0 0;padding-left:18px}.weak-list{list-style:none;padding:0;margin:8px 0 12px;display:grid;gap:6px}.weak-list li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 10px;border-radius:10px;background:var(--surface-2)}.weak-title{flex:1;min-width:12em;font-size:.9em;color:var(--text-muted)}.unit-bars{list-style:none;padding:0;margin:0;display:grid;gap:8px}.unit-bars li{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;align-items:center;gap:10px;font-size:.92em}@media (max-width: 560px){.unit-bars li{grid-template-columns:1fr auto}.unit-bars .bar{grid-column:1 / -1}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{transition:none!important;animation:none!important}}.html-preview{border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--surface)}.html-preview-bar{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--border);background:var(--surface-2)}.html-preview-bar .frame-title{margin:0}.html-preview iframe{display:block;width:100%;border:0;background:#fff;transition:height .15s ease}@media (max-width: 640px){.preview-hint{display:none}}.html-preview-errors{padding:10px 12px;border-top:1px solid var(--border);background:var(--bad-soft, #fdecec)}.html-preview-errors ul{margin:4px 0;padding-left:18px}.html-preview-bar .spacer{flex:1}.html-preview-alerts{padding:8px 12px;border-top:1px solid var(--border);background:var(--marker-soft)}.track-dot.web{background:var(--web)}.pair-label.html,.pair-label.css{background:var(--web-soft);color:var(--web)}.unit-card.web:hover{border-color:var(--web)}.unit-card.web .bar>span,.unit-section.web .bar>span{background:var(--web)}.track-card.web:hover{border-color:var(--web)}.track-card.web.teaser{background:linear-gradient(100deg,var(--web-soft),var(--surface) 70%)}.track-badge.web,.track-tabs button.on.web .track-dot{background:var(--web)}.track-dot.tools{background:var(--tools)}.pair-label.shell{background:var(--tools-soft);color:var(--tools)}.unit-card.tools:hover{border-color:var(--tools)}.unit-card.tools .bar>span,.unit-section.tools .bar>span{background:var(--tools)}.track-card.tools:hover{border-color:var(--tools)}.track-card.tools.teaser{background:linear-gradient(100deg,var(--tools-soft),var(--surface) 70%)}.track-badge.tools{background:var(--tools)}.term{border-radius:12px;overflow:hidden;background:var(--term-bg);color:var(--term-fg, #e6e6e3);border:1px solid #000;box-shadow:0 6px 20px #0000001f}.term-bar{display:flex;align-items:center;gap:10px;padding:7px 10px;background:#23262d;color:#b9bcc2;font-size:.78rem}.term-dots{display:inline-flex;gap:5px}.term-dots i{width:10px;height:10px;border-radius:50%;background:#4a4e57;display:block}.term-dots i:nth-child(1){background:#e26a5f}.term-dots i:nth-child(2){background:#e2b45f}.term-dots i:nth-child(3){background:#5fbf6a}.term-title{font-weight:600}.term-tag{font-size:.85em;padding:1px 6px;border-radius:6px;background:#3a3f48;color:#cfd2d8;margin-left:4px}.term-bar .spacer{flex:1}.term-btn{background:transparent;border:1px solid #454a54;color:#cfd2d8;border-radius:7px;padding:3px 9px;font:inherit;cursor:pointer}.term-btn:hover{background:#2f333b}.term-out{overflow-y:auto;padding:10px 12px 12px;font-family:var(--mono);font-size:.82rem;line-height:1.45;white-space:pre-wrap;word-break:break-word;cursor:text;min-height:9em}.tl{min-height:1.45em}.tl-cmd{color:#f2f2ef}.tl-err{color:#ff8a80}.tl-ok{color:#7ee2a8}.tl-info{color:#8fb7ff}.tl-warn{color:#f5d06b}.term-input{display:flex;align-items:baseline;gap:6px;cursor:text}.term-prompt{color:#f2f2ef;white-space:pre;flex:none;max-width:70%;overflow:hidden;text-overflow:ellipsis}.term-input input{flex:1;min-width:4em;background:transparent;border:0;outline:none;color:#fff;font:inherit;padding:0;caret-color:#7ee2a8}.term-examples{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px 10px;background:#1d2026;border-top:1px solid #2c3038}.term-examples .muted{color:#9a9fa8}.term-chip{background:#2a2e36;border:1px solid #3a3f48;border-radius:7px;padding:3px 8px;cursor:pointer;color:#e6e6e3}.term-chip code{background:none;color:inherit;font-size:.8rem;padding:0}.term-chip:hover{border-color:var(--tools)}@media (max-width: 640px){.term-out{font-size:.75rem}.term-prompt{max-width:55%}}.mission{border:1px dashed var(--tools);border-radius:12px;padding:12px 14px;background:var(--tools-soft);margin:14px 0}.mission-head{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--tools);margin-bottom:6px}.mission ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}.mission li label{display:flex;gap:9px;align-items:flex-start;cursor:pointer}.mission li input{margin-top:.3em;width:1.05em;height:1.05em;accent-color:var(--tools);flex:none}.mission li.done .md{color:var(--text-muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--text-muted) 50%,transparent)}.mission li .md p{margin:0}.mission-foot{margin-top:8px}.terminal-ex .term{margin:10px 0}.term-btn{white-space:nowrap;flex:none}.term-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}@media (max-width: 640px){.term-title .win{display:none}}