@font-face {
  font-family: 'Geist';
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/Geist-Variable.woff2') format('woff2');
}

:root { color-scheme: light dark; }
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

:root {
  --bg: light-dark(#F4F3F1, #121211);
  --surface: light-dark(#F7F7F7, #1A1A19);
  --surface-2: light-dark(#EFEEEC, #232322);
  --surface-input: light-dark(#FFFFFF, #1E1E1D);
  --surface-glass: light-dark(rgba(247, 247, 247, 0.85), rgba(26, 26, 25, 0.85));
  --nav-active: light-dark(#E8E8E8, #2A2A28);
  --nav-hover: light-dark(#EDECEA, #222220);
  --hairline: light-dark(#EFEEEC, #242422);
  --border: light-dark(#ECEBE8, #2C2C2A);
  --text-1: light-dark(#111110, #F4F3F1);
  --text-2: light-dark(#373739, #CFCFCC);
  --text-3: light-dark(#77787A, #8E8E8C);
  --text-4: light-dark(#A0A1A3, #6B6B69);
  --section-label: light-dark(#B1B1B3, #6B6B69);
  --icon-button: light-dark(#ECECEC, #262625);
  --icon-muted: light-dark(#797979, #A3A3A0);
  --kbd: light-dark(#EFEFF2, #2A2A28);
  --search: light-dark(#F7F7F7, #1A1A19);
  --now: light-dark(#38383A, #F4F3F1);
  --now-text: light-dark(#FFFFFF, #121211);
  --good: #6AC778;
  --good-chip-bg: light-dark(#B6EAB6, rgba(182, 234, 182, 0.18));
  --good-chip-text: light-dark(#233D23, #B6EAB6);
  --track: light-dark(#E7E7E7, #2C2C2A);
  --progress-track: light-dark(#E6E6E6, #2C2C2A);
  --info-text: #909FC8;
  --error-text: light-dark(#C2543A, #E08A72);
  --accent-blue: #1870FA;
  --accent-orange: #F49548;
  --chart-line: #9DA1D8;
  --chart-bar: light-dark(#A4A4A4, #5E5E5C);
  --chart-bar-strong: light-dark(#111110, #F4F3F1);
  --chart-bar-cool: light-dark(#9A9CA8, #6E707C);
  --chart-ring: light-dark(rgba(17, 17, 16, 0.06), rgba(244, 243, 241, 0.07));
  --chart-wave: light-dark(rgba(255, 255, 255, 0.65), rgba(244, 243, 241, 0.2));
  --gauge-track: light-dark(rgba(17, 17, 16, 0.10), rgba(244, 243, 241, 0.14));
  --scale-dot: light-dark(#FFFFFF, #F4F3F1);
  --hero-dot: #F3E3A0;
  --hero-dot-ring: light-dark(rgba(255, 255, 255, 0.7), rgba(244, 243, 241, 0.25));
  --hero-dot-outline: light-dark(rgba(255, 255, 255, 0.9), rgba(244, 243, 241, 0.4));
  --hero-dot-glow: rgba(243, 227, 160, 0.6);
  --hero-haze: light-dark(rgba(209, 204, 200, 0.5), rgba(18, 18, 17, 0.55));
  --hero-connector: light-dark(rgba(17, 17, 16, 0.25), rgba(244, 243, 241, 0.3));
  --hero-silhouette: light-dark(#E8E6E3, #262624);
  --hero-silhouette-edge: light-dark(#DEDBD7, #2E2E2C);
  --primary: light-dark(#111110, #F4F3F1);
  --primary-hover: light-dark(#2A2A28, #DCDBD8);
  --primary-text: light-dark(#FFFFFF, #121211);
  --focus-ring: light-dark(rgba(17, 17, 16, 0.08), rgba(244, 243, 241, 0.12));
  --backdrop: light-dark(rgba(17, 17, 16, 0.25), rgba(0, 0, 0, 0.5));
  --status-on: #6AC778;
  --status-off: light-dark(#C4C4C2, #4A4A48);

  --tint-cool: light-dark(#F2F3F4, #1C1D1F);
  --tint-pink: linear-gradient(180deg, light-dark(#F9EDF1, #221C1E) 0%, light-dark(#FAEEEE, #221D1D) 100%);
  --grad-green:
    radial-gradient(60% 70% at 45% 55%, light-dark(#CCE7CE, rgba(204, 231, 206, 0.18)) 0%, rgba(204, 231, 206, 0) 70%),
    radial-gradient(55% 60% at 92% 12%, light-dark(#F2F4DF, rgba(242, 244, 223, 0.1)) 0%, rgba(242, 244, 223, 0) 70%),
    radial-gradient(60% 60% at 8% 8%, light-dark(#DCEAE0, rgba(220, 234, 224, 0.12)) 0%, rgba(220, 234, 224, 0) 70%),
    light-dark(#ECF1E2, #1A1C19);
  --grad-peach:
    radial-gradient(55% 65% at 50% 55%, light-dark(#FFC097, rgba(255, 192, 151, 0.18)) 0%, rgba(255, 192, 151, 0) 72%),
    radial-gradient(50% 55% at 12% 88%, light-dark(#FED89E, rgba(254, 216, 158, 0.12)) 0%, rgba(254, 216, 158, 0) 70%),
    radial-gradient(50% 60% at 92% 30%, light-dark(#FCD6CA, rgba(252, 214, 202, 0.12)) 0%, rgba(252, 214, 202, 0) 70%),
    light-dark(#FBE5CF, #1E1A17);
  --blob-green: radial-gradient(closest-side, light-dark(#CCE7CE, rgba(204, 231, 206, 0.22)), light-dark(rgba(220, 234, 224, 0.6), rgba(204, 231, 206, 0.08)) 60%, rgba(220, 234, 224, 0));
  --blob-peach: radial-gradient(closest-side, light-dark(#FFC097, rgba(255, 192, 151, 0.2)), light-dark(rgba(254, 216, 158, 0.6), rgba(254, 216, 158, 0.08)) 60%, rgba(251, 229, 207, 0));

  --chip-neutral-bg: light-dark(#EFEEEC, #2A2A28);
  --chip-neutral-text: light-dark(#373739, #CFCFCC);
  --chip-info-bg: light-dark(#E9EBFA, rgba(233, 235, 250, 0.12));
  --chip-info-text: light-dark(#5A66B8, #AEB6EE);
  --chip-warn-bg: light-dark(#FBF3DF, rgba(251, 243, 223, 0.12));
  --chip-warn-text: light-dark(#8A6416, #E9C77E);

  --insight-up: #71BE72;
  --insight-up-bg: light-dark(#EAF9EB, rgba(113, 190, 114, 0.16));
  --insight-sleep: #7580CD;
  --insight-sleep-bg: light-dark(#E9EBFA, rgba(117, 128, 205, 0.18));
  --insight-steady: #7EB981;
  --insight-steady-bg: light-dark(#E6F3E7, rgba(126, 185, 129, 0.16));
  --insight-tip: #F2BF6B;
  --insight-tip-bg: light-dark(#FBF3DF, rgba(242, 191, 107, 0.16));

  --cat-gym: #9CB2EB;
  --cat-sleep: #7580CD;
  --cat-food: #FBAD36;
  --cat-school: #7FCD7A;
  --cat-coding: #8EC5E8;
  --cat-rest: #C9B8E8;
  --cat-social: #F2A7B8;
  --cat-work: #E8C27A;
  --cat-commute: #A9C9C1;
  --cat-wasted: #D6D3CF;
  --cat-other: #BDBBB7;

  --font-sans: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fs-11: 11px;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-15: 15px;
  --fs-22: 22px;
  --fs-26: 26px;
  --fs-40: 40px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 18px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 999px;

  --shadow-card: 0 1px 2px light-dark(rgba(17, 17, 16, 0.03), rgba(0, 0, 0, 0.2));
  --shadow-pop: 0 8px 24px light-dark(rgba(17, 17, 16, 0.08), rgba(0, 0, 0, 0.4)), 0 1px 2px light-dark(rgba(17, 17, 16, 0.04), rgba(0, 0, 0, 0.3));

  --fast: 150ms;
  --day-fade: 200ms;
}
