/* Piplo Radio. Approved base swatches; lighter tints support text contrast. */
:root {
  color-scheme: dark;
  --pip-purple: #4d2d65; --pip-green: #ADBF50; --pip-gray: #cdc9c2; --pip-black: #000;
  --bg: #000; --panel: #151315; --surface: #232025; --line: #39343d;
  --ink: #f3f0e8; --muted: #262129; --accent: #ADBF50; --light: #c4a7d6;
  --background: #000; --foreground: #f3f0e8; --card: #151315; --card-foreground: #f3f0e8;
  --popover: #232025; --popover-foreground: #f3f0e8;
  --primary: #ADBF50; --primary-foreground: #11150a;
  --secondary: #29232f; --secondary-foreground: #f3f0e8;
  --muted-foreground: #cdc9c2; --accent-foreground: #11150a;
  --border: #39343d; --input: #514659; --ring: #ADBF50;
}
.brand .piplo-wordmark,.brand-lockup .piplo-wordmark,.studio-brand .piplo-wordmark,
.venue-brand .piplo-wordmark,.brandname .piplo-wordmark {
  display:block; width:72px; height:32px; border-radius:0; object-fit:contain; flex-shrink:0;
}
.settings-title .piplo-wordmark {width:72px;height:32px;object-fit:contain}
.pip-icon,.brand img:not(.piplo-wordmark),.studio-brand img:not(.piplo-wordmark),.venue-brand img:not(.piplo-wordmark) {
  width:48px;height:48px;object-fit:contain;border-radius:12px;flex-shrink:0;background:#000;
}
.brand-lockup {gap:12px;display:flex;align-items:center}
header,.topbar,.studio-header,.venue-header {background:#000;border-color:var(--line)}
.player-screen .brand .piplo-wordmark {width:72px;height:32px}
.player-screen .brand {gap:4px}
.player-screen .header-tagline {font-size:16px}
.player-screen .brand img:not(.piplo-wordmark) {width:64px;height:64px}
.player-screen .top {min-height:80px}
.primary {background:var(--pip-green);border-color:var(--pip-green);color:#11150a}
.primary:hover {background:#bac76a;border-color:#bac76a}
button:hover,.button:hover {background:#302239;border-color:#9570ad}
button.primary:hover,.button.primary:hover {background:#bac76a;border-color:#bac76a}
.placeholder {background:radial-gradient(ellipse at 50% 60%,#281a33 0,#0c090f 60%,#000 100%)}
.player-screen .placeholder img {display:block;width:112px;height:112px;border-radius:24px}
.player-screen .placeholder p {font-size:14px}
.placeholder p a,.placeholder p button {color:#d2b9e1}
.track.current {background:#2b1b35;border-left-color:var(--pip-green)}
.track:hover {background:#241c2a}
.player-screen #next {color:#f3f0e8;border-color:#79558f;background:#4d2d65}
.player-screen #next:hover {background:#654079;border-color:#a280b7}
.player-screen #next:active {background:#79558f}
.spot {background:linear-gradient(135deg,#2b1b35,#151315);border-color:#69417d}
.spot .skip {background:#cdc9c2;border-color:#cdc9c2;color:#24152e}
.notice {background:#24192d;color:#e8ddeb;border-color:#ADBF50}
.warning {background:#292219;color:#eddbba;border-color:var(--warn,#ead098)}
dialog,.dialogtop {background:#151315;border-color:#69417d}
.tablist button.active {background:#4d2d65;color:#f3f0e8;border-color:#9570ad}
.toast {background:#4d2d65;border-color:#9570ad;color:#f3f0e8}
.phone-control {background:#24192d;border-color:#69417d}
.genre-option:has(input:checked) {background:#30391b;outline-color:#ADBF50}
.rotation-controls button[aria-pressed=true] {background:#4d2d65;color:#f3f0e8;border-color:#79558f}
.timebar progress,.timebar progress::-webkit-progress-bar {background:#39343d}
.timebar progress::-webkit-progress-value,.timebar progress::-moz-progress-bar {background:#ADBF50}
.player-screen .queue {scrollbar-color:#79558f transparent}
.player-screen .track .name {font-size:14px}
.player-screen .track .artist {font-size:13px}
.player-screen .songmeta .eyebrow,.player-screen .cardhead h2,.player-screen .ytmark {font-size:12px}
.player-screen .songmeta p {font-size:14px;line-height:1.4}
.player-screen .playerfoot {font-size:12px}
.help,label,.tablist button {font-size:14px}
.player-screen .toplinks .district-trigger,.player-screen #openSetup {font-size:14px}
.audio-studio-page {background:#000;color:#f3f0e8}
.studio-brand,.venue-brand {display:flex;align-items:center;gap:10px}
.studio-header a,.venue-header a {color:#f3f0e8}
.studio-panel,.studio-auto,.studio-loudness,.studio-sample,.studio-batch-file,
.studio-upload,.studio-folder,.studio-account,.studio-voice-message {background:#151315;border-color:#514059;color:#f3f0e8}
.studio-eyebrow,.studio-voice>b,.studio-title>span,.studio-title .studio-owner {color:#c4a7d6}
.studio-panel h2,.studio-panel h3,.studio-panel strong,.studio-field,.studio-check {color:#f3f0e8}
.studio-panel p,.studio-panel small,.studio-fine,.studio-footer,.studio-sliders label,
.studio-totals span,.studio-job-heading p,.studio-owner {color:#cdc9c2}
.studio-field input,.studio-field select,.studio-panel textarea,.studio-music input,
.studio-table-scroll textarea,.studio-voice .studio-field:last-child input {background:#08070a;color:#f3f0e8;border-color:#514659}
.studio-table-scroll th {background:#24192d;color:#cdc9c2;border-color:#514059}
.studio-table-scroll td,.studio-totals,.studio-export,.studio-account,.studio-music td,.studio-music th {border-color:#39343d}
.studio-table-scroll td>small,.studio-table-scroll small {color:#cdc9c2}
.studio-button {background:#ADBF50;color:#11150a;border-color:#ADBF50}
.studio-button:hover {background:#bac76a}
.studio-button.secondary,.studio-small-actions button,.studio-selections button {background:#4d2d65;color:#f3f0e8;border-color:#79558f}
.studio-link,.studio-panel a,.studio-batch-script-list a {color:#c4a7d6}
.studio-status {background:#302239;color:#f3f0e8}
.studio-badge {background:#302239;color:#ddd0e5}
.studio-badge.complete {background:#30391b;color:#d2dfa0}
.studio-badge.running {background:#4d2d65;color:#f3f0e8}
.studio-upload {border-style:dashed}
.studio-upload p,.studio-upload strong,.studio-sample strong,.studio-sliders b {color:#cdc9c2}
.studio-sliders input,.studio-check input,.studio-table-scroll input,.studio-run progress,.studio-batch progress {accent-color:#ADBF50}
/* Legacy district admin keeps its working table layout with Piplo surfaces. */
body:has(.brandname) {--ink:#f3f0e8;--muted:#cdc9c2;--purple:#ADBF50;--deep:#c4a7d6;--pale:#302239;--line:#39343d;--paper:#000;--green:#ADBF50;background:#000}
body:has(.brandname) .panel,body:has(.brandname) .stat,body:has(.brandname) .playlistcard,
body:has(.brandname) .daypart,body:has(.brandname) .modal,body:has(.brandname) input,
body:has(.brandname) select,body:has(.brandname) textarea,body:has(.brandname) button {background:#151315;color:#f3f0e8}
body:has(.brandname) button.primary {background:#ADBF50;color:#11150a;border-color:#ADBF50;box-shadow:none}
body:has(.brandname) .notice,body:has(.brandname) th,body:has(.brandname) .toolbar,body:has(.brandname) .tablefooter {background:#24192d;color:#cdc9c2}
body:has(#form) {background:#000;color:#f3f0e8}
body:has(#form) main {background:#151315;border-color:#514059}
body:has(#form) input {background:#08070a;color:#f3f0e8;border-color:#79558f}
body:has(#form) button {background:#ADBF50;color:#11150a}
body:has(#form) p {color:#cdc9c2}
.song-row.current {background:#2b1b35}
.play-main:hover {background:#bac76a}
.ad-kia {background:#ADBF50;border-color:#ADBF50}
.track-connection,.recording-heading a {color:#bac76a}
.venue.on-route {background:#242a18;border-color:#ADBF50}
@media(max-width:767px),(max-width:950px) and (max-height:500px) {
  .player-screen .top {min-height:64px;padding:5px 10px;gap:8px}
  .player-screen .brand .piplo-wordmark {width:60px;height:26px;display:block}
  .player-screen .brand img:not(.piplo-wordmark) {width:52px;height:52px}
  .player-screen .toplinks {gap:6px;min-width:0}
  .player-screen .district-trigger {min-width:0;max-width:126px;overflow:hidden}
  .player-screen .district-trigger strong {overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .player-screen .toplinks button,.player-screen #openSetup {padding:6px 8px;font-size:14px;min-height:44px}
  .player-screen .placeholder img {display:block;width:92px;height:92px}
  .player-screen .controls-card {flex-shrink:0}
  .studio-brand .piplo-wordmark,.venue-brand .piplo-wordmark {width:64px;height:28px}
}
@media(max-width:380px) {
  .player-screen .brand .piplo-wordmark {width:56px;height:25px}
  .player-screen .brand img:not(.piplo-wordmark) {width:48px;height:48px}
  .player-screen .brand {gap:4px}
  .player-screen .district-trigger {max-width:90px}
  .player-screen .toplinks button,.player-screen #openSetup {padding-inline:6px;font-size:13px}
}

html:has(.player-screen) {--muted:#cdc9c2}

/* Keep the privacy links inside the video panel, below the player. */
.player-screen .music-card {grid-template-rows:auto minmax(0,1fr) auto}
.player-screen .player-terms {display:block;max-width:none;width:100%;margin:0;padding:8px 14px;text-align:center;font-size:12px;line-height:1.5;color:#cdc9c2}
.player-screen .player-terms a,.player-screen .player-terms button {color:#d2b9e1;font-size:inherit;line-height:inherit}
.player-screen #districtPlaylistStatus {min-height:1.3em}
.player-screen [data-radio-admin][hidden] {display:none}
/* Reserve the removed prompt's line even before a song starts. */
.player-screen .songmeta .intro-line {display:block;width:100%;height:20px;min-height:20px;margin:0;overflow-x:auto;overflow-y:hidden;white-space:nowrap;line-height:20px;scrollbar-width:none}
.player-screen .intro-line::-webkit-scrollbar {display:none}
.player-screen .intro-line:focus-visible {outline:1px solid var(--pip-green);outline-offset:2px}
.player-screen #introScript {display:inline-block;white-space:nowrap}
.player-screen .intro-scrolling {overflow-x:hidden}
.player-screen .intro-scrolling #introScript {animation:piplo-intro-scroll var(--intro-duration) linear infinite}
@keyframes piplo-intro-scroll {0%,8% {transform:translateX(0)} 88%,100% {transform:translateX(var(--intro-distance))}}
@media(prefers-reduced-motion:reduce) {.player-screen #introScript {animation:none;transform:none}}

.player-screen .dialogbody {display:block;padding:18px}
.settings-section {padding:0 0 20px;margin:0 0 20px;border-bottom:1px solid var(--line);scroll-margin-top:12px}
.settings-section h3 {margin:0 0 12px}
.settings-section .settings-account-row {margin-bottom:12px}
.settings-section .settings-account-row h3 {margin:0}
.settings-section .dialogactions {margin-top:12px}
.settings-section .help:empty {display:none}
.settings-admin:has(a:not([hidden])) {padding-bottom:18px}
.settings-privacy {font-size:12px;color:#cdc9c2}
.settings-privacy summary {cursor:pointer}
@media(max-width:767px) {.player-screen .dialogbody {padding:14px}.youtube-login-actions > * {flex:1 1 100%;text-align:center}}