.kino{--kino-accent: oklch(50.8% .118 165.612);--kino-bg: black;--kino-radius: 12px;--kino-surface: color-mix(in oklab, black 55%, transparent);--kino-surface-strong: color-mix(in oklab, black 70%, transparent);--kino-border: color-mix(in oklab, white 14%, transparent);--kino-text: oklch(98% 0 0);--kino-text-dim: color-mix(in oklab, white 65%, transparent);--kino-blur: 18px;--kino-shadow: 0 8px 40px rgba(0, 0, 0, .45);--kino-ease: cubic-bezier(.22, 1, .36, 1);--kino-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;--kino-scrim-color: black;--kino-caption-bg: rgba(0, 0, 0, .42);--kino-caption-text: #d2d7dd;--kino-control-fill: rgba(0, 0, 0, .34);--kino-control-fill-hover: rgba(0, 0, 0, .5);--kino-control-text: #fff;--kino-flash-fill: rgba(0, 0, 0, .4);--kino-mctrl-fill: rgba(0, 0, 0, .42);--kino-speeds-fill: rgba(0, 0, 0, .26);--kino-speed-text: color-mix(in oklab, white 52%, transparent);--kino-speed-text-max: color-mix(in oklab, white 82%, transparent);--kino-track: color-mix(in oklab, white 18%, transparent);--kino-track-buffered: color-mix(in oklab, white 25%, transparent);--kino-volume-track: color-mix(in oklab, white 28%, transparent);--kino-thumb: #fff;--kino-hover: color-mix(in oklab, white 12%, transparent);--kino-menu-selected: color-mix(in oklab, black 34%, transparent);--kino-sheet-grip: color-mix(in oklab, white 32%, transparent);--kino-sheet-chip: color-mix(in oklab, white 10%, transparent);--kino-pip-fill: black;--kino-pip-card: color-mix(in oklab, white 7%, transparent);--kino-pip-card-border: color-mix(in oklab, white 12%, transparent);--kino-pip-text: color-mix(in oklab, white 65%, transparent);--kino-pip-text-hover: oklch(98% 0 0);--kino-pip-sub: color-mix(in oklab, white 40%, transparent);position:relative;width:100%;height:100%;color:var(--kino-text);font-family:ui-sans-serif,system-ui,sans-serif;background:var(--kino-bg);overflow:hidden;container-type:inline-size}.kino[data-kino-theme=light]{--kino-bg: oklch(98% 0 0);--kino-surface: color-mix(in oklab, white 72%, transparent);--kino-surface-strong: color-mix(in oklab, white 84%, transparent);--kino-border: color-mix(in oklab, black 12%, transparent);--kino-text: oklch(24% 0 0);--kino-text-dim: color-mix(in oklab, black 55%, transparent);--kino-shadow: 0 8px 40px rgba(0, 0, 0, .16);--kino-scrim-color: white;--kino-caption-bg: color-mix(in oklab, white 66%, transparent);--kino-caption-text: oklch(28% 0 0);--kino-control-fill: color-mix(in oklab, white 70%, transparent);--kino-control-fill-hover: color-mix(in oklab, white 82%, transparent);--kino-control-text: oklch(24% 0 0);--kino-flash-fill: color-mix(in oklab, white 68%, transparent);--kino-mctrl-fill: color-mix(in oklab, white 70%, transparent);--kino-speeds-fill: color-mix(in oklab, white 64%, transparent);--kino-speed-text: color-mix(in oklab, black 50%, transparent);--kino-speed-text-max: color-mix(in oklab, black 22%, transparent);--kino-track: color-mix(in oklab, black 16%, transparent);--kino-track-buffered: color-mix(in oklab, black 26%, transparent);--kino-volume-track: color-mix(in oklab, black 24%, transparent);--kino-thumb: oklch(24% 0 0);--kino-hover: color-mix(in oklab, black 8%, transparent);--kino-menu-selected: color-mix(in oklab, black 12%, transparent);--kino-sheet-grip: color-mix(in oklab, black 24%, transparent);--kino-sheet-chip: color-mix(in oklab, black 8%, transparent);--kino-pip-fill: oklch(95% 0 0);--kino-pip-card: color-mix(in oklab, white 70%, transparent);--kino-pip-card-border: color-mix(in oklab, black 10%, transparent);--kino-pip-text: color-mix(in oklab, black 62%, transparent);--kino-pip-text-hover: oklch(24% 0 0);--kino-pip-sub: color-mix(in oklab, black 42%, transparent)}.kino[data-kino-theme=light] .kino-key{background:linear-gradient(color-mix(in oklab,black 16%,transparent),color-mix(in oklab,black 6%,transparent));border-color:color-mix(in oklab,black 22%,transparent)}.kino[data-kino-theme=light] .kino-tip kbd{background:color-mix(in oklab,black 12%,transparent);border-color:color-mix(in oklab,black 18%,transparent)}.kino *{box-sizing:border-box}.kino mux-video,.kino video,.kino .kino-video-host iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}.kino .kino-video-host iframe{pointer-events:none}.kino .kino-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none;-webkit-user-select:none;user-select:none}.kino .kino-pip-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--kino-pip-fill);color:var(--kino-pip-text);font-size:14px;font-weight:500;line-height:1.4;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .15s var(--kino-ease)}.kino .kino-pip-placeholder-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 24px;text-align:center;background:var(--kino-pip-card);border:1px solid var(--kino-pip-card-border);border-radius:var(--kino-radius)}.kino .kino-pip-placeholder svg{width:28px;height:28px;opacity:.5;transition:opacity .15s var(--kino-ease)}.kino .kino-pip-placeholder:hover{color:var(--kino-pip-text-hover)}.kino .kino-pip-placeholder:hover svg{opacity:.8}.kino .kino-pip-placeholder-sub{font-size:11px;font-weight:400;color:var(--kino-pip-sub)}.kino .kino-video-host{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.kino .kino-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.kino .kino-overlay>*{pointer-events:auto}.kino .kino-glass{background:var(--kino-surface);backdrop-filter:blur(var(--kino-blur));-webkit-backdrop-filter:blur(var(--kino-blur));border:1px solid var(--kino-border);border-radius:var(--kino-radius);box-shadow:var(--kino-shadow)}.kino .kino-scrubber{position:relative;width:100%;padding:8px 0;touch-action:none;cursor:pointer}.kino .kino-track{position:relative;width:100%;height:4px;border-radius:999px;background:var(--kino-track);transition:height .15s var(--kino-ease)}.kino .kino-scrubber:hover .kino-track{height:6px}.kino .kino-buffered{position:absolute;top:0;height:100%;border-radius:999px;background:var(--kino-track-buffered);pointer-events:none}.kino .kino-progress{position:absolute;top:0;left:0;height:100%;border-radius:999px;background:var(--kino-accent);pointer-events:none}.kino .kino-thumb{position:absolute;top:50%;width:12px;height:12px;border-radius:999px;background:var(--kino-text);box-shadow:0 1px 4px #00000080;transform:translate(-50%,-50%);opacity:0;transition:opacity .15s var(--kino-ease);pointer-events:none}.kino .kino-scrubber:hover .kino-thumb{opacity:1}.kino .kino-preview{position:absolute;bottom:calc(100% + 4px);transform:translate(-50%) scale(.72);transform-origin:bottom center;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;pointer-events:none;z-index:2}.kino .kino-preview-img{border-radius:6px;background-repeat:no-repeat;overflow:hidden}.kino .kino-preview-time{padding:5px 4px 4px;font-family:var(--kino-mono);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--kino-text)}.kino .kino-roll{display:inline-flex;align-items:stretch;line-height:1;font-variant-numeric:tabular-nums}.kino .kino-roll-digit{display:inline-block;height:1em;overflow:hidden}.kino .kino-roll-col{display:flex;flex-direction:column;transition:transform .3s var(--kino-ease);will-change:transform}.kino .kino-roll-cell{display:flex;height:1em;align-items:center;justify-content:center}.kino .kino-roll-sep{display:inline-block}.kino .kino-idle{position:absolute;top:0;right:0;bottom:0;left:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:max(16px,2.2cqw)}.kino .kino-idle-play{display:grid;place-items:center;width:max(76px,9cqw);height:max(76px,9cqw);padding:0;color:var(--kino-control-text);background:var(--kino-control-fill);border:none;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer;transition:transform .2s var(--kino-ease),background .2s var(--kino-ease)}.kino .kino-idle-play svg{width:max(32px,3.8cqw);height:max(32px,3.8cqw);fill:var(--kino-control-text)}.kino .kino-idle:hover .kino-idle-play,.kino .kino-idle-play:hover{transform:scale(1.06);background:var(--kino-control-fill-hover)}.kino .kino-idle-speeds{position:absolute;left:50%;top:calc(50% + max(54px,7cqw));display:flex;align-items:center;gap:max(6px,.8cqw);padding:max(8px,1cqw) max(14px,1.8cqw);background:var(--kino-speeds-fill);border:none;border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;transform:translate(-50%,8px);transition:opacity .2s var(--kino-ease),transform .2s var(--kino-ease)}.kino .kino-idle:hover .kino-idle-speeds,.kino .kino-idle:focus-within .kino-idle-speeds{opacity:1;transform:translate(-50%)}.kino .kino-speed-chip{display:inline-flex;align-items:center;gap:3px;padding:4px 7px;font-size:max(15px,1.6cqw);font-weight:600;font-variant-numeric:tabular-nums;color:var(--kino-speed-text);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:color .15s var(--kino-ease),transform .15s var(--kino-ease)}.kino .kino-speed-chip:hover,.kino .kino-speed-chip[data-active=true]{color:var(--kino-control-text)}.kino .kino-speed-chip:hover{transform:scale(1.15)}.kino .kino-idle:hover .kino-speed-chip,.kino .kino-idle:focus-within .kino-speed-chip{animation:kino-chip-in .32s var(--kino-ease) backwards;animation-delay:calc(var(--i, 0) * 45ms)}@keyframes kino-chip-in{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:none}}.kino .kino-speed-chip[data-max=true]{color:var(--kino-speed-text-max)}.kino .kino-speed-chip[data-max=true][data-active=true]{color:var(--kino-control-text)}.kino .kino-bolt{font-size:.85em;line-height:1}.kino .kino-popover-root{position:relative;display:inline-flex}.kino .kino-ctrl{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 10px;color:var(--kino-text);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:background .12s var(--kino-ease)}.kino .kino-ctrl:hover{background:var(--kino-hover)}.kino .kino-ctrl svg{width:22px;height:22px}.kino .kino-ctrl-label{font-size:13px;font-variant-numeric:tabular-nums}.kino .kino-speed-label{font-size:15px;font-weight:500}.kino .kino-quality-badge{display:inline-flex;align-items:center;justify-content:center;padding:1px 5px;font-size:10px;font-weight:600;line-height:1.3;border:1px solid currentColor;border-radius:3px}.kino .kino-tip{position:absolute;bottom:calc(100% + 8px);left:50%;display:inline-flex;align-items:center;gap:6px;padding:6px 8px;white-space:nowrap;font-size:12px;color:var(--kino-text);transform:translate(-50%);pointer-events:none;opacity:0;transition:opacity .12s var(--kino-ease);z-index:20}.kino .kino-tip kbd svg{display:block;width:15px;height:15px}.kino .kino-tip-start{left:0;right:auto;transform:none}.kino .kino-tip-center{left:50%;right:auto;transform:translate(-50%)}.kino .kino-tip-end{left:auto;right:0;transform:none}.kino .kino-key{display:inline-flex;align-items:center;justify-content:center;border-radius:5px;color:var(--kino-text);background:linear-gradient(color-mix(in oklab,white 26%,transparent),color-mix(in oklab,white 12%,transparent));border:1px solid color-mix(in oklab,white 30%,transparent);box-shadow:0 2px color-mix(in oklab,black 40%,transparent);animation:kino-key-press 1.8s var(--kino-ease) infinite}.kino .kino-key-space{align-items:flex-end;width:30px;height:16px;padding-bottom:3px}.kino .kino-key-space-bar{width:14px;height:2px;border-radius:2px;background:var(--kino-text);opacity:.85}.kino .kino-key-arrow{width:18px;height:18px}.kino .kino-key-arrow svg{display:block;width:12px;height:12px}@keyframes kino-key-press{0%,68%,to{transform:translateY(0);box-shadow:0 2px color-mix(in oklab,black 40%,transparent)}80%{transform:translateY(2px);box-shadow:0 0 color-mix(in oklab,black 40%,transparent)}}.kino .kino-popover-root:hover .kino-tip{opacity:1}.kino .kino-tip kbd{display:inline-flex;align-items:center;justify-content:center;min-width:20px;padding:1px 6px;font-family:inherit;font-size:11px;font-weight:500;line-height:1.5;color:var(--kino-text);background:color-mix(in oklab,white 22%,transparent);border:1px solid color-mix(in oklab,white 28%,transparent);border-radius:6px;box-shadow:0 1px color-mix(in oklab,black 40%,transparent)}.kino .kino-menu{position:absolute;bottom:calc(100% + 6px);left:50%;display:flex;flex-direction:column;gap:2px;min-width:150px;padding:6px;transform:translate(-50%);transform-origin:bottom;transition:opacity .12s,transform .12s;z-index:20}.kino .kino-menu:before{content:"";position:absolute;top:100%;left:0;right:0;height:8px}.kino .kino-menu-start{left:0;right:auto;transform:none}.kino .kino-menu-center{left:50%;right:auto;transform:translate(-50%)}.kino .kino-menu-end{left:auto;right:0;transform:none}.kino .kino-menu-item{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;font-size:13px;font-variant-numeric:tabular-nums;text-align:left;color:var(--kino-text);background:transparent;border:none;border-radius:7px;cursor:pointer;transition:background .12s var(--kino-ease)}.kino .kino-menu-item:hover{background:var(--kino-hover)}.kino .kino-menu-item[aria-checked=true]{color:var(--kino-text);background:var(--kino-menu-selected)}.kino .kino-menu-item[aria-checked=true]:after{content:"✓";margin-left:14px;font-size:13px;opacity:.85}.kino .kino-menu-q{padding:9px 12px}.kino .kino-q-label{display:inline-flex;align-items:baseline;gap:8px}.kino .kino-q-key{font-size:15px;font-weight:600}.kino .kino-q-px{font-size:12px;color:var(--kino-text-dim)}.kino .kino-controls{position:absolute;left:0;right:0;bottom:0;z-index:10;padding:0 12px 6px;background:linear-gradient(to top,color-mix(in oklab,var(--kino-scrim-color) 78%,transparent) 0%,color-mix(in oklab,var(--kino-scrim-color) 45%,transparent) 38%,transparent 100%);opacity:0;transform:translateY(8px);transition:opacity .2s var(--kino-ease),transform .2s var(--kino-ease);pointer-events:none}.kino .kino-controls.is-visible{opacity:1;transform:none;pointer-events:auto}.kino .kino-gesture{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:grid;place-items:center;cursor:default}.kino .kino-flash{display:grid;place-items:center;width:max(80px,10cqw);height:max(80px,10cqw);color:var(--kino-control-text);background:var(--kino-flash-fill);border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:none;animation:kino-flash .75s var(--kino-ease) forwards}.kino .kino-flash svg{width:max(32px,4cqw);height:max(32px,4cqw);fill:var(--kino-control-text)}@keyframes kino-flash{0%{opacity:.85;transform:scale(.6)}to{opacity:0;transform:scale(1.3)}}.kino .kino-captions{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-wrap:wrap;align-content:flex-end;align-items:center;justify-content:center;padding:5cqw 4cqw 2.5cqw;text-align:center;pointer-events:none;transform:translateY(0);transition:transform .32s var(--kino-ease)}.kino .kino-captions.is-raised{transform:translateY(calc(-1*clamp(44px,6cqw,72px)))}.kino .kino-caption-text{max-width:min(100%,80ch);padding:10px 22px;font-size:max(13px,1.7cqw);font-weight:500;line-height:1.32;white-space:pre-line;overflow-wrap:break-word;text-wrap:balance;color:var(--kino-caption-text);background:var(--kino-caption-bg);border-radius:8px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:kino-fade-in .2s var(--kino-ease)}@keyframes kino-fade-in{0%{opacity:0}to{opacity:1}}.kino .kino-controls-row{display:flex;align-items:center;gap:4px;padding:2px 4px 4px}.kino .kino-controls-group{display:flex;flex:1;align-items:center;gap:2px;min-width:0}.kino .kino-controls-group-end{justify-content:flex-end}.kino .kino-time{padding:0 8px;font-family:var(--kino-mono);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--kino-text)}.kino .kino-time-dur{color:var(--kino-text-dim)}.kino .kino-volume{display:inline-flex;align-items:center}.kino .kino-volume input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:6px;margin:0;border-radius:999px;background:var(--kino-volume-track);opacity:0;cursor:pointer;transition:width .18s var(--kino-ease),opacity .18s var(--kino-ease),margin .18s var(--kino-ease)}.kino .kino-volume:hover input[type=range],.kino .kino-volume:focus-within input[type=range]{width:80px;margin:0 10px 0 2px;opacity:1}.kino .kino-volume input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:15px;height:15px;border-radius:999px;background:var(--kino-thumb);box-shadow:0 1px 4px #00000073;cursor:pointer}.kino .kino-volume input[type=range]::-moz-range-thumb{width:15px;height:15px;border:none;border-radius:999px;background:var(--kino-thumb);box-shadow:0 1px 4px #00000073;cursor:pointer}.kino .kino-volume input[type=range]::-moz-range-track{height:6px;border-radius:999px;background:var(--kino-volume-track)}.kino .kino-ctrl-skip{position:relative}.kino .kino-ctrl-skip-num{position:absolute;bottom:5px;font-size:9px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--kino-text-dim);pointer-events:none}.kino .kino-ctrl-skip[aria-label*=Back] .kino-ctrl-skip-num{left:8px}.kino .kino-ctrl-skip[aria-label*=Forward] .kino-ctrl-skip-num{right:8px}.kino button:focus,.kino button:focus-visible{outline:none}.kino .kino-ctrl:active{transform:scale(.95)}.kino [role=slider]:focus-visible{outline:2px solid var(--kino-accent);outline-offset:4px}.kino .kino-mcontrols{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;pointer-events:none;opacity:0;transition:opacity .2s var(--kino-ease)}.kino .kino-mcontrols.is-visible{opacity:1}.kino .kino-mcontrols.is-visible .kino-mcluster,.kino .kino-mcontrols.is-visible .kino-mbottom,.kino .kino-mcontrols.is-visible .kino-mtop .kino-mbtn{pointer-events:auto}.kino .kino-mtop{position:absolute;top:0;left:0;right:0;display:flex;justify-content:flex-end;padding:8px 10px;pointer-events:none;background:linear-gradient(to bottom,color-mix(in oklab,var(--kino-scrim-color) 52%,transparent) 0%,transparent 100%)}.kino .kino-mbtn{display:grid;place-items:center;width:40px;height:40px;padding:0;color:var(--kino-control-text);background:transparent;border:none;border-radius:999px;cursor:pointer;transition:transform .15s var(--kino-ease)}.kino .kino-mbtn svg{width:24px;height:24px}.kino .kino-mbtn:active{transform:scale(.9)}.kino .kino-mcluster{position:absolute;top:50%;left:50%;display:flex;align-items:center;gap:max(28px,9cqw);transform:translate(-50%,-50%)}.kino .kino-mtransport{position:relative;display:grid;place-items:center;width:52px;height:52px;padding:0;color:var(--kino-control-text);background:transparent;border:none;border-radius:999px;cursor:pointer;transition:transform .15s var(--kino-ease)}.kino .kino-mtransport svg{width:30px;height:30px}.kino .kino-mtransport:active{transform:scale(.9)}.kino .kino-mctrl-play{display:grid;place-items:center;width:66px;height:66px;padding:0;color:var(--kino-control-text);background:var(--kino-mctrl-fill);border:none;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer;transition:transform .15s var(--kino-ease),background .15s var(--kino-ease)}.kino .kino-mctrl-play svg{width:32px;height:32px;fill:var(--kino-control-text)}.kino .kino-mctrl-play:active{transform:scale(.94)}.kino .kino-mbottom{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:0 6px 6px 14px;background:linear-gradient(to top,color-mix(in oklab,var(--kino-scrim-color) 72%,transparent) 0%,transparent 100%)}.kino .kino-mbottom .kino-scrubber{flex:1;min-width:0}.kino .kino-mtime{padding:0;font-size:12px}.kino .kino-mbottom .kino-mbtn{flex:none;width:36px;height:36px}.kino .kino-mbottom .kino-mbtn svg{width:22px;height:22px}.kino .kino-sheet-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;background:#00000052;opacity:0;pointer-events:none;transition:opacity .22s var(--kino-ease)}.kino .kino-sheet-backdrop.is-open{opacity:1;pointer-events:auto}.kino .kino-sheet{position:absolute;left:0;right:0;bottom:0;max-height:58%;overflow-y:auto;padding:2px 14px 14px;border-radius:var(--kino-radius) var(--kino-radius) 0 0;transform:translateY(101%);transition:transform .26s var(--kino-ease)}.kino .kino-sheet-backdrop.is-open .kino-sheet{transform:none}.kino .kino-sheet-grip{width:34px;height:4px;margin:8px auto 12px;border-radius:999px;background:var(--kino-sheet-grip)}.kino .kino-sheet-section+.kino-sheet-section{margin-top:12px}.kino .kino-sheet-title{margin:0 0 7px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--kino-text-dim)}.kino .kino-sheet-chips{display:flex;flex-wrap:wrap;gap:6px}.kino .kino-sheet-chip{padding:6px 12px;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--kino-text);background:var(--kino-sheet-chip);border:1px solid transparent;border-radius:999px;cursor:pointer;transition:background .12s var(--kino-ease),color .12s var(--kino-ease)}.kino .kino-sheet-chip:active{transform:scale(.96)}.kino .kino-sheet-chip[data-active=true]{color:#fff;background:var(--kino-accent)}@media(prefers-reduced-motion:reduce){.kino *,.kino *:before,.kino *:after{transition-duration:.01ms!important}}