.monster-player-root { --player-blue: #00c9ff; --player-bg: #252525; color: #fff; font-family: inherit; }
.monster-player, .monster-player-launcher { transform-origin: bottom right; }
.monster-player-root [inert] { pointer-events: none; }
.monster-player-root [hidden], .monster-player-view [hidden] { display: none !important; }
.monster-player {
    position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom));
    z-index: 1040; width: min(350px, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem);
    overflow-y: auto; border: 1px solid #00c9ff66; border-radius: 18px; background: #252525;
    box-shadow: 0 8px 32px #0008; scrollbar-width: thin; scrollbar-color: #00c9ff #252525;
}
.monster-player-heading { display: flex; justify-content: space-between; align-items: center; padding: .4rem 1rem; }
.monster-player-root button, .monster-player-view button { cursor: pointer; }
.monster-player-heading button { background: transparent; color: #fff; border: 0; font-size: 1.75rem; line-height: 1; min-height: 36px; min-width: 36px; }
.monster-player-eyebrow { display: block; font-size: .65rem; font-weight: 700; letter-spacing: .13em; }
.monster-player-heading .monster-player-eyebrow, .monster-player-copy .monster-player-eyebrow { color: #00c9ff; }
.monster-player-view { --player-blue: #00c9ff; background: #252525; color: white; overflow: hidden; border-radius: inherit; }
.monster-player-artwork { display: block; width: 100%; height: 300px; object-fit: cover; background: #333; }
.monster-player-copy { padding: 1rem 1rem .25rem; text-align: center; }
.monster-player-copy h2 { font-size: 1.1rem; line-height: 1.4; margin: .3rem 0; overflow-wrap: anywhere; }
.monster-player-jocks { font-size: .82rem; color: #ccc; margin: .25rem 0 .75rem; }
[data-player-timeline] { padding: 0 1rem; }
[data-player-seek] { display: block; width: 100%; height: 6px; margin: .75rem 0; border-radius: 10px; appearance: none; cursor: pointer; background: linear-gradient(to right, #00c9ff var(--played, 0%), #555 var(--played, 0%)); }
[data-player-seek]::-webkit-slider-thumb { appearance: none; width: 15px; height: 15px; border-radius: 50%; background: #00c9ff; box-shadow: 0 0 8px #00c9ff66; }
[data-player-seek]::-moz-range-thumb { width: 15px; height: 15px; border: 0; border-radius: 50%; background: #00c9ff; }
.monster-player-times { display: flex; justify-content: space-between; font-size: .75rem; color: #ccc; font-variant-numeric: tabular-nums; }
.monster-player-controls { display: flex; align-items: center; justify-content: center; gap: .7rem; padding: .8rem .7rem .3rem; }
.monster-player-controls button { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-width: 38px; min-height: 44px; border: 0; background: transparent; color: #fff; font-size: 1rem; }
.monster-player-controls button small { font-size: .6rem; line-height: 1.1; }
.monster-player-controls .monster-player-play { background: #00c9ff; color: #141414; width: 52px; height: 52px; border-radius: 50%; }
.monster-player-view button:disabled { opacity: .3; cursor: default; }
.monster-player-status { min-height: 1.2rem; margin: .2rem 1rem .5rem; text-align: center; font-size: .75rem; color: #ccc; }
.monster-player-actions, .monster-queue-heading { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .5rem 1rem; border-top: 1px solid #ffffff1f; }
.monster-player-actions button, .monster-queue-heading button { background: transparent; border: 0; color: #00c9ff; font-size: .8rem; min-height: 36px; }
.monster-player-queue { max-height: 230px; overflow-y: auto; scrollbar-width: thin; }
.monster-player-queue p { padding: .5rem 1rem; font-size: .8rem; color: #ccc; }
.monster-queue-heading { font-size: .8rem; }
.monster-player-queue ol { padding: 0; margin: 0; list-style: none; }
.monster-player-queue li { display: flex; align-items: center; padding: .3rem .7rem; border-top: 1px solid #ffffff12; }
.monster-player-queue li.is-current { background: #00c9ff1a; border-left: 3px solid #00c9ff; }
.monster-player-queue li button { min-height: 36px; background: transparent; border: 0; color: #fff; }
.monster-player-queue [data-player-queue-play] { flex: 1; text-align: left; font-size: .8rem; overflow-wrap: anywhere; }
.monster-player-queue [data-player-queue-remove] { flex: 0 0 36px; font-size: 1.3rem; }
.monster-player-launcher { position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 1040; display: flex; align-items: center; width: min(350px, calc(100vw - 2rem)); border-radius: 16px; background: #00c9ff; color: #10212a; box-shadow: 0 4px 20px #00c9ff44; transition: box-shadow .2s, filter .2s; }
.monster-player-launcher:hover { filter: brightness(1.15); box-shadow: 0 0 24px #00c9ff99; }
.monster-player-launcher button { background: transparent; color: inherit; border: 0; min-height: 60px; }
.monster-player-launcher [data-player-open] { min-width: 0; flex: 1; text-align: left; padding: .7rem 1rem; }
.monster-player-launcher strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; }
.monster-player-launcher [data-player-toggle] { flex: 0 0 55px; border-left: 1px solid #10212a33; }
.monster-player-root button:focus-visible, .monster-player-view button:focus-visible, [data-player-seek]:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
.podcast-player-actions { position: relative; z-index: 3; display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .65rem; }
.podcast-player-actions .btn { font-size: .75rem; }
[data-streaming-player] { max-width: 500px; margin: 1rem auto; border: 1px solid #00c9ff66; border-radius: 18px; overflow: hidden; }
@media (max-height: 750px) { .monster-player .monster-player-artwork { height: min(300px, 30dvh); } }
@media (prefers-reduced-motion: reduce) { .monster-player-launcher { transition: none; } }
.submission-results button { background: none; border: 0; color: inherit; font-size: 1.5rem; }
.monster-player audio { display: block; width: 100%; margin-top: .75rem; }
.submission-results { position: fixed; top: 1rem; right: 1rem; width: min(380px, calc(100vw - 2rem)); z-index: 1090; max-height: 50vh; overflow-y: auto; }
.submission-results > div { padding: 1rem; margin-bottom: .5rem; background: #252525; color: white; border: 2px solid #28a745; border-radius: 12px; }
.submission-results > .result-error { border-color: #ff7070; }
.submission-results button { float: right; margin-left: .5rem; }
/* The JS measures five actual rows, including wrapped labels. */
.custom-select .select-items { height: auto; max-height: var(--select-five-rows, 230px); overflow-y: auto; }

[data-streaming-player].streaming-now-playing { max-width: none; margin: 0 0 1.5rem; border: 1px solid #ffffff20; border-radius: 12px; }
.streaming-show-artwork { display: block; aspect-ratio: 1; object-fit: cover; }
.streaming-jock-image { width: 100%; max-width: 130px; aspect-ratio: 1; object-fit: cover; border-radius: 8px; }
.streaming-card-controls .monster-player-view { border-radius: 0; }