/* web/css/tokens.css — Framer-look design tokens (after the EcoPower template), reset and body. Contrast is gated by web/tests/contrast.test.js. */
:root{
  color-scheme:light;
  --bg:#f4f5f5;--s1:#ffffff;--s2:#eaeeee;--line:#e1e6e6;--field-border:#8a9797;
  --bar-bg:rgba(244,245,245,.84);
  --fg:#0b1011;--body:#26302f;--fg-muted:#56625f;--accent:#22656a;
  --accent-fill:#2f7d81;--accent-fill-hover:#25686c;
  --high:#a3241c;--high-dot:#c0392b;--elev:#875200;--low:#1b6a3f;--info:#1d5b9c;--watch:#665a00;
  --warn-bg:#fff4d6;--warn-ink:#5b4300;--warn-line:#f0dfae;--err-bg:#fdecea;--err-ink:#8a1c14;--err-line:#f3c4be;
  --radius:20px;--radius-sm:12px;--top-h:64px;
  --shadow-menu:0 12px 32px rgba(16,40,42,.14);--shadow-card:0 1px 2px rgba(16,40,42,.04);--shadow-float:0 8px 24px rgba(16,40,42,.18);
  --ease:cubic-bezier(.2,.8,.2,1);--dur-fast:120ms;--dur:220ms;
  /* icon masks: drop (brand), white drop (phone app icon) and arrow (.btn.go) */
  --drop:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M12 2.7s6 6.1 6 10.8a6 6 0 0 1-12 0c0-4.7 6-10.8 6-10.8Z'/%3E%3C/svg%3E");
  --drop-fill:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2.7s6 6.1 6 10.8a6 6 0 0 1-12 0c0-4.7 6-10.8 6-10.8Z'/%3E%3C/svg%3E");
  --arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
  /* legacy aliases, still used by app.css and inline styles */
  --card:var(--s1);--ink:var(--fg);--mute:var(--fg-muted);--none:var(--fg-muted);--lg-tint:var(--bar-bg);
}
@media (max-width:640px){:root{--top-h:56px}}             /* phone app bar is 56 px (Material top app bar) */
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;font:500 16px/1.55 "Satoshi",system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.01em;
  color:var(--body);background:transparent;-webkit-font-smoothing:antialiased;padding-bottom:calc(72px + env(safe-area-inset-bottom))}
h1,h2,h3{color:var(--fg);font-weight:700;letter-spacing:-.03em;text-wrap:balance}
h1{font-size:32px;line-height:1.15}h2{font-size:24px;line-height:1.2}h3{font-size:18px;line-height:1.3}
@media (min-width:641px){h1{font-size:44px}}
[hidden]{display:none!important}                       /* B-2: a display rule must never beat the hidden attribute */