:root {
  --black: #e6e9ef; 
  --white: #0f1115; 

  --blue: #6f8cff;
  --purple: #8a7dff;

  --surface-1: #111318;
  --surface-2: #151922;

  --card-bg: rgba(139, 141, 145, 0.9);
  --card-bg-hover: rgba(26, 31, 42, 0.95);

  --card-border: rgba(140, 160, 200, 0.18);
  --card-shadow: 0 10px 24px rgba(0, 0, 0, 0.4);

  --accent-soft: rgba(140, 160, 255, 0.7);

  --muted: #8b93a7;
  --border: #222938;

  --text-primary: #e6e9ef;
  --text-secondary: #9aa3b2;

  --danger: #ff6b6b;
  --success: #3ad29f;
  --warning: #f0b35a;
}

html.dark-mode #playlistTracksList,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist,
html.dark-mode #playlistTracksList .tracks-header,
html.dark-mode #playlistTracksList .track-row,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .tracks-header,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .track-row {
  background: var(--white);
  border-color: var(--border);
}

html.dark-mode #playlistTracksList .track-row:hover,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .track-row:hover {
  background: color-mix(in srgb, var(--black) 7%, var(--white));
}

html.dark-mode #playlistTracksList .track-row.sv-now-playing-track,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .track-row.sv-now-playing-track {
  background: color-mix(in srgb, var(--blue) 12%, var(--white));
}

html.dark-mode #playlistTracksList .track-btn:hover,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .track-btn:hover {
  background: color-mix(in srgb, var(--blue) 18%, transparent);
}

html,
body,
.main-content,
.navbar,
.admin-sidebar,
.admin-main {
  background: var(--white);
  color: var(--black);
}

html.dark-mode,
html.dark-mode body,
html.dark-mode .main-content,
html.dark-mode .modal-body,
html.dark-mode .desktop-sidebar-library-list,
html.dark-mode .sidebar-nav,
html.dark-mode .player-queue-list,
html.dark-mode .player-queue-panel-body,
html.dark-mode .add-playlist-scroll {
  scrollbar-width: thin;
  scrollbar-color: rgba(120, 164, 255, 0.45) transparent;
}

html.dark-mode::-webkit-scrollbar-thumb,
html.dark-mode body::-webkit-scrollbar-thumb,
html.dark-mode .main-content::-webkit-scrollbar-thumb,
html.dark-mode .modal-body::-webkit-scrollbar-thumb,
html.dark-mode .desktop-sidebar-library-list::-webkit-scrollbar-thumb,
html.dark-mode .sidebar-nav::-webkit-scrollbar-thumb,
html.dark-mode .player-queue-list::-webkit-scrollbar-thumb,
html.dark-mode .player-queue-panel-body::-webkit-scrollbar-thumb,
html.dark-mode .add-playlist-scroll::-webkit-scrollbar-thumb {
  background: rgba(120, 164, 255, 0.34);
}

html.dark-mode::-webkit-scrollbar-thumb:hover,
html.dark-mode body::-webkit-scrollbar-thumb:hover,
html.dark-mode .main-content::-webkit-scrollbar-thumb:hover,
html.dark-mode .modal-body::-webkit-scrollbar-thumb:hover,
html.dark-mode .desktop-sidebar-library-list::-webkit-scrollbar-thumb:hover,
html.dark-mode .sidebar-nav::-webkit-scrollbar-thumb:hover,
html.dark-mode .player-queue-list::-webkit-scrollbar-thumb:hover,
html.dark-mode .player-queue-panel-body::-webkit-scrollbar-thumb:hover,
html.dark-mode .add-playlist-scroll::-webkit-scrollbar-thumb:hover {
  background: rgba(120, 164, 255, 0.52);
}

.navbar,
.admin-sidebar,
.admin-main,
.nav-user-dropdown,
.search-form,
.admin-input,
input,
textarea,
select,
button,
.card,
.modal-content,
.lp-artist-card,
.lp-contract-scroll,
.lp-contract-iframe,
.sd-lyrics,
.sd-comments-count {
  border-color: var(--border);
}

.search-form {
  background: #161b26;
}

.search-form .search-input,
.admin-input,
input,
textarea,
select,
.dropdown-item,
.nav-link,
.nav-user,
.sd-credit-role,
.lp-contract-notice,
.lp-api-row code {
  color: var(--black);
}

input,
textarea,
select {
  background: #161b26;
}


html.dark-mode input[type="checkbox"] {
  background: #121824;
  border-color: rgba(120, 164, 255, 0.42);
}

html.dark-mode input[type="checkbox"]:checked {
  background: var(--blue);
  border-color: var(--blue);
}

html.dark-mode input[type="checkbox"]:checked::before {
  border-left-color: #0f121a;
  border-bottom-color: #0f121a;
}

html.dark-mode input[type="checkbox"]:focus-visible {
  box-shadow: 0 0 0 3px rgba(120, 164, 255, 0.28);
}

html.dark-mode input[type="range"] {
  accent-color: #78a4ff;
  background: transparent;
}

html.dark-mode input[type="range"]::-webkit-slider-runnable-track {
  background: #3a4b69;
}

html.dark-mode input[type="range"]::-webkit-slider-thumb {
  background: #f3f7ff;
  border-color: #24314a;
}

html.dark-mode input[type="range"]::-moz-range-track {
  background: #3a4b69;
}

html.dark-mode input[type="range"]::-moz-range-progress {
  background: #8cb5ff;
}

html.dark-mode input[type="range"]::-moz-range-thumb {
  background: #f3f7ff;
  border-color: #24314a;
}

html.dark-mode .error-page-card {
  background: #141a24;
  border-color: var(--border);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.36);
}

html.dark-mode .error-page-code {
  color: #d6e4ff;
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.4);
}

html.dark-mode .error-page-title {
  color: var(--black);
}

html.dark-mode .error-page-message,
html.dark-mode .error-page-hint {
  color: var(--text-secondary);
}

html.dark-mode .error-page-btn-primary {
  color: #0f121a;
  box-shadow: 0 10px 24px rgba(120, 164, 255, 0.26);
}

html.dark-mode .error-page-btn-secondary {
  background: #161b26;
  border-color: var(--border);
  color: var(--black);
}

html.dark-mode .error-page-btn-secondary:hover {
  border-color: rgba(120, 164, 255, 0.4);
  background: rgba(120, 164, 255, 0.16);
}

html.dark-mode .basic-landing-body {
  background: radial-gradient(circle at 50% -20%, rgba(120, 164, 255, 0.08), transparent 44%), #0f121a;
}

html.dark-mode .basic-header {
  background: rgba(15, 18, 26, 0.9);
  border-bottom-color: var(--border);
}

html.dark-mode .basic-nav a {
  color: var(--black);
}

html.dark-mode .basic-nav a:not(.basic-nav-btn):hover {
  background: rgba(120, 164, 255, 0.16);
  color: var(--blue);
}

html.dark-mode .basic-nav a.basic-nav-btn {
  background: var(--blue);
  color: var(--white);
}

html.dark-mode .basic-nav a.basic-nav-btn:hover {
  background: rgba(120, 164, 255, 0.85);
  color: var(--white);
}

html.dark-mode .basic-eyebrow {
  color: #d6e4ff;
  background: rgba(120, 164, 255, 0.15);
  border-color: rgba(120, 164, 255, 0.25);
}

html.dark-mode .basic-trust-row span {
  border-color: rgba(120, 164, 255, 0.2);
  background: rgba(120, 164, 255, 0.08);
  color: var(--black);
}

html.dark-mode .basic-hero-note {
  background: linear-gradient(180deg, #181d28, #121620);
  border-color: var(--border);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.2);
}

html.dark-mode .basic-hero-note li {
  color: var(--text-secondary);
}

html.dark-mode .basic-hero-copy p,
html.dark-mode .basic-feature-card p,
html.dark-mode .basic-cta-strip p,
html.dark-mode .basic-footer p {
  color: var(--text-secondary);
}

html.dark-mode .basic-feature-card {
  background: #141a24;
  border-color: var(--border);
}

html.dark-mode .basic-feature-card:hover {
  border-color: rgba(120, 164, 255, 0.3);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.35);
}

html.dark-mode .basic-cta-strip {
  background: linear-gradient(180deg, rgba(120, 164, 255, 0.15), rgba(120, 164, 255, 0.05));
  border-color: rgba(120, 164, 255, 0.2);
}

html.dark-mode .basic-footer {
  background: #121824;
  border-top-color: var(--border);
}

html.dark-mode .basic-footer a {
  color: var(--black);
}

html.dark-mode .basic-footer a:hover {
  color: var(--blue);
}

.search-input::placeholder,
input::placeholder,
textarea::placeholder,
.playlist-description,
.playlist-count,
.status-lock-icon,
.sd-detail-val,
.sd-credit-name,
.sd-description,
.lp-artist-handle {
  color: var(--text-secondary);
}

.nav-link:hover,
.nav-user:hover,
.dropdown-item:hover,
.admin-tab-link.active,
.admin-tab-link:hover,
.admin-map-link:hover,
.visibility-toggle:hover {
  background: rgba(120, 164, 255, 0.14);
}

.profile-social-link {
  background: rgba(120, 164, 255, 0.12);
  border-color: rgba(120, 164, 255, 0.3);
  color: var(--black);
}

.profile-social-link:hover {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.42);
  color: var(--blue);
}

html.dark-mode .connections-header {
  border-color: rgba(120, 164, 255, 0.26);
  background: linear-gradient(162deg, rgba(120, 164, 255, 0.16), rgba(15, 18, 26, 0.96) 55%);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.34);
}

html.dark-mode .connections-list {
  background: transparent;
}

html.dark-mode .connection-item {
  border-color: rgba(120, 164, 255, 0.24);
  background: linear-gradient(160deg, rgba(18, 24, 36, 0.98), rgba(14, 20, 34, 0.98));
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.34);
}

html.dark-mode .connection-item:hover {
  border-color: rgba(120, 164, 255, 0.44);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.42);
}

html.dark-mode .connection-avatar {
  border-color: rgba(120, 164, 255, 0.34);
  box-shadow: 0 10px 20px rgba(120, 164, 255, 0.2);
}

html.dark-mode .connection-item:last-child {
  border-bottom-color: rgba(120, 164, 255, 0.24);
}

.role-badge,
.lp-artist-badge {
  background: rgba(120, 164, 255, 0.16);
  color: var(--blue);
}

.visibility-toggle {
  background: rgba(22, 27, 38, 0.95);
  color: var(--text-secondary);
}

.auth-form-container,
.add-playlist-card {
  background: linear-gradient(180deg, #141a24 0%, #111723 100%);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}

html.dark-mode .alert-success {
  background: rgba(16, 185, 129, 0.12);
  color: #7ee0b8;
  border-color: rgba(126, 224, 184, 0.22);
}

html.dark-mode .alert-danger,
html.dark-mode .alert-error {
  background: rgba(239, 68, 68, 0.12);
  color: #ff9aa1;
  border-color: rgba(255, 154, 161, 0.22);
}

html.dark-mode .alert-warning {
  background: rgba(245, 158, 11, 0.12);
  color: #f4cd7a;
  border-color: rgba(244, 205, 122, 0.22);
}

html.dark-mode .alert-info {
  background: rgba(120, 164, 255, 0.12);
  color: #a9c2ff;
  border-color: rgba(169, 194, 255, 0.22);
}

html.dark-mode .add-playlist-scroll {
  background: #111723;
  border-color: var(--border);
}

html.dark-mode .add-playlist-summary {
  color: var(--text-secondary);
}

html.dark-mode .add-playlist-loading,
html.dark-mode .add-playlist-empty {
  background: #161b26;
  border-color: var(--border);
  color: var(--text-secondary);
}

html.dark-mode .desktop-download-card {
  background: linear-gradient(180deg, #141a24 0%, #111723 100%);
  border-color: var(--border);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

html.dark-mode .desktop-download-card:hover {
  border-color: rgba(120, 164, 255, 0.44);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.42);
}

html.dark-mode .desktop-download-card-icon {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.16);
}

html.dark-mode .desktop-download-card-content p {
  color: var(--text-secondary);
}

.lp-artist-card-top,
.sd-lyrics,
.lp-signature-canvas {
  background: #161b26;
}

html.dark-mode .sd-lyrics-tag {
  color: var(--text-secondary);
}

html.dark-mode .lyrics-editor-subtitle,
html.dark-mode .lyrics-sync-status,
html.dark-mode .lyrics-sync-row-tag {
  color: var(--text-secondary);
}

html.dark-mode .lyrics-sync-list {
  background: #161b26;
  border-color: var(--border);
}

html.dark-mode .lyrics-sync-row.is-current {
  background: rgba(120, 164, 255, 0.14);
  outline-color: rgba(120, 164, 255, 0.34);
}

html.dark-mode .lyrics-sync-row-time {
  color: #9facc6;
}

html.dark-mode .lyrics-sync-row-text {
  color: var(--black);
}

html.dark-mode .lyrics-word-sync-word {
  background: #1b2332;
  border-color: #2a3344;
  color: var(--black);
}

html.dark-mode .lyrics-word-sync-word.is-synced {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.42);
}

html.dark-mode .lyrics-word-sync-word.is-preview {
  background: rgba(120, 164, 255, 0.26);
  border-color: rgba(120, 164, 255, 0.58);
  color: #e3eeff;
}

html.dark-mode .lyrics-word-sync-word.is-preview-add {
  background: rgba(120, 164, 255, 0.3);
  border-color: rgba(145, 182, 255, 0.62);
}

html.dark-mode .lyrics-word-sync-word.is-preview-undo {
  background: rgba(255, 170, 90, 0.22);
  border-color: rgba(255, 170, 90, 0.52);
  color: #ffd7b2;
}

html.dark-mode .lyrics-word-sync-word.is-last-synced {
  background: rgba(46, 202, 146, 0.2);
  border-color: rgba(72, 225, 170, 0.48);
  color: #a7f5d8;
}

html.dark-mode .lyrics-word-sync-word-time {
  color: #aeb8cd;
}

html.dark-mode .lyrics-word-sync-mobile-meta {
  color: #9fc0ff;
}

html.dark-mode .lyrics-word-sync-mobile-time {
  color: #a8b6d2;
}

html.dark-mode .lyrics-word-sync-mobile-line {
  background: #161b26;
  border-color: var(--border);
}

html.dark-mode .lyrics-word-sync-mobile-line::-webkit-scrollbar-thumb {
  background: rgba(120, 164, 255, 0.44);
}

html.dark-mode .lyrics-word-sync-mobile-swipe {
  border-color: rgba(120, 164, 255, 0.42);
  background: rgba(120, 164, 255, 0.14);
}

html.dark-mode .lyrics-word-sync-mobile-swipe-fill {
  background: linear-gradient(90deg, rgba(120, 164, 255, 0.2), rgba(120, 164, 255, 0.42));
}

html.dark-mode .lyrics-word-sync-mobile-swipe-thumb {
  background: var(--blue);
  color: #0f121a;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.42);
}

html.dark-mode .lyrics-word-sync-mobile-swipe-label {
  color: #d9e7ff;
}

.lp-signature-canvas {
  border-color: var(--border);
}

.lp-api-row code {
  background: rgba(120, 164, 255, 0.12);
}

.sd-comments-count {
  background: #1b2130;
}

a,
.form-footer a,
.search-btn:hover,
.dropdown-item:hover,
.admin-tab-link.active,
.admin-tab-link:hover,
.admin-map-link:hover {
  color: var(--blue);
}

.register-link {
  background: var(--blue);
  color: #0f121a;
}

.register-link:hover {
  background: var(--purple);
}

.modal-footer,
.sd-comments,
.dropdown-item hr,
.lp-artist-card-top {
  border-color: var(--border);
}

html.dark-mode .sd-comment-action,
html.dark-mode .sd-comment-load-replies,
html.dark-mode .sd-comments-load-more,
html.dark-mode .player-expanded-comment-seek {
  background: #161b26;
  border-color: var(--border);
  color: var(--text-secondary);
}

html.dark-mode .sd-comment-action.primary,
html.dark-mode .comment-mention-link {
  color: var(--blue);
}

html.dark-mode .sd-comment-action.is-liked {
  color: var(--blue);
  border-color: rgba(26, 92, 255, 0.45);
  background: rgba(26, 92, 255, 0.14);
}

html.dark-mode .sd-comment-action.danger {
  color: #ff9a9a;
}

html.dark-mode .sd-comment-replies {
  border-left-color: var(--border);
}

html.dark-mode .sd-comment-input-wrap textarea,
html.dark-mode .sd-comment-reply-text,
html.dark-mode .player-expanded-comments-compose textarea {
  background: #161b26;
  border-color: var(--border);
  color: var(--black);
}

html.dark-mode .player-comments-panel {
  background: #0f121a;
  border-color: var(--border);
}

html.dark-mode .player-comments-panel .player-queue-panel-header {
  background: #0f121a;
  border-bottom-color: var(--border);
}

html.dark-mode .player-expanded-comment-item {
  background: #161b26;
  border-color: var(--border);
}

html.dark-mode .player-expanded-comment-author {
  color: var(--black);
}

html.dark-mode .player-expanded-comment-text,
html.dark-mode .player-expanded-comments-empty,
html.dark-mode .player-expanded-comments-track,
html.dark-mode .player-expanded-comments-login {
  color: var(--text-secondary);
}


.sd-chip {
  background: var(--white);
  color: var(--black);
}

html.dark-mode .detail-context-menu-trigger {
  background: rgba(12, 18, 30, 0.78);
  border-color: rgba(120, 164, 255, 0.3);
  color: #e7efff;
}

html.dark-mode .detail-context-menu-trigger:hover {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.48);
  color: #ffffff;
}

html.dark-mode .artist-release-context-trigger {
  background: rgba(12, 18, 30, 0.78);
  border-color: rgba(120, 164, 255, 0.3);
  color: #e7efff;
}

html.dark-mode .artist-release-context-trigger:hover {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.48);
  color: #ffffff;
}

html.dark-mode .artist-hub-release-expand-btn {
  background: rgba(12, 18, 30, 0.78);
  border-color: rgba(120, 164, 255, 0.3);
  color: #e7efff;
}

html.dark-mode .artist-hub-release-expand-btn:hover {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.48);
  color: #ffffff;
}

html.dark-mode .hub-tabs {
  border-color: rgba(120, 164, 255, 0.22);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .hub-tab {
  color: var(--text-secondary);
}

html.dark-mode .hub-tab:hover {
  color: #d8e7ff;
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .hub-tab.active {
  color: #d8e7ff;
  border-color: rgba(120, 164, 255, 0.32);
  background: rgba(18, 24, 36, 0.72);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

html.dark-mode #editReleaseModal {
  --edit-release-loading-border: rgba(120, 164, 255, 0.24);
  --edit-release-loading-background: linear-gradient(145deg, rgba(20, 28, 42, 0.88), rgba(13, 18, 29, 0.92));
  --edit-release-loading-shadow: 0 22px 54px rgba(0, 0, 0, 0.34);
  --edit-release-loading-spinner-track: rgba(120, 164, 255, 0.2);
  --edit-release-loading-spinner-accent: rgba(164, 198, 255, 0.92);
  --edit-release-loading-copy: rgba(223, 234, 255, 0.92);
  --edit-release-loading-dim-opacity: 0.4;
  --edit-release-loading-dim-filter: blur(0.45px) saturate(0.92);
  --edit-release-loading-shimmer: linear-gradient(90deg, rgba(65, 82, 112, 0.3) 18%, rgba(117, 145, 196, 0.42) 50%, rgba(65, 82, 112, 0.3) 82%);
}

html.dark-mode .artist-hub-release-item.is-expanded {
  --artist-release-grad-a: rgba(134, 154, 182, 0.34);
  --artist-release-grad-b: rgba(102, 144, 164, 0.24);
  --artist-release-grad-c: rgba(84, 112, 146, 0.22);
  --artist-release-grad-d: rgba(17, 25, 37, 0.12);
  border-color: rgba(140, 162, 186, 0.38);
  background: linear-gradient(180deg, rgba(100, 124, 152, 0.2), rgba(18, 24, 36, 0.97));
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.36);
}

html.dark-mode .artist-hub-release-item {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(18, 24, 36, 0.62);
}

html.dark-mode .artist-hub-discord-banner {
  border-color: rgba(126, 145, 255, 0.44);
  background:
    radial-gradient(125% 160% at 2% -20%, rgba(120, 138, 255, 0.34), transparent 55%),
    radial-gradient(125% 160% at 100% 120%, rgba(120, 138, 255, 0.22), transparent 52%),
    linear-gradient(128deg, rgba(120, 138, 255, 0.2), rgba(23, 32, 54, 0.94) 56%, rgba(15, 20, 33, 0.98));
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.35);
}

html.dark-mode .artist-hub-discord-banner:hover {
  border-color: rgba(148, 166, 255, 0.62);
  box-shadow: 0 20px 36px rgba(0, 0, 0, 0.44);
}

html.dark-mode .playlists-header {
  border-color: rgba(126, 145, 255, 0.44) !important;
  background:
    radial-gradient(125% 160% at 2% -20%, rgba(120, 138, 255, 0.34), transparent 55%),
    radial-gradient(125% 160% at 100% 120%, rgba(120, 138, 255, 0.22), transparent 52%),
    linear-gradient(128deg, rgba(120, 138, 255, 0.2), rgba(23, 32, 54, 0.94) 56%, rgba(15, 20, 33, 0.98)) !important;
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.35) !important;
}

html.dark-mode .playlists-header:hover {
  border-color: rgba(148, 166, 255, 0.62) !important;
  box-shadow: 0 20px 36px rgba(0, 0, 0, 0.44) !important;
}

html.dark-mode .artist-hub-discord-eyebrow {
  color: #c4d1ff;
}

html.dark-mode .artist-hub-discord-copy small {
  color: rgba(214, 225, 245, 0.82);
}

html.dark-mode .artist-hub-discord-cta {
  border-color: rgba(132, 152, 255, 0.44);
  background: rgba(120, 138, 255, 0.2);
  color: #e5ebff;
}

html.dark-mode .artist-hub-release-item::before {
  background:
    radial-gradient(140% 170% at 8% -34%, var(--artist-release-grad-a), transparent 57%),
    radial-gradient(155% 185% at 112% -38%, var(--artist-release-grad-b), transparent 63%),
    linear-gradient(132deg, var(--artist-release-grad-c), var(--artist-release-grad-d));
}

html.dark-mode .artist-hub-release-item .artist-hub-release-tracks {
  border-top-color: rgba(132, 152, 178, 0.28);
}

html.dark-mode .artist-hub-release-track-row {
  border-color: rgba(124, 146, 174, 0.28);
  background: linear-gradient(150deg, rgba(19, 26, 40, 0.96), rgba(16, 24, 37, 0.96));
}

html.dark-mode .artist-hub-release-track-row:hover {
  border-color: rgba(152, 174, 198, 0.52);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.32);
}

html.dark-mode .artist-hub-release-tracks-empty {
  border-color: rgba(126, 148, 176, 0.34);
  color: var(--text-secondary);
  background: rgba(118, 142, 170, 0.08);
}

html.dark-mode .release-track-row-focus {
  border-color: rgba(120, 164, 255, 0.7) !important;
  box-shadow: 0 0 0 3px rgba(120, 164, 255, 0.24), 0 16px 28px rgba(0, 0, 0, 0.38) !important;
  background: linear-gradient(155deg, rgba(120, 164, 255, 0.18), rgba(84, 194, 255, 0.14)) !important;
}

html.dark-mode .artist-hub-releases-list .artist-hub-release-item.is-expanded:hover {
  background: linear-gradient(180deg, rgba(100, 124, 152, 0.2), rgba(18, 24, 36, 0.97));
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.36);
}

