/* ─────────────────────────────────────────────────────────────────────────────
   V3DA design tokens — neutral greys, one accent, six mode hues used only as small tags, hairlines. No glows.
   ───────────────────────────────────────────────────────────────────────────── */

@font-face {
  font-family: "Geist";
  src: url("/fonts/geist/geist-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist";
  src: url("/fonts/geist/geist-latin-ext-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist Mono";
  src: url("/fonts/geist-mono/geist-mono-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900; font-style: normal; font-display: swap;
}

:root {
  color-scheme: dark;

  /* surfaces */
  --bg: #09090b;
  --bg-glow: #09090b;
  --surface-0: rgba(255, 255, 255, 0.02);
  --surface-1: #0f0f12;
  --surface-2: #151518;
  --surface-3: #1c1c20;
  --hairline: rgba(255, 255, 255, 0.065);
  --hairline-2: rgba(255, 255, 255, 0.11);
  --hairline-3: rgba(255, 255, 255, 0.18);

  /* text */
  --text: #ededef;
  --text-2: #a1a1aa;
  --text-3: #71717a;
  --text-4: #52525b;

  /* brand */
  --accent: #7c9dff;
  --accent-2: #7c9dff;
  --accent-ink: #09090b;
  --accent-soft: rgba(124, 157, 255, 0.12);
  --brand-grad: linear-gradient(var(--accent), var(--accent));

  /* semantic */
  --ok: #3ddc97;
  --ok-soft: rgba(61, 220, 151, 0.12);
  --warn: #f5c451;
  --bad: #ff6b6b;
  --bad-soft: rgba(255, 107, 107, 0.1);

  /* six failure modes — tuned to equal perceived brightness */
  --ROTTED: #ff8a65;
  --BURIED: #f2c14e;
  --UNWRITTEN: #a78bfa;
  --UNTRACKED: #2dd4bf;
  --EXPIRED: #f472b6;
  --DIVIDED: #60a5fa;

  /* four integrations */
  --gmail: #ff8a80;
  --notion: #e5e7eb;
  --drive: #7dd3a8;
  --slack: #c4a1ff;

  /* type */
  --font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --fs-xs: 11px;
  --fs-sm: 12.5px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 28px;

  /* shape */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 22px;
  --shadow-1: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 1px 0 rgba(255, 255, 255, 0.05) inset, 0 8px 24px -8px rgba(0, 0, 0, 0.6), 0 2px 6px rgba(0, 0, 0, 0.35);
  --shadow-3: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 24px 64px -16px rgba(0, 0, 0, 0.75), 0 4px 16px rgba(0, 0, 0, 0.4);

  /* motion — calm, physical, never bouncy for its own sake */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-emph: cubic-bezier(0.2, 0, 0, 1);
  --spring: linear(0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%, 0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50.1%, 1.015 55%, 1.017 63.9%, 1.001 85.9%, 1);
  --spring-soft: linear(0, 0.012, 0.047 3.4%, 0.184 7.3%, 0.61 21.1%, 0.785 28.4%, 0.899 35.6%, 0.964 43%, 0.996 50.6%, 1.008 58.6%, 1.006 73.4%, 1);
  --t-fast: 140ms;
  --t-med: 260ms;
  --t-slow: 520ms;

  /* layout */
  --gutter: 16px;
  --header-h: 60px;
  --maxw: 1480px;
}

@media (min-width: 900px) {
  :root { --gutter: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 1ms; --t-med: 1ms; --t-slow: 1ms; }
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}
:root[data-motion="reduced"] { --t-fast: 1ms; --t-med: 1ms; --t-slow: 1ms; }
:root[data-motion="reduced"] *, :root[data-motion="reduced"] *::before, :root[data-motion="reduced"] *::after {
  animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important;
}

/* reset */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { margin: 0; background: var(--bg); color: var(--text); }
body {
  font-family: var(--font); font-size: var(--fs-md); line-height: 1.5;
  font-feature-settings: "ss01", "cv11"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  min-height: 100dvh; overflow-x: hidden;
}
button, input, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
svg { display: block; }
::selection { background: rgba(122, 162, 255, 0.3); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
.tnum { font-variant-numeric: tabular-nums; }
.mono { font-family: var(--mono); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }