/* Region quick-nav strip under the header */
.region-strip{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:12px 0;border-bottom:1px solid var(--panel-border);font-size:12.5px}
.region-strip-label{color:var(--text-faint);margin-right:6px;font-size:11.5px;letter-spacing:1px}
.region-strip a{color:var(--text-dim);text-decoration:none;padding:4px 11px;border-radius:8px;transition:.15s}
.region-strip a:hover{color:#fff;background:rgba(96,165,250,.18)}

/* ============================================================
   Report pages — full MD report rendering
   ============================================================ */
.report-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:32px;padding:36px 24px 60px;align-items:start}
/* No headings to outline (rare) -> single column, no empty 280px sidebar slot */
.report-layout-solo{grid-template-columns:minmax(0,1fr);max-width:900px}
.report-toc{position:sticky;top:80px;max-height:calc(100vh - 110px);overflow-y:auto;background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:18px;font-size:12.5px}
.report-toc .toc-title{font-size:11px;letter-spacing:1.6px;font-weight:700;color:var(--accent);text-transform:uppercase;margin-bottom:12px}
.report-toc ul{list-style:none;margin:0;padding:0}
.report-toc li{margin:2px 0}
.report-toc li.toc-h3 a{padding-left:14px;color:var(--text-faint)}
.report-toc a{color:var(--text-dim);text-decoration:none;display:block;padding:3px 8px;border-radius:6px;line-height:1.4}
.report-toc a:hover{color:#fff;background:rgba(255,255,255,.08)}
.report-toc::-webkit-scrollbar{width:6px}
.report-toc::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:99px}

/* ---- Article body ---- */
.report-body{min-width:0}
.report-body h1{font-size:34px;margin:0 0 6px;letter-spacing:-.6px;line-height:1.2}
.report-body h1 + p.subtitle{font-size:17px;color:var(--text-dim);margin:0 0 22px;font-weight:600;letter-spacing:0}
.report-body h2{font-size:23px;margin:42px 0 14px;padding-bottom:10px;border-bottom:1px solid var(--panel-border);letter-spacing:-.3px}
.report-body h3{font-size:18px;margin:28px 0 10px;color:var(--accent)}
.report-body h4{font-size:15.5px;margin:20px 0 8px}
.report-body p{color:var(--text-dim);font-size:14.5px;line-height:1.75;margin:10px 0}
.report-body strong{color:#fff;font-weight:650}
.report-body ul,.report-body ol{margin:10px 0;padding-left:24px}
.report-body li{margin:6px 0;color:var(--text-dim);font-size:14px;line-height:1.7}
.report-body a{color:var(--accent);text-decoration:none;word-break:break-all}
.report-body a:hover{text-decoration:underline}

/* blockquote = data caveats */
.report-body blockquote{
  margin:16px 0;padding:14px 18px;background:rgba(251,191,36,.07);
  border-left:4px solid var(--warn);border-radius:0 10px 10px 0;color:var(--text-dim);font-size:13.5px
}
.report-body blockquote p{margin:4px 0}
.report-body blockquote strong{color:var(--warn)}

/* tables */
.report-body .table-scroll{margin:16px 0;overflow-x:auto;border:1px solid var(--panel-border);border-radius:12px;background:var(--panel)}
.report-body table{width:100%;border-collapse:collapse;font-size:13px;min-width:640px}
.report-body th{background:rgba(255,255,255,.06);text-align:left;padding:10px 12px;font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--text-faint);white-space:nowrap}
.report-body td{padding:9px 12px;border-top:1px solid rgba(255,255,255,.07);color:var(--text-dim);vertical-align:top}
.report-body tr:hover td{background:rgba(255,255,255,.03)}
.report-body td strong,.report-body td b{color:#fff}

/* code */
.report-body code{background:rgba(255,255,255,.09);padding:2px 6px;border-radius:5px;font-size:12.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.report-body pre{background:rgba(0,0,0,.3);border:1px solid var(--panel-border);border-radius:12px;padding:16px;overflow-x:auto}
.report-body pre code{background:none;padding:0}

/* hr */
.report-body hr{border:none;border-top:1px solid var(--panel-border);margin:28px 0}

/* highlight tokens used in reports */
.report-body del{color:var(--text-faint)}
.report-body mark{background:rgba(52,211,153,.18);color:var(--good);padding:0 4px;border-radius:4px}

@media(max-width:900px){
  .report-layout{grid-template-columns:1fr;padding:24px 16px 50px}
  .report-toc{position:static;max-height:none;margin-bottom:18px}
}

/* ============================================================
   Q&A blocks (region + platform pages) — content organized as
   question -> answer instead of numbered report sections.
   ============================================================ */
.qa-block{margin:40px 0}
.qa-question{display:flex;align-items:flex-start;gap:12px;font-size:20px;font-weight:750;color:#fff;margin:0 0 14px;letter-spacing:-.2px;line-height:1.35}
.qa-question .q-mark{flex:0 0 auto;width:28px;height:28px;margin-top:2px;border-radius:8px;background:rgba(96,165,250,.16);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800}
.qa-answer{color:var(--text-dim);font-size:14.5px;line-height:1.7}
.qa-answer p{margin:0 0 10px}
.qa-answer ul{margin:8px 0;padding-left:22px}
.qa-answer li{margin:6px 0;line-height:1.65}
.qa-detail{margin-top:16px}
.qa-detail summary{cursor:pointer;color:var(--accent);font-size:13px;font-weight:600;padding:8px 0;list-style:none}
.qa-detail summary::-webkit-details-marker{display:none}
.qa-detail summary::before{content:'▸ ';display:inline-block;transition:transform .15s}
.qa-detail[open] summary::before{content:'▾ '}
.qa-detail .report-body{margin-top:10px;padding:18px 20px;background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius)}

/* rank/share bar chart. Chart.js's responsive:true + maintainAspectRatio:
   false needs a height-CONSTRAINED positioned parent to size against —
   without one it has no bound to fill and grows arbitrarily tall. */
.chart-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:20px 22px;margin:16px 0}
.chart-canvas-wrap{position:relative;width:100%}
.chart-legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px;padding-top:12px;border-top:1px solid var(--panel-border);font-size:11.5px;color:var(--text-faint)}
.chart-legend span{display:inline-flex;align-items:center;gap:6px}
.chart-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
