/* ============================================================================
 * FLAPYCOPA — Design tokens (estilo cassino premium)
 * Vidro fosco + ouro escovado + neon. Ajuste a identidade aqui.
 * ========================================================================== */
:root {
  /* Fundos profundos */
  --navy-900: #03081a;
  --navy-850: #061026;
  --navy-800: #081634;
  --navy-700: #0d2150;
  --navy-600: #133069;
  --navy-500: #1b4290;

  /* Vidro (glassmorphism) */
  --glass: rgba(13, 30, 66, .55);
  --glass-2: rgba(8, 20, 48, .72);
  --glass-hi: rgba(255, 255, 255, .14);
  --glass-border: rgba(150, 195, 255, .30);
  --glass-border-strong: rgba(180, 215, 255, .55);
  --blur: 14px;

  /* Painéis sólidos (modais) */
  --panel: linear-gradient(180deg, rgba(20,46,98,.92), rgba(9,22,52,.96));
  --panel-2: linear-gradient(180deg, rgba(15,38,84,.9), rgba(8,20,46,.95));
  --panel-border: rgba(120, 170, 255, .28);
  --panel-border-strong: rgba(150, 195, 255, .55);

  /* Azuis */
  --blue-600: #1657d6; --blue-500: #1f6fff; --blue-400: #3a8bff; --blue-300: #6db0ff;
  --cyan: #21d4fb;

  /* Ouro */
  --gold-300: #ffe9a8; --gold-400: #ffd24d; --gold-500: #ffb81c; --gold-600: #f59a12; --gold-700: #c9760a;
  --gold-grad: linear-gradient(180deg, #fff1be 0%, #ffd24d 38%, #f59a12 78%, #d97e0a 100%);
  --gold-grad-press: linear-gradient(180deg, #f1b62e, #d97e0a);
  --gold-sheen: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.55) 47%, transparent 64%);

  /* Verde */
  --green-400: #3ee06a; --green-500: #21c451; --green-600: #169a3c;
  --green-grad: linear-gradient(180deg, #58ef7e 0%, #1aa83f 100%);
  --brasil-green: #009c3b; --brasil-yellow: #ffdf00;

  /* Vermelho */
  --red-500: #ff5252; --red-600: #e02e2e;
  --red-grad: linear-gradient(180deg, #ff6a6a, #cf1f1f);

  /* Texto */
  --text: #ffffff; --text-dim: #b6c8ec; --text-mute: #7186b0;

  /* Raios */
  --r-xs: 8px; --r-sm: 12px; --r: 16px; --r-lg: 22px; --r-xl: 28px; --r-pill: 999px;

  /* Sombras / brilhos */
  --sh-panel: 0 8px 0 rgba(0,0,0,.30), 0 16px 34px rgba(0,0,0,.55);
  --sh-soft: 0 10px 26px rgba(0,0,0,.45);
  --sh-glass: 0 8px 24px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.18);
  --sh-btn-gold: 0 6px 0 #b9690a, 0 14px 26px rgba(245,158,11,.45);
  --sh-btn-gold-press: 0 2px 0 #b9690a;
  --sh-btn-green: 0 6px 0 #137a28, 0 12px 22px rgba(33,196,81,.40);
  --inset-top: inset 0 2px 0 rgba(255,255,255,.40);
  --glow-gold: 0 0 22px rgba(255,184,28,.65);
  --glow-green: 0 0 22px rgba(33,196,81,.6);
  --glow-blue: 0 0 24px rgba(31,111,255,.5);

  /* Tipografia */
  --font: 'Baloo 2', 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-num: 'Montserrat', var(--font);

  /* Layout */
  --app-max: 480px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --nav-h: 74px;
}