:root {
    --red: #b30000;
    --blue: #2f2eff;
    --purple: #4700b3;
    --green: #076600;
    --text-primary: #000;
    --text-secondary: #4f4f4f;
    --link-color: #2f2eff;
    --body-bg: #fff;
    --header-bg: #fff;
    --card-bg: #fff;
    --border-color: #e0e0e0;
    --shadow-color: rgba(0,0,0,0.08);
    --overlay-bg: rgba(0,0,0,0.4);
    --header-height: 60px;
    --accent-color: #005f61;
    --accent-color-transparent: rgba(0,95,97,0.08);
    --blue-transparent-focus: rgba(47,46,255,0.2);
    --white: #fff;
    --card-shadow: 0 2px 8px var(--shadow-color);
    --footer-bg: #f8f9fa;
    --footer-text: #4f4f4f;
    --footer-border: #e0e0e0;
    --category-badge-bg: #005f61;
    --border-radius: 10px;
    --btn: #b30000;
    --spinner-border: rgba(0,0,0,0.1);
    --primary-color: #2f2eff;
    --primary-hover-color: #0000e6;
    --danger-color: #e53935;
    --muted-text-color: #495057;
    --widget-background-color: #fff;
    --shadow: 0 2px 4px rgba(0,0,0,0.05);
    --input-bg: #f8f9fa;
    --button-hover-bg: #f1f3f5;
    --comment-body-text: #212529;
    --tbl-border: #e5e7eb;
    --tbl-head-bg: #f3f4f6;
    --tbl-hover: #f9fafb;
    --skeleton-bg: #e0e0e0;
}

html[data-theme="dark"] {
    --red: #ffd6d6;
    --blue: #9f94ff;
    --purple: #ff99db;
    --green: #116600;
    --text-primary: #fff;
    --text-secondary: #dbfff3;
    --link-color: #ffd6d6;
    --body-bg: #0e0e20;
    --header-bg: #242a57;
    --card-bg: #242a57;
    --border-color: #434b9e;
    --shadow-color: rgba(0,0,0,0.3);
    --overlay-bg: rgba(0,0,0,0.6);
    --accent-color: #e500ff;
    --accent-color-transparent: rgba(255,153,219,0.1);
    --blue-transparent-focus: rgba(159,148,255,0.25);
    --white: #ffffff;
    --card-shadow: 0 4px 12px var(--shadow-color);
    --footer-bg: #000;
    --footer-text: #dbfff3;
    --footer-border: #434b9e;
    --category-badge-bg: #000;
    --btn: #f5ffdb;
    --spinner-border: rgba(255,255,255,0.2);
    --primary-color: #9f94ff;
    --primary-hover-color: #bfb8ff;
    --danger-color: #ef9a9a;
    --muted-text-color: #ced4da;
    --widget-background-color: #242a57;
    --shadow: 0 2px 8px rgba(0,0,0,0.3);
    --input-bg: #0e0e20;
    --button-hover-bg: #434b9e;
    --comment-body-text: #e9ecef;
    --skeleton-bg: #434b9e;
}

body,.header,.menu,.search-input,.theme-switcher,.burger,.back-icon,.search-icon,.suggestions,.suggestions .result-card {
    transition: background-color 0.2s ease,color 0.2s ease,border-color 0.2s ease;
}