/* Shared look for every page. Geist is vendored: an anonymous survey must not
   make its visitors' browsers call a font CDN. */
@font-face { font-family: Geist; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/geist-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: Geist; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/geist-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist Mono"; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/geist-mono-latin.woff2) format("woff2"); }

:root {
  --bg: #f6f6f3; --bg-2: #ecebe6; --surface: #ffffff; --surface-2: #f3f3f0;
  --ink: #15171c; --ink-2: #3b3f48; --muted: #6c707a; --line: rgb(20 22 28 / .08); --line-2: rgb(20 22 28 / .14);
  --accent: #5b4cf5; --accent-2: #8a5cf6; --accent-ink: #ffffff; --accent-soft: rgb(91 76 245 / .1);
  --glow-1: rgb(124 104 255 / .22); --glow-2: rgb(56 189 190 / .16);
  --live: #12a150; --warn: #c2410c;
  /* agreement scale, bad to good; tone "down" statements read it reversed */
  --s0: #e0445f; --s1: #f07c52; --s2: #f4b942; --s3: #b7cf5a; --s4: #5cbc7c; --s5: #1f9d74;
  /* neutral statements: one hue, light to deep */
  --n0: #d9d6fb; --n1: #bdb6f8; --n2: #9d93f4; --n3: #7f71ef; --n4: #6250e8; --n5: #4634cf;
  --shadow: 0 1px 2px rgb(20 22 28 / .04), 0 8px 24px -8px rgb(20 22 28 / .12);
  --shadow-lg: 0 2px 4px rgb(20 22 28 / .04), 0 24px 64px -16px rgb(20 22 28 / .22);
  --radius: 18px; --radius-sm: 12px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0b0c10; --bg-2: #111318; --surface: #15171d; --surface-2: #1b1e25;
    --ink: #eef0f4; --ink-2: #c5c9d2; --muted: #8a909c; --line: rgb(255 255 255 / .07); --line-2: rgb(255 255 255 / .13);
    --accent: #8b7dff; --accent-2: #b08cff; --accent-ink: #0b0c10; --accent-soft: rgb(139 125 255 / .14);
    --glow-1: rgb(124 104 255 / .2); --glow-2: rgb(45 170 175 / .12);
    --live: #3ddc84; --warn: #fb923c;
    --n0: #2b2750; --n1: #3c3478; --n2: #5446a6; --n3: #6e5ed4; --n4: #8d7ff0; --n5: #b3a8ff;
    --shadow: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px -8px rgb(0 0 0 / .5);
    --shadow-lg: 0 2px 4px rgb(0 0 0 / .3), 0 24px 64px -16px rgb(0 0 0 / .7);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0b0c10; --bg-2: #111318; --surface: #15171d; --surface-2: #1b1e25;
  --ink: #eef0f4; --ink-2: #c5c9d2; --muted: #8a909c; --line: rgb(255 255 255 / .07); --line-2: rgb(255 255 255 / .13);
  --accent: #8b7dff; --accent-2: #b08cff; --accent-ink: #0b0c10; --accent-soft: rgb(139 125 255 / .14);
  --glow-1: rgb(124 104 255 / .2); --glow-2: rgb(45 170 175 / .12);
  --live: #3ddc84; --warn: #fb923c;
  --n0: #2b2750; --n1: #3c3478; --n2: #5446a6; --n3: #6e5ed4; --n4: #8d7ff0; --n5: #b3a8ff;
  --shadow: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px -8px rgb(0 0 0 / .5);
  --shadow-lg: 0 2px 4px rgb(0 0 0 / .3), 0 24px 64px -16px rgb(0 0 0 / .7);
  color-scheme: dark;
}

* { box-sizing: border-box; }
/* .btn and friends set display, which would otherwise beat the hidden attribute */
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100dvh; color: var(--ink); background: var(--bg);
  font: 16px/1.5 Geist, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-feature-settings: "ss01", "cv11"; -webkit-font-smoothing: antialiased;
}
/* two soft light sources behind everything */
body::before {
  content: ""; position: fixed; inset: -20vmax; z-index: -1; pointer-events: none;
  background:
    radial-gradient(40vmax 40vmax at 15% 5%, var(--glow-1), transparent 60%),
    radial-gradient(38vmax 38vmax at 95% 25%, var(--glow-2), transparent 60%);
}
a { color: inherit; }
button, input, select { font: inherit; color: inherit; }
.mono { font-family: "Geist Mono", ui-monospace, Consolas, monospace; }
.num { font-variant-numeric: tabular-nums; }

.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 650; letter-spacing: -.01em; text-decoration: none; }
.brand-mark {
  width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; flex: none;
  background: linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow: 0 4px 14px -4px var(--accent);
}
.brand-mark svg { width: 16px; height: 16px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px;
  padding: 0 18px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface);
  font-weight: 560; font-size: 16px; cursor: pointer; text-decoration: none; white-space: nowrap;
  transition: transform .15s, background .15s, border-color .15s, box-shadow .15s;
}
.btn:hover { border-color: color-mix(in srgb, var(--ink) 25%, transparent); }
.btn:active { transform: scale(.97); }
.btn:focus-visible, .pill:focus-visible, select:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; border-color: transparent; box-shadow: 0 6px 20px -8px var(--accent); }
.btn.primary:hover { box-shadow: 0 10px 28px -10px var(--accent); }
.btn.ghost { background: transparent; border-color: transparent; }
.btn.ghost:hover { background: var(--surface-2); }
.btn.lg { min-height: 54px; padding: 0 28px; font-size: 16px; }
.btn[disabled] { opacity: .45; cursor: default; transform: none; box-shadow: none; }
.btn svg { width: 16px; height: 16px; }

.chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 14.5px; font-weight: 560; background: var(--surface-2); color: var(--ink-2); border: 1px solid var(--line); }
.chip.live { color: var(--live); background: color-mix(in srgb, var(--live) 12%, transparent); border-color: color-mix(in srgb, var(--live) 25%, transparent); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; position: relative; }
.chip.live .dot::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid currentColor; opacity: 0; animation: ring 1.8s ease-out infinite; }
@keyframes ring { 0% { transform: scale(.4); opacity: .8; } 100% { transform: scale(1.6); opacity: 0; } }

.card { background: color-mix(in srgb, var(--surface) 88%, transparent); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.eyebrow { font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}