/* Copyright © 2026 Falcontext. All rights reserved. Not open source: see LICENSE. */
/* Falcontext's one scale (STYLE.md), shared by the panel (popup.css), the
   writing pad (pad.css) and Perch's page (app.css): every text size,
   corner, gap, status colour and font comes from here, so a change here
   changes it everywhere. Edit shared/tokens.css, then `npm run sync-shared`.
   Colours of each look (the panel's five themes, the pad's paper) stay in
   their own stylesheet. */
:root {
  /* Text */
  --fs-2xs: 10px; --fs-xs: 11px; --fs-s: 12px; --fs-m: 13px; --fs-l: 15px; --fs-xl: 18px; --fs-2xl: 20px;
  /* A box typed in on a phone: smaller, and iPhones zoom the page in when it's tapped. */
  --fs-input: 16px;
  /* Corners */
  --r-s: 4px; --r-m: 8px; --r-l: 12px; --r-pill: 999px;
  /* Gaps: padding, margins and gaps (2 to 40 px) */
  --sp-2xs: 2px; --sp-xs: 4px; --sp-s: 6px; --sp-m: 8px; --sp-l: 12px; --sp-xl: 16px; --sp-2xl: 20px; --sp-3xl: 24px; --sp-4xl: 32px; --sp-5xl: 40px;
  /* Status colours: the traffic lights, notes, text on a colour */
  --ok: #2f9f6b; --warn: #e0a030; --bad: #d0453a; --info: #90caf9; --on-color: #fff; --on-light: #1a1a1a;
  /* Shades: shadows, a dimmed backdrop, a hover tint (black or white at a strength) */
  --shade-1: rgba(0, 0, 0, .06); --shade-2: rgba(0, 0, 0, .14); --shade-3: rgba(0, 0, 0, .25); --shade-4: rgba(0, 0, 0, .4);
  --scrim: rgba(0, 0, 0, .35); --tint: rgba(127, 127, 127, .15); --tint-light: rgba(255, 255, 255, .1);
  /* Fonts */
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-serif: "Iowan Old Style", "Palatino Linotype", Charter, Georgia, serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}