:root{--paper:#f6f7f9;--ink:#101725;--muted:#637083;--line:#dfe4ea;--deep:#06101d;--deep2:#0a1627;--cyan:#75e8ff;--violet:#cb8cff;--amber:#ffbd68;--green:#9af58d;--max:1120px;--serif:"Source Serif 4",Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-rendering:optimizeLegibility}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}.container{width:min(calc(100% - 36px),var(--max));margin-inline:auto}.skip-link{position:fixed;left:12px;top:12px;z-index:999;transform:translateY(-180%);padding:8px 12px;border-radius:999px;background:#fff;color:#000}.skip-link:focus{transform:translateY(0)}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}.reveal-delay-1{transition-delay:.08s}.reveal-delay-2{transition-delay:.16s}.reveal.is-visible{opacity:1;transform:none}.eyebrow{margin:0 0 8px;text-transform:uppercase;letter-spacing:.17em;font-size:10px;font-weight:800;color:var(--cyan)}.eyebrow.dark{color:#61708a}.text-link{font-size:11px;font-weight:800;color:rgba(255,255,255,.78)}.dark-link{color:#56657a}.button{display:inline-flex;align-items:center;justify-content:center;padding:9px 13px;border-radius:999px;font-size:11px;font-weight:800}.button-light{background:#fff;color:#111a28}

/* Navigation */
.site-header{position:fixed;z-index:100;left:0;right:0;top:0;padding:10px 0;transition:background .2s ease,box-shadow .2s ease,backdrop-filter .2s ease}.site-header.is-scrolled,.teaching-header{background:rgba(5,13,23,.86);backdrop-filter:blur(15px);box-shadow:0 1px 0 rgba(255,255,255,.07)}.nav-wrap{width:min(calc(100% - 36px),var(--max));margin-inline:auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px}.brand{width:36px;height:36px;border:1px solid rgba(255,255,255,.32);border-radius:50%;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800}.nav{display:flex;justify-content:center;gap:25px}.nav a,.nav-cta{color:rgba(255,255,255,.72);font-size:11px;font-weight:700}.nav a:hover,.nav a.active,.nav-cta:hover{color:#fff}.nav-cta{justify-self:end}

/* Hero */
.hero{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#06101d;padding:78px 0 26px;min-height:500px}.hero-video{position:absolute;inset:-18% -5%;z-index:-4;overflow:hidden;background:#06101d}.hero-video iframe{position:absolute;left:50%;top:50%;width:120vw;height:67.5vw;min-width:100%;min-height:100%;transform:translate(-50%,-50%) scale(1.09);border:0;pointer-events:none;filter:saturate(.78) contrast(1.08) brightness(.66)}.hero-overlay{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,rgba(2,8,17,.97) 0%,rgba(4,12,24,.93) 42%,rgba(5,14,29,.66) 66%,rgba(8,13,31,.79) 100%),linear-gradient(0deg,rgba(3,9,18,.66),transparent 54%)}.hero-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);gap:34px;align-items:center}.hero-copy{max-width:690px;padding:14px 0}.hero h1{margin:0;font-family:var(--serif);font-size:clamp(52px,6.4vw,78px);font-weight:600;line-height:.94;letter-spacing:-.052em}.hero-kicker{margin:14px 0 0;font-size:clamp(20px,2.2vw,27px);font-weight:800;letter-spacing:-.037em}.hero-body{max-width:680px;margin:14px 0 0;color:rgba(255,255,255,.79);font-size:14px;line-height:1.67}.hero-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.hero-links a{display:inline-flex;gap:6px;align-items:center;padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(8,18,31,.34);font-size:9px;font-weight:700;color:rgba(255,255,255,.82);backdrop-filter:blur(6px)}.hero-links a:hover{background:rgba(255,255,255,.09);color:#fff}.hero-links svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}

/* Torus/manifold portrait */
.portrait-manifold{position:relative;min-height:395px;display:grid;place-items:center}.portrait-shell{position:relative;z-index:3;width:270px;height:340px;border-radius:44% 44% 38% 38% / 35% 35% 16% 16%;overflow:hidden;border:1px solid rgba(255,255,255,.22);background:linear-gradient(160deg,#2b435b,#1b213b);box-shadow:0 24px 70px rgba(0,0,0,.36)}.hero-photo{width:100%;height:100%;object-fit:cover;object-position:center top}.portrait-fallback{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--serif);font-size:70px;color:rgba(255,255,255,.72);z-index:-1}.portrait-glow{position:absolute;width:350px;height:270px;border-radius:50%;background:radial-gradient(ellipse,rgba(90,200,255,.22),transparent 66%);filter:blur(10px);z-index:1}.torus{position:absolute;z-index:2;width:520px;height:420px;overflow:visible;pointer-events:none}.torus-back{z-index:2}.torus-front{z-index:4}.torus-spin{transform-origin:center;animation:torusFloat 10s ease-in-out infinite}.torus-spin-front{animation-delay:-3s}.torus-band,.torus-meridian,.torus-front-arc,.flow-arrow{fill:none;vector-effect:non-scaling-stroke}.torus-band-blue{stroke:url(#torusBlue);stroke-width:23}.torus-band-blue.thin{stroke-width:3;stroke-dasharray:5 7;opacity:.8}.torus-band-green{stroke:url(#torusGreen);stroke-width:15}.torus-meridian{stroke:rgba(117,232,255,.32);stroke-width:2}.torus-meridian.faint{stroke:rgba(206,142,255,.18);stroke-dasharray:8 8}.flow-arrow{stroke:#75e8ff;stroke-width:2;stroke-dasharray:10 9;animation:dash 5.2s linear infinite}.flow-arrow-green{stroke:#a9ff83;animation-duration:4.2s}.torus-front-arc{stroke-width:17;filter:drop-shadow(0 0 10px rgba(117,232,255,.34))}.torus-front-arc.blue{stroke:rgba(85,197,255,.56)}.torus-front-arc.green{stroke:rgba(153,255,130,.58);stroke-width:11}.manifold-notes{position:absolute;z-index:5;inset:0;pointer-events:none}.manifold-notes span{position:absolute;padding:4px 7px;border-radius:999px;border:1px solid rgba(255,255,255,.13);background:rgba(5,13,24,.55);backdrop-filter:blur(6px);font-size:7px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.64)}.manifold-notes span:nth-child(1){left:4%;top:34%}.manifold-notes span:nth-child(2){left:40%;bottom:3%}.manifold-notes span:nth-child(3){right:3%;top:43%}@keyframes torusFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-4px) rotate(1.7deg)}}@keyframes dash{to{stroke-dashoffset:-76}}

/* Animated connectome research map */
.brain-map-section{position:relative;overflow:hidden;background:#030914;color:#fff;padding:26px 0}.neural-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.72}.brain-map-shell{position:relative;z-index:2;display:grid;grid-template-columns:210px 1fr;gap:26px;align-items:center}.brain-map-copy h2{margin:0;font-family:var(--serif);font-size:30px;line-height:1.02;letter-spacing:-.04em}.brain-map-copy>p:last-child{margin:10px 0 0;color:rgba(255,255,255,.52);font-size:10px;line-height:1.45}.brain-stage{position:relative;height:285px;border:1px solid rgba(255,255,255,.12);border-radius:20px;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(51,63,105,.22),transparent 42%),linear-gradient(135deg,rgba(13,20,40,.66),rgba(4,8,17,.86));box-shadow:inset 0 0 70px rgba(82,114,255,.05)}.brain-halo{position:absolute;left:50%;top:48%;width:58%;height:74%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,rgba(126,78,255,.18),transparent 66%);filter:blur(10px)}.connectome-canvas{position:absolute;inset:4% 10%;width:80%;height:92%;z-index:2}.brain-silhouette{position:absolute;z-index:1;left:50%;top:50%;width:70%;height:78%;transform:translate(-50%,-50%);border-radius:48% 48% 42% 42% / 42% 42% 54% 54%;background:radial-gradient(circle at 33% 38%,rgba(92,188,255,.06),transparent 31%),radial-gradient(circle at 67% 38%,rgba(233,120,255,.055),transparent 31%);border:1px solid rgba(125,165,255,.08);filter:blur(.2px)}.brain-region-lines{position:absolute;z-index:3;inset:0;width:100%;height:100%}.line{fill:none;stroke:rgba(255,255,255,.25);stroke-width:1.1;stroke-dasharray:4 6}.brain-hotspot{position:absolute;z-index:5;display:flex;flex-direction:column;align-items:flex-start;gap:1px;max-width:176px;padding:7px 9px;border-radius:10px;border:1px solid rgba(255,255,255,.23);background:rgba(7,14,28,.78);color:#fff;text-align:left;backdrop-filter:blur(8px);cursor:pointer;transition:.18s transform,.18s background,.18s border-color,.18s box-shadow}.brain-hotspot:hover,.brain-hotspot:focus-visible,.brain-hotspot.is-active{transform:translateY(-4px) scale(1.035);background:rgba(16,29,49,.94);border-color:rgba(117,232,255,.66);box-shadow:0 12px 30px rgba(0,0,0,.28),0 0 22px rgba(117,232,255,.12);outline:none}.hotspot-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 13px var(--cyan)}.hotspot-region{font-size:6.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.48)}.brain-hotspot strong{font-size:10px;line-height:1.22;letter-spacing:-.02em}.hotspot-memory{left:50%;top:10%;transform:translateX(-50%)}.hotspot-memory:hover,.hotspot-memory:focus-visible,.hotspot-memory.is-active{transform:translateX(-50%) translateY(-4px) scale(1.035)}.hotspot-memory .hotspot-dot{left:50%;bottom:-30px}.hotspot-vision{left:5%;top:60%}.hotspot-vision .hotspot-dot{right:-26px;top:50%}.hotspot-action{right:4%;top:66%}.hotspot-action .hotspot-dot{left:-28px;top:50%}.pillar-popover{position:absolute;z-index:8;width:340px;opacity:0;pointer-events:none;transform:translateY(10px) scale(.96);transition:.18s opacity,.18s transform;filter:drop-shadow(0 22px 40px rgba(0,0,0,.42))}.pillar-popover.is-open{opacity:1;pointer-events:auto;transform:none}.pillar-popover[data-active="reasoning"]{right:3%;top:7%}.pillar-popover[data-active="imaging"]{left:4%;top:7%}.pillar-popover[data-active="flight"]{right:4%;top:5%}.pillar-detail{display:none;border-radius:16px;border:1px solid rgba(255,255,255,.14);overflow:hidden;background:rgba(7,14,27,.97);backdrop-filter:blur(18px)}.pillar-detail.is-active{display:block}.pillar-detail-copy{padding:18px 18px 17px}.pillar-detail-copy span{display:block;font-size:7px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--cyan)}.pillar-detail-copy h3{margin:5px 0 0;font-family:var(--serif);font-size:24px;line-height:1}.pillar-detail-copy p{margin:9px 0 0;font-size:10.5px;line-height:1.55;color:rgba(255,255,255,.7)}.pillar-detail-copy small{display:block;margin-top:10px;color:rgba(255,255,255,.38);font-size:8px}.pillar-close{position:absolute;z-index:3;right:8px;top:8px;width:31px;height:31px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font-size:19px;cursor:pointer}

/* Shared section structure */
.section{padding:34px 0}.compact-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:14px}.compact-heading h2{margin:0;font-family:var(--serif);font-size:34px;line-height:1;letter-spacing:-.04em}.compact-heading .eyebrow{margin-bottom:7px}

/* Publications: compact but high-signal */
.publications{background:#f5f7f9}.publication-list{display:grid;gap:10px}.publication-row{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:14px;background:#fff}.publication-media{position:relative;height:118px;border-radius:10px;overflow:hidden;background:#101010;border:1px solid rgba(0,0,0,.04)}.publication-media img{width:100%;height:100%;object-fit:cover}.media-play{position:absolute;right:9px;bottom:9px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(5,12,20,.82);color:#fff;font-size:10px;box-shadow:0 4px 12px rgba(0,0,0,.25)}.publication-info{min-width:0;padding:2px 5px 2px 0}.publication-info h3{margin:0;font-size:18px;line-height:1.24;letter-spacing:-.028em}.publication-info h3 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.pub-status-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:8px}.pub-status-row>a,.pub-venue{display:inline-flex;align-items:center;min-height:24px;padding:4px 8px;border-radius:999px;font-size:8.5px;font-weight:800}.pub-venue{background:#111b2a;color:#fff}.pub-venue.accent{background:#e8f7ff;color:#15526b;border:1px solid #ccecf8}.pub-status-row>a{border:1px solid var(--line);color:#526176;background:#fff}.pub-status-row>a:hover{background:#111b2a;border-color:#111b2a;color:#fff}.authors{margin:8px 0 0;color:#58667a;font-size:10px;line-height:1.42}.equal-note{color:#8b95a3;font-size:9px}.pub-summary{margin:7px 0 0;color:#687588;font-size:10.5px;line-height:1.48}

/* News / highlights: vertical placecards with replaceable images */
.highlights-section{background:#fff;padding-top:30px}.news-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.news-card{display:grid;grid-template-rows:168px 1fr;min-height:302px;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;transition:.2s transform,.2s box-shadow}.news-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(23,35,54,.1)}.news-image{overflow:hidden;background:#111c2d}.news-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.news-card:hover .news-image img{transform:scale(1.025)}.news-copy{padding:14px 14px 16px}.signal-kicker{display:block;margin-bottom:6px;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#627188}.news-card h3{margin:0;font-family:var(--serif);font-size:20px;line-height:1.05;letter-spacing:-.03em}.news-card p{margin:8px 0 0;color:#728094;font-size:10px;line-height:1.45}.image-replace-note{margin:9px 0 0;color:#9098a5;font-size:8.5px}.image-replace-note code{font-size:8px}

/* Experience */
.experience-section{background:#f7f8fa}.experience-icons{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.experience-icon-card{min-width:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px 12px 16px;text-align:center}.experience-logo{height:58px;display:grid;place-items:center;margin-bottom:10px}.experience-logo img{max-width:58px;max-height:58px;object-fit:contain}.experience-logo.logo-wide img{max-width:92px;max-height:48px}.experience-icon-card h3{margin:0;font-size:13px;line-height:1.28;letter-spacing:-.02em}.experience-icon-card p{margin:6px 0 0;font-size:10.5px;color:#4f5e72;font-weight:600}.experience-icon-card span{display:block;margin-top:5px;font-size:9px;line-height:1.35;color:#8993a1}.experience-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:11px}.experience-detail-grid p{margin:0;padding:10px 11px;border-top:1px solid var(--line);font-size:9.5px;line-height:1.5;color:#687486}.experience-detail-grid strong{color:#222d3d}.experience-logo-fallback{display:grid;place-items:center;min-width:50px;min-height:50px;padding:8px;border-radius:50%;background:#f0f2f5;border:1px solid var(--line);font-size:11px;font-weight:800;color:#526173}

/* Earlier work */
.projects-section{background:#fff;padding-top:30px}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.project-card{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:.18s transform,.18s box-shadow}.project-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(21,34,53,.08)}.project-symbol{width:52px;height:52px;border-radius:13px;display:grid;place-items:center;background:#101a2a;color:#fff;font-size:12px;font-weight:800}.project-card span{font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:#7a8798}.project-card h3{margin:3px 0 0;font-size:14px}.project-card p{margin:5px 0 0;font-size:10px;line-height:1.45;color:#748091}

.contact-section{padding:28px 0;background:#091421;color:#fff}.contact-grid{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center}.contact-grid h2{margin:0;max-width:660px;font-family:var(--serif);font-size:30px;line-height:1.05;letter-spacing:-.035em}.contact-actions{display:flex;align-items:center;gap:13px}.footer{padding:16px 0;background:#050b13;color:rgba(255,255,255,.44);font-size:9px}.footer-grid{display:flex;justify-content:space-between;gap:12px;align-items:center}

/* Teaching page */
.teaching-page{background:#f7f8fa}.teaching-hero{padding:110px 0 54px;color:#fff;background:radial-gradient(circle at 78% 20%,rgba(117,232,255,.14),transparent 25%),linear-gradient(135deg,#071321,#12172d)}.teaching-hero-grid{display:grid;grid-template-columns:1fr 220px;gap:30px;align-items:center}.teaching-hero h1{margin:0;font-family:var(--serif);font-size:clamp(38px,5vw,62px);line-height:.98;letter-spacing:-.045em}.teaching-hero p:last-child{max-width:700px;margin:16px 0 0;color:rgba(255,255,255,.7);font-size:13px;line-height:1.6}.teaching-symbol{height:160px;border:1px solid rgba(255,255,255,.1);border-radius:24px;display:grid;place-items:center;font-family:var(--serif);font-size:72px;color:rgba(117,232,255,.68);background:radial-gradient(circle,rgba(117,232,255,.08),transparent 62%);position:relative}.teaching-symbol span{position:absolute;right:38px;bottom:28px;font-size:26px;color:rgba(217,140,255,.8)}.teaching-list-section{padding-top:36px}.teaching-list{display:grid;gap:9px}.teaching-card{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:16px 17px;background:#fff;border:1px solid var(--line);border-radius:13px}.teaching-term{font-size:10px;font-weight:800;color:#687789;padding-top:2px}.teaching-card h3{margin:0;font-size:14px;letter-spacing:-.02em}.teaching-card p{margin:6px 0 0;color:#657184;font-size:10px;line-height:1.5}.teaching-card a{display:inline-block;margin-top:7px;font-size:9px;font-weight:800;color:#425879}

/* Tablet */
@media(max-width:920px){
  .nav{gap:15px}.nav a{font-size:10px}.hero-grid{grid-template-columns:1.08fr .92fr;gap:12px}.hero h1{font-size:clamp(46px,7vw,64px)}.hero-body{font-size:12.5px}.portrait-shell{width:230px;height:290px}.portrait-manifold{min-height:345px}.torus{width:430px;height:350px}.brain-map-shell{grid-template-columns:165px 1fr;gap:15px}.brain-map-copy h2{font-size:24px}.brain-stage{height:255px}.pillar-popover{width:310px}.compact-heading h2{font-size:31px}.publication-row{grid-template-columns:170px 1fr}.publication-media{height:108px}.news-grid{grid-template-columns:repeat(2,1fr)}.experience-icons{grid-template-columns:repeat(3,1fr)}.experience-detail-grid{grid-template-columns:repeat(2,1fr)}
}

/* Mobile and small tablet */
@media(max-width:700px){
  .container,.nav-wrap{width:min(calc(100% - 24px),var(--max))}.site-header{padding:8px 0}.nav-wrap{gap:10px}.nav{gap:11px}.nav a{font-size:9px}.nav a:nth-child(3),.nav a:nth-child(4){display:none}.nav-cta{font-size:9px}.hero{padding-top:67px;min-height:0}.hero-grid{grid-template-columns:1fr;gap:0}.hero-copy{padding-bottom:0}.hero h1{font-size:clamp(46px,13vw,62px)}.hero-kicker{font-size:20px}.hero-body{max-width:610px;font-size:12.5px;line-height:1.58}.hero-video iframe{width:180vw;height:101vw;opacity:.9}.hero-overlay{background:linear-gradient(180deg,rgba(2,8,17,.93),rgba(4,12,24,.88) 50%,rgba(5,14,29,.72)),linear-gradient(90deg,rgba(3,10,20,.85),transparent)}.portrait-manifold{min-height:300px;margin-top:-5px}.portrait-shell{width:205px;height:255px}.torus{width:370px;height:300px}.manifold-notes{display:none}.brain-map-section{padding:20px 0}.brain-map-shell{grid-template-columns:1fr;gap:10px}.brain-map-copy{display:flex;align-items:end;justify-content:space-between;gap:16px}.brain-map-copy h2{font-size:25px;max-width:310px}.brain-map-copy>p:last-child{max-width:170px;margin:0;text-align:right;font-size:9px}.brain-stage{height:285px}.connectome-canvas{inset:8% 2%;width:96%;height:84%}.brain-hotspot{max-width:148px}.brain-hotspot strong{font-size:9px}.hotspot-memory{top:7%}.hotspot-vision{left:2%;top:59%}.hotspot-action{right:2%;top:70%}.pillar-popover,.pillar-popover[data-active]{left:50%;right:auto;top:50%;width:min(430px,90%);transform:translate(-50%,-46%) scale(.96)}.pillar-popover.is-open{transform:translate(-50%,-50%)}.section{padding:28px 0}.compact-heading h2{font-size:29px}.publication-row{grid-template-columns:160px 1fr;gap:13px}.publication-media{height:104px}.publication-info h3{font-size:16px}.authors{font-size:9px}.pub-summary{font-size:9.5px}.pub-status-row{gap:5px}.pub-status-row>a,.pub-venue{font-size:7.8px;min-height:22px;padding:3px 7px}.news-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 5px;scrollbar-width:none}.news-grid::-webkit-scrollbar{display:none}.news-card{flex:0 0 245px;scroll-snap-align:start;min-height:320px;grid-template-rows:180px 1fr}.news-card h3{font-size:20px}.experience-icons{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:5px;scrollbar-width:none}.experience-icons::-webkit-scrollbar{display:none}.experience-icon-card{flex:0 0 190px;scroll-snap-align:start}.experience-detail-grid{grid-template-columns:1fr 1fr}.project-grid{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr}.contact-actions{justify-content:flex-start;flex-wrap:wrap}.teaching-hero-grid{grid-template-columns:1fr}.teaching-symbol{display:none}
}

@media(max-width:500px){
  .nav a:nth-child(2){display:none}.hero h1{font-size:47px}.hero-kicker{font-size:18px}.hero-body{font-size:11.8px}.hero-links{margin-top:13px;gap:7px}.hero-links a{padding:7px 8px}.hero-links span{display:none}.portrait-manifold{min-height:270px}.portrait-shell{width:182px;height:225px}.torus{width:330px;height:270px}.brain-map-copy{display:block}.brain-map-copy h2{font-size:24px}.brain-map-copy>p:last-child{max-width:none;text-align:left;margin-top:5px}.brain-stage{height:300px}.hotspot-memory{top:6%}.hotspot-vision{left:1%;top:61%}.hotspot-action{right:1%;top:73%}.brain-hotspot{max-width:136px;padding:6px 8px}.brain-hotspot strong{font-size:8.5px}.pillar-detail-copy h3{font-size:22px}.publication-row{grid-template-columns:1fr;padding:8px}.publication-media{height:160px}.publication-info{padding:3px 3px 4px}.publication-info h3{font-size:16px}.authors{font-size:9px}.pub-summary{font-size:9.8px}.compact-heading{align-items:end}.compact-heading h2{font-size:28px}.text-link{font-size:9px}.news-card{flex-basis:230px}.experience-detail-grid{grid-template-columns:1fr}.project-card{grid-template-columns:48px 1fr}.project-symbol{width:48px;height:48px}.contact-grid h2{font-size:23px}.footer-grid{flex-direction:column;align-items:flex-start}.teaching-hero{padding:92px 0 38px}.teaching-card{grid-template-columns:1fr;gap:5px}.teaching-term{font-size:9px}.teaching-hero h1{font-size:40px}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.reveal{opacity:1;transform:none;transition:none}.torus-spin,.flow-arrow{animation:none!important}.hero-video{display:none}.brain-hotspot,.news-card,.project-card{transition:none!important}}

/* === Refinement: unmistakable torus, real connectome + animated firing, scrollable news === */
.portrait-manifold{min-height:420px}
.portrait-shell{width:286px;height:356px;border-radius:46% 46% 38% 38% / 33% 33% 14% 14%;box-shadow:0 28px 80px rgba(0,0,0,.42),0 0 0 1px rgba(160,224,255,.08)}
.portrait-glow{width:430px;height:320px;background:radial-gradient(ellipse,rgba(64,180,255,.20),rgba(71,93,255,.08) 45%,transparent 70%)}
.torus{width:600px;height:462px}
.torus-back{z-index:2}.torus-front{z-index:4}
.torus-drift,.torus-front-group{transform-origin:350px 330px;animation:torusFloat 9s ease-in-out infinite}
.torus-front-group{animation-delay:-2.2s}
.torus-outer-line,.torus-inner-line,.torus-latitude,.torus-flow,.torus-front-tube,.torus-front-highlight,.torus-front-inner{fill:none;vector-effect:non-scaling-stroke}
.torus-outer-line{stroke:url(#torusEdge);stroke-width:2.4;opacity:.88;filter:drop-shadow(0 0 9px rgba(92,197,255,.4))}
.torus-inner-line{stroke:rgba(177,233,255,.68);stroke-width:2.1;opacity:.9}
.torus-latitude{stroke:rgba(192,239,255,.22);stroke-width:1.2}.torus-latitude.faint{stroke:rgba(166,130,255,.18);stroke-dasharray:6 8}
.torus-flow{stroke:#75e8ff;stroke-width:2.2;stroke-dasharray:13 11;opacity:.72;animation:dash 5s linear infinite}
.torus-flow.second{stroke:#9f82ff;stroke-width:1.5;stroke-dasharray:6 10;opacity:.5;animation-duration:7s;animation-direction:reverse}
.torus-front-tube{stroke:url(#torusFront);stroke-width:56;stroke-linecap:round;opacity:.72;filter:drop-shadow(0 0 13px rgba(77,187,255,.42))}
.torus-front-highlight{stroke:rgba(198,247,255,.34);stroke-width:10;stroke-linecap:round;opacity:.72}
.torus-front-inner{stroke:rgba(5,15,38,.72);stroke-width:8;stroke-linecap:round;opacity:.58}
.manifold-notes span{font-size:8px;padding:5px 8px}.manifold-notes span:nth-child(1){left:0;top:37%}.manifold-notes span:nth-child(2){left:36%;bottom:1%}.manifold-notes span:nth-child(3){right:1%;top:45%}

.brain-map-section{padding:30px 0}
.brain-map-shell{grid-template-columns:190px minmax(0,1fr);gap:24px}
.brain-map-copy h2{font-size:32px}.brain-map-copy>p:last-child{font-size:10.5px}
.brain-stage{height:310px;background:radial-gradient(circle at 50% 48%,rgba(48,52,108,.18),transparent 46%),linear-gradient(135deg,rgba(8,14,31,.76),rgba(2,7,17,.92))}
.connectome-real{position:absolute;z-index:1;left:7%;top:5%;width:86%;height:90%;object-fit:contain;opacity:.82;filter:saturate(1.08) contrast(1.07) brightness(.82);mix-blend-mode:screen;animation:connectomeBreath 7s ease-in-out infinite;pointer-events:none}
.connectome-canvas{inset:5% 7%;width:86%;height:90%;z-index:2;mix-blend-mode:screen;opacity:.92}
.brain-silhouette{z-index:0;width:80%;height:82%;border-color:rgba(125,165,255,.04);background:radial-gradient(ellipse at center,rgba(102,84,255,.06),transparent 60%)}
.brain-region-lines{z-index:3}.line{stroke:rgba(199,231,255,.36);stroke-width:1.3}
.brain-hotspot{z-index:6;max-width:220px;padding:10px 13px;border-radius:12px;border-color:rgba(181,225,255,.34);background:rgba(4,11,24,.88);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.hotspot-region{font-size:8.5px;letter-spacing:.075em;color:rgba(255,255,255,.57)}
.brain-hotspot strong{font-size:14px;line-height:1.18;letter-spacing:-.027em}
.hotspot-dot{width:9px;height:9px;box-shadow:0 0 16px var(--cyan)}
.hotspot-memory{top:6%}.hotspot-memory .hotspot-dot{bottom:-36px}.hotspot-vision{left:2.5%;top:61%}.hotspot-vision .hotspot-dot{right:-31px}.hotspot-action{right:2.5%;top:67%}.hotspot-action .hotspot-dot{left:-31px}
.brain-hotspot:hover,.brain-hotspot:focus-visible,.brain-hotspot.is-active{transform:translateY(-5px) scale(1.045);border-color:rgba(117,232,255,.88);box-shadow:0 14px 34px rgba(0,0,0,.35),0 0 30px rgba(117,232,255,.18)}
.hotspot-memory:hover,.hotspot-memory:focus-visible,.hotspot-memory.is-active{transform:translateX(-50%) translateY(-5px) scale(1.045)}
@keyframes connectomeBreath{0%,100%{opacity:.76;transform:scale(.995);filter:saturate(1.02) contrast(1.04) brightness(.78)}50%{opacity:.92;transform:scale(1.012);filter:saturate(1.18) contrast(1.09) brightness(.9)}}

.news-heading-actions{display:flex;align-items:center;gap:12px}.news-scroll-controls{display:flex;gap:5px}.news-scroll-button{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:#fff;color:#26354a;font:700 14px/1 Inter,sans-serif;cursor:pointer;transition:.16s background,.16s color,.16s border-color}.news-scroll-button:hover,.news-scroll-button:focus-visible{background:#111b2a;color:#fff;border-color:#111b2a;outline:none}
.news-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:1px 2px 10px;scrollbar-width:thin;scrollbar-color:#c7ced8 transparent}
.news-card{flex:0 0 276px;scroll-snap-align:start;grid-template-rows:178px 1fr;min-height:326px}
.news-card h3{font-size:21px}.news-copy{padding:14px 14px 17px}

/* Detailed news page */
.news-page{background:#f5f7f9}.news-page .site-header{background:rgba(5,13,23,.92);backdrop-filter:blur(15px);box-shadow:0 1px 0 rgba(255,255,255,.07)}
.news-hero{padding:112px 0 48px;color:#fff;background:radial-gradient(circle at 82% 18%,rgba(117,232,255,.13),transparent 28%),radial-gradient(circle at 60% 0,rgba(178,107,255,.08),transparent 34%),linear-gradient(135deg,#06111f,#11162c)}
.news-hero h1{margin:0;font-family:var(--serif);font-size:clamp(46px,6vw,72px);line-height:.95;letter-spacing:-.05em}.news-hero p:last-child{max-width:720px;margin:14px 0 0;color:rgba(255,255,255,.7);font-size:13px;line-height:1.65}
.news-archive{padding:40px 0 54px}.news-year-group+.news-year-group{margin-top:34px}.news-year{display:flex;align-items:center;gap:12px;margin-bottom:12px}.news-year h2{margin:0;font-family:var(--serif);font-size:30px}.news-year::after{content:"";height:1px;flex:1;background:var(--line)}
.news-detail-list{display:grid;gap:11px}.news-detail-card{display:grid;grid-template-columns:240px minmax(0,1fr);gap:20px;padding:10px;border:1px solid var(--line);border-radius:16px;background:#fff;scroll-margin-top:86px}.news-detail-media{height:160px;border-radius:11px;overflow:hidden;background:#101b2d}.news-detail-media img{width:100%;height:100%;object-fit:cover}.news-detail-copy{padding:8px 12px 8px 0}.news-detail-copy .signal-kicker{font-size:8px}.news-detail-copy h3{margin:4px 0 0;font-family:var(--serif);font-size:26px;line-height:1.04;letter-spacing:-.032em}.news-detail-copy p{margin:9px 0 0;color:#647286;font-size:11px;line-height:1.58}.news-detail-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.news-detail-links a{padding:6px 9px;border-radius:999px;border:1px solid var(--line);font-size:8.5px;font-weight:800;color:#4d5e75}.news-detail-links a:hover{background:#111b2a;color:#fff;border-color:#111b2a}

@media(max-width:920px){
  .portrait-manifold{min-height:375px}.portrait-shell{width:245px;height:310px}.torus{width:500px;height:395px}
  .brain-map-shell{grid-template-columns:160px 1fr}.brain-stage{height:290px}.brain-hotspot{max-width:180px;padding:9px 11px}.brain-hotspot strong{font-size:12px}.hotspot-region{font-size:7.5px}
  .news-card{flex-basis:260px}.news-detail-card{grid-template-columns:210px 1fr}.news-detail-media{height:150px}
}
@media(max-width:700px){
  .portrait-manifold{min-height:315px}.portrait-shell{width:210px;height:270px}.torus{width:410px;height:330px}
  .brain-map-shell{grid-template-columns:1fr}.brain-stage{height:315px}.connectome-real{left:1%;width:98%;top:8%;height:84%}.connectome-canvas{inset:8% 1%;width:98%;height:84%}
  .brain-hotspot{max-width:170px;padding:8px 10px}.brain-hotspot strong{font-size:11px}.hotspot-region{font-size:7px}.hotspot-memory{top:5%}.hotspot-vision{left:1%;top:62%}.hotspot-action{right:1%;top:72%}
  .news-card{flex-basis:min(78vw,270px)}.news-scroll-button{width:34px;height:34px}
  .news-detail-card{grid-template-columns:1fr;gap:8px}.news-detail-media{height:220px}.news-detail-copy{padding:7px 7px 12px}.news-hero{padding:96px 0 38px}.news-archive{padding-top:28px}
}
@media(max-width:500px){
  .portrait-manifold{min-height:285px}.portrait-shell{width:188px;height:240px}.torus{width:360px;height:292px}
  .brain-stage{height:320px}.brain-hotspot{max-width:150px;padding:7px 9px}.brain-hotspot strong{font-size:10px}.hotspot-region{font-size:6.5px}.hotspot-memory{top:4%}.hotspot-vision{top:64%}.hotspot-action{top:74%}
  .news-heading-actions{gap:7px}.news-scroll-controls{display:none}.news-card{flex-basis:82vw}.news-detail-media{height:190px}.news-detail-copy h3{font-size:23px}
}
@media(prefers-reduced-motion:reduce){.torus-drift,.torus-front-group,.torus-flow,.connectome-real{animation:none!important}}

/* === Final polish: mathematical manifold, restored research placecards, compact high-signal news === */
/* A torus should read like a state-space object, not a painted ring. */
.torus-math{position:absolute;inset:50% auto auto 50%;width:610px;height:430px;transform:translate(-50%,-50%);pointer-events:none;overflow:visible}
.torus-math-back{z-index:2;opacity:.92}
.torus-math-front{z-index:4;opacity:.96}
.portrait-manifold{min-height:420px}
.portrait-shell{z-index:3;width:286px;height:356px;border-radius:45% 45% 38% 38% / 32% 32% 14% 14%;box-shadow:0 24px 64px rgba(0,0,0,.38),0 0 0 1px rgba(145,215,255,.08)}
.portrait-glow{z-index:1;width:470px;height:330px;background:radial-gradient(ellipse,rgba(57,151,220,.15),rgba(86,71,180,.06) 48%,transparent 72%);filter:blur(14px)}
.manifold-notes span{background:rgba(5,13,24,.68);border-color:rgba(173,220,255,.18);font-size:7.5px;letter-spacing:.12em;color:rgba(215,232,246,.7)}
.manifold-notes span:nth-child(1){left:3%;top:38%}.manifold-notes span:nth-child(2){left:37%;bottom:2%}.manifold-notes span:nth-child(3){right:2%;top:45%}

/* Restore the research hover cards to the larger, deliberate placecard scale. */
.pillar-popover{width:445px;max-width:52%;filter:drop-shadow(0 28px 52px rgba(0,0,0,.52))}
.pillar-detail{border-radius:18px;border-color:rgba(180,224,255,.22);background:linear-gradient(145deg,rgba(6,15,29,.985),rgba(11,18,37,.97));box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.pillar-detail-copy{padding:24px 25px 23px}
.pillar-detail-copy span{font-size:8.5px;letter-spacing:.14em}
.pillar-detail-copy h3{margin-top:7px;font-size:31px;line-height:.98;letter-spacing:-.037em}
.pillar-detail-copy p{margin-top:12px;font-size:13px;line-height:1.55;color:rgba(255,255,255,.76)}
.pillar-detail-copy small{margin-top:13px;font-size:9.5px;letter-spacing:.04em;color:rgba(255,255,255,.48)}
.pillar-close{width:34px;height:34px;font-size:20px;background:rgba(255,255,255,.09)}
.pillar-popover[data-active="reasoning"]{right:2.5%;top:9%}
.pillar-popover[data-active="imaging"]{left:3%;top:8%}
.pillar-popover[data-active="flight"]{right:3%;top:8%}

/* Matt Deitke-style signal density: small, image-first cards rather than oversized editorial panels. */
.highlights-section{padding:25px 0 29px;background:#fff}
.highlights-section .compact-heading{margin-bottom:11px}
.news-grid{gap:10px;padding:1px 1px 7px}
.news-card{flex:0 0 224px;grid-template-rows:126px 1fr;min-height:248px;border-radius:13px}
.news-copy{padding:11px 12px 13px}
.signal-kicker{margin-bottom:5px;font-size:7.2px;letter-spacing:.105em}
.news-card h3{font-size:17px;line-height:1.07}
.news-card p{margin-top:6px;font-size:9.3px;line-height:1.4}
.news-scroll-button{width:28px;height:28px}

/* Publications remain compact, but the actual visual evidence is now large enough to inspect. */
.publications{padding-top:31px}
.publication-list{gap:12px}
.publication-row{grid-template-columns:245px minmax(0,1fr);gap:19px;padding:11px 12px}
.publication-media{height:150px;border-radius:11px}
.publication-info h3{font-size:20px;line-height:1.22}
.pub-status-row{margin-top:9px}
.pub-status-row>a,.pub-venue{font-size:9px;min-height:25px;padding:4px 9px}
.authors{font-size:10.5px;line-height:1.46}
.pub-summary{font-size:11px;line-height:1.5}

/* Experience: logos are supporting marks; roles and dates are the readable evidence. */
.experience-icon-card{padding:15px 12px 17px}
.experience-logo{height:45px;margin-bottom:9px}
.experience-logo img{max-width:44px;max-height:44px}
.experience-logo.logo-wide img{max-width:76px;max-height:38px}
.experience-icon-card h3{font-size:14.5px;line-height:1.3}
.experience-icon-card p{margin-top:6px;font-size:12px;line-height:1.35}
.experience-icon-card span{margin-top:5px;font-size:10.5px;line-height:1.42;color:#737f90}
.experience-detail-grid p{padding:11px 12px;font-size:11.4px;line-height:1.55;color:#5e6b7c}
.project-card h3{font-size:15px}.project-card p{font-size:11px;line-height:1.5}

@media(max-width:920px){
  .torus-math{width:500px;height:365px}.portrait-manifold{min-height:370px}.portrait-shell{width:245px;height:310px}
  .pillar-popover{width:390px;max-width:58%}.pillar-detail-copy{padding:20px 21px}.pillar-detail-copy h3{font-size:27px}.pillar-detail-copy p{font-size:12px}
  .news-card{flex-basis:214px;grid-template-rows:120px 1fr;min-height:238px}
  .publication-row{grid-template-columns:220px 1fr}.publication-media{height:138px}.publication-info h3{font-size:18px}
  .experience-icon-card h3{font-size:14px}.experience-icon-card p{font-size:11.5px}.experience-icon-card span{font-size:10px}
}
@media(max-width:700px){
  .torus-math{width:410px;height:315px}.portrait-manifold{min-height:315px}.portrait-shell{width:210px;height:270px}
  .pillar-popover,.pillar-popover[data-active]{width:min(470px,92%);max-width:none;left:50%;right:auto;top:50%;transform:translate(-50%,-46%) scale(.96)}
  .pillar-popover.is-open{transform:translate(-50%,-50%)}
  .pillar-detail-copy{padding:20px 21px}.pillar-detail-copy h3{font-size:27px}.pillar-detail-copy p{font-size:12.2px}
  .news-card{flex-basis:210px;grid-template-rows:118px 1fr;min-height:235px}
  .publication-row{grid-template-columns:190px 1fr;gap:14px}.publication-media{height:125px}.publication-info h3{font-size:17px}.pub-summary{font-size:10.2px}
  .experience-icon-card{flex-basis:205px}.experience-logo{height:42px}.experience-icon-card h3{font-size:14.5px}.experience-icon-card p{font-size:12px}.experience-icon-card span{font-size:10.5px}
}
@media(max-width:500px){
  .torus-math{width:350px;height:275px}.portrait-manifold{min-height:285px}.portrait-shell{width:188px;height:240px}
  .pillar-detail-copy{padding:18px}.pillar-detail-copy h3{font-size:25px}.pillar-detail-copy p{font-size:11.8px}
  .news-card{flex-basis:min(70vw,220px);grid-template-rows:118px 1fr;min-height:234px}.news-card h3{font-size:16.5px}
  .publication-row{grid-template-columns:1fr;padding:9px}.publication-media{height:188px}.publication-info h3{font-size:18px}.authors{font-size:10px}.pub-summary{font-size:10.5px}
  .experience-detail-grid p{font-size:11.6px}.project-card p{font-size:11.2px}
}
@media(prefers-reduced-motion:reduce){.torus-math{opacity:.82}}

/* === Requested correction: full visual research placecards + legible experience === */
/* The popover is intentionally a real placecard, not a compact tooltip. */
.brain-map-section{overflow:visible}
.brain-stage{height:320px;overflow:visible;z-index:3}
.pillar-popover{z-index:30;width:500px;max-width:57%;filter:drop-shadow(0 34px 64px rgba(0,0,0,.58))}
.pillar-detail{grid-template-rows:160px auto;border-radius:20px;overflow:hidden;background:linear-gradient(145deg,rgba(5,13,26,.99),rgba(11,18,37,.985));border:1px solid rgba(185,226,255,.26)}
.pillar-detail.is-active{display:grid}
.pillar-detail-media{position:relative;height:160px;overflow:hidden;background:#07111f;border-bottom:1px solid rgba(255,255,255,.11)}
.pillar-detail-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(3,8,16,.78) 100%);pointer-events:none}
.pillar-detail-media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.015);transition:transform .35s ease,filter .35s ease}
.pillar-detail.is-active .pillar-detail-media img{transform:scale(1.045)}
.pillar-detail-media span{position:absolute;z-index:2;left:18px;bottom:12px;padding:5px 8px;border-radius:999px;background:rgba(4,10,20,.78);border:1px solid rgba(255,255,255,.16);color:#d8f6ff;font-size:8.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;backdrop-filter:blur(8px)}
.pillar-detail-copy{padding:21px 23px 22px}
.pillar-detail-copy span{font-size:9px}
.pillar-detail-copy h3{font-size:30px;line-height:1.01}
.pillar-detail-copy p{font-size:13.5px;line-height:1.56}
.pillar-detail-copy small{font-size:10px}
.pillar-popover[data-active="reasoning"]{right:2%;top:-7%}
.pillar-popover[data-active="imaging"]{left:2%;top:-7%}
.pillar-popover[data-active="flight"]{right:2%;top:-7%}

/* Experience: iconography stays restrained; typography carries the evidence. */
.experience-section .compact-heading h2{font-size:38px;line-height:1.02}
.experience-section .eyebrow{font-size:10.5px}
.experience-icon-card{padding:17px 14px 18px}
.experience-logo{height:36px;margin-bottom:11px}
.experience-logo img{max-width:34px;max-height:34px}
.experience-logo.logo-wide img{max-width:58px;max-height:31px}
.experience-icon-card h3{font-size:16px;line-height:1.27;letter-spacing:-.022em}
.experience-icon-card p{margin-top:7px;font-size:13.5px;line-height:1.35;color:#405067}
.experience-icon-card span{margin-top:6px;font-size:12px;line-height:1.45;color:#6e7a8b}
.experience-detail-grid{gap:12px;margin-top:14px}
.experience-detail-grid p{padding:13px 14px;font-size:13px;line-height:1.58;color:#566476}
.experience-detail-grid strong{font-size:13.5px;color:#172235}

@media(max-width:920px){
  .brain-stage{height:330px}
  .pillar-popover{width:460px;max-width:62%}
  .pillar-detail{grid-template-rows:145px auto}.pillar-detail-media{height:145px}
  .pillar-detail-copy h3{font-size:28px}.pillar-detail-copy p{font-size:13px}
  .experience-section .compact-heading h2{font-size:34px}
  .experience-icon-card h3{font-size:15.5px}.experience-icon-card p{font-size:13px}.experience-icon-card span{font-size:11.5px}
  .experience-detail-grid p{font-size:12.5px}
}
@media(max-width:700px){
  .brain-stage{height:345px}
  .pillar-popover,.pillar-popover[data-active]{width:min(500px,94%);max-width:none;left:50%;right:auto;top:50%;transform:translate(-50%,-46%) scale(.96)}
  .pillar-popover.is-open{transform:translate(-50%,-50%)}
  .pillar-detail{grid-template-rows:138px auto}.pillar-detail-media{height:138px}
  .pillar-detail-copy{padding:18px 19px 19px}.pillar-detail-copy h3{font-size:27px}.pillar-detail-copy p{font-size:12.8px}
  .experience-section .compact-heading h2{font-size:32px}
  .experience-icon-card{flex-basis:220px}.experience-logo{height:34px}.experience-logo img{max-width:32px;max-height:32px}.experience-logo.logo-wide img{max-width:55px;max-height:29px}
  .experience-icon-card h3{font-size:15.5px}.experience-icon-card p{font-size:13px}.experience-icon-card span{font-size:11.5px}
}
@media(max-width:500px){
  .brain-stage{height:360px}
  .pillar-detail{grid-template-rows:132px auto}.pillar-detail-media{height:132px}
  .pillar-detail-copy{padding:17px 17px 18px}.pillar-detail-copy h3{font-size:25px}.pillar-detail-copy p{font-size:12.4px}
  .experience-section .compact-heading h2{font-size:30px}
  .experience-icon-card{flex-basis:225px}.experience-icon-card h3{font-size:15.5px}.experience-icon-card p{font-size:13px}.experience-icon-card span{font-size:11.6px}
  .experience-detail-grid p{font-size:12.7px;line-height:1.55}
}

/* ==========================================================================
   THEME SYSTEM - dark / light
   --------------------------------------------------------------------------
   Every colour on the page resolves through a token below. Two families:

     content tokens  (--paper, --surface, --ink, --line, ...)
       the reading sections: publications, news, experience, projects,
       teaching list, news archive.

     band tokens     (--band-*)
       the immersive full-bleed bands: hero, research, contact, footer,
       news hero, teaching hero, and the fixed header that floats over them.

   The framed connectome panel (.brain-stage and everything inside it) is
   deliberately dark in BOTH themes: connectome.png is authored on a dark
   navy ground and its canvases are additive-glow art. In light mode it
   reads as a scientific figure placed on a light page.

   Canvas colours (torus, ambient neurons, connectome) are not CSS - they
   are swapped in script.js, which listens for the `themechange` event.
   ========================================================================== */

:root{
  color-scheme:light;

  /* content surfaces */
  --paper:#f6f7f9;
  --surface:#ffffff;
  --surface-alt:#f5f7f9;
  --surface-sunken:#eef1f5;

  /* content text */
  --ink:#101725;
  --ink-strong:#172235;
  --ink-2:#405067;
  --muted:#5e6b7c;
  --faint:#8993a1;

  /* content lines */
  --line:#dfe4ea;
  --line-strong:#cfd6e0;

  /* content accents + chips */
  --accent:#0f6f92;
  --chip-bg:#111b2a;
  --chip-fg:#ffffff;
  --chip-soft-bg:#e8f7ff;
  --chip-soft-fg:#15526b;
  --chip-soft-line:#ccecf8;
  --shadow-card:0 12px 28px rgba(21,34,53,.09);
  --shadow-card-lg:0 16px 36px rgba(23,35,54,.11);

  /* immersive bands */
  --band-bg:#e9eef5;
  --band-bg-2:#eff3f8;
  --band-ink:#101725;
  --band-ink-soft:rgba(16,23,37,.74);
  --band-ink-faint:rgba(16,23,37,.5);
  --band-line:rgba(16,23,37,.14);
  --band-line-soft:rgba(16,23,37,.09);
  --band-glass:rgba(255,255,255,.66);
  --band-glass-hover:rgba(255,255,255,.94);
  --band-accent:#0f6f92;
  --band-cta-bg:#111b2a;
  --band-cta-fg:#ffffff;

  /* hero video treatment */
  --hero-video-filter:saturate(.72) contrast(.98) brightness(1.14);
  --hero-overlay:linear-gradient(90deg,rgba(233,238,245,.95) 0%,rgba(233,238,245,.88) 34%,rgba(228,235,244,.52) 62%,rgba(226,234,244,.42) 80%,rgba(226,234,244,.62) 100%),linear-gradient(0deg,rgba(233,238,245,.55),transparent 46%);
  --hero-overlay-mobile:linear-gradient(180deg,rgba(233,238,245,.93),rgba(233,238,245,.84) 52%,rgba(228,235,244,.62)),linear-gradient(90deg,rgba(233,238,245,.74),transparent 70%);

  /* header + footer */
  --header-bg:rgba(246,247,249,.88);
  --header-hairline:0 1px 0 rgba(16,23,37,.09);
  --footer-bg:#e4e9f0;
  --footer-ink:rgba(16,23,37,.62);

  /* page heroes (news / teaching) */
  --page-hero-bg:radial-gradient(circle at 80% 18%,rgba(15,111,146,.09),transparent 28%),linear-gradient(135deg,#e8edf4,#eceaf4);

  /* research panel */
  --stage-bg:radial-gradient(circle at 50% 46%,rgba(15,111,146,.05),transparent 52%),linear-gradient(135deg,#fdfeff,#eef3f9);
  --stage-line:rgba(16,23,37,.13);
  --stage-shadow:0 18px 44px rgba(20,32,54,.14);
  --stage-ink:#101725;
  --stage-ink-soft:rgba(16,23,37,.68);
  --stage-ink-faint:rgba(16,23,37,.46);
  --stage-accent:#0f6f92;
  --stage-glass:rgba(255,255,255,.84);
  --stage-glass-strong:rgba(255,255,255,.97);
  --stage-hotspot-line:rgba(16,23,37,.16);
  --stage-hotspot-shadow:0 8px 20px rgba(20,32,54,.12);
  --stage-hotspot-shadow-active:0 14px 34px rgba(20,32,54,.2),0 0 30px rgba(15,111,146,.13);
  --stage-halo:radial-gradient(ellipse,rgba(15,111,146,.05),transparent 68%);
  --stage-silhouette:radial-gradient(ellipse at center,rgba(70,90,160,.03),transparent 62%);
  --stage-silhouette-line:rgba(16,23,37,.05);
  --stage-line-stroke:rgba(16,23,37,.3);
  --stage-popover-shadow:drop-shadow(0 30px 56px rgba(20,32,54,.3));
  --stage-card:linear-gradient(145deg,#ffffff,#f3f7fb);
  --stage-card-line:rgba(16,23,37,.15);
  --stage-media-bg:#e6ecf4;
  --stage-media-scrim:linear-gradient(180deg,transparent 45%,rgba(255,255,255,.72) 100%);
  --stage-close-bg:rgba(16,23,37,.09);
  --connectome-blend:normal;
  --connectome-anim:connectomeBreathLight;
}

[data-theme="dark"]{
  color-scheme:dark;

  --paper:#080f1a;
  --surface:#0e1725;
  --surface-alt:#0b1320;
  --surface-sunken:#0a111d;

  --ink:#e9eef6;
  --ink-strong:#f4f8fc;
  --ink-2:#b9c5d5;
  --muted:#96a3b7;
  --faint:#7a8a9e;

  --line:#1f2c3f;
  --line-strong:#2b3b52;

  --accent:#75e8ff;
  --chip-bg:#1d2c40;
  --chip-fg:#e4edf8;
  --chip-soft-bg:#0d2c3a;
  --chip-soft-fg:#9ceaff;
  --chip-soft-line:#17495e;
  --shadow-card:0 12px 28px rgba(0,0,0,.45);
  --shadow-card-lg:0 16px 36px rgba(0,0,0,.5);

  --band-bg:#06101d;
  --band-bg-2:#091421;
  --band-ink:#ffffff;
  --band-ink-soft:rgba(255,255,255,.79);
  --band-ink-faint:rgba(255,255,255,.52);
  --band-line:rgba(255,255,255,.14);
  --band-line-soft:rgba(255,255,255,.08);
  --band-glass:rgba(8,18,31,.34);
  --band-glass-hover:rgba(255,255,255,.1);
  --band-accent:#75e8ff;
  --band-cta-bg:#ffffff;
  --band-cta-fg:#111a28;

  --hero-video-filter:saturate(.92) contrast(1.05) brightness(.95);
  --hero-overlay:linear-gradient(90deg,rgba(2,8,17,.93) 0%,rgba(3,10,20,.80) 34%,rgba(5,14,29,.34) 62%,rgba(6,12,26,.24) 80%,rgba(8,13,31,.40) 100%),linear-gradient(0deg,rgba(3,9,18,.48),transparent 46%);
  --hero-overlay-mobile:linear-gradient(180deg,rgba(2,8,17,.90),rgba(4,12,24,.80) 52%,rgba(5,14,29,.50)),linear-gradient(90deg,rgba(3,10,20,.72),transparent 70%);

  --header-bg:rgba(5,13,23,.88);
  --header-hairline:0 1px 0 rgba(255,255,255,.07);
  --footer-bg:#050b13;
  --footer-ink:rgba(255,255,255,.44);

  --page-hero-bg:radial-gradient(circle at 82% 18%,rgba(117,232,255,.13),transparent 28%),radial-gradient(circle at 60% 0,rgba(178,107,255,.08),transparent 34%),linear-gradient(135deg,#06111f,#11162c);

  /* research panel */
  --stage-bg:radial-gradient(circle at 50% 48%,rgba(48,52,108,.18),transparent 46%),linear-gradient(135deg,rgba(8,14,31,.76),rgba(2,7,17,.92));
  --stage-line:rgba(255,255,255,.12);
  --stage-shadow:none;
  --stage-ink:#ffffff;
  --stage-ink-soft:rgba(255,255,255,.76);
  --stage-ink-faint:rgba(255,255,255,.52);
  --stage-accent:#75e8ff;
  --stage-glass:rgba(4,11,24,.88);
  --stage-glass-strong:rgba(16,29,49,.94);
  --stage-hotspot-line:rgba(181,225,255,.34);
  --stage-hotspot-shadow:0 8px 20px rgba(0,0,0,.18);
  --stage-hotspot-shadow-active:0 14px 34px rgba(0,0,0,.35),0 0 30px rgba(117,232,255,.18);
  --stage-halo:radial-gradient(ellipse,rgba(126,78,255,.18),transparent 66%);
  --stage-silhouette:radial-gradient(ellipse at center,rgba(102,84,255,.06),transparent 60%);
  --stage-silhouette-line:rgba(125,165,255,.04);
  --stage-line-stroke:rgba(199,231,255,.36);
  --stage-popover-shadow:drop-shadow(0 34px 64px rgba(0,0,0,.58));
  --stage-card:linear-gradient(145deg,rgba(5,13,26,.99),rgba(11,18,37,.985));
  --stage-card-line:rgba(185,226,255,.26);
  --stage-media-bg:#07111f;
  --stage-media-scrim:linear-gradient(180deg,transparent 45%,rgba(3,8,16,.78) 100%);
  --stage-close-bg:rgba(255,255,255,.09);
  --connectome-blend:screen;
  --connectome-anim:connectomeBreath;
}

/* Colour transitions only on the surfaces that actually flip; excluded from
   animated canvases so the swap never fights requestAnimationFrame. */
body,.hero,.hero-overlay,.brain-map-section,.contact-section,.footer,.site-header,
.publications,.highlights-section,.experience-section,.projects-section,
.publication-row,.news-card,.experience-icon-card,.project-card,.teaching-card,
.news-detail-card,.news-page,.teaching-page{
  transition:background-color .28s ease,color .28s ease,border-color .28s ease,box-shadow .28s ease;
}
@media(prefers-reduced-motion:reduce){body,.hero,.hero-overlay,.brain-map-section,.contact-section,.footer,.site-header,.publications,.highlights-section,.experience-section,.projects-section,.publication-row,.news-card,.experience-icon-card,.project-card,.teaching-card,.news-detail-card{transition:none}}

/* --- Base ---------------------------------------------------------------- */
body{background:var(--paper);color:var(--ink)}
.skip-link{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.eyebrow{color:var(--band-accent)}
.eyebrow.dark{color:var(--muted)}
.text-link{color:var(--band-ink-soft)}
.text-link:hover{color:var(--band-ink)}
.dark-link{color:var(--muted)}
.dark-link:hover{color:var(--ink)}
.button-light{background:var(--band-cta-bg);color:var(--band-cta-fg)}

/* --- Header -------------------------------------------------------------- */
.site-header.is-scrolled,.teaching-header,.news-page .site-header{background:var(--header-bg);box-shadow:var(--header-hairline)}
.brand{border-color:var(--band-line);color:var(--band-ink)}
.nav a,.nav-cta{color:var(--band-ink-soft)}
.nav a:hover,.nav a.active,.nav-cta:hover{color:var(--band-ink)}
.nav-end{display:flex;align-items:center;gap:14px;justify-self:end}
.nav-cta{justify-self:auto}

/* --- Theme toggle -------------------------------------------------------- */
.theme-toggle{flex:none;display:inline-grid;place-items:center;padding:0;border:0;background:none;cursor:pointer;line-height:0}
.theme-toggle-track{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;width:52px;height:26px;padding:0 4px;border-radius:999px;border:1px solid var(--band-line);background:var(--band-glass);backdrop-filter:blur(8px);transition:background .2s ease,border-color .2s ease}
.theme-toggle:hover .theme-toggle-track{border-color:var(--band-accent)}
.theme-toggle:focus-visible{outline:none}
.theme-toggle:focus-visible .theme-toggle-track{border-color:var(--band-accent);box-shadow:0 0 0 2px rgba(117,232,255,.35)}
.theme-icon{position:relative;z-index:2;width:13px;height:13px;justify-self:center;fill:none;stroke:var(--band-ink-faint);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s ease}
.theme-toggle-thumb{position:absolute;z-index:1;left:3px;top:50%;width:20px;height:20px;border-radius:50%;background:var(--band-ink);opacity:.14;transform:translateY(-50%);transition:transform .22s cubic-bezier(.4,0,.2,1)}
:root:not([data-theme="dark"]) .theme-icon-sun{stroke:var(--band-accent)}
[data-theme="dark"] .theme-icon-moon{stroke:var(--band-accent)}
[data-theme="dark"] .theme-toggle-thumb{transform:translate(23px,-50%)}
@media(prefers-reduced-motion:reduce){.theme-toggle-thumb{transition:none}}

/* --- Hero ---------------------------------------------------------------- */
.hero{background:var(--band-bg);color:var(--band-ink)}
.hero-video{background:var(--band-bg)}
.hero-video iframe{filter:var(--hero-video-filter)}
.hero-overlay{background:var(--hero-overlay)}
.hero-body{color:var(--band-ink-soft)}
.hero-links a{border-color:var(--band-line);background:var(--band-glass);color:var(--band-ink-soft)}
.hero-links a:hover{background:var(--band-glass-hover);color:var(--band-ink)}
.portrait-shell{border-color:var(--band-line)}
.manifold-notes span{border-color:var(--band-line);background:var(--band-glass);color:var(--band-ink-faint)}
:root:not([data-theme="dark"]) .portrait-shell{background:linear-gradient(160deg,#ccd8e6,#b6c2d8);box-shadow:0 22px 54px rgba(28,45,70,.18),0 0 0 1px rgba(16,23,37,.06)}
:root:not([data-theme="dark"]) .portrait-glow{background:radial-gradient(ellipse,rgba(15,111,146,.16),rgba(86,71,180,.07) 48%,transparent 72%)}
:root:not([data-theme="dark"]) .portrait-fallback{color:rgba(16,23,37,.5)}

/* --- Research band + connectome panel ------------------------------------ */
/* The panel flips with the rest of the page. connectome.png was authored on a
   dark navy ground, so the page uses connectome-cutout.png: the same figure
   with that ground removed. Dark mode shows it at its original brightness;
   light mode darkens and saturates it with a filter, so one file serves both. */
.brain-map-section{background:var(--band-bg-2);color:var(--band-ink)}
.brain-map-copy>p:last-child{color:var(--band-ink-faint)}
:root:not([data-theme="dark"]) .neural-canvas{opacity:.5}

.brain-stage{color:var(--stage-ink);background:var(--stage-bg);border-color:var(--stage-line);box-shadow:var(--stage-shadow)}
.brain-halo{background:var(--stage-halo)}
.brain-silhouette{background:var(--stage-silhouette);border-color:var(--stage-silhouette-line)}
.line{stroke:var(--stage-line-stroke)}

.connectome-real{mix-blend-mode:var(--connectome-blend);animation-name:var(--connectome-anim)}
.connectome-canvas{mix-blend-mode:var(--connectome-blend)}
@keyframes connectomeBreathLight{
  0%,100%{opacity:.96;transform:scale(.995);filter:saturate(1.34) contrast(1.05) brightness(.62)}
  50%{opacity:1;transform:scale(1.012);filter:saturate(1.5) contrast(1.08) brightness(.54)}
}

.brain-hotspot{border-color:var(--stage-hotspot-line);background:var(--stage-glass);color:var(--stage-ink);box-shadow:var(--stage-hotspot-shadow)}
.brain-hotspot:hover,.brain-hotspot:focus-visible,.brain-hotspot.is-active{border-color:var(--stage-accent);background:var(--stage-glass-strong);box-shadow:var(--stage-hotspot-shadow-active)}
.hotspot-region{color:var(--stage-ink-faint)}
.hotspot-dot{background:var(--stage-accent);box-shadow:0 0 16px var(--stage-accent)}

.pillar-popover{filter:var(--stage-popover-shadow)}
.pillar-detail{background:var(--stage-card);border-color:var(--stage-card-line)}
.pillar-detail-media{background:var(--stage-media-bg);border-bottom-color:var(--stage-card-line)}
.pillar-detail-media::after{background:var(--stage-media-scrim)}
.pillar-detail-media span{background:var(--stage-glass-strong);border-color:var(--stage-hotspot-line);color:var(--stage-accent)}
.pillar-detail-copy span{color:var(--stage-accent)}
.pillar-detail-copy h3{color:var(--stage-ink)}
.pillar-detail-copy p{color:var(--stage-ink-soft)}
.pillar-detail-copy small{color:var(--stage-ink-faint)}
.pillar-close{background:var(--stage-close-bg);color:var(--stage-ink)}

/* --- Publications -------------------------------------------------------- */
.publications{background:var(--surface-alt)}
.publication-row{background:var(--surface);border-color:var(--line)}
.publication-media{background:#0b1119;border-color:var(--line)}
.publication-info h3{color:var(--ink)}
.pub-venue{background:var(--chip-bg);color:var(--chip-fg)}
.pub-venue.accent{background:var(--chip-soft-bg);color:var(--chip-soft-fg);border-color:var(--chip-soft-line)}
.pub-status-row>a{background:var(--surface);border-color:var(--line);color:var(--muted)}
.pub-status-row>a:hover{background:var(--chip-bg);border-color:var(--chip-bg);color:var(--chip-fg)}
.authors{color:var(--muted)}
.equal-note{color:var(--faint)}
.pub-summary{color:var(--muted)}

/* --- News highlights ----------------------------------------------------- */
.highlights-section{background:var(--surface)}
.news-card{background:var(--surface);border-color:var(--line)}
.news-card:hover{box-shadow:var(--shadow-card-lg)}
.news-image{background:var(--surface-sunken)}
.news-card h3{color:var(--ink)}
.news-card p{color:var(--muted)}
.signal-kicker{color:var(--muted)}
.news-grid{scrollbar-color:var(--line-strong) transparent}
.news-scroll-button{background:var(--surface);border-color:var(--line);color:var(--ink-2)}
.news-scroll-button:hover,.news-scroll-button:focus-visible{background:var(--chip-bg);border-color:var(--chip-bg);color:var(--chip-fg)}
.image-replace-note{color:var(--faint)}

/* --- Experience ---------------------------------------------------------- */
.experience-section{background:var(--surface-alt)}
.experience-icon-card{background:var(--surface);border-color:var(--line)}
.experience-icon-card h3{color:var(--ink)}
.experience-icon-card p{color:var(--ink-2)}
.experience-icon-card span{color:var(--muted)}
.experience-detail-grid p{border-top-color:var(--line);color:var(--muted)}
.experience-detail-grid strong{color:var(--ink-strong)}
.experience-logo-fallback{background:var(--surface-sunken);border-color:var(--line);color:var(--muted)}
/* Logos carry their own transparency now (the Swaayatt mark was re-keyed off
   its white square), so no plate is needed. Marks whose ink is too dark for a
   dark page supply a second file via `logo_dark:` and swap here. */
.experience-logo .logo-dark{display:none}
[data-theme="dark"] .experience-logo .logo-dark{display:block}
[data-theme="dark"] .experience-logo .logo-light.has-dark{display:none}

/* --- Projects ------------------------------------------------------------ */
.projects-section{background:var(--surface)}
.project-card{background:var(--surface);border-color:var(--line)}
.project-card:hover{box-shadow:var(--shadow-card)}
.project-category{color:var(--muted)}
.project-card h3{color:var(--ink)}
.project-card p{color:var(--muted)}
.project-symbol{background:var(--chip-bg);color:var(--chip-fg)}
.project-links a{border-color:var(--line);color:var(--muted)}
.project-links a:hover{background:var(--chip-bg);border-color:var(--chip-bg);color:var(--chip-fg)}

/* --- Contact + footer ---------------------------------------------------- */
.contact-section{background:var(--band-bg-2);color:var(--band-ink)}
.footer{background:var(--footer-bg);color:var(--footer-ink)}
.footer a:hover{color:var(--band-ink)}

/* --- News archive page --------------------------------------------------- */
.news-page{background:var(--surface-alt)}
.news-hero{background:var(--page-hero-bg);color:var(--band-ink)}
.news-hero p:last-child{color:var(--band-ink-soft)}
.news-year h2{color:var(--ink)}
.news-year::after{background:var(--line)}
.news-detail-card{background:var(--surface);border-color:var(--line)}
.news-detail-media{background:var(--surface-sunken)}
.news-detail-copy h3{color:var(--ink)}
.news-detail-copy p{color:var(--muted)}
.news-detail-links a{border-color:var(--line);color:var(--muted)}
.news-detail-links a:hover{background:var(--chip-bg);border-color:var(--chip-bg);color:var(--chip-fg)}

/* --- Teaching page ------------------------------------------------------- */
.teaching-page{background:var(--surface-alt)}
.teaching-hero{background:var(--page-hero-bg);color:var(--band-ink)}
.teaching-hero p:last-child{color:var(--band-ink-soft)}
.teaching-symbol{border-color:var(--band-line);color:var(--band-accent)}
:root:not([data-theme="dark"]) .teaching-symbol{background:radial-gradient(circle,rgba(15,111,146,.09),transparent 62%)}
:root:not([data-theme="dark"]) .teaching-symbol span{color:rgba(120,70,180,.75)}
.teaching-card{background:var(--surface);border-color:var(--line)}
.teaching-term{color:var(--muted)}
.teaching-card h3{color:var(--ink)}
.teaching-card p{color:var(--muted)}
.teaching-card a{color:var(--accent)}

/* --- Mobile hero overlay ------------------------------------------------- */
@media(max-width:700px){.hero-overlay{background:var(--hero-overlay-mobile)}}

/* ==========================================================================
   Project cards: the old site's thumbnail, dropped into the existing tile.
   Card geometry is unchanged from the redesign - same 3-up grid, same
   52px tile, same padding. Only the tile's contents changed: the monogram
   is now the fallback behind the image rather than the card's only mark.
   ========================================================================== */
.project-symbol{position:relative;overflow:hidden;background:var(--chip-bg);color:var(--chip-fg)}
.project-symbol img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.project-category{font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}

/* Small screens: keep the toggle, drop the CV pill before the nav collapses. */
@media(max-width:700px){.nav-end{gap:9px}.theme-toggle-track{width:46px;height:24px}.theme-toggle-thumb{width:18px;height:18px}[data-theme="dark"] .theme-toggle-thumb{transform:translate(20px,-50%)}}
@media(max-width:420px){.nav-cta{display:none}}

/* ==========================================================================
   Hero background clip
   --------------------------------------------------------------------------
   Self-hosted MP4 instead of a YouTube embed: no third-party cookies, no
   iframe, and the poster still covers the gap before playback starts.
   script.js attaches the source only on wide screens with motion enabled, so
   phones and reduced-motion visitors never download the video at all.
   ========================================================================== */
.hero-video-el{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;pointer-events:none;filter:var(--hero-video-filter);transition:filter .28s ease}
@media(prefers-reduced-motion:reduce){
  /* Keep the poster: only the moving image is suppressed, not the image. */
  .hero-video{display:block}
  .hero-video-el{transition:none}
}

/* ==========================================================================
   Corrections — navigation reachability, dark-mode institution marks,
   and hero footage that is actually visible behind the type.
   ========================================================================== */

/* --- 1. Every nav destination stays reachable at every width -------------
   The responsive rules above hid News/Experience below 700px and Publications
   below 500px, which removed the only route back to those sections from the
   News and Teaching pages. Keep all five links and let the row scroll
   horizontally instead of deleting destinations. */
@media(max-width:700px){
  .nav a:nth-child(2),
  .nav a:nth-child(3),
  .nav a:nth-child(4){display:inline-flex}
  .nav{
    justify-content:flex-start;
    gap:14px;
    overflow-x:auto;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    /* Room for the tap target without clipping the focus ring. */
    padding:2px 0;
    margin:-2px 0;
  }
  .nav::-webkit-scrollbar{display:none}
  .nav a{flex:0 0 auto;white-space:nowrap}
}
@media(max-width:500px){
  .nav{gap:12px}
  .nav a{font-size:9.5px}
}

/* --- 2. Institution marks in dark mode ----------------------------------
   No plate at all now. The Swaayatt mark was re-keyed off its white square so
   it carries real transparency, and Ford — the one mark whose ink is too dark
   for a dark page — supplies a lifted variant through `logo_dark:`. */
[data-theme="dark"] .experience-logo{background:none;border-radius:0}
[data-theme="dark"] .experience-logo img{background:none;box-shadow:none;padding:0}

/* --- 3. Hero footage that is actually visible ----------------------------
   The overlay was tuned to near-opaque against a bright YouTube embed. The
   self-hosted clip is already graded darker, so the scrim can back off and let
   the flapping-wing footage read behind the type while keeping AA-level
   contrast on the headline. */
:root{
  --hero-video-filter:saturate(.72) contrast(1.0) brightness(1.06);
  --hero-overlay:linear-gradient(90deg,rgba(233,238,245,.90) 0%,rgba(233,238,245,.80) 38%,rgba(228,235,244,.50) 64%,rgba(226,234,244,.62) 100%),linear-gradient(0deg,rgba(233,238,245,.55),transparent 58%);
  --hero-overlay-mobile:linear-gradient(180deg,rgba(233,238,245,.90),rgba(233,238,245,.82) 50%,rgba(228,235,244,.70)),linear-gradient(90deg,rgba(233,238,245,.72),transparent);
}
[data-theme="dark"]{
  --hero-video-filter:saturate(.92) contrast(1.06) brightness(.92);
  --hero-overlay:linear-gradient(90deg,rgba(2,8,17,.90) 0%,rgba(4,12,24,.78) 40%,rgba(5,14,29,.38) 66%,rgba(8,13,31,.52) 100%),linear-gradient(0deg,rgba(3,9,18,.55),transparent 58%);
  --hero-overlay-mobile:linear-gradient(180deg,rgba(2,8,17,.86),rgba(4,12,24,.74) 50%,rgba(5,14,29,.52)),linear-gradient(90deg,rgba(3,10,20,.70),transparent);
}

/* --- 4. Third hotspot points at the mushroom body ------------------------
   The Minimum Information card is labelled MB, but its dot sat over the right
   optic lobe. The mushroom-body calyces are the orange structures high and
   lateral in the connectome. Positioning the card with `left:%` rather than
   `right:%` keeps the dot over the calyx at any stage width, since the
   connectome scales with the stage but a pixel offset would not. */
.hotspot-action{left:60%;right:auto;top:26%}
.hotspot-action .hotspot-dot{left:-26px;top:50%}
/* Same treatment for the optic-lobe card: its dot was sitting in empty space
   to the left of the brain rather than on the lobe it names. */
.hotspot-vision{left:15%;top:58%}
.hotspot-vision .hotspot-dot{right:-30px;top:50%}
@media(max-width:920px){.hotspot-action{left:58%;top:24%}}
@media(max-width:700px){
  /* Stacked layout on narrow screens: keep the three cards from overlapping. */
  .hotspot-memory{top:3%}
  .hotspot-action{left:auto;right:1%;top:32%}
  .hotspot-action .hotspot-dot{left:-24px}
  .hotspot-vision{left:1%;top:64%}
  .hotspot-vision .hotspot-dot{right:-24px}
}
@media(max-width:500px){
  .hotspot-memory{top:2%}
  .hotspot-action{top:33%}
  .hotspot-vision{top:66%}
}

/* ==========================================================================
   Legibility pass
   --------------------------------------------------------------------------
   The redesign leaned on 8–11px type in most secondary roles. That reads as
   "designed" on a large display and as unreadable on a phone or to anyone who
   is not twenty-five. Everything below raises the small end of the scale,
   strengthens muted text against its background, and gives the fixed header a
   scrim so navigation survives a bright frame of the hero video.
   ========================================================================== */

/* --- Muted text carries more contrast ------------------------------------ */
:root{
  --muted:#4d5a6b;          /* was #5e6b7c */
  --faint:#6b7686;          /* was #8993a1 */
  --ink-2:#33425a;
  --band-ink-soft:rgba(16,23,37,.84);
  --band-ink-faint:rgba(16,23,37,.66);
}
[data-theme="dark"]{
  --muted:#a8b5c7;          /* was #96a3b7 */
  --faint:#8e9cae;
  --ink-2:#c6d2e0;
  --band-ink-soft:rgba(255,255,255,.88);
  --band-ink-faint:rgba(255,255,255,.68);
}

/* --- Header: readable over any frame of the video ------------------------ */
.site-header::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,var(--header-scrim),transparent);
  opacity:1;transition:opacity .2s ease;
}
.site-header.is-scrolled::before,.teaching-header::before,.news-page .site-header::before{opacity:0}
:root{--header-scrim:rgba(240,244,249,.92)}
[data-theme="dark"]{--header-scrim:rgba(4,10,20,.82)}
.nav a,.nav-cta{font-size:13px;font-weight:600;color:var(--band-ink-soft)}
.nav a:hover,.nav a.active,.nav-cta:hover{color:var(--band-ink)}
.nav a.active{font-weight:700}
.brand{width:40px;height:40px;font-size:12px;border-color:var(--band-line)}

/* --- Hero ---------------------------------------------------------------- */
.hero-body{font-size:15.5px;line-height:1.72}
.hero-links a{font-size:11.5px;padding:9px 13px}
.hero-links svg{width:16px;height:16px}
.eyebrow{font-size:11px;letter-spacing:.15em}
.manifold-notes span{font-size:9px}

/* A rounded rectangle reads as a portrait; the previous arch did not. */
.portrait-shell{border-radius:22px}
:root:not([data-theme="dark"]) .portrait-shell{box-shadow:0 20px 48px rgba(28,45,70,.20),0 0 0 1px rgba(16,23,37,.08)}

/* --- Section headings ---------------------------------------------------- */
.compact-heading h2{font-size:38px}
.text-link,.dark-link{font-size:12.5px}

/* --- Research band ------------------------------------------------------- */
.brain-map-copy>p:last-child{font-size:12.5px;line-height:1.55}
.hotspot-region{font-size:9.5px}
.brain-hotspot strong{font-size:15px}
.pillar-detail-copy p{font-size:14.5px;line-height:1.6}
.pillar-detail-copy small{font-size:11px}
.pillar-detail-copy span{font-size:10px}

/* --- Publications -------------------------------------------------------- */
.publication-info h3{font-size:21px}
.pub-status-row>a,.pub-venue{font-size:11px;min-height:28px;padding:5px 11px}
.authors{font-size:12.5px;line-height:1.5}
.equal-note{font-size:11px}
.pub-summary{font-size:13.5px;line-height:1.6}

/* --- News ---------------------------------------------------------------- */
.signal-kicker{font-size:9.5px;letter-spacing:.09em}
.news-card{flex-basis:264px;grid-template-rows:150px 1fr;min-height:300px}
.news-card h3{font-size:19px;line-height:1.14}
.news-card p{font-size:12.5px;line-height:1.5}
.news-scroll-button{width:34px;height:34px;font-size:16px}
.news-detail-copy h3{font-size:27px}
.news-detail-copy p{font-size:13.5px;line-height:1.62}
.news-detail-links a{font-size:11px;padding:7px 11px}
.news-year h2{font-size:32px}

/* --- Experience: six roles, two rows of three ---------------------------- */
.experience-icons{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.experience-icon-card{padding:20px 18px 21px}
.experience-logo{height:42px;margin-bottom:13px}
.experience-logo img{max-width:40px;max-height:40px}
.experience-logo.logo-wide img{max-width:76px;max-height:38px}
.experience-icon-card h3{font-size:17px}
.experience-icon-card p{font-size:14px}
.experience-icon-card span{font-size:12.5px}
.experience-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.experience-detail-grid p{font-size:13px;line-height:1.6}

/* --- Projects ------------------------------------------------------------ */
.project-category{font-size:9.5px}
.project-card h3{font-size:16px}
.project-card p{font-size:12.5px;line-height:1.55}

/* --- Contact: the two secondary actions were nearly invisible ------------ */
.contact-grid h2{font-size:34px;line-height:1.12}
.contact-actions{gap:10px}
.contact-actions .button{padding:12px 20px;font-size:13px}
.contact-actions .text-link{
  display:inline-flex;align-items:center;padding:11px 18px;border-radius:999px;
  border:1px solid var(--band-line);color:var(--band-ink);font-size:13px;font-weight:700;
  transition:background .18s ease,border-color .18s ease;
}
.contact-actions .text-link:hover{background:var(--band-glass-hover);border-color:var(--band-ink)}

/* --- Footer + teaching --------------------------------------------------- */
.footer{font-size:11.5px;padding:20px 0}
.teaching-card{grid-template-columns:150px 1fr}
.teaching-term{font-size:12.5px}
.teaching-card h3{font-size:16.5px}
.teaching-card p{font-size:13px;line-height:1.6}
.teaching-card a{font-size:11.5px}

/* --- Phones: the whole point of this pass -------------------------------- */
@media(max-width:700px){
  .container,.nav-wrap{width:min(calc(100% - 28px),var(--max))}
  .nav a,.nav-cta{font-size:12px}
  .hero-body{font-size:15px}
  .compact-heading h2{font-size:30px}
  .experience-icons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
  .experience-icon-card{flex-basis:auto}
  .experience-detail-grid{grid-template-columns:1fr}
  .news-card{flex-basis:min(80vw,278px)}
  .news-card h3{font-size:19px}
  .publication-row{grid-template-columns:1fr}
  .publication-media{height:180px}
  .contact-actions .text-link,.contact-actions .button{padding:12px 18px}
  .teaching-card{grid-template-columns:1fr;gap:6px}
}
@media(max-width:500px){
  .experience-icons{grid-template-columns:1fr}
  .compact-heading h2{font-size:27px}
  .contact-grid h2{font-size:25px}
}

/* Tap targets: 44px minimum for anything a finger has to hit. */
@media(pointer:coarse){
  .nav a,.nav-cta,.text-link,.pub-status-row>a,.news-detail-links a,.project-links a{
    min-height:44px;display:inline-flex;align-items:center;
  }
  .theme-toggle-track{width:58px;height:30px}
  .theme-toggle-thumb{width:24px;height:24px}
  [data-theme="dark"] .theme-toggle-thumb{transform:translate(26px,-50%)}
}

/* Honour the OS "increase contrast" setting rather than ignoring it. */
@media(prefers-contrast:more){
  :root{--muted:#39465a;--faint:#4a5666;--line:#b9c2ce}
  [data-theme="dark"]{--muted:#cfdae8;--faint:#b8c5d5;--line:#3a4c66}
  .nav a,.nav-cta{color:var(--band-ink)}
}

/* Research copy: three levels, each smaller than the last. */
.brain-map-copy h2{font-size:26px;line-height:1.06;letter-spacing:-.032em}
.research-subtitle{margin:9px 0 0;font-size:13px;line-height:1.4;color:var(--band-ink-soft);font-weight:600}
.brain-map-copy .research-hint{margin:7px 0 0;font-size:11px;line-height:1.45;color:var(--band-ink-faint)}

/* The bee crosses the panel edge so it reads as flying out of the connectome
   rather than being stuck on top of it. The glow behind it ties the cutout to
   the panel; without it the transparent PNG looks like a sticker. */
.brain-map-bee{
  position:absolute;z-index:7;left:-58px;bottom:-26px;width:190px;height:auto;
  pointer-events:none;transform:rotate(-7deg);
  filter:drop-shadow(0 14px 22px rgba(0,0,0,.42));
}
.brain-map-bee::after{content:""}
.brain-stage::before{
  content:"";position:absolute;z-index:6;left:-92px;bottom:-58px;width:250px;height:220px;
  border-radius:50%;pointer-events:none;filter:blur(26px);background:var(--bee-glow);
}
:root{--bee-glow:radial-gradient(ellipse,rgba(15,111,146,.20),transparent 68%)}
[data-theme="dark"]{--bee-glow:radial-gradient(ellipse,rgba(117,232,255,.16),transparent 68%)}
@media(max-width:920px){.brain-map-bee{width:158px;left:-44px}.brain-stage::before{left:-70px;width:210px}}
@media(max-width:700px){
  .brain-map-bee{width:126px;left:auto;right:-14px;bottom:-18px;transform:rotate(-7deg) scaleX(-1)}
  .brain-stage::before{left:auto;right:-30px;width:170px;height:150px}
}
@media(max-width:500px){.brain-map-bee{width:104px;right:-8px}}

/* The objective heading used to inherit .brain-map-copy sizing, which no longer
   applies now that the copy sits in its own grid. */

/* The teaching hero already says "Teaching"; the list needs no second heading. */
.teaching-backlink{display:flex;justify-content:flex-end;margin-bottom:14px}
.teaching-list-section{padding-top:28px}

/* No element may create horizontal scroll. `clip` rather than `hidden` so the
   fixed neuron layer and scroll anchoring keep working. */
html{overflow-x:clip}
body{overflow-x:clip;max-width:100vw}

/* On narrow screens the bee stays inside the panel instead of hanging off the
   right edge, where it was adding ~15px of horizontal scroll. */
@media(max-width:700px){
  .brain-map-bee{right:2px;bottom:-10px;width:112px}
  .brain-stage::before{right:-6px;width:150px;height:130px}
}
@media(max-width:500px){.brain-map-bee{width:96px;right:0}}

/* Scroll affordance on the nav for phones. */
@media(max-width:700px){
  .nav{
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent);
    mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent);
  }
}
@media(max-width:430px){
  .nav-wrap{gap:8px}
  .nav{gap:12px}
  .nav a{font-size:11.5px}
  .brand{width:34px;height:34px;font-size:11px}
}

/* The X mark is a solid glyph, unlike the stroke icons beside it. */
.hero-links svg.icon-solid{fill:currentColor;stroke:none}

/* ==========================================================================
   Brand mark as a "you are here" indicator
   ========================================================================== */
.brand{overflow:hidden;white-space:nowrap;transition:width .3s cubic-bezier(.4,0,.2,1),border-radius .3s ease,background .2s ease}
.brand-mark{display:block;font-size:11px;font-weight:800;letter-spacing:.02em}
.brand.is-section{width:auto;min-width:40px;padding:0 15px;border-radius:999px;background:var(--band-glass)}
@media(prefers-reduced-motion:reduce){.brand{transition:none}}

/* The bee keeps the same corner on every screen; it used to jump to the other
   side of the panel on phones, which read as arbitrary. */
@media(max-width:700px){
  .brain-map-bee{left:-12px;right:auto;bottom:-14px;width:118px;transform:rotate(-7deg)}
  .brain-stage::before{left:-26px;right:auto;width:170px;height:150px}
}
@media(max-width:500px){.brain-map-bee{width:100px;left:-8px}}

/* The strip drifts by fractions of a pixel per frame. Two things used to cancel
   that out: scroll-behavior:smooth restarted an animation on every step, and
   scroll-snap-type:x mandatory pulled the strip back to the nearest card edge.
   Snapping is not needed now that there are arrow buttons and a free swipe. */
.news-grid{scroll-behavior:auto;scroll-snap-type:none}
.news-card{scroll-snap-align:none}

/* ==========================================================================
   News strip: transform-driven drift
   --------------------------------------------------------------------------
   scrollLeft is quantised to whole pixels, so at 9px/s the strip advanced in
   1px jerks about nine times a second, which reads as jitter. A transform on
   an inner track is sub-pixel and composited, so the same slow speed is
   continuous. The viewport keeps the clipping; the track carries the motion,
   and pointer drag replaces the native scroll it displaces.
   ========================================================================== */
.news-grid{display:block;overflow:hidden;padding:1px 1px 7px;scrollbar-width:none}
.news-grid::-webkit-scrollbar{display:none}
.news-track{
  display:flex;gap:10px;will-change:transform;
  touch-action:pan-y;                 /* horizontal is ours, vertical is the page's */
  cursor:grab;
}
.news-track.is-dragging{cursor:grabbing}
.news-track.is-dragging .news-card{pointer-events:none}
@media(prefers-reduced-motion:reduce){.news-track{will-change:auto}}

/* ==========================================================================
   Experience: each role's description sits in its own card
   --------------------------------------------------------------------------
   The descriptions used to be a separate grid under the cards. Only four of
   six roles have one, so that row always left an orphan, and each paragraph
   needed a "Zupt." prefix to say which card it belonged to. In the card the
   prefix is redundant and nothing orphans.
   ========================================================================== */
/* Must out-specify `.experience-icon-card p` (0,1,1), which sets weight 600 and
   a larger size for the organisation line. A bare `.experience-detail` (0,1,0)
   loses to it no matter where it sits in the file. */
.experience-icon-card .experience-detail{
  margin:12px 0 0;padding:11px 0 0;border-top:1px solid var(--line);
  font-size:11.5px;line-height:1.55;color:var(--muted);font-weight:400;
}
.experience-icon-card{display:flex;flex-direction:column}
.experience-icon-card .experience-detail{margin-top:auto}
@media(max-width:700px){.experience-icon-card .experience-detail{font-size:11px}}

/* A news entry may carry no photo. Collapse the media row rather than leaving
   an empty band where the image would have been. */
.news-card.no-media{grid-template-rows:1fr}
.news-card.no-media .news-copy{display:flex;flex-direction:column;justify-content:center;padding:18px 16px}
.news-detail-card.no-media{grid-template-columns:1fr}
.news-detail-card.no-media .news-detail-copy{padding:10px 12px}
