/* APS portal — design tokens. Brand palette is fixed: near-black, cream, copper. */
:root {
  /* colours */
  --bg:            #0C0C0D;
  --bg-2:          #121214;
  --bg-3:          #18181B;
  --surface:       rgba(252, 247, 241, 0.035);
  --surface-2:     rgba(252, 247, 241, 0.06);
  --surface-3:     rgba(252, 247, 241, 0.10);
  --border:        rgba(252, 247, 241, 0.10);
  --border-2:      rgba(252, 247, 241, 0.18);
  --border-3:      rgba(252, 247, 241, 0.30);
  --text:          #FCF7F1;
  --text-muted:    rgba(252, 247, 241, 0.58);
  --text-dim:      rgba(252, 247, 241, 0.34);
  --text-faint:    rgba(252, 247, 241, 0.18);
  --accent:        #C56A2D;
  --accent-hi:     #D97B3A;
  --accent-lo:     #9E5323;
  --accent-dim:    rgba(197, 106, 45, 0.16);
  --accent-glow:   rgba(197, 106, 45, 0.35);
  --on-accent:     #FCF7F1;
  --danger:        #E04444;
  --danger-dim:    rgba(224, 68, 68, 0.14);
  --success:       #4CAF7B;
  --success-dim:   rgba(76, 175, 123, 0.14);
  --warning:       #D4A017;
  --warning-dim:   rgba(212, 160, 23, 0.14);
  --info:          #7EB3FF;
  --info-dim:      rgba(126, 179, 255, 0.14);

  /* type */
  --font:          'Instrument Sans', 'Söhne', 'Helvetica Neue', Arial, sans-serif;
  --font-display:  'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-mono:     ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --text-xs:       11px;
  --text-sm:       13px;
  --text-base:     15px;
  --text-lg:       17px;
  --text-xl:       21px;
  --text-2xl:      28px;
  --text-3xl:      clamp(32px, 4vw, 44px);
  --text-4xl:      clamp(40px, 6vw, 64px);
  --leading:       1.5;
  --tracking-caps: 0.12em;

  /* spacing (4px grid) */
  --s-1:  4px;  --s-2:  8px;  --s-3: 12px;  --s-4: 16px;  --s-5: 20px;
  --s-6: 24px;  --s-8: 32px;  --s-10: 40px; --s-12: 48px; --s-16: 64px; --s-20: 80px;
  --page-x:        clamp(16px, 4vw, 40px);
  --content-max:   1180px;
  --narrow-max:    760px;

  /* radius / shadow */
  --r-sm: 4px; --r-md: 8px; --r-lg: 12px; --r-xl: 18px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(0,0,0,.4);
  --shadow-2: 0 8px 24px -8px rgba(0,0,0,.6);
  --shadow-3: 0 24px 60px -20px rgba(0,0,0,.75);
  --glow-accent: 0 0 0 1px var(--accent-lo), 0 8px 30px -8px var(--accent-glow);

  /* layout */
  --rail-w:        232px;
  --rail-w-min:    64px;
  --topbar-h:      60px;
  --mobile-nav-h:  62px;

  /* motion */
  --t-fast: 120ms cubic-bezier(.2,.7,.3,1);
  --t-base: 200ms cubic-bezier(.2,.7,.3,1);
  --t-slow: 360ms cubic-bezier(.2,.7,.3,1);

  /* z */
  --z-rail: 40; --z-topbar: 50; --z-drawer: 90; --z-modal: 100; --z-toast: 110;

  color-scheme: dark;
}