/* Qwalet — Cream and Pine 2.0.0 (2026-09-13).
 * GENERATED by scripts/gen-design-tokens.mjs from docs/design-tokens.json —
 * edit the JSON, not this file. The site loads nothing from a third party. */
:root {
  --primary: #155F4B;
  --primary-pressed: #0F4C3C;
  --primary-light: #2E7A62;
  --on-primary: #F7F1E4;
  --primary-container: #DCE8E3;
  --surface: #FCF8F1;
  --white: #FFFFFF;
  --cream: #F7F1E4;
  --surface-container: #F0E9DB;
  --surface-high: #EAE1D0;
  --champagne: #F7E3B8;
  --band: linear-gradient(160deg, #F7E3B8 0%, #F7F1E4 100%);
  --ink: #16211D;
  --ink-variant: #47534E;
  --outline: #7C837E;
  --outline-variant: #CFC9BC;
  --warning: #F2C35C;
  --on-warning: #4A3106;
  --warning-container: #FCE8A2;
  --on-warning-container: #53482A;
  --error: #A3122B;
  --on-error: #FFFFFF;
  --error-container: #FFDAD6;
  --on-error-container: #3F0710;
  --tertiary-container: #D3E3F5;
  --on-tertiary-container: #06213A;
  --hub-home: linear-gradient(160deg, #0F4C3C 0%, #155F4B 45%, #2E7A62 100%);
  --hub-home-muted: #A6D3C2;
  --hub-home-pill: rgba(255,255,255,0.12);
  --shadow-card: 0 8px 24px rgba(12,59,52,0.08);
  --shadow-nav: 0 10px 30px rgba(12,59,52,0.14);
  --shadow-raised: 0 16px 48px rgba(12,59,52,0.16);
  --radius-button: 12px;
  --radius-verb-tile: 14px;
  --radius-input: 16px;
  --radius-web-tile: 18px;
  --radius-banner: 20px;
  --radius-card: 24px;
  --radius-figure: 28px;
  --radius-panel: 32px;
  --radius-pill: 9999px;
  --measure: 45rem;
  --side: 100px;
}