/* Citizen water app v2: design tokens (prototype/DESIGN-RULES.md rule 5 + mu-screen phone row).
   Palette and Sarabun are locked; sizes come from the phone token row only. */
:root {
  color-scheme: light;
  color-scheme: only light;
  /* palette (unchanged from the prototype) */
  --green-900: #0e3d14;
  --green-800: #14501c;
  --green-700: #1b5e20;
  --green-100: #dfeadf;
  --green-050: #eef4ee;
  --cream: #f7f5ee;
  --cream-dark: #eeeadd;
  --gold: #c9a227;
  --gold-bar: #e2ae36;
  --gold-soft: #f6e7bd;
  --amber-bg: #fbe5ae;
  --amber-ink: #6e4a07;
  --amber-note-bg: #fdf3da;
  --amber-note-line: #f2d489;
  --red-bg: #fbe1e1;
  --red-ink: #b3161b;
  --blue-bg: #e2eaf3;
  --blue-ink: #2d4f6c;
  --paid-bg: #def0dd;
  --paid-ink: #1e5b25;
  --ink: #1f2a22;
  --ink-soft: #5b6560;
  --ink-faint: #6b7470;
  --tab-ink: #676b75;
  --line: #e2e5df;
  --line-soft: #ecefe9;
  --white: #fff;
  --badge: #d7262b;
  --scan-dark: #2b2d2f;
  --viewer-bg: #1d1f1e;
  --hero-sub: #f3d98e;
  --poster-bg: #e3e8ee;
  /* urgent severity fills with white text (>= 4.5:1): red = --badge, amber and blue below */
  --sev-amber: #a86200;
  --sev-blue: #1565c0;
  /* MU public warning code (pattern pack §2): the only colours added to v4; level chips and popup strips only */
  --lv-important: #f4c430;
  --lv-important-ink: #352600;
  --lv-watch: #f97316;
  --lv-watch-ink: #3b1a00;
  --lv-emergency: #b42318;
  --lv-emergency-ink: #ffffff;

  /* type: phone row */
  --t-body: 16px;
  --t-meta: 13px;
  --t-help: 14px;
  --t-tab: 12px;
  --t-section: 18px;
  --t-title: 20px;
  --t-amount: 28px;
  --t-hero: 24px;

  /* sizes */
  --tap: 48px;
  --tap-dense: 44px;
  --row: 56px;
  --row-dense: 48px;
  --gutter: 16px;
  --gap: 12px;
  --gap-s: 8px;
  --radius: 12px;
  --radius-s: 10px;
  --glyph: 24px;
  --glyph-quick: 24px;
  --app-width: 440px;
  --tabbar-h: 58px;
  --tile: 48px;
  --hero-h: 64px;
  --nav-clear: calc(var(--tabbar-h) + 40px + env(safe-area-inset-bottom, 0px));
}