.lets-play-timeline { --timeline-label-width:80px; min-width:0; margin-top:.15rem; border-top:1px solid var(--line); }
.timeline-heading { display:flex; min-height:48px; align-items:center; gap:.7rem; padding:.8rem 0; cursor:pointer; list-style:none; }
.timeline-heading::-webkit-details-marker { display:none; }
.timeline-heading::marker { content:""; }
.timeline-title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:1rem; font-weight:700; }
.timeline-clock { margin-left:auto; color:var(--muted); font-size:.75rem; font-variant-numeric:tabular-nums; white-space:nowrap; }
.timeline-disclosure { flex:none; width:8px; height:8px; margin:0 .2rem .2rem; border-right:1.5px solid var(--coral); border-bottom:1.5px solid var(--coral); transform:rotate(45deg); }
.lets-play-timeline[open] .timeline-disclosure { transform:rotate(225deg); margin-bottom:-.2rem; }
.timeline-body { padding:.15rem 0 .25rem; }
.timeline-access-note, .timeline-members-only p { margin:.3rem 0 1rem; color:var(--muted); font-size:.8rem; }
.timeline-access-note a { color:var(--coral); }
.timeline-members-only { padding-block:1rem; }
.timeline-members-only h2 { margin:0 0 .5rem; font-size:1rem; }
.timeline-members-only a { font-size:.85rem; color:var(--coral); }
.is-readonly .timeline-block, .is-readonly .timeline-lane, .is-readonly .timeline-toggle, .is-readonly .timeline-seek { cursor:default; }
.is-readonly .timeline-block { display:flex; align-items:center; }
.is-readonly .timeline-block:hover:not(.is-current) { background:color-mix(in srgb,var(--timeline-track-color) 26%,var(--night)); }
.timeline-controls { display:flex; align-items:end; justify-content:space-between; gap:.8rem 1.5rem; flex-wrap:wrap; margin:.1rem 0 1.1rem; }
.timeline-track-controls { display:flex; align-items:end; flex-wrap:wrap; gap:.75rem 1.25rem; min-width:0; }
.timeline-view-control { display:grid; gap:.35rem; flex:none; color:var(--muted); font-size:.72rem; }
.timeline-view-toggle { display:flex; padding:3px; border:1px solid var(--control-line); border-radius:8px; background:var(--surface); color:var(--muted); font-size:.75rem; cursor:pointer; }
.timeline-view-toggle > span { padding:.3rem .55rem; border-radius:5px; }
.timeline-view-toggle[aria-pressed="false"] [data-view-state="separate"], .timeline-view-toggle[aria-pressed="true"] [data-view-state="grouped"] { color:var(--night); background:var(--coral); }
.timeline-view-toggle:disabled { opacity:.55; cursor:default; }
.timeline-visibility { min-width:0; padding:0; margin:0; border:0; }
.timeline-visibility legend { float:none; width:auto; margin:0 0 .35rem; color:var(--muted); font-size:.72rem; }
.timeline-visibility > div { display:flex; min-height:35px; align-items:center; gap:.45rem 1rem; flex-wrap:wrap; }
.timeline-toggle { display:flex; align-items:center; gap:.4rem; font-size:.78rem; cursor:pointer; }
.timeline-toggle input { accent-color:var(--coral); }
.timeline-jump-label { display:grid; gap:.3rem; flex:0 1 320px; width:320px; max-width:100%; min-width:0; color:var(--muted); font-size:.72rem; }
.timeline-jump-label select { width:100%; max-width:100%; min-width:0; padding:.4rem .6rem; border:1px solid var(--control-line); border-radius:7px; background:var(--surface); color:var(--ink); font-size:.78rem; text-overflow:ellipsis; }
.timeline-ruler, .timeline-row { display:grid; grid-template-columns:var(--timeline-label-width) minmax(0,1fr); align-items:center; }
.timeline-ruler { margin-bottom:.35rem; color:var(--muted); font-size:.63rem; font-variant-numeric:tabular-nums; }
.timeline-ruler > div { display:flex; justify-content:space-between; gap:2px; }
.timeline-group { position:relative; padding:.25rem 0; }
.timeline-group.is-grouped { margin:.3rem 0; padding:.4rem 0; }
.timeline-track-label { padding-right:.6rem; overflow-wrap:anywhere; color:var(--muted); font-size:.72rem; }
.timeline-lane { position:relative; height:35px; margin:.15rem 0; background:var(--night-soft); cursor:crosshair; }
.timeline-block { position:absolute; top:3px; min-width:2px; height:29px; overflow:hidden; padding:0 .25rem; border:0; border-right:1px solid var(--night); border-radius:3px; background:color-mix(in srgb,var(--timeline-track-color) 26%,var(--night)); color:var(--ink); text-overflow:ellipsis; white-space:nowrap; cursor:pointer; font-size:.7rem; text-align:left; }
.timeline-block:hover, .timeline-block.is-current { background:color-mix(in srgb,var(--timeline-track-color) 60%,var(--night)); }
.timeline-block:focus-visible { z-index:4; }
.timeline-lane::after { position:absolute; z-index:3; top:-3px; bottom:-3px; left:var(--timeline-position,0%); width:2px; background:var(--ink); box-shadow:0 0 4px var(--night); content:""; pointer-events:none; display:none; }
.has-position .timeline-lane::after { display:block; }
.timeline-enclosure { position:absolute; z-index:0; top:0; bottom:0; border:1px solid color-mix(in srgb,var(--coral) 55%,transparent); border-radius:5px; background:color-mix(in srgb,var(--coral) 5%,transparent); pointer-events:none; }
.is-grouped .timeline-lane { background:transparent; }
.timeline-seek-label { display:block; margin:.75rem 0 .15rem; font-size:.72rem; color:var(--muted); }
.timeline-seek { width:100%; accent-color:var(--coral); cursor:ew-resize; }
.timeline-now { margin:.5rem 0 .8rem; color:var(--ink); font-size:.76rem; white-space:pre-line; overflow-wrap:anywhere; }
.timeline-feedback { margin:.5rem 0 0; color:var(--coral); font-size:.75rem; }
.timeline-feedback:empty { display:none; }
.timeline-empty { color:var(--muted); font-size:.8rem; }
.timeline-editor { min-width:0; }
.timeline-admin-tracks { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:.5rem; margin:1rem 0; }
.timeline-admin-grouping { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.timeline-admin-grouping > div { display:grid; gap:.4rem; min-width:0; }
.timeline-admin-actions { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1rem; }
.timeline-admin-feedback { font-size:.83rem; }
.timeline-editor details { margin:.65rem 0; }
.timeline-editor details ol { padding-left:1.3rem; font-size:.8rem; }
@media(max-width:600px) {
  .lets-play-timeline { --timeline-label-width:64px; }
  .timeline-ruler { font-size:.57rem; }
  .timeline-ruler > div > span:nth-child(even) { display:none; }
  .timeline-track-label { font-size:.65rem; }
  .timeline-admin-grouping { grid-template-columns:1fr; }
  .timeline-heading { gap:.5rem; }
  .timeline-title { font-size:.86rem; }
  .timeline-clock { font-size:.64rem; }
  .timeline-controls, .timeline-track-controls { gap:.65rem 1rem; }
  .timeline-jump-label { flex-basis:100%; width:100%; }
}
@media(pointer:coarse) {
  .timeline-toggle { min-height:44px; }
  .timeline-view-toggle, .timeline-jump-label select { min-height:44px; }
  .timeline-lane { height:44px; }
  .timeline-block { height:38px; }
}
