/* [코대리] 선명한 제품 장면을 고정하고 다음 장면이 겹쳐 올라오는 탐색과 정적 대체 화면을 제공한다. */
.cinema-marker {display:block;position:relative;height:0;width:100%;pointer-events:none}
.cinema-frame {position:relative}
.cinema-backplate {display:none}
html[data-cinema-layout="overlap"] {overflow-x:clip}
html[data-cinema-layout="overlap"] body {overflow-x:clip;padding-bottom:88px}
html[data-cinema-layout="overlap"] main {position:relative;isolation:isolate}
html[data-cinema-layout="overlap"] .cinema-frame {isolation:isolate;z-index:var(--cinema-order);opacity:var(--cinema-opacity,1);scale:var(--cinema-scale,1);transform-origin:50% var(--cinema-header,84px);filter:blur(var(--cinema-softness,0px));background-color:#fff}
html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-pin="true"] {position:sticky;top:var(--cinema-pin-top,84px)}
html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-focus-flow="true"] {position:relative;top:auto;scale:1;opacity:1;filter:none;pointer-events:auto}
html[data-cinema-layout="overlap"] .cinema-backplate {display:block;position:absolute;pointer-events:none;z-index:-1;top:0;left:50%;width:100vw;height:100%;transform:translateX(-50%);background:#fff;border-top:1px solid #e5e5e5;box-shadow:0 -20px 65px #0000000c}
html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-pin="true"] > .cinema-backplate {min-height:calc(100svh - var(--cinema-header,84px))}
html[data-cinema-ready="true"] .cinema-frame[data-reveal] {transition:none;transform:none}
html[data-cinema-ready="true"] [data-reveal]:focus-within {opacity:1;transform:none;transition:none}
html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-covered="true"] {pointer-events:none}
html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-covered="true"] *,html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-covered="true"] *::before,html[data-cinema-layout="overlap"] .cinema-frame[data-cinema-covered="true"] *::after {animation-play-state:paused!important}
.cinema-controls {position:fixed;bottom:max(20px,env(safe-area-inset-bottom));right:max(28px,calc((100vw - 1380px)/2));z-index:75;display:flex;gap:12px;align-items:center;padding:7px;border:1px solid #d0d0d0;border-radius:38px;color:#151515;background:#fffffff5;box-shadow:0 6px 28px #00000012;backdrop-filter:blur(16px)}
.cinema-controls button {flex:0 0 44px;width:44px;height:44px;border:0;border-radius:50%;background:#f2f2f2;color:#181818;font-size:21px;cursor:pointer}
.cinema-controls button:hover {background:#ffdd52}
.cinema-controls button:disabled {opacity:.35;cursor:default}
.cinema-status {min-width:124px;display:grid;gap:2px;padding:0 6px;line-height:1.25}
.cinema-counter {font:10px/1.3 ui-monospace,monospace;color:#505050;letter-spacing:.1em}
.cinema-caption {font-size:12px;font-weight:600}
body:has(dialog[open]) .cinema-controls {visibility:hidden}
html[data-cinema-motion="running"][data-cinema-intro="true"] .hero-copy {animation:cinema-open-copy 1.25s cubic-bezier(.18,.7,.2,1) both}
html[data-cinema-motion="running"][data-cinema-intro="true"] .hero .globe-stage {animation:cinema-open-object 1.65s cubic-bezier(.16,.65,.18,1) both}
@keyframes cinema-open-copy {from{opacity:.1;filter:blur(4px)}to{opacity:1;filter:blur(0)}}
@keyframes cinema-open-object {from{opacity:.05;filter:blur(7px)}to{opacity:1;filter:blur(0)}}
html[data-cinema-layout="flow"] .cinema-frame {opacity:1;filter:none;scale:1}
html[data-motion="paused"] .hero :is(.hero-copy,.globe-stage),html[data-reduced-motion="true"] .hero :is(.hero-copy,.globe-stage) {animation:none!important;opacity:1;filter:none}
@media(max-width:760px){html[data-cinema-layout="overlap"] .cinema-frame{filter:none}.cinema-controls{right:16px;bottom:max(12px,env(safe-area-inset-bottom));gap:7px;padding:5px}.cinema-status{min-width:105px}.cinema-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.cinema-frame{position:relative!important;top:auto!important;opacity:1!important;filter:none!important;scale:1!important}.cinema-backplate{display:none!important}}
@media print{.cinema-frame{position:relative!important;top:auto!important;opacity:1!important;filter:none!important;scale:1!important}.cinema-controls,.cinema-backplate,.cinema-marker{display:none!important}}