/* Perceptive Space — Design Tokens */

@font-face {
  font-family: 'Chivo';
  font-weight: 100 900;
  font-style: normal;
  src: url('fonts/Chivo-VariableFont_wght.ttf') format('truetype-variations'),
       url('fonts/Chivo-VariableFont_wght.ttf') format('truetype');
  font-display: swap;
}
@font-face {
  font-family: 'Chivo';
  font-weight: 100 900;
  font-style: italic;
  src: url('fonts/Chivo-Italic-VariableFont_wght.ttf') format('truetype-variations'),
       url('fonts/Chivo-Italic-VariableFont_wght.ttf') format('truetype');
  font-display: swap;
}

:root {
  --ps-sunburst-orange:      #EA6819;
  --ps-sunburst-orange-dark: #D45A10;
  --ps-sunburst-orange-tint: #FCE8D9;
  --ps-navy:                 #1E3A7B;
  --ps-navy-dark:            #16295A;
  --ps-navy-tint:            #E8EDF7;
  --ps-midnight:             #0A1530;
  --ps-midnight-elevated:    #111E3F;
  --ps-arc-white:            #FFFFFF;
  --ps-orbit-white:          #F5F3EE;
  --ps-orbit-white-2:        #EDEAE3;

  --ps-ink-900: #0A1530;
  --ps-ink-800: #162445;
  --ps-ink-700: #243362;
  --ps-ink-600: #3D4E80;
  --ps-ink-500: #6B7AA3;
  --ps-ink-400: #9AA5C2;
  --ps-ink-300: #C5CCDD;
  --ps-ink-200: #DFE3ED;
  --ps-ink-100: #EEF0F6;
  --ps-ink-50:  #F7F8FB;

  --ps-success:      #1F9D6B;
  --ps-success-tint: #DCF2E8;
  --ps-warning:      #EA6819;
  --ps-warning-tint: #FCE8D9;
  --ps-danger:       #C8362B;
  --ps-danger-tint:  #F8DDDA;

  /* NOAA SWPC severity scales (G/S/R share same ramp) */
  --ps-swpc-1-minor:    #92D050;
  --ps-swpc-2-moderate: #F6EB14;
  --ps-swpc-3-strong:   #FFC800;
  --ps-swpc-4-severe:   #FF0000;
  --ps-swpc-5-extreme:  #C80000;
  --ps-g1: var(--ps-swpc-1-minor);
  --ps-g2: var(--ps-swpc-2-moderate);
  --ps-g3: var(--ps-swpc-3-strong);
  --ps-g4: var(--ps-swpc-4-severe);
  --ps-g5: var(--ps-swpc-5-extreme);

  --ps-bg:          var(--ps-orbit-white);
  --ps-bg-elevated: var(--ps-arc-white);
  --ps-bg-inverse:  var(--ps-navy);
  --ps-bg-tint:     var(--ps-orbit-white-2);

  --ps-fg-1:       var(--ps-ink-900);
  --ps-fg-2:       var(--ps-ink-700);
  --ps-fg-3:       var(--ps-ink-500);
  --ps-fg-4:       var(--ps-ink-400);
  --ps-fg-accent:  var(--ps-sunburst-orange);

  --ps-fg-on-dark-1: var(--ps-arc-white);
  --ps-fg-on-dark-2: rgba(255,255,255,0.78);
  --ps-fg-on-dark-3: rgba(255,255,255,0.56);
  --ps-fg-on-dark-4: rgba(255,255,255,0.38);

  --ps-border:               rgba(10,21,48,0.12);
  --ps-border-strong:        rgba(10,21,48,0.24);
  --ps-border-on-dark:       rgba(255,255,255,0.12);
  --ps-border-on-dark-strong:rgba(255,255,255,0.24);

  --ps-font-display: 'Chivo', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ps-font-body:    'Chivo', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ps-font-mono:    'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --ps-size-xs:   12px;
  --ps-size-sm:   14px;
  --ps-size-base: 16px;
  --ps-size-md:   18px;
  --ps-size-lg:   20px;
  --ps-size-xl:   24px;
  --ps-size-2xl:  32px;
  --ps-size-3xl:  40px;
  --ps-size-4xl:  56px;
  --ps-size-5xl:  72px;
  --ps-size-6xl:  96px;

  --ps-lh-tight:   1.1;
  --ps-lh-snug:    1.25;
  --ps-lh-normal:  1.5;
  --ps-lh-relaxed: 1.65;

  --ps-tracking-tight:  -0.02em;
  --ps-tracking-normal: 0;
  --ps-tracking-wide:   0.08em;
  --ps-tracking-wider:  0.14em;

  --ps-space-1:  4px;
  --ps-space-2:  8px;
  --ps-space-3:  12px;
  --ps-space-4:  16px;
  --ps-space-5:  24px;
  --ps-space-6:  32px;
  --ps-space-7:  48px;
  --ps-space-8:  64px;
  --ps-space-9:  96px;
  --ps-space-10: 128px;

  --ps-radius-none: 0;
  --ps-radius-sm:   4px;
  --ps-radius-md:   8px;
  --ps-radius-lg:   12px;
  --ps-radius-pill: 999px;

  --ps-shadow-none:     none;
  --ps-shadow-floating: 0 4px 24px rgba(10,21,48,0.12);
  --ps-shadow-modal:    0 16px 48px rgba(10,21,48,0.24);

  --ps-ease-out:    cubic-bezier(0.2,0,0,1);
  --ps-ease-in-out: cubic-bezier(0.4,0,0.2,1);
  --ps-duration-fast: 150ms;
  --ps-duration-base: 250ms;
  --ps-duration-slow: 400ms;

  --ps-content-max: 1280px;
  --ps-gutter:      72px;
  --ps-nav-height:  56px;
}

/* Dark mode — override the light surface and text tokens.
   Dark sections (--ps-midnight) are hardcoded and don't change.
   Only the cream/white "light" surfaces flip here. */
html.dark {
  --ps-bg-inverse:    var(--ps-midnight);

  --ps-orbit-white:   #0F1B38;
  --ps-orbit-white-2: #162444;
  --ps-arc-white:     #1C2D52;

  --ps-bg:          #0F1B38;
  --ps-bg-elevated: #1C2D52;
  --ps-bg-tint:     #162444;

  --ps-fg-1:  #EEEDEA;
  --ps-fg-2:  rgba(238,237,234,0.75);
  --ps-fg-3:  rgba(238,237,234,0.50);
  --ps-fg-4:  rgba(238,237,234,0.35);

  --ps-border:        rgba(255,255,255,0.10);
  --ps-border-strong: rgba(255,255,255,0.20);

  --ps-shadow-floating: 0 4px 24px rgba(0,0,0,0.45);
  --ps-shadow-modal:    0 16px 48px rgba(0,0,0,0.65);
}

/* Theme toggle icon visibility */
html.dark      .icon-moon { display: none; }
html:not(.dark) .icon-sun  { display: none; }

/* Semantic type helpers */
.ps-eyebrow {
  font-family: var(--ps-font-mono);
  font-size: var(--ps-size-xs);
  font-weight: 500;
  letter-spacing: var(--ps-tracking-wider);
  text-transform: uppercase;
  color: var(--ps-fg-accent);
}

/* Pulsing dot animation for live status */
@keyframes ps-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--ps-sunburst-orange); }
  50%       { opacity: 0.6; box-shadow: 0 0 12px var(--ps-sunburst-orange); }
}
.ps-pulse {
  animation: ps-pulse 2s ease-in-out infinite;
}
