/* auth (design from ai-gateway): shared tokens and components (docs + admin). Dark only.
   Palette after requesty.ai; Geist self-hosted (OFL, see fonts/OFL.txt). */

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

:root {
  color-scheme: dark;
  --night: #05070b;
  --surface: #0b0f17;
  --surface-hi: #10151f;
  --frame: #1c222d;
  --frame-hi: #2a3240;
  --cross: #4a5364;
  --label: #77808f;
  --body: #8b94a5;
  --text: #f3f5f8;
  --muted: #c4cad6;
  --blue: #00ffdf;
  --signal: #00ffdf;
  --ok: #34d399;
  --warn: #ffb347;
  --failed: #f2716b;
  /* chart series, validated for the dark surface */
  --series-in: #00a891;
  --series-out: #c47a35;

  --sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --radius: 4px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--night);
  color: var(--body);
  font: 15px/1.6 var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: rgba(0, 255, 223, .22); color: var(--text); }
a { color: var(--signal); text-decoration: none; }
a:hover { color: var(--text); }
h1, h2, h3, h4 { color: var(--text); margin: 0; font-weight: 400; letter-spacing: -0.02em; }
p { margin: 0 0 1em; }
code, kbd, pre, .mono { font-family: var(--mono); }
:focus-visible { outline: 1px solid var(--signal); outline-offset: 2px; }

/* "01 / section" labels */
.eyebrow {
  font: 400 12.5px/1 var(--mono);
  color: var(--label);
  letter-spacing: 0;
  text-transform: lowercase;
}
.eyebrow b { color: var(--signal); font-weight: 400; }

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

.tag {
  display: inline-flex; align-items: center; gap: 6px;
  font: 12px/1 var(--mono);
  color: var(--muted);
  border: 1px solid var(--frame-hi);
  border-radius: 3px;
  padding: 4px 7px;
  white-space: nowrap;
}
.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--cross); flex: none; }
.dot.ok { background: var(--ok); box-shadow: 0 0 0 3px rgba(52, 211, 153, .14); }
.dot.warn { background: var(--warn); }
.dot.failed { background: var(--failed); }
.dot.live { background: var(--ok); animation: pulse 1.6s var(--ease) infinite; }
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(52, 211, 153, .5); }
  100% { box-shadow: 0 0 0 7px rgba(52, 211, 153, 0); }
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 34px; padding: 0 14px;
  font: 500 13.5px/1 var(--sans);
  color: var(--night);
  background: var(--text);
  border: 1px solid var(--text);
  border-radius: var(--radius);
  cursor: pointer;
  transition: background .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease);
  white-space: nowrap;
}
.btn:hover { background: #fff; }
.btn.ghost { background: transparent; color: var(--text); border-color: var(--frame-hi); }
.btn.ghost:hover { border-color: var(--cross); background: var(--surface-hi); }
.btn.danger { background: transparent; color: var(--failed); border-color: rgba(242, 113, 107, .35); }
.btn.danger:hover { background: rgba(242, 113, 107, .08); }
.btn.small { height: 28px; padding: 0 10px; font-size: 12.5px; }
.btn:disabled { opacity: .45; cursor: default; }

input, select, textarea {
  font: 14px/1.4 var(--sans);
  color: var(--text);
  background: var(--night);
  border: 1px solid var(--frame-hi);
  border-radius: var(--radius);
  padding: 8px 10px;
  width: 100%;
  transition: border-color .15s var(--ease);
}
textarea { font-family: var(--mono); font-size: 13px; resize: vertical; min-height: 80px; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--signal); }
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--label) 50%), linear-gradient(135deg, var(--label) 50%, transparent 50%); background-position: calc(100% - 15px) 50%, calc(100% - 10px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 28px; }
label.field { display: grid; gap: 6px; }
label.field > span { font: 12.5px/1 var(--mono); color: var(--label); }

/* code */
pre.code {
  margin: 0;
  padding: 16px 18px;
  overflow-x: auto;
  font: 13px/1.65 var(--mono);
  color: var(--muted);
  background: var(--night);
  border: 1px solid var(--frame);
  border-radius: var(--radius);
  tab-size: 2;
}
.code .k { color: var(--signal); }      /* keyword / key */
.code .s { color: #a8d8b9; }            /* string */
.code .c { color: var(--cross); }       /* comment */
.code .n { color: #e8b787; }            /* number */
:not(pre) > code {
  font-size: .88em;
  color: var(--text);
  background: var(--surface-hi);
  border: 1px solid var(--frame);
  border-radius: 3px;
  padding: 1px 5px;
}

/* tables */
table.grid { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.grid th {
  text-align: left; font: 400 12px/1 var(--mono); color: var(--label);
  padding: 10px 12px; border-bottom: 1px solid var(--frame); white-space: nowrap;
}
table.grid td { padding: 10px 12px; border-bottom: 1px solid var(--frame); color: var(--muted); vertical-align: top; }
table.grid tr:last-child td { border-bottom: 0; }
table.grid td.num, table.grid th.num { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; }
table.grid td.mono { font-family: var(--mono); font-size: 12.5px; }

.scroll-x { overflow-x: auto; }
.muted { color: var(--label); }
.text { color: var(--text); }
.ok { color: var(--ok); }
.failed { color: var(--failed); }
.warn { color: var(--warn); }
.hidden { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
