.story-wrapper { --cf-player-header: 68px; }
.cf-video-player { width: 100%; min-width: 0; color: #fff; background: #090d13; }
.cf-video-player [hidden] { display: none !important; }
.cf-video-stage { position: relative; width: 100%; aspect-ratio: var(--cf-video-ratio, 16 / 9); min-height: 180px; max-height: min(520px, calc(100vh - var(--cf-player-header) - 80px)); max-height: min(520px, calc(100dvh - var(--cf-player-header) - 80px)); overflow: hidden; background: #090d13; isolation: isolate; }
.cf-video-stage > video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; min-width: 0; max-width: 100%; object-fit: contain; }
.cf-video-player:not([data-player-ready]) :is([data-video-action],.cf-video-timeline) { display: none; }
.cf-video-player [data-video-action] { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #ffffff55; padding: 0; color: #fff; background: #10151dd9; cursor: pointer; touch-action: manipulation; line-height: 1; box-shadow: 0 4px 18px #0005; visibility: visible; transition: background .18s, opacity .18s, visibility .18s, transform .18s; }
.cf-video-player .cf-video-toggle { position: absolute; z-index: 3; left: 50%; top: 50%; width: 76px; height: 76px; border-radius: 50%; transform: translate(-50%, -50%); border: 2px solid #ffffffcc; background: #111821d9; font-size: 28px; }
.cf-video-toggle .fa-play { transform: translateX(2px); }
.cf-video-player.is-playing.is-controls-hidden :is([data-video-action],.cf-video-timeline) { opacity: 0; pointer-events: none; }
.cf-video-player .cf-video-mute { position: absolute; z-index: 4; right: 10px; top: 10px; width: 48px; height: 48px; border-radius: 50%; font-size: 18px; }
.cf-video-timeline { position: absolute; inset: auto 0 0; z-index: 4; display: flex; align-items: center; gap: 10px; padding: 9px 10px; background: linear-gradient(transparent, #000b); visibility: visible; transition: opacity .18s, visibility .18s; }
.cf-video-timeline [data-video-seek] { display: block; width: 0; flex: 1; min-width: 0; height: 48px; margin: 0; accent-color: #fbbf24; cursor: pointer; }
.cf-video-player .cf-video-fullscreen { flex-shrink: 0; width: 48px; height: 48px; border-radius: 12px; font-size: 18px; }
.cf-video-player :is([data-video-action],[data-video-seek]):focus-visible { outline: 3px solid #fbbf24; outline-offset: 3px; opacity: 1; }
.cf-video-status { margin: 0; padding: 12px 16px; font-size: 14px; line-height: 1.65; color: #f1f5f9; background: #1c2634; overflow-wrap: anywhere; }
.cf-video-player:fullscreen, .cf-video-player:-webkit-full-screen { width: 100%; height: 100%; max-width: none; border-radius: 0; }
.cf-video-player:fullscreen .cf-video-stage, .cf-video-player:-webkit-full-screen .cf-video-stage { height: 100%; aspect-ratio: auto; min-height: 0; max-height: none; }
@media (hover: hover) {
    .cf-video-player [data-video-action]:hover { background: #263243f2; opacity: 1; }
    .cf-video-player .cf-video-toggle:hover { transform: translate(-50%, -50%) scale(1.05); }
}
@media (pointer: coarse), (max-width: 1023px) {
    .cf-video-player .cf-video-toggle { width: 72px; height: 72px; }
    .cf-video-player :is(.cf-video-mute,.cf-video-fullscreen) { width: 52px; height: 52px; }
    .cf-video-timeline [data-video-seek] { height: 52px; }
    .cf-video-stage { max-height: min(600px, calc(100vh - var(--cf-player-header) - 80px)); max-height: min(600px, calc(100dvh - var(--cf-player-header) - 80px)); }
}
@media (max-width: 1023px) {
    .story-wrapper #btn-scroll-top { right: 4px; }
}
@media (prefers-reduced-motion: reduce) {
    .cf-video-player *, .cf-video-player *::before, .cf-video-player *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}