/* DeadGraph public show page (/show/<date>). Builds on the tokens in functions/lib/browse-page.ts
   (--bg, --surface, --text, --muted, --accent, --border). No animation beyond a short colour
   transition, and none at all under prefers-reduced-motion. */

h1 .h1-venue{display:block;margin-top:6px;font-family:'Work Sans',system-ui,sans-serif;font-size:clamp(1rem,2.6vw,1.2rem);font-weight:500;color:var(--text);line-height:1.4}

.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 14px;margin:18px 0 8px}
.hero-actions .back-year{font-size:.9rem;margin-left:auto}
.btn-primary,.btn-secondary{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 20px;border-radius:999px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;line-height:1.2}
.btn-primary{background:var(--accent);color:#fff;border:1px solid var(--accent)}
.btn-primary:hover{filter:brightness(1.08)}
.btn-secondary{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.btn-secondary:hover{background:var(--surface)}
.btn-primary:focus-visible,.btn-secondary:focus-visible,.track-play:focus-visible,.dg-btn:focus-visible,.dg-scrub:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.btn-play-from{background:var(--surface);color:var(--accent)}

.sit-in-note{margin:12px 0 0;padding:10px 14px;border-left:3px solid var(--accent);background:var(--surface);border-radius:0 8px 8px 0;max-width:760px}

.show-grid{display:grid;gap:0 36px;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.show-grid{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:start}}

.set-heading{font-family:'Fraunces',Georgia,serif;font-size:1rem;font-weight:600;color:var(--muted);margin:20px 0 6px;letter-spacing:.02em}
.listen-source{margin:0 0 4px;overflow-wrap:anywhere}

.track-list{list-style:none;margin:0;padding:0}
.track{display:grid;grid-template-columns:40px 2.2em minmax(0,1fr) auto;align-items:center;gap:6px;padding:4px 8px 4px 2px;border-bottom:1px solid var(--border);border-radius:6px;transition:background-color .15s ease}
.track:hover{background:var(--surface)}
.track-play{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;color:var(--accent);text-decoration:none}
.track-play:hover{background:var(--surface-2)}
.track-num{color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums;text-align:right;padding-right:6px}
.track-title{min-width:0;overflow-wrap:anywhere}
.track-guest{color:var(--muted);font-size:.8rem;white-space:nowrap}
.track-dur{color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums}
.track.is-current{background:var(--surface);box-shadow:inset 3px 0 0 var(--accent)}
.track.is-current .track-title{font-weight:600;color:var(--accent)}
.track.is-shared,.setlist li.is-shared{background:var(--surface-2);box-shadow:inset 3px 0 0 var(--accent)}
.track.is-guest .track-guest{color:var(--accent);font-weight:600}

.setlist-section .setlist{grid-template-columns:1fr;gap:0}
.setlist-section .setlist li{padding:6px 10px}

.badges{display:inline-flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.badge-accent{border-color:var(--accent);color:var(--accent)}
.is-playing-source{border-color:var(--accent)}

/* Sticky player bar */
.dg-bar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(200px,38%);align-items:center;gap:8px 16px;padding:10px clamp(12px,3vw,28px) calc(10px + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -6px 24px var(--shadow)}
.dg-bar[hidden]{display:none}
body.dg-bar-open{padding-bottom:96px}
.dg-bar-controls{display:flex;align-items:center;gap:4px}
.dg-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:var(--text);cursor:pointer}
.dg-btn:hover{background:var(--surface-2)}
.dg-btn-main{width:46px;height:46px;background:var(--accent);color:#fff}
.dg-btn-main:hover{background:var(--accent);filter:brightness(1.08)}
.dg-bar-info{min-width:0}
.dg-bar-title{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dg-bar-sub{color:var(--muted);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dg-bar-error{color:var(--accent);font-size:.8rem}
.dg-bar-note{color:var(--muted);font-size:.75rem;line-height:1.35}
.dg-bar-progress{display:flex;align-items:center;gap:8px}
.dg-scrub{flex:1;min-width:0;accent-color:var(--accent);height:24px}
.dg-time{color:var(--muted);font-size:.8rem;font-variant-numeric:tabular-nums;min-width:3.2em;text-align:center}

@media(max-width:700px){
  .dg-bar{grid-template-columns:auto minmax(0,1fr);gap:4px 10px}
  .dg-bar-progress{grid-column:1 / -1;order:3}
  body.dg-bar-open{padding-bottom:128px}
  .hero-actions .back-year{margin-left:0}
  .track{grid-template-columns:40px minmax(0,1fr) auto}
  .track-num{display:none}
}

@media(prefers-reduced-motion:reduce){.track{transition:none}}
