/* /docs (app/apidocs.py): the API reference. Linked from that page only; tokens from parrot.css.
   Parameter, type and default cells never wrap; the tables use the page width with their header row sticky under the
   site nav, and on a phone each parameter row stacks (never a sideways scroll inside a box). */
.apidocs .i { flex: none; vertical-align: -2px; color: var(--teal); }
.apidocs h2 { display: flex; align-items: center; gap: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.apidocs h2 .i { vertical-align: 0; }
.apidocs .lede { color: var(--muted); margin-top: 0; }
.apidocs .jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
.apidocs .jump .chip { padding-left: 8px; }
.apidocs .op { margin: 0 0 28px; }
.apidocs h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px;
  scroll-margin-top: calc(var(--head-h) + 8px); }
.apidocs h2 { scroll-margin-top: calc(var(--head-h) + 8px); }
.apidocs h3 code { font-size: 15px; font-weight: 650; overflow-wrap: anywhere; }
.apidocs .verb { font: 700 11px/1 var(--font-mono); letter-spacing: .04em; padding: 4px 6px; border-radius: var(--r-sm);
  background: var(--b-teal-bg); color: var(--b-teal-fg); }

.apidocs table.params { width: 100%; border-collapse: separate; border-spacing: 0; margin: 10px 0 12px; font-size: 14px;
  border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.apidocs .params th, .apidocs .params td { padding: 8px 12px; border-bottom: 1px solid var(--line); text-align: left;
  vertical-align: top; }
.apidocs .params tbody tr:last-child > * { border-bottom: 0; }
.apidocs .params thead th { position: sticky; top: var(--head-h); z-index: 1; font-size: 12px; font-weight: 650;
  color: var(--muted); background: var(--surface-2); }
.apidocs .params thead th:first-child { border-top-left-radius: var(--r); }
.apidocs .params thead th:last-child { border-top-right-radius: var(--r); }
.apidocs .params .nw { white-space: nowrap; }
.apidocs .params .desc { width: 100%; color: var(--ink-2); }
.apidocs .params code { white-space: nowrap; }
.apidocs .flag { margin-left: 6px; font-size: 11.5px; font-weight: 600; color: var(--muted); }

.apidocs .try { margin: 8px 0 0; }
.apidocs .try-h { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 6px; }
.apidocs .try-h a { font-family: var(--font-mono); font-size: 13.5px; overflow-wrap: anywhere; }
.apidocs .try-h .meta { font-size: 12.5px; color: var(--muted); }
.apidocs samp.resp { display: block; margin: 0; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: var(--r); background: var(--surface); color: var(--ink-2); font: 12.5px/1.5 var(--font-mono);
  white-space: pre-wrap; overflow-wrap: anywhere; tab-size: 4; }

/* phones: a parameter row is a small block (name, type and default on one line, the description under it) */
@media (max-width: 720px) {
  .apidocs table.params, .apidocs .params tbody, .apidocs .params tr, .apidocs .params td { display: block; }
  .apidocs .params thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .apidocs .params tr { padding: 8px 12px; border-bottom: 1px solid var(--line); }
  .apidocs .params tbody tr:last-child { border-bottom: 0; }
  .apidocs .params td { display: inline; padding: 0; border: 0; }
  .apidocs .params td.nw + td.nw:not(:empty)::before { content: " · "; color: var(--muted); }
  .apidocs .params td.nw[data-h="Default"]:not(:empty)::before { content: " · default "; color: var(--muted); }
  .apidocs .params td.desc { display: block; margin-top: 2px; font-size: 13.5px; }
  .apidocs .params td.desc:empty { display: none; }
}

/* GET /mcp in a browser (app/mcp.py install_page): the install page */
.mcp-page .i { flex: none; color: var(--teal); }
.mcp-page h1, .mcp-page h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mcp-page h2 { font-size: 17px; margin: 22px 0 6px; }
.mcp-page .lede { color: var(--muted); }
.mcp-page .add { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 20px; }
.mcp-page .add .btn .i { color: inherit; }
.mcp-page .where { font-weight: 400; font-size: 13px; color: var(--muted); }
.mcp-page .clients { max-width: 860px; }
.mcp-page ul.tools { columns: 2 260px; column-gap: 24px; padding-left: 1.1em; }
.mcp-page ul.tools li { break-inside: avoid; }
/* phones: a long install line wraps instead of scrolling; Copy still copies it as is */
@media (max-width: 720px) {
  .mcp-page pre { white-space: pre-wrap; overflow-wrap: anywhere; }
}