/* MATRIXALIGNER_RADIO_POLISH_V3
 * Loaded after matrixaligner-radio.css and matrixaligner-radio-professional-v2.css.
 * Everything is scoped to html.ma-radio-v3 (added by the polish JS), and anything
 * that hides old containers is scoped to html.ma-radio-v3-ready (added only after
 * the controls were moved successfully). Remove this file's <link> to roll back.
 */

/*
 * MATRIXALIGNER_RADIO_LEGACY_WORKSPACE_EARLY_HIDE_V1
 *
 * Layout V2 remains alive as a runtime donor for canonical
 * audio/controls, but its duplicate workspace must never
 * become a visible startup page while the 9,583-item master
 * library initializes.
 */
html.ma-radio-v3 #matrix-radio-workspace-v2 {
  display: none !important;
}

.ma-radio-v3 {
  --ma-black: #050505;
  --ma-panel: #0a0a0a;
  --ma-raised: #141414;
  --ma-line: rgba(212, 175, 55, .26);
  --ma-line-strong: rgba(212, 175, 55, .55);
  --ma-gold: #d4af37;
  --ma-gold-hi: #f3d36a;
  --ma-green-deep: #0f7a3d;
  --ma-green: #16a34a;
  --ma-green-hi: #22c55e;
  --ma-red: #dc2626;
  --ma-red-deep: #b91c1c;
  --ma-text: #ffffff;
  --ma-text-2: #e5e7eb;
  --ma-text-3: #a3a3a3;
  --ma-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.ma-radio-v3 body {
  background: var(--ma-black);
  color: var(--ma-text);
  font-family: var(--ma-font);
}

/* ---------------- Top of page ---------------- */

/* The hero repeated what the radio itself says; the header nav still links to both panels. */
.ma-radio-v3 .matrix-hero {
  display: none !important;
}

.ma-radio-v3 #matrix-radio-identity {
  margin: 0 !important;
  padding: 0 !important;
  background: var(--ma-panel);
  border-bottom: 1px solid var(--ma-line);
}

.ma-radio-v3 .matrix-radio-identity-inner {
  width: min(1320px, calc(100% - 32px));
  margin: 0 auto;
  padding: 8px 0 !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  min-height: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.ma-radio-v3 .matrix-radio-avatar {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px;
  font-size: 14px !important;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--ma-raised);
  border: 1px solid var(--ma-gold);
  color: var(--ma-gold);
  font-weight: 800;
}

.ma-radio-v3 .matrix-radio-member-copy {
  display: flex !important;
  flex-direction: row !important;
  align-items: baseline;
  gap: 10px;
  flex: 1 1 auto;
  min-width: 0;
}

.ma-radio-v3 .matrix-radio-member-label {
  display: none !important;
}

.ma-radio-v3 .matrix-radio-display-name {
  font-size: 15px !important;
  font-weight: 700;
  color: var(--ma-text);
}

.ma-radio-v3 .matrix-radio-identity-state {
  font-size: 12px !important;
  color: var(--ma-text-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ma-radio-v3 .matrix-radio-member-actions {
  display: flex !important;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ma-radio-v3 .matrix-radio-passport {
  font-size: 12px !important;
  color: var(--ma-text-3);
  padding: 4px 10px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 999px;
}

.ma-radio-v3 .matrix-radio-profile-link,
.ma-radio-v3 .matrix-radio-signin-link {
  font-size: 13px !important;
  font-weight: 700;
  padding: 6px 12px !important;
  border-radius: 8px;
  text-decoration: none;
  border: 1px solid var(--ma-line-strong);
  color: var(--ma-text) !important;
  background: var(--ma-raised) !important;
}

.ma-radio-v3 .matrix-radio-signin-link {
  border-color: var(--ma-gold);
  color: var(--ma-gold-hi) !important;
}

/* Banner now sits below the radio as a slim strip. */
.ma-radio-v3 #matrix-radio-banner {
  width: min(1320px, calc(100% - 32px));
  margin: 8px auto 24px !important;
  padding: 0 !important;
}

.ma-radio-v3 .matrix-radio-banner-image {
  display: block;
  width: 100%;
  max-height: 150px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid var(--ma-line);
}

/* ---------------- Workspace grid ---------------- */

.ma-radio-v3 #matrix-professional-radio-v2 {
  width: min(1320px, calc(100% - 32px));
  margin: 16px auto 20px;
}

.ma-radio-v3 #matrix-professional-radio-v2 .matrix-radio-v2-grid {
  grid-template-columns: minmax(330px, 38%) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.ma-radio-v3 #now-playing,
.ma-radio-v3 #playlist {
  background: var(--ma-panel) !important;
  border: 1px solid var(--ma-line) !important;
  border-radius: 18px !important;
  padding: 14px !important;
  box-shadow: none !important;
  min-height: 0 !important;
}

.ma-radio-v3 #now-playing {
  top: 12px;
}

/* ---------------- Player (left) ---------------- */

.ma-radio-v3 #now-playing .section-heading {
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  margin: 0 0 4px !important;
  padding: 0 !important;
  min-height: 0 !important;
}

.ma-radio-v3 #now-playing .section-kicker {
  display: none !important;
}

/* Heading stays for screen readers (section is labelled by it). */
.ma-radio-v3 #now-playing-heading {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.ma-radio-v3 #player-status {
  font-size: 11px !important;
  font-weight: 700;
  color: var(--ma-green-hi) !important;
  background: rgba(34, 197, 94, .08) !important;
  border: 1px solid rgba(34, 197, 94, .35) !important;
  border-radius: 999px;
  padding: 3px 10px !important;
}

.ma-radio-v3 #now-playing .player-card {
  display: block !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  min-height: 0 !important;
}

.ma-radio-v3 #now-playing .player-runtime {
  display: block !important;
  padding: 0 !important;
  width: 100% !important;
}

.ma-radio-v3 .matrix-radio-v2-stage {
  gap: 10px;
  padding: 4px 0 6px;
}

/* Disc: gold border on the art, thin green ring outside, static spindle */
.ma-radio-v3 .ma-disc {
  box-sizing: border-box;
  position: relative;
  flex: 0 0 auto;
  width: 210px;
  height: 210px;
  padding: 5px;
  border-radius: 50%;
  border: 2px solid var(--ma-green);
  background: var(--ma-black);
  box-shadow: 0 0 22px rgba(212, 175, 55, .16);
}

.ma-radio-v3 .ma-disc[hidden] {
  display: none !important;
}

.ma-radio-v3 #matrix-radio-v2-spinner {
  box-sizing: border-box;
  display: block;
  width: 100% !important;
  height: 100% !important;
  border: 4px solid var(--ma-gold) !important;
  box-shadow: none !important;
  background:
    repeating-radial-gradient(circle, #0c0c0c 0 2px, #151515 2px 4px) !important;
}

.ma-radio-v3 .ma-disc-spindle {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
  border-radius: 50%;
  background: var(--ma-black);
  border: 2px solid var(--ma-gold-hi);
  pointer-events: none;
}

.ma-radio-v3 #matrix-radio-v2-video {
  border-radius: 12px;
  border: 1px solid var(--ma-line-strong);
}

.ma-radio-v3 .matrix-radio-v2-now {
  text-align: center;
}

.ma-radio-v3 .matrix-radio-v2-now-type {
  padding: 3px 9px;
  font-size: 11px;
  letter-spacing: .04em;
  font-weight: 700;
  color: var(--ma-gold);
  border-color: var(--ma-line-strong);
}

.ma-radio-v3 #matrix-radio-v2-now-title {
  margin-top: 6px;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ma-text);
}

/* Deck: timeline, transport, volume, share */
.ma-radio-v3 .ma-deck {
  display: grid;
  gap: 10px;
  margin-top: 6px;
}

.ma-radio-v3 .matrix-radio-timeline {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: var(--ma-text-3);
  font-variant-numeric: tabular-nums;
}

.ma-radio-v3 .matrix-radio-transport {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 14px;
}

.ma-radio-v3 #previous-track,
.ma-radio-v3 #next-track {
  width: 42px !important;
  height: 42px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 15px !important;
  background: var(--ma-raised) !important;
  color: var(--ma-text) !important;
  border: 1px solid var(--ma-line-strong) !important;
  box-shadow: none !important;
  cursor: pointer;
}

.ma-radio-v3 #play-pause {
  width: 54px !important;
  height: 54px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 18px !important;
  background: var(--ma-green) !important;
  color: #fff !important;
  border: 2px solid var(--ma-gold) !important;
  box-shadow: 0 0 14px rgba(34, 197, 94, .25) !important;
  cursor: pointer;
}

.ma-radio-v3 #play-pause:hover {
  background: var(--ma-green-hi) !important;
}

.ma-radio-v3 .ma-deck-lower {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
}

.ma-radio-v3 .matrix-radio-volume {
  display: flex !important;
  align-items: center;
  gap: 8px;
  flex: 1 1 150px;
  min-width: 0;
}

.ma-radio-v3 #mute-toggle {
  width: 32px !important;
  height: 32px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  background: var(--ma-raised) !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  font-size: 14px !important;
}

.ma-radio-v3 #volume-value {
  font-size: 12px;
  color: var(--ma-text-3);
  min-width: 36px;
  font-variant-numeric: tabular-nums;
}

.ma-radio-v3 .matrix-radio-volume .range-control {
  flex: 1 1 auto;
  min-width: 60px;
}

.ma-radio-v3 .range-control {
  accent-color: var(--ma-green-hi);
}

.ma-radio-v3 .matrix-radio-secondary-actions {
  display: flex !important;
  gap: 6px;
}

