/* SearchLift AI console - Stripe/Linear-grade corporate minimal. Single typeface (Inter),
   brand blue #3b73f6, restrained corners (max rounded-lg). */
/* Corporate monochrome: white surfaces, 1px near-black borders, no shadows, one blue accent,
   red used only to flag problems. Single typeface (Lato). */
:root{
  --brand:#3b73f6; --brand-600:#2f63e0; --brand-50:#f0f4fd; --brand-100:#dbe7fd;
  --ink:#0a0e16; --body:#1f2a3d; --muted:#56627a; --faint:#8a93a6;
  --line:#aab1bd; --line-soft:#e4e7ec; --bg:#f4f5f7; --card:#ffffff;
  --good:#1f7a4d; --warn:#7a6310; --bad:#b42318;
  --shadow:none;
}
:root[data-theme="dark"]{
  --brand:#5b8cff; --brand-600:#6f9bff; --brand-50:#161d2c; --brand-100:#222c42;
  --ink:#f1f4f9; --body:#c2cad6; --muted:#8a93a6; --faint:#5d6678;
  --line:#3a4250; --line-soft:#222a38; --bg:#080b12; --card:#0f1420;
  --good:#4ade80; --warn:#fbbf24; --bad:#f87171;
  --shadow:none;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Lato',system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--body);font-size:14px;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;color:var(--ink);font-weight:700;letter-spacing:-.01em}
.muted{color:var(--muted)} .hidden{display:none!important}
/* The `hidden` attribute must always win. Author rules like .callout{display:flex} otherwise
   override the UA [hidden] rule (equal specificity, later wins) and a hidden element shows as an
   empty box (e.g. #robotsCallout above the audit, before any audit exists). */
[hidden]{display:none!important}
svg.icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
/* Status chip: install-status card + the llms.txt Found/Score pills. */
.stat-chip{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--muted);border:1px solid var(--line-soft);border-radius:7px;padding:9px 13px;line-height:1.1;white-space:nowrap}
.stat-chip svg{width:15px;height:15px;flex:none}
.stat-chip.ok{color:var(--good)}
.stat-chip.bad{color:var(--bad);border-color:var(--bad)}

.app{display:flex;min-height:100vh}
.side{width:240px;background:var(--card);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:20px 14px;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:10px;padding:6px 6px 22px}
.brand .logo{height:42px;width:auto;max-width:200px;display:block;object-fit:contain}
.brand .logo-dark{display:none}
:root[data-theme="dark"] .brand .logo-light{display:none}
:root[data-theme="dark"] .brand .logo-dark{display:block}
.nav{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--muted);font-weight:600;font-size:13.5px;cursor:pointer;user-select:none}
.nav-item:hover{background:var(--line-soft);color:var(--ink)}
.nav-item.active{background:var(--brand-50);color:var(--ink)}
.nav-item.active svg{color:var(--brand)}
.side-foot{margin-top:auto;padding:8px}
.demo-pill{display:inline-block;font-size:11px;font-weight:700;color:var(--warn);background:var(--warn-50);padding:4px 9px;border-radius:999px}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:5;background:rgba(244,245,247,.9);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--line)}
.bar-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;gap:16px;max-width:1200px;margin:0 auto;width:100%}
.topbar h1{font-size:19px} .crumb{color:var(--muted);font-size:12.5px;margin-top:2px}
.bar-title{min-width:0} .bar-title h1,.bar-title .crumb{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ta{display:flex;gap:10px;flex:0 0 auto}
.content{padding:28px 32px 64px;max-width:1200px;width:100%;margin:0 auto}
/* hamburger (mobile only) + sidebar scrim; both inert on desktop */
.hamb{display:none;align-items:center;justify-content:center;width:38px;height:38px;flex:0 0 auto;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);cursor:pointer}
.side-ov{display:none;position:fixed;inset:0;background:rgba(10,14,22,.45);z-index:39;opacity:0;pointer-events:none;transition:opacity .18s}
.side-ov.open{opacity:1;pointer-events:auto}
/* horizontal scroll wrapper so wide tables never break the layout on small screens */
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:6px;padding:12px 20px;font-family:inherit;font-weight:500;font-size:14px;line-height:1.1;white-space:nowrap;flex:none;cursor:pointer;transition:.12s}
.btn-sm{padding:10px 16px;font-size:13px}
/* Primary actions are neutral outline buttons (white surface, 1px border, ink text) - identical to
   .btn-ghost. The lone blue accent (.btn-upgrade) is the only filled/colored button in the app. */
.btn-primary{background:var(--card);color:var(--ink);border-color:var(--line)}
.btn-primary:hover{background:var(--line-soft)}
/* The ONLY colored button in the app: the Upgrade CTA. Solid brand blue, white text, not bold. */
.btn-upgrade{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:500}
.btn-upgrade:hover{background:var(--brand-600);border-color:var(--brand-600)}
.btn-ghost{background:var(--card);border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:var(--line-soft)}
.btn-danger{background:var(--card);border-color:var(--bad);color:var(--bad)}
/* Terminal "done" confirmation (Fixed / Optimized) shown in an action slot in place of a button.
   Full button height (NOT a tiny pill), non-interactive, green success styling so it reads clearly
   as a completed state next to the live action buttons. */
.btn-done{background:transparent;border-color:var(--good);color:var(--good);font-weight:700;cursor:default}
.btn-done svg{color:var(--good);width:16px;height:16px}
.btn:disabled{opacity:.5;cursor:default}

