/* Copyright (c) 2026 Free Parameter LLC. All rights reserved.
   cadnat.com design tokens. Components use tokens only.
   Sibling of freeparameter.com (same lens, same motion), its own palette: a near-black navy field, ice type,
   ONE sky accent per view, and amber that only ever means a measurement. */

@font-face { font-family: "Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Plex Mono"; src: url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Plex Mono"; src: url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Plex Mono"; src: url("../fonts/ibm-plex-mono-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }

:root {
  color-scheme: dark;

  /* field: near-black navy, raised panels a step lighter */
  --bg-deep:  #07111f;
  --bg:       #0b1a2e;
  --bg-raise: #10233b;
  --bg-glass: color-mix(in oklab, #10233b 62%, transparent);
  --line:     rgba(138, 180, 230, 0.16);
  --line-hot: color-mix(in oklab, #5ac8fa 55%, transparent);
  --grid:     rgba(90, 200, 250, 0.05);

  /* ink: ice */
  --fg:      #e6f1ff;   /* headlines */
  --fg-soft: #b4c7de;   /* body */
  --fg-dim:  #7890ae;   /* meta, captions */

  /* the accent: sky. ONE thing per view (primary button, cursor, one headline word) */
  --accent:     #5ac8fa;
  --accent-ink: #04192b;
  /* amber: measurements only (dimension strings, numbers that are sizes) */
  --dim:        #f5a623;
  --selection:  #173452;

  /* type */
  --sans: "Plex Sans", system-ui, sans-serif;
  --mono: "Plex Mono", ui-monospace, monospace;
  --step--1: clamp(0.78rem, 0.75rem + 0.15vw, 0.86rem);
  --step-0:  clamp(0.98rem, 0.93rem + 0.25vw, 1.08rem);
  --step-1:  clamp(1.12rem, 1.02rem + 0.5vw, 1.38rem);
  --step-2:  clamp(1.4rem, 1.15rem + 1.1vw, 2.05rem);
  --step-3:  clamp(1.95rem, 1.4rem + 2.4vw, 3.6rem);
  --step-4:  clamp(2.5rem, 1.5rem + 4.4vw, 5.6rem);
  --track-tight: -0.035em;
  --track-wide: 0.16em;

  /* space + shape */
  --gutter: clamp(16px, 4vw, 56px);
  --measure: 62ch;
  --radius: 14px;
  --radius-sm: 8px;

  /* motion: a lens. Slow in, slower out. Nothing bounces. */
  --ease-lens: cubic-bezier(0.22, 0.61, 0.16, 1);
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 180ms;
  --t-ui:   500ms;
  --t-film: 1100ms;

  /* depth */
  --glow-accent: 0 0 0.7em color-mix(in oklab, #5ac8fa 45%, transparent);
  --glow-dim:    0 0 0.6em color-mix(in oklab, #f5a623 40%, transparent);
  --shadow-deep: 0 34px 90px -24px #000c, 0 12px 30px -12px #0009;
}

@property --blur { syntax: "<length>"; inherits: false; initial-value: 0px; }