:root {
    --color-primary: #ae1c28;
    --color-primary-rgb: 174, 28, 40;
    --color-secondary: #21468b;
    --color-secondary-rgb: 33, 70, 139;
    --color-dark: #0b162d;
    --color-text: #f3f6fb;
    --color-muted: #b7c4d9;
    --color-bg: #07101f;
    --color-card: #0f1f38;
    --color-border: rgba(255, 255, 255, 0.12);
    --color-primary-contrast: #f8fbff;
    --color-header-bg: rgba(6, 18, 36, 0.92);
    --color-hero-start: rgba(174, 28, 40, 0.42);
    --color-hero-end: rgba(33, 70, 139, 0.24);
    --color-hero-wave-1: rgba(255, 255, 255, 0.18);
    --color-hero-wave-2: rgba(33, 70, 139, 0.22);
    --color-hero-heading: #f8fbff;
    --color-text-soft: rgba(243, 246, 251, 0.66);
    --color-surface-soft: rgba(15, 29, 54, 0.65);
    --color-overlay: rgba(255, 255, 255, 0.08);
    --color-overlay-strong: rgba(255, 255, 255, 0.18);
    --color-panel-gradient-start: rgba(9, 21, 43, 0.94);
    --color-panel-gradient-end: rgba(6, 16, 34, 0.97);
    --color-feature-gradient-end: rgb(16, 44, 92);
    --hero-mic-flag-top: #ae1c28;
    --hero-mic-flag-middle: #ffffff;
    --hero-mic-flag-bottom: #21468b;
    --hero-mic-wave: rgba(174, 28, 40, 0.45);
    --hero-blob-color-1: rgba(174, 28, 40, 0.55);
    --hero-blob-color-2: rgba(33, 70, 139, 0.5);
    --hero-disc-glow: rgba(174, 28, 40, 0.45);
    --hero-disc-highlight: rgba(255, 245, 245, 0.95);
    --hero-orbit-color: rgba(229, 234, 255, 0.28);
    --chip-bg: rgba(174, 28, 40, 0.24);
    --chip-border: rgba(174, 28, 40, 0.34);
    --chip-bg-hover: rgba(174, 28, 40, 0.34);
    --chip-border-hover: rgba(174, 28, 40, 0.5);
    --chip-text: #ffe4e7;
    --chip-text-hover: #0b162d;
    --chip-shadow: 0 14px 30px rgba(174, 28, 40, 0.24);
    --chip-shadow-hover: 0 18px 36px rgba(174, 28, 40, 0.34);
    --badge-bg: rgba(33, 70, 139, 0.24);
    --badge-text: #e0ecff;
    --icon-bg: rgba(33, 70, 139, 0.22);
    --icon-color: #e0ecff;
    --player-button-bg: linear-gradient(135deg, #ae1c28, #f05a66);
    --player-button-color: #ffffff;
    --player-button-shadow: 0 12px 20px rgba(174, 28, 40, 0.35);
    --player-button-shadow-hover: 0 18px 28px rgba(174, 28, 40, 0.45);
    --comment-section-bg: linear-gradient(135deg, rgba(20, 34, 66, 0.92), rgba(8, 17, 34, 0.98));
    --comment-section-shadow: 0 30px 60px rgba(5, 9, 18, 0.45);
    --comment-form-bg: rgba(7, 16, 31, 0.65);
    --comment-form-border: rgba(255, 255, 255, 0.08);
    --radius-lg: 24px;
    --radius-md: 16px;
    --radius-sm: 10px;
    --shadow-sm: 0 10px 30px rgba(0, 0, 0, 0.35);
    --transition: all 0.25s ease;
}