.grid{display:grid;gap:16px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.section-gap{margin-top:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px}
.card-h{padding:18px 20px;border-bottom:1px solid var(--line-soft)}
.card-h.with-action{display:flex;align-items:center;justify-content:space-between;gap:12px}
.card-h h2{font-size:15px} .card-h p{margin:3px 0 0;color:var(--muted);font-size:12.5px}
.card-b{padding:20px}

.scorebar{height:5px;background:var(--line-soft);margin-top:12px;overflow:hidden}
.scorebar > i{display:block;height:100%;background:var(--brand)}

/* audit list */
.row{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line-soft)}
.row:last-child{border-bottom:0}
.row .score{flex:0 0 44px;height:44px;border-radius:6px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:var(--ink)}
.score.bad{border-color:var(--bad);color:var(--bad)}
.row .meta{flex:1;min-width:0}
.row .meta .u{font-weight:600;color:var(--ink);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .meta .tag{display:inline-block;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);border:1px solid var(--line-soft);padding:2px 7px;border-radius:4px;margin-right:7px}
.row .issues{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-block;vertical-align:middle;font-size:11.5px;font-weight:500;color:var(--muted);border:1px solid var(--line-soft);padding:3px 8px;border-radius:4px;background:transparent}
.chip.high{color:var(--bad);border-color:var(--bad)}
.ent-badge{display:inline-block;vertical-align:middle;margin-left:6px;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand);border:1px solid var(--brand);border-radius:4px;padding:1px 6px}
.row .act{flex:0 0 auto}
.clickable{cursor:pointer} .row.clickable:hover,.fix.clickable:hover{background:var(--line-soft)}

/* monitor grid */
.mtable{width:100%;border-collapse:collapse}
.mtable th,.mtable td{text-align:left;padding:12px 12px;border-bottom:1px solid var(--line-soft);font-size:13px}
.mtable th{color:var(--muted);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}
.mtable td.q{font-weight:600;color:var(--ink);max-width:280px}
.dot{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:6px;border:1px solid var(--line-soft);font-weight:800;font-size:12px;color:var(--faint)}
.dot.yes{border-color:var(--brand);color:var(--brand)}
.engh{display:flex;align-items:center;gap:6px}
.q-del{color:var(--faint);cursor:pointer} .q-del:hover{color:var(--bad)}

/* fixes */
.fix{display:flex;align-items:center;gap:14px;padding:13px 20px;border-bottom:1px solid var(--line-soft)}
.fix:last-child{border-bottom:0}
.fix .k{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);border:1px solid var(--line-soft);padding:3px 8px;border-radius:4px;flex:0 0 auto}
.fix .d{flex:1;min-width:0} .fix .d .t{font-weight:600;color:var(--ink);font-size:13.5px}
.fix .d .s{color:var(--muted);font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status{font-size:11px;font-weight:700;padding:3px 9px;border-radius:4px;border:1px solid var(--line-soft);color:var(--muted);text-transform:capitalize}
.status.applied{color:var(--ink);border-color:var(--line)} .status.suggested{color:var(--muted)}
.status.reverted{color:var(--faint)} .status.failed{color:var(--bad);border-color:var(--bad)}

/* fields */
.field{margin-bottom:18px} .field label{display:block;font-weight:600;font-size:13px;color:var(--ink);margin-bottom:6px}
.help{font-size:12px;color:var(--muted);margin-bottom:7px}
.char-count{font-size:11px;color:var(--faint);text-align:right;margin-top:5px;font-variant-numeric:tabular-nums}
.char-count.near{color:var(--warn)}
.input{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-family:inherit;font-size:13.5px;color:var(--ink);background-color:#fff}
.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}
.srow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid var(--line-soft)}
.srow-t{font-weight:600;color:var(--ink);font-size:13.5px} .srow-d{color:var(--muted);font-size:12.5px;margin-top:2px}
.toggle{position:relative;display:inline-block;width:42px;height:24px;flex:0 0 auto}
.toggle input{opacity:0;width:0;height:0} .toggle .tt{position:absolute;inset:0;background:#cdd6e4;border-radius:999px;transition:.15s;cursor:pointer}
.toggle .tt:before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.15s}
.toggle input:checked + .tt{background:var(--brand)} .toggle input:checked + .tt:before{transform:translateX(18px)}
.page-actions{padding:16px 20px;border-top:1px solid var(--line-soft);display:flex;justify-content:flex-end}

.callout{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:6px;font-size:13px;line-height:1.55;border:1px solid var(--line);background:var(--card);color:var(--body)}
.callout svg{color:var(--muted);flex:0 0 auto}
.callout .btn{margin-left:auto;flex:0 0 auto}
#robotsCallout:not([hidden]){margin-bottom:16px}

.page{display:none} .page.active{display:block}
.empty{padding:48px 20px;text-align:center;color:var(--muted)}
.empty .big{font-weight:700;color:var(--ink);font-size:15px;margin-bottom:6px}