.ma-radio-v3 #play-all,
.ma-radio-v3 #share-album {
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 7px 11px !important;
  border-radius: 8px !important;
  background: var(--ma-raised) !important;
  color: var(--ma-text) !important;
  border: 1px solid var(--ma-line-strong) !important;
  box-shadow: none !important;
  width: auto !important;
  cursor: pointer;
}

.ma-radio-v3 #play-all {
  color: var(--ma-gold-hi) !important;
  border-color: var(--ma-gold) !important;
}

.ma-radio-v3 .ma-share-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, .07);
}

.ma-radio-v3 .ma-share-label {
  font-size: 12px;
  color: var(--ma-text-3);
  margin-right: 2px;
}

.ma-radio-v3 .ma-chip {
  appearance: none;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 11px;
  border-radius: 8px;
  background: var(--ma-raised);
  color: var(--ma-text);
  border: 1px solid var(--ma-line-strong);
  cursor: pointer;
}

.ma-radio-v3 .ma-chip:hover {
  border-color: var(--ma-gold);
  color: var(--ma-gold-hi);
}

.ma-radio-v3 .ma-notes {
  display: grid;
  gap: 2px;
}

.ma-radio-v3 #player-message,
.ma-radio-v3 #matrix-radio-v2-message {
  margin: 0 !important;
  min-height: 0;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--ma-text-3) !important;
  text-align: center;
}

.ma-radio-v3 #player-message:empty,
.ma-radio-v3 #matrix-radio-v2-message:empty {
  display: none;
}

.ma-radio-v3 #player-message.error {
  color: #fca5a5 !important;
}

/* ---------------- Library (right) ---------------- */

.ma-radio-v3 #playlist .section-heading {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 10px !important;
  padding: 0 !important;
  min-height: 0 !important;
}

.ma-radio-v3 #playlist .section-kicker,
.ma-radio-v3 #playlist .playlist-state {
  display: none !important;
}

.ma-radio-v3 #track-heading {
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  color: var(--ma-text) !important;
}

.ma-radio-v3 .ma-drawer-toggle {
  appearance: none;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  padding: 7px 12px;
  border-radius: 8px;
  background: var(--ma-raised);
  color: var(--ma-gold-hi);
  border: 1px solid var(--ma-gold);
  cursor: pointer;
}

.ma-radio-v3 .ma-drawer-toggle[aria-expanded="true"] {
  background: var(--ma-gold);
  color: var(--ma-black);
}

.ma-radio-v3 #playlist .playlist-frame {
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  min-height: 0 !important;
}

.ma-radio-v3 .matrix-radio-v2-filters {
  gap: 6px;
  margin: 0 0 8px;
}

.ma-radio-v3 .matrix-radio-v2-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 8px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  background: var(--ma-raised);
  color: var(--ma-text-2);
  border: 1px solid rgba(255, 255, 255, .12);
}

.ma-radio-v3 .matrix-radio-v2-filter.active {
  background: var(--ma-green-deep);
  color: #fff;
  border-color: var(--ma-gold);
}

.ma-radio-v3 .ma-count {
  font-size: 11px;
  font-weight: 700;
  color: var(--ma-text-3);
  font-variant-numeric: tabular-nums;
}

.ma-radio-v3 .matrix-radio-v2-filter.active .ma-count {
  color: var(--ma-gold-hi);
}

.ma-radio-v3 #matrix-radio-v2-search {
  margin: 0 0 6px;
  padding: 9px 12px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  background: var(--ma-black);
  border: 1px solid rgba(255, 255, 255, .14);
}

.ma-radio-v3 #matrix-radio-v2-search:focus {
  border-color: var(--ma-gold);
}

.ma-radio-v3 #matrix-radio-v2-count {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--ma-text-3);
}

.ma-radio-v3 #matrix-radio-v2-list {
  height: clamp(340px, calc(100vh - 290px), 600px);
  max-height: none;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .08);
  background: var(--ma-black);
  overscroll-behavior: contain;
}

.ma-radio-v3 .matrix-radio-v2-row {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 10px;
  padding: 7px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.ma-radio-v3 .matrix-radio-v2-row:hover {
  background: rgba(255, 255, 255, .03);
}

.ma-radio-v3 .matrix-radio-v2-row[data-active="true"] {
  box-shadow: inset 3px 0 0 var(--ma-green-hi);
}

.ma-radio-v3 .matrix-radio-v2-thumb {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  font-size: 16px;
  border-color: rgba(212, 175, 55, .3);
}

.ma-radio-v3 .matrix-radio-v2-title {
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
}

.ma-radio-v3 .matrix-radio-v2-kind {
  margin-top: 2px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .03em;
  color: var(--ma-text-3);
}

.ma-radio-v3 .matrix-radio-v2-row[data-active="true"] .matrix-radio-v2-kind {
  color: var(--ma-green-hi);
}

.ma-radio-v3 .matrix-radio-v2-actions {
  flex-wrap: nowrap;
  gap: 5px;
}

.ma-radio-v3 .matrix-radio-v2-actions button {
  font-size: 12px;
  font-weight: 700;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--ma-raised);
  color: var(--ma-text-2);
  border: 1px solid rgba(255, 255, 255, .14);
}

.ma-radio-v3 .matrix-radio-v2-actions [data-v2-play] {
  background: var(--ma-green);
  color: #fff;
  border-color: var(--ma-green);
}

.ma-radio-v3 .matrix-radio-v2-actions [data-v2-play]:hover {
  background: var(--ma-green-hi);
  color: #fff;
}

.ma-radio-v3 .matrix-radio-v2-actions [data-v2-share]:hover {
  background: var(--ma-raised);
  color: var(--ma-gold-hi);
  border-color: var(--ma-gold);
}

.ma-radio-v3 .matrix-radio-v2-actions .ma-add {
  min-width: 30px;
  padding: 6px 0;
  color: var(--ma-gold-hi);
  border-color: var(--ma-line-strong);
}

.ma-radio-v3 .matrix-radio-v2-actions .ma-add:hover:not(:disabled) {
  background: var(--ma-gold);
  color: var(--ma-black);
}

.ma-radio-v3 .matrix-radio-v2-actions .ma-add:disabled {
  color: var(--ma-green-hi);
  border-color: rgba(34, 197, 94, .4);
  cursor: default;
}

/* v2's original share bar stays in the DOM (its click handler lives here); proxies sit under the player */
.ma-radio-v3-ready #matrix-radio-v2-catalog .matrix-radio-v2-sharebar {
  display: none !important;
}

/* ---------------- My Playlists drawer ---------------- */

