/* GENERATED from brand/app/report.css — DO NOT EDIT. Run: node brand/sync.mjs */
/* report.css — the Market Map document's own stylesheet: the base reset it needs plus every block
   it renders (.mast, .tiles, .verdict, .badge, .tw, .rangebar, .pool, .ladder, .chip, .c …).
   Generated from engine/scripts/render/shell.html — screen styles only; the PDF-print @page rules
   stay in the render engine. Regenerate rather than hand-edit, or the portal and the PDF drift.

   APP-ONLY, which is why it lives under brand/app: the marketing site never renders a Market Map.
   Its tokens come from brand/core/tokens.mjs, loaded as tokens.css BEFORE this file. */
*{box-sizing:border-box;}
body{margin:0;}
.page{
  background-color:var(--paper); color:var(--ink);
  font-family:var(--body); font-size:15px; line-height:1.62; font-weight:400;
  font-synthesis-weight:none; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; font-variant-numeric:tabular-nums;
  background-image:radial-gradient(circle at 1px 1px,var(--dot) 1px,transparent 0); background-size:4px 4px;
}
::selection{background:var(--emerald); color:#fff;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
h1,h2,h3,h4{font-family:var(--display); font-weight:500; letter-spacing:-.02em; line-height:1.06; margin:0;}
b,strong{font-weight:600;}
a{color:inherit;}

/* toolbar / section index */
.bar{position:sticky; top:0; z-index:30; background:color-mix(in srgb,var(--paper) 86%,transparent); backdrop-filter:saturate(1.3) blur(9px); border-bottom:1px solid var(--line);}
.bar .wrap{display:flex; align-items:center; justify-content:space-between; height:56px; gap:20px;}
.brand{display:flex; align-items:center; gap:9px; font-weight:700; font-size:14px; letter-spacing:-.01em; white-space:nowrap;}
.brand .ms-mark{flex:none; width:19px; height:19px; color:var(--emerald); display:block;}
.brand small{color:var(--muted); font-weight:500;}
.idx{display:flex; gap:4px; overflow-x:auto; -ms-overflow-style:none; scrollbar-width:none;}
.idx::-webkit-scrollbar{display:none;}
.idx a{font-size:12.5px; color:var(--muted); padding:6px 10px; border-radius:7px; white-space:nowrap; transition:color .15s, background .15s;}
.idx a:hover{color:var(--ink); background:var(--paper-2);}
.tools{display:flex; align-items:center; gap:10px;}
.toggle{font-size:12px; color:var(--ink-soft); background:transparent; border:1px solid var(--line-strong); border-radius:999px; padding:6px 12px; cursor:pointer; display:flex; gap:7px; align-items:center; font-family:var(--body);}
.toggle:hover{border-color:var(--emerald); color:var(--emerald);}
.toggle:focus-visible{outline:2px solid var(--emerald); outline-offset:2px;}

.eyebrow{font-size:11.5px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-soft);}
.eyebrow.accent{color:var(--emerald);}
/* Content section sub-heads announce a NEW topic mid-report. The render bakes them as
   <span class="eyebrow" style="display:block; margin-bottom:10px"> with no top margin, so
   they collide with the block above and sit tight to the table/section below. Elevate them
   into a heading that catches the eye (larger · bolder · emerald · a hairline lead-rule) and
   give them real air above/below. Targeted via the inline display:block so the quiet
   label-eyebrows (gauge/tile/masthead kicker) keep their small treatment. */
.eyebrow[style*="display:block"]{
  font-size:13.5px; font-weight:700; letter-spacing:.09em; color:var(--emerald);
  margin:36px 0 16px !important; padding-top:20px; border-top:1px solid var(--line);
}
/* …but NOT when the subhead is a lead-in nested inside a .point cell — there it shares a
   grid row with the point's marker (the "05"), so the section-heading margin/rule would shove
   it down and orphan the marker above a stray line. Keep those as a quiet inline kicker. */
.point .eyebrow[style*="display:block"]{
  font-size:11.5px; font-weight:700; letter-spacing:.08em;
  margin:0 0 6px !important; padding-top:0; border-top:0;
}
.tag{font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); border:1px solid var(--line-strong); padding:4px 9px; border-radius:999px; white-space:nowrap;}