html.dark-mode .artist-hub-releases-list .artist-hub-release-item.is-expanded:hover::before {
  opacity: 1;
}

html.dark-mode .lp-stat {
  background: #161b26 !important;
}

html.dark-mode .lp-list-item:hover {
  background: #171d2a !important;
}

html.dark-mode .lp-artist-card-top {
  background: #161b26 !important;
  border-bottom-color: var(--border) !important;
}

html.dark-mode .lp-token-box {
  background: #161b26 !important;
  color: var(--black) !important;
}

html.dark-mode .lp-api-row code {
  background: rgba(120, 164, 255, 0.12) !important;
}

html.dark-mode .lp-contract-scroll,
html.dark-mode .lp-signature-canvas {
  background: #161b26 !important;
}

html.dark-mode .lp-upload-progress-track {
  background: #2a3040 !important;
}

html.dark-mode .lp-stats-table {
  border-collapse: collapse;
  color: var(--black);
}

html.dark-mode .lp-stats-table th,
html.dark-mode .lp-stats-table td {
  border-bottom: 1px solid var(--border);
  color: var(--black);
  background: transparent;
  text-align: left;
  padding: 10px 12px;
}

html.dark-mode .lp-stats-table thead th {
  color: var(--text-secondary);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

html.dark-mode .lp-details-note {
  background: rgba(120, 164, 255, 0.1);
  border-color: rgba(120, 164, 255, 0.28);
  color: var(--text-secondary);
}

html.dark-mode .lp-details-card {
  background: #121824;
  border-color: var(--border);
}

html.dark-mode .lp-media-preview {
  background: #161b26;
  border-color: var(--border);
}

html.dark-mode .lp-media-fallback {
  color: var(--text-secondary);
}

html.dark-mode .handle-suggestions {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

html.dark-mode .suggestion-chip {
  display: inline-block;
  background-color: #1a2130 !important;
  border: 1px solid #33405a !important;
  color: #dbe7ff !important;
  padding: 6px 12px;
  border-radius: 20px;
  cursor: pointer;
  font-size: 13px;
  transition: all 0.2s;
}

html.dark-mode .suggestion-chip:hover {
  background-color: #26324a !important;
  border-color: #5d79b7 !important;
  color: #ffffff !important;
}

html.dark-mode .error-message {
  color: #ff6f6f;
}

html.dark-mode .success-message {
  color: #54e4a6;
}

html.dark-mode body.auth-page {
  background: #0b0f17;
}

html.dark-mode .auth-page .main-content {
  background: #0b0f17;
}

html.dark-mode .auth-split {
  background: #0b0f17;
}

html.dark-mode .auth-visual {
  background:
    radial-gradient(circle at 16% 18%, rgba(120, 164, 255, 0.24), transparent 44%),
    radial-gradient(circle at 84% 20%, rgba(127, 158, 255, 0.2), transparent 48%),
    radial-gradient(circle at 76% 84%, rgba(100, 137, 255, 0.22), transparent 42%),
    linear-gradient(180deg, rgba(20, 26, 36, 0.88), rgba(15, 18, 26, 0.96));
}

html.dark-mode .auth-visual::before {
  background: radial-gradient(circle, rgba(120, 164, 255, 0.3), rgba(120, 164, 255, 0));
}

html.dark-mode .auth-visual::after {
  background: radial-gradient(circle, rgba(132, 161, 255, 0.28), rgba(132, 161, 255, 0));
}

html.dark-mode .auth-visual-tile {
  border-color: rgba(43, 49, 64, 0.9);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.4);
  background: linear-gradient(145deg, rgba(24, 30, 42, 0.96), rgba(17, 22, 32, 0.94));
}

html.dark-mode .auth-visual-tile::before {
  opacity: 0.9;
  filter: saturate(1.2) brightness(0.86);
}

html.dark-mode .auth-visual-tile::after {
  background:
    linear-gradient(180deg, rgba(8, 12, 20, 0.22), rgba(8, 12, 20, 0.46)),
    linear-gradient(120deg, rgba(120, 164, 255, 0.24), rgba(120, 164, 255, 0.02) 44%);
}

html.dark-mode .auth-visual-fade {
  background: linear-gradient(90deg, rgba(11, 15, 23, 0.08) 0%, rgba(11, 15, 23, 0.4) 55%, rgba(11, 15, 23, 0.9) 100%);
}

html.dark-mode .auth-brand-accent {
  color: var(--blue);
}

html.dark-mode .auth-page-register .register-wizard-pill {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #dbe7ff;
}

html.dark-mode .auth-page-register .register-wizard-pill.is-active {
  background: rgba(120, 164, 255, 0.18);
  border-color: rgba(120, 164, 255, 0.34);
  color: #ffffff;
}

html.dark-mode .auth-google-btn {
  background: #161b26;
  border-color: rgba(120, 164, 255, 0.3);
  color: #dce8ff;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.3);
}

html.dark-mode .auth-google-btn:hover {
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.4);
}

html.dark-mode .auth-social-divider {
  color: #9da9c1;
}

html.dark-mode .auth-social-divider::before,
html.dark-mode .auth-social-divider::after {
  background: rgba(120, 164, 255, 0.26);
}

html.dark-mode .auth-page .main-content,
html.dark-mode .auth-split {
  background: #0f1117;
}

html.dark-mode .auth-form-container {
  background: #11141b;
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: none;
}

html.dark-mode .auth-form-container h2 {
  color: #f5f7ff;
}

html.dark-mode .auth-submit-btn {
  background: var(--blue);
  box-shadow: none;
}

html.dark-mode body.oauth-page {
  background:
    radial-gradient(circle at 12% 8%, rgba(120, 164, 255, 0.22), transparent 38%),
    radial-gradient(circle at 85% 18%, rgba(138, 164, 255, 0.18), transparent 34%),
    linear-gradient(180deg, #0b0f17 0%, #0f121a 100%);
}

html.dark-mode .oauth-card {
  background: linear-gradient(180deg, #141a24 0%, #111723 100%);
  border-color: var(--border);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4);
}

html.dark-mode .oauth-header,
html.dark-mode .oauth-actions {
  border-color: var(--border);
}

html.dark-mode .oauth-app-name,
html.dark-mode .oauth-user-name,
html.dark-mode .oauth-scope-label,
html.dark-mode .oauth-error-text,
html.dark-mode .oauth-login-form label {
  color: var(--black);
}

html.dark-mode .oauth-developer,
html.dark-mode .oauth-user-handle,
html.dark-mode .oauth-scope-desc,
html.dark-mode .oauth-footer-note,
html.dark-mode .oauth-error-sub,
html.dark-mode .oauth-section-title {
  color: var(--text-secondary);
}

html.dark-mode .oauth-scope-item {
  background: rgba(120, 164, 255, 0.1);
  border-color: rgba(120, 164, 255, 0.26);
}

html.dark-mode .oauth-scope-icon {
  background: linear-gradient(135deg, #6f8cff 0%, #8a7dff 100%);
  color: #0f121a;
}

html.dark-mode .oauth-user-card {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.3);
}

html.dark-mode .oauth-user-avatar-fallback {
  background: linear-gradient(135deg, #6f8cff 0%, #8a7dff 100%);
  color: #0f121a;
}

html.dark-mode .oauth-login-form input {
  background: #161b26;
  border-color: var(--border);
  color: var(--black);
}

html.dark-mode .oauth-login-form input:focus {
  border-color: rgba(120, 164, 255, 0.72);
  box-shadow: 0 0 0 3px rgba(120, 164, 255, 0.24);
}

html.dark-mode .oauth-btn-deny {
  background: #161b26;
  border-color: var(--border);
  color: var(--text-secondary);
}

html.dark-mode .oauth-btn-deny:hover {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.36);
  color: var(--black);
}

html.dark-mode .oauth-btn-allow {
  background: linear-gradient(135deg, #6f8cff 0%, #8a7dff 100%);
  color: #0f121a;
  box-shadow: 0 12px 26px rgba(120, 164, 255, 0.3);
}

html.dark-mode .oauth-btn-allow:hover {
  box-shadow: 0 16px 30px rgba(120, 164, 255, 0.4);
}

html.dark-mode .oauth-login-error {
  background: rgba(255, 107, 107, 0.14);
  border-color: rgba(255, 107, 107, 0.32);
  color: #ffb3b3;
}

html.dark-mode .mobile-top-nav {
  background: transparent;
  border-bottom-color: transparent;
}

html.dark-mode body.mobile-top-scrolled .mobile-top-nav {
  background: rgba(15, 18, 26, 0.88);
  border-bottom-color: rgba(43, 49, 64, 0.92);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
}

html.dark-mode .mobile-top-nav-action,
html.dark-mode .mobile-top-nav-icon-btn {
  color: var(--black);
  background: rgba(18, 24, 36, 0.72);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
}

html.dark-mode .mobile-top-nav-back {
  color: var(--black);
  background: rgba(18, 24, 36, 0.72);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
}

html.dark-mode .mobile-top-nav-back:active {
  background: rgba(120, 164, 255, 0.18);
}

html.dark-mode .mobile-top-nav-avatar {
  border-color: var(--surface-1);
  box-shadow: 0 10px 20px var(--surface-2);
}

html.dark-mode .mobile-top-search-wrap {
  background: var(--surface-1);
  border-bottom-color: var(--surface-2);
}

html.dark-mode .mobile-library-edit-wrap {
  background: var(--surface-1);
  border-bottom-color: var(--surface-2);
}

html.dark-mode .mobile-library-edit-inner {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.3);
}

html.dark-mode .mobile-library-edit-label {
  color: var(--text-secondary);
}

html.dark-mode .mobile-library-edit-toggle {
  background: var(--blue);
  color: #0f121a;
}

html.dark-mode .mobile-library-create-btn {
  background: #151b27;
  border-color: rgba(120, 164, 255, 0.38);
  color: #a7c4ff;
}

html.dark-mode .invite-code-row {
  background: #161b26;
  border-color: var(--border);
}

html.dark-mode .invite-code-code {
  color: #ffffff;
}

html.dark-mode .invite-code-meta {
  color: var(--text-secondary);
}

html.dark-mode .invite-badge-used {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.75);
}

html.dark-mode body.mobile-library-edit-mode .mobile-library-edit-toggle {
  background: #5f8fe8;
  color: #0f121a;
}

html.dark-mode .mobile-top-search-form {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.3);
}

html.dark-mode .mobile-top-search-form input {
  color: var(--black);
}

html.dark-mode .mobile-top-search-form input::placeholder {
  color: var(--text-secondary);
}

html.dark-mode .mobile-top-search-form > button {
  background: var(--blue);
  color: #0f121a;
}

html.dark-mode .mobile-account-overlay {
  background: rgba(2, 4, 8, 0.45);
}

html.dark-mode .mobile-account-panel {
  background: var(--white);
}

html.dark-mode .mobile-account-panel-body {
  background:
    radial-gradient(980px 300px at 12% -12%, rgba(96, 142, 228, 0.2), transparent 58%),
    linear-gradient(180deg, #0f1624 0%, #0c1220 78%);
}

html.dark-mode .mobile-account-profile-card {
  border-color: rgba(112, 146, 212, 0.38);
  background: rgba(12, 20, 36, 0.62);
  backdrop-filter: blur(12px) saturate(122%);
  box-shadow: 0 12px 24px rgba(2, 8, 18, 0.42);
}

html.dark-mode .mobile-account-profile-card:hover {
  border-color: rgba(128, 166, 233, 0.52);
  background: rgba(14, 24, 42, 0.72);
  box-shadow: 0 14px 26px rgba(2, 8, 18, 0.48);
}

html.dark-mode .mobile-account-profile-card:focus-visible {
  outline-color: rgba(124, 170, 255, 0.56);
}

html.dark-mode .mobile-account-profile-avatar {
  border-color: rgba(145, 178, 236, 0.28);
}

html.dark-mode .mobile-account-profile-avatar-fallback {
  background: linear-gradient(145deg, rgba(60, 112, 224, 0.26), rgba(38, 86, 190, 0.38));
  color: #9cc2ff;
}

html.dark-mode .mobile-account-profile-name {
  color: #f2f7ff;
}

html.dark-mode .mobile-account-profile-handle {
  color: rgba(188, 206, 236, 0.72);
}

html.dark-mode .mobile-account-section-title {
  color: rgba(181, 198, 229, 0.6);
}

html.dark-mode .mobile-account-panel-header {
  border-bottom-color: var(--border);
}

html.dark-mode .mobile-account-close {
  border-color: var(--border);
  color: var(--black);
  background: #161b26;
}

html.dark-mode .mobile-account-link {
  border-color: rgba(92, 118, 167, 0.38);
  background: rgba(11, 19, 33, 0.6);
  backdrop-filter: blur(10px) saturate(120%);
  color: var(--black);
  box-shadow: 0 10px 20px rgba(2, 8, 18, 0.36);
}

html.dark-mode .mobile-account-link i {
  background: rgba(26, 92, 255, 0.2);
}

html.dark-mode .mobile-account-link-title {
  color: #f2f7ff;
}

html.dark-mode .mobile-account-link-subtitle {
  color: rgba(176, 194, 224, 0.72);
}

html.dark-mode .mobile-account-link::after {
  color: rgba(176, 191, 220, 0.62);
}

html.dark-mode .mobile-account-link:hover {
  border-color: rgba(124, 156, 220, 0.56);
  background: rgba(14, 24, 42, 0.72);
  box-shadow: 0 14px 24px rgba(2, 8, 18, 0.44);
}

html.dark-mode .mobile-account-link:hover::after {
  color: rgba(116, 165, 255, 0.88);
}

html.dark-mode .mobile-account-link-danger {
  border-color: rgba(212, 76, 92, 0.42);
  background: rgba(49, 20, 28, 0.62);
}

html.dark-mode .mobile-account-link-danger i {
  background: rgba(212, 76, 92, 0.2);
}

html.dark-mode .mobile-account-link-danger .mobile-account-link-title,
html.dark-mode .mobile-account-link-danger .mobile-account-link-subtitle {
  color: rgba(255, 166, 176, 0.96);
}

html.dark-mode .mobile-account-link-danger::after {
  color: rgba(255, 122, 140, 0.84);
}

html.dark-mode .mobile-account-link-badge,
html.dark-mode .sidebar-link-badge,
html.dark-mode .messages-conversation-unread {
  color: #0f121a;
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 6px 16px rgba(224, 49, 82, 0.45);
}

html.dark-mode .custom-context-menu-account-head {
  border-bottom-color: rgba(117, 146, 210, 0.28);
  color: #edf2ff;
}

html.dark-mode .custom-context-menu-account-avatar {
  border-color: rgba(117, 146, 210, 0.45);
}

html.dark-mode .custom-context-menu-account-avatar-fallback {
  background: rgba(122, 163, 255, 0.14);
  color: #9ec0ff;
}

html.dark-mode .custom-context-menu-account-copy small,
html.dark-mode .custom-context-menu-account-head > .fas {
  color: #9eaad1;
}

html.dark-mode .mobile-bottom-nav {
  background: rgba(15, 18, 26, 0.9);
  border-top-color: rgba(43, 49, 64, 0.92);
}

html.dark-mode .mobile-bottom-link {
  color: var(--text-secondary);
}

html.dark-mode .mobile-bottom-link.is-active {
  color: var(--blue);
}

html.dark-mode .artist-setting-toggle-row {
  color: var(--black);
}

html.dark-mode .verification-submit-btn {
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.22);
}

html.dark-mode .artist-hub-verification-btn {
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.24);
}

html.dark-mode .verification-requirement-icon.is-passed {
  color: #3ad29f;
}

html.dark-mode .verification-requirement-icon.is-pending {
  color: rgba(154, 163, 178, 0.9);
}

html.dark-mode .verification-preview-card {
  border-color: rgba(120, 164, 255, 0.24);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .verification-preview-avatar {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .artist-settings-status {
  color: var(--text-secondary);
}

html.dark-mode .settings-tabs {
  border-color: rgba(120, 164, 255, 0.22);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .settings-tab {
  color: var(--text-secondary);
}

html.dark-mode .settings-tab:hover {
  color: #d8e7ff;
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .settings-tab.active {
  color: #d8e7ff;
  border-color: rgba(120, 164, 255, 0.32);
  background: rgba(18, 24, 36, 0.72);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

html.dark-mode .settings-container .settings-form > .form-group,
html.dark-mode .settings-profile-main,
html.dark-mode .settings-profile-social-card,
html.dark-mode .settings-container .preferences-card {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(18, 24, 36, 0.58);
}

html.dark-mode .settings-container .danger-section {
  border-color: rgba(248, 113, 113, 0.28);
  background: rgba(248, 113, 113, 0.08);
}

html.dark-mode .presave-status-note,
html.dark-mode .presave-track-list .track-actions-disabled {
  color: var(--text-secondary);
}

html.dark-mode .presave-toggle-btn {
  box-shadow: none;
}

html.dark-mode .presave-toggle-btn.is-presaved {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(24, 34, 55, 0.597);
  color: #dbe7ff;
}

html.dark-mode .profile-upcoming-card {
  border-color: rgba(120, 164, 255, 0.35);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.28);
}

html.dark-mode .profile-upcoming-countdown {
  border-color: rgba(120, 164, 255, 0.36);
  background: linear-gradient(130deg, rgba(120, 164, 255, 0.2), rgba(18, 24, 36, 0.96));
  box-shadow: 0 12px 22px rgba(0, 0, 0, 0.3);
}

html.dark-mode .profile-upcoming-kicker {
  color: #bfd6ff;
}

html.dark-mode .profile-upcoming-subtitle {
  color: var(--text-secondary);
}

html.dark-mode .profile-upcoming-timer {
  color: var(--text-primary);
}

html.dark-mode .sidebar-footer-links .footer-link {
  color: var(--text-secondary);
}

html.dark-mode .sidebar {
  background: transparent;
  border-right: 1px solid var(--border);
}

html.dark-mode .desktop-top-navbar {
  background: transparent;
}

html.dark-mode .desktop-top-navbar::before {
  bottom:-88px;
  background:linear-gradient(to bottom,rgba(12,15,21,.98) 0%,rgba(12,15,21,.94) 30%,rgba(12,15,21,.78) 52%,rgba(12,15,21,.48) 70%,rgba(12,15,21,.18) 86%,transparent 100%);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 34%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.42) 80%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 34%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.42) 80%,transparent 100%);
}

html.dark-mode .desktop-navbar-link {
  color: var(--text-primary);
  border-color: #252c39;
  background: #151922;
}

html.dark-mode .desktop-primary-nav-group {
  border-color:#303849;
  background:#151922;
}

html.dark-mode body.discovery-page-active .desktop-primary-nav-group {
  border:0;
  background:transparent;
}

html.dark-mode body:not(.discovery-page-active) .desktop-library-nav-link {
  border-left-color:#303849;
}

html.dark-mode .desktop-navbar-link:hover,
html.dark-mode .desktop-navbar-link.is-active {
  color: #f2f5fb;
  border-color: #405071;
  background: #2a3550;
}

html.dark-mode .desktop-navbar-search-form {
  background: #151922;
  border-color: #303849;
  box-shadow: none;
}

html.dark-mode .desktop-sidebar-library-head {
  border-bottom-color: var(--border);
}

html.dark-mode .desktop-sidebar-library-create {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.14);
  color: #d8e7ff;
}

html.dark-mode .desktop-sidebar-library-item {
  color: var(--text-primary);
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(18, 24, 36, 0.46);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03);
}

html.dark-mode .desktop-sidebar-library-item:focus-visible {
  border-color: rgba(120, 164, 255, 0.56);
  box-shadow: 0 0 0 2px rgba(120, 164, 255, 0.24);
}

html.dark-mode .desktop-sidebar-library-item:hover,
html.dark-mode .desktop-sidebar-library-item.is-active {
  color: var(--blue);
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.13);
  box-shadow: 0 7px 18px rgba(0, 0, 0, 0.18);
}

html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-create {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-download {
  border-color: rgba(120, 164, 255, 0.22);
  background: rgba(18, 24, 36, 0.4);
}

html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-create:hover,
html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-create:focus-visible {
  border-color: rgba(120, 164, 255, 0.58);
  background: rgba(120, 164, 255, 0.22);
}

html.dark-mode .desktop-sidebar-library-icon {
  border-color: rgba(120, 164, 255, 0.26);
  background: rgba(120, 164, 255, 0.1);
  color: #d8e7ff;
}

html.dark-mode .desktop-sidebar-library-meta {
  color: var(--text-secondary);
}

html.dark-mode .desktop-sidebar-library-loading,
html.dark-mode .desktop-sidebar-library-empty {
  border-color: rgba(120, 164, 255, 0.26);
  background: rgba(18, 24, 36, 0.42);
  color: var(--text-secondary);
}

html.dark-mode .desktop-sidebar-library-skeleton .desktop-sidebar-library-icon,
html.dark-mode .desktop-sidebar-skeleton-line,
html.dark-mode .library-card-skeleton .playlist-cover,
html.dark-mode .library-skeleton-line {
  background: linear-gradient(90deg, rgba(120, 164, 255, 0.08), rgba(120, 164, 255, 0.16), rgba(120, 164, 255, 0.08));
  background-size: 220% 100%;
}

html.dark-mode .sidebar-resize-handle::before {
  background: rgba(120, 164, 255, 0.4);
}

html.dark-mode .sidebar::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: #0b1018;
  pointer-events: none;
}

html.dark-mode .sidebar-header {
  background: transparent;
  border-bottom: 1px solid var(--border);
}

html.dark-mode .sidebar-link {
  color: var(--text-primary);
}

html.dark-mode .logout-link {
  color: var(--danger);
}

html.dark-mode .sidebar-link:hover {
  color: var(--blue);
  background: rgba(140, 160, 255, 0.08);
}

html.dark-mode .logout-link:hover {
  color: var(--danger);
  background: rgba(255, 140, 140, 0.08);
}

html.dark-mode .sidebar-link.is-active,
html.dark-mode .sidebar-link.active {
  background: rgba(140, 160, 255, 0.12);
  border: 1px solid rgba(140, 160, 255, 0.22);
  border-radius: 10px;
}

html.dark-mode .sidebar-divider {
  background: rgba(140, 160, 200, 0.12);
}

html.dark-mode .sidebar-user-section {
  border-top: 1px solid var(--border);
  background: transparent;
}

html.dark-mode .sidebar-user-toggle:hover {
  background: rgba(140, 160, 255, 0.1);
}

@media (min-width: 1024px) {
  html.dark-mode .desktop-quick-btn {
    background: rgba(15, 19, 30, 0.92);
    border-color: rgba(120, 164, 255, 0.28);
    color: var(--text-primary);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.34);
  }

  html.dark-mode .desktop-quick-btn:hover,
  html.dark-mode .desktop-quick-btn[aria-expanded="true"] {
    background: rgba(22, 29, 44, 0.96);
    border-color: rgba(120, 164, 255, 0.42);
  }

  html.dark-mode #notificationsBell,
  html.dark-mode #sidebarUserToggle {
    border-color:#303849;
    background:#151922;
    color:#aeb7c7;
    box-shadow:none;
  }

  html.dark-mode #notificationsBell:hover,
  html.dark-mode #notificationsBell[aria-expanded="true"],
  html.dark-mode #sidebarUserToggle:hover,
  html.dark-mode #sidebarUserToggle[aria-expanded="true"] {
    border-color:#405071;
    background:#2a3550;
    color:#f2f5fb;
  }

  html.dark-mode .desktop-quick-lyrics-tools .desktop-quick-btn {
    border: 0;
    border-radius: 0 !important;
    background: transparent;
    color: var(--text-primary);
    box-shadow: none;
  }

  html.dark-mode body.lyrics-theater-open .desktop-quick-lyrics-tools {
    padding: 0;
    border-color:#303849;
    background:#151922;
    box-shadow:none;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }

  html.dark-mode .desktop-quick-lyrics-tools .desktop-quick-group + .desktop-quick-group {
    border-left-color:#303849;
  }

  html.dark-mode .desktop-quick-lyrics-tools .desktop-quick-btn:hover {
    background:#232a38;
    border-color: transparent;
  }

  html.dark-mode .desktop-quick-lyrics-tools :is(.desktop-lyrics-beta-btn, .desktop-lyrics-translate-btn).active {
    background:#2a3550;
    border-color: transparent;
    color:#f2f5fb;
    box-shadow:none;
  }

  html.dark-mode .desktop-quick-lyrics-tools .desktop-lyrics-close-btn:hover {
    background:#2a3550;
    color:#f2f5fb;
  }

  html.dark-mode .desktop-profile-dropdown {
    background: rgba(13, 18, 29, 0.98);
    border-color: rgba(120, 164, 255, 0.26);
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.44);
  }

  html.dark-mode .desktop-profile-link {
    color: var(--text-primary);
  }

  html.dark-mode .desktop-profile-link:hover {
    background: rgba(120, 164, 255, 0.14);
    border-color: rgba(120, 164, 255, 0.3);
    color: var(--blue);
  }

  html.dark-mode .desktop-profile-link.logout-link {
    color: #ff8f8f;
  }

  html.dark-mode .desktop-profile-link.logout-link:hover {
    background: rgba(255, 140, 140, 0.12);
    border-color: rgba(255, 140, 140, 0.28);
    color: #ff9a9a;
  }
}

