/* =============================================
   喵彩 — 設計 Token
   ============================================= */

:root {
  /* ── 背景層次 ── */
  --bg-base:    #070B17;
  --bg-surface: #0D1526;
  --bg-raised:  #152038;
  --bg-overlay: #1B2A4A;
  --bg-input:   #0F1B32;

  /* ── 文字 ── */
  --text-primary:   #EDF1FF;
  --text-secondary: #8FA3CC;
  --text-muted:     #7A95C0;
  --text-inverse:   #0D1526;

  /* ── 大樂透（金） ── */
  --lotto-gold:       #FFD700;
  --lotto-gold-dim:   rgba(255, 215, 0, 0.12);
  --lotto-gold-glow:  0 0 18px rgba(255, 215, 0, 0.35);
  --lotto-gold-border:rgba(255, 215, 0, 0.3);

  /* ── 威力彩（紅） ── */
  --power-red:       #FF4D6D;
  --power-red-dim:   rgba(255, 77, 109, 0.12);
  --power-red-glow:  0 0 18px rgba(255, 77, 109, 0.35);
  --power-red-border:rgba(255, 77, 109, 0.3);

  /* ── 強力彩球（橘） ── */
  --power-ball:     #FF8C00;
  --power-ball-dim: rgba(255, 140, 0, 0.15);

  /* ── 熱度色階（0=極冷/少 → 5=極熱/多，藍→紅漸層） ── */
  --heat-0: #0E1E38;
  --heat-1: #122A4E;
  --heat-2: #1A3860;
  --heat-3: #5A1A1A;
  --heat-4: #922222;
  --heat-5: #C82020;

  --heat-0-text: #3A6090;
  --heat-1-text: #5A88C0;
  --heat-2-text: #7AAAD0;
  --heat-3-text: #E08888;
  --heat-4-text: #FFB0B0;
  --heat-5-text: #FFE0E0;

  /* ── 功能色 ── */
  --color-success: #2ECC71;
  --color-warning: #F39C12;
  --color-danger:  #E74C3C;
  --color-info:    #3498DB;
  --color-neutral: #95A5A6;

  /* ── 字型 ── */
  --font-base: 'Nunito', 'Noto Sans TC', sans-serif;
  --font-num:  'Nunito', 'Noto Sans TC', sans-serif;

  --text-xs:   14px;
  --text-sm:   16px;
  --text-base: 18px;
  --text-lg:   21px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-hero: 38px;

  --weight-normal: 400;
  --weight-medium: 500;
  --weight-bold:   700;
  --weight-black:  900;

  /* ── 間距 ── */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-8:  32px;
  --sp-10: 40px;
  --sp-12: 48px;

  /* ── 圓角 ── */
  --r-sm:   6px;
  --r-md:   12px;
  --r-lg:   18px;
  --r-xl:   24px;
  --r-full: 9999px;

  /* ── 陰影 ── */
  --shadow-sm:   0 2px 8px rgba(0,0,0,0.4);
  --shadow-md:   0 4px 20px rgba(0,0,0,0.5);
  --shadow-lg:   0 8px 40px rgba(0,0,0,0.6);
  --shadow-card: 0 1px 0 rgba(255,255,255,0.04) inset,
                 0 4px 20px rgba(0,0,0,0.45);

  /* ── 動畫 ── */
  --dur-fast:   100ms;
  --dur-normal: 220ms;
  --dur-slow:   400ms;
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:    cubic-bezier(0.4, 0, 1, 1);

  /* ── 版面 ── */
  --nav-height:     56px;
  --footer-height:  48px;
  --content-max:    960px;
  --content-pad:    var(--sp-4);
}
