/* Knowledge for agents. Page-only rules, tokens only, .pg-lp- prefix (shared by the Nov 2026 long-tail pages). */

/* The hero example: a question in ink, then the answer card on paper. */
.pg-lp-q { margin: 0; font-size: var(--fs-ui); font-weight: var(--fw-semibold); line-height: var(--lh-snug); color: var(--fg-1); }

/* Paper rows on a panel: a label in ink, a detail under it. */
.pg-lp-rows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-1); }
.pg-lp-rows li { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border-radius: var(--r-control); background: var(--paper); }
.pg-lp-rows b { font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--fg-1); }
.pg-lp-rows span { font-size: var(--fs-micro); color: var(--fg-2); overflow-wrap: anywhere; }

/* Four steps, where flat.css lays out five; its 800px rule still stacks them. */
@media (min-width: 801px) { .pg-lp-steps { grid-template-columns: repeat(4, 1fr); } }

/* Feature table: icon tile beside the name, the detail in the second column. */
.pg-lp-table tbody th { width: 280px; }
.pg-lp-label { display: flex; align-items: center; gap: var(--sp-3); }
.pg-lp-table tbody th, .pg-lp-table td { vertical-align: middle; }
@media (max-width: 700px) { .pg-lp-table tbody th { width: auto; } }

/* Long chips wrap instead of pushing a panel wider than a phone. */
.tint .chip, .answer__cites .chip { white-space: normal; line-height: 1.35; }