
  :root{
    --on-accent:#ffffff;
    --bg:#fbfbfd; --surface:#ffffff; --surface-2:#f4f6fa;
    --text:#161d2b; --muted:#5b6579; --line:#e3e7ef;
    --accent:#1d4ed8; --accent-soft:#eef3ff; --accent-line:#c9daff;
    --gold:#9a6408; --gold-soft:#fdf5e6; --green:#0f6f52; --green-soft:#ecf7f2;
    --radius:12px; --maxw:1080px;
  }
  @media (prefers-color-scheme: dark){
    :root{
      --bg:#0e131b; --surface:#151c27; --surface-2:#1b2431;
      --text:#e7ebf3; --muted:#9aa5b9; --line:#26313f;
      --accent:#8bb0ff; --accent-soft:#16233a; --accent-line:#2b415f;
      --gold:#e0b168; --gold-soft:#241d10; --green:#7fd1b0; --green-soft:#10261f;
      --on-accent:#0e131b;
    }
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth; scroll-padding-top:74px; -webkit-text-size-adjust:100%}
  body{
    margin:0; background:var(--bg); color:var(--text);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif;
    font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  }
  a{color:var(--accent); text-decoration:none}
  a:hover{text-decoration:underline}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 20px}
  /* ---------- nav ---------- */
  nav{position:sticky; top:0; z-index:50; background:var(--surface); background:color-mix(in srgb, var(--surface) 92%, transparent);
      backdrop-filter:saturate(180%) blur(8px); border-bottom:1px solid var(--line)}
  .navbar{display:flex; align-items:center; gap:18px; height:60px}
  .brand{font-weight:700; letter-spacing:-.01em; color:var(--text); white-space:nowrap}
  .brand{display:inline-flex; align-items:center; gap:9px}
  .brand .hi{color:var(--accent)}
  .navlinks{display:flex; gap:16px; margin-left:auto; overflow-x:auto; scrollbar-width:none}
  .navlinks::-webkit-scrollbar{display:none}
  .navlinks a{color:var(--muted); font-size:.92rem; font-weight:500; white-space:nowrap}
  .navlinks a:hover{color:var(--accent); text-decoration:none}
  /* ---------- sections ---------- */
  section{padding:56px 0; border-bottom:1px solid var(--line)}
  section:last-of-type{border-bottom:0}
  h1{font-size:clamp(1.9rem,4.4vw,2.7rem); line-height:1.15; letter-spacing:-.02em; margin:0 0 6px}
  h2.sec{font-size:1.45rem; letter-spacing:-.01em; margin:0 0 6px}
  .sec-note{color:var(--muted); font-size:.95rem; margin:0 0 26px; max-width:70ch}
  h3{font-size:1.02rem; margin:0 0 6px}
  h4{font-size:.95rem; margin:0 0 4px}
  p{margin:0 0 12px}
  .muted{color:var(--muted)}
  .small{font-size:.87rem}
  .tiny{font-size:.79rem}
  ul.clean{list-style:none; margin:0; padding:0}
  /* ---------- hero ---------- */
  .hero{display:flex; gap:40px; align-items:flex-end; flex-wrap:wrap-reverse; padding-top:48px}
  .hero-main{flex:1 1 420px; min-width:0}
  .role{font-size:1.06rem; color:var(--accent); font-weight:600; margin:0 0 4px}
  .affil{color:var(--muted); margin:0 0 18px}
  .lead{font-size:1.02rem; max-width:64ch}
  .portrait{width:176px; height:176px; border-radius:50%; object-fit:cover;
            border:1px solid var(--line); box-shadow:0 6px 22px rgba(15,23,42,.10)}
  .links{display:flex; flex-wrap:wrap; gap:8px; margin-top:20px}
  .btn{display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px;
       border:1px solid var(--line); background:var(--surface); color:var(--text);
       font-size:.88rem; font-weight:500}
  .btn:hover{border-color:var(--accent-line); color:var(--accent); text-decoration:none}
  .btn.primary{background:var(--accent); border-color:var(--accent); color:var(--on-accent)}
  .btn.primary:hover{color:var(--on-accent); opacity:.92}
  .btn svg{width:15px; height:15px; flex:none}
  /* ---------- cards & grids ---------- */
  .card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:18px}
  .grid{display:grid; gap:16px}
  .g2{grid-template-columns:1fr}
  @media(min-width:760px){.g2{grid-template-columns:1fr 1fr}}
  .g3{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
  .g4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
  .stat{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
        padding:18px; text-align:center}
  .stat .n{font-size:1.85rem; font-weight:700; color:var(--accent); letter-spacing:-.02em; line-height:1.1}
  .stat .l{font-weight:600; font-size:.92rem; margin-top:4px}
  .stat .s{color:var(--muted); font-size:.79rem; margin-top:2px}
  .tag{display:inline-block; padding:3px 9px; border-radius:999px; font-size:.75rem; font-weight:600;
       background:var(--accent-soft); color:var(--accent); border:1px solid var(--accent-line)}
  .tag.gold{background:var(--gold-soft); color:var(--gold); border-color:color-mix(in srgb,var(--gold) 35%, transparent)}
  .tag.green{background:var(--green-soft); color:var(--green); border-color:color-mix(in srgb,var(--green) 32%, transparent)}
  .rule-left{border-left:3px solid var(--accent); padding-left:14px}
  /* ---------- tables ---------- */
  .tablewrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface)}
  table{border-collapse:collapse; width:100%; font-size:.88rem; min-width:640px}
  th{text-align:left; font-weight:600; color:var(--muted); font-size:.78rem; text-transform:uppercase;
     letter-spacing:.04em; padding:11px 14px; background:var(--surface-2); border-bottom:1px solid var(--line)}
  td{padding:11px 14px; border-bottom:1px solid var(--line); vertical-align:top}
  tr:last-child td{border-bottom:0}
  /* ---------- lists ---------- */
  .items li{padding:9px 0; border-bottom:1px solid var(--line); font-size:.92rem}
  .items li:last-child{border-bottom:0}
  .items li b{font-weight:600}
  .pub{padding:12px 0; border-bottom:1px solid var(--line); font-size:.9rem}
  .pub:last-child{border-bottom:0}
  .pub .t{font-weight:600}
  .pub .v{color:var(--muted); font-size:.85rem}
  .news{display:flex; gap:14px; padding:11px 0; border-bottom:1px solid var(--line)}
  .news:last-child{border-bottom:0}
  .news .yr{flex:none; width:52px; font-weight:700; color:var(--accent); font-size:.85rem; padding-top:1px}
  .news p{margin:0; font-size:.92rem}
  footer{background:var(--surface-2); border-top:1px solid var(--line); padding:36px 0; color:var(--muted); font-size:.9rem}
  .foot{display:flex; gap:28px; flex-wrap:wrap; justify-content:space-between}
  @media (max-width:640px){
    section{padding:40px 0}
    .hero{gap:24px; padding-top:32px}
    .portrait{width:120px; height:120px}
  }

  /* ---------- additions: news feed, courses, todo ---------- */
  .feed li{display:flex; gap:14px; padding:12px 0; border-bottom:1px solid var(--line)}
  .feed li:last-child{border-bottom:0}
  .feed .when{flex:none; width:82px; color:var(--muted); font-size:.8rem; font-weight:600;
              text-transform:uppercase; letter-spacing:.03em; padding-top:3px}
  .feed .body{min-width:0}
  .feed p{margin:2px 0 0; font-size:.93rem}
  .kind{display:inline-block; font-size:.68rem; font-weight:700; letter-spacing:.06em;
        text-transform:uppercase; padding:2px 7px; border-radius:4px;
        background:var(--accent-soft); color:var(--accent); border:1px solid var(--accent-line);
        margin-right:8px; vertical-align:1px}
  .kind.people{background:var(--green-soft); color:var(--green); border-color:color-mix(in srgb,var(--green) 32%,transparent)}
  .kind.award{background:var(--gold-soft); color:var(--gold); border-color:color-mix(in srgb,var(--gold) 35%,transparent)}
  .kind.visit{background:var(--surface-2); color:var(--muted); border-color:var(--line)}
  .feed-more{margin-top:14px; font-size:.86rem}
  /* course cards */
  .course-card{display:block; background:var(--surface); border:1px solid var(--line);
               border-radius:var(--radius); padding:18px; color:inherit}
  .course-card:hover{border-color:var(--accent-line); text-decoration:none}
  .course-card h3{color:var(--accent)}
  .navlinks a.here{color:var(--accent); font-weight:600}
  .course-card .meta{color:var(--muted); font-size:.82rem; margin:0}
  /* lecture tables */
  table.lectures{min-width:880px}
  table.lectures td:first-child{white-space:nowrap; color:var(--muted); font-variant-numeric:tabular-nums}
  table.lectures .topic{font-weight:600}
  .yt{display:inline-flex; align-items:center; gap:5px; white-space:nowrap}
  .yt svg{width:15px; height:15px}
  /* placeholder marker - search for "todo" and remove before publishing */
  .todo{display:inline-block; font-size:.76rem; font-weight:600; color:var(--gold);
        background:var(--gold-soft); border:1px dashed color-mix(in srgb,var(--gold) 50%,transparent);
        border-radius:5px; padding:1px 7px}
  .pagehead{padding:30px 0 22px; border-bottom:1px solid var(--line)}
  .back{font-size:.86rem; color:var(--muted)}
  .back:hover{color:var(--accent)}

  /* ---------- IITH logo ---------- */
  .emblem{height:26px; width:auto; display:block; flex:none}
  .logo-full{height:72px; width:auto; display:block}
  .logo-full.sm{height:56px}
  .logo-dark{display:none}
  @media (prefers-color-scheme: dark){
    .logo-light{display:none}
    .logo-dark{display:block}
  }
  .footer-logo{margin-bottom:20px}
  .footer-logo a:hover{opacity:.85}

  /* ---------- ongoing vs past ---------- */
  .split{display:flex; align-items:center; gap:9px; font-size:1.02rem; margin:0 0 12px}
  .split.past{color:var(--muted); margin-top:4px}
  .dot{width:9px; height:9px; border-radius:50%; background:var(--green); flex:none;
       box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 18%, transparent)}
  .muted-card{background:var(--surface-2)}
  .muted-card h4{color:var(--muted)}
  table.grants td:nth-child(2), table.grants td:nth-child(3), table.grants td:nth-child(4){white-space:nowrap}
  table.past th{background:var(--surface-2)}
  table.past td{color:var(--muted)}
  table.past td:first-child{color:var(--text)}
  /* "currently" block */
  #now .card{background:var(--accent-soft); border-color:var(--accent-line)}
  #now li{display:flex; gap:11px; padding:8px 0; border-bottom:1px solid color-mix(in srgb,var(--accent-line) 60%, transparent); font-size:.93rem}
  #now li:last-child{border-bottom:0}
  #now .lbl{flex:none; width:118px; color:var(--muted); font-size:.79rem; font-weight:700;
            text-transform:uppercase; letter-spacing:.04em; padding-top:3px}
