:root {
    color-scheme: light dark;
    --bg: #fbfaf8; --fg: #1c1a17; --muted: #6b645b; --rule: #e4dfd7;
    --card: #fff; --accent: #8a4b23; --code-bg: #f3f0eb;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --bg: #16150f; --fg: #ece7de; --muted: #9b9287; --rule: #2f2c25;
      --card: #1e1c16; --accent: #d99a63; --code-bg: #221f19;
    }
  }
  * { box-sizing: border-box; }
  body {
    margin: 0; background: var(--bg); color: var(--fg);
    font: 16px/1.65 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
  }
  .wrap { max-width: 46rem; margin: 0 auto; padding: 4rem 1.5rem 6rem; }
  .brand { display: flex; align-items: center; gap: .75rem; }
  .brand img { width: 3.25rem; height: 3.25rem; margin-left: -.15rem; flex: none; }
  h1 { font-size: 3rem; margin: 0; letter-spacing: -0.03em; }
  h2 {
    font-size: 1.05rem; margin: 3rem 0 .85rem; letter-spacing: .06em;
    text-transform: uppercase; color: var(--muted); font-weight: 600;
  }
  .tagline { font-size: 1.3rem; color: var(--muted); margin: .4rem 0 0; }
  p { margin: 0 0 1rem; }
  a { color: var(--accent); }
  code, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
  code { background: var(--code-bg); padding: .12em .35em; border-radius: 4px; font-size: .9em; }
  pre {
    background: var(--code-bg); border: 1px solid var(--rule); border-radius: 8px;
    padding: 1rem; overflow-x: auto; font-size: .85rem; line-height: 1.55;
  }
  pre code { background: none; padding: 0; }
  .status {
    border-left: 3px solid var(--accent); background: var(--card);
    padding: .85rem 1.1rem; margin: 2rem 0; border-radius: 0 6px 6px 0;
  }
  .status strong { color: var(--accent); }
  table { border-collapse: collapse; width: 100%; font-size: .9rem; }
  th, td { text-align: left; padding: .6rem .5rem; border-bottom: 1px solid var(--rule); vertical-align: top; }
  th { color: var(--muted); font-weight: 600; }
  td code { font-size: .85em; word-break: break-all; }
  .scroll { overflow-x: auto; }
  footer { margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid var(--rule); color: var(--muted); font-size: .875rem; }
  .cmt { color: var(--muted); }
