/* ASAP AI (migration 073): the ranked list on Today / My work and the owner briefing (#/briefing).
   shop.css tokens only, so light, dark and the three looks follow; no inline styles (CSP). */

/* ---------- the list ---------- */
.today-ai:empty { display: none; }
.aiq { background: var(--surface); border-radius: var(--r-l); box-shadow: 0 0 0 .5px var(--hair); padding: 14px 18px 8px; margin: -8px 0 22px; }
.th .aiq { margin: 0 0 18px; }
.aiq-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 4px; }
.aiq-title-main { display: block; font: 600 15px/1.25 var(--font-display); letter-spacing: -0.01em; }
.aiq-title-main::before { content: "✦ "; color: var(--accent); }
.aiq-sub { display: block; font-size: 12.5px; color: var(--ink-2); margin-top: 1px; }
.shop-on .aiq-run { min-height: 30px; font-size: 13px; flex: none; }
.aiq-list { list-style: none; margin: 0; padding: 0; }
.aiq-item { display: grid; grid-template-columns: 10px 1fr; gap: 10px; padding: 12px 0; border-top: 1px solid var(--hair); }
.aiq-list > .aiq-item:first-child { border-top: 0; }
.aiq-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 7px; background: var(--accent); }
.aiq-item.t-red .aiq-dot { background: var(--red); }
.aiq-item.t-amber .aiq-dot { background: var(--amber); }
.aiq-main { min-width: 0; }
.aiq-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.aiq-title { font-weight: 600; font-size: 14.5px; line-height: 1.35; overflow-wrap: anywhere; }
.aiq-value { font-weight: 600; font-size: 14px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.aiq-value.is-unknown { font-weight: 500; font-size: 12.5px; color: var(--ink-3); }
.aiq-detail { margin: 2px 0 0; font-size: 13.5px; color: var(--ink-2); line-height: 1.42; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.aiq-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; margin: 6px 0 0; font-size: 12.5px; color: var(--ink-2); }
.aiq-meta:empty { display: none; }
.aiq-chip { background: var(--fill); border-radius: 999px; padding: 1px 8px; font-weight: 500; color: var(--ink); }
.aiq-chip.is-red { background: var(--red-soft); color: var(--red); }
.aiq-chip.is-blue { background: var(--accent-soft); color: var(--accent); }
.aiq-store { color: var(--ink-3); }
.aiq-did { color: var(--ink-2); }
.aiq-did::before { content: "· "; color: var(--ink-3); }
.aiq-actions { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; margin-top: 9px; }
.shop-on .aiq-actions button, .shop-on .aiq-actions .btn { min-height: 32px; font-size: 13.5px; padding: 0 12px; }
.shop-on .aiq-actions button.quiet { padding: 0 8px; }
.shop-on .aiq-reason { min-height: 32px; width: auto; font-size: 13px; padding: 0 8px; color: var(--ink-2); }
.aiq-msg:empty { display: none; }
.aiq-msg { margin-top: 6px; }
.aiq-warn { margin: 0; font-size: 13px; color: var(--amber); }
.aiq-muted { color: var(--ink-2); font-size: 12.5px; margin: 4px 0 0; }
.aiq-why { margin-top: 6px; font-size: 12.5px; color: var(--ink-2); }
.aiq-why summary { cursor: pointer; color: var(--accent); width: max-content; }
.aiq-why p { margin: 4px 0 0; }
.aiq-ev { margin: 4px 0 0; padding-left: 18px; }
.aiq-empty { padding: 10px 0 12px; color: var(--ink-2); font-size: 14px; }
.aiq-more { padding: 6px 0 4px; border-top: 1px solid var(--hair); }
.aiq-done { border-top: 1px solid var(--hair); padding: 9px 0 6px; font-size: 13px; }
.aiq-done summary { cursor: pointer; color: var(--ink-2); }
.aiq-done ul { margin: 6px 0 0; padding-left: 18px; color: var(--ink-2); }
.aiq.is-compact .aiq-detail { -webkit-line-clamp: 3; }

/* ---------- the briefing ---------- */
.brf { display: grid; gap: 14px; }
.brf-card { background: var(--surface); border-radius: var(--r-l); box-shadow: 0 0 0 .5px var(--hair); padding: 16px 18px; min-width: 0; }
.brf-card-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 14px; flex-wrap: wrap; margin-bottom: 8px; }
.brf-card-head h2 { margin: 0; font-size: 17px; }
.brf-src { font-size: 12.5px; color: var(--ink-2); }
.brf-story p { font-size: 15.5px; line-height: 1.55; margin: 0 0 10px; max-width: 72ch; }
.brf-story p:last-child { margin-bottom: 0; }
.brf-story .brf-note, .brf-note { font-size: 12.5px; color: var(--ink-2); }
.brf-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin: 4px 0 14px; }
.brf-tile { background: var(--surface-2); border-radius: var(--r-m); box-shadow: 0 0 0 .5px var(--hair); padding: 12px 14px; min-width: 0; }
.brf-tile.is-hero { background: var(--accent-soft); box-shadow: none; }
.brf-t-label { font-size: 12.5px; color: var(--ink-2); font-weight: 500; }
.brf-t-value { font: 700 24px/1.2 var(--font-display); letter-spacing: -0.02em; margin: 4px 0 2px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.brf-tile.is-hero .brf-t-value { color: var(--accent); }
.brf-t-basis { font-size: 12px; color: var(--ink-2); margin: 0; line-height: 1.4; }
.brf-funnel { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 7px; }
.brf-funnel li { display: grid; grid-template-columns: 92px 1fr 34px minmax(0, 170px); gap: 10px; align-items: center; font-size: 13px; }
.brf-f-label { color: var(--ink-2); }
.brf-f-bar { height: 10px; background: var(--fill); border-radius: 999px; overflow: hidden; }
.brf-f-fill { display: block; height: 100%; background: var(--accent); border-radius: 999px; }
.brf-f-n { font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.brf-f-sub { color: var(--ink-2); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brf-work h3 { font-size: 14px; margin: 6px 0 6px; }
.brf-kv { display: grid; grid-template-columns: 1fr max-content; gap: 4px 16px; margin: 0; font-size: 13.5px; max-width: 520px; }
.brf-kv dt { color: var(--ink-2); }
.brf-kv dd { margin: 0; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.brf-split { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12.5px; color: var(--ink-2); margin: 8px 0 0; }
.brf-std { margin-top: 10px; font-size: 13px; }
.brf-std summary { cursor: pointer; color: var(--accent); }
.brf-std table, .brf-stores, .brf-books { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 6px; }
.brf-std th, .brf-std td, .brf-stores th, .brf-stores td, .brf-books th, .brf-books td { text-align: left; padding: 7px 8px 7px 0; border-top: 1px solid var(--hair); vertical-align: top; }
.brf-stores td:not(:first-child), .brf-stores th:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.shop-on .brf-books th, .shop-on .brf-stores th, .shop-on .brf-std th { font-weight: 600; text-transform: none; letter-spacing: normal; font-size: 13px; color: var(--ink); }
.brf-books th { white-space: nowrap; }
.brf-person { display: block; font-size: 12px; color: var(--ink-2); margin-top: 3px; }
.shop-on .brf-books select { min-height: 32px; width: auto; font-size: 13px; padding: 0 8px; }

@media (max-width: 640px) {
  .aiq { padding: 12px 14px 6px; margin: -6px 0 18px; }
  .aiq-top { flex-direction: column; gap: 1px; }
  .brf-card { padding: 14px; }
  .brf-funnel li { grid-template-columns: 78px 1fr 30px; }
  .brf-f-sub { grid-column: 1 / -1; padding-left: 88px; margin-top: -4px; }
  .brf-f-sub:empty { display: none; }
  .brf-books, .brf-books tbody, .brf-books tr, .brf-books th, .brf-books td { display: block; width: 100%; }
  .brf-books tr { border-top: 1px solid var(--hair); padding: 8px 0; }
  .brf-books th, .brf-books td { border: 0; padding: 2px 0; }
  .brf-std table { display: block; overflow-x: auto; }
}

/* S4 policy impact for company playbook levels: "What will change" before publishing (ss-imp-* from shop-settings.css). */
.pbi-box:empty { display: none; }
.pbi-box { margin-top: 10px; }
.pbi-impact { margin: 0; }
.pbi-changes { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.pbi-change { padding: 10px 12px; border-radius: var(--r-m); background: var(--fill); display: flex; flex-direction: column; gap: 6px; font-size: 14px; overflow-wrap: anywhere; }
.pbi-change.is-widens { box-shadow: inset 3px 0 0 var(--amber, var(--warn)); }
.pbi-change-head { line-height: 1.5; }
.pbi-tag { display: inline-block; font-size: 12px; font-weight: 500; padding: 3px 8px; border-radius: 999px; background: var(--surface); color: var(--ink-2); vertical-align: 1px; }
.pbi-tag.is-widens { background: var(--amber-soft, var(--fill)); color: var(--ink); }

/* Batch 30 (UI_COVERAGE.md, stream B): Briefing cards under the shared band look (stream A's .band: the accent, white heavy
   italic, square). Markup unchanged: a panel whose first child is its heading (or a head row holding it) gets the band. */
body.shop-on :is(.brf-card):has(> h2:first-child, > :is(div, header):first-child > h2) { padding-top: 0; padding-left: 18px; padding-right: 18px; }   /* no overflow clip: rows, menus and popovers stay reachable */
body.shop-on :is(.brf-card) > h2:first-child,
body.shop-on :is(.brf-card) > :is(div, header):first-child:has(> h2) { display: flex; align-items: center; justify-content: space-between; gap: 6px 12px; flex-wrap: wrap;
  margin: 0 -18px 14px; padding: 9px 18px; min-height: 44px; box-sizing: border-box; background: var(--accent); color: var(--accent-ink, #fff); border-radius: 3px 3px 0 0; }
body.shop-on :is(.brf-card) > :is(div, header):first-child > h2 { margin: 0; }
body.shop-on :is(.brf-card) > h2:first-child, body.shop-on :is(.brf-card) > :is(div, header):first-child > h2 { color: var(--accent-ink, #fff);
  font: italic 900 23px/1.08 var(--font-title); text-transform: uppercase; letter-spacing: -0.004em; }
body.shop-on :is(.brf-card) > :is(div, header):first-child:has(> h2) :is(span, small, label, .cp-fine, a:not(.btn)) { color: inherit; }
body.shop-on :is(.brf-card) > :is(div, header):first-child:has(> h2) :is(button.quiet, .btn.quiet) { color: inherit; background: rgba(255, 255, 255, 0.14); }
@media (max-width: 860px) { body.shop-on :is(.brf-card) > h2:first-child, body.shop-on :is(.brf-card) > :is(div, header):first-child > h2 { font-size: 19px; } body.shop-on :is(.brf-card):has(> h2:first-child, > :is(div, header):first-child > h2) { padding-left: 14px; padding-right: 14px; } body.shop-on :is(.brf-card) > h2:first-child, body.shop-on :is(.brf-card) > :is(div, header):first-child:has(> h2) { margin-left: -14px; margin-right: -14px; padding-left: 14px; padding-right: 14px; } }

/* U34-D: per action (what Ratchet may do alone; always ask first; daily limit; undo window) */
.aa-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.aa-actions select, .aa-actions .aa-num { min-height: 44px; }
.aa-actions .aa-num { width: 6.5em; }
/* U46-D: each action's eval bar, said in words under its name */
.aa-actions th .aiq-muted { white-space: normal; font-weight: 400; }   /* the row's notes wrap (the action's name stays on one line) */
.aa-actions .aa-bar { max-width: 34em; margin-top: 2px; }
.aa-actions .aa-bar.ok { color: var(--green); }
.aa-check { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; }
.brf-sub { font-size: 17px; margin: 20px 0 4px; }
