.vap{--ink:#f5f3ee;--bg:#111;--muted:rgba(245,243,238,.62);background:var(--bg);color:var(--ink);min-height:100vh;padding:clamp(24px,4vw,64px);font-family:Manrope,Pretendard,sans-serif;overflow:hidden}.vap *{box-sizing:border-box}.vap__head{display:flex;justify-content:space-between;gap:24px;align-items:end;max-width:1500px;margin:auto}.vap__eyebrow{font-size:11px;letter-spacing:.18em}.vap__filters,.vap__controls{display:flex;gap:16px;flex-wrap:wrap}.vap button{font:inherit;color:inherit;border:0;background:none;padding:5px;cursor:pointer}.vap button[aria-pressed=true]{text-decoration:underline;text-underline-offset:5px}.vap__stage{position:relative;height:min(62vh,650px);min-height:390px;margin:18px auto 0;max-width:1600px;touch-action:pan-y pinch-zoom;user-select:none}.vap__css-scene{position:absolute;inset:0;perspective:1500px;overflow:visible}.vap__ring{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d}.vap__card{position:absolute;left:0;top:0;transform-style:preserve-3d;transform-origin:center;transition:filter .25s,opacity .25s}.vap__card button{display:block;width:100%;height:100%;padding:0;overflow:hidden}.vap__card img,.vap__card video{display:block;width:100%;height:100%;object-fit:contain;background:#181818}.vap__card.is-active{z-index:20}.vap__card:not(.is-active){filter:brightness(.58);opacity:.72}.vap__play{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-size:10px;letter-spacing:.15em;background:rgba(0,0,0,.55)!important;padding:7px 10px!important}.vap__webgl{position:absolute;inset:0;width:100%;height:100%;display:block}.vap__fallback{position:absolute;inset:0}.vap__info{min-height:86px;max-width:760px;margin:-8px auto 0;text-align:center}.vap__info h2{margin:0;font-family:"Cormorant Garamond",serif;font-size:clamp(24px,3vw,40px);font-weight:500}.vap__info p{margin:8px 0;color:var(--muted);font-size:12px;line-height:1.55}.vap__controls{justify-content:center;align-items:center}.vap__controls button{font-size:12px;letter-spacing:.1em}.vap__empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted)}.vap__dialog{width:100vw;height:100dvh;max-width:none;max-height:none;padding:0;border:0;background:rgba(8,8,8,.97);color:#fff}.vap__dialog::backdrop{background:rgba(0,0,0,.75)}.vap__dialog-shell{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:clamp(14px,3vw,34px)}.vap__close{justify-self:end;font-size:28px!important;z-index:2}.vap__player{display:grid;place-items:center;min-width:0;min-height:0}.vap__player iframe,.vap__player video{border:0;display:block;max-width:100%;max-height:100%;object-fit:contain}.vap__dialog-info{max-width:900px;margin:auto;text-align:center}.vap__dialog-info h2{margin:8px 0 2px}.vap__dialog-info p{margin:4px;color:var(--muted)}.vap__status{position:absolute;inset:auto 12px 12px;color:var(--muted);font-size:10px}.vap :focus-visible{outline:1px solid #fff;outline-offset:4px}@media(max-width:700px){.vap{padding:20px 14px}.vap__head{display:block}.vap__filters{margin-top:14px;gap:8px}.vap__stage{height:58vh;min-height:410px}.vap__info{margin-top:0}.vap__controls{gap:10px}.vap__dialog-shell{padding:12px}.vap__dialog-info{max-height:22vh;overflow:auto}.vap__player iframe{min-width:260px;min-height:146px}}@media(prefers-reduced-motion:reduce){.vap *{scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* Playback is contained in the VIDEO ARCHIVE, never a viewport modal. */
.vap{position:relative;isolation:isolate}
.vap [hidden]{display:none!important}
.vap.is-playing>:not(.vap__dialog){visibility:hidden}
.vap>.vap__dialog{position:absolute;inset:0;margin:0;width:100%;height:100%;max-width:100%;max-height:100%;background:#080808;z-index:30;overflow:hidden;overscroll-behavior:contain}
.vap>.vap__dialog[open]{display:block}
.vap>.vap__dialog:not([open]){display:none}
.vap>.vap__dialog::backdrop{background:transparent}
.vap>.vap__dialog>.vap__dialog-shell{height:var(--vap-panel-height,100%);margin-top:var(--vap-panel-top,0px);max-height:100%;min-height:0;grid-template-rows:44px minmax(0,1fr) auto;gap:8px;padding:12px clamp(10px,2vw,24px);overflow-y:auto}
.vap .vap__close{position:sticky;top:0;align-self:start;justify-self:end;width:44px;height:44px;padding:0;line-height:1;z-index:2;background:#080808}
.vap .vap__player{width:100%;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;align-items:start;justify-items:center}
.vap .vap__media-shell{width:100%;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.vap .vap__media-surface{width:var(--pw,100%);height:var(--ph,auto);max-width:100%;flex:none;background:#080808}
.vap .vap__media-surface iframe,.vap .vap__media-surface video{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:none;border:0;display:block;object-fit:contain}
.vap .vap__media-controls{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;width:100%;min-width:0}
.vap .vap__media-controls button{border:1px solid rgba(255,255,255,.28);padding:7px 10px;min-height:40px;font-size:11px;letter-spacing:.08em}
.vap .vap__volume{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.12em}
.vap .vap__volume input{width:clamp(86px,10vw,116px);max-width:100%;accent-color:#f5f3ee;cursor:pointer}
.vap .vap__media-shell>p{font-size:12px;line-height:1.5;text-align:center;color:var(--muted);margin:0;overflow-wrap:anywhere}
.vap .vap__dialog-info{max-height:min(20dvh,150px);width:100%;overflow:auto;min-width:0}
.vap .vap__dialog-info h2{font-family:inherit;font-size:clamp(16px,2vw,24px);line-height:1.4;overflow-wrap:anywhere;margin:4px 0}
.vap .vap__dialog-info p{font-size:12px;line-height:1.5;overflow-wrap:anywhere;margin:4px 0}
.vap .vap__thumbnail-rail{--thumb-height:clamp(56px,6vw,84px);display:flex;justify-content:flex-start;align-items:center;gap:10px;max-width:920px;width:100%;min-width:0;margin:12px auto 20px;padding:4px 2px 8px;overflow-x:auto;scrollbar-width:thin;touch-action:pan-x pan-y pinch-zoom}
.vap .vap__thumbnail{position:relative;flex:0 0 auto;width:calc(var(--thumb-height)*var(--thumb-ratio));height:var(--thumb-height);max-width:none;min-width:30px;padding:0;border:1px solid rgba(245,243,238,.2);background:#181818;opacity:.62;overflow:hidden;transition:opacity .2s,border-color .2s}
.vap .vap__thumbnail:first-child{margin-left:auto}.vap .vap__thumbnail:last-child{margin-right:auto}
.vap .vap__thumbnail:hover,.vap .vap__thumbnail:focus-visible,.vap .vap__thumbnail.is-active{opacity:1;border-color:rgba(245,243,238,.9)}
.vap .vap__thumbnail img{display:block;width:100%;height:100%;object-fit:contain}
.vap .vap__thumbnail span{position:absolute;left:4px;bottom:3px;padding:1px 3px;background:rgba(0,0,0,.58);font-size:9px;letter-spacing:.1em}
.vap button:disabled{opacity:.4;cursor:default}
@media(max-width:700px){.vap .vap__media-controls{gap:6px}.vap .vap__media-controls button{min-height:44px;padding:6px 8px}.vap .vap__thumbnail-rail{gap:8px;margin:8px auto 16px}.vap .vap__volume input{width:86px}}

/* Active rotating-card play glyph. The card button remains the only control. */
.vap .vap__play{left:auto;right:12px;bottom:12px;display:none;width:16px;height:16px;padding:0!important;background:none!important;color:#f5f3ee;opacity:.62;transform:none;pointer-events:none;transition:opacity .2s}
.vap .vap__card.is-active .vap__play{display:block}
.vap .vap__card.is-active button:hover .vap__play,.vap .vap__card.is-active button:focus-visible .vap__play{opacity:1}
.vap .vap__play svg{display:block;width:100%;height:100%;pointer-events:none}
@media(hover:none),(pointer:coarse){.vap .vap__card.is-active .vap__play{opacity:.82}}