/* v4: v1's airy white theme + paper tiles; own hero, news and experience (index-v4.html) */
:root{
  --text:#2f2f30;--ink:#161617;--muted:#6b6b6e;--bg:#fff;--soft:#f6f6f6;--btn:#efefef;--rule:#e7e7e7;--accent:#A31F34;
  --c-blue:#d7e8f4;--c-rose:#f3dce3;--c-sand:#efe4d2;--c-mint:#d6eac7;--c-lilac:#e4dcf2;--c-peach:#f6dcc0;
  --b-paper:#A31F34;--b-poster:#2f2f30;--b-talk:#2E6B3F;--b-review:#9A5B12;--b-spot:#6A3BA8;--b-sel:#1F4E9C;
  --font:"Hanken Grotesk",system-ui,sans-serif;
}
html[data-theme="dark"]{
  --text:#e6e6e6;--ink:#fafafa;--muted:#9a9a9f;--bg:#121213;--soft:#1a1a1c;--btn:#26262a;--rule:#2a2a2e;--accent:#f0798a;
  --c-blue:#1e2a33;--c-rose:#33232a;--c-sand:#2f2a22;--c-mint:#232d1f;--c-lilac:#2a2535;--c-peach:#33281d;
  --b-paper:#f0798a;--b-poster:#d6d6da;--b-talk:#8CCB9B;--b-review:#E3B071;--b-spot:#C7B1EE;--b-sel:#8FB0EA;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
b,strong{font-weight:600;color:var(--ink)}
img{max-width:100%;display:block}
.wrap{width:min(1100px,100% - 32px);margin-inline:auto}
.narrow{width:min(820px,100% - 32px);margin-inline:auto}

/* top bar: name left, links right */
.top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:26px}
.name{font-size:15px;font-weight:600;color:var(--ink);text-decoration:none;letter-spacing:-.01em}
.top nav{display:flex;align-items:center;gap:24px;font-size:14px;font-weight:400}
.top nav a{text-decoration:none;color:var(--muted)}
.top nav a:hover{color:var(--ink)}
.top button{background:none;border:0;padding:0;color:var(--muted);cursor:pointer;display:grid}
.top button svg{width:16px;height:16px}
html:not([data-theme="dark"]) .sun{display:none}html[data-theme="dark"] .moon{display:none}
@media (max-width:640px){.top nav .opt{display:none}.top nav{gap:16px}}

/* hero: one big paragraph, then the photos */
.hero{padding-block:clamp(56px,11vh,120px) 0}
.hero .me{display:flex;align-items:center;gap:12px;margin-bottom:26px;font-size:14px;color:var(--muted)}
.hero .me img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:50% 22%}
.hero .me b{display:block;font-size:15px}
.statement{font-size:clamp(24px,3.1vw,34px);line-height:1.38;font-weight:300;letter-spacing:-.015em;color:var(--text);margin:0;max-width:34ch}
.statement b{font-weight:500}
.statement .hl{font-weight:500;color:var(--ink);background:linear-gradient(transparent 62%,var(--c-lilac) 62%);padding:0 2px}
.statement .hl.b{background:linear-gradient(transparent 62%,var(--c-blue) 62%)}
.statement .hl.m{background:linear-gradient(transparent 62%,var(--c-mint) 62%)}
.statement a{text-decoration:none}
.statement a:hover{color:var(--accent)}
.row-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;background:var(--btn);font-size:13.5px;font-weight:500;color:var(--ink);text-decoration:none;transition:background .15s}
.chip:hover{background:var(--rule)}
.chip svg{width:14px;height:14px}

.photos{display:grid;grid-template-columns:2fr 1fr;gap:14px;margin-top:clamp(48px,8vh,80px)}
.photos figure{margin:0}
.photos .im,.photos .a img{display:block;height:clamp(300px,36vw,440px)}
.photos img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.photos .a img{object-position:30% 30%}
.photos .b img{object-position:50% 42%}
.photos figcaption{margin-top:8px;font-size:12.5px;color:var(--muted)}
.photos figcaption a{color:var(--ink)}
@media (max-width:620px){.photos{grid-template-columns:1fr}.photos .im{height:340px}}

