/* ============================================================
   IS7 GAME — "NOVA" DESIGN TOKENS
   Liquid-glass violet & white. Light, luminous, premium.
   ============================================================ */

:root {
  /* === SURFACES === */
  --paper:        #FFFFFF;
  --paper-blush:  #F6F4FF;
  --paper-dim:    #EDE7FE;
  --ink:          #0F0B1E;
  --ink-soft:     rgba(15, 11, 30, 0.60);
  --ink-faint:    rgba(15, 11, 30, 0.32);

  /* === VIOLET SYSTEM (structural) === */
  --red:          #6D28D9;
  --red-hot:      #9333EA;
  --red-deep:     #431393;
  --rose:         #C4B5FD;
  --red-glow:     rgba(109, 40, 217, 0.28);
  --red-mist:     rgba(109, 40, 217, 0.06);

  /* === GLASS === */
  --glass-fill:   rgba(255, 255, 255, 0.55);
  --glass-tint:   rgba(246, 244, 255, 0.5);
  --glass-border: rgba(255, 255, 255, 0.75);
  --glass-line:   rgba(109, 40, 217, 0.14);

  /* === DEEP SECTION (one contrast band) === */
  --plum:         #0A0518;

  /* === ACCENT === */
  --gold:         #F0B429;

  /* === GRADIENTS === */
  --grad-cta:     linear-gradient(120deg, #9333EA 0%, #6D28D9 60%, #431393 100%);
  --grad-aurora:  radial-gradient(60% 60% at 20% 20%, #C4B5FD 0%, transparent 60%),
                  radial-gradient(50% 50% at 80% 10%, #A5F3FC 0%, transparent 55%),
                  radial-gradient(55% 55% at 70% 80%, #6D28D9 0%, transparent 60%),
                  radial-gradient(45% 45% at 15% 85%, #9333EA 0%, transparent 55%);
  --grad-glass:   linear-gradient(180deg, rgba(255,255,255,0.75), rgba(255,255,255,0.45));

  /* === TYPOGRAPHY === */
  --font-display: 'Syne', 'Clash Display', 'Manrope', sans-serif;
  --font-heading: 'Manrope', 'Inter', sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'Geist Mono', ui-monospace, monospace;

  /* === SCALE === */
  --text-xs:   0.6875rem;
  --text-sm:   0.8125rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.375rem;
  --text-2xl:  1.75rem;
  --text-3xl:  2.25rem;
  --text-4xl:  3rem;
  --text-hero: clamp(2.75rem, 7vw, 6rem);

  /* === SPACING === */
  --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; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;

  /* === SHAPE === */
  --r-sm: 10px; --r-md: 16px; --r-lg: 26px; --r-xl: 36px; --r-pill: 999px;

  /* === DEPTH === */
  --shadow-soft:  0 10px 40px rgba(67, 19, 147, 0.12);
  --shadow-glow:  0 0 48px var(--red-glow);
  --shadow-glass: 0 8px 32px rgba(15, 11, 30, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.6);

  /* === MOTION === */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-snap: cubic-bezier(0.22, 1.61, 0.36, 1);
  --dur-fast: 150ms;
  --dur-base: 280ms;
  --dur-slow: 560ms;

  /* === LAYOUT === */
  --wrap: 1240px;
  --nav-h: 72px;
}

@media (max-width: 640px) {
  :root { --nav-h: 64px; }
}