@media (max-width: 1023px) {
  html.dark-mode body.mobile-library-edit-mode #libraryGrid .library-mobile-reorder-grip {
    background: rgba(20, 25, 36, 0.72);
    color: var(--text-secondary);
  }

  html.dark-mode .library-card-touch-clone {
    box-shadow: 0 24px 58px rgba(0, 0, 0, 0.52) !important;
  }

  html.dark-mode .mobile-library-filter-option {
    color: var(--black);
  }

  html.dark-mode .mobile-library-filter-option.is-selected {
    background: rgba(120, 164, 255, 0.13);
  }
}

html.dark-mode .playlists-header,
html.dark-mode .upload-header,
html.dark-mode .search-container .playlist-card,
html.dark-mode .playlist-card,
html.dark-mode .track-card,
html.dark-mode .discovery-artist-card,
html.dark-mode .tracks-list,
html.dark-mode .track-item,
html.dark-mode .discovery-top-card,
html.dark-mode .artist-audience-entity-item,
html.dark-mode .artist-audience-block,
html.dark-mode .artist-analytics-chart-card,
html.dark-mode .artist-stat-card,
html.dark-mode .history-panel,
html.dark-mode .player-queue-panel,
html.dark-mode .player-party-panel,
html.dark-mode .player-comments-panel {
  background: var(--surface-1);
  border-color: var(--border);
}

@media (max-width: 768px) {
  html.dark-mode .player-expanded-panel.is-queue-view .player-queue-panel-header,
  html.dark-mode .player-expanded-panel.is-queue-view .player-queue-list .player-queue-item {
    background: transparent;
    border-color: transparent;
  }

  html.dark-mode .player-expanded-panel.is-queue-view #playerQueuePanel {
    background: rgba(var(--player-expanded-overlay-rgb), 0.3);
    border-color: rgba(var(--player-expanded-accent-rgb), 0.28);
  }

  html.dark-mode .player-expanded-panel.is-queue-view .player-queue-panel-controls .player-btn-small,
  html.dark-mode .player-expanded-panel.is-queue-view .player-queue-clear-btn {
    background: rgba(var(--player-expanded-text-rgb), 0.12);
    color: rgb(var(--player-expanded-text-rgb));
  }

  html.dark-mode .player-expanded-panel.is-queue-view .player-queue-empty {
    background: rgba(var(--player-expanded-overlay-rgb), 0.24);
    border-color: rgba(var(--player-expanded-accent-rgb), 0.28);
  }
}

html.dark-mode .playlist-cover,
html.dark-mode .track-item-cover,
html.dark-mode .discovery-top-card-cover,
html.dark-mode .discovery-artist-avatar,
html.dark-mode .playlist-cover-large,
html.dark-mode .song-cover-large,
html.dark-mode .audience-entity-cover,
html.dark-mode .playlist-placeholder {
  background: var(--surface-2);
  border-color: var(--border);
}

html.dark-mode .playlist-card,
html.dark-mode .track-card,
html.dark-mode .discovery-artist-card,
html.dark-mode .discovery-top-card {
  color: var(--black);
}

html.dark-mode .playlist-name,
html.dark-mode .track-item-info h3,
html.dark-mode .track-title,
html.dark-mode .discovery-artist-card strong,
html.dark-mode .release-title-link,
html.dark-mode .release-artist-link {
  color: var(--black);
}

html.dark-mode .playlist-count,
html.dark-mode .playlist-description,
html.dark-mode .track-meta,
html.dark-mode .discovery-artist-card span,
html.dark-mode .discovery-top-card-type,
html.dark-mode .discovery-top-card-text small,
html.dark-mode .track-artist,
html.dark-mode .status-lock-icon {
  color: var(--text-secondary);
}

html.dark-mode .track-item {
  border-bottom-color: var(--border);
}

html.dark-mode .track-item:hover {
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .playlist-card:hover,
html.dark-mode .discovery-artist-card:hover,
html.dark-mode .discovery-top-card:hover {
  border-color: rgba(120, 164, 255, 0.45);
}

html.dark-mode .library-item-badge,
html.dark-mode .lyrics-status-pill.is-empty,
html.dark-mode .track-item-stats {
  color: #cfe0ff;
}

html.dark-mode .library-remove-btn {
  color: var(--text-secondary);
}

html.dark-mode .library-remove-btn:hover,
html.dark-mode .library-remove-btn:focus-visible {
  color: var(--text-primary);
}

html.dark-mode .sidebar-footer-links .footer-link:hover {
  color: var(--blue);
}

html.dark-mode .sidebar-footer-links .footer-sep {
  color: var(--border);
}

html.dark-mode #playerSection {
  background: var(--white);
  border-top-color: var(--border);
}

html.dark-mode .player-expanded-panel {
  --player-expanded-bg-rgb: 34, 47, 78;
  --player-expanded-accent-rgb: 119, 154, 225;
  --player-expanded-glow-rgb: 170, 197, 246;
  --player-expanded-tint-rgb: 20, 28, 46;
  --player-expanded-overlay-rgb: 10, 14, 24;
  --player-expanded-text-rgb: 243, 247, 255;
  --player-expanded-muted-rgb: 216, 228, 249;
  --player-expanded-control-rgb: 163, 193, 246;
  --player-expanded-progress-rgb: 183, 208, 250;
  --player-expanded-artist-rgb: 203, 223, 255;
  background: linear-gradient(180deg, rgba(var(--player-expanded-tint-rgb), 0.96) 0%, rgba(var(--player-expanded-bg-rgb), 0.95) 100%);
  backdrop-filter: blur(16px) saturate(120%);
}

html.dark-mode .player-expanded-content {
  background: transparent;
  border: none;
  box-shadow: none;
}

html.dark-mode .player-expanded-info h2 {
  color: #f3f7ff;
}

html.dark-mode .player-expanded-info p {
  color: rgba(var(--player-expanded-muted-rgb), 0.96);
}

html.dark-mode .player-expanded-lyrics-card {
  background: rgba(var(--player-expanded-overlay-rgb), 0.58);
  border-color: rgba(var(--player-expanded-accent-rgb), 0.4);
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-expanded-comments-preview {
  background: rgba(var(--player-expanded-overlay-rgb), 0.58);
  border-color: rgba(var(--player-expanded-accent-rgb), 0.4);
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-expanded-mini-card {
  background: rgba(var(--player-expanded-overlay-rgb), 0.58);
  border-color: rgba(var(--player-expanded-accent-rgb), 0.4);
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-expanded-mini-card span {
  color: rgba(var(--player-expanded-muted-rgb), 0.94);
}

html.dark-mode .player-expanded-mini-card small {
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-credit-row {
  background: rgba(15, 23, 42, 0.42);
  border-color: rgba(148, 163, 184, 0.24);
}

html.dark-mode .library-filter-chip,
html.dark-mode .search-suggest-panel {
  background:#151922;
  border-color:#303849;
  color:#f2f5fb;
}

html.dark-mode .search-suggest-title {
  color:#aeb7c7;
}

html.dark-mode .library-filter-chip.is-active {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

html.dark-mode .search-suggest-row {
  color:#f2f5fb;
}

html.dark-mode .search-suggest-row i,
html.dark-mode .search-suggest-row small {
  color:#aeb7c7;
}

html.dark-mode .search-suggest-row:hover,
html.dark-mode .search-suggest-row:focus-visible {
  background:#2a3550;
}

html.dark-mode .search-suggest-skeleton {
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.12), rgba(148, 163, 184, 0.22), rgba(148, 163, 184, 0.12));
  background-size: 180% 100%;
}

html.dark-mode .player-add-action-btn {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
  color: #f8fafc;
}

html.dark-mode .player-add-action-btn i {
  background: rgba(120, 164, 255, 0.16);
  color: #9dbdff;
}

html.dark-mode .player-add-action-btn:hover,
html.dark-mode .player-add-action-btn:focus-visible {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(120, 164, 255, 0.36);
}

html.dark-mode .player-expanded-cherry-preview {
  background: rgba(var(--player-expanded-overlay-rgb), 0.58);
  border-color: rgba(var(--player-expanded-accent-rgb), 0.4);
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-expanded-comments-preview-label {
  color: rgba(var(--player-expanded-muted-rgb), 0.94);
}

html.dark-mode .player-expanded-cherry-preview-label,
html.dark-mode .player-expanded-cherry-preview-age {
  color: rgba(var(--player-expanded-muted-rgb), 0.94);
}

html.dark-mode .player-expanded-cherry-preview-summary {
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-expanded-comments-preview-line {
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .messages-sidebar,
html.dark-mode .messages-thread {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

html.dark-mode .messages-sidebar-header,
html.dark-mode .messages-thread-header,
html.dark-mode .messages-compose,
html.dark-mode .messages-reply-preview {
  border-color: #2a3142;
  background: transparent;
}

html.dark-mode .messages-thread-body {
  background: transparent;
}

html.dark-mode .messages-conversation-list {
  background: transparent;
}

html.dark-mode .messages-conversation-item {
  background: transparent;
  border-color: #2a3142;
}

html.dark-mode .messages-conversation-item:hover,
html.dark-mode .messages-conversation-item.is-active {
  background: rgba(120, 164, 255, 0.16);
  border-color: #2a3142;
}

html.dark-mode .messages-conversation-avatar,
html.dark-mode .messages-reply-cancel,
html.dark-mode .messages-message-reply-preview {
  background: transparent;
  border-color: #2a3142;
  color: var(--text-secondary);
}

html.dark-mode .messages-message-avatar {
  background: #1a1f2e;
  border-color: transparent;
  color: #c7d3ee;
}

html.dark-mode .messages-message.is-incoming .messages-message-avatar {
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.98);
  color: var(--cs-icon-ink);
}

html.dark-mode .messages-conversation-top strong,
html.dark-mode .messages-thread-user,
html.dark-mode .messages-message-text,
html.dark-mode .messages-reply-text strong {
  color: var(--text-primary);
}

html.dark-mode .messages-conversation-preview,
html.dark-mode .messages-conversation-top span,
html.dark-mode .messages-thread-meta,
html.dark-mode .messages-message-meta,
html.dark-mode .messages-reply-text span,
html.dark-mode .messages-empty {
  color: var(--text-secondary);
}

html.dark-mode .messages-message {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

html.dark-mode .messages-message-bubble {
  background: transparent;
  border-color: transparent;
}

html.dark-mode .messages-compose-inner {
  background: #141824;
  border-color: #2a3142;
}

html.dark-mode .messages-compose textarea {
  background: transparent;
  border-color: transparent;
  color: var(--text-primary);
}

html.dark-mode .messages-compose textarea::placeholder {
  color: #93a3c2;
}

html.dark-mode .messages-compose textarea:focus {
  border-color: rgba(120, 165, 255, 0);
  box-shadow: none;
}

html.dark-mode .messages-message.is-outgoing .messages-message-text {
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.12);
}

html.dark-mode .messages-message-reply-preview:hover,
html.dark-mode .messages-reply-cancel:hover {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.2);
  color: #dce8ff;
}

html.dark-mode .messages-message-actions .sd-comment-action {
  background: transparent;
  border-color: #2a3142;
  color: var(--text-secondary);
}

html.dark-mode .messages-message-actions .sd-comment-action:hover {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.14);
  color: #dce8ff;
}

html.dark-mode .messages-send-btn {
  color: #0f121a;
}

html.dark-mode .messages-mobile-back {
  color: #9fc0ff;
}

html.dark-mode .messages-page.is-mobile-messages .messages-thread {
  background: #0f121a;
}

html.dark-mode .player-expanded-lyrics-label {
  color: rgba(var(--player-expanded-muted-rgb), 0.94);
}

html.dark-mode .player-expanded-lyrics-line.is-prev,
html.dark-mode .player-expanded-lyrics-line.is-next {
  color: rgba(var(--player-expanded-muted-rgb), 0.94);
}

html.dark-mode .player-expanded-lyrics-line.is-current {
  color: rgb(var(--player-expanded-text-rgb));
}

html.dark-mode .player-expanded-progress .progress-bar {
  background: rgba(var(--player-expanded-accent-rgb), 0.26);
}

html.dark-mode .sv-tooltip-trigger {
  border-color: rgba(120, 164, 255, 0.42);
  background: rgba(120, 164, 255, 0.16);
  color: #d8e7ff;
}

html.dark-mode .sv-tooltip-trigger:hover,
html.dark-mode .sv-tooltip-trigger:focus-visible {
  background: rgba(120, 164, 255, 0.26);
  border-color: rgba(120, 164, 255, 0.62);
}

html.dark-mode .profile-role {
  border-color: rgba(120, 164, 255, 0.42);
  background: rgba(120, 164, 255, 0.16);
  color: #d8e7ff;
}

html.dark-mode .profile-badge-chip {
  border-color: rgba(120, 164, 255, 0.4);
  background: rgba(120, 164, 255, 0.16);
  color: #d8e7ff;
}

html.dark-mode .profile-badge-chip:hover,
html.dark-mode .profile-badge-chip:focus-visible {
  border-color: rgba(120, 164, 255, 0.58);
  background: rgba(120, 164, 255, 0.26);
}

html.dark-mode .profile-badge-chip.badge-og {
  border-color: rgba(255, 194, 87, 0.5);
  background: rgba(255, 194, 87, 0.16);
  color: #ffd797;
}

html.dark-mode .profile-badge-chip.badge-donator {
  border-color: rgba(255, 140, 207, 0.44);
  background: rgba(255, 140, 207, 0.14);
  color: #ffc3e9;
}

html.dark-mode .profile-badge-chip.badge-artist_plus {
  border-color: rgba(115, 220, 255, 0.6);
  background: linear-gradient(135deg, rgba(44, 142, 255, 0.24), rgba(64, 213, 255, 0.18));
  color: #d8f6ff;
  box-shadow: 0 0 0 1px rgba(115, 220, 255, 0.34), 0 0 24px rgba(80, 193, 255, 0.42);
}

html.dark-mode .profile-badge-chip.badge-contributor,
html.dark-mode .profile-badge-chip.badge-contributor_1,
html.dark-mode .profile-badge-chip.badge-contributor_2,
html.dark-mode .profile-badge-chip.badge-contributor_3,
html.dark-mode .profile-badge-chip.badge-contributor_4,
html.dark-mode .profile-badge-chip.badge-contributor_5 {
  border-color: rgba(90, 226, 178, 0.44);
  background: rgba(90, 226, 178, 0.14);
  color: #b4f9dd;
}

html.dark-mode .profile-badge-chip.badge-curator {
  border-color: rgba(194, 132, 255, 0.5);
  background: rgba(194, 132, 255, 0.16);
  color: #e4ccff;
}
html.dark-mode .profile-badge-chip.badge-contributor_2{border-color:rgba(105,151,255,.5)}
html.dark-mode .profile-badge-chip.badge-contributor_3{background:linear-gradient(135deg,rgba(50,105,255,.3),rgba(108,67,255,.23));border-color:rgba(121,120,255,.6)}
html.dark-mode .profile-badge-chip.badge-contributor_4{background:linear-gradient(135deg,rgba(42,98,255,.36),rgba(142,62,255,.28));border-color:rgba(145,100,255,.72)}
html.dark-mode .profile-badge-chip.badge-contributor_5{background:linear-gradient(135deg,rgba(31,93,255,.43),rgba(185,55,255,.34));border-color:rgba(184,94,255,.82)}

html.dark-mode .profile-badge-chip.badge-zabka_uwolnij_swoj_czas {
  border-color: rgba(118, 236, 140, 0.52);
  background: linear-gradient(135deg, rgba(58, 165, 84, 0.3), rgba(94, 208, 116, 0.2));
  color: #d4ffe0;
  box-shadow: 0 0 0 1px rgba(118, 236, 140, 0.24), 0 0 22px rgba(80, 204, 108, 0.28);
}

html.dark-mode .profile-badge-chip.badge-creator_i,
html.dark-mode .profile-badge-chip.badge-creator_ii,
html.dark-mode .profile-badge-chip.badge-creator_iii,
html.dark-mode .profile-badge-chip.badge-creator_iv,
html.dark-mode .profile-badge-chip.badge-creator_v {
  border-color: rgba(194, 132, 255, 0.5);
  background: rgba(194, 132, 255, 0.16);
  color: #e4ccff;
}

html.dark-mode .profile-badge-chip.badge-glow {
  box-shadow: 0 0 0 1px rgba(194, 132, 255, 0.24), 0 0 22px rgba(194, 132, 255, 0.34);
}

html.dark-mode .profile-badge-chip.badge-particles::before,
html.dark-mode .profile-badge-chip.badge-particles::after {
  background: radial-gradient(circle, rgba(211, 162, 255, 0.95) 0%, rgba(194, 132, 255, 0.1) 75%);
}

html.dark-mode .profile-badge-chip.badge-artist_plus.badge-particles::before,
html.dark-mode .profile-badge-chip.badge-artist_plus.badge-particles::after {
  background: radial-gradient(circle, rgba(148, 235, 255, 0.95) 0%, rgba(113, 196, 255, 0.12) 74%);
}

html.dark-mode .profile-header {
  background: transparent;
  box-shadow: none;
}

html.dark-mode .profile-avatar {
  border: 0;
}

html.dark-mode .profile-right-rail {
  border-color: transparent;
  background: transparent;
}

@media (max-width: 768px) {
  html.dark-mode .mobile-top-blend-profile .profile-header {
    background: transparent;
  }

  html.dark-mode .mobile-top-blend-profile .profile-info,
  html.dark-mode .profile-container.has-profile-banner.mobile-top-blend-profile .profile-info {
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  html.dark-mode .mobile-top-blend-profile .profile-monthly-listeners {
    color: rgba(255, 255, 255, 0.84);
  }
}

html.dark-mode .profile-about-card {
  border-color: color-mix(in srgb, var(--border) 78%, var(--blue));
  background: color-mix(in srgb, var(--white) 94%, var(--blue));
}

html.dark-mode .profile-about-card:hover {
  border-color: rgba(120, 164, 255, 0.42);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.3);
}

html.dark-mode .profile-about-avatar {
  border-color: var(--border);
}

html.dark-mode .profile-about-modal-avatar {
  border-color: var(--white);
}

html.dark-mode .profile-about-title,
html.dark-mode .profile-about-modal-identity h2,
html.dark-mode .profile-about-modal-detail-section h3 {
  color: #f2f6ff;
}

html.dark-mode .profile-about-handle,
html.dark-mode .profile-about-modal-handle {
  color: #9aa3b7;
}

html.dark-mode .profile-about-bio,
html.dark-mode .profile-about-modal-bio {
  color: #c7d3ea;
}

html.dark-mode .profile-about-stat {
  border-color: var(--border);
  background: var(--surface-2);
  color: #dbe7ff;
}

html.dark-mode .profile-about-modal-stat {
  background: var(--white);
  color: #dbe7ff;
}

html.dark-mode .profile-about-modal-social-wrap h4 {
  color: #a9bbde;
}

html.dark-mode .profile-skeleton-section {
  background: transparent;
}

html.dark-mode .profile-skeleton-line,
html.dark-mode .profile-skeleton-box {
  background-image: linear-gradient(100deg, rgba(84, 89, 102, 0.28) 20%, rgba(120, 126, 141, 0.42) 45%, rgba(84, 89, 102, 0.28) 70%);
  background-color: rgba(84, 89, 102, 0.24);
}

@media (max-width: 768px) {
  html.dark-mode .profile-about-mobile-hero {
    opacity: 0.72;
    filter: saturate(1.16) contrast(1.06) brightness(0.86);
  }

  html.dark-mode .profile-about-mobile-hero::after {
    background:
      radial-gradient(112% 88% at 50% 22%, rgba(165, 195, 255, 0.1), rgba(10, 14, 24, 0) 62%),
      linear-gradient(180deg, rgba(6, 10, 20, 0.36), rgba(6, 10, 20, 0.72));
  }
}

html.dark-mode .stat-link {
  background: rgba(120, 164, 255, 0.08);
  border-color: rgba(120, 164, 255, 0.2);
}

html.dark-mode .stat-link:hover {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.36);
}

@media (min-width: 769px) and (max-width: 1023px) {
  html.dark-mode .profile-right-rail {
    background: transparent;
    border: 0;
  }
}

html.dark-mode .profile-role:hover,
html.dark-mode .profile-role:focus-visible {
  background: rgba(120, 164, 255, 0.26);
  border-color: rgba(120, 164, 255, 0.62);
}

html.dark-mode .sv-global-tooltip {
  background: rgba(10, 14, 24, 0.96);
  color: #f3f7ff;
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
}

html.dark-mode .player-progress-lyric-preview {
  background: rgba(10, 14, 24, 0.96);
  color: #f3f7ff;
  border-color: rgba(120, 164, 255, 0.24);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}

html.dark-mode .player-progress-lyric-preview-time {
  color: rgba(223, 232, 248, 0.74);
}

html.dark-mode .player-expanded-progress .time {
  color: #d8e4ff;
}

html.dark-mode .player-expanded-header {
  background: rgba(var(--player-expanded-overlay-rgb), 0.02);
  border-bottom: none;
}

html.dark-mode .player-expanded-cover {
  box-shadow: 0 22px 46px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(var(--player-expanded-accent-rgb), 0.34);
}

html.dark-mode .player-btn-large {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.38);
}

html.dark-mode .player-btn-large:hover {
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.44);
}

html.dark-mode .player-btn-large.player-play-btn {
  box-shadow: 0 20px 38px rgba(0, 0, 0, 0.5);
}

html.dark-mode .lyrics-theater-backdrop {
  background:
    radial-gradient(circle at 16% 14%, rgba(var(--lyrics-theater-glow-rgb), 0.74), rgba(var(--lyrics-theater-bg-rgb), 0.36) 52%, rgba(var(--lyrics-theater-overlay-rgb), 0.96) 100%),
    linear-gradient(180deg, rgba(var(--lyrics-theater-tint-rgb), 0.26), rgba(var(--lyrics-theater-overlay-rgb), 0.76));
}

html.dark-mode .lyrics-theater {
  --lyrics-theater-bg-rgb: 42, 62, 110;
  --lyrics-theater-accent-rgb: 98, 132, 196;
  --lyrics-theater-glow-rgb: 150, 178, 232;
  --lyrics-theater-tint-rgb: 18, 26, 42;
  --lyrics-theater-overlay-rgb: 8, 10, 14;
  --lyrics-theater-text-rgb: 255, 255, 255;
  --lyrics-theater-muted-rgb: 220, 232, 248;
}

html.dark-mode .lyrics-theater-close,
html.dark-mode .lyrics-theater-go-current {
  border-color: rgba(var(--lyrics-theater-accent-rgb), 0.36);
  background: rgba(var(--lyrics-theater-overlay-rgb), 0.42);
}

html.dark-mode .desktop-lyrics-beta-btn.active,
html.dark-mode .desktop-lyrics-translate-btn.active {
  background: rgb(var(--lyrics-theater-accent-rgb, 98, 132, 196));
  border-color: rgba(180, 205, 255, 0.64);
  color: #f8fbff;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.42);
}

html.dark-mode .lyrics-theater-beta-cover {
  box-shadow: 0 28px 66px rgba(0, 0, 0, 0.52), 0 0 0 1px rgba(210, 228, 255, 0.16);
}

html.dark-mode .lyrics-theater-beta-progress {
  background: rgba(255, 255, 255, 0.2);
}

html.dark-mode .lyrics-theater-beta-progress::before {
  content: none;
}

html.dark-mode .lyrics-theater-beta-progress:hover,
html.dark-mode .lyrics-theater-beta-progress.is-scrubbing,
html.dark-mode .lyrics-theater-beta-progress-row.is-scrubbing .lyrics-theater-beta-progress {
  background: rgba(255, 255, 255, 0.28);
}

html.dark-mode .lyrics-theater.is-beta-fullscreen .lyrics-theater-line.is-past {
  opacity: 0.14;
}

html.dark-mode .lyrics-theater-line {
  color: rgba(var(--lyrics-theater-text-rgb), 0.66);
}

html.dark-mode .lyrics-theater-line.is-current {
  color: rgb(var(--lyrics-theater-text-rgb));
}

html.dark-mode .lyrics-theater-translation {
  color: rgba(var(--lyrics-theater-muted-rgb), 0.62);
  opacity: 0.78;
}

html.dark-mode .lyrics-theater-line.is-current .lyrics-theater-translation {
  color: rgba(var(--lyrics-theater-muted-rgb), 0.78);
  opacity: 0.88;
}

html.dark-mode .lyrics-theater-line.is-word-progress {
  color: rgba(var(--lyrics-theater-text-rgb), 0.52);
}

html.dark-mode .lyrics-theater-line.is-word-progress .lyrics-theater-word.is-sung {
  color: rgb(var(--lyrics-theater-text-rgb));
  text-shadow: 0 0 12px rgba(var(--lyrics-theater-glow-rgb), 0.42);
}

html.dark-mode .lyrics-theater.is-beta-fullscreen .lyrics-theater-line.is-word-progress .lyrics-theater-word,
html.dark-mode .lyrics-theater.is-beta-fullscreen .lyrics-theater-line.is-word-progress .lyrics-theater-word.is-sung {
  color: transparent;
  text-shadow: none;
}

html.dark-mode #playerExpandedPrevBtn,
html.dark-mode #playerExpandedNextBtn {
  background: transparent;
  border: none;
  color: rgb(var(--player-expanded-text-rgb));
  box-shadow: none;
}

