/* Shared visual refinements for the full-screen narrative and interactive cards. */
.hero-scene canvas{inset:0!important;width:100%!important;height:100%!important;mask-image:none!important;-webkit-mask-image:none!important}
.scene-layer:not(.hero-scene){object-position:50% center}
.scene-shade{background:linear-gradient(90deg,rgba(5,7,14,.54),rgba(5,7,14,.04) 42%,rgba(5,7,14,.18)),linear-gradient(0deg,rgba(5,7,14,.55),transparent 23%,transparent 80%,rgba(5,7,14,.32))}
.hero-copy .hero-left{max-width:440px}
.hero-copy .display-title{font-size:clamp(70px,8.4vw,148px)}
.career-timeline{max-width:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.career-timeline li,.career-timeline li:last-child{display:flex;flex-direction:column;gap:36px;min-height:272px;padding:27px;border:1px solid rgba(245,239,255,.17);border-radius:16px;background:linear-gradient(145deg,rgba(37,41,73,.92),rgba(14,17,41,.9));box-shadow:0 20px 50px rgba(0,0,0,.15);transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px));transition:transform .23s ease,border-color .2s,box-shadow .2s;transform-style:preserve-3d;will-change:transform}
.career-timeline li:hover{--lift:-5px;border-color:rgba(255,255,255,.34);box-shadow:0 24px 60px rgba(0,0,0,.27)}
.career-timeline li:before{display:none}
.career-timeline li>div{transform:translateZ(12px)}
.career-year{font-size:clamp(29px,2.8vw,43px)}
.career-timeline h3{font-size:clamp(20px,1.65vw,28px)}
.resume-content>.text-link{margin:42px 0 0}
.category-intro{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin:0 0 18px;color:var(--sub)}
.category-intro>p:last-child{font-size:13px;margin:0}
.category-gallery{height:min(55vw,520px);min-height:390px;display:flex;gap:12px}
.category-panel{position:relative;isolation:isolate;flex:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:20px;border-radius:18px;border:1px solid rgba(255,255,255,.16);background-image:linear-gradient(0deg,rgba(3,7,20,.94),rgba(3,7,20,.16) 65%),var(--panel-image);background-position:center;background-size:cover;filter:saturate(.75);transition:flex .55s cubic-bezier(.2,.7,.2,1),filter .45s,border-color .25s;cursor:pointer}
.category-panel.is-active,.category-panel:hover,.category-panel:focus-visible{flex:3.8;filter:saturate(1.1);border-color:rgba(255,255,255,.45)}
.category-panel:not(.is-active){background-blend-mode:normal,luminosity}
.category-index{font:700 10px Arial,sans-serif;letter-spacing:.16em;white-space:nowrap;color:#f9f0ff}
.category-panel-copy{display:grid;gap:13px;min-width:0}
.category-panel-copy strong{display:block;font-size:clamp(21px,2vw,36px);line-height:1.13;letter-spacing:-.045em;writing-mode:vertical-rl;transform:rotate(180deg);max-height:250px;align-self:start;text-shadow:0 2px 20px #000}
.category-panel.is-active .category-panel-copy strong,.category-panel:hover .category-panel-copy strong,.category-panel:focus-visible .category-panel-copy strong{writing-mode:horizontal-tb;transform:none;max-height:none;font-size:clamp(30px,3.4vw,56px)}
.category-panel-copy small,.category-panel-copy em{display:none;font-size:13px;font-style:normal;color:#eee7f3;text-shadow:0 2px 12px #000}
.category-panel.is-active .category-panel-copy small,.category-panel.is-active .category-panel-copy em,.category-panel:hover .category-panel-copy small,.category-panel:hover .category-panel-copy em,.category-panel:focus-visible .category-panel-copy small,.category-panel:focus-visible .category-panel-copy em{display:block}
.category-panel-copy em{font-weight:700;color:#fff}
.category-end{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:25px;color:var(--dim);font-size:12px}
.glow-card{position:relative;isolation:isolate;--gx:50%;--gy:50%;--glow-opacity:.12}
.glow-card::after{content:"";position:absolute;z-index:5;inset:0;padding:1.5px;border-radius:inherit;background:radial-gradient(260px circle at var(--gx) var(--gy),rgba(216,251,53,var(--glow-opacity)) 0%,rgba(161,191,72,.4) 26%,transparent 70%);pointer-events:none;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}
.glow-card:hover{box-shadow:0 18px 50px rgba(0,0,0,.22),0 0 35px rgba(216,251,53,.1)}
@media(max-width:1050px){.career-timeline{grid-template-columns:repeat(2,minmax(0,1fr))}.category-gallery{height:440px}}
@media(max-width:700px){.hero-scene canvas{inset:0!important;width:100%!important;height:100%!important}.scene-shade{background:linear-gradient(0deg,rgba(5,7,15,.95),rgba(5,7,15,.4) 46%,rgba(5,7,15,.15) 70%,rgba(5,7,15,.4))}.hero-copy{padding-bottom:12vh}.hero-copy .display-title{font-size:clamp(60px,14vw,90px)}#resumeVideo{object-position:50% center}#sofaVideo,#fallVideo{object-position:80% center}.career-timeline{grid-template-columns:1fr;gap:13px}.career-timeline li,.career-timeline li:last-child{min-height:210px;padding:24px;gap:23px}.category-intro{display:block}.category-intro>p:last-child{margin:8px 0 0}.category-gallery{height:auto;min-height:0;display:grid;gap:10px}.category-panel,.category-panel.is-active,.category-panel:hover{height:130px;flex:none;padding:15px 20px;transition:height .45s ease,filter .3s}.category-panel.is-active,.category-panel:hover,.category-panel:focus-visible{height:270px}.category-panel-copy strong{writing-mode:horizontal-tb;transform:none;max-height:none;font-size:24px}.category-panel.is-active .category-panel-copy strong{font-size:32px}.category-end{align-items:flex-start}.category-end span{max-width:90px}}
@media(prefers-reduced-motion:reduce){.career-timeline li,.category-panel{transition:none!important;transform:none!important}}
/* The supplied portfolio stills include their own slide headers; crop those in the compact category windows. */
.category-panel{background-size:cover,auto 124%;background-position:center,center 60%}
.category-panel{background-size:cover,auto 140%;background-position:center,center 68%}

/* 2026 visual refresh: charcoal and electric lime. */
:root{--accent:#d8fb35;--accent-soft:#aabc58;--bg:#0b0d0a;--bg2:#171a14;--line:rgba(226,237,203,.18)}
.scene-shade{background:linear-gradient(90deg,rgba(4,7,5,.56),rgba(4,7,5,.02) 47%,rgba(4,7,5,.16)),linear-gradient(0deg,rgba(4,7,5,.55),transparent 24%,transparent 79%,rgba(4,7,5,.31))}
.site-header{background:linear-gradient(rgba(8,11,8,.56),transparent)}
.main-nav a{color:#cbd2bf}.main-nav a:hover,.main-nav a.is-current{color:var(--accent)}
.action-arrow{background:var(--accent);color:#10140a}.pill-action{background:rgba(13,18,10,.9)}
.pill-action:hover{background:rgba(34,43,18,.98)}
.career-timeline li,.career-timeline li:last-child{background:linear-gradient(145deg,rgba(31,37,27,.94),rgba(13,16,12,.94));border-color:rgba(220,236,192,.17)}
.career-timeline li:hover{border-color:rgba(216,251,53,.56)}
.reel-feature{background:radial-gradient(circle at 87% 30%,rgba(216,251,53,.14),transparent 40%),#171b14}
.glow-card::after{background:radial-gradient(260px circle at var(--gx) var(--gy),rgba(216,251,53,var(--glow-opacity)) 0%,rgba(146,184,54,.37) 27%,transparent 70%)}
.glow-card:hover{box-shadow:0 18px 50px rgba(0,0,0,.25),0 0 32px rgba(216,251,53,.11)}
/* Education lives in the opening resume film, near the character's presenting hand. */
.education-spot{position:absolute;z-index:4;left:42%;top:49%;width:clamp(260px,27vw,420px);padding:25px 27px 23px;background:linear-gradient(135deg,rgba(14,19,12,.83),rgba(23,29,19,.69));border:1px solid rgba(216,251,53,.36);border-radius:17px;backdrop-filter:blur(14px);box-shadow:0 23px 65px rgba(0,0,0,.33);opacity:0;transform:translateY(25px);transition:opacity .45s,transform .45s;pointer-events:none}
.education-spot.is-visible{opacity:1;transform:translateY(0)}
.education-spot .micro-label{color:var(--accent);font-size:10px}
.education-years{display:block;margin-top:19px;color:rgba(235,244,215,.26);font:900 clamp(40px,4.7vw,70px)/.9 Impact,Arial,sans-serif;letter-spacing:-.03em}
.education-spot h3{font-size:clamp(25px,2.3vw,37px);margin:8px 0 6px}
.education-spot p{margin:0 0 15px;font-size:14px;color:#f0f4e8}
.education-spot small{display:block;border-top:1px solid rgba(216,251,53,.22);padding-top:13px;font-size:11px;color:#bcc6ae;letter-spacing:.08em}
/* Featured works use a uniform 16:9 window and a restrained 3D tilt. */
.featured-content{background:linear-gradient(#0d100c,#0b0d0a);padding-bottom:150px}
.featured-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:21px;max-width:1660px}
.featured-card{min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;border:1px solid rgba(226,237,203,.18);border-radius:18px;background:linear-gradient(145deg,#20251c,#131712);transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px));transform-style:preserve-3d;transition:transform .22s ease,border-color .25s,box-shadow .25s;will-change:transform}
.featured-card:hover{--lift:-5px;border-color:rgba(216,251,53,.52)}
.featured-card:nth-child(even) .feature-media,.featured-card:nth-child(even) .feature-copy{order:unset}
.feature-media{width:100%;flex:0 0 auto;aspect-ratio:16/9;border:0;border-radius:0;box-shadow:none;background:#1d231a}
.feature-media img{width:100%;height:100%;object-fit:cover;object-position:center 59%}
.featured-card:hover .feature-media img{transform:scale(1.045)}
.feature-copy{width:100%;max-width:none;display:flex;flex-direction:column;flex:1;padding:24px 25px 25px}
.feature-number{font-size:10px;color:var(--accent)}
.feature-copy h3{font-size:clamp(28px,2.35vw,39px);margin:13px 0 11px;line-height:1.13}
.feature-copy h3 small{font-size:.46em;line-height:1.4;color:#e2e8d7}
.feature-copy>p{font-size:13px;line-height:1.75;margin:0;max-width:none;color:#bfc9b7}
.feature-meta{margin:18px 0 20px;gap:6px}
.feature-meta span{font-size:10px;padding:5px 8px;color:#d1dac8;border-color:rgba(223,237,195,.2)}
.feature-copy .text-link{margin-top:auto;font-size:11px}
/* Keep every catalogue title horizontal, including the collapsed panels. */
.category-gallery{height:min(42vw,440px);min-height:345px;gap:10px}
.category-panel{padding:18px 16px;background-image:linear-gradient(0deg,rgba(5,9,5,.97),rgba(5,9,5,.03) 69%),var(--panel-image);border-color:rgba(230,239,214,.17)}
.category-panel.is-active,.category-panel:hover,.category-panel:focus-visible{flex:3.35;border-color:rgba(216,251,53,.58)}
.category-panel-copy strong,.category-panel.is-active .category-panel-copy strong,.category-panel:hover .category-panel-copy strong,.category-panel:focus-visible .category-panel-copy strong{writing-mode:horizontal-tb;transform:none;max-height:none;overflow-wrap:anywhere;font-size:clamp(17px,1.55vw,27px);line-height:1.1;letter-spacing:-.03em}
.category-panel.is-active .category-panel-copy strong,.category-panel:hover .category-panel-copy strong,.category-panel:focus-visible .category-panel-copy strong{font-size:clamp(32px,3.1vw,53px)}
.category-index{color:var(--accent)}.category-panel-copy em{color:var(--accent)}
.category-panel:not(.is-active){background-blend-mode:normal,normal;filter:saturate(.68)}
/* An honest photo wall: three available field photos and an explicit future slot. */
.photos-section{background:#11140f;padding:125px 0 135px;border-top:1px solid var(--line)}
.photos-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:36px}
.photos-heading h2{font:900 clamp(55px,7vw,112px)/.98 Impact,'Arial Narrow','PingFang SC',sans-serif;letter-spacing:-.05em;margin:12px 0 17px}
.photos-heading p:last-child{color:var(--sub);font-size:15px;line-height:1.7;margin:0}
.photo-controls{display:flex;gap:9px;padding-bottom:5px}
.photo-controls button{width:43px;height:43px;border:1px solid rgba(216,251,53,.38);border-radius:50%;background:#20271a;color:var(--accent);font-size:22px;cursor:pointer;transition:background .2s,transform .2s}
.photo-controls button:hover{background:var(--accent);color:#11160a;transform:translateY(-2px)}
.photo-wall{display:flex;gap:17px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--accent) #262c21;padding:3px 2px 18px;overscroll-behavior-inline:contain}
.photo-tile,.photo-placeholder{flex:0 0 clamp(285px,30vw,450px);height:clamp(350px,36vw,500px);margin:0;position:relative;overflow:hidden;border-radius:17px;border:1px solid rgba(216,251,53,.18);scroll-snap-align:start;background:#20251c}
.photo-tile img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.photo-tile:hover img{transform:scale(1.045)}
.photo-tile:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.86));pointer-events:none}
.photo-tile figcaption{position:absolute;z-index:1;left:22px;right:22px;bottom:22px;display:grid;gap:8px;text-shadow:0 2px 12px #000}
.photo-tile figcaption span,.photo-placeholder span{color:var(--accent);font:700 10px Arial,sans-serif;letter-spacing:.18em}
.photo-tile figcaption strong{font-size:22px}
.photo-placeholder{display:flex;flex-direction:column;justify-content:space-between;padding:25px;border-style:dashed;border-color:rgba(216,251,53,.4);background:radial-gradient(circle at 95% 5%,rgba(216,251,53,.1),transparent 55%),#171c13}
.photo-placeholder strong{font-size:clamp(29px,3vw,45px);line-height:1.18;letter-spacing:-.04em}
.photo-placeholder small{color:#aab69c;font-size:12px}
.photo-hint{text-align:right;color:var(--dim);font-size:11px;letter-spacing:.08em;margin:15px 0 0}
/* Contact card with foreground user information and no halo behind the card. */
.contact-panel{background:linear-gradient(rgba(11,16,9,.53),#0b0d0a 44%)}
.profile-card{max-width:410px;width:100%;padding:0;display:block;overflow:hidden;border-radius:22px;background:#1d2419;border-color:rgba(216,251,53,.25);transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .22s ease,border-color .22s;box-shadow:0 24px 65px rgba(0,0,0,.3)}
.profile-card:hover{border-color:rgba(216,251,53,.62)}
.profile-visual{height:280px;position:relative;background:#232b20;overflow:hidden}
.profile-visual img{width:100%;height:100%;object-fit:cover;object-position:center 26%;border-radius:0;filter:saturate(.79)}
.profile-visual:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#1d2419)}
.profile-badge{position:absolute;z-index:1;right:18px;top:18px;border:1px solid rgba(216,251,53,.55);background:rgba(12,18,9,.75);backdrop-filter:blur(8px);border-radius:999px;padding:9px 11px;color:var(--accent);font:700 9px Arial,sans-serif;letter-spacing:.13em}
.profile-badge i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-left:6px;box-shadow:0 0 11px var(--accent)}
.profile-info{padding:0 24px 25px;position:relative;z-index:2;margin-top:-11px}
.profile-info h3{font-size:28px;margin:7px 0 5px}
.profile-info h3 small{font-size:9px;font-weight:700;letter-spacing:.2em;color:var(--accent);margin-left:4px}
.profile-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:24px}
.profile-tags span{padding:6px 8px;border-radius:999px;border:1px solid rgba(216,251,53,.22);font-size:10px;color:#cdd9bc}
.detail-page{background:#0b0d0a}.detail-header{background:rgba(8,11,8,.78)}
.result-grid>div{background:linear-gradient(135deg,rgba(216,251,53,.12),rgba(135,166,47,.05))}
.resume-page .detail-hero{background:radial-gradient(circle at 70% 30%,#283620,#171e14 44%,#0b0d0a)}
@media(max-width:1120px){.featured-list{grid-template-columns:repeat(2,minmax(0,1fr))}.category-gallery{height:395px}.category-panel-copy strong{font-size:18px}}
@media(max-width:700px){.site-header{background:rgba(9,13,8,.82)}.main-nav{background:#141a11}.scene-shade{background:linear-gradient(0deg,rgba(6,10,5,.95),rgba(6,10,5,.43) 45%,rgba(6,10,5,.12) 71%,rgba(6,10,5,.42))}.education-spot{left:42%;top:42%;width:calc(58% - 19px);padding:14px 13px;border-radius:12px}.education-spot .micro-label{font-size:8px;letter-spacing:.05em}.education-years{font-size:30px;margin-top:11px}.education-spot h3{font-size:21px;margin:6px 0}.education-spot p{font-size:10px;line-height:1.5;margin-bottom:8px}.education-spot small{font-size:8px;padding-top:7px}.featured-list{grid-template-columns:1fr;gap:17px}.featured-card{gap:0;padding:0}.feature-media{aspect-ratio:16/9}.feature-copy{padding:21px}.feature-copy h3{font-size:32px}.category-gallery{height:auto}.category-panel,.category-panel.is-active,.category-panel:hover{height:120px}.category-panel.is-active,.category-panel:hover,.category-panel:focus-visible{height:245px}.category-panel-copy strong,.category-panel.is-active .category-panel-copy strong{font-size:24px}.category-panel.is-active .category-panel-copy strong{font-size:36px}.photos-section{padding:88px 0 95px}.photos-heading{align-items:start}.photos-heading h2{font-size:62px}.photos-heading p:last-child{font-size:13px}.photo-controls{align-self:end}.photo-controls button{width:35px;height:35px;font-size:18px}.photo-tile,.photo-placeholder{flex-basis:80vw;height:105vw;max-height:480px}.contact-panel{align-items:start}.profile-card{max-width:460px}}
@media(prefers-reduced-motion:reduce){.featured-card,.profile-card,.photo-tile img,.photo-controls button{transition:none!important;transform:none!important}}
/* The education card sits in the open hand's space on desktop; on narrow screens it uses the lower torso area. */
@media(min-width:701px){.education-spot{left:33%;top:48%;width:clamp(260px,25vw,380px)}}
@media(max-width:700px){.resume-intro .chapter-side{transition:opacity .35s}.resume-intro.education-active .chapter-side{opacity:0}.education-spot{left:var(--page);right:var(--page);top:auto;bottom:16vh;width:auto;padding:19px 20px}.education-years{font-size:45px}.education-spot h3{font-size:25px}.education-spot p{font-size:12px}.education-spot small{font-size:9px}}

/* Scroll-arrival motion inspired by the supplied page-motion study. */
.motion-ready .story-reveal{opacity:0;translate:0 32px;transition:opacity .74s cubic-bezier(.2,.75,.2,1),translate .86s cubic-bezier(.17,.8,.22,1),filter .8s;transition-delay:var(--reveal-delay,0ms)}
.motion-ready .story-reveal.story-reveal-text{filter:blur(6px)}
.motion-ready .story-reveal.is-revealed{opacity:1;translate:0 0;filter:blur(0)}
.sticky-scene .chapter-side{transform:translate3d(0,var(--story-travel,0px),0);opacity:var(--story-opacity,1);will-change:transform}
.resume-intro.education-active .chapter-side{opacity:var(--story-opacity,1)}
.prominent-link{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-width:210px;min-height:54px;padding:6px 7px 6px 21px;border:1px solid var(--accent);border-radius:999px;background:var(--accent);color:#111609;font-size:13px;font-weight:850;letter-spacing:.035em;box-shadow:0 0 22px rgba(216,251,53,.16);transition:transform .26s,box-shadow .26s,background .26s}
.prominent-link:hover{transform:translateY(-4px);background:#edff86;box-shadow:0 12px 32px rgba(216,251,53,.26)}
.prominent-arrow{display:grid;place-items:center;width:39px;height:39px;flex:none;border-radius:50%;background:#111609;color:var(--accent);font-size:20px;transition:transform .3s}
.prominent-link:hover .prominent-arrow{transform:rotate(45deg)}
.resume-content>.prominent-link{margin-top:44px}
.category-end .prominent-link{min-width:190px}
/* Two continuously looping lanes built from the 工作照片/ source directory. */
.photos-count{align-self:end;padding-bottom:6px;color:var(--accent);font:700 11px Arial,sans-serif;letter-spacing:.15em;white-space:nowrap}
.photo-marquee{display:grid;gap:15px;overflow:hidden;margin-left:calc(-1*var(--page));margin-right:calc(-1*var(--page));padding:2px 0 4px;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.photo-row{overflow:hidden;width:100%}
.photo-lane{display:flex;width:max-content;animation:photo-travel-left var(--marquee-duration,60s) linear infinite;will-change:transform}
.photo-row[data-direction="right"] .photo-lane{animation-name:photo-travel-right}
.photo-group{display:flex;gap:15px;padding-right:15px;flex:none}
@keyframes photo-travel-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes photo-travel-right{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.photo-marquee:hover .photo-lane,.photo-marquee:focus-within .photo-lane,.photo-marquee.is-paused .photo-lane,.dialog-open .photo-lane{animation-play-state:paused}
.photo-tile{display:block;flex:0 0 clamp(250px,25vw,365px);width:clamp(250px,25vw,365px);height:clamp(165px,17vw,236px);margin:0;padding:0;text-align:left;color:#fff;cursor:zoom-in;scroll-snap-align:none;background:#1d241b;transition:border-color .25s,transform .28s}
.photo-tile:hover{transform:translateY(-3px);border-color:rgba(216,251,53,.65)}
.photo-tile img{width:100%;height:100%;object-fit:cover}
.photo-tile-caption{position:absolute;z-index:2;left:17px;right:17px;bottom:15px;display:grid;gap:6px;text-shadow:0 1px 10px #000}
.photo-tile-caption small{font:700 9px Arial,sans-serif;letter-spacing:.14em;color:var(--accent)}
.photo-tile-caption strong{font-size:16px}
.photo-hint{margin-top:20px}
.media-dialog.photo-viewer{width:min(1100px,94vw);max-width:none;padding:38px 23px 20px;background:#11170e;animation:photo-dialog-in .45s cubic-bezier(.18,.75,.2,1) both}
.media-dialog.photo-viewer::backdrop{animation:photo-backdrop-in .35s ease both}
@keyframes photo-dialog-in{from{opacity:0;transform:translateY(35px) scale(.91)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes photo-backdrop-in{from{opacity:0}to{opacity:1}}
.photo-full{margin:0}.photo-full img{display:block;width:100%;height:auto;max-height:76vh;object-fit:contain;background:#090c08;border-radius:9px}
.photo-full figcaption{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:14px 4px 0;color:#f0f5e9}
.photo-full figcaption strong{font-size:17px}.photo-full figcaption span{font:700 11px Arial,sans-serif;letter-spacing:.15em;color:var(--accent)}
.photo-full-controls{position:absolute;left:30px;right:30px;top:50%;transform:translateY(-50%);display:flex;justify-content:space-between;pointer-events:none}
.photo-full-controls button{width:42px;height:42px;border:1px solid rgba(216,251,53,.65);border-radius:50%;background:rgba(12,17,9,.86);color:var(--accent);font-size:22px;cursor:pointer;pointer-events:auto;transition:background .2s}
.photo-full-controls button:hover{background:var(--accent);color:#101609}
@media(max-width:700px){.motion-ready .story-reveal{translate:0 22px}.resume-intro.education-active .chapter-side{opacity:0}.prominent-link{min-width:195px}.category-end{display:flex;align-items:end}.category-end .prominent-link{min-width:180px}.photos-heading{display:block}.photos-count{display:block;margin-top:18px}.photo-tile{width:235px;flex-basis:235px;height:160px}.photo-marquee{gap:11px}.photo-group{gap:11px;padding-right:11px}.media-dialog.photo-viewer{padding:44px 10px 16px}.photo-full img{max-height:70vh}.photo-full-controls{left:14px;right:14px}.photo-full-controls button{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.motion-ready .story-reveal,.motion-ready .story-reveal.is-revealed{opacity:1;translate:none;filter:none;transition:none}.photo-lane{animation:none}.photo-row{overflow-x:auto;scrollbar-width:thin}.photo-group[aria-hidden="true"]{display:none}.photo-marquee{mask-image:none}.photo-tile:hover{transform:none}.media-dialog.photo-viewer{animation:none}}

/* Accordion gallery: the selected category expands while its neighbours fold away. */
@media (min-width:701px){
  .category-gallery{display:flex;gap:11px}
  .category-gallery .category-panel{flex:1 1 0%;min-width:0;transition:flex-grow .62s cubic-bezier(.2,.8,.2,1),filter .42s ease,border-color .3s ease,box-shadow .3s ease}
  .category-gallery .category-panel.is-active,.category-gallery .category-panel:hover,.category-gallery .category-panel:focus-visible{flex-grow:3.55;box-shadow:0 18px 40px #0007,0 0 28px #d8fb3517}
}
.category-panel:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.category-panel .category-panel-copy{position:relative;z-index:2}
.category-panel{background-repeat:no-repeat;background-size:cover,cover}
.category-panel.is-active .category-panel-copy em,.category-panel:hover .category-panel-copy em{font-size:14px}

/* Company identity and cofounder status on the career cards. */
.career-timeline li,.career-timeline li:last-child{position:relative;padding-right:28px}
.career-timeline li>div{padding-right:8px;margin-top:27px}
.career-logo{position:absolute;top:56px;right:24px;width:66px;height:66px;display:grid;place-items:center;overflow:hidden;border:1px solid #d8fb3566;border-radius:50%;background:radial-gradient(circle at 30% 25%,#343e28,#171e14 76%);color:#ecf8d7;font-size:15px;font-weight:850;letter-spacing:-.05em;box-shadow:0 10px 22px #0005,0 0 0 4px #d8fb350a}
.career-logo img{width:100%;height:100%;object-fit:contain;background:#fff;border-radius:50%;padding:5px}
.founder-badge{position:absolute;top:15px;right:15px;padding:6px 10px;border:1px solid #d8fb3573;border-radius:4px 10px 4px 10px;background:#d8fb35;color:#17200f;font-size:10px;font-weight:850;letter-spacing:.03em;box-shadow:0 6px 16px #0004}
.career-year{padding-right:72px}
.career-timeline h3{padding-right:45px}

/* Profile card with a separate illustration and real-photo identity strip. */
.profile-card{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d}
.profile-visual{height:385px;background:radial-gradient(circle at 52% 25%,#25234a,#101323 75%)}
@media(min-width:701px){.profile-visual{height:auto;aspect-ratio:5/6}}
@media(min-width:1060px){.contact-panel{padding-bottom:85px}}
.profile-visual .profile-main-avatar{width:100%;height:100%;object-fit:cover;object-position:center 28%;filter:none}
.profile-visual:after{inset:55% 0 0;background:linear-gradient(transparent,#1d2419bd)}
.profile-glass{position:absolute;z-index:2;left:15px;right:15px;bottom:16px;display:flex;align-items:center;gap:10px;padding:10px 11px;border:1px solid #e6f5e65c;border-radius:17px;background:#102019a8;backdrop-filter:blur(18px);box-shadow:0 12px 35px #0007}
.profile-glass .profile-mini-avatar{width:48px;height:48px;flex:none;object-fit:cover;object-position:center 22%;border:2px solid #e1f4ca7a;border-radius:50%;filter:none}
.profile-glass>div{display:grid;gap:3px;min-width:0}.profile-glass strong{font-size:13px}
.profile-glass .profile-glass-email{color:#d9e9cd;font-size:10px;line-height:1.3;overflow-wrap:anywhere}.profile-glass .profile-glass-email:hover{color:var(--accent);text-decoration:underline}
.profile-glass .profile-contact{margin-left:auto;flex:none;padding:10px 11px;border:1px solid #d8fb3570;border-radius:10px;background:#d8fb3522;color:#eaffb4;font-size:11px;font-weight:750}.profile-glass .profile-contact:hover{background:#d8fb35;color:#111609}
.profile-info{margin-top:0;padding-top:17px}.profile-info .profile-tags{margin-top:16px;margin-bottom:0}
.contact-actions .prominent-link{min-width:245px}
.home-footer>a{position:relative;top:-44px;display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:46px;padding:11px 19px;border:1px solid #d8fb3580;border-radius:999px;background:#d8fb351d;color:#efffcd;font-size:13px;font-weight:800;letter-spacing:.02em;box-shadow:0 10px 28px #0006,0 0 18px #d8fb3514;transition:top .2s,background .2s,color .2s,box-shadow .2s}
.home-footer>a span{font-size:18px;line-height:1;color:var(--accent)}
.home-footer>a:hover{top:-48px;background:var(--accent);color:#141b0d;box-shadow:0 14px 32px #d8fb352a}.home-footer>a:hover span{color:#141b0d}
.home-footer>a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Spotlight and pointer tilt on the public resume experience cards. */
.resume-page .resume-jobs{gap:16px}
.resume-page .resume-job{position:relative;isolation:isolate;overflow:hidden;padding:26px 29px 28px;border:1px solid #dcebbb38;border-radius:16px;background:radial-gradient(380px circle at var(--gx,50%) var(--gy,50%),#d8fb3520,transparent 65%),linear-gradient(145deg,#1c251a,#101610);box-shadow:0 14px 35px #0003;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
.resume-page .resume-job:hover{border-color:#d8fb3585;box-shadow:0 24px 48px #0007,0 0 30px #d8fb351a}
.resume-page .resume-job h3{position:relative;z-index:1;margin-bottom:11px;font-size:22px;line-height:1.35}
.resume-page .resume-job>span{position:relative;z-index:1;letter-spacing:.08em;font-weight:750}
.resume-page .resume-job p{position:relative;z-index:1;line-height:1.8}

/* Clear route back from every secondary page. */
.detail-back,.works-back{display:inline-flex;align-items:center;min-height:43px;padding:9px 17px;border:1px solid #d8fb3575;border-radius:999px;background:#d8fb3520;color:#f2ffd9!important;font-size:13px;font-weight:800;letter-spacing:.02em;box-shadow:0 0 0 1px #0004,0 4px 18px #0004;transition:background .22s,transform .22s,box-shadow .22s}
.detail-back:hover,.works-back:hover{background:var(--accent);color:#131b0d!important;transform:translateX(-3px);box-shadow:0 9px 26px #d8fb352e}
.detail-back:focus-visible,.works-back:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:700px){
  .career-logo{top:49px;right:20px;width:58px;height:58px}
  .career-year{padding-right:68px}.career-timeline h3{padding-right:0}
  .profile-visual{height:365px}
  .resume-page .resume-job{padding:23px 21px}
  .detail-back,.works-back{min-height:40px;padding:8px 12px;font-size:11px}
  .home-footer>a{top:-25px;justify-self:end;padding:9px 13px;min-height:42px;font-size:11px}.home-footer>a:hover{top:-28px}
}
@media(prefers-reduced-motion:reduce){.category-gallery .category-panel,.resume-page .resume-job,.profile-card{transition:none!important;transform:none!important}}

/* Touch-friendly chapter artwork and continuous education-card arrival. */
.static-scenes #resumeVideo{object-position:75% center}
.static-scenes #sofaVideo,.static-scenes #fallVideo{object-position:65% center}
.static-scenes .education-spot{transition:none;backdrop-filter:none;background:#141b13ed;will-change:opacity,transform}
@media(max-width:700px){
  .motion-ready .story-reveal.story-reveal-text{filter:none}
  .motion-ready .story-reveal{transition-duration:.45s,.5s;transition-delay:0ms}
  .scrub-cue,.hero-scroll{letter-spacing:.08em}
}
@media(prefers-reduced-motion:reduce){.static-scenes .education-spot{transform:none!important}}
