/* Design tokens + base reset. GitHub-Primer light theme (ported from the Okren
   project's look) — fixed light, no dark variant. Self-hosted Inter variable font
   (no CDN, no build step): works offline. */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
  src: url("/assets/fonts/InterVariable.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100 900;
  font-display: block;
  src: url("/assets/fonts/InterVariable-Italic.woff2") format("woff2");
}

:root {
  --color-bg: #ffffff;
  --color-canvas: #f6f8fa;
  --color-fg: #1f2328;
  --color-fg-muted: #59636e;
  --color-border: #d1d9e0;
  --color-border-muted: #d1d9e0b3;
  --color-accent: #fd8c73; /* coral — active-tab underline, brand accents */
  --color-focus: #0969da;
  --color-success: #1a7f37;
  --color-danger: #cf222e;
  --color-warn: #9a6700;
  --color-warn-dot: #d4a72c;
  --color-merged: #8250df;
  --color-neutral: #818b98; /* muted fills (badges, hovers) */

  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --app-max: 1536px;
  --page-padding: 24px;
  --r-sm: 6px;
  --r-md: 8px;
  --shadow-md: 0 8px 24px rgba(140, 149, 159, 0.2);
}

* { box-sizing: border-box; }
html, body { height: 100%; }

/* The `hidden` attribute must win over component display rules (flex/inline-flex),
   which would otherwise override the UA's low-specificity [hidden]{display:none}. */
[hidden] { display: none !important; }

/* Always reserve the scrollbar gutter so content never shifts horizontally when a
   page grows tall enough to need a vertical scrollbar (or stops needing one). */
html { scrollbar-gutter: stable; }

body {
  margin: 0;
  font: 14px/1.5 var(--font-ui);
  font-optical-sizing: auto;
  color: var(--color-fg);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

input, button, select, textarea { font: inherit; }

/* Lists are used as layout containers throughout — drop the UA bullet + indent. */
ul { margin: 0; padding: 0; list-style: none; }

:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -1px; }

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

/* Inline SVG icon sizing */
.ico { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; flex: none; }
.ico svg { width: 16px; height: 16px; display: block; }