/* THINKPOL API pages (docs, firehose, MCP), generated by src/build-api-pages.mjs on the site shell.
 * Same rules as tools.css: only tp- classes (plus the doc / firehose classes their JS relies on),
 * colours and spacing are the template's own custom properties, no radius, no animation. */

.tp-api { --tp-border: var(--core--colors--neutral--400, #e3e3e3); --tp-ink: var(--core--colors--neutral--800, #161616); --tp-text: var(--core--colors--neutral--600, #505050); --tp-muted: var(--core--colors--neutral--500, #ababab); --tp-bg: var(--core--colors--neutral--200, #fbfbfb); --tp-bg2: var(--core--colors--neutral--300, #f3f3f3); --tp-red: #d64562; --tp-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

/* hero: the site's page hero, with a shorter bottom so the tool / doc body sits close to it */
.tp-api.section.top { padding-bottom: var(--_spacers---main-spacers--large, 48px); }
.tp-api.section-small.pd-top-0 { padding-top: 0; }

/* sub-navigation between the three API pages */
.tp-api-nav { display: flex; flex-wrap: wrap; gap: var(--_spacers---main-spacers--4x-extra-small, 8px); }
.tp-api-nav .tp-chip { margin: 0; color: var(--tp-text); }
.tp-api-nav .tp-chip.is-current, .tp-api-nav .tp-chip:hover { border-color: var(--tp-ink); color: var(--tp-ink); }
.tp-api-actions { display: flex; flex-wrap: wrap; gap: var(--_spacers---main-spacers--3x-extra-small, 12px); }

/* docs layout: sticky contents + body */
.tp-api-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: var(--_spacers---main-spacers--large, 48px); align-items: start; }
.tp-api-toc { position: sticky; top: var(--_spacers---main-spacers--small, 24px); }
.tp-api-toc.tp-toc { padding: var(--_spacers---main-spacers--extra-small, 20px) var(--_spacers---main-spacers--small, 24px); margin: 0; }
.tp-api-toc .tp-toc-list { list-style: none; padding: 0; }
.tp-api-toc .tp-toc-list a { font-size: var(--_typography---font-size--paragraphs--small, .875rem); }
.tp-api-body { min-width: 0; }
.tp-api-body .rich-text > * + * { margin-top: var(--_spacers---main-spacers--2x-extra-small, 16px); }
.tp-api-body .rich-text .tp-kicker { margin-top: var(--_spacers---main-spacers--2x-extra-large, 64px); padding-top: var(--_spacers---main-spacers--regular, 32px); border-top: 1px solid var(--tp-border); }
.tp-api-body .rich-text .tp-kicker:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.tp-api-body .rich-text .tp-kicker + h2 { margin-top: var(--_spacers---main-spacers--4x-extra-small, 8px); }
.tp-api-body .rich-text h3 { font-size: var(--_typography---font-size--displays--display-5, 1.5rem); margin-top: var(--_spacers---main-spacers--medium, 40px); }
.tp-api .rich-text .tp-item h3, .tp-api .rich-text .tp-kv h3 { margin-top: 0; font-size: var(--_typography---font-size--displays--display-4, 1.25rem); }
.tp-api .rich-text .tp-kv > * + * { margin-top: var(--_spacers---main-spacers--3x-extra-small, 12px); }
.tp-api .rich-text .tp-kv p { font-size: var(--_typography---font-size--paragraphs--small, .875rem); }
.tp-api .rich-text .tp-item > * + * { margin-top: var(--_spacers---main-spacers--3x-extra-small, 12px); }
.tp-api .rich-text .tp-item pre { margin: 0; }
.tp-api-body .rich-text h3.tp-route { margin-top: var(--_spacers---main-spacers--medium, 40px); font-size: var(--_typography---font-size--displays--display-5, 1.5rem); display: flex; flex-wrap: wrap; align-items: center; gap: var(--_spacers---main-spacers--3x-extra-small, 12px); }
.tp-api-body .rich-text h3.tp-route code { font-family: var(--tp-mono); font-size: 0.8em; background: none; padding: 0; }
.tp-method { display: inline-block; background: var(--tp-ink); color: #fff; padding: 4px 10px; font-family: Inter, "Inter Tight", sans-serif; font-size: var(--_typography---font-size--displays--display-1, .875rem); line-height: var(--_typography---line-height--regular, 1.25em); letter-spacing: var(--_typography---letter-spacing--regular, -.03em); text-transform: uppercase; font-weight: 500; vertical-align: middle; }
.tp-method.tp-method-delete { background: var(--tp-red); }
.tp-api-body .rich-text .w-richtext-table { overflow-x: auto; }
.tp-api-body .rich-text table code { white-space: nowrap; }
.tp-api-body .rich-text p code, .tp-api-body .rich-text li code, .tp-api-body .rich-text td code { background: var(--tp-bg2); padding: 1px 5px; }

.tp-api .grid-2-columns > * { min-width: 0; }
.tp-api .rich-text pre { overflow-x: auto; }

/* key / value overview */
.tp-api .tp-kv .tp-label { margin-bottom: 4px; color: var(--tp-muted); }
.tp-api .tp-kv code { font-family: var(--tp-mono); font-size: var(--_typography---font-size--paragraphs--small, .875rem); color: var(--tp-ink); overflow-wrap: anywhere; background: none; padding: 0; }
.tp-api .tp-kv-grid { --tp-cols: 3; }

/* callouts */
.tp-callout { padding: var(--_spacers---main-spacers--extra-small, 20px) var(--_spacers---main-spacers--small, 24px); border-left: 3px solid var(--tp-ink); background: var(--tp-bg); }
.tp-callout > * + * { margin-top: var(--_spacers---main-spacers--4x-extra-small, 8px); }
.tp-callout strong { color: var(--tp-ink); }

/* code examples with language tabs (markup + inline script kept from the API server) */
.tp-example { margin-top: var(--_spacers---main-spacers--small, 24px); }
.tp-example .example-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--_spacers---main-spacers--2x-extra-small, 16px); padding: var(--_spacers---main-spacers--2x-extra-small, 16px) var(--_spacers---main-spacers--extra-small, 20px); border-bottom: 1px solid var(--tp-border); background: var(--tp-bg); }
.tp-example .example-title { display: grid; gap: 4px; min-width: 0; }
.tp-example .example-title strong { color: var(--tp-ink); font-weight: 500; }
.tp-example .example-title span { color: var(--tp-muted); font-size: var(--_typography---font-size--paragraphs--small, .875rem); }
.lang-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.lang-button { background: none; border: 1px solid var(--tp-border); color: var(--tp-text); padding: 6px 10px; font: inherit; font-size: var(--_typography---font-size--displays--display-1, .875rem); line-height: var(--_typography---line-height--regular, 1.25em); letter-spacing: var(--_typography---letter-spacing--regular, -.03em); text-transform: uppercase; font-weight: 500; cursor: pointer; }
.lang-button:hover { border-color: var(--tp-ink); color: var(--tp-ink); }
.lang-button.is-active { background: var(--tp-ink); border-color: var(--tp-ink); color: #fff; }
.tp-example .code-panel { padding: 0; }
.tp-example .code-panel[hidden] { display: none; }
.tp-example .code-wrap { position: relative; }
.tp-api .rich-text .tp-example pre, .tp-api .tp-example pre { margin: 0; border: 0; background: var(--tp-bg2); padding: var(--_spacers---main-spacers--extra-small, 20px); padding-right: 96px; font-size: .84rem; line-height: 1.6; tab-size: 2; color: var(--tp-ink); overflow-x: auto; }
.copy-button { position: absolute; top: 12px; right: 12px; background: #fff; border: 1px solid var(--tp-border); color: var(--tp-ink); padding: 5px 10px; font: inherit; font-size: .75rem; text-transform: uppercase; letter-spacing: -.02em; font-weight: 500; cursor: pointer; }
.copy-button:hover { border-color: var(--tp-ink); }

/* generic buttons used by the firehose app (mirror the template's .form-button) */
.tp-api .button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 20px; min-height: 48px; border: 1px solid var(--tp-ink); background: var(--tp-ink); color: #fff; font-family: Inter, "Inter Tight", sans-serif; font-size: var(--_typography---font-size--displays--display-1, .875rem); line-height: var(--_typography---line-height--regular, 1.25em); letter-spacing: var(--_typography---letter-spacing--regular, -.03em); text-transform: uppercase; font-weight: 500; text-decoration: none; cursor: pointer; transition: background-color .3s, color .3s, border-color .3s; }
.tp-api .button:hover { background: var(--core--colors--neutral--700, #292929); border-color: var(--core--colors--neutral--700, #292929); }
.tp-api .button--ghost { background: none; color: var(--tp-ink); border-color: var(--tp-border); }
.tp-api .button--ghost:hover { background: var(--tp-bg2); border-color: var(--tp-ink); }
.tp-api .button--danger { background: var(--tp-red); border-color: var(--tp-red); color: #fff; }
.tp-api .button--compact { min-height: 40px; padding: 8px 14px; }
.tp-api .button:disabled { opacity: .5; cursor: not-allowed; }
.field-action { background: none; border: 0; padding: 0; color: var(--tp-text); font: inherit; font-size: var(--_typography---font-size--paragraphs--small, .875rem); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.field-action:hover { color: var(--tp-ink); }

/* firehose: controls + workspace */
.tp-fh-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--_spacers---main-spacers--2x-extra-small, 16px); align-items: end; }
.tp-fh-workspace { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--_spacers---main-spacers--small, 24px); align-items: start; }
.tp-fh-panel { padding: var(--_spacers---main-spacers--small, 24px); }
.tp-fh-panel > * + * { margin-top: var(--_spacers---main-spacers--extra-small, 20px); }
.tp-fh-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--_spacers---main-spacers--2x-extra-small, 16px); }
.tp-fh-head > div > * + * { margin-top: 4px; }
.control-actions { display: flex; align-items: end; }
.field { display: grid; gap: 8px; }
.field__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.field > span:first-child, .field__head span, .field label span, .kind-filter > span { color: var(--tp-muted); font-size: var(--_typography---font-size--displays--display-1, .875rem); line-height: var(--_typography---line-height--regular, 1.25em); letter-spacing: var(--_typography---letter-spacing--regular, -.03em); text-transform: uppercase; font-weight: 500; }
.tp-api input.input, .tp-api textarea.input, .tp-api select.input { width: 100%; font: inherit; font-size: var(--_typography---font-size--paragraphs--default, 1rem); color: var(--tp-ink); }
.tp-api textarea.input { min-height: 120px; padding: 14px 20px; resize: vertical; line-height: 1.5; }
.tp-api .input:focus { outline: none; border-color: var(--tp-ink); }
.tp-api .input.is-invalid { border-color: var(--tp-red); }
.tp-api ::placeholder { color: var(--tp-muted); }
.field-note { min-height: 1.2em; font-size: var(--_typography---font-size--paragraphs--small, .875rem); color: var(--tp-text); }
.field-note.is-error { color: var(--tp-red); }
.field-note.is-ok { color: var(--tp-ink); }
.field-counter { font-size: var(--_typography---font-size--paragraphs--small, .875rem); color: var(--tp-muted); }
.hook-form { display: grid; gap: var(--_spacers---main-spacers--2x-extra-small, 16px); }

/* custom select (matcher type / field) */
.select-control { position: relative; }
.select-button { width: 100%; text-align: left; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 20px; min-height: 48px; border: 1px solid var(--tp-border); background: none; color: var(--tp-ink); font: inherit; cursor: pointer; }
.select-button::after { content: ""; width: 7px; height: 7px; border-right: 1.5px solid var(--tp-muted); border-bottom: 1.5px solid var(--tp-muted); transform: rotate(45deg) translateY(-2px); }
.select-button:hover, .select-button[aria-expanded="true"] { border-color: var(--tp-ink); }
.select-button[disabled] { opacity: .5; cursor: not-allowed; }
.select-menu { position: absolute; z-index: 20; top: calc(100% - 1px); left: 0; right: 0; display: grid; background: #fff; border: 1px solid var(--tp-ink); }
.select-menu[hidden] { display: none; }
.select-option { text-align: left; background: none; border: 0; padding: 12px 20px; font: inherit; color: var(--tp-text); cursor: pointer; }
.select-option:hover { background: var(--tp-bg2); color: var(--tp-ink); }
.select-option.is-selected { color: var(--tp-ink); font-weight: 500; }

/* segmented control */
.kind-filter { display: grid; gap: 8px; }
.kind-segmented { display: inline-flex; width: fit-content; border: 1px solid var(--tp-border); }
.kind-option { background: none; border: 0; border-right: 1px solid var(--tp-border); padding: 10px 16px; font: inherit; font-size: var(--_typography---font-size--displays--display-1, .875rem); text-transform: uppercase; letter-spacing: var(--_typography---letter-spacing--regular, -.03em); font-weight: 500; color: var(--tp-text); cursor: pointer; }
.kind-option:last-child { border-right: 0; }
.kind-option.is-active { background: var(--tp-ink); color: #fff; }

/* lists rendered by app.js */
.hooks-list, .events-list { display: flex; flex-direction: column; }
.hook-card, .event-card { border: 1px solid var(--tp-border); background: #fff; padding: var(--_spacers---main-spacers--2x-extra-small, 16px) var(--_spacers---main-spacers--extra-small, 20px); }
.hook-card + .hook-card, .event-card + .event-card { margin-top: -1px; }
.hook-card > * + *, .event-card > * + *, .event-card__body > * + * { margin-top: 8px; }
.hook-card__top, .event-card__timing-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.hook-card__rule, .event-card__rule { font-family: var(--tp-mono); font-size: var(--_typography---font-size--paragraphs--small, .875rem); color: var(--tp-ink); overflow-wrap: anywhere; }
.hook-card__meta, .event-card__meta, .event-card__time, .event-card__timing, .event-card__delay, .event-card__mini-label { font-size: var(--_typography---font-size--paragraphs--small, .875rem); color: var(--tp-muted); }
.event-card__time, .event-card__delay { font-family: var(--tp-mono); }
.event-card__title { color: var(--tp-ink); font-weight: 500; overflow-wrap: anywhere; }
.event-card__preview { color: var(--tp-text); overflow-wrap: anywhere; white-space: pre-line; }
.event-card__label, .event-card__kind, .hook-card__receiver { display: inline-block; border: 1px solid var(--tp-border); color: var(--tp-text); padding: 2px 8px; font-size: var(--_typography---font-size--displays--display-1, .875rem); line-height: var(--_typography---line-height--regular, 1.25em); letter-spacing: var(--_typography---letter-spacing--regular, -.03em); text-transform: uppercase; font-weight: 500; white-space: nowrap; }
.hook-card__receiver--ok { border-color: var(--tp-ink); color: var(--tp-ink); }
.hook-card__receiver--error { border-color: var(--tp-red); color: var(--tp-red); }
.empty-state { border: 1px dashed var(--tp-border); padding: var(--_spacers---main-spacers--small, 24px); color: var(--tp-muted); font-size: var(--_typography---font-size--paragraphs--small, .875rem); }

/* stream tools + stress panel */
.stream-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.stream-clock { font-family: var(--tp-mono); font-size: var(--_typography---font-size--paragraphs--small, .875rem); color: var(--tp-muted); }
.stream-state { display: inline-block; border: 1px solid var(--tp-border); color: var(--tp-text); padding: 2px 8px; font-size: var(--_typography---font-size--displays--display-1, .875rem); line-height: var(--_typography---line-height--regular, 1.25em); text-transform: uppercase; font-weight: 500; white-space: nowrap; }
.stream-state.is-ok { border-color: var(--tp-ink); color: var(--tp-ink); }
.stream-state.is-error { border-color: var(--tp-red); color: var(--tp-red); }
.stream-state.is-paused { color: var(--tp-muted); }
.stress-panel { border: 1px dashed var(--tp-border); padding: var(--_spacers---main-spacers--extra-small, 20px); background: var(--tp-bg); }
.stress-panel[hidden] { display: none; }
.stress-panel > * + * { margin-top: var(--_spacers---main-spacers--2x-extra-small, 16px); }
.stress-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; }
.field--compact .input { max-width: 160px; }

@media (max-width: 991px) {
  .tp-api-layout { grid-template-columns: 1fr; }
  .tp-api-toc { position: static; }
  .tp-fh-workspace { grid-template-columns: 1fr; }
  .tp-api .tp-kv-grid { --tp-cols: 2; }
}
@media (max-width: 767px) {
  .tp-fh-controls { grid-template-columns: 1fr; }
  .tp-api .tp-kv-grid { --tp-cols: 1; }
  .tp-example .example-head { flex-direction: column; }
}

/* Local page shell: preserve the exported design without its hosted runtime. */
html { scrollbar-gutter: stable; }
svg.logo-icon{height:auto;aspect-ratio:1/1;display:block;transform:none!important;-webkit-transform:none!important}.logo-ring{transform-origin:0 0;transform-box:view-box;-webkit-transform-origin:0 0;transition:transform .9s cubic-bezier(.22,.8,.2,1);-webkit-transition:-webkit-transform .9s cubic-bezier(.22,.8,.2,1)}a:hover .logo-ring,.logo-icon:hover .logo-ring{-webkit-transform:rotate(360deg)}a:hover .logo-ring,.logo-icon:hover .logo-ring{transform:rotate(360deg)}
.tp-logo-dark { color: #161616; }
.tp-logo-light { color: #fff; }
.tp-api [hidden] { display: none !important; }
.tp-api .tp-route code { overflow-wrap: anywhere; white-space: normal; min-width: 0; }
.tp-api .tp-item, .tp-api .tp-kv { min-width: 0; }
.tp-api .rich-text table { width: 100%; }
.tp-api .code-wrap { position: relative; }
.tp-api .code-wrap > pre { padding-right: 96px; }
@media (max-width: 991px) {
  .header-wrapper .nav-menu.is-open { display: block; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--core--colors--neutral--400); padding: 24px; }
}