/* Viewport compositions. Detail disclosures retain native document flow. */
html.showcase-ready .deck-core>.project-panel[hidden]{display:none!important}
html:has(#portfolio){scroll-snap-type:y proximity!important;scroll-padding-top:var(--header-height,72px)}
html[data-theme] main>section{scroll-snap-align:start!important;scroll-margin-top:0;min-height:calc(100svh - var(--header-height,72px));padding:clamp(12px,3svh,30px) clamp(12px,2vw,24px);gap:clamp(10px,2svh,20px);box-sizing:border-box}
html[data-theme] main>section:has(details[open]){scroll-snap-align:none!important}
html[data-theme] main>section>h2,html[data-theme] main .character-heading h2{font-size:clamp(22px,3svh,32px);padding:10px 16px;margin:0 0 8px;line-height:1.15}
html[data-theme] .character-heading{margin:0 0 12px;gap:10px;flex-direction:row}
html[data-theme] .character-heading .site-character{--character-size:clamp(50px,10svh,90px)}
html[data-theme] .character-heading-copy{max-width:none;flex:0 1 auto}
html[data-theme] main .character-heading p{font-size:13px;line-height:1.4}
html[data-theme] #portfolio{display:flex;flex-direction:column;justify-content:center;align-items:center}
html[data-theme] .portfolio-scene{padding:0!important;min-height:0;max-width:1160px;width:100%;gap:0;overflow:visible}
html[data-concept=c] .showcase-stage{max-width:1100px;width:100%;padding:0 110px}
html.showcase-ready .deck-core{display:block!important;position:relative;height:auto!important;min-height:0;touch-action:pan-y}
html[data-concept=c] .deck-core>.project-panel{margin:0!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:auto;min-height:0!important;gap:22px;padding:22px}
html[data-concept=c] .deck-core>.project-panel[hidden]{display:none!important}
html[data-concept=c] .deck-core>.deck-measure{position:absolute!important;visibility:hidden!important;pointer-events:none;left:0;top:0;width:100%}
html[data-theme] #portfolio .project-details{padding:0;align-content:center}
html[data-theme] #portfolio .project-details::after{display:none}
html[data-theme] #portfolio .project-details h3{font-size:clamp(22px,3.4svh,30px)!important;min-height:0;margin:6px 0;line-height:1.15}
html[data-theme] #portfolio .project-details p{font-size:14px;line-height:1.4;margin:6px 0}
.project-peek{margin:6px 0;font-size:12px;line-height:1.4}
.project-category{font-size:10px;line-height:1.4}
.project-panel .detail-trigger{margin:8px 0 0;min-height:44px}
.project-actions{margin:8px 0 0!important;gap:8px;display:flex;flex-wrap:wrap}
.project-action{min-height:44px;padding:8px 10px;font-size:12px}
.project-visual{min-width:0;align-self:center}
.project-media,#project-devrun .project-media{height:clamp(110px,25svh,245px);aspect-ratio:auto}
.project-media img,#project-devrun .project-media img{height:100%;max-height:100%;width:100%;object-fit:contain;aspect-ratio:auto}
.visual-topline,.media-caption{font-size:10px;line-height:1.35;margin-block:6px}
.project-rail{display:flex!important;overflow:visible;flex-wrap:wrap!important;justify-content:center!important;gap:4px;padding:5px!important;margin:0 auto 12px;max-width:100%!important}
.project-selector{flex:0 1 auto;min-height:44px!important;padding:8px 9px!important;font-size:11px}
.deck-preview{width:135px;max-height:220px;top:50%;translate:0 -50%}
.deck-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0 0;color:var(--ink);position:relative;z-index:4}
.deck-controls p{font:12px/1.4 var(--font-body);margin:0;text-align:center}
.deck-controls button,.deck-picker{min-height:44px;padding:8px 12px;border:1px solid var(--edge);border-radius:12px;background:var(--surface-gradient);color:var(--ink);font:13px var(--font-body);cursor:pointer}
.deck-controls button:focus-visible,.deck-picker:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.deck-picker{display:none;min-width:0}
.work-further{margin:0;gap:0 18px;font-size:12px}
html[data-dev-intensity] #guide-launcher{--dev-w:54px;--dev-h:88px;transition:opacity 180ms ease}
html[data-dev-state=SCROLL_REST] #guide-launcher{opacity:0;pointer-events:none}
/* Compact deck: native chooser + authored arrows/swipe, never a scrolling rail. */
@media(max-width:1099px),(max-height:679px),(pointer:coarse){
 html[data-concept=c] .showcase-stage{padding:0;max-width:900px}
 .project-rail,.deck-preview{display:none!important}
 .deck-picker{display:block;flex:1;width:100%}
 .deck-controls p{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
 .deck-controls button{font-size:0;flex:none;width:44px;padding:0}
 .deck-controls button:first-child::after{content:'←';font-size:20px}
 .deck-controls button:last-child::after{content:'→';font-size:20px}
}
@media(max-width:600px){
 html[data-concept=c] .deck-core>.project-panel{display:block!important;padding:12px 14px}
 html[data-concept=c] .deck-core>.project-panel[hidden]{display:none!important}
 .project-media,#project-devrun .project-media{height:clamp(65px,calc(24svh - 65px),155px)}
 .visual-topline,.media-caption{font-size:9px;margin:3px 0;line-height:1.25}
 html[data-theme] #portfolio .project-details h3{font-size:22px!important}
 html[data-theme] #portfolio .project-details p{font-size:13px;margin:5px 0}
 .project-peek{font-size:11px;margin:4px 0}
 .project-category{font-size:9px;margin-top:5px}
 .project-actions{gap:6px;margin-top:4px!important}
 .project-action{font-size:11px;padding:6px 8px;gap:5px}
 .project-panel .detail-trigger{margin-top:4px}
 .project-hook .ui-icon{width:16px;height:16px}
 .work-further{gap:0 12px;font-size:11px}.work-further .conversion-link{min-height:36px}
 html[data-theme] .work-character-heading .site-character{--character-size:48px}
 html[data-theme] #portfolio .character-heading{margin-bottom:10px}
 html[data-theme] #portfolio .character-heading-copy h2{font-size:22px;padding:7px 12px}
 html[data-theme] #portfolio .portfolio-intro{font-size:12px;max-width:260px}
}
/* Home, skills, about, play and contact use the same viewport budget. */
html[data-theme] #about{padding-block:12px;min-height:calc(100svh - var(--header-height,72px))}
html[data-theme] #about .entry-space{gap:0}
html[data-theme] #about .hero-dude-img{height:clamp(100px,32svh,310px);max-height:none}
html[data-theme] #about .entry-line{margin-bottom:12px}
html[data-theme] #about .entry-dock{min-height:0;margin-bottom:12px;gap:12px}
html[data-theme] #about .entry-object{width:clamp(44px,9svh,78px);height:clamp(44px,9svh,78px);min-width:44px;padding:12px}
html[data-theme] #about .entry-object .ui-icon{width:28px;height:28px}
html[data-theme] #services .object-workbench{padding:14px;max-width:1000px;width:100%}
html[data-theme] #services .bench-object{min-height:70px;padding:10px 4px;gap:8px;font-size:12px}
html[data-theme] #services .bench-object>.ui-icon{width:25px;height:25px}
html[data-theme] #services .bench-idle{min-height:80px;padding:12px}
html[data-theme] #services .bench-panel{min-height:0;padding:12px;gap:15px}
html[data-theme] #services .bench-copy h3{font-size:22px!important}
html[data-theme] #services .bench-copy p{font-size:14px!important;line-height:1.5}
html[data-theme] #experience .about-room{gap:30px}
html[data-theme] #experience #about-picture{max-height:clamp(150px,48svh,450px);object-fit:cover}
html[data-theme] #experience .about-one{font-size:clamp(16px,2.7svh,23px);line-height:1.5;margin:0 0 12px}
html[data-theme] #experience .education-pin{margin-bottom:10px}
html[data-theme] #experience .about-actions{margin-top:10px}
html[data-theme] #playground .side-quests{gap:10px}
html[data-theme] #playground .quest-card{padding:14px;gap:8px}
html[data-theme] #playground .quest-card strong{font-size:17px;line-height:1.25}
html[data-theme] #playground .quest-card>.ui-icon{width:24px;height:24px}
html[data-theme] #playground .dev-run-feature{grid-template-columns:1fr 1fr;gap:20px}
html[data-theme] #playground .dev-run-key-art{max-height:clamp(100px,24svh,210px)}
html[data-theme] #playground .dev-run-key-art img{height:100%;max-height:clamp(100px,24svh,210px);object-fit:contain}
html[data-theme] #playground .dev-run-invite{gap:8px}
html[data-theme] #contact .contact-invite{margin-bottom:14px}
html[data-theme] #contact .contact-signal-grid{gap:10px}
html[data-theme] #contact .signal-badge{padding:12px 18px;min-height:65px;gap:14px}
html[data-theme] #contact .signal-mail{padding:20px;gap:10px}
html[data-theme] #contact .mail-emblem{width:48px;height:48px;border-radius:12px}
html[data-theme] #contact .mail-emblem .ui-icon{width:28px;height:28px}
html[data-theme] #contact .contact-status-row{margin:10px 0;gap:12px}
html[data-theme] #contact .contact-companion{gap:12px;flex-wrap:wrap;justify-content:center}
html[data-theme] #contact .contact-next-step{margin:0!important;font-size:12px!important;max-width:540px}
@media(max-width:700px){
 html[data-theme] #services .bench-objects{grid-template-columns:repeat(4,1fr);gap:6px}
 html[data-theme] #services .bench-object{min-height:60px;gap:5px;padding:7px 3px}
 html[data-theme] #services .bench-idle{min-height:60px}
 html[data-theme] #services .bench-diagram{padding:0;gap:5px}
 html[data-theme] #services .bench-diagram span{padding:5px;font-size:10px}
 html[data-theme] #experience .about-room{grid-template-columns:1fr;gap:14px}
 html[data-theme] #experience .about-portrait{max-width:160px;justify-self:center}
 html[data-theme] #experience #about-picture{max-height:clamp(80px,20svh,160px);object-fit:cover}
 html[data-theme] #experience .about-one{font-size:16px}
 html[data-theme] #experience .about-disclosures>details{margin-bottom:4px;padding-bottom:0}
 html[data-theme] #experience .about-disclosures>details>summary{min-height:44px}
 html[data-theme] #playground .side-quests{grid-template-columns:1fr 1fr;gap:8px}
 html[data-theme] #playground .quest-card{padding:10px;gap:5px;font-size:12px}
 html[data-theme] #playground .quest-card strong{font-size:14px}
 html[data-theme] #playground .quest-card>span:not(.quest-kicker):not(.quest-action){font-size:11px;line-height:1.35}
 html[data-theme] #playground .quest-card>.ui-icon{width:18px;height:18px}
 html[data-theme] #playground .quest-kicker{font-size:9px;line-height:1.3}
 html[data-theme] #playground .quest-action{font-size:11px;line-height:1.4}
 html[data-theme] #playground .dev-run-feature{gap:10px}
 html[data-theme] #playground .dev-run-invite{gap:5px}
 html[data-theme] #playground .lab-footnote{gap:0;font-size:11px}
 html[data-theme] #contact .contact-invite h3{font-size:25px}
 html[data-theme] #contact .contact-invite p{font-size:12px}
 html[data-theme] #contact .contact-signal-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:8px}
 html[data-theme] #contact .signal-mail{grid-row:auto;grid-column:1/-1;padding:12px;display:grid;grid-template-columns:36px 1fr;gap:2px 12px}
 html[data-theme] #contact .mail-emblem{grid-row:1/3;width:36px;height:36px}
 html[data-theme] #contact .signal-mail strong{font-size:22px;line-height:1.3}
 html[data-theme] #contact .signal-arrow{right:10px;bottom:10px}
 html[data-theme] #contact .signal-badge{padding:10px;gap:8px;min-height:55px}
 html[data-theme] #contact .signal-badge strong{font-size:14px}
 html[data-theme] #contact .signal-resume{grid-column:1/-1}
 html[data-theme] #contact .contact-status-row{flex-wrap:wrap;gap:0;margin:4px 0}
 html[data-theme] #contact .region-pin{min-height:30px}
 html[data-theme] #contact .contact-companion{gap:0 12px}
 html[data-theme] #contact .contact-companion .dev-character{width:28px;height:36px}
 html[data-theme] #contact .contact-next-step{order:3;font-size:11px!important;line-height:1.4!important}
}
@media(max-height:650px){
 html[data-theme] main>section{padding-block:10px;gap:8px}
 html[data-theme] main .character-heading{margin-bottom:6px}
 html[data-theme] main .character-heading .site-character{--character-size:44px}
 html[data-theme] #about .hero-dude-img{height:clamp(80px,25svh,150px)}
 html[data-theme] #about .entry-line{font-size:15px;margin-bottom:8px}
 html[data-theme] #portfolio .project-panel{padding:8px 12px}
 .visual-topline,.media-caption{font-size:8px;margin:2px 0}
 html[data-theme] #portfolio .project-details h3{font-size:20px!important}
 html[data-theme] #portfolio .project-details p{font-size:12px;margin:4px 0}
 .project-peek{font-size:10px;margin:3px 0}
 .project-category{font-size:9px}
 .deck-controls{padding-top:6px}
 html[data-theme] #playground .quest-card{gap:3px;padding:8px}
 html[data-theme] #playground .quest-card>.ui-icon{display:none}
 html[data-theme] #playground .lab-footnote small{font-size:10px;line-height:1.3}
 html[data-theme] #experience .about-portrait{max-width:100px}
 html[data-theme] #experience #about-picture{max-height:90px}
 html[data-theme] #contact .contact-invite{margin-bottom:8px}
}
@media(prefers-reduced-motion:reduce){html:has(#portfolio){scroll-snap-type:none!important}html[data-dev-intensity] #guide-launcher{transition:none}}
html[data-motion=reduce]:has(#portfolio){scroll-snap-type:none!important}
/* Resolve older ID-scoped section rules without changing the shared legacy sheets. */
html[data-theme] main>section:is(#about,#portfolio,#services,#experience,#playground,#contact){min-height:calc(100svh - var(--header-height,72px));padding:clamp(10px,2svh,22px) 0!important;gap:clamp(8px,1.4svh,14px);justify-content:center}
html[data-concept=c] .showcase-stage{display:block;gap:0}
html[data-theme] #portfolio .character-heading{min-height:0}
html[data-theme] #portfolio .work-further .conversion-link{font-size:12px;line-height:1.4;min-height:36px}
html[data-theme] #portfolio .work-further{gap:0 12px}
html[data-theme] #playground .quest-card{padding:12px!important}
html[data-theme] #contact .contact-invite .site-character{--character-size:clamp(60px,12svh,110px)}
html[data-theme] #contact .contact-invite h3{font-size:clamp(23px,3.5svh,32px);line-height:1.2}
html[data-theme] #contact .contact-invite p{font-size:12px;line-height:1.4}
html[data-theme] #contact .contact-companion .quiet-link{min-height:44px;font-size:12px}
html[data-theme] #contact .contact-companion button{min-height:44px}
html[data-theme] #about .entry-profession{font-size:13px;line-height:1.4;margin:6px 0!important}
@media(max-width:799px){
 html[data-theme] #about .entry-dude-link{height:clamp(80px,calc(35svh - 80px),215px);width:235px}
 html[data-theme] #about .hero-dude-img{height:100%}
 html[data-entry-ready=true] #about .entry-stage{height:clamp(130px,25svh,214px)}
 html[data-theme] #about .entry-object{width:56px;height:56px}
 html[data-theme] #about .entry-tools .entry-object{width:56px!important;height:56px!important}
 html[data-entry-ready=true] #about .entry-mode .entry-dock{grid-template-columns:repeat(3,56px);gap:30px 18px;translate:0 -12px}
 html[data-theme] #about .entry-tools{gap:14px}
 html[data-theme] #about .entry-switcher{margin:0 0 4px}
 html[data-theme] #about .entry-career .conversion-link{font-size:11px;line-height:1.3}
 html[data-theme] #about .identity-whisper{margin:0}
 html[data-theme] #playground .quest-card{padding:9px!important}
 html[data-theme] #playground .quest-card strong{font-size:14px}
 html[data-theme] #playground .quest-card>.ui-icon{width:18px;height:18px}
 html[data-theme] #playground .dev-run-key-art{max-height:135px}
 html[data-theme] #playground .dev-run-key-art img{max-height:135px}
 html[data-theme] #playground .lab-footnote{line-height:1.3}
 html[data-theme] #playground .lab-footnote .quiet-link{min-height:36px;font-size:11px}
 html[data-theme] #contact .contact-companion .dev-character{width:28px;height:36px}
}
@media(max-width:380px),(max-height:650px){
 html[data-theme] #portfolio .work-further .conversion-link{font-size:10px;min-height:30px}
 html[data-theme] #portfolio .work-further{gap:0 7px}
 html[data-theme] #portfolio .character-heading{margin-bottom:6px}
 html[data-theme] #portfolio .character-heading h2{font-size:20px;padding:7px 10px;margin-bottom:5px}
 html[data-theme] #portfolio .portfolio-intro{font-size:11px}
 html[data-theme] #playground .quest-card{padding:7px!important}
 html[data-theme] #contact .contact-invite .site-character{--character-size:50px}
 html[data-theme] #contact .contact-companion button{font-size:11px}
 html[data-theme] #contact .contact-next-step{font-size:10px!important}
}
/* Existing global paragraph/card chrome must not consume the compact layout budget. */
html[data-theme] #about .entry-profession{padding:0;background:none}
html[data-theme] #contact .contact-invite :is(p,h3){padding:0;min-height:0}
html[data-theme] #contact .contact-next-step{padding:0}
html[data-theme] #contact .contact-next-step .conversion-link{font-size:12px;min-height:30px;padding:4px 0;line-height:1.4}
html[data-theme] #contact .signal-badge{flex-direction:row}
html[data-theme] #contact .signal-badge>span:not(.social-mark){flex:1}
html[data-theme] #contact .contact-companion{margin-top:0}
@media(max-width:799px){
 html[data-theme] #about .entry-world-room{min-height:0}
 html[data-theme] #about .entry-profession{font-size:12px;padding:0;line-height:1.4}
 html[data-theme] #about .entry-career .conversion-link{padding:4px 0}
 html[data-theme] #contact .signal-badge{min-height:50px;padding:7px 10px}
 html[data-theme] #contact .contact-invite{gap:10px}
 html[data-theme] #playground .quest-card{line-height:1.25}
 html[data-theme] #playground .quest-card>span{padding:0;min-height:0}
 html[data-theme] #playground .quest-card strong{padding:0}
 html[data-theme] #playground .lab-footnote small{font-size:10px;line-height:1.3}
}
@media(min-width:800px) and (max-height:760px){
 html[data-theme] #about .entry-world-room{grid-template-rows:45px 230px}
 html[data-theme] #about .entry-dude-link{height:270px;width:300px}
 html[data-theme] #about .hero-dude-img{height:100%}
 html[data-entry-ready=true] #about .entry-stage{height:220px}
 html[data-entry-ready=true] #about .entry-mode .entry-dock{grid-template-columns:repeat(3,66px);gap:30px 20px}
 html[data-theme] #about .entry-object{width:60px;height:60px}
 html[data-theme] #about .entry-tools{grid-template-columns:repeat(2,60px);gap:30px}
 html[data-theme] #portfolio .project-rail{margin-bottom:8px}
 html[data-theme] #portfolio .character-heading .site-character{--character-size:60px}
 html[data-theme] #portfolio .character-heading{margin-bottom:6px}
}
@media(min-width:800px) and (max-width:1099px){html[data-theme] #playground .side-quests{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:400px){
 html[data-theme] #playground .quest-card strong{font-size:13px}
 html[data-theme] #playground .quest-card>.ui-icon{display:none}
 html[data-theme] #playground .dev-run-feature{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}
 html[data-theme] #playground .quest-card>span:not(.quest-kicker):not(.quest-action){font-size:11px}
}
@media(max-width:600px) and (max-height:650px){
 html[data-theme] #about .entry-stage{height:130px}
 html[data-theme] #about .entry-dude-link{height:80px;width:150px}
 html[data-theme] #about .entry-object{width:44px;height:44px;border-radius:12px;padding:8px}
 html[data-theme] #about .entry-tools .entry-object{width:44px!important;height:44px!important}
 html[data-entry-ready=true] #about .entry-mode .entry-dock{grid-template-columns:repeat(3,44px);gap:20px 18px;translate:0 -7px}
 html[data-theme] #about .entry-tools{gap:10px}
 html[data-theme] #about .entry-project{padding:12px;font-size:13px;min-height:85px}
 html[data-theme] #about .entry-profession{font-size:11px}
 html[data-theme] #about .entry-career{margin:0;gap:0 10px}
 html[data-theme] #about .entry-shortcuts{margin-bottom:0}
 html[data-theme] #about .entry-career .conversion-link{min-height:28px;font-size:10px}
 html[data-theme] #portfolio .project-media,html[data-theme] #project-devrun .project-media{height:55px}
 html[data-theme] #portfolio .detail-trigger .brand-preview img{height:14px!important;max-width:47px}
 html[data-theme] #portfolio .detail-trigger .brand-preview{padding:2px;gap:3px}
 html[data-theme] #portfolio .detail-trigger{gap:4px;font-size:10px}
 html[data-theme] #portfolio .project-actions .project-action{font-size:10px;padding:5px;gap:3px}
 html[data-theme] #portfolio .project-actions .ui-icon{width:12px;height:12px}
 html[data-theme] #experience .about-room{grid-template-columns:70px 1fr;gap:12px;align-items:start}
 html[data-theme] #experience .about-portrait{width:70px}
 html[data-theme] #experience .about-one{font-size:14px;line-height:1.4}
 html[data-theme] #experience .education-pin{font-size:10px;line-height:1.4}
 html[data-theme] #experience .about-disclosures>details>summary{font-size:12px}
 html[data-theme] #experience .about-actions{gap:4px;margin-top:4px}
 html[data-theme] #experience .about-actions .project-action{font-size:10px}
 html[data-theme] #contact .contact-invite h3{font-size:21px}
 html[data-theme] #contact .contact-invite p{font-size:11px}
 html[data-theme] #contact .contact-invite{margin-bottom:6px}
 html[data-theme] #contact .signal-mail strong{font-size:19px}
 html[data-theme] #contact .signal-badge{padding:5px 8px;min-height:44px}
 html[data-theme] #contact .signal-badge .social-mark{width:28px;height:28px;flex-basis:28px;padding:4px}
 html[data-theme] #contact .signal-badge>svg:first-child{width:28px;height:28px;padding:4px}
 html[data-theme] #contact .signal-badge strong{font-size:12px}
 html[data-theme] #contact .contact-status-row{margin:0}
 html[data-theme] #contact .region-pin{font-size:10px;min-height:24px}
 html[data-theme] #contact .contact-next-step .conversion-link{font-size:11px;min-height:24px}
}
html[data-theme] main .character-heading p{padding:0;min-height:0}
html[data-theme] #about .entry-switcher{margin-top:4px}
html[data-theme] #playground .game-tool-note{margin:0}
html[data-theme] #playground .lab-footnote{gap:0 10px}
html[data-theme] #contact .contact-companion p{padding:0}
@media(max-width:600px){html[data-theme] #portfolio .work-further .conversion-link{font-size:10px;padding:4px 0;line-height:1.4;min-height:30px}html[data-theme] #portfolio .work-further{gap:0 8px}}
@media(max-width:600px) and (max-height:700px){
 html[data-theme] #playground .dev-run-feature{grid-template-columns:1fr 1.1fr}
 html[data-theme] #playground .dev-run-invite strong{font-size:15px;line-height:1.2}
 html[data-theme] #playground .dev-run-invite>.quest-kicker{font-size:9px;line-height:1.2}
 html[data-theme] #playground .dev-run-invite>span:not(.quest-action):not(.quest-kicker){font-size:11px;line-height:1.3}
 html[data-theme] #playground .lab-footnote{font-size:10px}
 html[data-theme] #contact .contact-invite .site-character{display:none}
 html[data-theme] #contact .contact-invite-copy{width:100%;text-align:center}
 html[data-theme] #contact .contact-invite h3{font-size:21px;line-height:1.2;margin-bottom:5px}
 html[data-theme] #contact .contact-invite p{font-size:11px;line-height:1.35;margin:0}
 html[data-theme] #contact .contact-status-row{display:grid;gap:0}
 html[data-theme] #contact .contact-companion{gap:0}
 html[data-theme] #contact .contact-next-step{line-height:1.2!important}
 html[data-theme] #contact .contact-companion .quiet-link{padding:4px;font-size:10px;min-height:32px}
}
html[data-theme] #portfolio .work-further a{margin:0}
html[data-theme] #contact .contact-companion{flex-direction:row}
@media(max-width:600px) and (max-height:650px){
 html[data-theme] #contact .contact-companion button{padding:4px;min-height:44px;gap:4px}
 html[data-theme] #contact .contact-status-row{display:flex;flex-wrap:wrap;justify-content:center}
 html[data-theme] #contact .availability{flex:none}
 html[data-theme] #contact .availability summary{min-height:32px;font-size:11px}
 html[data-theme] #contact .contact-next-step{font-size:11px!important;line-height:1.35!important}
 html[data-theme] #contact>h2{font-size:20px;padding:7px 12px;margin:0}
}
.quest-controls{display:none}
@media(max-width:700px) and (max-height:760px){
 html[data-quest-deck=true] #playground .side-quests{display:block;max-width:440px}
 html[data-quest-deck=true] #playground .quest-card{width:100%;min-height:190px;padding:18px!important;gap:12px}
 html[data-quest-deck=true] #playground .quest-card[hidden]{display:none!important}
 html[data-quest-deck=true] #playground .quest-card strong{font-size:22px}
 html[data-quest-deck=true] #playground .quest-card>span:not(.quest-kicker):not(.quest-action){font-size:14px}
 html[data-quest-deck=true] #playground .dev-run-feature{grid-template-columns:1fr 1.1fr}
 html[data-quest-deck=true] #playground .dev-run-invite strong{font-size:19px}
 html[data-quest-deck=true] #playground .dev-run-key-art img{max-height:170px}
 html[data-quest-deck=true] #playground .quest-controls{display:flex;width:100%;max-width:440px;gap:10px;justify-content:space-between;align-items:center}
 .quest-controls button{width:44px;min-height:44px;border:1px solid var(--edge);background:var(--surface-gradient);color:var(--ink);border-radius:12px;font-size:20px;cursor:pointer}
 .quest-controls span{font:12px/1.4 var(--font-body)}
}
@media(max-width:600px) and (max-height:650px){html[data-theme] main>#contact{padding-block:6px!important;gap:4px}}
@media(max-width:600px) and (max-height:650px){html[data-theme] main>section#contact,html[data-theme] main>section#playground{padding-block:4px!important;gap:4px}}
@media(min-width:800px) and (max-height:650px){html[data-theme] #about .entry-world-room{grid-template-rows:42px 220px}}
@media(max-width:600px) and (max-height:650px){
 html[data-theme] #portfolio .project-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}
 html[data-theme] #portfolio .project-actions .project-action{min-width:0;white-space:normal;justify-content:center;text-align:center;letter-spacing:0;line-height:1.3;min-height:44px}
 html[data-theme] #portfolio .project-actions .project-action:only-child{grid-column:1/-1;justify-self:start}
 html[data-theme] #portfolio .project-actions .social-mark{width:24px;height:24px;flex:0 0 24px;padding:3px;margin:0}
 html[data-theme] #portfolio .project-media,html[data-theme] #project-devrun .project-media{height:44px}
}
html.showcase-ready .deck-core{min-height:var(--deck-height,0px)}
html[data-concept=c] .deck-core>.project-panel:not(.deck-measure){min-height:var(--deck-height,0px)!important}
html[data-concept=c] .deck-core>.deck-measure{min-height:0!important}
html[data-concept=c] .deck-preview{top:calc(50% - 27px)}
@media(max-width:799px){html[data-theme] #about .entry-dude-link{height:clamp(80px,calc(35svh - 88px),215px)}}
@media(max-width:600px) and (max-height:650px){html[data-theme] #about .entry-dude-link{height:80px}html[data-theme] #contact .signal-mail strong{font-size:16px;white-space:nowrap}}
@media(min-width:800px) and (max-height:760px){html[data-theme] main>section#portfolio{padding-block:10px!important}}
@media(min-width:800px) and (max-height:650px){html[data-theme] main>section#contact{padding-block:6px!important}}
@media(max-width:700px) and (max-height:760px){html[data-theme] #experience #about-picture{max-height:120px}}
@media(max-width:600px) and (max-height:650px){html[data-quest-deck=true] #playground .quest-card{min-height:180px;padding:12px!important}html[data-quest-deck=true] #playground .dev-run-feature{grid-template-columns:.6fr 1.4fr}}
@media(max-width:700px) and (max-height:760px){html[data-theme] main>section#experience{padding-block:5px!important}html[data-theme] #experience .site-character{--character-size:60px}}
html[data-concept=c].showcase-ready .deck-preview{top:calc((100% - 54px - 220px)/2);height:220px;translate:none!important}
/* Pass 35.2: retain the authored deck; one compact selector replaces the wide rail. */
.project-rail{display:none!important}
.deck-picker{display:block;flex:1;width:100%;max-width:310px}
.deck-controls p{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
.deck-controls{gap:12px}
@media(min-width:1100px) and (min-height:680px){.deck-controls{justify-content:center;gap:24px}.deck-controls button{min-width:100px}}
/* Keep the original night materials while matching the same mobile spacing budget. */
@media(max-width:600px){
 html[data-theme] #portfolio .visual-topline{font-size:9px;line-height:1.25;margin:2px 0 5px}
 html[data-theme] #portfolio .media-caption{font-size:9px;line-height:1.3;margin:4px 0 0}
}
@media(max-width:600px) and (max-height:650px){
 html[data-theme] #portfolio .visual-topline,html[data-theme] #portfolio .media-caption{font-size:8px;line-height:1.25;margin:2px 0}
 html[data-theme] #portfolio .project-category{margin-top:3px}
 html[data-theme] #portfolio .project-details h3{margin:4px 0}
}

/* Pass 38.1: native input plus one settled transition. Browser snap must not
   race the adjacent-section settle or pull a small gesture backward first. */
html[data-scroll-engine=ready]:has(#portfolio){scroll-snap-type:none!important;scroll-padding-top:var(--header-height,72px);overflow-anchor:auto}
html[data-theme] main>section[data-section-fit=fit]{scroll-snap-align:start!important;scroll-snap-stop:always}
html[data-theme] main>section[data-section-fit=tall]{scroll-snap-align:none!important;scroll-snap-stop:normal}
@media(prefers-reduced-motion:reduce){html[data-scroll-engine=ready]:has(#portfolio){scroll-snap-type:none!important}}
html[data-motion=reduce][data-scroll-engine=ready]:has(#portfolio){scroll-snap-type:none!important}
/* Keep the portrait, title and copy on one balanced laptop composition. */
@media(min-width:701px) and (max-width:1440px){
 html[data-theme] #experience .about-room{grid-template-columns:minmax(200px,.72fr) minmax(0,1.28fr);max-width:1040px;gap:clamp(24px,4vw,52px);align-items:center}
 html[data-theme] #experience .about-portrait{max-width:330px;justify-self:center;width:100%;position:relative;padding-bottom:38px}
 html[data-theme] #experience #about-picture{max-height:320px;aspect-ratio:3/2}
 html[data-theme] #experience #about-picture img{width:100%;height:100%;object-fit:cover}
 html[data-theme] #experience .character-about{--character-size:100px;width:100px;height:100px;position:absolute;right:0;bottom:-18px;margin:0}
 html[data-theme] #experience .about-one{max-width:36em}
 html[data-theme] #experience>h2{align-self:center}
}
/* Labels have a reserved lane below each staggered object, including short phones. */
@media(max-width:799px){
 html[data-entry-ready=true] #about .entry-stage{height:222px;min-height:222px}
 html[data-entry-ready=true] #about .entry-mode .entry-dock{grid-template-columns:repeat(3,56px);gap:46px 24px;translate:0 -20px}
 html[data-theme] #about .entry-object{width:56px!important;height:56px!important;min-width:0;padding:12px!important}
 html[data-theme] #about .entry-object .object-label{font-size:11px;line-height:1.35;top:calc(100% + 7px);opacity:1;white-space:nowrap}
 html[data-theme] #about .entry-switcher{margin:4px 0 6px;gap:4px;min-height:44px}
 html[data-theme] #about .entry-switcher button{min-width:44px;min-height:44px}
 html[data-theme] #about .entry-profession{max-width:29em;text-wrap:balance;padding-inline:6px}
 html[data-theme] #about .entry-career{gap:4px 16px;flex-wrap:wrap;justify-content:center}
 html[data-theme] #about .entry-career .conversion-link{min-height:44px}
 html[data-theme] #about .identity-whisper{min-height:44px}
 html[data-theme] #about .entry-world-room{gap:4px}
}
@media(max-width:600px) and (max-height:700px){
 html[data-theme] #about .entry-dude-link{height:76px;width:150px}
 html[data-entry-ready=true] #about .entry-stage{height:200px;min-height:200px}
 html[data-entry-ready=true] #about .entry-mode .entry-dock{grid-template-columns:repeat(3,48px);gap:42px 24px;translate:0 -20px}
 html[data-theme] #about .entry-object{width:48px!important;height:48px!important;min-width:0;padding:9px!important}
 html[data-theme] #about .entry-tools .entry-object{width:48px!important;height:48px!important}
 html[data-theme] #about .entry-switcher{margin-block:0}
}

@media(min-width:800px) and (max-height:450px){
 html[data-entry-ready=true] #about .entry-stage{height:265px}
 html[data-theme] #about .entry-world-room{grid-template-rows:45px 265px}
 html[data-theme] #about .entry-switcher{margin-top:12px!important}
}

/* Pass 38.1B: one controller owns eligible sectional motion. No browser snap race. */
html[data-section-input=controlled],html[data-section-input=controlled] body{scroll-behavior:auto!important;scroll-snap-type:none!important;overflow-anchor:none;overscroll-behavior-y:none}
html[data-section-input=controlled][data-scroll-engine=ready] main>section{scroll-snap-align:none!important;scroll-snap-stop:normal}