/* masthead */
.mast{position:relative; padding:76px 0 46px; border-bottom:1px solid var(--line); overflow:hidden;}
.mast .bg{position:absolute; right:-155px; top:-128px; width:436px; height:436px; opacity:.4; pointer-events:none;}
.mast h1{font-size:clamp(1.95rem,6vw,4.9rem); font-weight:500; max-width:15ch; margin:16px 0 0; text-wrap:balance; overflow-wrap:anywhere;}
.mast h1 em{font-style:italic; color:var(--emerald);}
.lede{font-size:19px; line-height:1.55; color:var(--ink-soft); max-width:62ch; margin:22px 0 0;}
.lede b{color:var(--ink);}
.metarow{display:flex; flex-wrap:wrap; gap:12px 30px; margin-top:28px; padding-top:22px; border-top:1px solid var(--line);}
.metarow .m{display:flex; flex-direction:column; gap:3px;}
.metarow .m .k{font-size:11.5px; letter-spacing:.11em; text-transform:uppercase; color:var(--muted);}
.metarow .m .v{font-size:14px; color:var(--ink); font-weight:600;}
.howto{margin-top:22px; font-style:italic; font-family:var(--display); font-size:17px; color:var(--ink-soft);}

/* sections */
section{padding:58px 0; border-bottom:1px solid var(--line);}
section.alt{background:var(--paper-2);}
.shead{display:flex; align-items:baseline; gap:14px; margin-bottom:8px;}
.shead .no{font-size:13px; color:var(--emerald); font-weight:700; font-family:var(--body);}
.shead h2{font-size:clamp(1.7rem,3vw,2.5rem); font-weight:500;}
.sdek{color:var(--ink-soft); font-size:15px; max-width:70ch; margin:0 0 26px; line-height:1.6;}
.sdek b{color:var(--ink);}

/* verdict callout */
.verdict{font-family:var(--display); font-style:italic; font-size:clamp(1.25rem,2.3vw,1.6rem); line-height:1.42; color:var(--ink); border-left:2px solid var(--emerald); padding:2px 0 2px 22px; margin:0 0 26px; max-width:64ch;}
.verdict .u{font-style:normal; background:linear-gradient(transparent 60%,color-mix(in srgb,var(--emerald) 22%,transparent) 60%); padding:0 1px;}

/* citations */
.c{font-family:var(--body); font-size:11px; font-weight:700; vertical-align:super; color:var(--emerald); margin-left:2px; cursor:help; border-bottom:1px dotted color-mix(in srgb,var(--emerald) 45%,transparent); line-height:0; white-space:nowrap;}

/* badges */
.badge{display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:3px 8px; border-radius:5px; width:fit-content; font-family:var(--body);}
.badge::before{content:""; width:5px; height:5px; border-radius:50%;}
.badge.fact{color:var(--fact); background:var(--fact-bg);} .badge.fact::before{background:var(--emerald);}
.badge.est{color:var(--est); background:var(--est-bg);} .badge.est::before{background:var(--est);}
.badge.inf{color:var(--inf); background:var(--inf-bg);} .badge.inf::before{background:var(--inf);}

/* stat tiles — hairline grid */
.tiles{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.tile{background:var(--paper); padding:20px 18px; display:flex; flex-direction:column; gap:9px; min-height:150px;}
section.alt .tile{background:var(--paper-2);}
.tile .k{font-size:11.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted);}
.tile .v{font-family:var(--display); font-weight:500; font-size:34px; letter-spacing:-.02em; line-height:1; color:var(--ink);}
.tile .v small{font-size:16px; color:var(--muted);}
.tile .s{font-size:13px; color:var(--ink-soft); line-height:1.45; margin-top:auto;}
.tile .up{color:var(--emerald); font-weight:700;}

/* two-column */
.cols{display:grid; grid-template-columns:1.1fr 1fr; gap:44px; align-items:start;}
.stack{display:flex; flex-direction:column; gap:18px;}
.point{display:grid; grid-template-columns:20px 1fr; gap:12px; font-size:15px; line-height:1.6; color:var(--ink-soft);}
.point .a{color:var(--emerald); font-weight:700;}
.point b{color:var(--ink);}

