/*
 * COLUCA 2.0 Theme Foundation
 * COLUCA_2_THEME_FOUNDATION_V146
 *
 * Visual-only layer.
 * Developed by Voryniq B.V.
 * Intellectual Property (IE) (c) ELITAD-group Ltd. All rights reserved.
 */

:root {
  --c2-bg: var(--ink-1000, #020811);
  --c2-bg-elevated: color-mix(in srgb, var(--ink-900, #08111b) 92%, white 8%);
  --c2-panel: color-mix(in srgb, var(--ink-900, #08111b) 88%, transparent);
  --c2-panel-strong: color-mix(in srgb, var(--ink-850, #0b121f) 94%, transparent);
  --c2-panel-soft: color-mix(in srgb, var(--ink-800, #101827) 68%, transparent);
  --c2-line: color-mix(in srgb, var(--gold, #8B5CF6) 22%, rgba(255,255,255,.08));
  --c2-line-strong: color-mix(in srgb, var(--gold, #8B5CF6) 44%, rgba(255,255,255,.14));
  --c2-accent: var(--gold, #8B5CF6);
  --c2-accent-soft: var(--gold-300, #22D3EE);
  --c2-text: var(--white, #fff);
  --c2-muted: var(--silver-300, #bfc8d6);
  --c2-radius-xl: 22px;
  --c2-radius-lg: 18px;
  --c2-radius-md: 14px;
  --c2-shadow: 0 18px 60px rgba(0,0,0,.32);
  --c2-shadow-tight: 0 10px 28px rgba(0,0,0,.24);
  --c2-header: calc(64px + var(--safe-area-top, 0px));
  --c2-section-gap: clamp(26px, 3vw, 42px);
  --c2-panel-pad: clamp(14px, 1.8vw, 22px);
  --c2-touch: 48px;
}

html {
  max-width: 100%;
  overflow-x: clip;
  background: var(--c2-bg);
}

body {
  position: relative;
  max-width: 100%;
  overflow-x: clip;
  background:
    radial-gradient(circle at 8% -12%, color-mix(in srgb, var(--c2-accent) 12%, transparent), transparent 34%),
    radial-gradient(circle at 93% 8%, rgba(255,255,255,.035), transparent 30%),
    linear-gradient(180deg, #02070d 0%, var(--c2-bg) 45%, #03070c 100%);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: .32;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 42px 42px;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.28) 60%, transparent);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.28) 60%, transparent);
}

.container,
.admincenter-shell,
.admincenter-main-wrap,
.admincenter-main,
main,
section,
article,
form,
fieldset,
table,
thead,
tbody,
tr,
td,
th {
  min-width: 0;
}

.container {
  width: min(100% - 28px, 1440px);
}

.site-header {
  min-height: var(--c2-header);
  border-bottom: 1px solid var(--c2-line);
  background: rgba(3, 8, 14, .78);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
  box-shadow: 0 8px 26px rgba(0,0,0,.16);
}

.header-inner {
  min-height: var(--c2-header);
  gap: 16px;
}

.brand img,
.admincenter-brand img,
.footer-brand img,
.mini-brand img {
  filter: none !important;
  transform: none !important;
}

.brand {
  gap: 10px;
}

.brand-copy strong {
  letter-spacing: .045em;
}

.main-nav {
  gap: 4px;
}

.main-nav a,
.nav-account,
.language-switcher-toggle,
.nav-weather {
  min-height: 42px;
  border-radius: 12px;
}

.main-nav a[aria-current="page"],
.main-nav a:hover,
.nav-account:hover,
.language-switcher-toggle:hover,
.nav-weather:hover {
  background: rgba(255,255,255,.055);
  box-shadow: inset 0 0 0 1px var(--c2-line);
}

.hero {
  min-height: 0 !important;
  padding-top: calc(var(--c2-header) + 26px) !important;
  padding-bottom: 30px !important;
}

.hero-grid {
  align-items: stretch;
  gap: clamp(18px, 2.5vw, 30px);
}

.hero-copy {
  align-self: center;
}

.hero h1,
.hero-copy h1 {
  max-width: 14ch;
  margin-bottom: 14px;
  font-size: clamp(2rem, 4vw, 3.35rem) !important;
  line-height: .98;
  letter-spacing: -.045em;
}

.hero-copy > p,
.hero p {
  max-width: 58ch;
  font-size: clamp(.98rem, 1.3vw, 1.08rem);
  line-height: 1.55;
}

.hero-actions {
  gap: 10px;
  margin-top: 18px;
}

.hero-trust {
  gap: 8px 14px;
  margin-top: 16px;
}

.hero-preview,
.daily-top-station,
.home-promotion-panel,
.home-podcasts-panel,
.feature-panel,
.account-panel,
.station-card,
.expanded-player-card,
dialog > article,
.account-card,
.settings-card,
.profile-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--c2-line);
  border-radius: var(--c2-radius-xl);
  background:
    linear-gradient(145deg, rgba(255,255,255,.045), transparent 38%),
    var(--c2-panel);
  box-shadow: var(--c2-shadow-tight);
}

.hero-preview::before,
.daily-top-station::before,
.home-promotion-panel::before,
.home-podcasts-panel::before,
.feature-panel::before,
.account-panel::before,
.station-card::before,
.expanded-player-card::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 42%;
  height: 1px;
  background: linear-gradient(90deg, var(--c2-accent), transparent);
  opacity: .78;
  pointer-events: none;
}

.section {
  padding-top: var(--c2-section-gap) !important;
  padding-bottom: var(--c2-section-gap) !important;
}

.section + .section {
  border-top: 1px solid rgba(255,255,255,.025);
}

.section-heading {
  margin-bottom: 16px;
  gap: 12px;
}

.section-heading h2,
.feature-copy h2,
.account-panel h2,
.home-promotion-panel h2,
.home-podcasts-panel h2 {
  font-size: clamp(1.35rem, 2.2vw, 2rem) !important;
  line-height: 1.08;
  letter-spacing: -.025em;
}

.eyebrow {
  font-size: .72rem;
  letter-spacing: .11em;
}

.button,
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  min-height: 42px;
}

.button--large {
  min-height: 46px !important;
  padding-block: 10px !important;
}

.button--gold,
.player-button--primary,
.preview-play-button,
.round-play {
  border-color: color-mix(in srgb, var(--c2-accent) 68%, white 10%);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--c2-accent-soft) 88%, white 6%), var(--c2-accent));
  color: #090b0f;
  box-shadow:
    0 8px 22px color-mix(in srgb, var(--c2-accent) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.32);
}

.button--ghost,
.icon-button,
.player-skip,
.mini-player-button {
  border-color: var(--c2-line);
  background: rgba(255,255,255,.035);
}

.button:hover,
.icon-button:hover,
.player-skip:hover,
.mini-player-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.2);
}

.station-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 218px), 1fr));
  gap: 12px;
}

.station-card {
  padding: 14px !important;
  min-height: 0 !important;
}

.station-card-top,
.station-card-footer {
  gap: 10px;
}

.station-card h2,
.station-card h3 {
  font-size: 1rem !important;
  line-height: 1.2;
}

.station-card p {
  font-size: .82rem;
  line-height: 1.45;
}

.station-logo,
.station-avatar,
.preview-station-logo,
.mini-player-artwork,
.expanded-player-artwork {
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.018);
}

.station-card.is-active {
  border-color: var(--c2-line-strong);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--c2-accent) 16%, transparent),
    0 14px 34px rgba(0,0,0,.26);
}

.home-promotion-panel,
.home-podcasts-panel,
.feature-panel,
.account-panel {
  padding: var(--c2-panel-pad) !important;
  gap: 18px;
}

.home-promotion-panel,
.home-podcasts-panel,
.feature-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(240px, .75fr);
  align-items: center;
}

.feature-visual {
  min-height: 150px !important;
}

.feature-number {
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
}

.player-shell {
  border-top: 1px solid var(--c2-line-strong);
  background: rgba(3, 8, 14, .88);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
  backdrop-filter: blur(22px) saturate(140%);
  box-shadow: 0 -16px 46px rgba(0,0,0,.32);
}

.player-inner {
  min-height: 72px;
  gap: 12px;
}

.player-station {
  min-width: 0;
}

.player-live-details,
.player-station-copy,
.preview-station-copy,
.mini-player-copy {
  min-width: 0;
}

.player-controls,
.player-actions {
  gap: 6px;
}

.player-button--primary {
  width: 48px;
  height: 48px;
}

.icon-button,
.player-skip,
.mini-player-button {
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
}

.mini-player {
  right: max(12px, var(--safe-area-right, 0px));
  bottom: max(12px, var(--safe-area-bottom, 0px));
  width: min(390px, calc(100vw - 24px));
  border: 1px solid var(--c2-line);
  border-radius: 18px;
  background: rgba(4, 9, 15, .92);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  backdrop-filter: blur(20px) saturate(140%);
  box-shadow: var(--c2-shadow);
}

.expanded-player {
  max-width: min(720px, calc(100vw - 24px));
}

.expanded-player-card {
  max-height: min(84dvh, 760px);
  overflow-y: auto;
  padding: clamp(14px, 2vw, 22px);
}

.expanded-player-station {
  display: grid;
  grid-template-columns: minmax(84px, 126px) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

dialog {
  border: 0;
  background: transparent;
}

dialog::backdrop {
  background: rgba(0,0,0,.72);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

input,
select,
textarea {
  border-radius: 12px !important;
  border-color: var(--c2-line) !important;
  background: rgba(255,255,255,.035) !important;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--c2-line-strong) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--c2-accent) 12%, transparent);
}

.site-footer {
  margin-top: 22px !important;
  padding-top: 24px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent),
    rgba(2, 6, 11, .72);
  border-top: 1px solid var(--c2-line);
}

.footer-grid {
  gap: 18px !important;
}

.footer-corporate,
.footer-bottom {
  gap: 12px;
}

/* Admin Center */
.admincenter-body {
  min-height: 100dvh;
  overflow-x: clip;
  background:
    radial-gradient(circle at 100% 0, color-mix(in srgb, var(--c2-accent) 10%, transparent), transparent 30%),
    var(--c2-bg);
}

.admincenter-topbar {
  min-height: 60px;
  border-bottom: 1px solid var(--c2-line);
  background: rgba(3,8,14,.86);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
}

.admincenter-shell {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  min-height: calc(100dvh - 60px);
}

.admincenter-sidebar {
  position: sticky;
  top: 60px;
  align-self: start;
  max-height: calc(100dvh - 60px);
  overflow-y: auto;
  overflow-x: clip;
  padding: 12px;
  border-right: 1px solid var(--c2-line);
  background: rgba(255,255,255,.018);
}

.admincenter-sidebar nav {
  display: grid;
  gap: 5px;
}

.admincenter-sidebar a {
  min-height: 40px;
  display: flex;
  align-items: center;
  border-radius: 11px;
  padding: 8px 11px;
}

.admincenter-sidebar a.is-active {
  border: 1px solid var(--c2-line-strong);
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--c2-accent) 12%, transparent), transparent);
}

.admincenter-main-wrap {
  min-width: 0;
  padding: 14px;
}

.admincenter-main,
.admincenter-main-wrap > main {
  min-width: 0;
}

.admincenter-main > header,
.admincenter-main-wrap > main > header {
  margin-bottom: 12px;
}

.admincenter-body h1 {
  font-size: clamp(1.5rem, 2.4vw, 2.1rem) !important;
}

.admincenter-body h2 {
  font-size: clamp(1.08rem, 1.7vw, 1.45rem) !important;
}

.admincenter-body section,
.admincenter-body article,
.admincenter-body form,
.admincenter-body fieldset,
.admincenter-body .card,
.admincenter-body .panel,
.admincenter-body [class*="-card"],
.admincenter-body [class*="-panel"] {
  border-radius: var(--c2-radius-lg);
}

.admincenter-body section,
.admincenter-body article,
.admincenter-body fieldset {
  border-color: var(--c2-line);
}

.admincenter-body .stats-grid,
.admincenter-body .metric-grid,
.admincenter-body .dashboard-grid,
.admincenter-body .card-grid,
.admincenter-body [class*="stats-grid"],
.admincenter-body [class*="metric-grid"],
.admincenter-body [class*="dashboard-grid"] {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
  gap: 10px;
}

.admincenter-body table {
  width: 100% !important;
  max-width: 100%;
  min-width: 0 !important;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: .82rem;
}

.admincenter-body th,
.admincenter-body td {
  min-width: 0 !important;
  padding: 8px 9px !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: top;
}

.admincenter-body th {
  font-size: .7rem;
  letter-spacing: .045em;
  text-transform: uppercase;
  color: var(--c2-muted);
}

.admincenter-body [class*="table-wrap"],
.admincenter-body [class*="table-container"],
.admincenter-body .table-scroll {
  max-width: 100%;
  overflow-x: clip !important;
}

.admincenter-body form {
  display: grid;
  gap: 10px;
}

.admincenter-body form .button,
.admincenter-body form button {
  justify-self: start;
}

.admincenter-security-note {
  margin-top: 12px;
  padding: 10px;
  border: 1px solid var(--c2-line);
  border-radius: 12px;
  font-size: .74rem;
  line-height: 1.45;
  color: var(--c2-muted);
}

.admincenter-footer {
  border-top: 1px solid var(--c2-line);
  font-size: .72rem;
}

/* Standalone mini-player */
.mini-shell {
  background:
    radial-gradient(circle at 80% 0, color-mix(in srgb, var(--c2-accent) 12%, transparent), transparent 34%),
    #03080e;
}

.mini-header,
.mini-footer,
.mini-device-strip,
.mini-transport,
.mini-services,
.mini-audio-lab,
.mini-volume {
  border-color: var(--c2-line) !important;
}

.mini-display,
.mini-spectrum__screen,
.mini-real-eq {
  border: 1px solid var(--c2-line);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.015);
}

.mini-display__station {
  font-size: clamp(1rem, 3vw, 1.25rem) !important;
}

.mini-service,
.mini-transport button,
.mini-close {
  border-radius: 12px;
}

.mini-transport__play {
  background:
    linear-gradient(180deg, var(--c2-accent-soft), var(--c2-accent)) !important;
  color: #090b0f !important;
}

/* Tablet */
@media (min-width: 761px) and (max-width: 1100px) {
  .container {
    width: min(100% - 24px, 1040px);
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, .9fr);
  }

  .station-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .home-promotion-panel,
  .home-podcasts-panel,
  .feature-panel {
    grid-template-columns: minmax(0, 1fr) minmax(220px, .72fr);
  }

  .admincenter-shell {
    grid-template-columns: 190px minmax(0, 1fr);
  }
}

/* Mobile / PWA */
@media (max-width: 760px) {
  :root {
    --c2-header: calc(58px + var(--safe-area-top, 0px));
    --c2-section-gap: 24px;
    --c2-panel-pad: 14px;
  }

  .container {
    width: min(100% - 20px, 720px);
  }

  .site-header,
  .header-inner {
    min-height: var(--c2-header);
  }

  .hero {
    padding-top: calc(var(--c2-header) + 16px) !important;
    padding-bottom: 18px !important;
  }

  .hero-grid,
  .home-promotion-panel,
  .home-podcasts-panel,
  .feature-panel,
  .account-panel,
  .expanded-player-station {
    grid-template-columns: 1fr !important;
  }

  .hero h1,
  .hero-copy h1 {
    max-width: 12ch;
    font-size: clamp(1.8rem, 9vw, 2.55rem) !important;
  }

  .hero-actions,
  .home-promotion-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .hero-actions .button,
  .home-promotion-actions .button {
    width: 100%;
  }

  .button,
  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    min-height: var(--c2-touch);
  }

  .station-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .station-card {
    padding: 11px !important;
  }

  .station-card h2,
  .station-card h3 {
    font-size: .92rem !important;
  }

  .station-card p,
  .station-more {
    font-size: .76rem !important;
  }

  .main-nav.is-open,
  .main-nav {
    max-width: calc(100vw - 20px);
  }

  .player-shell {
    padding-bottom: max(0px, var(--safe-area-bottom, 0px));
  }

  .player-inner {
    min-height: 68px;
    gap: 8px;
  }

  .player-actions {
    gap: 4px;
  }

  .player-actions .icon-button:nth-of-type(n+5) {
    display: none;
  }

  .volume {
    display: none;
  }

  .mini-player {
    left: 10px;
    right: 10px;
    width: auto;
    bottom: max(10px, var(--safe-area-bottom, 0px));
  }

  .expanded-player {
    max-width: calc(100vw - 14px);
  }

  .expanded-player-card {
    max-height: 88dvh;
    padding: 13px;
  }

  .admincenter-shell {
    display: block;
  }

  .admincenter-topbar {
    min-height: 56px;
  }

  .admincenter-sidebar {
    position: static;
    display: block;
    max-height: none;
    padding: 8px 10px;
    border-right: 0;
    border-bottom: 1px solid var(--c2-line);
    overflow: visible;
  }

  .admincenter-sidebar nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .admincenter-sidebar a {
    min-height: 44px;
    padding: 8px 10px;
  }

  .admincenter-security-note {
    display: none;
  }

  .admincenter-main-wrap {
    padding: 10px;
  }

  .admincenter-body table {
    font-size: .72rem;
  }

  .admincenter-body th,
  .admincenter-body td {
    padding: 6px !important;
  }
}

@media (max-width: 430px) {
  .station-grid {
    grid-template-columns: 1fr 1fr;
  }

  .brand-copy small {
    display: none;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
  }

  .admincenter-sidebar nav {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 1024px) {
  body {
    min-height: 100dvh;
  }

  .site-header {
    padding-top: var(--safe-area-top, 0px);
  }

  .player-shell {
    padding-bottom: var(--safe-area-bottom, 0px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ==========================================================
   COLUCA 2.0 FINAL THEME CORRECTION - v147 V2
   COLUCA_2_BLACK_GOLD_PURPLE_BLUE_V147
   Visual direction:
   deep black / navy + COLUCA gold + controlled purple / electric blue.
   No globe. No poster-look. No gaming-RGB dominance.
   ========================================================== */

:root {
  --c2-black: #03050A !important;
  --c2-bg: #081020 !important;
  --c2-card: #112348 !important;
  --c2-elevated: #152C58 !important;

  --c2-gold: #8B5CF6 !important;
  --c2-gold-hi: #22D3EE !important;

  --c2-purple: #8B3DFF !important;
  --c2-purple-hi: #A855F7 !important;
  --c2-blue: #248CFF !important;
  --c2-cyan: #21B7FF !important;

  --c2-text: #FFFFFF !important;
  --c2-muted: #BFC8D6 !important;

  --c2-line: rgba(212,175,55,.18) !important;
  --c2-line-strong: rgba(212,175,55,.48) !important;
  --c2-tech-line: rgba(36,140,255,.24) !important;
}

html,
body {
  background: #081020 !important;
  color: #FFFFFF !important;
}

body {
  background-image:
    radial-gradient(circle at 15% -6%, rgba(139,61,255,.13), transparent 28%),
    radial-gradient(circle at 88% 4%, rgba(36,140,255,.12), transparent 26%),
    radial-gradient(circle at 50% 100%, rgba(212,175,55,.035), transparent 30%),
    linear-gradient(180deg, #03050A 0%, #081020 30%, #091326 70%, #03050A 100%) !important;
}

/* Remove world / globe completely */
body::before,
body::after,
.hero::before,
.hero::after,
.hero-preview::before,
.hero-preview::after,
.feature-visual::before,
.feature-visual::after,
[class*="world"]::before,
[class*="world"]::after,
[class*="globe"]::before,
[class*="globe"]::after {
  background-image: none !important;
}

[class*="world"],
[class*="globe"] {
  background-image: none !important;
}

/* Core premium glass surfaces */
.site-header,
.player-shell,
.mini-player,
.admincenter-topbar {
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0)),
    rgba(3,5,10,.94) !important;
  border-color: rgba(212,175,55,.18) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.28) !important;
}

.hero-preview,
.daily-top-station,
.home-promotion-panel,
.home-podcasts-panel,
.feature-panel,
.account-panel,
.station-card,
.expanded-player-card,
.account-card,
.settings-card,
.profile-card,
.admincenter-body section,
.admincenter-body article,
.admincenter-body fieldset,
.admincenter-body .card,
.admincenter-body .panel,
.admincenter-body [class*="-card"],
.admincenter-body [class*="-panel"] {
  background:
    linear-gradient(145deg, rgba(168,85,247,.028), transparent 38%),
    linear-gradient(180deg, rgba(36,140,255,.025), transparent 42%),
    #112348 !important;
  border-color: rgba(212,175,55,.16) !important;
  box-shadow:
    0 14px 36px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.025) !important;
}

.expanded-player-card,
.dialog-card,
.admincenter-body [class*="elevated"] {
  background:
    linear-gradient(145deg, rgba(139,61,255,.035), transparent 40%),
    #152C58 !important;
}

/* Text */
h1,h2,h3,h4,
.hero h1,
.section-heading h2,
.station-card h2,
.station-card h3,
.admincenter-body h1,
.admincenter-body h2 {
  color: #FFFFFF !important;
}

p,
small,
.hero p,
.station-card p,
.player-live-details,
.footer-grid p,
.admincenter-body p {
  color: #BFC8D6 !important;
}

/* Luxury gold */
.eyebrow,
.player-kicker,
.station-state,
.text-link,
.footer-release strong,
.footer-release time {
  color: #8B5CF6 !important;
}

.button--gold,
.player-button--primary,
.preview-play-button,
.round-play,
.mini-transport__play {
  color: #03050A !important;
  border-color: #8B5CF6 !important;
  background:
    linear-gradient(180deg, #22D3EE 0%, #8B5CF6 100%) !important;
  box-shadow:
    0 8px 22px rgba(212,175,55,.18),
    0 0 0 1px rgba(245,214,107,.07) !important;
}

/* Controlled tech accents: purple + electric blue */
.player-progress,
.preview-wave,
.mini-spectrum__peak,
[data-eq-active],
.is-tech-active,
.is-streaming,
.is-online {
  background:
    linear-gradient(90deg, #8B3DFF 0%, #248CFF 55%, #21B7FF 100%) !important;
}

.player-progress::before,
.player-progress::after,
.preview-wave::before,
.preview-wave::after {
  background:
    linear-gradient(90deg, #A855F7 0%, #248CFF 55%, #21B7FF 100%) !important;
}

.station-card.is-active {
  border-color: rgba(245,214,107,.56) !important;
  box-shadow:
    0 0 0 1px rgba(212,175,55,.12),
    0 0 28px rgba(139,61,255,.08),
    0 14px 34px rgba(0,0,0,.28) !important;
}

.station-card.is-active .station-state,
.station-card.is-active .player-kicker,
.is-selected,
[aria-selected="true"] {
  color: #22D3EE !important;
}

.button--ghost,
.icon-button,
.player-skip,
.mini-player-button,
.mini-service,
.admincenter-sidebar a,
input,
select,
textarea {
  color: #FFFFFF !important;
  background: rgba(17,35,72,.82) !important;
  border-color: rgba(212,175,55,.20) !important;
}

.button--ghost:hover,
.icon-button:hover,
.player-skip:hover,
.mini-player-button:hover,
.mini-service:hover,
.admincenter-sidebar a:hover {
  background:
    linear-gradient(145deg, rgba(139,61,255,.07), rgba(36,140,255,.05)),
    #152C58 !important;
  border-color: rgba(36,140,255,.34) !important;
  box-shadow:
    0 0 20px rgba(36,140,255,.08),
    0 8px 18px rgba(0,0,0,.18) !important;
}

/* Station art remains clean and neutral */
.station-logo,
.station-avatar,
.preview-station-logo,
.mini-player-artwork,
.expanded-player-artwork {
  background: #0D1B36 !important;
  border-color: rgba(212,175,55,.14) !important;
}

/* Player */
.player-shell {
  border-top: 1px solid rgba(212,175,55,.30) !important;
}

.volume,
.mini-real-eq input[type="range"] {
  accent-color: #8B5CF6 !important;
}

/* Mini-player: preserve layout and structure */
.mini-shell {
  background:
    radial-gradient(circle at 15% 0, rgba(139,61,255,.08), transparent 28%),
    radial-gradient(circle at 90% 0, rgba(36,140,255,.08), transparent 26%),
    #03050A !important;
}

.mini-header,
.mini-footer,
.mini-device-strip,
.mini-transport,
.mini-services,
.mini-audio-lab,
.mini-volume {
  border-color: rgba(212,175,55,.16) !important;
}

.mini-display,
.mini-spectrum__screen,
.mini-real-eq {
  background:
    linear-gradient(145deg, rgba(139,61,255,.035), rgba(36,140,255,.025)),
    #112348 !important;
  border-color: rgba(36,140,255,.20) !important;
}

.mini-spectrum__bar {
  background:
    linear-gradient(180deg, #21B7FF 0%, #248CFF 48%, #8B3DFF 100%) !important;
}

/* Admin Center */
.admincenter-body {
  background:
    radial-gradient(circle at 100% 0, rgba(36,140,255,.08), transparent 28%),
    radial-gradient(circle at 0 0, rgba(139,61,255,.07), transparent 24%),
    #081020 !important;
}

.admincenter-sidebar {
  background:
    linear-gradient(180deg, rgba(139,61,255,.02), rgba(36,140,255,.02)),
    #0A162D !important;
  border-color: rgba(212,175,55,.16) !important;
}

.admincenter-sidebar a.is-active {
  background:
    linear-gradient(90deg, rgba(139,61,255,.12), rgba(36,140,255,.09), rgba(212,175,55,.05)) !important;
  border-color: rgba(36,140,255,.32) !important;
  color: #FFFFFF !important;
}

.admincenter-body table {
  background: #112348 !important;
}

.admincenter-body thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  color: #22D3EE !important;
  background:
    linear-gradient(90deg, rgba(139,61,255,.045), rgba(36,140,255,.04)),
    #152C58 !important;
}

.admincenter-body tbody tr:hover td {
  background: rgba(21,44,88,.76) !important;
}

/* Search */
input[type="search"],
.search-input,
[data-search] {
  background:
    linear-gradient(90deg, rgba(139,61,255,.025), rgba(36,140,255,.02)),
    #112348 !important;
  color: #FFFFFF !important;
  border-color: rgba(36,140,255,.22) !important;
}

input[type="search"]:focus,
.search-input:focus {
  border-color: rgba(36,140,255,.48) !important;
  box-shadow:
    0 0 0 3px rgba(36,140,255,.08),
    0 0 18px rgba(139,61,255,.06) !important;
}

input[type="search"]::placeholder,
.search-input::placeholder {
  color: #BFC8D6 !important;
}

/* Footer */
.site-footer {
  background: #03050A !important;
  border-color: rgba(212,175,55,.16) !important;
}

/* Mobile / PWA */
@media (max-width: 760px) {
  .button,
  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    min-height: 48px !important;
  }

  .hero-preview,
  .home-promotion-panel,
  .home-podcasts-panel,
  .feature-panel,
  .account-panel,
  .station-card {
    border-radius: 20px !important;
  }

  .mini-player {
    background:
      linear-gradient(145deg, rgba(139,61,255,.04), rgba(36,140,255,.035)),
      rgba(3,5,10,.98) !important;
  }
}

/* Tablet */
@media (min-width: 761px) and (max-width: 1100px) {
  .hero-grid,
  .station-grid,
  .admincenter-main-wrap {
    min-width: 0 !important;
  }
}

/* Standalone PWA */
@media (max-width: 1024px) {
  html,
  body,
  .site-header,
  .player-shell {
    background-color: #081020 !important;
  }
}

/* ==========================================================
   COLUCA 2.0 PWA NATIVE APP LAYOUT - v148
   COLUCA_2_PWA_NATIVE_APP_V148

   UI palette:
   #03050A deep black
   #081020 deep navy
   #0D1630 near-black navy
   #111B36 card base
   #171E3E elevated
   #8B3DFF premium purple
   #A855F7 electric purple
   #248CFF electric blue
   #21B7FF cyan
   #FFFFFF primary
   #BFC8D6 secondary

   Gold is intentionally excluded from UI.
   Existing logo asset remains unchanged.
   ========================================================== */

@media (max-width: 760px) {
  html,
  body {
    background:
      radial-gradient(circle at 12% -4%, rgba(139,61,255,.13), transparent 30%),
      radial-gradient(circle at 92% 2%, rgba(36,140,255,.12), transparent 28%),
      linear-gradient(180deg, #03050A 0%, #081020 46%, #03050A 100%) !important;
    color: #FFFFFF !important;
    overflow-x: hidden !important;
  }

  body {
    padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body::before,
  body::after,
  .hero::before,
  .hero::after,
  .hero-preview::before,
  .hero-preview::after,
  [class*="world"]::before,
  [class*="world"]::after,
  [class*="globe"]::before,
  [class*="globe"]::after {
    content: none !important;
    background-image: none !important;
  }

  [class*="world"],
  [class*="globe"] {
    background-image: none !important;
  }

  /* App shell */
  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    min-height: 60px !important;
    padding:
      calc(8px + env(safe-area-inset-top, 0px))
      14px
      8px !important;
    background: rgba(3,5,10,.90) !important;
    border-bottom: 1px solid rgba(36,140,255,.14) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.30) !important;
    backdrop-filter: blur(18px) saturate(125%) !important;
  }

  .site-header .container,
  .site-header__inner,
  .header-inner {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }

  .site-header nav:not(.bottom-nav):not(.mobile-bottom-nav):not(.pwa-bottom-nav) {
    max-width: 48% !important;
    overflow: hidden !important;
  }

  /* Hero becomes native Now Playing screen, not a website hero */
  .hero {
    min-height: 0 !important;
    padding: 12px 12px 0 !important;
    background: transparent !important;
  }

  .hero-grid,
  .hero__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .hero-copy,
  .hero__copy {
    order: 2 !important;
    padding: 0 2px 4px !important;
  }

  .hero-preview,
  .hero__preview {
    order: 1 !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 22px !important;
    background:
      linear-gradient(145deg, rgba(139,61,255,.055), rgba(36,140,255,.035)),
      #111B36 !important;
    border: 1px solid rgba(36,140,255,.18) !important;
    box-shadow:
      0 22px 46px rgba(0,0,0,.32),
      0 0 30px rgba(139,61,255,.05) !important;
    overflow: hidden !important;
  }

  .hero h1,
  .hero-copy h1 {
    font-size: clamp(1.45rem, 8vw, 2.2rem) !important;
    line-height: 1.03 !important;
    letter-spacing: -.035em !important;
    margin: 0 0 8px !important;
    color: #FFFFFF !important;
  }

  .hero p,
  .hero-copy p {
    font-size: .95rem !important;
    line-height: 1.38 !important;
    color: #BFC8D6 !important;
    margin: 0 !important;
  }

  .hero .eyebrow,
  .player-kicker,
  .station-state,
  .mini-status {
    color: #A855F7 !important;
  }

  /* Now playing artwork / player card */
  .expanded-player-card,
  .player-card,
  .now-playing-card,
  .hero-preview {
    border-radius: 22px !important;
  }

  .expanded-player-artwork,
  .preview-artwork,
  .now-playing-artwork,
  .hero-preview img {
    width: 100% !important;
    aspect-ratio: 1.18 / 1 !important;
    object-fit: cover !important;
    border-radius: 18px !important;
    background: #0D1630 !important;
  }

  .player-live-details,
  .expanded-player-copy,
  .preview-copy {
    padding: 12px 2px 4px !important;
  }

  /* Transport */
  .player-controls,
  .expanded-player-controls,
  .preview-controls,
  .mini-transport {
    display: grid !important;
    grid-template-columns: 48px 1fr 48px !important;
    align-items: center !important;
    justify-items: center !important;
    gap: 10px !important;
  }

  .player-button--primary,
  .preview-play-button,
  .round-play,
  .mini-transport__play {
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
    min-height: 62px !important;
    border-radius: 50% !important;
    color: #FFFFFF !important;
    background:
      radial-gradient(circle at 35% 25%, rgba(255,255,255,.18), transparent 34%),
      linear-gradient(145deg, #8B3DFF 0%, #248CFF 68%, #21B7FF 100%) !important;
    border: 1px solid rgba(168,85,247,.52) !important;
    box-shadow:
      0 0 0 4px rgba(139,61,255,.06),
      0 0 26px rgba(139,61,255,.24),
      0 0 34px rgba(36,140,255,.14) !important;
  }

  .player-skip,
  .icon-button,
  .mini-player-button,
  .mini-service {
    color: #FFFFFF !important;
    background: rgba(13,22,48,.82) !important;
    border: 1px solid rgba(36,140,255,.16) !important;
  }

  .player-progress,
  .progress-bar,
  .mini-spectrum__peak {
    background:
      linear-gradient(90deg, #8B3DFF 0%, #248CFF 62%, #21B7FF 100%) !important;
  }

  .volume,
  .mini-real-eq input[type="range"] {
    accent-color: #248CFF !important;
  }

  /* App content sections */
  main,
  .main-content,
  .page-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  section {
    margin-top: 14px !important;
    margin-bottom: 14px !important;
  }

  .section-heading,
  .social-panel-heading {
    margin-bottom: 9px !important;
    align-items: center !important;
  }

  .section-heading h2,
  .social-panel-heading h2 {
    font-size: 1.02rem !important;
    line-height: 1.2 !important;
    letter-spacing: -.01em !important;
    color: #FFFFFF !important;
  }

  /* Station list should feel like app rows, not desktop cards */
  .station-grid,
  .stations-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  .station-card {
    min-height: 70px !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) 36px !important;
    align-items: center !important;
    gap: 11px !important;
    padding: 9px 10px !important;
    border-radius: 16px !important;
    background:
      linear-gradient(90deg, rgba(139,61,255,.025), rgba(36,140,255,.018)),
      #111B36 !important;
    border: 1px solid rgba(36,140,255,.11) !important;
    box-shadow: none !important;
  }

  .station-card:hover,
  .station-card:active,
  .station-card.is-active {
    background:
      linear-gradient(90deg, rgba(139,61,255,.08), rgba(36,140,255,.055)),
      #171E3E !important;
    border-color: rgba(36,140,255,.32) !important;
    box-shadow: 0 0 24px rgba(139,61,255,.07) !important;
  }

  .station-logo,
  .station-avatar {
    width: 52px !important;
    height: 52px !important;
    border-radius: 13px !important;
    object-fit: contain !important;
    background: #0D1630 !important;
    border: 1px solid rgba(255,255,255,.055) !important;
  }

  .station-card h2,
  .station-card h3 {
    font-size: .96rem !important;
    line-height: 1.15 !important;
    margin: 0 0 3px !important;
    color: #FFFFFF !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .station-card p {
    font-size: .78rem !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    color: #BFC8D6 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Compact premium cards */
  .home-promotion-panel,
  .home-podcasts-panel,
  .feature-panel,
  .account-panel,
  .settings-card,
  .profile-card {
    border-radius: 18px !important;
    padding: 14px !important;
    background:
      linear-gradient(145deg, rgba(139,61,255,.035), rgba(36,140,255,.025)),
      #111B36 !important;
    border: 1px solid rgba(36,140,255,.12) !important;
    box-shadow: none !important;
  }

  /* Search looks like native app search */
  input[type="search"],
  .search-input,
  [data-search] {
    min-height: 44px !important;
    border-radius: 14px !important;
    padding: 0 14px !important;
    color: #FFFFFF !important;
    background: rgba(13,22,48,.94) !important;
    border: 1px solid rgba(36,140,255,.16) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
  }

  input[type="search"]:focus,
  .search-input:focus {
    border-color: rgba(36,140,255,.42) !important;
    box-shadow:
      0 0 0 3px rgba(36,140,255,.07),
      0 0 18px rgba(139,61,255,.06) !important;
  }

  /* Bottom navigation: style any existing mobile/PWA nav as native app bar */
  .bottom-nav,
  .mobile-bottom-nav,
  .pwa-bottom-nav,
  nav[aria-label*="bottom" i],
  nav[aria-label*="mobile" i] {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    z-index: 999 !important;
    min-height: 64px !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    padding: 7px 8px !important;
    border-radius: 20px !important;
    background: rgba(3,5,10,.94) !important;
    border: 1px solid rgba(36,140,255,.17) !important;
    box-shadow:
      0 18px 42px rgba(0,0,0,.42),
      0 0 28px rgba(139,61,255,.06) !important;
    backdrop-filter: blur(20px) saturate(130%) !important;
  }

  .bottom-nav a,
  .mobile-bottom-nav a,
  .pwa-bottom-nav a,
  nav[aria-label*="bottom" i] a,
  nav[aria-label*="mobile" i] a {
    min-width: 0 !important;
    min-height: 50px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    border-radius: 14px !important;
    color: #8F9BB2 !important;
    font-size: .68rem !important;
    text-decoration: none !important;
  }

  .bottom-nav a.is-active,
  .bottom-nav a[aria-current="page"],
  .mobile-bottom-nav a.is-active,
  .mobile-bottom-nav a[aria-current="page"],
  .pwa-bottom-nav a.is-active,
  .pwa-bottom-nav a[aria-current="page"],
  nav[aria-label*="bottom" i] a[aria-current="page"],
  nav[aria-label*="mobile" i] a[aria-current="page"] {
    color: #FFFFFF !important;
    background:
      linear-gradient(145deg, rgba(139,61,255,.12), rgba(36,140,255,.10)) !important;
    box-shadow: inset 0 0 0 1px rgba(36,140,255,.12) !important;
  }

  /* Footer should not feel like a desktop footer inside an app */
  .site-footer {
    margin-top: 18px !important;
    padding: 18px 12px calc(96px + env(safe-area-inset-bottom, 0px)) !important;
    background: #03050A !important;
    border-top: 1px solid rgba(36,140,255,.08) !important;
  }

  .footer-grid {
    gap: 12px !important;
  }

  /* Absolutely no gold in mobile UI except logo image itself */
  .button--gold,
  .eyebrow,
  .player-kicker,
  .station-state,
  .text-link,
  .footer-release strong,
  .footer-release time,
  .admincenter-body th,
  .mini-status,
  .mini-display__top,
  .mini-spectrum__mode {
    color: #A855F7 !important;
  }

  .button--gold {
    color: #FFFFFF !important;
    background:
      linear-gradient(145deg, #8B3DFF 0%, #248CFF 70%, #21B7FF 100%) !important;
    border-color: rgba(36,140,255,.32) !important;
  }
}

/* Tablet PWA: app layout, not scaled desktop */
@media (min-width: 761px) and (max-width: 1100px) {
  html,
  body {
    background:
      radial-gradient(circle at 10% 0%, rgba(139,61,255,.10), transparent 30%),
      radial-gradient(circle at 90% 0%, rgba(36,140,255,.10), transparent 28%),
      #081020 !important;
  }

  .hero-grid,
  .hero__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr) !important;
    gap: 18px !important;
  }

  .station-grid,
  .stations-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .station-card,
  .hero-preview,
  .home-promotion-panel,
  .home-podcasts-panel,
  .feature-panel,
  .account-panel {
    border-radius: 20px !important;
  }
}

/* Standalone PWA: remove browser-page feel */
@media (max-width: 1024px) {
  html,
  body {
    overscroll-behavior-y: none !important;
    background-color: #03050A !important;
  }

  .site-header {
    padding-top: calc(8px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* COLUCA_2_TOTAL_UI_ALIGNMENT_V149
   FINAL STYLE:
   black/navy + purple/violet + electric blue/cyan + white/grey.
   NO GOLD UI. Existing logo asset stays untouched.
   Decorative globe/world visuals remain removed.
   Functional listener maps remain allowed.
*/

:root {
  --c3-black: #02040A !important;
  --c3-black-2: #030712 !important;
  --c3-navy: #07101F !important;
  --c3-panel: #0B1730 !important;
  --c3-elevated: #0F1E3C !important;
  --c3-active: #151F46 !important;
  --c3-purple: #7C3AED !important;
  --c3-violet: #8B5CF6 !important;
  --c3-blue: #2563EB !important;
  --c3-cyan-blue: #0EA5E9 !important;
  --c3-cyan: #22D3EE !important;
  --c3-text: #FFFFFF !important;
  --c3-secondary: #D6DCE8 !important;
  --c3-muted: #92A0B8 !important;
}

html,
body {
  background:
    radial-gradient(circle at 18% -8%, rgba(124,58,237,.09), transparent 28%),
    radial-gradient(circle at 92% -4%, rgba(37,99,235,.09), transparent 28%),
    linear-gradient(180deg, #02040A 0%, #030712 48%, #02040A 100%) !important;
  color: #FFFFFF !important;
  overflow-x: hidden !important;
}

body::before,
body::after,
.hero::before,
.hero::after,
.hero-preview::before,
.hero-preview::after,
.feature-visual::before,
.feature-visual::after,
[class*="world-hero"]::before,
[class*="world-hero"]::after,
[class*="promo-globe"]::before,
[class*="promo-globe"]::after {
  content: none !important;
  background-image: none !important;
}

.site-header,
.player-shell,
.mini-player,
.admincenter-topbar,
.admincenter-sidebar,
.site-footer {
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0)),
    rgba(2,4,10,.94) !important;
  border-color: rgba(37,99,235,.20) !important;
}

.station-card,
.hero-preview,
.daily-top-station,
.home-promotion-panel,
.home-podcasts-panel,
.feature-panel,
.account-panel,
.expanded-player-card,
.account-card,
.settings-card,
.profile-card,
.admincenter-body section,
.admincenter-body article,
.admincenter-body fieldset,
.admincenter-body .card,
.admincenter-body .panel,
.admincenter-body [class*="-card"],
.admincenter-body [class*="-panel"] {
  background:
    linear-gradient(145deg, rgba(124,58,237,.025), rgba(37,99,235,.018)),
    #0B1730 !important;
  border: 1px solid rgba(37,99,235,.17) !important;
  box-shadow:
    0 16px 34px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.018) !important;
}

h1,h2,h3,h4,
.hero h1,
.section-heading h2,
.station-card h2,
.station-card h3,
.admincenter-body h1,
.admincenter-body h2,
.admincenter-body h3 {
  color: #FFFFFF !important;
}

p,
small,
.hero p,
.station-card p,
.player-live-details,
.footer-grid p,
.admincenter-body p {
  color: #D6DCE8 !important;
}

/* No gold UI anywhere. */
.button--gold,
.eyebrow,
.player-kicker,
.station-state,
.text-link,
.footer-release strong,
.footer-release time,
.admincenter-body th,
.mini-status,
.mini-display__top,
.mini-spectrum__mode {
  color: #8B5CF6 !important;
}

.button--gold,
.player-button--primary,
.preview-play-button,
.round-play,
.mini-transport__play {
  color: #FFFFFF !important;
  border-color: rgba(139,92,246,.48) !important;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.12), transparent 35%),
    linear-gradient(145deg, #7C3AED 0%, #2563EB 66%, #0EA5E9 100%) !important;
  box-shadow:
    0 0 0 3px rgba(124,58,237,.055),
    0 0 24px rgba(124,58,237,.17),
    0 0 32px rgba(37,99,235,.10) !important;
}

.button--ghost,
.icon-button,
.player-skip,
.mini-player-button,
.mini-service,
.admincenter-sidebar a,
input,
select,
textarea {
  color: #FFFFFF !important;
  background: rgba(11,23,48,.86) !important;
  border-color: rgba(37,99,235,.17) !important;
}

.button--ghost:hover,
.icon-button:hover,
.player-skip:hover,
.mini-player-button:hover,
.mini-service:hover,
.admincenter-sidebar a:hover {
  background:
    linear-gradient(145deg, rgba(124,58,237,.09), rgba(37,99,235,.065)),
    #0F1E3C !important;
  border-color: rgba(37,99,235,.36) !important;
}

.player-progress,
.preview-wave,
.mini-spectrum__peak,
[data-health="healthy"],
[data-status="active"] {
  background:
    linear-gradient(90deg, #7C3AED 0%, #2563EB 54%, #22D3EE 100%) !important;
}

/* DESKTOP WEBSITE - compact radio dashboard */
@media (min-width: 1101px) {
  .site-header {
    min-height: 66px !important;
    padding: 9px 20px !important;
    backdrop-filter: blur(18px) saturate(120%) !important;
  }

  .site-header .container,
  .site-header__inner,
  .header-inner {
    max-width: none !important;
    width: 100% !important;
  }

  main,
  .main-content,
  .page-content {
    max-width: 1480px !important;
    width: calc(100% - 30px) !important;
    margin: 0 auto !important;
    padding: 12px 0 16px !important;
  }

  .hero {
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 0 10px !important;
    background: transparent !important;
  }

  .hero-grid,
  .hero__grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.75fr) minmax(250px, .75fr) !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  .hero-copy,
  .hero__copy {
    min-height: 0 !important;
    padding: 16px !important;
    border-radius: 16px !important;
    background:
      linear-gradient(145deg, rgba(124,58,237,.025), rgba(37,99,235,.02)),
      #0B1730 !important;
    border: 1px solid rgba(37,99,235,.17) !important;
  }

  .hero h1,
  .hero-copy h1 {
    font-size: clamp(2rem, 3vw, 3.1rem) !important;
    line-height: 1 !important;
    margin: 0 0 7px !important;
    letter-spacing: -.04em !important;
  }

  .hero-preview,
  .hero__preview {
    min-height: 0 !important;
    border-radius: 16px !important;
  }

  .home-layout,
  .dashboard-grid,
  .content-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(280px, .82fr) !important;
    gap: 10px !important;
    align-items: start !important;
  }

  .station-grid,
  .stations-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .station-card {
    min-width: 0 !important;
    padding: 9px !important;
    border-radius: 13px !important;
  }

  .station-logo,
  .station-avatar {
    width: 100% !important;
    max-width: 70px !important;
    aspect-ratio: 1 !important;
    object-fit: contain !important;
    border-radius: 11px !important;
    background: #07101F !important;
  }

  .section-heading {
    margin-bottom: 7px !important;
  }

  .section-heading h2 {
    font-size: 1rem !important;
  }

  .player-shell {
    min-height: 70px !important;
    border-top: 1px solid rgba(37,99,235,.20) !important;
  }

  .site-footer {
    margin-top: 12px !important;
    padding: 22px 28px !important;
    border-top: 1px solid rgba(37,99,235,.14) !important;
  }
}

/* PWA / MOBILE - native app */
@media (max-width: 760px) {
  html,
  body {
    background:
      radial-gradient(circle at 12% -4%, rgba(124,58,237,.14), transparent 28%),
      radial-gradient(circle at 92% 0%, rgba(37,99,235,.13), transparent 27%),
      linear-gradient(180deg, #02040A 0%, #07101F 48%, #02040A 100%) !important;
  }

  body {
    padding-bottom: calc(86px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 200 !important;
    min-height: 58px !important;
    padding:
      calc(7px + env(safe-area-inset-top, 0px))
      11px
      7px !important;
    background: rgba(2,4,10,.91) !important;
    backdrop-filter: blur(20px) saturate(130%) !important;
  }

  .site-header .container,
  .site-header__inner,
  .header-inner {
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
  }

  .hero {
    padding: 9px 9px 0 !important;
    margin: 0 !important;
  }

  .hero-grid,
  .hero__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .hero-preview,
  .hero__preview {
    order: 1 !important;
    width: 100% !important;
    min-height: 0 !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    background:
      linear-gradient(145deg, rgba(124,58,237,.06), rgba(37,99,235,.04)),
      #0B1730 !important;
  }

  .hero-copy,
  .hero__copy {
    order: 2 !important;
    padding: 0 2px !important;
  }

  .hero h1,
  .hero-copy h1 {
    font-size: clamp(1.35rem, 7vw, 1.95rem) !important;
    line-height: 1.05 !important;
    margin: 0 0 4px !important;
  }

  .hero p,
  .hero-copy p {
    font-size: .86rem !important;
    line-height: 1.34 !important;
    margin: 0 !important;
  }

  .expanded-player-artwork,
  .preview-artwork,
  .now-playing-artwork,
  .hero-preview img {
    width: 100% !important;
    aspect-ratio: 1.25 / 1 !important;
    object-fit: cover !important;
    border-radius: 16px !important;
  }

  .player-controls,
  .expanded-player-controls,
  .preview-controls,
  .mini-transport {
    display: grid !important;
    grid-template-columns: 44px 1fr 44px !important;
    align-items: center !important;
    justify-items: center !important;
    gap: 8px !important;
  }

  .player-button--primary,
  .preview-play-button,
  .round-play,
  .mini-transport__play {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    border-radius: 50% !important;
  }

  main,
  .main-content,
  .page-content {
    width: 100% !important;
    max-width: none !important;
    padding-left: 9px !important;
    padding-right: 9px !important;
  }

  section {
    margin-top: 11px !important;
    margin-bottom: 11px !important;
  }

  .station-grid,
  .stations-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  .station-card {
    min-height: 66px !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) 32px !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 8px 9px !important;
    border-radius: 14px !important;
    box-shadow: none !important;
  }

  .station-logo,
  .station-avatar {
    width: 48px !important;
    height: 48px !important;
    border-radius: 11px !important;
    object-fit: contain !important;
    background: #07101F !important;
  }

  .station-card h2,
  .station-card h3 {
    font-size: .91rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin: 0 0 2px !important;
  }

  .station-card p {
    font-size: .74rem !important;
    color: #92A0B8 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin: 0 !important;
  }

  .home-promotion-panel,
  .home-podcasts-panel,
  .feature-panel,
  .account-panel,
  .settings-card,
  .profile-card {
    padding: 11px !important;
    border-radius: 16px !important;
    box-shadow: none !important;
  }

  input[type="search"],
  .search-input,
  [data-search] {
    min-height: 42px !important;
    border-radius: 13px !important;
    padding: 0 13px !important;
    background: rgba(7,16,31,.94) !important;
    border-color: rgba(37,99,235,.18) !important;
  }

  .bottom-nav,
  .mobile-bottom-nav,
  .pwa-bottom-nav,
  nav[aria-label*="bottom" i],
  nav[aria-label*="mobile" i] {
    position: fixed !important;
    left: 7px !important;
    right: 7px !important;
    bottom: max(7px, env(safe-area-inset-bottom, 0px)) !important;
    z-index: 999 !important;
    min-height: 63px !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    padding: 6px 7px !important;
    border-radius: 19px !important;
    background: rgba(2,4,10,.95) !important;
    border: 1px solid rgba(37,99,235,.18) !important;
    box-shadow:
      0 18px 40px rgba(0,0,0,.42),
      0 0 26px rgba(124,58,237,.055) !important;
    backdrop-filter: blur(20px) saturate(130%) !important;
  }

  .bottom-nav a,
  .mobile-bottom-nav a,
  .pwa-bottom-nav a,
  nav[aria-label*="bottom" i] a,
  nav[aria-label*="mobile" i] a {
    min-height: 49px !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 2px !important;
    border-radius: 13px !important;
    color: #92A0B8 !important;
    font-size: .65rem !important;
    text-decoration: none !important;
  }

  .bottom-nav a.is-active,
  .bottom-nav a[aria-current="page"],
  .mobile-bottom-nav a.is-active,
  .mobile-bottom-nav a[aria-current="page"],
  .pwa-bottom-nav a.is-active,
  .pwa-bottom-nav a[aria-current="page"] {
    color: #FFFFFF !important;
    background:
      linear-gradient(145deg, rgba(124,58,237,.15), rgba(37,99,235,.12)) !important;
  }

  .site-footer {
    padding-bottom: calc(94px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* TABLET */
@media (min-width: 761px) and (max-width: 1100px) {
  .hero-grid,
  .hero__grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr) !important;
    gap: 12px !important;
  }

  .station-grid,
  .stations-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
}

/* ADMIN CENTER - dense operations dashboard */
.admincenter-body {
  background:
    radial-gradient(circle at 15% -6%, rgba(124,58,237,.08), transparent 26%),
    radial-gradient(circle at 90% -5%, rgba(37,99,235,.08), transparent 27%),
    #02040A !important;
  color: #FFFFFF !important;
}

.admincenter-sidebar {
  background:
    linear-gradient(180deg, rgba(124,58,237,.018), rgba(37,99,235,.012)),
    #030712 !important;
  border-right: 1px solid rgba(37,99,235,.17) !important;
  box-shadow: 12px 0 30px rgba(0,0,0,.22) !important;
}

.admincenter-sidebar a {
  min-height: 42px !important;
  border-radius: 11px !important;
  margin-bottom: 4px !important;
}

.admincenter-sidebar a.is-active {
  color: #FFFFFF !important;
  background:
    linear-gradient(90deg, rgba(37,99,235,.30), rgba(124,58,237,.24)) !important;
  border-color: rgba(37,99,235,.55) !important;
  box-shadow:
    0 0 0 1px rgba(37,99,235,.16),
    0 0 22px rgba(124,58,237,.12) !important;
}

.admincenter-topbar {
  min-height: 64px !important;
  background: rgba(2,4,10,.92) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
  border-bottom: 1px solid rgba(37,99,235,.13) !important;
}

.admincenter-main,
.admincenter-content,
.admincenter-body main {
  background: transparent !important;
}

.admincenter-body section,
.admincenter-body article,
.admincenter-body .panel,
.admincenter-body .card,
.admincenter-body [class*="-card"],
.admincenter-body [class*="-panel"] {
  border-radius: 13px !important;
  padding: 12px !important;
}

.admincenter-body .stats-grid,
.admincenter-body .metric-grid,
.admincenter-body .health-grid,
.admincenter-body .dashboard-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.admincenter-body .status-grid,
.admincenter-body .regions-grid,
.admincenter-body .platform-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.admincenter-body table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
  background: #0B1730 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.admincenter-body thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
  color: #D6DCE8 !important;
  background:
    linear-gradient(90deg, rgba(124,58,237,.05), rgba(37,99,235,.045)),
    #0F1E3C !important;
  border-bottom: 1px solid rgba(37,99,235,.17) !important;
}

.admincenter-body tbody tr:hover td {
  background: rgba(21,31,70,.78) !important;
}

.admincenter-body input[type="search"],
.admincenter-body .search-input {
  background: #07101F !important;
  border-color: rgba(37,99,235,.20) !important;
}

.admincenter-body .notice--success,
.admincenter-body [data-health="healthy"] {
  color: #22D3EE !important;
}

.admincenter-body .notice--warning {
  color: #FACC15 !important;
}

.admincenter-body .notice--error {
  color: #FB7185 !important;
}

@media (max-width: 1100px) {
  .admincenter-body .stats-grid,
  .admincenter-body .metric-grid,
  .admincenter-body .health-grid,
  .admincenter-body .dashboard-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .admincenter-body .status-grid,
  .admincenter-body .regions-grid,
  .admincenter-body .platform-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .admincenter-body .stats-grid,
  .admincenter-body .metric-grid,
  .admincenter-body .health-grid,
  .admincenter-body .dashboard-grid,
  .admincenter-body .status-grid,
  .admincenter-body .regions-grid,
  .admincenter-body .platform-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 1024px) {
  html,
  body {
    overscroll-behavior-y: none !important;
    background-color: #02040A !important;
  }
}

/* ==========================================================
   COLUCA_2_VISITOR_PREMIUM_V151
   PUBLIC WEBSITE + PWA VISITOR EXPERIENCE
   Admin Center intentionally untouched in this step.
   ========================================================== */

:root {
  --vp-bg-0: #010309;
  --vp-bg-1: #040817;
  --vp-panel: #0A1328;
  --vp-panel-2: #0D1832;
  --vp-border: rgba(77,114,255,.22);
  --vp-blue: #2F7BFF;
  --vp-cyan: #22D3EE;
  --vp-purple: #8B5CF6;
  --vp-violet: #A855F7;
  --vp-text: #FFFFFF;
  --vp-subtle: #B7C1D6;
  --vp-muted: #8794AD;
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

body:not(.admincenter-body) {
  min-width: 0 !important;
  background:
    radial-gradient(circle at 18% -8%, rgba(139,92,246,.10), transparent 28%),
    radial-gradient(circle at 92% 0%, rgba(47,123,255,.10), transparent 30%),
    linear-gradient(180deg, #010309 0%, #040817 48%, #010309 100%) !important;
  color: #FFFFFF !important;
}

/* PUBLIC HEADER */
body:not(.admincenter-body) .site-header {
  min-width: 0 !important;
  width: 100% !important;
  background: rgba(1,3,9,.92) !important;
  border-bottom: 1px solid rgba(47,123,255,.15) !important;
  backdrop-filter: blur(20px) saturate(135%) !important;
}

body:not(.admincenter-body) .site-header .container,
body:not(.admincenter-body) .site-header__inner,
body:not(.admincenter-body) .header-inner {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* PUBLIC CARDS */
body:not(.admincenter-body) .station-card,
body:not(.admincenter-body) .hero-preview,
body:not(.admincenter-body) .home-promotion-panel,
body:not(.admincenter-body) .home-podcasts-panel,
body:not(.admincenter-body) .feature-panel,
body:not(.admincenter-body) .account-panel,
body:not(.admincenter-body) .expanded-player-card,
body:not(.admincenter-body) .account-card,
body:not(.admincenter-body) .settings-card,
body:not(.admincenter-body) .profile-card {
  min-width: 0 !important;
  max-width: 100% !important;
  background:
    linear-gradient(145deg, rgba(139,92,246,.025), rgba(47,123,255,.02)),
    #0A1328 !important;
  border: 1px solid rgba(77,114,255,.20) !important;
  box-shadow:
    0 20px 44px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.02) !important;
}

/* VISUAL DETAILS */
body:not(.admincenter-body) .button--gold,
body:not(.admincenter-body) .player-button--primary,
body:not(.admincenter-body) .preview-play-button,
body:not(.admincenter-body) .round-play,
body:not(.admincenter-body) .mini-transport__play {
  color: #FFFFFF !important;
  background:
    linear-gradient(145deg, #8B5CF6 0%, #2F7BFF 65%, #22D3EE 100%) !important;
  border-color: rgba(139,92,246,.50) !important;
  box-shadow:
    0 0 0 3px rgba(139,92,246,.06),
    0 0 26px rgba(139,92,246,.18),
    0 0 38px rgba(47,123,255,.12) !important;
}

/* ==========================================================
   MOBILE / PWA - HARD SHELL RECOVERY
   ========================================================== */
@media (max-width: 760px) {
  html {
    background: #010309 !important;
    min-height: 100% !important;
  }

  body:not(.admincenter-body) {
    width: 100% !important;
    max-width: 100vw !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding:
      env(safe-area-inset-top, 0px)
      env(safe-area-inset-right, 0px)
      calc(96px + env(safe-area-inset-bottom, 0px))
      env(safe-area-inset-left, 0px) !important;
    overflow-x: clip !important;
    overscroll-behavior-x: none !important;
  }

  body:not(.admincenter-body) .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 500 !important;
    min-height: 64px !important;
    margin: 0 !important;
    padding:
      10px
      max(14px, env(safe-area-inset-right, 0px))
      10px
      max(14px, env(safe-area-inset-left, 0px)) !important;
  }

  body:not(.admincenter-body) .site-header .container,
  body:not(.admincenter-body) .site-header__inner,
  body:not(.admincenter-body) .header-inner {
    min-height: 44px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
  }

  body:not(.admincenter-body) .site-header button,
  body:not(.admincenter-body) .site-header a,
  body:not(.admincenter-body) .icon-button {
    min-width: 48px !important;
    min-height: 48px !important;
    touch-action: manipulation !important;
  }

  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content,
  body:not(.admincenter-body) .hero {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body:not(.admincenter-body) .hero-grid,
  body:not(.admincenter-body) .hero__grid,
  body:not(.admincenter-body) .home-layout,
  body:not(.admincenter-body) .content-grid,
  body:not(.admincenter-body) .dashboard-grid {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Fix right-shifted borders and cards */
  body:not(.admincenter-body) .station-card,
  body:not(.admincenter-body) .hero-preview,
  body:not(.admincenter-body) .home-promotion-panel,
  body:not(.admincenter-body) .home-podcasts-panel,
  body:not(.admincenter-body) .feature-panel,
  body:not(.admincenter-body) .account-panel,
  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .player-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  /* Force station artwork wrappers to truly round/cropped surfaces */
  body:not(.admincenter-body) .station-logo,
  body:not(.admincenter-body) .station-avatar,
  body:not(.admincenter-body) [class*="station-logo"],
  body:not(.admincenter-body) [class*="station-avatar"],
  body:not(.admincenter-body) [class*="artwork-wrap"],
  body:not(.admincenter-body) [class*="artwork-wrapper"] {
    border-radius: 50% !important;
    overflow: hidden !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body:not(.admincenter-body) .station-logo img,
  body:not(.admincenter-body) .station-avatar img,
  body:not(.admincenter-body) [class*="station-logo"] img,
  body:not(.admincenter-body) [class*="station-avatar"] img,
  body:not(.admincenter-body) [class*="artwork-wrap"] img,
  body:not(.admincenter-body) [class*="artwork-wrapper"] img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    background: transparent !important;
  }

  /* Main now-playing card */
  body:not(.admincenter-body) .hero-preview,
  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .now-playing-card {
    border-radius: 24px !important;
    overflow: hidden !important;
  }

  body:not(.admincenter-body) .expanded-player-artwork,
  body:not(.admincenter-body) .preview-artwork,
  body:not(.admincenter-body) .now-playing-artwork,
  body:not(.admincenter-body) .hero-preview > img {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 20px !important;
    display: block !important;
  }

  /* Controls stay on-screen and tappable */
  body:not(.admincenter-body) .player-controls,
  body:not(.admincenter-body) .expanded-player-controls,
  body:not(.admincenter-body) .preview-controls,
  body:not(.admincenter-body) .mini-transport {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 52px minmax(76px, 1fr) 52px !important;
    align-items: center !important;
    justify-items: center !important;
    gap: 12px !important;
    overflow: visible !important;
  }

  body:not(.admincenter-body) .player-controls button,
  body:not(.admincenter-body) .expanded-player-controls button,
  body:not(.admincenter-body) .preview-controls button,
  body:not(.admincenter-body) .mini-transport button {
    min-width: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
  }

  body:not(.admincenter-body) .player-button--primary,
  body:not(.admincenter-body) .preview-play-button,
  body:not(.admincenter-body) .round-play,
  body:not(.admincenter-body) .mini-transport__play {
    width: 68px !important;
    height: 68px !important;
    min-width: 68px !important;
    min-height: 68px !important;
    border-radius: 50% !important;
  }

  /* Bottom navigation and mini-player stacking */
  body:not(.admincenter-body) .bottom-nav,
  body:not(.admincenter-body) .mobile-bottom-nav,
  body:not(.admincenter-body) .pwa-bottom-nav,
  body:not(.admincenter-body) nav[aria-label*="bottom" i],
  body:not(.admincenter-body) nav[aria-label*="mobile" i] {
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    min-height: 66px !important;
    padding: 7px 8px !important;
    border-radius: 22px !important;
    background: rgba(1,3,9,.96) !important;
    border: 1px solid rgba(77,114,255,.20) !important;
    box-shadow:
      0 20px 48px rgba(0,0,0,.45),
      0 0 32px rgba(139,92,246,.06) !important;
  }

  body:not(.admincenter-body) .bottom-nav a,
  body:not(.admincenter-body) .mobile-bottom-nav a,
  body:not(.admincenter-body) .pwa-bottom-nav a {
    min-width: 48px !important;
    min-height: 48px !important;
    padding: 4px !important;
    border-radius: 14px !important;
  }

  body:not(.admincenter-body) .mini-player,
  body:not(.admincenter-body) .player-shell {
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    width: auto !important;
    max-width: none !important;
  }

  /* Typography tuned for premium mobile app */
  body:not(.admincenter-body) h1 {
    font-size: clamp(1.9rem, 9vw, 2.7rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.035em !important;
  }

  body:not(.admincenter-body) h2 {
    font-size: clamp(1.25rem, 6vw, 1.7rem) !important;
    line-height: 1.08 !important;
  }

  body:not(.admincenter-body) p,
  body:not(.admincenter-body) .station-card p {
    color: #B7C1D6 !important;
  }
}

/* PWA standalone hardening */
@media (max-width: 760px) {
  body:not(.admincenter-body) {
    min-height: 100dvh !important;
    padding-top: 0 !important;
  }

  body:not(.admincenter-body) .site-header {
    padding-top: max(12px, env(safe-area-inset-top, 0px)) !important;
  }
}

/* ==========================================================
   DESKTOP VISITOR EXPERIENCE
   ========================================================== */
@media (min-width: 1101px) {
  body:not(.admincenter-body) .site-header {
    min-height: 70px !important;
    padding: 10px 24px !important;
  }

  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content {
    width: calc(100% - 36px) !important;
    max-width: 1520px !important;
    margin: 0 auto !important;
    padding: 14px 0 22px !important;
  }

  body:not(.admincenter-body) .hero {
    min-height: 0 !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
  }

  body:not(.admincenter-body) .hero-grid,
  body:not(.admincenter-body) .hero__grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.7fr) minmax(320px, .8fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
  }

  body:not(.admincenter-body) .hero-copy,
  body:not(.admincenter-body) .hero__copy {
    min-height: 0 !important;
    padding: 20px !important;
    border-radius: 20px !important;
    background:
      linear-gradient(145deg, rgba(139,92,246,.03), rgba(47,123,255,.025)),
      #0A1328 !important;
    border: 1px solid rgba(77,114,255,.20) !important;
  }

  body:not(.admincenter-body) .hero h1,
  body:not(.admincenter-body) .hero-copy h1 {
    font-size: clamp(2.2rem, 3.2vw, 3.8rem) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
  }

  body:not(.admincenter-body) .station-grid,
  body:not(.admincenter-body) .stations-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body:not(.admincenter-body) .station-card {
    border-radius: 16px !important;
    padding: 12px !important;
    transition:
      transform .18s ease,
      border-color .18s ease,
      box-shadow .18s ease !important;
  }

  body:not(.admincenter-body) .station-card:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(47,123,255,.38) !important;
    box-shadow:
      0 24px 52px rgba(0,0,0,.30),
      0 0 30px rgba(139,92,246,.07) !important;
  }
}

/* ==========================================================
   COLUCA_2_VISITOR_SHELL_FIX_V152
   PUBLIC WEBSITE + PWA ONLY
   ========================================================== */

:root {
  --coluca-bg: #010309;
  --coluca-bg-soft: #040817;
  --coluca-panel: #081126;
  --coluca-panel-2: #0B1530;
  --coluca-line: rgba(72,108,255,.18);
  --coluca-blue: #2F7BFF;
  --coluca-purple: #8B5CF6;
  --coluca-cyan: #22D3EE;
}

/* One coherent background; no random darker rectangles behind sections. */
body:not(.admincenter-body),
body:not(.admincenter-body) main,
body:not(.admincenter-body) .main-content,
body:not(.admincenter-body) .page-content,
body:not(.admincenter-body) .hero,
body:not(.admincenter-body) .content-grid,
body:not(.admincenter-body) .dashboard-grid {
  background-color: transparent !important;
}

body:not(.admincenter-body) {
  background:
    radial-gradient(circle at 18% -8%, rgba(139,92,246,.09), transparent 28%),
    radial-gradient(circle at 92% 0%, rgba(47,123,255,.09), transparent 30%),
    linear-gradient(180deg, #010309 0%, #040817 48%, #010309 100%) !important;
}

/* HEADER / MENU: keep it in document flow so it can never cover the page. */
body:not(.admincenter-body) .site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1200 !important;
  width: 100% !important;
  margin: 0 !important;
  transform: none !important;
  background: rgba(1,3,9,.96) !important;
  border-bottom: 1px solid rgba(72,108,255,.14) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.22) !important;
}

body:not(.admincenter-body) .site-header + main,
body:not(.admincenter-body) .site-header + .main-content,
body:not(.admincenter-body) .site-header + .page-content {
  margin-top: 0 !important;
}

body:not(.admincenter-body) .site-header .container,
body:not(.admincenter-body) .site-header__inner,
body:not(.admincenter-body) .header-inner {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Never let content drift outside viewport. */
body:not(.admincenter-body) *,
body:not(.admincenter-body) *::before,
body:not(.admincenter-body) *::after {
  box-sizing: border-box !important;
}

body:not(.admincenter-body) main,
body:not(.admincenter-body) section,
body:not(.admincenter-body) article,
body:not(.admincenter-body) .container,
body:not(.admincenter-body) .card,
body:not(.admincenter-body) [class*="-card"],
body:not(.admincenter-body) [class*="-panel"] {
  min-width: 0 !important;
}

/* Remove ugly backing plates around ordinary icons/buttons.
   Primary play remains styled separately. */
body:not(.admincenter-body) .icon-button,
body:not(.admincenter-body) .player-skip,
body:not(.admincenter-body) .mini-player-button,
body:not(.admincenter-body) .mini-service,
body:not(.admincenter-body) [class*="icon-wrap"],
body:not(.admincenter-body) [class*="icon-holder"],
body:not(.admincenter-body) [class*="control-wrap"],
body:not(.admincenter-body) [class*="button-wrap"] {
  background: transparent !important;
  box-shadow: none !important;
}

body:not(.admincenter-body) .icon-button,
body:not(.admincenter-body) .player-skip,
body:not(.admincenter-body) .mini-player-button,
body:not(.admincenter-body) .mini-service {
  border-color: rgba(72,108,255,.14) !important;
}

/* Station artwork: no square dark plate behind round artwork. */
body:not(.admincenter-body) .station-logo,
body:not(.admincenter-body) .station-avatar,
body:not(.admincenter-body) [class*="station-logo"],
body:not(.admincenter-body) [class*="station-avatar"],
body:not(.admincenter-body) [class*="artwork-wrap"],
body:not(.admincenter-body) [class*="artwork-holder"] {
  overflow: hidden !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

body:not(.admincenter-body) .station-logo img,
body:not(.admincenter-body) .station-avatar img,
body:not(.admincenter-body) [class*="station-logo"] img,
body:not(.admincenter-body) [class*="station-avatar"] img,
body:not(.admincenter-body) [class*="artwork-wrap"] img,
body:not(.admincenter-body) [class*="artwork-holder"] img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  background: transparent !important;
}

/* Keep real play button premium. */
body:not(.admincenter-body) .player-button--primary,
body:not(.admincenter-body) .preview-play-button,
body:not(.admincenter-body) .round-play,
body:not(.admincenter-body) .mini-transport__play {
  background:
    linear-gradient(145deg, #8B5CF6 0%, #2F7BFF 65%, #22D3EE 100%) !important;
  border-radius: 50% !important;
  box-shadow:
    0 0 0 3px rgba(139,92,246,.055),
    0 0 22px rgba(139,92,246,.17),
    0 0 34px rgba(47,123,255,.11) !important;
}

/* Program guide / station detail / bottom sheet:
   align to viewport and always sit ABOVE mini-player. */
body:not(.admincenter-body) .program-guide,
body:not(.admincenter-body) .program-guide-sheet,
body:not(.admincenter-body) .station-guide,
body:not(.admincenter-body) .station-guide-sheet,
body:not(.admincenter-body) .guide-sheet,
body:not(.admincenter-body) .guide-drawer,
body:not(.admincenter-body) .bottom-sheet,
body:not(.admincenter-body) [data-program-guide],
body:not(.admincenter-body) [data-station-guide],
body:not(.admincenter-body) [class*="program-guide"],
body:not(.admincenter-body) [class*="station-guide"] {
  z-index: 1600 !important;
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
  max-width: 100vw !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transform: none !important;
  background: #040817 !important;
  border-color: rgba(72,108,255,.18) !important;
  box-shadow: 0 -24px 60px rgba(0,0,0,.48) !important;
}

/* Backdrop above player but below guide. */
body:not(.admincenter-body) .sheet-backdrop,
body:not(.admincenter-body) .drawer-backdrop,
body:not(.admincenter-body) .modal-backdrop,
body:not(.admincenter-body) [class*="guide-backdrop"] {
  z-index: 1500 !important;
  background: rgba(1,3,9,.72) !important;
  backdrop-filter: blur(6px) !important;
}

/* Mini player always below an open guide/sheet. */
body:not(.admincenter-body) .mini-player,
body:not(.admincenter-body) .player-shell,
body:not(.admincenter-body) [class*="mini-player"] {
  z-index: 900 !important;
  background: rgba(1,3,9,.97) !important;
  border-color: rgba(72,108,255,.16) !important;
  box-shadow: 0 -12px 34px rgba(0,0,0,.32) !important;
}

/* Desktop mini-player alignment. */
@media (min-width: 761px) {
  body:not(.admincenter-body) .mini-player,
  body:not(.admincenter-body) .player-shell,
  body:not(.admincenter-body) [class*="mini-player"] {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content {
    padding-bottom: 96px !important;
  }
}

/* iPhone / PWA hard alignment. */
@media (max-width: 760px) {
  body:not(.admincenter-body) {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: clip !important;
  }

  body:not(.admincenter-body) .site-header {
    padding:
      max(12px, env(safe-area-inset-top, 0px))
      max(14px, env(safe-area-inset-right, 0px))
      10px
      max(14px, env(safe-area-inset-left, 0px)) !important;
  }

  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: max(14px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(14px, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body:not(.admincenter-body) .program-guide,
  body:not(.admincenter-body) .program-guide-sheet,
  body:not(.admincenter-body) .station-guide,
  body:not(.admincenter-body) .station-guide-sheet,
  body:not(.admincenter-body) .guide-sheet,
  body:not(.admincenter-body) .guide-drawer,
  body:not(.admincenter-body) .bottom-sheet,
  body:not(.admincenter-body) [data-program-guide],
  body:not(.admincenter-body) [data-station-guide],
  body:not(.admincenter-body) [class*="program-guide"],
  body:not(.admincenter-body) [class*="station-guide"] {
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 24px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    border-radius: 24px !important;
  }

  body:not(.admincenter-body) .mini-player,
  body:not(.admincenter-body) .player-shell,
  body:not(.admincenter-body) [class*="mini-player"] {
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body:not(.admincenter-body) .station-card,
  body:not(.admincenter-body) .hero-preview,
  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .home-promotion-panel,
  body:not(.admincenter-body) .home-podcasts-panel {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* ==========================================================
   COLUCA_2_VISITOR_LAYOUT_CLEANUP_V153
   PUBLIC WEBSITE + PWA ONLY
   ========================================================== */

:root {
  --v153-bg: #010309;
  --v153-bg-soft: #040817;
  --v153-panel: #081126;
  --v153-line: rgba(65,104,255,.18);
  --v153-blue: #2F7BFF;
  --v153-purple: #8B5CF6;
  --v153-cyan: #22D3EE;
}

/* 1) ONE CONTINUOUS VISITOR BACKGROUND
   Remove the giant dark slabs around sections. */
body:not(.admincenter-body),
body:not(.admincenter-body) main,
body:not(.admincenter-body) .main-content,
body:not(.admincenter-body) .page-content,
body:not(.admincenter-body) .hero,
body:not(.admincenter-body) section,
body:not(.admincenter-body) .content-grid,
body:not(.admincenter-body) .dashboard-grid,
body:not(.admincenter-body) .stations-section,
body:not(.admincenter-body) .popular-section,
body:not(.admincenter-body) .home-stations,
body:not(.admincenter-body) [class*="section-wrap"],
body:not(.admincenter-body) [class*="section-shell"],
body:not(.admincenter-body) [class*="section-bg"] {
  background-color: transparent !important;
  background-image: none !important;
}

body:not(.admincenter-body) {
  background:
    radial-gradient(circle at 16% -7%, rgba(139,92,246,.085), transparent 28%),
    radial-gradient(circle at 92% 0%, rgba(47,123,255,.085), transparent 30%),
    linear-gradient(180deg, #010309 0%, #040817 48%, #010309 100%) !important;
}

/* 2) REMOVE ALL GOLD/YELLOW ACCENT STROKES/LINES FROM PUBLIC UI
   Logo artwork remains untouched. */
body:not(.admincenter-body) .card,
body:not(.admincenter-body) [class*="-card"],
body:not(.admincenter-body) [class*="-panel"],
body:not(.admincenter-body) [class*="-window"],
body:not(.admincenter-body) [class*="-frame"],
body:not(.admincenter-body) button,
body:not(.admincenter-body) .button,
body:not(.admincenter-body) [class*="button"] {
  border-top-color: rgba(65,104,255,.18) !important;
  border-image: none !important;
}

body:not(.admincenter-body) .card::before,
body:not(.admincenter-body) [class*="-card"]::before,
body:not(.admincenter-body) [class*="-panel"]::before,
body:not(.admincenter-body) [class*="-window"]::before,
body:not(.admincenter-body) [class*="-frame"]::before,
body:not(.admincenter-body) button::before,
body:not(.admincenter-body) .button::before,
body:not(.admincenter-body) [class*="button"]::before {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
}

body:not(.admincenter-body) [style*="#8B5CF6"],
body:not(.admincenter-body) [style*="#22D3EE"] {
  border-color: rgba(65,104,255,.18) !important;
}

/* 3) DESKTOP MINI-PLAYER
   Compact bottom-right module, never full-width. */
@media (min-width: 1101px) {
  body:not(.admincenter-body) .mini-player,
  body:not(.admincenter-body) [class*="mini-player"] {
    position: fixed !important;
    left: auto !important;
    right: 24px !important;
    bottom: 24px !important;
    width: min(390px, calc(100vw - 48px)) !important;
    max-width: 390px !important;
    min-width: 320px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 14px !important;
    z-index: 950 !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    background:
      linear-gradient(145deg, rgba(139,92,246,.035), rgba(47,123,255,.025)),
      rgba(4,8,23,.98) !important;
    border: 1px solid rgba(65,104,255,.20) !important;
    box-shadow:
      0 24px 60px rgba(0,0,0,.44),
      0 0 30px rgba(139,92,246,.06) !important;
  }

  body:not(.admincenter-body) .player-shell:not(.mini-player) {
    left: auto !important;
    right: 24px !important;
    bottom: 24px !important;
    width: min(390px, calc(100vw - 48px)) !important;
    max-width: 390px !important;
    min-width: 320px !important;
    margin: 0 !important;
    border-radius: 20px !important;
    z-index: 950 !important;
  }

  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content,
  body:not(.admincenter-body) .site-footer {
    padding-bottom: 32px !important;
  }
}

/* 4) GUIDE / STATION DETAIL
   Always above mini-player and never clipped by right gutter. */
body:not(.admincenter-body) .program-guide,
body:not(.admincenter-body) .program-guide-sheet,
body:not(.admincenter-body) .station-guide,
body:not(.admincenter-body) .station-guide-sheet,
body:not(.admincenter-body) .guide-sheet,
body:not(.admincenter-body) .guide-drawer,
body:not(.admincenter-body) .bottom-sheet,
body:not(.admincenter-body) [data-program-guide],
body:not(.admincenter-body) [data-station-guide],
body:not(.admincenter-body) [class*="program-guide"],
body:not(.admincenter-body) [class*="station-guide"] {
  z-index: 1800 !important;
  background: #040817 !important;
  border-color: rgba(65,104,255,.20) !important;
  box-shadow: 0 -24px 64px rgba(0,0,0,.48) !important;
}

body:not(.admincenter-body) .sheet-backdrop,
body:not(.admincenter-body) .drawer-backdrop,
body:not(.admincenter-body) .modal-backdrop,
body:not(.admincenter-body) [class*="guide-backdrop"] {
  z-index: 1700 !important;
  background: rgba(1,3,9,.74) !important;
  backdrop-filter: blur(7px) !important;
}

/* 5) MOBILE STATION CARDS
   No title/meta/action collisions. */
@media (max-width: 760px) {
  body:not(.admincenter-body) .station-grid,
  body:not(.admincenter-body) .stations-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  body:not(.admincenter-body) .station-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 132px !important;
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    column-gap: 14px !important;
    row-gap: 4px !important;
    align-items: start !important;
    padding: 16px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
  }

  body:not(.admincenter-body) .station-card .station-logo,
  body:not(.admincenter-body) .station-card .station-avatar,
  body:not(.admincenter-body) .station-card [class*="station-logo"],
  body:not(.admincenter-body) .station-card [class*="station-avatar"] {
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    width: 58px !important;
    height: 58px !important;
    align-self: start !important;
    margin: 0 !important;
  }

  body:not(.admincenter-body) .station-card h2,
  body:not(.admincenter-body) .station-card h3,
  body:not(.admincenter-body) .station-card [class*="title"] {
    grid-column: 2 !important;
    min-width: 0 !important;
    margin: 0 !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  body:not(.admincenter-body) .station-card p,
  body:not(.admincenter-body) .station-card [class*="description"],
  body:not(.admincenter-body) .station-card [class*="subtitle"] {
    grid-column: 2 !important;
    min-width: 0 !important;
    margin: 0 !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body:not(.admincenter-body) .station-card [class*="category"],
  body:not(.admincenter-body) .station-card [class*="genre"],
  body:not(.admincenter-body) .station-card [class*="live"] {
    grid-column: 2 !important;
    min-width: 0 !important;
    margin: 0 !important;
    white-space: normal !important;
  }

  body:not(.admincenter-body) .station-card [class*="actions"],
  body:not(.admincenter-body) .station-card [class*="footer"],
  body:not(.admincenter-body) .station-card [class*="controls"] {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin-top: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
  }

  body:not(.admincenter-body) .station-card a,
  body:not(.admincenter-body) .station-card button {
    max-width: 100% !important;
    white-space: normal !important;
  }

  /* Guide: no black bar on right; equal background. */
  body:not(.admincenter-body) .program-guide,
  body:not(.admincenter-body) .program-guide-sheet,
  body:not(.admincenter-body) .station-guide,
  body:not(.admincenter-body) .station-guide-sheet,
  body:not(.admincenter-body) .guide-sheet,
  body:not(.admincenter-body) .guide-drawer,
  body:not(.admincenter-body) .bottom-sheet,
  body:not(.admincenter-body) [data-program-guide],
  body:not(.admincenter-body) [data-station-guide],
  body:not(.admincenter-body) [class*="program-guide"],
  body:not(.admincenter-body) [class*="station-guide"] {
    position: fixed !important;
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    top: max(8px, env(safe-area-inset-top, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border-radius: 24px !important;
    background: #040817 !important;
  }

  /* Mini-player remains below guide and inside safe-area. */
  body:not(.admincenter-body) .mini-player,
  body:not(.admincenter-body) [class*="mini-player"],
  body:not(.admincenter-body) .player-shell {
    z-index: 900 !important;
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  /* Footer / credits / version: centered, spaced, never under player. */
  body:not(.admincenter-body) .site-footer,
  body:not(.admincenter-body) footer {
    width: 100% !important;
    max-width: 100% !important;
    padding:
      28px
      max(18px, env(safe-area-inset-right, 0px))
      calc(150px + env(safe-area-inset-bottom, 0px))
      max(18px, env(safe-area-inset-left, 0px)) !important;
    text-align: center !important;
  }

  body:not(.admincenter-body) .site-footer *,
  body:not(.admincenter-body) footer * {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    overflow-wrap: anywhere !important;
  }

  body:not(.admincenter-body) .footer-grid,
  body:not(.admincenter-body) [class*="footer-grid"],
  body:not(.admincenter-body) [class*="footer-columns"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    justify-items: center !important;
  }
}

/* COLUCA_2_EMERGENCY_FUNCTIONAL_RESTORE_V155 */

/* COLUCA_2_SOURCE_SPECIFIC_PWA_WEB_SHELL_V156 */
@media (max-width: 760px) {
  body { padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px)); }
  .coluca-pwa-nav-v156 {
    position: fixed;
    left: max(8px, env(safe-area-inset-left, 0px));
    right: max(8px, env(safe-area-inset-right, 0px));
    bottom: max(7px, env(safe-area-inset-bottom, 0px));
    z-index: 1200;
    min-height: 68px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    gap: 3px;
    padding: 6px;
    border-radius: 22px;
    background: rgba(2,4,10,.98);
    border: 1px solid rgba(60,100,255,.18);
    box-shadow: 0 18px 42px rgba(0,0,0,.42);
    backdrop-filter: blur(20px) saturate(135%);
  }
  .coluca-pwa-nav-v156 a {
    min-width: 0;
    min-height: 54px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 4px 2px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #9AA7C0;
    text-decoration: none;
  }
  .coluca-pwa-nav-v156 a span { font-size: 1.1rem; line-height: 1; color: #B8C4DA; }
  .coluca-pwa-nav-v156 a b { font-size: .62rem; line-height: 1; font-weight: 650; white-space: nowrap; }
}
@media (min-width: 761px), (display-mode: browser) {
  .coluca-pwa-nav-v156 { display: none !important; }
}
@media (max-width: 760px) {
  .mini-player { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-artwork { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-button { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-copy { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__app { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__app--apple { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__app--eq { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__apps { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__app--spotify { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__copy { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__display { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher__play { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-launcher--console { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .mini-player-main { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .player-shell { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 760px) {
  .expanded-guide-current {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
@media (max-width: 760px) {
  .expanded-guide-list {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
@media (max-width: 760px) {
  .expanded-guide-now {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
@media (max-width: 760px) {
  .expanded-guide-related {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
@media (max-width: 760px) {
  .expanded-player-guide {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
@media (max-width: 760px) {
  .integration-guide {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
@media (max-width: 760px) {
  .integration-guide-grid {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    background-color: #040817 !important;
  }
}
.preview-station-logo { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.preview-station-logo img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar--small { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar--small img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo--row { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo--row img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.site-header { background-color: #02040A !important; }

/* COLUCA_2_CONSOLIDATED_PREMIUM_VISITOR_PWA_V157 */
:root {
  --v157-bg: #02040A;
  --v157-panel: #0A142C;
  --v157-line: rgba(66,105,255,.20);
  --v157-purple: #8B5CF6;
  --v157-blue: #2F7BFF;
  --v157-cyan: #22D3EE;
  --v157-live: #38E879;
  --v157-live-dot: #FF3B4F;
  --v157-gold: #F4D06F;
}
.coluca-header-v157 {
  background: #02040A !important;
  border-bottom-color: rgba(66,105,255,.12) !important;
  box-shadow: none !important;
}
.coluca-footer-v157 {
  background: #02040A !important;
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  min-height: 0 !important;
}
.coluca-footer-v157 .coluca-developer-link-v157 {
  color: var(--v157-gold) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.coluca-footer-v157 .coluca-developer-link-v157:hover { text-decoration: underline !important; }
.coluca-footer-v157 p, .coluca-footer-v157 li { margin-top: 4px !important; margin-bottom: 4px !important; }
.preview-station-logo { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.preview-station-logo img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar--small { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-avatar--small img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo--row { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.station-logo--row img { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.live-dot { color: var(--v157-live) !important; }
.live-dot::before { background: var(--v157-live-dot) !important; border-color: var(--v157-live-dot) !important; }
.mini-cover__live { color: var(--v157-live) !important; }
.mini-cover__live::before { background: var(--v157-live-dot) !important; border-color: var(--v157-live-dot) !important; }
.player-live-details { color: var(--v157-live) !important; }
.player-live-details::before { background: var(--v157-live-dot) !important; border-color: var(--v157-live-dot) !important; }
.station-live-button { color: var(--v157-live) !important; }
.station-live-button::before { background: var(--v157-live-dot) !important; border-color: var(--v157-live-dot) !important; }
.station-card .live, .mini-player .live, .player-shell .live { color: var(--v157-live) !important; }
.station-card .live::before, .mini-player .live::before, .player-shell .live::before { background: var(--v157-live-dot) !important; border-color: var(--v157-live-dot) !important; }
.account-favorite-lock-mark { color: #EAF0FF !important; background: linear-gradient(145deg, rgba(139,92,246,.24), rgba(47,123,255,.25)) !important; border-color: rgba(34,211,238,.30) !important; box-shadow: 0 0 18px rgba(139,92,246,.16) !important; }
.favorite-lock-button { color: #EAF0FF !important; background: linear-gradient(145deg, rgba(139,92,246,.24), rgba(47,123,255,.25)) !important; border-color: rgba(34,211,238,.30) !important; box-shadow: 0 0 18px rgba(139,92,246,.16) !important; }
.station-favorite-shortcut-lock { color: #EAF0FF !important; background: linear-gradient(145deg, rgba(139,92,246,.24), rgba(47,123,255,.25)) !important; border-color: rgba(34,211,238,.30) !important; box-shadow: 0 0 18px rgba(139,92,246,.16) !important; }
.mini-player-button, .mini-player-launcher__play {
  background: linear-gradient(145deg, var(--v157-purple), var(--v157-blue) 58%, var(--v157-cyan)) !important;
  color: #FFFFFF !important;
  border-color: rgba(34,211,238,.30) !important;
  box-shadow: 0 8px 24px rgba(47,123,255,.22) !important;
}
.mini-player-launcher__app--eq {
  transform: scale(.84) !important;
  transform-origin: center !important;
}
@media (min-width: 1101px) {
  body:not(.coluca-mini-window-v157) .mini-player {
    position: fixed !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 14px !important;
    width: auto !important;
    max-width: none !important;
    min-height: 74px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: minmax(260px, 1.1fr) minmax(260px, .8fr) minmax(360px, 1.25fr) minmax(150px, .45fr) !important;
    align-items: center !important;
    gap: 12px !important;
    z-index: 1450 !important;
    background: rgba(2,4,10,.985) !important;
    border: 1px solid rgba(66,105,255,.20) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 54px rgba(0,0,0,.42) !important;
    overflow: visible !important;
  }
  body:not(.coluca-mini-window-v157) .mini-player-main { min-width: 0 !important; }
  body:not(.coluca-mini-window-v157) .mini-player-launcher__apps {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
  }
  body:not(.coluca-mini-window-v157) .mini-player-launcher__app {
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 5px 7px !important;
    position: relative !important;
  }
  body:not(.coluca-mini-window-v157) .mini-player-launcher__app--spotify { color: #1ED760 !important; }
  body:not(.coluca-mini-window-v157) .mini-player-launcher__app--apple { color: #C7A7FF !important; }
  body:not(.coluca-mini-window-v157) .mini-player-launcher__display {
    min-width: 0 !important;
    max-width: 180px !important;
  }
  main, .main-content, .page-content, .coluca-footer-v157 { padding-bottom: 110px !important; }
}
.coluca-mini-window-v157 { background: #02040A !important; }
.coluca-mini-window-v157 .player-shell {
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 10px !important;
  gap: 8px !important;
}
.coluca-mini-window-v157 .mini-player-main { gap: 8px !important; }
.coluca-mini-window-v157 .mini-player-copy {
  font-size: .92rem !important;
  line-height: 1.25 !important;
  min-width: 0 !important;
}
.coluca-mini-window-v157 .mini-player-button {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
}
.coluca-mini-window-v157 .mini-player-launcher__apps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
  position: relative !important;
  z-index: 4 !important;
  margin-bottom: 8px !important;
}
.coluca-mini-window-v157 .mini-player-launcher__app {
  position: relative !important;
  min-width: 0 !important;
  min-height: 44px !important;
  padding: 5px !important;
  font-size: .72rem !important;
  overflow: hidden !important;
}
.coluca-mini-window-v157 .mini-player-launcher__app--spotify { color: #1ED760 !important; }
.coluca-mini-window-v157 .mini-player-launcher__app--apple { color: #C7A7FF !important; }
.coluca-mini-window-v157 .mini-player-launcher__app--eq { transform: scale(.82) !important; }
.expanded-guide-current { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.expanded-guide-list { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.expanded-guide-now { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.expanded-guide-related { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.expanded-player-guide { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.integration-guide { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.integration-guide-grid { background-color: #02040A !important; border-right: 0 !important; box-shadow: none !important; }
.expanded-player-guide {
  z-index: 2200 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-y: contain !important;
}
.expanded-guide-list {
  overflow-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
}
@media (max-width: 760px) {
  .coluca-pwa-nav-v157 {
    position: fixed !important;
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(7px, env(safe-area-inset-bottom, 0px)) !important;
    z-index: 1550 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 3px !important;
    min-height: 68px !important;
    padding: 6px !important;
    border-radius: 22px !important;
    background: rgba(2,4,10,.985) !important;
    border: 1px solid rgba(66,105,255,.18) !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.42) !important;
  }
  .coluca-pwa-nav-v157 a {
    min-width: 0 !important;
    min-height: 54px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    color: #A7B2C8 !important;
    text-decoration: none !important;
    border-radius: 14px !important;
  }
  .coluca-pwa-nav-v157 a:active, .coluca-pwa-nav-v157 a:focus-visible {
    color: #FFFFFF !important;
    background: linear-gradient(145deg, rgba(139,92,246,.18), rgba(47,123,255,.16)) !important;
  }
  .mini-player {
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 1450 !important;
  }
  .expanded-player-guide {
    position: fixed !important;
    top: calc(env(safe-area-inset-top, 0px) + 10px) !important;
    right: max(6px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    left: max(6px, env(safe-area-inset-left, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    padding-top: max(14px, env(safe-area-inset-top, 0px)) !important;
    padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important;
    padding-left: max(12px, env(safe-area-inset-left, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    background: #02040A !important;
    border-right: 0 !important;
    box-shadow: none !important;
  }
  .expanded-guide-current, .expanded-guide-now, .expanded-guide-related, .expanded-guide-list {
    background-color: #02040A !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}
/* COLUCA_2_STRUCTURAL_PREMIUM_VISITOR_PWA_V158 */
:root {
  --v158-bg: #02040A;
  --v158-panel: #081126;
  --v158-panel-2: #0B1731;
  --v158-purple: #8B5CF6;
  --v158-blue: #2F7BFF;
  --v158-cyan: #22D3EE;
  --v158-live: #3BE57A;
  --v158-live-dot: #FF394E;
  --v158-gold: #F4D06F;
}

.v158-site-header,
.v158-footer {
  background: var(--v158-bg) !important;
  box-shadow: none !important;
}

.v158-site-header {
  border-bottom: 1px solid rgba(67, 103, 255, .10) !important;
}

.v158-footer {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
  min-height: 0 !important;
  border-top: 1px solid rgba(67, 103, 255, .10) !important;
}

.v158-footer p,
.v158-footer li {
  margin-top: 3px !important;
  margin-bottom: 3px !important;
}

.v158-footer .coluca-developer-link-v157,
.v158-footer a[href="https://voryniq.com/"] {
  color: var(--v158-gold) !important;
  font-weight: 700 !important;
}

.v158-station-logo,
.v158-station-logo img {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.v158-live-dot {
  background: var(--v158-live-dot) !important;
  border-color: var(--v158-live-dot) !important;
}

.v158-live-label {
  color: var(--v158-live) !important;
}

.v158-live-label::before {
  background: var(--v158-live-dot) !important;
  border-color: var(--v158-live-dot) !important;
}

.v158-play-primary,
.v158-transport-play {
  color: #fff !important;
  background: linear-gradient(145deg, var(--v158-purple), var(--v158-blue) 58%, var(--v158-cyan)) !important;
  border-color: rgba(34, 211, 238, .30) !important;
  box-shadow: 0 8px 24px rgba(47, 123, 255, .24) !important;
}

.v158-lock {
  color: #F3F7FF !important;
  background: linear-gradient(145deg, rgba(139,92,246,.26), rgba(47,123,255,.24)) !important;
  border-color: rgba(34,211,238,.30) !important;
  box-shadow: 0 0 18px rgba(139,92,246,.14) !important;
}

.v158-equalizer {
  transform: scale(.82) !important;
  transform-origin: center !important;
}

.v158-service-spotify { color: #1ED760 !important; }
.v158-service-airplay,
.v158-service-apple,
.v158-service-applemusic { color: #B7C8FF !important; }
.v158-service-cast { color: #5CB8FF !important; }

.v158-player-copy {
  min-width: 0 !important;
}

.v158-player-copy * {
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

@media (min-width: 1101px) {
  body:not(.v158-mini-window) .v158-player-bar {
    position: fixed !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 12px !important;
    width: auto !important;
    max-width: none !important;
    min-height: 76px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: minmax(290px, 1.20fr) minmax(250px, .72fr) minmax(430px, 1.32fr) minmax(160px, .45fr) !important;
    align-items: center !important;
    gap: 10px !important;
    z-index: 1450 !important;
    background: rgba(2,4,10,.985) !important;
    border: 1px solid rgba(67,103,255,.18) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 48px rgba(0,0,0,.42) !important;
    overflow: visible !important;
  }

  body:not(.v158-mini-window) .v158-player-main {
    min-width: 0 !important;
  }

  body:not(.v158-mini-window) .v158-service-actions {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    gap: 5px !important;
    align-items: center !important;
    min-width: 0 !important;
  }

  body:not(.v158-mini-window) .v158-service-actions > * {
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 4px 6px !important;
  }

  body:not(.v158-mini-window) .v158-player-status {
    min-width: 0 !important;
    max-width: 170px !important;
  }

  .v158-guide {
    bottom: 102px !important;
  }

  main,
  .main-content,
  .page-content,
  .v158-footer {
    padding-bottom: 108px !important;
  }
}

.v158-mini-window .player-shell,
.v158-mini-window .v158-player-bar {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 10px !important;
  gap: 8px !important;
}

.v158-mini-window .v158-player-main {
  gap: 8px !important;
}

.v158-mini-window .v158-player-copy {
  font-size: .92rem !important;
  line-height: 1.24 !important;
}

.v158-mini-window .v158-service-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 5px !important;
  margin-bottom: 8px !important;
  position: relative !important;
  z-index: 3 !important;
}

.v158-mini-window .v158-service-actions > * {
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 4px !important;
  font-size: .72rem !important;
  overflow: hidden !important;
}

.v158-mini-window .v158-audiolab {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 8px !important;
}

.v158-guide,
.v158-guide-current,
.v158-guide-list,
.v158-guide-now,
.v158-guide-related,
.v158-guide-integration,
.v158-guide-grid {
  background: var(--v158-bg) !important;
  border-right: 0 !important;
  box-shadow: none !important;
}

.v158-guide {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-y: contain !important;
}

.v158-guide-list {
  overflow-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
}

@media (max-width: 760px) {
  .v158-pwa-nav {
    position: fixed !important;
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(7px, env(safe-area-inset-bottom, 0px)) !important;
    z-index: 1550 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    gap: 3px !important;
    min-height: 68px !important;
    padding: 6px !important;
    background: rgba(2,4,10,.985) !important;
    border: 1px solid rgba(67,103,255,.18) !important;
    border-radius: 22px !important;
  }

  .v158-pwa-nav a {
    min-width: 0 !important;
    min-height: 54px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    color: #A9B3C8 !important;
    text-decoration: none !important;
    border-radius: 14px !important;
  }

  .v158-player-bar {
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 1450 !important;
  }

  .v158-guide {
    position: fixed !important;
    top: calc(env(safe-area-inset-top, 0px) + 8px) !important;
    right: max(0px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(0px, env(safe-area-inset-bottom, 0px)) !important;
    left: max(0px, env(safe-area-inset-left, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    padding-top: max(16px, env(safe-area-inset-top, 0px)) !important;
    padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: max(18px, env(safe-area-inset-bottom, 0px)) !important;
    padding-left: max(12px, env(safe-area-inset-left, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    background: var(--v158-bg) !important;
    border: 0 !important;
    border-right: 0 !important;
    box-shadow: none !important;
  }
}

/* COLUCA_V158_STRUCTURAL_V4_START */
:root {
  --v158-bg: #02040a;
  --v158-panel: #081126;
  --v158-panel-2: #0b1731;
  --v158-border: rgba(87, 115, 255, .20);
  --v158-purple: #8b5cf6;
  --v158-blue: #377cff;
  --v158-cyan: #25d9ee;
  --v158-live: #39e879;
  --v158-live-dot: #ff3f4f;
  --v158-gold: #f2d36d;
}

html, body {
  background: var(--v158-bg) !important;
}

.v158-header,
.site-header.coluca-header-v157 {
  background: var(--v158-bg) !important;
  box-shadow: none !important;
  border-bottom: 1px solid rgba(87,115,255,.10) !important;
}

.v158-footer,
.coluca-footer-v157 {
  background: var(--v158-bg) !important;
  min-height: 0 !important;
  padding: 16px 0 14px !important;
  margin-top: 22px !important;
  border-top: 1px solid rgba(87,115,255,.12) !important;
}

.v158-footer p,
.v158-footer li,
.coluca-footer-v157 p,
.coluca-footer-v157 li {
  margin-top: 3px !important;
  margin-bottom: 3px !important;
  line-height: 1.35 !important;
}

.coluca-developer-link-v158,
.coluca-developer-link-v157 {
  color: var(--v158-gold) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.station-avatar,
.station-avatar--small,
.station-logo,
.station-logo--row,
.preview-station-logo,
.station-avatar img,
.station-avatar--small img,
.station-logo img,
.station-logo--row img,
.preview-station-logo img {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.station-live-button,
.mini-cover__live,
.player-live-details,
.v158-live {
  color: var(--v158-live) !important;
}

.live-dot,
.station-live-button::before,
.mini-cover__live::before,
.player-live-details::before,
.v158-live::before {
  background: var(--v158-live-dot) !important;
  border-color: var(--v158-live-dot) !important;
  color: var(--v158-live-dot) !important;
}

.favorite-lock-button,
.account-favorite-lock-mark,
.station-favorite-shortcut-lock,
.v158-lock {
  color: #f4f7ff !important;
  background: linear-gradient(145deg, rgba(139,92,246,.25), rgba(55,124,255,.28)) !important;
  border: 1px solid rgba(37,217,238,.30) !important;
  box-shadow: 0 0 18px rgba(55,124,255,.14) !important;
  border-radius: 12px !important;
}

.mini-player-button,
.mini-player-launcher__play {
  color: #fff !important;
  background: linear-gradient(145deg, var(--v158-purple), var(--v158-blue) 58%, var(--v158-cyan)) !important;
  border-color: rgba(37,217,238,.32) !important;
  box-shadow: 0 8px 24px rgba(55,124,255,.24) !important;
}

.mini-player-launcher__app--eq {
  transform: scale(.80) !important;
  transform-origin: center !important;
}

@media (min-width: 1101px) {
  .v158-player-bar,
  body:not(.coluca-mini-window-v157) .mini-player {
    position: fixed !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 14px !important;
    width: auto !important;
    max-width: none !important;
    min-height: 76px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: minmax(280px,1.15fr) minmax(240px,.72fr) minmax(400px,1.25fr) minmax(120px,.35fr) !important;
    align-items: center !important;
    gap: 12px !important;
    background: rgba(2,4,10,.985) !important;
    border: 1px solid var(--v158-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 20px 58px rgba(0,0,0,.45) !important;
    overflow: visible !important;
    z-index: 1500 !important;
  }

  .v158-player-main,
  body:not(.coluca-mini-window-v157) .mini-player-main {
    min-width: 0 !important;
  }

  .v158-player-actions,
  body:not(.coluca-mini-window-v157) .mini-player-launcher__apps {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
  }

  .v158-player-actions .mini-player-launcher__app,
  body:not(.coluca-mini-window-v157) .mini-player-launcher__app {
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 5px 7px !important;
    font-size: .76rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  .mini-player-launcher__app--spotify { color: #1ed760 !important; }
  .mini-player-launcher__app--apple { color: #c8a8ff !important; }

  main,
  .main-content,
  .page-content,
  .v158-footer,
  .coluca-footer-v157 {
    padding-bottom: 112px !important;
  }
}

.v158-mini-shell,
.v158-mini-window .player-shell,
.coluca-mini-window-v157 .player-shell {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 10px !important;
  gap: 8px !important;
  background: var(--v158-bg) !important;
}

.v158-mini-main,
.v158-mini-window .mini-player-main,
.coluca-mini-window-v157 .mini-player-main {
  gap: 8px !important;
  align-items: center !important;
}

.v158-mini-window .mini-player-copy,
.coluca-mini-window-v157 .mini-player-copy {
  font-size: .92rem !important;
  line-height: 1.25 !important;
  min-width: 0 !important;
}

.v158-mini-actions,
.v158-mini-window .mini-player-launcher__apps,
.coluca-mini-window-v157 .mini-player-launcher__apps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 6px !important;
  position: relative !important;
  z-index: 5 !important;
  margin: 0 0 8px !important;
}

.v158-mini-actions .mini-player-launcher__app,
.v158-mini-window .mini-player-launcher__app,
.coluca-mini-window-v157 .mini-player-launcher__app {
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 5px !important;
  font-size: .72rem !important;
  overflow: hidden !important;
}

.v158-mini-display,
.v158-mini-window .mini-player-launcher__display,
.coluca-mini-window-v157 .mini-player-launcher__display {
  position: relative !important;
  z-index: 2 !important;
  margin-top: 4px !important;
}

.v158-guide,
.expanded-player-guide {
  background: var(--v158-bg) !important;
  border-right: 0 !important;
  box-shadow: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-y: contain !important;
}

.v158-guide-list,
.expanded-guide-list {
  overflow-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
}

@media (max-width: 760px) {
  [data-coluca-pwa-nav-v158],
  [data-coluca-pwa-nav-v157] {
    position: fixed !important;
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(7px, env(safe-area-inset-bottom, 0px)) !important;
    min-height: 68px !important;
    z-index: 1580 !important;
  }

  .mini-player,
  .v158-player-bar {
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 1500 !important;
  }

  .v158-guide,
  .expanded-player-guide {
    position: fixed !important;
    top: calc(env(safe-area-inset-top, 0px) + 10px) !important;
    right: max(6px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    left: max(6px, env(safe-area-inset-left, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    padding-top: max(14px, env(safe-area-inset-top, 0px)) !important;
    padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important;
    padding-left: max(12px, env(safe-area-inset-left, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    background: var(--v158-bg) !important;
    border-right: 0 !important;
  }

  .expanded-guide-current,
  .expanded-guide-now,
  .expanded-guide-related,
  .expanded-guide-list {
    max-width: 100% !important;
    overflow-x: hidden !important;
    background: var(--v158-bg) !important;
  }
}
/* COLUCA_V158_STRUCTURAL_V4_END */

/* COLUCA_2_STRUCTURAL_PREMIUM_VISITOR_PWA_V158_V4 */
:root{
  --v158-bg:#02040A;
  --v158-panel:#071022;
  --v158-panel-2:#0B1630;
  --v158-line:rgba(80,110,255,.20);
  --v158-purple:#8B5CF6;
  --v158-blue:#3B82F6;
  --v158-cyan:#22D3EE;
  --v158-live:#38E879;
  --v158-live-dot:#FF4055;
  --v158-gold:#F3CF66;
}

.v158-header{
  background:var(--v158-bg)!important;
  border-bottom:1px solid rgba(80,110,255,.10)!important;
  box-shadow:none!important;
}

.v158-footer{
  background:var(--v158-bg)!important;
  padding:14px 18px!important;
  margin-top:18px!important;
  min-height:0!important;
}
.v158-footer *{
  margin-top:0;
  margin-bottom:0;
}
.v158-footer .v158-developer-link,
.v158-footer .coluca-developer-link-v157{
  color:var(--v158-gold)!important;
  font-weight:700!important;
  text-decoration:none!important;
}

.v158-station-logo,
.v158-station-logo img,
.station-logo,
.station-logo img,
.station-logo--row,
.station-logo--row img,
.station-avatar,
.station-avatar img,
.station-avatar--small,
.station-avatar--small img,
.preview-station-logo,
.preview-station-logo img{
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

.v158-live-dot,
.live-dot{
  background:var(--v158-live-dot)!important;
  border-color:var(--v158-live-dot)!important;
  color:var(--v158-live-dot)!important;
}
.v158-live-text,
.mini-cover__live,
.player-live-details,
.station-live-button{
  color:var(--v158-live)!important;
}

.v158-play-button,
.mini-player-button,
.mini-player-launcher__play,
.v158-lock,
.favorite-lock-button,
.station-favorite-shortcut-lock,
.account-favorite-lock-mark{
  background:linear-gradient(145deg,var(--v158-purple),var(--v158-blue) 58%,var(--v158-cyan))!important;
  color:#fff!important;
  border-color:rgba(34,211,238,.34)!important;
  box-shadow:0 8px 22px rgba(59,130,246,.20)!important;
}

.v158-output-eq,
.mini-player-launcher__app--eq{
  transform:scale(.80)!important;
  transform-origin:center!important;
}

@media (min-width:1101px){
  body:not(.v158-mini-window) .v158-player-shell,
  body:not(.v158-mini-window) .mini-player{
    position:fixed!important;
    left:18px!important;
    right:18px!important;
    bottom:14px!important;
    width:auto!important;
    max-width:none!important;
    min-height:76px!important;
    padding:8px 12px!important;
    display:grid!important;
    grid-template-columns:minmax(280px,1.15fr) minmax(230px,.70fr) minmax(430px,1.35fr) minmax(120px,.35fr)!important;
    align-items:center!important;
    gap:10px!important;
    border-radius:18px!important;
    background:rgba(2,4,10,.985)!important;
    border:1px solid var(--v158-line)!important;
    box-shadow:0 18px 48px rgba(0,0,0,.42)!important;
    overflow:visible!important;
    z-index:1800!important;
  }

  body:not(.v158-mini-window) .v158-player-main,
  body:not(.v158-mini-window) .mini-player-main{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
  }

  body:not(.v158-mini-window) .v158-player-copy,
  body:not(.v158-mini-window) .mini-player-copy{
    min-width:0!important;
    overflow:hidden!important;
  }

  body:not(.v158-mini-window) .v158-output-actions,
  body:not(.v158-mini-window) .mini-player-launcher__apps{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:6px!important;
    align-items:center!important;
    min-width:0!important;
  }

  body:not(.v158-mini-window) .v158-output-action,
  body:not(.v158-mini-window) .mini-player-launcher__app{
    min-width:0!important;
    min-height:40px!important;
    padding:5px 6px!important;
    overflow:hidden!important;
    position:relative!important;
  }

  body:not(.v158-mini-window) .v158-output-spotify,
  body:not(.v158-mini-window) .mini-player-launcher__app--spotify{
    color:#1ED760!important;
  }

  body:not(.v158-mini-window) .v158-output-apple,
  body:not(.v158-mini-window) .mini-player-launcher__app--apple{
    color:#CBA8FF!important;
  }

  main,
  .main-content,
  .page-content{
    padding-bottom:112px!important;
  }
}

.v158-mini-window{
  background:var(--v158-bg)!important;
  overflow-x:hidden!important;
}
.v158-mini-window .player-shell{
  max-width:100%!important;
  padding:9px!important;
  gap:7px!important;
}
.v158-mini-window .mini-player-main{
  gap:8px!important;
}
.v158-mini-window .mini-player-copy{
  font-size:.90rem!important;
  line-height:1.24!important;
  min-width:0!important;
}
.v158-mini-window .mini-player-button{
  width:54px!important;
  height:54px!important;
  min-width:54px!important;
  min-height:54px!important;
}
.v158-mini-window .mini-player-launcher__apps{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:5px!important;
  margin-bottom:10px!important;
  position:relative!important;
  z-index:5!important;
}
.v158-mini-window .mini-player-launcher__app{
  min-width:0!important;
  min-height:42px!important;
  padding:4px 5px!important;
  font-size:.70rem!important;
  overflow:hidden!important;
  position:relative!important;
}

.v158-guide,
.expanded-player-guide{
  background:var(--v158-bg)!important;
  border-right:0!important;
  box-shadow:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  touch-action:pan-y!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-y:contain!important;
}
.v158-guide-list,
.expanded-guide-list{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  touch-action:pan-y!important;
  -webkit-overflow-scrolling:touch!important;
}
.v158-guide-current,
.v158-guide-now,
.v158-guide-related,
.expanded-guide-current,
.expanded-guide-now,
.expanded-guide-related{
  background:var(--v158-bg)!important;
  max-width:100%!important;
  border-right:0!important;
}

@media (max-width:760px){
  .v158-pwa-nav,
  .coluca-pwa-nav-v157{
    position:fixed!important;
    left:max(8px,env(safe-area-inset-left,0px))!important;
    right:max(8px,env(safe-area-inset-right,0px))!important;
    bottom:max(7px,env(safe-area-inset-bottom,0px))!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:3px!important;
    min-height:66px!important;
    padding:6px!important;
    background:rgba(2,4,10,.985)!important;
    border:1px solid rgba(80,110,255,.16)!important;
    border-radius:21px!important;
    box-shadow:0 16px 36px rgba(0,0,0,.40)!important;
    z-index:1900!important;
  }

  .v158-pwa-nav a,
  .coluca-pwa-nav-v157 a{
    min-width:0!important;
    min-height:52px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    text-decoration:none!important;
    color:#AAB6CC!important;
    border-radius:13px!important;
  }

  .v158-player-shell,
  .mini-player{
    bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;
    z-index:1750!important;
  }

  .v158-guide,
  .expanded-player-guide{
    position:fixed!important;
    top:calc(env(safe-area-inset-top,0px) + 8px)!important;
    left:max(5px,env(safe-area-inset-left,0px))!important;
    right:max(5px,env(safe-area-inset-right,0px))!important;
    bottom:calc(env(safe-area-inset-bottom,0px) + 6px)!important;
    width:auto!important;
    max-width:none!important;
    max-height:none!important;
    padding-top:max(14px,env(safe-area-inset-top,0px))!important;
    padding-right:max(10px,env(safe-area-inset-right,0px))!important;
    padding-bottom:max(14px,env(safe-area-inset-bottom,0px))!important;
    padding-left:max(10px,env(safe-area-inset-left,0px))!important;
    background:var(--v158-bg)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    touch-action:pan-y!important;
    -webkit-overflow-scrolling:touch!important;
    border-right:0!important;
    box-shadow:none!important;
    z-index:2600!important;
  }
}

/* COLUCA_V159_PLAYER_BAR_VISIBILITY_HOTFIX */
@media (min-width: 1101px) {
  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .integration-guide,
  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .integration-guide-grid {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player {
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    bottom: 10px !important;
    min-height: 74px !important;
    overflow: visible !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__apps {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(110px, 1fr)) !important;
    gap: 8px !important;
    align-items: stretch !important;
    min-width: 0 !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__app {
    min-height: 42px !important;
    min-width: 0 !important;
    padding: 7px 10px !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: #F5F7FF !important;
    background: #070D1A !important;
    border: 1px solid rgba(96,119,255,.28) !important;
    border-radius: 13px !important;
    position: relative !important;
    z-index: 3 !important;
    overflow: visible !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__app--spotify {
    color: #1ED760 !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__app--apple {
    color: #C8B5FF !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__app--eq {
    color: #A98CFF !important;
    transform: none !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-button,
  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__play {
    opacity: 1 !important;
    visibility: visible !important;
    color: #FFFFFF !important;
    background: linear-gradient(145deg,#8B5CF6,#4F7CFF 62%,#22D3EE) !important;
    border: 1px solid rgba(34,211,238,.34) !important;
    box-shadow: 0 8px 24px rgba(79,124,255,.22) !important;
  }

  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-copy,
  body:not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher__display {
    opacity: 1 !important;
    visibility: visible !important;
    color: #F6F8FF !important;
  }
}

/* ===== COLUCA EMERGENCY THEME STABILIZER v2.2 ===== */
:root { --c2-line: rgba(139,92,255,.22); --c2-line-strong: rgba(139,92,255,.40); --c2-shadow: 0 24px 70px rgba(0,0,0,.42); --c2-purple: #8B5CFF; --c2-gold-soft: rgba(232,201,95,.16); }
.mini-player-launcher, .coluca-footer, .footer-player, .live-player-card { border-color: rgba(139,92,255,.24) !important; box-shadow: 0 22px 70px rgba(0,0,0,.38), 0 0 0 1px rgba(139,92,255,.07) !important; }
/* ===== END COLUCA EMERGENCY THEME STABILIZER v2.2 ===== */

/* ===== COLUCA PREMIUM CONTROL BAR V2.3 START ===== */

/* Shared premium surfaces */
body:not(.admincenter-body) .player-shell,
body:not(.admincenter-body) .mini-player,
body:not(.admincenter-body) .mini-shell,
body:not(.admincenter-body) .expanded-player-card,
body:not(.admincenter-body) .expanded-player-guide,
body:not(.admincenter-body) .expanded-guide-row,
body:not(.admincenter-body) .expanded-guide-current,
body:not(.admincenter-body) .expanded-guide-related-station,
body:not(.admincenter-body) .program-guide,
body:not(.admincenter-body) .program-guide-sheet,
body:not(.admincenter-body) .station-guide,
body:not(.admincenter-body) .station-guide-sheet,
body:not(.admincenter-body) .guide-sheet,
body:not(.admincenter-body) .guide-drawer {
  box-shadow:
    0 18px 48px rgba(0,0,0,.34),
    0 0 0 1px rgba(139,92,255,.05) !important;
}

/* Bottom player shell */
body:not(.admincenter-body) .player-shell {
  background:
    radial-gradient(circle at 0% 0%, rgba(139,92,255,.14), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(36,140,255,.11), transparent 28%),
    linear-gradient(180deg, rgba(9,14,27,.98), rgba(4,8,18,.99)) !important;
  border-top: 1px solid rgba(139,92,255,.26) !important;
  border-left: 1px solid rgba(36,140,255,.14) !important;
  border-right: 1px solid rgba(36,140,255,.14) !important;
  border-radius: 24px 24px 0 0 !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

body:not(.admincenter-body) .player-inner {
  min-height: 88px !important;
  gap: 18px !important;
  padding: 0 22px !important;
}

body:not(.admincenter-body) .player-station small,
body:not(.admincenter-body) .player-live-details,
body:not(.admincenter-body) .expanded-player-now small,
body:not(.admincenter-body) .expanded-guide-row small,
body:not(.admincenter-body) .expanded-guide-empty {
  color: #9eb0c9 !important;
}

body:not(.admincenter-body) .player-live-details svg,
body:not(.admincenter-body) .expanded-guide-row.is-live time,
body:not(.admincenter-body) .expanded-player-now > span {
  color: #e8c95f !important;
}

body:not(.admincenter-body) .player-button,
body:not(.admincenter-body) .player-button--primary,
body:not(.admincenter-body) .expanded-player-controls .player-button,
body:not(.admincenter-body) .mini-transport__play {
  background:
    linear-gradient(135deg, rgba(139,92,255,.95), rgba(77,126,255,.95)) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 14px 34px rgba(94,82,255,.28) !important;
}

body:not(.admincenter-body) .player-skip,
body:not(.admincenter-body) .icon-button,
body:not(.admincenter-body) .player-actions .volume,
body:not(.admincenter-body) .player-actions [data-player-close] {
  border: 1px solid rgba(76,98,138,.42) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.035) !important;
  color: #e9eef7 !important;
}

body:not(.admincenter-body) .player-skip:hover,
body:not(.admincenter-body) .icon-button:hover {
  background: rgba(139,92,255,.16) !important;
  color: #ffffff !important;
}

/* Mini player window */
body:not(.admincenter-body) .mini-shell {
  background:
    radial-gradient(circle at 12% 0, rgba(139,92,255,.16), transparent 25%),
    radial-gradient(circle at 88% 0, rgba(36,140,255,.13), transparent 24%),
    linear-gradient(180deg, rgba(6,10,20,.985), rgba(4,7,15,.992)) !important;
  border: 1px solid rgba(139,92,255,.24) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}

body:not(.admincenter-body) .mini-header,
body:not(.admincenter-body) .mini-footer,
body:not(.admincenter-body) .mini-device-strip,
body:not(.admincenter-body) .mini-transport,
body:not(.admincenter-body) .mini-services,
body:not(.admincenter-body) .mini-audio-lab,
body:not(.admincenter-body) .mini-volume {
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.008)) !important;
  border-color: rgba(139,92,255,.18) !important;
}

body:not(.admincenter-body) .mini-status {
  background: rgba(12,19,33,.84) !important;
  border: 1px solid rgba(104,255,112,.22) !important;
  border-radius: 999px !important;
  color: #dff7e1 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03) !important;
}

body:not(.admincenter-body) .mini-device-strip {
  gap: 10px !important;
  padding: 10px 12px !important;
}

body:not(.admincenter-body) .mini-device-strip button,
body:not(.admincenter-body) .mini-transport button,
body:not(.admincenter-body) .mini-service,
body:not(.admincenter-body) .mini-footer button {
  border: 1px solid rgba(82,105,146,.38) !important;
  border-radius: 18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    linear-gradient(180deg, rgba(12,20,34,.95), rgba(8,13,24,.98)) !important;
  color: #f4f7fb !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 12px 28px rgba(0,0,0,.20) !important;
}

body:not(.admincenter-body) .mini-device-strip button:hover:not(:disabled),
body:not(.admincenter-body) .mini-transport button:hover:not(:disabled),
body:not(.admincenter-body) .mini-transport button.is-active,
body:not(.admincenter-body) .mini-service:hover:not(:disabled),
body:not(.admincenter-body) .mini-footer button:hover:not(:disabled) {
  background:
    linear-gradient(180deg, rgba(139,92,255,.18), rgba(36,140,255,.10)),
    linear-gradient(180deg, rgba(13,21,37,.97), rgba(8,13,24,.99)) !important;
  border-color: rgba(139,92,255,.42) !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}

body:not(.admincenter-body) .mini-transport {
  gap: 10px !important;
  padding: 10px 12px !important;
}

body:not(.admincenter-body) .mini-transport button {
  height: 42px !important;
  font: 800 12px/1 Inter, ui-sans-serif, system-ui, -apple-system, sans-serif !important;
  letter-spacing: .01em !important;
}

body:not(.admincenter-body) .mini-services {
  gap: 10px !important;
  padding: 10px 12px 12px !important;
}

body:not(.admincenter-body) .mini-service {
  min-height: 64px !important;
  height: 64px !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 10px !important;
  padding: 10px 12px !important;
}

body:not(.admincenter-body) .mini-service strong {
  font-size: 11px !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif !important;
  letter-spacing: -.01em !important;
}

body:not(.admincenter-body) .mini-service small,
body:not(.admincenter-body) .mini-device-strip small,
body:not(.admincenter-body) .mini-footer small,
body:not(.admincenter-body) .mini-display__top,
body:not(.admincenter-body) .mini-spectrum__mode {
  color: #8fa8c7 !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif !important;
}

body:not(.admincenter-body) .mini-service__icon {
  font-size: 24px !important;
}

body:not(.admincenter-body) .mini-service--spotify .mini-service__icon {
  color: #1ed760 !important;
}
body:not(.admincenter-body) .mini-service--apple .mini-service__icon {
  color: #ff7c9d !important;
}
body:not(.admincenter-body) .mini-service--eq .mini-service__icon {
  color: #e8c95f !important;
}

body:not(.admincenter-body) .mini-display,
body:not(.admincenter-body) .mini-spectrum__screen,
body:not(.admincenter-body) .mini-real-eq {
  background:
    linear-gradient(145deg, rgba(139,92,255,.06), rgba(36,140,255,.03)),
    rgba(9,15,28,.9) !important;
  border: 1px solid rgba(61,102,176,.24) !important;
  border-radius: 18px !important;
}

body:not(.admincenter-body) .mini-display__station,
body:not(.admincenter-body) .mini-display__track,
body:not(.admincenter-body) .expanded-player-station h2 {
  color: #f6f9ff !important;
}

body:not(.admincenter-body) .mini-cover {
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.03) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.22) !important;
}

body:not(.admincenter-body) .mini-volume {
  padding: 10px 12px !important;
}

body:not(.admincenter-body) .mini-volume input,
body:not(.admincenter-body) .mini-real-eq input[type="range"],
body:not(.admincenter-body) .volume {
  accent-color: #8B5CF6 !important;
}

/* Expanded player / zendergids */
body:not(.admincenter-body) .expanded-player-card {
  background:
    radial-gradient(circle at 80% 8%, rgba(139,92,255,.14), transparent 32%),
    radial-gradient(circle at 12% 0, rgba(36,140,255,.10), transparent 24%),
    linear-gradient(160deg, rgba(8,13,24,.985), rgba(4,8,16,.995)) !important;
  border: 1px solid rgba(139,92,255,.22) !important;
}

body:not(.admincenter-body) .expanded-player-now,
body:not(.admincenter-body) .expanded-guide-row,
body:not(.admincenter-body) .expanded-guide-current,
body:not(.admincenter-body) .expanded-guide-related-station {
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)) !important;
  border: 1px solid rgba(76,98,138,.34) !important;
  border-radius: 18px !important;
}

body:not(.admincenter-body) .expanded-guide-row.is-live,
body:not(.admincenter-body) .expanded-guide-current {
  border-color: rgba(232,201,95,.32) !important;
  box-shadow: inset 0 0 0 1px rgba(232,201,95,.05) !important;
}

body:not(.admincenter-body) .expanded-player-guide h3,
body:not(.admincenter-body) .expanded-player-guide > header > a {
  color: #f5f8ff !important;
}

body:not(.admincenter-body) .expanded-player-guide > header > a {
  color: #e8c95f !important;
}

/* Program guide / bottom sheet layers */
body:not(.admincenter-body) .program-guide,
body:not(.admincenter-body) .program-guide-sheet,
body:not(.admincenter-body) .station-guide,
body:not(.admincenter-body) .station-guide-sheet,
body:not(.admincenter-body) .guide-sheet,
body:not(.admincenter-body) .guide-drawer,
body:not(.admincenter-body) [data-program-guide],
body:not(.admincenter-body) [data-station-guide] {
  background:
    linear-gradient(180deg, rgba(10,16,30,.985), rgba(5,9,18,.995)) !important;
  border: 1px solid rgba(139,92,255,.24) !important;
  border-radius: 24px 24px 0 0 !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}

/* Mobile refinement */
@media (max-width: 900px) {
  body:not(.admincenter-body) .player-inner {
    gap: 12px !important;
    padding: 0 14px !important;
  }

  body:not(.admincenter-body) .mini-service {
    min-height: 60px !important;
    height: 60px !important;
  }

  body:not(.admincenter-body) .expanded-guide-row {
    grid-template-columns: 82px minmax(0, 1fr) !important;
  }
}
/* ===== COLUCA PREMIUM CONTROL BAR V2.3 END ===== */

/* ===== COLUCA V161 RESPONSIVE DESKTOP PLAYER FIX START =====
   Developed by VORYNIQ B.V.
   Intellectual Property (IP) © ELITAD-group Ltd. All rights reserved.
   Purpose: keep the main player full-width on large desktop screens while
   keeping the standalone Mini Player launcher compact and isolated.
   ====================================================================== */

/* The main live player must behave the same on half-width and full-width desktop. */
@media (min-width: 761px) {
  body:not(.admincenter-body) .player-shell:not(.mini-player) {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 22px 22px 0 0 !important;
    z-index: 1200 !important;
    overflow: visible !important;
  }

  body:not(.admincenter-body) .player-shell:not(.mini-player) .player-inner {
    width: min(100%, 1600px) !important;
    max-width: 1600px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding-left: clamp(16px, 2vw, 30px) !important;
    padding-right: clamp(16px, 2vw, 30px) !important;
  }

  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content,
  body:not(.admincenter-body) .site-footer {
    padding-bottom: 108px !important;
  }
}

/* Full desktop: do NOT convert the main player to a 390px floating card. */
@media (min-width: 1101px) {
  body:not(.admincenter-body) .player-shell:not(.mini-player) {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-radius: 22px 22px 0 0 !important;
  }
}

/* Keep the legacy inline mini player retired. */
body:not(.admincenter-body) .mini-player {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Desktop standalone Mini Player launcher: compact premium card above the main player. */
@media (min-width: 1025px) and (pointer: fine) {
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console {
    position: fixed !important;
    left: 18px !important;
    right: auto !important;
    top: auto !important;
    bottom: 106px !important;
    width: 292px !important;
    min-width: 292px !important;
    max-width: min(292px, calc(100vw - 36px)) !important;
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
    margin: 0 !important;
    padding: 6px !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    border: 1px solid rgba(139,92,255,.28) !important;
    border-radius: 17px !important;
    background:
      radial-gradient(circle at 0% 0%, rgba(139,92,255,.15), transparent 44%),
      linear-gradient(180deg, rgba(10,16,29,.985), rgba(4,8,17,.995)) !important;
    box-shadow:
      0 18px 44px rgba(0,0,0,.42),
      0 0 0 1px rgba(36,140,255,.06) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    overflow: hidden !important;
    z-index: 1250 !important;
  }

  /* Undo broad [class*=mini-player] rules on launcher descendants. */
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__display,
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__apps,
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app,
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__play,
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__display {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 6px 9px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    border: 1px solid rgba(82,105,146,.30) !important;
    border-radius: 12px !important;
    background: rgba(4,8,17,.72) !important;
    color: #F6F8FF !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__play {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    color: #A98CFF !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy {
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__apps {
    flex: 0 0 auto !important;
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, 32px) !important;
    grid-template-rows: 48px !important;
    align-items: center !important;
    justify-content: end !important;
    gap: 4px !important;
    overflow: visible !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(82,105,146,.30) !important;
    border-radius: 11px !important;
    background: rgba(255,255,255,.035) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
    overflow: hidden !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--spotify { color: #1ED760 !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--apple { color: #C8A8FF !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--eq { color: #E8C95F !important; }
}

/* ===== COLUCA V161 RESPONSIVE DESKTOP PLAYER FIX END ===== */

/* ===== COLUCA PWA RESPONSIVE REPAIR V162 START ===== */
@media (max-width: 760px) {
  html,
  body:not(.admincenter-body) {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none !important;
  }

  body:not(.admincenter-body) * {
    box-sizing: border-box;
  }

  /* Real, tappable PWA bottom navigation. Every item now resolves to a real route. */
  body:not(.admincenter-body) .v158-pwa-nav,
  body:not(.admincenter-body) .coluca-pwa-nav-v156,
  body:not(.admincenter-body) .coluca-pwa-nav-v157 {
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(7px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    z-index: 2200 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  body:not(.admincenter-body) .v158-pwa-nav a,
  body:not(.admincenter-body) .coluca-pwa-nav-v156 a,
  body:not(.admincenter-body) .coluca-pwa-nav-v157 a {
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(139,92,246,.16);
  }

  /* The row above the player contains actions, not fake pages. Hide unavailable integrations. */
  body:not(.admincenter-body) .player-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 7px 4px 8px !important;
    scrollbar-width: none !important;
  }
  body:not(.admincenter-body) .player-actions::-webkit-scrollbar { display: none !important; }
  body:not(.admincenter-body) .player-actions .player-music-add[disabled] { display: none !important; }
  body:not(.admincenter-body) .player-actions .player-shazam { display: none !important; }
  body:not(.admincenter-body) .player-actions [data-player-expand] { display: none !important; }
  body:not(.admincenter-body) .player-actions .player-favorite,
  body:not(.admincenter-body) .player-actions .player-guide-button,
  body:not(.admincenter-body) .player-actions .audio-settings-button,
  body:not(.admincenter-body) .player-actions [data-device-playback-open],
  body:not(.admincenter-body) .player-actions [data-mute],
  body:not(.admincenter-body) .player-actions [data-player-close] {
    display: grid !important;
    flex: 0 0 48px !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    place-items: center !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }
  body:not(.admincenter-body) .player-guide-button {
    color: #e8c95f !important;
    border-color: rgba(232,201,95,.34) !important;
    background: linear-gradient(180deg, rgba(232,201,95,.12), rgba(255,255,255,.025)) !important;
  }
  body:not(.admincenter-body) .player-guide-button svg {
    width: 22px !important;
    height: 22px !important;
  }

  /* Keep the bottom player above the navigation, never wider than the visual viewport. */
  body:not(.admincenter-body) .player-shell {
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    overflow: hidden !important;
    z-index: 1750 !important;
  }

  /* Expanded player is one safe-area aware scrolling surface. */
  body:not(.admincenter-body) .expanded-player[open] {
    position: fixed !important;
    top: max(10px, env(safe-area-inset-top, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(139,92,255,.28) !important;
    border-radius: 26px !important;
    overflow: hidden !important;
    background: #040817 !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.58) !important;
  }

  body:not(.admincenter-body) .expanded-player-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    max-height: calc(100dvh - max(18px, env(safe-area-inset-top, 0px)) - max(16px, env(safe-area-inset-bottom, 0px))) !important;
    margin: 0 !important;
    padding: 14px 14px calc(26px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    border: 0 !important;
    border-radius: 25px !important;
  }

  body:not(.admincenter-body) .expanded-player-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    min-height: 52px !important;
    margin: -2px -2px 10px !important;
    padding: 4px 2px 8px !important;
    background: linear-gradient(180deg, rgba(4,8,23,.98) 70%, rgba(4,8,23,0)) !important;
    backdrop-filter: blur(14px) !important;
  }

  body:not(.admincenter-body) .expanded-player-header .icon-button {
    flex: 0 0 48px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    pointer-events: auto !important;
  }

  /* Undo the legacy mobile rule that stretched artwork to the full screen. */
  body:not(.admincenter-body) .expanded-player-station {
    grid-template-columns: 104px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 4px !important;
  }
  body:not(.admincenter-body) .expanded-player-artwork {
    width: 104px !important;
    max-width: 104px !important;
    height: 104px !important;
    aspect-ratio: 1 / 1 !important;
    padding: 8px !important;
    border-radius: 22px !important;
  }
  body:not(.admincenter-body) .expanded-player-artwork img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    border-radius: 14px !important;
  }
  body:not(.admincenter-body) .expanded-player-station h2 {
    font-size: clamp(1.65rem, 8vw, 2.35rem) !important;
    line-height: 1 !important;
    overflow-wrap: anywhere !important;
  }

  body:not(.admincenter-body) .expanded-player-controls {
    display: grid !important;
    grid-template-columns: 52px minmax(70px, 1fr) 52px 48px !important;
    gap: 9px !important;
    width: 100% !important;
    align-items: center !important;
  }

  /* The guide belongs inside the dialog; it must never become a second fixed viewport. */
  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .v158-guide {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    margin: 22px 0 0 !important;
    padding: 18px 0 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-top: 1px solid rgba(139,92,255,.18) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    z-index: auto !important;
  }

  body:not(.admincenter-body) .expanded-guide-current,
  body:not(.admincenter-body) .expanded-guide-list,
  body:not(.admincenter-body) .expanded-guide-related,
  body:not(.admincenter-body) .expanded-guide-row {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: hidden !important;
  }
  body:not(.admincenter-body) .expanded-guide-list {
    overflow-y: visible !important;
  }
  body:not(.admincenter-body) .expanded-guide-row {
    grid-template-columns: 78px minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  /* The top-layer dialog owns navigation while open. */
  body:not(.admincenter-body):has(.expanded-player[open]) .v158-pwa-nav,
  body:not(.admincenter-body):has(.expanded-player[open]) .coluca-pwa-nav-v156,
  body:not(.admincenter-body):has(.expanded-player[open]) .coluca-pwa-nav-v157 {
    visibility: hidden !important;
    pointer-events: none !important;
  }
}
/* ===== COLUCA PWA RESPONSIVE REPAIR V162 END ===== */


/* ===== COLUCA PWA URGENT REPAIR V163 START ===== */
:root {
  --coluca-live-red: #ff4055;
  --coluca-live-green: #39e879;
}

/* One live language everywhere: red dot, green LIVE. */
.live-dot,
.v158-live-dot {
  background: var(--coluca-live-red) !important;
  border-color: var(--coluca-live-red) !important;
  color: var(--coluca-live-red) !important;
}
.player-kicker,
.station-state,
.station-live-button,
.mini-cover__live,
.v158-live-label,
.v158-live-text {
  color: var(--coluca-live-green) !important;
}
.player-kicker time {
  color: #e8c95f !important;
}

@media (max-width: 900px) {
  html,
  body:not(.admincenter-body) {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: clip !important;
  }

  /* Bottom shortcuts: centered, full-width tap targets and no dead SPA navigation. */
  body:not(.admincenter-body) .v158-pwa-nav,
  body:not(.admincenter-body) .coluca-pwa-nav-v156,
  body:not(.admincenter-body) .coluca-pwa-nav-v157 {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    left: 50% !important;
    right: auto !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    width: calc(100% - 20px) !important;
    max-width: 680px !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    padding: 8px 7px !important;
    border-radius: 22px !important;
    z-index: 3200 !important;
  }
  body:not(.admincenter-body) .v158-pwa-nav a,
  body:not(.admincenter-body) .coluca-pwa-nav-v156 a,
  body:not(.admincenter-body) .coluca-pwa-nav-v157 a {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 52px !important;
    display: grid !important;
    place-items: center !important;
    align-content: center !important;
    gap: 5px !important;
    text-align: center !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  /* Player: actions centered, LIVE line cannot disappear below station name. */
  body:not(.admincenter-body) .player-shell {
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 24px !important;
  }
  body:not(.admincenter-body) .player-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "actions actions"
      "station controls" !important;
    gap: 9px 10px !important;
    padding: 10px 12px 12px !important;
  }
  body:not(.admincenter-body) .player-actions {
    grid-area: actions !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 0 9px !important;
    overflow-x: auto !important;
    border-bottom: 1px solid rgba(139,92,255,.16) !important;
  }
  body:not(.admincenter-body) .player-station {
    grid-area: station !important;
    min-width: 0 !important;
    gap: 9px !important;
  }
  body:not(.admincenter-body) .player-controls {
    grid-area: controls !important;
    gap: 7px !important;
  }
  body:not(.admincenter-body) .player-kicker {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    min-height: 18px !important;
    margin: 0 0 2px !important;
    font-size: .70rem !important;
    line-height: 1.1 !important;
    font-weight: 850 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }
  body:not(.admincenter-body) .player-station strong {
    display: block !important;
    max-width: 100% !important;
    font-size: 1.02rem !important;
    line-height: 1.15 !important;
  }
  body:not(.admincenter-body) .player-station small {
    display: block !important;
    max-width: min(45vw, 190px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* Expanded guide: keep it below iOS status/battery area and centered. */
  body:not(.admincenter-body) .expanded-player[open] {
    top: max(58px, env(safe-area-inset-top, 0px)) !important;
    right: 8px !important;
    bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
    left: 8px !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    border-radius: 24px !important;
    overflow: hidden !important;
  }
  body:not(.admincenter-body) .expanded-player-card {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: calc(100dvh - max(68px, env(safe-area-inset-top, 0px)) - max(18px, env(safe-area-inset-bottom, 0px))) !important;
    padding: 10px 14px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  body:not(.admincenter-body) .expanded-player-header {
    top: 0 !important;
    min-height: 54px !important;
    margin: 0 0 8px !important;
    padding: 2px 0 8px !important;
  }
  body:not(.admincenter-body) .expanded-player-station {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 76px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 4px auto 0 !important;
  }
  body:not(.admincenter-body) .expanded-player-artwork {
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
    padding: 6px !important;
    border-radius: 18px !important;
  }
  body:not(.admincenter-body) .expanded-player-artwork img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    border-radius: 12px !important;
  }
  body:not(.admincenter-body) .expanded-player-station h2 {
    margin: 3px 0 !important;
    font-size: clamp(1.55rem, 7vw, 2rem) !important;
    line-height: 1.05 !important;
  }
  body:not(.admincenter-body) .expanded-player-now {
    width: 100% !important;
    margin: 14px 0 12px !important;
    padding: 13px 14px !important;
  }
  body:not(.admincenter-body) .expanded-player-controls {
    width: min(100%, 330px) !important;
    margin: 0 auto !important;
    grid-template-columns: 50px minmax(68px, 1fr) 50px 46px !important;
    justify-content: center !important;
  }

  /* Program guide itself: no giant artwork and no second fullscreen surface. */
  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .v158-guide {
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px 0 0 !important;
    padding: 16px 0 0 !important;
    scroll-margin-top: 64px !important;
    overflow: visible !important;
  }
  body:not(.admincenter-body) .expanded-player-guide > header {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
  }
  body:not(.admincenter-body) .expanded-player-guide > header > a {
    flex: 0 0 auto !important;
    padding: 8px 10px !important;
    border: 1px solid rgba(232,201,95,.30) !important;
    border-radius: 12px !important;
    background: rgba(232,201,95,.08) !important;
    color: #e8c95f !important;
    font-size: .72rem !important;
    text-decoration: none !important;
  }
  body:not(.admincenter-body) .expanded-guide-current {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 12px 13px !important;
    border-radius: 16px !important;
  }
  body:not(.admincenter-body) .expanded-guide-current > img {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
  body:not(.admincenter-body) .expanded-guide-now {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    line-height: 1.45 !important;
  }
  body:not(.admincenter-body) .expanded-guide-list {
    display: grid !important;
    width: 100% !important;
    gap: 8px !important;
    margin-top: 10px !important;
  }
  body:not(.admincenter-body) .expanded-guide-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: 70px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 11px 12px !important;
    border-radius: 14px !important;
  }
  body:not(.admincenter-body) .expanded-guide-row time {
    font-size: .74rem !important;
    white-space: nowrap !important;
  }
  body:not(.admincenter-body) .expanded-guide-group-label {
    margin: 8px 0 2px !important;
    color: #9b6cff !important;
    font-size: .72rem !important;
    letter-spacing: .10em !important;
    text-transform: uppercase !important;
  }
  body:not(.admincenter-body) .expanded-player-favorites {
    width: 100% !important;
    padding-top: 18px !important;
  }

  body:not(.admincenter-body):has(.expanded-player[open]) .player-shell,
  body:not(.admincenter-body):has(.expanded-player[open]) .v158-pwa-nav,
  body:not(.admincenter-body):has(.expanded-player[open]) .coluca-pwa-nav-v156,
  body:not(.admincenter-body):has(.expanded-player[open]) .coluca-pwa-nav-v157 {
    visibility: hidden !important;
    pointer-events: none !important;
  }
}
/* ===== COLUCA PWA URGENT REPAIR V163 END ===== */



/* COLUCA v164 — neon responsive player redesign */
.expanded-player--neon {
  width: min(100%, 980px);
  max-width: 980px;
  border: 0;
  padding: 0;
  background: transparent;
  color: #f7f8ff;
}
.expanded-player--neon::backdrop {
  background: linear-gradient(180deg, rgba(1, 6, 18, 0.66), rgba(2, 8, 22, 0.9));
  backdrop-filter: blur(8px);
}
.expanded-player-card--neon {
  position: relative;
  display: grid;
  gap: 22px;
  padding: 26px;
  border-radius: 34px;
  border: 1px solid rgba(92, 153, 255, 0.18);
  background:
    radial-gradient(circle at top right, rgba(112, 62, 255, 0.18), transparent 28%),
    radial-gradient(circle at bottom left, rgba(0, 198, 255, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(4, 11, 28, 0.98), rgba(3, 9, 24, 0.96));
  box-shadow: 0 32px 100px rgba(0, 0, 0, 0.56), inset 0 1px 0 rgba(255,255,255,0.04);
  overflow: hidden;
}
.expanded-player-card--neon::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,0), rgba(67, 0, 255, 0.08), rgba(0, 205, 255, 0.06), rgba(0,0,0,0));
  pointer-events: none;
}
.expanded-player-header--app,
.expanded-player-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.expanded-player-brand {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.expanded-player-brand img {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(255, 176, 0, 0.42);
  background: linear-gradient(180deg, rgba(255, 192, 61, 0.12), rgba(255, 192, 61, 0.04));
  box-shadow: 0 0 0 1px rgba(255, 167, 39, 0.16), 0 10px 28px rgba(0,0,0,0.28);
  padding: 8px;
}
.expanded-player-brand strong {
  display: block;
  font-size: 1.95rem;
  line-height: 1;
  letter-spacing: 0.04em;
}
.expanded-player-brand small {
  display: block;
  margin-top: 4px;
  color: rgba(230, 236, 255, 0.82);
  font-size: 0.96rem;
  letter-spacing: 0.06em;
}
.expanded-player-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.expanded-player-header-button {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: rgba(8, 19, 40, 0.8);
  border: 1px solid rgba(132, 162, 255, 0.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.expanded-player-hero-card,
.expanded-player-guide,
.expanded-player-favorites--neon {
  position: relative;
  border-radius: 30px;
  border: 1px solid rgba(104, 142, 255, 0.16);
  background: linear-gradient(180deg, rgba(5, 14, 34, 0.9), rgba(4, 11, 27, 0.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 20px 48px rgba(0,0,0,0.28);
}
.expanded-player-hero-card {
  padding: 28px;
}
.expanded-player-station--neon {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) auto;
  gap: 24px;
  align-items: start;
}
.expanded-player-artwork--neon {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 210px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(7, 21, 53, 0.95), rgba(7, 20, 48, 0.78));
  border: 1px solid rgba(65, 255, 140, 0.3);
  box-shadow: inset 0 0 0 1px rgba(77, 255, 150, 0.06), 0 10px 32px rgba(0,0,0,0.32);
  overflow: hidden;
}
.expanded-player-artwork--neon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.expanded-player-summary {
  display: grid;
  gap: 12px;
  padding-top: 10px;
}
.expanded-player-live-row {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #30ea68;
}
.expanded-player-live-row .live-dot { background: #ff5165; box-shadow: 0 0 18px rgba(255,81,101,0.82); }
.expanded-player-summary h2 {
  margin: 0;
  font-size: clamp(2.4rem, 6vw, 4rem);
  line-height: 0.96;
}
.expanded-player-status-line,
.expanded-player-meta {
  margin: 0;
  color: rgba(228, 233, 247, 0.84);
  font-size: 1.15rem;
}
.expanded-player-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.expanded-player-pill {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(23, 182, 94, 0.85), rgba(13, 130, 70, 0.86));
  color: #f6fffa;
  font-weight: 800;
  font-size: 1.05rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 8px 24px rgba(8, 50, 26, 0.34);
}
.expanded-player-favorite--hero {
  align-self: start;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: rgba(12, 22, 48, 0.8);
  border: 1px solid rgba(118, 147, 255, 0.18);
}
.expanded-player-favorite--hero.is-favorite {
  color: #ff5472;
  box-shadow: 0 0 0 1px rgba(255, 84, 114, 0.18), 0 0 24px rgba(255, 84, 114, 0.22);
}
.expanded-player-controls--neon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 4vw, 40px);
  margin-top: 22px;
}
.expanded-player-controls--neon .player-skip,
.expanded-player-controls--neon .player-button {
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.26);
}
.expanded-player-controls--neon .player-button {
  width: 108px;
  height: 108px;
  background: radial-gradient(circle at top left, #6e7bff, #8455ff 45%, #2dcbff 100%);
}
.expanded-player-volume-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  margin-top: 20px;
}
.expanded-player-volume {
  width: 100%;
}
.expanded-player-volume::-webkit-slider-thumb {
  box-shadow: 0 0 0 4px rgba(255,255,255,0.18), 0 0 28px rgba(139, 93, 255, 0.55);
}
.expanded-player-shortcuts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(121, 150, 255, 0.14);
}
.expanded-player-shortcut {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 88px;
  padding: 10px 12px;
  border-radius: 18px;
  color: rgba(227, 231, 245, 0.9);
  border: 1px solid rgba(109, 130, 184, 0.12);
  background: linear-gradient(180deg, rgba(8, 15, 36, 0.72), rgba(4, 9, 22, 0.76));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
  text-align: center;
}
.expanded-player-shortcut i,
.expanded-player-shortcut svg {
  width: 22px;
  height: 22px;
}
.expanded-player-shortcut span { font-size: 0.95rem; font-weight: 600; }
.expanded-player-shortcut.is-active,
.expanded-player-shortcut:hover {
  border-color: rgba(182, 93, 255, 0.5);
  color: #c07bff;
  box-shadow: inset 0 -3px 0 #9c4cff, 0 0 0 1px rgba(182,93,255,0.16);
}
.expanded-player-guide,
.expanded-player-favorites--neon {
  padding: 24px;
}
.expanded-player-section-header h3 {
  margin: 4px 0 0;
  font-size: clamp(1.4rem, 3vw, 2rem);
}
.expanded-player-section-header [data-expanded-guide-source],
.expanded-player-favorites-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #b56bff;
  font-weight: 700;
}
.expanded-guide-current--neon {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: center;
  padding: 18px 0 20px;
}
.expanded-guide-current-media {
  position: relative;
  width: 92px;
  height: 92px;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(37, 255, 125, 0.34);
  background: linear-gradient(180deg, rgba(14, 29, 58, 0.95), rgba(6, 17, 38, 0.9));
  display: grid;
  place-items: center;
}
.expanded-guide-current-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.expanded-guide-current-icon {
  color: rgba(236,240,255,0.92);
}
.expanded-guide-current-copy {
  display: grid;
  gap: 6px;
}
.expanded-guide-current-label {
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #30ea68;
}
.expanded-guide-now {
  margin: 0;
  font-size: 1.08rem;
  color: rgba(239,243,255,0.92);
}
.expanded-guide-list--neon {
  display: grid;
  gap: 12px;
}
.expanded-guide-group-label {
  margin-top: 6px;
  color: rgba(229, 233, 248, 0.7);
  font-size: 0.88rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.expanded-guide-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 18px 18px;
  border-radius: 20px;
  border: 1px solid rgba(89, 116, 184, 0.16);
  background: linear-gradient(180deg, rgba(5, 12, 30, 0.82), rgba(4, 10, 24, 0.94));
}
.expanded-guide-row time {
  color: #f0f3ff;
  font-size: 1.06rem;
  font-weight: 700;
}
.expanded-guide-row strong {
  display: block;
  margin-bottom: 6px;
  font-size: 1.25rem;
}
.expanded-guide-row small,
.expanded-guide-empty {
  color: rgba(221, 226, 239, 0.74);
}
.expanded-guide-related { margin-top: 18px; }
.expanded-favorites-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}
.expanded-favorites-list > * {
  border-radius: 18px;
  border: 1px solid rgba(89, 116, 184, 0.14);
  background: linear-gradient(180deg, rgba(8, 15, 34, 0.72), rgba(4, 9, 22, 0.76));
  padding: 16px;
}
.player-shell {
  z-index: 52;
  pointer-events: none;
}
.player-shell .player-inner,
.player-shell button,
.player-shell input,
.player-shell a,
.player-shell [role="button"] {
  pointer-events: auto;
}
.mini-player,
.mini-player-launcher {
  z-index: 80;
}
.coluca-pwa-nav-v156,
.coluca-pwa-nav-v157,
.v158-pwa-nav {
  z-index: 70;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px max(14px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  background: linear-gradient(180deg, rgba(5, 10, 24, 0.82), rgba(5, 10, 24, 0.96));
  backdrop-filter: blur(16px);
  border-top: 1px solid rgba(95, 130, 255, 0.16);
  box-shadow: 0 -12px 40px rgba(0,0,0,0.34);
}
.coluca-pwa-nav-v156 a,
.coluca-pwa-nav-v157 a,
.v158-pwa-nav a {
  border-radius: 18px;
  min-height: 74px;
}
.coluca-pwa-nav-v156 a[aria-current="page"],
.coluca-pwa-nav-v157 a[aria-current="page"],
.v158-pwa-nav a[aria-current="page"] {
  color: #b56bff;
  background: linear-gradient(180deg, rgba(72, 26, 150, 0.34), rgba(22, 12, 48, 0.34));
  box-shadow: inset 0 0 0 1px rgba(181, 107, 255, 0.14);
}
@media (max-width: 980px) {
  .expanded-player--neon { width: min(100%, calc(100vw - 24px)); }
  .expanded-player-card--neon { padding: 20px; border-radius: 28px; }
  .expanded-player-brand strong { font-size: 1.7rem; }
  .expanded-player-station--neon {
    grid-template-columns: minmax(130px, 176px) minmax(0, 1fr);
  }
  .expanded-player-favorite--hero {
    grid-column: 2;
    justify-self: end;
    margin-top: -78px;
  }
}
@media (max-width: 720px) {
  .expanded-player--neon {
    width: 100%;
    max-width: 100%;
    min-height: 100dvh;
    margin: 0;
  }
  .expanded-player-card--neon {
    min-height: 100dvh;
    border-radius: 0;
    padding: calc(18px + env(safe-area-inset-top)) 16px calc(140px + env(safe-area-inset-bottom)) 16px;
  }
  .expanded-player-station--neon {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .expanded-player-artwork--neon {
    min-height: 190px;
    max-width: 260px;
  }
  .expanded-player-favorite--hero {
    grid-column: auto;
    position: absolute;
    top: 24px;
    right: 22px;
    width: 62px;
    height: 62px;
    margin-top: 0;
  }
  .expanded-player-controls--neon .player-button {
    width: 90px;
    height: 90px;
  }
  .expanded-player-shortcuts {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }
  .expanded-player-shortcut {
    min-height: 76px;
    padding: 8px 6px;
  }
  .expanded-player-shortcut span {
    font-size: 0.8rem;
  }
  .expanded-guide-current--neon,
  .expanded-guide-row {
    grid-template-columns: 1fr;
  }
  .expanded-guide-row time {
    font-size: 0.98rem;
  }
}


/* COLUCA v165 — expanded player polish */
.expanded-player-artwork--neon {
  width: clamp(132px, 18vw, 168px);
  min-width: clamp(132px, 18vw, 168px);
  min-height: clamp(132px, 18vw, 168px);
  border-radius: 28px;
  padding: 10px;
  background: linear-gradient(180deg, rgba(12, 25, 56, 0.96), rgba(7, 18, 40, 0.92));
  border: 1px solid rgba(98, 198, 255, 0.18);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 14px 36px rgba(0,0,0,0.34), 0 0 0 1px rgba(82,125,255,0.08);
}
.expanded-player-artwork--neon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 22px;
  background: rgba(0, 0, 0, 0.16);
}
.expanded-player-controls--neon {
  gap: clamp(18px, 4vw, 32px);
}
.expanded-player-controls--neon .player-skip,
.expanded-player-controls--neon .player-button,
.expanded-player-volume-row .icon-button,
.expanded-player-header-button,
.expanded-player-favorite--hero,
.expanded-player-shortcut {
  border-color: rgba(128, 150, 255, 0.18);
  background: linear-gradient(180deg, rgba(12, 22, 48, 0.96), rgba(8, 16, 36, 0.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 12px 28px rgba(0,0,0,0.24);
}
.expanded-player-controls--neon .player-button {
  background: radial-gradient(circle at top left, #7a83ff 0%, #8a5cff 44%, #33ceff 100%);
  box-shadow: 0 18px 42px rgba(64, 125, 255, 0.24), 0 8px 24px rgba(134, 96, 255, 0.28);
}
.expanded-player-controls--neon .player-skip {
  width: 80px;
  height: 80px;
}
.expanded-player-controls--neon .player-button i,
.expanded-player-controls--neon .player-button svg,
.expanded-player-controls--neon .player-skip i,
.expanded-player-controls--neon .player-skip svg,
.expanded-player-volume-row .icon-button i,
.expanded-player-volume-row .icon-button svg,
.expanded-player-header-button i,
.expanded-player-header-button svg,
.expanded-player-favorite--hero i,
.expanded-player-favorite--hero svg,
.expanded-player-shortcut i,
.expanded-player-shortcut svg {
  color: #f7f9ff;
  stroke: currentColor;
  opacity: 1;
}
.expanded-player-controls--neon .player-skip i,
.expanded-player-controls--neon .player-skip svg {
  width: 32px;
  height: 32px;
  filter: drop-shadow(0 0 10px rgba(255,255,255,0.08));
}
.expanded-player-controls--neon .player-button i,
.expanded-player-controls--neon .player-button svg {
  width: 42px;
  height: 42px;
  filter: drop-shadow(0 0 18px rgba(255,255,255,0.12));
}
.expanded-player-volume-row .icon-button,
.expanded-player-header-button {
  width: 58px;
  height: 58px;
}
.expanded-player-shortcut {
  min-height: 92px;
  gap: 10px;
}
.expanded-player-shortcut i,
.expanded-player-shortcut svg {
  width: 24px;
  height: 24px;
}
.expanded-player-shortcut span {
  font-size: 0.98rem;
  font-weight: 700;
}
.expanded-player-shortcut.is-active {
  color: #d69cff;
  border-color: rgba(197, 112, 255, 0.42);
  box-shadow: inset 0 -3px 0 #b55dff, 0 0 0 1px rgba(197,112,255,0.18), 0 0 28px rgba(140,76,255,0.12);
}
.expanded-player-favorite--hero.is-favorite {
  color: #ff5b77;
}
@media (max-width: 720px) {
  .expanded-player-artwork--neon {
    width: 148px;
    min-width: 148px;
    min-height: 148px;
    margin: 0 auto;
  }
  .expanded-player-controls--neon .player-skip {
    width: 72px;
    height: 72px;
  }
  .expanded-player-controls--neon .player-button {
    width: 96px;
    height: 96px;
  }
  .expanded-player-controls--neon .player-button i,
  .expanded-player-controls--neon .player-button svg {
    width: 40px;
    height: 40px;
  }
  .expanded-player-shortcut {
    min-height: 84px;
    padding: 10px 6px;
  }
  .expanded-player-shortcut span {
    font-size: 0.86rem;
  }
}


/* COLUCA v166 — mobile & tablet alignment refinement */
.expanded-player-card--neon {
  max-width: 100%;
}
.expanded-player-hero-card {
  overflow: hidden;
}
.expanded-player-summary h2,
.expanded-player-status-line,
.expanded-player-meta,
.expanded-guide-now {
  text-wrap: balance;
}
.expanded-player-shortcut span {
  white-space: normal;
  line-height: 1.18;
}

@media (max-width: 980px) {
  .expanded-player--neon {
    width: min(100%, calc(100vw - 18px));
  }
  .expanded-player-card--neon {
    padding: max(18px, calc(14px + env(safe-area-inset-top))) 18px calc(118px + env(safe-area-inset-bottom)) 18px;
    border-radius: 28px;
  }
  .expanded-player-header--app {
    align-items: flex-start;
  }
  .expanded-player-brand {
    flex: 1 1 auto;
    min-width: 0;
  }
  .expanded-player-brand img {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    padding: 7px;
  }
  .expanded-player-brand strong {
    font-size: 1.5rem;
    line-height: 1;
  }
  .expanded-player-brand small {
    font-size: 0.88rem;
    line-height: 1.2;
    letter-spacing: 0.05em;
  }
  .expanded-player-header-actions {
    flex: 0 0 auto;
  }
  .expanded-player-header-button {
    width: 52px;
    height: 52px;
  }

  .expanded-player-hero-card {
    padding: 22px 18px 20px;
  }
  .expanded-player-station--neon {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 18px;
  }
  .expanded-player-artwork--neon {
    width: clamp(150px, 26vw, 180px);
    min-width: clamp(150px, 26vw, 180px);
    min-height: clamp(150px, 26vw, 180px);
    margin: 0 auto;
  }
  .expanded-player-summary {
    width: min(100%, 520px);
    justify-items: center;
    text-align: center;
    padding-top: 0;
  }
  .expanded-player-live-row,
  .expanded-player-pill-row {
    justify-content: center;
  }
  .expanded-player-summary h2 {
    font-size: clamp(2rem, 6vw, 3rem);
  }
  .expanded-player-status-line,
  .expanded-player-meta {
    font-size: 1.02rem;
    max-width: 28ch;
  }
  .expanded-player-favorite--hero {
    position: absolute;
    top: 22px;
    right: 18px;
    width: 58px;
    height: 58px;
    margin-top: 0;
    z-index: 2;
  }

  .expanded-player-controls--neon {
    justify-content: center;
    gap: 18px;
    margin-top: 18px;
  }
  .expanded-player-controls--neon .player-skip {
    width: 72px;
    height: 72px;
  }
  .expanded-player-controls--neon .player-button {
    width: 96px;
    height: 96px;
  }
  .expanded-player-controls--neon .player-skip svg,
  .expanded-player-controls--neon .player-skip i {
    width: 30px;
    height: 30px;
  }
  .expanded-player-controls--neon .player-button svg,
  .expanded-player-controls--neon .player-button i {
    width: 40px;
    height: 40px;
  }

  .expanded-player-volume-row {
    grid-template-columns: 52px minmax(0,1fr) 52px;
    width: min(100%, 360px);
    margin: 18px auto 0;
    gap: 12px;
  }
  .expanded-player-volume-row .icon-button {
    width: 52px;
    height: 52px;
  }

  .expanded-player-shortcuts {
    width: 100%;
    margin-top: 18px;
    padding-top: 18px;
    gap: 10px;
  }
  .expanded-player-shortcut {
    min-height: 82px;
    padding: 10px 8px;
    justify-content: center;
  }
  .expanded-player-shortcut span {
    font-size: 0.9rem;
  }

  .expanded-player-guide,
  .expanded-player-favorites--neon {
    padding: 20px 18px;
  }
  .expanded-player-section-header {
    align-items: center;
  }
  .expanded-player-section-header [data-expanded-guide-source],
  .expanded-player-favorites-link {
    font-size: 0.92rem;
    padding: 12px 16px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(35, 30, 12, 0.92), rgba(22, 20, 10, 0.92));
    border: 1px solid rgba(214, 182, 82, 0.24);
    white-space: nowrap;
  }
}

@media (max-width: 760px) {
  .expanded-player--neon {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
  .expanded-player-card--neon {
    min-height: 100dvh;
    padding: calc(16px + env(safe-area-inset-top)) 14px calc(128px + env(safe-area-inset-bottom)) 14px;
    border-radius: 0;
  }
  .expanded-player-header--app {
    gap: 12px;
  }
  .expanded-player-brand {
    gap: 12px;
    align-items: flex-start;
  }
  .expanded-player-brand strong {
    font-size: 1.42rem;
  }
  .expanded-player-brand small {
    font-size: 0.82rem;
  }
  .expanded-player-header-actions {
    gap: 8px;
  }
  .expanded-player-header-button {
    width: 48px;
    height: 48px;
  }
  .expanded-player-hero-card {
    padding: 18px 14px 16px;
    border-radius: 24px;
  }
  .expanded-player-artwork--neon {
    width: 144px;
    min-width: 144px;
    min-height: 144px;
    border-radius: 22px;
  }
  .expanded-player-summary {
    width: 100%;
    gap: 10px;
  }
  .expanded-player-summary h2 {
    font-size: 2.55rem;
  }
  .expanded-player-status-line,
  .expanded-player-meta,
  .expanded-guide-now {
    font-size: 0.96rem;
  }
  .expanded-player-pill {
    min-height: 38px;
    padding: 0 14px;
    font-size: 0.95rem;
    text-align: center;
  }
  .expanded-player-favorite--hero {
    top: 18px;
    right: 14px;
    width: 54px;
    height: 54px;
  }
  .expanded-player-controls--neon {
    gap: 14px;
    flex-wrap: nowrap;
  }
  .expanded-player-controls--neon .player-skip {
    width: 68px;
    height: 68px;
  }
  .expanded-player-controls--neon .player-button {
    width: 88px;
    height: 88px;
  }
  .expanded-player-controls--neon .player-skip svg,
  .expanded-player-controls--neon .player-skip i {
    width: 28px;
    height: 28px;
  }
  .expanded-player-controls--neon .player-button svg,
  .expanded-player-controls--neon .player-button i {
    width: 36px;
    height: 36px;
  }
  .expanded-player-volume-row {
    width: min(100%, 300px);
    grid-template-columns: 48px minmax(0,1fr) 48px;
    gap: 10px;
  }
  .expanded-player-volume-row .icon-button {
    width: 48px;
    height: 48px;
  }
  .expanded-player-shortcuts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .expanded-player-shortcut {
    min-height: 76px;
    border-radius: 16px;
  }
  .expanded-player-shortcut span {
    font-size: 0.88rem;
  }
  .expanded-player-guide,
  .expanded-player-favorites--neon {
    padding: 18px 14px;
    border-radius: 24px;
  }
  .expanded-player-section-header {
    flex-direction: row;
    align-items: flex-end;
    gap: 12px;
  }
  .expanded-player-section-header h3 {
    font-size: 1.85rem;
  }
  .expanded-player-section-header [data-expanded-guide-source] {
    padding: 10px 14px;
    font-size: 0.88rem;
  }
  .expanded-guide-current--neon {
    grid-template-columns: 1fr;
    gap: 12px;
    text-align: center;
  }
  .expanded-guide-current-media {
    margin: 0 auto;
  }
  .expanded-guide-row {
    gap: 10px;
    padding: 16px;
  }
}

@media (min-width: 761px) and (max-width: 1024px) {
  .expanded-player-card--neon {
    width: min(100%, 760px);
    margin: 0 auto;
  }
  .expanded-player-station--neon {
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: center;
  }
  .expanded-player-summary {
    justify-items: start;
    text-align: left;
    width: 100%;
  }
  .expanded-player-live-row,
  .expanded-player-pill-row {
    justify-content: flex-start;
  }
  .expanded-player-shortcuts {
    grid-template-columns: repeat(4, minmax(0,1fr));
  }
}


/* COLUCA v167 — PWA mobile & tablet UX fix */
@media (max-width: 1024px) {
  html,
  body:not(.admincenter-body) {
    overflow-x: clip !important;
  }

  body:not(.admincenter-body) .expanded-player[open] {
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    top: max(8px, env(safe-area-inset-top, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    overflow: hidden !important;
  }

  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .expanded-player-card--neon,
  body:not(.admincenter-body) .expanded-player-hero-card,
  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites,
  body:not(.admincenter-body) .expanded-player-favorites--neon,
  body:not(.admincenter-body) .expanded-guide-current,
  body:not(.admincenter-body) .expanded-guide-list,
  body:not(.admincenter-body) .expanded-guide-row,
  body:not(.admincenter-body) .expanded-favorites-list,
  body:not(.admincenter-body) .expanded-favorites-list > * {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .expanded-player-card--neon {
    overflow-x: clip !important;
    overflow-y: auto !important;
    scroll-padding-top: 96px !important;
  }

  body:not(.admincenter-body) .expanded-player-hero-card,
  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites--neon {
    overflow-x: clip !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 12px !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header > div {
    width: 100% !important;
    min-width: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header h3,
  body:not(.admincenter-body) .expanded-player-favorites h3 {
    max-width: 12ch !important;
    line-height: 1.02 !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header [data-expanded-guide-source],
  body:not(.admincenter-body) .expanded-player-favorites-link {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }

  body:not(.admincenter-body) .expanded-favorites-list {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body:not(.admincenter-body) .expanded-guide-current-media {
    width: 84px !important;
    height: 84px !important;
  }
}

@media (max-width: 760px) {
  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .expanded-player-card--neon {
    padding: calc(14px + env(safe-area-inset-top, 0px)) 12px calc(118px + env(safe-area-inset-bottom, 0px)) 12px !important;
    border-radius: 22px !important;
  }

  body:not(.admincenter-body) .expanded-player-hero-card {
    padding: 16px 12px 14px !important;
    border-radius: 22px !important;
  }

  body:not(.admincenter-body) .expanded-player-station,
  body:not(.admincenter-body) .expanded-player-station--neon {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 16px !important;
    margin-top: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-summary {
    justify-items: center !important;
    text-align: center !important;
    width: 100% !important;
    padding-top: 0 !important;
    gap: 10px !important;
  }

  body:not(.admincenter-body) .expanded-player-live-row,
  body:not(.admincenter-body) .expanded-player-pill-row {
    justify-content: center !important;
  }

  body:not(.admincenter-body) .expanded-player-artwork,
  body:not(.admincenter-body) .expanded-player-artwork--neon {
    width: 146px !important;
    max-width: 146px !important;
    height: 146px !important;
    min-height: 146px !important;
    margin: 0 auto !important;
  }

  body:not(.admincenter-body) .expanded-player-favorite--hero {
    position: absolute !important;
    top: 16px !important;
    right: 12px !important;
    width: 52px !important;
    height: 52px !important;
    margin: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-controls,
  body:not(.admincenter-body) .expanded-player-controls--neon {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    flex-wrap: nowrap !important;
  }

  body:not(.admincenter-body) .expanded-player-controls .player-skip,
  body:not(.admincenter-body) .expanded-player-controls--neon .player-skip {
    width: 66px !important;
    height: 66px !important;
    flex: 0 0 66px !important;
  }

  body:not(.admincenter-body) .expanded-player-controls .player-button,
  body:not(.admincenter-body) .expanded-player-controls--neon .player-button {
    width: 84px !important;
    height: 84px !important;
    flex: 0 0 84px !important;
  }

  body:not(.admincenter-body) .expanded-player-volume-row {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 46px minmax(0, 1fr) 46px !important;
    gap: 10px !important;
    margin-top: 16px !important;
  }

  body:not(.admincenter-body) .expanded-player-volume-row .icon-button {
    width: 46px !important;
    height: 46px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcuts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
    margin-top: 16px !important;
    padding-top: 16px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcut {
    min-height: 72px !important;
    padding: 10px 8px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcut span {
    font-size: 0.84rem !important;
  }

  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites--neon {
    margin-top: 16px !important;
    padding: 16px 12px !important;
    border-radius: 22px !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header h3,
  body:not(.admincenter-body) .expanded-player-favorites h3 {
    max-width: none !important;
    font-size: clamp(1.65rem, 6vw, 2.2rem) !important;
  }

  body:not(.admincenter-body) .expanded-guide-current,
  body:not(.admincenter-body) .expanded-guide-row {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  body:not(.admincenter-body) .expanded-guide-row time {
    display: block !important;
  }
}

@media (min-width: 761px) and (max-width: 1024px) {
  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .expanded-player-card--neon {
    width: min(100%, 760px) !important;
    margin: 0 auto !important;
    padding: calc(16px + env(safe-area-inset-top, 0px)) 18px calc(116px + env(safe-area-inset-bottom, 0px)) 18px !important;
  }

  body:not(.admincenter-body) .expanded-player-hero-card {
    padding: 20px 18px 18px !important;
  }

  body:not(.admincenter-body) .expanded-player-station,
  body:not(.admincenter-body) .expanded-player-station--neon {
    grid-template-columns: 160px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 18px !important;
  }

  body:not(.admincenter-body) .expanded-player-artwork,
  body:not(.admincenter-body) .expanded-player-artwork--neon {
    width: 160px !important;
    max-width: 160px !important;
    height: 160px !important;
    min-height: 160px !important;
  }

  body:not(.admincenter-body) .expanded-player-summary {
    justify-items: start !important;
    text-align: left !important;
    width: 100% !important;
  }

  body:not(.admincenter-body) .expanded-player-live-row,
  body:not(.admincenter-body) .expanded-player-pill-row {
    justify-content: flex-start !important;
  }

  body:not(.admincenter-body) .expanded-player-controls,
  body:not(.admincenter-body) .expanded-player-controls--neon {
    justify-content: center !important;
    gap: 16px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcuts {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header [data-expanded-guide-source],
  body:not(.admincenter-body) .expanded-player-favorites-link {
    width: auto !important;
    max-width: 100% !important;
    align-self: flex-start !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body:not(.admincenter-body) .expanded-favorites-list {
    grid-template-columns: 1fr 1fr !important;
  }
}


/* ===== COLUCA PWA MOBILE/TABLET FINAL PLAYER FIX V168 START ===== */
.expanded-player-sticky-bar { display: none; }
@media (max-width: 1024px) {
  html,
  body:not(.admincenter-body) {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    overflow-x: clip !important;
  }

  body:not(.admincenter-body) .expanded-player[open] {
    position: fixed !important;
    inset-block: max(8px, env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) !important;
    inset-inline: max(8px, env(safe-area-inset-left, 0px)) max(8px, env(safe-area-inset-right, 0px)) !important;
    inline-size: auto !important;
    max-inline-size: none !important;
    block-size: auto !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 26px !important;
    box-sizing: border-box !important;
  }

  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .expanded-player-card--neon {
    position: relative !important;
    display: block !important;
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100% !important;
    max-block-size: 100% !important;
    margin: 0 !important;
    overflow-x: clip !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-gutter: auto !important;
    scroll-padding-block-start: 152px !important;
    box-sizing: border-box !important;
  }

  body:not(.admincenter-body) .expanded-player-card--neon > *,
  body:not(.admincenter-body) .expanded-player-hero-card,
  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites,
  body:not(.admincenter-body) .expanded-player-favorites--neon,
  body:not(.admincenter-body) .expanded-guide-current,
  body:not(.admincenter-body) .expanded-guide-list,
  body:not(.admincenter-body) .expanded-guide-row,
  body:not(.admincenter-body) .expanded-favorites-list,
  body:not(.admincenter-body) .expanded-favorites-list > * {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    box-sizing: border-box !important;
  }

  body:not(.admincenter-body) .expanded-player-header--app {
    position: sticky !important;
    inset-block-start: 0 !important;
    z-index: 60 !important;
    min-block-size: 64px !important;
    margin: 0 0 12px !important;
    padding: 6px 4px 10px !important;
    background: linear-gradient(180deg, rgba(4,8,23,.995) 78%, rgba(4,8,23,.86) 92%, rgba(4,8,23,0)) !important;
    backdrop-filter: blur(18px) saturate(130%) !important;
  }

  body:not(.admincenter-body) .expanded-player-hero-card {
    margin: 0 0 12px !important;
    overflow-x: clip !important;
  }

  /* Compact controls become the persistent player while the guide/favorites scroll. */
  body:not(.admincenter-body) .expanded-player-sticky-bar {
    position: sticky !important;
    inset-block-start: 68px !important;
    z-index: 55 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    min-block-size: 76px !important;
    margin: 0 0 12px !important;
    padding: 10px 10px !important;
    border: 1px solid rgba(111, 142, 255, .22) !important;
    border-radius: 20px !important;
    background:
      linear-gradient(90deg, rgba(113, 55, 255, .12), transparent 42%),
      rgba(5, 11, 26, .97) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.05) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    box-sizing: border-box !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-station {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    min-inline-size: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #f7f9ff !important;
    text-align: start !important;
    cursor: pointer !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-artwork {
    inline-size: 48px !important;
    block-size: 48px !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(74, 225, 132, .25) !important;
    background: rgba(7,16,34,.9) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.04) !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-artwork img {
    inline-size: 100% !important;
    block-size: 100% !important;
    object-fit: contain !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-copy {
    display: grid !important;
    gap: 1px !important;
    min-inline-size: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-live {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #39e879 !important;
    font-size: .72rem !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-live .live-dot {
    inline-size: 7px !important;
    block-size: 7px !important;
    background: #ff4055 !important;
    box-shadow: 0 0 12px rgba(255,64,85,.65) !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-copy strong,
  body:not(.admincenter-body) .expanded-player-sticky-copy small {
    display: block !important;
    max-inline-size: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-copy strong {
    font-size: .98rem !important;
    line-height: 1.15 !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-copy small {
    color: rgba(224,230,245,.67) !important;
    font-size: .72rem !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-controls {
    display: grid !important;
    grid-template-columns: repeat(3, 44px) !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 0 0 auto !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-button {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    inline-size: 44px !important;
    block-size: 44px !important;
    min-inline-size: 44px !important;
    min-block-size: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(122,145,215,.26) !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, rgba(17,29,59,.98), rgba(8,16,36,.98)) !important;
    color: #f7f9ff !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-toggle {
    background: radial-gradient(circle at 20% 0%, #7885ff, #8456ff 45%, #31caff 100%) !important;
    border-color: rgba(140,117,255,.42) !important;
    box-shadow: 0 8px 20px rgba(99,86,255,.24), inset 0 1px 0 rgba(255,255,255,.14) !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-button svg,
  body:not(.admincenter-body) .expanded-player-sticky-button i {
    inline-size: 21px !important;
    block-size: 21px !important;
    color: currentColor !important;
    stroke: currentColor !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-button .icon-pause {
    display: none !important;
  }

  body:not(.admincenter-body) .expanded-player.is-playing .expanded-player-sticky-button .icon-play {
    display: none !important;
  }

  body:not(.admincenter-body) .expanded-player.is-playing .expanded-player-sticky-button .icon-pause {
    display: block !important;
  }

  body:not(.admincenter-body) #expanded-player-info-section,
  body:not(.admincenter-body) #expanded-player-guide-section,
  body:not(.admincenter-body) #expanded-player-favorites-section {
    scroll-margin-block-start: 154px !important;
  }

  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites--neon {
    margin-inline: 0 !important;
    overflow-x: clip !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header > div,
  body:not(.admincenter-body) .expanded-player-section-header h3,
  body:not(.admincenter-body) .expanded-player-section-header [data-expanded-guide-source],
  body:not(.admincenter-body) .expanded-player-favorites-link,
  body:not(.admincenter-body) .expanded-guide-now,
  body:not(.admincenter-body) .expanded-guide-empty,
  body:not(.admincenter-body) .expanded-guide-row,
  body:not(.admincenter-body) .expanded-guide-row > *,
  body:not(.admincenter-body) .expanded-favorites-list,
  body:not(.admincenter-body) .expanded-favorites-list > * {
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header [data-expanded-guide-source],
  body:not(.admincenter-body) .expanded-player-favorites-link {
    white-space: normal !important;
    text-align: center !important;
  }
}

@media (max-width: 600px) {
  body:not(.admincenter-body) .expanded-player[open] {
    inset-inline: max(6px, env(safe-area-inset-left, 0px)) max(6px, env(safe-area-inset-right, 0px)) !important;
  }

  body:not(.admincenter-body) .expanded-player-card,
  body:not(.admincenter-body) .expanded-player-card--neon {
    padding: calc(10px + env(safe-area-inset-top, 0px)) 10px calc(112px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 20px !important;
  }

  body:not(.admincenter-body) .expanded-player-header--app {
    min-block-size: 58px !important;
    padding-inline: 2px !important;
  }

  body:not(.admincenter-body) .expanded-player-brand {
    gap: 9px !important;
  }

  body:not(.admincenter-body) .expanded-player-brand img {
    inline-size: 42px !important;
    block-size: 42px !important;
  }

  body:not(.admincenter-body) .expanded-player-brand strong {
    font-size: 1.22rem !important;
  }

  body:not(.admincenter-body) .expanded-player-brand small {
    font-size: .68rem !important;
    line-height: 1.15 !important;
  }

  body:not(.admincenter-body) .expanded-player-header-button {
    inline-size: 44px !important;
    block-size: 44px !important;
    min-inline-size: 44px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-bar {
    inset-block-start: 60px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 7px !important;
    min-block-size: 68px !important;
    padding: 8px !important;
    border-radius: 17px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-station {
    grid-template-columns: 42px minmax(0,1fr) !important;
    gap: 8px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-artwork {
    inline-size: 42px !important;
    block-size: 42px !important;
    border-radius: 12px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-copy strong {
    font-size: .88rem !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-copy small {
    display: none !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-controls {
    grid-template-columns: repeat(3, 39px) !important;
    gap: 4px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-button {
    inline-size: 39px !important;
    block-size: 39px !important;
    min-inline-size: 39px !important;
    min-block-size: 39px !important;
    border-radius: 12px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-button svg,
  body:not(.admincenter-body) .expanded-player-sticky-button i {
    inline-size: 19px !important;
    block-size: 19px !important;
  }

  body:not(.admincenter-body) #expanded-player-info-section,
  body:not(.admincenter-body) #expanded-player-guide-section,
  body:not(.admincenter-body) #expanded-player-favorites-section {
    scroll-margin-block-start: 138px !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body:not(.admincenter-body) .expanded-player-section-header [data-expanded-guide-source],
  body:not(.admincenter-body) .expanded-player-favorites-link {
    inline-size: 100% !important;
    justify-content: center !important;
    padding: 10px 12px !important;
  }

  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites--neon {
    padding: 14px 10px !important;
  }

  body:not(.admincenter-body) .expanded-guide-current,
  body:not(.admincenter-body) .expanded-guide-row {
    grid-template-columns: 1fr !important;
  }

  body:not(.admincenter-body) .expanded-favorites-list {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 601px) and (max-width: 1024px) {
  body:not(.admincenter-body) .expanded-player-sticky-bar {
    inset-block-start: 70px !important;
    min-block-size: 80px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-station {
    grid-template-columns: 54px minmax(0, 1fr) !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-artwork {
    inline-size: 54px !important;
    block-size: 54px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-controls {
    grid-template-columns: repeat(3, 48px) !important;
    gap: 8px !important;
  }

  body:not(.admincenter-body) .expanded-player-sticky-button {
    inline-size: 48px !important;
    block-size: 48px !important;
    min-inline-size: 48px !important;
    min-block-size: 48px !important;
  }
}
/* ===== COLUCA PWA MOBILE/TABLET FINAL PLAYER FIX V168 END ===== */


/* COLUCA v169 — PWA icons + expanded volume controls */
.expanded-player-inline-icon {
  display: block;
  width: 24px;
  height: 24px;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 1;
  pointer-events: none;
}
.expanded-player-shortcut-icon {
  width: 26px;
  height: 26px;
}
.expanded-player-shortcut .expanded-player-inline-icon,
.expanded-guide-current-icon .expanded-player-inline-icon,
.expanded-player-volume-button .expanded-player-inline-icon {
  color: #f7f9ff;
}
.expanded-player-shortcut.is-active .expanded-player-inline-icon {
  color: #d69cff;
  filter: drop-shadow(0 0 10px rgba(182,93,255,.30));
}
.expanded-player-volume-button {
  position: relative;
  display: inline-grid !important;
  place-items: center;
}
.expanded-player-volume-button:hover,
.expanded-player-volume-button:focus-visible {
  color: #ffffff !important;
  border-color: rgba(139,92,255,.42) !important;
  background: linear-gradient(180deg, rgba(139,92,255,.18), rgba(36,140,255,.10)) !important;
}
.expanded-player-volume-button.is-confirmed {
  color: #39e879 !important;
  border-color: rgba(57,232,121,.38) !important;
  box-shadow: 0 0 0 1px rgba(57,232,121,.10), 0 0 22px rgba(57,232,121,.14) !important;
}
.expanded-player-volume-button.is-muted {
  color: #ff596d !important;
}
@media (max-width: 1024px) {
  body:not(.admincenter-body) .expanded-player-volume-row {
    grid-template-columns: 48px minmax(0,1fr) 48px !important;
  }
  body:not(.admincenter-body) .expanded-player-volume-button {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
  }
  body:not(.admincenter-body) .expanded-player-shortcut .expanded-player-inline-icon {
    width: 24px !important;
    height: 24px !important;
  }
}


/* COLUCA v170 — single volume control + explicit mute state */
.expanded-player-volume-row {
  grid-template-columns: 58px minmax(0, 1fr) !important;
  align-items: center !important;
}
.expanded-player-mute-slash {
  opacity: 0;
  transition: opacity .16s ease;
}
.expanded-player-mute-wave {
  opacity: 1;
  transition: opacity .16s ease;
}
.expanded-player-volume-button.is-muted .expanded-player-mute-slash {
  opacity: 1;
}
.expanded-player-volume-button.is-muted .expanded-player-mute-wave {
  opacity: .18;
}
.expanded-player-volume-button.is-muted {
  color: #ff596d !important;
  border-color: rgba(255,89,109,.42) !important;
  background: linear-gradient(180deg, rgba(255,89,109,.12), rgba(44,13,24,.78)) !important;
  box-shadow: 0 0 0 1px rgba(255,89,109,.08), 0 0 22px rgba(255,89,109,.12) !important;
}
.expanded-player-volume-button.is-muted .expanded-player-inline-icon {
  color: #ff6b7d !important;
}
@media (max-width: 1024px) {
  body:not(.admincenter-body) .expanded-player-volume-row {
    grid-template-columns: 48px minmax(0, 1fr) !important;
  }
}
@media (max-width: 600px) {
  body:not(.admincenter-body) .expanded-player-volume-row {
    grid-template-columns: 46px minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* ===== COLUCA PWA HOME / FLOATING PLAYER / AUTO FAVORITES / STATION CARDS V171 START ===== */
@media (max-width: 1024px) {
  body:not(.admincenter-body) .daily-top-station { display: none !important; }

  body:not(.admincenter-body) .player-inner {
    grid-template-areas:
      "actions actions"
      "station controls"
      "track track" !important;
  }
  body:not(.admincenter-body) .player-pwa-track {
    grid-area: track !important;
    display: grid !important;
    justify-items: center !important;
    gap: 2px !important;
    min-width: 0 !important;
    width: 100% !important;
    margin: 1px 0 0 !important;
    padding: 8px 8px 2px !important;
    border-top: 1px solid rgba(139,92,255,.13) !important;
    text-align: center !important;
  }
  body:not(.admincenter-body) .player-pwa-track[hidden] { display: none !important; }
  body:not(.admincenter-body) .player-pwa-track strong,
  body:not(.admincenter-body) .player-pwa-track small {
    display: block !important;
    min-width: 0 !important;
    max-width: min(100%, 620px) !important;
    margin: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  body:not(.admincenter-body) .player-pwa-track strong {
    color: #f7f9ff !important;
    font-size: .88rem !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
  }
  body:not(.admincenter-body) .player-pwa-track small {
    color: #9eb0c9 !important;
    font-size: .76rem !important;
    line-height: 1.2 !important;
  }
  body:not(.admincenter-body) .player-station .player-live-details { display: none !important; }

  body:not(.admincenter-body) #auto-favorites {
    scroll-margin-top: calc(88px + env(safe-area-inset-top, 0px)) !important;
  }
  body:not(.admincenter-body) .auto-favorites-empty {
    display: grid !important;
    gap: 10px !important;
    justify-items: start !important;
    padding: 18px !important;
    border: 1px solid rgba(139,92,255,.18) !important;
    border-radius: 20px !important;
    background: linear-gradient(180deg, rgba(13,21,42,.88), rgba(7,13,28,.92)) !important;
  }
  body:not(.admincenter-body) .auto-favorites-empty strong { font-size: 1.05rem !important; }
  body:not(.admincenter-body) .auto-favorites-empty p { margin: 0 !important; color: #9eb0c9 !important; }

  body:not(.admincenter-body) .section--stations .section-heading {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 14px !important;
    margin-bottom: 22px !important;
  }
  body:not(.admincenter-body) .section--stations .section-heading > div,
  body:not(.admincenter-body) .section--stations .section-heading-action {
    min-width: 0 !important;
    width: 100% !important;
  }
  body:not(.admincenter-body) .section--stations .section-heading h2 {
    margin-top: 6px !important;
    font-size: clamp(2rem, 8vw, 3rem) !important;
    line-height: 1 !important;
  }
  body:not(.admincenter-body) .section--stations .section-heading-action {
    display: grid !important;
    justify-items: start !important;
    gap: 8px !important;
  }
  body:not(.admincenter-body) .section--stations .section-heading-action p,
  body:not(.admincenter-body) .section--stations .section-heading-action a {
    max-width: 100% !important;
    margin: 0 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  body:not(.admincenter-body) .section--stations .station-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 16px !important;
    overflow: hidden !important;
  }
  body:not(.admincenter-body) .section--stations .station-card-top,
  body:not(.admincenter-body) .section--stations .station-card-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  body:not(.admincenter-body) .section--stations .station-card-copy {
    display: grid !important;
    gap: 5px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  body:not(.admincenter-body) .section--stations .station-card-copy > span,
  body:not(.admincenter-body) .section--stations .station-card-copy h3,
  body:not(.admincenter-body) .section--stations .station-card-copy p,
  body:not(.admincenter-body) .section--stations .station-card-top > *,
  body:not(.admincenter-body) .section--stations .station-card-footer > * {
    grid-column: auto !important;
    grid-row: auto !important;
    min-width: 0 !important;
  }
  body:not(.admincenter-body) .section--stations .station-card-copy h3 {
    margin: 0 !important;
    font-size: 1.22rem !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere !important;
  }
  body:not(.admincenter-body) .section--stations .station-card-copy p {
    margin: 0 !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }
  body:not(.admincenter-body) .section--stations .station-card-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
  }
}

@media (max-width: 600px) {
  body:not(.admincenter-body) .section--stations .station-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  body:not(.admincenter-body) .section--stations .station-logo {
    width: 64px !important;
    height: 64px !important;
  }
  body:not(.admincenter-body) .section--stations .station-more { max-width: 48% !important; }
}

@media (min-width: 601px) and (max-width: 1024px) {
  body:not(.admincenter-body) .section--stations .station-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  body:not(.admincenter-body) .player-pwa-track strong { font-size: .94rem !important; }
  body:not(.admincenter-body) .player-pwa-track small { font-size: .8rem !important; }
}
/* ===== COLUCA PWA HOME / FLOATING PLAYER / AUTO FAVORITES / STATION CARDS V171 END ===== */


/* ===== COLUCA PWA FLOATING PLAYER STATUS V172 START ===== */
@media (max-width: 1024px) {
  body:not(.admincenter-body) .player-station [data-player-status] {
    display: none !important;
  }

  body:not(.admincenter-body) .player-pwa-track {
    gap: 3px !important;
  }

  body:not(.admincenter-body) .player-pwa-status {
    display: block !important;
    width: 100% !important;
    max-width: min(100%, 620px) !important;
    margin: 0 0 2px !important;
    overflow: hidden !important;
    color: #c7d1e2 !important;
    font-size: .72rem !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.admincenter-body) .player-pwa-track strong,
  body:not(.admincenter-body) .player-pwa-track small {
    text-align: center !important;
  }
}
/* ===== COLUCA PWA FLOATING PLAYER STATUS V172 END ===== */


/* ===== COLUCA PWA CLEAN LIVE/NAV V173 START ===== */
@media (max-width: 1024px) {
  /* Keep the floating player clean: only LIVE remains; yellow date/time is intentionally hidden. */
  body:not(.admincenter-body) .player-kicker .player-datetime-separator,
  body:not(.admincenter-body) .player-kicker [data-player-datetime] {
    display: none !important;
  }

  /* Current-station selection should not look permanently highlighted in the PWA station chooser. */
  body:not(.admincenter-body) .section--stations .station-card.is-active {
    transform: none !important;
    border-color: var(--line, rgba(139,92,255,.16)) !important;
    background: var(--ink-900, rgba(7,13,28,.94)) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.26) !important;
  }
  body:not(.admincenter-body) .section--stations .station-card.is-active .station-state {
    color: var(--coluca-live-green, #39e879) !important;
  }

  /* Outline station glyph: no permanent filled/selected bullseye. */
  body:not(.admincenter-body) .v158-pwa-nav .pwa-nav-icon--stations {
    display: inline-grid !important;
    place-items: center !important;
    width: 22px !important;
    height: 22px !important;
  }
  body:not(.admincenter-body) .v158-pwa-nav .pwa-nav-icon--stations svg {
    width: 22px !important;
    height: 22px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
}
/* ===== COLUCA PWA CLEAN LIVE/NAV V173 END ===== */


/* ===== COLUCA WEBSITE-ONLY STATIONS + PLAYER LAYOUT V174 START =====
   Desktop/browser only. Standalone PWA rules from v173 are intentionally untouched. */

/* Ten featured stations: five per row on wide desktop, four on compact desktop. */
@media (min-width: 1280px) {
  body:not(.admincenter-body) .section--stations .station-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

@media (min-width: 1025px) and (max-width: 1279px) {
  body:not(.admincenter-body) .section--stations .station-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

/* Move the standalone Mini Player launcher to the lower-right on desktop. */
@media (min-width: 1025px) and (pointer: fine) {
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console {
    left: auto !important;
    right: 18px !important;
    bottom: 106px !important;
  }
}

/* Desktop/browser track panel: title + artist centered, connection status below. */
@media (min-width: 1025px) {
  body:not(.admincenter-body) .player-pwa-track {
    display: grid !important;
    justify-items: center !important;
    align-content: center !important;
    gap: 2px !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 430px !important;
    padding: 2px 12px !important;
    text-align: center !important;
  }

  body:not(.admincenter-body) .player-pwa-track[hidden] {
    display: none !important;
  }

  body:not(.admincenter-body) .player-pwa-track strong,
  body:not(.admincenter-body) .player-pwa-track small,
  body:not(.admincenter-body) .player-pwa-track .player-pwa-status {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.admincenter-body) .player-pwa-track strong {
    order: 1 !important;
    color: #f7f9ff !important;
    font-size: .90rem !important;
    line-height: 1.18 !important;
    font-weight: 800 !important;
  }

  body:not(.admincenter-body) .player-pwa-track small {
    order: 2 !important;
    color: #c7d1e2 !important;
    font-size: .76rem !important;
    line-height: 1.18 !important;
  }

  body:not(.admincenter-body) .player-pwa-track .player-pwa-status {
    order: 3 !important;
    margin-top: 3px !important;
    color: #8fa1bb !important;
    font-size: .69rem !important;
    line-height: 1.15 !important;
    font-weight: 650 !important;
  }

  /* The same status no longer needs to be duplicated beneath the station name. */
  body:not(.admincenter-body) .player-station [data-player-status],
  body:not(.admincenter-body) .player-station .player-live-details {
    display: none !important;
  }
}

/* Wide desktop: station | transport | track/status | actions on one clean row. */
@media (min-width: 1400px) {
  body:not(.admincenter-body) .player-shell:not(.mini-player) .player-inner {
    display: grid !important;
    grid-template-columns: minmax(220px, .82fr) auto minmax(280px, 1.05fr) auto !important;
    grid-template-areas: "station controls track actions" !important;
    align-items: center !important;
    gap: 16px !important;
  }
  body:not(.admincenter-body) .player-station { grid-area: station !important; }
  body:not(.admincenter-body) .player-controls { grid-area: controls !important; }
  body:not(.admincenter-body) .player-pwa-track { grid-area: track !important; justify-self: center !important; }
  body:not(.admincenter-body) .player-actions { grid-area: actions !important; }
}

/* Compact desktop: preserve readability by giving actions their own centered row. */
@media (min-width: 1025px) and (max-width: 1399px) {
  body:not(.admincenter-body) .player-shell:not(.mini-player) .player-inner {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto minmax(280px, 1.1fr) !important;
    grid-template-areas:
      "station controls track"
      "actions actions actions" !important;
    align-items: center !important;
    gap: 8px 16px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  body:not(.admincenter-body) .player-station { grid-area: station !important; }
  body:not(.admincenter-body) .player-controls { grid-area: controls !important; }
  body:not(.admincenter-body) .player-pwa-track { grid-area: track !important; justify-self: center !important; }
  body:not(.admincenter-body) .player-actions {
    grid-area: actions !important;
    justify-self: center !important;
    justify-content: center !important;
  }
  body:not(.admincenter-body) main,
  body:not(.admincenter-body) .main-content,
  body:not(.admincenter-body) .page-content,
  body:not(.admincenter-body) .site-footer {
    padding-bottom: 142px !important;
  }
}
/* ===== COLUCA WEBSITE-ONLY STATIONS + PLAYER LAYOUT V174 END ===== */


/* ===== COLUCA WEBSITE / EXPANDED PLAYER POLISH V175 START ===== */
@media (min-width: 1025px) {
  body:not(.admincenter-body) .expanded-player--neon {
    width: min(100%, 1040px) !important;
    max-width: 1040px !important;
  }

  body:not(.admincenter-body) .expanded-player-card--neon {
    max-height: min(92vh, 980px) !important;
    gap: 16px !important;
    padding: clamp(18px, 2vw, 26px) !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
  }

  body:not(.admincenter-body) .expanded-player-header--app {
    gap: 12px !important;
  }

  body:not(.admincenter-body) .expanded-player-brand img {
    width: 48px !important;
    height: 48px !important;
  }

  body:not(.admincenter-body) .expanded-player-brand strong {
    font-size: clamp(2rem, 2.6vw, 2.6rem) !important;
  }

  body:not(.admincenter-body) .expanded-player-brand small {
    font-size: .92rem !important;
  }

  body:not(.admincenter-body) .expanded-player-header-button {
    width: 50px !important;
    height: 50px !important;
  }

  body:not(.admincenter-body) .expanded-player-hero-card {
    padding: clamp(20px, 2vw, 28px) !important;
  }

  body:not(.admincenter-body) .expanded-player-station--neon {
    grid-template-columns: minmax(128px, 180px) minmax(0, 1fr) auto !important;
    gap: clamp(16px, 2vw, 22px) !important;
    align-items: center !important;
  }

  body:not(.admincenter-body) .expanded-player-artwork--neon {
    min-height: clamp(128px, 15vw, 180px) !important;
  }

  body:not(.admincenter-body) .expanded-player-summary {
    gap: 10px !important;
    padding-top: 0 !important;
  }

  body:not(.admincenter-body) .expanded-player-summary h2 {
    font-size: clamp(2.8rem, 4.3vw, 4rem) !important;
    line-height: .95 !important;
  }

  body:not(.admincenter-body) .expanded-player-status-line,
  body:not(.admincenter-body) .expanded-player-meta {
    font-size: clamp(.98rem, 1.4vw, 1.08rem) !important;
    line-height: 1.32 !important;
  }

  body:not(.admincenter-body) .expanded-player-track-details {
    display: grid !important;
    gap: 8px !important;
  }

  body:not(.admincenter-body) .expanded-player-track-details[hidden] {
    display: none !important;
  }

  body:not(.admincenter-body) .expanded-player-track-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
    color: rgba(236, 240, 255, 0.92) !important;
    font-size: .98rem !important;
    line-height: 1.25 !important;
    font-weight: 650 !important;
  }

  body:not(.admincenter-body) .expanded-player-track-item i,
  body:not(.admincenter-body) .expanded-player-track-item svg {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    color: #8bd8ff !important;
  }

  body:not(.admincenter-body) .expanded-player-track-item span:last-child {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.admincenter-body) .expanded-player-pill-row {
    gap: 8px !important;
  }

  body:not(.admincenter-body) .expanded-player-pill {
    min-height: 38px !important;
    padding: 0 16px !important;
    font-size: .96rem !important;
  }

  body:not(.admincenter-body) .expanded-player-favorite--hero {
    width: 64px !important;
    height: 64px !important;
  }

  body:not(.admincenter-body) .expanded-player-controls--neon {
    margin-top: 16px !important;
    gap: clamp(14px, 3vw, 26px) !important;
  }

  body:not(.admincenter-body) .expanded-player-controls--neon .player-button {
    width: 96px !important;
    height: 96px !important;
  }

  body:not(.admincenter-body) .expanded-player-volume-row {
    margin-top: 14px !important;
    gap: 12px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcuts {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 18px !important;
    padding-top: 16px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcut {
    gap: 7px !important;
    min-height: 76px !important;
    padding: 10px 10px !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcut span {
    font-size: .88rem !important;
  }

  body:not(.admincenter-body) .expanded-player-guide,
  body:not(.admincenter-body) .expanded-player-favorites--neon {
    padding: 20px !important;
  }

  body:not(.admincenter-body) .expanded-guide-current--neon {
    gap: 14px !important;
    padding: 14px 0 16px !important;
  }

  body:not(.admincenter-body) .expanded-guide-current-media {
    width: 82px !important;
    height: 82px !important;
  }
}

@media (min-width: 1025px) and (max-width: 1320px) {
  body:not(.admincenter-body) .expanded-player-station--neon {
    grid-template-columns: 140px minmax(0, 1fr) auto !important;
  }

  body:not(.admincenter-body) .expanded-player-shortcuts {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

body:not(.admincenter-body) .player-shazam {
  color: #37b7ff !important;
  border-color: rgba(55, 183, 255, 0.3) !important;
  background: linear-gradient(180deg, rgba(19, 50, 110, 0.56), rgba(11, 25, 54, 0.88)) !important;
}

body:not(.admincenter-body) .player-spotify-add {
  color: #1ed760 !important;
  border-color: rgba(30, 215, 96, 0.34) !important;
  background: linear-gradient(180deg, rgba(8, 24, 14, 0.92), rgba(5, 15, 9, 0.96)) !important;
}

body:not(.admincenter-body) .player-apple-music-add {
  color: #ffffff !important;
  border-color: rgba(255, 91, 146, 0.34) !important;
  background: linear-gradient(135deg, #fa233b 0%, #fb5c74 44%, #f85d9f 100%) !important;
}

body:not(.admincenter-body) .player-apple-music-add .music-add-mark {
  color: rgba(255,255,255,0.92) !important;
}

body:not(.admincenter-body) .expanded-player-shortcut--shazam {
  color: #74cfff !important;
  border-color: rgba(55, 183, 255, 0.35) !important;
  background: linear-gradient(180deg, rgba(16, 53, 118, 0.78), rgba(9, 27, 66, 0.9)) !important;
}

body:not(.admincenter-body) .expanded-player-shortcut--shazam:hover,
body:not(.admincenter-body) .expanded-player-shortcut--shazam:focus-visible {
  color: #a9e1ff !important;
  border-color: rgba(96, 202, 255, 0.55) !important;
  box-shadow: inset 0 -3px 0 #2fa8ff, 0 0 0 1px rgba(47,168,255,0.18) !important;
}
/* ===== COLUCA WEBSITE / EXPANDED PLAYER POLISH V175 END ===== */


/* ===== COLUCA WEBSITE ACTION ICON CLEANUP V177 START ===== */
.player-favorite-lock-icon { display: none; }

@media (min-width: 1025px) {
  /* A locked favourite gets a stable, clearly readable padlock independent of the Lucide subset. */
  body:not(.admincenter-body) .player-favorite.is-locked > [data-lucide] {
    display: none !important;
  }
  body:not(.admincenter-body) .player-favorite.is-locked .player-favorite-lock-icon {
    display: block !important;
    width: 23px !important;
    height: 23px !important;
    color: #ffffff !important;
    filter: drop-shadow(0 0 7px rgba(255,255,255,.14));
  }
  body:not(.admincenter-body) .player-favorite.is-locked {
    color: #ffffff !important;
    border-color: rgba(255, 214, 102, .30) !important;
    background: linear-gradient(180deg, rgba(27,31,45,.96), rgba(12,17,31,.96)) !important;
  }

  /* The small + badges were the circles visible at the lower-right of Spotify/Apple Music. */
  body:not(.admincenter-body) .player-music-add .music-add-mark {
    display: none !important;
  }

  /* Full-colour, self-contained Shazam mark. */
  body:not(.admincenter-body) .player-shazam {
    color: #ffffff !important;
    border-color: rgba(8,167,255,.42) !important;
    background: rgba(8, 35, 74, .72) !important;
  }
  body:not(.admincenter-body) .player-shazam .player-shazam-logo {
    display: block !important;
    width: 26px !important;
    height: 26px !important;
    filter: drop-shadow(0 0 8px rgba(8,167,255,.24));
  }

  /* The redundant expand/maximise button immediately before mute is removed on the website. */
  body:not(.admincenter-body) .player-actions > [data-player-expand] {
    display: none !important;
  }
}
/* ===== COLUCA WEBSITE ACTION ICON CLEANUP V177 END ===== */


/* ===== COLUCA WEBSITE MINI LAUNCHER POLISH V178 START ===== */
@media (min-width: 1025px) and (pointer: fine) {
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console {
    left: auto !important;
    right: 18px !important;
    bottom: 106px !important;
    width: 304px !important;
    min-width: 304px !important;
    max-width: min(304px, calc(100vw - 36px)) !important;
    height: 62px !important;
    padding: 6px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 122px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__display {
    width: 100% !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 6px 10px !important;
    text-align: center !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy {
    width: auto !important;
    display: grid !important;
    justify-items: center !important;
    text-align: center !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy strong {
    font-size: 10px !important;
    letter-spacing: .06em !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy small {
    display: none !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__play {
    display: grid !important;
    place-items: center !important;
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    color: #b99cff !important;
    font-size: 13px !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__apps {
    width: 122px !important;
    min-width: 122px !important;
    max-width: 122px !important;
    height: 48px !important;
    display: grid !important;
    grid-template-columns: repeat(3, 38px) !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 48px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border-radius: 12px !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app svg {
    display: block !important;
    width: 19px !important;
    height: 19px !important;
    fill: currentColor !important;
    opacity: 1 !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--spotify {
    color: #1ed760 !important;
    border-color: rgba(30,215,96,.30) !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--apple {
    color: #ff5b7f !important;
    border-color: rgba(255,91,127,.30) !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--eq {
    color: #e8c95f !important;
    border-color: rgba(232,201,95,.30) !important;
  }
}
/* ===== COLUCA WEBSITE MINI LAUNCHER POLISH V178 END ===== */


/* ===== COLUCA WEBSITE MINI LAUNCHER REBUILD V179 START ===== */
@media (min-width:1025px) and (pointer:fine) {
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console {
    left:auto !important;
    right:18px !important;
    bottom:106px !important;
    width:356px !important;
    min-width:356px !important;
    max-width:min(356px,calc(100vw - 36px)) !important;
    height:64px !important;
    min-height:64px !important;
    max-height:64px !important;
    padding:6px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 174px !important;
    align-items:center !important;
    gap:8px !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__display {
    width:100% !important;
    height:50px !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:30px minmax(0,1fr) !important;
    align-items:center !important;
    gap:9px !important;
    padding:7px 10px !important;
    border:1px solid rgba(93,119,177,.28) !important;
    border-radius:13px !important;
    background:linear-gradient(180deg,rgba(7,13,29,.92),rgba(3,8,18,.96)) !important;
    color:#f7f9ff !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__play {
    position:static !important;
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border:1px solid rgba(139,92,255,.38) !important;
    border-radius:50% !important;
    background:linear-gradient(135deg,#6e5cff,#2fbfff) !important;
    color:#fff !important;
    font-size:12px !important;
    box-shadow:0 6px 16px rgba(66,92,255,.24) !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy {
    position:static !important;
    min-width:0 !important;
    display:grid !important;
    justify-items:start !important;
    align-content:center !important;
    gap:2px !important;
    overflow:hidden !important;
    color:#f7f9ff !important;
    text-align:left !important;
  }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy strong {
    display:block !important;
    width:100% !important;
    overflow:hidden !important;
    color:#fff !important;
    font-size:10.5px !important;
    line-height:1.1 !important;
    font-weight:850 !important;
    letter-spacing:.055em !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__copy small {
    display:block !important;
    width:100% !important;
    overflow:hidden !important;
    color:#8496b3 !important;
    font-size:7px !important;
    line-height:1.1 !important;
    letter-spacing:.035em !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__apps {
    position:static !important;
    width:174px !important;
    min-width:174px !important;
    height:50px !important;
    display:grid !important;
    grid-template-columns:repeat(4,40px) !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app {
    position:static !important;
    width:40px !important;
    min-width:40px !important;
    max-width:40px !important;
    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border:1px solid rgba(93,119,177,.25) !important;
    border-radius:12px !important;
    background:rgba(255,255,255,.035) !important;
    transform:none !important;
    overflow:hidden !important;
  }

  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app svg {
    display:block !important;
    width:21px !important;
    height:21px !important;
    opacity:1 !important;
  }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--spotify { color:#1ed760 !important; border-color:rgba(30,215,96,.34) !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--spotify path { fill:currentColor !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--apple { color:#ff5b7f !important; border-color:rgba(255,91,127,.34) !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--apple path { fill:currentColor !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--shazam { color:#35b8ff !important; border-color:rgba(53,184,255,.38) !important; background:linear-gradient(180deg,rgba(8,45,92,.68),rgba(5,24,55,.82)) !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--shazam path { fill:none !important; stroke:currentColor !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--eq { color:#e8c95f !important; border-color:rgba(232,201,95,.34) !important; }
  body:not(.admincenter-body):not(.coluca-mini-window-v157):not(.coluca-mini-window-v158) .mini-player-launcher--console .mini-player-launcher__app--eq path { fill:none !important; stroke:currentColor !important; }
}
/* ===== COLUCA WEBSITE MINI LAUNCHER REBUILD V179 END ===== */


/* ===== COLUCA WEBSITE VISUAL POLISH V180 START =====
   Browser/website only. Standalone PWA styling remains unchanged. */
@media (display-mode: browser) {
  /* Small animated hero equalizer: compact COLUCA glass/neon treatment. */
  body:not(.admincenter-body) .hero-preview .preview-wave {
    box-sizing: border-box !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 2.5px !important;
    padding: 9px 8px !important;
    overflow: hidden !important;
    border: 1px solid rgba(108, 132, 255, .28) !important;
    border-radius: 14px !important;
    background:
      radial-gradient(circle at 28% 18%, rgba(139,92,246,.24), transparent 42%),
      radial-gradient(circle at 78% 80%, rgba(34,211,238,.16), transparent 48%),
      linear-gradient(145deg, rgba(12,20,44,.97), rgba(5,11,27,.98)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.05),
      0 0 0 1px rgba(53,103,255,.05),
      0 10px 28px rgba(0,0,0,.28),
      0 0 24px rgba(95,75,255,.08) !important;
  }

  body:not(.admincenter-body) .hero-preview .preview-wave::before,
  body:not(.admincenter-body) .hero-preview .preview-wave::after {
    content: none !important;
    display: none !important;
  }

  body:not(.admincenter-body) .hero-preview .preview-wave i {
    flex: 0 0 3px !important;
    width: 3px !important;
    min-width: 3px !important;
    border-radius: 999px !important;
    transform-origin: center bottom !important;
    background: linear-gradient(to top, #8b5cf6 0%, #5a78ff 44%, #22d3ee 74%, #f3d56a 100%) !important;
    box-shadow: 0 0 8px rgba(76,128,255,.34) !important;
    opacity: .82 !important;
  }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(1) { height: 34% !important; animation-delay: -760ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(2) { height: 58% !important; animation-delay: -420ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(3) { height: 78% !important; animation-delay: -900ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(4) { height: 48% !important; animation-delay: -260ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(5) { height: 88% !important; animation-delay: -640ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(6) { height: 62% !important; animation-delay: -120ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(7) { height: 72% !important; animation-delay: -820ms !important; }
  body:not(.admincenter-body) .hero-preview .preview-wave i:nth-child(8) { height: 40% !important; animation-delay: -340ms !important; }

  body:not(.admincenter-body) .hero-preview.is-playing .preview-wave i,
  body:not(.admincenter-body) .hero-preview.is-loading .preview-wave i {
    opacity: 1 !important;
    animation-duration: 780ms !important;
  }

  /* Station icons: no white tile/frame behind logos. */
  body:not(.admincenter-body) .station-card .station-logo,
  body:not(.admincenter-body) .station-row .station-logo,
  body:not(.admincenter-body) .station-favorite-shortcut .station-logo,
  body:not(.admincenter-body) .preview-station-logo,
  body:not(.admincenter-body) .station-logo--row {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  body:not(.admincenter-body) .station-card .station-logo img,
  body:not(.admincenter-body) .station-row .station-logo img,
  body:not(.admincenter-body) .station-favorite-shortcut .station-logo img,
  body:not(.admincenter-body) .preview-station-logo img,
  body:not(.admincenter-body) .station-logo--row img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    object-fit: contain !important;
    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  /* Any station play CTA uses the COLUCA purple/blue/cyan treatment, never yellow. */
  body:not(.admincenter-body) [data-play-station].round-play,
  body:not(.admincenter-body) [data-play-station].station-live-button,
  body:not(.admincenter-body) [data-play-station].button--gold,
  body:not(.admincenter-body) .hero-preview .preview-play-button {
    color: #fff !important;
    border-color: rgba(111, 112, 255, .52) !important;
    background:
      radial-gradient(circle at 32% 22%, rgba(255,255,255,.18), transparent 34%),
      linear-gradient(145deg, #835cff 0%, #4774ff 56%, #22c7ee 100%) !important;
    box-shadow:
      0 0 0 3px rgba(105,90,255,.055),
      0 10px 24px rgba(32,73,194,.26),
      0 0 26px rgba(116,73,255,.14) !important;
  }

  body:not(.admincenter-body) [data-play-station].round-play:hover,
  body:not(.admincenter-body) [data-play-station].station-live-button:hover,
  body:not(.admincenter-body) [data-play-station].button--gold:hover,
  body:not(.admincenter-body) .hero-preview .preview-play-button:hover {
    color: #fff !important;
    border-color: rgba(102,215,255,.68) !important;
    background:
      radial-gradient(circle at 30% 20%, rgba(255,255,255,.22), transparent 36%),
      linear-gradient(145deg, #9468ff 0%, #4f82ff 54%, #25d2f5 100%) !important;
    transform: translateY(-1px) scale(1.025) !important;
  }

  body:not(.admincenter-body) [data-play-station].station-live-button::before {
    display: none !important;
    content: none !important;
  }
}
/* ===== COLUCA WEBSITE VISUAL POLISH V180 END ===== */


/* ===== COLUCA WEBSITE HOME LIVE POLISH V181 START =====
   Website/browser only. PWA standalone layout remains unchanged. */
@media (display-mode: browser) {
  /* Daily top station: remove legacy white image tile completely. */
  body:not(.admincenter-body) .daily-top-station > img {
    box-sizing: border-box !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    object-fit: contain !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Daily top play CTA: COLUCA purple/blue/cyan, never legacy gold. */
  body:not(.admincenter-body) .daily-top-station > button[data-play-station] {
    color: #fff !important;
    border: 1px solid rgba(111,112,255,.58) !important;
    background:
      radial-gradient(circle at 30% 20%, rgba(255,255,255,.20), transparent 34%),
      linear-gradient(145deg, #835cff 0%, #4774ff 56%, #22c7ee 100%) !important;
    box-shadow:
      0 0 0 3px rgba(105,90,255,.055),
      0 9px 22px rgba(32,73,194,.26),
      0 0 24px rgba(116,73,255,.15) !important;
  }
  body:not(.admincenter-body) .daily-top-station > button[data-play-station]:hover,
  body:not(.admincenter-body) .daily-top-station > button[data-play-station]:focus-visible {
    color: #fff !important;
    border-color: rgba(102,215,255,.72) !important;
    background:
      radial-gradient(circle at 30% 20%, rgba(255,255,255,.24), transparent 36%),
      linear-gradient(145deg, #9468ff 0%, #4f82ff 54%, #25d2f5 100%) !important;
    transform: translateY(-1px) scale(1.035) !important;
  }

  /* Hero preview live state: red dot + green LIVE, detail stays neutral. */
  body:not(.admincenter-body) .preview-station-copy [data-preview-status].is-live-status {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    color: #9eb0c9 !important;
    font-size: .8rem !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
  }
  body:not(.admincenter-body) .preview-status-live-dot {
    flex: 0 0 auto !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 999px !important;
    background: #ff4055 !important;
    box-shadow: 0 0 10px rgba(255,64,85,.62) !important;
  }
  body:not(.admincenter-body) .preview-status-live-label {
    flex: 0 0 auto !important;
    color: #43ef7d !important;
    font-size: inherit !important;
    font-weight: 850 !important;
    letter-spacing: .035em !important;
    text-transform: uppercase !important;
  }
  body:not(.admincenter-body) .preview-status-live-separator {
    flex: 0 0 auto !important;
    color: #6f829f !important;
  }
  body:not(.admincenter-body) .preview-status-live-detail {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #aebbd0 !important;
    text-overflow: ellipsis !important;
  }
}
/* ===== COLUCA WEBSITE HOME LIVE POLISH V181 END ===== */


/* ===== COLUCA WEBSITE HARD FIX V182 START =====
   Desktop/browser only by viewport. This intentionally avoids display-mode:browser
   because that media feature was not matching consistently in the live site. */
@media (min-width: 1025px) {
  /* Daily top logo: structural wrapper prevents the legacy direct-child white tile rule. */
  body:not(.admincenter-body) .daily-top-station .daily-top-logo-shell {
    display: grid !important;
    place-items: center !important;
    width: 52px !important;
    height: 52px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 13px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body:not(.admincenter-body) .daily-top-station .daily-top-logo-shell > img {
    display: block !important;
    width: 52px !important;
    height: 52px !important;
    max-width: 52px !important;
    max-height: 52px !important;
    padding: 0 !important;
    margin: 0 !important;
    object-fit: cover !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 13px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Daily top play: explicit class wins over every legacy gold rule. */
  body:not(.admincenter-body) .daily-top-station .daily-top-play-button,
  body:not(.admincenter-body) .daily-top-station .daily-top-play-button:hover,
  body:not(.admincenter-body) .daily-top-station .daily-top-play-button:focus-visible,
  body:not(.admincenter-body) .daily-top-station .daily-top-play-button:active {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    color: #ffffff !important;
    border: 1px solid rgba(128, 126, 255, .72) !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 30% 22%, rgba(255,255,255,.24), transparent 34%), linear-gradient(145deg, #8d62ff 0%, #4a78ff 54%, #24c9f1 100%) !important;
    box-shadow: 0 10px 24px rgba(49, 82, 215, .28), 0 0 24px rgba(121, 80, 255, .16) !important;
  }

  body:not(.admincenter-body) .daily-top-station .daily-top-play-button:hover,
  body:not(.admincenter-body) .daily-top-station .daily-top-play-button:focus-visible {
    transform: translateY(-1px) scale(1.04) !important;
    border-color: rgba(105, 220, 255, .88) !important;
  }

  body:not(.admincenter-body) .daily-top-station .daily-top-play-button svg {
    width: 18px !important;
    height: 18px !important;
    color: #fff !important;
    fill: none !important;
    stroke: currentColor !important;
  }

  /* Main website player status: red dot + green LIVE + neutral quality text. */
  body:not(.admincenter-body) .player-pwa-track .player-pwa-status.is-live-status {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    color: #aebbd0 !important;
  }

  body:not(.admincenter-body) .player-status-live-dot {
    display: inline-block !important;
    flex: 0 0 auto !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 999px !important;
    background: #ff4055 !important;
    box-shadow: 0 0 10px rgba(255, 64, 85, .68) !important;
  }

  body:not(.admincenter-body) .player-status-live-label {
    flex: 0 0 auto !important;
    color: #43ef7d !important;
    font-size: inherit !important;
    font-weight: 900 !important;
    letter-spacing: .045em !important;
  }

  body:not(.admincenter-body) .player-status-live-separator {
    flex: 0 0 auto !important;
    color: #6f829f !important;
  }

  body:not(.admincenter-body) .player-status-live-detail {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #aebbd0 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}
/* ===== COLUCA WEBSITE HARD FIX V182 END ===== */


/* ===== COLUCA WEBSITE DESKTOP PLAYER / MINI LAUNCHER V183 START ===== */
@media (min-width:1025px) {
  body:not(.admincenter-body) .player-pwa-track {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-flow:row !important;
    justify-items:center !important;
    align-items:center !important;
    align-content:center !important;
    gap:3px !important;
    text-align:center !important;
  }
  body:not(.admincenter-body) .player-pwa-track > strong,
  body:not(.admincenter-body) .player-pwa-track > small,
  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status {
    width:100% !important;
    max-width:100% !important;
    justify-self:center !important;
    text-align:center !important;
  }
  body:not(.admincenter-body) .player-pwa-track > strong { order:1 !important; }
  body:not(.admincenter-body) .player-pwa-track > small { order:2 !important; }
  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status {
    order:3 !important;
    margin-top:2px !important;
    color:#43ef7d !important;
    font-weight:900 !important;
  }
  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status.is-live-status {
    display:inline-flex !important;
    width:auto !important;
    max-width:100% !important;
    justify-content:center !important;
    align-items:center !important;
    gap:7px !important;
    color:#43ef7d !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-dot {
    display:inline-block !important;
    width:8px !important;
    height:8px !important;
    flex:0 0 8px !important;
    border-radius:999px !important;
    background:#ff4055 !important;
    box-shadow:0 0 10px rgba(255,64,85,.72) !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-label {
    color:#43ef7d !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
  }
}

@media (min-width:1025px) and (pointer:fine) {
  body:not(.admincenter-body) .mini-player-launcher--console.mini-player-launcher--v183 {
    box-sizing:border-box !important;
    left:auto !important;
    right:18px !important;
    bottom:106px !important;
    width:430px !important;
    min-width:430px !important;
    max-width:calc(100vw - 36px) !important;
    height:68px !important;
    min-height:68px !important;
    max-height:68px !important;
    display:grid !important;
    grid-template-columns:minmax(180px,1fr) 220px !important;
    align-items:center !important;
    gap:8px !important;
    padding:7px !important;
    overflow:hidden !important;
    border:1px solid rgba(99,124,182,.28) !important;
    border-radius:20px !important;
    background:linear-gradient(180deg,rgba(9,17,36,.98),rgba(4,10,23,.98)) !important;
    box-shadow:0 14px 40px rgba(0,0,0,.34),0 0 0 1px rgba(139,92,255,.08) !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__display {
    box-sizing:border-box !important;
    width:100% !important;
    height:52px !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:34px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    padding:7px 10px !important;
    overflow:hidden !important;
    border:1px solid rgba(93,119,177,.28) !important;
    border-radius:14px !important;
    background:linear-gradient(180deg,rgba(7,13,29,.96),rgba(3,8,18,.98)) !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__play {
    position:static !important;
    width:34px !important;
    height:34px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border-radius:50% !important;
    background:linear-gradient(135deg,#6e5cff,#2fbfff) !important;
    color:#fff !important;
    font-size:13px !important;
    line-height:1 !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__copy {
    position:static !important;
    min-width:0 !important;
    width:100% !important;
    display:grid !important;
    align-content:center !important;
    justify-items:start !important;
    gap:3px !important;
    overflow:hidden !important;
    text-align:left !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__copy strong {
    display:block !important;
    width:100% !important;
    margin:0 !important;
    overflow:hidden !important;
    color:#fff !important;
    font-size:11px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:.045em !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__copy small {
    display:block !important;
    width:100% !important;
    margin:0 !important;
    overflow:hidden !important;
    color:#92a4c0 !important;
    font-size:8px !important;
    line-height:1.05 !important;
    letter-spacing:.02em !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__apps {
    position:static !important;
    box-sizing:border-box !important;
    width:220px !important;
    min-width:220px !important;
    height:52px !important;
    display:grid !important;
    grid-template-columns:repeat(4,49px) !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__app {
    position:static !important;
    box-sizing:border-box !important;
    width:49px !important;
    min-width:49px !important;
    max-width:49px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border-radius:14px !important;
    background:rgba(255,255,255,.035) !important;
    overflow:hidden !important;
    transform:none !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v183 .mini-player-launcher__app svg {
    display:block !important;
    width:22px !important;
    height:22px !important;
  }
}
/* ===== COLUCA WEBSITE DESKTOP PLAYER / MINI LAUNCHER V183 END ===== */


/* ===== COLUCA WEBSITE LIVE / MINI LAUNCHER / PIP HOTFIX V184 START ===== */
@media (min-width:1025px) {
  body:not(.admincenter-body) .player-pwa-track {
    justify-items:center !important;
    text-align:center !important;
  }
  body:not(.admincenter-body) .player-pwa-track > strong,
  body:not(.admincenter-body) .player-pwa-track > small {
    justify-self:center !important;
    text-align:center !important;
  }
  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status.is-live-status {
    display:inline-flex !important;
    width:max-content !important;
    max-width:100% !important;
    margin:3px auto 0 !important;
    justify-self:center !important;
    justify-content:center !important;
    align-items:center !important;
    gap:7px !important;
    text-align:center !important;
    overflow:visible !important;
    white-space:nowrap !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-dot {
    display:inline-block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:8px !important;
    min-width:8px !important;
    height:8px !important;
    flex:0 0 8px !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:#ff4055 !important;
    box-shadow:0 0 10px rgba(255,64,85,.78) !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-label {
    color:#43ef7d !important;
    font-weight:900 !important;
    letter-spacing:.05em !important;
    line-height:1 !important;
  }
}

@media (min-width:1025px) and (pointer:fine) {
  body:not(.admincenter-body) .mini-player-launcher--console.mini-player-launcher--v184 {
    box-sizing:border-box !important;
    left:auto !important;
    right:18px !important;
    bottom:106px !important;
    width:444px !important;
    min-width:444px !important;
    max-width:calc(100vw - 36px) !important;
    height:68px !important;
    min-height:68px !important;
    max-height:68px !important;
    display:grid !important;
    grid-template-columns:minmax(200px,1fr) 220px !important;
    align-items:center !important;
    gap:8px !important;
    padding:7px !important;
    overflow:hidden !important;
    border:1px solid rgba(99,124,182,.28) !important;
    border-radius:20px !important;
    background:linear-gradient(180deg,rgba(9,17,36,.98),rgba(4,10,23,.98)) !important;
    box-shadow:0 14px 40px rgba(0,0,0,.34),0 0 0 1px rgba(139,92,255,.08) !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__display {
    position:relative !important;
    box-sizing:border-box !important;
    width:100% !important;
    height:52px !important;
    min-width:0 !important;
    display:grid !important;
    place-items:center !important;
    padding:6px 12px 6px 50px !important;
    overflow:hidden !important;
    border:1px solid rgba(93,119,177,.28) !important;
    border-radius:14px !important;
    background:linear-gradient(180deg,rgba(7,13,29,.96),rgba(3,8,18,.98)) !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__play {
    position:absolute !important;
    left:9px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:34px !important;
    height:34px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border-radius:50% !important;
    background:linear-gradient(135deg,#6e5cff,#2fbfff) !important;
    color:#fff !important;
    font-size:13px !important;
    line-height:1 !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__copy {
    position:static !important;
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    align-content:center !important;
    justify-items:center !important;
    gap:3px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    text-align:center !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__copy strong,
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__copy small {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    text-align:center !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__copy strong {
    color:#fff !important;
    font-size:10.5px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:.04em !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__copy small {
    color:#9aacC5 !important;
    font-size:7.5px !important;
    line-height:1.05 !important;
    letter-spacing:.015em !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__apps {
    position:static !important;
    box-sizing:border-box !important;
    width:220px !important;
    min-width:220px !important;
    height:52px !important;
    display:grid !important;
    grid-template-columns:repeat(4,49px) !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app {
    position:static !important;
    box-sizing:border-box !important;
    width:49px !important;
    min-width:49px !important;
    max-width:49px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border-radius:14px !important;
    overflow:hidden !important;
    transform:none !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app svg {
    display:block !important;
    width:22px !important;
    height:22px !important;
  }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--spotify { color:#1ed760 !important; border-color:rgba(30,215,96,.34) !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--spotify path { fill:currentColor !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--apple { color:#ff5b7f !important; border-color:rgba(255,91,127,.34) !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--apple path { fill:currentColor !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--shazam { color:#35b8ff !important; border-color:rgba(53,184,255,.38) !important; background:linear-gradient(180deg,rgba(8,45,92,.68),rgba(5,24,55,.82)) !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--shazam path { fill:none !important; stroke:currentColor !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--eq { color:#e8c95f !important; border-color:rgba(232,201,95,.34) !important; }
  body:not(.admincenter-body) .mini-player-launcher--v184 .mini-player-launcher__app--eq path { fill:none !important; stroke:currentColor !important; }
}
/* ===== COLUCA WEBSITE LIVE / MINI LAUNCHER / PIP HOTFIX V184 END ===== */


/* ===== COLUCA V1.006.1 BUGFIX — PWA SINGLE PERSISTENT PLAYER START =====
   Scope: installed PWA only, mobile + tablet (<=1024px).
   Website/desktop browser layout is intentionally untouched. */
@media (max-width: 1024px) {
  /* Remove the duplicate hero/Now Playing player completely. */
  html body:not(.admincenter-body) #main-content .hero .hero-preview,
  html body:not(.admincenter-body) #main-content .hero .hero__preview {
    display: none !important;
  }

  /* Pull the actual hero text directly up under the header. */
  html body:not(.admincenter-body) #main-content .hero {
    min-height: 0 !important;
    padding-top: 6px !important;
  }
  html body:not(.admincenter-body) #main-content .hero-grid,
  html body:not(.admincenter-body) #main-content .hero__grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 0 !important;
    align-items: start !important;
  }
  html body:not(.admincenter-body) #main-content .hero-copy,
  html body:not(.admincenter-body) #main-content .hero__copy {
    order: 1 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  html body:not(.admincenter-body) #main-content .hero-copy > .eyebrow,
  html body:not(.admincenter-body) #main-content .hero__copy > .eyebrow {
    margin-top: 0 !important;
  }

  /* The bottom player is the single PWA player and is always viewport-fixed. */
  html body:not(.admincenter-body) .player-shell[data-player-shell] {
    position: fixed !important;
    top: auto !important;
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    z-index: 2800 !important;
    transform: none !important;
  }

  /* A PWA player can no longer be dismissed. */
  html body:not(.admincenter-body) .player-shell [data-player-close] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Re-center remaining action buttons after removing the close control. */
  html body:not(.admincenter-body) .player-shell .player-actions {
    justify-content: center !important;
  }
}

/* Unified mobile/tablet presentation: browser and installed webapp use identical layout. */
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero .hero-preview,
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero .hero__preview {
  display: none !important;
}
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero {
  min-height: 0 !important;
  padding-top: 6px !important;
}
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-grid,
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero__grid {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  gap: 0 !important;
  align-items: start !important;
}
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy,
html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero__copy {
  order: 1 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}
html.coluca-surface-mobile body:not(.admincenter-body) .player-shell[data-player-shell] {
  position: fixed !important;
  top: auto !important;
  left: max(10px, env(safe-area-inset-left, 0px)) !important;
  right: max(10px, env(safe-area-inset-right, 0px)) !important;
  bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  z-index: 2800 !important;
  transform: none !important;
}
html.coluca-surface-mobile body:not(.admincenter-body) .player-shell [data-player-close] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-actions {
  justify-content: center !important;
}
/* ===== COLUCA V1.006.1 BUGFIX — PWA SINGLE PERSISTENT PLAYER END ===== */


/* ===== COLUCA V1.006.2 IMPROVEMENT — PWA FLOATING PLAYER POLISH START =====
   Scope: installed PWA only, mobile + tablet (<=1024px).
   Website/desktop browser remains untouched. */
@media (max-width: 1024px) {
  /* Thin COLUCA 2.0 purple-blue-cyan rim + soft glow: visually floating, never heavy. */
  html body:not(.admincenter-body) .player-shell[data-player-shell] {
    border: 1px solid transparent !important;
    border-radius: 24px !important;
    background:
      radial-gradient(circle at 0% 0%, rgba(139,92,255,.14), transparent 32%) padding-box,
      radial-gradient(circle at 100% 0%, rgba(45,203,255,.10), transparent 30%) padding-box,
      linear-gradient(180deg, rgba(9,14,27,.985), rgba(4,8,18,.995)) padding-box,
      linear-gradient(135deg, #8B5CFF 0%, #4D7EFF 58%, #2DCBFF 100%) border-box !important;
    box-shadow:
      0 18px 48px rgba(0,0,0,.42),
      0 0 18px rgba(139,92,255,.13),
      0 0 28px rgba(77,126,255,.15),
      0 0 36px rgba(45,203,255,.07) !important;
  }

  /* PWA action bar: volume -> EQ -> Cast/AirPlay -> Spotify -> Apple Music -> guide. */
  html body:not(.admincenter-body) .player-shell .player-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: clamp(4px, 1.45vw, 8px) !important;
    overflow: hidden !important;
  }

  html body:not(.admincenter-body) .player-shell .player-actions .icon-button {
    flex: 0 1 clamp(40px, 11vw, 48px) !important;
    width: clamp(40px, 11vw, 48px) !important;
    min-width: 40px !important;
    height: clamp(40px, 11vw, 48px) !important;
    min-height: 40px !important;
  }

  /* Slot/favoriet verdwijnt hier volledig als functie. */
  html body:not(.admincenter-body) .player-shell .player-favorite,
  html body:not(.admincenter-body) .player-shell [data-player-favorite] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Keep this compact row to the requested six controls only. */
  html body:not(.admincenter-body) .player-shell .player-shazam,
  html body:not(.admincenter-body) .player-shell [data-player-expand],
  html body:not(.admincenter-body) .player-shell [data-player-close],
  html body:not(.admincenter-body) .player-shell .player-actions > .volume {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body:not(.admincenter-body) .player-shell [data-mute] { order: 10 !important; }
  html body:not(.admincenter-body) .player-shell .audio-settings-button { order: 20 !important; }
  html body:not(.admincenter-body) .player-shell [data-device-playback-open] { order: 30 !important; }
  html body:not(.admincenter-body) .player-shell .player-spotify-add { order: 40 !important; }
  html body:not(.admincenter-body) .player-shell .player-apple-music-add { order: 50 !important; }
  html body:not(.admincenter-body) .player-shell .player-guide-button { order: 60 !important; }
}

/* iOS standalone fallback mirrors the same PWA-only improvement. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell[data-player-shell] {
    border: 1px solid transparent !important;
    border-radius: 24px !important;
    background:
      radial-gradient(circle at 0% 0%, rgba(139,92,255,.14), transparent 32%) padding-box,
      radial-gradient(circle at 100% 0%, rgba(45,203,255,.10), transparent 30%) padding-box,
      linear-gradient(180deg, rgba(9,14,27,.985), rgba(4,8,18,.995)) padding-box,
      linear-gradient(135deg, #8B5CFF 0%, #4D7EFF 58%, #2DCBFF 100%) border-box !important;
    box-shadow:
      0 18px 48px rgba(0,0,0,.42),
      0 0 18px rgba(139,92,255,.13),
      0 0 28px rgba(77,126,255,.15),
      0 0 36px rgba(45,203,255,.07) !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: clamp(4px, 1.45vw, 8px) !important;
    overflow: hidden !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-actions .icon-button {
    flex: 0 1 clamp(40px, 11vw, 48px) !important;
    width: clamp(40px, 11vw, 48px) !important;
    min-width: 40px !important;
    height: clamp(40px, 11vw, 48px) !important;
    min-height: 40px !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-favorite,
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell [data-player-favorite],
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-shazam,
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell [data-player-expand],
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell [data-player-close],
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-actions > .volume {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell [data-mute] { order: 10 !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .audio-settings-button { order: 20 !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell [data-device-playback-open] { order: 30 !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-spotify-add { order: 40 !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-apple-music-add { order: 50 !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-guide-button { order: 60 !important; }
}
/* ===== COLUCA V1.006.2 IMPROVEMENT — PWA FLOATING PLAYER POLISH END ===== */

/* ===== COLUCA V1.006.3 IMPROVEMENT - PWA PLAYER ALIGNMENT START =====
   Scope: installed PWA only, mobile + tablet (<=1024px).
   Website/desktop browser remains untouched. */
@media (max-width: 1024px) {
  /* Remove the unused station column so transport controls sit on the true player center. */
  html body:not(.admincenter-body) .player-shell .player-inner {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "actions"
      "controls"
      "track" !important;
    justify-items: stretch !important;
    align-items: center !important;
  }

  html body:not(.admincenter-body) .player-shell .player-station {
    display: none !important;
  }

  html body:not(.admincenter-body) .player-shell .player-actions {
    grid-area: actions !important;
    width: 100% !important;
    box-sizing: border-box !important;
    justify-content: center !important;
    align-items: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body:not(.admincenter-body) .player-shell .player-controls {
    grid-area: controls !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    justify-self: stretch !important;
    margin: 0 auto !important;
    gap: clamp(12px, 4vw, 22px) !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-track {
    grid-area: track !important;
    justify-self: stretch !important;
  }

  /* The white lower-right bubble is the Apple Music .music-add-mark state badge. */
  html body:not(.admincenter-body) .player-shell .player-apple-music-add .music-add-mark {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}

/* iOS standalone fallback mirrors the same PWA-only alignment fix. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-inner {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "actions"
      "controls"
      "track" !important;
    justify-items: stretch !important;
    align-items: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-station {
    display: none !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-actions {
    grid-area: actions !important;
    width: 100% !important;
    box-sizing: border-box !important;
    justify-content: center !important;
    align-items: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-controls {
    grid-area: controls !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    justify-self: stretch !important;
    margin: 0 auto !important;
    gap: clamp(12px, 4vw, 22px) !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-track {
    grid-area: track !important;
    justify-self: stretch !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-apple-music-add .music-add-mark {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}
/* ===== COLUCA V1.006.3 IMPROVEMENT - PWA PLAYER ALIGNMENT END ===== */

/* ===== COLUCA V1.006.7 IMPROVEMENT - PWA MOBILE/TABLET UX PERFORMANCE START =====
   Scope: installed PWA only, phone + tablet (<=1024px).
   Audio source policy from V1.006.6 remains untouched. */
@media (max-width: 1024px) {
  html {
    overscroll-behavior-y: none;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
  }
  html body:not(.admincenter-body) {
    overscroll-behavior-y: none;
    -webkit-overflow-scrolling: touch;
  }

  html body:not(.admincenter-body) button,
  html body:not(.admincenter-body) a,
  html body:not(.admincenter-body) input,
  html body:not(.admincenter-body) select,
  html body:not(.admincenter-body) textarea,
  html body:not(.admincenter-body) [role="button"] {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  /* Keep the two fixed app surfaces on their own compositor layers. */
  html body:not(.admincenter-body) .player-shell[data-player-shell],
  html body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html body:not(.admincenter-body) .v158-pwa-nav {
    transform: translate3d(0,0,0) !important;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: transform;
  }

  /* Preserve the COLUCA glass look with less continuous GPU blur work. */
  html body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html body:not(.admincenter-body) .v158-pwa-nav,
  html body:not(.admincenter-body) .expanded-player-header--app,
  html body:not(.admincenter-body) .expanded-player-sticky-bar {
    -webkit-backdrop-filter: blur(11px) saturate(125%) !important;
    backdrop-filter: blur(11px) saturate(125%) !important;
  }

  /* Independent layout islands prevent one card update from relaying the whole page. */
  html body:not(.admincenter-body) .station-card,
  html body:not(.admincenter-body) .home-promotion-panel,
  html body:not(.admincenter-body) .home-podcasts-panel,
  html body:not(.admincenter-body) .feature-panel,
  html body:not(.admincenter-body) .account-panel,
  html body:not(.admincenter-body) .station-sharing-card,
  html body:not(.admincenter-body) .programming-now,
  html body:not(.admincenter-body) .programming-next,
  html body:not(.admincenter-body) .expanded-guide-row {
    contain: layout style;
  }

  /* Delay paint work for off-screen sections while reserving stable geometry. */
  html body:not(.admincenter-body) #main-content .section--stations,
  html body:not(.admincenter-body) #main-content .home-podcasts,
  html body:not(.admincenter-body) #main-content .section--feature,
  html body:not(.admincenter-body) #main-content .section--account,
  html body:not(.admincenter-body) #main-content .station-info,
  html body:not(.admincenter-body) #main-content .station-sharing,
  html body:not(.admincenter-body) #main-content .station-programming,
  html body:not(.admincenter-body) #main-content .related-stations {
    content-visibility: auto;
    contain-intrinsic-size: auto 640px;
  }

  html body:not(.admincenter-body) .station-grid > .station-card,
  html body:not(.admincenter-body) .programming-list > * {
    content-visibility: auto;
    contain-intrinsic-size: auto 150px;
  }

  /* Fast tactile feedback, transform-only to avoid layout. */
  html body:not(.admincenter-body) .icon-button,
  html body:not(.admincenter-body) .player-button,
  html body:not(.admincenter-body) .player-skip,
  html body:not(.admincenter-body) .round-play,
  html body:not(.admincenter-body) .button,
  html body:not(.admincenter-body) .coluca-pwa-nav-v156 a,
  html body:not(.admincenter-body) .v158-pwa-nav a {
    transition-property: transform, opacity, border-color, background-color, box-shadow !important;
    transition-duration: 120ms !important;
    transition-timing-function: ease-out !important;
  }
  html body:not(.admincenter-body) .icon-button:active,
  html body:not(.admincenter-body) .player-button:active,
  html body:not(.admincenter-body) .player-skip:active,
  html body:not(.admincenter-body) .round-play:active,
  html body:not(.admincenter-body) .button:active,
  html body:not(.admincenter-body) .coluca-pwa-nav-v156 a:active,
  html body:not(.admincenter-body) .v158-pwa-nav a:active {
    transform: scale(.975) !important;
  }

  /* During finger scrolling, suspend decorative transitions/animations that compete with scrolling. */
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .station-card,
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .preview-wave,
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .feature-visual,
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .player-shell[data-player-shell] {
    animation-play-state: paused !important;
    transition: none !important;
  }

  html body:not(.admincenter-body) dialog[open],
  html body:not(.admincenter-body) .coluca-dialog[open],
  html body:not(.admincenter-body) .expanded-player[open] {
    transform: translate3d(0,0,0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }
}

/* iOS installed-PWA fallback class added by app.js. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile {
    overscroll-behavior-y: none;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) {
    overscroll-behavior-y: none;
    -webkit-overflow-scrolling: touch;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) button,
  html.coluca-surface-mobile body:not(.admincenter-body) a,
  html.coluca-surface-mobile body:not(.admincenter-body) input,
  html.coluca-surface-mobile body:not(.admincenter-body) select,
  html.coluca-surface-mobile body:not(.admincenter-body) textarea,
  html.coluca-surface-mobile body:not(.admincenter-body) [role="button"] {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell[data-player-shell],
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-pwa-nav {
    transform: translate3d(0,0,0) !important;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: transform;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-pwa-nav,
  html.coluca-surface-mobile body:not(.admincenter-body) .expanded-player-header--app,
  html.coluca-surface-mobile body:not(.admincenter-body) .expanded-player-sticky-bar {
    -webkit-backdrop-filter: blur(11px) saturate(125%) !important;
    backdrop-filter: blur(11px) saturate(125%) !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .station-card,
  html.coluca-surface-mobile body:not(.admincenter-body) .home-promotion-panel,
  html.coluca-surface-mobile body:not(.admincenter-body) .home-podcasts-panel,
  html.coluca-surface-mobile body:not(.admincenter-body) .feature-panel,
  html.coluca-surface-mobile body:not(.admincenter-body) .account-panel,
  html.coluca-surface-mobile body:not(.admincenter-body) .station-sharing-card,
  html.coluca-surface-mobile body:not(.admincenter-body) .programming-now,
  html.coluca-surface-mobile body:not(.admincenter-body) .programming-next,
  html.coluca-surface-mobile body:not(.admincenter-body) .expanded-guide-row {
    contain: layout style;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .section--stations,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .home-podcasts,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .section--feature,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .section--account,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .station-info,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .station-sharing,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .station-programming,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .related-stations,
  html.coluca-surface-mobile body:not(.admincenter-body) .station-grid > .station-card,
  html.coluca-surface-mobile body:not(.admincenter-body) .programming-list > * {
    content-visibility: auto;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .station-grid > .station-card,
  html.coluca-surface-mobile body:not(.admincenter-body) .programming-list > * {
    contain-intrinsic-size: auto 150px;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .section--stations,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .home-podcasts,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .section--feature,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .section--account,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .station-info,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .station-sharing,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .station-programming,
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .related-stations {
    contain-intrinsic-size: auto 640px;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .icon-button,
  html.coluca-surface-mobile body:not(.admincenter-body) .player-button,
  html.coluca-surface-mobile body:not(.admincenter-body) .player-skip,
  html.coluca-surface-mobile body:not(.admincenter-body) .round-play,
  html.coluca-surface-mobile body:not(.admincenter-body) .button,
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v156 a,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-pwa-nav a {
    transition-property: transform, opacity, border-color, background-color, box-shadow !important;
    transition-duration: 120ms !important;
    transition-timing-function: ease-out !important;
  }
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .station-card,
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .preview-wave,
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .feature-visual,
  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .player-shell[data-player-shell] {
    animation-play-state: paused !important;
    transition: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.coluca-surface-mobile body:not(.admincenter-body) *,
  html.coluca-surface-mobile body:not(.admincenter-body) *::before,
  html.coluca-surface-mobile body:not(.admincenter-body) *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}
/* ===== COLUCA V1.006.7 IMPROVEMENT - PWA MOBILE/TABLET UX PERFORMANCE END ===== */


/* ===== COLUCA V1.006.8 BUGFIX - PWA LOCK + HARD CENTER NAV START =====
   PWA mobile/tablet only. Fixes v10067 compositor transform overriding the
   existing translateX(-50%) centering on the bottom navigation. */
@media (max-width: 1024px) {
  html body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html body:not(.admincenter-body) .coluca-pwa-nav-v157,
  html body:not(.admincenter-body) .v158-pwa-nav {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    width: min(680px, calc(100vw - 20px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))) !important;
    max-width: calc(100vw - 20px) !important;
    margin: 0 !important;
    transform: translate3d(-50%, 0, 0) !important;
    transform-origin: 50% 100% !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    justify-items: stretch !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
  }
  html body:not(.admincenter-body) .coluca-pwa-nav-v156 > a,
  html body:not(.admincenter-body) .coluca-pwa-nav-v157 > a,
  html body:not(.admincenter-body) .v158-pwa-nav > a {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    text-align: center !important;
  }

  /* Locked favorites use the same clean outline lock everywhere in PWA. */
  html body:not(.admincenter-body) .favorite-button.is-locked,
  html body:not(.admincenter-body) .favorite-button[data-favorite-locked="true"] {
    color: #ff879a !important;
    background: rgba(239, 92, 112, .08) !important;
    border-color: rgba(255, 135, 154, .42) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 8px 24px rgba(239,92,112,.08) !important;
  }
  html body:not(.admincenter-body) .favorite-button.is-locked svg,
  html body:not(.admincenter-body) .favorite-button[data-favorite-locked="true"] svg,
  html body:not(.admincenter-body) .station-favorite-shortcut-lock svg,
  html body:not(.admincenter-body) svg.station-favorite-shortcut-lock,
  html body:not(.admincenter-body) .v158-lock svg,
  html body:not(.admincenter-body) svg.v158-lock {
    width: 22px !important;
    height: 22px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.9 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    transform: none !important;
  }
}

/* iOS installed-PWA fallback when display-mode is not reported reliably. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v157,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-pwa-nav {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    width: min(680px, calc(100vw - 20px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))) !important;
    max-width: calc(100vw - 20px) !important;
    margin: 0 !important;
    transform: translate3d(-50%, 0, 0) !important;
    transform-origin: 50% 100% !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    justify-items: stretch !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v156 > a,
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v157 > a,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-pwa-nav > a {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    text-align: center !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .favorite-button.is-locked,
  html.coluca-surface-mobile body:not(.admincenter-body) .favorite-button[data-favorite-locked="true"] {
    color: #ff879a !important;
    background: rgba(239, 92, 112, .08) !important;
    border-color: rgba(255, 135, 154, .42) !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .favorite-button.is-locked svg,
  html.coluca-surface-mobile body:not(.admincenter-body) .favorite-button[data-favorite-locked="true"] svg,
  html.coluca-surface-mobile body:not(.admincenter-body) .station-favorite-shortcut-lock svg,
  html.coluca-surface-mobile body:not(.admincenter-body) svg.station-favorite-shortcut-lock,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-lock svg,
  html.coluca-surface-mobile body:not(.admincenter-body) svg.v158-lock {
    width: 22px !important;
    height: 22px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.9 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    transform: none !important;
  }
}
/* ===== COLUCA V1.006.8 BUGFIX - PWA LOCK + HARD CENTER NAV END ===== */


/* ===== COLUCA V1.006.10 IMPROVEMENT - PWA PROFILE + PLATINUM HOME UX ===== */
.pwa-profile-menu {
  display: none;
}

@media (max-width: 1024px) {
  html body:not(.admincenter-body) .pwa-profile-menu {
    display: block !important;
    position: relative !important;
    z-index: 106 !important;
    flex: 0 0 64px !important;
    width: 64px !important;
    margin-left: auto !important;
  }

  html body:not(.admincenter-body) .pwa-profile-summary {
    list-style: none !important;
    display: grid !important;
    grid-template-rows: 42px auto !important;
    justify-items: center !important;
    align-items: center !important;
    gap: 2px !important;
    width: 64px !important;
    min-width: 64px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    cursor: pointer !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
  }

  html body:not(.admincenter-body) .pwa-profile-summary::-webkit-details-marker,
  html body:not(.admincenter-body) .pwa-profile-summary::marker {
    display: none !important;
    content: '' !important;
  }

  html body:not(.admincenter-body) .pwa-profile-avatar {
    width: 40px !important;
    height: 40px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    border: 1px solid rgba(139,92,246,.72) !important;
    background: linear-gradient(145deg, rgba(124,58,237,.22), rgba(14,165,233,.12)), #07101f !important;
    box-shadow: 0 0 0 2px rgba(37,99,235,.08), 0 8px 20px rgba(0,0,0,.26) !important;
  }

  html body:not(.admincenter-body) .pwa-profile-photo,
  html body:not(.admincenter-body) .pwa-profile-initial {
    width: 100% !important;
    height: 100% !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
  }

  html body:not(.admincenter-body) .pwa-profile-photo {
    object-fit: cover !important;
    object-position: center !important;
  }

  html body:not(.admincenter-body) .pwa-profile-photo.is-default-avatar {
    padding: 5% !important;
    object-fit: contain !important;
    background: #050a13 !important;
  }

  html body:not(.admincenter-body) .pwa-profile-photo[hidden],
  html body:not(.admincenter-body) .pwa-profile-initial[hidden] {
    display: none !important;
  }

  html body:not(.admincenter-body) .pwa-profile-initial {
    font-size: 14px !important;
    font-weight: 900 !important;
    color: #fff !important;
  }

  html body:not(.admincenter-body) .pwa-profile-guest-icon {
    width: 23px !important;
    height: 23px !important;
    color: #dfe7f6 !important;
  }

  html body:not(.admincenter-body) .pwa-profile-name {
    display: block !important;
    width: 64px !important;
    max-width: 64px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    text-align: center !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    color: #d8e1f0 !important;
  }

  html body:not(.admincenter-body) .pwa-profile-menu[open] .pwa-profile-avatar {
    border-color: rgba(34,211,238,.88) !important;
    box-shadow: 0 0 0 2px rgba(139,92,246,.12), 0 0 20px rgba(37,99,235,.18) !important;
  }

  html body:not(.admincenter-body) .pwa-profile-popover {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    width: 164px !important;
    padding: 7px !important;
    display: grid !important;
    gap: 5px !important;
    border-radius: 15px !important;
    border: 1px solid rgba(96,165,250,.32) !important;
    background: rgba(3,7,18,.98) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.46), 0 0 24px rgba(124,58,237,.10) !important;
    backdrop-filter: blur(14px) saturate(120%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(120%) !important;
  }

  html body:not(.admincenter-body) .pwa-profile-popover a,
  html body:not(.admincenter-body) .pwa-profile-popover button {
    width: 100% !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    padding: 9px 11px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,.035) !important;
    color: #eef4ff !important;
    text-decoration: none !important;
    font: inherit !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
  }

  html body:not(.admincenter-body) .pwa-profile-popover a:active,
  html body:not(.admincenter-body) .pwa-profile-popover button:active {
    background: rgba(124,58,237,.17) !important;
  }

  html body:not(.admincenter-body) .pwa-profile-popover svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
  }

  html body:not(.admincenter-body) .pwa-profile-popover form {
    margin: 0 !important;
  }

  html body:not(.admincenter-body) .hero-trust.pwa-hide-for-platinum {
    display: none !important;
  }
}

/* iOS installed-PWA fallback. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-menu {
    display: block !important;
    position: relative !important;
    z-index: 106 !important;
    flex: 0 0 64px !important;
    width: 64px !important;
    margin-left: auto !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-summary {
    list-style: none !important;
    display: grid !important;
    grid-template-rows: 42px auto !important;
    justify-items: center !important;
    align-items: center !important;
    gap: 2px !important;
    width: 64px !important;
    min-width: 64px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #fff !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-summary::-webkit-details-marker,
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-summary::marker {
    display: none !important;
    content: '' !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-avatar {
    width: 40px !important;
    height: 40px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    border: 1px solid rgba(139,92,246,.72) !important;
    background: linear-gradient(145deg, rgba(124,58,237,.22), rgba(14,165,233,.12)), #07101f !important;
    box-shadow: 0 0 0 2px rgba(37,99,235,.08), 0 8px 20px rgba(0,0,0,.26) !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-photo,
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-initial {
    width: 100% !important;
    height: 100% !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-photo {
    object-fit: cover !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-photo.is-default-avatar {
    padding: 5% !important;
    object-fit: contain !important;
    background: #050a13 !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-photo[hidden],
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-initial[hidden] {
    display: none !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-initial {
    font-size: 14px !important;
    font-weight: 900 !important;
    color: #fff !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-guest-icon {
    width: 23px !important;
    height: 23px !important;
    color: #dfe7f6 !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-name {
    display: block !important;
    width: 64px !important;
    max-width: 64px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    text-align: center !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    color: #d8e1f0 !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-popover {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    width: 164px !important;
    padding: 7px !important;
    display: grid !important;
    gap: 5px !important;
    border-radius: 15px !important;
    border: 1px solid rgba(96,165,250,.32) !important;
    background: rgba(3,7,18,.98) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.46), 0 0 24px rgba(124,58,237,.10) !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-popover a,
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-popover button {
    width: 100% !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    padding: 9px 11px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,.035) !important;
    color: #eef4ff !important;
    text-decoration: none !important;
    font: inherit !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-profile-popover form {
    margin: 0 !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .hero-trust.pwa-hide-for-platinum {
    display: none !important;
  }
}
/* ===== COLUCA V1.006.10 IMPROVEMENT - PWA PROFILE + PLATINUM HOME UX END ===== */

/* ===== COLUCA V1.006.11 BUGFIX - PWA HEADER ACTIONS SINGLE ROW ===== */
/*
 * Installed mobile/tablet PWA only.
 * Keep the hamburger and profile/name in the same header row:
 * brand | hamburger | profile.
 */
@media (max-width: 1024px) {
  html body:not(.admincenter-body) .site-header .container.header-inner,
  html body:not(.admincenter-body) .site-header .header-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 48px 64px !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    justify-content: stretch !important;
    column-gap: 10px !important;
    row-gap: 0 !important;
    min-height: 54px !important;
  }

  html body:not(.admincenter-body) .site-header .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body:not(.admincenter-body) .site-header .nav-toggle {
    display: grid !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
  }

  html body:not(.admincenter-body) .site-header .pwa-profile-menu {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: end !important;
    margin: 0 !important;
  }

  /* Tablet PWA uses the same compact hamburger menu as phone. */
  html body:not(.admincenter-body) .site-header .main-nav {
    position: fixed !important;
    top: calc(68px + env(safe-area-inset-top, 0px)) !important;
    left: max(14px, env(safe-area-inset-left, 0px)) !important;
    right: max(14px, env(safe-area-inset-right, 0px)) !important;
    z-index: 501 !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 92px - env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
    display: grid !important;
    gap: 4px !important;
    padding: 13px !important;
    border: 1px solid rgba(96,165,250,.25) !important;
    border-radius: 16px !important;
    background: rgba(3,7,18,.985) !important;
    box-shadow: 0 20px 48px rgba(0,0,0,.48) !important;
    opacity: 0 !important;
    transform: translateY(-10px) !important;
    pointer-events: none !important;
    transition: opacity .16s ease, transform .16s ease !important;
  }

  html body:not(.admincenter-body) .site-header .main-nav.is-open {
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
  }
}

/* iOS installed-PWA fallback class, including tablet portrait/landscape. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .container.header-inner,
  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .header-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 48px 64px !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    justify-content: stretch !important;
    column-gap: 10px !important;
    row-gap: 0 !important;
    min-height: 54px !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .nav-toggle {
    display: grid !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .pwa-profile-menu {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: end !important;
    margin: 0 !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .main-nav {
    position: fixed !important;
    top: calc(68px + env(safe-area-inset-top, 0px)) !important;
    left: max(14px, env(safe-area-inset-left, 0px)) !important;
    right: max(14px, env(safe-area-inset-right, 0px)) !important;
    z-index: 501 !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 92px - env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
    display: grid !important;
    gap: 4px !important;
    padding: 13px !important;
    border: 1px solid rgba(96,165,250,.25) !important;
    border-radius: 16px !important;
    background: rgba(3,7,18,.985) !important;
    box-shadow: 0 20px 48px rgba(0,0,0,.48) !important;
    opacity: 0 !important;
    transform: translateY(-10px) !important;
    pointer-events: none !important;
    transition: opacity .16s ease, transform .16s ease !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .main-nav.is-open {
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
  }
}
/* ===== COLUCA V1.006.11 BUGFIX - PWA HEADER ACTIONS SINGLE ROW END ===== */


/* ===== COLUCA V1.006.12 BUGFIX - PWA PLAYER LOGO / WHITE GUIDE / MENU SCROLL =====
   Installed phone/tablet PWA only. Desktop/web remains untouched. */
body:not(.admincenter-body) .player-shell .player-pwa-station-logo {
  display: none !important;
}
@media (max-width: 1024px) {
  html body:not(.admincenter-body) .player-shell .player-pwa-track {
    position: relative !important;
    min-height: 72px !important;
    padding-left: 66px !important;
    padding-right: 66px !important;
    box-sizing: border-box !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-station-logo {
    position: absolute !important;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 46px !important;
    display: grid !important;
    place-items: center !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid rgba(122, 145, 214, .42) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(18, 28, 52, .98), rgba(7, 13, 28, .99)) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.28), 0 0 0 1px rgba(139,92,255,.08) !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-station-logo img[hidden],
  html body:not(.admincenter-body) .player-shell .player-pwa-station-logo [data-pwa-track-avatar][hidden] {
    display: none !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-station-logo img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: contain !important;
    border-radius: 999px !important;
    background: transparent !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-station-logo [data-pwa-track-avatar] {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    color: #f7f9ff !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    letter-spacing: .02em !important;
  }

  html body:not(.admincenter-body) .player-shell .player-guide-button {
    color: #ffffff !important;
    border-color: rgba(150, 169, 216, .28) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)) !important;
    box-shadow: none !important;
  }

  html body:not(.admincenter-body) .player-shell .player-guide-button svg {
    color: #ffffff !important;
    stroke: currentColor !important;
  }

  html body:not(.admincenter-body) .site-header .main-nav {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    scroll-padding-bottom: calc(330px + env(safe-area-inset-bottom, 0px)) !important;
    padding-bottom: calc(330px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* iOS standalone fallback. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-track {
    position: relative !important;
    min-height: 72px !important;
    padding-left: 66px !important;
    padding-right: 66px !important;
    box-sizing: border-box !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-station-logo {
    position: absolute !important;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 46px !important;
    display: grid !important;
    place-items: center !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid rgba(122, 145, 214, .42) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(18, 28, 52, .98), rgba(7, 13, 28, .99)) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.28), 0 0 0 1px rgba(139,92,255,.08) !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-station-logo img[hidden],
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-station-logo [data-pwa-track-avatar][hidden] {
    display: none !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-station-logo img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: contain !important;
    border-radius: 999px !important;
    background: transparent !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-station-logo [data-pwa-track-avatar] {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    color: #f7f9ff !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    letter-spacing: .02em !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-guide-button {
    color: #ffffff !important;
    border-color: rgba(150, 169, 216, .28) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)) !important;
    box-shadow: none !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-guide-button svg {
    color: #ffffff !important;
    stroke: currentColor !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .site-header .main-nav {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    scroll-padding-bottom: calc(330px + env(safe-area-inset-bottom, 0px)) !important;
    padding-bottom: calc(330px + env(safe-area-inset-bottom, 0px)) !important;
  }
}
/* ===== COLUCA V1.006.12 BUGFIX - PWA PLAYER LOGO / WHITE GUIDE / MENU SCROLL END ===== */


/* ===== COLUCA V1.006.13 IMPROVEMENT - PWA PLATINUM SPECTRUM + NAV NEON =====
   Installed phone/tablet PWA only. Website/desktop and audio routing remain untouched. */
body:not(.admincenter-body) .pwa-platinum-equalizer {
  display: none !important;
}

@keyframes colucaPwaPlatinumEqPulse {
  0%   { transform: scaleY(.28); filter: brightness(.88); }
  45%  { transform: scaleY(.94); filter: brightness(1.08); }
  72%  { transform: scaleY(.52); filter: brightness(.98); }
  100% { transform: scaleY(1); filter: brightness(1.12); }
}

/* Shared per-bar geometry also applies to the iOS standalone fallback class. */
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(1)  { --eq-h:42%; --eq-t:820ms; --eq-d:-410ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(2)  { --eq-h:58%; --eq-t:930ms; --eq-d:-220ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(3)  { --eq-h:74%; --eq-t:790ms; --eq-d:-540ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(4)  { --eq-h:88%; --eq-t:980ms; --eq-d:-170ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(5)  { --eq-h:66%; --eq-t:850ms; --eq-d:-620ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(6)  { --eq-h:92%; --eq-t:1040ms; --eq-d:-340ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(7)  { --eq-h:79%; --eq-t:880ms; --eq-d:-480ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(8)  { --eq-h:54%; --eq-t:970ms; --eq-d:-250ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(9)  { --eq-h:70%; --eq-t:810ms; --eq-d:-690ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(10) { --eq-h:96%; --eq-t:1080ms; --eq-d:-390ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(11) { --eq-h:83%; --eq-t:900ms; --eq-d:-580ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(12) { --eq-h:61%; --eq-t:1010ms; --eq-d:-130ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(13) { --eq-h:77%; --eq-t:840ms; --eq-d:-460ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(14) { --eq-h:90%; --eq-t:990ms; --eq-d:-760ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(15) { --eq-h:68%; --eq-t:860ms; --eq-d:-310ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(16) { --eq-h:84%; --eq-t:1060ms; --eq-d:-520ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(17) { --eq-h:57%; --eq-t:920ms; --eq-d:-660ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(18) { --eq-h:73%; --eq-t:780ms; --eq-d:-270ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(19) { --eq-h:91%; --eq-t:1030ms; --eq-d:-570ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(20) { --eq-h:76%; --eq-t:870ms; --eq-d:-150ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(21) { --eq-h:63%; --eq-t:960ms; --eq-d:-720ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(22) { --eq-h:86%; --eq-t:830ms; --eq-d:-360ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(23) { --eq-h:69%; --eq-t:1000ms; --eq-d:-610ms; }
body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(24) { --eq-h:48%; --eq-t:890ms; --eq-d:-230ms; }

@media (max-width: 1024px) {
  /* Platinum accounts do not need the free-account marketing copy/CTAs in PWA.
     Replace that complete zone with the compact mobile-webplayer spectrum. */
  html body:not(.admincenter-body) .hero-copy--platinum > p,
  html body:not(.admincenter-body) .hero-copy--platinum > .hero-actions,
  html body:not(.admincenter-body) .hero-copy--platinum > .hero-trust {
    display: none !important;
  }

  html body:not(.admincenter-body) .hero-copy--platinum .pwa-platinum-equalizer {
    width: 100% !important;
    min-height: 154px !important;
    display: grid !important;
    grid-template-rows: 24px minmax(94px, 1fr) 18px !important;
    gap: 5px !important;
    margin: 18px 0 8px !important;
    padding: 10px 11px 8px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(73, 102, 118, .72) !important;
    border-radius: 22px !important;
    background:
      linear-gradient(180deg, rgba(25,255,68,.025), transparent 48%) padding-box,
      linear-gradient(180deg, rgba(2,8,8,.995), rgba(0,4,3,.998)) padding-box !important;
    box-shadow:
      inset 0 0 0 1px rgba(10,31,20,.88),
      inset 0 0 24px rgba(24,255,67,.025),
      0 14px 36px rgba(0,0,0,.24) !important;
    contain: layout paint style !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__toolbar {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    font-family: Consolas, "Courier New", monospace !important;
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__toolbar strong {
    color: #6cf17b !important;
    font-size: 10px !important;
    letter-spacing: .11em !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__toolbar span {
    color: #88a38d !important;
    white-space: nowrap !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__screen {
    position: relative !important;
    min-width: 0 !important;
    min-height: 94px !important;
    overflow: hidden !important;
    border-top: 1px solid rgba(75,116,81,.22) !important;
    border-bottom: 1px solid rgba(75,116,81,.22) !important;
    background:
      linear-gradient(rgba(31,82,42,.12) 1px, transparent 1px),
      linear-gradient(90deg, rgba(31,82,42,.11) 1px, transparent 1px),
      #000301 !important;
    background-size: 100% 20%, 12.5% 100% !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars {
    position: absolute !important;
    inset: 7px 8px 6px !important;
    display: grid !important;
    grid-template-columns: repeat(24, minmax(2px, 1fr)) !important;
    align-items: end !important;
    gap: clamp(2px, .65vw, 4px) !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i {
    width: 100% !important;
    height: var(--eq-h, 68%) !important;
    min-height: 5px !important;
    display: block !important;
    align-self: end !important;
    transform-origin: center bottom !important;
    background: linear-gradient(to top, #20f04c 0 60%, #a9ee31 60% 76%, #f6d83c 76% 90%, #ff6a3c 90% 100%) !important;
    -webkit-mask: repeating-linear-gradient(to top, #000 0 4px, transparent 4px 6px) !important;
    mask: repeating-linear-gradient(to top, #000 0 4px, transparent 4px 6px) !important;
    animation: colucaPwaPlatinumEqPulse var(--eq-t, 920ms) ease-in-out infinite alternate !important;
    animation-delay: var(--eq-d, 0ms) !important;
    will-change: transform !important;
    opacity: .97 !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(1)  { --eq-h:42%; --eq-t:820ms; --eq-d:-410ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(2)  { --eq-h:58%; --eq-t:930ms; --eq-d:-220ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(3)  { --eq-h:74%; --eq-t:790ms; --eq-d:-540ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(4)  { --eq-h:88%; --eq-t:980ms; --eq-d:-170ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(5)  { --eq-h:66%; --eq-t:850ms; --eq-d:-620ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(6)  { --eq-h:92%; --eq-t:1040ms; --eq-d:-340ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(7)  { --eq-h:79%; --eq-t:880ms; --eq-d:-480ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(8)  { --eq-h:54%; --eq-t:970ms; --eq-d:-250ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(9)  { --eq-h:70%; --eq-t:810ms; --eq-d:-690ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(10) { --eq-h:96%; --eq-t:1080ms; --eq-d:-390ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(11) { --eq-h:83%; --eq-t:900ms; --eq-d:-580ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(12) { --eq-h:61%; --eq-t:1010ms; --eq-d:-130ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(13) { --eq-h:77%; --eq-t:840ms; --eq-d:-460ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(14) { --eq-h:90%; --eq-t:990ms; --eq-d:-760ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(15) { --eq-h:68%; --eq-t:860ms; --eq-d:-310ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(16) { --eq-h:84%; --eq-t:1060ms; --eq-d:-520ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(17) { --eq-h:57%; --eq-t:920ms; --eq-d:-660ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(18) { --eq-h:73%; --eq-t:780ms; --eq-d:-270ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(19) { --eq-h:91%; --eq-t:1030ms; --eq-d:-570ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(20) { --eq-h:76%; --eq-t:870ms; --eq-d:-150ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(21) { --eq-h:63%; --eq-t:960ms; --eq-d:-720ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(22) { --eq-h:86%; --eq-t:830ms; --eq-d:-360ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(23) { --eq-h:69%; --eq-t:1000ms; --eq-d:-610ms; }
  html body:not(.admincenter-body) .pwa-platinum-equalizer__bars i:nth-child(24) { --eq-h:48%; --eq-t:890ms; --eq-d:-230ms; }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__peak {
    position: absolute !important;
    left: 8px !important;
    right: 8px !important;
    top: 30% !important;
    height: 1px !important;
    background: rgba(255,219,67,.32) !important;
    opacity: .58 !important;
    pointer-events: none !important;
  }

  html body:not(.admincenter-body) .pwa-platinum-equalizer__scale {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 5px !important;
    color: #4f6c55 !important;
    font-family: Consolas, "Courier New", monospace !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }

  /* Same 1px COLUCA 2.0 purple-blue-cyan neon rim as the floating player. */
  html body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html body:not(.admincenter-body) .coluca-pwa-nav-v157,
  html body:not(.admincenter-body) .v158-pwa-nav {
    border: 1px solid transparent !important;
    background:
      linear-gradient(180deg, rgba(3,5,10,.97), rgba(3,5,10,.99)) padding-box,
      linear-gradient(135deg, #8B5CFF 0%, #4D7EFF 58%, #2DCBFF 100%) border-box !important;
    box-shadow:
      0 18px 42px rgba(0,0,0,.42),
      0 0 18px rgba(139,92,255,.13),
      0 0 28px rgba(77,126,255,.15),
      0 0 36px rgba(45,203,255,.07) !important;
  }

  html.coluca-mobile-is-scrolling body:not(.admincenter-body) .pwa-platinum-equalizer__bars i {
    animation-play-state: paused !important;
  }
}

/* iOS installed-PWA fallback class. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum > p,
  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum > .hero-actions,
  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum > .hero-trust {
    display: none !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum .pwa-platinum-equalizer {
    width: 100% !important;
    min-height: 154px !important;
    display: grid !important;
    grid-template-rows: 24px minmax(94px, 1fr) 18px !important;
    gap: 5px !important;
    margin: 18px 0 8px !important;
    padding: 10px 11px 8px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(73, 102, 118, .72) !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, rgba(2,8,8,.995), rgba(0,4,3,.998)) !important;
    box-shadow: inset 0 0 0 1px rgba(10,31,20,.88), inset 0 0 24px rgba(24,255,67,.025), 0 14px 36px rgba(0,0,0,.24) !important;
    contain: layout paint style !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__toolbar {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    font-family: Consolas, "Courier New", monospace !important;
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__toolbar strong { color:#6cf17b !important; font-size:10px !important; letter-spacing:.11em !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__toolbar span { color:#88a38d !important; white-space:nowrap !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__screen {
    position: relative !important; min-width:0 !important; min-height:94px !important; overflow:hidden !important;
    border-top:1px solid rgba(75,116,81,.22) !important; border-bottom:1px solid rgba(75,116,81,.22) !important;
    background: linear-gradient(rgba(31,82,42,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(31,82,42,.11) 1px, transparent 1px), #000301 !important;
    background-size:100% 20%,12.5% 100% !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__bars {
    position:absolute !important; inset:7px 8px 6px !important; display:grid !important; grid-template-columns:repeat(24,minmax(2px,1fr)) !important; align-items:end !important; gap:clamp(2px,.65vw,4px) !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__bars i {
    width:100% !important; height:var(--eq-h,68%) !important; min-height:5px !important; display:block !important; align-self:end !important; transform-origin:center bottom !important;
    background:linear-gradient(to top,#20f04c 0 60%,#a9ee31 60% 76%,#f6d83c 76% 90%,#ff6a3c 90% 100%) !important;
    -webkit-mask:repeating-linear-gradient(to top,#000 0 4px,transparent 4px 6px) !important; mask:repeating-linear-gradient(to top,#000 0 4px,transparent 4px 6px) !important;
    animation:colucaPwaPlatinumEqPulse var(--eq-t,920ms) ease-in-out infinite alternate !important; animation-delay:var(--eq-d,0ms) !important; will-change:transform !important; opacity:.97 !important;
  }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__peak { position:absolute !important; left:8px !important; right:8px !important; top:30% !important; height:1px !important; background:rgba(255,219,67,.32) !important; opacity:.58 !important; pointer-events:none !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__scale { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:5px !important; color:#4f6c55 !important; font-family:Consolas,"Courier New",monospace !important; font-size:8px !important; line-height:1 !important; }
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v156,
  html.coluca-surface-mobile body:not(.admincenter-body) .coluca-pwa-nav-v157,
  html.coluca-surface-mobile body:not(.admincenter-body) .v158-pwa-nav {
    border:1px solid transparent !important;
    background: linear-gradient(180deg,rgba(3,5,10,.97),rgba(3,5,10,.99)) padding-box, linear-gradient(135deg,#8B5CFF 0%,#4D7EFF 58%,#2DCBFF 100%) border-box !important;
    box-shadow:0 18px 42px rgba(0,0,0,.42),0 0 18px rgba(139,92,255,.13),0 0 28px rgba(77,126,255,.15),0 0 36px rgba(45,203,255,.07) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.coluca-surface-mobile body:not(.admincenter-body) .pwa-platinum-equalizer__bars i {
    animation: none !important;
    transform: scaleY(.72) !important;
  }
}
/* ===== COLUCA V1.006.13 IMPROVEMENT - PWA PLATINUM SPECTRUM + NAV NEON END ===== */

/* ===== COLUCA V1.006.14 BUGFIX - PWA PLATINUM CENTERING + ICON RESILIENCE =====
   Installed phone/tablet PWA only. Centers the Platinum hero/station copy and
   keeps unresolved Lucide placeholders dimensionally stable while the release-
   cached icon runtime hydrates them. */
@media (max-width: 1024px) {
  html body:not(.admincenter-body) .hero-copy--platinum > .eyebrow,
  html body:not(.admincenter-body) .hero-copy--platinum > #hero-title {
    width: 100% !important;
    text-align: center !important;
  }

  html body:not(.admincenter-body) .hero-copy--platinum > .eyebrow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body:not(.admincenter-body) .section--stations-platinum .section-heading {
    justify-items: center !important;
    text-align: center !important;
  }

  html body:not(.admincenter-body) .section--stations-platinum .section-heading > div,
  html body:not(.admincenter-body) .section--stations-platinum .section-heading-action {
    width: 100% !important;
    text-align: center !important;
  }

  html body:not(.admincenter-body) .section--stations-platinum .section-heading-action {
    justify-items: center !important;
    align-items: center !important;
  }

  html body:not(.admincenter-body) .section--stations-platinum .section-heading-action p,
  html body:not(.admincenter-body) .section--stations-platinum .section-heading-action a {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  /* Reserve the exact icon box before Lucide hydration so controls never collapse. */
  html body:not(.admincenter-body) i[data-lucide] {
    display: inline-block;
    width: 1em;
    height: 1em;
    min-width: 1em;
    min-height: 1em;
    flex: 0 0 auto;
  }
}

/* iOS installed-PWA fallback class used throughout the existing mobile shell. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum > .eyebrow,
  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum > #hero-title {
    width: 100% !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .hero-copy--platinum > .eyebrow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .section--stations-platinum .section-heading {
    justify-items: center !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .section--stations-platinum .section-heading > div,
  html.coluca-surface-mobile body:not(.admincenter-body) .section--stations-platinum .section-heading-action {
    width: 100% !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .section--stations-platinum .section-heading-action {
    justify-items: center !important;
    align-items: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .section--stations-platinum .section-heading-action p,
  html.coluca-surface-mobile body:not(.admincenter-body) .section--stations-platinum .section-heading-action a {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) i[data-lucide] {
    display: inline-block;
    width: 1em;
    height: 1em;
    min-width: 1em;
    min-height: 1em;
    flex: 0 0 auto;
  }
}
/* ===== COLUCA V1.006.14 BUGFIX - PWA PLATINUM CENTERING + ICON RESILIENCE END ===== */

/* ===== COLUCA V1.006.17 IMPROVEMENT - PWA HERO HARD CENTER + PROGRAM VISUAL START =====
   Installed phone/tablet PWA only. Every hero text line owns the exact same
   center axis. The red live dot is absolutely positioned so it cannot shift
   the eyebrow text. The floating player mirrors the station logo with the
   current presenter/program image, falling back to the white guide icon. */
body:not(.admincenter-body) .player-shell .player-pwa-program-visual {
  display: none !important;
}

@media (max-width: 1024px) {
  html body:not(.admincenter-body) #main-content .hero-copy {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
    text-align: center !important;
  }

  html body:not(.admincenter-body) #main-content .hero-copy > .hero-eyebrow-centered {
    width: 100% !important;
    margin: 0 0 10px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  html body:not(.admincenter-body) #main-content .hero-copy .hero-eyebrow-text {
    position: relative !important;
    display: inline-block !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  html body:not(.admincenter-body) #main-content .hero-copy .hero-eyebrow-text > .live-dot {
    position: absolute !important;
    left: -17px !important;
    top: 50% !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
  }

  html body:not(.admincenter-body) #main-content .hero-copy > #hero-title {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    row-gap: 3px !important;
    text-align: center !important;
    text-wrap: initial !important;
  }

  html body:not(.admincenter-body) #main-content .hero-copy > #hero-title > .hero-title-line {
    width: 100% !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    justify-self: stretch !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-program-visual {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 46px !important;
    display: grid !important;
    place-items: center !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid rgba(122, 145, 214, .42) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: linear-gradient(180deg, rgba(18, 28, 52, .98), rgba(7, 13, 28, .99)) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.28), 0 0 0 1px rgba(139,92,255,.08) !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-program-visual img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 999px !important;
    background: transparent !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-program-visual img[hidden],
  html body:not(.admincenter-body) .player-shell .player-pwa-program-fallback[hidden] {
    display: none !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-program-fallback {
    width: 100% !important;
    height: 100% !important;
    display: grid !important;
    place-items: center !important;
    color: #ffffff !important;
  }

  html body:not(.admincenter-body) .player-shell .player-pwa-program-fallback svg {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    color: currentColor !important;
    stroke: currentColor !important;
  }
}

/* iOS installed-PWA fallback class. */
@media (max-width: 1024px) {
  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy > .hero-eyebrow-centered {
    width: 100% !important;
    margin: 0 0 10px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy .hero-eyebrow-text {
    position: relative !important;
    display: inline-block !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy .hero-eyebrow-text > .live-dot {
    position: absolute !important;
    left: -17px !important;
    top: 50% !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy > #hero-title {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    row-gap: 3px !important;
    text-align: center !important;
    text-wrap: initial !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) #main-content .hero-copy > #hero-title > .hero-title-line {
    width: 100% !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    justify-self: stretch !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-program-visual {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 46px !important;
    display: grid !important;
    place-items: center !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid rgba(122, 145, 214, .42) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: linear-gradient(180deg, rgba(18, 28, 52, .98), rgba(7, 13, 28, .99)) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.28), 0 0 0 1px rgba(139,92,255,.08) !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-program-visual img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 999px !important;
    background: transparent !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-program-visual img[hidden],
  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-program-fallback[hidden] {
    display: none !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-program-fallback {
    width: 100% !important;
    height: 100% !important;
    display: grid !important;
    place-items: center !important;
    color: #ffffff !important;
  }

  html.coluca-surface-mobile body:not(.admincenter-body) .player-shell .player-pwa-program-fallback svg {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    color: currentColor !important;
    stroke: currentColor !important;
  }
}
/* ===== COLUCA V1.006.17 IMPROVEMENT - PWA HERO HARD CENTER + PROGRAM VISUAL END ===== */



/* ===== COLUCA V1.006.18 IMPROVEMENT - PLATFORM PROGRAM ARTWORK START =====
   Every programme-artwork slot consumes the same resolved guide image.
   No station logo is used as a programme-photo substitute; the guide icon is
   the visual fallback when no reliable free image is available. */
body:not(.admincenter-body) .expanded-guide-current-media > img:not([hidden]) + .expanded-guide-current-icon {
  display: none !important;
}

body:not(.admincenter-body) .programming-presenter-visual .presenter-avatar-fallback {
  color: #ffffff;
}

body:not(.admincenter-body) .programming-presenter-visual .presenter-avatar-fallback svg {
  width: 22px;
  height: 22px;
  display: block;
}
/* ===== COLUCA V1.006.18 IMPROVEMENT - PLATFORM PROGRAM ARTWORK END ===== */


/* ===== COLUCA V1.006.19 IMPROVEMENT - PWA NAV/PERSISTENT PLAYER POLISH START ===== */
@media (max-width: 1024px) {
  body:not(.admincenter-body) .v158-pwa-nav .pwa-nav-icon,
  body:not(.admincenter-body) .coluca-pwa-nav-v157 .pwa-nav-icon,
  body:not(.admincenter-body) .coluca-pwa-nav-v156 .pwa-nav-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 23px !important;
    height: 23px !important;
    flex: 0 0 23px !important;
  }
  body:not(.admincenter-body) .v158-pwa-nav .pwa-nav-icon svg,
  body:not(.admincenter-body) .coluca-pwa-nav-v157 .pwa-nav-icon svg,
  body:not(.admincenter-body) .coluca-pwa-nav-v156 .pwa-nav-icon svg {
    width: 23px !important;
    height: 23px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.9 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    vector-effect: non-scaling-stroke;
  }
  body:not(.admincenter-body) .expanded-player-shortcut.is-active {
    border-color: rgba(174, 107, 255, .42) !important;
    color: #d69cff !important;
    background: linear-gradient(180deg, rgba(139,92,255,.075), rgba(36,140,255,.035)) !important;
    box-shadow: 0 0 14px rgba(139,92,255,.08) !important;
  }
  body:not(.admincenter-body) .expanded-player-shortcut:hover:not(.is-active) {
    border-color: rgba(109, 130, 184, .20) !important;
    color: rgba(235, 239, 250, .96) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  }
  body:not(.admincenter-body) .expanded-player-shortcut .expanded-player-shortcut-icon {
    width: 24px !important;
    height: 24px !important;
    stroke-width: 1.9 !important;
  }
  body:not(.admincenter-body) main[aria-busy="true"] {
    opacity: .985;
    pointer-events: none;
  }
}
/* ===== COLUCA V1.006.19 IMPROVEMENT - PWA NAV/PERSISTENT PLAYER POLISH END ===== */


/* ===== COLUCA V1.006.21 BUGFIX - WEBSITE PLAYER ALIGNMENT + ICON ORDER + BRAND COLOR START =====
   Website/browser only. Keeps PWA mobile/tablet behavior untouched while
   tightening the desktop live badge alignment, right-side control order and
   remaining legacy gold accents on the homepage. */
@media (min-width: 1025px) {
  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status.is-live-status {
    display: inline-flex !important;
    width: auto !important;
    max-width: max-content !important;
    margin: 3px auto 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    justify-self: center !important;
    gap: 8px !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  body:not(.admincenter-body) .player-pwa-track .player-status-live-dot {
    display: inline-block !important;
    align-self: center !important;
    width: 8px !important;
    min-width: 8px !important;
    height: 8px !important;
    margin: 0 !important;
    transform: translateY(-1px) !important;
  }

  body:not(.admincenter-body) .player-pwa-track .player-status-live-label {
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1 !important;
  }

  body:not(.admincenter-body) .player-pwa-track .player-status-live-detail {
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1 !important;
  }

  body:not(.admincenter-body) .player-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
  }

  body:not(.admincenter-body) .player-actions [data-mute] { order: 10 !important; }
  body:not(.admincenter-body) .player-actions [data-audio-settings-open] { order: 20 !important; }
  body:not(.admincenter-body) .player-actions [data-device-playback-open] { order: 30 !important; }
  body:not(.admincenter-body) .player-actions [data-player-guide-open] { order: 40 !important; }
  body:not(.admincenter-body) .player-actions [data-music-add="spotify"] { order: 50 !important; }
  body:not(.admincenter-body) .player-actions [data-music-add="apple_music"] { order: 60 !important; }
  body:not(.admincenter-body) .player-actions [data-shazam-open] { order: 70 !important; }
  body:not(.admincenter-body) .player-actions [data-player-favorite] { order: 80 !important; }
  body:not(.admincenter-body) .player-actions [data-player-expand] { order: 90 !important; }
  body:not(.admincenter-body) .player-actions [data-volume] { order: 100 !important; }
  body:not(.admincenter-body) .player-actions [data-player-close] { order: 110 !important; }

  body:not(.admincenter-body) #main-content .daily-top-station > div > span:first-child {
    color: #9ac5ff !important;
    letter-spacing: .08em !important;
  }

  body:not(.admincenter-body) #main-content .daily-top-station > div > span:first-child .live-dot {
    box-shadow: 0 0 12px rgba(255, 83, 111, .72) !important;
  }

  body:not(.admincenter-body) #main-content #hero-title .hero-title-line--accent {
    color: #9d8bff !important;
    background: linear-gradient(90deg, #a78bfa 0%, #8b5cf6 48%, #22d3ee 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
  }
}
/* ===== COLUCA V1.006.21 BUGFIX - WEBSITE PLAYER ALIGNMENT + ICON ORDER + BRAND COLOR END ===== */


/* ===== COLUCA V1.006.22 BUGFIX - WEBSITE ALIGNMENT / BRAND / GUIDE START ===== */
@media (min-width: 1025px) {
  /* The full LIVE badge owns the same 100% center axis as title and artist. */
  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status.is-live-status {
    display: grid !important;
    grid-template-columns: 8px auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 3px 0 0 !important;
    padding: 0 !important;
    place-content: center !important;
    align-items: center !important;
    justify-items: center !important;
    column-gap: 8px !important;
    line-height: 1 !important;
    text-align: center !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-dot {
    width: 8px !important;
    min-width: 8px !important;
    height: 8px !important;
    margin: 0 !important;
    transform: none !important;
    align-self: center !important;
    justify-self: center !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-label {
    margin: 0 !important;
    padding: 0 !important;
    align-self: center !important;
    line-height: 1 !important;
  }
  body:not(.admincenter-body) .player-pwa-track .player-status-live-detail {
    grid-column: 1 / -1 !important;
    justify-self: center !important;
  }

  /* Remove the remaining legacy yellow/gold from the shown website sections. */
  body:not(.admincenter-body) #main-content .feature-list > div > span {
    color: #8b9dff !important;
  }
  body:not(.admincenter-body) #main-content .feature-number {
    color: #8b5cf6 !important;
    text-shadow: 0 0 22px rgba(34,211,238,.10) !important;
  }
  body:not(.admincenter-body) #main-content .feature-visual > span:last-child {
    color: #9db0cc !important;
  }
  body:not(.admincenter-body) .footer-corporate-copy a {
    color: #8fb8ff !important;
  }

  /* Keep the entire phrase on one clean second line under Jouw radio. */
  body:not(.admincenter-body) #main-content #hero-title {
    max-width: none !important;
    width: max-content !important;
    min-width: min(100%, 620px) !important;
  }
  body:not(.admincenter-body) #main-content #hero-title .hero-title-line--primary,
  body:not(.admincenter-body) #main-content #hero-title .hero-title-line--accent {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
  }
  body:not(.admincenter-body) #main-content #hero-title .hero-title-line--accent {
    white-space: nowrap !important;
    text-wrap: nowrap !important;
  }

  /* Expanded guide: tighter, aligned and information-dense without changing PWA. */
  body:not(.admincenter-body) .expanded-player-guide {
    margin-top: 10px !important;
    padding: 14px 18px 16px !important;
    border-radius: 18px !important;
  }
  body:not(.admincenter-body) .expanded-player-section-header {
    align-items: end !important;
    margin-bottom: 8px !important;
  }
  body:not(.admincenter-body) .expanded-player-section-header h3 {
    margin-top: 2px !important;
    font-size: 1.55rem !important;
    line-height: 1.05 !important;
  }
  body:not(.admincenter-body) .expanded-player-section-header [data-expanded-guide-source] {
    color: #8fb8ff !important;
    font-size: .78rem !important;
  }
  body:not(.admincenter-body) .expanded-guide-current--neon {
    grid-template-columns: 68px minmax(0, 1fr) !important;
    gap: 12px !important;
    min-height: 76px !important;
    padding: 8px 0 10px !important;
    text-align: left !important;
  }
  body:not(.admincenter-body) .expanded-guide-current-media {
    width: 68px !important;
    height: 68px !important;
    border-radius: 14px !important;
  }
  body:not(.admincenter-body) .expanded-guide-current-copy {
    gap: 3px !important;
    min-width: 0 !important;
  }
  body:not(.admincenter-body) .expanded-guide-current-label {
    font-size: .72rem !important;
  }
  body:not(.admincenter-body) .expanded-guide-now {
    font-size: .94rem !important;
    line-height: 1.28 !important;
  }
  body:not(.admincenter-body) .expanded-guide-list--neon {
    gap: 7px !important;
  }
  body:not(.admincenter-body) .expanded-guide-group-label {
    margin: 4px 0 0 !important;
    font-size: .72rem !important;
  }
  body:not(.admincenter-body) .expanded-guide-row {
    grid-template-columns: 92px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
    text-align: left !important;
  }
  body:not(.admincenter-body) .expanded-guide-row time {
    font-size: .88rem !important;
  }
  body:not(.admincenter-body) .expanded-guide-row strong {
    margin-bottom: 2px !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
  }
  body:not(.admincenter-body) .expanded-guide-row small,
  body:not(.admincenter-body) .expanded-guide-empty {
    font-size: .78rem !important;
    line-height: 1.28 !important;
  }
}
/* ===== COLUCA V1.006.22 BUGFIX - WEBSITE ALIGNMENT / BRAND / GUIDE END ===== */


/* ===== COLUCA V1.006.23 BUGFIX - WEBSITE LIVE BADGE + HERO TYPE START =====
   Desktop website only. Keeps title/artist/quality/LIVE on stable centered rows,
   restores visible spacing after the hero live-dot and prevents descender clipping. */
@media (min-width: 1025px) {
  body:not(.admincenter-body) .player-pwa-track {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    align-content: center !important;
    row-gap: 2px !important;
    overflow: visible !important;
    text-align: center !important;
  }

  body:not(.admincenter-body) .player-pwa-track > strong {
    order: 1 !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.15 !important;
    text-align: center !important;
  }

  body:not(.admincenter-body) .player-pwa-track > small {
    order: 2 !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.15 !important;
    text-align: center !important;
  }

  body:not(.admincenter-body) .player-pwa-track > .player-pwa-quality {
    order: 3 !important;
    display: block !important;
    width: 100% !important;
    margin: 1px 0 0 !important;
    color: #aebbd0 !important;
    font-size: .69rem !important;
    font-weight: 650 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body:not(.admincenter-body) .player-pwa-track > .player-pwa-quality[hidden] {
    display: none !important;
  }

  body:not(.admincenter-body) .player-pwa-track > .player-pwa-status.is-live-status {
    order: 4 !important;
    display: inline-flex !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 2px auto 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    justify-self: center !important;
    gap: 8px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }

  body:not(.admincenter-body) .player-pwa-track .player-status-live-dot {
    display: block !important;
    width: 8px !important;
    min-width: 8px !important;
    height: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: center !important;
    transform: none !important;
    border-radius: 999px !important;
    background: #ff4055 !important;
    box-shadow: 0 0 10px rgba(255,64,85,.78) !important;
  }

  body:not(.admincenter-body) .player-pwa-track .player-status-live-label {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #43ef7d !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: .05em !important;
  }

  /* Hero dot + eyebrow: explicit flex gap; no more visual collision with RADIO. */
  body:not(.admincenter-body) #main-content .hero-copy .hero-eyebrow-text {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
  }

  body:not(.admincenter-body) #main-content .hero-copy .hero-eyebrow-text > .live-dot {
    position: static !important;
    flex: 0 0 7px !important;
    width: 7px !important;
    height: 7px !important;
    margin: 0 !important;
    transform: none !important;
  }

  /* Keep 'Zonder grenzen.' intact and give letters with descenders enough room. */
  body:not(.admincenter-body) #main-content #hero-title {
    overflow: visible !important;
    padding-bottom: .14em !important;
  }

  body:not(.admincenter-body) #main-content #hero-title .hero-title-line--accent {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
    padding: 0 0 .12em !important;
    margin: 0 !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
  }
}
/* ===== COLUCA V1.006.23 BUGFIX - WEBSITE LIVE BADGE + HERO TYPE END ===== */


/* ===== COLUCA V1.006.43 IMPROVEMENT - FREE FIRST SUBSCRIPTION EXPERIENCE ===== */
body:not(.admincenter-body) .plus-plans {
  background:
    radial-gradient(circle at 18% 0%, rgba(139,61,255,.16), transparent 30%),
    radial-gradient(circle at 86% 8%, rgba(36,140,255,.13), transparent 28%),
    linear-gradient(180deg,#03050A 0%,#081020 54%,#03050A 100%) !important;
}
body:not(.admincenter-body) .plus-section-heading { max-width: 820px !important; margin-bottom: 30px !important; }
body:not(.admincenter-body) .plus-section-heading h2 { font-size: clamp(2rem,4vw,3.6rem) !important; line-height: 1 !important; letter-spacing: -.045em !important; }
body:not(.admincenter-body) .plus-plan-grid--growth { gap: 14px !important; }
body:not(.admincenter-body) .plus-plan-card {
  min-height: 430px !important;
  padding: clamp(22px,3vw,32px) !important;
  border: 1px solid rgba(139,92,246,.22) !important;
  background: linear-gradient(145deg,rgba(168,85,247,.04),transparent 38%),#112348 !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.26) !important;
}
body:not(.admincenter-body) .plus-plan-card--free {
  border-color: rgba(67,239,125,.28) !important;
  background: linear-gradient(145deg,rgba(67,239,125,.06),transparent 42%),#0D1B34 !important;
}
body:not(.admincenter-body) .plus-plan-card--featured {
  border-color: rgba(36,140,255,.52) !important;
  background: linear-gradient(145deg,rgba(36,140,255,.10),rgba(139,61,255,.045) 55%,transparent),#112348 !important;
  box-shadow: 0 18px 52px rgba(36,140,255,.13),0 16px 42px rgba(0,0,0,.26) !important;
}
body:not(.admincenter-body) .plus-plan-card--premium {
  border-color: rgba(139,61,255,.52) !important;
  background: linear-gradient(145deg,rgba(139,61,255,.11),rgba(36,140,255,.04) 58%,transparent),#111B36 !important;
}
body:not(.admincenter-body) .plus-plan-icon {
  border-color: rgba(139,92,246,.30) !important;
  background: rgba(139,61,255,.10) !important;
  color: #A855F7 !important;
}
body:not(.admincenter-body) .plus-plan-card--free .plus-plan-icon { color: #43EF7D !important; border-color: rgba(67,239,125,.28) !important; background: rgba(67,239,125,.07) !important; }
body:not(.admincenter-body) .plus-plan-top div > span,
body:not(.admincenter-body) .plus-plan-card li svg,
body:not(.admincenter-body) .plus-plan-footnote svg { color: #21B7FF !important; }
body:not(.admincenter-body) .plus-plan-badge {
  background: linear-gradient(90deg,#8B3DFF,#248CFF) !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(36,140,255,.24) !important;
}
body:not(.admincenter-body) .plus-plan-price strong { font-size: clamp(2.35rem,4vw,3.45rem) !important; }
body:not(.admincenter-body) .plus-plan-card ul { margin: 22px 0 26px !important; padding-top: 20px !important; border-color: rgba(255,255,255,.08) !important; }
body:not(.admincenter-body) .plus-plan-card .button--gold,
body:not(.admincenter-body) .plus-final-card .button--gold {
  border-color: transparent !important;
  background: linear-gradient(135deg,#8B3DFF 0%,#248CFF 72%,#21B7FF 100%) !important;
  color: #fff !important;
  box-shadow: 0 10px 28px rgba(36,140,255,.20) !important;
}
body:not(.admincenter-body) .plus-faq-grid,
body:not(.admincenter-body) .plus-final-card,
body:not(.admincenter-body) .platinum-invite-card {
  border-color: rgba(139,92,246,.20) !important;
  background: linear-gradient(145deg,rgba(139,61,255,.035),rgba(36,140,255,.025) 52%,transparent),#0D1630 !important;
}
body:not(.admincenter-body) .platinum-invite-label { color: #BFC8D6 !important; border-color: rgba(139,92,246,.22) !important; background: rgba(139,61,255,.06) !important; }
@media (max-width: 760px) {
  body:not(.admincenter-body) .plus-plans { padding-top: calc(var(--c2-header) + 18px) !important; }
  body:not(.admincenter-body) .plus-plan-grid--growth { grid-template-columns: 1fr !important; }
  body:not(.admincenter-body) .plus-plan-card { min-height: 0 !important; border-radius: 18px !important; padding: 20px !important; }
  body:not(.admincenter-body) .plus-section-heading h2 { font-size: clamp(2rem,10vw,2.75rem) !important; }
}
/* ===== COLUCA V1.006.43 IMPROVEMENT END ===== */

/* ============================================================
   V1.006.44 - Basic country chooser + permanent visitor counter
   Scope: subscription UI and homepage footer only.
   ============================================================ */
body:not(.admincenter-body) .basic-country-picker {
  display: grid !important;
  gap: 10px !important;
  margin: 14px 0 !important;
  padding: 14px !important;
  border: 1px solid rgba(139,92,255,.24) !important;
  border-radius: 16px !important;
  background: rgba(7,13,26,.72) !important;
}
body:not(.admincenter-body) .basic-country-picker label {
  display: grid !important;
  gap: 6px !important;
  color: #EAF0FF !important;
  font-size: .84rem !important;
  font-weight: 700 !important;
}
body:not(.admincenter-body) .basic-country-picker select {
  width: 100% !important;
  min-height: 44px !important;
  padding: 9px 12px !important;
  color: #F7F9FF !important;
  background: #0B1530 !important;
  border: 1px solid rgba(79,124,255,.35) !important;
  border-radius: 12px !important;
}
body:not(.admincenter-body) .basic-country-picker small { color: #AEBBD6 !important; }
body:not(.admincenter-body) .coluca-visitor-counter {
  width: min(620px, calc(100% - 32px)) !important;
  margin: 12px auto 18px !important;
  padding: 12px 18px !important;
  display: grid !important;
  justify-items: center !important;
  gap: 2px !important;
  text-align: center !important;
  border: 1px solid rgba(139,92,255,.22) !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, rgba(139,92,255,.08), rgba(34,211,238,.045)) !important;
}
body:not(.admincenter-body) .coluca-visitor-counter__label {
  color: #BFCBDF !important;
  font-size: .73rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
body:not(.admincenter-body) .coluca-visitor-counter__value {
  color: #FFFFFF !important;
  font-size: clamp(1.45rem, 3vw, 2rem) !important;
  line-height: 1.1 !important;
  font-variant-numeric: tabular-nums !important;
}
body:not(.admincenter-body) .coluca-visitor-counter small {
  color: #8FA0BC !important;
  font-size: .7rem !important;
}



/* COLUCA_HOME_FAVORITES_V103020
   Desktop behoudt populaire top-10.
   Mobiel/tablet ingelogd toont persoonlijke favorieten 4 per rij.
*/

.home-mobile-favorites-v103020 {
  display:none;
}

.home-desktop-popular-v103020 {
  display:block;
}

@media (max-width:1024px) {

  html.coluca-surface-mobile
  body:not(.admincenter-body)
  .section--home-user-mobile
  .home-desktop-popular-v103020 {
    display:none !important;
  }

  html.coluca-surface-mobile
  body:not(.admincenter-body)
  .section--home-user-mobile
  .home-mobile-favorites-v103020 {
    display:block !important;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__heading {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    margin:0 0 15px;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__heading h2 {
    margin:3px 0 0;
    font-size:clamp(1.45rem,6vw,2.2rem);
    line-height:1;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__manage {
    color:#9d72ff;
    text-decoration:none;
    font-size:.78rem;
    font-weight:850;
    white-space:nowrap;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__grid {
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:8px !important;
    width:100%;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020 {
    position:relative;
    min-width:0;
    width:100%;
    aspect-ratio:1 / 1;
    box-sizing:border-box;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    padding:8px;
    overflow:hidden;

    border:1px solid transparent;
    border-radius:16px;

    background:
      linear-gradient(
        180deg,
        rgba(10,16,34,.98),
        rgba(4,8,19,.995)
      ) padding-box,
      linear-gradient(
        135deg,
        rgba(163,79,255,.65),
        rgba(54,127,255,.46),
        rgba(32,213,235,.36)
      ) border-box;

    box-shadow:
      0 9px 22px rgba(0,0,0,.28),
      inset 0 1px 0 rgba(255,255,255,.04);
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__top {
    display:flex;
    align-items:flex-start;
    gap:6px;
    min-width:0;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__logo {
    display:block;
    flex:0 0 auto;

    width:clamp(28px,7vw,42px);
    height:clamp(28px,7vw,42px);

    overflow:hidden;
    border-radius:999px;

    border:1px solid rgba(255,255,255,.10);
    background:rgba(255,255,255,.05);

    box-shadow:
      0 0 0 1px rgba(163,79,255,.12),
      0 4px 12px rgba(0,0,0,.24);
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__logo img {
    display:block;
    width:100%;
    height:100%;
    border-radius:999px;
    object-fit:cover;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__copy {
    min-width:0;
    flex:1 1 auto;
    padding-top:1px;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__copy strong {
    display:-webkit-box;
    overflow:hidden;

    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;

    font-size:clamp(.62rem,2.35vw,.83rem);
    line-height:1.08;
    font-weight:900;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__copy strong a {
    color:#fff;
    text-decoration:none;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__copy small {
    display:block;
    overflow:hidden;
    margin-top:4px;

    color:rgba(216,224,246,.66);
    font-size:clamp(.51rem,1.8vw,.66rem);
    line-height:1.05;

    white-space:nowrap;
    text-overflow:ellipsis;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__bottom {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:4px;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__live {
    display:inline-flex;
    align-items:center;
    gap:4px;

    color:#8eff9c;
    font-size:clamp(.48rem,1.7vw,.62rem);
    font-weight:900;
    letter-spacing:.08em;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__live i {
    display:block;
    width:5px;
    height:5px;
    border-radius:999px;
    background:#ff4c63;
    box-shadow:0 0 7px rgba(255,76,99,.75);
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__play {
    display:inline-flex;
    align-items:center;
    justify-content:center;

    flex:0 0 auto;
    width:clamp(24px,6vw,34px);
    height:clamp(24px,6vw,34px);

    padding:0;
    border:1px solid rgba(124,118,255,.42);
    border-radius:999px;

    color:#fff;
    background:linear-gradient(145deg,#8b5cf6,#3b82f6);

    box-shadow:
      0 4px 14px rgba(59,130,246,.24),
      0 0 8px rgba(139,92,246,.16);
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__play svg {
    width:13px;
    height:13px;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__empty {
    display:grid;
    gap:7px;

    padding:16px;

    border:1px solid rgba(115,88,255,.34);
    border-radius:17px;

    background:rgba(7,13,29,.9);
    color:#dce5f8;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__empty strong {
    color:#fff;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__empty span {
    color:#aebbd4;
    font-size:.78rem;
  }

  html.coluca-surface-mobile
  .home-mobile-favorites-v103020__empty a {
    color:#9d72ff;
    text-decoration:none;
    font-weight:800;
    font-size:.78rem;
  }
}



/* COLUCA_HOME_FAVORITES_PLAY_BUTTON_V103021
   Compacte ronde playknop in mobiele 4-koloms favorietentegels.
*/
@media (max-width:1024px) {

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__bottom {
    min-height:32px !important;
    align-items:center !important;
  }

  html.coluca-surface-mobile
  button.home-mobile-favorite-v103020__play {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    flex:0 0 30px !important;

    width:30px !important;
    height:30px !important;

    min-width:30px !important;
    min-height:30px !important;

    max-width:30px !important;
    max-height:30px !important;

    aspect-ratio:1 / 1 !important;

    margin:0 !important;
    padding:0 !important;

    border:1px solid rgba(124,118,255,.52) !important;
    border-radius:999px !important;

    background:
      linear-gradient(
        145deg,
        #8f63ff 0%,
        #655cff 45%,
        #3b82f6 100%
      ) !important;

    color:#fff !important;

    line-height:1 !important;

    box-shadow:
      0 4px 12px rgba(0,0,0,.25),
      0 0 8px rgba(115,88,255,.24) !important;

    overflow:hidden !important;
  }

  html.coluca-surface-mobile
  button.home-mobile-favorite-v103020__play svg {
    display:block !important;
    width:13px !important;
    height:13px !important;
    min-width:13px !important;
    min-height:13px !important;
    margin:0 !important;
    padding:0 !important;
    stroke-width:2.2 !important;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020 {
    padding:8px !important;
  }

  html.coluca-surface-mobile
  .home-mobile-favorite-v103020__live {
    min-width:0;
  }
}

@media (max-width:390px) {
  html.coluca-surface-mobile
  button.home-mobile-favorite-v103020__play {
    flex-basis:28px !important;

    width:28px !important;
    height:28px !important;

    min-width:28px !important;
    min-height:28px !important;

    max-width:28px !important;
    max-height:28px !important;
  }
}

/* ===== COLUCA_UI_VISUAL_SYSTEM_V103030 START ===== */
/* Eén uniforme visuele laag voor de volledige gebruikersinterface.
   Doel: kleuren, typography, knoppen, panelen, forms en dialogen gelijk trekken.
   Scope: userside only; admincenter blijft buiten schot. */

:root{
  --coluca-font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --coluca-font-display: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --coluca-bg-0:#02050f;
  --coluca-bg-1:#050b18;
  --coluca-bg-2:#081226;
  --coluca-bg-3:#0c1831;
  --coluca-surface-1:#0a1326;
  --coluca-surface-2:#0d1933;
  --coluca-surface-3:#111f3d;

  --coluca-text:#f5f7ff;
  --coluca-text-soft:#dbe3ff;
  --coluca-text-muted:#9eb0d0;

  --coluca-accent-1:#a34fff;
  --coluca-accent-2:#7358ff;
  --coluca-accent-3:#367fff;
  --coluca-accent-4:#20d5eb;
  --coluca-success:#56e39b;
  --coluca-danger:#ff6a85;
  --coluca-warning:#f8ca57;

  --coluca-line-soft:rgba(117,102,255,.18);
  --coluca-line:rgba(117,102,255,.28);
  --coluca-line-strong:rgba(117,102,255,.46);

  --coluca-radius-xs:10px;
  --coluca-radius-sm:14px;
  --coluca-radius-md:18px;
  --coluca-radius-lg:24px;
  --coluca-radius-xl:30px;

  --coluca-shadow-soft:
    0 10px 26px rgba(0,0,0,.24),
    0 0 8px rgba(163,79,255,.10),
    0 0 16px rgba(32,213,235,.06);

  --coluca-shadow-card:
    0 16px 40px rgba(0,0,0,.34),
    0 0 10px rgba(163,79,255,.14),
    0 0 18px rgba(32,213,235,.08);

  --coluca-shadow-strong:
    0 20px 48px rgba(0,0,0,.42),
    0 0 12px rgba(163,79,255,.18),
    0 0 24px rgba(32,213,235,.12);

  --coluca-border-gradient:
    linear-gradient(
      110deg,
      #a34fff 0%,
      #7358ff 24%,
      #367fff 48%,
      #20d5eb 70%,
      #7358ff 88%,
      #a34fff 100%
    );

  --coluca-heading-1: clamp(2rem, 5vw, 3.45rem);
  --coluca-heading-2: clamp(1.55rem, 3.4vw, 2.45rem);
  --coluca-heading-3: clamp(1.2rem, 2.4vw, 1.65rem);
  --coluca-text-base: 16px;
  --coluca-text-small: 14px;
  --coluca-text-tiny: 12px;
}

html body:not(.admincenter-body){
  font-family:var(--coluca-font-ui) !important;
  font-size:var(--coluca-text-base);
  line-height:1.55;
  color:var(--coluca-text);
  background:
    radial-gradient(circle at top left, rgba(112,74,255,.14), transparent 24%),
    radial-gradient(circle at top right, rgba(32,213,235,.09), transparent 24%),
    linear-gradient(180deg, var(--coluca-bg-1) 0%, var(--coluca-bg-0) 100%) !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

html body:not(.admincenter-body) *,
html body:not(.admincenter-body) *::before,
html body:not(.admincenter-body) *::after{
  box-sizing:border-box;
}

html body:not(.admincenter-body) h1,
html body:not(.admincenter-body) h2,
html body:not(.admincenter-body) h3,
html body:not(.admincenter-body) h4,
html body:not(.admincenter-body) h5,
html body:not(.admincenter-body) h6,
html body:not(.admincenter-body) .section-title,
html body:not(.admincenter-body) .hero-title,
html body:not(.admincenter-body) .page-title{
  font-family:var(--coluca-font-display) !important;
  color:#fff !important;
  letter-spacing:-.03em !important;
  line-height:1.08 !important;
}

html body:not(.admincenter-body) h1,
html body:not(.admincenter-body) .hero-title,
html body:not(.admincenter-body) .page-title{
  font-size:var(--coluca-heading-1) !important;
  font-weight:900 !important;
}

html body:not(.admincenter-body) h2,
html body:not(.admincenter-body) .section-title{
  font-size:var(--coluca-heading-2) !important;
  font-weight:850 !important;
}

html body:not(.admincenter-body) h3,
html body:not(.admincenter-body) h4,
html body:not(.admincenter-body) h5,
html body:not(.admincenter-body) h6{
  font-size:var(--coluca-heading-3) !important;
  font-weight:800 !important;
}

html body:not(.admincenter-body) p,
html body:not(.admincenter-body) li,
html body:not(.admincenter-body) small,
html body:not(.admincenter-body) .muted,
html body:not(.admincenter-body) .text-muted{
  color:var(--coluca-text-muted);
}

html body:not(.admincenter-body) strong,
html body:not(.admincenter-body) b{
  color:var(--coluca-text-soft);
}

html body:not(.admincenter-body) a{
  color:#b7a8ff;
}

html body:not(.admincenter-body) a:hover{
  color:#d6ceff;
}

/* Uniforme panel/card visuele taal */
html body:not(.admincenter-body) .coluca-card,
html body:not(.admincenter-body) .coluca-panel,
html body:not(.admincenter-body) .account-card,
html body:not(.admincenter-body) .profile-card,
html body:not(.admincenter-body) .subscription-card,
html body:not(.admincenter-body) .settings-card,
html body:not(.admincenter-body) .support-card,
html body:not(.admincenter-body) .news-card,
html body:not(.admincenter-body) .podcast-card,
html body:not(.admincenter-body) .station-card,
html body:not(.admincenter-body) .feature-card,
html body:not(.admincenter-body) .home-mobile-favorite-v103020,
html body:not(.admincenter-body) .coluca-dialog-card,
html body:not(.admincenter-body) .device-playback-card,
html body:not(.admincenter-body) .player-shell[data-player-shell],
html body:not(.admincenter-body) [data-coluca-pwa-nav-v156],
html body:not(.admincenter-body) [data-coluca-pwa-nav-v158],
html body:not(.admincenter-body) .v158-pwa-nav{
  border:1px solid transparent !important;
  border-radius:var(--coluca-radius-lg) !important;
  background:
    linear-gradient(180deg, rgba(10,19,38,.98), rgba(6,11,23,.985)) padding-box,
    var(--coluca-border-gradient) border-box !important;
  box-shadow:var(--coluca-shadow-card) !important;
}

html body:not(.admincenter-body) .coluca-dialog,
html body:not(.admincenter-body) dialog.coluca-dialog{
  border:none !important;
  background:transparent !important;
}

/* Algemene buttons */
html body:not(.admincenter-body) .button,
html body:not(.admincenter-body) a.button,
html body:not(.admincenter-body) input[type="submit"],
html body:not(.admincenter-body) input[type="button"],
html body:not(.admincenter-body) button:not(.icon-button):not(.transport-button):not(.toast-close):not([data-player-close]){
  font-family:var(--coluca-font-ui) !important;
  font-weight:800 !important;
  font-size:15px !important;
  letter-spacing:.01em !important;
  min-height:46px !important;
  padding:0 18px !important;
  border-radius:16px !important;
  border:1px solid transparent !important;
  color:#fff !important;
  background:
    linear-gradient(180deg, rgba(14,21,42,.98), rgba(7,12,23,.99)) padding-box,
    var(--coluca-border-gradient) border-box !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,.24),
    0 0 8px rgba(163,79,255,.18),
    0 0 12px rgba(32,213,235,.10) !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease !important;
}

html body:not(.admincenter-body) .button:hover,
html body:not(.admincenter-body) a.button:hover,
html body:not(.admincenter-body) input[type="submit"]:hover,
html body:not(.admincenter-body) input[type="button"]:hover,
html body:not(.admincenter-body) button:not(.icon-button):not(.transport-button):not(.toast-close):not([data-player-close]):hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
  box-shadow:
    0 14px 30px rgba(0,0,0,.30),
    0 0 10px rgba(163,79,255,.24),
    0 0 16px rgba(32,213,235,.12) !important;
}

/* icon buttons / ronde controls */
html body:not(.admincenter-body) .icon-button,
html body:not(.admincenter-body) .transport-button,
html body:not(.admincenter-body) .toast-close{
  border-radius:999px !important;
  border:1px solid rgba(117,102,255,.26) !important;
  background:linear-gradient(180deg, rgba(13,22,42,.94), rgba(8,14,27,.96)) !important;
  box-shadow:var(--coluca-shadow-soft) !important;
  color:#fff !important;
}

/* form controls */
html body:not(.admincenter-body) input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html body:not(.admincenter-body) select,
html body:not(.admincenter-body) textarea{
  width:100%;
  min-height:46px;
  padding:12px 14px;
  border-radius:16px !important;
  border:1px solid rgba(117,102,255,.24) !important;
  background:linear-gradient(180deg, rgba(9,16,31,.98), rgba(6,11,22,.99)) !important;
  color:var(--coluca-text) !important;
  font-family:var(--coluca-font-ui) !important;
  font-size:15px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}

html body:not(.admincenter-body) input::placeholder,
html body:not(.admincenter-body) textarea::placeholder{
  color:#8192b3 !important;
}

html body:not(.admincenter-body) input:focus,
html body:not(.admincenter-body) select:focus,
html body:not(.admincenter-body) textarea:focus{
  outline:none !important;
  border-color:rgba(117,102,255,.56) !important;
  box-shadow:
    0 0 0 2px rgba(117,102,255,.18),
    0 0 12px rgba(32,213,235,.10) !important;
}

/* badges, pills, eybrows */
html body:not(.admincenter-body) .eyebrow,
html body:not(.admincenter-body) .section-kicker,
html body:not(.admincenter-body) .badge,
html body:not(.admincenter-body) .pill{
  color:#b98cff !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
}

/* tabellen / lijsten */
html body:not(.admincenter-body) table{
  color:var(--coluca-text-soft);
}

html body:not(.admincenter-body) th{
  color:#fff;
  font-weight:800;
}

html body:not(.admincenter-body) td{
  color:var(--coluca-text-muted);
}

/* tabs / simple nav blocks */
html body:not(.admincenter-body) .tab,
html body:not(.admincenter-body) .chip,
html body:not(.admincenter-body) .filter-chip{
  border-radius:999px !important;
  border:1px solid rgba(117,102,255,.22) !important;
  background:rgba(255,255,255,.035) !important;
  color:var(--coluca-text-soft) !important;
}

html body:not(.admincenter-body) .tab.is-active,
html body:not(.admincenter-body) .chip.is-active,
html body:not(.admincenter-body) .filter-chip.is-active{
  background:
    linear-gradient(180deg, rgba(14,21,42,.98), rgba(7,12,23,.99)) padding-box,
    var(--coluca-border-gradient) border-box !important;
  border:1px solid transparent !important;
  color:#fff !important;
}

/* toasts / notices / alerts */
html body:not(.admincenter-body) .toast,
html body:not(.admincenter-body) .notice,
html body:not(.admincenter-body) .alert,
html body:not(.admincenter-body) .flash{
  border-radius:18px !important;
  border:1px solid transparent !important;
  background:
    linear-gradient(180deg, rgba(10,19,38,.98), rgba(6,11,23,.985)) padding-box,
    linear-gradient(110deg, rgba(163,79,255,.34), rgba(32,213,235,.20)) border-box !important;
  box-shadow:var(--coluca-shadow-soft) !important;
  color:var(--coluca-text-soft) !important;
}

/* subtiele consistente container spacing voor userside */
html body:not(.admincenter-body) section,
html body:not(.admincenter-body) .section{
  scroll-margin-top:100px;
}

/* mobiel */
@media (max-width:1024px){
  html body:not(.admincenter-body){
    font-size:15px;
  }

  html body:not(.admincenter-body) h1,
  html body:not(.admincenter-body) .hero-title,
  html body:not(.admincenter-body) .page-title{
    font-size:clamp(1.9rem, 8vw, 3rem) !important;
  }

  html body:not(.admincenter-body) h2,
  html body:not(.admincenter-body) .section-title{
    font-size:clamp(1.45rem, 5vw, 2.15rem) !important;
  }

  html body:not(.admincenter-body) .coluca-card,
  html body:not(.admincenter-body) .coluca-panel,
  html body:not(.admincenter-body) .account-card,
  html body:not(.admincenter-body) .profile-card,
  html body:not(.admincenter-body) .subscription-card,
  html body:not(.admincenter-body) .settings-card,
  html body:not(.admincenter-body) .support-card,
  html body:not(.admincenter-body) .news-card,
  html body:not(.admincenter-body) .podcast-card,
  html body:not(.admincenter-body) .station-card,
  html body:not(.admincenter-body) .feature-card,
  html body:not(.admincenter-body) .home-mobile-favorite-v103020,
  html body:not(.admincenter-body) .coluca-dialog-card,
  html body:not(.admincenter-body) .device-playback-card{
    border-radius:20px !important;
  }

  html body:not(.admincenter-body) .button,
  html body:not(.admincenter-body) a.button,
  html body:not(.admincenter-body) input[type="submit"],
  html body:not(.admincenter-body) input[type="button"],
  html body:not(.admincenter-body) button:not(.icon-button):not(.transport-button):not(.toast-close):not([data-player-close]){
    min-height:44px !important;
    border-radius:14px !important;
  }
}
/* ===== COLUCA_UI_VISUAL_SYSTEM_V103030 END ===== */

/* ===== COLUCA_ACCOUNT_SECURITY_ENTRY_V103031 START ===== */

.account-security-entry-v103031{
    width:min(100%,980px);
    margin:18px auto;
    padding:0 18px;
}

.account-security-entry-v103031__card{
    position:relative;

    padding:20px;

    border:1px solid transparent;
    border-radius:var(--coluca-radius-md);

    background:
        linear-gradient(
            180deg,
            rgba(10,19,38,.98),
            rgba(6,11,23,.99)
        ) padding-box,
        var(--coluca-border-gradient) border-box;

    box-shadow:var(--coluca-shadow-soft);
}

.account-security-entry-v103031__eyebrow{
    display:block;

    margin-bottom:5px;

    color:#b98cff;

    font-size:11px;
    font-weight:850;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.account-security-entry-v103031__card > strong{
    display:block;

    color:#fff;

    font-size:1rem;
    font-weight:900;
}

.account-security-entry-v103031__card > span:not(.account-security-entry-v103031__eyebrow){
    display:block;

    margin-top:5px;

    color:var(--coluca-text-muted);

    font-size:.82rem;
    line-height:1.45;
}

.account-security-entry-v103031__action{
    margin-top:14px;
}

/* ===== COLUCA_ACCOUNT_SECURITY_ENTRY_V103031 END ===== */