:root {
  --bg:#09090b; --ink:#fafafa; --muted:#a1a1aa; --line:#27272a;
  --card:#09090b; --good:#a1a1aa; --bad:#a1a1aa; --mid:#a1a1aa;
}
* { box-sizing:border-box; }
body {
  margin:0; color:var(--ink); background:var(--bg);
  font:15px/1.6 ui-sans-serif, "Segoe UI", "PingFang SC", "Noto Sans SC", sans-serif;
}
a { color:var(--ink); text-underline-offset:3px; }
a:hover { text-decoration:underline; }
.top {
  display:flex; gap:20px; align-items:center; padding:0 24px; height:56px;
  position:sticky; top:0; z-index:2; background:var(--bg); border-bottom:1px solid var(--line);
}
.brand { color:var(--ink); text-decoration:none; font-weight:650; }
nav { display:flex; gap:4px; }
nav a { color:var(--muted); text-decoration:none; padding:6px 10px; border-radius:6px; }
nav a.on, nav a:hover { color:var(--ink); background:#18181b; text-decoration:none; }
.search { margin-left:auto; }
.search input, .toolbar input, .toolbar select {
  font:inherit; color:var(--ink); background:#09090b; border:1px solid var(--line);
  border-radius:6px; padding:7px 10px;
}
.search input { width:260px; }
main { width:min(1100px, calc(100% - 32px)); margin:32px auto 64px; }
h1 { font-size:32px; line-height:1.2; margin:0 0 8px; font-weight:650; letter-spacing:-.02em; }
h2 { margin:32px 0 12px; font-size:18px; font-weight:650; }
.kicker, .hero p, .lead, p { color:var(--muted); }
.kicker { font-size:13px; margin:0 0 8px; }
p code, p strong, td code { color:var(--ink); }
.stats { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin:24px 0; }
.stats div, .card, .doc, table { background:var(--card); border:1px solid var(--line); border-radius:8px; }
.stats div { padding:16px; }
.stats b { display:block; font-size:24px; color:var(--ink); font-weight:650; }
.stats span, .card span, .card em { color:var(--muted); font-style:normal; }
.toolbar { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 12px; }
.toolbar label { color:var(--muted); font-size:13px; display:flex; gap:8px; align-items:center; }
.grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px; }
.card { display:flex; flex-direction:column; gap:8px; padding:16px; text-decoration:none; color:var(--ink); }
.card:hover { background:#18181b; text-decoration:none; }
.card strong { font-weight:650; }
.badge, .chip, .chip.good, .chip.mid, .chip.bad {
  font-size:12px; color:var(--muted); border:1px solid var(--line); border-radius:999px;
  padding:1px 8px; background:transparent;
}
.badge { align-self:flex-start; }
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chip.bad { color:var(--muted); }
pre, code { font-family:ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size:13px; }
pre, .doc pre { background:#18181b; color:var(--ink); padding:14px; overflow:auto; border:1px solid var(--line); border-radius:8px; }
.doc { padding:8px 20px 20px; }
.doc a.out::after { content:" ↗"; }
table { width:100%; border-collapse:collapse; }
td, th { text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; color:var(--ink); }
th { color:var(--muted); font-weight:500; }
.files { padding-left:18px; }
.lang { display:inline-flex; border:1px solid var(--line); border-radius:6px; overflow:hidden; margin-left:auto; }
.lang button {
  font:inherit; color:var(--muted); background:transparent; border:0; padding:6px 10px; cursor:pointer;
}
.lang button.on { color:var(--ink); background:#18181b; }
.sections { display:flex; flex-wrap:wrap; gap:4px; margin:16px 0; }
.sections a { color:var(--muted); text-decoration:none; padding:6px 10px; border-radius:6px; }
.sections a:hover { color:var(--ink); background:#18181b; text-decoration:none; }
.docs-filter { width:min(420px, 100%); margin:0 0 8px; font:inherit; color:var(--ink); background:#09090b; border:1px solid var(--line); border-radius:6px; padding:7px 10px; }
.doclist { display:flex; flex-direction:column; }
.docrow { display:flex; flex-direction:column; gap:2px; padding:14px 8px; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); }
.docrow:hover { background:#18181b; text-decoration:none; }
.docrow strong { font-weight:650; letter-spacing:-.01em; }
.doc-summary, .doc-meta, .doc-path, .doc-note { color:var(--muted); }
.doc-summary { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.doc-meta, .doc-path { font-size:12px; }
.doc-note:empty, .doc-summary:empty { display:none; }
.dochead { display:flex; justify-content:space-between; gap:16px; align-items:baseline; }
.doc-alt a { color:var(--ink); }
.doc { max-width:68ch; }
#results a { display:block; padding:12px 0; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); }
#results span { color:var(--muted); }
footer { width:min(1100px, calc(100% - 32px)); margin:0 auto 40px; color:var(--muted); font-size:13px; }
@media (max-width:720px) {
  .top { flex-wrap:wrap; height:auto; padding:12px 16px; }
  .search, .search input, .lang { width:100%; margin-left:0; }
  .lang button { flex:1; }
  .stats { grid-template-columns:1fr; }
  h1 { font-size:28px; }
  .dochead { flex-direction:column; align-items:flex-start; gap:4px; }
}