/* lottie loading state (vendored lottie_light + loader.json) */
.loadwrap{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:60vh;padding:24px;gap:6px}
.lottie-box{width:360px;height:360px;max-width:96vw;position:relative}
.lottie-box::before{content:"";position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:3px solid var(--line-soft);border-top-color:var(--brand);animation:sl-spin .8s linear infinite}
.lottie-box.mounted::before{display:none}
.lottie-box svg{position:relative}
@keyframes sl-spin{to{transform:rotate(360deg)}}
/* Minimalist inline spinner for busy buttons (Fix with Sam, Apply changes). Inherits text color. */
.btn-spin{display:inline-block;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sl-spin .7s linear infinite;vertical-align:middle}
.ld-title{font-weight:700;color:var(--ink);font-size:16px}
.ld-sub{font-size:13px;max-width:400px;line-height:1.55}
/* illustrated empty state (brand illustration: assets/empty[-dark].svg, theme-swapped) */
.emptywrap{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px 46px;gap:5px}
.es-illus{display:block;width:206px;height:auto;margin-bottom:6px}
.es-dark{display:none}
:root[data-theme="dark"] .es-light{display:none}
:root[data-theme="dark"] .es-dark{display:block}
.es-title{font-weight:700;color:var(--ink);font-size:15px;margin-top:4px}
.es-sub{font-size:13px;max-width:420px;line-height:1.55}
.es-act{margin-top:14px}
/* one-line dark code block for the tracking snippet (always dark, single brand font, no monospace) */
.code-snip{display:block;background:#0f1729;color:#e2e8f0;border:1px solid #1e293b;border-radius:6px;padding:9px 12px;font-size:12.5px;line-height:1.5;white-space:nowrap;overflow-x:auto;letter-spacing:.1px}
.code-snip::-webkit-scrollbar{height:6px}
.code-snip::-webkit-scrollbar-thumb{background:#334155;border-radius:3px}
.code-snip::-webkit-scrollbar-track{background:transparent}
.code-snip .t-punc{color:#64748b}
.code-snip .t-tag{color:#7dd3fc}
.code-snip .t-attr{color:#fca5a5}
.code-snip .t-str{color:#86efac}
/* Above-quota (locked) audit/product rows: listed greyed with an Upgrade CTA so merchants see their
   full inventory; scored automatically once they upgrade. Plus a summary lockbar above the list. */
.row-locked{opacity:.6}
.row-locked:hover{opacity:.8}
.score.score-locked{display:flex;align-items:center;justify-content:center;color:var(--faint);background:var(--line-soft);border-color:var(--line-soft)}
.score-locked .lock-i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chip.locked-chip{color:var(--muted);background:transparent;border:1px dashed var(--line)}
.lockbar{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid var(--line-soft)}
.lockbar .lock-i{width:18px;height:18px;flex:0 0 auto;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lockbar-t{flex:1;font-size:13px;color:var(--muted);line-height:1.45}
.lockbar-t b{color:var(--ink);font-weight:700}
/* "could not reach your site" prompt: whitelist-our-IP guidance + reveal/copy + Retry. The IP chip
   stays in the brand font (no monospace) per the single-font rule, styled bold for legibility. */
.scanfail-ip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.scanfail .ip-reveal{display:inline-flex;align-items:center;gap:8px}
.scanfail .ip-code{display:inline-block;padding:4px 10px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font-weight:700;letter-spacing:.3px}

/* modal */
.modal-ov{position:fixed;inset:0;background:rgba(10,14,22,.5);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal{background:var(--card);border:1px solid var(--line);border-radius:8px;width:100%;max-width:460px;overflow:hidden}
.modal-h{display:flex;align-items:flex-start;justify-content:space-between;padding:20px 22px 14px}
.modal-h .eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);display:block;margin-bottom:5px}
.modal-h h3{font-size:17px} .modal-b{padding:6px 22px 4px} .modal-f{display:flex;justify-content:flex-end;gap:9px;padding:16px 22px 20px}
.x{background:none;border:0;color:var(--faint);cursor:pointer;padding:4px} .x:hover{color:var(--ink)}

/* loader + toast */
.gp-loader{position:fixed;inset:0;background:rgba(244,245,247,.6);display:flex;align-items:center;justify-content:center;z-index:60}
.gp-loader[hidden]{display:none}
:root[data-theme="dark"] .gp-loader{background:rgba(8,11,18,.6)}
.gp-spin{width:32px;height:32px;border:3px solid var(--line-soft);border-top-color:var(--brand);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:11px 18px;border-radius:10px;font-size:13px;font-weight:500;opacity:0;pointer-events:none;transition:.2s;z-index:70}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* sidebar tour link */
.side-link{display:flex;align-items:center;gap:9px;width:100%;background:none;border:0;color:var(--muted);font-family:inherit;font-weight:600;font-size:13px;padding:9px 10px;border-radius:8px;cursor:pointer}
.side-link:hover{background:var(--line-soft);color:var(--ink)} .side-foot{display:flex;flex-direction:column;gap:8px}

/* upgrade banner */
.upbanner{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:16px 18px;margin-bottom:16px}
.upbanner .ub-i{width:36px;height:36px;border-radius:6px;border:1px solid var(--line-soft);color:var(--muted);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.upbanner .ub-t{font-weight:700;font-size:14.5px} .upbanner .ub-s{font-size:12.5px;color:var(--muted);margin-top:2px}
.upbanner .btn{margin-left:auto}

/* onboarding checklist */
.checklist{background:var(--card);border:1px solid var(--line);border-radius:8px;margin-bottom:16px;overflow:hidden}
.checklist .ch-h{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line-soft)}
.checklist .ch-h h2{font-size:15px} .checklist .ch-h .ch-prog{margin-left:auto;font-size:12px;font-weight:700;color:var(--muted)}
.checklist .ch-x{background:none;border:0;color:var(--faint);cursor:pointer} .checklist .ch-x:hover{color:var(--ink)}
.ch-item{display:flex;align-items:center;gap:13px;padding:13px 20px;border-bottom:1px solid var(--line-soft)}
.ch-item:last-child{border-bottom:0}
.ch-mark{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:transparent}
.ch-item.done .ch-mark{border-color:var(--ink);color:var(--ink)}
.ch-item .ch-tx{flex:1} .ch-item .ch-tx .t{font-weight:600;color:var(--ink);font-size:13.5px} .ch-item.done .ch-tx .t{color:var(--muted);text-decoration:line-through}
.ch-item .ch-tx .s{color:var(--muted);font-size:12px;margin-top:1px}

/* billing plan cards */
.billhead{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:18px 20px;margin-bottom:16px}
.billhead .bh-plan{font-size:20px;font-weight:800;color:var(--ink)} .billhead .bh-sub{color:var(--muted);font-size:13px;margin-top:2px}
.billhead .bh-use{margin-left:auto;text-align:right} .bh-use .n{font-size:18px;font-weight:800;color:var(--ink)} .bh-use .l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:1180px){.plans{grid-template-columns:repeat(2,1fr)}}
.plan{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:22px;display:flex;flex-direction:column}
.plan.current{border-width:2px;border-color:var(--ink)}
.plan .p-name{font-size:16px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:8px}
.plan .p-badge{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);border:1px solid var(--line);padding:3px 8px;border-radius:4px}
.plan .p-tag{color:var(--muted);font-size:12.5px;margin:6px 0 16px}
.plan ul{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:9px}
.plan li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--body)}
.plan li svg{color:var(--muted);flex:0 0 auto;margin-top:1px}
.plan .btn{margin-top:auto;justify-content:center}

/* blog studio */
.wiz{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.wiz-s{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted)}
.wiz-s + .wiz-s:before{content:"";width:18px;height:1px;background:var(--line);display:inline-block;margin-right:2px}
.wiz-s .wiz-n{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
.wiz-s.active{color:var(--ink)} .wiz-s.active .wiz-n{border-color:var(--brand);color:var(--brand)}
.wiz-s.done{color:var(--ink)} .wiz-s.done .wiz-n{border-color:var(--brand);color:var(--brand)}
.topics{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.topic{border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:13px;min-width:0}
.topic-t{font-weight:800;color:var(--ink);font-size:15px;line-height:1.35}
.topic-q{border:1px solid var(--line-soft);border-radius:7px;background:var(--line-soft);padding:10px 12px}
.topic-l{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:5px}
.topic-qv{font-size:13px;font-weight:600;color:var(--ink);line-height:1.45;overflow-wrap:anywhere}
.topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.topic-a,.topic-w{font-size:13px;color:var(--body);line-height:1.5}
.topic-f{margin-top:auto;padding-top:2px}
.osecs{display:flex;flex-direction:column;gap:14px;margin-top:10px}
.osec{padding:14px 16px;border:1px solid var(--line-soft);border-radius:8px}
.osec-h{font-weight:600} .osec-s{font-size:12.5px;margin-top:10px;line-height:1.55}
.article{padding:2px 0}
.article h1{font-size:21px;margin:0 0 12px;color:var(--ink)}
.article h2{font-size:16px;margin:18px 0 8px;color:var(--ink)} .article h2:first-child{margin-top:0}
.article p{margin:0 0 12px;font-size:14px;line-height:1.65;color:var(--body)}
.article img{display:block;max-width:100%;height:auto;border-radius:8px;margin:0 0 16px}
@media(max-width:980px){.topic-grid{grid-template-columns:1fr}}
@media(max-width:820px){.topics{grid-template-columns:1fr}}
/* Existing published posts grid (Blog Studio) */
.ex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px;padding:16px 20px 20px}
.ex-card{border:1px solid var(--line-soft);border-radius:10px;overflow:hidden;background:var(--card);display:flex;flex-direction:column}
.ex-cover{display:block;width:100%;height:120px;object-fit:cover;background-size:cover;background-position:center;background-color:var(--line-soft)}
.ex-cover-empty{background:linear-gradient(135deg,var(--brand-50),var(--line-soft))}
.ex-body{padding:12px 14px;display:flex;flex-direction:column}
.ex-t{font-weight:700;font-size:14px;color:var(--ink);line-height:1.35;text-decoration:none}
a.ex-t:hover{text-decoration:underline}
.ex-x{font-size:12.5px;margin-top:6px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ex-m{font-size:11.5px;margin-top:8px}
.ex-th{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
@media(max-width:560px){.ex-grid{grid-template-columns:1fr}}
/* Live-post link icon (View live URL) on blog rows + cards. */
.livelink{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);border:1px solid var(--line-soft);border-radius:6px;padding:5px;text-decoration:none;transition:.12s}
.livelink:hover{color:var(--brand);border-color:var(--brand);background:var(--brand-50)}
.livelink svg{width:16px;height:16px}

.toggle-inline{display:inline-flex;align-items:center;gap:9px;font-size:13px;color:var(--body);font-weight:500;cursor:pointer}
.modal.onb{max-width:760px}
.modal.modal-article{max-width:800px}
.modal-article .modal-b{max-height:74vh;overflow:auto;padding:8px 24px 12px}
/* onboarding: 2-column field grid, long free-text fields span both columns. No horizontal scroll.
   Each field is a column flex with the input pushed to the bottom so inputs align across the row
   even when one field has help text and its neighbour does not. */
.onb-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;align-items:start}
.onb-grid .field{min-width:0;margin-bottom:0}
.onb-grid .field.full{grid-column:1 / -1}
/* The first toggle row sits right under the fields grid; drop its divider + top padding so the
   field counter does not leave an awkward break above Auto-heal. Later .srow rows keep their line. */
.onb-grid + .srow{border-top:none;padding-top:4px}
.req{color:var(--bad);font-weight:700}
.input.err,.textarea.err{border-color:var(--bad);box-shadow:0 0 0 3px rgba(180,35,24,.12)}
@media(max-width:620px){.onb-grid{grid-template-columns:1fr}}

/* fix preview: side-by-side current vs proposed */
.diff-head,.diff{display:grid;grid-template-columns:150px 1fr 1fr;gap:14px;align-items:start;padding:11px 0;border-bottom:1px solid var(--line-soft)}
.diff-head{padding-top:0;padding-bottom:8px;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}
.diff:last-child{border-bottom:0}
.diff .dl{font-weight:600;color:var(--ink);font-size:13px}
.diff .dv{font-size:13px;line-height:1.55;word-break:break-word}
.diff .dv-now{color:var(--muted)} .diff .dv-new{color:var(--ink)}
.diff-head .dh-new{color:var(--brand)}
.diff-note{font-size:13.5px;color:var(--body);line-height:1.55}
.diff-note.small{font-size:12.5px;color:var(--muted)}
.diff-note code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.crawl-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.robots-code{margin:12px 0;padding:14px 16px;border:1px solid var(--line);border-radius:7px;background:var(--line-soft);font:12.5px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink);white-space:pre-wrap;overflow:auto}
@media(max-width:560px){.diff-head,.diff{grid-template-columns:1fr}.diff-head{display:none}}

/* native select: custom chevron with breathing room from the right border */
select.input{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2356627a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");background-repeat:no-repeat;background-position:right 12px center;background-size:15px;padding-right:38px}
:root[data-theme="dark"] select.input{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a93a6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>")}

/* table paginator footer */
.pager{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-top:1px solid var(--line-soft)}
.pager .pg-info{font-size:12.5px;color:var(--muted)}
.pager .pg-btns{display:flex;gap:8px}

/* segmented filter (audit surface / product filter) */
.seg{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:14px 20px;border-bottom:1px solid var(--line-soft)}
.seg-div{width:1px;align-self:stretch;background:var(--line);margin:2px 8px}
.seg-b{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:13px;font-weight:600;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:7px;padding:6px 12px;cursor:pointer}
.seg-b:hover:not(:disabled){border-color:var(--brand);color:var(--ink)}
.seg-b.on{border-color:var(--brand);color:var(--brand);background:var(--brand-50)}
.seg-b:disabled{opacity:.45;cursor:not-allowed}
.seg-b .seg-n{font-size:11.5px;font-weight:700;color:var(--faint);background:var(--line-soft);border-radius:20px;padding:1px 7px}
.seg-b.on .seg-n{color:var(--brand);background:var(--brand-100)}
:root[data-theme="dark"] .seg-b{background:var(--card)}

/* audit-log table (Change Log) */
.logtable{width:100%;border-collapse:collapse}
.logtable th,.logtable td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line-soft);font-size:13px;vertical-align:middle}
.logtable th{color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.logtable tr:last-child td{border-bottom:0}
.logtable tr.clickable{cursor:pointer} .logtable tr.clickable:hover{background:var(--line-soft)}
.log-act{display:inline-flex;align-items:center;gap:9px;font-weight:600;color:var(--ink);white-space:nowrap}
.log-ic{width:30px;height:30px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-soft);border-radius:7px;color:var(--brand)}
.log-ic .icon{width:15px;height:15px}
.log-where{color:var(--body);max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.log-when{color:var(--muted);white-space:nowrap;font-size:12.5px}

/* products table (store product SEO) - same row layout as the SEO Audit list, with a thumbnail */
.prodtable{display:flex;flex-direction:column}
.prow .prow-thumb{position:relative;flex:0 0 44px;width:44px;height:44px;border-radius:6px;overflow:hidden;border:1px solid var(--line-soft);background:var(--line-soft)}
.prow .prow-thumb .prow-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.prow .prow-thumb .prow-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--faint)}
.prow .prow-thumb .prow-ph svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.prow .meta .u{display:flex;flex-direction:column;gap:1px;white-space:normal}
.prow .prow-name{font-weight:600;color:var(--ink);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prow .prow-url{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prow .prow-pending{display:inline-flex;align-items:center;gap:7px;font-size:12.5px}
.status.optimized{color:var(--good);border-color:var(--good)}
.chip.optimized{color:var(--good);border-color:var(--good)}
/* Resolved badge: a former problem a fix cleared. Green, checkmark, struck text. */
.chip.fixed{color:var(--good);border-color:var(--good)}
.chip.fixed svg{width:11px;height:11px;stroke:var(--good);vertical-align:-1px;margin-right:3px}
.chip.fixed s{text-decoration:line-through;opacity:.75}
.gsc-tool{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line-soft)}
.gsc-tool:last-child{border-bottom:0}
.gsc-tool .gt-t{font-weight:600;color:var(--ink);font-size:13.5px}.gsc-tool .gt-s{color:var(--muted);font-size:12.5px;margin-top:2px}
.gsc-tool .btn{margin-left:auto}
.disc{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid var(--line-soft);font-size:13px}
.disc:last-child{border-bottom:0} .disc .du{flex:1;min-width:0;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.disc .dc{color:var(--muted);font-size:12px}

[data-goto]{cursor:pointer}

/* theme toggle */
.grid-4{grid-template-columns:repeat(4,1fr)}
.btn-icon{background:var(--card);border:1px solid var(--line);color:var(--muted);padding:11px;border-radius:6px}
.btn-icon:hover{background:var(--line-soft);color:var(--ink)}
.ic-moon{display:none} :root[data-theme="dark"] .ic-sun{display:none} :root[data-theme="dark"] .ic-moon{display:inline-block}
:root[data-theme="dark"] .topbar{background:rgba(8,11,18,.88)}

/* ── side drawer (overflow detail without cramming the table) ────────────── */
.drawer-ov{position:fixed;inset:0;background:rgba(10,14,22,.45);z-index:80;opacity:0;pointer-events:none;transition:opacity .18s}
.drawer-ov.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100vh;width:440px;max-width:92vw;background:var(--card);border-left:1px solid var(--line);z-index:81;transform:translateX(100%);transition:transform .22s ease;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 22px;border-bottom:1px solid var(--line-soft)}
.drawer-h .eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:5px}
.drawer-h h3{font-size:17px;word-break:break-word}
.drawer-b{padding:20px 22px;overflow:auto;flex:1}
.drawer-f{padding:16px 22px;border-top:1px solid var(--line-soft);display:flex;gap:9px;justify-content:flex-end}
.dgroup{margin-bottom:20px} .dgroup:last-child{margin-bottom:0}
.dgroup .dg-t{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:9px}
.dlist{display:flex;flex-direction:column;gap:8px}
.dlist .di{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--body);line-height:1.45}
.dlist .di .dib{width:6px;height:6px;border-radius:50%;background:var(--muted);margin-top:6px;flex:0 0 auto}
.dlist .di.high .dib{background:var(--bad)} .dlist .di.high{color:var(--bad)}
.kv{border:1px solid var(--line-soft);border-radius:6px;padding:12px 14px;font-size:13px;color:var(--body);line-height:1.5;white-space:pre-wrap;word-break:break-word}
.kv.before{color:var(--muted)} .kv-l{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);margin-bottom:6px}

