/* ═══ ROSE — Refined Feminine Luxury ═══ */
:root {
  --brand-50: #1a050b; --brand-100: #2d0814; --brand-200: #4a0d20;
  --brand-300: #7a1536; --brand-400: #b31f50; --brand-500: #ec4899;
  --brand-600: #f472b6; --brand-700: #f9a8d4; --brand-800: #fce7f3; --brand-900: #fdf2f8;
  --accent-50: #1a0510; --accent-100: #2d0820; --accent-200: #4a0d35;
  --accent-300: #721550; --accent-400: #a02070; --accent-500: #c026d3;
  --accent-600: #d946ef; --accent-700: #e879f9; --accent-800: #f0abfc; --accent-900: #fae8ff;
  --surface: #09090b; --surface-alt: #121214;
  --ink: #fafafa; --ink-muted: #a1a1aa; --ink-dim: #71717a;
  --header-bg: rgba(12, 10, 12, 0.82);
  --glass-bg: rgba(18, 14, 18, 0.52);
  --glass-border: rgba(236, 72, 153, 0.12);
  --glass-shadow: 0 4px 32px rgba(0,0,0,0.45), 0 1px 2px rgba(255,255,255,0.04) inset;
  --neon-glow: 0 0 18px rgba(236,72,153,0.35);
  --neon-glow-strong: 0 0 36px rgba(236,72,153,0.5);
  --neon-text-shadow: 0 0 12px rgba(236,72,153,0.3);
  --accent-glow: 0 0 16px rgba(192,38,211,0.3);
  --accent-glow-strong: 0 0 32px rgba(192,38,211,0.45);
  --gradient-primary: linear-gradient(135deg, #ec4899, #c026d3);
  --gradient-hero: linear-gradient(135deg, #ec4899 0%, #c026d3 50%, #f472b6 100%);
  --card-radius: 1.25rem;
  --card-border: 1px solid var(--glass-border);
  --bg-pattern: radial-gradient(circle at 30% 20%, rgba(236,72,153,0.025) 0px, transparent 40px);
  --glass-blur: blur(18px);
  --glass-opacity: 0.52;
  --animation-accent: floatSlow;
  --hero-overlay: radial-gradient(ellipse at 30% 0%, rgba(236,72,153,0.06), transparent 65%);
  --btn-radius: 0.75rem;
  --input-radius: 0.75rem;
  --transition-fast: 150ms ease;
  --transition-smooth: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

body {
  background-color: var(--surface) !important;
  background-image: var(--bg-pattern), radial-gradient(ellipse at 30% 20%, rgba(236,72,153,0.03) 0%, transparent 55%), radial-gradient(ellipse at 70% 80%, rgba(192,38,211,0.02) 0%, transparent 55%);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color var(--transition-smooth), color var(--transition-smooth);
}

::selection { background: var(--brand-500); color: #fff; }
::-moz-selection { background: var(--brand-500); color: #fff; }
:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--surface-alt); }
::-webkit-scrollbar-thumb { background: var(--ink-dim); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--ink-muted); }

.glass-panel {
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: var(--card-border);
  border-radius: var(--card-radius);
  box-shadow: var(--glass-shadow);
  transition: background var(--transition-smooth), border-color var(--transition-fast), box-shadow var(--transition-smooth);
}
.glass-panel:hover { border-color: rgba(236,72,153,0.2); }

a { color: var(--brand-500); transition: color var(--transition-fast); text-decoration: none; }
a:hover { color: var(--brand-400); }

input, select, textarea {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--input-radius);
  color: var(--ink);
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  transition: all var(--transition-fast);
}
input:focus, select:focus, textarea:focus {
  border-color: var(--brand-500);
  box-shadow: 0 0 0 3px rgba(236,72,153,0.15);
  outline: none;
}
input::placeholder { color: var(--ink-dim); }

.gradient-text {
  background: var(--gradient-primary);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.shadow-neon { box-shadow: var(--neon-glow); }
.shadow-neon-strong { box-shadow: var(--neon-glow-strong); }
