/* Variables CSS — Paleta Tea Party Pastel / Maid Cafe / Kawaii */
:root {
    /* Rosas suaves — Amy Rose */
    --pink-100: #fff0f5;
    --pink-200: #fde0ec;
    --pink-300: #f2a8c4;
    --pink-400: #e0789a;
    --pink-500: #c75580;
    /* Lavanda suave — Vanilla the Rabbit */
    --purple-300: #c8b0e8;
    --purple-400: #9068c0;
    --purple-500: #6e4a9e;
    --lavender: #ede0f7;
    /* Fondos */
    --cream: #fef9f3;
    --cream-warm: #fdf5e4;
    /* Celeste — Cream the Rabbit */
    --sky-100: #e8f4fd;
    --sky-200: #c5dff5;
    /* Dorado — detalles elegantes */
    --gold: #c9a227;
    --gold-soft: rgba(201, 162, 39, 0.2);
    /* Textos */
    --text-dark: #3d2c4e;
    --text-medium: #6b5b7b;
    --text-light: #9a8aab;
    /* Estado */
    --success: #4caf50;
    --warning: #f09800;
    --danger: #e53935;
    --info: #1e88e5;
    /* Aliases semánticos */
    --color-primary: var(--pink-400);
    --color-primary-soft: var(--pink-200);
    --color-accent: var(--purple-400);
    --color-accent-soft: var(--lavender);
    --color-surface: #ffffff;
    --color-surface-soft: var(--cream);
    --border-soft: rgba(144, 104, 192, 0.12);
    --border-strong: rgba(144, 104, 192, 0.35);
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(144, 104, 192, 0.1);
    --shadow-md: 0 4px 20px rgba(144, 104, 192, 0.16);
    --shadow-lg: 0 8px 40px rgba(144, 104, 192, 0.22);
    /* Radios y transición */
    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* Breakpoints (para media queries con min-width) */
    --bp-sm: 480px;
    --bp-md: 768px;
    --bp-lg: 1000px;
}