/* 404HZ — tokens.css
   Canonical GRAY colourway: one field (#bdbdc3), one ink (#2921cc).
   Authority = the current effective styles in app/app.css (GRAY, product-finish
   overrides). Single colourway: no blue / hermes / orange variants exist here.
   Import from a sibling folder:  @import url("../design-system/tokens.css");
   Paths below are relative to this file (design-system/). */

/* ---- Origin, the brand face, 7 local weights ---- */
@font-face{font-family:"Origin Display";src:url("../site/fonts/Origin-BlackDisplay.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:"Origin Display";src:url("../site/fonts/Origin-ExtraBoldDisplay.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"Origin Display";src:url("../site/fonts/Origin-BoldDisplay.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Origin Text";src:url("../site/fonts/Origin-RegularText.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Origin Text";src:url("../site/fonts/Origin-MediumText.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Origin Text";src:url("../site/fonts/Origin-SemiBoldText.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Origin Text";src:url("../site/fonts/Origin-BoldText.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  /* field + ink — the only colours */
  --field:#bdbdc3;                      /* warm gray — the one field */
  --ink:#2921cc;                        /* the blue — every mark, line, accent */

  /* ink-alpha ramp (text) — measured on --field with a --row-sel tint under it */
  --i1:#2921cc;                         /* primary text (5.14:1) */
  --i2:rgba(41,33,204,.96);             /* secondary text, labels, stamps (4.92:1) */
  --i3:rgba(41,33,204,.95);             /* quiet mono labels (4.86:1) */

  /* hairlines + interaction paints (all ink-alpha) */
  --line:rgba(41,33,204,.5);            /* control outlines, primary dividers */
  --line2:rgba(41,33,204,.34);          /* row dividers, quiet separators */
  --edge:rgba(41,33,204,.26);           /* plate cut line */
  --sel-bg:var(--ink);                   /* text selection ground (5.14:1 with --sel-fg) */
  --sel-fg:var(--field);
  --focus:#2921cc;                      /* focus-visible outline: 2px, offset 2px */
  --hot:rgba(41,33,204,.14);            /* icon-button/row ground only — small text on it fails (ink 4.13:1); text hover uses --soft or ink inversion */
  --hot-strong:rgba(41,33,204,.6);      /* strong hover marks (2.78:1 — never a control boundary; use --ink where a boundary must read) */
  --fill:rgba(41,33,204,.04);           /* quiet tint fills, sleeve grounds */
  --track:rgba(41,33,204,.2);           /* rail background */
  --tick:rgba(41,33,204,.9);            /* rail fill, waveform played bars */
  --row-sel:rgba(41,33,204,.03);        /* selected-row tint */
  --soft:rgba(41,33,204,.06);           /* misc soft tint */
  color-scheme:light;

  /* type */
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;      /* data, labels, controls */
  --display:"Origin Display",Arial Black,system-ui,sans-serif;
  --text:"Origin Text",ui-sans-serif,system-ui,sans-serif;

  /* metrics */
  --pad:clamp(16px,3.6vw,54px);         /* page gutter */
  --max:920px;                          /* content measure */
  --slv:54px;                           /* sleeve square */
  --player-h:88px;                      /* fixed bottom player band */
  --r-flat:0;                           /* everything except chips */
  --r-pill:999px;                       /* chips/tags only; discs exempt (see DESIGN.md) */

  --ease:cubic-bezier(.16,1,.3,1);
}