/* The timeline keeps a generous hit area and visible remote focus at 1080p. */
.playback-timeline { display:flex; align-items:center; width:100%; padding:12px 0; color:#f4f7fb; }
.playback-timeline-time { min-width:100px; padding:0 12px; font-size:20px; font-variant-numeric:tabular-nums; white-space:nowrap; text-align:center; }
.playback-timeline-range { -webkit-appearance:none; appearance:none; flex:1; min-width:80px; height:40px; margin:0 12px; padding:0; border:0; border-radius:12px; outline:none; background:transparent; cursor:pointer; }
.playback-timeline-range::-webkit-slider-runnable-track { height:8px; border-radius:5px; background:linear-gradient(to right,#53a4ff 0%,#53a4ff var(--timeline-fill,0%),#5b6d90 var(--timeline-fill,0%),#5b6d90 100%); }
.playback-timeline-range::-webkit-slider-thumb { -webkit-appearance:none; width:24px; height:24px; margin-top:-8px; border:3px solid #eaf4ff; border-radius:50%; background:#53a4ff; }
.playback-timeline-range:focus { box-shadow:0 0 0 3px #53a4ff; background:rgba(83,164,255,.12); }
.playback-timeline-range:focus::-webkit-slider-thumb { box-shadow:0 0 0 5px rgba(83,164,255,.3); }
.playback-timeline[data-preview="true"] .playback-timeline-time { color:#8ec7ff; }
.playback-timeline-range:disabled { cursor:default; opacity:.4; }
.playback-timeline-range:disabled::-webkit-slider-thumb { visibility:hidden; }
.playback-timeline[data-seekable="false"] .playback-timeline-time { color:#a9b4c8; }
