/* Inflect redesign — shared tokens */

:root {
  /* Direction 1: Terminal (cool) */
  --ink-1: oklch(0.18 0.01 240);
  --ink-2: oklch(0.32 0.01 240);
  --ink-3: oklch(0.52 0.008 240);
  --ink-4: oklch(0.72 0.006 240);
  --line: oklch(0.90 0.006 240);
  --line-2: oklch(0.94 0.004 240);
  --paper: oklch(0.985 0.003 95);
  --paper-2: oklch(0.97 0.004 95);
  --paper-3: oklch(0.95 0.005 95);
  --accent: oklch(0.58 0.12 220);     /* teal-blue */
  --accent-soft: oklch(0.94 0.03 220);
  --good: oklch(0.62 0.11 160);
  --bad:  oklch(0.60 0.14 25);

  --font-sans: "Inter Tight", "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --font-serif: "Instrument Serif", "Times New Roman", Georgia, serif;

  --radius-s: 4px;
  --radius-m: 8px;
  --radius-l: 14px;

  --shadow-soft: 0 1px 0 oklch(0.95 0.005 240), 0 10px 30px -20px oklch(0.2 0.02 240 / 0.25);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-sans);
  color: var(--ink-1);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
}

.mono { font-family: var(--font-mono); }
.serif { font-family: var(--font-serif); }

a { color: inherit; }
button { font-family: inherit; }

.hairline { border-top: 1px solid var(--line); }
.hairline-b { border-bottom: 1px solid var(--line); }

/* Label — small uppercase mono tag */
.label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-3);
}

/* Wordmark */
.wordmark {
  font-family: var(--font-sans);
  font-weight: 600;
  letter-spacing: -0.02em;
  font-size: 18px;
}
.wordmark::before {
  content: "";
  display: inline-block;
  width: 10px; height: 10px;
  background: var(--ink-1);
  margin-right: 8px;
  transform: translateY(1px) rotate(45deg);
}