/* ============================================================
   Seek & Find — design tokens (v2: Polymarket-style light theme)
   White, simple, percentage-forward. Signal colors still carry
   real meaning (never decorative), locking a prediction still
   reads as a deliberate, irreversible act — just quieter now.
   ============================================================ */

:root {
  /* Surfaces */
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-raised: #F7F8FA;
  --border: #E5E7EB;
  --border-strong: #D1D5DB;

  /* Text */
  --text: #111827;
  --text-dim: #6B7280;
  --text-faint: #9CA3AF;

  /* Signal colors — meaning, not decoration */
  --verified: #1D4ED8;
  --verified-dim: #EFF4FF;
  --correct: #16A34A;
  --correct-dim: #F0FDF4;
  --incorrect: #DC2626;
  --incorrect-dim: #FEF2F2;
  --pending: #D97706;
  --pending-dim: #FFFBEB;

  /* Type */
  --font-display: 'Space Grotesk', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  --radius: 8px;
}

* { box-sizing: border-box; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  margin: 0;
}

.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
}

.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.badge--correct { background: var(--correct-dim); color: var(--correct); }
.badge--incorrect { background: var(--incorrect-dim); color: var(--incorrect); }
.badge--pending { background: var(--pending-dim); color: var(--pending); }
.badge--verified { background: var(--verified-dim); color: var(--verified); }