/*
  Theme: Cloud (design A2, "Launchpad Light").

  A theme is only this list of tokens. Layout and components live in
  static/css/kelspi.css and use these names, never raw values. To make a new
  theme, copy this file, rename it, change the values and set UI_THEME to the
  new file name (without .css). See docs/THEMING.md.
*/
@font-face {
  font-family: "Bricolage Grotesque";
  src: url("../fonts/bricolage-grotesque-latin.woff2") format("woff2");
  font-weight: 400 800;
  font-display: swap;
}

:root {
  --font-display: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;   /* links people type in */

  /* Surfaces and text */
  --bg: #FFFFFF;
  --surface: #F2F3F8;
  --ink: #161D26;
  --muted: #4A5466;
  --line: #C5CAD6;
  --track: #E3E6EF;
  --link: #B54500;
  --focus: #161D26;

  /* Brand colours */
  --accent: #FF6200;
  --on-accent: #161D26;
  --second: #E499FF;
  --on-second: #161D26;
  --like: #FF6200;

  /* Messages */
  --ok-bg: #E8F7EF;
  --ok-ink: #0F5132;
  --warn-bg: #FFF4D6;
  --warn-ink: #5C4300;

  /* Camera */
  --camera-bg: #161D26;

  /* Shape */
  --radius-lg: 36px;
  --radius-md: 26px;
  --radius-sm: 16px;
  --radius-field: 12px;
  --radius-xs: 4px;
  --radius-pill: 999px;
}