.bax{margin:0}
.ba{--p:50;position:relative;aspect-ratio:var(--r,.8);overflow:hidden;background:#111;user-select:none;-webkit-user-select:none;cursor:ew-resize;isolation:isolate}
.ba.ease{transition:--p .45s var(--ease)}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.ba .b{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--p)*1%) 0 0)}
.ba .hl{position:absolute;top:0;bottom:0;left:calc(var(--p)*1%);width:76px;margin-left:-38px;touch-action:none;display:grid;place-items:center;z-index:3}
.ba .hl::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 18px rgba(0,0,0,.7),0 0 14px var(--rd)}
.knob{position:relative;width:54px;height:54px;border-radius:50%;background:var(--rd);border:2px solid #fff;color:#fff;display:grid;place-items:center;padding:0;cursor:ew-resize;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.knob svg{width:26px;height:26px}
.ba.hint .knob{animation:pulse 1.8s ease-out 3}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(215,25,32,.7)}100%{box-shadow:0 0 0 22px rgba(215,25,32,0)}}
.tg{position:absolute;bottom:14px;z-index:2;font:700 .66rem/1 var(--fb);letter-spacing:.22em;text-transform:uppercase;background:rgba(0,0,0,.7);padding:9px 12px;pointer-events:none}
.tg.l{left:14px}.tg.r{right:14px;background:var(--rd)}
.zoom{position:absolute;top:12px;right:12px;z-index:4;width:44px;height:44px;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.4);color:#fff;cursor:zoom-in;display:grid;place-items:center;padding:0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.zoom svg{width:20px;height:20px}
.zoom:hover{background:var(--rd)}
.frame{position:relative}
.frame::before,.frame::after{content:"";position:absolute;width:34px;height:34px;z-index:5;pointer-events:none}
.frame::before{top:-9px;left:-9px;border-top:2px solid var(--rd);border-left:2px solid var(--rd)}
.frame::after{bottom:-9px;right:-9px;border-bottom:2px solid var(--rd);border-right:2px solid var(--rd)}
.rc{margin-top:14px;font-size:.9rem}
.rc .tagc{display:inline-block;background:var(--rd);color:#fff;font:700 .62rem/1 var(--fb);letter-spacing:.2em;text-transform:uppercase;padding:6px 9px;margin-right:10px;vertical-align:middle}
.rc b{font:800 1.5rem/1 var(--fd);text-transform:uppercase;vertical-align:middle}
.rc p{color:var(--gr);margin:8px 0 0;font-size:.88rem}
dialog.zm{border:0;padding:0;background:transparent;color:#fff;max-width:96vw;max-height:96vh;overflow:visible}
dialog.zm::backdrop{background:rgba(0,0,0,.94)}
dialog.zm .bax{width:min(94vw,calc(86vh * var(--r)))}
dialog.zm .zoom{display:none}
dialog.zm .xc{position:fixed;top:14px;right:14px;width:50px;height:50px;background:var(--rd);color:#fff;border:0;font-size:1.4rem;cursor:pointer;z-index:10}

/* rail (carousel) */
.rail{--h:min(62vh,540px);display:flex;gap:clamp(14px,1.8vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;padding:6px var(--pad) 10px;scroll-padding-inline:var(--pad);scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{display:none}
.rail>.bax,.rail>.slot{flex:0 0 auto;width:min(calc(var(--h) * var(--r,.8)),86vw);scroll-snap-align:start}
.rail-ctl{display:flex;align-items:center;gap:18px;padding:0 var(--pad);margin-top:24px}
.rail-bar{flex:1;height:2px;background:rgba(255,255,255,.18);position:relative;overflow:hidden}
.light-sec .rail-bar{background:rgba(0,0,0,.18)}
.rail-bar i{position:absolute;top:0;bottom:0;left:0;width:30%;background:var(--rd);transition:transform .15s linear}
.rail-btn{width:52px;height:52px;border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;cursor:pointer;display:grid;place-items:center;transition:.3s;padding:0}
.rail-btn svg{width:22px;height:22px}
.rail-btn:hover{background:var(--rd);border-color:var(--rd)}
.light-sec .rail-btn{border-color:#0b0b0b;color:#0b0b0b}.light-sec .rail-btn:hover{color:#fff}
.ba{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
.ba.free{touch-action:pan-y}
