/* Physical studio desk. */
.desktop-scene{padding-bottom:64px;background:radial-gradient(ellipse at 75% 0,color-mix(in srgb,#ffde2b 24%,#ffffff),transparent 58%),linear-gradient(110deg,color-mix(in srgb,#ffde2b 30%,#ffffff),color-mix(in srgb,#ffde2b 63%,#ffffff));overflow:hidden;--desk-top:580px}.desktop-scene:before{content:'';position:absolute;top:var(--desk-top);left:-8%;right:-8%;bottom:32px;background:repeating-linear-gradient(2deg,transparent 0 6px,color-mix(in srgb,color-mix(in srgb,#ff6700 56%,#000000) 6%,transparent) 7px,color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 33%,transparent) 8px,transparent 9px 19px),repeating-linear-gradient(92deg,color-mix(in srgb,#ff6700 6%,transparent) 0 130px,color-mix(in srgb,color-mix(in srgb,#ff6700 55%,#000000) 15%,transparent) 131px,color-mix(in srgb,color-mix(in srgb,#ff6700 75%,#ffffff) 20%,transparent) 133px 280px),linear-gradient(165deg,color-mix(in srgb,#ffde2b 56%,#ffffff),#ff6700 58%,#ff6700);border-top:2px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 53%,transparent);box-shadow:inset 0 35px 60px color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 20%,transparent),0 -14px 45px color-mix(in srgb,color-mix(in srgb,#ff6700 65%,#000000) 15%,transparent);z-index:-1;transform:perspective(900px) rotateX(3deg);transform-origin:bottom}.desktop-scene:after{content:'';position:absolute;bottom:0;left:0;right:0;height:33px;background:linear-gradient(color-mix(in srgb,#ff6700 51%,#ffffff),color-mix(in srgb,#ff6700 86%,#000000) 14%,#ff6700 35%,color-mix(in srgb,#ff6700 69%,#000000) 85%,color-mix(in srgb,#ff6700 47%,#000000));border-top:2px solid color-mix(in srgb,#ffde2b 36%,#ffffff);border-bottom:5px solid color-mix(in srgb,#ff6700 35%,#000000);box-shadow:inset 0 3px 7px color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 20%,transparent),0 18px 25px color-mix(in srgb,color-mix(in srgb,#ffffff 0%,#000000) 33%,transparent);z-index:0;pointer-events:none}.computer-wrap{filter:drop-shadow(12px 24px 14px color-mix(in srgb,color-mix(in srgb,#ff6700 39%,#000000) 31%,transparent))}.desk-edge{background:none;box-shadow:none;height:10px}.sunlight{background:linear-gradient(115deg,transparent 30%,color-mix(in srgb,color-mix(in srgb,#ffde2b 19%,#ffffff) 22%,transparent) 31% 42%,transparent 43% 51%,color-mix(in srgb,color-mix(in srgb,#ffde2b 19%,#ffffff) 19%,transparent) 52% 63%,transparent 64%);mix-blend-mode:screen}.scene-caption{color:color-mix(in srgb,#ff6700 53%,#000000);letter-spacing:.12em}.desktop-hint{color:color-mix(in srgb,#ff6700 70%,#000000)}.coffee,.pixel-joystick,.pixel-pet,.plug{filter:drop-shadow(5px 8px 3px color-mix(in srgb,color-mix(in srgb,#ff2cd2 34%,#000000) 25%,transparent))}
.note-pad{width:132px;min-height:110px;margin-top:30px;padding:8px 10px;background:linear-gradient(150deg,color-mix(in srgb,#ffde2b 47%,#ffffff),#ffde2b);border-top:8px solid #ffde2b;box-shadow:1px 2px 0 color-mix(in srgb,#ffde2b 49%,#ffffff),3px 5px 0 #ffde2b,5px 8px 0 color-mix(in srgb,#ffde2b 76%,#ffffff),7px 11px 0 color-mix(in srgb,#ffde2b 81%,#000000),10px 16px 9px color-mix(in srgb,color-mix(in srgb,#ff6700 50%,#000000) 27%,transparent);text-align:left}.note-pad span,.note-pad strong,.note-pad small{display:block}.pad-plus{font-size:24px;line-height:1.1}.note-pad strong{font-size:11px;margin:4px 0}.note-pad small{font-size:9px}.desk-instructions{max-width:470px;margin:22px auto 0;color:color-mix(in srgb,#ff6700 58%,#000000);line-height:1.8}.note-status{color:color-mix(in srgb,#ff6700 44%,#000000)}.quick-sticky{display:block!important;width:104px;min-height:98px;padding:22px 7px 6px;box-shadow:1px 3px 3px color-mix(in srgb,color-mix(in srgb,#ff6700 29%,#000000) 16%,transparent),4px 10px 8px color-mix(in srgb,color-mix(in srgb,#ff6700 29%,#000000) 19%,transparent);border-radius:0 0 12px 1px;text-align:left;background-image:linear-gradient(color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 13%,transparent),transparent 35%,color-mix(in srgb,color-mix(in srgb,#ffffff 0%,#000000) 2%,transparent) 94%,color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 27%,transparent));transition:box-shadow .2s}.quick-sticky.writing{z-index:39;box-shadow:0 0 0 2px color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 53%,transparent),6px 12px 15px color-mix(in srgb,color-mix(in srgb,#ff6700 29%,#000000) 27%,transparent)}.quick-sticky textarea{display:block;width:100%;min-height:70px;height:70px;padding:0;resize:none;background:transparent;border:0;outline:0;color:color-mix(in srgb,#ff6700 39%,#000000);font:11px/1.5 var(--mono);text-align:left;user-select:text;touch-action:auto}.quick-sticky textarea::placeholder{color:color-mix(in srgb,color-mix(in srgb,#ff6700 51%,#000000) 60%,transparent)}.quick-sticky button{position:absolute;top:3px;height:17px;min-width:17px;padding:0;background:transparent;border:0;color:color-mix(in srgb,color-mix(in srgb,#ff6700 46%,#000000) 65%,transparent);line-height:16px;font:15px var(--mono)}.note-grip{left:4px;cursor:grab;touch-action:none}.note-color{right:24px;font-size:10px!important}.note-remove{right:4px}.quick-sticky button:focus-visible{outline:1px solid color-mix(in srgb,#ff6700 53%,#000000)}.sticky.placed{transform:rotate(var(--note-angle,-3deg))!important}.quick-sticky:nth-child(even){--note-angle:4deg}
.dark-portfolio,.section-wrap{background:color-mix(in srgb,#ffffff 7%,#000000)}.portfolio-section{position:relative}.career-section{background:radial-gradient(ellipse at 85% 16%,color-mix(in srgb,color-mix(in srgb,#ff6700 72%,#000000) 13%,transparent),transparent 55%)}.section-title h2{font-size:clamp(32px,5vw,63px);font-weight:600;line-height:1.05}.section-title small{color:color-mix(in srgb,#ff6700 64%,#ffffff)}.career-section .section-title h2{max-width:670px}.chapter-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 32px}.chapter-card{position:relative;isolation:isolate;overflow:hidden;text-align:left;padding:20px 18px;min-height:170px;border:1px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 8%,transparent);border-radius:13px;background:linear-gradient(145deg,color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 3%,transparent),color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 0%,transparent));color:color-mix(in srgb,#ffde2b 29%,#ffffff);cursor:pointer;transition:border-color .25s,transform .25s,background .25s;--chapter-color:color-mix(in srgb,#5e00ff 34%,#ffffff)}.chapter-card:nth-child(2){--chapter-color:color-mix(in srgb,#5e00ff 42%,#ffffff)}.chapter-card:nth-child(3){--chapter-color:color-mix(in srgb,#ff6700 57%,#ffffff)}.chapter-card:nth-child(4){--chapter-color:color-mix(in srgb,#ffde2b 73%,#ffffff)}.chapter-card:before{content:'';position:absolute;width:110px;height:110px;right:-45px;bottom:-35px;border:1px solid var(--chapter-color);border-radius:50%;box-shadow:0 0 0 13px color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 2%,transparent),0 0 0 30px color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 1%,transparent);opacity:.3;transition:transform .5s}.chapter-card:hover:before{transform:scale(1.5) rotate(25deg)}.chapter-card:hover{transform:translateY(-5px);border-color:var(--chapter-color)}.chapter-card.active{border-color:var(--chapter-color);background:linear-gradient(135deg,color-mix(in srgb,var(--chapter-color),transparent 87%),color-mix(in srgb,#ffffff 10%,#000000))}.chapter-card.active:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--chapter-color)}.chapter-card small{font:9px var(--mono);color:var(--chapter-color);letter-spacing:.1em}.chapter-number{display:block;font:40px var(--sans);letter-spacing:-.07em;color:var(--chapter-color);margin:15px 0 10px;line-height:1}.chapter-card strong{display:block;font:600 15px var(--sans);letter-spacing:-.03em}.chapter-card p{font:10px/1.7 var(--mono);margin:8px 0 0;color:color-mix(in srgb,#ffffff 63%,#000000)}.career-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:20px 0}.career-controls button{border:1px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 14%,transparent);border-radius:30px;background:color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 2%,transparent);color:color-mix(in srgb,#ff6700 34%,#ffffff);font:10px var(--mono);padding:10px 15px;cursor:pointer}.career-controls button:hover{background:color-mix(in srgb,color-mix(in srgb,#ff6700 64%,#ffffff) 13%,transparent);border-color:color-mix(in srgb,#ff6700 64%,#ffffff)}.chapter-counter{font:10px var(--mono);color:color-mix(in srgb,#ff6700 64%,#ffffff)}.role-bar{height:40px;top:6px;border-radius:7px;background:linear-gradient(100deg,color-mix(in srgb,#5e00ff 45%,#000000),color-mix(in srgb,#ffffff 12%,#000000));border-color:color-mix(in srgb,color-mix(in srgb,#ffffff 47%,#000000) 40%,transparent);box-shadow:inset 0 1px 0 color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 7%,transparent),0 5px 10px color-mix(in srgb,color-mix(in srgb,#ffffff 0%,#000000) 20%,transparent)}.role-foodhub{background:linear-gradient(100deg,color-mix(in srgb,#5e00ff 45%,#000000),color-mix(in srgb,#5e00ff 29%,#000000));border-color:color-mix(in srgb,#5e00ff 40%,transparent)}.role-operations{background:linear-gradient(100deg,color-mix(in srgb,#ff6700 47%,#000000),color-mix(in srgb,#ff6700 26%,#000000));border-color:color-mix(in srgb,#ff6700 40%,transparent)}.role-current{background:linear-gradient(100deg,color-mix(in srgb,#ffde2b 40%,#000000),color-mix(in srgb,#ffffff 14%,#000000));border-color:color-mix(in srgb,#ffde2b 40%,transparent)}.role-bar.selected,.role-bar:hover{box-shadow:0 0 25px color-mix(in srgb,color-mix(in srgb,#ff6700 74%,#ffffff) 16%,transparent),inset 0 1px 0 color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 13%,transparent);border-color:color-mix(in srgb,#ff6700 36%,#ffffff)}.current-line{box-shadow:0 0 16px color-mix(in srgb,color-mix(in srgb,#ff6700 64%,#ffffff) 50%,transparent)}.career-detail{border-radius:13px;padding:28px;background:linear-gradient(135deg,color-mix(in srgb,#ffffff 11%,#000000),color-mix(in srgb,#ffffff 9%,#000000));border-color:color-mix(in srgb,#ff6700 21%,transparent)}.detail-index{font-size:11px}.detail-heading h3{font-size:clamp(25px,3vw,36px)}.detail-tags span{border-radius:20px;padding:7px 11px;background:color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 2%,transparent)}.career-meta{color:color-mix(in srgb,#ffffff 65%,#000000)}.work-grid,.skill-grid,.edu-grid{gap:16px;border:0}.work-card,.skill-card,.edu-card{border:1px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 8%,transparent);border-radius:14px;overflow:hidden;background:radial-gradient(circle at var(--glow-x,50%) var(--glow-y,0%),color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 4%,transparent),transparent 60%),color-mix(in srgb,#ffffff 10%,#000000);transition:border-color .25s,box-shadow .25s,transform .25s}.work-card:hover,.skill-card:hover,.edu-card:hover{border-color:color-mix(in srgb,color-mix(in srgb,#ff6700 82%,#ffffff) 47%,transparent);box-shadow:0 15px 35px color-mix(in srgb,color-mix(in srgb,#ffffff 0%,#000000) 20%,transparent);transform:translateY(-5px)}.work-art{height:260px;position:relative;overflow:hidden}.work-art:before{transition:transform .8s}.work-card:hover .work-art:before{transform:rotate(65deg) scale(1.2)}.work-art strong{transition:transform .5s}.work-card:hover .work-art strong{transform:translateY(-7px)}.contact-box{border-radius:20px;position:relative;overflow:hidden}.contact-box:after{content:'✳';position:absolute;right:3%;bottom:-30px;font-size:230px;line-height:1;color:color-mix(in srgb,color-mix(in srgb,#ff6700 70%,#ffffff) 7%,transparent);pointer-events:none}.contact-links a{transition:background .2s,transform .2s;border-radius:25px;padding:10px 16px}.contact-links a:hover{background:color-mix(in srgb,color-mix(in srgb,#ff6700 63%,#ffffff) 13%,transparent);transform:translateY(-3px)}.award{border-radius:30px;transition:transform .25s,border-color .25s}.award:hover{transform:rotate(-3deg) translateY(-4px);border-color:color-mix(in srgb,#ff6700 63%,#ffffff)}.nav-links a{position:relative}.nav-links a:after{content:'';position:absolute;bottom:-7px;left:0;right:0;height:2px;background:color-mix(in srgb,#ff6700 70%,#ffffff);transform:scaleX(0);transform-origin:left;transition:transform .2s}.nav-links a:hover:after,.nav-links a.active:after{transform:scaleX(1)}.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,color-mix(in srgb,#5e00ff 41%,#ffffff),color-mix(in srgb,#ff6700 62%,#ffffff));z-index:100;pointer-events:none}.studio-ribbon{overflow:hidden;padding:18px 0;border-top:1px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 8%,transparent);border-bottom:1px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 8%,transparent);background:color-mix(in srgb,#ffffff 10%,#000000);color:#ffde2b;white-space:nowrap;font:10px var(--mono);letter-spacing:.15em}.ribbon-track{display:flex;width:max-content;gap:40px}.ribbon-track span{display:inline-block}.ribbon-track em{font-style:normal;color:color-mix(in srgb,#ff6700 69%,#ffffff);margin:0 24px}.motion-toggle{position:fixed;right:16px;bottom:16px;z-index:49;border:1px solid color-mix(in srgb,color-mix(in srgb,#ffffff 100%,#000000) 19%,transparent);background:color-mix(in srgb,color-mix(in srgb,#ffffff 13%,#000000) 92%,transparent);color:color-mix(in srgb,#ffde2b 59%,#ffffff);border-radius:30px;padding:9px 12px;font:9px var(--mono);box-shadow:0 4px 15px color-mix(in srgb,color-mix(in srgb,#ffffff 0%,#000000) 20%,transparent);cursor:pointer;backdrop-filter:blur(8px)}
@media(prefers-reduced-motion:no-preference){html:not(.motion-paused) .ribbon-track{animation:drift 35s linear infinite}html:not(.motion-paused) .live-dot,html:not(.motion-paused) .current-line:before{animation:beacon 2.4s ease-in-out infinite}.reveal-ready{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1);transition-delay:var(--reveal-delay,0ms)}.reveal-ready.revealed{opacity:1;transform:translateY(0)}html:not(.motion-paused) .contact-box:after{animation:slowTurn 35s linear infinite}}@keyframes drift{to{transform:translateX(-50%)}}@keyframes beacon{50%{box-shadow:0 0 0 6px color-mix(in srgb,color-mix(in srgb,#ff6700 68%,#ffffff) 8%,transparent),0 0 18px color-mix(in srgb,color-mix(in srgb,#ff6700 68%,#ffffff) 47%,transparent)}}@keyframes slowTurn{to{rotate:360deg}}
html.motion-paused *,html.motion-paused *:before,html.motion-paused *:after{animation-play-state:paused!important;scroll-behavior:auto!important;transition:none!important}html.motion-paused .reveal-ready{opacity:1;transform:none}
@media(max-width:760px){.chapter-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.chapter-card{min-height:150px;padding:16px}.chapter-number{font-size:32px}.career-detail{padding:20px}.desktop-scene{padding-bottom:55px}.quick-sticky{width:88px;min-height:92px}.quick-sticky textarea{font-size:10px}.quick-sticky .note-remove{right:2px}.quick-sticky .note-color{right:21px}.work-art{height:210px}.motion-toggle{bottom:10px;right:10px}.scene-caption{line-height:1.8}.section-title h2{font-size:38px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal-ready{opacity:1;transform:none}}
:root{--sans:Arial,Helvetica,ui-sans-serif,system-ui,sans-serif}.desktop-scene{scroll-margin-top:56px}.section-title h2{font-family:var(--sans)}.chapter-card strong{line-height:1.3}.chapter-card p{font-family:var(--mono)}.chapter-card:focus-visible{outline:2px solid var(--chapter-color);outline-offset:4px}.evening .desktop-scene{background:radial-gradient(ellipse at 80% 5%,color-mix(in srgb,#ffde2b 20%,transparent),transparent 60%),linear-gradient(110deg,color-mix(in srgb,#ffffff 57%,#000000),color-mix(in srgb,#ffffff 42%,#000000))}.evening .desktop-scene:before{filter:brightness(.7)}.evening .desktop-hint{color:color-mix(in srgb,#ffde2b 36%,#ffffff)}.motion-paused .work-card:hover,.motion-paused .skill-card:hover,.motion-paused .edu-card:hover,.motion-paused .chapter-card:hover{transform:none}.chapter-accent{font-style:normal;background:linear-gradient(100deg,color-mix(in srgb,#ff6700 51%,#ffffff),color-mix(in srgb,#5e00ff 35%,#ffffff));background-clip:text;color:transparent}.career-section .section-title h2{max-width:750px}.chapter-rail{position:relative}.chapter-rail:before{content:'';position:absolute;top:50%;left:5%;right:5%;height:1px;background:linear-gradient(90deg,color-mix(in srgb,#5e00ff 34%,#ffffff),color-mix(in srgb,#5e00ff 42%,#ffffff),color-mix(in srgb,#ff6700 57%,#ffffff),color-mix(in srgb,#ffde2b 73%,#ffffff));opacity:.2;z-index:0}.chapter-card{backdrop-filter:blur(16px)}
@media(min-width:761px){.coffee{bottom:210px;left:-120px;font-size:49px}.pixel-pet{bottom:208px;left:-65px}.pixel-joystick{bottom:205px;left:auto;right:-75px}.plug{bottom:284px;right:-80px}.scene-caption{margin-top:30px}}
@media(prefers-reduced-motion:no-preference){html:not(.motion-paused) .computer-wrap{animation:desk-arrival .9s cubic-bezier(.2,.8,.2,1) both}html:not(.motion-paused) .doodle.star{animation:star-sway 6s ease-in-out infinite}html:not(.motion-paused) .section-title small{animation:none}}@keyframes desk-arrival{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}@keyframes star-sway{50%{rotate:16deg;scale:1.1}}
html.motion-paused .career-chart .role-bar{animation:none!important;opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.work-card:hover,.skill-card:hover,.edu-card:hover,.chapter-card:hover{transform:none}}
