/* ============================================================
   ORBITY 360 — Design Tokens
   ============================================================ */

:root {
  /* Colors */
  --dark-base:      #080c18;
  --dark-deep:      #050810;
  --dark-surface:   #0f1628;
  --dark-card:      #141e35;
  --dark-border:    #1e2d4a;

  --gold:           #c9a84c;
  --gold-light:     #e8c97a;
  --gold-dark:      #9e7c2f;
  --gold-glow:      rgba(201, 168, 76, 0.25);

  --white:          #f5f7ff;
  --off-white:      #dce4f0;
  --muted:          #8892a4;
  --muted-dark:     #5a6478;

  --cyan:           #00d4ff;
  --cyan-glow:      rgba(0, 212, 255, 0.15);

  --accent-blue:    #1a3a6b;
  --glass-bg:       rgba(8, 12, 24, 0.75);
  --glass-border:   rgba(201, 168, 76, 0.2);

  /* Gradients */
  --grad-gold:      linear-gradient(135deg, #c9a84c 0%, #e8c97a 50%, #c9a84c 100%);
  --grad-sidebar:   linear-gradient(180deg, #080c18 0%, #060a15 100%);
  --grad-card:      linear-gradient(135deg, #0f1628 0%, #141e35 100%);
  --grad-hero:      linear-gradient(180deg, rgba(8,12,24,0) 0%, rgba(8,12,24,0.6) 100%);

  /* Typography */
  --font-display:   'Playfair Display', Georgia, serif;
  --font-body:      'Inter', system-ui, -apple-system, sans-serif;

  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg:   1.125rem;  /* 18px */
  --text-xl:   1.25rem;   /* 20px */
  --text-2xl:  1.5rem;    /* 24px */
  --text-3xl:  1.875rem;  /* 30px */
  --text-4xl:  2.25rem;   /* 36px */
  --text-5xl:  3rem;      /* 48px */

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Layout */
  --sidebar-width: 260px;
  --sidebar-collapsed: 0px;

  /* Borders */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-xl:  20px;
  --radius-full: 9999px;

  /* Shadows */
  --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-gold: 0 0 20px rgba(201, 168, 76, 0.3);
  --shadow-cyan: 0 0 20px rgba(0, 212, 255, 0.2);

  /* Transitions */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:   cubic-bezier(0.7, 0, 0.84, 0);
  --ease-both: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:   150ms;
  --duration-base:   300ms;
  --duration-slow:   500ms;
  --duration-slower: 800ms;

  /* Z-index layers */
  --z-base:    1;
  --z-overlay: 10;
  --z-sidebar: 100;
  --z-modal:   1000;
  --z-toast:   2000;
}