/* Chipkin design tokens — vendored subset
 * ---------------------------------------
 * Source of truth: chipkin-design-guides/standards/visual/tokens/*.css
 *   (colors.css, typography.css, spacing.css, shadows.css, fonts.css)
 *
 * Vendored rather than linked because this tool ships as static files with
 * no build step and no runtime CDN, and the design-guides repo is not a
 * submodule of docs.chipkin.com. Only the tokens this tool actually uses are
 * copied. Do not edit values here -- change them upstream and re-copy.
 *
 * When a second tool under /tools/ adopts these tokens, move this file (and
 * assets/) to a shared /tools/_shared/ directory rather than duplicating it.
 *
 * Copied 2026-08-12 against design-guides tokens dated 2026-07-20.
 */

/* ── Brand web fonts ──────────────────────────────────────────
 * Lato for text, DroidSansMono for identifiers (visual-language ->
 * Typography). Only the two Lato weights this tool uses are shipped;
 * font-display:swap keeps first paint unblocked on the ~1.4 MB of TTF. */

@font-face {
  font-family: 'Lato';
  src: url('assets/fonts/Lato-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lato';
  src: url('assets/fonts/Lato-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'DroidSansMono';
  src: url('assets/fonts/DroidSansMono.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Brand blue ramp ──────────────────────────────────────── */
  --ck-blue-900: #0A2540;
  --ck-blue-700: #0B5CAB;
  --ck-blue-500: #1E81CE;
  --ck-focus:    var(--ck-blue-500);
  --ck-blue-300: #AACADC;
  --ck-blue-200: #D5E5EE;
  --ck-blue-100: #E7F0F6;
  --ck-blue-50:  #F5F8FB;

  /* ── Accent / conversion CTA — one per screen, never navigation ── */
  --ck-accent:       #FF5E06;
  --ck-accent-700:   #D94D00;
  --ck-accent-light: rgba(255, 94, 6, .12);

  /* ── Neutrals ─────────────────────────────────────────────── */
  --ck-ink:   #1B2430;
  --ck-muted: #637688;
  --ck-grey:  #828384;
  --ck-line:  #DDE3EA;
  --ck-black: #020203;

  /* ── Surfaces ─────────────────────────────────────────────── */
  --ck-bg:      #FFFFFF;
  --ck-bg-alt:  #F5F8FB;
  --ck-bg-dark: #0A2540;
  --ck-on-dark: #E8EEF5;

  /* ── Semantic ─────────────────────────────────────────────── */
  --ck-success: #1F9D5B;
  --ck-warning: #E0A800;
  --ck-error:   #D93025;

  /* ── Type ─────────────────────────────────────────────────── */
  --ck-font-sans: 'Lato', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --ck-font-head: var(--ck-font-sans);
  --ck-font-mono: 'DroidSansMono', 'Courier New', Courier, monospace;

  --ck-fs-xs:   0.8125rem;
  --ck-fs-sm:   0.9375rem;
  --ck-fs-base: 1.0625rem;
  --ck-fs-lg:   1.25rem;
  --ck-fs-h3:   1.5rem;
  --ck-fs-h2:   2rem;
  --ck-fs-h1:   2.75rem;

  --ck-lh-tight: 1.15;
  --ck-lh-snug:  1.35;
  --ck-lh-body:  1.65;

  --ck-fw-normal: 400;
  --ck-fw-bold:   700;

  --ck-ls-kicker: 0.08em;
  --ck-ls-tight:  -0.01em;

  /* ── 8px spacing grid ─────────────────────────────────────── */
  --ck-space-1:  0.25rem;
  --ck-space-2:  0.5rem;
  --ck-space-3:  0.75rem;
  --ck-space-4:  1rem;
  --ck-space-6:  1.5rem;
  --ck-space-8:  2rem;
  --ck-space-12: 3rem;
  --ck-space-16: 4rem;

  /* ── Layout ───────────────────────────────────────────────── */
  --ck-container:        1200px;
  --ck-container-narrow: 720px;
  --ck-gutter:           1.25rem;
  --ck-gutter-lg:        2rem;

  /* ── Shadow / radius / border ─────────────────────────────── */
  --ck-shadow-sm: 0 1px 2px rgba(10,37,64,.06), 0 1px 1px rgba(10,37,64,.04);
  --ck-shadow:    0 4px 16px rgba(10,37,64,.08);
  --ck-shadow-lg: 0 12px 32px rgba(10,37,64,.12);

  --ck-radius-sm:   6px;
  --ck-radius:      10px;
  --ck-radius-lg:   16px;
  --ck-radius-full: 9999px;

  --ck-border:       1px solid var(--ck-line);
  --ck-border-thick: 2px solid var(--ck-line);

  --ck-transition:        0.15s ease;
  --ck-transition-medium: 0.25s ease;
}

/* ── Accessibility utility (from typography.css) ──────────── */
.ck-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
