/* Display proportions: 48px content rhythm, 96px chapter separation. */
@media(min-width:761px){
 .cv08 main{width:min(1840px,calc(100% - 80px));margin-inline:auto}
 .cv08 .cv-body-panel .collection{padding:48px 3.2%;scroll-margin-top:24px}
 .cv08 .collection-heading{margin-bottom:48px;min-height:88px}
 .cv08 .cv-body-panel .personal{padding-top:48px;padding-bottom:16px}
 .cv08 .personal .collection-heading{margin-bottom:20px}
 .cv08 .cv-body-panel .ending{padding-top:16px;padding-bottom:64px}
 .cv08 .cv-body-panel{--display-height:clamp(740px,40vw,800px)}
 body.cv08 #work-projects.gallery,body.cv08 #personal-projects.gallery{height:var(--display-height);min-height:0;box-sizing:border-box}
 body.cv08 #work-projects.gallery{padding:24px 24px 32px}
 body.cv08 #work-projects.gallery .project-track{position:relative;box-sizing:border-box;height:100%;padding:24px 24px 88px;gap:12px;perspective:none}
 body.cv08 #work-projects.gallery .project{transform:none;border-color:#ffffff18;border-radius:6px}
 body.cv08 #work-projects.gallery .project.is-active{flex-grow:3.5}
 body.cv08 #work-projects.gallery .ag-caption{left:32px;right:32px;bottom:40px}
 .ag-caption strong{font-size:clamp(38px,3.1vw,62px);line-height:1.16;letter-spacing:-.035em}
 .ag-caption small{font-size:18px;line-height:1.5;margin-top:16px}
 body.cv08 #work-projects.gallery .ag-tab-label{font-size:clamp(22px,1.5vw,30px);bottom:40px}
 body.cv08 #personal-projects.gallery{grid-template-columns:minmax(360px,.38fr) minmax(0,.62fr);gap:48px;padding:24px 24px 24px 32px;align-items:center}
 .cartridge-stage{height:100%;overflow:visible}
 body.cv08 #personal-projects.gallery .project{width:clamp(320px,24vw,480px);top:54%;left:0}
 .cartridge-summary{margin:0 0 32px 80px}
 .cartridge-summary h3{font-size:clamp(46px,3.75vw,74px);line-height:1.17;margin:0 0 24px;text-wrap:balance}
 .cartridge-description{font-size:clamp(20px,1.2vw,24px);line-height:1.75;max-width:440px;min-height:0}
 .cartridge-index{padding-left:28px;max-width:none;gap:4px}
 .cartridge-index button{font-size:clamp(25px,1.8vw,36px);height:56px;padding:8px 0}
 .line-label small{display:inline-block;width:34px;margin-right:18px;font-size:.58em}
 .cartridge-index button .line-label{transform:translateX(calc(var(--effect,0)*8px))}
 .cartridge-index button i.line-marker{left:-38px;width:24px}
 .cartridge-index button:not(:last-child):after{left:-38px;width:10px}
 .cartridge-footnote{margin:28px 0 0 80px;font-size:17px;gap:16px}
 .cartridge-footnote .cartridge-pause{font-size:14px}
}
body.cv08 #work-projects.gallery:before{display:none}
.work-screen-hint{display:none}
#work-projects.gallery .work-screen-hint{display:block;position:absolute;z-index:4;bottom:26px;left:24px;right:24px;text-align:center;margin:0;font:500 clamp(16px,1.1vw,21px)/1.5 MiSans,sans-serif;color:#a8b4b4;pointer-events:none;letter-spacing:.03em}
.work-pixels{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:.2;mix-blend-mode:screen}
#work-projects.list .work-pixels{display:none}
.cartridge-foil{position:absolute;inset:0;z-index:4;pointer-events:none;mask:url('assets/cartridge/label-mask.svg') center/100% 100% no-repeat;opacity:var(--label-foil,0);transition:opacity 420ms ease;overflow:hidden;mix-blend-mode:color-dodge}
.cartridge-foil:before,.cartridge-foil:after{content:'';position:absolute;inset:0}
.cartridge-foil:before{background-image:repeating-linear-gradient(0deg,#ff8390 5%,#ffd685 10%,#bcf798 15%,#84e2e2 20%,#a79cfa 25%,#eb9fde 30%,#ff8390 35%),repeating-linear-gradient(-45deg,#0e152e 0%,#8bacae 3.8%,#8dc7c7 4.5%,#8bacae 5.2%,#0e152e 10%,#0e152e 12%),radial-gradient(farthest-corner at var(--label-x,50%) var(--label-y,50%),#0001,#0008);background-size:500% 500%,300% 300%,200% 200%;background-position:0 var(--label-y,50%),var(--label-x,50%) var(--label-y,50%),center;background-blend-mode:color,hard-light,normal;filter:brightness(.8) contrast(1.4) saturate(.55)}
.cartridge-foil:after{background:radial-gradient(ellipse at var(--label-x,50%) var(--label-y,50%),#d8eaff90 0%,#aad5ff20 32%,transparent 62%);mix-blend-mode:overlay}
.hero-screen-glow{transition:opacity 650ms ease;mix-blend-mode:screen}
.hero.screen-hover .hero-screen-glow{opacity:.38}
.hero-screen-reflection{position:absolute;inset:0;z-index:1;pointer-events:none;clip-path:polygon(12.87% 12.41%,87.4% 12.41%,90.74% 87.06%,9.63% 87.06%);background:radial-gradient(ellipse 46% 65% at var(--glass-x,65%) var(--glass-y,30%),#c3e9ff25,#86ceff0a 52%,transparent 80%);opacity:0;transition:opacity 650ms ease;mix-blend-mode:screen}
.hero.screen-hover .hero-screen-reflection{opacity:1}
.hero-screen-hit{position:absolute;inset:12.41% 9.26% 12.94% 9.63%;z-index:3;background:transparent;border:0;box-shadow:none;border-radius:0;clip-path:polygon(4% 0,96% 0,100% 100%,0 100%);color:transparent}
.hero-screen-hit:focus,.hero-screen-hit:focus-visible{outline:none}
.portrait-reaction{display:none}
/* Dark receiver surface prevents the old pale sheet from flashing on entry. */
body.cv08 .reader-sheet{background:#101413;box-shadow:0 18px 50px #0005}
body.cv08 .reader-backdrop{animation:none}
.reader.pixel-reveal .reader-sheet{transform:none;filter:none;transition:none}
.reader-pixel-media{visibility:hidden}
.reader-pixel-media.is-visible{visibility:visible}
.reader-pixel-grid{position:absolute;z-index:2;inset:0 0 auto;width:100%;pointer-events:none}
.reader.pixel-closing .reader-scroll{pointer-events:none;overflow:hidden}
.project-click-sweep{position:absolute;inset:0;z-index:12;display:block;overflow:hidden;pointer-events:none;border-radius:inherit;mask-size:100% 100%;mask-position:center;mask-repeat:no-repeat}
.project-click-sweep>i{position:absolute;display:block;top:-20%;left:-55%;width:45%;height:140%;background:linear-gradient(90deg,transparent,#ebfff22e 20%,#ffffffb3 50%,#ebfff22e 80%,transparent);mix-blend-mode:screen;pointer-events:none}
.reader-soft-status{position:absolute;z-index:3;inset:48px 0 auto;text-align:center;font:500 16px MiSans,sans-serif;color:#aab5af;pointer-events:none;transition:opacity 180ms}
.reader-soft-status.is-complete{opacity:0}
@media(prefers-reduced-motion:reduce){.reader-pixel-grid{display:none}}
@media(min-width:761px) and (max-width:1400px){
 .cv08 main{width:calc(100% - 48px)}
 body.cv08 #personal-projects.gallery{grid-template-columns:340px minmax(0,1fr);gap:24px;padding-inline:16px}
 .cartridge-summary,.cartridge-footnote{margin-left:52px}
 .cartridge-summary h3{font-size:48px}
 .cartridge-index{padding-left:16px}
 .line-label small{width:26px;margin-right:10px}
 .cartridge-index button{font-size:27px}
 body.cv08 #personal-projects.gallery .project{width:clamp(300px,26vw,365px);top:54%}
}
@media(prefers-reduced-motion:reduce){.cartridge-foil,.hero-screen-glow,.hero-screen-reflection,.reader-soft-media{transition:none}.work-pixels{display:none}}

@media(min-width:761px){.cv08 .intro{max-width:calc((100svh - 230px)*1.8881);margin-inline:auto}}

/* The indicator shares the centre of the lower monitor bezel. */
body.cv08 #work-projects.gallery{--bottom-bezel:48px;padding-bottom:var(--bottom-bezel)}
body.cv08 #work-projects.gallery::after{left:50%;bottom:calc(var(--bottom-bezel)/2);transform:translate(-50%,50%)}
body.cv08 .reader-toolbar .reader-back{min-width:44px;height:44px;padding:4px 8px;gap:8px;border:0;border-radius:0;background:none;box-shadow:none;color:#edf1e6;font-size:20px;font-weight:650;transition:color 150ms ease}
body.cv08 .reader-toolbar .reader-back:hover{background:none;border:0;color:#d6f75c;box-shadow:none}
body.cv08 .reader-toolbar .reader-back svg{width:22px;height:22px}
body.cv08 .ending-indicator{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);margin:0}


.cartridge-index button .line-label{width:max-content;max-width:100%;user-select:none}
