/* A quieter stage leaves room for the moving collection rail. */
.site-header{height:80px}
#main{height:calc(100dvh - 296px)}
.theatre .showcase{--stage-width:min(48vw,calc((100dvh - 400px)*1.77778));left:calc(50% - var(--stage-width)/2);width:var(--stage-width);height:calc(var(--stage-width)*.5625 + 76px);top:calc(50% - var(--stage-width)*.28125 - 38px);max-height:none;border-radius:7px;border-color:#e2e8df65;box-shadow:inset 0 1px #ffffffe0,0 20px 65px #020b1270,0 0 38px #cadfe00b}
.project-visual{inset:0 0 76px;border-radius:6px 6px 0 0}.project-caption{height:76px;padding:0 21px}.project-caption h2{font-size:clamp(21px,2vw,30px);letter-spacing:-.8px}.project-caption p{font-size:10px;margin-top:6px}.project-caption .primary-button{padding:0 15px;min-height:36px;font-size:10px;gap:13px}
.theatre .wing{width:13.5%;height:72%;top:14%;gap:18px;flex-direction:column}.theatre .left-wing{left:7%;transform:rotateY(22deg)}.theatre .right-wing{right:7%;transform:rotateY(-22deg)}.wing .wing-card{width:100%;height:42%;max-height:180px;border-radius:5px}.wing.single .wing-card{height:57%;max-height:220px}.wing-label{left:10px;right:10px;bottom:10px}.wing-label strong{font-size:11px}.collection-portal{height:57%;padding:17px;border-radius:5px}.collection-portal strong{font-size:19px}.stage-reflection{top:85%;opacity:.5}
.project-nav{top:calc((100dvh - 136px)/2);bottom:auto;left:23%;right:23%;height:32px}.project-nav>.circle-button{height:31px;width:31px;border:0;background:transparent;color:#bbccd1;opacity:.7}.project-nav>.circle-button:hover{opacity:1;background:#d1e5ed12}
.site-footer{height:216px;padding:0 3vw;position:relative;justify-content:flex-start}.collection-navigation{position:relative;width:min(1050px,100%);height:185px;margin:0 auto;flex-shrink:0}.categories{--rail-step:clamp(116px,13.5vw,175px);--drag-x:0px;position:absolute;inset:0 42px;width:auto;max-width:none;height:185px;margin:0;border:0;background:none;display:block;touch-action:pan-y;user-select:none;perspective:950px}.collection-rail{position:absolute;inset:20px 0 0;width:100%;height:130px;overflow:visible;pointer-events:none}.collection-rail path{fill:none;stroke:#d8e5e23b;stroke-width:.8}.collection-rail path+path{stroke:#f1cd8c12;stroke-width:3}
.categories .collection-tile{position:absolute;left:50%;top:10px;width:146px;height:145px;padding:0;display:flex;flex-direction:column;gap:0;justify-content:flex-start;align-items:center;border:0;background:none;transform:translateX(calc(-50% + var(--rail-x)*var(--rail-step) + var(--drag-x))) translateY(var(--rail-y)) rotate(var(--rail-angle)) scale(var(--rail-scale));transform-origin:50% 75%;transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .55s,color .3s;will-change:transform}
.collection-art{position:relative;display:block;width:138px;height:87px;overflow:hidden;border-radius:5px;border:1px solid #d4e8ef60;background:#0c1e2870;box-shadow:inset 0 1px #ffffff8c,0 12px 25px #020b1260;transition:border-color .3s,box-shadow .3s;isolation:isolate}.collection-art:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,#ffffff25,transparent 45%,#08131d33);box-shadow:inset 0 1px #ffffff70;pointer-events:none}.collection-art>img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.8);transition:filter .3s,transform .6s}.collection-icon{display:grid;place-items:center;position:absolute;bottom:7px;left:8px;width:29px;height:29px;border-radius:5px;background:#091c24ba;backdrop-filter:blur(15px);border:1px solid #e2edf638;color:#e7e8df}.collection-icon svg{width:19px;height:19px}.collection-label{font-size:11px;font-weight:500;color:#cfdbdd;white-space:nowrap;margin-top:11px}.collection-meta{font:8px Plex;color:#8ca3aa;margin-top:5px}.collection-tile[aria-current=true] .collection-art{border-color:#eed8a3bb;box-shadow:inset 0 1px #fff,0 15px 35px #020b1280,0 0 20px #e7c38314}.collection-tile[aria-current=true] .collection-art>img,.collection-tile:hover .collection-art>img{filter:saturate(1) brightness(1)}.collection-tile:hover .collection-art>img{transform:scale(1.05)}.collection-tile[aria-current=true] .collection-label{color:#f0d7a7}.categories button:before,.categories button:after{display:none}.rail-arrow{position:absolute;top:65px;width:32px;height:42px;padding:0;font-size:26px;font-weight:300;color:#a8bec5;border:0;background:none;z-index:8}.rail-arrow:hover{color:#f0d7a7}.rail-prev{left:0}.rail-next{right:0}.footer-bottom{height:31px;align-items:center}.footer-bottom .explore-hint{display:block;margin:auto;font:9px Manrope;color:#8da5ad;letter-spacing:.04em}.footer-bottom button{position:absolute;right:4vw;bottom:12px}
/* The identity belongs to the page; it is not a reactive tile. */
.brand,.brand:hover,.brand:active{background:transparent;border:0;box-shadow:none;filter:none;color:var(--ink);transform:none;transition:none}.brand .brand-symbol,.brand:hover .brand-symbol{filter:none;box-shadow:none;background:transparent;mix-blend-mode:normal}.brand:focus-visible{outline:1px solid #c7d8de80;outline-offset:5px;border-radius:0}
/* Clear glass, narrow bevels and tighter corners throughout the information layer. */
.project-dialog::backdrop,.info-dialog::backdrop{background:#020d1647;backdrop-filter:blur(10px) saturate(1.15)}
.detail-shell,.info-dialog{border-radius:7px;border:1px solid #dfedf075;background:linear-gradient(125deg,#d9efff20 0%,#24424d66 28%,#0b2029bd 68%,#bedce51a);backdrop-filter:blur(38px) saturate(1.25);box-shadow:inset 0 1px 0 #ffffffc0,inset 1px 0 0 #e5f7ff37,inset 0 -1px 0 #bfdde337,0 30px 85px #020a13a0,0 8px 26px #020e1e60}
.detail-header{background:linear-gradient(110deg,#e0f5ff0b,transparent);border-color:#def1f02b}.case-copy{background:linear-gradient(125deg,#112a3670,#0a202987)}.case-media-column{background:#09212c22;border-color:#e3f5f128}.case-media>video,.case-media>img{border-radius:3px}.case-tabs{border-color:#d7ebed33}.case-text p{color:#d0dde1}.case-title>p,.case-media-note{color:#adc3cc}.case-actions{border-color:#ddedf12c}.case-media-nav button{border-radius:4px;background:#cedee90a}.case-pager button{border-radius:4px}.case-actions .primary-button{border-radius:5px;background:#cfdfeb0c}.interactive-exhibit{background:linear-gradient(130deg,#b8deef0c,#061d2b55)}.utterance,.permission-card,.flow-node,.compare-result{border-radius:5px}.case-copy,.case-media-column{min-width:0}
.info-dialog:has(.about-profile){width:min(900px,92vw);max-width:900px;padding:35px 42px}.about-heading{display:flex;align-items:center;gap:26px;padding-right:25px}.about-heading .studio-logo{width:130px;height:130px;margin:0;flex-shrink:0}.about-heading h2{font-size:36px;line-height:1.18;margin:0 0 10px;letter-spacing:-1.2px}.about-heading .about-intro{font-size:14px;color:#d6e5e9;line-height:1.65;max-width:40ch}.about-tabs{display:flex;gap:30px;margin:25px 0 22px;border-bottom:1px solid #d1e7ef33}.about-tabs button{padding:0 0 13px;font-size:12px;color:#acbec8;border-bottom:1px solid transparent}.about-tabs button[aria-selected=true]{border-color:#ecd3a3;color:#ecd3a3}.about-body{min-height:245px}.info-dialog .about-body p{font-size:13px;line-height:1.85;max-width:72ch}.about-body p+p{margin-top:16px}.about-tools{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;margin-top:23px}.about-tools h3{font-size:10px;font-weight:500;color:#e5d3b4;margin:0 0 10px}.about-tools p{font-size:12px!important;line-height:1.8!important}.about-profile .about-foot{font-size:10px;color:#9eb5bf;padding-top:16px;margin-top:20px;border-top:1px solid #d1e7ef26}
@media(max-width:800px){
 .site-header{height:72px}#main{height:calc(100dvh - 252px)}.site-footer{height:180px;padding:0 2vw}.theatre .showcase{--stage-width:84vw;left:8%;width:84%;height:calc(47.25vw + 96px);top:5%;max-height:72%;border-radius:6px}.project-visual{inset:0 0 96px}.project-caption{height:96px;padding:12px 16px;flex-wrap:wrap;gap:6px}.project-caption h2{font-size:24px}.project-caption p{font-size:9px;margin-top:5px}.project-caption .primary-button{position:absolute;right:14px;bottom:11px;font-size:8px;min-height:28px;padding:0 10px}.theatre .wing{width:39%;height:18%;top:auto;bottom:4%;flex-direction:row;gap:7px;transform:none}.theatre .left-wing{left:8%}.theatre .right-wing{right:8%}.wing .wing-card{height:100%;width:calc(50% - 3.5px);border-radius:3px}.wing.single .wing-card{width:100%;height:100%}.wing-label strong{font-size:8px}.wing-label{left:6px;bottom:6px;right:4px}.collection-portal{width:100%;height:100%;padding:10px;gap:5px}.collection-portal strong{font-size:12px}.collection-portal>span:last-child{font-size:8px}.project-nav{top:auto;bottom:184px;left:1%;right:1%}.project-nav>.circle-button{width:26px;height:26px}.collection-navigation{height:154px}.categories{--rail-step:clamp(79px,19vw,125px);inset:0 18px;height:154px}.categories .collection-tile{width:96px;height:115px;top:5px}.collection-art{width:88px;height:61px;border-radius:4px}.collection-icon{width:23px;height:23px;left:5px;bottom:5px}.collection-icon svg{width:15px;height:15px}.collection-label{font-size:8px;letter-spacing:-.1px;margin-top:8px}.collection-meta{font-size:6px;margin-top:4px}.collection-rail{top:9px;height:109px}.rail-arrow{width:18px;top:47px;font-size:22px}.footer-bottom{height:26px}.footer-bottom .explore-hint{font-size:7px;margin-left:5vw}.footer-bottom button{font-size:8px;bottom:10px}.info-dialog:has(.about-profile){padding:28px 23px}.about-heading{gap:13px;padding-right:10px}.about-heading .studio-logo{width:85px;height:100px}.about-heading h2{font-size:26px;margin-bottom:6px}.about-heading .about-intro{font-size:11px;line-height:1.6}.about-tabs{gap:24px;margin:20px 0 17px}.about-tabs button{font-size:10px;padding-bottom:10px}.about-body{min-height:240px}.info-dialog .about-body p{font-size:11px;line-height:1.75}.about-tools{gap:17px 16px;margin-top:18px}.about-tools h3{font-size:9px;margin-bottom:7px}.about-tools p{font-size:10px!important}.about-profile .about-foot{font-size:9px;margin-top:16px;padding-top:13px}.case-copy{background:#08212d87}
}
@media(max-height:740px) and (max-width:800px){.theatre .showcase{top:3%;max-height:72%}.theatre .wing{height:16%;bottom:3%}}
@media(max-height:540px) and (min-width:600px){
 .site-header{height:48px}#main{height:calc(100dvh - 158px)}.site-footer{height:110px}.theatre .showcase{--stage-width:min(43vw,calc((100dvh - 212px)*1.77778));left:calc(50% - var(--stage-width)/2);width:var(--stage-width);height:calc(var(--stage-width)*.5625 + 48px);top:calc(50% - var(--stage-width)*.28125 - 24px);max-height:none}.project-visual{inset:0 0 48px}.project-caption{height:48px;padding:0 13px;flex-wrap:nowrap}.project-caption h2{font-size:17px}.project-caption p{display:none}.project-caption .primary-button{position:static;min-height:26px}.theatre .wing{width:13%;height:78%;top:11%;bottom:auto;flex-direction:column;gap:10px}.theatre .left-wing{left:9%}.theatre .right-wing{right:9%}.wing .wing-card{width:100%;height:43%}.wing.single .wing-card{height:64%}.project-nav{top:calc((100dvh - 62px)/2);bottom:auto;left:24%;right:24%}.collection-navigation,.categories{height:88px}.categories{--rail-step:125px;inset:0 55px}.categories .collection-tile{top:-11px;width:105px;height:88px}.collection-art{width:94px;height:51px}.collection-icon{width:21px;height:21px;bottom:4px;left:4px}.collection-label{font-size:8px;margin-top:6px}.collection-meta{display:none}.collection-rail{top:0;height:68px}.rail-arrow{top:13px}.footer-bottom{height:22px}.footer-bottom button{bottom:8px}.footer-bottom .explore-hint{font-size:7px}.info-dialog:has(.about-profile){padding:20px 30px;max-height:95dvh}.about-heading .studio-logo{width:80px;height:70px}.about-heading h2{font-size:24px}.about-heading .about-intro{font-size:11px;max-width:none}.about-tabs{margin:13px 0;gap:25px}.about-tabs button{font-size:10px;padding-bottom:8px}.about-body{min-height:135px}.info-dialog .about-body p{font-size:10px;line-height:1.6}.about-body p+p{margin-top:10px}.about-tools{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:13px}.about-tools p{font-size:9px!important;line-height:1.5!important}.about-tools h3{font-size:8px}.about-profile .about-foot{display:none}
}
.motion-off .collection-tile{transition:none}.motion-off .collection-art>img{transition:none}
.credentials{display:grid;gap:22px}.credential{display:grid;grid-template-columns:120px 1fr;gap:22px;align-items:center;padding:0 0 20px;border-bottom:1px solid #d1e7ef24}.credential:last-child{border:0;padding-bottom:0}.credential>img{width:120px;height:93px;object-fit:contain;background:#f7f8f5;border-radius:2px}.credential small{font-size:10px;color:#b8ccd4}.credential h3{font-size:15px;font-weight:500;line-height:1.5;margin:6px 0}.info-dialog .credential p{font-size:11px;line-height:1.6}.credential a{display:inline-block;font-size:10px;color:#e8d1a7;text-decoration:underline;text-underline-offset:4px;margin:11px 17px 0 0}
@media(max-width:800px){.about-tabs{gap:0;justify-content:space-between}.credentials{gap:18px}.credential{grid-template-columns:74px 1fr;gap:14px;padding-bottom:16px}.credential>img{width:74px;height:65px}.credential small{font-size:8px}.credential h3{font-size:11px;margin:5px 0}.info-dialog .credential p{font-size:9px}.credential a{font-size:9px;margin-top:9px;margin-right:12px}.about-body{min-height:240px}}
@media(max-height:540px) and (min-width:600px){.credentials{grid-template-columns:1fr 1fr;gap:22px}.credential{grid-template-columns:80px 1fr;gap:12px;border:0;padding:0}.credential>img{width:80px;height:70px}.credential h3{font-size:11px}.credential small,.info-dialog .credential p{font-size:8px}.credential a{font-size:9px;margin-top:7px}.about-body{min-height:135px}}
.wing .collection-portal{padding:0;display:block;overflow:hidden}.collection-portal .wing-label{position:absolute}.collection-portal .wing-label strong{font-size:11px}.collection-portal img{width:100%;height:100%;object-fit:cover}
@media(max-width:800px){.collection-portal .wing-label strong{font-size:8px}}
/* Media audio stays an explicit, visible choice. */
.media-controls #sound-button{width:auto;min-width:70px;padding:0 9px;font-size:10px;letter-spacing:.02em}
.media-controls #sound-button[aria-pressed=true]{color:#f1d3a5}
.case-sound{align-self:flex-start;margin:0 24px 10px;font-size:11px;color:#d8c49f}
.case-media-nav button{border-radius:5px}
.index-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:800px){.index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.case-sound{margin:0 14px 5px;font-size:10px}.case-media-note{font-size:9px;line-height:1.4;padding-bottom:8px}.case-media-nav{gap:5px;padding-bottom:8px}.case-media-nav button{padding:5px 7px}}
@media(max-width:800px) and (min-height:500px){.case-layout[data-kind=film]:not(.cinema){grid-template-rows:40% minmax(0,1fr)}}

/* Portrait and expanded film collection. */
.about-heading .about-portrait{width:145px;height:145px;object-fit:contain;flex-shrink:0;align-self:end;mask-image:linear-gradient(#000 88%,transparent)}
.theatre .wing.dense .wing-card{height:calc((100% - 36px)/3);max-height:145px}
.index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:800px){.about-heading .about-portrait{width:90px;height:105px}.theatre .wing.dense .wing-card{height:100%;width:calc((100% - 14px)/3)}.wing.dense .wing-label{left:4px;right:3px}.wing.dense .wing-label strong{font-size:7px;line-height:1.25}}
@media(max-height:540px) and (min-width:600px){.about-heading .about-portrait{width:80px;height:75px}.theatre .wing.dense .wing-card{width:100%;height:calc((100% - 20px)/3)}}

/* Four unique collections follow one continuous shallow arc. */
.categories{--rail-step:clamp(130px,15vw,190px)}
.categories .collection-tile{transform-origin:50% 42%;transition:color .3s;will-change:transform,opacity}
.collection-rail{top:14px;height:130px}
.collection-rail path{stroke:#d8e5e254;stroke-width:1}
.collection-rail path+path{stroke:#e8c88e12;stroke-width:4}
.brand-copy{display:flex;flex-direction:column;align-items:flex-start;gap:7px;text-align:left}
.brand-strapline{font-size:11px;line-height:1.35;font-weight:400;letter-spacing:.12px;color:#a9bdc5;white-space:normal}
@media(max-width:800px){.categories{--rail-step:clamp(79px,20vw,135px)}.collection-rail{top:13px;height:109px}.brand-copy{gap:5px;max-width:205px}.brand-strapline{font-size:8px;letter-spacing:0;max-width:29ch}.brand-wordmark{flex-direction:row;gap:4px}.brand .brand-wordmark b{font-size:inherit;text-transform:none;letter-spacing:inherit}.brand{font-size:16px}.site-header{padding-left:4vw;padding-right:4vw}.site-header nav{gap:9px}}
@media(max-width:430px){.brand{font-size:14px;gap:5px}.brand-symbol{width:42px;height:49px}.brand-strapline{font-size:8px;max-width:29ch}.brand-copy{max-width:176px}.site-header nav #index-button{font-size:8px}}
@media(max-height:540px) and (min-width:600px){.brand-strapline{font-size:8px;max-width:none}.brand-copy{gap:3px}.collection-rail{top:0;height:68px}.categories{--rail-step:125px}.categories .collection-tile{top:-19px}}

/* Continuous, shallow collection rail. */
.categories .collection-art{transition:border-color .35s,box-shadow .35s;}
.categories .collection-tile:hover .collection-art{transform:none;}
.project-nav .circle-button:disabled{visibility:hidden;}
@media(max-width:800px){.categories .collection-tile{width:72px}.categories .collection-art{width:67px;height:48px}.categories .collection-label{font-size:7px}.categories .collection-meta{font-size:6px}.categories .collection-icon{width:19px;height:19px;left:4px;bottom:4px}.categories .collection-icon svg{width:13px;height:13px}}

.case-overview-link a{color:#e6c18d;text-decoration:underline;text-decoration-color:#e6c18d70;text-underline-offset:4px}.case-overview-link a:hover{text-decoration-color:currentColor}

/* Independent arrival transforms keep the authored orbit angles intact. */
.wing .wing-card{scale:var(--arrival-scale,1);translate:var(--arrival-x,0px) var(--arrival-y,0px) var(--arrival-z,0px);rotate:y var(--arrival-turn,0deg);opacity:var(--arrival-opacity,1);filter:blur(var(--arrival-blur,0px)) brightness(.88) saturate(.9)}
.wing .wing-card:hover,.wing .wing-card:focus-visible{filter:blur(var(--arrival-blur,0px)) brightness(1)}
.revealing .showcase,.revealing .wing-card{will-change:transform,opacity,filter}
.revealing .wing-card{transition:none}
/* Mindy's character stands on the page, free of a screenshot frame. */
.theatre .showcase.character-stage{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;overflow:visible}
.character-stage .glass-edge,.character-stage .project-type,.character-stage #pause-button{display:none}
.character-stage .project-visual{background:transparent;overflow:visible}
.character-stage .character-cutout{object-fit:contain;object-position:center bottom;width:100%;height:100%;background:transparent;filter:drop-shadow(0 16px 24px #020a1260)}
.character-stage .project-caption{border:0;background:transparent;padding-top:14px}
.wing .character-card,.wing .character-card:hover{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none}
.wing .character-card:after{display:none}
.wing .character-card img{object-fit:contain;object-position:center top;height:calc(100% - 22px);filter:drop-shadow(0 9px 12px #020a1255)}
.wing .character-card .wing-label{text-align:center;bottom:0}
/* Image previews are buttons, with a clear and keyboard-accessible enlargement action. */
.case-image-button{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0;padding:0;border:0;background:transparent;border-radius:3px;cursor:zoom-in}
.case-image-button>img{display:block;width:100%;height:100%;object-fit:contain;border-radius:3px}
.case-image-button:focus-visible{outline:2px solid #e6c18d;outline-offset:5px}
.image-expand-hint{position:absolute;right:12px;bottom:12px;padding:8px 12px;background:#07151edb;border:1px solid #e0edf04d;border-radius:3px;color:#edf1ef;font-size:10px;opacity:0;translate:0 5px;transition:opacity .2s,translate .2s;pointer-events:none;backdrop-filter:blur(12px)}
.case-image-button:hover .image-expand-hint,.case-image-button:focus-visible .image-expand-hint{opacity:1;translate:0 0}
.project-dialog.media-expanded{width:98vw;max-width:none;height:96dvh;max-height:96dvh}
.cinema .case-image-button{cursor:default}.cinema .image-expand-hint{display:none}
.cinema .voice-player,.cinema .case-media-note{display:none}
.case-layout:has(.character-media) .case-media-column{background:transparent}
.character-media .case-image-button>img{filter:drop-shadow(0 12px 22px #020a1240)}
.voice-player{flex-shrink:0;margin:0 24px 16px;padding-top:12px;border-top:1px solid #d9e6e52b;display:grid;gap:9px}
.voice-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.voice-heading label{font-size:12px;color:#e6c18d;white-space:nowrap}
.voice-heading select{max-width:65%;font:11px Manrope;color:#d4e5e9;background:#112731;border:1px solid #b9d7df38;border-radius:3px;padding:6px 26px 6px 9px}
.voice-player audio{display:block;width:100%;height:34px;color-scheme:dark}
.voice-transcript{font-size:10px;color:#a7bec8;line-height:1.55;min-height:31px}
@media(max-width:800px){
 .image-expand-hint{opacity:1;translate:0 0;font-size:8px;padding:5px 8px;bottom:5px;right:5px}
 .voice-player{margin:0 12px 8px;padding-top:6px;gap:5px}.voice-heading label{font-size:10px}.voice-heading select{font-size:9px;padding:3px 6px}.voice-player audio{height:30px}.voice-transcript{display:none}
 .case-layout:has(.voice-player){grid-template-rows:40% minmax(0,1fr)}
 .case-layout.cinema{grid-template-rows:1fr}
 .character-stage .project-caption{padding-top:8px}
}
@media(max-height:540px) and (min-width:600px){.voice-transcript{display:none}.voice-player{margin:0 12px 8px;padding-top:6px;gap:4px}.voice-player audio{height:30px}.voice-heading label{font-size:10px}.voice-heading select{font-size:9px;padding:3px 6px}.case-layout:has(.voice-player){grid-template-rows:1fr}}
@media(prefers-reduced-motion:reduce){.image-expand-hint{transition:none}}

/* Enlarged screenshots retain their full resolution and can be inspected by touch or mouse. */
.image-viewer-toolbar{flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 16px;border-top:1px solid #d9e6e52b;background:#091d2799}
.image-viewer-toolbar[hidden]{display:none}
.image-viewer-toolbar button{min-width:36px;min-height:34px;border:1px solid #c6dde635;border-radius:3px;background:#daeafa09;color:#e5edef;font:12px Manrope;cursor:pointer}
.image-viewer-toolbar button:hover{background:#daeafa18}
.image-viewer-toolbar button:disabled{opacity:.35;cursor:default}
.image-viewer-toolbar output,.viewer-position{font:11px Manrope;font-variant-numeric:tabular-nums;min-width:42px;text-align:center;color:#c3d6dd}
.viewer-divider{height:18px;border-left:1px solid #c6dde635;margin:0 6px}
.case-media.image-viewer-active{overflow:hidden;touch-action:none;user-select:none}
.image-viewer-active img{will-change:transform;pointer-events:none}
.image-viewer-active .case-image-button{cursor:zoom-in}
.image-zoomed .case-image-button{cursor:grab}
.image-zoomed .case-image-button:active{cursor:grabbing}
@media(max-width:600px){.image-viewer-toolbar{gap:6px;padding:6px}.image-viewer-toolbar button{min-width:34px}.viewer-divider{margin:0 2px}.cinema .case-media-nav{max-height:72px;overflow-y:auto}}

/* A single light reflection follows each panel as it resolves into place. */
.theatre .wing{perspective:900px}
.showcase:not(.character-stage):after,.wing-card:not(.character-card):before{content:'';position:absolute;inset:0 auto 0 0;width:34%;z-index:5;pointer-events:none;background:linear-gradient(90deg,transparent,#d5f0ff38 45%,#fff8 50%,#f8deb42b 56%,transparent);transform:translateX(var(--arrival-sweep,-120%)) skewX(-18deg);opacity:var(--arrival-glint,0);mix-blend-mode:screen}
.revealing .project-caption{will-change:transform,opacity}
/* Keep native video compositing independent of animated 3D card surfaces. */
.theatre .showcase.video-stage{transform-style:flat;rotate:none;backdrop-filter:none}
.revealing .showcase.video-stage{will-change:opacity}
.project-visual>video{position:absolute;inset:0;min-width:0;min-height:0;transform:translateZ(0);backface-visibility:hidden}
.case-media>video{flex:0 0 auto;min-width:0;min-height:0;transform:translateZ(0);backface-visibility:hidden}
.motion-off .showcase:after,.motion-off .wing-card:before{display:none}

/* Mindy's transparent canvas keeps the sea and glass visible behind her. */
.mindy-character{display:block;position:relative;width:100%;height:100%;min-height:0;isolation:isolate;overflow:visible}
.mindy-character>img,.mindy-character>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.mindy-character>canvas{opacity:0;transition:opacity .18s ease}
.mindy-character.mindy-ready>canvas{opacity:1}
.mindy-character.mindy-ready>img{opacity:0}
.wing .character-card>.mindy-character{position:absolute;inset:0 0 22px;height:calc(100% - 22px);pointer-events:none}
.wing .character-card .mindy-character>img{width:100%;height:100%;object-fit:contain}
.case-image-button>.mindy-character{flex:1;min-width:0;pointer-events:none}
.image-viewer-active .mindy-character{will-change:transform}
@media(prefers-reduced-motion:reduce){.mindy-character>canvas{transition:none}}

/* The live service stays in its own origin and owns its conversation UI. */
.case-media.live-agent-media{padding:12px;isolation:isolate}
.live-agent-frame{color-scheme:normal;position:relative;z-index:1;display:block;width:min(100%,380px);height:100%;max-height:704px;border:0;background:transparent;flex:none}
.live-agent-intro{position:absolute;top:20%;left:50%;translate:-50% 0;width:min(300px,80%);text-align:center;pointer-events:none;z-index:0}
.live-agent-badge{font:10px Plex;letter-spacing:2px;color:#e6c18d}
.live-agent-intro p{font-size:20px;line-height:1.5;margin:18px 0;color:#d6e7e7}
.live-agent-intro small{color:#91aab4;font-size:12px}
.live-agent-separate{position:absolute;top:12px;right:14px;font-size:10px;color:#b6cbd3;z-index:2}
.case-image-button>.agent-crop{max-width:100%;width:auto;max-height:100%;transform-origin:center}
@media(max-width:800px){
 .case-layout.live-agent-selected{grid-template-rows:1fr}
 .live-agent-selected .case-copy{display:none}
 .live-agent-selected .case-media-note{display:block;padding:0 12px 8px;font-size:10px}
 .live-agent-intro p{font-size:17px}
}

.case-view-switch{display:none}
.video-recovery{position:absolute;z-index:3;left:50%;top:50%;translate:-50% -50%;padding:14px 20px;border:1px solid #dabb84;border-radius:5px;background:#0a2029ed;color:#f3e2c4;font:13px Manrope;box-shadow:0 8px 30px #0006;cursor:pointer}
@media(max-width:800px){
 .case-view-switch{display:flex;height:42px;align-items:center;justify-content:center;gap:8px;border-bottom:1px solid #c6dde625;flex-shrink:0}
 .case-view-switch button{padding:7px 14px;font:11px Manrope;color:#a9c0ca;border-bottom:1px solid transparent}
 .case-view-switch button[aria-pressed=true]{color:#e6c18d;border-color:#e6c18d}
 .case-layout.has-video,.case-layout.has-video:not(.cinema){height:calc(100% - 42px);grid-template-columns:1fr;grid-template-rows:minmax(0,1fr)}
 .has-video:not(.mobile-details) .case-copy{display:none}
 .has-video.mobile-details .case-media-column{display:none}
 .has-video.mobile-details .case-copy{display:flex}
 .has-video .case-media{padding:10px;flex:1 1 0;min-height:0}
 .has-video .case-media>video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
 .has-video .case-media-nav{flex-shrink:0;justify-content:center;padding:8px 12px}
 .has-video .case-sound{flex-shrink:0;align-self:center;margin:2px 12px 12px;min-height:30px}
}

/* Native Safari video must not inherit a perspective or animated backing surface. */
.theatre.video-theatre{perspective:none;transform-style:flat}
.theatre .showcase.video-stage{transform:none!important;translate:none!important;scale:none!important;rotate:none!important;filter:none!important;opacity:1!important;will-change:auto!important;isolation:auto;transition:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.showcase.video-stage:after{display:none}
.video-stage .project-visual,.project-visual>video,.case-media>video{transform:none;translate:none;scale:none;rotate:none;filter:none;backface-visibility:visible;will-change:auto}
.project-dialog:has(video) .detail-shell{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(125deg,#263a43,#0b2029 68%,#172c35)}
.case-body{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding-right:8px}
.case-text{flex:none;display:block}
.case-section+.case-section{margin-top:26px}
.case-section h3{display:block;font-size:21px;line-height:1.3;margin:0 0 12px;color:#f0e0c3;font-weight:550}
.case-section p+p{margin-top:15px}
.case-text .stack-tags{margin-top:24px}
@media(max-width:800px){
 /* Stable viewport heights prevent the Safari toolbar resizing the video during playback. */
 #main{height:calc(100svh - 252px)}
 .project-dialog,.project-dialog.media-expanded{height:94svh;max-height:94svh}
 .theatre{perspective:none;transform-style:flat}
 .categories{overflow:hidden}
 .categories .collection-tile{width:100px;height:140px}
 .categories .collection-art{width:92px;height:64px}
 .categories .collection-label{font-size:12px;line-height:1.3;margin-top:9px;white-space:normal;text-align:center;max-width:100px;color:#dfebee}
 .categories .collection-meta{font-size:9px;line-height:1.3;margin-top:5px;color:#acc3cc}
 .categories .collection-icon{width:24px;height:24px}
 .categories .collection-icon svg{width:16px;height:16px}
 .wing-label strong{font-size:11px;line-height:1.25;text-shadow:0 1px 5px #000}
 .wing-label{background:linear-gradient(transparent,#06141ae8);left:0;right:0;bottom:0;padding:12px 5px 5px}
 .case-copy{padding:20px 18px;gap:18px}
 .case-title h2{font-size:25px}
 .case-tabs{gap:8px}
 .case-tabs button{font-size:12px;min-height:35px}
 .case-text p{font-size:14px;line-height:1.75}
 .case-section h3{display:block;font-size:21px;line-height:1.3;margin-bottom:10px}
 .case-section+.case-section{margin-top:24px}
 .case-actions .primary-button,.case-actions .text-button{font-size:11px;min-height:38px}
 .case-view-switch button{font-size:13px}
 .has-video .case-media>video{height:auto;max-height:100%;aspect-ratio:auto;object-fit:contain}
 .has-video .case-media{align-items:center}
}

/* Keep mobile project arrows in dedicated side gutters, outside the thumbnails. */
@media(max-width:800px) and (min-height:541px){
 #main{position:relative}
 .theatre .wing{width:calc(50% - 62px)}
 .theatre .left-wing{left:54px}
 .theatre .right-wing{right:54px}
 .project-nav{position:absolute;top:auto;bottom:calc(13% - 22px);left:4px;right:4px;width:auto;height:44px;margin:0;gap:0;justify-content:space-between;pointer-events:none}
 .project-nav>.circle-button{width:44px;height:44px;flex:0 0 44px;background:transparent;border:0;color:#efd19b;opacity:1;font-size:20px;box-shadow:none;pointer-events:auto}
 .project-nav>.circle-button:hover,.project-nav>.circle-button:focus-visible{background:transparent;color:#fff1d6}
 .project-nav>.circle-button:focus-visible{outline:2px solid #fff1d6;outline-offset:2px}
}
@media(max-width:800px) and (min-height:541px) and (max-height:740px){
 .project-nav{bottom:calc(11% - 22px)}
}

/* The poster occupies the same central square as the greeting and idle frames. */
.mindy-character>img,.wing .character-card .mindy-character>img{inset:0 10%;width:80%}

/* Mindy shares the explicit opt-in sound control used by the other recordings. */
.character-stage .showcase-topline{display:flex;justify-content:flex-end;pointer-events:none}
.character-stage .media-controls{pointer-events:auto}
.character-media{position:relative}
.mindy-sound{position:absolute;z-index:8;top:16px;right:16px;min-height:36px;padding:8px 13px;border:1px solid #dcecf038;border-radius:24px;background:#07171fe8;color:#d4e5e9;font:11px Manrope;cursor:pointer}
.mindy-sound[aria-pressed=true]{color:#f1d3a5}
.mindy-sound:focus-visible{outline:2px solid #e6c18d;outline-offset:3px}
.mindy-narration[hidden]{display:none}
@media(max-width:800px){.mindy-sound{top:8px;right:8px;min-height:36px;font-size:11px}}

/* Direct access to the public voice concierges, before the case-study tabs. */
.case-live-links{flex:none}
.case-live-links h3{font-size:14px;font-weight:600;color:#e6c18d;margin:0 0 10px}
.case-live-links>div{display:flex;gap:10px;flex-wrap:wrap}
.case-live-links .primary-button{min-height:42px;font-size:13px;padding:10px 16px;border-radius:5px;gap:18px}
.case-live-links p{font-size:11px;line-height:1.6;color:#adc3cc;margin:9px 0 0}
@media(max-width:800px){.case-live-links h3{font-size:14px}.case-live-links .primary-button{min-height:44px;font-size:13px;flex:1;justify-content:space-between}.case-live-links p{font-size:12px}}