/* tables */
.tw{overflow-x:auto; border:1px solid var(--line); border-radius:12px; background:var(--raised);}
section.alt .tw{background:var(--paper);}
table{border-collapse:collapse; width:100%; font-size:14px;}
th{font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); text-align:left; padding:12px 15px; border-bottom:1px solid var(--line-strong); background:color-mix(in srgb,var(--paper-2) 60%,transparent);}
td{padding:12px 15px; border-bottom:1px solid var(--line); color:var(--ink-soft); vertical-align:top; line-height:1.5;}
tbody tr:last-child td{border-bottom:0;}
td .co{color:var(--ink); font-weight:600;}
td.n,th.n{text-align:right; font-variant-numeric:tabular-nums;}
td.n{color:var(--ink); font-weight:600;}
.cap{font-size:13px; color:var(--muted); margin-top:10px; line-height:1.55;}
pre.code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; line-height:1.55; color:var(--ink-soft); background:var(--raised); border:1px solid var(--line); border-left:2px solid var(--emerald); border-radius:8px; padding:12px 14px; margin:0; white-space:pre-wrap; overflow-x:auto;}
section.alt pre.code{background:var(--paper);}
.hbars{display:flex; flex-direction:column; gap:11px; margin:4px 0 2px;}
.hbar{display:grid; grid-template-columns:96px 1fr auto; gap:14px; align-items:center;}
.hbar .hl{font-size:13px; color:var(--ink); font-weight:600;}
.hbar .ht{height:15px; background:color-mix(in srgb,var(--line) 72%,var(--paper)); border-radius:999px; overflow:hidden;}
.hbar .hf{height:100%; border-radius:999px; background:linear-gradient(90deg,color-mix(in srgb,var(--emerald) 55%,var(--paper)),var(--emerald));}
.hbar .hv{font-size:13px; color:var(--ink); font-weight:700; font-variant-numeric:tabular-nums; min-width:52px; text-align:right;}

/* pool rings */
.pool{display:grid; grid-template-columns:330px 1fr; gap:46px; align-items:center;}
.eye{width:min(320px,100%); aspect-ratio:1/1; height:auto; margin:0 auto; position:relative;}
.eye svg{width:100%; height:100%; display:block; overflow:visible;}
.rseg{transition:opacity .16s;}
.pool:hover .rseg{opacity:.5;} .pool .rseg:hover{opacity:1;}
.rl{display:flex; flex-direction:column;}
.rrow{display:grid; grid-template-columns:14px 1fr auto; gap:14px; align-items:center; padding:15px 2px; border-bottom:1px solid var(--line);}
.rrow:last-child{border-bottom:0;}
.sw{width:13px; height:13px; border-radius:4px;}
.rrow .nm{font-weight:600; font-size:15px; color:var(--ink);}
.rrow .df{font-size:13px; color:var(--muted); margin-top:3px; line-height:1.45;}
.rrow .ct{text-align:right;}
.rrow .ct .b{font-family:var(--display); font-weight:500; font-size:21px; letter-spacing:-.01em; color:var(--ink);}
.rrow .ct .ne{font-size:12px; color:var(--muted);}
.gauge{margin-top:22px; background:var(--raised); border:1px solid var(--line); border-radius:12px; padding:18px 20px;}
section.alt .gauge{background:var(--paper);}
.gauge .t{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:12px;}
.gauge .sc{font-family:var(--display); font-weight:500; font-size:24px; color:var(--ink);}
.gauge .sc small{color:var(--muted); font-size:15px;}
.gtrack{display:flex; gap:5px;}
.gtrack i{flex:1; height:10px; border-radius:3px; background:var(--line-strong);}
.gtrack i.on{background:var(--emerald);}
.gauge .nt{font-size:13px; color:var(--ink-soft); margin-top:12px; line-height:1.5;}

/* comp range bar */
.rangebar{position:relative; height:66px; margin:38px 0 6px;}
.rt{position:absolute; left:0; right:0; top:28px; height:10px; background:color-mix(in srgb,var(--line) 70%,var(--paper)); border:1px solid var(--line); border-radius:999px;}
.rband{position:absolute; top:28px; height:10px; border-radius:999px; background:linear-gradient(90deg,color-mix(in srgb,var(--emerald) 30%,var(--paper)),var(--emerald));}
.rc{position:absolute; top:16px; width:3px; height:34px; background:var(--emerald-dark); border-radius:2px; transform:translateX(-50%);}
.rc::after{content:""; position:absolute; left:50%; top:-6px; width:13px; height:13px; background:var(--emerald-dark); border:2.5px solid var(--paper); border-radius:50%; transform:translateX(-50%);}
.rk{position:absolute; top:44px; transform:translateX(-50%); font-size:12px; color:var(--ink-soft); white-space:nowrap;}
.rk.mid{color:var(--emerald-dark); font-weight:700;}
.rkl{position:absolute; top:0; transform:translateX(-50%); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}

/* ringed longlist groups */
.llg{margin-top:22px;}
.llg .gh{display:flex; align-items:center; gap:10px; margin:0 0 8px;}
.llg .gh .s{width:11px; height:11px; border-radius:3px;}
.llg .gh .g{font-size:11.5px; letter-spacing:.07em; text-transform:uppercase; font-weight:700; color:var(--ink);}
.llg .gh .x{font-size:13px; color:var(--muted);}

