/* FeedKit docs (/kit/*.html), written by tools/build_docs.py. Same tokens and three themes (light, dim, dark) as the site
   (web/src/styles.css): /theme-init.js sets data-theme from the saved choice, otherwise the OS setting decides.
   Status badges and tables follow the monitor spec: colour + icon + label, sticky header, mono tabular numbers. System fonts only. */
:root{
  --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --bg:#f6f7f9;--surface:#fff;--surface-2:#f0f3f7;--surface-3:#e8edf3;--ink:#0c1424;--ink-2:#2c3a4f;--muted:#566479;--line:#dfe5ec;--line-2:#7a8799;
  --brand:#1f4fd1;--brand-soft:#e7eeff;--on-brand:#fff;
  --fresh:#15803d;--stale:#b45309;--rev:#b91c1c;
  --fresh-bg:#ecfdf3;--stale-bg:#fff7e8;--rev-bg:#fef0f0;
  --warn-bg:#fff7e8;--warn-line:#f0c27b;
  --hero-a:#f8fbff;--hero-b:#e8f0ff;--hero-c:#d8ebf6;
  --code-bg:#0d1526;--code-ink:#dbe4f3;
  --shadow:0 1px 2px rgba(12,20,36,.06),0 12px 28px -18px rgba(12,20,36,.28);
  color-scheme:light
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#0a0f1a;--surface:#0f1626;--surface-2:#141d30;--surface-3:#1a2540;--ink:#e7ecf4;--ink-2:#c3cddc;--muted:#97a5ba;--line:#1f2a40;--line-2:#62718f;
  --brand:#7ea4ff;--brand-soft:#16234a;--on-brand:#0a0f1a;
  --fresh:#4ade80;--stale:#fbbf24;--rev:#f87171;--fresh-bg:#0f2a1f;--stale-bg:#2a2112;--rev-bg:#2c1518;
  --warn-bg:#2a2112;--warn-line:#7a5a20;--hero-a:#03060e;--hero-b:#0c1b45;--hero-c:#122b63;--code-bg:#070b14;
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 14px 30px -18px rgba(0,0,0,.9);color-scheme:dark}}
[data-theme=dark]{
  --bg:#0a0f1a;--surface:#0f1626;--surface-2:#141d30;--surface-3:#1a2540;--ink:#e7ecf4;--ink-2:#c3cddc;--muted:#97a5ba;--line:#1f2a40;--line-2:#62718f;
  --brand:#7ea4ff;--brand-soft:#16234a;--on-brand:#0a0f1a;
  --fresh:#4ade80;--stale:#fbbf24;--rev:#f87171;--fresh-bg:#0f2a1f;--stale-bg:#2a2112;--rev-bg:#2c1518;
  --warn-bg:#2a2112;--warn-line:#7a5a20;--hero-a:#03060e;--hero-b:#0c1b45;--hero-c:#122b63;--code-bg:#070b14;
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 14px 30px -18px rgba(0,0,0,.9);color-scheme:dark}
:root[data-theme=dim]{
  --bg:#222a3c;--surface:#2a3449;--surface-2:#303b52;--surface-3:#38445c;--ink:#e1e6ee;--ink-2:#c2cad8;--muted:#aab5c8;--line:#3c4864;--line-2:#8692ae;
  --brand:#92b1ff;--brand-soft:#33446f;--on-brand:#151b29;
  --fresh:#6fe39a;--stale:#fcc95e;--rev:#ff9b9b;--fresh-bg:#25433f;--stale-bg:#433d33;--rev-bg:#46333f;
  --warn-bg:#3d3a33;--warn-line:#8a6d33;--hero-a:#171d2c;--hero-b:#212f55;--hero-c:#283b69;--code-bg:#161c2a;
  --shadow:0 1px 2px rgba(6,10,20,.28),0 10px 26px -18px rgba(6,10,20,.7);color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.6 var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-underline-offset:2px}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
h1,h2,h3{color:var(--ink);letter-spacing:-.015em;line-height:1.2}
h1{font-size:clamp(1.7rem,1.2rem + 2vw,2.6rem);letter-spacing:-.03em;margin:.15em 0 .35em}
h2{font-size:1.3rem;margin:2.2rem 0 .5rem}h3{font-size:1.05rem;margin:1.6rem 0 .4rem}
p,ul,ol{margin:.6em 0;max-width:76ch}li{margin:.2em 0}
code{font-family:var(--mono);font-size:.86em;background:var(--surface-2);border:1px solid var(--line);border-radius:5px;padding:.05em .35em;overflow-wrap:anywhere}
pre{background:var(--code-bg);color:var(--code-ink);padding:14px 16px;border-radius:10px;overflow-x:auto;font:13px/1.55 var(--mono);max-width:100%}
pre code{background:none;border:0;padding:0;color:inherit;font-size:inherit;overflow-wrap:normal}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:9;background:var(--brand);color:var(--on-brand);padding:8px 12px;border-radius:8px}.skip:focus{top:10px}
.w{max-width:1200px;margin:0 auto;padding:0 20px}.w.wide{max-width:1400px}