.ma-radio-v3 .ma-drawer {
  margin: 0 0 12px !important;
  padding: 12px !important;
  width: auto !important;
  max-width: none !important;
  background: var(--ma-raised) !important;
  border: 1px solid var(--ma-line-strong) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.ma-radio-v3 .ma-drawer.ma-drawer-closed {
  display: none !important;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-eyebrow,
.ma-radio-v3 .ma-drawer .matrix-playlist-heading p {
  display: none;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-heading h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-toolbar,
.ma-radio-v3 .ma-drawer .matrix-playlist-editor-row,
.ma-radio-v3 .ma-drawer .matrix-playlist-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-toolbar {
  justify-content: space-between;
  margin-bottom: 8px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-selector {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--ma-text-3);
}

.ma-radio-v3 .ma-drawer select,
.ma-radio-v3 .ma-drawer input[type="text"] {
  font: inherit;
  font-size: 13px;
  padding: 6px 9px;
  border-radius: 8px;
  background: var(--ma-black);
  color: var(--ma-text);
  border: 1px solid rgba(255, 255, 255, .16);
}

.ma-radio-v3 .ma-drawer .matrix-playlist-editor label {
  display: block;
  font-size: 12px;
  color: var(--ma-text-3);
  margin-bottom: 4px;
}

.ma-radio-v3 .ma-drawer button {
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 11px;
  border-radius: 8px;
  cursor: pointer;
  background: var(--ma-panel);
  color: var(--ma-text-2);
  border: 1px solid var(--ma-line-strong);
}

.ma-radio-v3 .ma-drawer .matrix-playlist-primary {
  background: var(--ma-green);
  color: #fff;
  border-color: var(--ma-green);
}

.ma-radio-v3 .ma-drawer .matrix-playlist-primary:hover {
  background: var(--ma-green-hi);
}

.ma-radio-v3 .ma-drawer .matrix-playlist-secondary {
  color: var(--ma-gold-hi);
  border-color: var(--ma-gold);
}

.ma-radio-v3 .ma-drawer .matrix-playlist-danger,
.ma-radio-v3 .ma-drawer [data-remove-track] {
  background: transparent;
  color: #fca5a5;
  border-color: var(--ma-red-deep);
}

.ma-radio-v3 .ma-drawer .matrix-playlist-danger:hover,
.ma-radio-v3 .ma-drawer [data-remove-track]:hover {
  background: var(--ma-red);
  color: #fff;
}

.ma-radio-v3 .ma-drawer button:disabled {
  opacity: .4;
  cursor: default;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  margin: 4px 0 6px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-summary span {
  display: none;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-summary b {
  color: var(--ma-text-3);
  font-weight: 600;
}

.ma-radio-v3 .ma-drawer .matrix-user-playlist-track-list {
  max-height: 260px;
  overflow: auto;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .08);
}

.ma-radio-v3 .ma-drawer .matrix-user-playlist-track {
  display: grid;
  grid-template-columns: 22px 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.ma-radio-v3 .ma-drawer .matrix-user-playlist-track img {
  width: 36px;
  height: 36px;
  border-radius: 6px;
  object-fit: cover;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-position {
  font-size: 12px;
  color: var(--ma-text-3);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-track-copy {
  min-width: 0;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-track-copy strong {
  display: block;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-track-copy span {
  display: none;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-track-actions {
  display: flex;
  gap: 4px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-track-actions button {
  padding: 5px 8px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-empty {
  font-size: 13px;
  color: var(--ma-text-3);
  padding: 8px 2px;
}

.ma-radio-v3 .ma-drawer .matrix-playlist-empty p {
  margin: 2px 0 0;
}

.ma-radio-v3 .ma-drawer .matrix-radio-playlist-status {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--ma-text-3);
}

.ma-radio-v3 .ma-drawer .matrix-radio-playlist-status[data-state="error"] {
  color: #fca5a5;
}

/* ---------------- Retire duplicate presentation (runtimes untouched) ---------------- */

/* Old artwork block + old title block: the v2 stage replaces both. IDs stay in the DOM. */
.ma-radio-v3-ready #now-playing .artwork-stage,
.ma-radio-v3-ready #now-playing .now-playing,
.ma-radio-v3-ready #now-playing .player-runtime > .timeline,
.ma-radio-v3-ready #now-playing .player-runtime > .volume-row,
.ma-radio-v3-ready #now-playing .player-runtime > .transport-controls {
  display: none !important;
}

/* The second player at the bottom (layout-v2 workspace). Its controls were moved
 * into the left panel; the <audio> element and hidden #track-list stay in here
 * and keep working while hidden. */
.ma-radio-v3-ready #matrix-radio-workspace-v2 {
  display: none !important;
}

.ma-radio-v3.ma-video-mode .matrix-radio-timeline,
.ma-radio-v3.ma-video-mode .matrix-radio-volume {
  display: none !important;
}

/* ---------------- Focus + motion ---------------- */

.ma-radio-v3 button:focus-visible,
.ma-radio-v3 a:focus-visible,
.ma-radio-v3 input:focus-visible,
.ma-radio-v3 select:focus-visible {
  outline: 2px solid var(--ma-gold-hi);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .ma-radio-v3 #matrix-radio-v2-spinner.matrix-spinning {
    animation-duration: 20s;
  }
}

/* ---------------- Mobile ---------------- */

@media (max-width: 900px) {
  .ma-radio-v3 #matrix-professional-radio-v2 {
    width: calc(100% - 20px);
    margin-top: 10px;
  }

  .ma-radio-v3 #matrix-professional-radio-v2 .matrix-radio-v2-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .ma-radio-v3 #matrix-radio-v2-list {
    height: auto;
    max-height: 62vh;
  }

  .ma-radio-v3 .matrix-radio-identity-inner {
    width: calc(100% - 20px);
  }

  .ma-radio-v3 .matrix-radio-identity-state {
    display: none;
  }

  .ma-radio-v3 #matrix-radio-banner {
    width: calc(100% - 20px);
  }
}

@media (max-width: 520px) {
  .ma-radio-v3 .ma-disc {
    width: 172px;
    height: 172px;
  }

  .ma-radio-v3 #now-playing,
  .ma-radio-v3 #playlist {
    padding: 12px !important;
    border-radius: 14px !important;
  }

  .ma-radio-v3 .matrix-radio-v2-row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
  }

  .ma-radio-v3 .matrix-radio-v2-thumb {
    width: 40px;
    height: 40px;
  }

  .ma-radio-v3 .matrix-radio-v2-title {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 13px;
  }

  .ma-radio-v3 .matrix-radio-v2-actions button {
    padding: 6px 8px;
  }

  .ma-radio-v3 .matrix-radio-member-copy {
    flex: 1 1 0;
  }

  .ma-radio-v3 .matrix-radio-member-actions {
    flex: 1 1 100%;
    flex-wrap: nowrap;
  }

  .ma-radio-v3 .matrix-radio-passport {
    min-width: 0;
    flex: 0 1 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px !important;
  }

  .ma-radio-v3 .matrix-radio-v2-actions {
    grid-column: auto;
    padding-left: 0;
  }

  .ma-radio-v3 .ma-deck-lower {
    justify-content: center;
  }

  .ma-radio-v3 .ma-drawer .matrix-user-playlist-track {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .ma-radio-v3 .ma-drawer .matrix-playlist-position {
    display: none;
  }

  .ma-radio-v3 .ma-drawer .matrix-playlist-track-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
}

/* ==========================================================
   MATRIXALIGNER_RADIO_BANNER_CARD_POLISH_20260928
   UI POLISH ONLY
   ========================================================== */

.ma-radio-v3 #matrix-radio-banner {
  min-height: 0 !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  overflow: visible !important;
}

.ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-inner {
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 220px !important;
  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center center !important;
}

/* Reduce visual bulk of the existing player card only. */
.ma-radio-v3 .player-card {
  min-height: 0 !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/* Keep the cover region compact without changing runtime layout. */
.ma-radio-v3 .matrix-radio-cover-shell {
  min-height: 0 !important;
}

@media (max-width: 900px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 175px !important;
  }

  .ma-radio-v3 .player-card {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
}

@media (max-width: 600px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 145px !important;
  }
}

/* ==========================================================
   END MATRIXALIGNER_RADIO_BANNER_CARD_POLISH_20260928
   ========================================================== */

/* ==========================================================
   MATRIXALIGNER RADIO — TOP BANNER FULL IMAGE CORRECTION
   ========================================================== */

.ma-radio-v3 #matrix-radio-banner {
  min-height: 0 !important;
  height: auto !important;
  padding: 4px 0 !important;
  overflow: hidden !important;
}

.ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-inner {
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 150px !important;

  object-fit: contain !important;
  object-position: center center !important;
}

/* Desktop wide screens */
@media (min-width: 1200px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 135px !important;
  }
}

/* Tablet */
@media (max-width: 900px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 120px !important;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 95px !important;
  }
}

/* ==========================================================
   END TOP BANNER FULL IMAGE CORRECTION
   ========================================================== */

/* ==========================================================
   MATRIXALIGNER RADIO FINAL PREMIUM POLISH
   PRESENTATION ONLY — NO AUTH OR PLAYBACK AUTHORITY
   ========================================================== */

/* ----------------------------------------------------------
   IDENTITY

   Existing matrixaligner-radio-identity.js owns authentication.
   We consume only its proven document state.
   ---------------------------------------------------------- */

/* Authenticated users must never be presented as guests. */
html[data-matrixaligner-authenticated="true"]
  .ma-radio-v3
  .matrix-radio-identity-state {
  display: none !important;
}

/* Give the proven authenticated identity a connected finish. */
html[data-matrixaligner-authenticated="true"]
  .ma-radio-v3
  .matrix-radio-identity-inner {
  border-color: rgba(212,175,55,.42);
  background: #0b0d0c;
  box-shadow:
    0 10px 28px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.035);
}

html[data-matrixaligner-authenticated="true"]
  .ma-radio-v3
  .matrix-radio-identity-avatar {
  border-color: rgba(46,204,113,.60);
  box-shadow:
    0 0 0 2px rgba(46,204,113,.08),
    0 0 16px rgba(46,204,113,.12);
}

/*
   V3 previously hides identity-state for everybody on mobile.
   Guests must retain their guest/sign-in presentation.
*/
@media (max-width:900px) {
  html[data-matrixaligner-authenticated="false"]
    .ma-radio-v3
    .matrix-radio-identity-state {
    display: block;
  }

  html[data-matrixaligner-authenticated="true"]
    .ma-radio-v3
    .matrix-radio-identity-state {
    display: none !important;
  }
}


/* ----------------------------------------------------------
   PREMIUM PLAYER CARD
   Existing player architecture remains intact.
   ---------------------------------------------------------- */

.ma-radio-v3 #matrix-professional-radio-v2 {
  border: 1px solid rgba(212,175,55,.34);
  border-radius: 20px;
  background: #090b0a;
  box-shadow:
    0 18px 46px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.035);
}


/* ----------------------------------------------------------
   SPINNER
   Keep existing dimensions and rotation logic.
   ---------------------------------------------------------- */

.ma-radio-v3 #matrix-radio-v2-spinner {
  border-color: rgba(212,175,55,.86);
  box-shadow:
    0 0 0 1px rgba(212,175,55,.12),
    0 10px 28px rgba(0,0,0,.42),
    inset 0 0 20px rgba(0,0,0,.42);
}

.ma-radio-v3 #matrix-radio-v2-spinner.matrix-spinning {
  border-color: rgba(222,187,67,.96);
  box-shadow:
    0 0 0 1px rgba(212,175,55,.14),
    0 0 22px rgba(46,204,113,.16),
    0 12px 30px rgba(0,0,0,.46),
    inset 0 0 22px rgba(0,0,0,.46);
}


/* ----------------------------------------------------------
   NOW PLAYING
   ---------------------------------------------------------- */

.ma-radio-v3 .matrix-radio-v2-now-label,
.ma-radio-v3 .ma-now-label {
  color: rgba(222,187,67,.88);
  font-size: .70rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.ma-radio-v3 .matrix-radio-v2-title,
.ma-radio-v3 .ma-track-title {
  color: #f7f7f4;
  font-weight: 750;
  line-height: 1.16;
}

.ma-radio-v3 .matrix-radio-v2-meta,
.ma-radio-v3 .ma-track-meta {
  color: rgba(224,220,204,.64);
}


/* ----------------------------------------------------------
   TRANSPORT CONTROLS
   ---------------------------------------------------------- */

.ma-radio-v3 #previous,
.ma-radio-v3 #next {
  border-color: rgba(212,175,55,.48);
  background: #101210;
  color: #e4ca70;
  box-shadow: none;
}

.ma-radio-v3 #previous:hover,
.ma-radio-v3 #next:hover {
  border-color: rgba(232,198,82,.90);
  background: rgba(212,175,55,.08);
  color: #f1d779;
}

