:root{--page:#f5f2e9;--surface:#fffdf8;--surface-strong:#fff;--surface-muted:#eeebe2;--ink:#172121;--muted:#5e6a68;--line:#c9cec9;--line-strong:#172121;--accent:#155f58;--accent-hover:#0d4d47;--accent-soft:#d7efe8;--lime:#d8ff72;--coral:#ff7a59;--danger:#9c352e;--danger-soft:#fff0ed;--success:#176b45;--success-soft:#e7f7ed;--focus:#b63d24;--shadow:6px 6px 0 #17212124}:root[data-theme=dark]{--page:#0c1413;--surface:#121d1b;--surface-strong:#172422;--surface-muted:#1c2927;--ink:#eaf4f1;--muted:#a5b3af;--line:#3b4946;--line-strong:#dce9e5;--accent:#72d5c4;--accent-hover:#95e5d8;--accent-soft:#1c3b35;--lime:#c7ef66;--coral:#ff9a80;--danger:#ffaaa1;--danger-soft:#39211f;--success:#8fe1b1;--success-soft:#173329;--focus:#ff9a80;--shadow:6px 6px 0 #00000052}*{box-sizing:border-box}html{background:var(--page);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;scroll-behavior:smooth;min-width:320px}html[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:linear-gradient(#17212109 1px, transparent 1px), linear-gradient(90deg, #17212109 1px, transparent 1px), var(--page);min-height:100vh;color:var(--ink);font-family:var(--font-geist-sans), Arial, Helvetica, sans-serif;background-size:28px 28px;margin:0}button,select,summary{font:inherit}button,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible,[tabindex="-1"]:focus-visible{outline:3px solid var(--focus);outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:1000;border:2px solid var(--line-strong);background:var(--surface-strong);box-shadow:3px 3px 0 var(--line-strong);color:var(--ink);border-radius:8px;padding:10px 14px;font-weight:800;text-decoration:none;position:fixed;top:12px;left:12px;transform:translateY(calc(-100% - 16px))}.skip-link:focus{transform:translateY(0)}.lab-shell{min-height:100vh}.topbar{z-index:20;border-bottom:2px solid var(--line-strong);background:color-mix(in srgb, var(--surface) 94%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);justify-content:space-between;align-items:center;min-height:76px;padding:12px 22px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:11px;text-decoration:none;display:inline-flex}.brand-mark{border:2px solid var(--line-strong);background:var(--lime);width:42px;height:42px;box-shadow:3px 3px 0 var(--line-strong);color:#172121;border-radius:12px 12px 4px;place-items:center;font-size:22px;font-weight:850;display:grid;transform:rotate(-2deg)}.brand>span:last-child{gap:1px;display:grid}.brand strong{letter-spacing:-.03em;font-size:18px}.brand small{color:var(--muted);font-size:12px}.topbar-actions{align-items:center;gap:18px;display:flex}.progress-meter{color:var(--muted);font-family:var(--font-geist-mono), monospace;grid-template-columns:auto 104px;align-items:center;gap:10px;font-size:12px;font-weight:700;display:grid}.progress-track{border:1px solid var(--line-strong);background:var(--surface-muted);border-radius:99px;height:7px;position:relative;overflow:hidden}.progress-track>span{background:var(--accent);transition:width .24s;display:block;position:absolute;inset:0 auto 0 0}.icon-button{border:1.5px solid var(--line-strong);background:var(--surface);width:42px;height:42px;color:var(--ink);cursor:pointer;border-radius:50%;place-items:center;font-size:20px;display:grid}.icon-button:hover:not(:disabled){background:var(--accent-soft)}.mobile-exercise-picker{display:none}.course-layout{grid-template-columns:284px minmax(0,1fr);min-height:calc(100vh - 76px);display:grid}.course-sidebar{border-right:2px solid var(--line-strong);background:var(--surface);align-self:start;height:calc(100vh - 76px);position:sticky;top:76px;overflow:auto}.sidebar-heading{border-bottom:1px solid var(--line);gap:7px;padding:24px 22px 20px;display:grid}.sidebar-heading span{color:var(--muted);font-family:var(--font-geist-mono), monospace;letter-spacing:.11em;text-transform:uppercase;font-size:11px;font-weight:800}.sidebar-heading strong{font-size:16px;line-height:1.25}.exercise-list{gap:6px;margin:0;padding:14px;list-style:none;display:grid}.exercise-link{width:100%;min-height:74px;color:var(--ink);cursor:pointer;text-align:left;background:0 0;border:1.5px solid #0000;border-radius:12px;grid-template-columns:34px 1fr;align-items:center;gap:12px;padding:10px;text-decoration:none;display:grid}.exercise-link:hover{border-color:var(--line);background:var(--surface-muted)}.exercise-link[aria-current=step]{border-color:var(--line-strong);background:var(--accent-soft);box-shadow:3px 3px 0 var(--line-strong)}.exercise-number{border:1.5px solid var(--line);width:32px;height:32px;color:var(--muted);font-family:var(--font-geist-mono), monospace;border-radius:50%;place-items:center;font-size:11px;font-weight:800;display:grid}.exercise-link.done .exercise-number{border-color:var(--success);background:var(--success);color:var(--surface)}.exercise-link.skipped .exercise-number{border-color:var(--coral);color:var(--coral)}.exercise-link>span:last-child{gap:5px;display:grid}.exercise-link strong{font-size:13px;line-height:1.25}.exercise-link small{color:var(--muted);font-family:var(--font-geist-mono), monospace;font-size:10px}.sidebar-note{border:1px dashed var(--line);color:var(--muted);border-radius:12px;align-items:center;gap:12px;margin:18px 14px;padding:13px;display:flex}.sidebar-note>span{font-family:var(--font-geist-mono), monospace;font-size:21px}.sidebar-note p{margin:0;font-size:11px;line-height:1.55}.workspace{width:100%;max-width:1560px;margin:0 auto;padding:38px clamp(22px,3.4vw,58px) 30px}.exercise-intro{grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);align-items:start;gap:clamp(26px,4vw,72px);margin-bottom:30px;display:grid}.kicker{color:var(--accent);font-family:var(--font-geist-mono), monospace;letter-spacing:.13em;text-transform:uppercase;margin:0 0 9px;font-size:11px;font-weight:850}.exercise-intro h1{letter-spacing:-.055em;max-width:760px;margin:0;font-size:clamp(34px,4.3vw,66px);font-weight:780;line-height:.98}.exercise-summary{max-width:700px;color:var(--muted);margin:20px 0 0;font-size:clamp(16px,1.35vw,20px);line-height:1.55}.task-card{border:2px solid var(--line-strong);background:var(--surface);box-shadow:var(--shadow);border-radius:16px;padding:20px 22px}.task-label{color:var(--muted);font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px;font-size:11px;font-weight:800}.task-card ol{gap:9px;margin:0;padding-inline-start:25px;line-height:1.45;display:grid}.task-card li::marker{color:var(--accent);font-family:var(--font-geist-mono), monospace;font-weight:800}.workbench{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:16px;display:grid}.panel{border:2px solid var(--line-strong);background:var(--surface);min-width:0;height:560px;box-shadow:4px 4px 0 color-mix(in srgb, var(--line-strong) 15%, transparent);border-radius:14px;overflow:hidden}.panel-bar{border-bottom:1px solid var(--line);background:var(--surface-muted);min-height:48px;font-family:var(--font-geist-mono), monospace;justify-content:space-between;align-items:center;gap:12px;padding:8px 12px;font-size:11px;font-weight:720;display:flex}.panel-bar>div{align-items:center;gap:8px;display:flex}.file-tab{border:1px solid var(--line);background:var(--surface);border-radius:8px;min-height:32px;padding:6px 9px}.file-icon{color:var(--accent);font-weight:900}.dirty-dot{background:var(--coral);border-radius:50%;width:7px;height:7px}.status-dot{background:var(--success);width:8px;height:8px;box-shadow:0 0 0 3px var(--success-soft);border-radius:50%}.preview-status{color:var(--muted);font-size:10px;font-weight:500}.code-editor{height:calc(100% - 48px);overflow:hidden}.code-editor .cm-editor{height:100%}.preview-frame{background:#fff;border:0;width:100%;height:calc(100% - 48px);display:block}.text-button{min-height:32px;color:var(--accent);cursor:pointer;text-decoration:underline;-webkit-text-decoration-color:color-mix(in srgb, var(--accent) 35%, transparent);text-decoration-color:color-mix(in srgb, var(--accent) 35%, transparent);text-underline-offset:3px;background:0 0;border:0;border-radius:6px;padding:4px 7px;font-size:12px;font-weight:750}.text-button:hover:not(:disabled){background:var(--accent-soft);text-decoration-color:currentColor}.action-strip{flex-wrap:wrap;gap:10px;margin:16px 0 20px;display:flex}.button{border:1.5px solid var(--line-strong);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:14px;min-height:44px;padding:10px 17px;font-weight:780;line-height:1;display:inline-flex}.primary-button{background:var(--accent);color:var(--surface);box-shadow:3px 3px 0 var(--line-strong)}:root[data-theme=dark] .primary-button{color:#0c1413}.primary-button:hover:not(:disabled){background:var(--accent-hover);box-shadow:4px 4px 0 var(--line-strong);transform:translate(-1px,-1px)}.primary-button:active:not(:disabled){box-shadow:1px 1px 0 var(--line-strong);transform:translate(2px,2px)}.secondary-button{background:var(--surface);color:var(--ink)}.secondary-button:hover:not(:disabled){background:var(--accent-soft)}.button.compact{min-height:38px;padding:8px 13px;font-size:13px}.results-panel{border:2px solid var(--line-strong);background:var(--surface);border-radius:16px;padding:22px}.results-panel.success{background:linear-gradient(135deg, var(--success-soft), transparent 55%), var(--surface)}.results-heading{justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px;display:flex}.results-heading h2{letter-spacing:-.035em;margin:0;font-size:clamp(22px,2vw,30px)}.results-heading h2:focus{outline:none}.results-heading h2:focus-visible{outline:3px solid var(--focus);outline-offset:5px}.result-score{border:1.5px solid var(--line-strong);background:var(--lime);color:#172121;width:56px;height:56px;font-family:var(--font-geist-mono), monospace;border-radius:50%;flex:none;place-items:center;font-size:14px;font-weight:850;display:grid}.empty-result{border:1px dashed var(--line);min-height:76px;color:var(--muted);border-radius:12px;align-items:center;gap:14px;padding:16px;display:flex}.empty-result>span{color:var(--accent);font-size:28px}.empty-result p{margin:0;line-height:1.5}.check-list{gap:9px;margin:0;padding:0;list-style:none;display:grid}.check-list li{border:1px solid var(--line);border-radius:11px;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;display:grid}.check-list li.check-fail{border-color:color-mix(in srgb, var(--danger) 45%, var(--line));background:var(--danger-soft)}.check-list li.check-pass{border-color:color-mix(in srgb, var(--success) 40%, var(--line));background:var(--success-soft)}.check-icon{border:1.5px solid;border-radius:50%;place-items:center;width:30px;height:30px;font-size:17px;font-weight:900;display:grid}.check-pass .check-icon{color:var(--success)}.check-fail .check-icon{color:var(--danger)}.check-list strong{font-size:14px}.check-list p{color:var(--muted);margin:3px 0 0;font-size:13px;line-height:1.45}.line-button{border:1px solid var(--line-strong);background:var(--surface);min-height:32px;color:var(--ink);cursor:pointer;font-family:var(--font-geist-mono), monospace;border-radius:7px;padding:5px 9px;font-size:10px}.line-button:hover{border-color:var(--line-strong)}.result-actions{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;padding-top:14px;display:flex}.result-actions .primary-button{margin-left:auto}.result-actions:empty{display:none}.stuck-panel{border:2px solid var(--line-strong);background:var(--surface);border-radius:14px;margin-top:16px}.stuck-panel>summary{color:var(--accent);cursor:pointer;padding:17px 20px;font-size:16px;font-weight:800}.stuck-panel[open]>summary{border-bottom:1px solid var(--line)}.stuck-content{padding:18px 20px 20px}.stuck-content>p{max-width:850px;color:var(--muted);margin:0 0 18px;line-height:1.6}.stuck-content h2{margin:0 0 9px;font-size:14px}.stuck-content ul{gap:7px;margin:0 0 17px;padding-inline-start:20px;display:grid}.stuck-content a{color:var(--accent);text-underline-offset:3px}.workspace-footer{color:var(--muted);font-family:var(--font-geist-mono), monospace;grid-template-columns:1fr auto 1fr;align-items:center;margin-top:22px;font-size:11px;display:grid}.workspace-footer button:first-child{justify-self:start}.workspace-footer button:last-child{justify-self:end}.tool-dialog{border:2px solid var(--line-strong);background:var(--surface);width:min(1120px,100vw - 32px);max-height:min(88vh,920px);color:var(--ink);border-radius:18px;padding:0;overflow:auto;box-shadow:12px 12px #00000057}.tool-dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0a1412b3}.dialog-topbar{z-index:1;border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--surface) 95%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);justify-content:space-between;align-items:center;gap:18px;padding:18px 20px;display:flex;position:sticky;top:0}.dialog-topbar h2{letter-spacing:-.04em;margin:0;font-size:clamp(24px,3vw,36px)}.dialog-close{flex:none;font-size:25px}.dialog-note{border-left:4px solid var(--coral);background:var(--surface-muted);color:var(--muted);margin:20px;padding:13px 15px;line-height:1.55}.solution-grid{grid-template-columns:1fr 1fr;gap:14px;padding:0 20px 22px;display:grid}.solution-grid section{min-width:0}.solution-grid h3{margin:0 0 8px;font-size:14px}.solution-grid pre{border:1px solid var(--line);color:#e7f4f0;max-height:55vh;font-family:var(--font-geist-mono), monospace;white-space:pre;background:#101918;border-radius:12px;margin:0;padding:17px;font-size:11px;line-height:1.55;overflow:auto}.dialog-actions{gap:10px;padding:0 20px 14px;display:flex}.reader-log{gap:8px;margin:0;padding:0 20px 24px 56px;display:grid}.reader-log li{border:1px solid var(--line);background:var(--surface-muted);font-family:var(--font-geist-mono), monospace;border-radius:8px;padding:10px 12px;font-size:12px;line-height:1.45}.reader-log li::marker{color:var(--accent);font-weight:800}.tool-error{border:1px solid var(--danger);background:var(--danger-soft);color:var(--danger);border-radius:10px;margin:20px;padding:15px;line-height:1.5}.audit-clear{border:1px solid var(--success);background:var(--success-soft);border-radius:12px;align-items:center;gap:15px;margin:20px;padding:18px;display:flex}.audit-clear>span{background:var(--success);width:40px;height:40px;color:var(--surface);border-radius:50%;flex:none;place-items:center;font-size:20px;font-weight:900;display:grid}.audit-clear p{color:var(--muted);margin:4px 0 0}.audit-groups{gap:11px;padding:0 20px 24px;display:grid}.audit-card{border:1px solid var(--danger);background:var(--danger-soft);border-radius:11px;padding:16px}.audit-card.review{border-color:var(--coral);background:var(--surface-muted)}.audit-meta{color:var(--muted);font-family:var(--font-geist-mono), monospace;text-transform:uppercase;justify-content:space-between;gap:15px;font-size:10px;font-weight:750;display:flex}.audit-card h3{margin:10px 0;font-size:17px}.audit-card code{color:#e7f4f0;white-space:nowrap;background:#101918;border-radius:7px;margin-bottom:12px;padding:10px;font-size:11px;display:block;overflow:auto}.audit-card a{color:var(--accent);font-weight:750}@media (width<=1120px){.course-layout{grid-template-columns:238px minmax(0,1fr)}.workbench{grid-template-columns:1fr}.panel{height:500px}.preview-panel{height:460px}}@media (width<=900px){.course-layout{display:block}.course-sidebar{display:none}.mobile-exercise-picker{display:block}.mobile-exercise-picker select{border:1.5px solid var(--line-strong);background:var(--surface);width:min(42vw,320px);min-height:42px;color:var(--ink);border-radius:8px;padding:6px 32px 6px 10px;font-size:12px}.exercise-intro{grid-template-columns:1fr;gap:24px}}@media (width<=680px){.topbar{min-height:68px;padding:10px 13px}.brand>span:last-child,.progress-track{display:none}.progress-meter{white-space:nowrap;display:block}.brand-mark{width:38px;height:38px}.topbar-actions{gap:8px}.mobile-exercise-picker select{width:41vw;max-width:190px}.workspace{padding:28px 13px 24px}.exercise-intro h1{font-size:clamp(34px,12vw,50px)}.task-card,.results-panel{padding:17px}.panel{border-radius:11px;height:430px}.preview-panel{height:420px}.action-strip{grid-template-columns:1fr;display:grid}.action-strip .button{width:100%}.check-list li{grid-template-columns:32px minmax(0,1fr)}.line-button{grid-column:2;width:fit-content}.result-actions{flex-direction:column;align-items:stretch}.result-actions .primary-button{width:100%;margin-left:0}.workspace-footer{grid-template-columns:1fr 1fr}.workspace-footer>span{display:none}.solution-grid{grid-template-columns:1fr}.solution-grid pre{max-height:42vh}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}