/* Solarized Light, matching the Week 1 and Week 2 lecture decks. */
:root {
  --base03:#002b36; --base02:#073642; --base01:#586e75; --base00:#657b83;
  --base1:#93a1a1; --base2:#eee8d5; --base3:#fdf6e3; --border-subtle:#e4dcba;
  --blue:#268bd2; --cyan:#2aa198; --green:#859900; --violet:#6c71c4;
  --orange:#cb4b16; --yellow:#b58900; --magenta:#d33682; --red:#dc322f;
  --font-sans:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',Menlo,Consolas,monospace;
}
* { box-sizing:border-box; margin:0; padding:0; }
html,body { width:100%; height:100%; overflow:hidden; background:var(--base3); color:var(--base03); font-family:var(--font-sans); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
button,input,select { font:inherit; }
button { cursor:pointer; }
button:disabled { opacity:.4; cursor:not-allowed; }
button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
a { color:var(--blue); }
.app-header { position:fixed; inset:0 0 auto; height:52px; background:rgba(238,232,213,.96); border-bottom:1px solid var(--border-subtle); display:flex; align-items:center; justify-content:space-between; padding:0 24px; z-index:100; }
.header-brand,.header-actions { display:flex; align-items:center; gap:12px; }
.course-badge { background:var(--base02); color:var(--base3); font-size:.75rem; font-weight:700; letter-spacing:.05em; padding:3px 8px; border-radius:6px; text-decoration:none; white-space:nowrap; }
.session-title { font-size:.95rem; font-weight:600; }
.header-actions { gap:6px; }
.header-btn { background:transparent; border:1px solid transparent; color:var(--base01); padding:6px 10px; border-radius:6px; font-size:.85rem; font-weight:600; }
.header-btn:hover { color:var(--blue); border-color:var(--border-subtle); }
.header-btn[aria-pressed="true"] { background:var(--blue); color:var(--base3); }
.progress-bar-container { position:absolute; bottom:0; left:0; width:100%; height:3px; background:rgba(0,43,54,.06); }
.progress-bar { height:100%; background:linear-gradient(90deg,var(--blue),var(--cyan)); transition:width .2s; }
.slide-deck { position:fixed; inset:52px 0 64px; display:flex; align-items:center; justify-content:center; padding:12px 24px; }
.slide { width:min(1200px,94vw); height:min(740px,calc(100dvh - 140px)); background:var(--base3); border:1px solid var(--border-subtle); border-radius:16px; box-shadow:0 6px 18px rgba(0,43,54,.08); padding:24px 32px; display:none; flex-direction:column; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--border-subtle) transparent; }
.slide.active { display:flex; }
.slide-meta { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; gap:10px; }
.slide-tag { color:var(--cyan); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.slide-tag::before { content:'●'; font-size:.65rem; margin-right:7px; }
.slide-number-pill { font-family:var(--font-mono); font-size:.75rem; white-space:nowrap; background:var(--base2); border:1px solid var(--border-subtle); border-radius:20px; padding:2px 8px; color:var(--base01); }
.slide-title { font-size:1.75rem; line-height:1.25; font-weight:700; letter-spacing:-.025em; margin-bottom:10px; }
.slide-subtitle { color:var(--base01); font-size:1rem; line-height:1.5; margin:-3px 0 18px; }
.slide-body { flex:1; display:flex; flex-direction:column; gap:16px; min-height:0; }
.grid-2col,.grid-3col,.grid-4col { display:grid; gap:20px; align-items:stretch; }
.grid-2col { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.grid-3col { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4col { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.stack { display:flex; flex-direction:column; gap:14px; min-width:0; }
.card { background:var(--base2); border:1px solid var(--border-subtle); border-radius:10px; padding:16px 20px; min-width:0; }
.card-primary { border-left:4px solid var(--blue); }
.card-cyan { border-left:4px solid var(--cyan); }
.card-warning { border-left:4px solid var(--yellow); }
.card-violet { border-left:4px solid var(--violet); }
h3 { color:var(--base02); font-size:1.06rem; line-height:1.4; font-weight:700; margin-bottom:10px; }
p { font-size:.94rem; }
p+p,p+h3 { margin-top:10px; }
.key-list { padding-left:19px; font-size:.94rem; }
.key-list li { padding-left:3px; margin-bottom:9px; }
.key-list li::marker { color:var(--blue); }
.key-list li:last-child { margin-bottom:0; }
.formula-box { margin:10px 0; padding:6px 4px; text-align:center; font-size:1rem; min-width:0; }
.formula-box.highlight { padding:12px 8px; background:rgba(38,139,210,.07); border:1px solid rgba(38,139,210,.2); border-radius:8px; }
.katex { font-size:1.08em; }
.katex-display { margin:.35em 0; overflow-x:auto; overflow-y:hidden; padding:3px 0; }
.callout { border-left:3px solid var(--cyan); background:rgba(42,161,152,.07); border-radius:0 6px 6px 0; padding:12px 16px; font-size:.91rem; line-height:1.55; }
.callout.warning { border-color:var(--yellow); background:rgba(181,137,0,.07); }
.small { font-size:.81rem; line-height:1.5; color:var(--base01); }
.visual-panel { display:flex; flex-direction:column; align-items:stretch; justify-content:center; border:1px solid var(--border-subtle); border-radius:10px; padding:12px 16px; min-width:0; background:rgba(255,255,255,.16); }
svg { display:block; width:100%; overflow:hidden; flex-shrink:0; }
.visual-panel>svg { max-height:340px; }
figcaption { text-align:center; color:var(--base01); font-size:.9rem; line-height:1.5; margin:8px 0; }
.visual-panel>.small { text-align:center; margin-top:8px; }
.figure-heading { font-size:.85rem; font-weight:600; color:var(--base01); text-align:center; margin-bottom:4px; }
.controls { display:grid; grid-template-columns:1fr; gap:5px; margin-top:8px; }
.controls label,.inline-slider label { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:.82rem; font-weight:600; }
output { font-family:var(--font-mono); color:var(--blue); white-space:nowrap; }
input[type="range"] { width:100%; accent-color:var(--blue); cursor:pointer; min-height:22px; }
.control-btn { padding:6px 12px; border:1px solid var(--border-subtle); background:var(--base3); border-radius:6px; color:var(--base02); font-size:.83rem; font-weight:600; }
.control-btn:hover { border-color:var(--blue); color:var(--blue); }
.control-btn[aria-pressed="true"] { background:var(--blue); color:var(--base3); border-color:var(--blue); }
.button-row,.toolbar { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; }
.toolbar { justify-content:flex-start; margin-bottom:14px; font-size:.85rem; }
select { padding:6px 10px; color:var(--base02); background:var(--base3); border:1px solid var(--border-subtle); border-radius:6px; max-width:100%; }
.inline-slider { display:grid; grid-template-columns:155px 1fr; gap:20px; align-items:center; }
.readout { background:var(--base2); border-radius:6px; color:var(--base02); padding:9px 12px; font-size:.82rem; line-height:1.5; text-align:center; }
.linked-plots { gap:16px; }
.linked-plots .visual-panel { padding:8px 12px; }
.linked-plots svg { max-height:265px; }
.mini-plot { margin:10px 0 14px; }
.curve-gallery svg { margin:6px 0; }
.curve-gallery .card { padding:14px; }
.curve-gallery figcaption { font-size:.84rem; }
.curve-gallery .formula-box { font-size:.87rem; min-height:38px; }
.solar-table { border-collapse:collapse; width:100%; font-size:.86rem; margin:8px 0 12px; }
.solar-table th,.solar-table td { text-align:left; padding:10px 8px; border-bottom:1px solid #d9d0ae; }
.solar-table th { color:var(--blue); font-size:.78rem; }
.legend-line { display:inline-block; width:22px; height:3px; vertical-align:middle; margin:0 5px 0 12px; background:var(--base01); }
.legend-line.blue { background:var(--blue); }
.legend-line.cyan { background:var(--cyan); }
.legend-line.magenta { background:var(--magenta); }
.color-cyan { color:#167f77; } .color-orange { color:var(--orange); } .color-magenta { color:var(--magenta); }
details { border-top:1px solid #d9d0ae; margin-top:12px; padding-top:10px; font-size:.9rem; }
summary { cursor:pointer; color:var(--blue); font-weight:600; width:fit-content; }
details[open]>summary { margin-bottom:10px; }
.practice-grid { grid-template-rows:repeat(2,minmax(min-content,1fr)); }
.summary-grid { gap:14px; }
.summary-grid .card { padding:12px 18px; }
.summary-grid .formula-box { margin:6px 0; }
.summary-grid p { font-size:.85rem; }
.source-note { font-size:.74rem; line-height:1.55; color:var(--base01); margin-top:auto; }
.title-slide { justify-content:center; padding:36px 48px; }
.title-badge-row { display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap; }
.title-badge { background:var(--base2); color:var(--cyan); border:1px solid var(--border-subtle); padding:4px 12px; border-radius:20px; font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.title-badge.accent { background:rgba(38,139,210,.1); color:var(--blue); border-color:rgba(38,139,210,.3); }
.title-layout { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:20px; margin:12px 0 24px; }
.title-heading { font-size:2.75rem; font-weight:800; letter-spacing:-.03em; line-height:1.18; margin-bottom:18px; }
.title-heading span { color:var(--blue); }
.title-description { font-size:1.05rem; color:var(--base01); line-height:1.6; }
.title-equation { margin-top:22px; color:var(--blue); }
.hero-figure svg { width:100%; }
.hero-figure figcaption { font-size:.82rem; }
.title-features { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.title-features>div { background:var(--base2); border:1px solid var(--border-subtle); border-radius:10px; padding:12px; display:flex; align-items:center; gap:8px; font-size:.8rem; font-weight:600; }
.title-features b { display:grid; place-items:center; min-width:26px; height:26px; border-radius:6px; background:rgba(38,139,210,.13); color:var(--blue); }
.app-footer { position:fixed; inset:auto 0 0; height:64px; background:rgba(238,232,213,.96); border-top:1px solid var(--border-subtle); display:flex; align-items:center; justify-content:space-between; padding:0 28px; z-index:100; }
.footer-left,.footer-center,.slide-dots { display:flex; align-items:center; gap:12px; }
.slide-counter { font-family:var(--font-mono); font-size:.9rem; white-space:nowrap; }
.slide-dots { gap:6px; }
.slide-dot { width:8px; height:8px; border:0; border-radius:50%; background:#c6b991; padding:0; }
.slide-dot[aria-current="step"] { width:20px; border-radius:4px; background:var(--blue); }
.nav-btn { background:var(--base3); border:1px solid var(--border-subtle); border-radius:10px; padding:8px 18px; font-size:.9rem; color:var(--base02); font-weight:600; }
.nav-btn:hover:not(:disabled) { border-color:var(--blue); color:var(--blue); }
.footer-right { font-family:var(--font-mono); font-size:.74rem; color:var(--base01); }
.modal-dialog { margin:auto; width:min(1000px,92vw); max-height:85dvh; background:var(--base3); color:var(--base03); border:1px solid var(--border-subtle); border-radius:16px; box-shadow:0 12px 32px rgba(0,43,54,.2); padding:0; }
.modal-dialog::backdrop { background:rgba(0,43,54,.6); backdrop-filter:blur(4px); }
.help-dialog { max-width:620px; }
.modal-header { display:flex; justify-content:space-between; align-items:center; padding:16px 24px; background:var(--base2); border-bottom:1px solid var(--border-subtle); }
.modal-header h2 { font-size:1.1rem; }
.modal-close { border:0; background:none; color:var(--base01); font-size:1.7rem; padding:0 6px; }
.modal-body { padding:24px; }
.slide-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:14px; }
.grid-card { background:var(--base2); border:1px solid var(--border-subtle); border-radius:10px; padding:14px; text-align:left; color:var(--base02); }
.grid-card[aria-current="step"] { border-color:var(--blue); background:rgba(38,139,210,.08); }
.grid-card-num { display:block; color:var(--cyan); font-family:var(--font-mono); font-size:.7rem; margin-bottom:6px; }
.grid-card-title { font-weight:700; font-size:.86rem; line-height:1.4; }
.noscript-notice { position:fixed; bottom:72px; left:10%; right:10%; z-index:110; background:var(--base2); padding:16px; text-align:center; }
@media (max-height:780px) and (min-width:901px) {
  .slide { padding:18px 28px; }
  .slide-subtitle { margin-bottom:12px; }
  .slide-body,.stack { gap:10px; }
  .card { padding:10px 16px; }
  .visual-panel>svg { max-height:215px; }
  .linked-plots svg { max-height:220px; }
  .formula-box { margin:6px 0; padding:4px; }
  .formula-box.highlight { padding:8px; }
  .key-list li { margin-bottom:6px; }
  details { margin-top:8px; padding-top:6px; }
}
@media (max-width:900px) {
  .slide { height:calc(100dvh - 136px); padding:22px; }
  .slide-body { flex:0 0 auto; min-height:auto; }
  .grid-2col,.grid-3col,.title-layout { grid-template-columns:1fr; }
  .grid-4col,.title-features { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .title-layout { gap:8px; margin-bottom:18px; }
  .title-slide { justify-content:flex-start; }
  .hero-figure svg { max-height:240px; }
  .visual-panel>svg { max-height:320px; }
  .title-heading { font-size:2.3rem; }
  .slide-title { font-size:1.6rem; }
  .session-title { font-size:.78rem; }
  .slide-dots,.footer-right { display:none; }
  .app-header { padding:0 12px; }
  .app-footer { padding:0 18px; }
  .practice-grid { grid-template-rows:none; }
}
@media (max-width:560px) {
  .session-title { display:none; }
  .slide { padding:18px; width:95vw; }
  .slide-tag { font-size:.63rem; }
  .slide-title { font-size:1.4rem; text-wrap:balance; }
  .slide-subtitle { font-size:.88rem; }
  .title-badge { font-size:.65rem; }
  .grid-4col { grid-template-columns:1fr; }
  .curve-gallery svg { max-height:220px; }
  .inline-slider { grid-template-columns:1fr; gap:4px; }
  .title-features { gap:8px; }
  .title-features>div { padding:8px; font-size:.73rem; }
  .card { padding:14px; }
  .formula-box { font-size:.91rem; }
  .visual-panel { padding:8px; }
  .slide-body { gap:14px; }
  .header-actions { gap:0; }
}
@media (prefers-reduced-motion:reduce) { * { transition:none!important; scroll-behavior:auto!important; } }
@media print {
  @page { size:landscape; margin:10mm; }
  html,body { height:auto; overflow:visible; }
  .app-header,.app-footer,dialog,.controls,.toolbar,.inline-slider,.button-row,.control-btn { display:none!important; }
  .slide-deck { display:block; position:static; padding:0; }
  .slide { display:flex!important; width:100%; height:auto; min-height:170mm; break-after:page; break-inside:avoid; overflow:visible; box-shadow:none; padding:20px; border:0; }
  .slide:last-child { break-after:auto; }
  .slide-body { min-height:auto; }
  .grid-2col { grid-template-columns:1fr 1fr; }
  .grid-3col { grid-template-columns:repeat(3,1fr); }
  .grid-4col { grid-template-columns:repeat(4,1fr); }
  .visual-panel>svg { max-height:270px; }
  .title-layout { grid-template-columns:1.2fr 1fr; }
  .title-features { grid-template-columns:repeat(4,1fr); }
  .card,.visual-panel { break-inside:avoid; }
  * { print-color-adjust:exact; -webkit-print-color-adjust:exact; }
}