:root {
  --raoliangyin-netease-red: #ec4141;
  --raoliangyin-netease-black: #161616;
  --raoliangyin-netease-surface: #1e1e1e;
  --raoliangyin-netease-gold: #C7A86B;
  --raoliangyin-tab-bar-height: 56px;
  --raoliangyin-mini-player-height: 52px;
  --raoliangyin-tab-inactive: #999999;
}

.raoliangyin-app[data-raoliangyin-theme="dark"] {
  --raoliangyin-background:
    radial-gradient(circle at 82% 12%, rgba(255, 255, 255, 0.5), transparent 26%),
    linear-gradient(180deg, #e8edf7 0%, #dfe6f5 50%, #d3dcf2 100%);
  --raoliangyin-accent: #ec4141;
  --raoliangyin-accent-soft: rgba(236, 65, 65, 0.14);
  --raoliangyin-text-main: #23262e;
  --raoliangyin-text-secondary: rgba(35, 38, 46, 0.78);
  --raoliangyin-text-muted: rgba(35, 38, 46, 0.48);
  --raoliangyin-track-color: rgba(35, 38, 46, 0.3);
  --raoliangyin-surface: rgba(255, 255, 255, 0.42);
  --raoliangyin-surface-strong: rgba(255, 255, 255, 0.58);
  --raoliangyin-shadow: rgba(60, 70, 110, 0.22);
  --raoliangyin-thumb-color: rgba(35, 38, 46, 0.45);
  --raoliangyin-button-border: rgba(255, 255, 255, 0.5);
  --raoliangyin-button-text: #23262e;
  --raoliangyin-soft-button-bg: rgba(236, 65, 65, 0.12);
  --raoliangyin-play-button-bg: linear-gradient(180deg, #ec4141, #d43c33);
  --raoliangyin-playlist-bg: rgba(245, 246, 252, 0.72);
  --raoliangyin-time-color: rgba(35, 38, 46, 0.72);
  --raoliangyin-overlay-bg: rgba(30, 34, 48, 0.18);
  --raoliangyin-control-side-bg: rgba(255, 255, 255, 0.4);
  --raoliangyin-control-side-border: rgba(255, 255, 255, 0.55);
  --raoliangyin-control-side-text: #23262e;
  --raoliangyin-control-mode-bg: rgba(236, 65, 65, 0.12);
  --raoliangyin-control-mode-text: #c23a32;
  --raoliangyin-import-bg: rgba(250, 250, 255, 0.85);
  --raoliangyin-import-shadow: rgba(40, 50, 90, 0.2);
  --raoliangyin-import-title: #23262e;
  --raoliangyin-import-label: rgba(35, 38, 46, 0.72);
  --raoliangyin-import-link: #ec4141;
  --raoliangyin-import-close-bg: rgba(255, 255, 255, 0.7);
  --raoliangyin-import-close-color: #3a3f4e;
  --raoliangyin-import-close-border: rgba(60, 70, 110, 0.12);
  --raoliangyin-import-control-border: rgba(60, 70, 110, 0.2);
  --raoliangyin-import-control-bg: rgba(255, 255, 255, 0.9);
  --raoliangyin-import-control-text: #2c303a;
  --raoliangyin-import-placeholder: rgba(70, 78, 100, 0.55);
  --raoliangyin-import-focus-border: rgba(236, 65, 65, 0.45);
  --raoliangyin-import-focus-ring: rgba(236, 65, 65, 0.12);
  --raoliangyin-import-button-bg: rgba(255, 255, 255, 0.92);
  --raoliangyin-import-button-text: #23262e;
  --raoliangyin-import-button-strong-bg: #23262e;
  --raoliangyin-import-button-strong-border: #23262e;
  --raoliangyin-import-button-strong-text: #ffffff;
  --raoliangyin-import-card-border: rgba(60, 70, 110, 0.14);
  --raoliangyin-import-card-bg: rgba(120, 130, 170, 0.08);
  --raoliangyin-import-card-title: #2c303a;
  --raoliangyin-import-hint-border: rgba(60, 70, 110, 0.2);
  --raoliangyin-import-hint-bg: rgba(255, 255, 255, 0.5);
  --raoliangyin-import-hint-text: rgba(50, 56, 78, 0.72);
  --raoliangyin-search-result-bg: rgba(255, 255, 255, 0.72);
  --raoliangyin-search-result-border: rgba(60, 70, 110, 0.16);
  --raoliangyin-search-result-title: #23262e;
  --raoliangyin-search-result-desc: rgba(50, 56, 78, 0.72);
}

.raoliangyin-app[data-raoliangyin-theme="light"] {
  --raoliangyin-background:
    radial-gradient(circle at 78% 10%, rgba(255, 255, 255, 0.72), transparent 26%),
    linear-gradient(180deg, #d7e8fb 0%, #cfe1f8 48%, #c1d8f4 100%);
  --raoliangyin-accent: #69a9f7;
  --raoliangyin-accent-soft: rgba(105, 169, 247, 0.26);
  --raoliangyin-text-main: #19477d;
  --raoliangyin-text-secondary: rgba(44, 93, 151, 0.78);
  --raoliangyin-text-muted: rgba(95, 138, 191, 0.62);
  --raoliangyin-track-color: rgba(123, 171, 232, 0.38);
  --raoliangyin-surface: rgba(255, 255, 255, 0.56);
  --raoliangyin-surface-strong: rgba(255, 255, 255, 0.7);
  --raoliangyin-shadow: rgba(85, 131, 188, 0.2);
  --raoliangyin-thumb-color: #ffffff;
  --raoliangyin-button-border: rgba(100, 149, 213, 0.12);
  --raoliangyin-button-text: #2d5f98;
  --raoliangyin-soft-button-bg: rgba(105, 169, 247, 0.16);
  --raoliangyin-play-button-bg: linear-gradient(180deg, #86c0ff, #5b9df0);
  --raoliangyin-playlist-bg: rgba(232, 242, 255, 0.96);
  --raoliangyin-time-color: rgba(65, 112, 169, 0.8);
  --raoliangyin-overlay-bg: rgba(116, 150, 194, 0.2);
  --raoliangyin-control-side-bg: rgba(255, 255, 255, 0.64);
  --raoliangyin-control-side-border: rgba(111, 165, 219, 0.16);
  --raoliangyin-control-side-text: #245987;
  --raoliangyin-control-mode-bg: rgba(102, 186, 255, 0.2);
  --raoliangyin-control-mode-text: #1f5687;
  --raoliangyin-import-bg: rgba(244, 248, 255, 0.96);
  --raoliangyin-import-shadow: rgba(64, 98, 150, 0.18);
  --raoliangyin-import-title: #123d6e;
  --raoliangyin-import-label: #486f98;
  --raoliangyin-import-link: #516fd4;
  --raoliangyin-import-close-bg: rgba(224, 236, 248, 0.92);
  --raoliangyin-import-close-color: #3f6b99;
  --raoliangyin-import-close-border: rgba(149, 181, 218, 0.24);
  --raoliangyin-import-control-border: rgba(189, 204, 222, 0.92);
  --raoliangyin-import-control-bg: rgba(255, 255, 255, 0.92);
  --raoliangyin-import-control-text: #355a84;
  --raoliangyin-import-placeholder: #8ba5c2;
  --raoliangyin-import-focus-border: #9fc1ef;
  --raoliangyin-import-focus-ring: rgba(122, 173, 234, 0.14);
  --raoliangyin-import-button-bg: rgba(255, 255, 255, 0.94);
  --raoliangyin-import-button-text: #294f79;
  --raoliangyin-import-button-strong-bg: #131313;
  --raoliangyin-import-button-strong-border: #131313;
  --raoliangyin-import-button-strong-text: #ffffff;
  --raoliangyin-import-card-border: rgba(197, 214, 235, 0.92);
  --raoliangyin-import-card-bg: rgba(228, 239, 251, 0.68);
  --raoliangyin-import-card-title: #173f6f;
  --raoliangyin-import-hint-border: rgba(165, 191, 223, 0.86);
  --raoliangyin-import-hint-bg: rgba(255, 255, 255, 0.28);
  --raoliangyin-import-hint-text: #6889ad;
  --raoliangyin-search-result-bg: rgba(255, 255, 255, 0.72);
  --raoliangyin-search-result-border: rgba(190, 208, 231, 0.9);
  --raoliangyin-search-result-title: #204b7a;
  --raoliangyin-search-result-desc: #6c8aac;
}

.raoliangyin-app[data-raoliangyin-theme="light"]:not([data-raoliangyin-bg]) .raoliangyin-app__bg {
  background:
    radial-gradient(circle at 78% 12%, rgba(255, 255, 255, 0.55), transparent 24%),
    radial-gradient(circle at 48% 66%, rgba(255, 255, 255, 0.26), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(120, 165, 220, 0.1));
}

.raoliangyin-app[data-raoliangyin-theme="light"] .raoliangyin-disc {
  background:
    radial-gradient(circle at center, #edf7ff 0 12%, #83b9e8 12% 14%, #eef7ff 14% 24%, transparent 24%),
    repeating-radial-gradient(circle at center, rgba(62, 123, 174, 0.08) 0 2px, rgba(255, 255, 255, 0.5) 2px 4px),
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.95), transparent 24%),
    linear-gradient(145deg, #fafdff, #d6ebff 55%, #b3d4f3);
  box-shadow:
    0 22px 50px rgba(88, 140, 190, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.92),
    inset 0 0 32px rgba(124, 173, 219, 0.12);
}

.raoliangyin-app[data-raoliangyin-theme="light"] .raoliangyin-disc__groove {
  background: radial-gradient(circle at center, rgba(98, 172, 255, 0.95), rgba(49, 102, 182, 0.92));
  box-shadow:
    inset 0 0 0 10px rgba(255, 255, 255, 0.3),
    0 0 24px rgba(79, 145, 221, 0.22);
}

.raoliangyin-app[data-raoliangyin-theme="light"] .raoliangyin-disc__groove::before {
  border-color: rgba(78, 129, 180, 0.12);
}

.raoliangyin-app[data-raoliangyin-theme="light"] .raoliangyin-disc__groove::after {
  border-color: rgba(72, 126, 180, 0.18);
}

.raoliangyin-app[data-raoliangyin-theme="light"] .raoliangyin-disc__cover--fallback {
  background:
    radial-gradient(circle at 50% 38%, rgba(255, 255, 255, 0.4), transparent 42%),
    linear-gradient(180deg, rgba(98, 172, 255, 0.92), rgba(49, 102, 182, 0.9));
  box-shadow:
    inset 0 0 0 10px rgba(255, 255, 255, 0.28),
    0 0 24px rgba(79, 145, 221, 0.14);
}

.raoliangyin-app[data-raoliangyin-theme="light"] .raoliangyin-disc__center {
  background: radial-gradient(circle at 35% 35%, #ffffff, #d9ecff 62%, #7ba9d1 100%);
  box-shadow:
    0 0 0 8px rgba(223, 241, 255, 0.96),
    0 0 0 12px rgba(95, 150, 214, 0.14),
    0 4px 12px rgba(74, 123, 171, 0.18);
}