:root {
    --bg-1: #ffffff;
    --bg-2: #f7f7f7;
    --bg-3: #e0e0e0;
    --text-1: #333333;
    --text-2: #666666;
    --border-1: #cccccc;
    --fg-red: #ff126d;
    --bg-red: #ffebf1;
    --fg-green: #2ecc71;
    --bg-green: #e8f8f1;
    --fg-blue: #487cff;
    --bg-blue: #ebf1ff;
    --fg-yellow: #f1c40f;
    --bg-yellow: #fef9e7;
    --fg-purple: #9b59b6;
    --bg-purple: #f5eef8;
    --fg-cyan: #00bcd4;
    --bg-cyan: #e0f7fa;
    --fg-orange: #e67e22;
    --bg-orange: #fdf2e9;
    --fg-white: #ffffff;
    --bg-white: #ffffff;
    --fg-black: #000000;
    --bg-black: #000000;
    --font-sans: 'IBM Plex Sans', 'Helvetica Neue', sans-serif;
    --font-mono: 'IBM Plex Mono', 'Courier New', monospace;
    --font-serif: 'IBM Plex Serif', 'Georgia', serif;
    --font-condensed: 'IBM Plex Condensed', 'Arial Narrow', sans-serif;
    --radius: 4px;
    --radius-large: 12px;
    --padding-1: 2px;
    --padding-2: 4px;
    --padding-3: 8px;
    --padding-4: 16px;
    --padding-w1: 4px 8px;
    --padding-w2: 8px 16px;
    --padding-w3: 10px 20px;
    --gap-1: 5px;
    --gap-2: 10px;
    --gap-3: 20px;
    --drop-shadow: drop-shadow(0 0 20px rgba(0, 0, 0, 0.1));
    --accent-svg: brightness(0) saturate(100%) invert(27%) sepia(51%) saturate(4354%) hue-rotate(242deg) brightness(92%) contrast(93%);
    --accent-text: #5c35d9;
    --accent-bg: #f2eeff;
    --themed-svg: none;
}