/* Owned AI tokens. Copied verbatim from the design pack owned-ai-v2/tokens/.
   Do not edit here: edit the pack and re-copy, or the site and the console drift. */

/* --- tokens/fonts.css --- */
/* Owned AI webfonts. All static weights. No variable fonts: the PDF renderer cannot use them. */
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap");

/* --- tokens/colors.css --- */
:root{
  /* Base ink. Warm-neutral with a faint green cast so it sits on warm and cool hosts alike. */
  --ink-900:#141A16; --ink-800:#232B25; --ink-700:#3A423C; --ink-600:#4D564F; --ink-500:#616B63; --ink-400:#8A938B;
  --paper-100:#FFFFFF; --paper-200:#FAF8F4; --paper-300:#F1EEE8; --paper-400:#E6E2D9;
  --line-100:#DCD7CE; --line-200:#C3BCB0;
  /* Seal green. The parent accent. Deliberately far from StreamBuild blue #2C55E0 and teal #16B8A3. */
  --seal-900:#0F2E22; --seal-700:#174A37; --seal-600:#1F5D45; --seal-400:#4E9B78; --seal-300:#79C4A3; --seal-200:#B9E0CD;
  /* Dark field */
  --field-900:#0B0E0C; --field-800:#101411; --field-700:#171C18; --field-600:#1F2621; --field-line:#2A322C;
  --field-ink-900:#F2EFE9; --field-ink-500:#A2ACA4; --field-ink-400:#7C857E;
  /* Semantic sources */
  --green-700:#2F6B4F; --green-300:#7FCBA4;
  --amber-700:#8A5A12; --amber-300:#E0B25C;
  --red-700:#9B2C24;  --red-300:#F2938A;

  /* Semantic aliases. Use these, not the base ramps. */
  --background:var(--paper-200);
  --surface:var(--paper-100);
  --surface-sunken:var(--paper-300);
  --surface-inverse:var(--field-800);
  --text-primary:var(--ink-900);
  --text-secondary:var(--ink-500);
  --text-inverse:var(--field-ink-900);
  --text-on-accent:var(--paper-100);
  --accent:var(--seal-600);
  --accent-hover:var(--seal-700);
  --accent-quiet:var(--seal-200);
  --accent-on-dark:var(--seal-300);
  --border:var(--line-100);
  --border-strong:var(--line-200);
  --focus-ring:var(--seal-600);
  --success:var(--green-700);
  --warning:var(--amber-700);
  --danger:var(--red-700);
  --success-on-dark:var(--green-300);
  --warning-on-dark:var(--amber-300);
  --danger-on-dark:var(--red-300);

  /* Product palettes. Owned AI never uses these for parent surfaces. */
  --streambuild-blue:#2C55E0; --streambuild-teal:#16B8A3; --streambuild-panel:#0F172A;
}
:root[data-theme="dark"]{
  --background:var(--field-800);
  --surface:var(--field-700);
  --surface-sunken:var(--field-900);
  --surface-inverse:var(--paper-200);
  --text-primary:var(--field-ink-900);
  --text-secondary:var(--field-ink-500);
  --text-inverse:var(--ink-900);
  --text-on-accent:var(--field-900);
  --accent:var(--seal-300);
  --accent-hover:var(--seal-200);
  --accent-quiet:var(--seal-900);
  --accent-on-dark:var(--seal-300);
  --border:var(--field-line);
  --border-strong:#3A443C;
  --focus-ring:var(--seal-300);
  --success:var(--green-300);
  --warning:var(--amber-300);
  --danger:var(--red-300);
}

/* --- tokens/typography.css --- */
:root{
  --font-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --font-text:"IBM Plex Sans",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;

  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700;

  --size-display-1:56px; --size-display-2:40px; --size-display-3:30px;
  --size-title:22px; --size-body-lg:17px; --size-body:15px; --size-body-sm:13.5px;
  --size-label:12.5px; --size-micro:11px;

  --leading-display:1.08; --leading-title:1.28; --leading-body:1.55; --leading-tight:1.35;
  --tracking-display:-0.022em; --tracking-title:-0.008em; --tracking-body:0em;
  --tracking-label:0.06em; --tracking-stamp:0.14em;

  /* Composite roles */
  --type-display:var(--weight-semibold) var(--size-display-1)/var(--leading-display) var(--font-display);
  --type-heading:var(--weight-semibold) var(--size-display-3)/var(--leading-title) var(--font-display);
  --type-title:var(--weight-semibold) var(--size-title)/var(--leading-title) var(--font-display);
  --type-body:var(--weight-regular) var(--size-body)/var(--leading-body) var(--font-text);
  --type-body-strong:var(--weight-medium) var(--size-body)/var(--leading-body) var(--font-text);
  --type-label:var(--weight-semibold) var(--size-label)/1.2 var(--font-text);
  --type-stamp:var(--weight-medium) var(--size-micro)/1.2 var(--font-mono);
}

/* --- tokens/spacing.css --- */
:root{
  --space-1:2px; --space-2:4px; --space-3:8px; --space-4:12px; --space-5:16px;
  --space-6:24px; --space-7:32px; --space-8:48px; --space-9:64px; --space-10:96px; --space-11:128px;
  --measure-text:64ch; --measure-narrow:46ch;
  --page-max:1200px; --page-gutter:var(--space-6);
  --control-h-sm:28px; --control-h:36px; --control-h-lg:44px;
}

/* --- tokens/shape.css --- */
:root{
  /* The system's corner language is the chamfer, not the radius. Radii stay near zero. */
  --radius-0:0px; --radius-1:2px; --radius-2:3px; --radius-3:6px; --radius-pill:999px;
  --chamfer-sm:6px; --chamfer-md:10px; --chamfer-lg:16px;
  --border-hairline:1px; --border-strong-w:1.5px; --rule-w:1px;
  --shadow-none:none;
  --shadow-raise:0 1px 1px rgba(20,26,22,.05),0 2px 6px rgba(20,26,22,.06);
  --shadow-overlay:0 8px 28px rgba(20,26,22,.16),0 1px 2px rgba(20,26,22,.10);
  --clip-chamfer-tr:polygon(0 0,calc(100% - var(--chamfer-md)) 0,100% var(--chamfer-md),100% 100%,0 100%);
  --clip-chamfer-both:polygon(0 0,calc(100% - var(--chamfer-md)) 0,100% var(--chamfer-md),100% 100%,var(--chamfer-md) 100%,0 calc(100% - var(--chamfer-md)));
}

/* --- tokens/motion.css --- */
:root{
  --dur-fast:120ms; /* @kind other */
  --dur-base:180ms; /* @kind other */
  --dur-slow:280ms; /* @kind other */
  --ease-standard:cubic-bezier(.2,0,.2,1); /* @kind other */
  --ease-exit:cubic-bezier(.4,0,1,1); /* @kind other */
  --transition-control:background-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard);
}

/* --- tokens/base.css --- */
body{background:var(--background);color:var(--text-primary);font:var(--type-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-title);margin:0}
a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--accent-hover);text-decoration-thickness:1.5px}
::selection{background:var(--accent-quiet);color:var(--ink-900)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}