.ma-radio-v3 #play-pause {
  border-color: rgba(72,220,132,.72);
  background: #178b4b;
  color: #fff;
  box-shadow:
    0 8px 20px rgba(23,139,75,.22),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.ma-radio-v3 #play-pause:hover {
  background: #1aa357;
  border-color: rgba(91,232,151,.92);
}


/* ----------------------------------------------------------
   SHARE — COMPACT ROW
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-share-row {
  gap: 7px;
  align-items: center;
}

.ma-radio-v3 .ma-share-row button,
.ma-radio-v3 .ma-share-row a {
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(212,175,55,.30);
  border-radius: 9px;
  background: #0e100f;
  color: rgba(245,239,215,.88);
  box-shadow: none;
}

.ma-radio-v3 .ma-share-row button:hover,
.ma-radio-v3 .ma-share-row a:hover {
  border-color: rgba(212,175,55,.72);
  background: rgba(212,175,55,.075);
  color: #efd576;
}


/* ----------------------------------------------------------
   STATUS
   ---------------------------------------------------------- */

.ma-radio-v3 #player-message {
  margin-top: 8px;
  color: rgba(224,220,204,.68);
  font-size: .82rem;
}

.ma-radio-v3 #player-message.error {
  color: #ef6b62;
}

/* END MATRIXALIGNER RADIO FINAL PREMIUM POLISH */

/* ==========================================================
   MATRIXALIGNER RADIO SCREENSHOT CLEANUP
   Reduce visual noise — preserve all runtime behavior
   ========================================================== */


/* ----------------------------------------------------------
   PLAYER FRAME
   One premium frame instead of boxes inside boxes.
   ---------------------------------------------------------- */

.ma-radio-v3 #now-playing {
  padding: 18px 18px 16px !important;
  border: 1px solid rgba(212,175,55,.38) !important;
  border-radius: 18px !important;
  background: #0b0d0c !important;
  box-shadow:
    0 16px 38px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.025) !important;
}


/* ----------------------------------------------------------
   ARTWORK / DISC
   Keep the strong part of the current design.
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-disc {
  margin-bottom: 8px;
}

.ma-radio-v3 #matrix-radio-v2-spinner {
  box-shadow:
    0 0 0 1px rgba(212,175,55,.14),
    0 0 18px rgba(46,204,113,.10),
    0 10px 24px rgba(0,0,0,.38) !important;
}


/* ----------------------------------------------------------
   TRACK INFORMATION
   Compact vertical hierarchy.
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-media-type,
.ma-radio-v3 .matrix-radio-v2-type {
  margin-top: 4px;
  margin-bottom: 5px;
}

.ma-radio-v3 .ma-track-title,
.ma-radio-v3 .matrix-radio-v2-title {
  margin: 0 0 12px !important;
  font-size: 1.05rem !important;
  line-height: 1.2 !important;
}


/* ----------------------------------------------------------
   TIMELINE
   Give it room without another visual box.
   ---------------------------------------------------------- */

.ma-radio-v3 .matrix-radio-timeline {
  margin: 8px 0 13px !important;
}


/* ----------------------------------------------------------
   TRANSPORT
   One obvious primary action.
   ---------------------------------------------------------- */

.ma-radio-v3 .matrix-radio-transport {
  gap: 12px !important;
  margin: 0 0 14px !important;
}

.ma-radio-v3 #previous,
.ma-radio-v3 #next {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  padding: 0 !important;
  border: 1px solid rgba(212,175,55,.38) !important;
  border-radius: 50% !important;
  background: #151816 !important;
  color: rgba(239,213,118,.86) !important;
  box-shadow: none !important;
}

.ma-radio-v3 #play-pause {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid rgba(88,235,149,.78) !important;
  background: #15944d !important;
  color: #fff !important;
  box-shadow:
    0 0 0 3px rgba(46,204,113,.07),
    0 8px 20px rgba(21,148,77,.20) !important;
}


/* ----------------------------------------------------------
   UTILITY ROW
   Volume + Play All + Share Station
   Secondary controls — stop competing with Play.
   ---------------------------------------------------------- */

.ma-radio-v3 .matrix-radio-volume {
  margin: 0 !important;
}

.ma-radio-v3 #play-all,
.ma-radio-v3 #share-album {
  min-height: 36px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(212,175,55,.30) !important;
  border-radius: 8px !important;
  background: #111311 !important;
  color: rgba(239,229,190,.84) !important;
  box-shadow: none !important;
  font-size: 12px !important;
}

.ma-radio-v3 #play-all:hover,
.ma-radio-v3 #share-album:hover {
  border-color: rgba(212,175,55,.65) !important;
  background: rgba(212,175,55,.06) !important;
  color: #efd576 !important;
}


/* ----------------------------------------------------------
   SHARE
   Quiet final row.
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-share-row {
  margin-top: 11px !important;
  padding-top: 10px !important;
  gap: 6px !important;
  border-top: 1px solid rgba(255,255,255,.055) !important;
}

.ma-radio-v3 .ma-share-label {
  margin-right: 3px !important;
  color: rgba(255,255,255,.50) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

.ma-radio-v3 .ma-share-row button,
.ma-radio-v3 .ma-share-row a,
.ma-radio-v3 .ma-chip {
  min-height: 30px !important;
  padding: 5px 9px !important;
  border: 1px solid rgba(212,175,55,.22) !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: rgba(242,236,211,.76) !important;
  box-shadow: none !important;
  font-size: 11px !important;
}

.ma-radio-v3 .ma-share-row button:hover,
.ma-radio-v3 .ma-share-row a:hover,
.ma-radio-v3 .ma-chip:hover {
  border-color: rgba(212,175,55,.55) !important;
  color: #efd576 !important;
  background: rgba(212,175,55,.045) !important;
}


/* ----------------------------------------------------------
   STATUS MESSAGE
   Stop it becoming another visual section.
   ---------------------------------------------------------- */

.ma-radio-v3 #player-message {
  margin: 7px 0 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255,255,255,.45) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  text-align: center !important;
}


/* ----------------------------------------------------------
   LIBRARY
   Reduce outline competition with player.
   ---------------------------------------------------------- */

.ma-radio-v3 #playlist {
  border-color: rgba(212,175,55,.28) !important;
  background: #0a0c0b !important;
  box-shadow: none !important;
}

.ma-radio-v3 .matrix-radio-v2-row {
  border-color: rgba(255,255,255,.075) !important;
}

.ma-radio-v3 .matrix-radio-v2-row:hover {
  border-color: rgba(212,175,55,.26) !important;
  background: rgba(255,255,255,.025) !important;
}


/* ----------------------------------------------------------
   AUTHENTICATED PRESENTATION
   Consume only proven MatrixAligner root state.
   ---------------------------------------------------------- */

html[data-matrixaligner-authenticated="true"]
  .matrix-radio-identity-copy {
  display: none !important;
}

html[data-matrixaligner-authenticated="true"]
  .matrix-radio-identity-state {
  display: none !important;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 520px) {

  .ma-radio-v3 #now-playing {
    padding: 14px !important;
  }

  .ma-radio-v3 .ma-disc {
    width: 160px !important;
    height: 160px !important;
  }

  .ma-radio-v3 #previous,
  .ma-radio-v3 #next {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
  }

  .ma-radio-v3 #play-pause {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
  }

  .ma-radio-v3 .ma-share-row {
    justify-content: center !important;
  }
}

/* END MATRIXALIGNER RADIO SCREENSHOT CLEANUP */

/* ==========================================================
   TOP_BANNER_IMAGE_ONLY_20260928
   IMAGE ONLY — WRAPPER UNTOUCHED
   ========================================================== */

.matrixaligner-radio-page-banner > img {
  display: block !important;

  width: 100% !important;
  height: auto !important;

  max-width: 100% !important;
  max-height: 180px !important;

  margin: 0 auto !important;
  padding: 0 !important;

  object-fit: contain !important;
  object-position: center center !important;

  border: 0 !important;
  box-shadow: none !important;
}

/* Tablet */
@media (max-width: 900px) {
  .matrixaligner-radio-page-banner > img {
    max-height: 145px !important;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .matrixaligner-radio-page-banner > img {
    max-height: 115px !important;
  }
}

/* ==========================================================
   END TOP_BANNER_IMAGE_ONLY_20260928
   ========================================================== */

/* ==========================================================
   TOP_BANNER_900_TEST_20260928
   IMAGE ONLY — NO WRAPPER / CARD STYLING
   ========================================================== */

.matrixaligner-radio-page-banner > img {
  display: block !important;
  width: 100% !important;
  height: auto !important;

  max-width: 100% !important;
  max-height: 900px !important;

  margin: 0 auto !important;
  padding: 0 !important;

  object-fit: contain !important;
  object-position: center center !important;

  border: 0 !important;
  box-shadow: none !important;
}

/* END TOP_BANNER_900_TEST_20260928 */

/* ==========================================================
   BOTTOM_BANNER_3X_20260928
   LOWER BANNER IMAGE ONLY
   ========================================================== */

.ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
  display: block !important;

  width: auto !important;
  height: auto !important;

  max-width: 100% !important;
  max-height: 405px !important;

  margin: 0 auto !important;
  padding: 0 !important;

  object-fit: contain !important;
  object-position: center center !important;
}

/* Tablet */
@media (max-width: 900px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 360px !important;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    max-height: 285px !important;
  }
}

/* ==========================================================
   END BOTTOM_BANNER_3X_20260928
   ========================================================== */

/* ==========================================================
   MATRIXALIGNER RADIO PLAYER FACELIFT V4
   New visual face — existing playback controls preserved
   ========================================================== */


