/*
  The 774 console's tokens, from the 774 brand kit (774/Product/Brand/Kit/774-brand.css).
  Type: Big Shoulders Display for page titles and Figtree for everything else, standing in for
  Roobert until its licensed files arrive; Geist Mono for codes. All three are under the SIL Open
  Font License 1.1 (fonts/OFL-*.txt) and are served by the console, whose security policy allows
  fonts from itself only. Brand green is for the mark and the level badge, never for a state.
*/

@font-face {
  font-family: "Figtree";
  src: url("fonts/figtree.woff2") format("woff2");
  font-weight: 300 900;
  font-display: swap;
}

@font-face {
  font-family: "Big Shoulders Display";
  src: url("fonts/big-shoulders-display.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Geist Mono";
  src: url("fonts/geist-mono.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --ink: #121212;
  --charcoal: #35363A;
  --brand-green: #00A651;
  --deep-green: #017A3D;
  --fog: #E8E8E8;
  --paper: #FFFFFF;
  --grey-700: #35363A;
  --grey-600: #5B616E;
  --grey-500: #8A8D94;
  --grey-400: #A7A7A7;
  --grey-300: #B8BAC0;
  --grey-200: #E8E8E8;
  --grey-100: #F4F4F4;
  --rule: rgb(18 18 18 / 0.3);
  --hairline: rgb(18 18 18 / 0.12);
  --hover: rgb(18 18 18 / 0.04);
  --selected: #E6F0F8;
  --staging: #8A4B12;
  --warning-bg: #FFF4D6;
  --warning-ink: #6B4A00;
  --danger: #8B1E1E;
  --focus: #0B6FB8;
  --party: #4B5563;

  --font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-body: "Figtree", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, Menlo, monospace;
  --text-body: 15px;
  --text-small: 13px;
  --text-grid: 13px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --radius: 6px;
  --nav-width: 232px;
  --panel-width: 480px;
  --row-height: 32px;
  --control-height: 30px;
}