html.dark-mode #playerExpandedPrevBtn:hover,
html.dark-mode #playerExpandedNextBtn:hover {
  background: transparent;
  border: none;
  color: rgb(var(--player-expanded-text-rgb));
  box-shadow: none;
}

@media (max-width: 1023px) {
  html.dark-mode #playerSection {
    background: rgba(15, 18, 26, 0.92);
    border-color: rgba(43, 49, 64, 0.92);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.38);
  }
}

html.dark-mode .custom-context-menu-list::before {
  background: rgba(255, 255, 255, 0.32) !important;
}

html.dark-mode .sa-search-input {
  color: var(--text, #e2e4e9);
}

html.dark-mode .sa-dropdown {
  background: var(--white);
  border-color: var(--border);
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}

html.dark-mode .sa-dropdown-item:hover {
  background: #1a1d28;
}

html.dark-mode .sa-dropdown-name {
  color: var(--text, #e2e4e9);
}

html.dark-mode .sa-dropdown-handle {
  color: var(--muted, #6b7280);
}

html.dark-mode .sa-item {
  background: var(--white, #1a1d28);
  border-color: var(--border, #2b3140);
}

html.dark-mode .sa-name {
  color: var(--text, #e2e4e9);
}

html.dark-mode .sa-handle {
  color: var(--muted, #6b7280);
}

html.dark-mode .sa-remove-btn {
  color: var(--muted, #6b7280);
}

html.dark-mode .sa-remove-btn:hover {
  color: #ef4444;
}

html.dark-mode .sa-avatar-icon {
  color: var(--muted, #6b7280);
}

html.dark-mode .sa-dropdown-avatar-icon {
  color: var(--muted, #6b7280);
}

html.dark-mode .sa-inline-link {
  color: var(--muted, #9ca3af);
}

html.dark-mode .sa-inline-link:hover {
  color: var(--accent, #818cf8);
}

html.dark-mode .sa-separator {
  color: var(--muted, #9ca3af);
}

html.dark-mode .artist-stat-card {
  background: #141a24;
  border-color: var(--border);
}

html.dark-mode .artist-stat-card.is-highlight {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.32);
}

html.dark-mode .artist-stat-label {
  color: var(--text-secondary);
}

html.dark-mode .artist-stat-value {
  color: var(--black);
}

html.dark-mode .artist-stat-change.is-positive {
  background: rgba(61, 217, 160, 0.2);
  color: #6ef2bf;
}

html.dark-mode .artist-stat-change.is-negative {
  background: rgba(255, 124, 124, 0.2);
  color: #ff9a9a;
}

html.dark-mode .lyrics-status-pill.is-synced {
  background: rgba(61, 217, 160, 0.2);
  border-color: rgba(61, 217, 160, 0.45);
  color: #6ef2bf;
}

html.dark-mode .lyrics-status-pill.is-unsynced {
  background: rgba(255, 185, 92, 0.2);
  border-color: rgba(255, 185, 92, 0.42);
  color: #ffd08a;
}

html.dark-mode .lyrics-status-pill.is-empty {
  background: rgba(120, 164, 255, 0.18);
  border-color: rgba(120, 164, 255, 0.4);
  color: #bfd6ff;
}

html.dark-mode .lyrics-marketplace-sample-label,
html.dark-mode .lyrics-marketplace-section-head p,
html.dark-mode .lyrics-marketplace-song-meta small,
html.dark-mode .lyrics-marketplace-song-cta {
  color: var(--text-secondary);
}

html.dark-mode .lyrics-marketplace-access-pill {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
  color: #d8e7ff;
}

html.dark-mode .lyrics-marketplace-access-pill.is-pro {
  border-color: rgba(120, 164, 255, 0.52);
  background: rgba(120, 164, 255, 0.22);
  color: #e8f2ff;
}

html.dark-mode .lyrics-marketplace-card {
  border-color: rgba(120, 164, 255, 0.24);
  background: #131a27;
}

html.dark-mode .lyrics-marketplace-preview-tag {
  background: rgba(6, 10, 18, 0.72);
}

html.dark-mode .lyrics-marketplace-lock-overlay {
  background: rgba(7, 10, 18, 0.82);
  border: 1px solid rgba(120, 164, 255, 0.26);
}

html.dark-mode .lyrics-marketplace-card-body p {
  color: var(--text-secondary);
}

html.dark-mode .lyrics-marketplace-card-body h4,
html.dark-mode .lyrics-marketplace-song-meta strong {
  color: var(--text-primary);
}

html.dark-mode .lyrics-marketplace-tier {
  border-color: rgba(120, 164, 255, 0.28);
}

html.dark-mode .lyrics-marketplace-tier.is-free {
  color: #c6ddff;
  background: rgba(120, 164, 255, 0.22);
  border-color: rgba(120, 164, 255, 0.44);
}

html.dark-mode .lyrics-marketplace-tier.is-premium {
  color: #e3d4ff;
  background: rgba(165, 120, 255, 0.2);
  border-color: rgba(165, 120, 255, 0.42);
}

html.dark-mode .lyrics-marketplace-song-item {
  border-color: rgba(120, 164, 255, 0.26);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .lyrics-marketplace-song-item.is-unavailable {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(255, 255, 255, 0.055);
}

html.dark-mode .lyrics-marketplace-song-item:hover {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.2);
}

html.dark-mode .lyrics-marketplace-song-item.is-unavailable:hover {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(255, 255, 255, 0.055);
}

html.dark-mode .lyrics-marketplace-song-modal .modal-content,
html.dark-mode .lyrics-marketplace-pro-modal .modal-content,
html.dark-mode .artist-plus-upgrade-modal .modal-content {
  border-color: rgba(120, 164, 255, 0.34);
  background: linear-gradient(180deg, rgba(16, 22, 34, 0.97), rgba(14, 20, 31, 0.96));
}

html.dark-mode .artist-analytics-chart-card {
  background: #121824;
  border-color: var(--border);
}

html.dark-mode .artist-chart-meta p {
  color: var(--text-secondary);
}

html.dark-mode .artist-chart-switch {
  border-color: #34405a;
  background: rgba(120, 164, 255, 0.1);
  color: var(--text-secondary);
}

html.dark-mode .artist-chart-switch:hover,
html.dark-mode .artist-chart-switch.is-active {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.22);
  color: var(--blue);
}

html.dark-mode .artist-smoothed-chart {
  border-color: var(--border);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .artist-chart-grid line {
  stroke: rgba(245, 247, 255, 0.12);
}

html.dark-mode .artist-chart-axis-labels {
  color: var(--text-secondary);
}

html.dark-mode .artist-analytics-range-form label {
  color: var(--text-secondary);
}

html.dark-mode .artist-analytics-range-form select {
  background: #101826;
  border-color: #34405a;
  color: var(--text-primary);
}

html.dark-mode .artist-chart-kpi-item {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .artist-chart-kpi-item p {
  color: var(--text-secondary);
}

html.dark-mode .artist-chart-kpi-item strong.is-positive {
  color: #6ef2bf;
}

html.dark-mode .artist-chart-kpi-item strong.is-negative {
  color: #ff9a9a;
}

html.dark-mode .artist-world-map-wrap {
  border-color: var(--border);
  background: radial-gradient(circle at 22% 16%, rgba(120, 164, 255, 0.2), rgba(120, 164, 255, 0.05) 45%, rgba(18, 24, 36, 0.95));
}

html.dark-mode .artist-world-map-country {
  stroke: rgba(190, 210, 255, 0.4);
}

html.dark-mode .artist-world-map-country.is-hovered {
  stroke: rgba(255, 255, 255, 0.9);
}

html.dark-mode .artist-world-map-info {
  color: var(--text-secondary);
}

html.dark-mode .artist-audience-block,
html.dark-mode .artist-audience-entity-card {
  background: #121824;
  border-color: var(--border);
}

html.dark-mode .artist-audience-label,
html.dark-mode .artist-audience-entity-head strong {
  color: var(--text-primary);
}

html.dark-mode .artist-audience-value,
html.dark-mode .artist-audience-empty,
html.dark-mode .artist-audience-entity-head {
  color: var(--text-secondary);
}

html.dark-mode .artist-audience-entity-item {
  border-color: rgba(120, 164, 255, 0.28);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .audience-detail-header {
  border-color: rgba(120, 164, 255, 0.26);
  background: linear-gradient(140deg, rgba(18, 23, 35, 0.94), rgba(23, 31, 45, 0.92));
}

html.dark-mode .artist-audience-list li,
html.dark-mode .artist-audience-entities {
  border-color: var(--border);
  background: #121824;
}

html.dark-mode .promo-card-section {
  background: linear-gradient(180deg, rgba(17, 23, 35, 0.94), rgba(14, 20, 31, 0.96));
  border-color: rgba(120, 164, 255, 0.2);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

html.dark-mode .promo-card-section-header p,
html.dark-mode .promo-card-control-group > label {
  color: var(--text-secondary);
}

html.dark-mode .audience-entity-hero {
  background: linear-gradient(145deg, rgba(18, 24, 36, 0.98), rgba(15, 21, 33, 0.98));
  border-color: var(--border);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.34);
}

html.dark-mode .audience-entity-cover {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.14);
}

html.dark-mode .audience-entity-meta h2 {
  color: var(--text-primary);
}

html.dark-mode .audience-entity-meta p {
  color: var(--text-secondary);
}

html.dark-mode .hub-tab-search {
  background: #121a27;
  border-color: #334157;
  color: var(--text-primary);
}

html.dark-mode .hub-tab-search::placeholder {
  color: var(--text-secondary);
}

html.dark-mode .hub-tab-search:focus {
  border-color: rgba(120, 164, 255, 0.66);
  box-shadow: 0 0 0 3px rgba(120, 164, 255, 0.22);
}

html.dark-mode .hub-section-intro p {
  color: var(--text-secondary);
}

html.dark-mode .hub-tab-empty-search {
  color: var(--text-secondary);
}

html.dark-mode .promotion-campaign-row-link:hover {
  border-color: rgba(120, 164, 255, 0.52);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .tag-chip-link {
  color: #c5d9ff;
  background: rgba(120, 164, 255, 0.16);
  border-color: rgba(120, 164, 255, 0.36);
}

html.dark-mode .tag-chip-link:hover {
  background: rgba(120, 164, 255, 0.24);
  border-color: rgba(120, 164, 255, 0.5);
}

html.dark-mode .tag-widget-chip {
  color: #c5d9ff;
  background: rgba(120, 164, 255, 0.16);
  border-color: rgba(120, 164, 255, 0.36);
}

html.dark-mode .tag-widget-chip:hover {
  background: rgba(120, 164, 255, 0.24);
  border-color: rgba(120, 164, 255, 0.52);
}

html.dark-mode .tag-widget-hint {
  color: var(--text-secondary);
}

html.dark-mode .tag-widget-dropdown {
  background: var(--white);
  border-color: var(--border);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.5);
}

html.dark-mode .tag-widget-dropdown-item {
  color: var(--black);
}

html.dark-mode .tag-widget-dropdown-item small {
  color: var(--text-secondary);
}

html.dark-mode .tag-widget-dropdown-item:hover {
  background: rgba(120, 164, 255, 0.16);
}

html.dark-mode .tag-page-header {
  border-color: var(--border);
  background: linear-gradient(180deg, rgba(120, 164, 255, 0.22), rgba(120, 164, 255, 0.07));
}

html.dark-mode .tag-page-kicker {
  color: #d4e3ff;
}

html.dark-mode .tag-page-header p {
  color: var(--text-secondary);
}

html.dark-mode .tag-tab-link {
  color: var(--text-secondary);
  border-color: var(--border);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .tag-tab-link:hover,
html.dark-mode .tag-tab-link.is-active {
  color: #d4e3ff;
  border-color: rgba(120, 164, 255, 0.45);
  background: rgba(120, 164, 255, 0.22);
}

html.dark-mode .tag-page-note {
  border-color: rgba(120, 164, 255, 0.42);
  background: rgba(120, 164, 255, 0.16);
  color: #d6e3ff;
}

html.dark-mode .lyrics-video-subtitle,
html.dark-mode .lyrics-video-range-hint,
html.dark-mode .lyrics-video-status,
html.dark-mode .lyrics-video-empty,
html.dark-mode .lyrics-video-count {
  color: var(--text-secondary);
}

html.dark-mode .lyrics-video-count.is-valid {
  color: #6ef2bf;
}

html.dark-mode .lyrics-video-preview-panel {
  border-color: rgba(124, 168, 255, 0.3);
  background:
    radial-gradient(circle at 16% 18%, rgba(124, 168, 255, 0.2), rgba(120, 164, 255, 0.03) 42%, rgba(16, 22, 34, 0.96) 100%),
    linear-gradient(160deg, rgba(18, 24, 36, 0.98), rgba(14, 20, 30, 0.96));
  box-shadow: 0 24px 58px rgba(0, 0, 0, 0.44);
}

html.dark-mode .lyrics-video-lines {
  border-color: var(--border);
  background: #101724;
}

html.dark-mode .lyrics-video-line-option {
  background: #151d2c;
  color: #eaf1ff;
}

html.dark-mode .lyrics-video-line-option:hover {
  border-color: rgba(120, 164, 255, 0.45);
}

html.dark-mode .lyrics-video-line-option.is-in-range {
  background: rgba(120, 164, 255, 0.18);
  border-color: rgba(120, 164, 255, 0.42);
}

html.dark-mode .lyrics-video-line-option.is-point-start,
html.dark-mode .lyrics-video-line-option.is-point-end {
  border-color: rgba(120, 164, 255, 0.62);
  box-shadow: 0 0 0 1px rgba(120, 164, 255, 0.3) inset;
}

html.dark-mode .lyrics-video-choice-card {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
  color: #e7efff;
}

html.dark-mode .lyrics-video-choice-card:hover {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.2);
}

html.dark-mode .lyrics-video-choice-card.is-active {
  border-color: rgba(120, 164, 255, 0.58);
  background: rgba(120, 164, 255, 0.26);
}

html.dark-mode .lyrics-video-choice-card-icon {
  color: #d6e5ff;
}

html.dark-mode .lyrics-video-choice-card-subtitle {
  color: #9ab0d7;
}

html.dark-mode .lyrics-video-line-time {
  color: #9fb2d6;
}

html.dark-mode .lyrics-video-canvas-stage {
  border-color: rgba(124, 168, 255, 0.34);
  box-shadow:
    inset 0 0 0 1px rgba(208, 224, 255, 0.09),
    0 14px 30px rgba(0, 0, 0, 0.42);
}

html.dark-mode .lyrics-video-fake-player {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .lyrics-video-fake-player-times {
  color: #b8c8e6;
}

html.dark-mode .lyrics-video-control-flyout,
html.dark-mode .lyrics-video-control-rail {
  border-color: rgba(120, 164, 255, 0.34);
  background: linear-gradient(180deg, rgba(16, 22, 34, 0.97), rgba(14, 20, 31, 0.96));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.4);
  max-height: 70vh;
  overflow-y: auto;
}

html.dark-mode .lyrics-video-control-surface-header {
  border-bottom-color: rgba(120, 164, 255, 0.22);
}

html.dark-mode .lyrics-video-rail-btn {
  color: #a9bbdf;
}

html.dark-mode .lyrics-video-rail-btn:hover,
html.dark-mode .lyrics-video-rail-btn.is-active {
  color: #d6e5ff;
  border-color: rgba(120, 164, 255, 0.46);
  background: rgba(120, 164, 255, 0.2);
}

html.dark-mode .lyrics-video-mobile-panel-btn {
  color: #a9bbdf;
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.14);
}

html.dark-mode .lyrics-video-mobile-panel-btn.is-active {
  color: #d6e5ff;
  border-color: rgba(120, 164, 255, 0.54);
  background: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-visual-select-card {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
  color: #e7efff;
}

html.dark-mode .lyrics-video-visual-select-card:hover {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.2);
}

html.dark-mode .lyrics-video-visual-select-card.is-active {
  border-color: rgba(120, 164, 255, 0.58);
  background: rgba(120, 164, 255, 0.26);
}

html.dark-mode .lyrics-video-visual-select-title {
  color: #9ab0d7;
}

html.dark-mode .lyrics-video-bg-empty {
  border-color: rgba(120, 164, 255, 0.36);
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .lyrics-video-pinterest-empty {
  border-color: rgba(120, 164, 255, 0.4);
  background: rgba(120, 164, 255, 0.1);
  color: #9ab0d7;
}

html.dark-mode .lyrics-video-pinterest-card {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .lyrics-video-pinterest-thumb-wrap {
  background: rgba(120, 164, 255, 0.16);
}

html.dark-mode .lyrics-video-pinterest-meta span {
  color: #9ab0d7;
}

html.dark-mode .lyrics-video-pinterest-search .form-hint.is-error {
  color: #ff9a9a;
}

html.dark-mode .lyrics-video-bg-item {
  border-color: rgba(120, 164, 255, 0.32);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .lyrics-video-bg-item.is-active {
  border-color: rgba(120, 164, 255, 0.58);
  background: rgba(120, 164, 255, 0.2);
}

html.dark-mode .lyrics-video-bg-item-meta span {
  color: #9ab0d7;
}

html.dark-mode .lyrics-video-control-panel input[type="color"] {
  border-color: rgba(120, 164, 255, 0.3);
  background: #121a27;
}

html.dark-mode .lyrics-video-override-accordion {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .lyrics-video-override-body {
  border-top-color: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-override-subaccordion {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .lyrics-video-override-subaccordion > .lyrics-video-override-body {
  border-top-color: rgba(120, 164, 255, 0.22);
}

html.dark-mode .lyrics-video-override-section {
  border-color: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-effect-selector {
  border-color: var(--border);
  background: #101724;
}

html.dark-mode .lyrics-video-effect-line-row {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .lyrics-video-effect-line-meta span,
html.dark-mode .lyrics-video-effect-selection-meta,
html.dark-mode .lyrics-video-effect-layer-summary span {
  color: #9ab0d7;
}

html.dark-mode .lyrics-video-effect-word-chip {
  border-color: rgba(120, 164, 255, 0.34);
  background: #141d2d;
  color: #e7efff;
}

html.dark-mode .lyrics-video-effect-word-chip.is-selected {
  border-color: rgba(120, 164, 255, 0.58);
  background: rgba(120, 164, 255, 0.24);
  color: #d7e7ff;
}

html.dark-mode .lyrics-video-effect-layer-card {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .lyrics-video-effect-layer-body {
  border-top-color: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-effect-layer-group {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .lyrics-video-effect-layer-group-body {
  border-top-color: rgba(120, 164, 255, 0.22);
}

html.dark-mode .lyrics-video-mobile-sheet-backdrop {
  background: rgba(6, 8, 14, 0.66);
}

html.dark-mode .lyrics-video-render-progress {
  background: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-render-progress-fill {
  background: linear-gradient(90deg, #78a4ff, #9ec0ff);
}

html.dark-mode .lyrics-video-render-modal .modal-content,
html.dark-mode .lyrics-video-render-choice-modal .modal-content,
html.dark-mode .lyrics-video-donate-modal .modal-content,
html.dark-mode .lyrics-video-preset-modal .modal-content {
  border-color: rgba(120, 164, 255, 0.34);
  background: linear-gradient(180deg, rgba(16, 22, 34, 0.97), rgba(14, 20, 31, 0.96));
}

html.dark-mode .lyrics-video-render-modal .modal-header,
html.dark-mode .lyrics-video-render-choice-modal .modal-header,
html.dark-mode .lyrics-video-donate-modal .modal-header,
html.dark-mode .lyrics-video-preset-modal .modal-header,
html.dark-mode .artist-plus-upgrade-modal .modal-header {
  border-bottom-color: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-render-modal .form-hint,
html.dark-mode .lyrics-video-render-choice-modal .form-hint,
html.dark-mode .lyrics-video-donate-modal .form-hint,
html.dark-mode .lyrics-video-preset-modal .form-hint {
  color: #c7d7f7;
}

html.dark-mode .lyrics-video-render-choice {
  border-color: rgba(120, 164, 255, 0.24);
  background: rgba(8, 14, 24, 0.72);
  color: var(--text-primary);
}

html.dark-mode .lyrics-video-render-choice:hover:not(:disabled) {
  border-color: rgba(120, 164, 255, 0.5);
  background: rgba(120, 164, 255, 0.14);
}

html.dark-mode .lyrics-video-render-choice-icon,
html.dark-mode .artist-plus-upgrade-plan {
  background: rgba(120, 164, 255, 0.12);
  border-color: rgba(120, 164, 255, 0.24);
}

html.dark-mode .lyrics-video-preset-item {
  border-color: rgba(120, 164, 255, 0.24);
  background: rgba(8, 14, 24, 0.72);
}

@media (max-width: 768px) {
  html.dark-mode .mobile-top-blend-release .playlist-cover-large::after {
    background: linear-gradient(to bottom, rgba(2, 4, 8, 0) 34%, rgba(2, 4, 8, 0.32) 70%, var(--white) 100%);
  }

  html.dark-mode .mobile-top-blend-release .playlist-cover-large-image {
    filter: saturate(1.06) contrast(1.04);
  }

  html.dark-mode .mobile-top-blend-release .playlist-header-info {
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
  }

  html.dark-mode .mobile-top-blend-release .playlist-type,
  html.dark-mode .mobile-top-blend-release .playlist-description,
  html.dark-mode .mobile-top-blend-release .meta-item {
    color: rgba(224, 233, 248, 0.9);
  }

  html.dark-mode .mobile-top-blend-release .playlist-title,
  html.dark-mode .mobile-top-blend-release .release-title-link,
  html.dark-mode .mobile-top-blend-release .release-artist-link {
    color: #f6f9ff;
  }

  html.dark-mode .mobile-top-blend-release.cover-tone-light .playlist-type,
  html.dark-mode .mobile-top-blend-release.cover-tone-light .meta-item,
  html.dark-mode .mobile-top-blend-release.cover-tone-light .playlist-description,
  html.dark-mode .mobile-top-blend-release.cover-tone-light .playlist-title,
  html.dark-mode .mobile-top-blend-release.cover-tone-light .release-title-link,
  html.dark-mode .mobile-top-blend-release.cover-tone-light .release-artist-link {
    color: #ffffff;
    text-shadow: 0 1px 10px rgba(36, 36, 36, 0.5);
  }

  html.dark-mode .mobile-top-blend-release.cover-tone-dark .playlist-type,
  html.dark-mode .mobile-top-blend-release.cover-tone-dark .playlist-description,
  html.dark-mode .mobile-top-blend-release.cover-tone-dark .meta-item,
  html.dark-mode .mobile-top-blend-release.cover-tone-dark .playlist-title,
  html.dark-mode .mobile-top-blend-release.cover-tone-dark .release-title-link,
  html.dark-mode .mobile-top-blend-release.cover-tone-dark .release-artist-link,
  html.dark-mode .mobile-top-blend-release.cover-tone-auto .playlist-type,
  html.dark-mode .mobile-top-blend-release.cover-tone-auto .playlist-description,
  html.dark-mode .mobile-top-blend-release.cover-tone-auto .meta-item,
  html.dark-mode .mobile-top-blend-release.cover-tone-auto .playlist-title,
  html.dark-mode .mobile-top-blend-release.cover-tone-auto .release-title-link,
  html.dark-mode .mobile-top-blend-release.cover-tone-auto .release-artist-link {
    color: #f7faff;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 14px rgba(0, 0, 0, 0.66);
  }

  html.dark-mode .mobile-top-blend-song .sd-cover-wrap::after {
    background: linear-gradient(to bottom, rgba(2, 4, 8, 0) 34%, rgba(2, 4, 8, 0.34) 72%, var(--white) 100%);
  }

  html.dark-mode .mobile-top-blend-song .sd-cover-img {
    filter: saturate(1.06) contrast(1.05);
  }

  html.dark-mode .mobile-top-blend-song .sd-meta {
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
  }

  html.dark-mode .mobile-top-blend-song .sd-artist-link,
  html.dark-mode .mobile-top-blend-song .sd-title {
    color: #f6f9ff;
  }

  html.dark-mode .mobile-top-blend-song .sd-chip {
    color: #edf2ff;
    border-color: rgba(255, 255, 255, 0.26);
    background: rgba(8, 13, 24, 0.48);
    backdrop-filter: blur(4px);
  }

  html.dark-mode .mobile-top-blend-song .sd-plays-chip {
    color: #ffffff;
    background: rgba(8, 13, 24, 0.62);
  }

  html.dark-mode .mobile-top-blend-song.cover-tone-light .sd-artist-link,
  html.dark-mode .mobile-top-blend-song.cover-tone-light .sd-title {
    color: #ffffff;
    text-shadow: 0 1px 10px rgba(36, 36, 36, 0.5);
  }

  html.dark-mode .mobile-top-blend-song.cover-tone-light .sd-chip {
    color: #edf2ff;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(8, 13, 24, 0.5)
  }

  html.dark-mode .mobile-top-blend-song.cover-tone-light .sd-plays-chip {
    color: #ffffff;
    background: rgba(8, 13, 24, 0.64);
  }

  html.dark-mode .mobile-top-blend-song.cover-tone-dark .sd-artist-link,
  html.dark-mode .mobile-top-blend-song.cover-tone-dark .sd-title,
  html.dark-mode .mobile-top-blend-song.cover-tone-auto .sd-artist-link,
  html.dark-mode .mobile-top-blend-song.cover-tone-auto .sd-title {
    color: #f7faff;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 14px rgba(0, 0, 0, 0.66);
  }

  html.dark-mode .mobile-top-blend-song.cover-tone-dark .sd-chip,
  html.dark-mode .mobile-top-blend-song.cover-tone-auto .sd-chip {
    color: #edf2ff;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(8, 13, 24, 0.5);
  }

  html.dark-mode .mobile-top-blend-song.cover-tone-dark .sd-plays-chip,
  html.dark-mode .mobile-top-blend-song.cover-tone-auto .sd-plays-chip {
    color: #ffffff;
    background: rgba(8, 13, 24, 0.64);
  }

  html.dark-mode .mobile-top-blend-profile .profile-cover::after {
    background: linear-gradient(to bottom, rgba(2, 4, 8, 0) 34%, rgba(2, 4, 8, 0.32) 70%, var(--white) 100%);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    -webkit-mask-image: linear-gradient(to bottom, transparent 34%, #000 72%, #000 100%);
    mask-image: linear-gradient(to bottom, transparent 34%, #000 72%, #000 100%);
  }

  html.dark-mode .mobile-top-blend-profile .profile-info {
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
    background: transparent;
    box-shadow: none;
  }

  html.dark-mode .mobile-top-blend-profile .profile-details h1,
  html.dark-mode .mobile-top-blend-profile .profile-social-proof,
  html.dark-mode .mobile-top-blend-profile .stat-number {
    color: #f6f9ff;
  }

  html.dark-mode .mobile-top-blend-profile .profile-bio,
  html.dark-mode .mobile-top-blend-profile .stat-label {
    color: rgba(221, 230, 245, 0.9);
  }

  html.dark-mode .mobile-top-blend-profile .profile-actions .follow-btn {
    background: rgba(8, 13, 24, 0.68);
    border-color: rgba(120, 164, 255, 0.26);
    color: #eaf0ff;
  }

  html.dark-mode .mobile-top-blend-profile .profile-right-rail {
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  html.dark-mode .mobile-top-blend-profile .profile-social-link {
    background: rgba(120, 164, 255, 0.12);
    border-color: rgba(120, 164, 255, 0.34);
  }

  html.dark-mode .mobile-top-blend-profile .profile-actions #followBtn {
    background: linear-gradient(135deg, #78a4ff 0%, #5f84ea 100%);
    color: #0f121a;
    border-color: transparent;
  }
}

html.dark-mode .onboard-shell {
  border-color: rgba(120, 164, 255, 0.24);
  background: linear-gradient(150deg, rgba(120, 164, 255, 0.16), rgba(120, 164, 255, 0.05) 45%, rgba(15, 18, 26, 0.96));
}

html.dark-mode .onboard-brand {
  background: rgba(15, 18, 26, 0.72);
  border-color: rgba(120, 164, 255, 0.26);
  color: #dce8ff;
}

html.dark-mode .onboard-header p,
html.dark-mode .onboard-stage-head p,
html.dark-mode .onboard-summary-card p {
  color: var(--text-secondary);
}

html.dark-mode .onboard-progress-pill {
  background: rgba(15, 18, 26, 0.66);
  border-color: rgba(120, 164, 255, 0.22);
  color: #c6d2ea;
}

html.dark-mode .onboard-progress-pill span {
  background: rgba(120, 164, 255, 0.2);
  color: #dce8ff;
}

html.dark-mode .onboard-progress-pill.is-active,
html.dark-mode .onboard-progress-pill.is-complete {
  border-color: rgba(120, 164, 255, 0.46);
  color: #f3f7ff;
}

html.dark-mode .onboard-progress-pill.is-active span,
html.dark-mode .onboard-progress-pill.is-complete span {
  background: var(--blue);
  color: #0f121a;
}

html.dark-mode .onboard-stage {
  background: rgba(14, 20, 34, 0.8);
  border-color: rgba(120, 164, 255, 0.18);
}

html.dark-mode .onboard-genre-card,
html.dark-mode .onboard-artist-card,
html.dark-mode .onboard-summary-card,
html.dark-mode .onboard-notification-row,
html.dark-mode .onboard-search-box,
html.dark-mode .onboard-loading-card {
  background: #161b26;
  border-color: var(--border);
}

html.dark-mode .onboard-search-box input {
  background: #161b26;
  border-color: var(--border);
  color: var(--black);
}

html.dark-mode .onboard-genre-card.is-selected,
html.dark-mode .onboard-artist-card.is-selected {
  background: rgba(120, 164, 255, 0.12);
  border-color: rgba(120, 164, 255, 0.42);
}

html.dark-mode .onboard-genre-card:hover {
  border-color: rgba(120, 164, 255, 0.48);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

html.dark-mode .onboard-genre-card-meta span,
html.dark-mode .onboard-artist-meta span,
html.dark-mode .onboard-hint,
html.dark-mode .onboard-empty,
html.dark-mode .onboard-loading-card p {
  color: var(--text-secondary);
}

html.dark-mode .onboard-selected-chip,
html.dark-mode .onboard-summary-chips span {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.18);
  color: #dce8ff;
}

html.dark-mode .onboard-empty {
  border-color: rgba(120, 164, 255, 0.2);
  background: rgba(15, 18, 26, 0.62);
}

html.dark-mode .onboard-loading {
  background: rgba(8, 12, 22, 0.74);
}

html.dark-mode .onboard-loading-card {
  border-color: rgba(120, 164, 255, 0.3);
  box-shadow: 0 28px 44px rgba(0, 0, 0, 0.4);
}

html.dark-mode .onboard-loading-spinner {
  border-color: rgba(120, 164, 255, 0.26);
  border-top-color: var(--blue);
}

html.dark-mode .play-track-btn.is-now-playing,
html.dark-mode .play-track-btn-large.is-now-playing,
html.dark-mode .sd-btn-play.is-now-playing {
  
  border-color: rgba(120, 164, 255, 0.56);
  box-shadow: 0 0 0 6px rgba(120, 164, 255, 0.18);
}

html.dark-mode .sv-now-playing-card {
  border-color: var(--blue);
  box-shadow: none !important;
  animation: none !important;
}

html.dark-mode .sv-now-playing-card::before {
  background: none;
}

html.dark-mode .sv-now-playing-badge {
  display: none !important;
}

html.dark-mode .sv-now-playing-label {
  color: #f2f7ff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

html.dark-mode .sv-now-playing-bars > span {
  background: #bfd6ff;
}

html.dark-mode .track-row.sv-now-playing-track,
html.dark-mode .track-item.sv-now-playing-track {
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .playlist-recommendations-header p,
html.dark-mode .playlist-recommendations-loading,
html.dark-mode .playlist-recommendations-empty {
  color: var(--text-secondary);
}

html.dark-mode .playlist-recommendations .track-btn[data-recommend-add="true"] {
  color: var(--blue);
}

html.dark-mode .playlist-recommendations .track-btn[data-recommend-add="true"]:hover {
  background: rgba(120, 164, 255, 0.2);
}

html.dark-mode .dmca-form-section {
  background: rgba(120, 164, 255, 0.06);
  border-color: var(--border);
}

html.dark-mode .dmca-alert-info {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.36);
  color: #dce8ff;
}

html.dark-mode .notifications-filter-chip {
  background: #161b26;
  border-color: var(--border);
  color: var(--black);
}

html.dark-mode .notifications-filters {
  scrollbar-color: rgba(120, 164, 255, 0.5) rgba(120, 164, 255, 0.14);
}

html.dark-mode .notifications-filter-chip strong {
  background: rgba(120, 164, 255, 0.2);
  color: #d6e4ff;
}

html.dark-mode .notifications-filter-chip:hover {
  border-color: rgba(120, 164, 255, 0.46);
  background: rgba(120, 164, 255, 0.18);
}

html.dark-mode .notifications-filter-chip.is-active {
  border-color: rgba(120, 164, 255, 0.62);
  background: rgba(120, 164, 255, 0.26);
  color: #eaf1ff;
}

html.dark-mode .notifications-empty-filter {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.1);
  color: var(--text-secondary);
}

html.dark-mode .search-filter-chip {
  background: #161b26;
  border-color: var(--border);
  color: var(--black);
}

html.dark-mode .search-filters {
  scrollbar-color: rgba(120, 164, 255, 0.5) rgba(120, 164, 255, 0.14);
}

html.dark-mode .search-mobile-summary strong {
  color: var(--text-color);
}

html.dark-mode .search-filter-chip strong {
  background: rgba(120, 164, 255, 0.2);
  color: #d6e4ff;
}

html.dark-mode .search-filter-chip:hover {
  border-color: rgba(120, 164, 255, 0.46);
  background: rgba(120, 164, 255, 0.18);
}

html.dark-mode .search-filter-chip.is-active {
  border-color: rgba(120, 164, 255, 0.62);
  background: rgba(120, 164, 255, 0.26);
  color: #eaf1ff;
}

html.dark-mode .search-filter-chip.is-active strong {
  color: var(--white);
  background: color-mix(in srgb, var(--white) 18%, transparent);
}

html.dark-mode .search-empty-filter {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.1);
  color: var(--text-secondary);
}

@media (max-width: 768px) {
  html.dark-mode .search-filters {
    background: rgba(15, 18, 26, 0.9);
    border-bottom-color: rgba(120, 164, 255, 0.18);
  }

  html.dark-mode .search-container .track-card,
  html.dark-mode .search-container .playlist-card,
  html.dark-mode .search-container .account-result-card {
    background: rgba(16, 21, 31, 0.9);
    border-color: rgba(120, 164, 255, 0.16);
  }
}

html.dark-mode .history-header {
  background: linear-gradient(140deg, rgba(18, 23, 35, 0.94), rgba(23, 31, 45, 0.92));
  border-color: rgba(120, 164, 255, 0.26);
}

html.dark-mode .history-header p {
  color: var(--text-secondary);
}

html.dark-mode .history-total-plays {
  background: rgba(21, 29, 43, 0.95);
  border-color: rgba(120, 164, 255, 0.42);
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.34);
}

html.dark-mode .history-panel {
  background: linear-gradient(180deg, rgba(17, 23, 35, 0.94), rgba(14, 20, 31, 0.96));
  border-color: rgba(120, 164, 255, 0.2);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

html.dark-mode .history-tabs {
  background: rgba(120, 164, 255, 0.1);
  border-color: rgba(120, 164, 255, 0.3);
}

html.dark-mode .history-tab {
  color: #c4cee2;
}

html.dark-mode .history-tab.is-active {
  background: rgba(120, 164, 255, 0.24);
  border-color: rgba(120, 164, 255, 0.52);
  color: #eaf2ff;
}

html.dark-mode .history-page .history-track-row,
html.dark-mode .history-page .history-artist-row {
  background: rgba(14, 20, 31, 0.72);
  border-color: rgba(120, 164, 255, 0.24);
}

html.dark-mode .history-page .history-track-row:hover,
html.dark-mode .history-page .history-artist-row:hover {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.46);
}

html.dark-mode .history-track-rank,
html.dark-mode .history-track-count,
html.dark-mode .history-listened-at,
html.dark-mode .history-subtle,
html.dark-mode .history-track-artist,
html.dark-mode .history-artist-handle {
  color: var(--text-secondary);
}

html.dark-mode .history-track-title,
html.dark-mode .history-artist-name {
  color: var(--black);
}

html.dark-mode .history-track-cover,
html.dark-mode .history-artist-avatar {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .history-page .play-track-btn {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.44);
  color: #d7e6ff;
}

html.dark-mode .history-page .play-track-btn:hover {
  background: rgba(120, 164, 255, 0.3);
  border-color: rgba(120, 164, 255, 0.62);
}

html.dark-mode .history-page .play-track-btn.is-now-playing {
  background: rgba(120, 164, 255, 0.42);
  border-color: rgba(120, 164, 255, 0.7);
  color: #f4f8ff;
}

html.dark-mode .history-empty {
  border-color: rgba(120, 164, 255, 0.34);
  background: rgba(120, 164, 255, 0.1);
  color: var(--text-secondary);
}

html.dark-mode .upload-anim-overlay {
  background: rgba(6, 8, 14, 0.97);
}

html.dark-mode .upload-stepper {
  background: var(--surface-1);
  border-color: var(--border);
}

html.dark-mode .upload-step-num {
  background: rgba(120, 164, 255, 0.12);
  color: var(--text-secondary);
}

html.dark-mode .upload-step-item.is-active .upload-step-num {
  background: var(--blue);
  color: #0f1115;
  box-shadow: 0 0 0 3px rgba(120, 164, 255, 0.18);
}

html.dark-mode .upload-step-item.is-done .upload-step-num {
  background: rgba(120, 164, 255, 0.14);
  color: #a8c4ff;
  border-color: rgba(120, 164, 255, 0.35);
}

html.dark-mode .upload-step-connector {
  background: var(--border);
}

html.dark-mode .upload-section {
  background: linear-gradient(180deg, rgba(17, 23, 35, 0.96), rgba(14, 20, 31, 0.98));
  border-color: rgba(120, 164, 255, 0.18);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.34);
}

html.dark-mode .upload-section-title {
  color: var(--black);
}

html.dark-mode .upload-section-sub,
html.dark-mode .upload-inline-helper,
html.dark-mode .upload-section .helper-text {
  color: var(--text-secondary);
}

html.dark-mode .upload-cover-zone {
  border-color: rgba(120, 164, 255, 0.3);
  background: rgba(120, 164, 255, 0.06);
}

html.dark-mode .upload-cover-zone:hover,
html.dark-mode .upload-cover-zone:focus-visible,
html.dark-mode .upload-cover-zone.is-drag-over {
  border-color: rgba(120, 164, 255, 0.7);
  background: rgba(120, 164, 255, 0.11);
}

html.dark-mode .upload-audio-dropzone {
  border-color: rgba(120, 164, 255, 0.28);
  background: rgba(120, 164, 255, 0.05);
}

html.dark-mode .upload-audio-dropzone:hover,
html.dark-mode .upload-audio-dropzone.is-drag-over {
  border-color: rgba(120, 164, 255, 0.6);
  background: rgba(120, 164, 255, 0.1);
}

html.dark-mode .upload-track-form-card {
  background: rgba(120, 164, 255, 0.06);
  border-color: rgba(120, 164, 255, 0.22);
}

html.dark-mode .upload-explicit-row {
  border-color: var(--as-border, rgba(255, 255, 255, 0.13));
  color: var(--as-text, #eef2f8);
  background: var(--as-panel-subtle, rgba(255, 255, 255, 0.045));
}

html.dark-mode .upload-explicit-icon {
  color: #d8e7ff;
}

html.dark-mode .upload-policy-row {
  background: rgba(120, 164, 255, 0.06);
  border-color: rgba(120, 164, 255, 0.18);
}

html.dark-mode .upload-vis-opt span {
  background: rgba(120, 164, 255, 0.08);
  border-color: rgba(120, 164, 255, 0.24);
  color: var(--text-secondary);
}

html.dark-mode .upload-vis-opt input[type="radio"]:checked + span {
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.55);
  color: #eaf2ff;
}

html.dark-mode .upload-section-divider {
  border-color: rgba(120, 164, 255, 0.14);
}

html.dark-mode .upload-actions-publish {
  border-color: rgba(120, 164, 255, 0.14);
}

html.dark-mode .upload-progress-track {
  background: rgba(120, 164, 255, 0.18);
}

html.dark-mode .upload-progress-fill {
  background: var(--blue);
}

html.dark-mode body.landing-home {
  background:
    radial-gradient(118% 65% at 50% -8%, rgba(70, 116, 255, 0.2), rgba(70, 116, 255, 0) 60%),
    radial-gradient(66% 40% at 98% 8%, rgba(125, 101, 255, 0.14), rgba(125, 101, 255, 0) 64%),
    #090f18;
}

html.dark-mode body.landing-home .basic-hero-copy h1,
html.dark-mode body.landing-home .showcase-content h2 {
  color: #eef3ff;
}

html.dark-mode body.landing-home .showcase-content p {
  color: #a9b9d9;
}

html.dark-mode body.landing-home .dash-card {
  background: linear-gradient(140deg, rgba(15, 22, 34, 0.94), rgba(17, 25, 39, 0.92));
  border-color: rgba(120, 164, 255, 0.32);
  color: #eff4ff;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.32);
}

html.dark-mode .bumping-panel {
  background: linear-gradient(140deg, rgba(17, 23, 35, 0.94), rgba(21, 29, 43, 0.95));
  border-color: rgba(120, 164, 255, 0.34);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.38);
}

html.dark-mode .bumping-stat,
html.dark-mode .bumping-track {
  background: rgba(13, 18, 29, 0.92);
  border-color: rgba(120, 164, 255, 0.3);
}

html.dark-mode .bumping-stat-label,
html.dark-mode .bumping-track p {
  color: #9eb2d7;
}

html.dark-mode .bumping-track strong,
html.dark-mode .bumping-stat strong {
  color: #eff4ff;
}

html.dark-mode .bumping-bolt,
html.dark-mode .bumping-tag {
  color: #dce8ff;
  background: rgba(120, 164, 255, 0.2);
  border-color: rgba(120, 164, 255, 0.42);
}

html.dark-mode body.landing-home .theater-container {
  background:#080416;
  border-color:transparent;
}

html.dark-mode body.landing-home .mockup-line {
  color: rgba(255, 255, 255, 0.66);
}

html.dark-mode body.landing-home .mockup-line.is-current {
  color: #ffffff;
}

html.dark-mode body.landing-home .mockup-line.is-word-progress {
  color: rgba(255, 255, 255, 0.54);
}

html.dark-mode body.landing-home .video-mockup {
  border-color: rgba(120, 164, 255, 0.34);
  box-shadow: 0 22px 44px rgba(0, 0, 0, 0.38);
}

html.dark-mode body.landing-home .landing-cover-fx {
  opacity: 0.95;
}

html.dark-mode body.landing-home .landing-cover-fx::before {
  background: radial-gradient(circle at 50% 50%, rgba(8, 11, 18, 0), rgba(8, 11, 18, 0.44) 88%);
}

html.dark-mode body.landing-home .cover-fx-item {
  border-color: rgba(140, 176, 255, 0.26);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
}

html.dark-mode body.landing-home .cover-fx-item img {
  filter: saturate(0.86) brightness(0.72) contrast(1.08);
}

html.dark-mode .promo-card-section-header h2 {
  color: var(--text-primary);
}

html.dark-mode .promo-layout-btn,
html.dark-mode .promo-theme-btn,
html.dark-mode .promo-accent-btn {
  background: #121824;
  border-color: var(--border);
  color: var(--text-secondary);
}

html.dark-mode .promo-layout-btn:hover,
html.dark-mode .promo-theme-btn:hover,
html.dark-mode .promo-accent-btn:hover {
  border-color: var(--blue);
  color: var(--blue);
  background: rgba(120, 164, 255, 0.10);
}

html.dark-mode .promo-layout-btn.is-active,
html.dark-mode .promo-theme-btn.is-active,
html.dark-mode .promo-accent-btn.is-active {
  border-color: var(--blue);
  background: rgba(120, 164, 255, 0.14);
  color: var(--blue);
  box-shadow: 0 0 0 1px var(--blue);
}

html.dark-mode .promo-card-preview-wrap {
  background: #0c0f16;
  border-color: var(--border);
}

html.dark-mode .promo-card-preview-wrap canvas {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.34);
}

html.dark-mode .cherry-summary-section {
  background: #161b26;
}

html.dark-mode .cherry-theme-card {
  background: #1c2130;
}

html.dark-mode .cherry-mood-badge {
  background: #1c2130;
}

html.dark-mode .cherry-age-badge {
  background: #0f141d;
  color: #f5f7ff;
  border: 1px solid #2a3142;
}

html.dark-mode .cherry-select-page {
  background: var(--bg);
}

html.dark-mode .cherry-select-page.has-dynamic-theme {
  background: linear-gradient(
    180deg,
    rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.12) 0%,
    var(--bg) 40%
  );
}

html.dark-mode .cherry-select-header-actions button {
  background: #1a1f2e;
  border-color: #2a3142;
}

html.dark-mode .cherry-select-suggestion {
  background: #1a1f2e;
  border-color: #2a3142;
}

html.dark-mode .cs-track-card {
  background: #141824;
  border-color: #2a3142;
}

html.dark-mode .cherry-select-compose-inner {
  background: #141824;
  border-color: #2a3142;
}

html.dark-mode .cherry-select-speech-btn {
  color: rgba(224, 236, 255, 0.98);
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.2);
  border-color: rgba(166, 197, 255, 0.48);
}

html.dark-mode .cherry-select-speech-btn:hover {
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.28);
  border-color: rgba(188, 212, 255, 0.66);
}

html.dark-mode .cherry-select-speech-btn.is-listening {
  color: var(--cs-icon-ink);
}

html.dark-mode .cs-typing-dots {
  background: #1a1f2e;
}

html.dark-mode .cs-msg-user .cs-msg-text {
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.12);
}

html.dark-mode .cs-track-tag {
  color: rgba(222, 234, 255, 0.98);
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.22);
  border: 1px solid rgba(172, 199, 255, 0.36);
}

html.dark-mode .cs-create-playlist-btn {
  color: rgba(224, 236, 255, 0.98);
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.2);
  border-color: rgba(166, 197, 255, 0.48);
}

html.dark-mode .cs-create-playlist-btn:hover {
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.28);
  border-color: rgba(188, 212, 255, 0.66);
}

html.dark-mode .cherry-select-discovery-card {
  background: #151b28;
  border-color: #2b354c;
}

html.dark-mode .cherry-select-discovery-card:hover {
  border-color: rgba(120, 164, 255, 0.58);
  box-shadow: 0 10px 24px rgba(66, 115, 255, 0.18);
}

html.dark-mode .cherry-select-discovery-card-cover {
  background: linear-gradient(145deg, rgba(46, 106, 255, 0.96), rgba(103, 144, 255, 0.9)) !important;
}

html.dark-mode .cherry-support-launch,
html.dark-mode .cherry-support-window {
  background: #111722;
  border-color: #2a3142;
}

html.dark-mode .cherry-support-action {
  background: rgba(var(--cs-accent-r), var(--cs-accent-g), var(--cs-accent-b), 0.14);
  border-color: rgba(166, 197, 255, 0.38);
}

/* ═══════════════════════════════════════════════
   ARTIST PLUS BILLING — dark mode overrides
═══════════════════════════════════════════════ */
html.dark-mode .ap-card {
  background: linear-gradient(180deg, rgba(20, 24, 32, 0.94) 0%, rgba(17, 21, 30, 0.96) 100%);
  border-color: var(--card-border);
  box-shadow: var(--card-shadow), 0 1px 0 rgba(255,255,255,.03) inset;
}
html.dark-mode .ap-card:hover {
  border-color: rgba(120, 164, 255, 0.34);
  box-shadow: 0 14px 30px rgba(0,0,0,.42), 0 0 0 1px rgba(120, 164, 255, 0.14) inset;
}
html.dark-mode .ap-card-glow { background: radial-gradient(ellipse at center, rgba(120, 164, 255, 0.17) 0%, transparent 72%); }
html.dark-mode .ap-card-title { color: var(--text-primary); }
html.dark-mode .ap-card-sub { color: var(--text-secondary); }

html.dark-mode .ap-status-pill { background: rgba(120, 164, 255, .10); color: var(--text-secondary); border-color: rgba(120, 164, 255, .22); }
html.dark-mode .ap-status-pill.is-active { background: rgba(58, 210, 159, .14); color: var(--success); border-color: rgba(58, 210, 159, .34); }

html.dark-mode .ap-feature { background: rgba(22, 27, 38, .92); border-color: var(--border); color: var(--text-secondary); }
html.dark-mode .ap-feature:hover { background: rgba(120, 164, 255, .12); border-color: rgba(120, 164, 255, .32); }
html.dark-mode .ap-feature i { color: var(--blue); }

html.dark-mode .ap-plan-btn { background: #161b26; border-color: var(--border); }
html.dark-mode .ap-plan-btn:hover { background: rgba(120, 164, 255, .12); border-color: rgba(120, 164, 255, .34); box-shadow: 0 8px 22px rgba(0,0,0,.36); }
html.dark-mode .ap-plan-btn.is-selected { background: rgba(111, 140, 255, .16); border-color: rgba(120, 164, 255, .56); box-shadow: 0 0 0 3px rgba(120, 164, 255, .16), 0 8px 24px rgba(0,0,0,.4); }
html.dark-mode .ap-plan-name { color: var(--text-secondary); }
html.dark-mode .ap-plan-price { color: var(--text-primary); }
html.dark-mode .ap-plan-period { color: var(--text-secondary); }
html.dark-mode .ap-plan-trial { color: var(--blue); }

html.dark-mode .ap-subscribe-btn {
  background: linear-gradient(135deg, var(--blue) 0%, var(--purple) 100%);
  color: #0f121a;
  box-shadow: 0 12px 26px rgba(120, 164, 255, .3);
}
html.dark-mode .ap-subscribe-btn:hover { box-shadow: 0 16px 30px rgba(120, 164, 255, .4); }

html.dark-mode .ap-manage-btn { background: #161b26; border-color: var(--border); color: var(--text-secondary); }
html.dark-mode .ap-manage-btn:hover { background: rgba(120, 164, 255, .14); border-color: rgba(120, 164, 255, .36); color: var(--text-primary); }
html.dark-mode .ap-billing-status { color: var(--text-secondary); }

html.dark-mode .ap-invoices { background: rgba(17, 22, 31, .96); border-color: var(--border); }
html.dark-mode .ap-invoices-head { color: var(--text-secondary); border-bottom-color: var(--border); }
html.dark-mode .ap-invoice-row { border-bottom-color: rgba(140, 160, 200, .12); }
html.dark-mode .ap-invoice-row:hover { background: rgba(120, 164, 255, .10); }
html.dark-mode .ap-invoice-date { color: var(--text-secondary); }
html.dark-mode .ap-invoice-status { background: rgba(120, 164, 255, .12); color: #c8d6ff; }
html.dark-mode .ap-invoice-status--paid { background: rgba(58,210,159,.16); color: var(--success); }
html.dark-mode .ap-invoice-status--open { background: rgba(240,179,90,.14); color: var(--warning); }
html.dark-mode .ap-invoice-status--void,
html.dark-mode .ap-invoice-status--uncollectible { background: rgba(255,107,107,.14); color: var(--danger); }
html.dark-mode .ap-invoice-amount { color: var(--text-primary); }
html.dark-mode .ap-invoice-arrow { color: rgba(230, 233, 239, .3); }
html.dark-mode .ap-invoice-empty { color: var(--text-secondary); }

/* ═══════════════════════════════════════════════
   ARTIST PLUS GIFT CARD — dark mode overrides
═══════════════════════════════════════════════ */
html.dark-mode .ap-gift-card {
  background: linear-gradient(180deg, rgba(21, 27, 40, 0.94) 0%, rgba(17, 22, 33, 0.96) 100%);
  border-color: rgba(120, 164, 255, 0.24);
  box-shadow: var(--card-shadow), 0 1px 0 rgba(255,255,255,.03) inset;
}
html.dark-mode .ap-gift-card:hover {
  border-color: rgba(138, 125, 255, 0.38);
  box-shadow: 0 14px 30px rgba(0,0,0,.42), 0 0 0 1px rgba(138, 125, 255, 0.16) inset;
}
html.dark-mode .ap-gift-card::before { background: radial-gradient(circle, rgba(138, 125, 255, .14) 0%, transparent 72%); }
html.dark-mode .ap-gift-icon-wrap { background: linear-gradient(135deg, rgba(138,125,255,.28), rgba(111,140,255,.22)); border-color: rgba(138,125,255,.42); color: #d6ccff; }
html.dark-mode .ap-gift-title { color: var(--text-primary); }
html.dark-mode .ap-gift-sub { color: var(--text-secondary); }

html.dark-mode .ap-gift-recipient-input { background: #161b26; border-color: var(--border); color: var(--text-primary); }
html.dark-mode .ap-gift-recipient-input::placeholder { color: rgba(154, 163, 178, .72); }
html.dark-mode .ap-gift-recipient-input:focus { border-color: rgba(138,125,255,.58); background: rgba(138,125,255,.08); box-shadow: 0 0 0 3px rgba(138,125,255,.2); }

html.dark-mode .ap-gift-plan-btn { background: #161b26; border-color: var(--border); }
html.dark-mode .ap-gift-plan-btn:hover { background: rgba(138,125,255,.14); border-color: rgba(138,125,255,.4); }
html.dark-mode .ap-gift-plan-btn.is-active { background: rgba(138,125,255,.2); border-color: rgba(138,125,255,.62); box-shadow: 0 0 0 3px rgba(138,125,255,.18), 0 8px 22px rgba(0,0,0,.38); }
html.dark-mode .ap-gift-plan-duration { color: var(--text-secondary); }
html.dark-mode .ap-gift-plan-price { color: var(--text-primary); }

html.dark-mode .ap-gift-send-btn {
  background: linear-gradient(135deg, var(--purple) 0%, var(--blue) 100%);
  color: #0f121a;
  box-shadow: 0 12px 26px rgba(138, 125, 255, .32);
}
html.dark-mode .ap-gift-send-btn:hover { box-shadow: 0 16px 30px rgba(138, 125, 255, .42); }
html.dark-mode .ap-gift-status { color: var(--text-secondary); }

html.dark-mode .gift-share-input { background: #161b26; color: var(--text-primary); border-color: rgba(138,125,255,.4); }
html.dark-mode .gift-share-label { color: var(--text-secondary); }
html.dark-mode .gift-copy-btn { border-color: rgba(138,125,255,.36); }

/* ═══════════════════════════════════════════════
   YOUR GIFTS HISTORY CARD — dark mode
═══════════════════════════════════════════════ */
html.dark-mode .ap-my-gifts-card {
    background: var(--card-bg);
    border-color: var(--border);
    box-shadow: var(--card-shadow);
}
html.dark-mode .ap-my-gifts-header {
    background: rgba(22, 27, 38, .95);
    color: var(--text-secondary);
    border-bottom-color: var(--border);
}
html.dark-mode .ap-my-gift-row { border-bottom-color: rgba(140, 160, 200, .10); }
html.dark-mode .ap-my-gift-row:hover { background: rgba(120, 164, 255, .08); }
html.dark-mode .ap-my-gift-months { color: var(--text-primary); }
html.dark-mode .ap-my-gift-date { color: var(--muted); }
html.dark-mode .ap-my-gift-recipient { color: var(--text-secondary); }
html.dark-mode .ap-my-gift-recipient--none { color: var(--muted); }
html.dark-mode .ap-my-gift-status { background: rgba(120, 164, 255, .10); color: #c8d6ff; }
html.dark-mode .ap-my-gift-status--available { background: rgba(111, 140, 255, .18); color: var(--blue); }
html.dark-mode .ap-my-gift-status--redeemed  { background: rgba(58, 210, 159, .14); color: var(--success); }
html.dark-mode .ap-my-gift-status--expired   { background: rgba(255, 107, 107, .14); color: var(--danger); }
html.dark-mode .ap-my-gift-copy-btn {
    background: transparent;
    border-color: rgba(120, 164, 255, .32);
    color: var(--blue);
}
html.dark-mode .ap-my-gift-copy-btn:hover {
    background: rgba(120, 164, 255, .14);
    border-color: rgba(120, 164, 255, .52);
}

html.dark-mode .settings-container #billing-tab .ap-card,
html.dark-mode .settings-container #billing-tab .ap-gift-card,
html.dark-mode .settings-container #billing-tab .ap-my-gifts-card {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(18, 24, 36, 0.58);
  box-shadow: none;
}

html.dark-mode .settings-container #billing-tab .ap-card-header,
html.dark-mode .settings-container #billing-tab .ap-gift-card-header {
  border-bottom-color: var(--border);
}

html.dark-mode .settings-container #billing-tab .ap-gem-wrap,
html.dark-mode .settings-container #billing-tab .ap-gift-icon-wrap {
  background: rgba(120, 164, 255, 0.12);
  border-color: rgba(120, 164, 255, 0.22);
  color: var(--blue);
  box-shadow: none;
}

html.dark-mode .settings-container #billing-tab .ap-card-title,
html.dark-mode .settings-container #billing-tab .ap-gift-title,
html.dark-mode .settings-container #billing-tab .ap-plan-price,
html.dark-mode .settings-container #billing-tab .ap-gift-plan-price,
html.dark-mode .settings-container #billing-tab .ap-invoice-amount,
html.dark-mode .settings-container #billing-tab .ap-my-gift-months {
  color: var(--text-primary);
}

html.dark-mode .settings-container #billing-tab .ap-card-sub,
html.dark-mode .settings-container #billing-tab .ap-gift-sub,
html.dark-mode .settings-container #billing-tab .ap-plan-name,
html.dark-mode .settings-container #billing-tab .ap-plan-period,
html.dark-mode .settings-container #billing-tab .ap-plan-trial,
html.dark-mode .settings-container #billing-tab .ap-gift-plan-duration,
html.dark-mode .settings-container #billing-tab .ap-invoice-date,
html.dark-mode .settings-container #billing-tab .ap-my-gift-date,
html.dark-mode .settings-container #billing-tab .ap-billing-status,
html.dark-mode .settings-container #billing-tab .ap-gift-status {
  color: var(--text-secondary);
}

html.dark-mode .settings-container #billing-tab .ap-status-pill {
  background: rgba(120, 164, 255, 0.1);
  border-color: rgba(120, 164, 255, 0.18);
  color: var(--text-secondary);
}

html.dark-mode .settings-container #billing-tab .ap-status-pill.is-active {
  background: rgba(58, 210, 159, 0.14);
  border-color: rgba(58, 210, 159, 0.28);
  color: var(--success);
}

html.dark-mode .settings-container #billing-tab .ap-feature,
html.dark-mode .settings-container #billing-tab .ap-plan-btn,
html.dark-mode .settings-container #billing-tab .ap-gift-plan-btn,
html.dark-mode .settings-container #billing-tab .ap-invoices,
html.dark-mode .settings-container #billing-tab .ap-manage-btn {
  background: rgba(18, 24, 36, 0.72);
  border-color: var(--border);
  color: var(--text-primary);
  box-shadow: none;
}

html.dark-mode .settings-container #billing-tab .ap-feature:hover,
html.dark-mode .settings-container #billing-tab .ap-plan-btn:hover,
html.dark-mode .settings-container #billing-tab .ap-gift-plan-btn:hover,
html.dark-mode .settings-container #billing-tab .ap-manage-btn:hover,
html.dark-mode .settings-container #billing-tab .ap-invoice-row:hover,
html.dark-mode .settings-container #billing-tab .ap-my-gift-row:hover {
  background: rgba(120, 164, 255, 0.10);
  border-color: rgba(120, 164, 255, 0.28);
}

html.dark-mode .settings-container #billing-tab .ap-plan-btn.is-selected,
html.dark-mode .settings-container #billing-tab .ap-gift-plan-btn.is-active {
  background: rgba(120, 164, 255, 0.14) !important;
  border-color: rgba(120, 164, 255, 0.40) !important;
  box-shadow: 0 0 0 3px rgba(120, 164, 255, 0.12) !important;
}

html.dark-mode .settings-container #billing-tab .ap-billing-disclosure,
html.dark-mode .settings-container #billing-tab .ap-invoices-head,
html.dark-mode .settings-container #billing-tab .ap-my-gifts-header {
  background: rgba(18, 24, 36, 0.72);
  border-color: var(--border);
  color: var(--text-secondary);
}

html.dark-mode .settings-container #billing-tab .ap-invoice-row,
html.dark-mode .settings-container #billing-tab .ap-my-gift-row {
  border-bottom-color: var(--border);
}

html.dark-mode .settings-container #billing-tab .ap-plan-save-badge,
html.dark-mode .settings-container #billing-tab .ap-gift-plan-save {
  background: rgba(120, 164, 255, 0.14);
  border-color: rgba(120, 164, 255, 0.26);
  color: var(--blue);
}

html.dark-mode .settings-container #billing-tab .ap-subscribe-btn,
html.dark-mode .settings-container #billing-tab .ap-gift-send-btn {
  background: var(--blue);
  border-color: var(--blue);
  color: #0f121a;
  box-shadow: none;
}

html.dark-mode .settings-container #billing-tab .ap-subscribe-btn:hover,
html.dark-mode .settings-container #billing-tab .ap-gift-send-btn:hover {
  background: #d8e7ff;
  border-color: #d8e7ff;
  color: #0f121a;
  box-shadow: none;
}

/* ===================== CROP MODAL DARK ===================== */
html.dark-mode .sv-crop-dialog {
  background: var(--surface-1);
  border-color: var(--border);
}
html.dark-mode .sv-crop-title { color: var(--black); }
html.dark-mode .sv-crop-close { color: var(--text-secondary); }
html.dark-mode .sv-crop-close:hover { color: var(--black); }
html.dark-mode .sv-crop-header { border-color: var(--border); }
html.dark-mode .sv-crop-zoom-row { border-color: var(--border); }
html.dark-mode .sv-crop-zoom-slider { background: var(--border); }
html.dark-mode .sv-crop-previews { border-color: var(--border); }
html.dark-mode .sv-crop-prev-canvas { border-color: var(--border); background: var(--surface-1); }
html.dark-mode .sv-crop-actions { border-top: 1px solid var(--border); }
/* =================== END CROP MODAL DARK =================== */

/* =================== POST-PUBLISH DARK =================== */
html.dark-mode .upload-rec-card {
  background: var(--surface-1);
  border-color: var(--border);
}
html.dark-mode .upload-rec-card--highlight {
  background: color-mix(in srgb, var(--blue) 8%, var(--surface-1));
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
}
html.dark-mode .upload-rec-icon {
  background: color-mix(in srgb, var(--blue) 14%, var(--surface-1));
}
html.dark-mode .upload-rec-card:hover .upload-rec-icon {
  background: color-mix(in srgb, var(--blue) 22%, var(--surface-1));
}
html.dark-mode .upload-published-check {
  background: color-mix(in srgb, #22c55e 12%, var(--surface-1));
}
html.dark-mode .upload-audio-dropzone.has-files {
  background: color-mix(in srgb, #22c55e 6%, var(--surface-1));
}
html.dark-mode .upload-published-title {
  background: linear-gradient(90deg, var(--black) 0%, var(--blue) 50%, var(--black) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
}
html.dark-mode .basic-reason-card,
html.dark-mode .changelog-card,
html.dark-mode .pricing-card,
html.dark-mode .about-stat-card,
html.dark-mode .about-info-card,
html.dark-mode .about-value-card,
html.dark-mode .basic-screenshot-card {
  background: var(--surface-2);
  border-color: var(--border);
}
html.dark-mode .basic-screenshot-card figcaption {
  border-top-color: var(--border);
}
html.dark-mode .superfans-preview,
html.dark-mode .superfans-preview-meta b {
  color: var(--black);
}
html.dark-mode .basic-interior-hero {
  border-bottom-color: var(--border);
}
html.dark-mode .basic-divider-label {
  color: var(--text-secondary);
}
html.dark-mode .basic-divider-label::before,
html.dark-mode .basic-divider-label::after {
  background: var(--border);
}
html.dark-mode .changelog-admin-panel {
  background: linear-gradient(160deg, rgba(111, 140, 255, 0.06), rgba(111, 140, 255, 0.01));
  border-color: rgba(111, 140, 255, 0.22);
}
html.dark-mode .changelog-tag {
  border-color: rgba(111, 140, 255, 0.28);
  background: rgba(111, 140, 255, 0.1);
  color: var(--blue);
}
html.dark-mode .changelog-detail-header {
  border-bottom-color: var(--border);
}
html.dark-mode .changelog-delete-btn {
  background: rgba(239, 68, 68, 0.1);
  border-color: rgba(239, 68, 68, 0.26);
  color: #ff7070;
}
html.dark-mode .changelog-delete-btn:hover {
  background: rgba(239, 68, 68, 0.18);
}
html.dark-mode .changelog-empty {
  border-color: var(--border);
  color: var(--text-secondary);
}
html.dark-mode .basic-comparison-table th,
html.dark-mode .basic-comparison-table td {
  border-bottom-color: var(--border);
}
html.dark-mode .basic-comparison-table .cross {
  color: #4a5068;
}
html.dark-mode .pricing-card.is-featured {
  background: linear-gradient(160deg, rgba(111, 140, 255, 0.1), rgba(111, 140, 255, 0.03));
  border-color: rgba(111, 140, 255, 0.38);
}
html.dark-mode .pricing-toggle-btn {
  background: none;
  border-color: var(--border);
  color: var(--black);
}
html.dark-mode .pricing-toggle-btn.is-active {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}
html.dark-mode .pricing-faq-item {
  border-color: var(--border);
}
html.dark-mode .pricing-faq-item p {
  border-top-color: var(--border);
}
html.dark-mode .pricing-feature-list li.is-muted::before {
  color: #44485a;
}
html.dark-mode .presave-mockup,
html.dark-mode .yourspace-mockup,
html.dark-mode .community-mockup,
html.dark-mode .plus-teaser-panel {
  background: linear-gradient(160deg, var(--surface-2), var(--surface-1));
  border-color: var(--border);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.36);
}
html.dark-mode .presave-countdown-unit {
  background: var(--surface-1);
  border-color: var(--border);
}
html.dark-mode .yourspace-mockup-header {
  border-bottom-color: var(--border);
}
html.dark-mode .yourspace-generated-badge {
  border-color: rgba(111, 140, 255, 0.26);
  background: rgba(111, 140, 255, 0.1);
  color: var(--blue);
}
html.dark-mode .yourspace-track-row {
  border-bottom-color: rgba(255, 255, 255, 0.04);
}
html.dark-mode .community-comment {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(111, 140, 255, 0.14);
}
html.dark-mode .community-comment p {
  color: var(--text-secondary);
}
html.dark-mode .community-timestamp-badge {
  background: rgba(111, 140, 255, 0.1);
  color: var(--blue);
  border-color: rgba(111, 140, 255, 0.2);
}
html.dark-mode .plus-teaser-header {
  border-bottom-color: var(--border);
}
html.dark-mode .plus-teaser-row {
  border-bottom-color: rgba(255, 255, 255, 0.04);
}
html.dark-mode .plus-teaser-col.is-muted {
  color: #44485a;
}
html.dark-mode .about-body p,
html.dark-mode .about-lead {
  color: var(--text-secondary);
}

html.dark-mode .getmogged-panel {
  background: linear-gradient(160deg, rgba(19, 24, 36, 0.96), rgba(15, 20, 31, 0.94));
  border-color: var(--border);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.42);
}
html.dark-mode .getmogged-note {
  color: var(--text-secondary);
}
html.dark-mode .getmogged-goal-wrap label {
  color: var(--black);
}
html.dark-mode .getmogged-goal-input {
  background: rgba(20, 27, 40, 0.95);
  border-color: rgba(111, 140, 255, 0.28);
  color: var(--black);
}
html.dark-mode .getmogged-goal-input::placeholder {
  color: rgba(160, 173, 198, 0.9);
}
html.dark-mode .getmogged-error {
  color: #ff8b8b;
}
html.dark-mode .getmogged-panel .file-input-label {
  background: linear-gradient(160deg, rgba(25, 32, 49, 0.95), rgba(17, 23, 36, 0.94));
  border-color: rgba(111, 140, 255, 0.3);
  color: var(--black);
}
html.dark-mode .getmogged-panel .file-input-label .text span {
  color: var(--text-secondary);
}
html.dark-mode .getmogged-panel .file-input-name {
  color: var(--text-secondary);
}
/* =================== END POST-PUBLISH DARK =================== */

/* ===== DARK MODE: YOUR PRESETS + CHERRY VIDEO + BULK ===== */
html.dark-mode .cherry-video-prompt-textarea { background: #0d1117; border-color: rgba(255,255,255,0.1); color: #e2e8f0; }
html.dark-mode .cherry-video-prompt-textarea::placeholder { color: #93a3bb; }
html.dark-mode .cherry-video-prompt-textarea:focus { border-color: rgba(99,102,241,0.5); }
html.dark-mode .cherry-video-mention-dropdown { background: #1a2235; border-color: rgba(255,255,255,0.1); }
html.dark-mode .cherry-video-mention-option { color: #e2e8f0; }
html.dark-mode .cherry-video-mention-option:hover { background: rgba(255,255,255,0.05); }
html.dark-mode .cherry-video-mode-btn { background: #0d1117; border-color: rgba(255,255,255,0.1); color: #e2e8f0; }
html.dark-mode .cherry-video-mode-btn:hover { background: rgba(255,255,255,0.04); border-color: rgba(99,102,241,0.4); }
html.dark-mode .cherry-video-mode-dropdown { background: #1a2235; border-color: rgba(255,255,255,0.1); }
html.dark-mode .cherry-video-mode-option { border-bottom-color: rgba(255,255,255,0.07); color: #e2e8f0; }
html.dark-mode .cherry-video-mode-option-main { color: #e2e8f0; }
html.dark-mode .cherry-video-mode-option-sub { color: #9db0cb; }
html.dark-mode .cherry-video-mode-option.is-active .cherry-video-mode-option-main { color: #8ea4ff; }
html.dark-mode .cherry-video-mode-option:hover { background: rgba(255,255,255,0.05); }
html.dark-mode .cherry-video-tagged-song { background: rgba(26,92,255,0.12); border-color: rgba(26,92,255,0.3); }
html.dark-mode .cherry-video-popup-inner { background: #131a27; }
html.dark-mode .cherry-video-popup-header { border-bottom-color: rgba(255,255,255,0.08); }
html.dark-mode .cherry-video-popup-status { background: rgba(255,255,255,0.05); }
html.dark-mode .cherry-video-popup-actions { border-top-color: rgba(255,255,255,0.08); }
html.dark-mode .cherry-bulk-prompt-bar { background: #131a27; border-color: rgba(255,255,255,0.1); }
html.dark-mode .cherry-bulk-textarea { background: #0d1117; border-color: rgba(255,255,255,0.1); color: #e2e8f0; }
html.dark-mode .cherry-bulk-textarea::placeholder { color: #93a3bb; }
html.dark-mode .cherry-bulk-card { background: #131a27; border-color: rgba(255,255,255,0.09); }
html.dark-mode .cherry-bulk-save-btn { background: rgba(255,255,255,0.06); color: #e2e8f0; border-color: rgba(255,255,255,0.12); }
html.dark-mode .cherry-bulk-save-btn:hover { border-color: rgba(99,102,241,0.4); }
html.dark-mode .cherry-bulk-generate-btn { color: #f8fbff; }
html.dark-mode #cherryBulkTaggedTitle { color: #e2e8f0; }
html.dark-mode .lyric-presets-back-btn { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.1); color: #94a3b8; }
html.dark-mode .profile-release-list-card .playlist-description {
  color: var(--text-secondary);
}
html.dark-mode .profile-release-compact-year {
  color: #9fb2d4;
}
html.dark-mode .profile-release-section-tabs .library-filter-chip {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(120, 164, 255, 0.12);
  color: #f8fbff;
}

html.dark-mode .profile-release-section-tabs .library-filter-chip.is-active {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}
@media (max-width: 1023px) {
  html.dark-mode .profile-release-list-page .profile-release-list-card,
  html.dark-mode .profile-release-list-page .profile-release-list-card.playlist-detail-container {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }

  html.dark-mode .profile-release-section h2,
  html.dark-mode .profile-release-list-card .release-title-link,
  html.dark-mode .profile-release-list-card .playlist-title {
    color: #f8fbff;
  }

  html.dark-mode .profile-release-row-meta {
    color: #9fb2d4;
  }
}

html.dark-mode .admin-map-kpi,
html.dark-mode .admin-map-card {
  border-color: rgba(120, 164, 255, 0.18);
  background: rgba(18, 24, 36, 0.62);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03);
}

html.dark-mode .admin-world-map {
  background: radial-gradient(circle at 20% 16%, rgba(120, 164, 255, 0.13), rgba(120, 164, 255, 0.04) 45%, rgba(18, 24, 36, 0.7));
}

html.dark-mode .admin-world-map-country {
  stroke: rgba(15, 20, 33, 0.78);
}

/* Native notifications and Artist Hub */
html.dark-mode .notifications-native-page .notifications-filter-chip {
  border-color:transparent;
  background:var(--surface-2);
}

html.dark-mode .notifications-native-page .notifications-filter-chip.is-active {
  border-color:transparent;
  background:var(--black);
  color:var(--white);
}

html.dark-mode .notifications-native-page .notifications-item-page,
html.dark-mode .notifications-native-page .notifications-list-page {
  background:transparent;
}

html.dark-mode .notifications-native-page .notifications-item-page.unread,
html.dark-mode .notifications-native-page .notifications-item-page:hover {
  background:color-mix(in srgb,var(--blue) 8%,transparent);
}

html.dark-mode .artist-hub-container .hub-tabs {
  border-color:color-mix(in srgb,var(--border) 76%,transparent);
  background:transparent;
}

html.dark-mode .artist-hub-container .hub-tab.active {
  border-color:transparent;
  background:var(--black);
  color:var(--white);
  box-shadow:none;
}

html.dark-mode .artist-hub-container .artist-hub-discord-banner {
  border-color:transparent;
  background:color-mix(in srgb,#5865f2 12%,var(--surface-2));
  box-shadow:none;
}

html.dark-mode .artist-hub-container .artist-hub-release-item,
html.dark-mode .artist-hub-container .artist-hub-release-track-row {
  background:transparent;
  box-shadow:none;
}

html.dark-mode .artist-hub-container .artist-hub-release-item.is-expanded,
html.dark-mode .artist-hub-container .artist-hub-release-item.is-expanded:hover {
  background:color-mix(in srgb,var(--blue) 8%,transparent);
  box-shadow:none;
}

html.dark-mode .artist-hub-container .artist-hub-release-track-row:hover {
  background:color-mix(in srgb,var(--blue) 6%,transparent);
  box-shadow:none;
}

@media (min-width:1024px) {
  html.dark-mode :is(.playlists-container,.settings-container) > .hub-tabs {
    border-color:color-mix(in srgb,var(--border) 76%,transparent);
    background:transparent;
  }

  html.dark-mode :is(.playlists-container,.settings-container) > .hub-tabs .hub-tab {
    border-color:transparent;
    color:var(--text-secondary);
    background:transparent;
    box-shadow:none;
  }

  html.dark-mode :is(.playlists-container,.settings-container) > .hub-tabs .hub-tab:hover {
    color:var(--black);
    background:var(--surface-2);
  }

  html.dark-mode :is(.playlists-container,.settings-container) > .hub-tabs .hub-tab:is(.active,.is-active) {
    border-color:transparent;
    color:var(--white);
    background:var(--black);
    box-shadow:none;
  }

  html.dark-mode .desktop-sidebar-library-head { border-color:color-mix(in srgb,var(--border) 76%,transparent); }
  html.dark-mode .desktop-sidebar-library-head h2 { color:var(--black); }
  html.dark-mode .desktop-sidebar-library-item,
  html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-create,
  html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-download {
    border-color:transparent;
    color:var(--black);
    background:transparent;
    box-shadow:none;
  }

  html.dark-mode .desktop-sidebar-library-item:hover,
  html.dark-mode .desktop-sidebar-library-item.is-active,
  html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-create:hover,
  html.dark-mode .desktop-sidebar-library-item.desktop-sidebar-library-item-download:hover {
    border-color:transparent;
    color:var(--black);
    background:var(--surface-2);
    box-shadow:none;
  }

  html.dark-mode .desktop-sidebar-library-icon { border-color:transparent; box-shadow:none; }
  html.dark-mode .desktop-sidebar-library-loading,
  html.dark-mode .desktop-sidebar-library-empty { border-color:transparent; background:var(--surface-2); }
}

html.dark-mode .admin-world-map-country.is-hovered {
  stroke: rgba(235, 242, 255, 0.84);
}

html.dark-mode .admin-map-list-row,
html.dark-mode .admin-map-ranked-row,
html.dark-mode .admin-map-moderation div {
  background: rgba(120, 164, 255, 0.08);
}

html.dark-mode .admin-map-list-row i {
  background: rgba(120, 164, 255, 0.12);
}

html.dark-mode .playlist-sheet-modal {
  background:
    radial-gradient(circle at 50% 0%, rgba(120, 164, 255, 0.18), transparent 34%),
    rgba(4, 7, 12, 0.68);
}

html.dark-mode .playlist-sheet-modal .modal-content {
  background: linear-gradient(180deg, rgba(21, 27, 38, 0.98) 0%, rgba(13, 18, 27, 0.98) 100%) !important;
  border-color: rgba(120, 164, 255, 0.2) !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.52) !important;
}

html.dark-mode .playlist-sheet-modal .modal-header,
html.dark-mode .playlist-sheet-modal .modal-footer {
  background: linear-gradient(135deg, rgba(76, 132, 255, 0.12), rgba(28, 185, 116, 0.07)) !important;
  border-color: rgba(120, 164, 255, 0.16) !important;
}

html.dark-mode .playlist-sheet-modal .modal-header h2,
html.dark-mode .add-playlist-create-card,
html.dark-mode .add-playlist-name,
html.dark-mode .create-playlist-cover-copy strong {
  color: var(--text-color) !important;
}

html.dark-mode .add-playlist-card {
  background: rgba(18, 24, 35, 0.72) !important;
  border-color: rgba(120, 164, 255, 0.14) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode .playlist-sheet-modal .modal-close,
html.dark-mode .create-playlist-cover-picker,
html.dark-mode .playlist-input-shell {
  background: rgba(18, 24, 35, 0.82) !important;
  border-color: rgba(120, 164, 255, 0.16) !important;
}

html.dark-mode .add-playlist-create-card {
  background: linear-gradient(135deg, rgba(76, 132, 255, 0.12), rgba(28, 185, 116, 0.09)) !important;
  border-color: rgba(120, 164, 255, 0.2) !important;
}

html.dark-mode .add-playlist-scroll {
  background: transparent !important;
  border-color: transparent !important;
}

html.dark-mode .add-playlist-empty {
  background: rgba(18, 24, 35, 0.64) !important;
  border-color: rgba(120, 164, 255, 0.14) !important;
}

html.dark-mode .playlist-input-shell input,
html.dark-mode .playlist-input-shell textarea {
  color: var(--text-color) !important;
}

html.dark-mode .playlist-sheet-modal {
  background: rgba(5, 8, 13, 0.68) !important;
}

html.dark-mode .playlist-sheet-modal .modal-content {
  background: #111723 !important;
  border-color: var(--border) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.42) !important;
}

html.dark-mode .playlist-sheet-modal .modal-header,
html.dark-mode .playlist-sheet-modal .modal-footer {
  background: transparent !important;
  border-color: var(--border) !important;
}

html.dark-mode .add-playlist-create-card,
html.dark-mode .add-playlist-card,
html.dark-mode .create-playlist-cover-picker,
html.dark-mode .playlist-input-shell,
html.dark-mode .playlist-sheet-modal .modal-close {
  background: #141a24 !important;
  border-color: var(--border) !important;
  box-shadow: none !important;
}

@media (max-width: 768px) {
  html.dark-mode .modal {
    background: rgba(5, 8, 13, 0.68) !important;
  }

  html.dark-mode .modal .modal-content {
    background: #111723 !important;
    border-color: var(--border) !important;
    box-shadow: 0 -24px 72px rgba(0, 0, 0, 0.48) !important;
  }

  html.dark-mode .modal:not(.playlist-sheet-modal) .modal-content::before {
    background: rgba(130, 145, 165, 0.52) !important;
  }

  html.dark-mode .modal .modal-header,
  html.dark-mode .modal .modal-footer {
    background: transparent !important;
    border-color: transparent !important;
  }

  html.dark-mode .modal .modal-header h2 {
    color: var(--text-color) !important;
  }

  html.dark-mode .modal .modal-close {
    background: #141a24 !important;
    border-color: var(--border) !important;
    color: var(--text-secondary) !important;
    box-shadow: none !important;
  }
}

html.dark-mode .add-playlist-cover,
html.dark-mode .create-playlist-cover-preview {
  background: rgba(120, 164, 255, 0.12) !important;
}

html.dark-mode .add-playlist-action {
  background: rgba(120, 164, 255, 0.14) !important;
  color: var(--blue) !important;
}

html.dark-mode .add-playlist-action:hover,
html.dark-mode .add-playlist-action:focus-visible {
  background: var(--blue) !important;
  color: var(--white) !important;
}

@media (max-width: 980px) {
  html.dark-mode .messages-page.is-mobile-messages .messages-reply-preview,
  html.dark-mode .messages-page.is-mobile-messages.is-mobile-thread-view .messages-compose {
    background: transparent !important;
  }
}

@media (max-width: 900px) {
  html.dark-mode .playlist-sheet-grabber {
    background: rgba(255, 255, 255, 0.78) !important;
  }
}

@media (max-width: 768px) {
  html.dark-mode .modal:not(.playlist-sheet-modal) .modal-content::before,
  html.dark-mode .custom-context-menu-list::before,
  html.dark-mode .custom-context-menu-list--share::before {
    background: rgba(255, 255, 255, 0.78) !important;
  }
}

@media (min-width: 1024px) {
  html.dark-mode .detail-liquid-background {
    background: var(--white);
  }

  html.dark-mode .detail-liquid-background.is-ready {
    opacity: 0.78;
  }
}

html.dark-mode .release-details-list {
  background: var(--white);
  border-color: transparent;
}

html.dark-mode .release-details-list .sd-detail-row {
  border-bottom-color: color-mix(in srgb, var(--border) 78%, transparent);
}

html.dark-mode #playlistTracksList,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist,
html.dark-mode .release-details-list,
html.dark-mode .song-detail-container .sd-detail-grid {
  background: rgba(255, 255, 255, 0.075);
  border-color: transparent;
  -webkit-backdrop-filter: blur(26px) saturate(155%);
  backdrop-filter: blur(26px) saturate(155%);
}

html.dark-mode #playlistTracksList .tracks-header,
html.dark-mode #playlistTracksList .track-row,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .tracks-header,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .track-row,
html.dark-mode .release-details-list .sd-detail-row,
html.dark-mode .song-detail-container .sd-detail-grid .sd-detail-row {
  background: transparent;
}

html.dark-mode #playlistTracksList .tracks-header,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .tracks-header {
  background: rgba(255, 255, 255, 0.055);
}

html.dark-mode #playlistTracksList .track-row:hover,
html.dark-mode .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist .track-row:hover {
  background: rgba(255, 255, 255, 0.1);
}

@media (min-width: 1024px) {
  html.dark-mode .main-content:has(> .detail-liquid-background) .detail-context-menu-trigger,
  html.dark-mode .main-content:has(> .detail-liquid-background) .tag-chip-link {
    background: rgba(255, 255, 255, 0.075);
  }
}

html.dark-mode #playlistRecommendationsList {
  background: rgba(255, 255, 255, 0.075);
  border-color: transparent;
  -webkit-backdrop-filter: blur(26px) saturate(155%);
  backdrop-filter: blur(26px) saturate(155%);
}

html.dark-mode #playlistRecommendationsList .tracks-header,
html.dark-mode #playlistRecommendationsList .track-row {
  background: transparent;
  border-color: var(--border);
}

html.dark-mode #playlistRecommendationsList .tracks-header {
  background: rgba(255, 255, 255, 0.055);
}

html.dark-mode #playlistRecommendationsList .track-row:hover {
  background: rgba(255, 255, 255, 0.1);
}

html.dark-mode #playlistRecommendationsList .track-btn,
html.dark-mode .playlist-recommendations .track-btn[data-recommend-add="true"] {
  color: rgb(var(--detail-accent-rgb, 111, 140, 255));
}

@media (max-width: 768px) {
  html.dark-mode #playlistRecommendationsList {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* Liquid detail pages always keep a light foreground in dark mode. */
html.dark-mode #mainContent :is(.mobile-top-blend-release, .mobile-top-blend-song) :is(
  .playlist-title,
  .playlist-title a,
  .playlist-type,
  .playlist-description,
  .playlist-meta,
  .playlist-meta .meta-item,
  .playlist-creators-inline,
  .release-artist-link,
  .sd-title,
  .sd-artist-link,
  .sd-chip,
  .tag-chip-link,
  .sv-verification-badge,
  .status-lock-icon
) {
  color: #fff !important;
}

html.dark-mode #mainContent :is(.mobile-top-blend-release, .mobile-top-blend-song) :is(.sd-chip, .tag-chip-link) {
  border-color: rgba(255, 255, 255, 0.42) !important;
  background: rgba(0, 0, 0, 0.52) !important;
}

html.dark-mode #mainContent :is(
  #playlistTracksList,
  .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist
) :is(.track-name, .track-name a, .track-title, .track-title a, .track-artist, .track-artist a) {
  color: #fff !important;
}

html.dark-mode #mainContent :is(
  #playlistTracksList,
  .playlist-detail-container:not([data-playlist-id]):not(.profile-release-list-card) .playlist-content > .tracks-list.contracklist
) :is(.tracks-header, .track-number, .track-meta-small, .track-stats) {
  color: rgba(255, 255, 255, 0.74) !important;
}

html.dark-mode .settings-profile-media-row,
html.dark-mode .settings-social-field,
html.dark-mode .settings-mobile-index-row {
  border-color: rgba(255, 255, 255, 0.1);
}

html.dark-mode .settings-mobile-index-row {
  color: var(--black);
  background: transparent;
}

html.dark-mode .settings-profile-save-row {
  background: var(--white);
}

html.dark-mode .super-fan-level-up-toast {
  color: var(--black);
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(15, 17, 21, 0.9);
  box-shadow: 0 14px 42px rgba(0, 0, 0, 0.42);
}

html.dark-mode .super-fan-level-up-toast small {
  color: var(--muted);
}

@media (max-width: 1023px) {
  html.dark-mode #releaseUploadPage {
    --upload-native-action-bg: rgba(15, 17, 21, 0.94);
    color-scheme: dark;
  }

  html.dark-mode #releaseUploadPage .upload-stepper {
    background: var(--upload-native-action-bg);
    border-color: rgba(255, 255, 255, 0.1);
  }

  html.dark-mode #releaseUploadPage .upload-section {
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  html.dark-mode #releaseUploadPage :is(
    .upload-form-grid > .form-group,
    .upload-meta-row > .form-group,
    .upload-policy-row,
    #releaseTracksList .track-row,
    #releaseTracksList .track-edit-panel,
    .upload-rec-card,
    .upload-add-track-bar
  ) {
    border-color: rgba(255, 255, 255, 0.1);
  }

  html.dark-mode #releaseUploadPage .form-group :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select) {
    border-color: rgba(255, 255, 255, 0.13);
    background: transparent;
    color: var(--black);
    box-shadow: none;
  }

  html.dark-mode #releaseUploadPage .form-group :is(input, textarea)::placeholder {
    color: rgba(154, 163, 178, 0.68);
  }

  html.dark-mode #releaseUploadPage select option {
    background: var(--surface-1);
    color: var(--black);
  }

  html.dark-mode #releaseUploadPage .upload-cover-zone,
  html.dark-mode #releaseUploadPage .upload-audio-dropzone {
    border-color: rgba(120, 164, 255, 0.3);
    background: rgba(120, 164, 255, 0.055);
  }

  html.dark-mode #releaseUploadPage .upload-audio-dropzone.has-files {
    border-color: rgba(58, 210, 159, 0.5);
    background: rgba(58, 210, 159, 0.07);
  }

  html.dark-mode #releaseUploadPage .upload-visibility-options {
    background: rgba(255, 255, 255, 0.055);
  }

  html.dark-mode #releaseUploadPage .upload-vis-opt span {
    border: 0;
    background: transparent;
    color: var(--text-secondary);
  }

  html.dark-mode #releaseUploadPage .upload-vis-opt input[type="radio"]:checked + span {
    border: 0;
    background: var(--surface-2);
    color: #eaf2ff;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.38);
  }

  html.dark-mode #releaseUploadPage .upload-policy-row,
  html.dark-mode #releaseUploadPage .upload-track-form-card,
  html.dark-mode #releaseUploadPage #releaseTracksList .track-row,
  html.dark-mode #releaseUploadPage :is(.upload-rec-card, .upload-rec-card--highlight) {
    background: transparent;
    box-shadow: none;
  }

  html.dark-mode #releaseUploadPage .upload-actions {
    border-color: rgba(255, 255, 255, 0.1);
    background: var(--upload-native-action-bg);
  }

  html.dark-mode #releaseUploadPage .upload-actions-track {
    border: 0;
    background: transparent;
  }

  html.dark-mode #releaseUploadPage .upload-published-title {
    background: linear-gradient(90deg, var(--black) 0%, #9db4ff 50%, var(--black) 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
  }
}

/* Keep the connected mobile player and dock on one dark glass surface. */
@media (max-width:1023px) {
  html.dark-mode {
    --mobile-dock-background:rgba(15,18,26,.92);
    --mobile-dock-border:rgba(43,49,64,.92);
  }

  html.dark-mode .mobile-bottom-nav,
  html.dark-mode #playerSection {
    background:var(--mobile-dock-background);
    border-color:var(--mobile-dock-border);
    -webkit-backdrop-filter:blur(24px) saturate(155%);
    backdrop-filter:blur(24px) saturate(155%);
  }

  html.dark-mode body.mobile-player-visible .mobile-bottom-nav {
    border-top-color:transparent;
  }

  html.dark-mode body.mobile-player-visible .mobile-bottom-nav::before {
    opacity:0;
  }
}

/* Profile detail refresh — dark palette parity. */
html.dark-mode .mobile-top-blend-profile :is(.profile-cover,.profile-hero-art,.profile-cover-ambient) {
  background-color:var(--surface-2)!important;
}

html.dark-mode .mobile-top-blend-profile .profile-content .tracks-list,
html.dark-mode .mobile-top-blend-profile .profile-content .track-item {
  background:transparent!important;
  box-shadow:none!important;
}

@media (min-width:1024px) {
  html.dark-mode .mobile-top-blend-profile .profile-header-banner img {
    opacity:1;
  }

  html.dark-mode .mobile-top-blend-profile .profile-header-banner::after {
    background:linear-gradient(to bottom,var(--white) 0%,color-mix(in srgb,var(--white) 72%,transparent) 8%,transparent 27%,transparent 58%,color-mix(in srgb,var(--white) 18%,transparent) 72%,var(--white) 100%);
  }
}

@media (max-width:768px) {
  html.dark-mode .mobile-top-blend-profile .profile-cover {
    background:var(--white)!important;
  }

  html.dark-mode .mobile-top-blend-profile .profile-cover::after {
    background:linear-gradient(to bottom,rgba(2,4,8,.12) 0%,rgba(2,4,8,.34) 58%,var(--white) 100%);
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    -webkit-mask-image:none;
    mask-image:none;
  }

  html.dark-mode .mobile-top-blend-profile .profile-title-row .usernamee {
    color:rgb(var(--detail-readable-rgb,255,255,255));
    text-shadow:0 1px 3px rgba(var(--detail-readable-panel-rgb,0,0,0),.62);
  }

  html.dark-mode .mobile-top-blend-profile :is(.playlist-type,.profile-monthly-listeners) {
    color:rgba(var(--detail-readable-rgb,255,255,255),.8);
    text-shadow:none;
  }
}

html.dark-mode #mainContent .song-detail-container.mobile-top-blend-song .sd-chips .sd-chip {
  border:0!important;
  background:transparent!important;
  color:rgba(var(--detail-readable-rgb,255,255,255),.8)!important;
  box-shadow:none!important;
  text-shadow:none!important;
}

@media (max-width:768px) {
  html.dark-mode .player-mobile-play-btn,
  html.dark-mode .player-mobile-next-btn {
    color:var(--black)!important;
    background:transparent;
  }
}

html.dark-mode :is(.track-card,.playlist-card,.discovery-artist-card,.account-result-card,.discovery-top-card,.messages-entity-card,.profile-about-card,.profile-upcoming-card),
html.dark-mode :is(.track-card,.playlist-card) :is(.track-info,.playlist-info) {
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Keep the refreshed onboarding flat and native in dark mode. */
html.dark-mode .onboard-shell,
html.dark-mode .onboard-stage {
  border-color:transparent;
  background:transparent;
  box-shadow:none;
}

html.dark-mode .onboard-brand,
html.dark-mode .onboard-progress-pill {
  border-color:transparent;
  background:transparent;
}

html.dark-mode .onboard-genre-card {
  border-color:transparent;
  background:var(--surface-2);
  box-shadow:none;
}

html.dark-mode .onboard-genre-card:hover,
html.dark-mode .onboard-genre-card.is-selected {
  border-color:transparent;
  box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--blue) 55%,transparent);
}

html.dark-mode .onboard-artist-card,
html.dark-mode .onboard-notification-row {
  background:transparent;
}

html.dark-mode .onboard-summary-card,
html.dark-mode .onboard-empty,
html.dark-mode .onboard-search-box {
  border-color:transparent;
  background:var(--surface-2);
}

html.dark-mode .onboard-search-box input {
  border-color:transparent;
  background:transparent;
}

html.dark-mode .onboard-loading-card {
  border-color:transparent;
  background:var(--surface-1);
}

/* Flat media details retain the liquid artwork color in dark mode. */
html.dark-mode :is(
  #playlistTracksList,
  #playlistRecommendationsList,
  .playlist-detail-container:not([data-playlist-id]) .playlist-content > .tracks-list.contracklist,
  .release-details-list,
  .song-detail-container .sd-detail-grid
) {
  border-color:transparent;
  background:transparent!important;
  box-shadow:none;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

html.dark-mode :is(#playlistTracksList,#playlistRecommendationsList) :is(.tracks-header,.track-row),
html.dark-mode .playlist-detail-container:not([data-playlist-id]) .playlist-content > .tracks-list.contracklist :is(.tracks-header,.track-row) {
  background:transparent!important;
}

@media (min-width:1024px) {
  html.dark-mode :is(#playlistTracksList,#playlistRecommendationsList) .track-row:hover,
  html.dark-mode .playlist-detail-container:not([data-playlist-id]) .playlist-content > .tracks-list.contracklist .track-row:hover {
    background:rgba(255,255,255,.07)!important;
  }
}

@media (max-width:1023px) {
  html.dark-mode .playlist-detail-container.mobile-top-blend-release .detail-context-menu-trigger,
  html.dark-mode .song-detail-container.mobile-top-blend-song .detail-context-menu-trigger {
    background:rgba(18,21,29,.72);
    color:var(--black);
  }

  html.dark-mode #mainContent :is(.mobile-top-blend-release,.mobile-top-blend-song) .tag-chip-link {
    border-color:transparent!important;
    background:var(--surface-2)!important;
    color:var(--text-secondary)!important;
  }
}

/* Unified workspace headers and listening history */
@media (min-width:1024px) {
  html.dark-mode :is(.settings-container,.playlists-container) > .workspace-page-hero.playlists-header,
  html.dark-mode :is(.settings-container,.playlists-container) > .workspace-page-hero.playlists-header:hover {
    border:0!important;
    border-bottom:1px solid color-mix(in srgb,var(--border) 76%,transparent)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
}

html.dark-mode .history-page > .history-page-hero {
  border-color:color-mix(in srgb,var(--border) 76%,transparent);
  background:transparent;
  box-shadow:none;
}

html.dark-mode .history-page-hero-icon { color:#b69aff; background:color-mix(in srgb,#8b5cf6 15%,var(--surface-2)); }
html.dark-mode .history-total-plays { border:0; background:transparent; box-shadow:none; }
html.dark-mode .history-total-plays strong { color:var(--black); }
html.dark-mode .history-panel { border-radius:0; background:transparent; box-shadow:none; }
html.dark-mode .history-tabs { border:0; background:var(--surface-2); }
html.dark-mode .history-tab { color:var(--text-secondary); }
html.dark-mode .history-tab:hover { color:var(--black); }
html.dark-mode .history-tab.is-active { border:0; color:var(--white); background:var(--black); box-shadow:none; }

html.dark-mode .history-page .history-track-row,
html.dark-mode .history-page .history-artist-row {
  border-color:color-mix(in srgb,var(--border) 66%,transparent);
  border-radius:0;
  background:transparent;
}

html.dark-mode .history-page .history-track-row:hover,
html.dark-mode .history-page .history-artist-row:hover {
  border-color:color-mix(in srgb,var(--border) 66%,transparent);
  background:rgba(255,255,255,.05);
}

html.dark-mode .history-track-cover,
html.dark-mode .history-artist-avatar { border:0; background:var(--surface-2); }
html.dark-mode .history-page .play-track-btn { border:0; color:var(--black); background:var(--surface-2); }
html.dark-mode .history-page .play-track-btn:hover,
html.dark-mode .history-page .play-track-btn.is-now-playing { border:0; color:var(--white); background:var(--blue); }
html.dark-mode .history-empty { border:0; background:transparent; }

/* Native Settings and Artist Hub dark surfaces */
html.dark-mode #settingsPage > .settings-tab-content:not(#profile-tab):not(#super-fan-tab) :is(.settings-form > .form-group,.settings-form > .preferences-card,.danger-section,.preferences-note,.oauth-app-card),
html.dark-mode #settingsPage #billing-tab :is(.ap-card,.ap-gift-card,.ap-my-gifts-card,.ap-native-disclosure,.ap-invoices),
html.dark-mode #artistHubReleasesPage > .hub-tab-panel:not([data-hub-panel="super-fans"]) :is(.settings-section,.promotion-kpi-card,.lyrics-quick-launch,.lyrics-marketplace-topbar,.lyrics-marketplace-section,.cherry-video-hub-section,.lyrics-marketplace-card,.artist-stat-card,.artist-analytics-chart-card,.artist-audience-block,.artist-audience-entities,.artist-audience-entity-card,.artist-chart-kpi-item,.artist-audience-list li,.artist-audience-entity-item,.artist-smoothed-chart) {
  background:transparent!important;
  box-shadow:none!important;
}

html.dark-mode #settingsPage > .settings-tab-content:not(#profile-tab):not(#super-fan-tab) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,select),
html.dark-mode #settingsPage #billing-tab :is(.ap-plan-btn,.ap-gift-plan-btn,.ap-billing-disclosure,.ap-invoice-empty),
html.dark-mode #artistHubReleasesPage :is(.artist-analytics-tip,.cherry-support-launch) {
  background:var(--surface-2)!important;
  box-shadow:none!important;
}

html.dark-mode #artistHubReleasesPage .artist-world-map-wrap {
  border-color:color-mix(in srgb,var(--border) 72%,transparent);
  background:color-mix(in srgb,var(--surface-2) 84%,transparent);
  box-shadow:none;
}

/* Native Messages, Cherry Select, and Cherry Support */
html.dark-mode .messages-page,
html.dark-mode .messages-bottom-rail,
html.dark-mode #cherrySelectPage,
html.dark-mode #cherrySelectPage.has-dynamic-theme,
html.dark-mode .cherry-support-window {
  border-color:var(--border);
  background:var(--white)!important;
}

html.dark-mode :is(.messages-compose-inner,.messages-conversation-item.is-active,.messages-message.is-incoming .messages-message-text,.messages-entity-card,.cherry-select-header-actions button,.cherry-select-suggestion,.cs-msg-dj .cs-msg-text,.cherry-select-compose-inner,.cherry-support-action) {
  border-color:transparent;
  background:var(--surface-2)!important;
  box-shadow:none;
}

html.dark-mode :is(.messages-message.is-outgoing .messages-message-text,.cs-msg-user .cs-msg-text) {
  background:var(--blue)!important;
  color:#fff!important;
}

html.dark-mode :is(.messages-entity-card,.cs-track-card) { box-shadow:none; }
html.dark-mode .cs-track-card { border-color:color-mix(in srgb,var(--border) 66%,transparent); background:transparent!important; }
html.dark-mode :is(.cherry-select-header-icon,.cherry-select-welcome-icon) { color:var(--blue); background:color-mix(in srgb,var(--blue) 14%,var(--surface-2)); }

/* soundvia for Artists */
html.dark-mode .artist-studio {
  color-scheme:dark;
}

html.dark-mode .artist-studio .artist-studio-notice {
  border-color:color-mix(in srgb,var(--blue) 28%,var(--border));
  color:var(--black);
  background:color-mix(in srgb,var(--blue) 8%,var(--surface-1));
}

html.dark-mode .artist-studio :is(
  .artist-studio-sidebar,
  .artist-studio-topbar,
  .artist-studio-section,
  .artist-studio-metrics,
  .artist-studio-dialog-card,
  .artist-studio-search-results,
  .artist-studio-artist-menu,
  .artist-studio-user-menu,
  .artist-studio-site-popup .site-popup-card
) {
  box-shadow:none;
}

html.dark-mode .artist-studio .artist-studio-site-popup .site-popup-card {
  border-color:var(--as-border);
  color:var(--as-text);
  background:var(--as-panel);
}

html.dark-mode .artist-studio .custom-context-menu.artist-studio-account-menu:not(.playlist-sheet-modal) {
  border-color:rgba(120,164,255,.26);
  background:rgba(13,18,29,.98);
  box-shadow:0 18px 30px rgba(0,0,0,.44);
}

html.dark-mode .artist-studio .artist-studio-account-menu:not(.playlist-sheet-modal) .custom-context-menu-item {
  color:var(--text-primary);
}

html.dark-mode .artist-studio .artist-studio-account-menu:not(.playlist-sheet-modal) .custom-context-menu-item:hover {
  color:var(--blue);
  border-color:rgba(120,164,255,.3);
  background:rgba(120,164,255,.14);
}

html.dark-mode .artist-studio .artist-studio-account-menu:not(.playlist-sheet-modal) .custom-context-menu-item.context-action-danger {
  color:#ff8f8f !important;
}

html.dark-mode .artist-studio .artist-studio-account-menu:not(.playlist-sheet-modal) .custom-context-menu-item.context-action-danger:hover {
  color:#ff9a9a !important;
  border-color:rgba(255,140,140,.28);
  background:rgba(255,140,140,.12);
}

html.dark-mode .artist-studio .artist-studio-hero .artist-studio-button:not(.is-primary) {
  border-color:rgba(255,255,255,.35);
  color:#fff;
  background:rgba(13,15,18,.76);
}

html.dark-mode .artist-studio .artist-studio-toast { background:#16724c; }
html.dark-mode .artist-studio .artist-studio-toast.is-error { background:#a92e39; }

html.dark-mode .artist-studio .artist-studio-release-detail-hero {
  background:
    radial-gradient(circle at 12% 12%,color-mix(in srgb,var(--as-accent) 20%,transparent),transparent 38%),
    linear-gradient(135deg,#131a2a,var(--as-panel));
  box-shadow:none;
}

html.dark-mode .artist-studio .artist-studio-release-detail-hero > img {
  box-shadow:0 20px 42px rgba(0,0,0,.38);
}

html.dark-mode .artist-studio .artist-studio-release-pitch {
  background:linear-gradient(145deg,color-mix(in srgb,var(--as-accent) 11%,var(--as-panel)),var(--as-panel));
}

html.dark-mode .artist-studio .artist-studio-release-track-number {
  background:color-mix(in srgb,var(--as-accent) 15%,var(--as-panel-subtle));
}

html.dark-mode .artist-studio .artist-studio-release-track-credits > div > span {
  border:1px solid color-mix(in srgb,var(--as-border) 78%,transparent);
}

html.dark-mode .artist-studio .artist-studio-release-platforms details,
html.dark-mode .artist-studio .artist-studio-platform-item {
  box-shadow:none;
}

html.dark-mode .artist-studio .artist-studio-platform-dot {
  border-color:var(--as-panel);
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.28);
}

html.dark-mode .lp-page .lp-manager-access {
  border-color:var(--border);
  color:var(--black);
  background:var(--surface-1);
}

html.dark-mode .artist-studio .artist-studio-merch-card,
html.dark-mode .sv-merch-card {
  box-shadow:none;
}

html.dark-mode .artist-studio .artist-studio-merch-error {
  color:#ff9a9f;
}

html.dark-mode #settingsPage #billing-tab .ap-card {
  border-color:rgba(120,164,255,.28)!important;
  background:#101622!important;
  box-shadow:0 22px 54px rgba(0,0,0,.3)!important;
}

html.dark-mode #settingsPage #billing-tab .ap-perk-card {
  border-color:color-mix(in srgb,var(--perk-color) 34%,var(--border));
  background:color-mix(in srgb,var(--perk-color) 12%,#101622);
}

html.dark-mode #settingsPage #billing-tab .ap-perk-card strong { color:var(--text-primary); }
html.dark-mode #settingsPage #billing-tab .ap-perk-card p { color:var(--text-secondary); }

html.dark-mode #settingsPage #billing-tab .ap-benefits-disclosure,
html.dark-mode #settingsPage #billing-tab .ap-plan-btn,
html.dark-mode #settingsPage #billing-tab .ap-my-gifts-card {
  border-color:var(--border)!important;
  background:#111722!important;
}

html.dark-mode #settingsPage #billing-tab .ap-feature {
  border-color:rgba(120,164,255,.18);
  color:var(--text-primary);
  background:rgba(120,164,255,.08);
}

html.dark-mode #settingsPage #billing-tab .ap-feature:hover { background:rgba(120,164,255,.14); }

html.dark-mode #settingsPage #billing-tab .ap-plan-btn.is-selected {
  border-color:rgba(120,164,255,.58)!important;
  background:rgba(111,140,255,.14)!important;
  box-shadow:inset 0 0 0 2px var(--blue),0 16px 32px rgba(0,0,0,.28)!important;
}

html.dark-mode #settingsPage #billing-tab .ap-gift-card {
  border-color:rgba(159,126,255,.3)!important;
  background:linear-gradient(145deg,rgba(139,92,246,.13),rgba(236,72,153,.07)),#111722!important;
  box-shadow:0 18px 44px rgba(0,0,0,.24)!important;
}