/* ----------------------------------------------------------
   PLAYER — ONE CLEAN PREMIUM CONSOLE
   ---------------------------------------------------------- */

.ma-radio-v3 #now-playing {
  position: relative !important;
  overflow: hidden !important;
  padding: 22px 22px 18px !important;

  border: 1px solid rgba(211,178,73,.30) !important;
  border-radius: 24px !important;

  background:
    radial-gradient(
      circle at 50% 15%,
      rgba(45,75,55,.16),
      transparent 35%
    ),
    #080a09 !important;

  box-shadow:
    0 26px 60px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}


/* thin luxury top edge */

.ma-radio-v3 #now-playing::before {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  top: 0;
  height: 1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(224,190,76,.85),
      transparent
    );

  pointer-events: none;
}


/* ----------------------------------------------------------
   STAGE
   ---------------------------------------------------------- */

.ma-radio-v3 #matrix-radio-v2-stage {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 6px 0 2px !important;
  min-height: 0 !important;
}


/* ----------------------------------------------------------
   DISC / ARTWORK — HERO
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-disc {
  position: relative !important;

  width: 214px !important;
  height: 214px !important;

  margin: 4px auto 15px !important;
  padding: 7px !important;

  border: 1px solid rgba(223,188,70,.65) !important;
  border-radius: 50% !important;

  background: #060706 !important;

  box-shadow:
    0 0 0 5px rgba(212,175,55,.035),
    0 18px 40px rgba(0,0,0,.50) !important;
}


/* secondary green ring */

.ma-radio-v3 .ma-disc::before {
  content: "";
  position: absolute;
  inset: 4px;

  border: 1px solid rgba(48,194,104,.28);
  border-radius: 50%;

  pointer-events: none;
}


.ma-radio-v3 #matrix-radio-v2-spinner {
  width: 100% !important;
  height: 100% !important;

  display: block;
  object-fit: cover !important;

  border: 0 !important;
  border-radius: 50% !important;

  background: #090a09 !important;

  box-shadow:
    inset 0 0 24px rgba(0,0,0,.42) !important;
}


/* playing illumination */

.ma-radio-v3
#matrix-radio-v2-spinner.matrix-spinning {
  box-shadow:
    0 0 24px rgba(41,199,103,.20),
    inset 0 0 22px rgba(0,0,0,.38) !important;
}


/* center spindle */

.ma-radio-v3 .ma-disc-spindle {
  width: 22px !important;
  height: 22px !important;

  border: 4px solid #070807 !important;
  border-radius: 50% !important;

  background: #d6b64b !important;

  box-shadow:
    0 0 0 2px rgba(255,255,255,.10),
    0 2px 8px rgba(0,0,0,.55) !important;
}


/* ----------------------------------------------------------
   MEDIA TYPE — SMALL STATUS, NOT A BIG BUTTON
   ---------------------------------------------------------- */

.ma-radio-v3 #matrix-radio-v2-now-type {
  display: inline-flex !important;
  align-items: center !important;

  width: auto !important;
  min-height: 0 !important;

  margin: 0 auto 7px !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;

  color: #43ce7d !important;

  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .17em !important;
  text-transform: uppercase !important;
}


/* status dot */

.ma-radio-v3 #matrix-radio-v2-now-type::before {
  content: "";

  width: 6px;
  height: 6px;

  margin-right: 7px;

  border-radius: 50%;
  background: #38c978;

  box-shadow:
    0 0 8px rgba(56,201,120,.55);
}


/* ----------------------------------------------------------
   TITLE — CENTERED HERO COPY
   ---------------------------------------------------------- */

.ma-radio-v3 #matrix-radio-v2-now-title {
  max-width: 92% !important;

  margin: 0 auto 17px !important;

  color: #f5f3eb !important;

  font-size: 17px !important;
  font-weight: 720 !important;
  line-height: 1.25 !important;
  letter-spacing: -.01em !important;

  text-align: center !important;
}


/* ----------------------------------------------------------
   DECK — REMOVE OLD PANEL FEEL
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-deck {
  width: 100% !important;

  margin-top: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}


/* ----------------------------------------------------------
   TIMELINE — THIN + CLEAN
   ---------------------------------------------------------- */

.ma-radio-v3 .matrix-radio-timeline {
  width: 100% !important;

  margin: 0 0 17px !important;
  padding: 0 3px !important;

  border: 0 !important;
  background: transparent !important;
}


.ma-radio-v3 .matrix-radio-timeline input[type="range"] {
  height: 4px !important;
  accent-color: #d6b64b !important;
}


/* ----------------------------------------------------------
   TRANSPORT — NEW CONTROL CONSOLE
   ---------------------------------------------------------- */

.ma-radio-v3 .matrix-radio-transport {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 18px !important;

  width: fit-content !important;

  margin: 0 auto 18px !important;
  padding: 8px 14px !important;

  border: 1px solid rgba(255,255,255,.065) !important;
  border-radius: 999px !important;

  background: rgba(255,255,255,.025) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025) !important;
}


.ma-radio-v3 #previous,
.ma-radio-v3 #next {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;

  padding: 0 !important;

  border: 0 !important;
  border-radius: 50% !important;

  background: transparent !important;
  color: #cdb65e !important;

  box-shadow: none !important;

  font-size: 16px !important;

  transition:
    background .18s ease,
    color .18s ease,
    transform .18s ease !important;
}


.ma-radio-v3 #previous:hover,
.ma-radio-v3 #next:hover {
  background: rgba(212,175,55,.10) !important;
  color: #f0d875 !important;

  transform: scale(1.06);
}


/* HERO PLAY BUTTON */

.ma-radio-v3 #play-pause {
  width: 62px !important;
  height: 62px !important;
  min-width: 62px !important;

  padding: 0 !important;

  border: 1px solid rgba(94,238,154,.80) !important;
  border-radius: 50% !important;

  background:
    linear-gradient(
      180deg,
      #24aa63,
      #128244
    ) !important;

  color: #fff !important;

  box-shadow:
    0 0 0 5px rgba(38,194,102,.07),
    0 9px 24px rgba(17,137,72,.28),
    inset 0 1px 0 rgba(255,255,255,.18) !important;

  font-size: 20px !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease !important;
}


.ma-radio-v3 #play-pause:hover {
  transform: scale(1.045);

  box-shadow:
    0 0 0 6px rgba(38,194,102,.09),
    0 11px 28px rgba(17,137,72,.34),
    inset 0 1px 0 rgba(255,255,255,.20) !important;
}


/* ----------------------------------------------------------
   LOWER UTILITY DOCK
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-deck-lower {
  display: grid !important;

  grid-template-columns:
    minmax(120px, 1fr)
    auto !important;

  align-items: center !important;

  gap: 12px !important;

  width: 100% !important;

  margin: 0 !important;
  padding: 11px 12px !important;

  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 12px !important;

  background: rgba(255,255,255,.018) !important;
}


/* volume becomes quiet */

.ma-radio-v3 .matrix-radio-volume {
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
}


.ma-radio-v3 .matrix-radio-volume input[type="range"] {
  accent-color: #d6b64b !important;
}


/* secondary actions live together */

.ma-radio-v3
.matrix-radio-secondary-actions {
  display: flex !important;
  align-items: center !important;

  gap: 6px !important;

  margin: 0 !important;
}


.ma-radio-v3 #play-all,
.ma-radio-v3 #share-album {
  min-height: 32px !important;

  padding: 5px 9px !important;

  border: 0 !important;
  border-radius: 7px !important;

  background: rgba(255,255,255,.035) !important;
  color: rgba(236,225,184,.74) !important;

  box-shadow: none !important;

  font-size: 11px !important;
  font-weight: 650 !important;
}


.ma-radio-v3 #play-all:hover,
.ma-radio-v3 #share-album:hover {
  background: rgba(212,175,55,.09) !important;
  color: #ead172 !important;
}


/* ----------------------------------------------------------
   SHARE STRIP
   TEXT-LIKE CONTROLS, NOT ANOTHER BUTTON PANEL
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-share-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 4px !important;

  margin: 9px 0 0 !important;
  padding: 7px 0 0 !important;

  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.045) !important;

  background: transparent !important;
}


.ma-radio-v3 .ma-share-label {
  margin-right: 4px !important;

  color: rgba(255,255,255,.32) !important;

  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}


.ma-radio-v3 .ma-chip,
.ma-radio-v3 .ma-share-row button,
.ma-radio-v3 .ma-share-row a {
  min-height: 26px !important;

  padding: 3px 7px !important;

  border: 0 !important;
  border-radius: 6px !important;

  background: transparent !important;
  color: rgba(222,203,132,.62) !important;

  box-shadow: none !important;

  font-size: 10px !important;
}


.ma-radio-v3 .ma-chip:hover,
.ma-radio-v3 .ma-share-row button:hover,
.ma-radio-v3 .ma-share-row a:hover {
  background: rgba(212,175,55,.055) !important;
  color: #efd778 !important;
}


/* ----------------------------------------------------------
   NOTES / STATUS
   ---------------------------------------------------------- */

.ma-radio-v3 .ma-notes {
  margin: 5px 0 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
}


.ma-radio-v3 #player-message,
.ma-radio-v3 #matrix-radio-v2-message {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;

  color: rgba(255,255,255,.34) !important;

  font-size: 10px !important;
  line-height: 1.3 !important;

  text-align: center !important;
}


/* ----------------------------------------------------------
   PLAYING STATE
   Existing .matrix-spinning class is runtime truth.
   ---------------------------------------------------------- */