/* Search Console */
.gsc-connect{display:flex;align-items:center;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:24px}
.gsc-connect .g-i{display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.gsc-connect .g-i .g-logo{width:34px;height:34px;object-fit:contain;display:block}
.gsc-connect .g-t{font-weight:700;font-size:15px;color:var(--ink)} .gsc-connect .g-s{color:var(--muted);font-size:13px;margin-top:3px;max-width:520px;line-height:1.5}
.gsc-connect .btn{margin-left:auto}
.gmetrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:16px}
.gconn-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--ink);border:1px solid var(--line);padding:4px 10px;border-radius:4px}
.conn-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.conn-prop{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 260px}
.conn-prop .cp-l{flex:0 0 auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.conn-prop .cp-v{font-size:13.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prop-select{flex:1 1 auto;min-width:0;max-width:440px;appearance:none;-webkit-appearance:none;-moz-appearance:none;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink);background-color:var(--card);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2356627a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 11px center;border:1px solid var(--line);border-radius:6px;padding:9px 36px 9px 12px;cursor:pointer;text-overflow:ellipsis}
.prop-select:hover{border-color:var(--brand)}
.prop-select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}
.conn-head .btn{margin-left:auto;flex:0 0 auto}

/* ── metric cards (flat, monochrome) ────────────────────────────────────── */
.mcard{position:relative;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:18px}
.mcard .mc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.mcard .mc-lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.mcard .mc-ic{width:30px;height:30px;border-radius:6px;border:1px solid var(--brand);display:flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--brand)}
.mcard .mc-ic.ac-amber{border-color:var(--warn);color:var(--warn)}
.mcard .mc-ic.ac-green{border-color:var(--good);color:var(--good)}
.mcard .mc-ic svg{width:16px;height:16px}
.mcard .mc-val{font-size:30px;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1.05}
.mcard .mc-val.bad{color:var(--bad)}
.mcard .mc-sub{font-size:12px;color:var(--faint);margin-top:5px}
.mcard .mc-spark{margin-top:12px;height:32px}