html.dark-mode #settingsPage #billing-tab .ap-gift-icon-wrap { color:#fff; }

html.dark-mode #settingsPage #billing-tab .ap-card,
html.dark-mode #settingsPage #billing-tab .ap-gift-card {
  border-color:var(--border)!important;
  background:var(--surface-1)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.24)!important;
}

html.dark-mode #settingsPage #billing-tab .ap-billing-hero {
  color:#0f121a;
  background:var(--blue);
}

html.dark-mode #settingsPage #billing-tab .ap-billing-hero .ap-card-title,
html.dark-mode #settingsPage #billing-tab .ap-billing-hero .ap-card-sub,
html.dark-mode #settingsPage #billing-tab .ap-billing-hero .ap-billing-brand { color:#0f121a; }

html.dark-mode #settingsPage #billing-tab .ap-billing-hero .ap-status-pill {
  border-color:rgba(15,18,26,.24);
  color:#0f121a;
  background:rgba(255,255,255,.24);
}

html.dark-mode #settingsPage #billing-tab .ap-benefits-disclosure { background:var(--surface-2)!important; }

html.dark-mode #settingsPage #billing-tab .ap-feature,
html.dark-mode #settingsPage #billing-tab .ap-feature:hover {
  border-color:var(--border);
  color:var(--text-primary);
  background:transparent;
}

