:root {
    /* Light Theme */
    --color-bg: #1e242b;
    --color-overlay: #425f75;
    --color-glassy-overlay: rgba(255, 255, 255, 0.07);
    --color-primary: #f59e0b;
    --color-primary-hover: #d97706;
    --color-secondary: rgba(20, 20, 20, 0.6);
    --color-text: #f5f5f5;
    --color-white: #ffffff;
    --color-muted: #777777;

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 10px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6);
}


.blurry-bg {
    background: var(--color-bg);
    background-image: linear-gradient(to top, var(--color-bg) 0%, var(--color-overlay) 100%);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    box-shadow: var(--shadow-md);
}

.glassy {
    /* From https://css.glass */
    background: var(--color-glassy-overlay);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5.6px);
    -webkit-backdrop-filter: blur(5.6px);
    border: 1px solid rgba(255, 255, 255, 0.13);
}