/* ============================================================
   GLOBAL — Design System Tokens & Base Reset
   Light Mode — from docs/design_scheme.md v1.0
   Loaded on every page.
   ============================================================ */

/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@600;800&display=swap');

/* ── Design Tokens ── */
:root {
    /* Primary Brand */
    --color-primary: #7B00D4;
    --color-primary-hover: #6200A8;
    --color-primary-light: #F8F0FF;
    --color-primary-glow: rgba(123, 0, 212, 0.2);
    --color-gradient-accent: linear-gradient(135deg, #7B00D4 0%, #B44DFF 100%);

    /* Surfaces — Light Mode */
    --color-surface-base: #FFFFFF;
    --color-surface-section: #FAFAFA;
    --color-surface-input: #F3F3F5;
    --color-border: #E5E5EA;
    --color-border-subtle: #F3F3F5;

    /* Text — Light Mode */
    --color-text-primary: #1A1622;
    --color-text-secondary: #555555;
    --color-text-tertiary: #8E8E93;

    /* Semantic */
    --color-success: #00C853;
    --color-warning: #FF9500;
    --color-error: #FF3B30;
    --color-info: #007AFF;

    /* Radii */
    --radius-button: 12px;
    --radius-card: 16px;
    --radius-input: 10px;

    /* Typography */
    --font-ui: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-display: 'Plus Jakarta Sans', 'DM Sans', sans-serif;

    /* Shadows — Light Mode */
    --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.06);
    --shadow-card-hover: 0 8px 24px rgba(0, 0, 0, 0.10);
    --shadow-button: 0 2px 8px rgba(123, 0, 212, 0.18);
    --shadow-button-hover: 0 6px 20px rgba(123, 0, 212, 0.25);
    --shadow-float: 0 12px 32px rgba(123, 0, 212, 0.12);
}

/* ── Reset ── */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ── Base ── */
body {
    font-family: var(--font-ui);
    background: var(--color-surface-section);
    color: var(--color-text-primary);
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}