/* A5 CRM — ai.css (screen «ИИ-пилот», #/ai). Owned by screens/ai.js. DESIGN-STRIPE.md §6.9, every colour a token of base.css.
   Fast model vs the check model (names from the pilot file: Luna / Luna Pro now): toolbar, notes (mock / progress /
   stopped = banners), the KPI hairline strip, the chat table (a Stripe list), the chat drawer and the state cards (page
   empty states). Every class is prefixed aip- (the top-bar «ИИ-помощник» owns .ai and .ai-*); .h / .s = the fast-model /
   check-model line or cell. Disagreement = ONE red mark per row: the 6 px --dot-red in the neutral «Расхождений» count
   (DESIGN-CALM.md §1.6 / §3.7 status mark); the disagreeing pair itself reads by weight (both answers --text-strong 600)
   with neutral model and signal tags (no red rule, no red answer text, no red tags); in the drawer the one red mark per
   card is its pastel «Расхождение» badge. Never a filled cell. Selected = --row-selected row / --tab-ink underline on a KPI
   cell; ✓ / ✗ (.aip-mk) = an answer against the owner's truth. Mono (Source Code Pro) only for model tags and model ids. */

.aip{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;min-width:0;background:var(--bg);color:var(--text)}

/* ── toolbar (§6.9: segmented, question filter pill, search 240, count) ── */
/* the 16 px band under the filter row lives here (not in the scroller), so the stuck table header keeps it too */
.aip-tb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0;padding:0 var(--gutter-x) 16px}
.aip-tb .aip-r{margin-left:auto;display:flex;align-items:center;gap:8px}
.aip-cnt{font:var(--t-body);color:var(--text-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.aip-cnt b{font-weight:600;color:var(--text-strong)}
.aip-sk-b{height:var(--control-h)}

/* refresh: a 28×28 secondary icon button (lives in #page-actions) */
.btn.aip-ib{width:28px;padding:0}
.btn.aip-ib .ic{width:16px;height:16px;stroke-width:2}
.aip-ib.spin .ic,.aip-card .btn.spin .ic{animation:ui-spin 600ms var(--ease-move)}

/* Все / Только расхождения = segmented control (§5.9) */
.aip-ord{display:inline-flex;gap:8px}
.aip-ord button{height:var(--control-h);padding:0 8px;display:inline-flex;align-items:center;gap:6px;border-radius:var(--radius-s);
  background:var(--btn-bg);font:var(--t-body-strong);color:var(--text-2);white-space:nowrap;
  box-shadow:var(--shadow-control),0 0 0 1px var(--border);transition:box-shadow var(--dur-1),color var(--dur-1),background var(--dur-1)}
.aip-ord button:hover{box-shadow:var(--shadow-control),0 0 0 1px var(--border-strong);color:var(--text-strong)}
/* selected = a pressed grey button, no ring (DESIGN-CALM §3.3 «seg selected») */
.aip-ord button.on{background:var(--surface-pressed);color:var(--text-strong);box-shadow:0 0 0 1px var(--border)}
.aip-ord button.on:hover{box-shadow:0 0 0 1px var(--border-strong)}
.aip-ord button:focus-visible,.aip-ord button.on:focus-visible{box-shadow:var(--shadow-control),var(--focus-ring)}
.aip-ord .n{font-weight:400;color:var(--text-3);font-variant-numeric:tabular-nums}

/* question filter = filter pill (§5.11): dashed idle, solid with the value in --text-strong when set (DESIGN-CALM §4 G1 .fpill .v) */
.btn.aip-qf{height:24px;padding:0 8px 0 6px;gap:6px;border:1px dashed var(--border);border-radius:var(--radius-pill);background:transparent;box-shadow:none;
  font:var(--t-caption-strong);color:var(--text-2)}
.btn.aip-qf .ic{width:12px;height:12px;stroke-width:2.4;color:var(--icon)}
.btn.aip-qf:hover,.btn.aip-qf[aria-expanded="true"]{border-style:solid;background:var(--surface-hover);box-shadow:none}
.btn.aip-qf.on{border-style:solid;background:var(--surface);box-shadow:none}
.btn.aip-qf.on:hover,.btn.aip-qf.on[aria-expanded="true"]{background:var(--surface-hover)}
.btn.aip-qf:focus-visible{border-style:solid;border-color:var(--focus-color);box-shadow:none}   /* the 1 px accent keyline in place of the dashed grey one (DESIGN-CALM §3.9), not a second line outside it */
.aip-qf .v{max-width:160px;overflow:hidden;text-overflow:ellipsis}
.aip-qf.on .v{color:var(--text-strong)}
/* set state (§5.11): «Вопрос | Этап ⌄» — the label and the 1×12 separator show only on a set pill; idle reads «Все вопросы» */
.aip-qf .sep{flex:none;width:1px;height:12px;background:var(--border)}
.aip-qf:not(.on) :is(.l,.sep){display:none}
/* chevron only on a set pill, 8 px as in Stripe's «Status | Cancelled ⌄» (pay-status-filter.jpg); an idle pill has none */
.btn.aip-qf > .ic:last-child{width:8px;height:8px;stroke-width:3.2}
.btn.aip-qf:not(.on) > .ic:last-child{display:none}

/* search (§5.5): the wrapper carries the keyline (components.css rule 2) */
.aip-search{display:flex;align-items:center;gap:8px;width:240px;height:var(--control-h);padding:0 4px 0 8px;cursor:text}
.aip-search > .ic{width:12px;height:12px;stroke-width:2.4;color:var(--text-3)}
.aip-search input{padding:0}
.aip-search input::-webkit-search-cancel-button{display:none}
.aip-x{width:16px;height:16px;flex:none;display:grid;place-items:center;border-radius:50%;color:var(--icon);opacity:0;pointer-events:none;transition:opacity var(--dur-2),background var(--dur-1)}
.aip-x .ic{width:12px;height:12px;stroke-width:2.4}
.aip-search.has .aip-x{opacity:1;pointer-events:auto}
.aip-x:hover{background:var(--surface-hover);color:var(--icon-strong)}

/* ── scroll area ── */
.aip-scroll{min-height:0;overflow:auto;padding:0 var(--gutter-x) 48px;display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:max-content;gap:24px;align-content:start}
.aip-notes{display:grid;gap:8px}

/* mock banner = caution banner (§5.14) */
.aip-mock{display:flex;align-items:flex-start;gap:8px;padding:12px 16px;border:1px solid var(--banner-caution-border);border-radius:var(--radius-s);
  background:var(--banner-caution-bg);font:var(--t-body);color:var(--badge-warning-text)}
.aip-mock > .ic{width:16px;height:16px;margin-top:2px;flex:none;color:currentColor}
.aip-mock .tt{display:grid;min-width:0}
.aip-mock .tt b{font-weight:600;color:inherit}
.aip-mock .btn{margin-left:auto;flex:none;align-self:center}

/* progress (running pilot): a default banner with the working pill (DESIGN-CALM §3.13) and a 4 px neutral meter */
.aip-prog{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 16px;border:1px solid var(--border);border-radius:var(--radius-s);
  background:var(--surface);font:var(--t-body);color:var(--text);white-space:nowrap}
/* a short working pill «Обработка» (grey pressed fill, grey 12 px spinner), then the plain sentence (DESIGN-CALM §3.13) */
.aip-pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:var(--radius-pill);flex:none;
  background:var(--surface-pressed);color:var(--text-strong);box-shadow:none;font:600 12px/16px var(--font-sans)}
.aip-pill::after{content:"";width:12px;height:12px;flex:none;box-sizing:border-box;border:2px solid var(--border-strong);border-top-color:var(--text-2);border-radius:50%;animation:ui-spin .8s linear infinite}
.aip-pt{flex:none;font:var(--t-body);color:var(--text)}
.aip-prog .aip-pt b{font-weight:600;font-variant-numeric:tabular-nums}
.aip-prog .trk{position:relative;flex:1;min-width:80px;height:4px;border-radius:2px;background:var(--border-soft);overflow:hidden}
.aip-prog .trk i{position:absolute;left:0;top:0;bottom:0;border-radius:2px;background:var(--meter);transition:width 400ms var(--ease-out)}
.aip-prog .muted{font:var(--t-caption);color:var(--text-3)}
/* the 14 px spinner = .live-spin at 14 px */
.aip-spin{display:inline-block;width:14px;height:14px;flex:none;box-sizing:border-box;border:2px solid var(--border-soft);border-top-color:var(--text-3);border-radius:50%;animation:ui-spin .8s linear infinite}

/* warning line (stopped / lost connection / model errors) = caution banner */
.aip-warn{display:flex;align-items:flex-start;gap:8px;padding:12px 16px;border:1px solid var(--banner-caution-border);border-radius:var(--radius-s);
  background:var(--banner-caution-bg);font:var(--t-body);color:var(--badge-warning-text)}
.aip-warn > .ic{width:16px;height:16px;margin-top:2px;flex:none;color:currentColor}

/* ── summary: the KPI hairline strip (§6.7), cells are filters ── */
.aip-sum{min-width:0}
.aip-kpis{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.aip-kpi{position:relative;display:grid;align-content:start;gap:4px;min-width:0;padding:16px;text-align:left;background:transparent;color:var(--text);
  transition:background var(--dur-1),box-shadow var(--dur-1)}
.aip-kpi:first-child{padding-left:0}
.aip-kpi + .aip-kpi{border-left:1px solid var(--border)}
button.aip-kpi{cursor:pointer}
button.aip-kpi:hover{background:var(--surface-hover)}
button.aip-kpi:focus-visible{z-index:1;box-shadow:var(--focus-ring)}
.aip-kpi.on{box-shadow:inset 0 -2px 0 var(--tab-ink)}   /* the tab recipe: grey ink, near-black label (DESIGN-CALM §3.2) */
button.aip-kpi.on:focus-visible{box-shadow:inset 0 -2px 0 var(--tab-ink),var(--focus-ring)}
/* the cells are filters, so the labels follow the tab recipe: inactive --text-2, the selected one --text-strong (§3.2) */
.aip-kpi .lbl{font:var(--t-body);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aip-kpi.on .lbl{color:var(--text-strong)}
.aip-kpi .v{display:grid;justify-items:start;font:var(--t-metric);color:var(--text-strong);font-variant-numeric:tabular-nums}
.aip-kpi .v small{font:var(--t-caption);color:var(--text-3);white-space:nowrap}   /* «109 из 117»: the comparison line under the value */
/* calibration: a mini table under the value */
.aip-cal{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 8px;align-items:baseline;margin-top:8px;padding-top:8px;
  border-top:1px solid var(--border-soft);font:var(--t-caption);color:var(--text);font-variant-numeric:tabular-nums}
.aip-cal i{font-style:normal;color:var(--text-3);white-space:nowrap}
.aip-cal span{justify-self:end;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* strip footer: labelled · cost · errors · run time, 12/16 --text-3 */
.aip-sf{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;padding-top:12px;font:var(--t-caption);color:var(--text-3)}
.aip-sf b{font-weight:600;color:var(--text-strong);font-variant-numeric:tabular-nums}
.aip-lbd{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 12px}
.aip-lbd .trk{position:relative;width:72px;height:4px;border-radius:2px;background:var(--border-soft);overflow:hidden}
.aip-lbd .trk i{position:absolute;left:0;top:0;bottom:0;border-radius:2px;background:var(--meter);transition:width 300ms var(--ease-out)}
.aip-vd{color:var(--text-3)}
.aip-sf-r{margin-left:auto;display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 0;white-space:nowrap}
.aip-sep{display:inline-block;width:1px;height:12px;margin:0 12px;background:var(--border);vertical-align:middle}
.aip-errs b{color:var(--danger)}

/* ── table: a Stripe list (§5.12) ── */
.aip-tw{min-width:0}
/* column widths as a Stripe list: the answer, signal and count columns fit their widest content (width 1px = shrink to
   content in the auto table layout), the client column takes the rest and is the only one that ellipsizes */
.aip-t{width:100%;border-collapse:separate;border-spacing:0;table-layout:auto;font:var(--t-body);color:var(--text-2)}
.aip-t col{width:1px}
.aip-t col.c-who{width:100%}
/* …and at least as wide as their widest content over all chats (--aip-c2…5 = column widths measured by screens/ai.js),
   so filtering and search never shift the columns: a 0 px tall block in the header cell carries that minimum */
.aip-t th:nth-child(n+2):nth-child(-n+5)::after{content:"";display:block;height:0}
.aip-t th:nth-child(2)::after{width:calc(var(--aip-c2,12px) - 12px)}
.aip-t th:nth-child(3)::after{width:calc(var(--aip-c3,12px) - 12px)}
.aip-t th:nth-child(4)::after{width:calc(var(--aip-c4,12px) - 12px)}
.aip-t th:nth-child(5)::after{width:calc(var(--aip-c5,12px) - 12px)}
/* the scroller has no top padding (the band is in .aip-tb), so the head sticks at 0 with the 16 px band above it */
.aip-t th{position:sticky;top:0;z-index:2;height:var(--row-h);padding:0 6px;background:var(--bg);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font:var(--t-caption-strong);color:var(--text-strong);box-shadow:inset 0 1px 0 var(--border),inset 0 -1px 0 var(--border-soft)}
/* two-line rows = --row-h-2: 6 + 20 + 4 + 20 + 6 (the stacked 20 px tag badges keep a 4 px gap) */
.aip-t td{padding:6px 6px;border-bottom:1px solid var(--border-soft);vertical-align:top;background:var(--surface);overflow:hidden;transition:background var(--dur-1)}
.aip-t tbody tr:last-child td{border-bottom-color:var(--border)}
.aip-t tbody tr{cursor:pointer}
.aip-t tbody tr:hover td{background:var(--surface-hover)}
.aip-t tbody tr.sel td{background:var(--row-selected)}   /* the open chat = grey selected fill (DESIGN-CALM §3.5) */
.aip-tw:has(> .aip-empty:not([hidden])) .aip-t{display:none}   /* empty result: the header hides, the filter row stays */

/* client cell */
/* size containment: the name and sub-line add no intrinsic width, so the client column only takes what is left */
.aip-who{display:grid;gap:2px;min-width:96px;contain:inline-size}
.aip-who b{display:flex;align-items:center;gap:6px;min-width:0;font-weight:600;color:var(--text-strong)}
.aip-who .nm{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.aip-who small{font:var(--t-caption);color:var(--text-3);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.aip-err{display:inline-grid;flex:none;color:var(--danger)}
.aip-err .ic{width:12px;height:12px}

/* fast model / check model pair (the tag is the short model name: «Luna», «Luna Pro»). A disagreeing pair = both answers
   in --text-strong 600 beside the same neutral tags (no red rule, no red text, no red tag: the row's red mark is the count's
   dot); a question not counted = --text-3 (§7.2.9: it is read, so ≥ 4.5:1, also on hovered rows) */
/* min-width:max-content = the whole tag + label + % is the column's minimum width, so an answer is never cut (the table
   scrolls sideways before that) */
.aip-cmp{display:grid;gap:4px;min-width:max-content}
/* --aip-tag = width of the longer model tag badge (set by screens/ai.js from the longer of the two tags) */
.aip-ln{display:grid;grid-template-columns:var(--aip-tag,58px) minmax(0,1fr);align-items:center;gap:4px;min-width:0}
/* model tags: mono 12/16 neutral badges (§5.10) */
.aip-ln i,.aip-lab-v i{display:inline-block;justify-self:start;max-width:100%;height:20px;padding:0 6px;border-radius:var(--radius-xs);
  font:var(--t-mono);line-height:20px;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:var(--badge-neutral-bg);color:var(--badge-neutral-text);box-shadow:inset 0 0 0 1px var(--badge-neutral-border)}
.aip-ln b{display:flex;align-items:baseline;min-width:0;white-space:nowrap;font-weight:400;color:var(--text)}
.aip-ln .tx{min-width:0;overflow:hidden;text-overflow:ellipsis}
.aip-ln em{flex:none}
.aip-ln em,.aip-lab-v em,.aip-yn em,.aip-ch em{margin-left:4px;font:var(--t-caption);font-style:normal;color:var(--text-3);font-variant-numeric:tabular-nums}
.aip-ln.s b{color:var(--text-2)}
.aip-cmp.dis .aip-ln.h b,.aip-cmp.dis .aip-ln.h em{color:var(--text-strong)}
.aip-cmp.dis .aip-ln.h b{font-weight:600}
.aip-cmp.dis .aip-ln.s b{color:var(--text-strong);font-weight:600}
.aip-cmp.off .aip-ln b,.aip-cmp.off .aip-ln em{color:var(--text-3)}
.aip-na{font-weight:400;color:var(--text-3)}

/* signals = neutral grey tags (DESIGN-CALM §3.7: AI tags are neutral); a disagreeing one carries the mono name of the
   one model that saw it («Встреча Luna Pro»), and the row's count dot says it disagrees */
.aip-sigs{display:flex;flex-wrap:wrap;gap:4px}
.aip-sig{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 6px;border-radius:var(--radius-xs);white-space:nowrap;font:var(--t-caption-strong);
  background:var(--badge-neutral-bg);color:var(--badge-neutral-text);box-shadow:inset 0 0 0 1px var(--badge-neutral-border)}
.aip-sig i{font:var(--t-mono);font-style:normal;color:inherit}

/* disagreements: a neutral count pill; a count above 0 leads with a 6 px --dot-red = the row's one red mark (status mark,
   DESIGN-CALM §1.6 / §3.7: a signal that repeats on every row is a small coloured dot beside neutral text, not a red badge) */
.aip-dn{display:grid;gap:4px;min-width:0}
.aip-dn-n{display:flex;align-items:center;gap:8px}
.aip-dn-n b{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  font:var(--t-caption-strong);font-variant-numeric:tabular-nums;background:var(--badge-neutral-bg);color:var(--badge-neutral-text);box-shadow:inset 0 0 0 1px var(--badge-neutral-border)}
.aip-dn-n b.red::before{content:"";flex:none;width:6px;height:6px;margin-right:4px;border-radius:50%;background:var(--dot-red)}
.aip-dn small{font:var(--t-caption);color:var(--text-3);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;contain:inline-size}   /* the names line never widens the column */
.aip-done{display:inline-grid;color:var(--success)}
.aip-done .ic{width:16px;height:16px;stroke-width:2}
.aip-part{font:var(--t-caption);color:var(--text-3);font-variant-numeric:tabular-nums}

/* empty result (§5.24 #1) + loading rows (static skeletons, §5.25) */
.aip-empty{display:grid;justify-items:start;width:100%;max-width:448px;margin:0 auto;padding:120px 0 48px;text-align:left;font:var(--t-body);color:var(--text-3)}
.aip-empty > .ic{box-sizing:border-box;width:48px;height:48px;padding:14px;margin-bottom:16px;border-radius:var(--radius-m);background:var(--surface-offset);color:var(--text-3);stroke-width:1.6}
.aip-empty > b{display:block;margin-bottom:4px;font:var(--t-heading);color:var(--text-strong)}
.aip-empty > p{margin:0}
.aip-empty > .btn{margin-top:16px}
/* the loading state in the loaded geometry (§5.25 static skeleton), so nothing jumps when the data arrives:
   KPI tile 161 px (label · value · «из» line · rule · two calibration lines), the 52 px strip footer, a 36 px table head,
   57 px two-line rows on the six table columns (the signals column stays empty) */
div.aip-kpi{gap:0}
div.aip-kpi > .skel{margin:2px 0}                                   /* label 16 in its 20 px line */
div.aip-kpi > .skel.l{height:24px;margin:8px 0 4px}                 /* value 24 in the 32 px line, after the 4 px gap */
div.aip-kpi > .skel:last-child{height:12px;margin:2px 0}            /* «109 из 117» 12 in its 16 px line */
div.aip-kpi::before{content:"";order:1;height:1px;margin-top:12px;background:var(--border-soft)}   /* the calibration rule */
div.aip-kpi::after{content:"";order:2;width:86%;height:12px;margin:10px 0 22px;border-radius:var(--radius-xs);
  background:var(--surface-hover);box-shadow:0 20px 0 var(--surface-hover)}                        /* two calibration lines */
.aip[aria-busy="true"] .aip-sum::after{content:"";display:block;width:40%;height:12px;margin:14px 0 26px;border-radius:var(--radius-xs);
  background:var(--surface-hover);box-shadow:0 24px 0 var(--surface-hover)}                        /* strip footer, two lines */
.aip[aria-busy="true"] .aip-tw::before{content:"";display:block;height:var(--row-h);box-shadow:inset 0 1px 0 var(--border),inset 0 -1px 0 var(--border-soft)}
.aip-skr{display:grid;grid-template-columns:minmax(0,1fr) 186px 210px 182px 125px 82px;column-gap:12px;align-items:start;height:calc(var(--row-h-2) + 1px);
  padding:9px 6px 0;border-bottom:1px solid var(--border-soft)}
.aip-skr > .skel{height:14px;box-shadow:0 24px 0 var(--surface-hover)}   /* two 14 px bars in the two 20 px lines */
.aip-skr > :last-child{grid-column:6}

/* ── state cards (no key / no pilot / no server): the page empty state (§5.24 #1) ── */
.aip.aip-solo{display:block;overflow:auto;padding:0 var(--gutter-x) 48px}
.aip-card{display:grid;justify-items:start;width:100%;max-width:448px;margin:120px auto 0;text-align:left;font:var(--t-body);color:var(--text-3);animation:ui-rise 240ms var(--ease-out) both}
.aip-card h2{margin:0 0 4px;font:var(--t-heading);color:var(--text-strong)}
.aip-card p{margin:0}
.aip-card > p + p{margin-top:8px}
.aip-card .btn{margin-top:16px}
.aip-card-ic{display:grid;place-items:center;width:48px;height:48px;margin-bottom:16px;border-radius:var(--radius-m);background:var(--surface-offset);color:var(--text-3)}
.aip-card-ic .ic{width:20px;height:20px;stroke-width:1.6}
.aip-card-ic:has(use[href="#warn"]){color:var(--warning)}
.aip-card-f{margin-top:16px!important;font:var(--t-caption);color:var(--text-3)}
.aip-card code,.aip-help code{padding:0 4px;border-radius:var(--radius-xs);background:var(--surface-offset);font:var(--t-mono);color:var(--text-strong);overflow-wrap:anywhere}
.aip-help code{background:var(--surface-hover-raised)}
/* numbered setup steps: 24 px circles */
.aip-steps{display:grid;gap:12px;margin:16px 0 0;padding:0;list-style:none;counter-reset:aip-st;color:var(--text)}
.aip-steps li{position:relative;min-height:24px;padding:2px 0 0 36px;counter-increment:aip-st}
.aip-steps li::before{content:counter(aip-st);position:absolute;left:0;top:0;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;
  background:var(--surface-offset);font:var(--t-caption-strong);color:var(--text-2);font-variant-numeric:tabular-nums}
.aip-help .aip-steps{margin:0}
.aip-help .aip-steps li::before{background:var(--surface-hover-raised)}
.aip-steps b{font-weight:600;color:var(--text-strong)}

/* «Как читать» / «Как подключить ключ» modals (560) */
.aip-help{display:grid;gap:12px;font:var(--t-body);color:var(--text)}
.aip-help p,.aip-help ul{margin:0}
.aip-help ul{padding-left:20px;display:grid;gap:4px}
.aip-help b{font-weight:600;color:var(--text-strong)}
.aip-help .muted{font:var(--t-caption);color:var(--text-3)}

/* ── drawer (680, footer space-between; §5.19) ── */
.aip-dr .drawer-b:focus{outline:0;box-shadow:none}
.aip-dr .drawer-h h3{flex:1}
.aip-dr .drawer-h h3 span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.aip-dnav{margin-left:auto}
.aip-dnav + .x{margin-left:4px}
.aip-dnav .x[disabled]{pointer-events:none}
.aip-drb{display:grid;gap:24px;min-width:0}
.aip-dsub{margin:-8px 0 0;font:var(--t-body);color:var(--text-3);font-variant-numeric:tabular-nums}
.aip-drb > .aip-warn{margin-top:-8px}
.aip-sec{min-width:0}
.aip-sec > .lbl{margin-bottom:8px;font:var(--t-body-strong);color:var(--text-strong)}
.aip-sumx{margin:0;padding:0 0 0 20px;display:grid;gap:4px;font:var(--t-body);color:var(--text)}
.aip-sumx li::marker{color:var(--text-3);font-variant-numeric:tabular-nums}
.aip-why{margin:12px 0 0;font:var(--t-body);color:var(--text-2)}
.aip-ev{display:grid;gap:8px;margin-top:12px}
.aip-ev blockquote{margin:0;padding:0 0 0 12px;border-left:2px solid var(--border);font:var(--t-body);color:var(--text-2);overflow-wrap:anywhere}
.aip-same{margin:0;font:var(--t-body);color:var(--text-2)}
.aip-hint{margin:0 0 4px;font:var(--t-body);color:var(--text-3)}

/* labelling: one bordered card per disagreement; header badge = pastel danger «Расхождение» (the card's one red mark; the
   model tags below it stay neutral, as in the table) / neutral verdict once labelled */
.aip-labs{display:grid;gap:8px}
.aip-labs > .lbl{margin-bottom:0}
.aip-lab{padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius-m);background:var(--surface-raised)}
.aip-lab-h{display:flex;align-items:center;gap:8px;min-height:20px;font:var(--t-body)}
.aip-lab-h b{min-width:0;font-weight:600;color:var(--text-strong)}
.aip-lab-h .badge{margin-left:auto;flex:none}
.aip-lab-ok{margin-left:auto;display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 6px;border-radius:var(--radius-xs);flex:none;white-space:nowrap;
  font:var(--t-caption-strong);background:var(--badge-neutral-bg);color:var(--badge-neutral-text);box-shadow:inset 0 0 0 1px var(--badge-neutral-border)}
.aip-lab-ok .ic{width:12px;height:12px;stroke-width:2.4;color:var(--success)}
.aip-lab-ok.u .ic{color:var(--text-3)}
.aip-lab-v{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin:8px 0 12px;font:var(--t-body)}
.aip-lab-v > span{display:flex;align-items:center;gap:8px;min-width:0}
.aip-lab-v i{flex:none} /* a two-word tag («Luna Pro») never breaks in a narrow drawer */
.aip-lab-v > span > span:not(.aip-mk){min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--text)}
.aip-lab-v > span > .aip-mk{flex:none;margin-left:-4px}
.aip-lab-v .h > span:not(.aip-mk){color:var(--text-strong);font-weight:600}
.aip-lab-v .h em{color:var(--text-strong)}
.aip-lab-v .s > span:not(.aip-mk){color:var(--text-strong);font-weight:600}
.aip-lab.done .aip-lab-v .h > span:not(.aip-mk),.aip-lab.done .aip-lab-v .h em{color:var(--text);font-weight:400}
.aip-lab.done .aip-lab-v .s > span:not(.aip-mk){color:var(--text);font-weight:400}
/* verdict buttons = segmented control (§5.9), selected = a pressed grey button (DESIGN-CALM §3.3) */
.aip-lab-b{display:flex;flex-wrap:wrap;gap:8px}
.aip-lab .aip-lab-b .qchip{height:var(--control-h);padding:0 8px;gap:6px;border:0;border-radius:var(--radius-s);background:var(--btn-bg);
  font:var(--t-body-strong);color:var(--text-2);box-shadow:var(--shadow-control),0 0 0 1px var(--border);transition:box-shadow var(--dur-1),color var(--dur-1),background var(--dur-1)}
.aip-lab .aip-lab-b .qchip:hover{background:var(--btn-bg);color:var(--text-strong);box-shadow:var(--shadow-control),0 0 0 1px var(--border-strong)}
.aip-lab .aip-lab-b .qchip.on{background:var(--surface-pressed);color:var(--text-strong);box-shadow:0 0 0 1px var(--border)}
.aip-lab .aip-lab-b .qchip.on:hover{background:var(--surface-pressed);box-shadow:0 0 0 1px var(--border-strong)}
.aip-lab .aip-lab-b .qchip:focus-visible,.aip-lab .aip-lab-b .qchip.on:focus-visible{box-shadow:var(--shadow-control),var(--focus-ring)}
.aip-lab .aip-lab-b .qchip:disabled{opacity:.5;cursor:not-allowed}
.aip-fix{margin-top:12px}
.aip-fix > .lbl{font:var(--t-body-strong);color:var(--text-title)}
.aip-fix select{width:100%}

/* small tables (choice answers, yes/no, fields, models): Stripe tables on a raised surface */
.aip-tbl{width:100%;border-collapse:collapse;table-layout:fixed;font:var(--t-body);color:var(--text-2)}
.aip-tbl th,.aip-tbl td{padding:8px 6px;border-bottom:1px solid var(--border-soft);text-align:left;vertical-align:top;overflow-wrap:anywhere;background:var(--surface-raised);transition:background var(--dur-1)}
.aip-tbl thead th{height:var(--row-h);padding:0 6px;vertical-align:middle;font:var(--t-caption-strong);color:var(--text-strong);box-shadow:inset 0 1px 0 var(--border);overflow-wrap:normal}
.aip-tbl tbody tr:last-child > *{border-bottom-color:var(--border)}
/* the cells by name, never «tr:hover > *»: Chrome keeps ONE hover invalidation set for every rule, and a universal part
   there made ANY hover anywhere restyle the hovered element's whole subtree — a board column of 185 cards on each pass of
   the pointer (2026-10-23, «на всех страницах где много элементов … лагает») */
.aip-tbl tbody tr:hover > td,.aip-tbl tbody tr:hover > th{background:var(--surface-hover-raised)}
.aip-tbl tbody th{font-weight:500;color:var(--text)}
.aip-tbl .r{text-align:right;font-variant-numeric:tabular-nums}
.aip-md tbody tr:first-child > *{box-shadow:inset 0 1px 0 var(--border)}
.aip-yn col.c-v{width:140px}
.aip-ch col.c-q{width:136px}
.aip-yn tr.dis th,.aip-ch tr.dis th{color:var(--text-strong);font-weight:600}
.aip-yn tr.dis td.h,.aip-yn tr.dis td.h em,.aip-ch tr.dis td.h,.aip-ch tr.dis td.h em{color:var(--text-strong);font-weight:600}
.aip-yn tr.dis td.s,.aip-ch tr.dis td.s{color:var(--text-strong);font-weight:600}
.aip-ch td{color:var(--text)}
.aip-ch tr.off td,.aip-ch tr.off td em{color:var(--text-3)}
/* micro-tags (§5.10): plain 12/16 sans --text-3 */
.aip-off,.aip-tr{display:block;width:max-content;max-width:100%;margin-top:2px;font:var(--t-caption);color:var(--text-3);font-variant-numeric:tabular-nums}
.aip-off{cursor:help}
/* ✓ / ✗ beside an answer: does it match the owner's truth */
.aip-mk{display:inline-grid;place-items:center;margin-left:6px;vertical-align:-1px;cursor:help}
.aip-mk .ic{width:12px;height:12px;stroke-width:2.4}
.aip-mk.ok{color:var(--success)}
.aip-mk.no{color:var(--danger)}
.aip-fl col.c-f{width:120px}
.aip-fl td b{display:block;font-weight:500;color:var(--text)}
.aip-q{display:block;margin-top:2px;font:var(--t-caption);color:var(--text-3)}
.aip-md col.c-c{width:96px}
.aip-md th small{display:block;margin-top:2px;font:var(--t-mono);color:var(--text-3);overflow-wrap:anywhere}
.aip-md tr.err th,.aip-md tr.err td{color:var(--danger)}
.aip-md tr.err th small{color:var(--danger)}
.aip-md tr.err th,.aip-md tr.err td{border-bottom:0}
.aip-md tr.err-t td{padding-top:0;font:var(--t-caption);color:var(--text-2)}
.aip-md tr.tot th,.aip-md tr.tot td{font-weight:600;color:var(--text-strong)}
.aip-route{display:block;width:max-content;max-width:100%;margin-top:2px;font:var(--t-caption);color:var(--text-3);text-decoration:underline dotted var(--text-4);text-underline-offset:3px;cursor:help}

/* the fast model's tasks: rows */
.aip-task{display:grid;grid-template-columns:16px minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--border-soft);font:var(--t-body)}
.aip-task:first-child{padding-top:0}
.aip-task:last-child{border-bottom:0}
.aip-task > .ic{width:16px;height:16px;margin-top:2px;color:var(--icon);stroke-width:2}
.aip-task b{display:block;font-weight:500;color:var(--text-strong)}
.aip-task small{display:block;font:var(--t-caption);color:var(--text-3)}

/* footer: save state + «Открыть сделку» */
.aip-saved{display:inline-flex;align-items:center;gap:6px;min-width:0;font:var(--t-caption);color:var(--text-3)}
.aip-saved .ic{width:12px;height:12px;stroke-width:2.4}
.aip-saved.ok .ic{color:var(--success)}
.aip-saved.warn .ic{color:var(--warning)}
.aip-dis{display:inline-flex;border-radius:var(--radius-s)}

/* KPI cells keep §6.7's 16 px at 1440 / 1512 (view 1200 / 1272); only the 1280 viewport (view 1040) and 1440 with the
   assistant docked (view 1056) narrow them to 12 so seven calibration grids fit */
@container view (max-width:1100px){
  .aip-kpi{padding:16px 12px}
  .aip-kpi:first-child{padding-left:0}
}
@media (prefers-reduced-motion: reduce){
  .aip-card{animation:none}
  .aip-spin,.aip-pill::after{animation-duration:2s!important;animation-iteration-count:infinite!important}
}