:root {
  --brand-primary: #ff3c00;
  --brand-primary-rgb: 255, 60, 0;
  --brand-hover: #E64A19;
  --brand-hover-rgb: 230, 74, 25;
  --brand-text: #FFFFFF;
  --brand-on-primary-neon: #ffffff;
  --surface-body: #06101f;
  --player-navy-start: #081e37;
  --player-navy-end: #0f3157;
  --player-navy-bottom-end: #113863;
  --player-navy-muted-end: #0c2847;
  --player-navy-soft-start: #07182e;
  --player-navy-soft-end: #0b294a;
  --player-navy-info-end: #0f3761;
  --surface-header-start: var(--player-navy-start);
  --surface-header-end: var(--player-navy-end);
  --surface-panel: #1a1a1a;
  --surface-panel-2: #20262d;
  --border-subtle: rgba(255, 255, 255, 0.10);
  --player-surface-header-bg:
    radial-gradient(900px 360px at -10% 0%, rgba(var(--brand-primary-rgb), 0.05), transparent 58%),
    linear-gradient(180deg, var(--surface-header-start) 0%, var(--surface-header-end) 100%);
  --player-surface-header-border: 1px solid rgba(var(--brand-primary-rgb), 0.18);
  --player-shadow-header: 0 4px 12px rgba(0, 0, 0, 0.55);
  --player-surface-bottom-bg:
    radial-gradient(900px 420px at 12% 140%, rgba(var(--brand-primary-rgb), 0.06), transparent 62%),
    linear-gradient(180deg, var(--player-navy-start) 0%, var(--player-navy-bottom-end) 100%);
  --player-surface-bottom-border: 1px solid rgba(var(--brand-primary-rgb), 0.20);
  --player-shadow-bottom: 0 -6px 18px rgba(0, 0, 0, 0.6);
  --player-shadow-bottom-strong: 0 -4px 20px rgba(0, 0, 0, 0.8);
  --player-surface-card-linear-bg: linear-gradient(180deg, var(--player-navy-start) 0%, var(--player-navy-end) 100%);
  --player-surface-card-bg:
    radial-gradient(900px 360px at -10% 0%, rgba(var(--brand-primary-rgb), 0.05), transparent 58%),
    var(--player-surface-card-linear-bg);
  --player-surface-compact-bg: var(--player-surface-bottom-bg);
  --player-sidebar-bg:
    radial-gradient(700px 320px at 0% 0%, rgba(var(--brand-primary-rgb), 0.06), transparent 62%),
    linear-gradient(180deg, #071a31 0%, #0a2440 100%);
  --player-sidebar-border: 1px solid rgba(var(--brand-primary-rgb), 0.18);
  --player-sidebar-shadow: 12px 0 32px rgba(0, 0, 0, 0.45);
  --player-scrollbar-track: rgba(2, 10, 24, 0.86);
  --player-scrollbar-thumb: rgba(var(--brand-primary-rgb), 0.40);
  --player-field-bg: rgba(2, 10, 24, 0.74);
  --player-field-hover-bg: rgba(8, 30, 55, 0.86);
  --player-field-border: 1px solid rgba(var(--brand-primary-rgb), 0.18);
  --player-control-bg: rgba(8, 30, 55, 0.76);
  --player-control-border: 1px solid rgba(var(--brand-primary-rgb), 0.18);
  --player-scratch-cover-bg: #071a31;
  --player-scratch-line-color: rgba(255, 60, 0, 0.18);
  --player-scratch-line-muted: rgba(226, 232, 255, 0.08);
  --player-empty-bg:
    radial-gradient(360px 180px at 50% 0%, rgba(var(--brand-primary-rgb), 0.08), transparent 64%),
    linear-gradient(180deg, rgba(8, 30, 55, 0.68), rgba(4, 14, 30, 0.86));
  --player-empty-border: 1px solid rgba(var(--brand-primary-rgb), 0.20);
  --player-empty-icon-color: var(--brand-primary);
  --player-empty-title: rgba(255, 255, 255, 0.94);
  --player-empty-text: rgba(226, 232, 255, 0.72);
  --player-list-card-bg:
    radial-gradient(260px 120px at 0% 0%, rgba(var(--brand-primary-rgb), 0.07), transparent 62%),
    linear-gradient(180deg, rgba(8, 30, 55, 0.82), rgba(4, 14, 30, 0.92));
  --player-list-card-border: 1px solid rgba(var(--brand-primary-rgb), 0.18);
  --player-list-card-shadow: 0 8px 22px rgba(0, 0, 0, 0.34);
  --player-list-media-bg:
    radial-gradient(circle at 50% 35%, rgba(var(--brand-primary-rgb), 0.12), transparent 62%),
    rgba(2, 10, 24, 0.64);
  --player-list-title: rgba(255, 255, 255, 0.94);
  --player-list-text: rgba(226, 232, 255, 0.76);
  --player-list-muted: rgba(226, 232, 255, 0.58);
  --player-list-value: var(--brand-primary);
  --player-live-strip-bg:
    radial-gradient(560px 160px at 0% 50%, rgba(var(--brand-primary-rgb), 0.07), transparent 64%),
    linear-gradient(90deg, rgba(4, 14, 30, 0.74), rgba(8, 30, 55, 0.52));
  --player-live-label-bg:
    radial-gradient(220px 120px at 0% 50%, rgba(var(--brand-primary-rgb), 0.10), transparent 70%),
    linear-gradient(180deg, rgba(8, 30, 55, 0.86), rgba(4, 14, 30, 0.94));
  --player-live-label-border: 1px solid rgba(var(--brand-primary-rgb), 0.16);
  --player-back-button-bg:
    radial-gradient(140px 70px at 12% 50%, rgba(var(--brand-primary-rgb), 0.12), transparent 68%),
    linear-gradient(180deg, rgba(8, 30, 55, 0.92), rgba(4, 14, 30, 0.96));
  --player-back-button-border: 1px solid rgba(var(--brand-primary-rgb), 0.46);
  --player-back-button-text: var(--brand-primary);
  --player-back-button-hover-bg: rgba(var(--brand-primary-rgb), 0.10);
  --player-back-button-hover-border: 1px solid rgba(var(--brand-primary-rgb), 0.62);
  --player-back-button-hover-text: var(--brand-hover);
  --player-button-primary-bg: linear-gradient(135deg, var(--brand-primary), var(--brand-hover));
  --player-button-primary-text: var(--brand-on-primary-neon, var(--brand-text));
}