:root{
    --paper:#f5f7f8; --paper-2:#eef2f3; --card:#ffffff;
    --ink:#15242e; --ink-soft:#374d57; --muted:#566c75; --faint:#728891;
    --line:rgba(21,36,46,.10); --line-2:rgba(21,36,46,.17);
    --teal:#0f7d88; --teal-deep:#0b5b64; --teal-soft:rgba(15,125,136,.10);
    --ochre:#c8791f; --ochre-soft:rgba(200,121,31,.13);
    --shadow:rgba(21,36,46,.45);
    --maxw:1180px; --r:14px;
    --display:"Space Grotesk","Noto Sans SC",system-ui,sans-serif;
    --body:"Hanken Grotesk","Noto Sans SC",system-ui,sans-serif;
    --mono:"Space Mono","Noto Sans SC",ui-monospace,monospace;
  }
  :root[data-theme="dark"]{
    --paper:#0e1a21; --paper-2:#13222b; --card:#172935;
    --ink:#e8eef1; --ink-soft:#c0ced5; --muted:#8da2ac; --faint:#6c818c;
    --line:rgba(232,238,241,.10); --line-2:rgba(232,238,241,.20);
    --teal:#3db4bf; --teal-deep:#67cdd6; --teal-soft:rgba(61,180,191,.13);
    --ochre:#e3984a; --ochre-soft:rgba(227,152,74,.15);
    --shadow:rgba(0,0,0,.6);
  }
  *{box-sizing:border-box}
  html{font-size:17px}
  body{margin:0;font-family:var(--body);color:var(--ink);line-height:1.62;background:var(--paper);-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
  a{color:inherit;text-decoration:none}
  ::selection{background:var(--teal);color:#fff}
  :focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:4px}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
  .eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
  .grp .eyebrow{font-size:.85rem;letter-spacing:.1em}
  .ilink{color:var(--teal);border-bottom:1px solid var(--teal-soft)}
  .ilink:hover{color:var(--teal-deep);border-bottom-color:var(--teal)}
  .nav{position:sticky;top:0;z-index:60;transition:.3s;background:transparent}
  .nav.scrolled{background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav-in{display:flex;align-items:center;gap:13px;height:64px;transition:height .3s}
  .nav.scrolled .nav-in{height:56px}
  .brand{font-family:var(--display);font-weight:600;letter-spacing:-.01em;font-size:1.02rem;margin-right:auto;display:flex;align-items:center;gap:9px;white-space:nowrap}
  .brand .dot{width:9px;height:9px;border-radius:50%;background:var(--teal)}
  .navlinks{display:flex;gap:22px;align-items:center}
  .nav a.link{color:var(--ink-soft);font-size:1rem;letter-spacing:.015em;transition:.2s;white-space:nowrap}
  .nav a.link.active{color:var(--teal)}
  .nav a.link:hover{color:var(--teal)}
  .lang{display:inline-flex;font-family:var(--mono);font-size:.74rem;border:1px solid var(--line-2);border-radius:999px;overflow:hidden}
  .lang button{font:inherit;background:none;border:0;color:var(--muted);padding:5px 10px;cursor:pointer;transition:.2s}
  .lang button.on{background:var(--teal);color:#fff}
  .btn{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.78rem;border:1px solid var(--line-2);border-radius:999px;padding:7px 14px;color:var(--ink);cursor:pointer;background:none;transition:.2s;white-space:nowrap}
  .btn:hover{border-color:var(--teal);color:var(--teal)}
  .btn.solid{background:var(--teal);color:#fff;border-color:var(--teal);font-weight:700}
  .btn.solid:hover{background:var(--teal-deep);border-color:var(--teal-deep);color:#fff}
  .iconbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-2);border-radius:999px;background:none;cursor:pointer;color:var(--ink);transition:.2s;font-size:.95rem;flex:none}
  .iconbtn:hover{border-color:var(--teal);color:var(--teal)}
  .burger{display:none}
  .hero{position:relative;overflow:hidden}
  #net{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;-webkit-mask-image:radial-gradient(120% 100% at 60% 30%,#000 35%,transparent 80%);mask-image:radial-gradient(120% 100% at 60% 30%,#000 35%,transparent 80%)}
  .hero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.35fr .65fr;gap:48px;align-items:center;padding:54px 24px 50px}
  .hero h1{font-family:var(--display);font-weight:600;letter-spacing:-.02em;line-height:1.08;font-size:clamp(2.05rem,4.6vw,3.5rem);margin:.55rem 0 0}
  .hero h1 .hl{color:var(--teal)}
  .roles{margin-top:1rem;display:grid;gap:4px}
  .roles div{color:var(--ink-soft);font-size:.97rem}
  .roles .heroname{font-family:var(--display);font-weight:600;font-size:1.35rem;color:var(--ink);letter-spacing:-.01em;margin-bottom:5px}
  .lead{font-size:clamp(1rem,1.5vw,1.12rem);color:var(--ink-soft);max-width:58ch;margin:1.2rem 0 0}
  .cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.6rem}
  .portrait-wrap{position:relative}
  .portrait{width:100%;max-width:330px;aspect-ratio:3/4;object-fit:cover;border-radius:18px;border:1px solid var(--line-2);box-shadow:0 18px 50px -22px var(--shadow);display:block;margin-left:auto}
  .lkicon{width:1em;height:1em;flex:none;vertical-align:-.14em}
  .portrait-wrap::after{content:"";position:absolute;right:-10px;bottom:-10px;width:64px;height:64px;border-right:2px solid var(--ochre);border-bottom:2px solid var(--ochre);border-radius:0 0 18px 0;opacity:.7}
  section{padding:70px 0}
  .alt{background:var(--paper-2)}
  .sec-head{margin-bottom:24px}
  .sec-head h2{font-family:var(--display);font-weight:600;letter-spacing:-.02em;font-size:clamp(1.6rem,3vw,2.15rem);margin:.35rem 0 0}
  .sub-h{display:flex;align-items:baseline;gap:11px;margin:42px 0 14px;padding-bottom:9px;border-bottom:1px solid var(--line-2)}
  .sub-h h3{font-family:var(--display);font-weight:600;font-size:1.22rem;letter-spacing:-.01em;margin:0}
  .sub-h .gc{font-family:var(--mono);font-size:.74rem;color:var(--faint)}
  .home-grid{display:grid;grid-template-columns:1.25fr .95fr;gap:42px;align-items:start;margin-top:26px}
  .bio p{font-size:1.02rem;color:var(--ink-soft);max-width:64ch}
  .bio p+p{margin-top:1rem}
  .bio b{color:var(--ink);font-weight:600}
  .panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
  .panel+.panel{margin-top:14px}
  .panel h4{font-family:var(--mono);font-size:.86rem;letter-spacing:.07em;text-transform:uppercase;color:var(--teal);margin:0 0 9px}
  .prow{padding:7px 0;border-top:1px solid var(--line);font-size:.9rem;color:var(--ink-soft)}
  .prow:first-of-type{border-top:0}
  .cloud-card{margin-top:32px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;text-align:center}
  .cloud-card img{width:100%;max-width:750px;border-radius:8px}
  .cloud-card .cap{font-family:var(--mono);font-size:.72rem;color:#90a3ad;margin-top:10px}
  .rows{margin:0}
  .row{padding:10px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;align-items:baseline}
  .row .rt{font-size:.95rem;color:var(--ink-soft)}
  .row .rt .b1{color:var(--ink);font-weight:600}
  .row .rd{font-family:var(--mono);font-size:.74rem;color:var(--muted);white-space:nowrap}
  .row.hidden{display:none}
  .row .plogos{flex:none;display:flex;flex-wrap:wrap;gap:8px;align-self:center;justify-content:flex-end}
  .row .plogo{background:#fff;border:1px solid var(--line);border-radius:9px;height:90px;width:167px;display:flex;align-items:center;justify-content:center;padding:7px}
  .row .plogo img{max-width:100%;max-height:100%;object-fit:contain}
  .lchips{display:inline-flex;flex-wrap:wrap;gap:6px;margin-left:8px;vertical-align:baseline}
  .lchip{font-family:var(--mono);font-size:.66rem;color:var(--teal);border:1px solid var(--line-2);border-radius:6px;padding:2px 7px;transition:.2s}
  .lchip:hover{border-color:var(--teal)}
  .more{margin-top:12px;font-family:var(--mono);font-size:.9rem;color:var(--teal);background:none;border:0;cursor:pointer;padding:4px 0}
  .more:hover{color:var(--teal-deep);text-decoration:underline}
  .grp{margin-bottom:30px}
  .grp-h{display:flex;align-items:baseline;gap:11px;margin-bottom:8px}
  .grp-h .gt{font-family:var(--display);font-weight:600;font-size:1.06rem}
  .chipset{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
  .chip{font-size:.84rem;color:var(--ink-soft);border:1px solid var(--line-2);border-radius:8px;padding:5px 11px;background:var(--card)}
  .chip .m{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;vertical-align:middle;background:var(--teal)}
  .chip.alt2 .m{background:var(--ochre)}
  .jchip{font-size:.78rem;color:var(--ink-soft);border:1px solid var(--line);border-radius:7px;padding:4px 9px;background:var(--card)}
  .jchip.hidden{display:none}
  .chipwrap{display:flex;flex-wrap:wrap;gap:7px}
  .controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:6px}
  .search{position:relative;flex:1 1 320px;min-width:240px;display:flex;gap:8px}
  .search .inwrap{position:relative;flex:1}
  .search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--faint)}
  .search input{width:100%;font-family:var(--body);font-size:.95rem;color:var(--ink);background:var(--card);border:1px solid var(--line-2);border-radius:999px;padding:11px 16px 11px 40px;transition:.2s}
  .search input::placeholder{color:var(--faint)}
  .search input:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft);outline:none}
  .seg{display:inline-flex;background:var(--card);border:1px solid var(--line-2);border-radius:999px;padding:4px;flex-wrap:wrap}
  .seg button{font-family:var(--mono);font-size:.78rem;color:var(--muted);background:none;border:0;padding:7px 12px;border-radius:999px;cursor:pointer;transition:.2s;white-space:nowrap}
  .seg button.on{background:var(--teal);color:#fff;font-weight:700}
  .seg button:not(.on):hover{color:var(--ink)}
  .toggle{display:inline-flex;align-items:center;gap:9px;font-size:.86rem;color:var(--muted);cursor:pointer;user-select:none}
  .toggle input{appearance:none;width:38px;height:21px;background:var(--paper-2);border:1px solid var(--line-2);border-radius:999px;position:relative;cursor:pointer;transition:.2s;flex:none}
  .toggle input::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:var(--muted);transition:.2s}
  .toggle input:checked{background:var(--ochre-soft);border-color:var(--ochre)}
  .toggle input:checked::after{left:19px;background:var(--ochre)}
  .pub-filter{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 14px}
  .pub-filter:empty{display:none}
  .fchip{font-family:var(--mono);font-size:.74rem;color:var(--muted);background:var(--card);border:1px solid var(--line-2);border-radius:999px;padding:5px 12px;cursor:pointer;transition:.2s;white-space:nowrap}
  .fchip:hover{color:var(--ink);border-color:var(--teal)}
  .fchip.on{background:var(--teal);color:#fff;border-color:var(--teal);font-weight:700}
  .fchip.clear{color:var(--ochre);border-color:var(--ochre-soft)}
  .fchip.clear:hover{color:var(--ochre);border-color:var(--ochre)}
  .hint{font-family:var(--mono);font-size:.72rem;color:var(--faint);margin:12px 0 20px;display:flex;gap:8px;align-items:baseline}
  .hint .spark{color:var(--ochre)}
  .ai-panel{display:none;background:var(--card);border:1px solid var(--teal);border-radius:var(--r);padding:18px 20px;margin:0 0 20px;box-shadow:0 10px 30px -20px var(--shadow)}
  .ai-panel.show{display:block}
  .ai-panel .ai-h{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}
  .ai-panel .ai-x{background:none;border:0;color:var(--muted);cursor:pointer;font-size:1rem}
  .ai-panel .ai-body{font-size:.96rem;color:var(--ink-soft);white-space:pre-wrap}
  .pubs{transition:opacity .25s ease}
  .group-h{display:flex;align-items:baseline;gap:11px;margin:26px 0 10px;padding-bottom:9px;border-bottom:1px solid var(--line-2)}
  .group-h:first-child{margin-top:0}
  .group-h .gl{font-family:var(--display);font-weight:600;font-size:1.12rem;letter-spacing:-.01em}
  .group-h.year .gl{font-family:var(--mono);color:var(--ochre);font-size:1rem}
  .group-h .gc{font-family:var(--mono);font-size:.72rem;color:var(--faint)}
  .group-h.ghx{cursor:pointer;user-select:none}
  .ghchev{display:inline-block;color:var(--muted);font-size:1.5em;transition:transform .2s}
  .group-h.ghx.col .ghchev{transform:rotate(-90deg)}
  .pgrp.col{display:none}
  .sub-h.fold{cursor:pointer;user-select:none}
  .foldchev{display:inline-block;color:var(--muted);font-size:1.5em;transition:transform .2s}
  .sub-h.fold.col .foldchev{transform:rotate(-90deg)}
  .foldwrap.col{display:none}
  .pub{display:grid;grid-template-columns:132px 1fr;gap:18px;padding:14px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(7px);transition:opacity .4s,transform .4s,background .2s}
  .pub.in{opacity:1;transform:none}
  .pub:hover{background:linear-gradient(90deg,var(--teal-soft),transparent 70%)}
  .pub .meta{font-family:var(--mono);font-size:.73rem;color:var(--muted);padding-top:3px}
  .pub .yr{display:block;color:var(--ink);font-size:.9rem}
  .pub .venue{display:inline-block;margin-top:6px;border:1px solid var(--line-2);border-radius:6px;padding:2px 7px;color:var(--teal);font-size:.66rem;line-height:1.45}
  .pub .t{font-family:var(--display);font-weight:500;font-size:1.03rem;letter-spacing:-.01em;line-height:1.36}
  .pub.sel .t{padding-left:13px;border-left:2px solid var(--ochre)}
  .pub .t .star{color:var(--ochre);font-family:var(--mono);font-size:.8rem}
  .pub .cite{color:var(--muted);font-size:.84rem;margin-top:5px}
  .pub .cite .me,.pub .authors .me{color:var(--teal);font-weight:700}
  .pub .authors{color:var(--ink-soft);font-size:.89rem;margin-top:5px}
  .pub .plink{color:var(--teal);font-size:.8rem;white-space:nowrap}
  .pub .plink:hover{text-decoration:underline}
  .pub .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
  .reflist{margin-top:2px}
  .reflist .pub:last-child{border-bottom:0}
  .tag{font-family:var(--mono);font-size:.66rem;color:var(--faint);border:1px solid var(--line);border-radius:6px;padding:3px 8px}
  .tag.m{color:var(--teal)}.tag.d{color:var(--ochre)}.tag.f{color:var(--ink-soft)}
  .tag.lit{background:var(--teal-soft);border-color:var(--teal)}
  .tag.d.lit{background:var(--ochre-soft);border-color:var(--ochre)}
  a.tag:hover{border-color:var(--teal);color:var(--teal)}
  .empty{font-family:var(--mono);color:var(--faint);font-size:.9rem;padding:32px 0}
  .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:16px;margin:8px 0}
  .course{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;transition:.2s}
  .course:hover{border-color:var(--teal);box-shadow:0 12px 30px -18px var(--shadow)}
  .course .cn{font-family:var(--display);font-weight:600;font-size:1.05rem;margin:0 0 4px;line-height:1.3}
  .course .yrs{font-family:var(--mono);font-size:.74rem;color:var(--muted)}
  .course .ev{margin-top:14px}
  .course .ev-top{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.72rem;color:var(--ink-soft);margin-bottom:5px}
  .course .bar{height:5px;background:var(--paper-2);border-radius:99px;overflow:hidden}
  .course .bar i{display:block;height:100%;background:var(--teal);border-radius:99px}
  .logo-cat{font-family:var(--mono);font-size:1.02rem;letter-spacing:.04em;text-transform:uppercase;color:var(--teal);margin:24px 0 11px}
  .logo-cat:first-child{margin-top:6px}
  .logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(166px,1fr));gap:12px}
  .logo{background:#fff;height:112px;display:flex;align-items:center;justify-content:center;padding:10px;border:1px solid var(--line);border-radius:10px;transition:.25s}
  .logo img{max-width:100%;max-height:80px;object-fit:contain}
  .logo:hover{transform:scale(1.04)}
  footer{border-top:1px solid var(--line-2);padding:46px 0 56px}
  .foot-grid{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-end}
  footer .name{font-family:var(--display);font-weight:600;font-size:1.1rem}
  footer .copy{font-family:var(--mono);font-size:.72rem;color:var(--faint);margin-top:7px}
  footer .links a{display:inline-flex;align-items:center;gap:5px;margin-left:16px;font-size:.9rem;color:var(--muted)}
  footer .links a:hover{color:var(--teal)}
  .mapwrap{text-align:center;margin-top:28px}
  .mapwrap #mapmyvisitors-widget{zoom:.6}
  .pub-legend{font-family:var(--mono);font-size:.74rem;color:var(--muted);margin:2px 0 14px}
  /* speaking-footprint map */
  #talkMap{margin:4px 0 30px}
  .foot-h{display:flex;align-items:baseline;gap:12px;margin-bottom:11px;flex-wrap:wrap}
  .foot-cap{font-family:var(--mono);font-size:.74rem;color:var(--faint)}
  .footmap-wrap{position:relative;width:100%;max-width:780px}
  .footmap{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:14px;background:#e3edef}
  .foot-land{fill:#fff;stroke:#c4d4d8;stroke-width:.2;stroke-linejoin:round}
  .foot-hit{fill:transparent}
  .foot-dot{cursor:pointer}
  .foot-pt{fill:var(--teal);stroke:#e3edef;stroke-width:.3;transition:fill .15s,r .15s}
  .foot-dot:hover .foot-pt,.foot-dot:focus .foot-pt{fill:var(--ochre);r:2}
  .foot-dot:focus{outline:none}
  .foot-dot:focus .foot-pt{stroke:var(--ochre);stroke-width:.6}
  .foot-tip{position:absolute;transform:translate(-50%,-135%);background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:.72rem;line-height:1.2;padding:3px 8px;border-radius:7px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s;z-index:5}
  .foot-tip.on{opacity:1}
  [data-theme="dark"] .footmap{background:#0e1a21;border-color:#23323b}
  [data-theme="dark"] .foot-land{fill:#1e3340;stroke:#2f4856}
  [data-theme="dark"] .foot-pt{stroke:#0e1a21}
  .mapwrap img{max-width:100%}
  .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s,transform .7s}
  .reveal.in{opacity:1;transform:none}
  .viewfade{animation:viewfade .26s ease both}
  @keyframes viewfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  .mobile-menu{display:none}
  .mobile-menu.open{display:flex;position:fixed;top:60px;right:18px;left:18px;z-index:70;flex-direction:column;gap:2px;background:var(--card);border:1px solid var(--line-2);border-radius:12px;padding:14px 18px;box-shadow:0 16px 40px -20px var(--shadow)}
  .mobile-menu a{padding:10px 4px;color:var(--ink-soft);border-top:1px solid var(--line);font-size:.98rem}
  .mobile-menu a:first-child{border-top:0}
  .mobile-menu a.active{color:var(--teal)}
  @media (max-width:1080px){
    .nav-in{flex-wrap:wrap;height:auto;row-gap:9px;padding:9px 24px}
    .nav.scrolled .nav-in{height:auto}
    .navlinks{order:9;flex-basis:100%;justify-content:center;flex-wrap:wrap;gap:9px 16px}
    .nav a.link{font-size:.92rem}
    .lang{font-size:.72rem}
    .lang button{padding:5px 10px}
    .burger{display:none}
  }
  @media (max-width:900px){
    .hero-in{grid-template-columns:1fr;gap:30px}
    .portrait{max-width:270px;margin:0}
    .portrait-wrap{order:-1}
    .home-grid{grid-template-columns:1fr;gap:30px}
  }
  @media (max-width:560px){
    .pub{grid-template-columns:1fr;gap:7px}
    .pub .meta{display:flex;align-items:center;gap:10px;padding-top:0}
    .pub .yr{display:inline}.pub .venue{margin-top:0}
    section{padding:54px 0}
    .row{flex-direction:column;gap:2px}
  }
  @media (prefers-reduced-motion:reduce){*{scroll-behavior:auto}.reveal,.pub{transition:none;opacity:1;transform:none}.viewfade{animation:none}}