/* intro as a social post card */
.post{background:var(--bg);border:1px solid var(--rule);border-radius:18px;padding:22px 24px 6px;box-shadow:0 1px 2px rgba(0,0,0,.03),0 10px 30px rgba(0,0,0,.04);max-width:640px}
.post-head{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;margin-bottom:16px}
.post-head img{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:50% 22%}
.post-head b{display:block;font-size:15.5px;line-height:1.25}
.post-head span{font-size:13px;color:var(--muted)}
.post-head time{font-size:13px;color:var(--muted);align-self:start;padding-top:2px}
.post .statement{font-size:clamp(19px,2.1vw,23px);line-height:1.5;max-width:none;letter-spacing:-.01em}
.post .hl.e{background:linear-gradient(transparent 58%,var(--c-peach) 58%)}
.post-tags{display:flex;flex-wrap:wrap;gap:4px 10px;margin:14px 0 0;font-size:14px;font-weight:500;color:#1F4E9C}
html[data-theme="dark"] .post-tags{color:#8FB0EA}
.post-actions{display:flex;justify-content:space-between;gap:6px;margin-top:16px;padding:6px 0;border-top:1px solid var(--rule)}
.post-actions a{display:inline-flex;align-items:center;gap:7px;padding:9px 10px;border-radius:10px;font-size:13.5px;font-weight:500;color:var(--muted);text-decoration:none;transition:background .15s,color .15s}
.post-actions a:hover{background:var(--soft);color:var(--ink)}
.post-actions svg{width:17px;height:17px}
@media (max-width:480px){.post{padding:18px 16px 4px}.post-actions a{padding:8px 6px;font-size:12.5px;gap:5px}}

/* hero grid + pinned polaroids */
.hero-grid{display:grid;grid-template-columns:1fr;gap:56px;align-items:center}
@media (min-width:900px){.hero-grid{grid-template-columns:1.25fr 1fr;gap:40px}}
.pinned{position:relative;height:clamp(380px,40vw,470px);max-width:470px;width:100%;justify-self:center}
.pol{position:absolute;display:block;background:#fff;padding:10px 10px 0;border-radius:3px;text-decoration:none;box-shadow:0 1px 2px rgba(0,0,0,.08),0 18px 40px rgba(30,25,20,.16);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
html[data-theme="dark"] .pol{background:#f4f2ee}
.pol img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:1px}
.pol .hand{display:block;font-family:"Caveat",cursive;font-size:21px;font-weight:600;color:#2b2b2b;text-align:center;padding:6px 4px 10px;line-height:1.1}
.pol .tape{position:absolute;top:-11px;left:50%;width:84px;height:24px;transform:translateX(-50%) rotate(-3deg);background:rgba(240,230,200,.78);box-shadow:0 1px 2px rgba(0,0,0,.06);z-index:1}
.pol.one{width:70%;left:0;top:2%;transform:rotate(-5deg);z-index:1}
.pol.one img{object-position:30% 30%}
.pol.two{width:42%;right:-2%;top:42%;transform:rotate(7deg);z-index:2}
.pol.two img{aspect-ratio:3/4;object-position:50% 42%}
.pol.two .tape{background:rgba(214,234,199,.8);transform:translateX(-50%) rotate(4deg)}
.pinned:hover .pol.one{transform:rotate(-8deg) translate(-14px,-6px)}
.pinned:hover .pol.two{transform:rotate(10deg) translate(16px,8px)}
.pol:hover{z-index:3!important;box-shadow:0 2px 4px rgba(0,0,0,.1),0 26px 50px rgba(30,25,20,.22)}
@media (max-width:899px){.pinned{height:clamp(360px,90vw,440px)}}
@media (prefers-reduced-motion:reduce){.pol{transition:none}}

/* sections */
.section{padding-top:clamp(72px,12vh,130px)}
.head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:26px}
.head h2{font-size:22px;font-weight:500;letter-spacing:-.01em;margin:0;color:var(--ink)}
.head a{font-size:14px;color:var(--muted);text-decoration:none}
.head a:hover{color:var(--accent)}

/* paper tiles (from v1) */
.grid{display:grid;grid-template-columns:1fr;gap:34px}
@media (min-width:620px){.grid{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.grid{grid-template-columns:repeat(3,1fr);gap:28px}}
.tile a.cover{display:block;text-decoration:none}
.cover-box{position:relative;aspect-ratio:4/5;display:flex;justify-content:center;align-items:flex-end;overflow:hidden;background-color:var(--c-sand);padding-top:128px}
.cover-box img{margin-bottom:-14%}
.cover-box{background-image:var(--art);background-size:cover;background-position:center}
html[data-theme="dark"] .cover-box{background-image:var(--art-d)}
.stamp{position:absolute;left:18px;top:18px;right:18px;display:flex;flex-direction:column;align-items:center;text-align:center;line-height:1;color:#1d1d1f;z-index:1}
html[data-theme="dark"] .stamp{color:#f2f2f2}
.stamp b{font-size:clamp(28px,2.8vw,38px);font-weight:700;letter-spacing:-.035em}
.stamp span{margin-top:6px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.62}
.cover-box img{width:72%;height:auto;box-shadow:0 1px 2px rgba(0,0,0,.06),0 10px 28px rgba(40,30,20,.14);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.cover-box img.art{border-radius:2px}
.cover-box img.wide{width:88%;margin-bottom:12%}
.tile:hover .cover-box img{transform:translateY(-6px) rotate(-.6deg)}
.blue{background-color:var(--c-blue)}.rose{background-color:var(--c-rose)}.sand{background-color:var(--c-sand)}.mint{background-color:var(--c-mint)}.lilac{background-color:var(--c-lilac)}.peach{background-color:var(--c-peach)}
.tile h3{margin:14px 0 4px;font-size:15px;font-weight:600;color:var(--ink)}
.tile h3 a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.tile .award{margin:0 0 4px;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--b-spot)}
.cover-box .tags{position:absolute;left:12px;right:12px;top:90px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px;z-index:1}
.cover-box .tags .badge{margin:0;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 11px;border:0;border-radius:999px}
.cover-box.blue .tags .badge{background:#a9c8e2;color:#1f3a55}
.cover-box.rose .tags .badge{background:#e5b3c3;color:#5a2235}
.cover-box.sand .tags .badge{background:#dcc8a6;color:#4a3a1f}
.cover-box.mint .tags .badge{background:#b4d59e;color:#25401a}
.cover-box.lilac .tags .badge{background:#c7b8e6;color:#33255e}
.cover-box.peach .tags .badge{background:#ecbd8e;color:#55320f}
.cover-box .tags .badge.spotlight{background:#6A3BA8;color:#fff}
html[data-theme="dark"] .cover-box.blue .tags .badge{background:#2f4a63;color:#d4e6f6}
html[data-theme="dark"] .cover-box.rose .tags .badge{background:#5a3442;color:#f4d6e0}
html[data-theme="dark"] .cover-box.sand .tags .badge{background:#4d4231;color:#efe2c8}
html[data-theme="dark"] .cover-box.mint .tags .badge{background:#36502c;color:#d6eecb}
html[data-theme="dark"] .cover-box.lilac .tags .badge{background:#41385e;color:#e2d9f7}
html[data-theme="dark"] .cover-box.peach .tags .badge{background:#5a4129;color:#f6dcc0}
html[data-theme="dark"] .cover-box .tags .badge.spotlight{background:#C7B1EE;color:#1E1030}
.tile .desc{margin:0 0 4px;font-size:14px;line-height:1.5}
.tile .venue{margin:0;font-size:13px;color:var(--muted)}

/* badges */
.badge{display:inline-block;margin-left:6px;font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:1px 7px;border-radius:999px;border:1px solid currentColor;vertical-align:1px;white-space:nowrap}
.badge.paper{color:var(--b-paper)}.badge.poster{color:var(--b-poster)}.badge.talk{color:var(--b-talk)}.badge.reviewer{color:var(--b-review)}.badge.selected{color:var(--b-sel)}
.badge.spotlight{color:#fff;background:var(--b-spot);border-color:var(--b-spot)}
html[data-theme="dark"] .badge.spotlight{color:#1E1030}

/* news: venue-led rows */
.news{list-style:none;margin:0;padding:0}
.news li{display:grid;grid-template-columns:150px 1fr auto;gap:20px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--rule);font-size:15px}
.news li:first-child{border-top:1px solid var(--rule)}
.news li[hidden]{display:none}
.news .v{font-weight:600;color:var(--ink);font-size:14px;line-height:1.35}
.news .v small{display:block;font-weight:300;color:var(--muted);font-size:12.5px}
.news .bs{display:flex;gap:4px}
.news .bs .badge{margin:0}
@media (max-width:640px){.news li{grid-template-columns:1fr auto;gap:2px 10px}.news .t{grid-column:1/-1}.news .bs{grid-row:1;grid-column:2}}
.toggle{margin-top:16px;background:none;border:0;padding:0;font:inherit;font-size:14px;font-weight:500;color:var(--accent);cursor:pointer}

/* news: mini venue tiles */
.news2{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.news2 li{display:grid;grid-template-columns:58px 112px 1fr auto;gap:18px;align-items:center;padding:12px 16px 12px 12px;border-radius:16px;background:var(--soft);transition:transform .2s,background .2s}
.news2 li:hover{transform:translateX(4px)}
.news2 li[hidden]{display:none}
.mini{position:relative;width:112px;height:64px;border-radius:12px;display:grid;place-items:center;background-size:cover;background-position:center 80%;overflow:hidden}

.mini b{font-size:13px;font-weight:700;letter-spacing:-.02em;color:#1d1d1f;background:rgba(255,255,255,.72);padding:2px 6px;border-radius:6px}
html[data-theme="dark"] .mini b{color:#f2f2f2;background:rgba(0,0,0,.45)}
.news2 .blue .mini{background-color:var(--c-blue)}.news2 .rose .mini{background-color:var(--c-rose)}.news2 .sand .mini{background-color:var(--c-sand)}.news2 .mint .mini{background-color:var(--c-mint)}.news2 .lilac .mini{background-color:var(--c-lilac)}.news2 .peach .mini{background-color:var(--c-peach)}
.nd{display:flex;flex-direction:column;align-items:center;line-height:1;padding-left:4px}
.nd b{font-size:22px;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.nd span{margin-top:4px;font-size:12px;color:var(--muted)}
.flag{position:absolute;top:5px;right:5px;width:22px;height:16px;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1.5px #fff,0 1px 3px rgba(0,0,0,.2)}
.mini .flags{position:absolute;top:5px;right:5px;display:flex;gap:4px}
.fl{width:22px;height:16px;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1.5px #fff,0 1px 3px rgba(0,0,0,.2)}
.cover-box img.tflag{position:absolute;top:14px;right:14px;width:30px;height:21px;margin:0;object-fit:cover;border-radius:4px;box-shadow:0 0 0 2px #fff,0 2px 5px rgba(0,0,0,.18);z-index:2;transform:none!important;transition:none}
.nt .meta{margin:0;font-size:12.5px;color:var(--muted)}
.nt .what{margin:2px 0 0;font-size:15.5px;color:var(--ink);font-weight:400;line-height:1.4}
.nt .what i{font-style:normal;font-weight:600}
.nbs{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.nb{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;white-space:nowrap}
.blue .nb{background:#a9c8e2;color:#1f3a55}.rose .nb{background:#e5b3c3;color:#5a2235}.sand .nb{background:#dcc8a6;color:#4a3a1f}.mint .nb{background:#b4d59e;color:#25401a}.lilac .nb{background:#c7b8e6;color:#33255e}.peach .nb{background:#ecbd8e;color:#55320f}
.news2 .nb.spotlight{background:#6A3BA8;color:#fff}
html[data-theme="dark"] .blue .nb{background:#2f4a63;color:#d4e6f6}html[data-theme="dark"] .rose .nb{background:#5a3442;color:#f4d6e0}html[data-theme="dark"] .sand .nb{background:#4d4231;color:#efe2c8}html[data-theme="dark"] .mint .nb{background:#36502c;color:#d6eecb}html[data-theme="dark"] .lilac .nb{background:#41385e;color:#e2d9f7}html[data-theme="dark"] .peach .nb{background:#5a4129;color:#f6dcc0}
html[data-theme="dark"] .news2 .nb.spotlight{background:#C7B1EE;color:#1E1030}
@media (max-width:640px){.news2 li{grid-template-columns:44px 84px 1fr;gap:12px}.mini{width:84px;height:56px}.mini b{font-size:11px}.nd b{font-size:18px}.nbs{grid-column:3;justify-content:flex-start}}

/* experience: plain two-column */
.jobs{display:grid;grid-template-columns:1fr;gap:0}
.job{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--rule)}
.job:first-child{border-top:1px solid var(--rule)}
.job .when{font-size:13px;color:var(--muted);padding-top:2px}
.job .when.cur{color:var(--accent)}
.job h3{margin:0;font-size:16px;font-weight:600;color:var(--ink)}
.job h3 span{font-weight:300;color:var(--muted)}
.job p{margin:4px 0 0;font-size:14.5px}
@media (max-width:640px){.job{grid-template-columns:1fr;gap:2px}}

/* experience cards */
.xps{display:grid;gap:12px}
.xp{display:grid;grid-template-columns:150px 1fr;gap:22px;padding:14px 22px 14px 14px;border-radius:18px;background:var(--soft)}
.xt{position:relative;border-radius:12px;height:96px;align-self:start;display:grid;place-items:center}
.xp.blue .xt{background-color:var(--c-blue)}.xp.mint .xt{background-color:var(--c-mint)}.xp.lilac .xt{background-color:var(--c-lilac)}.xp.peach .xt{background-color:var(--c-peach)}
.plate{background:rgba(255,255,255,.85);border-radius:8px;padding:6px 10px;font-size:14px;letter-spacing:-.02em;color:#1d1d1f}
html[data-theme="dark"] .plate{background:rgba(0,0,0,.5);color:#f2f2f2}
.plate .lg{height:26px;width:auto}
.plate .lg.cc{height:14px}
html[data-theme="dark"] .plate .lg.cc{filter:invert(1)}
.plate .lg.d{display:none}html[data-theme="dark"] .plate .lg.l{display:none}html[data-theme="dark"] .plate .lg.d{display:block}
.xt .flags{position:absolute;top:7px;right:7px}
.xb header{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;padding-top:6px}
.xb h3{margin:0;font-size:19px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.xb h3 a{text-decoration:none}.xb h3 a:hover{color:var(--accent)}
.xb .role{margin:2px 0 0;font-size:14.5px;font-weight:500;color:var(--text)}
.xb .role span{font-weight:300;color:var(--muted)}
.xp .when{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;white-space:nowrap}
.xp.blue .when{background:#a9c8e2;color:#1f3a55}.xp.mint .when{background:#b4d59e;color:#25401a}.xp.lilac .when{background:#c7b8e6;color:#33255e}.xp.peach .when{background:#ecbd8e;color:#55320f}
.xp .when.cur{background:#A31F34;color:#fff}
.xb ul{list-style:none;margin:12px 0 4px;padding:0;display:grid;gap:7px}
.xb li{position:relative;padding-left:18px;font-size:14.5px;line-height:1.55}
.xb li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%}
.xp.blue li::before{background:#7fa7cc}.xp.mint li::before{background:#90bd76}.xp.lilac li::before{background:#a895d4}.xp.peach li::before{background:#df9e64}
.xb .n{font-weight:600;color:var(--ink);padding:0 4px;border-radius:5px}
.xp.blue .n{background:#d7e8f4}.xp.mint .n{background:#d6eac7}.xp.lilac .n{background:#e4dcf2}.xp.peach .n{background:#f6dcc0}
html[data-theme="dark"] .xp.blue .when{background:#2f4a63;color:#d4e6f6}html[data-theme="dark"] .xp.mint .when{background:#36502c;color:#d6eecb}html[data-theme="dark"] .xp.lilac .when{background:#41385e;color:#e2d9f7}html[data-theme="dark"] .xp.peach .when{background:#5a4129;color:#f6dcc0}
html[data-theme="dark"] .xp .when.cur{background:#f0798a;color:#1a0a0d}
html[data-theme="dark"] .xp.blue .n{background:#1e2a33}html[data-theme="dark"] .xp.mint .n{background:#232d1f}html[data-theme="dark"] .xp.lilac .n{background:#2a2535}html[data-theme="dark"] .xp.peach .n{background:#33281d}
@media (max-width:640px){.xp{grid-template-columns:1fr;padding:12px}.xt{height:80px}}

/* footer */
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-top:clamp(80px,12vh,130px);padding-block:26px 40px;border-top:1px solid var(--rule);font-size:14px;color:var(--muted)}
.foot nav{display:flex;gap:20px;flex-wrap:wrap}
.foot a{text-decoration:none}.foot a:hover{color:var(--ink)}

.reveal{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.tile:hover .cover-box img{transform:none}}

/* tiles keep their pastel; name/logo sit directly on it (no plate) */
.mini b{background:none!important;padding:0;font-size:14px;color:#1d1d1f!important;white-space:nowrap}
html[data-theme="dark"] .mini b{color:#f2f2f2!important}
.news2 li{grid-template-columns:58px 130px 1fr auto}
.news2 li .mini{width:130px}
.xp .plate{background:none!important;padding:0;font-size:17px;font-weight:700;letter-spacing:-.02em;color:#1d1d1f}
html[data-theme="dark"] .xp .plate{color:#f2f2f2}
.plate .lg{height:24px}
.plate .lg.cc{height:14px}
@media (max-width:640px){.news2 li{grid-template-columns:44px 96px 1fr}.news2 li .mini{width:96px}.mini b{font-size:12px}}
.plate .lg.ellm{height:26px}
.plate .lg.ellm.l{display:block}.plate .lg.ellm.d{display:none}
html[data-theme="dark"] .plate .lg.ellm.l{display:none}html[data-theme="dark"] .plate .lg.ellm.d{display:block}