/* Explain: Theme tokens defining colors, fonts, and spacing. */
:root {
    /* Signal accents */
    --primary-color: #FF3B30;
    --primary-hover: #FF6A4D;
    --primary-deep: #A81C14;
    --secondary-color: #F2EFE8;
    --accent-color: #D6FF3F;
    --accent-deep: #96BD16;

    /* Secondary palette */
    --accent-yellow: #FFC63D;
    --accent-yellow-deep: #B8860B;
    --accent-green: #34D399;
    --accent-green-deep: #0F7A55;
    --accent-purple: #A96BFF;
    --accent-purple-deep: #6B34C4;

    /* Surfaces */
    --background-color: #07070A;
    --surface-color: #101014;
    --cloud-color: #0B0B0F;
    --ink-color: #000000;
    --sand-color: #1A1A21;

    /* Text */
    --text-color: #F2EFE8;
    --text-muted: #9A9AA3;

    /* Lines */
    --border-color: #1F1F27;
    --border-strong: #34343D;

    /* Glow + gradients */
    --glow-primary: rgba(255, 59, 48, 0.42);
    --glow-accent: rgba(214, 255, 63, 0.32);
    --grad-panel: linear-gradient(155deg, rgba(255, 59, 48, 0.16), rgba(16, 16, 20, 0.97) 46%, rgba(214, 255, 63, 0.07));
    --grad-accent: linear-gradient(118deg, #FF6A4D, #E0180C);
    --grid-line: rgba(255, 255, 255, 0.035);

    /* Shadows */
    --shadow-soft: 0 34px 90px rgba(0, 0, 0, 0.72);
    --shadow-card: 0 16px 42px rgba(0, 0, 0, 0.55);

    --radius-large: 6px;
    --radius-medium: 4px;
    --radius-small: 3px;

    --font-heading: 'Saira Condensed', 'Arial Narrow', sans-serif;
    --font-body: 'Saira', 'Inter', Arial, sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, monospace;
}