/* site header and footer */
/* Site menu (G15): the site-wide list above the FeedKit header; >=44px targets, wraps on phones */
.site-menu{background:var(--surface-2);border-bottom:1px solid var(--line)}
.site-menu ul{display:flex;flex-wrap:wrap;gap:0 4px;list-style:none;margin:0;padding:0;max-width:none}.site-menu li{margin:0}
.site-menu a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;color:var(--ink-2);text-decoration:none;font-size:.92rem}
.site-menu a:hover{color:var(--ink);text-decoration:underline}.site-menu a[aria-current]{color:var(--ink);font-weight:600}
@media (max-width:400px){.site-menu ul{flex-wrap:nowrap;overflow-x:auto;gap:0}.site-menu a{padding:0 7px;white-space:nowrap}}
.kh{background:var(--surface);border-bottom:1px solid var(--line)}
.kh .w{display:flex;align-items:center;gap:8px 20px;min-height:60px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:700;font-size:1.05rem;text-decoration:none;letter-spacing:-.01em}
.brand img{display:block}.brand span{color:var(--muted);font-weight:600}
.kn{display:flex;gap:2px;margin-left:auto;overflow-x:auto;max-width:100%}
.kn a{padding:8px 11px;border-radius:8px;color:var(--ink-2);text-decoration:none;font-size:.92rem;white-space:nowrap}
.kn a:hover{background:var(--surface-2);color:var(--ink)}
.kn a[aria-current=page]{background:var(--brand-soft);color:var(--ink);font-weight:600}
.kf{margin-top:56px;border-top:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:.88rem;padding:24px 0 32px}
.kf nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:10px}.kf a{color:var(--ink-2)}
.kf p{margin:.3em 0;max-width:none}

/* hero band (light in light; deep in dim and dark, as on the site) */
.hero{background:radial-gradient(60% 120% at 85% 0%,color-mix(in srgb,var(--brand) 16%,transparent),transparent 70%),linear-gradient(160deg,var(--hero-a),var(--hero-b) 60%,var(--hero-c));border-bottom:1px solid var(--line);padding:36px 0 30px}
.eyebrow{font:600 .78rem/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin:0}
.lead{font-size:1.05rem;color:var(--ink-2)}
.warn{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:10px;padding:.6rem .9rem;max-width:none;font-size:.92rem}
main{display:block;padding-top:8px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:9px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);text-decoration:none;font-weight:600;font-size:.92rem}
.btn:hover{background:var(--surface-2)}.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}

/* summary tiles */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0 0;padding:0;list-style:none;max-width:none}
.kpis li{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow)}
.kpis b{display:block;font:700 1.6rem/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.kpis span{font-size:.86rem;color:var(--ink-2)}
.stamp{font-size:.9rem;color:var(--ink-2);max-width:none}

/* status badge: colour + icon + label (monitor spec section 3) */
.st{display:inline-flex;align-items:center;gap:5px;padding:1px 8px 1px 6px;border-radius:999px;border:1px solid;font:600 .8rem/1.6 var(--font);white-space:nowrap}
.st svg{flex:none;width:14px;height:14px}
.st-fresh{color:var(--fresh);background:var(--fresh-bg)}
.st-stale{color:var(--stale);background:var(--stale-bg)}
.st-reverting{color:var(--rev);background:var(--rev-bg)}

/* data tables (monitor spec section 4): labelled focusable scroll region, sticky header and first column */
.tw{position:relative;overflow:auto;max-height:min(78vh,60rem);border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--shadow);margin:12px 0 8px}
.tw:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.t{border-collapse:separate;border-spacing:0;width:100%;font-size:.88rem}
.t caption{text-align:left;padding:10px 14px;color:var(--ink-2);font-size:.86rem;caption-side:top}
.t th,.t td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.t thead th{position:sticky;top:0;z-index:2;background:var(--surface-2);color:var(--ink-2);font-size:.74rem;font-weight:650;text-transform:uppercase;letter-spacing:.04em;line-height:1.3;border-bottom:1px solid var(--line-2);vertical-align:bottom}
.t tbody th{position:sticky;left:0;z-index:1;background:var(--surface);font-weight:650;white-space:nowrap;border-right:1px solid var(--line)}
.t thead th:first-child{left:0;z-index:3;border-right:1px solid var(--line)}
.t tbody tr:hover>*{background:var(--surface-2)}
.t tbody tr:last-child>*{border-bottom:0}
.t .num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.t .num small{display:block;color:var(--muted);font-size:.78rem}
.t .mono{font-family:var(--mono);font-size:.8rem;white-space:nowrap}
.t .na{color:var(--muted)}
.t .notes{min-width:14rem;color:var(--ink-2);font-size:.84rem}
.t .notes span{display:block}
.t code{background:none;border:0;padding:0;font-size:.8rem;overflow-wrap:normal}
.dm{color:var(--stale);font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-size:.86rem;color:var(--ink-2);margin:6px 0;max-width:none}

@media (max-width:760px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kn{margin-left:0;width:100%}
  .hero{padding:24px 0 22px}
  .t{font-size:.84rem}.t th,.t td{padding:8px 10px}
}
@media print{.kh,.kf,.skip{display:none}.tw{max-height:none;overflow:visible;box-shadow:none}}
