:root {
    /* Brand */
    --color-dark: #171923;
    --color-text: #1f2230;
    --color-muted: #6b7280;
    --color-muted-light: #9ca3af;

    /* Accent gradient (coral -> orange) */
    --accent-start: #ff5f7e;
    --accent-end: #ff8a5b;
    --accent-gradient: linear-gradient(135deg, var(--accent-start) 0%, var(--accent-end) 100%);
    --accent-solid: #ef4a6d;

    /* Success / status */
    --color-success: #16a34a;

    /* Surfaces */
    --color-white: #ffffff;
    --color-border: #e7e8ee;
    --color-input-bg: #f6f7fb;

    /* Fallback color while the backdrop image loads */
    --backdrop-fallback: #eef1f7;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(17, 17, 17, 0.06);
    --shadow-md: 0 8px 20px rgba(17, 17, 17, 0.08);
    --shadow-lg: 0 20px 45px rgba(17, 17, 17, 0.12);
    --shadow-accent: 0 12px 24px rgba(239, 74, 109, 0.35);

    /* Radii */
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 22px;
    --radius-pill: 999px;

    /* Font */
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;

    /* Layout */
    --max-width: 1180px;
}