/**
 * DNA VISUAL "O COPY" v13 — DESIGN TOKENS
 * Projeto: Mumu Store
 */

:root {
  /* Paleta Base Dark Imersiva */
  --bg-deep: #060609;
  --bg-surface: #0A0A0F;
  --bg-card: rgba(14, 14, 20, 0.82);
  --bg-card-hover: rgba(20, 20, 28, 0.90);
  --bg-glass: rgba(16, 16, 24, 0.65);

  /* Cores de Acento Dourado (Extraídas da Coroa MM Oficial) */
  --accent-gold-light: #F8E298;
  --accent-gold: #E0B345;
  --accent-gold-dark: #9E781B;
  --accent-gradient: linear-gradient(135deg, #F8E298 0%, #E0B345 50%, #9E781B 100%);
  --accent-glow: rgba(224, 179, 69, 0.35);
  --accent-glow-subtle: rgba(224, 179, 69, 0.12);

  /* Hierarquia Tipográfica de Cores */
  --text-primary: #FFFFFF;
  --text-secondary: #D4D4D8;
  --text-muted: #8E8E98;
  --text-accent: #E0B345;

  /* Bordas e Delimitadores */
  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-card: rgba(255, 255, 255, 0.10);
  --border-gold-subtle: rgba(224, 179, 69, 0.22);
  --border-gold-hover: rgba(224, 179, 69, 0.65);

  /* Sombras e Iluminação */
  --shadow-elevation: 0 12px 32px -4px rgba(0, 0, 0, 0.65), 0 4px 12px -2px rgba(0, 0, 0, 0.45);
  --shadow-floating: 0 24px 64px -12px rgba(0, 0, 0, 0.85), 0 0 48px -8px rgba(224, 179, 69, 0.12);
  --shadow-card-hover: 0 16px 40px -8px rgba(0, 0, 0, 0.75), 0 0 24px -4px rgba(224, 179, 69, 0.25);

  /* Geometria e Raios */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 9999px;

  /* Animações e Transições Físicas */
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 0.18s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.28s cubic-bezier(0.16, 1, 0.3, 1);

  /* Largura Máxima do Canvas */
  --canvas-max-width: 440px;
}