.ma-radio-v3
#now-playing:has(#matrix-radio-v2-spinner.matrix-spinning) {
  border-color: rgba(59,199,112,.30) !important;

  box-shadow:
    0 26px 60px rgba(0,0,0,.42),
    0 0 32px rgba(38,176,92,.055),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}


/* ----------------------------------------------------------
   VIDEO MODE
   Same card — artwork disappears, video owns stage.
   ---------------------------------------------------------- */

.ma-radio-v3.ma-video-mode .ma-disc {
  display: none !important;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width:520px) {

  .ma-radio-v3 #now-playing {
    padding: 17px 14px 14px !important;
    border-radius: 18px !important;
  }

  .ma-radio-v3 .ma-disc {
    width: 174px !important;
    height: 174px !important;
  }

  .ma-radio-v3 .matrix-radio-transport {
    gap: 13px !important;
  }

  .ma-radio-v3 #play-pause {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
  }

  .ma-radio-v3 .ma-deck-lower {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .ma-radio-v3
  .matrix-radio-secondary-actions {
    justify-content: center !important;
  }

  .ma-radio-v3 .ma-share-row {
    flex-wrap: wrap !important;
  }
}

/* END MATRIXALIGNER RADIO PLAYER FACELIFT V4 */

/* ==========================================================
   MATRIXALIGNER RADIO — PREMIUM PLAYER V5
   Total visual reset of V3 player presentation
   ========================================================== */


/* Kill the clutter instead of decorating it */

.ma-radio-v3 #now-playing {
  padding: 26px 24px 20px !important;
  border: 1px solid rgba(212,175,55,.24) !important;
  border-radius: 26px !important;
  background: #080a09 !important;
  box-shadow: 0 24px 54px rgba(0,0,0,.42) !important;
}

.ma-radio-v3 #now-playing::before {
  display: none !important;
}


/* COVER IS THE HERO */

.ma-radio-v3 .ma-disc {
  width: 278px !important;
  height: 278px !important;
  padding: 6px !important;
  margin: 2px auto 20px !important;

  border: 1px solid rgba(224,190,73,.70) !important;
  background: #050605 !important;

  box-shadow:
    0 0 0 5px rgba(212,175,55,.035),
    0 20px 42px rgba(0,0,0,.48) !important;
}

.ma-radio-v3 .ma-disc::before {
  inset: 3px !important;
  border-color: rgba(47,204,111,.20) !important;
}

.ma-radio-v3 #matrix-radio-v2-spinner {
  border-radius: 50% !important;
}

.ma-radio-v3 #matrix-radio-v2-spinner.matrix-spinning {
  box-shadow:
    0 0 32px rgba(46,204,113,.24),
    inset 0 0 22px rgba(0,0,0,.28) !important;
}


/* SIMPLE NOW PLAYING HIERARCHY */

.ma-radio-v3 #matrix-radio-v2-now-type {
  margin-bottom: 7px !important;
  color: #48cf82 !important;
  font-size: 10px !important;
  letter-spacing: .16em !important;
}

.ma-radio-v3 #matrix-radio-v2-now-title {
  margin-bottom: 19px !important;
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 750 !important;
}


/* NO SEEK BAR — KEEP ONLY RUNNING TIME NUMBERS */

.ma-radio-v3 .matrix-radio-timeline {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;

  margin: 0 4px 17px !important;
  padding: 0 !important;

  color: rgba(255,255,255,.50) !important;
  font-size: 11px !important;

  border: 0 !important;
  background: transparent !important;
}

.ma-radio-v3 .matrix-radio-timeline input[type="range"] {
  visibility: hidden !important;
  pointer-events: none !important;
}


/* TRANSPORT — CLEAN, NOT A BAR */

.ma-radio-v3 .matrix-radio-transport {
  gap: 22px !important;

  margin: 0 auto 18px !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ma-radio-v3 #previous,
.ma-radio-v3 #next {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;

  border: 0 !important;
  background: transparent !important;

  color: #dfc55f !important;
  font-size: 18px !important;
}

.ma-radio-v3 #previous:hover,
.ma-radio-v3 #next:hover {
  background: rgba(212,175,55,.08) !important;
  transform: scale(1.10) !important;
}

.ma-radio-v3 #play-pause {
  width: 70px !important;
  height: 70px !important;
  min-width: 70px !important;

  border: 1px solid rgba(98,239,158,.78) !important;

  background: #159950 !important;

  box-shadow:
    0 9px 26px rgba(17,150,77,.30),
    0 0 0 5px rgba(48,204,111,.07) !important;
}


/* REMOVE ORIGINAL VOLUME SLIDER COMPLETELY */

.ma-radio-v3 .matrix-radio-volume {
  display: none !important;
}


/* SMALL PREMIUM TOOL ROW — 15 / MUTE / 15 */

.ma-radio-v3 .ma-deck-lower {
  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
}

.ma-radio-v3 .ma-premium-tools {
  display: flex;
  justify-content: center;
  align-items: center;

  gap: 8px;

  margin: 0 0 14px;
}

.ma-radio-v3 .ma-premium-tool {
  min-width: 52px;
  height: 34px;

  padding: 0 11px;

  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;

  background: #101310;
  color: rgba(255,255,255,.72);

  font: inherit;
  font-size: 11px;
  font-weight: 700;

  cursor: pointer;

  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease,
    color .16s ease;
}

.ma-radio-v3 .ma-premium-tool:hover {
  transform: translateY(-1px);
  border-color: rgba(212,175,55,.50);
  background: rgba(212,175,55,.08);
  color: #efd573;
}

.ma-radio-v3 .ma-mute-tool {
  min-width: 42px;
  padding: 0 9px;
  font-size: 15px;
}

.ma-radio-v3 .ma-mute-tool.is-active {
  border-color: rgba(212,175,55,.46);
  color: #e2c862;
}


/* ACTION BUTTONS — THESE SHOULD BE INVITING */

.ma-radio-v3 .ma-premium-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;

  gap: 8px;

  margin: 0 0 15px;
}

.ma-radio-v3 .matrix-radio-secondary-actions {
  display: contents !important;
}

.ma-radio-v3 #play-all,
.ma-radio-v3 #share-album,
.ma-radio-v3 .ma-premium-action {
  min-height: 42px !important;

  padding: 9px 15px !important;

  border: 1px solid rgba(212,175,55,.42) !important;
  border-radius: 11px !important;

  background: #121512 !important;
  color: #ead275 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035) !important;

  font-size: 12px !important;
  font-weight: 750 !important;

  cursor: pointer;

  transition:
    transform .16s ease,
    background .16s ease,
    border-color .16s ease,
    box-shadow .16s ease !important;
}

.ma-radio-v3 #play-all:hover,
.ma-radio-v3 #share-album:hover,
.ma-radio-v3 .ma-premium-action:hover {
  transform: translateY(-2px);

  border-color: rgba(231,200,88,.78) !important;
  background: rgba(212,175,55,.10) !important;

  box-shadow:
    0 8px 20px rgba(0,0,0,.20) !important;
}

.ma-radio-v3 .ma-add-playlist {
  border-color: rgba(64,207,123,.42) !important;
  color: #70dda0 !important;
}

.ma-radio-v3 .ma-add-playlist:hover {
  border-color: rgba(76,225,139,.76) !important;
  background: rgba(46,204,113,.09) !important;
}


/* SHARE STATION IS REDUNDANT BESIDE REAL SHARE OPTIONS */

.ma-radio-v3 #share-album {
  display: none !important;
}


/* X / WHATSAPP / COPY LINK — REAL TOUCH TARGETS */

.ma-radio-v3 .ma-premium-share {
  display: flex !important;
  justify-content: center !important;
  align-items: stretch !important;
  flex-wrap: wrap !important;

  gap: 8px !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
}

.ma-radio-v3 .ma-premium-share .ma-share-label {
  display: none !important;
}

.ma-radio-v3 .ma-premium-share .ma-chip,
.ma-radio-v3 .ma-premium-share button,
.ma-radio-v3 .ma-premium-share a {
  min-width: 92px !important;
  min-height: 42px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 9px 14px !important;

  border: 1px solid rgba(212,175,55,.32) !important;
  border-radius: 11px !important;

  background: #101310 !important;
  color: #f1e6ba !important;

  font-size: 12px !important;
  font-weight: 750 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035) !important;

  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease !important;
}

.ma-radio-v3 .ma-premium-share .ma-chip:hover,
.ma-radio-v3 .ma-premium-share button:hover,
.ma-radio-v3 .ma-premium-share a:hover {
  transform: translateY(-2px);

  border-color: rgba(224,190,73,.70) !important;
  background: rgba(212,175,55,.09) !important;
}


/* STATUS ALMOST DISAPPEARS */

.ma-radio-v3 .ma-notes {
  margin-top: 8px !important;
}

.ma-radio-v3 #player-message,
.ma-radio-v3 #matrix-radio-v2-message {
  color: rgba(255,255,255,.28) !important;
  font-size: 9px !important;
}


/* MOBILE */

@media (max-width: 520px) {

  .ma-radio-v3 .ma-disc {
    width: 220px !important;
    height: 220px !important;
  }

  .ma-radio-v3 #matrix-radio-v2-now-title {
    font-size: 18px !important;
  }

  .ma-radio-v3 #play-pause {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
  }

  .ma-radio-v3 .ma-premium-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .ma-radio-v3 #play-all,
  .ma-radio-v3 .ma-premium-action {
    width: 100% !important;
  }

  .ma-radio-v3 .ma-premium-share {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
  }

  .ma-radio-v3 .ma-premium-share .ma-chip,
  .ma-radio-v3 .ma-premium-share button,
  .ma-radio-v3 .ma-premium-share a {
    min-width: 0 !important;
    width: 100% !important;
  }
}