/* ── chart card + svg area ──────────────────────────────────────────────── */
.chart-wrap{padding:8px 4px 0}
.chart-wrap svg{display:block;width:100%;height:auto}
.chart-legend{display:flex;gap:18px;padding:0 20px 14px}
.chart-legend .lg{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);font-weight:600}
.chart-legend .lg i{width:10px;height:2px;display:inline-block}

/* ── engine share-of-voice bars ─────────────────────────────────────────── */
.ebars{display:flex;flex-direction:column;gap:13px}
.ebar{display:grid;grid-template-columns:88px 1fr 42px;align-items:center;gap:12px}
.ebar-l{font-size:12.5px;font-weight:700;color:var(--ink)}
.ebar-track{height:8px;background:var(--line-soft);overflow:hidden}
.ebar-track > i{display:block;height:100%;background:var(--brand);transition:width .5s ease}
.ebar-v{font-size:12.5px;font-weight:700;color:var(--muted);text-align:right}

/* ── gsc setup steps ────────────────────────────────────────────────────── */
.setup-steps{list-style:none;margin:14px 0 0;padding:0;counter-reset:s;display:flex;flex-direction:column;gap:12px}
.setup-steps li{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:var(--body);line-height:1.5}
.setup-steps li:before{counter-increment:s;content:counter(s);flex:0 0 auto;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);color:var(--ink);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* ── contact / support ──────────────────────────────────────────────────── */
.textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-family:inherit;font-size:13.5px;color:var(--ink);background-color:#fff;resize:vertical;min-height:108px}
.textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}
:root[data-theme="dark"] .input,:root[data-theme="dark"] .textarea{background-color:var(--card)}

