:root { --bg: #f4f5f7; --panel: #ffffff; --ink: #1d2330; --muted: #5d6675; --line: #dde1e7; --accent: #2563eb; --code: #f7f8fa; }
  @media (prefers-color-scheme: dark) {
    :root { --bg: #11151c; --panel: #1a2029; --ink: #e6e9ee; --muted: #9aa4b2; --line: #2b3340; --accent: #4c8dff; --code: #141920; }
  }
  * { box-sizing: border-box; }
  body { margin: 0; background: var(--bg); color: var(--ink); font: 15px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
  header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 20px; padding: 12px 16px;
           background: var(--panel); border-bottom: 1px solid var(--line); }
  h1 { font-size: 17px; margin: 0; font-weight: 650; }
  header a { color: var(--accent); text-decoration: none; }
  header small { color: var(--muted); }
  main { max-width: 1540px; margin: 0 auto; padding: 12px 16px 24px; display: grid; gap: 12px;
         grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); }
  section { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; }
  section.wide { grid-column: 1 / -1; }
  h2 { font-size: 14px; margin: 0; padding: 8px 12px; border-bottom: 1px solid var(--line); font-weight: 650; }
  h2 span { color: var(--muted); font-weight: 400; }
  pre { margin: 0; padding: 8px 12px; background: var(--code); font: 12.5px/1.45 ui-monospace, "Cascadia Mono", Consolas, monospace;
        white-space: pre-wrap; word-break: break-word; max-height: 460px; overflow: auto; flex: 1; }
  section.wide pre { max-height: none; }
  .err { color: #d03030; }
  .ok { color: #1f8a4c; }