/* claude — reports-claude.css
   /reports hub + /reports/{slug} detail (ReportsController). The .mkr-* rules are the Claude Design
   "Reports Hub + Agency Outcome Rates" handoff (2026-09-27, src/marketing-reports.css) as delivered.
   Loads after marketing-core-claude.css (tokens, .mk-page, .mk-section-eyebrow, .mk-cta, .mk-btn). */

/* ---- breadcrumb bar — the site's .mk-wiki-bar (defined in library-article-claude.css, which these
   pages don't load); non-sticky. Gutters match the Resources-section (library) pages: 1280px max, 56px,
   18px at <=820px ---- */
.mkr-page .mk-wiki-bar{background:#ffffff;border-bottom:1px solid var(--mk-line)}
.mkr-page .mk-wiki-bar-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:12px 56px;font-size:12.5px}
.mkr-page .mk-wiki-breadcrumb{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.10em;text-transform:uppercase;color:var(--mk-text-mute);font-weight:600}
.mkr-page .mk-wiki-breadcrumb a{color:var(--mk-text-soft);text-decoration:none}
.mkr-page .mk-wiki-breadcrumb a:hover{color:var(--mk-teal-3)}
.mkr-page .mk-wiki-breadcrumb-sep{color:var(--mk-line-strong)}
@media (max-width:820px){.mkr-page .mk-wiki-bar-inner{padding:10px 18px;gap:12px;flex-wrap:wrap}}
@media (max-width:600px){.mkr-page .mk-wiki-breadcrumb{font-size:10px;gap:6px}}

/* ---- meta-row dot separator (the site's .mk-dot) ---- */
.mkr-meta .mk-dot{width:3px;height:3px;border-radius:50%;background:var(--mk-text-mute);display:inline-block}

