:root{ --bg:#ffffff; --fg:#1b1f1b; --muted:#55655a; --link:#0a7a3e; --link-hover:#055a2c; --border:#e6eee7; --accent:#0a7a3e; }
[data-theme="dark"]{ --bg:#000; --fg:#cfe9cf; --muted:#8aa18a; --link:#a6f3a6; --link-hover:#c9ffcb; --border:#233027; --accent:#8ff08f; }
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{ background:var(--bg); color:var(--fg); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono','Courier New', monospace; font-size:15px; line-height:1.55; }
.container{ max-width:980px; margin:0 auto; padding:28px 16px 96px; }
.header{ margin-bottom:26px; display:flex; flex-direction:column; gap:8px; }
.logo img{ height:28px; width:auto; display:block; }
.meta{ color:var(--muted); font-size:13px; line-height:1.4; }
.nav{ margin:6px 0 6px; font-size:14px; }
.nav a{ color:var(--link); text-decoration:none; padding:0 4px; border-radius:6px; border-bottom:1px dotted transparent; }
.nav a:hover{ border-color:var(--link-hover); }
.prompt{ margin:8px 0 14px; }
.prompt .tag{ color: var(--muted); }
h1,h2,h3{ font-size:1em; margin:20px 0 12px; }
main h1:first-child{ margin-top: 6px; }
.block{ padding-left:2ch; }
ul{ margin:0.25rem 0 1rem; padding-left:2ch; }
hr{ border:0; border-top:1px solid var(--border); margin:16px 0; }
kbd{ background:#eef5ef; border:1px solid var(--border); border-radius:4px; padding:0 4px; color:var(--accent); }
[data-theme="dark"] kbd{ background:#0f1617; border-color:#233027; color:#8ff08f; }
.footer{ margin-top:48px; padding-top:16px; color:var(--muted); border-top:1px solid var(--border); display:flex; gap:1ch; flex-wrap:wrap; font-size:13px; align-items:center; }
.footer a{ color:var(--link); text-decoration:none; }
.footer a:hover{ color:var(--link-hover); border-bottom:1px dotted var(--link-hover); }
.footer .legend{ margin-left:auto; opacity:0.9; }
.list-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:14px; }
.card{ border:1px solid var(--border); border-radius:12px; padding:14px; }
.card a{ color:var(--link); text-decoration:none; display:block; }
table{ width:100%; border-collapse:collapse; display:block; overflow-x:auto; }
th,td{ border:1px solid var(--border); padding:6px 8px; text-align:left; white-space:nowrap; }
.notice{ border:1px solid var(--border); padding:10px 12px; border-radius:8px; background:#f8fbf8; }
[data-theme="dark"] .notice{ background:#0b0f10; }
.theme-toggle{ font-size:12px; display:inline-flex; gap:8px; align-items:center; }
.theme-toggle img{ height:16px; width:16px; vertical-align:middle; }
#helpOverlay{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.6); z-index:1000; }
#helpOverlay .panel{ background:#111; color:#cfe9cf; padding:18px; border-radius:12px; border:1px solid #233027; max-width:680px; width:92%; }
#helpOverlay h3{ margin:0 0 8px 0; font-size:1em; }
#helpOverlay code{ background:#0b0f10; padding:2px 4px; border-radius:6px; border:1px solid #233027; color:#8ff08f; }
.lecture-meta{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; font-size:14px; color:var(--muted); border:1px solid var(--border); border-radius:10px; padding:10px 12px; margin:6px 0 14px; }
.lecture-meta a{ color:var(--link); text-decoration:none; }
.slides-frame{ position:relative; width:100%; aspect-ratio: 16/9; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:#000; }
.slides-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
@media (max-width:640px){ .container{ padding:22px 12px 80px; } .logo img{ height:22px; } .list-grid{ grid-template-columns: 1fr; } }