@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500&display=swap');
:root{color-scheme:dark;--bg:#080808;--text:#f8f7f4;--muted:#c9c5bf;--faint:#a7a09a;--line:#ffffff32;--accent:#efa161;--button:#00000055;--selected:#f8f7f4;--selected-text:#181310}
:root[data-theme=light]{color-scheme:light;--bg:#eeeae2;--text:#201b17;--muted:#50453c;--faint:#675c51;--line:#201b1745;--accent:#a9410c;--button:#fff7;--selected:#201b17;--selected-text:#f7f4ef}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg)}body{font-family:Geist,Arial,sans-serif;color:var(--text);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:hover{color:var(--accent)}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}::selection{color:#17120e;background:#efa161}#shader{position:fixed;inset:0;background:radial-gradient(ellipse at 65% 35%,#95501e,transparent 40%),var(--bg);pointer-events:none}#shader canvas{display:block;width:100%;height:100%}.veil{position:fixed;inset:0;pointer-events:none;background:linear-gradient(0deg,#080808ed 0%,#080808ab 22%,#08080819 62%,#08080826 100%)}[data-theme=light] .veil{background:linear-gradient(0deg,#eeeae2f5 0%,#eeeae2b3 30%,#eeeae212 70%,#eeeae22b)}.stage{position:relative;height:100svh;min-height:620px;isolation:isolate}.top{position:absolute;top:24px;left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:5}.identity{display:flex;align-items:center;gap:15px}.wordmark{display:flex;width:44px;height:40px}.wordmark svg{width:100%;height:100%}.wordmark:hover{color:var(--text)}.domain,.page-count,.eyebrow,.strip,.current,.project-meta,.project-url,.github-more,.local-time{font-family:'Geist Mono',monospace}.domain{font-size:10px;letter-spacing:.12em}.controls{display:flex;align-items:center;gap:12px}.page-count{font-size:10px;letter-spacing:.13em;margin-right:15px;white-space:nowrap}.icon-button,.sound-button{width:30px;height:30px;border:0;background:transparent;border-radius:50%;display:grid;place-items:center;padding:6px;color:var(--muted)}.icon-button:hover,.sound-button:hover{color:var(--text);background:var(--button)}.icon-button svg,.sound-button svg{width:16px;height:16px}.sound-button[aria-pressed=false] .sound-waves{display:none}.play-icon{display:none}#motion[aria-pressed=true] .play-icon{display:block}#motion[aria-pressed=true] .pause-icon{display:none}main{outline:none}.scene{position:absolute;inset:115px 36px 108px;display:flex;align-items:flex-end;pointer-events:none}.scene[hidden]{display:none}.scene-body{pointer-events:auto;max-width:100%;animation:arrive .45s cubic-bezier(.2,.7,.2,1) both}.eyebrow{display:block;font-size:10px;letter-spacing:.12em;font-weight:400;margin:0 0 18px;color:var(--muted)}h1{font-size:clamp(56px,7.2vw,104px);letter-spacing:-.065em;font-weight:500;line-height:1.02;margin:0 0 22px;text-shadow:0 2px 30px #00000015}.lead{font-size:clamp(16px,1.6vw,21px);line-height:1.55;letter-spacing:-.025em;margin:0 0 22px;color:var(--muted)}.current{font-size:10px;line-height:1.8;color:var(--faint);margin:0}.current a{color:var(--text);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}.bottom{position:absolute;bottom:24px;left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:5}.strip{display:flex;gap:6px;flex-wrap:wrap}.strip button{font-family:inherit;white-space:nowrap;font-size:10px;padding:9px 12px;background:var(--button);border:1px solid var(--line);border-radius:4px;transition:background .2s,border-color .2s;color:var(--muted)}.strip button span{font-size:8px;opacity:.6;margin-right:9px}.strip button:hover{color:var(--text);border-color:var(--text)}.strip button[aria-selected=true]{background:var(--selected);border-color:var(--selected);color:var(--selected-text)}.footer-meta{display:flex;align-items:center;gap:22px}.elsewhere{display:flex;gap:7px}.elsewhere a{width:29px;height:29px;display:grid;place-items:center;color:var(--muted)}.elsewhere a:hover{color:var(--accent)}.elsewhere svg{width:14px;height:14px}.local-time{font-size:9px;white-space:nowrap;display:flex;gap:8px;align-items:center;color:var(--muted)}.status-dot{width:4px;height:4px;display:block;background:var(--accent);border-radius:50%}.work .scene-body{width:min(850px,100%)}.work h1{font-size:clamp(48px,6vw,84px);margin-bottom:30px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-bottom:25px}.project{display:block;border-top:1px solid var(--line);padding:17px 0 0;transition:border-color .2s}.project:hover{color:var(--text);border-color:var(--accent)}.project-meta{font-size:8px;letter-spacing:.13em;color:var(--faint)}.project h2{font-size:34px;font-weight:500;letter-spacing:-1.5px;line-height:1.15;margin:12px 0}.project h2 span{color:var(--accent)}.project p{font-size:13px;line-height:1.65;color:var(--muted);margin:0 0 17px}.project-url{font-size:10px;color:var(--accent)}.project:hover .project-url{text-decoration:underline;text-underline-offset:5px}.github-more{font-size:9px;color:var(--faint)}.about .scene-body{width:min(850px,100%)}.about h1{font-size:clamp(48px,6vw,84px);margin-bottom:25px}.about-copy{display:grid;grid-template-columns:1.25fr 1fr;gap:38px;max-width:850px}.about-copy p{color:var(--muted);font-size:14px;line-height:1.8;margin:0;letter-spacing:-.1px}.skip{position:fixed;top:-100px;left:20px;z-index:20;background:var(--text);color:var(--bg);padding:9px}.skip:focus{top:10px}.project.pulsing{animation:tap .2s ease-out}@keyframes tap{50%{transform:translateY(1px)}}@keyframes arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media(min-width:1600px){.top{top:32px;left:48px;right:48px}.scene{left:48px;right:48px;bottom:128px}.bottom{left:48px;right:48px;bottom:32px}}@media(max-width:850px){.footer-meta{gap:12px}.local-time{font-size:8px}.strip button{padding:8px 10px;font-size:9px}.strip button span{margin-right:5px}.top,.bottom{left:24px;right:24px}.scene{left:24px;right:24px}.domain{font-size:9px}.identity{gap:9px}.about-copy{gap:26px}.about-copy p{font-size:13px}}@media(max-width:600px){.stage{min-height:650px}.top{top:17px;left:20px;right:20px}.domain{display:none}.controls{gap:5px}.page-count{font-size:9px;margin-right:10px}.scene{inset:100px 20px 145px}.eyebrow{font-size:8px;line-height:1.8;letter-spacing:.09em;margin-bottom:16px}h1{font-size:clamp(47px,12vw,72px);letter-spacing:-.06em;margin-bottom:20px}.lead{font-size:16px}.current{font-size:8px}.bottom{bottom:18px;left:20px;right:20px;flex-direction:column;align-items:stretch;gap:15px}.strip{gap:5px}.strip button{flex:1;font-size:9px;padding:10px 8px}.footer-meta{justify-content:space-between}.local-time{font-size:8px}.elsewhere a{height:22px;width:25px}.elsewhere svg{height:13px;width:13px}.projects{gap:20px;margin-bottom:19px}.project h2{font-size:27px;letter-spacing:-1px}.project p{font-size:11px}.project-meta{font-size:6px}.project-url{font-size:8px}.github-more{font-size:8px}.work h1,.about h1{font-size:44px;margin-bottom:21px}.about-copy{grid-template-columns:1fr;gap:17px}.about-copy p{font-size:12px;line-height:1.7}.about .eyebrow{font-size:7px}.work .eyebrow{font-size:7px}.desktop{display:none}}@media(max-height:700px) and (min-width:601px){.scene{top:90px;bottom:95px}.top{top:15px}h1{font-size:65px}.work h1,.about h1{font-size:52px;margin-bottom:18px}.about-copy p{font-size:12px}.project h2{font-size:26px}.eyebrow{margin-bottom:12px}.bottom{bottom:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Career timeline: a fixed title beside independently scrollable chapters. */
.history{align-items:stretch}.history .scene-body{display:grid;grid-template-columns:250px minmax(0,650px);gap:58px;width:100%;min-height:0}.history-heading{align-self:end;padding-bottom:7px}.history h1{font-size:clamp(50px,6vw,82px);margin-bottom:20px}.history-heading>p{font-size:14px;color:var(--muted);line-height:1.65;letter-spacing:-.2px;margin:0 0 27px}.scroll-hint{font:8px 'Geist Mono',monospace;letter-spacing:.1em;color:var(--faint)}.timeline-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding:4px 22px 4px 0}.timeline{list-style:none;margin:0;padding:0;position:relative}.timeline:before{content:'';position:absolute;left:95px;top:8px;bottom:12px;width:1px;background:var(--line)}.timeline-entry{position:relative;display:grid;grid-template-columns:74px minmax(0,1fr);gap:45px;padding-bottom:39px}.timeline-entry:last-child{padding-bottom:0}.timeline-entry:before{content:'';position:absolute;left:92px;top:7px;width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 5px var(--bg)}.timeline time{font:9px 'Geist Mono',monospace;letter-spacing:.06em;color:var(--faint);padding-top:7px;white-space:nowrap}.timeline h2{font-size:25px;letter-spacing:-.8px;line-height:1.2;font-weight:500;margin:0 0 7px}.career-role{font:9px/1.7 'Geist Mono',monospace;color:var(--faint);margin:0 0 12px}.career-summary{font-size:13px;line-height:1.75;color:var(--muted);margin:0 0 16px;max-width:475px}.career-milestone{display:flex;gap:17px;align-items:center}.career-milestone strong{font-size:32px;font-weight:500;letter-spacing:-1.5px;line-height:1.1;color:var(--accent);white-space:nowrap}.career-milestone>span{font-size:11px;line-height:1.6;color:var(--muted);max-width:245px}.launch-milestone{align-items:flex-start;flex-direction:column;gap:7px}.launch-milestone strong{font-size:21px;letter-spacing:-.7px}.launch-milestone>span{max-width:350px}
@media(max-width:1000px){.history .scene-body{grid-template-columns:200px minmax(0,1fr);gap:30px}.timeline-entry{grid-template-columns:65px minmax(0,1fr);gap:34px}.timeline:before{left:80px}.timeline-entry:before{left:77px}.career-milestone{gap:12px}.career-milestone strong{font-size:28px}.launch-milestone strong{font-size:20px}.footer-meta{gap:8px}.strip button{padding-left:9px;padding-right:9px}}
@media(max-width:750px){.history .scene-body{grid-template-columns:155px minmax(0,1fr);gap:22px}.history h1{font-size:48px}.career-milestone{align-items:flex-start;flex-direction:column;gap:6px}.timeline h2{font-size:22px}.career-summary{font-size:12px}.career-role{font-size:8px}.strip button{font-size:8px;padding:8px}.strip button span{margin-right:4px}.footer-meta{gap:5px}.local-time{font-size:7px}}
@media(max-width:600px){.history .scene-body{display:flex;flex-direction:column;gap:22px}.history-heading{align-self:stretch;padding:0}.history h1{font-size:44px;margin:0}.history .eyebrow{margin-bottom:7px}.history-heading>p{display:none}.scroll-hint{display:none}.timeline-scroll{flex:1;padding-right:12px;padding-bottom:12px}.timeline-entry{grid-template-columns:53px minmax(0,1fr);gap:23px;padding-bottom:32px}.timeline:before{left:62px}.timeline-entry:before{left:59px;top:6px;width:6px;height:6px;box-shadow:0 0 0 4px var(--bg)}.timeline time{font-size:7px;padding-top:6px}.timeline h2{font-size:22px}.career-role{font-size:7px;line-height:1.7;margin-bottom:9px}.career-summary{font-size:11px;line-height:1.7;margin-bottom:13px}.career-milestone strong{font-size:27px}.career-milestone>span{font-size:10px;line-height:1.65}.launch-milestone strong{font-size:18px}.strip{flex-wrap:nowrap}.strip button{font-size:8px;padding:10px 7px}.strip button span{display:none}.local-time{font-size:8px}.history{bottom:145px}}
body:has(.stage[data-scene=history]) .veil{background:linear-gradient(90deg,#08080866,#080808d9 32%,#080808d9 82%,#08080866)}
[data-theme=light] body:has(.stage[data-scene=history]) .veil{background:linear-gradient(90deg,#eeeae266,#eeeae2e6 32%,#eeeae2e6 82%,#eeeae266)}

.career-roles{margin:13px 0 16px;display:grid;gap:8px}.career-roles>div{display:grid;grid-template-columns:116px minmax(0,1fr);gap:12px;align-items:baseline}.career-roles dt{font:8px/1.6 'Geist Mono',monospace;color:var(--faint);white-space:nowrap}.career-roles dd{margin:0;font-size:11px;line-height:1.5;color:var(--muted)}
@media(max-width:1000px){.career-roles>div{grid-template-columns:1fr;gap:2px}.career-roles{gap:10px}.career-roles dd{font-size:11px}}
@media(max-width:600px){.career-roles{margin:11px 0 14px;gap:10px}.career-roles dt{font-size:7px}.career-roles dd{font-size:10px}}

.about .scene-body{max-height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding-right:8px}.about-copy p+p{margin-top:18px}.about .scene-body:focus-visible{outline:1px solid var(--line);outline-offset:6px}
@media(max-width:600px){.about-copy p+p{margin-top:15px}.about-copy{gap:15px}}

.history-heading>p{margin-bottom:0}@media(max-width:600px){.history-heading>p{display:block;font-size:12px;margin:8px 0 0}}

/* On mobile, the document owns scrolling; content panels have no scrollport. */
@media(max-width:600px){
 .stage{height:auto;min-height:100svh;display:flex;flex-direction:column;padding:17px 20px calc(128px + env(safe-area-inset-bottom,0px))}
 .top{position:relative;inset:auto;flex-shrink:0;gap:16px}
 .controls{gap:5px}.icon-button,.sound-button{width:36px;height:36px}
 main{flex:1;display:flex;flex-direction:column;min-height:0}
 .scene{position:relative;inset:auto;width:100%;padding:48px 0 22px;pointer-events:auto;margin-top:auto}
 .scene:not([hidden]){display:block}
 .scene-body{max-height:none;overflow:visible;animation:none}
 .about .scene-body{max-height:none;overflow:visible;padding-right:0}
 .about-copy p{font-size:14px;line-height:1.85}
 .about-copy{gap:19px}.about-copy p+p{margin-top:19px}
 .history .scene-body{display:block;min-height:auto}
 .history-heading{margin-bottom:30px}
 .timeline-scroll{height:auto;max-height:none;min-height:auto;overflow:visible;overscroll-behavior:auto;flex:none;padding:4px 0 0}
 .timeline-entry{padding-bottom:38px}.timeline h2{font-size:24px}.timeline time{font-size:9px}
 .career-role{font-size:9px}.career-roles dt{font-size:9px}.career-roles dd{font-size:11px}
 .career-summary{font-size:13px;line-height:1.8}.career-milestone>span{font-size:12px;line-height:1.7}
 .project p{font-size:13px}.project-meta{font-size:8px}.project-url,.github-more{font-size:10px}
 .bottom{position:fixed;inset:auto 0 0;gap:12px;padding:12px 20px calc(16px + env(safe-area-inset-bottom,0px));background:var(--bg);border-top:1px solid var(--line);z-index:10}
 .strip button{min-height:38px;font-size:10px;padding:10px 7px}
 .elsewhere a{height:28px;width:28px}.local-time{font-size:8px}
}

/* Circular landscape mark. */
.wordmark{width:50px;height:50px;flex-shrink:0;align-items:center;justify-content:center}
.wordmark svg{display:block;width:100%;height:100%}
.about-layout{display:block}
@media(max-width:600px){.wordmark{width:44px;height:44px}}

.intro-copy{max-width:680px}.intro-copy a{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}.intro-copy a:hover{text-decoration-color:var(--accent)}