/* ---- design handoff rules ---- */
.mkr-page{background:var(--mk-bg);--mkr-amber:#9a5b00;--mkr-s:var(--mk-teal-5);--mkr-c:var(--mk-teal-1)}
.mkr-inner{max-width:1280px;margin:0 auto;padding:0 56px;width:100%;min-width:0;box-sizing:border-box}.mkr-table-block,.mkr-scroll,.mkr-sec{min-width:0}
.mkr-head{padding:56px 0 48px;background:var(--mk-card);border-bottom:1px solid var(--mk-line)}
.mkr-h{font-family:var(--font-display);font-weight:600;font-size:clamp(40px,5vw,60px);line-height:1.04;letter-spacing:-0.02em;color:var(--mk-teal-1);margin:10px 0 16px}
.mkr-dek{font-size:18px;line-height:1.55;color:var(--mk-text-soft);max-width:760px;margin:0;text-wrap:pretty}
.mkr-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px;font-size:13px;color:var(--mk-text-soft)}
.mkr-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:40px;border-top:1px solid var(--mk-line)}
.mkr-stat{display:flex;flex-direction:column;gap:8px;padding:22px 24px 0 0}
.mkr-stat+.mkr-stat{padding-left:24px;border-left:1px solid var(--mk-line)}
.mkr-stat-v{font-family:var(--font-display);font-weight:600;font-size:44px;line-height:1;letter-spacing:-0.02em;color:var(--mk-teal-2)}
.mkr-stat-l{font-size:13.5px;line-height:1.45;color:var(--mk-text-soft);max-width:220px}
.mkr-toc{position:sticky;top:0;z-index:5;background:rgba(245,247,246,0.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--mk-line)}
.mkr-toc-inner{display:flex;gap:28px;overflow-x:auto}
.mkr-toc a{padding:14px 0;font-size:13.5px;font-weight:600;color:var(--mk-text-soft);text-decoration:none;white-space:nowrap}
.mkr-toc a:hover{color:var(--mk-teal-3)}
.mkr-body{padding-top:56px;padding-bottom:96px}
.mkr-sec{margin-bottom:72px}
.mkr-sec-head{margin-bottom:20px}
.mkr-h2{font-family:var(--font-display);font-weight:600;font-size:32px;line-height:1.15;color:var(--mk-teal-1);margin:0 0 8px}
.mkr-h3{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;color:var(--mk-text);margin:48px 0 4px}
.mkr-h3-n{font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--mk-teal-4);background:var(--mk-inset);padding:2px 8px;border-radius:99px}
.mkr-sec-sub{font-size:15px;line-height:1.55;color:var(--mk-text-soft);max-width:760px;margin:0;text-wrap:pretty}
.mkr-method{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;padding:32px;background:var(--mk-card);border:1px solid var(--mk-line);border-radius:var(--mk-radius)}
.mkr-method p{font-size:15.5px;line-height:1.6;color:var(--mk-text-soft);margin:0}
.mkr-defs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 32px;margin:0}
.mkr-defs dt{font-size:12px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--mk-teal-4);margin-bottom:6px}
.mkr-defs dd{margin:0;font-size:14.5px;line-height:1.55;color:var(--mk-text-soft)}
.mkr-amber{color:var(--mkr-amber)}
.mkr-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px}
.mkr-tools-l{font-size:13px;font-weight:600;color:var(--mk-text-soft)}
.mkr-chips{display:flex;flex-wrap:wrap;gap:6px}
.mkr-chip{font:inherit;font-size:13px;font-weight:600;padding:7px 13px;border-radius:99px;border:1px solid var(--mk-line-strong);background:var(--mk-card);color:var(--mk-text-soft);cursor:pointer}
.mkr-chip:hover{border-color:var(--mk-teal-5);color:var(--mk-teal-3)}
.mkr-chip.on{background:var(--mk-teal-2);border-color:var(--mk-teal-2);color:#fff}
.mkr-legend{margin-left:auto;display:flex;gap:16px;font-size:12.5px;color:var(--mk-text-soft)}
.mkr-legend span{display:flex;align-items:center;gap:6px}
.mkr-legend i{width:12px;height:8px;border-radius:2px;display:inline-block}
.mkr-lg-s{background:var(--mkr-s)}.mkr-lg-c{background:var(--mkr-c)}
.mkr-scroll{overflow-x:auto;background:var(--mk-card);border:1px solid var(--mk-line);border-radius:var(--mk-radius)}
.mkr-table{width:100%;min-width:980px;border-collapse:collapse;font-size:14px}
.mkr-th{position:sticky;top:0;text-align:left;font-size:11.5px;font-weight:700;letter-spacing:0.07em;text-transform:uppercase;color:var(--mk-text-soft);padding:14px 16px;border-bottom:1px solid var(--mk-line-strong);background:var(--mk-card);white-space:nowrap}
.mkr-th-ag{width:34%}
.mkr-num{text-align:right}
.mkr-bar-th{width:18%}
.mkr-scale{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10.5px;letter-spacing:0;text-transform:none;color:var(--mk-text-mute)}
.mkr-tr{cursor:pointer}
.mkr-tr:hover .mkr-td{background:#fafbfa}
.mkr-td{padding:14px 16px;border-bottom:1px solid var(--mk-line-soft);vertical-align:top}
.mkr-tr.open .mkr-td{border-bottom-color:transparent}
.mkr-ag-top{display:flex;align-items:flex-start;gap:10px}
.mkr-st{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:22px;padding:0 6px;border-radius:5px;background:var(--mk-inset);font-family:var(--font-mono);font-size:11px;font-weight:600;color:var(--mk-teal-3)}
.mkr-st.fed{background:var(--mk-teal-2);color:#fff}
.mkr-ag-name{font-weight:600;color:var(--mk-text);line-height:1.4}
.mkr-ag-abbr{font-weight:500;color:var(--mk-text-soft)}
.mkr-ag-meta{display:block;margin:4px 0 0 40px;font-size:12.5px;line-height:1.45;color:var(--mk-text-soft)}
.mkr-count{display:block;font-variant-numeric:tabular-nums;font-weight:600;color:var(--mk-text)}
.mkr-count.mkr-amber{color:var(--mkr-amber)}
.mkr-pct{display:block;font-variant-numeric:tabular-nums;font-size:13px;color:var(--mk-text-soft);margin-top:2px}
.mkr-sub{display:block;font-size:11.5px;color:var(--mk-text-soft);margin-top:3px;white-space:nowrap}
.mkr-np{font-size:12.5px;color:var(--mk-text-soft);font-style:italic}
.mkr-bar-td{vertical-align:middle}
.mkr-bar{position:relative;display:flex;height:10px;border-radius:3px;background:repeating-linear-gradient(90deg,var(--mk-line-soft) 0 1px,transparent 1px 25%) ,var(--mk-inset);overflow:hidden}
.mkr-bar-s{background:var(--mkr-s)}
.mkr-bar-c{background:var(--mkr-c)}
.mkr-bar-floor{width:14px;background:repeating-linear-gradient(135deg,var(--mkr-s) 0 2px,transparent 2px 4px)}
.mkr-tog-td{width:36px;vertical-align:middle}
.mkr-tog{display:inline-flex;color:var(--mk-text-mute);transition:transform .15s}
.mkr-tr.open .mkr-tog{transform:rotate(180deg);color:var(--mk-teal-4)}
.mkr-tr-sum .mkr-td,.mkr-tr-note.mkr-tr-sum td{background:#eef3f1}
.mkr-tr-sum:hover .mkr-td{background:#e8efec}
.mkr-tr-sum .mkr-st{background:var(--mk-teal-4);color:#fff}
.mkr-tr-sum+.mkr-tr:not(.mkr-tr-sum) .mkr-td{border-top:1px solid var(--mk-line-strong)}
.mkr-tr-note td{padding:0 16px 18px 56px;border-bottom:1px solid var(--mk-line-soft)}
.mkr-note{max-width:820px;font-style:normal}.mkr-note p{font-style:normal}
.mkr-note p{margin:0 0 10px;font-size:14px;line-height:1.6;color:var(--mk-text-soft)}
.mkr-flag{color:var(--mkr-amber)}
.mkr-src{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;font-size:12.5px;color:var(--mk-teal-3)}
.mkr-src-h{font-family:var(--font-mono);font-size:10.5px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--mk-text-soft)}
.mkr-nodata{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.mkr-nodata li{display:flex;gap:12px;padding:16px;background:var(--mk-card);border:1px solid var(--mk-line);border-radius:var(--mk-radius-sm)}
.mkr-nd-name{font-size:14px;font-weight:600;color:var(--mk-text);line-height:1.4}
.mkr-nd-note{font-size:13.5px;line-height:1.5;color:var(--mk-text-soft);margin-top:4px}
.mkr-nd-src{font-size:12px;color:var(--mk-teal-4);margin-top:6px}
.mkr-noagency{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.mkr-noagency li{display:flex;flex-direction:column;gap:4px;padding:12px 16px;background:var(--mk-card);border:1px solid var(--mk-line);border-radius:var(--mk-radius-sm);font-size:14px;max-width:380px}
.mkr-noagency span{font-size:13px;line-height:1.5;color:var(--mk-text-soft)}
.mkr-notes p{font-size:15px;line-height:1.6;color:var(--mk-text-soft);max-width:760px;margin:0}
.mkr-list{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.mkr-card{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;padding:32px;background:var(--mk-card);border:1px solid var(--mk-line);border-radius:var(--mk-radius);text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s}
.mkr-card:hover{border-color:var(--mk-teal-6);box-shadow:0 10px 30px rgba(7,44,44,0.08)}
.mkr-card-k{font-size:12px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--mk-teal-4)}
.mkr-card-t{font-family:var(--font-display);font-weight:600;font-size:32px;line-height:1.15;color:var(--mk-teal-1);margin:8px 0 10px}
.mkr-card-d{font-size:15.5px;line-height:1.55;color:var(--mk-text-soft);margin:0;text-wrap:pretty}
.mkr-card-go{font-weight:600;color:var(--mk-teal-3)}
.mkr-card-fig{display:flex;flex-direction:column;justify-content:center;gap:10px;padding-left:40px;border-left:1px solid var(--mk-line)}
.mkr-page a:not([class]){color:var(--mk-teal-3)}
.mkr-page a:not([class]):hover{color:var(--mk-teal-1)}
@media (max-width:900px){
.mkr-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.mkr-stat:nth-child(3){padding-left:0;border-left:0}
.mkr-method{grid-template-columns:1fr;gap:24px}
.mkr-card{grid-template-columns:1fr;gap:24px}
.mkr-card-fig{padding-left:0;border-left:0;border-top:1px solid var(--mk-line);padding-top:20px}
.mkr-legend{margin-left:0}
}
@media (max-width:600px){
.mkr-defs{grid-template-columns:1fr}
.mkr-stat-v{font-size:36px}
}

/* ---- production additions: the row toggle is a real button (aria-expanded) ---- */
.mkr-tog-btn{appearance:none;border:0;background:none;padding:4px;margin:-4px;cursor:pointer;display:inline-flex;color:inherit;border-radius:4px}
.mkr-tog-btn:focus-visible{outline:2px solid var(--mk-teal-5);outline-offset:2px}
.mkr-tr-note[hidden]{display:none}
/* the handoff's `.mkr-page a:not([class])` outranks `.mkr-toc a` / `.mk-wiki-breadcrumb a` (class-less links);
   restore the README spec colours: section nav #5a5a5a → hover teal-3, breadcrumb links text-soft */
.mkr-page .mkr-toc a{color:var(--mk-text-soft)}
.mkr-page .mkr-toc a:hover{color:var(--mk-teal-3)}
.mkr-page .mk-wiki-breadcrumb a{color:var(--mk-text-soft)}
.mkr-page .mk-wiki-breadcrumb a:hover{color:var(--mk-teal-3)}

/* ---- header text centred, as on the Resources-section (library) pages; the stat strip stays left-aligned ---- */
.mkr-head{text-align:center}
.mkr-head .mkr-dek{margin-left:auto;margin-right:auto}
.mkr-head .mkr-meta{justify-content:center}
.mkr-head .mkr-stats{text-align:left}

/* ---- mobile gutter: 18px at <=820px, flush with the breadcrumb bar (after the base .mkr-inner rule so it wins) ---- */
@media (max-width:820px){.mkr-inner{padding:0 18px}}

/* ---- % sits above the count and is the primary figure (the count's former weight); a count under a
   % becomes the secondary line. Count-only cells (Claims closed) keep the bold count. ---- */
.mkr-td .mkr-pct{margin-top:0;font-size:14px;font-weight:600;color:var(--mk-text)}
.mkr-pct+.mkr-count{margin-top:2px;font-size:13px;font-weight:400;color:var(--mk-text-soft)}
.mkr-pct+.mkr-count.mkr-amber{color:var(--mkr-amber)}

/* ---- state filter (a select styled as a chip) + the summary divider on the first visible agency row ---- */
.mkr-select{appearance:none;-webkit-appearance:none;font:inherit;font-size:13px;font-weight:600;padding:7px 32px 7px 13px;border-radius:99px;border:1px solid var(--mk-line-strong);background:var(--mk-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5 L6 7.5 L9 4.5' stroke='%235a5a5a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;color:var(--mk-text-soft);cursor:pointer;margin-right:8px}
.mkr-select:hover{border-color:var(--mk-teal-5);color:var(--mk-teal-3)}
.mkr-select:focus-visible{outline:2px solid var(--mk-teal-5);outline-offset:2px}
.mkr-tr.mkr-first .mkr-td{border-top:1px solid var(--mk-line-strong)}

/* ---- Notes: gap between paragraphs (the license line follows the notes paragraph) ---- */
.mkr-notes p+p{margin-top:12px}