/* END MATRIXALIGNER RADIO PREMIUM PLAYER V5 */

/* MATRIXALIGNER_RADIO_V5_PROGRESS_LINE
   Restore seek/progress line only.
   Everything else in Premium Player V5 remains unchanged.
*/

.ma-radio-v3 .matrix-radio-timeline input[type="range"] {
  visibility: visible !important;
  pointer-events: auto !important;

  width: 100% !important;
  height: 4px !important;

  margin: 0 10px !important;

  accent-color: #d6b64b !important;

  cursor: pointer !important;
  opacity: .92 !important;
}

/* END MATRIXALIGNER_RADIO_V5_PROGRESS_LINE */

/* MATRIXALIGNER RADIO — CANONICAL TRUST PASSPORT PRESENTATION */

html[data-matrixaligner-authenticated="true"]
#matrix-gateway-passport-state {
  font-size: 0 !important;
}

html[data-matrixaligner-authenticated="true"]
#matrix-gateway-passport-state::after {
  content: "Trust Passport Active";
  font-size: 11px;
  color: #55d98b;
}

/* END CANONICAL TRUST PASSPORT PRESENTATION */

/*
 * MATRIXALIGNER RADIO — LIMIT BOX, NOT FILES
 *
 * Catalog/search results are unrestricted.
 * The browser limits only the visible viewport.
 */

.ma-radio-v3 #matrix-radio-v2-list {
  overflow-y: auto;
  overflow-x: hidden;
}

/* ==========================================================
   MATRIXALIGNER_RADIO_MOBILE_POLISH_20260929
   PHONE ONLY
   - sub-banner alignment
   - compact player
   - no playback/runtime changes
   ========================================================== */

@media (max-width: 600px) {

  /* ----------------------------------------
     TOP PAGE / SUB-BANNER
     Override later desktop 900px rule.
     ---------------------------------------- */

  .matrixaligner-radio-page-banner > img {
    display: block !important;

    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    height: auto !important;
    max-height: none !important;

    margin: 0 auto !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;
  }


  /* ----------------------------------------
     LOWER RADIO BANNER
     Keep centered inside phone viewport.
     ---------------------------------------- */

  .ma-radio-v3 #matrix-radio-banner,
  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-inner {
    width: 100% !important;
    max-width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    overflow: hidden !important;
  }

  .ma-radio-v3 #matrix-radio-banner .matrix-radio-banner-image {
    display: block !important;

    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    height: auto !important;
    max-height: none !important;

    margin: 0 auto !important;

    object-fit: contain !important;
    object-position: center center !important;
  }


  /* ----------------------------------------
     PLAYER — PHONE WIDTH CONTRACT
     ---------------------------------------- */

  .ma-radio-v3 #matrix-radio-v2-stage,
  .ma-radio-v3 .ma-deck,
  .ma-radio-v3 .matrix-radio-timeline {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .ma-radio-v3 #matrix-radio-v2-stage {
    overflow: hidden !important;
  }


  /* ----------------------------------------
     TRANSPORT — COMPACT PHONE CONSOLE
     ---------------------------------------- */

  .ma-radio-v3 .matrix-radio-transport {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    max-width: calc(100% - 16px) !important;

    gap: 10px !important;

    margin: 0 auto 14px !important;
    padding: 7px 10px !important;

    box-sizing: border-box !important;
  }

  .ma-radio-v3 #previous,
  .ma-radio-v3 #next {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
  }


  /* ----------------------------------------
     LOWER PLAYER CONTROLS
     Allow clean wrapping instead of overflow.
     ---------------------------------------- */

  .ma-radio-v3 .ma-deck-lower {
    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;
  }

  .ma-radio-v3 .ma-deck-lower button {
    max-width: 100% !important;
  }


  /* ----------------------------------------
     CATALOG ROWS
     Play is now the only row action.
     ---------------------------------------- */

  .ma-radio-v3 .matrix-radio-v2-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 6px !important;

    min-width: 0 !important;
  }

}

/* ==========================================================
   END MATRIXALIGNER_RADIO_MOBILE_POLISH_20260929
   ========================================================== */


/* ==========================================================
   MATRIXALIGNER_RADIO_PHONE_FINAL_POLISH_20260929
   FINAL PHONE PRESENTATION AUTHORITY
   <= 600px ONLY
   VISUAL ONLY
   ========================================================== */

@media (max-width: 600px) {

  /* ----------------------------------------
     PAGE RHYTHM
     Remove excessive vertical dead space.
     ---------------------------------------- */

  .ma-radio-v3 {
    --ma-phone-gap: 14px;
  }

  .ma-radio-v3 main,
  .ma-radio-v3 .matrix-radio-shell,
  .ma-radio-v3 .matrix-radio-v2-shell {
    gap: var(--ma-phone-gap) !important;
  }


  /* ----------------------------------------
     SIGNED-IN IDENTITY / TRUST PASSPORT
     Compact member presentation.
     ---------------------------------------- */

  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity {
    margin: 10px 12px 14px !important;
  }

  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .matrix-radio-identity-inner {
    padding: 13px 14px !important;
    gap: 10px !important;
    border-radius: 16px !important;
  }

  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-passport-state {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    min-height: 28px !important;
    padding: 5px 10px !important;
    margin: 0 !important;
    border: 1px solid rgba(85,217,139,.32) !important;
    border-radius: 999px !important;
    background: rgba(85,217,139,.08) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-passport-state::after {
    content: "✓ Trust Passport Active" !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .02em !important;
    color: #62e69a !important;
  }

  /*
   * Authenticated users should not visually retain
   * the anonymous Guest Listener fallback.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity [data-guest-listener],
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .guest-listener {
    display: none !important;
  }


  /* ----------------------------------------
     JAHCORE GUIDE BANNER
     Match player width / phone proportions.
     ---------------------------------------- */

  .ma-radio-v3 img[src*="jahcore-radio-guide-banner"],
  .ma-radio-v3 img[src*="jahcore"][src*="banner"] {
    display: block !important;
    box-sizing: border-box !important;

    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    height: auto !important;
    max-height: none !important;

    margin: 12px auto 16px !important;
    padding: 0 !important;

    object-fit: contain !important;
    border-radius: 18px !important;
  }


  /* ----------------------------------------
     PLAYER
     Larger artwork / spinner.
     Better proportion to phone player card.
     ---------------------------------------- */

  .ma-radio-v3 .ma-disc {
    width: min(64vw, 250px) !important;
    height: min(64vw, 250px) !important;

    margin-left: auto !important;
    margin-right: auto !important;
  }

  .ma-radio-v3 #matrix-radio-v2-spinner {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;

    display: block;
    object-fit: cover !important;
    border-radius: 50% !important;
  }

  .ma-radio-v3 #matrix-radio-v2-now-type {
    margin-top: 10px !important;
    margin-bottom: 5px !important;
  }

  .ma-radio-v3 #matrix-radio-v2-now-title {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    padding: 0 10px !important;

    font-size: 17px !important;
    line-height: 1.25 !important;
  }

  .ma-radio-v3 .matrix-radio-transport {
    margin-top: 8px !important;
    gap: 11px !important;
  }


  /* ----------------------------------------
     SHARE CONTROLS
     One clean touch-friendly phone grid.
     ---------------------------------------- */

  .ma-radio-v3 #matrix-radio-v2-catalog .matrix-radio-v2-sharebar,
  .ma-radio-v3 .matrix-radio-v2-sharebar,
  .ma-radio-v3 .ma-premium-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;

    width: 100% !important;
    margin: 12px 0 0 !important;
  }

  .ma-radio-v3 #matrix-radio-v2-catalog .matrix-radio-v2-sharebar > *,
  .ma-radio-v3 .matrix-radio-v2-sharebar > *,
  .ma-radio-v3 .ma-premium-actions > * {
    box-sizing: border-box !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 9px 8px !important;

    border-radius: 12px !important;

    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: normal !important;
  }


  /* VIDEO SOCIAL SHARE ROW */

  .ma-radio-v3 #mrvs-share,
  .ma-radio-v3 .mrvs-share,
  .ma-radio-v3 .mrvs-share-row,
  .ma-radio-v3 .mrvs-actions {
    gap: 8px !important;
  }

  .ma-radio-v3 #mrvs-x,
  .ma-radio-v3 #mrvs-whatsapp,
  .ma-radio-v3 #mrvs-telegram {
    min-height: 42px !important;
    padding: 8px 10px !important;
    border-radius: 11px !important;
  }


  /* ----------------------------------------
     PHONE CARD SPACING
     ---------------------------------------- */

  .ma-radio-v3 .matrix-radio-v2-player,
  .ma-radio-v3 .matrix-radio-v2-player-card,
  .ma-radio-v3 .player-card,
  .ma-radio-v3 .player-runtime {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
  }
}

/* END MATRIXALIGNER_RADIO_PHONE_FINAL_POLISH_20260929 */


/* =========================================================
   MATRIXALIGNER RADIO — EXACT MOBILE SIGNED-IN TOP
   Real DOM authority.
   Mobile only.
   ========================================================= */