/* verification */
.ladder{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:30px;}
.rung{border:1px solid var(--line); border-radius:11px; padding:15px; background:var(--raised); position:relative;}
section.alt .rung{background:var(--paper);}
.rung.on{border-color:var(--emerald); box-shadow:0 0 0 1px var(--emerald);}
.rung .rn{font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.rung .rt2{font-family:var(--display); font-weight:500; font-size:17px; margin:6px 0 5px; color:var(--ink);}
.rung .rd{font-size:13.5px; color:var(--ink-soft); line-height:1.5;}
.rung .now{position:absolute; top:13px; right:13px; font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--emerald); font-weight:700;}
.rung.dim{opacity:.55;}
.vrow{display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line);}
.vrow:last-child{border-bottom:0;}
.vrow .cl{font-size:14.5px; color:var(--ink-soft); line-height:1.5;}
.vrow .cl b{color:var(--ink);}
.chips{display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end;}
.chip{font-size:11px; letter-spacing:.05em; text-transform:uppercase; padding:4px 9px; border-radius:6px; border:1px solid var(--line-strong); color:var(--muted); display:inline-flex; gap:5px; align-items:center; white-space:nowrap;}
.chip.pass{color:var(--emerald); border-color:color-mix(in srgb,var(--emerald) 40%,transparent); background:var(--emerald-tint);}
.chip .m{font-weight:800;}

.srcgrid{columns:2; column-gap:40px; font-size:13px; color:var(--muted); line-height:1.7;}
.srcgrid a,.srcgrid span{color:var(--muted);}
.srcgrid b{color:var(--ink-soft); font-weight:600;}

.foot{padding:36px 0 60px; color:var(--muted); font-size:12px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;}
.pfoot{display:none;}

/* drill-down marker: point right when closed, down when open */
details.collapsible > summary > span:first-child{display:inline-block; transition:transform .16s var(--ease);}
details.collapsible[open] > summary > span:first-child{transform:rotate(90deg);}

/* tooltip */
.tt{position:fixed; z-index:80; pointer-events:none; background:var(--ink); color:var(--paper); font-family:var(--body); font-size:11.5px; line-height:1.5; padding:9px 12px; border-radius:9px; max-width:320px; opacity:0; transform:translateY(4px); transition:opacity .12s,transform .12s; box-shadow:var(--shadow);}
.tt.show{opacity:1; transform:translateY(0);}

.reveal{opacity:0; transform:translateY(14px);}
.reveal.in{opacity:1; transform:none; transition:opacity .7s var(--ease), transform .7s var(--ease);}
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1!important; transform:none!important; transition:none!important;} }

@media (max-width:920px){
  .tiles{grid-template-columns:repeat(2,1fr);} .cols,.pool{grid-template-columns:1fr; gap:30px;}
  .ladder{grid-template-columns:repeat(2,1fr);} .eye{width:min(280px,100%);} .srcgrid{columns:1;}
  .idx{display:none;}
}
@media (max-width:520px){
  .tiles{grid-template-columns:1fr 1fr;} .wrap{padding:0 18px;}
  /* phone comfort: the masthead's 76px lead + 19px lede eat a whole screen before the map starts */
  .mast{padding:40px 0 30px;}
  .mast h1{margin-top:12px;}
  .lede{font-size:16px; margin-top:16px;}
  .metarow{gap:10px 22px; margin-top:20px; padding-top:16px;}
  .howto{font-size:15px; margin-top:16px;}
  /* 2-up key tiles: smaller numerals + tighter box so long values don't clip the hairline grid */
  .tile{min-height:118px; padding:16px 15px; gap:7px;}
  .tile .v{font-size:27px;} .tile .v small{font-size:13px;}
  /* give the comp/pool bars their track back on a narrow screen */
  .hbar{grid-template-columns:76px 1fr auto; gap:10px;} .hbar .hv{min-width:42px;}
  .rangebar{margin:30px 0 6px;}
  .rung{padding:13px;}
  .verdict{padding-left:16px;}
}
/* narrowest phones: one column so key tiles + verification rungs read full-width (nothing clipped) */
@media (max-width:430px){
  .tiles{grid-template-columns:1fr;}
  .ladder{grid-template-columns:1fr;}
  .hbar{grid-template-columns:64px 1fr auto; gap:8px;}
  /* smaller comp-bar tick labels so the centred min/max ends hang less past the track */
  .rangebar .rk, .rangebar .rkl{font-size:9.5px;}
}

/* ---- print: a clean A4 PDF ---- */

/* export-time redacted names (public sample editions) — block glyphs, styled as a tease */
.redact{color:color-mix(in srgb,var(--emerald) 55%,var(--muted)); letter-spacing:.5px;
  border-bottom:1px dashed color-mix(in srgb,var(--emerald) 45%,transparent);
  cursor:help; white-space:nowrap; font-size:.92em;}
