/* A copy of the app's tokens (mobile/design/system), kept by hand: the two projects share no file. */
:root {
  --ground: #C9EFE4;
  --surface: #FFFFFF;
  --tint: #E3F7F0;
  --edge: #A6DDCD;
  --line: #8FCDBB;
  --ink: #0F4A42;
  --ink-muted: #346E64;
  --control-line: #3E8272;
  --go: #1C8753;
  --go-edge: #13633C;
  --on-go: #FFFFFF;
  --go-text: #0B7040;
  --shop: #2556D8;
  --shop-edge: #173C9E;
  --on-shop: #FFFFFF;
  --shop-text: #2556D8;
  --urgent-soft: #FFE3D6;
  --urgent-text: #B23A12;
  --danger-text: #B42F27;
  --danger: #B42F27;
  --danger-edge: #7A1C16;
  --on-danger: #FFFFFF;
  --sun: #FFC531;
  --on-sun: #0F4A42;
  --toast: #0F4A42;
  --on-toast: #FFFFFF;
  --scrim: rgba(15, 74, 66, 0.55);
  --confetti: #FF7E95;
  --hill: #B7E59E;
  --hill-deep: #8FD77B;
  --sticker-edge: #FFFFFF;
  --ledge-sm: 0 3px 0 #A6DDCD;
  --ledge: 0 4px 0 #A6DDCD;
  --ledge-lg: 0 5px 0 #A6DDCD;
  --ledge-pressed: 0 1px 0 #A6DDCD;
  --ledge-go: 0 4px 0 #13633C;
  --ledge-danger: 0 4px 0 #7A1C16;
  --ledge-danger-pressed: 0 1px 0 #7A1C16;
  --ledge-go-pressed: 0 1px 0 #13633C;
  --ledge-shop: 0 4px 0 #173C9E;
  --ledge-shop-pressed: 0 1px 0 #173C9E;
  --ledge-inset: inset 0 2px 0 #A6DDCD;
  --sticker-drop: 0 5px 6px rgba(15, 74, 66, 0.22);
}
@media (prefers-color-scheme: dark) {
  :root {
  --ground: #0D2925;
  --surface: #163C36;
  --tint: #1E4A43;
  --edge: #061815;
  --line: #3D6B62;
  --ink: #E6F8F1;
  --ink-muted: #A6CEC4;
  --control-line: #78AFA1;
  --go: #1C8753;
  --go-edge: #0B4428;
  --on-go: #FFFFFF;
  --go-text: #6FD9A3;
  --shop: #2556D8;
  --shop-edge: #0F2A75;
  --on-shop: #FFFFFF;
  --shop-text: #9DB8FF;
  --urgent-soft: #4D2418;
  --urgent-text: #FFB79C;
  --danger-text: #FF9C8F;
  --danger: #B42F27;
  --danger-edge: #4A0F0B;
  --on-danger: #FFFFFF;
  --sun: #FFC531;
  --on-sun: #0F4A42;
  --toast: #E6F8F1;
  --on-toast: #0D2925;
  --scrim: rgba(3, 14, 12, 0.72);
  --confetti: #FF7E95;
  --hill: #2C5A3A;
  --hill-deep: #24683E;
  --sticker-edge: #FFFFFF;
  --ledge-sm: 0 3px 0 #061815;
  --ledge: 0 4px 0 #061815;
  --ledge-lg: 0 5px 0 #061815;
  --ledge-pressed: 0 1px 0 #061815;
  --ledge-go: 0 4px 0 #0B4428;
  --ledge-danger: 0 4px 0 #4A0F0B;
  --ledge-danger-pressed: 0 1px 0 #4A0F0B;
  --ledge-go-pressed: 0 1px 0 #0B4428;
  --ledge-shop: 0 4px 0 #0F2A75;
  --ledge-shop-pressed: 0 1px 0 #0F2A75;
  --ledge-inset: inset 0 2px 0 #061815;
  --sticker-drop: 0 5px 6px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}
}

:root {
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 24px;
  --radius-2xl: 30px;
  --radius-full: 9999px;
  --size-tap: 48px;
  --size-row: 64px;
  --size-button: 60px;
  --size-button-sm: 52px;
  --size-icon-button: 48px;
  --size-check: 30px;
  --size-sticker-row: 48px;
  --size-sticker-tile: 66px;
  --size-avatar: 34px;
  --size-avatar-sm: 28px;
  --dur-press: 100ms;
  --dur-check: 200ms;
  --dur-hop: 500ms;
  --dur-chip: 250ms;
  --dur-sheet: 350ms;
  --dur-wait: 300ms;
  --dur-undo: 4000ms;
  --ease-out: cubic-bezier(0.2, 0, 0, 1);
  --ease-spring: cubic-bezier(0.3, 1.4, 0.5, 1);
  --font-round: Fredoka, "Arial Hebrew", "Noto Sans Hebrew", system-ui, sans-serif;
}
.type-display { font-family: var(--font-round); font-size: 36px; line-height: 42px; font-weight: 700; }
.type-title { font-family: var(--font-round); font-size: 32px; line-height: 38px; font-weight: 700; }
.type-heading { font-family: var(--font-round); font-size: 24px; line-height: 30px; font-weight: 700; }
.type-item { font-family: var(--font-round); font-size: 19px; line-height: 24px; font-weight: 500; }
.type-section { font-family: var(--font-round); font-size: 19px; line-height: 24px; font-weight: 600; }
.type-button { font-family: var(--font-round); font-size: 19px; line-height: 24px; font-weight: 700; }
.type-name { font-family: var(--font-round); font-size: 17px; line-height: 22px; font-weight: 600; }
.type-body { font-family: var(--font-round); font-size: 16px; line-height: 22px; font-weight: 500; }
.type-label { font-family: var(--font-round); font-size: 15px; line-height: 20px; font-weight: 600; }
.type-meta { font-family: var(--font-round); font-size: 15px; line-height: 20px; font-weight: 500; }
.type-badge { font-family: var(--font-round); font-size: 14px; line-height: 18px; font-weight: 600; }
.type-tab { font-family: var(--font-round); font-size: 13px; line-height: 16px; font-weight: 600; }