/* tablets: 4-up stat rows become 2-up before collapsing fully */
@media(max-width:1080px){ .grid-4{grid-template-columns:repeat(2,1fr)} }

@media(max-width:820px){
  /* sidebar becomes an off-canvas drawer toggled by the topbar hamburger */
  .side{position:fixed;left:0;top:0;z-index:40;height:100dvh;overflow-y:auto;transform:translateX(-100%);transition:transform .22s ease;box-shadow:2px 0 20px rgba(10,14,22,.12)}
  .side.open{transform:translateX(0)}
  .side-ov{display:block}
  .hamb{display:inline-flex}
  .grid-3,.grid-4,.plans,.gmetrics{grid-template-columns:1fr}
  .content{padding:18px 14px 72px} .bar-inner{padding:12px 14px;gap:10px}
  .topbar h1{font-size:17px}
  /* wide tables scroll horizontally inside their card instead of squishing */
  .card-b{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .mtable,.logtable{min-width:560px}
  /* keep the primary action visible; trim its label room on tiny bars */
  .ta .btn{padding:10px 14px}
}

@media(max-width:520px){
  .grid.grid-2,.grid[style*="1fr 1fr"],.grid[style*="1fr 1fr 1fr"]{grid-template-columns:1fr!important}
  .prow .prow-url{display:none}
  .modal-h{padding:16px 16px 12px} .modal-b{padding:6px 16px} .modal-f{padding:14px 16px 16px}
  .page-actions{flex-wrap:wrap}
  .card-h.with-action{flex-wrap:wrap;gap:10px}
  .btn{padding:11px 16px}
}

/* ── next-gen: accuracy banner, sources, llms.txt, impact ────────────────── */
.callout.warn{border-color:rgba(217,63,63,.35);background:rgba(217,63,63,.05)}
.callout.warn svg{color:var(--bad)}
.src-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-size:12px;color:var(--body);border:1px solid var(--line-soft);padding:4px 9px;border-radius:5px;text-decoration:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.src-chip:hover{border-color:var(--brand);color:var(--brand)}
.src-chip.self{border-color:var(--brand);color:var(--brand);font-weight:600}
.codeblock{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:14px 16px;font-size:12px;line-height:1.6;color:var(--body);white-space:pre-wrap;word-break:break-word;max-height:340px;overflow:auto;font-family:inherit}
.delta{font-weight:700;font-size:12px}
.delta.up{color:var(--good)} .delta.down{color:var(--bad)} .delta.flat{color:var(--muted)}
.acc-item{padding:12px 14px;border-bottom:1px solid var(--line-soft)}
.acc-item:last-child{border-bottom:0}
.acc-claim{font-size:13px;color:var(--bad);line-height:1.5}
.acc-fact{font-size:12.5px;color:var(--muted);margin-top:3px}
.gaprow{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line-soft);font-size:13px;line-height:1.5}
.gaprow:last-child{border-bottom:0}
.gaprow .g-b{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--brand);margin-top:6px}

