.showreel-page{--reel-header:72px;padding-top:var(--reel-header)}
.showreel-page .reel-header{height:var(--reel-header);position:fixed;inset:0 0 auto;z-index:50}
.reel-header nav{gap:25px;margin-right:3vw}.reel-header nav a{white-space:nowrap}
.showreel-page .reel-contact-form{padding-top:38px}
.showreel-page .reel-contact-form>.section-label{margin-bottom:40px}
.showreel-page .reel-contact-form .contact-grid{padding-top:15px}
.reel-controls{position:absolute;bottom:0;left:0;width:100%;z-index:30;padding:12px var(--g) 15px;background:var(--paper);border-top:1px solid var(--line);display:flex;align-items:center;gap:28px;color:var(--ink)}
.reel-progress{height:2px;position:absolute;left:0;right:0;top:-1px;background:var(--line)}.reel-progress i{display:block;height:100%;background:var(--red);transform-origin:left;transform:scaleX(0)}
.reel-chapters{display:flex;gap:3px}.reel-chapters button{font-size:14px;line-height:1;min-width:36px;min-height:36px;border:1px solid transparent;padding:0 6px}.reel-chapters button[aria-current=step]{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.reel-status{font-size:14px;line-height:1.4;min-width:0;margin:0 auto 0 0}.reel-motion-toggle{font-size:14px;line-height:1.4;text-align:right;padding:5px 0;min-height:36px}
#case-archive{width:calc(100vw - 40px);max-width:1480px;max-height:94dvh;height:94dvh;margin:auto;padding:0;overflow:auto;overscroll-behavior:contain}
.archive-toolbar{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:25px;background:var(--paper);color:var(--ink);padding:20px clamp(22px,4vw,60px);border-bottom:1px solid var(--line);z-index:4}
.archive-toolbar span{font-size:14px}.archive-toolbar h2{font-size:clamp(28px,3vw,42px);margin:5px 0 0;line-height:1}.archive-toolbar button{font-size:14px;line-height:1.5;min-height:44px;padding:8px 0;flex-shrink:0;border-bottom:1px solid var(--ink)}
.archive-content{padding:30px clamp(22px,4vw,60px) 50px}.archive-content .work-list{display:block}.archive-content .work-case{margin-bottom:32px}.archive-content .featured-case:not([open])>summary{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1fr);gap:4vw;align-items:center}.archive-content .featured-case:not([open]) .case-cover{aspect-ratio:1.7;max-height:220px}.archive-content .case-cover{max-height:340px}.archive-content .featured-case .case-summary{display:block}.archive-content .case-open{margin-top:20px}.archive-content summary{scroll-margin-top:120px}
.showreel-page #cp-detail-dialog{z-index:80}
.reel-fallback-note{padding:18px var(--g);font-size:14px;background:var(--ink);color:var(--paper)}
@media(max-width:1000px){.reel-header nav{gap:16px;font-size:14px;margin-right:15px}.reel-header .brand img{width:150px}.reel-controls{gap:18px}.reel-status{display:none}}
@media(max-width:760px){.showreel-page{--reel-header:64px}.reel-header .brand img{width:143px}.reel-header nav{display:none}.reel-header .header-contact{gap:15px}.reel-controls{padding:8px 15px 10px;gap:8px;flex-wrap:wrap}.reel-chapters{flex:1;gap:0;justify-content:space-between}.reel-chapters button{min-width:29px;min-height:32px;padding:0 3px}.reel-motion-toggle{font-size:14px;flex-basis:100%;text-align:left;min-height:25px;padding:0}.reel-status{display:none}#case-archive{width:calc(100vw - 16px);height:96dvh;max-height:96dvh}.archive-toolbar{padding:15px 18px;gap:12px;align-items:start}.archive-toolbar h2{font-size:27px;max-width:210px}.archive-toolbar>div>span{display:none}.archive-toolbar button{max-width:105px;font-size:14px;text-align:right;flex-shrink:1;padding-top:0}.archive-content{padding:20px 16px 35px}.archive-content .featured-case:not([open])>summary{grid-template-columns:1fr;gap:0}.archive-content .featured-case:not([open]) .case-cover{max-height:220px}.archive-content .case-scenes .cp-frame,.archive-content .case-scenes .story-frame{padding-left:18px;padding-right:18px}.showreel-page .reel-contact-form{padding-top:30px}}
@media(max-height:640px) and (min-width:761px){.showreel-page{--reel-header:60px}.reel-controls{padding-top:6px;padding-bottom:6px}.reel-chapters button{min-height:30px}.reel-header nav{gap:16px}}

.reel-baton{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;background:var(--red);z-index:25;pointer-events:none;opacity:0}
.reel-enabled:not(.motion-reduced) .intro-dot-slot{opacity:0}
.reel-enabled .reel-shot.is-current .turm-room-layer,.reel-enabled .reel-shot.is-current .brand-ribbon,.reel-enabled .reel-shot.is-current .dyn-bike,.reel-enabled .reel-shot.is-current .game-shutter{will-change:transform}
html:not(.reel-enabled) .reel-controls{display:none}

.reel-turm{perspective:1100px;perspective-origin:70% 50%}

.reel-game .reel-shot-header{color:var(--ink);text-shadow:none;background:var(--paper);padding:10px 13px;left:calc(var(--g) - 13px);right:calc(var(--g) - 13px);top:14px}
.motion-reduced .reel-progress{display:none}

.showreel h1[tabindex="-1"]:focus,.showreel h2[tabindex="-1"]:focus{outline:none}
.showreel-page{overflow-x:clip}.reel-enabled .reel-stage{max-width:100vw!important}