/* SunoWeb metallic finishes — Gold is intentionally a no-op so the proven
   Midnight Gold design remains pixel-for-pixel unchanged. CSS-only cosmetics.
   Earlier WebViews supported: no :has(), color-mix(), or CSS nesting. */
:root { --suno-finish-current:gold; }
/* Candy-crimson Red: sampled against the saturated ruby-red Karma artwork.
   Avoid pastel highlights: whites are used ONLY for text, not as wide gradient stops. */
html[data-sunoweb-theme="red"] {
 --metal-hi:#ff3046;--metal-accent:#ed002e;--metal-mid:#b50028;--metal-low:#610015;--metal-ink:#fff6f7;
 --metal-surface:#2b0b13;--metal-deep:#110409;--metal-edge:#8c172e;--metal-muted:#f1c9d0;--metal-rgb:237,0,46;
}
html[data-sunoweb-theme="blue"] {
 --metal-hi:#168fff;--metal-accent:#006cff;--metal-mid:#003fae;--metal-low:#001e63;--metal-ink:#f5f9ff;
 --metal-surface:#0d1c38;--metal-deep:#070f23;--metal-edge:#1857ad;--metal-muted:#c4d9ff;--metal-rgb:0,108,255;
}

html[data-sunoweb-theme="black"] {
 --metal-hi:#f0f1f5;--metal-accent:#c5cad4;--metal-mid:#858e9f;--metal-low:#5d6678;--metal-ink:#0a0d12;
 --metal-surface:#1b2029;--metal-deep:#07090f;--metal-edge:#4c5565;--metal-muted:#bac1cf;--metal-rgb:197,202,212;
}

html[data-sunoweb-theme="green"] {
 --metal-hi:#1bf58b;--metal-accent:#00d864;--metal-mid:#00893e;--metal-low:#00431f;--metal-ink:#f4fff8;
 --metal-surface:#09271a;--metal-deep:#04170e;--metal-edge:#118751;--metal-muted:#c1efd5;--metal-rgb:0,216,100;
}
html[data-sunoweb-theme="silver"] {
 --metal-hi:#ffffff;--metal-accent:#dce6f1;--metal-mid:#b6c5d8;--metal-low:#74879d;--metal-ink:#101927;
 --metal-surface:#293340;--metal-deep:#121922;--metal-edge:#95a6ba;--metal-muted:#d6e0ea;--metal-rgb:220,230,241;
}