@media (max-width: 600px) {

  /*
   * Signed-in member:
   * remove the stale Guest Listener presentation completely.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-display-name {
    display: none !important;
  }

  /*
   * Give the action row the width previously consumed
   * by the redundant display-name presentation.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .matrix-radio-member-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: stretch !important;

    width: 100% !important;
    max-width: 100% !important;

    gap: 8px !important;
    margin: 0 !important;
  }

  /*
   * Trust Passport is the primary authenticated status.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-passport-state {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;

    padding: 9px 12px !important;
    margin: 0 !important;

    box-sizing: border-box !important;

    border-radius: 14px !important;

    white-space: nowrap !important;
    overflow: visible !important;
  }

  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-passport-state::after {
    content: "✓ Trust Passport Active" !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    letter-spacing: .01em !important;

    white-space: nowrap !important;
  }

  /*
   * Preserve Profile as its own compact control.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-profile-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 44px !important;
    padding: 9px 12px !important;

    box-sizing: border-box !important;
    border-radius: 14px !important;

    white-space: nowrap !important;
  }

  /*
   * The original Sign In anchor becomes Sign Out
   * after identity authentication.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-signin-link[data-auth-mode="signout"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 44px !important;
    padding: 9px 13px !important;

    box-sizing: border-box !important;

    border: 1px solid rgba(255, 196, 92, .72) !important;
    border-radius: 14px !important;

    background:
      linear-gradient(
        180deg,
        rgba(255,196,92,.13),
        rgba(255,196,92,.045)
      ) !important;

    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;

    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.025),
      0 5px 16px rgba(0,0,0,.22) !important;
  }
}

/* MATRIXALIGNER_RADIO_MOBILE_TOP_EXACT_20260929 */

/* ==========================================================
   MATRIXALIGNER RADIO — MOBILE TOP FINAL COMPACT POLISH
   Authenticated mobile only.
   ========================================================== */

@media (max-width: 600px) {

  /*
   * Avatar is redundant on the compact authenticated header.
   * Remove the M and its physical footprint.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .matrix-radio-avatar {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /*
   * Member copy no longer needs a dedicated column.
   * Collapse it so controls can occupy the space.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .matrix-radio-member-copy {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /*
   * Convert the identity interior into one clean
   * full-width authenticated control strip.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .matrix-radio-identity-inner {
    display: block !important;

    width: 100% !important;
    min-height: 0 !important;

    padding: 10px !important;
    margin: 0 !important;

    box-sizing: border-box !important;
  }

  /*
   * Fill the reclaimed avatar/member space.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity .matrix-radio-member-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: center !important;

    width: 100% !important;
    max-width: none !important;

    gap: 7px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
  }

  /*
   * One visual height across the complete top strip.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-passport-state,
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-profile-link,
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-signin-link[data-auth-mode="signout"] {
    min-height: 42px !important;
    height: 42px !important;

    margin: 0 !important;

    box-sizing: border-box !important;

    border-radius: 13px !important;
  }

  html[data-matrixaligner-authenticated="true"]
  #matrix-gateway-passport-state {
    padding: 7px 10px !important;
  }

  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-profile-link,
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-signin-link[data-auth-mode="signout"] {
    padding: 7px 11px !important;
  }

  /*
   * Tighten the outer identity card around the controls.
   */
  html[data-matrixaligner-authenticated="true"]
  #matrix-radio-identity {
    margin-top: 8px !important;
    margin-bottom: 10px !important;
  }
}

/* MATRIXALIGNER_RADIO_MOBILE_TOP_FINAL_COMPACT_20260929 */
/* ==========================================================
   MATRIXALIGNER RADIO — MOBILE SPINNER REAL PARENT AUTHORITY
   Proven runtime:
   #matrix-radio-v2-stage > .ma-disc > #matrix-radio-v2-spinner
   ========================================================== */

@media (max-width: 600px) {

  /*
   * .ma-disc is the real spinner housing.
   * Increase the housing; image already fills 100%.
   */
  .ma-radio-v3
  #matrix-radio-v2-stage
  > .ma-disc {
    width: min(76vw, 292px) !important;
    height: min(76vw, 292px) !important;

    min-width: min(76vw, 292px) !important;
    min-height: min(76vw, 292px) !important;

    max-width: 292px !important;
    max-height: 292px !important;

    flex: 0 0 auto !important;
    aspect-ratio: 1 / 1 !important;

    margin: 8px auto 6px !important;
    padding: 0 !important;

    box-sizing: border-box !important;
  }

  /*
   * Spinner fills the proven housing.
   */
  .ma-radio-v3
  #matrix-radio-v2-stage
  > .ma-disc
  > #matrix-radio-v2-spinner {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
  }
}

/* MATRIXALIGNER_RADIO_MOBILE_SPINNER_REAL_PARENT_20260929 */
/* ==========================================================
   MATRIXALIGNER RADIO — MOBILE NOW PLAYING HEADING AUTHORITY
   Proven live target:
   #now-playing-heading
   Previous rendered box: 1px x 1px
   ========================================================== */

@media (max-width: 600px) {

  .ma-radio-v3
  #now-playing
  .section-heading {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  .ma-radio-v3
  #now-playing-heading {
    position: static !important;

    display: block !important;

    width: auto !important;
    height: auto !important;

    min-width: 0 !important;
    min-height: 0 !important;

    max-width: none !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;

    white-space: normal !important;

    font-size: 38px !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;

    letter-spacing: -0.02em !important;

    text-align: left !important;

    opacity: 1 !important;
    visibility: visible !important;
  }
}

/* MATRIXALIGNER_RADIO_NOW_PLAYING_HEADING_FINAL_20260929 */

/* ==========================================================
   MATRIXALIGNER RADIO — MOBILE SHARE FINAL AUTHORITY
   Presentation only. Existing share handlers remain authority.
   ========================================================== */

@media (max-width: 600px) {

  /* AUDIO / CURRENT-MEDIA SHARE */

  .ma-radio-v3 .matrix-radio-v2-sharebar,
  .ma-radio-v3 .ma-premium-actions {
    width: 100% !important;
    max-width: none !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 10px !important;

    margin: 14px 0 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
  }

  .ma-radio-v3 .matrix-radio-v2-sharebar > *,
  .ma-radio-v3 .ma-premium-actions > * {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 11px 10px !important;

    box-sizing: border-box !important;

    border-radius: 14px !important;

    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;

    text-align: center !important;
    white-space: normal !important;
  }


  /* VIDEO SOCIAL SHARE */

  .ma-radio-v3 #mrvs-share,
  .ma-radio-v3 .mrvs-share,
  .ma-radio-v3 .mrvs-share-row,
  .ma-radio-v3 .mrvs-actions {
    width: 100% !important;
    max-width: none !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 10px !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
  }

  .ma-radio-v3 #mrvs-share > *,
  .ma-radio-v3 .mrvs-share > *,
  .ma-radio-v3 .mrvs-share-row > *,
  .ma-radio-v3 .mrvs-actions > *,
  .ma-radio-v3 #mrvs-x,
  .ma-radio-v3 #mrvs-whatsapp,
  .ma-radio-v3 #mrvs-telegram {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 11px 10px !important;

    box-sizing: border-box !important;

    border-radius: 14px !important;

    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;

    text-align: center !important;
    white-space: normal !important;
  }

}

/* MATRIXALIGNER_RADIO_MOBILE_SHARE_FINAL_20260929 */

/* ==========================================================
   MATRIXALIGNER RADIO — MOBILE SINGLE SHARE INTERFACE
   Functional v2 originals remain in DOM.
   Premium proxy buttons are the only visible mobile share UI.
   ========================================================== */

@media (max-width: 600px) {

  /* Keep functional originals in DOM but remove duplicate UI. */
  .ma-radio-v3 #matrix-radio-v2-catalog .matrix-radio-v2-sharebar,
  .ma-radio-v3 .matrix-radio-v2-sharebar {
    display: none !important;
  }

  /* Visible proxy interface:
       X          | WhatsApp
       Copy Link  | Share
  */
  .ma-radio-v3 .ma-share-row.ma-premium-share {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: none !important;
    gap: 10px !important;
    margin: 14px 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .ma-radio-v3 .ma-share-row.ma-premium-share .ma-share-label {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .ma-radio-v3 .ma-share-row.ma-premium-share .ma-chip {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 11px 10px !important;
    box-sizing: border-box !important;
    border-radius: 14px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: normal !important;
  }
}

/* MATRIXALIGNER_RADIO_MOBILE_SINGLE_SHARE_INTERFACE_20260929 */


/* ==========================================================
   MATRIXALIGNER_RADIO_LIBRARY_3_CONTROL_ROW_20260929
   Existing controls only:
   Audio | My Playlists | Video
   ========================================================== */

.ma-radio-v3 .matrix-radio-v2-filters {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

.ma-radio-v3 .matrix-radio-v2-filters
#ma-playlists-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 6px !important;

  box-sizing: border-box !important;
  border-radius: 10px !important;

  font-size: 13px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}


/* ==========================================================
   MATRIXALIGNER RADIO — MAC / DESKTOP WORKSPACE POLISH
   Desktop only.
   Cell/mobile authority remains untouched.
   ========================================================== */

@media (min-width: 901px) {

  /*
   * Use the existing professional grid as the desktop workspace.
   * Player remains the left console.
   * Discovery + Library occupy the available right workspace.
   */
  .ma-radio-v3
  #matrix-professional-radio-v2
  .matrix-radio-v2-grid {
    grid-template-columns:
      minmax(340px, 0.72fr)
      minmax(0, 1.28fr) !important;

    align-items: start !important;
    gap: 18px !important;
  }

  /*
   * Discovery cards are the right-side introduction.
   * Existing cards only — no rebuild.
   */
  .ma-radio-v3
  .matrix-radio-v2-discovery-grid {
    grid-column: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 14px !important;
  }

  /*
   * Library becomes the main right-side workspace instead
   * of being squeezed beneath the player.
   */
  .ma-radio-v3
  #playlist {
    grid-column: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
  }

  /*
   * Player remains isolated on the left.
   */
  .ma-radio-v3
  #now-playing {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    align-self: start !important;
  }

}

/* MATRIXALIGNER_RADIO_MAC_DESKTOP_POLISH_20260930 */