/* The listen-along: one chip to start it, then a player pinned on every page, above everything else. */
body{padding-bottom:calc(96px + env(safe-area-inset-bottom))} /* room at the end of every page, so the player never sits on the last links */
html{scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom))} /* a control reached by keyboard lands above the player */
.day[data-live] .d-credit{margin-right:150px} /* clear of the Listen button */
html[data-listen] .day[data-live] .d-stage{height:calc(100svh - var(--mish-header-h) - 72px)} /* the pinned box stops above the player, so its note and rail stay in the open */
html[data-listen] .pl-stage{--pl-stage:calc(100svh - var(--mish-header-h,64px) - max(16px,env(safe-area-inset-bottom)) - 78px)} /* the pinned samples stop above the tallest player (a two-line title is 75px). The track around them keeps its own height, so opening the player never moves the page */
.listen-chip,.listen-player{position:fixed;z-index:2000;right:var(--listen-right,max(16px,env(safe-area-inset-right)));bottom:max(16px,env(safe-area-inset-bottom));font:var(--mish-weight-semibold) var(--mish-step-small)/1.2 var(--mish-font-body);color:var(--mish-light);border:1px solid var(--mish-edge);background:var(--mish-abyss)}
.listen-chip[hidden],.listen-player[hidden]{display:none}
.listen-chip,.listen-toggle,.opening-listen{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer}
.listen-chip{min-height:var(--mish-target);padding:0 16px;border-radius:var(--mish-radius-control)}
.listen-player{display:flex;align-items:center;gap:12px;width:min(400px,calc(100vw - 32px));padding:8px;border-radius:6px}
.listen-toggle{flex:none;min-width:96px;min-height:48px;padding:0 16px;border:0;border-radius:var(--mish-radius-control);background:var(--mish-mint);color:var(--mish-abyss);font:inherit}
.listen-now{flex:1;min-width:0;margin:0}
.listen-now small{display:block;margin-bottom:2px;color:var(--mish-dim);font-size:.75rem;font-weight:400}
.listen-now span{font-size:14px;line-height:1.2;display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
.listen-close{flex:none;min-width:var(--mish-target);min-height:var(--mish-target);border:0;background:none;color:var(--mish-muted);font:inherit;font-size:22px;line-height:1;cursor:pointer}
.listen-chip svg,.listen-toggle svg,.opening-listen svg{flex:none;width:10px;height:10px}
.listen-chip svg path,.listen-toggle svg path,.opening-listen svg path{fill:currentColor;stroke:none}
.opening-listen{margin-top:10px}
.listen-chip:focus-visible,.listen-player button:focus-visible,.opening-listen:focus-visible{outline:2px solid var(--mish-mint);outline-offset:2px}
@media(max-width:900px){.day[data-live] .d-credit{margin-right:0}html[data-listen] .day[data-live] .d-stage{height:calc(100svh - var(--mish-header-h) - 88px - env(safe-area-inset-bottom))}.listen-chip.is-tucked{display:none}}
@media(prefers-reduced-motion:no-preference){.listen-chip,.listen-player{transition:right .25s}}
@media print{.listen-chip,.listen-player{display:none}}