/* Locked platform sections: the page stays visible beneath a solid overlay with the locked
   illustration. Unlocked by the platform capability map (sl.platform.js), not platform names. */
.page.locked{position:relative;min-height:480px;overflow:hidden}
.lock-ov{position:absolute;inset:0;z-index:30;display:flex;align-items:flex-start;justify-content:center;padding:48px 20px;background:var(--bg);background:color-mix(in srgb, var(--bg) 88%, transparent);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.lock-box{max-width:460px;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:36px 32px;margin-top:24px}
.lock-art{width:276px;max-width:96%;height:auto;display:block;margin:0 auto 18px}
.lock-box h3{font-size:17px;font-weight:700;margin:0 0 8px;color:var(--text)}
.lock-box p{font-size:13.5px;line-height:1.6;color:var(--muted);margin:0}
.blog-lock{margin:48px auto}

/* Workspace switcher (portal sessions; one email, many workspaces) */
.ws-wrap{position:relative}
.ws-wrap .ws-name{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ws-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:260px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px;z-index:60;box-shadow:none}
.ws-item{display:block;width:100%;text-align:left;background:none;border:0;border-radius:6px;padding:9px 11px;cursor:pointer;font-family:inherit}
.ws-item:hover{background:var(--hover, rgba(59,115,246,.06))}
.ws-item.on{cursor:default}
.ws-item.on .ws-item-n::after{content:" ·  current";color:var(--brand);font-weight:400;font-size:12px}
.ws-item-n{display:block;font-size:13.5px;font-weight:700;color:var(--text)}
.ws-item-d{display:block;font-size:12px;color:var(--muted);margin-top:2px;text-transform:capitalize}

/* ── Sam's Suggestions (AI page review) ──────────────────────────────────── */
/* Row action cell holds the Sam pill alongside the existing fix button. */
.row .act{flex:0 0 auto;display:flex;align-items:center;gap:8px}
/* Matches .btn-sm height exactly (padding 10px, font 13px, line-height 1.1, 1px border). */
.sam-pill{display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:13px;font-weight:700;line-height:1.1;padding:10px 14px;border-radius:6px;border:1px solid var(--line-soft);background:var(--card);color:var(--muted);cursor:pointer;white-space:nowrap}
.sam-pill .sam-spark{width:14px;height:14px;fill:currentColor;flex:0 0 auto}
.sam-pill.on{color:var(--brand);border-color:var(--brand-100);background:var(--brand-50)}
button.sam-pill.on:hover{border-color:var(--brand)}
.sam-pill.ok{color:var(--good)}
.sam-pill.applied{color:var(--good);border-color:var(--good)}
.sam-pill.rev{cursor:default}
.sam-pill.rev .sam-spark{animation:samspin 1.4s linear infinite}
@keyframes samspin{to{transform:rotate(360deg)}}
/* Spark glyph in the drawer eyebrow + all-clear state */
.drawer-h .eyebrow .sam-spark{width:12px;height:12px;fill:var(--brand);vertical-align:-1px;margin-right:5px}
.sam-summary{font-size:14px;font-weight:600;color:var(--ink);line-height:1.45;margin-bottom:16px}
.sam-sec{border:1px solid var(--line-soft);border-radius:8px;padding:12px 14px;margin-bottom:10px}
.sam-sec:last-child{margin-bottom:0}
.sam-sec-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.sam-sec-t{font-size:12.5px;font-weight:700;color:var(--ink)}
.sam-sec .chip{text-transform:capitalize}
.sam-issue{font-size:12.5px;color:var(--muted);line-height:1.5}
.sam-suggest{font-size:13px;color:var(--body);line-height:1.5;margin-top:5px}
.sam-val{margin-top:9px;border:1px solid var(--brand-100);background:var(--brand-50);border-radius:6px;padding:8px 10px}
.sam-val-l{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--brand);margin-bottom:3px}
.sam-val-x{font-size:13px;color:var(--ink);line-height:1.45;word-break:break-word}
.sam-allclear{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--good);line-height:1.5;padding:6px 0}
.sam-allclear .sam-spark{width:20px;height:20px;fill:var(--good);flex:0 0 auto}
.sam-trail{display:flex;flex-direction:column}
.sam-trail-row{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.sam-trail-row:last-child{border-bottom:0}
.sam-trail-dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--muted);margin-top:5px}
.sam-trail-dot.applied{background:var(--good)} .sam-trail-dot.dismissed{background:var(--faint)} .sam-trail-dot.superseded{background:var(--line)}
.sam-trail-dot.current,.sam-trail-dot.pending{background:var(--brand)}
.sam-trail-sum{font-size:13px;color:var(--body);line-height:1.45}
.sam-trail-row.current .sam-trail-sum{font-weight:600;color:var(--ink)}
.sam-trail-meta{font-size:11.5px;color:var(--faint);margin-top:2px;text-transform:capitalize}
/* Plain section heading for the Analytics Sam group (bare stat cards, no enclosing card box). */
.sec-head{margin:0 0 14px}
.sec-head h2{font-size:15px;color:var(--ink)}
.sec-head p{margin:3px 0 0;color:var(--muted);font-size:12.5px}
/* Dedicated Audit Trail: per-row trail icon button + before/after timeline. */
.sam-trail-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 auto;padding:0;border:1px solid var(--line-soft);border-radius:6px;background:var(--card);color:var(--muted);cursor:pointer}
.sam-trail-btn:hover{border-color:var(--brand);color:var(--brand)}
.sam-trail-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Clean stacked cards, generous spacing, no timeline rail/connector lines. */
.tl{display:flex;flex-direction:column;gap:28px}
.tl-card{min-width:0;border:1px solid var(--line-soft);border-radius:8px;padding:18px 20px}
.samtrail-ext{display:inline-flex;align-items:center;vertical-align:-3px;margin-left:6px;color:var(--brand)}
.samtrail-ext svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.samtrail-ext:hover{color:var(--brand-600)}
.tl-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.tl-when{font-size:12px;color:var(--faint)}
.tl-status{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);border:1px solid var(--line-soft);padding:2px 8px;border-radius:4px}
.tl-status.current,.tl-status.pending{color:var(--brand);border-color:var(--brand)}
.tl-status.applied{color:var(--good);border-color:var(--good)}
.tl-sum{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.45;margin-bottom:10px}
.tl-note{font-size:12.5px;color:var(--muted);line-height:1.5}
.ba{margin-top:10px} .ba:first-child{margin-top:0}
.ba-l{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);margin-bottom:5px}
.ba-applied{color:var(--good);border:1px solid var(--good);border-radius:4px;padding:0 5px;font-size:9.5px;margin-left:4px;vertical-align:1px}
.ba-cols{display:flex;align-items:stretch;gap:10px}
.ba-col{flex:1;min-width:0;border:1px solid var(--line-soft);border-radius:6px;padding:8px 10px;background:var(--bg)}
.ba-col.after{border-color:var(--brand-100);background:var(--brand-50)}
.ba-tag{display:block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);margin-bottom:3px}
.ba-col.after .ba-tag{color:var(--brand)}
.ba-v{font-size:12.5px;color:var(--ink);line-height:1.45;word-break:break-word}
.ba-v em{color:var(--faint);font-style:italic}
.ba-arrow{flex:0 0 auto;align-self:center;color:var(--faint);font-size:16px}
@media(max-width:560px){ .ba-cols{flex-direction:column} .ba-arrow{transform:rotate(90deg)} }