/* Generated by tools/build_tokens.py from design/tokens.json: do not edit (docs/DESIGN_SYSTEM.md §3).
   Light values on :root; the dark theme follows the system unless the person chose one
   (web/theme.js sets <html data-theme="light|dark">). */
:root {
  /* color */
  --color-bg: #fffdf7;
  --color-bg-elev: #ffffff;
  --color-surface: #ffffff;
  --color-surface-2: #f5f1e6;
  --color-surface-3: #ebe5d6;
  --color-ink: #1d1f24;
  --color-ink-2: #3a3d45;
  --color-muted: #5f636b;
  --color-line: rgba(29, 31, 36, 0.10);
  --color-line-strong: rgba(29, 31, 36, 0.78);
  --color-outline: #1d1f24;
  --color-shadow: #1d1f24;
  --color-accent: #c8371f;
  --color-accent-ink: #ffffff;
  --color-accent-soft: #fde3dc;
  --color-accent-deep: #9c2a16;
  --color-blue: #2458a6;
  --color-blue-soft: #dde8f7;
  --color-yellow: #f7c23b;
  --color-yellow-soft: #fdf0c8;
  --color-ok: #1d774b;
  --color-ok-soft: #dcf1e4;
  --color-warn: #7a5200;
  --color-warn-soft: #fdf0c8;
  --color-danger: #b3261e;
  --color-danger-soft: #fbe0dc;
  --color-block-blue: #21529c;
  --color-block-blue-text: #ffffff;
  --color-block-red: #c8371f;
  --color-block-red-text: #ffffff;
  --color-block-yellow: #f7c23b;
  --color-block-yellow-text: #1d1f24;
  --color-block-ink: #1d1f24;
  --color-block-ink-text: #f5f1e6;
  --color-sos: #b3261e;
  --color-sos-deep: #8c1d17;
  --color-sos-text: #ffffff;
  --color-cat-food: #c8371f;
  --color-cat-food-soft: #fde3dc;
  --color-cat-drink: #8e3b6b;
  --color-cat-drink-soft: #f6e1ec;
  --color-cat-night: #2a2f6b;
  --color-cat-night-soft: #e1e3f4;
  --color-cat-culture: #2458a6;
  --color-cat-culture-soft: #dde8f7;
  --color-cat-nature: #1f7a4d;
  --color-cat-nature-soft: #dcf1e4;
  --color-cat-shop: #1d1f24;
  --color-cat-shop-soft: #ebe5d6;
  /* font */
  --font-family: "Archivo", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-display: "Archivo", "Arial Narrow", "Segoe UI", system-ui, sans-serif;
  --font-stretch-display: 68%;
  --font-stretch-numbers: 72%;
  /* radius */
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-xl: 28px;
  --radius-pill: 999px;
  /* space */
  --space-0: 0px;
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 8px;
  --space-4: 12px;
  --space-5: 16px;
  --space-6: 20px;
  --space-7: 24px;
  --space-8: 32px;
  --space-9: 48px;
  --space-10: 64px;
  /* border */
  --border-width: 2px;
  --border-hairline: 1px;
  /* elevation */
  --elevation-1: 2px 2px 0 var(--color-shadow);
  --elevation-2: 3px 3px 0 var(--color-shadow);
  --elevation-3: 4px 4px 0 var(--color-shadow);
  --elevation-4: 6px 6px 0 var(--color-shadow);
  --elevation-pressed: 1px 1px 0 var(--color-shadow);
  /* motion */
  --motion-fast: 90ms;
  --motion-base: 180ms;
  --motion-slow: 280ms;
  --motion-ease: cubic-bezier(.2, .8, .2, 1);
  /* layout */
  --layout-gutter: 18px;
  --layout-header-h: 56px;
  --layout-nav-h: 68px;
  --layout-safe-top: env(safe-area-inset-top, 0px);
  --layout-safe-bottom: env(safe-area-inset-bottom, 0px);
  /* type */
  --type-display-xl-size: 2.75rem;
  --type-display-xl-line: 0.95;
  --type-display-xl-weight: 900;
  --type-display-xl-stretch: 68%;
  --type-display-xl-tracking: 0em;
  --type-display-xl-case: uppercase;
  --type-display-xl: var(--type-display-xl-weight) var(--type-display-xl-size)/var(--type-display-xl-line) var(--font-display);
  --type-display-l-size: 2.125rem;
  --type-display-l-line: 1;
  --type-display-l-weight: 900;
  --type-display-l-stretch: 68%;
  --type-display-l-tracking: 0em;
  --type-display-l-case: uppercase;
  --type-display-l: var(--type-display-l-weight) var(--type-display-l-size)/var(--type-display-l-line) var(--font-display);
  --type-display-m-size: 1.5rem;
  --type-display-m-line: 1.05;
  --type-display-m-weight: 900;
  --type-display-m-stretch: 68%;
  --type-display-m-tracking: 0em;
  --type-display-m-case: uppercase;
  --type-display-m: var(--type-display-m-weight) var(--type-display-m-size)/var(--type-display-m-line) var(--font-display);
  --type-display-s-size: 1.25rem;
  --type-display-s-line: 1.1;
  --type-display-s-weight: 850;
  --type-display-s-stretch: 72%;
  --type-display-s-tracking: 0em;
  --type-display-s-case: none;
  --type-display-s: var(--type-display-s-weight) var(--type-display-s-size)/var(--type-display-s-line) var(--font-display);
  --type-title-size: 1.0625rem;
  --type-title-line: 1.3;
  --type-title-weight: 750;
  --type-title-stretch: 100%;
  --type-title-tracking: 0em;
  --type-title-case: none;
  --type-title: var(--type-title-weight) var(--type-title-size)/var(--type-title-line) var(--font-family);
  --type-body-l-size: 1rem;
  --type-body-l-line: 1.5;
  --type-body-l-weight: 500;
  --type-body-l-stretch: 100%;
  --type-body-l-tracking: 0em;
  --type-body-l-case: none;
  --type-body-l: var(--type-body-l-weight) var(--type-body-l-size)/var(--type-body-l-line) var(--font-family);
  --type-body-size: 0.9375rem;
  --type-body-line: 1.5;
  --type-body-weight: 500;
  --type-body-stretch: 100%;
  --type-body-tracking: 0em;
  --type-body-case: none;
  --type-body: var(--type-body-weight) var(--type-body-size)/var(--type-body-line) var(--font-family);
  --type-body-s-size: 0.84375rem;
  --type-body-s-line: 1.45;
  --type-body-s-weight: 500;
  --type-body-s-stretch: 100%;
  --type-body-s-tracking: 0em;
  --type-body-s-case: none;
  --type-body-s: var(--type-body-s-weight) var(--type-body-s-size)/var(--type-body-s-line) var(--font-family);
  --type-label-size: 0.875rem;
  --type-label-line: 1.2;
  --type-label-weight: 800;
  --type-label-stretch: 100%;
  --type-label-tracking: 0em;
  --type-label-case: none;
  --type-label: var(--type-label-weight) var(--type-label-size)/var(--type-label-line) var(--font-family);
  --type-caption-size: 0.78125rem;
  --type-caption-line: 1.35;
  --type-caption-weight: 650;
  --type-caption-stretch: 100%;
  --type-caption-tracking: 0em;
  --type-caption-case: none;
  --type-caption: var(--type-caption-weight) var(--type-caption-size)/var(--type-caption-line) var(--font-family);
  --type-kicker-size: 0.71875rem;
  --type-kicker-line: 1.2;
  --type-kicker-weight: 800;
  --type-kicker-stretch: 100%;
  --type-kicker-tracking: 0.12em;
  --type-kicker-case: uppercase;
  --type-kicker: var(--type-kicker-weight) var(--type-kicker-size)/var(--type-kicker-line) var(--font-family);
  /* historic names (web/app.css before the tokens), kept while the modules migrate */
  --bg: var(--color-bg);
  --bg-elev: var(--color-bg-elev);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface-2);
  --surface-3: var(--color-surface-3);
  --ink: var(--color-ink);
  --ink-2: var(--color-ink-2);
  --muted: var(--color-muted);
  --line: var(--color-line);
  --line-strong: var(--color-line-strong);
  --accent: var(--color-accent);
  --accent-ink: var(--color-accent-ink);
  --accent-soft: var(--color-accent-soft);
  --accent-deep: var(--color-accent-deep);
  --sea: var(--color-blue);
  --sea-soft: var(--color-blue-soft);
  --gold: var(--color-yellow);
  --gold-soft: var(--color-yellow-soft);
  --ok: var(--color-ok);
  --ok-soft: var(--color-ok-soft);
  --warn: var(--color-warn);
  --warn-soft: var(--color-warn-soft);
  --danger: var(--color-danger);
  --danger-soft: var(--color-danger-soft);
  --outline: var(--color-shadow);
  --card-border: var(--border-width) solid var(--color-outline);
  --card-shadow: var(--elevation-3);
  --press-shadow: var(--elevation-pressed);
  --shadow-1: var(--elevation-2);
  --shadow-2: var(--elevation-3);
  --shadow-3: var(--elevation-4);
  --r-xs: var(--radius-xs);
  --r-sm: var(--radius-sm);
  --r-md: var(--radius-md);
  --r-lg: var(--radius-lg);
  --r-xl: var(--radius-xl);
  --r-pill: var(--radius-pill);
  --font: var(--font-family);
  --display: var(--font-display);
  --display-stretch: var(--font-stretch-display);
  --header-h: var(--layout-header-h);
  --nav-h: var(--layout-nav-h);
  --safe-top: var(--layout-safe-top);
  --safe-bottom: var(--layout-safe-bottom);
  --gutter: var(--layout-gutter);
  --ease: var(--motion-ease);
  color-scheme: light;
}
@media (min-width: 960px) {
  :root { --layout-gutter: 28px; --type-display-xl-size: clamp(3.5rem, 2.4rem + 1.8vw, 4rem); }
}
@media (min-width: 1100px) {
  :root { --layout-gutter: 32px; --layout-header-h: 0px; }
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #121418;
    --color-bg-elev: #17191e;
    --color-surface: #1c1f24;
    --color-surface-2: #262a31;
    --color-surface-3: #30353d;
    --color-ink: #f5f1e6;
    --color-ink-2: #d6d2c7;
    --color-muted: #a3a097;
    --color-line: rgba(245, 241, 230, 0.10);
    --color-line-strong: rgba(245, 241, 230, 0.6);
    --color-outline: #6b6a64;
    --color-shadow: #000000;
    --color-accent: #ff7a5c;
    --color-accent-ink: #121418;
    --color-accent-soft: #3b211b;
    --color-accent-deep: #ff9a82;
    --color-blue: #7fa8f0;
    --color-blue-soft: #1d2a40;
    --color-yellow: #f7c23b;
    --color-yellow-soft: #3a3016;
    --color-ok: #62c496;
    --color-ok-soft: #173427;
    --color-warn: #f0c35c;
    --color-warn-soft: #3a3016;
    --color-danger: #ff8a78;
    --color-danger-soft: #3d201c;
    --color-cat-food: #ff7a5c;
    --color-cat-food-soft: #3b211b;
    --color-cat-drink: #e58fbf;
    --color-cat-drink-soft: #35202c;
    --color-cat-night: #aeb3f2;
    --color-cat-night-soft: #20223a;
    --color-cat-culture: #7fa8f0;
    --color-cat-culture-soft: #1d2a40;
    --color-cat-nature: #62c496;
    --color-cat-nature-soft: #173427;
    --color-cat-shop: #f5f1e6;
    --color-cat-shop-soft: #30353d;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --color-bg: #121418;
  --color-bg-elev: #17191e;
  --color-surface: #1c1f24;
  --color-surface-2: #262a31;
  --color-surface-3: #30353d;
  --color-ink: #f5f1e6;
  --color-ink-2: #d6d2c7;
  --color-muted: #a3a097;
  --color-line: rgba(245, 241, 230, 0.10);
  --color-line-strong: rgba(245, 241, 230, 0.6);
  --color-outline: #6b6a64;
  --color-shadow: #000000;
  --color-accent: #ff7a5c;
  --color-accent-ink: #121418;
  --color-accent-soft: #3b211b;
  --color-accent-deep: #ff9a82;
  --color-blue: #7fa8f0;
  --color-blue-soft: #1d2a40;
  --color-yellow: #f7c23b;
  --color-yellow-soft: #3a3016;
  --color-ok: #62c496;
  --color-ok-soft: #173427;
  --color-warn: #f0c35c;
  --color-warn-soft: #3a3016;
  --color-danger: #ff8a78;
  --color-danger-soft: #3d201c;
  --color-cat-food: #ff7a5c;
  --color-cat-food-soft: #3b211b;
  --color-cat-drink: #e58fbf;
  --color-cat-drink-soft: #35202c;
  --color-cat-night: #aeb3f2;
  --color-cat-night-soft: #20223a;
  --color-cat-culture: #7fa8f0;
  --color-cat-culture-soft: #1d2a40;
  --color-cat-nature: #62c496;
  --color-cat-nature-soft: #173427;
  --color-cat-shop: #f5f1e6;
  --color-cat-shop-soft: #30353d;
  color-scheme: dark;
}
