/* Shared surfaces for source selection, station cards and playback. */
:is(#sourceRow,#stationHeroSources) .src-pill{position:relative;box-sizing:border-box;display:flex;align-items:center;gap:12px!important;min-height:64px!important;padding:12px 40px 12px 12px!important;border:1px solid var(--ui81-line)!important;border-radius:16px!important;background:var(--ui81-surface)!important;color:var(--ui81-text)!important;box-shadow:none!important;transition:border-color .18s ease,background-color .18s ease!important}
.hero #sourceRow{padding:0!important;gap:10px!important;background:transparent!important}
.hero #sourceRow .src-pill{flex:1 1 220px!important}
:is(#sourceRow,#stationHeroSources) .src-pill-icon{display:grid;place-items:center;width:34px!important;height:34px!important;flex:0 0 34px!important;border-radius:11px;background:var(--ui81-surface-2);color:var(--ui81-text)}
:is(#sourceRow,#stationHeroSources) .src-pill-icon svg{width:20px;height:20px;fill:currentColor}
:is(#sourceRow,#stationHeroSources) .src-pill-main{font-family:'Reddit Sans',sans-serif;font-size:13px!important;line-height:1.35!important;font-weight:750;white-space:normal!important}
:is(#sourceRow,#stationHeroSources) .src-pill-sub{font-family:'Reddit Sans',sans-serif;font-size:11px!important;line-height:1.4!important;opacity:.72;margin-top:4px}
:is(#sourceRow,#stationHeroSources) .src-pill::after{content:'';position:absolute;right:14px;top:50%;width:15px;height:15px;transform:translateY(-50%);border:1px solid currentColor;border-radius:50%;opacity:.35}
:is(#sourceRow,#stationHeroSources) .src-pill[aria-pressed=true]{border-color:var(--ui81-accent)!important;background:color-mix(in srgb,var(--ui81-accent) 10%,var(--ui81-surface))!important}
:is(#sourceRow,#stationHeroSources) .src-pill[aria-pressed=true]::after{content:'✓';display:grid;place-items:center;background:var(--ui81-accent);border-color:var(--ui81-accent);color:var(--ui81-accent-ink);opacity:1;font:800 11px/1 'Reddit Sans',sans-serif}
:is(#sourceRow,#stationHeroSources) .src-pill:focus-visible{outline:3px solid var(--ui81-accent);outline-offset:3px}
#miniPlayer{background:var(--ui81-surface)!important;border-top:1px solid var(--ui81-line)!important;box-shadow:0 -12px 40px #0002!important;border-radius:22px 22px 0 0!important;color:var(--ui81-text)}
#miniPlayer .mini-player-inner{box-sizing:border-box;box-shadow:none!important}
#miniPlayer .mini-art{border-radius:13px!important;overflow:hidden;box-shadow:0 3px 12px #0002}
#miniPlayer .mini-info{min-width:0}
#miniPlayer .mini-station{font-family:'Reddit Sans',sans-serif;font-weight:750;letter-spacing:-.015em}
#miniPlayer .mini-track{line-height:1.45!important;opacity:.8}
#miniPlayer :is(.mini-skip,.mini-icon-btn){border-radius:50%!important;border:1px solid transparent;background:transparent;transition:background-color .18s ease!important}
#miniPlayer :is(.mini-skip,.mini-icon-btn):hover{background:var(--ui81-surface-2)}
#miniPlayer .mini-play{border-radius:50%!important;box-shadow:none!important}
#miniPlayer .mini-live{border-radius:999px!important;background:var(--ui81-surface-2);padding:7px 12px!important;gap:8px;font-family:'Reddit Sans',sans-serif;white-space:nowrap}
#miniPlayer .mini-timeline{padding:8px 24px 14px!important;gap:14px!important;max-width:1180px}
#miniPlayer .mini-track-bar{height:6px!important;background:color-mix(in srgb,var(--ui81-text) 16%,transparent)!important;border-radius:999px!important}
#miniPlayer .mini-track-fill{background:var(--ui81-accent)!important;border-radius:999px!important}
#miniPlayer .mini-track-dot{width:13px!important;height:13px!important;background:var(--ui81-text)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--ui81-accent) 14%,transparent)!important}
#miniPlayer .mini-time{font-family:'Reddit Sans',sans-serif!important;color:var(--ui81-text);opacity:.72;font-weight:600;letter-spacing:.025em}
#miniPlayer button:focus-visible{outline:3px solid var(--ui81-accent);outline-offset:3px}
#replayPanel .replay-inner{background:var(--ui81-surface)!important;color:var(--ui81-text);border:1px solid var(--ui81-line)!important;border-radius:22px!important}
#replayPanel .replay-head{border-bottom:1px solid var(--ui81-line);padding-bottom:14px;margin-bottom:20px}
#replayPanel .replay-clock{font-family:'Reddit Sans',sans-serif;letter-spacing:.02em;font-weight:700}
#replayPanel .replay-scrub{height:64px!important;border-radius:12px;background:var(--ui81-surface-2);border:1px solid var(--ui81-line);margin:20px 0}
#replayPanel .replay-waveform{opacity:.6}
#replayPanel .replay-marker svg{filter:drop-shadow(0 2px 3px #0006)}
#replayPanel .replay-controls{padding-block:8px}
#replayPanel .replay-track-artist{color:var(--ui81-text);opacity:.7}
.replay-queue-inner .replay-queue-item{border:1px solid var(--ui81-line);border-radius:14px;margin:6px 0;padding:12px!important;background:var(--ui81-surface)}
.replay-queue-inner .replay-queue-item.active{border-color:var(--ui81-accent);background:color-mix(in srgb,var(--ui81-accent) 9%,var(--ui81-surface))}
.replay-queue-inner .rqi-cover{border-radius:9px!important;object-fit:cover}
.grid:not(.list-view):not(.brand-view)>.card{border-radius:20px!important;border-color:var(--ui81-line)!important;box-shadow:0 4px 18px #0000000d!important}
.grid:not(.list-view):not(.brand-view)>.card.playing{border-color:var(--ui81-accent)!important}
.grid .card-pill{border-radius:999px!important}
.grid .card-menu-btn{border-radius:50%!important}
@media(min-width:1000px){
 html:not(.simple-player) #miniPlayer .mini-player-inner{max-width:1180px;grid-template-columns:minmax(220px,1fr) auto minmax(280px,1fr);gap:20px;padding:12px 24px 4px!important}
 html:not(.simple-player) #miniPlayer .mini-right{gap:6px}
}
@media(max-width:760px){
 .hero #sourceRow .src-pill{flex-basis:100%!important;min-height:60px!important}
 #miniPlayer .mini-timeline{padding:4px 12px 10px!important;gap:9px!important}
 #miniPlayer .mini-track-bar{height:5px!important}
 #miniPlayer .mini-track-dot{width:11px!important;height:11px!important}
 #miniPlayer .mini-time{font-size:10px!important}
 #miniPlayer .mini-live{padding:5px 9px!important}
 #replayPanel .replay-scrub{height:58px!important;margin-block:16px}
 .replay-queue-inner .replay-queue-item{padding:10px!important}
}
@media(prefers-reduced-motion:reduce){#miniPlayer *,#sourceRow .src-pill,#stationHeroSources .src-pill{transition:none!important}}
.hero #sourceRow::before{flex:0 0 100%;font-size:11px!important;letter-spacing:.1em!important;padding:4px 0 2px;opacity:.7}
#replayPanel .replay-scrub::after{content:'';position:absolute;left:0;right:0;top:50%;height:3px;background:color-mix(in srgb,var(--ui81-text) 24%,transparent);pointer-events:none}
#replayPanel .replay-range{z-index:1}
#replayPanel .replay-range::-webkit-slider-thumb{margin-top:23px;background:var(--ui81-accent);box-shadow:0 0 0 5px color-mix(in srgb,var(--ui81-accent) 15%,transparent)}
#replayPanel .replay-range::-moz-range-thumb{background:var(--ui81-accent)}
@media(max-width:760px){
 .hero #sourceRow{flex-wrap:nowrap!important;overflow-x:auto;scroll-snap-type:x proximity;padding:4px 2px 10px!important;scrollbar-width:thin}
 .hero #sourceRow::before{display:none}
 .hero #sourceRow .src-pill{flex:0 0 86%!important;scroll-snap-align:start}
 #replayPanel .replay-range::-webkit-slider-thumb{margin-top:20px}
}
.hero #sourceRow{justify-content:flex-start!important;align-items:stretch!important}
body:has(.replay-queue-modal.show) :is(.pwa-update-toast,.pwa-install-card,.pwa-app-dock){display:none!important}
