:root{
  color-scheme:dark;--bg:#050a08;--panel:#09120e;--panel-2:#0d1913;--code-bg:#07100b;
  --line:rgba(125,190,151,.18);--text:#effbf3;--text-dim:#a2b8aa;--text-faint:#73907d;
  --cyan:#58ff9d;--cyan-dim:rgba(88,255,157,.18);--red:#ff7c7c;--red-dim:rgba(109,22,22,.28);--amber:#ffd25f;
}
html{scroll-behavior:smooth}
body{display:block;min-height:100vh;min-height:100svh;overflow-x:hidden;overflow-y:auto;background:radial-gradient(ellipse at 15% -10%,rgba(48,255,142,.12),transparent 35%),linear-gradient(rgba(70,255,151,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(70,255,151,.022) 1px,transparent 1px),var(--bg);background-size:auto,32px 32px,32px 32px,auto}
.course-app{min-height:100vh;min-height:100svh}
.course-topbar{position:sticky;top:0;z-index:20;min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:11px clamp(16px,3vw,34px);border-bottom:1px solid var(--line);background:rgba(4,9,7,.9);backdrop-filter:blur(18px)}
.course-brand{display:flex;align-items:center;gap:11px;min-width:0}
.course-brand-mark{width:36px;height:36px;flex:none;display:grid;place-items:center;border:1px solid rgba(88,255,157,.32);border-radius:11px;background:rgba(88,255,157,.08);color:var(--cyan);font:700 .95rem 'IBM Plex Mono',monospace}
.course-brand-copy{display:grid;line-height:1.25}
.course-brand-copy strong{font-size:.88rem;letter-spacing:.01em}
.course-brand-copy span{margin-top:3px;color:var(--text-faint);font:600 .62rem 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase}
.course-top-links{display:flex;align-items:center;gap:7px}
.course-top-links a{display:inline-flex;align-items:center;min-height:36px;padding:0 11px;border:1px solid transparent;border-radius:9px;color:var(--text-dim);font-size:.78rem;text-decoration:none}
.course-top-links a:hover{border-color:var(--line);background:rgba(255,255,255,.035);color:var(--text)}
.course-top-links .back-link{border-color:rgba(88,255,157,.23);background:rgba(88,255,157,.07);color:var(--cyan)}
.course-workspace{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:calc(100vh - 72px);min-height:calc(100svh - 72px)}
.course-sidebar{position:sticky;top:72px;align-self:start;height:calc(100vh - 72px);height:calc(100svh - 72px);overflow-y:auto;padding:23px 15px 25px;border-right:1px solid var(--line);background:rgba(5,12,8,.76)}
.course-sidebar-heading{padding:2px 9px 17px}
.sidebar-eyebrow{color:var(--cyan);font:700 .63rem 'IBM Plex Mono',monospace;letter-spacing:.13em;text-transform:uppercase}
.course-sidebar-heading h2{margin:9px 0 6px;color:var(--text);font-size:1rem;line-height:1.4;letter-spacing:-.02em}
.course-sidebar-heading p{margin:0;color:var(--text-faint);font-size:.75rem}
.course-progress{margin:0 7px 16px;padding:12px;border:1px solid var(--line);border-radius:11px;background:linear-gradient(150deg,rgba(14,31,20,.85),rgba(8,17,12,.85))}
.progress-copy{display:flex;justify-content:space-between;gap:8px;margin-bottom:9px;color:var(--text-faint);font-size:.69rem}
.progress-copy strong{color:var(--text);font:600 .7rem 'IBM Plex Mono',monospace}
.progress-track{height:5px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}
.progress-fill{width:4.55%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4ce88b,#54dfc4);box-shadow:0 0 12px rgba(88,255,157,.35);transition:width .25s ease}
.outline-list{display:grid;gap:3px}
.outline-link{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr);gap:9px;align-items:start;padding:9px 8px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--text-dim);text-align:left;font:400 .75rem/1.4 'Inter',sans-serif;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.outline-link:hover{background:rgba(255,255,255,.035);color:var(--text)}
.outline-link[aria-current=step]{border-color:rgba(88,255,157,.18);background:rgba(88,255,157,.08);color:var(--text)}
.outline-number{color:var(--text-faint);font:600 .65rem/1.5 'IBM Plex Mono',monospace}
.outline-link[aria-current=step] .outline-number{color:var(--cyan)}
.course-main{min-width:0;display:flex;flex-direction:column}
.course-context{width:min(100%,1210px);display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 auto;padding:20px clamp(18px,3vw,42px) 0;color:var(--text-faint);font:600 .64rem 'IBM Plex Mono',monospace;letter-spacing:.11em;text-transform:uppercase}
.course-context-label{display:flex;align-items:center;gap:8px}
.course-context-label::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px rgba(88,255,157,.55)}
.course-context-title{overflow:hidden;color:var(--text-dim);font:500 .7rem 'Inter',sans-serif;letter-spacing:0;text-overflow:ellipsis;white-space:nowrap;text-transform:none}
.mobile-outline{display:none}
.slides-viewport{width:min(100%,1210px);min-width:0;margin:0 auto;padding:14px clamp(18px,3vw,42px) 28px}
.slide{display:none;min-height:calc(100svh - 190px);height:auto;overflow:visible;padding:clamp(20px,3vw,38px);border:1px solid var(--line);border-radius:17px;background:linear-gradient(150deg,rgba(10,19,14,.95),rgba(7,13,10,.97));box-shadow:0 18px 48px rgba(0,0,0,.22)}
.slide.active{display:block}
.slide-header{align-items:flex-start;gap:14px;padding-bottom:14px;border-bottom:1px solid rgba(88,255,157,.22);margin-bottom:22px}
.slide-header h1{max-width:850px;font-size:clamp(1.2rem,2.2vw,1.72rem);line-height:1.3;letter-spacing:-.025em;overflow-wrap:anywhere}
.chap-tag{flex:none;border-color:var(--line);background:rgba(88,255,157,.06);color:var(--cyan)}
h2{color:var(--amber)}
h3{color:var(--cyan)}
p,li{line-height:1.62}
.card{border-color:var(--line);background:rgba(15,28,20,.72)}
.card-cmd{border-left-color:var(--cyan)}
.card-alert{border-color:var(--red);background:var(--red-dim)}
.card-success{border-color:var(--cyan);background:rgba(88,255,157,.1)}
code{border-color:var(--line);background:var(--code-bg);color:var(--cyan)}
pre{max-width:100%;border-color:var(--line);background:var(--code-bg);color:#c5d8ca}
.grid-2,.grid-3{align-items:stretch}
.footer-controls{position:sticky;bottom:0;z-index:12;flex:none;width:100%;height:auto;min-height:74px;gap:14px;padding:10px clamp(16px,3vw,34px);border-top:1px solid var(--line);border-radius:0;background:rgba(5,11,8,.93);backdrop-filter:blur(18px)}
.btn-nav{min-width:132px;min-height:44px;padding:9px 14px;border-color:var(--line);background:linear-gradient(180deg,#112118,#09120d);color:var(--text);font:600 .77rem 'Inter',sans-serif}
.btn-nav:hover:not(:disabled){border-color:var(--line-strong);color:var(--cyan)}
.btn-nav:disabled{opacity:.42;cursor:not-allowed}
.slide-status{display:flex;flex-direction:column;align-items:center;gap:6px}
.slide-counter{color:var(--text-dim);font:600 .68rem 'IBM Plex Mono',monospace}
.slide-status .mini-track{width:min(180px,22vw);height:3px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.08)}
.slide-status .mini-fill{width:4.55%;height:100%;background:var(--cyan);transition:width .25s ease}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media(max-width:980px){
 .course-workspace{grid-template-columns:235px minmax(0,1fr)}
 .course-sidebar{padding-inline:10px}
 .slides-viewport{padding-inline:18px}
 .slide{padding:24px}
 .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 .course-topbar{min-height:64px;padding:9px 14px}
 .course-brand-mark{width:33px;height:33px}
 .course-brand-copy strong{font-size:.82rem}
 .course-brand-copy span{font-size:.57rem}
 .course-top-links{gap:3px}
 .course-top-links a{min-height:34px;padding-inline:8px;font-size:.7rem}
 .course-workspace{display:block;min-height:calc(100svh - 64px)}
 .course-sidebar{display:none}
 .course-context{padding:13px 16px 0;font-size:.6rem}
 .mobile-outline{position:relative;display:block}
 .mobile-outline summary{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);color:var(--text);font:600 .7rem 'Inter',sans-serif;letter-spacing:0;text-transform:none;cursor:pointer;list-style:none}
 .mobile-outline summary::-webkit-details-marker{display:none}
 .mobile-outline summary::after{content:"⌄";color:var(--cyan)}
 .mobile-outline[open] summary::after{content:"⌃"}
 .mobile-outline nav{position:absolute;top:calc(100% + 8px);right:0;z-index:30;width:min(88vw,360px);max-height:min(62svh,520px);overflow:auto;padding:8px;border:1px solid var(--line-strong);border-radius:12px;background:#07110b;box-shadow:0 20px 55px rgba(0,0,0,.6)}
 .slides-viewport{padding:12px 12px 22px}
 .slide{min-height:0;padding:20px 17px;border-radius:13px}
 .slide-header{flex-direction:column;align-items:flex-start;margin-bottom:18px}
 .slide-header h1{font-size:1.25rem}
 .chap-tag{font-size:.65rem}
 .grid-2,.grid-3{grid-template-columns:minmax(0,1fr);gap:11px}
 .concept-grid{grid-template-columns:minmax(0,1fr)!important}
 .flow{flex-direction:column}
 .flow-arrow{justify-content:center;transform:rotate(90deg)}
 .footer-controls{min-height:68px;gap:7px;padding:9px 10px calc(9px + env(safe-area-inset-bottom))}
 .btn-nav{min-width:0;min-height:44px;padding:8px 11px;font-size:.7rem}
 .slide-counter{font-size:.61rem}
 .slide-status{min-width:92px}
 .slide-status .mini-track{width:90px}
}
@media(max-width:390px){
 .course-top-links a{padding-inline:6px;font-size:.65rem}
 .course-brand{gap:7px}
 .course-top-links .resource-link{display:none}
 .slide{padding:18px 14px}
 .btn-nav{font-size:.66rem}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

.course-site-credit{display:flex;justify-content:center;gap:5px;padding:15px 12px 18px;border-top:1px solid var(--line);background:rgba(4,9,7,.72);color:var(--text-faint);font:500 .72rem/1.4 Inter,ui-sans-serif,system-ui,sans-serif}.course-site-credit a{color:var(--cyan);text-decoration:underline;text-underline-offset:2px}
