:root {
    --bg:#fff; --fg:#1a1a1a; --muted:#6b7280; --hair:#e7e7e9;
    --tag-bg:#f1f2f4; --tag-fg:#555b66; --accent:#1a1a1a; --card:#fafafa; --chip:#fff; --gold:#b78a2e;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --bg:#0f1011; --fg:#ededee; --muted:#9aa0a8; --hair:#26282b;
      --tag-bg:#1a1c1e; --tag-fg:#b6bcc4; --accent:#ededee; --card:#161719; --chip:#f4f5f6; --gold:#d8ab4e;
    }
  }
  * { box-sizing: border-box; }
  html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
  body {
    margin:0; background:var(--bg); color:var(--fg);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  }
  .wrap { max-width:780px; margin:0 auto; padding:32px 24px 120px; }
  .topnav { position:sticky; top:0; z-index:30; background:var(--bg); border-bottom:1px solid var(--hair); }
  .topnav-inner { max-width:780px; margin:0 auto; padding:9px 24px; display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
  .topnav-inner::-webkit-scrollbar { display:none; }
  .topnav a { font-size:0.8rem; color:var(--muted); white-space:nowrap; padding:4px 11px; border-radius:8px; border:1px solid transparent; transition:color .15s ease, background .15s ease, border-color .15s ease; }
  .topnav a:hover { color:var(--fg); background:var(--card); text-decoration:none; opacity:1; }
  .topnav a.active { color:var(--fg); background:var(--card); border-color:var(--hair); }
  a { color:var(--fg); text-decoration:none; text-underline-offset:3px; text-decoration-thickness:1px; transition:opacity .15s ease; }
  a:hover { text-decoration:underline; opacity:.7; }

  .brand { display:flex; align-items:center; gap:12px; margin-bottom:26px; }
  .brand img { width:38px; height:38px; display:block; }
  .brand span { font-size:1.05rem; font-weight:650; letter-spacing:-0.01em; }
  .brand span b { color:var(--muted); font-weight:650; }

  h1 { font-size:1.95rem; font-weight:700; letter-spacing:-0.02em; line-height:1.2; margin:0 0 14px; }
  .lede { font-size:1.06rem; line-height:1.55; color:var(--muted); margin:0 0 12px; max-width:64ch; }
  .disclaimer { font-size:0.82rem; color:var(--muted); margin:0; }

  hr { border:0; height:1px; background:var(--hair); margin:44px 0 0; }
  .sec { scroll-margin-top:60px; padding-top:34px; }
  h2 { font-size:0.78rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); margin:0 0 4px; }
  .section-note { font-size:0.9rem; color:var(--muted); margin:0 0 22px; max-width:66ch; }

  .glossary { background:var(--card); border:1px solid var(--hair); border-radius:12px; padding:16px 18px; margin:24px 0 0; }
  .glossary .g-title { font-size:0.72rem; font-weight:700; letter-spacing:0.07em; text-transform:uppercase; color:var(--muted); margin:0 0 9px; }
  .glossary dl { margin:0; display:grid; gap:7px; }
  .glossary dt { font-weight:650; font-size:0.9rem; }
  .glossary dd { margin:0 0 3px; font-size:0.88rem; color:var(--muted); }

  .dept { margin:0 0 26px; }
  .dept-head { display:flex; align-items:center; gap:14px; }
  .rank { font-size:1.4rem; font-weight:800; width:26px; flex-shrink:0; text-align:right; color:var(--muted); opacity:.5; letter-spacing:-0.02em; }
  .logo-chip { width:50px; height:50px; border-radius:11px; background:var(--chip); border:1px solid var(--hair); flex-shrink:0; display:flex; align-items:center; justify-content:center; overflow:hidden; }
  .logo-chip .mono { font-size:0.72rem; font-weight:700; color:#2a2a2a; letter-spacing:0.01em; text-align:center; padding:0 3px; }
  .logo-chip .logo-img { max-width:80%; max-height:80%; object-fit:contain; display:block; }
  .dept-meta { flex:1; min-width:0; }
  .dept-name { font-size:1.05rem; font-weight:650; margin:0; line-height:1.3; }
  .dept-uni { font-size:0.86rem; color:var(--muted); margin:1px 0 0; }
  .dept-uni a { color:inherit; }
  .dept-uni a:hover { color:var(--fg); }
  .vasi { text-align:right; flex-shrink:0; }
  .vasi b { display:block; font-size:1.12rem; font-weight:700; letter-spacing:-0.01em; }
  .vasi small { font-size:0.66rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.03em; }
  .dept-focus-line { font-size:0.86rem; color:var(--muted); margin:7px 0 0 40px; }

  .prog { margin:11px 0 0 40px; }
  .prog > summary { cursor:pointer; font-size:0.8rem; color:var(--muted); list-style:none; display:inline-flex; gap:5px; align-items:center; user-select:none; }
  .prog > summary::-webkit-details-marker { display:none; }
  .prog > summary::before { content:"▸"; font-size:0.66rem; }
  .prog[open] > summary::before { content:"▾"; }
  .prog > summary:hover { color:var(--fg); }
  .prog-body { margin-top:11px; display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; }
  .prog-sem { background:var(--card); border:1px solid var(--hair); border-radius:10px; padding:11px 13px; }
  .prog-sem h4 { font-size:0.72rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--muted); margin:0 0 6px; }
  .prog-sem ul { margin:0; padding-left:16px; }
  .prog-sem li { font-size:0.84rem; margin:2px 0; }
  .prog-note { grid-column:1 / -1; font-size:0.78rem; color:var(--muted); margin:2px 0 0; }
  @media (max-width:600px) { .prog { margin-left:0; } .prog-body { grid-template-columns:1fr; } }

  .labs { margin:12px 0 0 40px; padding-left:20px; border-left:1px solid var(--hair); display:flex; flex-direction:column; gap:12px; }
  .lab { background:var(--card); border:1px solid var(--hair); border-radius:12px; padding:15px 16px 16px; }
  .lab-top { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
  .lab-name { font-size:0.97rem; font-weight:650; margin:0; }
  .lab-full { font-size:0.8rem; color:var(--muted); }
  .lab-tldr { font-size:0.9rem; margin:4px 0 10px; }
  .caption { font-size:0.78rem; color:var(--muted); font-style:italic; margin:0 0 9px; }
  .lab-link { margin:0 0 11px; }
  .metrics { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 12px; }
  .metric { background:var(--bg); border:1px solid var(--hair); border-radius:7px; padding:4px 9px; font-size:0.77rem; line-height:1.3; }
  .metric b { font-weight:700; } .metric span { color:var(--muted); }
  .pi { margin:11px 0 0; padding:11px 0 0; border-top:1px dashed var(--hair); }
  .pi:first-of-type { border-top:0; padding-top:0; }
  .pi-name { font-weight:600; font-size:0.93rem; margin:0; }
  .pi-name .links { display:inline-flex; gap:6px; margin-left:8px; vertical-align:1px; }
  .pi-role { font-size:0.82rem; color:var(--muted); margin:1px 0 0; }
  .tldr { font-size:0.88rem; margin:3px 0 0; }
  .hero-ach { font-size:0.83rem; margin:4px 0 0; padding-left:18px; position:relative; }
  .hero-ach::before { content:"★"; position:absolute; left:0; color:var(--gold); font-size:0.78rem; top:1px; }

  details.more-d { margin-top:6px; }
  details.more-d > summary { cursor:pointer; font-size:0.79rem; color:var(--muted); list-style:none; display:inline-flex; align-items:center; gap:5px; user-select:none; }
  details.more-d > summary::-webkit-details-marker { display:none; }
  details.more-d > summary::before { content:"▸"; font-size:0.66rem; }
  details.more-d[open] > summary::before { content:"▾"; }
  details.more-d > summary:hover { color:var(--fg); }

  .ach { list-style:none; margin:7px 0 2px; padding:0; }
  .ach li { font-size:0.85rem; position:relative; padding-left:15px; margin:2px 0; color:var(--muted); }
  .ach li::before { content:"›"; position:absolute; left:2px; }
  .links a { font-size:0.72rem; color:var(--muted); border:1px solid var(--hair); border-radius:6px; padding:0 7px; line-height:1.6; display:inline-block; }
  .links a:hover { color:var(--fg); border-color:var(--muted); text-decoration:none; opacity:1; }

  .more { display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; margin:0; padding:0; list-style:none; }
  .more li { font-size:0.86rem; padding:5px 0; border-top:1px solid var(--hair); }
  .more li b { font-weight:600; } .more li span { color:var(--muted); }

  .grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .inst { background:var(--card); border:1px solid var(--hair); border-radius:12px; padding:14px 15px 15px; display:flex; flex-direction:column; }
  .inst-head { display:flex; align-items:center; gap:8px; margin:0 0 6px; }
  .inst-logo { width:20px; height:20px; border-radius:4px; object-fit:contain; flex-shrink:0; background:var(--chip); }
  .inst-name { font-size:0.94rem; font-weight:650; margin:0; line-height:1.3; }
  .inst-org { font-size:0.79rem; color:var(--muted); margin:0 0 7px; }
  .inst-focus { font-size:0.85rem; margin:0 0 8px; }
  .inst-note { font-size:0.78rem; color:var(--muted); margin:0 0 10px; }
  .inst .links { margin-top:auto; }

  .people { margin:0; }
  .person { padding:14px 0; border-top:1px solid var(--hair); }
  .person:first-child { border-top:0; }
  .p-name { font-weight:600; margin:0; }
  .p-name .badge { font-size:0.64rem; font-weight:700; letter-spacing:0.02em; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold); border-radius:5px; padding:0 5px; margin-left:8px; vertical-align:2px; }
  .p-name .links { display:inline-flex; gap:6px; margin-left:8px; vertical-align:1px; }
  .p-role { font-size:0.86rem; color:var(--muted); margin:1px 0 0; }
  .p-alma { font-size:0.82rem; color:var(--muted); margin:3px 0 0; }
  .p-alma b { color:var(--fg); font-weight:600; }

  footer { margin-top:50px; color:var(--muted); font-size:0.82rem; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; }
  footer a { color:var(--muted); } footer a:hover { color:var(--fg); }
  .dot { opacity:.4; }

  @media (max-width:600px) {
    .wrap { padding:24px 18px 80px; }
    h1 { font-size:1.5rem; }
    .grid2,.more { grid-template-columns:1fr; }
    .labs { margin-left:0; padding-left:14px; }
    .dept-focus-line { margin-left:0; }
    .dept-head { flex-wrap:wrap; }
    .vasi { text-align:left; width:100%; padding-left:40px; }
    .vasi b { display:inline; } .vasi small { margin-left:6px; }
    .rank { font-size:1.15rem; width:20px; }
  }

  /* department card extras (main page) */
  .dept-name a { color:var(--fg); }
  .dept-name a:hover { text-decoration:underline; }
  .dept-about { font-size:0.9rem; line-height:1.55; margin:10px 0 0 40px; max-width:66ch; }
  .ai-courses { margin:9px 0 0 40px; display:flex; flex-wrap:wrap; gap:6px; align-items:baseline; }
  .ai-label { font-size:0.72rem; font-weight:700; letter-spacing:0.03em; text-transform:uppercase; color:var(--muted); }
  .course-chip { font-size:0.78rem; background:var(--tag-bg); color:var(--tag-fg); border-radius:6px; padding:2px 8px; }
  .dept-more { display:inline-block; margin:12px 0 0 40px; font-size:0.82rem; font-weight:600; }
  @media (max-width:600px) { .dept-about, .ai-courses, .dept-more { margin-left:0; } }

  /* department subpage */
  .dpage-back { font-size:0.84rem; color:var(--muted); display:inline-block; margin-bottom:6px; }
  .dpage-head { display:flex; align-items:center; gap:16px; margin:16px 0 0; }
  .dpage-logo { width:62px; height:62px; border-radius:13px; background:var(--chip); border:1px solid var(--hair); flex-shrink:0; display:flex; align-items:center; justify-content:center; overflow:hidden; }
  .dpage-logo img { max-width:80%; max-height:80%; object-fit:contain; }
  .dpage-logo .mono { font-size:0.86rem; font-weight:700; color:#2a2a2a; text-align:center; }
  .dpage-title { flex:1; min-width:0; }
  .dpage-title h1 { font-size:1.45rem; font-weight:700; letter-spacing:-0.01em; margin:0; line-height:1.22; }
  .dpage-title .u { font-size:0.92rem; color:var(--muted); margin:3px 0 0; }
  .dpage-vasi { text-align:right; flex-shrink:0; }
  .dpage-vasi b { display:block; font-size:1.3rem; font-weight:700; letter-spacing:-0.01em; }
  .dpage-vasi small { font-size:0.66rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.03em; }
  .dpage-about { font-size:1rem; line-height:1.62; margin:20px 0 0; max-width:70ch; }
  .dsec { padding-top:30px; }
  .dsec > h2 { font-size:0.78rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); margin:0 0 14px; }
  .dsec .labs { margin-left:0; padding-left:18px; }
  .src-list { list-style:none; margin:0; padding:0; }
  .src-list li { font-size:0.84rem; margin:4px 0; }
  @media (max-width:600px) { .dpage-vasi { text-align:left; } }

  /* AI angle + research summary (cards & dept page) */
  .ai-angle { font-size:0.88rem; margin:7px 0 0 40px; font-style:italic; max-width:66ch; }
  .research-line { font-size:0.82rem; color:var(--muted); margin:9px 0 0 40px; }
  .research-line b { color:var(--fg); font-weight:700; }
  @media (max-width:600px) { .ai-angle, .research-line { margin-left:0; } }

  /* AI courses highlight in study program */
  .ai-prog { border:1px solid var(--hair); border-left:3px solid var(--gold); border-radius:10px; padding:12px 14px; margin:0 0 14px; background:var(--card); }
  .ai-prog h4 { font-size:0.74rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--gold); margin:0 0 8px; }
  .ai-prog-list { list-style:none; margin:0; padding:0; }
  .ai-prog-list li { font-size:0.86rem; margin:3px 0; display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; }
  .ai-course-name { font-weight:600; }
  .ai-course-meta { font-size:0.74rem; color:var(--muted); }

  /* lab-name / vague research on main cards */
  .research-line .lab-chip { display:inline-block; font-size:0.78rem; background:var(--tag-bg); color:var(--tag-fg); border-radius:6px; padding:2px 8px; margin:0 4px 3px 0; }
  .research-line .lab-vague { font-style:italic; }