/* Shared, quiet controls with large keyboard and touch targets. */
.audio-dock{left:50%;right:auto;bottom:18px;transform:translateX(-50%);width:min(1180px,calc(100% - 36px));box-sizing:border-box;border-radius:24px;padding:14px 20px;grid-template-columns:minmax(160px,1fr) auto minmax(180px,1.25fr) 100px;gap:22px;background:color-mix(in srgb,var(--panel,#201c20) 88%,transparent);backdrop-filter:blur(28px) saturate(130%);box-shadow:0 12px 50px #0005;border:1px solid color-mix(in srgb,var(--gold) 20%,transparent)}
.audio-dock[hidden]{display:none}.dock-track{grid-template-columns:52px minmax(0,1fr);gap:12px;min-width:0}.dock-track img{width:52px;border-radius:13px;object-fit:contain;box-shadow:0 3px 14px #0004}.dock-track strong,.dock-track span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dock-track strong{font-size:14px;line-height:1.6}.dock-track span{font-size:12px}.dock-controls{gap:6px}.dock-controls button{display:grid;place-items:center;transition:background .18s,transform .18s;border:none;background:transparent}.dock-controls button:hover{background:color-mix(in srgb,var(--gold) 14%,transparent)}.dock-controls button:active{transform:scale(.95)}.dock-controls svg{width:20px;height:20px}.dock-controls .dock-play{width:46px;height:46px;background:var(--gold);box-shadow:0 3px 16px #0002}.dock-controls .dock-text{border-radius:14px;font-size:12px;min-width:58px;padding:8px;min-height:38px;font-weight:500}.dock-progress{grid-template-columns:36px minmax(40px,1fr) 36px;font-size:11px;font-variant-numeric:tabular-nums;gap:9px}.audio-volume{font-size:10px;color:var(--muted);display:grid;gap:5px}.audio-dock input[type=range]{width:100%;min-width:0;padding:0;accent-color:var(--gold);cursor:pointer}.media-status:not(:empty){position:absolute;bottom:100%;left:15px;background:var(--panel);padding:12px;border-radius:12px;font-size:13px}.audio-dock :focus-visible,.video-frame :focus-visible{outline:2px solid var(--gold);outline-offset:3px}.ballads-page{padding-bottom:120px}
.video-frame{border-radius:16px;isolation:isolate;border:1px solid #ffffff12}.video-frame video{object-fit:contain}.video-frame .video-controls{position:absolute;inset:auto 0 0;z-index:3;display:flex;flex-direction:column;gap:0;border:none;padding:38px 16px 10px;background:linear-gradient(transparent,#000b 48%,#000e);color:#fff;opacity:1;transition:opacity .25s,transform .25s}.video-controls[hidden]{display:none}.video-frame.controls-idle .video-controls{opacity:0;pointer-events:none;transform:translateY(8px)}.video-frame.controls-idle{cursor:none}.video-frame:has(:focus-visible) .video-controls{opacity:1;pointer-events:auto;transform:none}.video-control-row{display:flex;align-items:center;gap:4px;width:100%;min-width:0}.video-controls-spacer{flex:1}.video-frame .video-controls button{width:40px;height:40px;min-width:40px;display:grid;place-items:center;padding:8px;border:0;background:transparent;border-radius:50%;color:#fff;cursor:pointer;transition:background .15s}.video-frame .video-controls button:hover{background:#ffffff25}.video-frame .video-controls button[hidden]{display:none}.video-controls svg{width:23px;height:23px}.video-control-row [data-video-time]{font:12px/1.3 Arial,sans-serif;white-space:nowrap;font-variant-numeric:tabular-nums;margin:0 9px}.video-frame .video-volume{width:65px;min-width:30px;accent-color:#fff;padding:0;cursor:pointer}.video-frame .video-timeline{width:100%;height:22px;display:flex;align-items:center;position:relative}.video-frame .video-timeline input{position:relative;appearance:none;-webkit-appearance:none;width:100%;height:4px;min-height:4px;border:none;border-radius:4px;margin:0;background:linear-gradient(to right,var(--gold) var(--played,0%),#ffffff30 var(--played,0%));cursor:pointer;z-index:1}.video-timeline input::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:var(--gold)}.video-timeline input::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--gold)}.video-buffer{position:absolute;height:4px;background:#ffffff45;left:0;border-radius:4px;pointer-events:none}.video-frame .video-timeline .chapter-marker{position:absolute;width:3px;min-width:3px;height:7px;min-height:7px;padding:0;border-radius:0;background:#0008;z-index:2}.video-settings{position:absolute;bottom:80px;right:16px;width:min(280px,calc(100% - 32px));padding:16px;box-sizing:border-box;background:#202024f2;backdrop-filter:blur(20px);border:1px solid #ffffff20;border-radius:16px;box-shadow:0 8px 30px #0007}.video-settings[hidden]{display:none}.video-settings label{display:flex;align-items:center;justify-content:space-between;gap:14px;font:13px Arial,sans-serif;color:#fff;margin:8px 0}.video-frame .video-settings select{max-width:155px;min-height:34px;border:1px solid #ffffff18;background:#ffffff0d;border-radius:8px;color:#fff;font:12px Arial,sans-serif;padding:5px 8px}.video-settings option{background:#242428;color:#fff}.video-feedback{position:absolute;z-index:2;left:50%;top:45%;transform:translate(-50%,-50%);background:#0009;color:#fff;border-radius:18px;padding:18px;pointer-events:none;font:15px Arial,sans-serif}.video-error{position:absolute;z-index:4;left:10%;right:10%;top:35%;padding:20px;background:#17171bea;color:#fff;border-radius:16px;text-align:center}.video-frame:fullscreen{border-radius:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0}.video-frame:fullscreen video{width:100%;height:100%;aspect-ratio:auto}.legend-browser.theater-mode{grid-template-columns:minmax(0,1fr)}.theater-mode .legend-sidebar{display:none}.theater-mode [data-legend-list]{display:none}.theater-mode .legend-player-shell{grid-column:1/-1}.video-frame:fullscreen .video-controls{padding-bottom:22px}
@media(max-width:800px){.audio-dock{gap:12px;padding:12px 16px;grid-template-columns:minmax(0,1fr) auto;border-radius:20px}.dock-progress{grid-column:1/-1;grid-row:2}.audio-volume{display:none}.dock-track strong{font-size:12px}.dock-track img{width:42px}.dock-track{grid-template-columns:42px minmax(0,1fr)}.dock-controls .dock-play{width:40px;height:40px}.dock-controls button:not(.dock-text){width:36px;height:36px}.dock-controls .dock-text{min-width:44px}.video-frame .video-controls{padding:28px 8px 5px}.video-frame .video-controls button{width:34px;height:34px;min-width:34px;padding:6px}.video-volume{display:none}.video-control-row [data-video-time]{font-size:10px;margin:0 3px}.video-settings{bottom:66px}.video-controls [data-video-wide]{display:none}.video-frame{border-radius:12px}.video-frame.controls-idle:has(:focus-visible) .video-controls{opacity:1}}
@media(prefers-reduced-motion:reduce){.video-frame .video-controls,.dock-controls button{transition:none}}

.media-status:empty{display:none}
@media(max-width:800px){.ballads-page{padding-bottom:220px}}
@media(max-width:800px){.video-frame .video-settings{bottom:52px;right:8px;padding:8px 12px;max-height:calc(100% - 60px);overflow-y:auto}.video-settings label{font-size:11px;margin:2px 0;gap:8px}.video-frame .video-settings select{font-size:11px;min-height:26px;height:28px;padding:3px 6px}.video-frame .video-controls [data-video-wide]{display:none}}
@media(max-width:800px){.video-frame .video-settings{max-height:none}}
.video-frame.immersive{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;z-index:10000;border-radius:0;display:flex;align-items:center;justify-content:center}.video-frame.immersive video{width:100%;height:100%;aspect-ratio:auto;object-fit:contain}