@import url("https://api.fontshare.com/v2/css?f[]=general-sans@400,500,600,700&display=swap");

@font-face {
  font-family: "Clash Display";
  src: url("./fonts/clash-display-500.woff2") format("woff2"),
       url("./fonts/clash-display-500.woff") format("woff"),
       url("./fonts/clash-display-500.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Clash Display";
  src: url("./fonts/clash-display-600.woff2") format("woff2"),
       url("./fonts/clash-display-600.woff") format("woff"),
       url("./fonts/clash-display-600.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Clash Display";
  src: url("./fonts/clash-display-700.woff2") format("woff2"),
       url("./fonts/clash-display-700.woff") format("woff"),
       url("./fonts/clash-display-700.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  /* Color */
  --nitsu-bg-dark: #0A0B0B;
  --nitsu-ink: #111214;
  --nitsu-bg: #F6F6F1;
  --nitsu-border-dark: #26272A;
  --nitsu-border: #E3E3DA;
  --nitsu-surface: #FBFAF5;
  --nitsu-warning-bg: #FBF6E7;
  --nitsu-accent: #C9FF38;
  --nitsu-text-muted: #6B6E67;
  --nitsu-text-subtle: #8a8b83;
  --nitsu-text-secondary: #5c5e58;
  --nitsu-text-on-dark-muted: #93958e;
  --nitsu-negative: #C94D3F;
  --nitsu-positive: #3F7A50;
  --nitsu-positive-ink: #33502F;
  --nitsu-positive-bg: #F1F6EE;
  --nitsu-positive-border: #D9E6D4;
  --nitsu-warning: #E0A93B;
  --nitsu-warning-ink: #5A4E28;
  --nitsu-warning-border: #E9DFC0;

  /* Typography */
  --nitsu-font-display: "Onest", -apple-system, "Segoe UI", Arial, sans-serif;
  --nitsu-font-body: "Onest", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Spacing: exact values documented by the approved prototype mapping. */
  --nitsu-space-chip: 4px;
  --nitsu-space-card-sm: 12px;
  --nitsu-space-card-lg: 16px;
  --nitsu-space-stack-sm: 18px;
  --nitsu-space-stack: 20px;
  --nitsu-space-stack-lg: 22px;
  --nitsu-space-page-block: 26px;
  --nitsu-space-page-inline: 32px;

  /* Radius */
  --nitsu-radius-control-sm: 7px;
  --nitsu-radius-control: 8px;
  --nitsu-radius-panel-sm: 10px;
  --nitsu-radius-panel: 12px;
  --nitsu-radius-card: 14px;
  --nitsu-radius-pill-sm: 20px;
  --nitsu-radius-pill: 24px;
}