@import"https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&family=Recursive:CASL,MONO,wght@0,1,500;0,1,700&display=swap";:root{color-scheme:light;--ink: oklch(24% .025 148);--muted: oklch(46% .026 148);--paper: oklch(96% .018 91);--panel: oklch(99% .012 91);--terminal: oklch(18% .026 154);--terminal-ink: oklch(93% .028 128);--rule: oklch(82% .025 91);--accent: oklch(58% .16 38);--accent-dark: oklch(42% .13 38);--green: oklch(52% .13 151);--red: oklch(55% .16 27);--amber: oklch(72% .14 79);--space-2xs: 4px;--space-xs: 8px;--space-sm: 12px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--radius-sm: 6px;--shadow: 0 18px 50px color-mix(in oklch, var(--ink), transparent 88%)}*{box-sizing:border-box}html{min-height:100%;background:var(--paper)}body{margin:0;min-height:100%;color:var(--ink);font-family:Atkinson Hyperlegible,Segoe UI,sans-serif;letter-spacing:0}button,input{font:inherit}button{min-height:44px;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.shell-app{min-height:100dvh;padding:max(var(--space-md),env(safe-area-inset-top)) var(--space-md) max(calc(var(--space-md) + env(safe-area-inset-bottom)),var(--space-md));display:flex;flex-direction:column;gap:var(--space-md)}.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-md)}.eyebrow,.lesson-count,.lesson-badge,.task span,.runtime-pill,.terminal-head,.tabs button,.tree-row,.exit-code{font-family:Recursive,Courier New,monospace}.eyebrow{margin:0 0 var(--space-2xs);color:var(--accent-dark);font-size:.78rem;font-weight:700;text-transform:uppercase}h1,h2{margin:0;letter-spacing:0}h1{font-size:1.45rem;line-height:1.05}h2{font-size:2rem;line-height:1}p{line-height:1.45}code,pre,.command-line label,.command-line input,.terminal-entry{font-family:Recursive,Courier New,monospace}.runtime-pill{flex:none;min-height:36px;padding:0 var(--space-sm);border:1px solid var(--rule);border-radius:999px;display:grid;place-items:center;background:color-mix(in oklch,var(--panel),var(--green) 6%);color:var(--muted);font-size:.8rem;font-weight:700}.runtime-pill.is-linux{background:color-mix(in oklch,var(--panel),var(--accent) 16%);color:var(--accent-dark)}.course-shell{flex:1;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md)}.lesson-panel{border:1px solid var(--rule);border-radius:var(--radius-sm);background:var(--panel);box-shadow:var(--shadow)}.lesson-panel{padding:var(--space-md);display:grid;gap:var(--space-sm);align-content:start}.lesson-count{color:var(--muted);font-size:.82rem}.lesson-badge{width:fit-content;padding:var(--space-2xs) var(--space-xs);border:1px solid color-mix(in oklch,var(--accent),white 28%);border-radius:999px;color:var(--accent-dark);font-size:.8rem;font-weight:700}.lesson-panel p{margin:0;color:var(--muted)}.example{margin:0;padding:var(--space-sm);border-radius:var(--radius-sm);background:color-mix(in oklch,var(--paper),var(--ink) 4%);color:var(--ink);font-size:.9rem;overflow-x:auto}.task{display:grid;gap:var(--space-xs);padding:var(--space-sm);border-radius:var(--radius-sm);background:color-mix(in oklch,var(--amber),white 77%)}.task span{color:var(--accent-dark);font-weight:700;font-size:.8rem;text-transform:uppercase}.task code,.hint code{padding:0 .25em;border-radius:4px;background:color-mix(in oklch,var(--panel),var(--ink) 7%);color:var(--ink)}.lesson-actions,.runtime-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-xs)}.button,.nav-button,.run-button{border:1px solid transparent;border-radius:var(--radius-sm);font-weight:700}.button.primary,.run-button{background:var(--accent);color:#fbf8f0}.button.secondary,.nav-button{border-color:var(--rule);background:var(--panel);color:var(--ink)}.hint,.check,.file-placeholder,.runtime-panel{padding:var(--space-sm);border-radius:var(--radius-sm);background:color-mix(in oklch,var(--paper),var(--green) 7%)}.check{display:grid;gap:var(--space-2xs)}.check strong{color:var(--green)}.check.fail strong{color:var(--red)}.terminal-panel{min-height:420px;border-radius:var(--radius-sm);background:var(--terminal);color:var(--terminal-ink);box-shadow:var(--shadow);overflow:hidden;display:grid;grid-template-rows:auto minmax(280px,1fr) auto}.terminal-head{min-height:44px;padding:0 var(--space-sm);display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);border-bottom:1px solid color-mix(in oklch,var(--terminal-ink),transparent 82%);color:color-mix(in oklch,var(--terminal-ink),transparent 24%);font-size:.78rem}.dot{display:inline-block;width:10px;height:10px;margin-right:5px;border-radius:50%}.dot.red{background:var(--red)}.dot.amber{background:var(--amber)}.dot.green{background:var(--green)}.terminal-screen{min-height:0;padding:var(--space-sm);overflow-y:auto;font-size:.96rem}.terminal-empty{min-height:120px;display:grid;place-items:center;color:color-mix(in oklch,var(--terminal-ink),transparent 45%);text-align:center}.terminal-entry{margin-bottom:var(--space-sm)}.entered{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-xs)}.entered span{color:color-mix(in oklch,var(--terminal-ink),var(--green) 20%)}.entered strong{font-weight:700;color:var(--terminal-ink);overflow-wrap:anywhere}.exit-code{color:color-mix(in oklch,var(--terminal-ink),var(--red) 35%);font-size:.74rem}.terminal-entry pre{margin:var(--space-2xs) 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:color-mix(in oklch,var(--terminal-ink),white 8%)}.command-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--space-xs);align-items:center;margin-top:var(--space-md)}.command-line label{color:color-mix(in oklch,var(--terminal-ink),var(--green) 20%)}.command-line input{min-width:0;min-height:44px;border:1px solid color-mix(in oklch,var(--terminal-ink),transparent 78%);border-radius:var(--radius-sm);padding:0 var(--space-sm);background:color-mix(in oklch,var(--terminal),black 18%);color:var(--terminal-ink);font-size:1rem}.run-button{padding:0 var(--space-md)}.quick-keys{display:grid;grid-template-columns:repeat(11,minmax(42px,1fr));gap:1px;border-top:1px solid color-mix(in oklch,var(--terminal-ink),transparent 82%);overflow-x:auto}.quick-keys button{min-width:42px;border:0;border-radius:0;background:color-mix(in oklch,var(--terminal),white 8%);color:var(--terminal-ink);font-family:Recursive,Courier New,monospace}.support-panel{min-height:260px;overflow:hidden}.tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--rule)}.tabs button{border:0;border-radius:0;background:transparent;color:var(--muted);font-weight:700}.tabs button.active{background:color-mix(in oklch,var(--paper),var(--green) 8%);color:var(--ink)}.tree,.runtime-panel,.file-placeholder{padding:var(--space-sm)}.tree-row{min-height:30px;display:flex;align-items:center;gap:var(--space-xs);padding-left:calc(var(--depth) * 18px);font-size:.86rem}.tree-row span{width:14px;height:14px;border-radius:3px;border:1px solid var(--rule);background:var(--panel)}.tree-row.dir{font-weight:700}.tree-row.dir span{background:var(--amber);border-color:color-mix(in oklch,var(--amber),var(--ink) 12%)}.lesson-list{list-style:none;margin:0;padding:var(--space-sm);display:grid;gap:var(--space-xs)}.lesson-list button{width:100%;border:1px solid var(--rule);border-radius:var(--radius-sm);background:var(--panel);color:var(--ink);text-align:left;display:flex;align-items:center;gap:var(--space-sm)}.lesson-list span{font-family:Recursive,Courier New,monospace;color:var(--muted)}.lesson-list .current button{border-color:var(--accent)}.lesson-list .done button{background:color-mix(in oklch,var(--panel),var(--green) 12%)}.runtime-panel{display:grid;gap:var(--space-sm)}.runtime-panel>div:not(.runtime-actions){display:flex;justify-content:space-between;gap:var(--space-sm)}.runtime-panel span,.file-placeholder p{color:var(--muted)}.runtime-actions{grid-template-columns:1fr 1fr}.bottom-nav{position:sticky;bottom:max(var(--space-md),env(safe-area-inset-bottom));display:flex;gap:var(--space-sm);align-items:center;justify-content:space-between;padding:var(--space-xs);border:1px solid var(--rule);border-radius:var(--radius-sm);background:color-mix(in oklch,var(--panel),transparent 5%);box-shadow:var(--shadow)}.lessons-toggle{flex:1;max-width:360px;font-weight:700}.nav-button{padding:0 var(--space-sm)}.progress-meter{height:10px;border-radius:999px;overflow:hidden;background:color-mix(in oklch,var(--paper),var(--ink) 7%)}.progress-meter span{display:block;height:100%;background:var(--green)}@media(max-width:430px){.shell-app{padding-left:var(--space-sm);padding-right:var(--space-sm)}h1{font-size:1.2rem}h2{font-size:1.55rem}.lesson-actions{grid-template-columns:1fr}.terminal-panel{min-height:390px}.command-line{grid-template-columns:1fr auto}.command-line label{grid-column:1 / -1}}@media(min-width:900px){.shell-app{padding:var(--space-lg)}.topbar{max-width:1180px;width:100%;margin:0 auto}.course-shell{width:min(1180px,100%);margin:0 auto;grid-template-columns:310px minmax(420px,1fr) 280px;align-items:stretch}.lesson-panel,.progress-panel{min-height:0}.terminal-panel{min-height:calc(100dvh - 190px)}.bottom-nav{width:min(1180px,100%);margin:0 auto}}.vm-notice{margin:var(--space-sm) 0;padding:var(--space-sm);border:1px solid var(--rule);border-radius:var(--radius-sm);background:color-mix(in oklch,var(--panel),var(--amber) 12%);display:flex;flex-direction:column;gap:var(--space-2xs)}.vm-notice strong{font-size:.9rem}.vm-notice p{margin:0;color:var(--muted);font-size:.85rem}.vm-notice .button{margin-top:var(--space-2xs)}.lesson-list .module-head{display:flex;align-items:baseline;justify-content:space-between;margin-top:var(--space-sm);padding:var(--space-2xs) var(--space-xs);font-weight:700;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--rule)}.lesson-list .module-head:first-child{margin-top:0}.lesson-list .module-head em{font-style:normal;font-variant-numeric:tabular-nums}.vm-tag{margin-left:var(--space-2xs);padding:0 4px;border-radius:4px;font-size:.62rem;font-style:normal;font-weight:700;letter-spacing:.04em;vertical-align:middle;color:var(--green);background:color-mix(in oklch,var(--panel),var(--green) 16%)}.topbar-progress{height:4px;border-radius:999px;overflow:hidden;background:color-mix(in oklch,var(--paper),var(--ink) 8%);margin:calc(-1 * var(--space-xs)) 0 var(--space-2xs)}.topbar-progress span{display:block;height:100%;background:var(--green);transition:width .3s ease}.vm-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-sm);text-align:center;min-height:240px;padding:var(--space-lg);color:var(--terminal-ink)}.vm-state strong{font-size:1.05rem}.vm-state .vm-status{margin:0;font-family:Recursive,monospace;color:color-mix(in oklch,var(--terminal-ink),transparent 25%)}.vm-state .vm-hint{margin:0;max-width:42ch;font-size:.85rem;color:color-mix(in oklch,var(--terminal-ink),transparent 40%)}.vm-state.error strong{color:color-mix(in oklch,var(--red),white 30%)}.vm-state .button{margin-top:var(--space-xs)}.spinner{width:28px;height:28px;border-radius:50%;border:3px solid color-mix(in oklch,var(--terminal-ink),transparent 75%);border-top-color:var(--green);animation:cll-spin .8s linear infinite}.spinner.small{width:13px;height:13px;border-width:2px;display:inline-block;vertical-align:-2px}@keyframes cll-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.running-indicator{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-2xs) 0 var(--space-xs);color:color-mix(in oklch,var(--terminal-ink),transparent 25%);font-family:Recursive,monospace;font-size:.85rem}.run-button.stop{background:var(--red);border-color:var(--red);color:#fff}.progress-panel{position:fixed;top:0;right:0;bottom:0;width:min(360px,88vw);z-index:60;display:flex;flex-direction:column;background:var(--panel);border-left:1px solid var(--rule);box-shadow:var(--shadow);transform:translate(100%);transition:transform .25s ease;overflow:hidden}.progress-panel.open{transform:none}@media(prefers-reduced-motion:reduce){.progress-panel{transition:none}}.progress-head{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--rule);position:sticky;top:0;background:var(--panel)}.progress-head .progress-count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.85rem}.drawer-close{margin-left:auto;border:0;background:transparent;font-size:1.1rem;line-height:1;padding:var(--space-2xs) var(--space-xs);color:var(--muted);cursor:pointer}.progress-panel .lesson-list{margin:0;padding:var(--space-xs) var(--space-sm) var(--space-lg);overflow-y:auto}.drawer-scrim{position:fixed;inset:0;z-index:55;background:color-mix(in oklch,var(--ink),transparent 55%)}@media(min-width:900px){.progress-panel{position:static;transform:none;width:auto;z-index:auto;border:1px solid var(--rule);border-radius:var(--radius-sm);overflow:hidden}.progress-head .drawer-close,.lessons-toggle,.drawer-scrim{display:none}}