html.dark-mode #settingsPage #billing-tab .ap-gift-icon-wrap {
  border-color:var(--blue);
  color:#0f121a;
  background:var(--blue);
}

html.dark-mode #settingsPage #billing-tab .ap-gift-plan-btn.is-active {
  border-color:var(--blue)!important;
  background:rgba(120,164,255,.12)!important;
  box-shadow:inset 0 0 0 2px var(--blue)!important;
}

/* Lyric Video Maker · workspace dark palette */
html.dark-mode .settings-container.lyrics-video-page {
  --lvm-panel: #111318;
  --lvm-subtle: #171b23;
  --lvm-border: #272d38;
  --lvm-text: #eef1f7;
  --lvm-muted: #9fa8b8;
  --lvm-accent: #7898ff;
}

html.dark-mode .settings-container.lyrics-video-page :is(
  .lyrics-video-preview-panel,
  .lyrics-video-export-bar,
  .lyrics-video-control-rail,
  .lyrics-video-control-flyout
) {
  border-color: var(--lvm-border);
  background: var(--lvm-panel);
  box-shadow: none;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-flyout {
  overflow: hidden;
}

@media (min-width: 1024px) {
  html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-flyout {
    max-height: none;
  }
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-rail {
  max-height: calc(100dvh - 112px);
  overflow-y: auto;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-surface-header {
  border-bottom-color: var(--lvm-border);
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-panel > .form-group {
  border: 0;
  border-bottom: 1px solid var(--lvm-border);
  border-radius: 0;
  color: var(--lvm-text);
  background: transparent;
  box-shadow: none;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-panel > .form-group:last-child {
  border-bottom: 0;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-canvas-stage {
  border-color: #252a34;
  background: #090b0f;
  box-shadow: none;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-fake-player {
  border: 0;
  color: var(--lvm-muted);
  background: transparent;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-rail-btn {
  border-color: transparent;
  color: var(--lvm-muted);
  background: transparent;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-rail-btn:hover {
  border-color: transparent;
  color: var(--lvm-text);
  background: #1a1f29;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-rail-btn.is-active {
  border-color: transparent;
  color: var(--lvm-text);
  background: #1c2230;
}

html.dark-mode .settings-container.lyrics-video-page :is(
  .lyrics-video-visual-select-card,
  .lyrics-video-choice-card,
  .lyrics-video-line-option,
  .lyrics-video-effect-word-chip,
  .lyrics-video-bg-item,
  .lyrics-video-pinterest-card,
  .lyrics-video-override-accordion,
  .lyrics-video-override-subaccordion,
  .lyrics-video-override-section,
  .lyrics-video-effect-line-row,
  .lyrics-video-effect-layer-card,
  .lyrics-video-effect-layer-group
) {
  border-color: var(--lvm-border);
  color: var(--lvm-text);
  background: var(--lvm-panel);
}

html.dark-mode .settings-container.lyrics-video-page :is(
  .lyrics-video-visual-select-card,
  .lyrics-video-choice-card
):hover {
  border-color: #3a4559;
  background: var(--lvm-subtle);
}

html.dark-mode .settings-container.lyrics-video-page :is(
  .lyrics-video-visual-select-card,
  .lyrics-video-choice-card
).is-active {
  border-color: #607bd1;
  background: #1b2130;
}

html.dark-mode .settings-container.lyrics-video-page :is(
  .lyrics-video-lines,
  .lyrics-video-effect-selector,
  .lyrics-video-bg-empty,
  .lyrics-video-pinterest-empty,
  .file-input-label
) {
  border-color: var(--lvm-border);
  color: var(--lvm-muted);
  background: var(--lvm-panel);
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-control-panel :is(
  select,
  textarea,
  input[type="text"],
  input[type="number"],
  input[type="search"],
  input[type="url"],
  input[type="color"]
) {
  border-color: var(--lvm-border);
  color: var(--lvm-text);
  background-color: var(--lvm-panel);
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-actions .btn {
  border-color: var(--lvm-border);
  color: var(--lvm-text);
  background: var(--lvm-panel);
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-actions .btn:hover:not(:disabled) {
  border-color: #3a4352;
  color: var(--lvm-text);
  background: #1a1f28;
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-actions .btn-primary,
html.dark-mode .settings-container.lyrics-video-page .lyrics-video-actions .btn-primary:hover:not(:disabled) {
  border-color: transparent;
  color: #0e1220;
  background: var(--lvm-accent);
}

html.dark-mode .settings-container.lyrics-video-page .lyrics-video-actions .btn-primary:hover:not(:disabled) {
  background: #91aaff;
}

html.dark-mode #settingsPage #billing-tab .ap-plan-save-badge,
html.dark-mode #settingsPage #billing-tab .ap-gift-plan-save {
  border-color:rgba(120,164,255,.32);
  color:var(--blue);
  background:var(--surface-1);
}

html.dark-mode .lyrics-marketplace-page{color:#f8fafc}html.dark-mode .lyrics-marketplace-hero p,html.dark-mode .lyrics-marketplace-results-head,html.dark-mode .lyrics-marketplace-detail-description,html.dark-mode .lyrics-marketplace-card-meta,html.dark-mode .lyrics-marketplace-report-btn{color:#a7b0c0}html.dark-mode .lyrics-marketplace-filters,html.dark-mode .lyrics-video-marketplace-fields{background:#111827;border-color:#334155}html.dark-mode .lyrics-marketplace-filters input,html.dark-mode .lyrics-marketplace-filters select{background:#0b1220;border-color:#334155;color:#f8fafc}html.dark-mode .lyrics-marketplace-badges>span,html.dark-mode .lyrics-marketplace-tags>span{border-color:#475569;background:#111827}html.dark-mode .lyrics-marketplace-empty{border-color:#475569}html.dark-mode .lyrics-marketplace-detail-preview{box-shadow:0 24px 70px rgba(0,0,0,.55)}

html.dark-mode .artist-studio .lyrics-marketplace-page{color:var(--as-text)}html.dark-mode .artist-studio .lyrics-marketplace-filters,html.dark-mode .artist-studio .lyrics-marketplace-card,html.dark-mode .artist-studio .lyrics-marketplace-empty{border-color:var(--as-border);background:var(--as-panel);box-shadow:none}html.dark-mode .artist-studio .lyrics-marketplace-filters input,html.dark-mode .artist-studio .lyrics-marketplace-filters select{border-color:var(--as-border);color:var(--as-text);background:var(--as-bg)}html.dark-mode .artist-studio .lyrics-marketplace-hero p,html.dark-mode .artist-studio .lyrics-marketplace-results-head,html.dark-mode .artist-studio .lyrics-marketplace-detail-description,html.dark-mode .artist-studio .lyrics-marketplace-card-meta,html.dark-mode .artist-studio .lyrics-marketplace-report-btn{color:var(--as-muted)}html.dark-mode .artist-studio .lyrics-marketplace-detail-preview{border-color:var(--as-border);box-shadow:none}html.dark-mode .artist-studio .lyrics-marketplace-badges>span,html.dark-mode .artist-studio .lyrics-marketplace-tags>span{border-color:var(--as-border);background:var(--as-panel-subtle)}