.playback-dock{position:sticky;top:8px;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;margin:0 0 16px;border:1px solid #c8a66e38;border-radius:12px;background:#181d16f5;box-shadow:0 12px 35px #0005;backdrop-filter:blur(16px)}body[data-session=listen] .playback-dock .transport{padding:0;background:none;gap:6px;flex-wrap:nowrap;flex-shrink:0}body[data-session=listen] .playback-dock #reset{position:static;order:0;padding:8px;margin-right:5px}body[data-session=listen] .playback-dock #start{min-width:98px}body[data-session=listen] .playback-dock .session-tempo{display:flex;align-items:center;gap:9px;min-width:0;margin-left:auto}body[data-session=listen] .playback-dock #tempo-number-label{font:10px var(--brand-sans);letter-spacing:.1em;text-transform:uppercase;color:#b6b8a9;margin:0;max-width:90px;line-height:1.5}.playback-dock .tempo-entry{display:flex;gap:0;flex-shrink:0}.playback-dock #tempo-count-summary{display:none}.playback-dock #pulse-controls{margin:0;padding:0;gap:5px;flex-wrap:nowrap;flex-shrink:0}.playback-dock #pulse-tempo{font-size:10px;white-space:nowrap;min-width:80px}.playback-dock #pulse-toggle{min-height:38px;padding:8px 10px;font-size:11px}.playback-dock #pulse-options>div{top:44px;bottom:auto;left:auto;right:0;max-width:calc(100vw - 32px)}.playback-dock #pulse-count-status{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding:5px 14px;background:#252d21;border-radius:0 0 8px 8px;white-space:nowrap}.playback-dock #pulse-count-status:empty{display:none}body.immersive[data-session=listen] #playback-dock{position:relative;top:0;order:0;flex:none;margin:0;border-radius:0;border-width:0 0 1px;padding:8px 16px;z-index:90}body.immersive .playback-dock #pulse-controls{order:0}body.shared-song .playback-dock .session-tempo{max-width:none}
@media(max-width:900px){.playback-dock{gap:8px;padding:10px}.playback-dock #tempo-number-label{display:none!important}.playback-dock #pulse-tempo{min-width:0}.playback-dock #pulse-toggle{padding:8px}.playback-dock #pulse-options summary{padding:8px}.playback-dock .session-tempo .tempo-entry{width:122px}}
@media(max-width:600px){.playback-dock{top:0;display:grid;grid-template-columns:1fr auto;gap:10px;padding:10px;margin-bottom:10px;border-radius:8px}body[data-session=listen] .playback-dock .transport{grid-column:1 / -1;justify-content:center;gap:8px}body[data-session=listen] .playback-dock #reset{position:absolute;left:10px;top:10px;font-size:10px;margin:0}body[data-session=listen] .playback-dock .session-tempo{margin:0}.playback-dock #pulse-controls{justify-content:flex-end}.playback-dock .session-tempo .tempo-entry{width:130px}.playback-dock #tempo-number-label{display:block!important;max-width:68px!important;font-size:8px!important}.playback-dock #pulse-tempo{display:none}.playback-dock #pulse-count-status{top:100%}body.immersive[data-session=listen] #playback-dock{padding:6px 10px;gap:5px}body.immersive[data-session=listen] .playback-dock .transport{grid-column:1}.immersive .playback-dock .session-tempo{grid-column:2;grid-row:1}.immersive .playback-dock #tempo-number-label{display:none!important}.immersive .playback-dock #pulse-controls{grid-column:1 / -1;justify-content:center}.immersive .playback-dock #reset{display:none!important}.immersive .playback-dock #start{min-width:72px!important}}

body[data-session=listen] #session-bar{grid-template-columns:minmax(200px,1fr) auto 150px}body.shared-song #session-bar{display:none}
@media(max-width:600px){body[data-session=listen] #session-bar{grid-template-columns:1fr auto}}
body[data-session=listen] .playback-dock #tempo-number-label{font-size:0!important;max-width:none!important}body[data-session=listen] .playback-dock #tempo-number-label:after{content:'TEMPO';font:9px var(--brand-sans);letter-spacing:.1em;white-space:nowrap}
body.shared-song .playback-dock #pulse-controls{margin:0;padding:0}@media(max-width:600px){body[data-session=listen] .playback-dock .session-tempo{grid-column:1;grid-row:2}body[data-session=listen] .playback-dock #pulse-controls{grid-column:2;grid-row:2;margin:0}body.immersive[data-session=listen] .playback-dock .session-tempo{grid-column:2;grid-row:1}body.immersive[data-session=listen] .playback-dock #pulse-controls{grid-column:1 / -1;grid-row:2}}
