/* Editorial scale and the stepped silhouette from Akshay's sketch. */
body{letter-spacing:.015em}.identity{font-size:18px;letter-spacing:.02em}.identity span{font-size:12px;letter-spacing:.045em}nav a{font-size:14px;letter-spacing:.05em}.opening-label,.tile-kicker,.eyebrow{font-size:12px;letter-spacing:.15em}.quiet-link,.text-button{font-size:14px;letter-spacing:.045em}.home-grid{gap:24px}.home-grid>.intro{position:relative;padding:28px 34px 36px;min-height:660px;background:none;border:0;box-shadow:none;overflow:visible;isolation:isolate}.intro-slab{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible;filter:drop-shadow(8px 12px 14px #050b0855);pointer-events:none}.intro-slab path{fill:var(--surface);stroke:#8de0bd24;stroke-width:1;vector-effect:non-scaling-stroke}.home-grid>.intro:before,.home-grid>.intro:after{display:none}.home-grid>.intro:hover,.home-grid>.intro:focus-within{box-shadow:none}.intro .tile-kicker{width:43%;min-height:42px;line-height:1.8;font-size:12px}.intro .small-orbit{display:none}.home-grid>.intro h1{font-size:clamp(40px,4.4vw,54px);line-height:1.04;letter-spacing:-.015em;margin:40px 0 25px}.home-grid .intro .bio{font-size:16px;line-height:1.85;letter-spacing:.012em}.home-grid .intro-bottom{margin-top:30px;gap:26px}.intro-bottom .quiet-link{font-size:15px}
/* The shell stays still; perspective is confined to its recessed window. */
.home-grid>.project-roller{min-height:660px;background:var(--surface);border:1px solid #8de0bd1c;box-shadow:var(--shadow),var(--inset);border-radius:30px;padding:12px;overflow:hidden}.roller-top,.roller-bottom{padding:15px 18px;font-size:13px;letter-spacing:.035em;gap:12px}.roller-stage{margin:0 2px;min-height:440px;border:0;background:radial-gradient(ellipse 64% 46% at 50% 50%,#16a36a1f,transparent 72%);box-shadow:none;perspective:none;touch-action:pan-y}.roller-drum{--radius:268.5px;left:28px;right:50px;height:350px;margin-top:-175px;transition:none;will-change:transform}.roller-card{border-radius:22px;border-color:#ffffff1f;box-shadow:0 26px 50px -22px #000c;transition:box-shadow 1.2s}.roller-visual{inset:0 0 132px;padding:15px 15px 0}.roller-copy{padding:18px 25px 20px;min-height:132px}.roller-copy>span{font-size:12px;letter-spacing:.08em;line-height:1.6;display:block}.roller-copy h2{font-size:34px;line-height:1.1;letter-spacing:.01em;margin:6px 0 4px}.roller-copy h2 b{font-size:27px}.roller-copy p{font-size:14px;letter-spacing:.01em}.roller-markers{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:grid;gap:2px;z-index:4}.roller-markers button{width:36px;height:36px;background:transparent;display:grid;place-items:center;padding:0}.roller-markers button:before{content:'';width:5px;height:5px;border:1px solid var(--muted);border-radius:50%;transition:all .6s}.roller-markers button[aria-pressed=true]:before{height:20px;border-radius:5px;background:var(--accent);border-color:var(--accent);box-shadow:0 0 12px #16a36a88}.roller-controls{gap:7px}.roller-controls button{width:42px;height:42px;border-radius:13px}.roller-controls .glyph{width:20px;height:20px}.roller-bottom{padding-top:20px}.system-word{font-size:44px}.system-word span,.system-rule{font-size:12px}.system-rule{top:24px}.system-parts span{width:55px;height:52px}.system-art{gap:24px;padding:30px 12px}
.skill-tile,.social-tile{min-height:215px;padding:28px}.skill-tile h2{font-size:25px;line-height:1.2;letter-spacing:-.01em}.skill-tile p,.social-tile p{font-size:14px;line-height:1.8;letter-spacing:.02em}.social-links{gap:12px}.social-links a{width:44px;height:44px}.story-stack{gap:24px;grid-template-rows:auto 1fr}.journey,.evidence-tile,.craft-tile{padding:34px}.journey h2{font-size:42px;letter-spacing:-.01em}.timeline{padding-left:84px;margin:35px 0 10px}.timeline li{padding:1px 0 31px;min-height:99px}.timeline .journey-icon{left:-81px;top:3px;width:57px;height:57px;border-radius:18px;transform:rotate(45deg);background:linear-gradient(145deg,#8de0bd0d,transparent),var(--raised);border-color:#8de0bd38;box-shadow:var(--inset),0 0 18px #16a36a13}.journey-icon .glyph{width:27px;height:27px;transform:rotate(-45deg);filter:drop-shadow(0 0 7px #16a36a70)}.timeline li:after{left:-53px;top:67px;bottom:7px;background:linear-gradient(#8de0bd65,#16a36a25)}.timeline li>span:not(.journey-icon){font-size:12px;letter-spacing:.09em}.timeline h3{font-size:20px;letter-spacing:.005em;line-height:1.3;margin:9px 0 8px}.timeline p{font-size:14px;line-height:1.8;letter-spacing:.015em}.evidence-pair{gap:22px;margin:28px 0 12px}.evidence-pair h2{font-size:32px;letter-spacing:0}.evidence-pair p,.evidence-pair .text-button{font-size:14px;line-height:1.8}.evidence-pair .text-button{display:inline-block;margin-top:16px}.craft-tile{display:flex;flex-direction:column;justify-content:center}.craft-tile h2{font-size:38px;letter-spacing:0}.craft-grid h3{font-size:25px;letter-spacing:0}.craft-grid p{font-size:16px;line-height:1.85}.craft-tags span{font-size:12px;letter-spacing:.04em;padding:8px 11px}.after-grid{gap:24px;margin-top:24px}.after-grid h2{font-size:34px;letter-spacing:-.01em}.archive-tile>a{font-size:16px}.archive-list,.archive-tile p{font-size:14px;line-height:1.8}.contact p{font-size:16px}.contact h2{letter-spacing:-.01em}footer{font-size:13px;letter-spacing:.04em}
/* Emerald illumination and a genuinely engraved action seal in both themes. */
.primary{position:relative;isolation:isolate;overflow:visible;min-height:54px;padding:15px 22px 15px 63px;background:linear-gradient(125deg,#16a36a,#0d7d55);color:#f7f4ea;border:1px solid #8de0bd99;font-size:15px;letter-spacing:.05em;box-shadow:inset 0 1px 1px #c5ffeccc,inset 0 -2px 8px #073f3570,0 0 8px #16a36a66,0 0 28px #16a36a38;transition:box-shadow .8s,background .8s,transform .3s}.cta-rune{position:absolute;left:13px;top:50%;width:38px;height:38px;transform:translateY(-50%) rotate(var(--engraving-turn,0deg));color:#c4ffe4;stroke-width:1;filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px #8de0bd);opacity:.9;transition:filter .8s,opacity .8s}.primary:after{content:'';position:absolute;inset:8px -13px -12px;z-index:-1;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse,#16a36a60,transparent 70%);filter:blur(9px);opacity:.7;transition:opacity .8s}.primary:hover,.primary:focus-visible{box-shadow:inset 0 1px 2px #eaffef,inset 0 0 16px #8de0bd40,0 0 13px #8de0bd60,0 0 40px #16a36a65}.primary:hover:after,.primary:focus-visible:after{opacity:1}.primary:hover .cta-rune,.primary:focus-visible .cta-rune{opacity:1;filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 12px #8de0bd)}.settings button{box-shadow:var(--shadow),var(--inset),0 0 16px #16a36a20}.settings .control-icon{filter:drop-shadow(0 0 3px #8de0bd70) drop-shadow(0 0 9px #16a36a60)}
[data-scheme=light] .intro-slab{filter:drop-shadow(8px 12px 14px #8b9c892a)}[data-scheme=light] .intro-slab path{stroke:#fff}[data-scheme=light] .home-grid>.project-roller{background:var(--surface);border-color:#fff}[data-scheme=light] .roller-stage{background:radial-gradient(ellipse 64% 46% at 50% 50%,#16a36a17,transparent 72%);box-shadow:none}[data-scheme=light] .primary{color:#f7f4ea;box-shadow:inset 0 1px 2px #eaffef,0 0 12px #16a36a45,0 8px 25px #16a36a35}
@media(max-width:1050px){.home-grid>.intro{padding:26px;min-height:680px}.home-grid>.intro h1{font-size:44px}.roller-drum{left:16px;right:44px}.roller-copy{padding:20px}.skill-tile,.social-tile{padding:22px}.social-links{gap:7px;flex-wrap:wrap}.journey,.evidence-tile,.craft-tile{padding:27px}.evidence-pair{grid-template-columns:1fr}.evidence-pair>a+a{border-left:0;border-top:1px solid var(--line);padding:25px 0 0}.timeline{padding-left:69px}.timeline .journey-icon{left:-66px;width:47px;height:47px;border-radius:14px}.timeline li:after{left:-43px;top:57px}.timeline h3{font-size:18px}.system-art{gap:15px}.system-word{font-size:35px}.system-parts span{width:42px;height:43px}}
@media(max-width:700px){.home-grid{gap:18px}.home-grid>.intro{padding:25px;min-height:0}.intro .tile-kicker{font-size:12px;letter-spacing:.04em;width:43%;min-height:44px}.home-grid>.intro h1{font-size:44px;margin-top:38px}.home-grid>.intro .bio{font-size:16px}.home-grid>.project-roller{min-height:570px;padding:8px}.roller-stage{min-height:420px}.roller-drum{height:320px;margin-top:-160px;--radius:240.7px;left:15px;right:42px}.roller-visual{bottom:130px;padding:10px 8px 0}.roller-copy{padding:16px 18px;min-height:130px}.roller-copy h2{font-size:30px}.roller-copy>span{font-size:12px;letter-spacing:.035em}.roller-copy p{font-size:14px}.roller-top,.roller-bottom{padding:13px 12px;font-size:12px}.roller-bottom>span{max-width:130px}.system-art{gap:18px;padding:25px 8px}.system-rule{top:16px;font-size:12px}.system-word{font-size:30px}.system-word span{font-size:12px}.system-parts{gap:7px}.system-parts span{width:36px;height:34px}.skill-tile,.social-tile{padding:23px 19px}.skill-tile h2{font-size:23px}.opening-label{letter-spacing:.08em}.story-stack{gap:18px}.evidence-pair{grid-template-columns:1fr 1fr;gap:16px}.evidence-pair>a+a{border-top:0;border-left:1px solid var(--line);padding:0 0 0 16px}.evidence-pair h2{font-size:28px}.craft-grid{gap:20px}.craft-grid h3{font-size:23px}.craft-grid p{font-size:16px}.timeline{padding-left:72px}.timeline .journey-icon{width:48px;height:48px;left:-67px}.timeline li{padding-bottom:30px}.timeline li>span:not(.journey-icon){font-size:12px;letter-spacing:.045em}.timeline h3{font-size:20px}.timeline p{font-size:15px}.timeline li:after{left:-43px;top:58px}.after-grid{gap:18px}.primary{gap:15px}.intro-bottom{flex-wrap:wrap}header nav a{font-size:14px;padding:10px}}
@media(prefers-reduced-motion:reduce){.cta-rune{transform:translateY(-50%)}.roller-drum,.roller-markers button:before,.primary,.cta-rune{transition:none}.roller-drum{transform:none}.intro,.intro:hover{translate:none}}

[data-scheme=light] .identity{color:var(--text)}[data-scheme=light] .settings .control-icon{color:#073f35;filter:drop-shadow(0 0 4px #16a36a60)}[data-scheme=light] .roller-markers button[aria-pressed=true]:before{background:#073f35;border-color:#073f35}
@media(max-width:700px){.home-grid>.intro h1{font-size:38px;line-height:1.08}.journey h2{font-size:36px}}
/* Intro: labels removed; illumination follows the reversed-L slab, never a rectangle. */
.home-grid>.intro h1{margin-top:84px}
.home-grid{margin-top:12px}
.intro-slab path{transition:stroke .6s,fill .6s}
.home-grid>.intro:is(:hover,:focus-within) .intro-slab{filter:drop-shadow(8px 12px 14px #050b0855) drop-shadow(0 0 22px #16a36a26)}
.home-grid>.intro:is(:hover,:focus-within) .intro-slab path{stroke:#8de0bd55}
[data-scheme=light] .home-grid>.intro:is(:hover,:focus-within) .intro-slab{filter:drop-shadow(8px 12px 14px #a5ada34d) drop-shadow(0 0 18px #16a36a30)}
@media(max-width:700px){.home-grid>.intro h1{margin-top:82px}}
/* Carousel: one lit drum inside the shell. Drum radius is tuned so the on-screen gap between faces equals the bento gap (24px desktop, 18px mobile). Faces sit apart, dissolve at the stage edges and brighten as they turn to the front. */
.roller-window{position:absolute;inset:0;perspective:1400px;-webkit-mask-image:linear-gradient(to bottom,transparent 2%,#000 calc(50% - 180px),#000 calc(50% + 180px),transparent 98%);mask-image:linear-gradient(to bottom,transparent 2%,#000 calc(50% - 180px),#000 calc(50% + 180px),transparent 98%)}
.roller-card:after{content:'';position:absolute;inset:0;border-radius:inherit;background:var(--surface);opacity:min(calc(var(--dist,1) * .55),.9);pointer-events:none}
.roller-card.current{box-shadow:0 26px 50px -22px #000c,0 0 46px -8px #16a36a59}
[data-scheme=light] .roller-card{box-shadow:0 22px 44px -20px #56644f59}
[data-scheme=light] .roller-card.current{box-shadow:0 22px 44px -20px #56644f59,0 0 40px -8px #16a36a47}
@media(max-width:700px){.roller-window{-webkit-mask-image:linear-gradient(to bottom,transparent 2%,#000 calc(50% - 165px),#000 calc(50% + 165px),transparent 98%);mask-image:linear-gradient(to bottom,transparent 2%,#000 calc(50% - 165px),#000 calc(50% + 165px),transparent 98%)}}
@media(prefers-reduced-motion:reduce){.roller-card:after{transition:none;opacity:0}.roller-card{transition:none}.roller-window{-webkit-mask-image:none;mask-image:none}}
/* Desktop home: the intro's tall tab rises into the header band and holds the identity; the nav sits in the notch; the short part starts level with the carousel. The slab path is drawn to measured layout in app.js. */
@media(min-width:1000px){.home header{height:112px;padding-top:24px;padding-bottom:0}.home header nav{top:40px}.home .identity{padding-left:34px}.home .home-grid{margin-top:0}.home .home-grid>.intro{margin-top:-88px;min-height:648px}.home .home-grid>.intro h1{margin-top:96px}}
/* Desktop home: shorter hero — carousel shell 560px (short part of the L matches), smaller faces, tighter bars. Radius keeps the on-screen face gap at the 24px bento gap. */
@media(min-width:1000px){.home .home-grid>.project-roller{min-height:560px}.home .roller-top{padding:12px 18px}.home .roller-bottom{padding-top:8px;padding-bottom:12px}.home .roller-drum{height:310px;margin-top:-155px;--radius:241.1px}.home .roller-visual{inset:0 0 116px}.home .roller-copy{min-height:116px;padding:14px 22px 16px}.home .roller-copy h2{font-size:30px;margin:6px 0 2px}.home .roller-window{-webkit-mask-image:linear-gradient(to bottom,transparent 2%,#000 calc(50% - 165px),#000 calc(50% + 165px),transparent 98%);mask-image:linear-gradient(to bottom,transparent 2%,#000 calc(50% - 165px),#000 calc(50% + 165px),transparent 98%)}}

/* Proof tiles carry real project imagery; About shares a design philosophy; outside-work tile. */
.evidence-pair .proof-media{display:block;aspect-ratio:16/9;margin-bottom:18px;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(135deg,#16a36a30,#073f3580);box-shadow:var(--inset)}.proof-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}.evidence-pair a:hover .proof-media img,.evidence-pair a:focus-visible .proof-media img{transform:scale(1.04)}#experience.about-me{grid-column:1/-1;scroll-margin-top:110px}.journey-col{grid-column:7/13;min-width:0}.about-tile{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;padding:34px}.about-tile h2{font-size:clamp(32px,3.2vw,44px);line-height:1.08;letter-spacing:-.01em;margin:14px 0 18px;text-wrap:balance}.about-intro p{font-size:16px;line-height:1.85;color:var(--muted);max-width:56ch;margin:0 0 14px}.philosophy ul{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.philosophy li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;padding:18px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(150deg,#8de0bd0c,transparent 60%),var(--raised);box-shadow:var(--inset)}.philosophy svg{grid-row:span 2;width:42px;height:42px;padding:9px;border-radius:13px;color:#8de0bd;border:1px solid #8de0bd30;background:#16a36a14;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px #16a36a55)}.philosophy b{align-self:end;font-size:17px;font-weight:600;line-height:1.3}.philosophy li span{font-size:14px;line-height:1.6;color:var(--muted)}[data-scheme=light] .philosophy svg{color:#073f35;border-color:#073f3525;filter:none}.outdoors-tile p{font-size:15px;line-height:1.7;color:var(--muted);margin:0 0 14px}.outdoor-tags{display:flex;flex-wrap:wrap;gap:8px}.outdoor-tags span{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:10px;border:1px solid var(--line);font-size:12px;letter-spacing:.04em;color:var(--muted)}.outdoor-tags svg{width:15px;height:15px;fill:none;stroke:#8de0bd;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}[data-scheme=light] .outdoor-tags svg{stroke:#073f35}.park-stamp{transform-box:fill-box;transform-origin:center;animation:park-spin 48s linear infinite}@keyframes park-spin{to{transform:rotate(360deg)}}@media(max-width:1000px){.about-tile{grid-template-columns:minmax(0,1fr);gap:26px;padding:27px}}@media(max-width:700px){.journey-col{grid-column:1/-1}.philosophy ul{grid-template-columns:minmax(0,1fr)}.about-tile{padding:24px}}@media(prefers-reduced-motion:reduce){.park-stamp{animation:none}.proof-media img{transition:none}}

/* Wider canvas and breathing room on large screens; outside-work tile lives in the proof column, two-up closing row. */
@media(min-width:1000px){.home header,.home main,.home footer,.lab-page header,.lab-page main,.lab-page footer{max-width:1600px;padding-left:clamp(32px,3.6vw,64px);padding-right:clamp(32px,3.6vw,64px)}.home .home-grid,.lab-grid,.home .story-stack{gap:clamp(24px,2.1vw,36px)}.home .after-grid{gap:clamp(24px,2.1vw,36px);margin-top:clamp(24px,2.1vw,36px)}.about-tile,.journey,.evidence-tile,.craft-tile{padding:clamp(34px,2.8vw,48px)}}.home .story-stack{grid-template-rows:auto auto 1fr}.outdoors-tile h2{font-size:34px;line-height:1.1;margin:12px 0}@media(min-width:701px){.home .after-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.social-links .npm-link{font-size:13px;letter-spacing:.02em}

.outside-intro .inline-link{color:var(--accent);text-decoration:underline;text-underline-offset:3px}