:root{color-scheme:dark;--bg:#111213;--panel:#171819;--hover:#1e2022;--border:#2b2d30;--ink:#eeeff1;--secondary:#a7abb2;--muted:#848992;--green:#72bd99;--tag:#202225;--art:#141617;--ease:cubic-bezier(.2,.75,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,p{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;color:inherit}svg{width:18px;height:18px;flex-shrink:0}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}::selection{background:#415b4e;color:white}.skip{position:absolute;top:-80px;left:20px;padding:15px;background:var(--ink);color:var(--bg);z-index:10}.skip:focus{top:15px}.shell{max-width:1216px;padding:0 42px;margin:auto;display:grid;grid-template-columns:242px minmax(0,1fr);gap:52px}.sidebar{position:sticky;top:0;align-self:start;padding:42px 0 24px;min-width:0}.identity .avatar{display:block;border-radius:50%;border:1px solid var(--border);object-fit:cover;margin-bottom:19px;filter:saturate(.7)}.identity h2{font-size:21px;font-weight:600;letter-spacing:-.6px}.identity p{font-size:13px;color:var(--secondary);margin-top:7px}.handle{display:block;font-size:12px;color:var(--muted);margin-top:7px}.sidebar-bio{font-size:13px;line-height:1.65;color:var(--secondary);margin:24px 0 19px}.profile-facts{display:grid;gap:10px}.profile-facts>span{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--secondary)}.profile-facts svg{width:15px;height:15px;color:var(--muted)}.socials{display:flex;gap:8px;margin-top:20px}.socials a{width:33px;height:31px;border:1px solid var(--border);border-radius:6px;display:grid;place-items:center;color:var(--secondary);transition:background .2s,color .2s,transform .2s}.socials svg{width:16px;height:16px}.socials a:hover{color:var(--ink);background:var(--hover);transform:translateY(-2px)}.section-nav{display:grid;gap:5px;padding:24px 0;border-bottom:1px solid var(--border);margin-bottom:24px}.section-nav a{display:flex;align-items:center;gap:11px;font-size:12px;padding:10px 12px;border-radius:6px;color:var(--secondary);transition:background .2s,color .2s}.section-nav a:hover{background:var(--panel);color:var(--ink)}.section-nav a.active{background:var(--hover);color:var(--ink)}.section-nav svg{width:16px;height:16px;color:var(--muted)}.section-nav a>span{margin-left:auto;font-size:10px;color:var(--muted)}.github-block>div:first-child{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--secondary)}.github-block a{color:var(--muted)}.github-block a:hover{color:var(--ink)}.activity-pattern{display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,1fr);grid-template-columns:repeat(26,1fr);gap:3px;margin:14px 0 12px}.activity-pattern i{aspect-ratio:1;border-radius:1.5px;background:var(--secondary);opacity:calc(.09 + var(--shade)*.11)}.github-block p{font-size:10px;color:var(--muted)}.sidebar-bottom{display:flex;flex-direction:column;align-items:start;gap:12px;margin-top:30px;font-size:10px;color:var(--muted)}.sidebar-bottom button{border:0;background:none;padding:0;font-size:10px;color:var(--muted)}.sidebar-bottom button:hover{color:var(--ink)}main{min-width:0;border-left:1px solid var(--border);padding-left:42px}.topbar{height:80px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--muted)}.topbar>div{display:flex;align-items:center;gap:18px}.topbar a{color:var(--secondary)}.topbar a:hover{color:var(--ink)}.topbar button{border:1px solid var(--border);background:var(--panel);width:29px;height:29px;display:grid;place-items:center;border-radius:6px}.topbar button[hidden]{display:none}.topbar svg{width:15px;height:15px}.section{padding-top:46px}.overview{padding-top:40px}.overline{display:flex;gap:8px;align-items:center;font-size:9px;letter-spacing:1px;color:var(--secondary)}.overline i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px #72bd990c}h1{font-size:clamp(29px,3.1vw,40px);line-height:1.2;font-weight:550;letter-spacing:-1.1px;margin-top:21px}.intro{font-size:14px;line-height:1.85;color:var(--secondary);margin-top:18px;max-width:630px}.now-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}.now-grid>a{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:8px;padding:15px 13px;background:var(--panel);transition:background .2s,border-color .2s,transform .2s}.now-grid>a:hover{background:var(--hover);border-color:#55595d;transform:translateY(-3px)}.now-logo{display:grid;place-items:center;width:30px;height:30px;flex-shrink:0}.now-logo img{width:24px;height:24px;object-fit:contain;filter:grayscale(1)}.now-grid>a>div>span{font-size:10px;display:block;color:var(--secondary)}.now-grid strong{display:block;font-size:13px;font-weight:550;margin-top:5px}.now-label{font-size:9px;margin-left:auto;color:var(--muted);white-space:nowrap}.focus-line{display:flex;gap:20px;margin-top:20px;font-size:10px;color:var(--muted);padding-bottom:32px;border-bottom:1px solid var(--border)}.focus-line span+span:before{content:'·';margin-right:20px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.section-heading h2{font-size:20px;font-weight:550;letter-spacing:-.4px}.section-heading p{font-size:12px;color:var(--muted);margin-top:7px;line-height:1.6}.section-total{font-size:10px;color:var(--muted);white-space:nowrap}.experience-list{display:grid;gap:13px}.experience-card{border:1px solid var(--border);border-radius:9px;background:var(--panel);padding:20px 21px 0}.experience-head{display:flex;align-items:center;gap:12px}.company-icon{width:35px;height:35px;display:grid;place-items:center;flex-shrink:0;background:var(--tag);border:1px solid var(--border);border-radius:7px}.company-icon img{width:23px;height:23px;object-fit:contain;filter:grayscale(1);opacity:.85}.company-icon svg{color:var(--secondary)}.experience-title{min-width:0}.experience-title h3{font-size:14px;font-weight:550;letter-spacing:-.2px}.experience-title p{font-size:11px;color:var(--secondary);margin-top:5px;line-height:1.5}.period{margin-left:auto;text-align:right;font-size:8px;color:var(--muted);line-height:1.6;max-width:145px}.experience-summary{font-size:12px;line-height:1.85;color:var(--secondary);margin-top:16px}.experience-foot{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:16px 0}.tags{display:flex;flex-wrap:wrap;gap:6px}.tags span{border:1px solid var(--border);border-radius:4px;background:var(--tag);color:var(--secondary);font-size:9px;padding:4px 6px;line-height:1.1}.work-type{font-size:9px;color:var(--muted)}details{border-top:1px solid var(--border)}summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:12px 0;color:var(--secondary);font-size:10px}summary::-webkit-details-marker{display:none}summary:hover{color:var(--ink)}summary>i{position:relative;width:11px;height:11px}summary>i:before,summary>i:after{content:'';position:absolute;background:currentColor;width:9px;height:1px;top:5px;left:1px;transition:transform .2s}summary>i:after{transform:rotate(90deg)}details[open] summary>i:after{transform:rotate(0)}.contribution-body{padding:7px 0 22px}.proof{display:flex;gap:15px;align-items:center;margin-bottom:21px;padding:13px;background:var(--bg);border:1px solid var(--border);border-radius:6px}.proof strong{font-size:23px;letter-spacing:-.7px;font-weight:500}.proof span{font-size:11px;line-height:1.5;color:var(--secondary);max-width:220px}.contribution{margin:16px 0}.contribution h4{font-size:12px;font-weight:550}.contribution p{font-size:12px;line-height:1.75;color:var(--secondary);margin-top:5px}.subtle-link{font-size:11px;color:var(--secondary);text-decoration:underline;text-underline-offset:4px}.subtle-link:hover{color:var(--ink)}.filters{display:flex;gap:5px;margin-bottom:17px}.filters button{border:1px solid transparent;background:none;border-radius:6px;padding:7px 11px;color:var(--muted);font-size:11px}.filters button[aria-pressed=true]{background:var(--hover);border-color:var(--border);color:var(--ink)}.filters button:hover{color:var(--ink)}.filters button span{font-size:9px;margin-left:5px;color:var(--muted)}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.project-card{display:block;border:1px solid var(--border);background:var(--panel);border-radius:9px;overflow:hidden;transition:border-color .25s,transform .25s,background .25s}.project-card:hover{border-color:#555a60;transform:translateY(-4px);background:var(--hover)}.project-card[hidden]{display:none!important}.project-art{height:155px;background:var(--art);position:relative;overflow:hidden;border-bottom:1px solid var(--border);color:#3b4249}.project-art>span{position:absolute;top:14px;left:16px;font-size:8px;letter-spacing:.3px;color:var(--muted);z-index:1}.project-art svg{position:absolute;width:100%;height:138px;bottom:-4px;transition:transform .4s var(--ease)}.project-art .bright{stroke:#8e979f}.project-card:hover .project-art svg{transform:translateY(-3px) scale(1.045)}.project-content{padding:18px}.project-content h3{font-size:14px;font-weight:550;letter-spacing:-.2px}.project-content>p{font-size:12px;line-height:1.75;color:var(--secondary);margin:10px 0 17px;min-height:63px}.project-meta{font-size:9px;color:var(--secondary);margin-bottom:16px}.project-content .tags{padding-top:14px;border-top:1px solid var(--border)}.education-card{border:1px solid var(--border);border-radius:9px;background:var(--panel);padding:0 21px}.education-row{display:flex;gap:14px;align-items:start;padding:23px 0}.education-row+.education-row{border-top:1px solid var(--border)}.education-row h3{font-size:13px;font-weight:550}.education-row p{font-size:12px;color:var(--secondary);margin-top:6px;line-height:1.6}.education-row>div>span{display:block;font-size:11px;color:var(--muted);margin-top:7px;line-height:1.6}.stack{margin-top:23px}.stack h3{font-size:12px;font-weight:500;margin-bottom:13px;color:var(--secondary)}footer{display:flex;justify-content:space-between;gap:20px;align-items:center;border-top:1px solid var(--border);padding:32px 0;margin-top:52px}footer h2{font-size:16px;font-weight:550}footer p{font-size:12px;color:var(--muted);margin-top:7px}.contact-button{display:flex;align-items:center;gap:8px;background:var(--ink);color:var(--bg);border-radius:6px;font-size:11px;padding:10px 14px;white-space:nowrap;transition:transform .2s}.contact-button:hover{transform:translateY(-2px)}.contact-button svg{width:14px;height:14px}.page-end{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;padding:0 0 30px}.page-end a:hover{color:var(--ink)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
[data-theme=light]{color-scheme:light;--bg:#fafafa;--panel:#fff;--hover:#f1f2f3;--border:#e1e3e5;--ink:#222528;--secondary:#5d646b;--muted:#727981;--green:#368863;--tag:#f6f7f8;--art:#f5f6f7}[data-theme=light] .project-art{color:#c1c8cf}[data-theme=light] .project-art .bright{stroke:#697681}
@media(prefers-reduced-motion:no-preference){.overview h1{animation:enter .75s var(--ease) both}.overview .intro{animation:enter .75s .1s var(--ease) both}.now-grid>a{animation:enter .7s .18s var(--ease) both}.now-grid>a+ a{animation-delay:.28s}.activity-pattern i{animation:cell-in .6s var(--delay) both}.reveal-ready{opacity:0;transform:translateY(18px);transition:opacity .65s var(--ease),transform .65s var(--ease)}.reveal-ready.is-visible{opacity:1;transform:none}details[open] .contribution-body{animation:enter .3s var(--ease)}}
@keyframes enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes cell-in{from{opacity:0;transform:scale(.3)}to{opacity:calc(.09 + var(--shade)*.11);transform:scale(1)}}.motion-paused *{animation:none!important;transition:none!important}.motion-paused .reveal-ready{opacity:1;transform:none}
@media(min-width:1500px){.shell{max-width:1290px;grid-template-columns:252px minmax(0,1fr);gap:62px}main{padding-left:52px}}
@media(max-width:1000px){.shell{padding:0 28px;grid-template-columns:200px minmax(0,1fr);gap:28px}main{padding-left:28px}.identity h2{font-size:19px}.now-label{display:none}.period{max-width:108px;font-size:7px}.experience-card{padding:18px 16px 0}.experience-foot{align-items:start}.work-type{display:none}.project-content{padding:15px}.project-content>p{min-height:84px}.sidebar-bio{font-size:12px}.section-nav{padding-top:20px}.sidebar-bottom{margin-top:24px}}
@media(max-width:720px){html{scroll-padding-top:18px}.shell{display:block;padding:0 22px}.sidebar{position:relative;padding:28px 0 0}.identity{display:grid;grid-template-columns:54px 1fr;gap:0 14px}.identity .avatar{grid-row:1/4;width:54px;height:54px;margin:0}.identity h2{font-size:19px;align-self:end}.identity p{font-size:12px;margin-top:5px}.identity .handle{font-size:10px;margin-top:4px}.sidebar-bio,.profile-facts,.github-block,.sidebar-bottom{display:none}.socials{position:absolute;right:0;top:32px;margin:0;gap:6px}.socials a{width:28px;height:28px}.socials a:nth-child(2){display:none}.section-nav{display:flex;gap:3px;margin:23px 0 0;padding:0 0 12px;overflow-x:auto;border-bottom:1px solid var(--border)}.section-nav a{padding:8px 10px;font-size:11px;gap:6px;white-space:nowrap}.section-nav a>span{display:none}.section-nav svg{width:13px;height:13px}main{border-left:0;padding-left:0}.topbar{height:56px;border:0}.topbar>span{font-size:10px}.overview{padding-top:19px}h1{font-size:33px;letter-spacing:-1px;line-height:1.18}.intro{font-size:13px;line-height:1.8}.overline{font-size:8px}.now-grid{gap:9px;margin-top:23px}.now-grid>a{padding:13px 10px;gap:7px}.now-logo{width:23px}.now-logo img{width:21px;height:21px}.now-grid>a>div>span{font-size:8px;line-height:1.5}.now-grid strong{font-size:11px}.focus-line{gap:10px;font-size:8px;padding-bottom:25px}.focus-line span+span:before{margin-right:10px}.section{padding-top:34px}.overview{padding-top:19px}.section-heading{gap:12px;margin-bottom:16px}.section-heading h2{font-size:19px}.section-heading p{font-size:11px}.section-total{font-size:9px}.experience-head{flex-wrap:wrap;gap:9px}.experience-title{flex:1}.experience-title p{font-size:10px}.period{max-width:none;margin-left:44px;flex-basis:100%;text-align:left;font-size:8px}.experience-summary{font-size:12px;margin-top:13px}.experience-foot{margin:14px 0}.tags span{font-size:8px}.project-grid{gap:12px}.project-art{height:125px}.project-art>span{left:12px;top:12px;font-size:7px}.project-art svg{height:106px}.project-content{padding:13px}.project-content h3{font-size:12px;line-height:1.5}.project-content>p{font-size:11px;line-height:1.7;min-height:100px;margin-bottom:12px}.project-meta{font-size:8px;line-height:1.5;min-height:24px}.filters{gap:2px}.filters button{font-size:10px;padding:7px 9px}.section-heading .subtle-link{font-size:10px;white-space:nowrap}.education-card{padding:0 16px}.education-row{gap:11px}.education-row h3{font-size:12px}.education-row p{font-size:11px}.education-row>div>span{font-size:10px}footer{margin-top:35px;padding:28px 0}footer h2{font-size:14px}footer p{font-size:10px}.contact-button{font-size:10px;padding:10px}.page-end{font-size:9px}}
@media(max-width:380px){.shell{padding:0 16px}.socials{display:none}.section-nav a{padding:8px;font-size:10px}h1{font-size:29px}.project-grid{grid-template-columns:1fr}.project-content>p{min-height:0}.project-meta{min-height:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal-ready{opacity:1;transform:none}}
@media(max-width:720px){.section-nav a{padding:8px 7px;font-size:10px;gap:5px}}
@media(max-height:800px) and (min-width:721px){.sidebar{position:relative;top:auto}}
/* Refined layout: selected work follows the introduction; career details follow projects. */
.topbar-separator{padding:0 9px;color:var(--border)}
.shell{max-width:1200px;grid-template-columns:224px minmax(0,1fr);gap:38px}
main{padding-left:36px}.sidebar{padding-top:32px}.topbar{height:66px}.overview{padding-top:32px}
.identity .avatar{width:64px;height:64px;margin-bottom:16px}.sidebar-bio{margin:20px 0 16px}
.section-nav{padding:20px 0;margin-bottom:20px;position:relative}.section-nav a{position:relative;isolation:isolate;background:transparent!important}
.nav-marker{position:absolute;left:0;top:0;width:100%;height:34px;border-radius:6px;background:var(--hover);pointer-events:none;transition:transform .38s var(--ease),height .3s var(--ease);z-index:0}
.section-nav a:hover:after{content:'';position:absolute;inset:0;background:var(--hover);border-radius:6px;z-index:-1;opacity:.55}
.section-nav a.active:before{content:'';width:3px;height:13px;position:absolute;left:0;top:50%;transform:translateY(-50%);border-radius:2px;background:var(--secondary)}
.sidebar-bottom{margin-top:22px}.activity-pattern{margin:12px 0 10px}.section{padding-top:40px}.overview{padding-top:32px}
.focus-line{padding-bottom:26px}.now-grid{margin-top:23px}.section-heading{margin-bottom:18px}
.project-grid{align-content:start}.project-card{display:flex;flex-direction:column}.project-content{display:flex;flex-direction:column;flex:1}.project-content>p{min-height:0;margin-bottom:15px}.project-meta{margin-top:auto}.project-art{height:139px}.project-art svg{height:124px}.project-content .tags{margin-top:0}
.experience-card{padding:20px 22px 0}.experience-summary{margin-left:47px}.experience-foot{margin-left:47px}.experience-head{align-items:start}.period{padding-top:3px;font-size:9px}
details{overflow:hidden}summary{padding:14px 0}.contribution-body{padding-left:47px}.education-card{padding:0 22px}.section-nav{scrollbar-width:none}
@media(prefers-reduced-motion:no-preference){
 .reveal-ready{transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--reveal-delay,0ms)}
 .reveal-ready.is-visible{transform:none}
 .project-card.reveal-ready.is-visible{transition:opacity .8s var(--ease),transform .3s var(--ease),border-color .25s,background .25s}
 .project-card.reveal-ready.is-visible:hover{transform:translateY(-5px)}
 .project-card:hover .project-art .bright{stroke-dasharray:420;animation:trace .85s var(--ease) both}
 details[open] .contribution-body{animation:none}
 .now-grid>a{animation-fill-mode:backwards}
 .avatar{animation:profile-in .8s var(--ease) both}
 .section-heading{animation:none}
}
@keyframes trace{from{stroke-dashoffset:420;opacity:.25}to{stroke-dashoffset:0;opacity:1}}
@keyframes profile-in{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
@media(min-width:1500px){.shell{max-width:1280px;grid-template-columns:234px minmax(0,1fr);gap:46px}main{padding-left:42px}}
@media(max-width:1000px){.shell{grid-template-columns:200px minmax(0,1fr);gap:26px}main{padding-left:26px}.period{font-size:8px;max-width:120px}.experience-summary,.experience-foot{margin-left:0}.contribution-body{padding-left:0}.project-content>p{min-height:0}}
@media(max-height:800px) and (min-width:721px){.sidebar{position:sticky;top:0}}
@media(max-height:700px) and (min-width:721px){.github-block,.sidebar-bottom>span{display:none}.section-nav{border-bottom:0;margin-bottom:0}.sidebar-bottom{margin-top:0}}
@media(max-height:570px) and (min-width:721px){.sidebar{position:relative}}
@media(max-width:720px){.shell{display:block}main{padding-left:0}.sidebar{padding-top:25px}.identity .avatar{width:54px;height:54px;margin:0}.section-nav{margin:20px 0 0;padding:0 0 12px;gap:0;overflow:visible}.section-nav a{flex:1;justify-content:center;padding:9px 5px;font-size:10px;gap:5px}.section-nav a.active:before{left:25%;top:auto;bottom:-13px;transform:none;width:50%;height:2px}.nav-marker{transition:transform .35s var(--ease),width .35s var(--ease),height .3s var(--ease)}.topbar{height:52px}.section{padding-top:34px}.overview{padding-top:18px}.now-grid{margin-top:22px}.focus-line{padding-bottom:24px}.project-art{height:120px}.project-art svg{height:106px}.project-content{padding:14px}.project-content>p{font-size:11px;min-height:0}.project-meta{min-height:26px;margin-bottom:10px}.project-content h3{font-size:13px}.experience-card{padding:18px 16px 0}.experience-head{align-items:center}.period{font-size:8px;max-width:none}.experience-summary,.experience-foot{margin-left:0}.contribution-body{padding-left:0}.education-card{padding:0 16px}}
@media(prefers-reduced-motion:reduce){.nav-marker{transition:none}.project-card:hover .project-art .bright{animation:none}}
/* Factual profile copy: biography and education replace generic positioning text. */
.profile-facts{margin-top:22px}
.biography{padding-bottom:28px;border-bottom:1px solid var(--border)}
.biography .intro{max-width:none;font-size:14px;line-height:1.85}
.biography .intro+.intro{margin-top:16px}
.biography a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:3px;transition:text-decoration-color .2s}
.biography a:hover{text-decoration-color:var(--secondary)}
.sidebar-education h3{font-size:10px;font-weight:500;color:var(--muted);margin-bottom:13px}
.sidebar-education p{font-size:12px;color:var(--secondary);line-height:1.6}
.sidebar-education>span{display:block;font-size:11px;color:var(--muted);line-height:1.8}
.sidebar-education>span:last-child{margin-top:7px}
@media(max-width:720px){.profile-facts,.sidebar-education{display:none}.biography .intro{font-size:13px}.biography{padding-bottom:25px}}
@media(max-height:700px) and (min-width:721px){.sidebar-education{display:none}}
/* Brand color stays on the organizations; the surrounding UI remains neutral. */
.brand-zyp{--brand:#04cda9;--brand-rgb:4,205,169}
.brand-next{--brand:#00eb8d;--brand-rgb:0,235,141}
.brand-osu{--brand:#d73f09;--brand-rgb:215,63,9}
.biography{border-bottom:0;padding-bottom:0}
.affiliations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:26px;padding-bottom:28px;border-bottom:1px solid var(--border)}
.affiliation{display:flex;align-items:center;gap:11px;min-width:0;padding:14px 12px;background:var(--panel);border:1px solid var(--border);border-radius:9px;position:relative;overflow:hidden;transition:transform .25s var(--ease),border-color .3s,box-shadow .3s}
.affiliation:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 0 0,rgba(var(--brand-rgb),.09),transparent 75%);opacity:0;transition:opacity .3s}
.affiliation:hover{transform:translateY(-3px);border-color:rgba(var(--brand-rgb),.38);box-shadow:0 7px 17px #00000014}
.affiliation:hover:after{opacity:1}
.brand-tile{display:grid;place-items:center;flex-shrink:0;width:35px;height:35px;border-radius:7px;background:transparent;overflow:hidden;transition:transform .35s var(--ease)}
.brand-tile img{display:block;object-fit:contain;filter:none;opacity:1;max-width:100%;max-height:100%}
.brand-osu .brand-tile{background:#d73f09;border:1px solid #eb673140}
.affiliation-copy{display:flex;flex-direction:column;gap:5px;min-width:0}
.affiliation-copy strong{font-size:12px;font-weight:550;line-height:1.35;letter-spacing:-.15px}
.affiliation-copy>span{font-size:9px;line-height:1.5;color:var(--muted)}
.affiliation:hover .brand-tile{transform:translateY(-2px) rotate(-3deg)}
.experience-card .company-icon img,.education-row .company-icon img{filter:none;opacity:1}
.experience-card.brand-zyp .company-icon{background:transparent;border-color:transparent}
.experience-card.brand-zyp .company-icon img{width:33px;height:33px}
.experience-card.brand-next .company-icon{border:0;background:transparent}
.experience-card.brand-next .company-icon img{width:35px;height:35px}
.brand-osu .company-icon{background:#d73f09;border-color:#eb673140}
.brand-osu .company-icon img{width:23px;height:28px}
.experience-card{position:relative;transition:border-color .3s,box-shadow .3s}
.experience-card:hover{border-color:color-mix(in srgb,var(--brand) 25%,var(--border));box-shadow:inset 2px 0 0 rgba(var(--brand-rgb),.4)}
.sidebar-school{display:flex;align-items:center;gap:10px;margin-bottom:13px}
.sidebar-school .brand-tile{width:32px;height:32px;border-radius:6px}
.sidebar-school p{font-size:12px;line-height:1.45;color:var(--secondary)}
.sidebar-education>span{padding-left:42px;font-size:10px}
.project-art{background-image:radial-gradient(circle,var(--border) .6px,transparent .8px);background-size:13px 13px;color:#515961}
.project-art:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--art),transparent 55%,var(--art));pointer-events:none}
.project-art svg{stroke-width:1.65;transition:transform .45s var(--ease),color .3s}
.project-art .bright{stroke:#aab5bf}
.project-card:hover .project-art{color:#747f88}
.project-card:hover .project-art svg{transform:translateY(-4px) scale(1.065)}
.project-card{box-shadow:0 1px 2px #00000012}
.project-card:hover{box-shadow:0 8px 22px #00000022}
.avatar{box-shadow:0 0 0 4px var(--bg),0 0 0 5px var(--border)}
[data-theme=light] .project-art{color:#a6b1ba}
[data-theme=light] .project-art .bright{stroke:#5b6a76}
[data-theme=light] .project-card:hover .project-art{color:#7f8d99}
@media(prefers-reduced-motion:no-preference){.affiliation{animation:brand-enter .7s var(--ease) backwards}.affiliation:nth-child(1){animation-delay:.15s}.affiliation:nth-child(2){animation-delay:.23s}.affiliation:nth-child(3){animation-delay:.31s}}
@keyframes brand-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:1050px){.affiliation{gap:8px;padding:13px 10px}.affiliation-copy strong{font-size:11px}.affiliation-copy>span{font-size:8px}.brand-tile{width:30px;height:30px}}
@media(max-width:720px){.affiliations{gap:7px;margin-top:23px;padding-bottom:24px}.affiliation{flex-direction:column;align-items:start;gap:11px;padding:13px 11px}.affiliation-copy{gap:5px}.affiliation-copy strong{font-size:11px}.affiliation-copy>span{font-size:8px;line-height:1.6}.brand-tile{width:32px;height:32px}.affiliation.brand-osu .brand-tile img{width:21px;height:26px}}
@media(prefers-reduced-motion:reduce){.affiliation:hover,.affiliation:hover .brand-tile,.project-card:hover .project-art svg{transform:none}}
/* Native vertical chapters, with no wheel interception or fixed-height content clipping. */
html{scroll-padding-top:0;scroll-snap-type:y proximity}
[data-screen]{position:relative;min-height:100svh;padding:48px 0 62px;display:flex;flex-direction:column;justify-content:center;scroll-snap-align:start;scroll-margin-top:0}
#overview[data-screen]{min-height:calc(100svh - 66px);padding-top:30px;scroll-snap-align:end}
.screen-content{width:100%;min-width:0}
.screen-caption{position:absolute;left:0;right:0;bottom:20px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.8px;color:var(--muted)}
.screen-caption>span:last-child{letter-spacing:.2px}
.affiliations{border-bottom:0;padding-bottom:0}
.experience-screens{padding:0}
.work-screen{border-top:1px solid var(--border)}
.work-screen .experience-card{scroll-margin-top:88px}
.work-screen .experience-title h3{font-size:21px;font-weight:550;letter-spacing:-.5px}
.work-screen .experience-title p{font-size:12px;margin-top:7px}
.work-screen .company-icon{width:44px;height:44px;border-radius:9px}
.work-screen .brand-next .company-icon img{width:44px;height:44px}
.work-screen .experience-summary{font-size:13px;line-height:1.8;margin-top:19px}
.work-screen .experience-foot{margin:18px 0}
.work-screen .contribution{margin:14px 0}
.work-screen .contribution p{font-size:12px}
.work-screen .proof{margin-bottom:17px}
#projects[data-screen],#about[data-screen]{border-top:1px solid var(--border)}
#about footer{margin-top:30px;padding-bottom:0}
.screen-position{width:100%;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:9px 14px;margin:5px 0 8px;color:var(--secondary);font-size:10px}
#screen-number{font-variant-numeric:tabular-nums;font-size:13px;color:var(--ink)}
#screen-number>span{font-size:10px;color:var(--muted)}
#screen-name{text-align:right;color:var(--muted)}
.screen-progress{grid-column:1/-1;height:2px;background:var(--border);overflow:hidden;border-radius:2px}
.screen-progress i{display:block;height:100%;background:var(--secondary);transform:scaleX(var(--screen-progress,.142857));transform-origin:left;transition:transform .65s var(--ease)}
@media(prefers-reduced-motion:no-preference){
 .screens-ready [data-screen]>.screen-content{opacity:0;transform:translateY(42px) scale(.98);transition:opacity .75s var(--ease),transform .9s var(--ease)}
 .screens-ready [data-screen].is-in-view>.screen-content,.screens-ready [data-screen]:focus-within>.screen-content{opacity:1;transform:none}
 .screens-ready [data-screen].is-in-view .section-heading{animation:chapter-heading .8s .08s var(--ease) both}
 .screens-ready [data-screen].is-in-view .section-heading:after{animation:chapter-rule .85s .12s var(--ease) both}
 .screens-ready .section-heading{position:relative}
 .screens-ready .section-heading:after{content:'';position:absolute;bottom:-8px;left:0;width:26px;height:1px;background:var(--secondary);transform-origin:left}
 .screens-ready #overview.is-in-view h1{animation:enter .85s .08s var(--ease) both}
 .screens-ready #overview.is-in-view .biography{animation:enter .9s .16s var(--ease) both}
 .screens-ready #overview.is-in-view .affiliations{animation:enter .9s .24s var(--ease) both}
 .screens-ready .overview .intro,.screens-ready .affiliation{animation:none}
 .screens-ready #projects.is-in-view .project-art svg{animation:diagram-enter 1s var(--ease) both}
 .screens-ready #projects.is-in-view .project-card:nth-child(even) .project-art svg{animation-delay:.12s}
 .motion-paused [data-screen]>.screen-content{opacity:1!important;transform:none!important}
}
@keyframes chapter-heading{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes chapter-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes diagram-enter{from{opacity:.15;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(min-width:721px) and (min-height:700px){
 #projects .project-art{height:90px}#projects .project-art svg{height:87px}
 #projects .project-content{padding:14px 16px}#projects .project-content>p{font-size:11px;line-height:1.65;margin:8px 0 11px}
 #projects .project-meta{font-size:8px;margin-bottom:10px}#projects .project-content .tags{padding-top:10px}
}
@media(max-width:720px){
 html{scroll-snap-type:none;scroll-padding-top:12px}
 [data-screen]{min-height:calc(100svh - 24px);padding:38px 0 58px}
 #overview[data-screen]{min-height:calc(100svh - 205px);padding-top:20px}
 .experience-screens{padding-top:0}.screen-caption{bottom:18px}
 .work-screen .experience-title h3{font-size:18px}.work-screen .experience-title p{font-size:11px}
 .work-screen .experience-summary{font-size:12px}.work-screen .period{margin-left:53px}
 .work-screen .contribution-body{padding-left:0}
 #about footer{margin-top:25px}
}
@media(prefers-reduced-motion:reduce){html{scroll-snap-type:none}.screen-progress i{transition:none}}

/* Real project media: static on the page, motion only after an explicit play. */
#projects .project-grid{gap:16px}
.project-preview{display:block;position:relative;width:calc(100% - 20px);margin:10px 10px 0;padding:0;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--border);border-radius:6px;background:#090c10;text-align:left}
.project-preview img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .65s var(--ease)}
.project-preview[data-preview=swiftlabel] img{object-fit:contain}
.project-preview:hover img{transform:scale(1.035)}
.preview-action{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;gap:12px;padding:7px 9px;border:1px solid #ffffff25;border-radius:5px;background:#151719ed;color:#f1f1f1;font-size:10px;opacity:0;transform:translateY(5px);transition:opacity .2s,transform .2s}
.preview-action svg{width:13px;height:13px}
.project-preview:hover .preview-action,.project-preview:focus-visible .preview-action{opacity:1;transform:none}
#projects .project-content{padding:17px 18px}
#projects .project-content h3{font-size:15px}
.project-content h3 a:hover{text-decoration:underline;text-underline-offset:4px}
#projects .project-content>p{font-size:12px;line-height:1.65}
#projects .project-meta{font-size:10px}
.compact-project{background:transparent}
#projects .compact-project .tags{display:none}
#projects .compact-project .project-meta{margin-bottom:0}
#projects .compact-project .project-content h3{font-size:13px}
#project-viewer{width:min(1040px,calc(100vw - 32px));max-height:calc(100dvh - 40px);padding:0;border:1px solid var(--border);border-radius:12px;background:var(--panel);color:var(--ink);overflow:auto;box-shadow:0 30px 100px #0007}
#project-viewer::backdrop{background:#000b}
.viewer-header,.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px}
.viewer-header h2{font-size:15px;font-weight:550}
.viewer-close{display:flex;align-items:center;gap:14px;border:0;background:transparent;font-size:12px;color:var(--secondary);padding:5px}
.viewer-close span{font-size:22px;line-height:1}
.viewer-stage{background:#080a0c;border-block:1px solid var(--border);display:grid;place-items:center;min-height:180px}
.viewer-stage img{display:block;max-width:100%;max-height:calc(100dvh - 200px);object-fit:contain}
.viewer-footer{font-size:11px;color:var(--secondary)}
.viewer-footer>div{display:flex;gap:12px;align-items:center;flex-shrink:0}
.viewer-footer button,.viewer-footer a{padding:9px 12px;border:1px solid var(--border);border-radius:6px;background:var(--hover);color:var(--ink);font-size:11px}
.viewer-footer button[hidden]{display:none}
body:has(#project-viewer[open]){overflow:hidden}
@media(prefers-reduced-motion:no-preference){body:not(.motion-paused) #project-viewer[open]{animation:preview-open .25s var(--ease)}@keyframes preview-open{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}}
@media(max-width:720px){#projects .project-grid{grid-template-columns:1fr}.project-preview{aspect-ratio:16/10}.preview-action{opacity:1;transform:none}#projects .project-content>p{font-size:12px}.viewer-header,.viewer-footer{padding:14px}.viewer-footer{align-items:start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.project-preview img,.preview-action{transition:none}.project-preview:hover img{transform:none}}
.motion-paused .project-preview img,.motion-paused .preview-action{transition:none}

.education-row.brand-yandex .company-icon{background:#fff;overflow:hidden;border-color:#ffffff20}.education-row.brand-yandex .company-icon img{width:100%;height:100%;filter:none;opacity:1;object-fit:contain}.education-row h3 a:hover{text-decoration:underline;text-underline-offset:4px}

#viewer-video[hidden]{display:none}#projects .compact-project{align-self:start}#projects .compact-project:last-child{grid-column:1/-1}
@media(min-width:1100px){#projects .project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#projects .project-content{padding:16px 14px}#projects .project-content .tags{flex-wrap:wrap}#projects .compact-project .project-content{padding:16px 18px}}

/* Start the introduction below the toolbar instead of centering it vertically. */
#overview[data-screen]{justify-content:flex-start;padding-top:44px}
@media(max-width:720px){#overview[data-screen]{padding-top:20px}}

/* The intro follows its content height, so the projects are visible below it. */
#overview[data-screen]{min-height:0;padding-bottom:40px;scroll-snap-align:none}
#overview>.screen-caption{display:none}
#projects[data-screen]{justify-content:flex-start;padding-top:34px}
@media(max-width:720px){#overview[data-screen]{min-height:0;padding-bottom:30px}#projects[data-screen]{padding-top:28px}}
