/* ── Design tokens (visual-brief.md) ─────────────────── */
:root {
    /* ── Palette ─────────────────────────────────────── */
    --love-rose:        #D85C78;
    --love-rose-dark:   #B84A62;
    --warm-coral:       #F28B7C;
    --soft-cream:       #FFF7F1;
    --deep-plum:        #321F2C;
    --quiet-mauve:      #8B6B7D;
    --safe-sage:        #4F7564;

    /* ── Component design tokens ─────────────────────── */
    --color-accent:          var(--love-rose);
    --color-accent-strong:   var(--love-rose-dark);
    --color-accent-soft:     rgba(216, 92, 120, 0.12);
    --color-danger:          #b63122;
    --color-danger-strong:   #8f2318;
    --color-text:            var(--deep-plum);
    --color-text-subtle:     var(--quiet-mauve);
    --color-border:          rgba(139, 107, 125, 0.20);
    --color-surface:         #ffffff;
    --color-surface-strong:  rgba(139, 107, 125, 0.08);
    --color-bg-muted:        rgba(139, 107, 125, 0.06);
    --color-bg-subtle:       var(--soft-cream);
    --color-hover:           rgba(216, 92, 120, 0.08);

    /* ── Spacing ─────────────────────────────────────── */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;

    /* ── Border radius ───────────────────────────────── */
    --radius-sm: 6px;
    --radius-md: 10px;

    /* ── Shadows ─────────────────────────────────────── */
    --shadow-soft: 0 8px 32px rgba(50, 31, 44, 0.10);

    /* ── Typography ──────────────────────────────────── */
    --font-body:    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-display: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    /* ── Z-index ─────────────────────────────────────── */
    --z-modal: 100;
}