/* Color choice component in Setup — also visible in the unmodified Gold theme. */
.suno-metal-theme-picker { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;border:0;padding:0;margin:0; }
.suno-metal-theme-option { position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;
 min-width:0;padding:9px 6px;border:1px solid #68708079;border-radius:11px;background:linear-gradient(160deg,#424a55,#222831);
 color:#e7eef9;text-align:center;font-weight:650;font-size:12px;transition:box-shadow .12s,border-color .12s; }
.suno-metal-theme-option input {position:absolute;top:5px;left:7px;accent-color:#ffe0a3;width:16px;height:16px;margin:0;cursor:pointer;z-index:1;}
.suno-metal-theme-swatch {display:block;height:31px;width:100%;max-width:78px;border-radius:12px;border:1px solid #ffffff89;
 box-shadow:inset 0 3px 5px #ffffff8a,inset 0 -7px 10px #0007,0 2px 8px #0008;
 background:linear-gradient(158deg,#fff7d8 0%,#cf9634 36%,#633d0e 53%,#ffdfa2 80%,#a97425 100%); }
.suno-metal-theme-option[data-swatch="red"] .suno-metal-theme-swatch{background:linear-gradient(158deg,#ff3a51 0%,#eb002d 33%,#550014 54%,#ff153d 79%,#9e001e 100%)}
.suno-metal-theme-option[data-swatch="blue"] .suno-metal-theme-swatch{background:linear-gradient(158deg,#168fff 0%,#006cff 34%,#001b65 55%,#1880ff 78%,#003cba 100%)}
.suno-metal-theme-option[data-swatch="black"] .suno-metal-theme-swatch{background:linear-gradient(158deg,#9099a5,#252a34 36%,#000 53%,#626d7b 80%,#0a0c14)}
.suno-metal-theme-option[data-swatch="green"] .suno-metal-theme-swatch{background:linear-gradient(158deg,#1bf58b 0%,#00d864 33%,#00431f 55%,#0be57b 79%,#008b43 100%)}
.suno-metal-theme-option[data-swatch="silver"] .suno-metal-theme-swatch{background:linear-gradient(158deg,#ffffff,#bcc9d8 35%,#6f8095 53%,#eef3f8 80%,#99a8bb)}
.suno-metal-theme-option input:checked + .suno-metal-theme-swatch {outline:3px solid #f5d28b;outline-offset:2px;}
/* Older WebViews lacking :has() still display a native checked radio. */
.suno-metal-theme-option:focus-within {outline:2px solid #e6bf77;outline-offset:2px;}
@media(max-width:520px){.suno-metal-theme-picker{grid-template-columns:repeat(2,minmax(0,1fr));}}

/* All non-Gold finishes are a tinted dark cockpit with brighter metallic
   highlights. Silver is a LIGHT METAL accent on dark cabin panels,
   avoiding white-on-white text in existing controls and dialogs. */
html[data-sunoweb-theme="red"],html[data-sunoweb-theme="blue"],
html[data-sunoweb-theme="black"],html[data-sunoweb-theme="green"],
html[data-sunoweb-theme="silver"] {
 --sw-gold:var(--metal-accent);--sw-gold-bright:var(--metal-hi);--sw-gold-ink:var(--metal-ink);
 --sw-dark:var(--metal-deep);--sw-line:var(--metal-edge);--sw-ink:#f0f3f9;--sw-muted:var(--metal-muted);
 color-scheme:dark;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) body:not(.sunocar-page) {
 background:linear-gradient(150deg,var(--metal-surface),var(--metal-deep) 58%) fixed!important;color:#f4f5f9!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .navbar.bg-white,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) header .navbar {
 background:linear-gradient(115deg,var(--metal-surface),var(--metal-deep))!important;border-color:var(--metal-edge)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .navbar-brand,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .navbar-nav .nav-link,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) body .text-dark,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) body .text-muted {color:var(--metal-muted)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) body .card,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card {
 background:linear-gradient(135deg,var(--metal-surface) 0%,var(--metal-deep) 100%)!important;
 border-color:var(--metal-edge)!important;color:#f3f5fa!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .form-control,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .form-select,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-search-input {
 background:var(--metal-deep)!important;border-color:var(--metal-edge)!important;color:#f4f5fa!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) input:focus,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) select:focus {outline-color:var(--metal-accent);border-color:var(--metal-accent)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) input[type="range"],
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) input[type="checkbox"] {accent-color:var(--metal-accent);}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .btn-primary,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-filter-submit,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-playlist-chip.is-active,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-modern-player .global-main-play.suno-transport-button {
 background:linear-gradient(155deg,var(--metal-hi) 0%,var(--metal-accent) 37%,var(--metal-mid) 64%,var(--metal-accent) 100%)!important;
 border-color:var(--metal-accent)!important;color:var(--metal-ink)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-modern-player .global-main-play.suno-transport-button:before {background:var(--metal-ink)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .global-audio-player.suno-modern-player {
 background:linear-gradient(137deg,var(--metal-surface),var(--metal-deep) 68%,var(--metal-surface))!important;
 border-top-color:var(--metal-accent)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-modern-player .global-player-controls,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-modern-player .global-player-button.suno-transport-button:not(.global-main-play) {
 background:linear-gradient(145deg,var(--metal-surface),var(--metal-deep))!important;border-color:var(--metal-edge)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-playlist-chip:not(.is-active),
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-filter-toggle {
 border-color:var(--metal-edge);background:linear-gradient(130deg,var(--metal-surface),var(--metal-deep));color:#f2f4f8;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action.song-play-button:not(.btn-success) {
 --action-fore:var(--metal-ink);--action-bg1:var(--metal-hi);--action-bg2:var(--metal-mid);--action-edge:var(--metal-accent);
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action.suno-action-details,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action-next,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action-queue {
 border-color:var(--metal-edge);background:linear-gradient(150deg,var(--metal-surface),var(--metal-deep));color:#edf2fa;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action-next:before,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action-queue:before {color:var(--metal-accent);}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) #songsResults .suno-action-download,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-download-trigger {
 --action-bg1:var(--metal-surface);--action-bg2:var(--metal-deep);--action-edge:var(--metal-accent);--action-fore:var(--metal-hi);
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-refresh-dialog-content,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-download-menu,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .global-lyrics-panel,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .global-queue-panel {
 background:linear-gradient(155deg,var(--metal-surface),var(--metal-deep))!important;border-color:var(--metal-edge)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .suno-refresh-dialog-confirm {background:linear-gradient(145deg,var(--metal-hi),var(--metal-mid));color:var(--metal-ink);border-color:var(--metal-accent);}

/* Car-specific styling: selected through the same top-level html preference.
   Keep rings, flame/torch colors, and album artwork independent of themes. */
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) body.sunocar-page,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) body.sunocar-page .sunocar-web {
 background:linear-gradient(145deg,var(--metal-deep),var(--metal-surface) 80%)!important;color:#f2f5fa;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-top,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-toolbar,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-filter-panel,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-diagnostics-panel {
 background:linear-gradient(135deg,var(--metal-surface),var(--metal-deep))!important;border-color:var(--metal-edge)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-logo,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-filter-head,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-cover-head,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-songs th {color:var(--metal-hi)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-btn:not(.suno-action),
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-playlist-chip:not(.is-active) {
 background:linear-gradient(155deg,var(--metal-surface),var(--metal-deep))!important;
 border-color:var(--metal-edge)!important;color:#eff4fa!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-btn.car-yellow:not(.suno-action),
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-playlist-chip.is-active {
 background:linear-gradient(145deg,var(--metal-hi),var(--metal-accent) 38%,var(--metal-mid) 71%,var(--metal-accent))!important;
 border-color:var(--metal-accent)!important;color:var(--metal-ink)!important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-songs th {background:var(--metal-surface)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-songs td {border-color:var(--metal-edge)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-songs tr:nth-child(even) {background:var(--metal-deep)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-songs tbody tr:hover {background:var(--metal-surface)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-cover-screen {background:var(--metal-deep)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-cover-right {background:var(--metal-surface)!important;border-color:var(--metal-edge)!important;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-filter-panel select,
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-filter-panel input {background:var(--metal-deep)!important;border-color:var(--metal-edge)!important;color:#fff;}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .sunocar-web {--gold:var(--metal-accent);}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .car-visualizer-switch input {accent-color:var(--metal-accent);}

@media(prefers-reduced-motion:reduce){.suno-metal-theme-option{transition:none;}}

/* Red v3: ruby/candy-red lacquer finish for active controls. Subtle specular
   glint is a thin edge, NEVER a broad salmon/pink top band. */
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .btn-primary,
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-filter-submit,
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .suno-library-filter-card .suno-playlist-chip.is-active,
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .suno-modern-player .global-main-play.suno-transport-button,
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .car-btn.car-yellow:not(.suno-action),
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .car-playlist-chip.is-active,
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .suno-refresh-dialog-confirm {
 background:linear-gradient(155deg,#ff3046 0%,#e6002c 27%,#ae0026 58%,#f00030 84%,#b50028 100%)!important;
 border-color:#e5193d!important;
 color:#fff6f7!important;
 text-shadow:0 1px 2px rgba(30,0,7,.68);
 box-shadow:inset 0 1px 0 rgba(255,152,162,.40),0 2px 10px rgba(125,0,31,.20);
}
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .suno-modern-player .global-main-play.suno-transport-button:before {
 background:#fff6f7!important;
}
/* Highlighted (active/selected) controls remain legible on older car WebViews. */
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .car-playlist-chip.is-active:focus-visible,
html[data-sunoweb-theme="red"]:not([data-sunoweb-theme="gold"]) .car-btn.car-yellow:focus-visible {
 outline:2px solid #ff5269;outline-offset:2px;
}

/* V5: Sport Blue and Racing Green. Darker, highly saturated clearcoat
   highlights; white text on selected controls. The soft pastel high-gloss
   stops from the older palette made both finishes look washed out. */
html[data-sunoweb-theme="blue"] .btn-primary,
html[data-sunoweb-theme="blue"] .suno-library-filter-card .suno-filter-submit,
html[data-sunoweb-theme="blue"] .suno-library-filter-card .suno-playlist-chip.is-active,
html[data-sunoweb-theme="blue"] .suno-modern-player .global-main-play.suno-transport-button,
html[data-sunoweb-theme="blue"] .car-btn.car-yellow:not(.suno-action),
html[data-sunoweb-theme="blue"] .car-playlist-chip.is-active,
html[data-sunoweb-theme="blue"] .suno-refresh-dialog-confirm {
 background:linear-gradient(153deg,#168fff 0%,#006cff 29%,#003fae 60%,#0878f8 85%,#00388f 100%)!important;
 border-color:#167eff!important;color:#f5f9ff!important;
 text-shadow:0 1px 2px #001539!important;
 box-shadow:inset 0 1px 0 rgba(117,188,255,.38),0 2px 10px rgba(0,55,135,.28);
}
html[data-sunoweb-theme="green"] .btn-primary,
html[data-sunoweb-theme="green"] .suno-library-filter-card .suno-filter-submit,
html[data-sunoweb-theme="green"] .suno-library-filter-card .suno-playlist-chip.is-active,
html[data-sunoweb-theme="green"] .suno-modern-player .global-main-play.suno-transport-button,
html[data-sunoweb-theme="green"] .car-btn.car-yellow:not(.suno-action),
html[data-sunoweb-theme="green"] .car-playlist-chip.is-active,
html[data-sunoweb-theme="green"] .suno-refresh-dialog-confirm {
 background:linear-gradient(153deg,#1bf58b 0%,#00d864 29%,#00893e 60%,#09e77a 85%,#006f37 100%)!important;
 border-color:#1ce283!important;color:#f4fff8!important;
 text-shadow:0 1px 2px #002b17!important;
 box-shadow:inset 0 1px 0 rgba(130,255,182,.35),0 2px 10px rgba(0,92,47,.27);
}
html[data-sunoweb-theme="blue"] .suno-modern-player .global-main-play.suno-transport-button:before,
html[data-sunoweb-theme="green"] .suno-modern-player .global-main-play.suno-transport-button:before {
 background:#f5fff8!important;
}

/* Theme v4: the 8/16-band toggle is rendered by the shared player on both
   Library and Car Edition. site.css historically hard-codes yellow (#efbb19)
   for [aria-pressed=true]. Respect every metallic theme while deliberately
   leaving the original Gold appearance untouched. Works on older WebViews. */
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .sunoweb-eq-mode .sunoweb-eq-mode-button {
 background:linear-gradient(150deg,var(--metal-surface),var(--metal-deep)) !important;
 border:1px solid var(--metal-edge) !important;
 color:#f0f2f6 !important;
 text-shadow:none !important;
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .sunoweb-eq-mode .sunoweb-eq-mode-button[aria-pressed="true"] {
 background:linear-gradient(155deg,var(--metal-hi) 0%,var(--metal-accent) 35%,var(--metal-mid) 72%,var(--metal-accent) 100%) !important;
 border-color:var(--metal-accent) !important;
 color:var(--metal-ink) !important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 7px rgba(0,0,0,.2);
}
html[data-sunoweb-theme="red"] .sunoweb-eq-mode .sunoweb-eq-mode-button[aria-pressed="true"] {
 background:linear-gradient(155deg,#ff3046 0%,#e6002c 27%,#ae0026 58%,#f00030 84%,#b50028 100%) !important;
 border-color:#e5193d !important;
 color:#fff6f7 !important;
 text-shadow:0 1px 2px rgba(30,0,7,.68) !important;
 box-shadow:inset 0 1px 0 rgba(255,152,162,.4),0 2px 10px rgba(125,0,31,.2);
}
html[data-sunoweb-theme]:not([data-sunoweb-theme="gold"]) .sunoweb-eq-mode .sunoweb-eq-mode-button:focus-visible {
 outline:2px solid var(--metal-accent) !important;
 outline-offset:2px;
}

/* V5: 8/16-band selection follows the more saturated Blue and Green. */
html[data-sunoweb-theme="blue"] .sunoweb-eq-mode .sunoweb-eq-mode-button[aria-pressed="true"] {
 background:linear-gradient(153deg,#168fff 0%,#006cff 29%,#003fae 60%,#0878f8 85%,#00388f 100%)!important;
 color:#f5f9ff!important;border-color:#167eff!important;
 text-shadow:0 1px 2px #001539!important;
}
html[data-sunoweb-theme="green"] .sunoweb-eq-mode .sunoweb-eq-mode-button[aria-pressed="true"] {
 background:linear-gradient(153deg,#1bf58b 0%,#00d864 29%,#00893e 60%,#09e77a 85%,#006f37 100%)!important;
 color:#f4fff8!important;border-color:#1ce283!important;
 text-shadow:0 1px 2px #002b17!important;
}


/* V6/v7: Independent background and face color adjustments.
   0% background = pure black. Only UI surfaces are changed; album covers,
   lyric images and visualizer hues are NEVER filtered or recolored. */
html[data-sunoweb-theme="gold-tuned"] {
 --sw-gold:var(--metal-accent);--sw-gold-bright:var(--metal-hi);--sw-gold-ink:var(--metal-ink);
 --sw-dark:var(--metal-deep);--sw-line:var(--metal-edge);--sw-ink:#f0f3f9;--sw-muted:var(--metal-muted);
 color-scheme:dark;
}
.suno-metal-customizer { margin:12px 0 17px;padding:15px 16px;
 background:linear-gradient(155deg,rgba(58,65,78,.38),rgba(16,19,26,.5));
 border:1px solid rgba(151,163,184,.35);border-radius:12px; }
.suno-metal-customizer .suno-metal-control { margin-bottom:13px; }
.suno-metal-customizer .suno-metal-control:last-child { margin-bottom:0; }
.suno-metal-customizer .suno-metal-slider-heading {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px;}
.suno-metal-customizer label {font-weight:650;color:#f1f3f7;}
.suno-metal-customizer output {font-variant-numeric:tabular-nums;font-weight:700;color:#fff;}
.suno-metal-customizer input[type="range"] {display:block;width:100%;height:38px;cursor:pointer;accent-color:var(--metal-accent,#f0be4a);touch-action:pan-x;}
.suno-metal-customizer .suno-slider-ends {display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#c5cbd3;}
.suno-metal-customizer .suno-metal-help {margin:0 0 12px;color:#d3dae4;font-size:12px;line-height:1.5;}
html[data-sunoweb-tuned="1"] .suno-metal-customizer input[type="range"] {accent-color:var(--metal-accent);}
/* The face sliders are separate from surface and border sliders. Previous
   release had one global tuned flag; a background change must not change
   button faces or cause pale/dark color bleed into foreground controls. */
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .btn-primary,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-library-filter-card .suno-filter-submit,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-library-filter-card .suno-playlist-chip.is-active,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-modern-player .global-main-play.suno-transport-button,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .car-btn.car-yellow:not(.suno-action),
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .car-playlist-chip.is-active,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-refresh-dialog-confirm,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .sunoweb-eq-mode .sunoweb-eq-mode-button[aria-pressed="true"] {
 background:linear-gradient(155deg,var(--metal-face-hi) 0%,var(--metal-face-accent) 31%,var(--metal-face-mid) 65%,var(--metal-face-accent) 85%,var(--metal-face-low) 100%)!important;
 color:var(--metal-face-ink,#ffffff)!important;
 text-shadow:0 1px 2px rgba(0,0,0,.45)!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 9px rgba(0,0,0,.2)!important;
}
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-modern-player .global-main-play.suno-transport-button:before {
 background:var(--metal-face-ink,#ffffff)!important;
}

/* V7: Secondary buttons, EQ mode controls and in-row actions also belong
   to the foreground group. Artwork/visualizers and borders are excluded. */
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-library-filter-card .suno-playlist-chip:not(.is-active),
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-library-filter-card .suno-filter-toggle,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-modern-player .global-player-button.suno-transport-button:not(.global-main-play),
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .car-btn:not(.suno-action):not(.car-yellow),
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .car-playlist-chip:not(.is-active),
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .sunoweb-eq-mode .sunoweb-eq-mode-button:not([aria-pressed="true"]),
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) #songsResults .suno-action.suno-action-details,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) #songsResults .suno-action-next,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) #songsResults .suno-action-queue {
 background:linear-gradient(155deg,var(--metal-face-control),var(--metal-face-control-dark))!important;
 color:#eef3f9!important;
}
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) #songsResults .suno-action.song-play-button:not(.btn-success) {
 --action-bg1:var(--metal-face-hi);
 --action-bg2:var(--metal-face-mid);
 --action-fore:var(--metal-face-ink,#ffffff);
}
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-download-trigger,
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) #songsResults .suno-action-download {
 --action-bg1:var(--metal-face-control);
 --action-bg2:var(--metal-face-control-dark);
 --action-fore:#eef3f9;
}
/* Native form controls keep accessible keyboard focus and a themed face.
   The accent outline remains a border property, controlled by background set. */
html[data-sunoweb-theme][data-sunoweb-face-tuned="1"]:not([data-sunoweb-theme="unused"]) .suno-metal-customizer input[type="range"] {accent-color:var(--metal-face-accent);}
.suno-metal-group-heading {font-size:13px;font-weight:750;color:#f4f6fa;margin:0 0 10px;}
.suno-metal-group-divider {border:0;border-top:1px solid rgba(202,211,227,.28);margin:5px 0 14px;}
/* Album art and colored visualization deliberately excluded. */
/* v7: One themed, touch-friendly volume face across Library, Car and Cover Art.
   car-web.css previously painted the track/thumb in hard-coded yellow.
   These rules are intentionally loaded from the common metallic stylesheet so
   all three screens follow the four theme controls, without moving the player
   or changing Car's ALPS-specific responsive grid/scrolling. */
html[data-sunoweb-theme] .suno-modern-player .global-player-volume input[type="range"] {
  --suno-volume-face: var(--metal-face-accent, var(--sw-gold, #f6c86c));
  --suno-volume-face-highlight: var(--metal-face-hi, var(--sw-gold-bright, #ffdf96));
  --suno-volume-face-dark: var(--metal-face-mid, var(--sw-gold, #d89e43));
  accent-color: var(--suno-volume-face);
}

/* Apply the same 48px touch area and metallic volume finish in all views.
   Keep the existing 320px limit and car layout width constraints intact. */
@media (max-width: 1024px) {
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    flex: 1 1 auto;
    width: 100%;
    max-width: 320px;
    min-width: 0;
    height: 48px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    transform: none;
    cursor: pointer;
    accent-color: var(--suno-volume-face);
    touch-action: pan-y;
  }
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume input[type="range"]::-webkit-slider-runnable-track {
    height: 12px;
    border-radius: 99px;
    border: 1px solid var(--suno-volume-face);
    background: linear-gradient(to right,
      var(--suno-volume-face) 0%, var(--suno-volume-face) var(--suno-volume-fill, 100%),
      #44505e var(--suno-volume-fill, 100%), #44505e 100%);
    box-shadow: inset 0 1px 3px rgba(0,0,0,.36);
  }
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    width: 34px;
    height: 34px;
    margin-top: -12px;
    border: 2px solid var(--metal-hi, var(--sw-gold-bright, #e1e6eb));
    border-radius: 50%;
    background: linear-gradient(150deg, var(--suno-volume-face-highlight), var(--suno-volume-face-dark));
    box-shadow: 0 2px 6px rgba(0,0,0,.55);
  }
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume input[type="range"]::-moz-range-track {
    box-sizing: border-box;
    height: 12px;
    border-radius: 99px;
    border: 1px solid var(--suno-volume-face);
    background: #44505e;
  }
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume input[type="range"]::-moz-range-progress {
    height: 12px;
    border-radius: 99px;
    background: var(--suno-volume-face);
  }
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume input[type="range"]::-moz-range-thumb {
    box-sizing: border-box;
    width: 34px;
    height: 34px;
    border: 2px solid var(--metal-hi, var(--sw-gold-bright, #e1e6eb));
    border-radius: 50%;
    background: var(--suno-volume-face);
    box-shadow: 0 2px 6px rgba(0,0,0,.55);
  }
  html[data-sunoweb-theme] .suno-modern-player:not(.suno-player-compact) .global-player-volume {
    min-width: 0;
    gap: 9px;
    align-items: center;
  }
}