/* report-view.css — THE INSTRUMENT PANEL (owner pick 2026-08-26, Mockup B).
   The paid report joins the house obsidian identity the customer already knows:
   the /p/ free report and the website run these exact tokens. A sticky chapter
   rail, flat bands with hairline rules, big condensed readouts with a date on
   every figure, and the street-corner hero (real OSM map + the lattice
   scoreboard). Print collapses the rail into a cover page and flips the sheet
   to paper. Self-contained: self-hosted fonts, no site sheets. The class
   vocabulary is the renderer's contract — values changed, names kept. */

@font-face{font-family:"Inter";src:url("/css/fonts/inter-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Saira Condensed";src:url("/css/fonts/saira-condensed-700.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("/css/fonts/ibm-plex-mono-500.woff2") format("woff2");font-weight:500;font-display:swap}

:root{
  --bg:#0b0e0d; --deep:#070a09; --surface:#101513; --surface2:#151b18;
  --line:#242b28; --line2:#1b201e;
  --ink:#eef2ef; --ink2:#a7b1ab; --ink3:#8e9a93;
  --mint:#43d597; --mint-soft:rgba(67,213,151,.11);
  --gold:#e6b654; --gold-line:rgba(230,182,84,.28); --gold-soft:rgba(230,182,84,.12);
  --bad:#ec7663; --bad-soft:rgba(236,118,99,.11);
  /* (2026-09-22) --blue and --purp were USED (.mi-mark.sa, .mi-mark.loc) and never defined, so both colours silently
     fell back to inherited ink; the values are the ones those same rules already give their borders at half opacity. */
  --blue:#7fb4e8; --purp:#c792ea;
  --disp:"Saira Condensed","Arial Narrow",sans-serif;
  --body:"Inter","Segoe UI",system-ui,sans-serif;
  --mono:"Plex Mono",Consolas,monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
body.rep-doc{background:var(--bg);color:var(--ink);font:400 14.5px/1.62 var(--body);
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 70% 42% at 60% -8%, rgba(67,213,151,.05), transparent 60%)}
b,strong{color:var(--ink);font-weight:600}
a{color:var(--mint)}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--gold);color:#3d2c05;padding:8px 14px;z-index:50}
.skip-link:focus{left:8px}

/* ── The shell: rail + document ─────────────────────────────────────────── */
.shell{display:grid;grid-template-columns:252px minmax(0,1fr);max-width:1280px;margin:0 auto;min-height:100vh}
/* Until the rail shows (loading / invalid / expired), the document owns the
   full width — otherwise main auto-places into the 252px rail track. */
.shell:has(#rep-rail[hidden]){grid-template-columns:1fr}
.rail{border-right:1px solid var(--line2);background:var(--deep);padding:30px 22px}
.railin{position:sticky;top:24px}
.railbrand{display:flex;align-items:center;gap:9px;font:700 15px var(--disp);letter-spacing:.16em;color:var(--ink)}
.raillogo{display:block;width:26px;height:26px;border-radius:6px}
.railkick{font:500 9.5px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink3);margin:4px 0 22px}
.railbiz{font:700 21px/1.15 var(--disp);color:var(--ink);overflow-wrap:break-word}
.railmeta{font:500 10.5px var(--mono);color:var(--ink3);margin:5px 0 18px}
.railverdict{border:1px solid var(--gold-line);background:var(--gold-soft);padding:12px 13px;margin-bottom:22px}
.railverdict b{display:block;font:700 30px/1 var(--disp);color:var(--gold)}
.railverdict span{display:block;font:500 9.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-top:5px}
.railnav{list-style:none;margin-bottom:4px}
/* The switch to the other half of a bundle. It reads as a door, not as a chapter: a full-width control with
   its own icon, set apart from the chapter list above and the download below. */
/* The door to the other half of a bundle (the owner, 2026-09-10). It carries the one piece of deliberate
   spectacle in the document, because it is the one control a reader has to notice: a delta-purple frame,
   the colour Formula 1 timing screens use for a fastest time, and a gold shimmer travelling across the
   words. Everything else on this page stays still. */
:root{--f1-delta:#b10dc9}
.railswap{display:flex;align-items:center;gap:9px;margin:14px 0 10px;padding:10px 12px;border-radius:8px;
  border:1.5px solid var(--f1-delta);
  font:600 12px/1.3 var(--body);color:var(--gold);background:var(--surface);text-decoration:none;cursor:pointer;
  transition:border-color .18s ease, box-shadow .18s ease}
.railswap:hover,.railswap:focus-visible{border-color:var(--f1-delta);box-shadow:0 0 0 1px var(--f1-delta), 0 0 14px -4px var(--f1-delta)}
.railswap svg{flex:0 0 auto;width:15px;height:15px;stroke:var(--f1-delta);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* the shimmer rides the TEXT only: a gold band travelling left to right across the letters, on a base that
   is already the house gold, so a browser that cannot clip a background to text loses the travel and keeps
   the colour rather than showing a blank word */
/* SEAMLESS, and the seam is the whole point (the owner, 2026-09-10: "the shimmer should always transition
   smoothly"). The first cut travelled from 120% to -120% across a gradient that was not periodic, so at the
   end of every loop the band snapped back through a frame that did not match the one before it.
   Three things make it continuous. The tile STARTS AND ENDS on the same gold, so its left edge and its right
   edge are the same colour. It REPEATS, so there is always more tile arriving. And the travel is exactly one
   tile: with a background twice the box width, a background-position of 200% shifts by precisely one image
   width, which puts the last frame pixel for pixel on top of the first. */
.railswap span{background-image:linear-gradient(100deg,
    var(--gold) 0%,var(--gold) 38%,#fff1c4 47%,#ffffff 50%,#fff1c4 53%,var(--gold) 62%,var(--gold) 100%);
  background-size:200% 100%;background-repeat:repeat;background-position:200% 0;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--gold);animation:railshine 3.8s linear infinite}
@keyframes railshine{from{background-position:200% 0}to{background-position:0% 0}}
@media (prefers-reduced-motion:reduce){.railswap span{animation:none;background-image:none;-webkit-text-fill-color:currentColor;color:var(--gold)}}
@media print{.railswap{display:none !important}}
@media print{.mi-fsbox.fs{position:static;width:auto;height:auto;padding:0;overflow:visible}}   /* step 8 (2026-09-14): a full-screen box prints in place; kept above the map's own print block, which must stay last */
.railnav li{border-top:1px solid var(--line2)}
.railnav li:last-child{border-bottom:1px solid var(--line2)}
.railnav a{display:flex;gap:10px;align-items:baseline;padding:9px 2px;color:var(--ink2);text-decoration:none;font-size:12.5px}
.railnav a:hover{color:var(--ink)}
.railnav .n{font:600 10px var(--mono);color:var(--gold);min-width:22px}
/* The chapter's own icon in place of its number (the owner, 2026-09-21). It takes the number's slot
   exactly (22px) so a rail of icons and a rail of numbers hang on the same left edge, which matters
   because the $99 report still uses numbers. align-self overrides the row's baseline alignment: an SVG
   has no text baseline, so baseline-aligning one drops it below the chapter name. */
.railnav .railico{flex:0 0 auto;width:17px;height:17px;min-width:22px;color:var(--gold);align-self:center;opacity:.92}
.railnav a:hover .railico{opacity:1}
.railnav a.active .railico{color:var(--mint);opacity:1}
/* The chapter being read lights up as the document scrolls. */
.railnav a.active{color:var(--ink);font-weight:600}
.railnav a.active .n{color:var(--mint)}
.raildl{display:block;width:100%;margin-top:24px;background:var(--gold);color:#3d2c05;border:0;padding:11px 0;font:600 13px var(--body);cursor:pointer}
.raildl:hover{filter:brightness(1.07)}
.rep-modes{display:flex;margin-top:10px;border:1px solid var(--line);overflow:hidden}
.rep-modes button{flex:1;font:600 11px var(--mono);letter-spacing:.04em;color:var(--ink3);background:transparent;border:0;padding:7px 0;cursor:pointer}
.rep-modes button[aria-pressed="true"]{background:var(--surface2);color:var(--mint)}
.railnote{font:500 9.5px var(--mono);color:var(--ink3);margin-top:14px;line-height:1.6}
/* L (the owner, 2026-09-21): the two document controls, now siblings of Download PDF and the
   Friendly / Technical switch rather than of the verdict. The hero laid this row out horizontally with the
   tour pushed to the right by margin-left:auto; a 272px rail has no room for that, so both stack to full
   width here and take the same boxed shape as the switch above them. */
.railtools .mast-what{display:flex;flex-direction:column;align-items:stretch;gap:7px;margin-top:10px;font-size:11px}
.railtools .mast-what button,.railtools .mast-what .rep-tourbtn{width:100%;margin:0;padding:7px 10px;text-align:center;
  font:600 11px var(--body);color:var(--ink2);background:transparent;border:1px solid var(--line);border-radius:8px;cursor:pointer}
.railtools .mast-what button:hover,.railtools .mast-what .rep-tourbtn:hover{background:var(--surface2);color:var(--ink);text-decoration:none}
/* the un-taken tour keeps its invitation, in the rail's own register */
.railtools .mast-what .rep-tourbtn.unseen{border-color:rgba(67,213,151,.45);color:var(--mint)}

.rep-main{padding:30px 40px 100px;min-width:0}
/* THE CHAPTERS ON A PHONE (the quality review of 27 Sep; report-view.js buildRailNav fills it). Hidden wherever the
   rail's own list shows, and on paper. THE STRIP THAT KEEPS TO THE TOP is its wrapper since 28 Sep (the owner: the review
   status stays in view): the status mark at its start, then the chapters, which scroll sideways on their own. The strip
   shows while either part does, and with the mark alone it is a slim strip of its own (report-view.js phoneTopSync). */
.rep-phonenav{display:none}
.rep-phonetop{display:none}
@media (max-width:760px){
  .rep-phonetop:not([hidden]){display:flex;align-items:center;position:sticky;top:0;z-index:40;margin:0 -18px 14px;padding:8px 0;
    background:var(--bg);border-bottom:1px solid var(--line2)}
  .rep-phonetop.alone:not([hidden]){padding:6px 0}
  /* position:relative keeps the bar the chips' offsetParent, which the lit chip's centring in buildRailNav measures from */
  .rep-phonenav:not([hidden]){display:flex;flex:1 1 auto;min-width:0;gap:6px;position:relative;padding:0 18px;
    overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  /* the mark at the strip's start: two short lines beside the chapters, one line when it stands alone. Two lines, never
     three: "Report not yet reviewed by a person" (28 Sep) took three at 128 px, the strip grew to 63 px, and a chapter jump
     (which keeps 58 px clear, below) put its heading under the strip */
  .rep-phonetop > .rep-revmark:not([hidden]){flex:0 0 auto;width:auto;max-width:158px;margin:0 0 0 18px;padding:4px 9px;
    font-size:10.5px;line-height:1.15;border-radius:10px;gap:6px}
  .rep-phonetop.alone > .rep-revmark:not([hidden]){max-width:none}
  .rep-phonetop > .rep-revmark:not([hidden]) + .rep-phonenav{padding-left:10px}
  .rep-phonenav::-webkit-scrollbar{display:none}
  .rep-phonenav a{flex:0 0 auto;white-space:nowrap;font:600 11.5px var(--body);color:var(--ink2);text-decoration:none;
    padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface)}
  .rep-phonenav a.active{color:var(--bg);background:var(--mint);border-color:var(--mint)}
  /* a jump lands the chapter's heading under the bar, not behind it: the bar's own jumps, and a sample's deep link,
     whose 16 px margin (.rep-deeplink-at, below) was set for a page with nothing fixed over it. "#report .rep-act", never a
     bare ".rep-act": the chapters' own rule further down (.rep-act{...scroll-margin-top:16px}) is as specific and comes
     later, so it won, and every chip's jump put its heading under the bar (the review of 28 Sep, MEDIUM-1) */
  #report .rep-deeplink-at,#report .rep-act,#report section.rep-card{scroll-margin-top:58px}
}
@media print{.rep-phonenav,.rep-phonetop,.rep-revmark{display:none !important}}
/* THE PHONE'S FIRST SCREEN STARTS AT THE TITLE (audit A of 28 Sep, A-P2-5): the band's one-line chip is the strip's mark,
   whose tap shows the band's sentence under the strip; the rail's controls ride the strip's menu (report-view.js
   phoneMenuSync), so the rail is not drawn. Screens only: paper prints the band at the top of the first page as before.
   SAID ONCE (P3-14): a mark stands aside while the band is on the screen, keeping its room so nothing moves. */
.rep-revmark.with-band{visibility:hidden}
/* (P3-1) the loading note outside the shell keeps its 18vh by an offset, never a margin: a first child's margin collapses
   through the body, and the body moved 162 px when the report replaced the note */
body > .rep-state{margin-top:0;position:relative;top:18vh}
.rep-phonemenu-btn,.rep-phonemenu,.rep-phonemore{display:none}
@media screen and (max-width:760px){
  .rep-reviewband{display:none !important}
  .rail{display:none !important}
  .rep-phonetop:not([hidden]){flex-wrap:wrap}
  .rep-phonetop > .rep-phonenav:not([hidden]){flex:1 1 0}
  .rep-phonemenu-btn:not([hidden]){display:inline-flex;align-items:center;flex:0 0 auto;margin:0 12px 0 4px;padding:6px 12px;
    font:600 11.5px var(--body);color:var(--gold);background:var(--surface);border:1px solid var(--gold-line);border-radius:999px;cursor:pointer}
  .rep-phonemenu-btn[aria-expanded="true"]{background:var(--gold-soft)}
  /* the box under the strip is the strip's width, its 18 px gutter inside it: a 100% box with 18 px margins ran 36 px past
     the strip, past the right of a 375 px screen, cutting its words and scrolling the page sideways (the release review of
     30 Sep 2026) */
  .rep-phonemore:not([hidden]){display:block;flex:0 0 100%;min-width:0;margin:8px 0 0;padding:0 18px;font:500 12.5px/1.45 var(--body);color:var(--ink2)}
  .rep-phonemenu:not([hidden]){display:block;flex:0 0 100%;margin-top:8px;padding:10px 18px 4px;border-top:1px solid var(--line2)}
  .rep-phonemenu .railswap{margin:0 0 10px}
  .rep-phonemenu .raildl{margin-top:0}
}
.rep-state{max-width:560px;margin:18vh auto 0;padding:28px 32px;background:var(--surface);border:1px solid var(--line);text-align:center}
.rep-state h1{font:700 22px var(--disp);color:var(--ink);margin:0 0 6px}
.rep-state p{font-size:.95rem;line-height:1.55;color:var(--ink2);margin:0 auto;max-width:46ch}

.rep-sample-ribbon{display:inline-block;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--ink2);
  border-radius:0;padding:8px 14px;font-size:12.5px;margin:0 0 18px}
.rep-sample-ribbon a{color:var(--gold)}

/* The print cover exists for paper only. */
.print-cover{display:none}

/* ── The masthead: title + the one-line verdict ─────────────────────────── */
/* Legend round: the masthead sits tight on its divider (the keywords row lives
   in CH 01 now) and the grid band rides close beneath it. */
.rep-hero{border-bottom:1px solid var(--line2);padding-bottom:14px;margin-bottom:4px}
#card-grid{padding-top:5px}
.rep-hero h1{font:700 13px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 6px}
.rep-sub{font:700 34px/1.08 var(--disp);color:var(--ink);margin:0}
.rep-meta{font:500 10.5px var(--mono);color:var(--ink3);margin:6px 0 0}
.rep-verdict{font:700 27px/1.2 var(--disp);color:var(--ink);margin:14px 0 0;max-width:24em}
.rep-verdict b{color:var(--mint)}
.rep-wow{font-size:12.5px;color:var(--ink2);margin:10px 0 0}
.rep-kw{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:4px 0 16px}
.rep-kw span{display:inline-block;font:600 11px var(--body);color:var(--ink2);border:1px solid var(--line);border-radius:999px;padding:2px 10px}
.rep-kw .rep-kw-label{font:600 9.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);border:0;padding:0;margin-right:4px}

/* ── The map-first hero band (the polish pass, 2026-09-18; the plan's section 2, mock-up C): the first
   scan's street corners in miniature beside four tiles, the three-name box as the goal line. ── */
/* H2 (the owner, 2026-09-21). THE HERO TILTED FOR TWO REASONS, and this fixes both.
   It was a two-column grid, `auto minmax(0,1fr)`, whose left column existed to hold the 25-cell mini map.
   A1 removed the map and left the column: 209px holding nothing but the caption of a picture that is gone.
   And the four tiles on the right were a flex-wrap row of intrinsic widths (120/233/140/206px), so three fit
   the first line and the fourth dropped to a line of its own. The map used to carry the eye past that.
   Now: one column, the caption above, and the tiles a real grid where one figure leads and three support. */
.rep-herogrid{display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-items:start;margin-top:18px}
.hg-kick{font:600 9.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin:0 0 8px;max-width:22em}
.hg-mini{display:grid;grid-template-columns:repeat(5,26px);gap:4px}
.hg-cell{width:26px;height:26px;border-radius:5px;font:600 10px var(--mono);display:flex;align-items:center;justify-content:center;color:#0b0e0d}
.hg-cell.g{background:var(--mint)}
.hg-cell.a{background:var(--gold)}
.hg-cell.r{background:var(--bad);color:#fff}
.hg-cell.x{background:#242b28;color:var(--ink3)}
.hg-cell.f{background:#0e1110;color:#4a534e;box-shadow:inset 0 0 0 1px #202623}
/* ⚠️ `.rep-stat-row.hg-tiles`, NOT `.hg-tiles`. The element carries both classes, and `.rep-stat-row`
   sets display:flex seventy-six lines BELOW this one. At equal specificity the later rule wins, so a
   single-class selector here leaves the tiles a wrapping flex row that merely LOOKS declared as a
   grid: getComputedStyle returns the fr units unresolved. Two classes beat it wherever it sits. */
/* (the owner, 2026-09-21) NO max-width. It capped the tiles at 760px while the map and the lattice
   below them run the full width of the column, so the hero stopped short of everything it introduces. */
.rep-stat-row.hg-tiles{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:10px;margin:0}
.hg-tiles .rep-stat{min-width:0;background:var(--surface2);border:1px solid var(--line2);border-radius:10px;padding:11px 13px}
/* the headline figure: the tall left cell, at nearly double size */
.hg-tiles .rep-stat.hg-lead{grid-row:span 2;display:flex;flex-direction:column;justify-content:center;
  background:rgba(67,213,151,.06);border-color:rgba(67,213,151,.28)}
.hg-tiles .rep-stat.hg-lead b{font-size:54px;line-height:1}
/* the goal line: the full width of the two cells beneath the pair */
.hg-tiles .rep-stat.hg-wide{grid-column:2 / span 2}
/* (the owner, 2026-09-22) EVERY HERO FIGURE OPENS. The affordance is the hover and nothing else: the pointer, the
   border lifting to mint, a real focus ring for the keyboard. There was a line of "what is this?" under each figure;
   the owner took it out ("the viewer will be able to see the cards are clickable when they hover over them"). */
.hg-tiles .rep-stat.hg-click{cursor:pointer;position:relative;transition:border-color .12s,background .12s,transform .12s}
.hg-tiles .rep-stat.hg-click:hover{border-color:var(--mint);background:var(--surface);transform:translateY(-1px)}
.hg-tiles .rep-stat.hg-lead.hg-click:hover{background:rgba(67,213,151,.1)}
.hg-tiles .rep-stat.hg-click:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.hg-tiles .rep-stat.hg-click:hover{transform:none}}
/* the window: the measurement's icon and name, the address we searched, then headed paragraphs */
.hx-src{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--line2)}
.hx-src .ins-ic{display:inline-flex}
.hx-inst{font:600 13px var(--body);color:var(--ink)}
/* the address, drawn as the browser's own bar: the same bar sits at the top of the screenshot below */
.hx-where{display:inline-flex;align-items:center;gap:6px;margin-left:auto;background:#f1f3f4;color:#202124;
  border-radius:999px;padding:4px 12px;font:400 12px Roboto,Arial,sans-serif;white-space:nowrap}
.hx-where svg{color:#5f6368;flex:none}
.hx-h{font:700 12.5px var(--body);color:var(--ink);margin:14px 0 4px;letter-spacing:.01em}
.hx-h:first-child{margin-top:0}
.hx-p{font-size:.92rem;line-height:1.6;color:var(--ink2);margin:0;max-width:62ch}
.hx-sh{font:700 12.5px var(--body);color:var(--ink);margin:22px 0 0;letter-spacing:.01em}
/* Jose's note 1 (30 Sep 2026): the reasons under a meaning's lead, one a line, each count a button that opens exactly its
   businesses (report-view.js miNoSiteReasons); it sits in a list drawer, and a drawer never prints */
.hx-list{list-style:none;margin:8px 0 0;padding:0;max-width:62ch}
.hx-list li{position:relative;padding:3px 0 3px 16px;font-size:.92rem;line-height:1.5;color:var(--ink2)}
.hx-list li::before{content:"";position:absolute;left:2px;top:.85em;width:6px;height:6px;border-radius:50%;background:var(--ink3)}
.hx-n{display:inline-block;min-width:28px;padding:2px 4px;margin:-2px 0 -2px -4px;font:600 13px var(--mono);color:var(--ink);text-align:right}
.hx-n.rp-facet{color:var(--gold);text-decoration:underline dotted;text-underline-offset:3px;border-radius:4px;border:1px solid transparent}
@media(max-width:520px){.hx-where{margin-left:0}}
/* the owner, 2026-09-22 (market parity doc, section 12): the market's own windows head a figure's list. Two addresses
   sit together at the right, the day after them; the 9's single address keeps its own place */
.mi-hx .hx-where+.hx-where{margin-left:0}
.hx-day{font:600 11px var(--mono);letter-spacing:.04em;color:var(--ink3);white-space:nowrap}
/* section 9: the franchise icon beside a market row's website word, in the tables and the lists */
.mi-wsite-brand{display:inline-flex;align-items:center;white-space:nowrap}
/* section 10: the baseline's mark, four readings stacked; its hover is the franchise icon's floating bubble */
.base-ic{display:inline-flex;align-items:center;vertical-align:-3px;margin-left:6px;color:var(--gold);cursor:help;border-radius:4px}
.base-ic:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* Angi-HomeAdvisor's tip (the owner's ruling of 2 Oct): a small mark beside the one name, its words in the floating bubble; off paper */
.ah-ic{display:inline-flex;align-items:center;vertical-align:-2px;margin-left:5px;color:var(--ink3);cursor:help;border-radius:4px}
.ah-ic:hover,.ah-ic:focus-visible{color:var(--gold)}
.ah-ic:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media print{.ah-ic{display:none !important}}
.mi-wsite-brand .auth-ic,.rep-table td>.auth-ic,.rp-tbl td>.auth-ic{margin-right:6px}
.hg-bar{display:block;height:5px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:9px}
.hg-bar i{display:block;height:100%;border-radius:3px;background:var(--mint)}
.hg-tiles .rep-stat.hg-bad .hg-bar i{background:var(--bad)}
.hg-tiles .rep-stat.hg-gold .hg-bar i{background:var(--gold)}
@media(max-width:720px){
  /* two by two, and the lead stops being tall: a phone has no room for a spanning cell */
  .hg-tiles{grid-template-columns:1fr 1fr}
  .hg-tiles .rep-stat.hg-lead{grid-row:auto}
  .hg-tiles .rep-stat.hg-lead b{font-size:38px}
  .hg-tiles .rep-stat.hg-wide{grid-column:1 / span 2}
}
.hg-tiles .rep-stat b{font-size:30px}
.hg-tiles .rep-stat.hg-mint b{color:var(--mint)}
.hg-tiles .rep-stat.hg-gold b{color:var(--gold)}
.hg-tiles .rep-stat.hg-ink b{color:var(--ink)}
.hg-tiles .rep-stat.hg-bad b{color:var(--bad)}
.hg-tiles .rep-stat.hg-dim b{color:var(--ink3);font-size:24px;padding-top:4px}
.hg-key{font-size:.8rem;color:var(--ink2);margin:10px 0 0;max-width:46em}
@media (max-width:560px){.rep-herogrid{grid-template-columns:1fr}}

/* ── The visibility ladder (mock-up B): the sentence, the best tile, the rungs, the address line. ── */
.rep-ladder-head{font:700 19px/1.3 var(--disp);color:var(--ink);margin:6px 0 4px;max-width:34em}
.rep-ladder-stats{margin:6px 0 4px}
.rep-ladder-kick{font-size:.8rem;color:var(--ink3);margin:0 0 8px;max-width:72em}
.rep-ladder{margin:4px 0 10px;max-width:760px}
.rep-ladder .rung{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr) minmax(120px,auto);gap:10px;align-items:center;margin:6px 0;font-size:.85rem;color:var(--ink2)}
.rep-ladder .rung .rl{color:var(--ink)}
.rep-ladder .rung .bar{display:block;height:14px;background:var(--surface);border:1px solid var(--line2);border-radius:4px;overflow:hidden}
.rep-ladder .rung .bar i{display:block;height:100%;background:var(--gold);width:0}
.rep-ladder .rung .bar i.g{background:var(--mint)}
.rep-ladder .rung .bar i.a{background:var(--gold)}
.rep-ladder .rung .bar i.r{background:var(--bad)}
.rep-ladder .rung .bar i.x{background:#3b4642}
.rep-ladder .rung .v{font:500 .78rem var(--mono);color:var(--ink2);white-space:nowrap;text-align:right}
.rep-ladder .rung .v .rep-delta{display:block;margin-top:2px}
.rep-ladder-sub{font-size:.82rem;color:var(--ink2);margin:0;max-width:72em}
@media (max-width:560px){
  .rep-ladder .rung{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}
  .rep-ladder .rung .rl{grid-column:1/-1}
  .rep-ladder .rung .v{text-align:right;white-space:normal}
}

/* ── Chapters ───────────────────────────────────────────────────────────── */
.rep-act{display:flex;align-items:baseline;gap:14px;font:700 24px/1.1 var(--disp);color:var(--ink);
  border-top:1px solid var(--line2);margin-top:30px;padding-top:24px;scroll-margin-top:16px}
.rep-act::before{content:attr(data-ch);font:600 10.5px var(--mono);letter-spacing:.14em;color:var(--gold)}
/* A section that carries its own mark drops the chapter number: the icon is the label (the owner,
   2026-09-10). The market report keeps its numbers, because eighteen chapters in five groups are navigated
   by number and six sections are not. */
.rep-act[data-icon]::before{content:none}
.rep-actico{flex:0 0 auto;width:22px;height:22px;color:var(--gold);align-self:center}

/* Bands: flat sections separated by hairlines; tables sit in surface panels. */
.rep-card{padding:22px 0 4px}
.rep-card h2{font:700 18px/1.15 var(--disp);letter-spacing:.01em;color:var(--ink);margin:0 0 6px}
/* EVERY CHAPTER TITLE ONCE (the quality review of 27 Sep; report-view.js miTitleOnce). The kicker above a market chapter
   prints its name; the heading keeps its words for a screen reader and shows the date, the change badge and full screen
   alone, or takes no room when it carries nothing else. A folded chapter on a subscriber's page is the other way round:
   its heading is the one row, with the chapter's mark and its name, and the kicker sits in the page at no height. */
.rep-titled > h2 .rep-h2t,.rep-titled > h2.rep-h2-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0;padding:0}
.rep-titled > h2 .rep-h2t + :not(.sb-open){margin-left:0}
.rep-card.sb-fold > h2 .rep-h2t{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal}
.rep-card.sb-fold > h2 .mi-chip,.rep-card.sb-fold > h2 .mi-dbadge,.rep-card.sb-fold > h2 .mi-unchanged{margin-left:0}
.rep-card.sb-fold > h2 .rep-actico{flex:0 0 auto;width:18px;height:18px;color:var(--gold)}
.rep-act.sb-act-quiet{height:0;margin:0;padding:0;border:0;overflow:hidden}
.rep-card.sb-fold{padding:10px 0 2px;border-top:1px solid var(--line2)}
#mi-book .rep-card.sb-fold > h2{font-size:16px;margin:0}
#mi-book .rep-card.sb-fold:not(.sb-shut) > h2{margin-bottom:12px}
/* on a phone a shut row is its mark, its name, a change badge and Open: the date every chapter shares is in each one opened */
@media (max-width:560px){.rep-card.sb-fold.sb-shut > h2 .mi-chip{display:none}}
.rep-card h3{font:700 15px var(--disp);color:var(--ink);margin:16px 0 8px}
.rep-heroband{border-bottom:1px solid var(--line2);padding-bottom:24px}

/* Readouts: big condensed figures, mono labels — the instrument voice. */
.rep-stat-row{display:flex;flex-wrap:wrap;gap:14px 32px;margin:8px 0 12px}
.rep-stat{min-width:120px}
.rep-stat b{display:block;font:700 40px/1 var(--disp);color:var(--mint)}
.rep-stat-warn b{color:var(--gold)}
.rep-stat small{display:block;font:500 9.5px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink3);margin-top:6px}
.rep-stat-url{font:600 15px/1.3 var(--body) !important;word-break:break-all;text-transform:none !important;letter-spacing:0 !important;padding-top:12px}

.rep-delta{display:block;font-size:.76rem;font-weight:700;margin-top:4px}
.rep-delta-up{color:var(--mint)}
.rep-delta-down{color:var(--bad)}
.rep-delta-flat{color:var(--ink3)}

.rep-explain{margin-top:12px;padding:11px 14px;
  background:var(--mint-soft);font-size:.85rem;line-height:1.6;color:var(--ink2);max-width:78em}
.rep-explain strong{color:var(--mint)}
/* a box's lines, one figure a line under its lead (Jose's note 7 of 30 Sep 2026: the review pace's box; report-view.js
   pullingAwayPart), on screen and on paper */
.rep-explain .mi-explain-lines{list-style:disc;margin:4px 0 0;padding-left:18px}
.rep-explain .mi-explain-lines li{margin:2px 0}
/* "WHAT THIS MEANS", FOLDED (the owner's ask of 2 Oct 2026: "collapsed by default so that the report doesn't seem as long";
   report-view.js explainFolds). Each $29 box is shut behind a small button just before it; open, the box hangs under the
   button and leaves its own "What this means:" lead to it. Shut, open and its lead are a screen's: paper prints every box
   open, with its lead, and no button. A button whose box is hidden or empty is not shown (the box's own rule decides). */
/* (the owner's rule of 2 Oct 2026: no accent stripe down a box's left side) the button is a pill with a thin border all round,
   its chevron turning as it opens; the open box a thin border all round */
.rx-tog{display:inline-flex;align-items:center;gap:7px;margin:12px 0 0;padding:5px 12px 5px 9px;border:1px solid var(--line);
  background:var(--mint-soft);color:var(--mint);font:600 .8rem/1.3 var(--body,inherit);font-family:inherit;cursor:pointer;text-align:left;border-radius:999px}
.rx-tog:hover{color:var(--ink);border-color:rgba(67,213,151,.45)}
.rx-tog:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.rx-tog svg{display:block;flex:none;transition:transform .18s ease}
.rx-tog[aria-expanded="true"] svg{transform:rotate(90deg)}
.rx-tog:has(+ .rep-explain[hidden]),.rx-tog:has(+ .rep-explain:empty){display:none}
@media screen{
  .rx-tog[aria-expanded="true"] + .rep-explain{margin-top:6px;border:1px solid var(--line);border-radius:6px}
  .rep-explain.rx-shut{display:none !important}
  .rep-explain.rx-fold > .rx-lead{display:none}
  .rep-explain.rx-fold::first-letter{text-transform:uppercase}
}
@media (prefers-reduced-motion:reduce){.rx-tog svg{transition:none}}
@media print{.rx-tog{display:none !important}}
.rep-actline{font-size:.82rem;color:var(--ink2);margin:0 0 12px;max-width:72em}
.rep-notmeasured{font-size:.85rem;color:var(--ink2);background:var(--surface);
  border:1px dashed #3a423e;padding:10px 14px;margin:6px 0 0;max-width:64em}
.mapcap{font:500 10px var(--mono);color:var(--ink3);margin-top:10px;line-height:1.6}

/* ── The hero: street map + lattice, the /p/ pair ───────────────────────── */
/* (the owner, 2026-09-21) The pair used to be capped at 430px each, so on a wide column they stopped
   short and left a dead strip down the right of their own section. They take the width they are given now;
   the 1/1 aspect ratio keeps both square, so they grow in both directions together. The cap survives only
   as a floor-stop for very wide screens, well above the column the report actually renders in. */
.heromaps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.smap{position:relative;width:100%;max-width:620px;aspect-ratio:1/1;overflow:hidden;background:var(--bg);border:1px solid var(--line2)}
.sstage{position:absolute;top:0;left:0;width:460px;height:460px;transform-origin:0 0}
.stile{position:absolute;width:256px;height:256px;max-width:none;user-select:none;pointer-events:none;
  filter:invert(1) hue-rotate(180deg) brightness(.72) contrast(1.05) saturate(.25)}
.sdot,.sdot-out{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;line-height:0}
.sdot svg,.sdot-out svg{display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.75))}
/* the ring is appended after the stars and sits on the home star; it takes no pointer, so that star opens its drill like
   every other (the team's test of 29 Sep: the ring's disc swallowed the click, and only its thin border answered) */
.shome{position:absolute;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;border:2.5px solid var(--gold);pointer-events:none}
.lattice{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;aspect-ratio:1/1;width:100%;max-width:620px}
.lattice.lat-wide{grid-template-columns:repeat(7,1fr)}
.lattice.lat-huge{grid-template-columns:repeat(9,1fr)}
.cell{display:flex;flex-direction:column;align-items:center;justify-content:center;font:500 10.5px var(--mono);padding:3px;line-height:1.25;overflow:hidden}
.cell .cb{font-size:13px;font-weight:600}
.cell .cc{font-size:8px;opacity:.7;margin-top:2px}
.cell.pg{background:#12382c;color:#bfeeda;box-shadow:inset 0 0 0 1.5px rgba(67,213,151,.6)}
.cell.pg .cb{color:var(--mint)}
.cell.pa{background:#2b2410;color:#efe3c2;box-shadow:inset 0 0 0 1.5px rgba(230,182,84,.55)}
.cell.pa .cb{color:var(--gold)}
.cell.pr{background:#171b1a;color:var(--ink3);box-shadow:inset 0 0 0 1px #33302b}
.cell.pr .cb{color:var(--bad);opacity:.85}
.cell.px{background:#0e1110;color:#4a534e;box-shadow:inset 0 0 0 1px #202623}
/* W3 (1 Oct 2026): a point where Google listed nobody (band e) is a hollow gray square and a hollow gray star; a point
   looked at wider or moved carries a small corner mark on its square and on its star; a moved star sits where it was
   searched, with a faint ring where it was placed and a dotted line between. All of it prints (see the print block). */
.cell{position:relative}
.cell.pe{background:transparent;color:#a3aca6;box-shadow:inset 0 0 0 1.5px rgba(163,172,166,.55)}
.cell.pe .cb{color:#a3aca6;font-size:10.5px;font-weight:500}
/* three marks, three SHAPES, so they tell apart on paper too: moved a filled corner, wider a small hollow square,
   nobody listed a small hollow ring */
.cell .cmark{position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 9px 9px 0;border-color:transparent #a3aca6 transparent transparent}
.cell .cmark.mv{border-right-color:var(--gold)}
.cell .cmark.wd{top:2px;right:2px;width:6px;height:6px;border:1.5px solid #8fb7d9;border-width:1.5px}
.cell .cmark.no{top:2px;right:2px;width:6px;height:6px;border:1.5px solid #a3aca6;border-width:1.5px;border-radius:50%}
/* (release 33, the owner's ask of 5 Oct) a corner read wider where the business appeared: its place in that wider search, on a
   hatched square with a dashed outline all round and a "W" after the number. Information only, never a pack seat; it keeps the
   gray band's place in every count. The key in the caption is the same mark. */
.cell.pw{background:repeating-linear-gradient(135deg,#0f1418 0 5px,#141b21 5px 10px);color:#9fb4c6;box-shadow:none;border:1.5px dashed rgba(143,183,217,.75)}
.cell.pw .cb{color:#d3e3f0}
.cell .cw,.cwkey .cw{font-size:8px;font-weight:700;color:#8fb7d9;margin-left:1px;vertical-align:super;line-height:0}
.cwkey{display:inline-block;font:600 10.5px var(--mono);color:#d3e3f0;padding:1px 4px;border:1.5px dashed rgba(143,183,217,.75);background:#111820;vertical-align:baseline}
.smark{position:absolute;top:-2px;right:-3px;width:7px;height:7px;border:1.5px solid #0b0e0d;pointer-events:none}
.smark.mv{border-radius:50%;background:var(--gold)}
.smark.wd{background:#8fb7d9}
.smfrom,.smfrom-out{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;border:1.5px solid rgba(232,239,233,.55)}
.smline{position:absolute;height:0;border-top:1.5px dotted rgba(232,239,233,.7);transform-origin:0 0;pointer-events:none}
.mapnote{color:var(--ink2)}
/* ── THE STREET MAP A READER CAN ZOOM, AND ITS FULL SCREEN (the owner's ask of 1 Oct 2026; report-view.js smLive and
   gridFullScreen). The live map fills the square over the fixed picture, which stays under it for paper and is hidden on
   screen only while the live map draws (a page without the map library keeps the picture). The controls are the $99 market
   map's column (.mi-mapctl, .mi-mapbtn, below in this sheet): the full-screen icon on top, + and - under it, on a phone too.
   A star keeps its own rules (.sdot): each marker is a box of no size at its point, and the star centers itself on it. ── */
.smap .sm-leaf{position:absolute;inset:0;z-index:0}
.smap .leaflet-marker-icon.sm-mk{background:none;border:0}
.smap .sm-mvline{pointer-events:none}
.smap .mi-mapctl{display:flex;z-index:2}
.sm-zoom{display:flex;flex-direction:column}
.sm-zoom .mi-mapbtn{font:600 15px/1 var(--mono)}
.sm-zoom .mi-mapbtn:first-child{border-radius:2px 2px 0 0}
.sm-zoom .mi-mapbtn + .mi-mapbtn{margin-top:-1px;border-radius:0 0 2px 2px}
.sm-zoom .mi-mapbtn:disabled{color:var(--ink3);opacity:.55;cursor:default}
.sm-zoom .mi-mapbtn:disabled:hover{background:#141917;color:var(--ink3)}
/* a finger's size where the pointer is a finger */
@media (pointer:coarse){.smap .mi-mapbtn{width:34px;height:34px}.smap .mi-mapbtn svg{width:15px;height:15px}}
/* A CHANGE OF KEYWORD CROSSFADES (the owner's ask of 2 Oct 2026: the map "blinks before changing"; report-view.js smMarks):
   the map and its tiles stay, each new star fades and grows in where the last keyword's fades out (its classes renamed
   "-out", drawn as before), in a quarter of a second; none of it for a reader who asks for reduced motion. */
@keyframes smIn{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}
@keyframes smFade{from{opacity:0}to{opacity:1}}
@keyframes smOut{from{opacity:1}to{opacity:0}}
.smap .sdot.sm-in{animation:smIn .26s cubic-bezier(.2,.8,.3,1) both}
.smap .smfrom.sm-in,.smap path.sm-in{animation:smFade .26s ease both}
.smap .sdot-out,.smap .smfrom-out,.smap .sm-mvline-out,.smap .sm-rad-out,.smap .sm-out{animation:smOut .22s ease both;pointer-events:none}
@media (prefers-reduced-motion:reduce){
  .smap .sdot.sm-in,.smap .smfrom.sm-in,.smap path.sm-in,.smap .sdot-out,.smap .smfrom-out,.smap .sm-mvline-out,.smap .sm-rad-out,.smap .sm-out{animation:none}
}
/* THE SEARCH RADIUS (the owner's ask of 2 Oct 2026; report-view.js smRadDraw): a switch in the map's bottom left corner, the
   $99 map's chip, off until pressed; while on, a thin, lightly filled circle round each point of the radius its search asked
   at, under the stars and taking no pointer: the grid's own radius in the map's light ink, a point read a little wider in
   the wider mark's blue, dashed. The picture under the live map (paper's) carries the same circles, shown only while on. */
/* (the owner's asks of 3 Oct: top left, where the $99 map keeps its chips; the zoom and full screen stay top right) */
.smap .sm-radbtn{position:absolute;left:10px;top:10px;z-index:2;box-shadow:0 1px 4px rgba(0,0,0,.45)}
.smap .sm-radbtn svg{width:12px;height:12px}
.smap .leaflet-smRad-pane{pointer-events:none}
.smap .leaflet-smRad-pane path{pointer-events:none}
.sradius{display:none;position:absolute;border-radius:50%;border:1px solid rgba(232,239,233,.55);background:rgba(232,239,233,.05);pointer-events:none}
.sradius.wide{border:1px dashed rgba(143,183,217,.85);background:rgba(143,183,217,.07)}
.smap.sm-rad-on .sradius{display:block}
@media (pointer:coarse){.smap .sm-radbtn{min-height:34px;padding:7px 11px}}
/* the full screen's own bar is never on the page, and never on paper */
.g-fshead{display:none}
@media screen{
  .smap.sm-live > .sstage{display:none}
  /* full screen: a CSS overlay on the street-corner card, as the $99 map's is (never the Fullscreen API: the point drill opens
     over it), and on a phone too. Its bar, the map as big as the screen allows, then the legend and the W3 and W5 lines;
     the scoreboard, the test's long line and its explanation stay on the page. */
  .g-fsbox.fs{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;margin:0;z-index:2147482000;
    display:flex;flex-direction:column;gap:8px;padding:12px 14px 14px;background:var(--bg);border:0;border-radius:0;
    overflow:auto;overscroll-behavior:contain;box-sizing:border-box}
  .g-fsbox.fs > *{display:none}
  .g-fsbox.fs > .g-fshead:not([hidden]){display:flex;flex-direction:column;gap:8px;flex:0 0 auto}
  .g-fsbox.fs > .heromaps{display:block;flex:1 1 0;min-height:260px}
  .g-fsbox.fs > .mapcap:not([hidden]){display:block;flex:0 0 auto;margin:0}
  .g-fsbox.fs .lattice{display:none}
  .g-fsbox.fs .smap{width:100%;max-width:none;height:100%;aspect-ratio:auto}
  body.mi-fs.g-mapfs{overflow:hidden}
  /* the point drill, opened from a star in full screen, stands over it (below the drawer, as #rep-overlay does) */
  body.g-mapfs #pin-drill{z-index:2147483100}
  .g-fstop{display:flex;align-items:center;gap:12px}
  .g-fstitle{flex:1 1 auto;min-width:0;margin:0;font:600 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
  .g-fsclose{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 12px;border:1px solid var(--line);
    border-radius:6px;background:#141917;color:var(--ink);font:600 12.5px var(--body,inherit);font-family:inherit;cursor:pointer}
  .g-fsclose svg{width:12px;height:12px;display:block}
  .g-fsclose:hover{background:#1b211e;border-color:var(--ink3)}
  .g-fsclose:focus-visible,.g-fskws .kwchip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
  .g-fskws{display:flex;gap:8px;flex-wrap:wrap}
  .g-fskws[hidden]{display:none}
  .g-fskws .kwchip{font-size:.74rem;padding:7px 13px}
  .g-fskey{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;margin:0;font:500 11px/1.5 var(--mono);color:var(--ink2)}
  .g-fsk{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
  .g-fsk svg{width:14px;height:14px;display:block;flex:none}
  .g-fsk b,.g-fskey .g-fskw{color:var(--ink);font-weight:600}
}
@media screen and (max-width:760px){
  .g-fsbox.fs{gap:6px;padding:10px 10px 12px}
  .g-fsbox.fs > .heromaps{min-height:300px}
  .g-fskws{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .g-fskws::-webkit-scrollbar{display:none}
  .g-fskey{gap:2px 12px;font-size:10.5px}
}

/* ── Tables ─────────────────────────────────────────────────────────────── */
.rep-table-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line2);padding:6px 10px;margin-top:8px}
/* Scroll surfaces inside sections wear the instrument's own scrollbar.
   r12-scrollbar (the owner, 2026-09-09): this list used to name .rep-table-wrap only, which is the class the
   report's own markup carries. Every table the parts library BUILDS at run time carries .rp-tblwrap instead,
   so each of those wore the raw operating-system scrollbar in the middle of a dark section. The two panels and
   the keyword rail were never themed at all. The list is now every scroll surface on the page.
   The owner, 28 Sep 2026: the market map's window for the zips at one point scrolled its list of zips on the
   browser's own bright bar ("a scroll bar that doesn't fit our theme"). It joins the list, with every other box on
   the page that scrolls: the zip table's window, the map's key row, the full-screen map and chapter, the changes
   table. The report has no light theme on screen (paper lifts every ceiling), so one dress serves. The rail's own scroll
   box (.railin, builder S, 28 Sep: a rail taller than the screen scrolls within itself) wears it too, from the
   integration of 28 Sep. */
.rep-scrollbars,.rep-table-wrap,.rep-window,.rp-tblwrap,.rep-tall,.rp-drawer-scroll,.rp-drawer-panel,.kwsel,#pin-drill .pd-body,#rep-overlay .rov-panel,.mi-win .mi-zipchips,.mi-zipscroll,.mi-maplegend,.mi-mapframe.fs,.mi-fsbox.fs,.g-fsbox.fs,.rc-wrap,.railin{scrollbar-width:thin;scrollbar-color:var(--line) var(--deep)}
.rep-scrollbars::-webkit-scrollbar,.rep-table-wrap::-webkit-scrollbar,.rep-window::-webkit-scrollbar,.rp-tblwrap::-webkit-scrollbar,.rep-tall::-webkit-scrollbar,.rp-drawer-scroll::-webkit-scrollbar,.rp-drawer-panel::-webkit-scrollbar,.kwsel::-webkit-scrollbar,#pin-drill .pd-body::-webkit-scrollbar,#rep-overlay .rov-panel::-webkit-scrollbar,.mi-win .mi-zipchips::-webkit-scrollbar,.mi-zipscroll::-webkit-scrollbar,.mi-maplegend::-webkit-scrollbar,.mi-mapframe.fs::-webkit-scrollbar,.mi-fsbox.fs::-webkit-scrollbar,.g-fsbox.fs::-webkit-scrollbar,.rc-wrap::-webkit-scrollbar,.railin::-webkit-scrollbar{width:10px;height:10px}
.rep-scrollbars::-webkit-scrollbar-track,.rep-table-wrap::-webkit-scrollbar-track,.rep-window::-webkit-scrollbar-track,.rp-tblwrap::-webkit-scrollbar-track,.rep-tall::-webkit-scrollbar-track,.rp-drawer-scroll::-webkit-scrollbar-track,.rp-drawer-panel::-webkit-scrollbar-track,.kwsel::-webkit-scrollbar-track,#pin-drill .pd-body::-webkit-scrollbar-track,#rep-overlay .rov-panel::-webkit-scrollbar-track,.mi-win .mi-zipchips::-webkit-scrollbar-track,.mi-zipscroll::-webkit-scrollbar-track,.mi-maplegend::-webkit-scrollbar-track,.mi-mapframe.fs::-webkit-scrollbar-track,.mi-fsbox.fs::-webkit-scrollbar-track,.g-fsbox.fs::-webkit-scrollbar-track,.rc-wrap::-webkit-scrollbar-track,.railin::-webkit-scrollbar-track{background:var(--deep)}
.rep-scrollbars::-webkit-scrollbar-thumb,.rep-table-wrap::-webkit-scrollbar-thumb,.rep-window::-webkit-scrollbar-thumb,.rp-tblwrap::-webkit-scrollbar-thumb,.rep-tall::-webkit-scrollbar-thumb,.rp-drawer-scroll::-webkit-scrollbar-thumb,.rp-drawer-panel::-webkit-scrollbar-thumb,.kwsel::-webkit-scrollbar-thumb,#pin-drill .pd-body::-webkit-scrollbar-thumb,#rep-overlay .rov-panel::-webkit-scrollbar-thumb,.mi-win .mi-zipchips::-webkit-scrollbar-thumb,.mi-zipscroll::-webkit-scrollbar-thumb,.mi-maplegend::-webkit-scrollbar-thumb,.mi-mapframe.fs::-webkit-scrollbar-thumb,.mi-fsbox.fs::-webkit-scrollbar-thumb,.g-fsbox.fs::-webkit-scrollbar-thumb,.rc-wrap::-webkit-scrollbar-thumb,.railin::-webkit-scrollbar-thumb{background:var(--line);border:2px solid var(--deep)}
.rep-scrollbars::-webkit-scrollbar-thumb:hover,.rep-table-wrap::-webkit-scrollbar-thumb:hover,.rep-window::-webkit-scrollbar-thumb:hover,.rp-tblwrap::-webkit-scrollbar-thumb:hover,.rep-tall::-webkit-scrollbar-thumb:hover,.rp-drawer-scroll::-webkit-scrollbar-thumb:hover,.rp-drawer-panel::-webkit-scrollbar-thumb:hover,.kwsel::-webkit-scrollbar-thumb:hover,#pin-drill .pd-body::-webkit-scrollbar-thumb:hover,#rep-overlay .rov-panel::-webkit-scrollbar-thumb:hover,.mi-win .mi-zipchips::-webkit-scrollbar-thumb:hover,.mi-zipscroll::-webkit-scrollbar-thumb:hover,.mi-maplegend::-webkit-scrollbar-thumb:hover,.mi-mapframe.fs::-webkit-scrollbar-thumb:hover,.mi-fsbox.fs::-webkit-scrollbar-thumb:hover,.g-fsbox.fs::-webkit-scrollbar-thumb:hover,.rc-wrap::-webkit-scrollbar-thumb:hover,.railin::-webkit-scrollbar-thumb:hover{background:var(--ink3)}
.rep-scrollbars::-webkit-scrollbar-corner,.rep-table-wrap::-webkit-scrollbar-corner,.rep-window::-webkit-scrollbar-corner,.rp-tblwrap::-webkit-scrollbar-corner,.rep-tall::-webkit-scrollbar-corner,.rp-drawer-scroll::-webkit-scrollbar-corner,.rp-drawer-panel::-webkit-scrollbar-corner,.kwsel::-webkit-scrollbar-corner,#pin-drill .pd-body::-webkit-scrollbar-corner,#rep-overlay .rov-panel::-webkit-scrollbar-corner,.mi-win .mi-zipchips::-webkit-scrollbar-corner,.mi-zipscroll::-webkit-scrollbar-corner,.mi-maplegend::-webkit-scrollbar-corner,.mi-mapframe.fs::-webkit-scrollbar-corner,.mi-fsbox.fs::-webkit-scrollbar-corner,.g-fsbox.fs::-webkit-scrollbar-corner,.rc-wrap::-webkit-scrollbar-corner,.railin::-webkit-scrollbar-corner{background:var(--deep)}
.rep-table{width:100%;border-collapse:collapse;font-size:.82rem}
.rep-table th{text-align:left;font:600 9.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink3);border-bottom:1px solid var(--line);padding:7px 9px}
.rep-table td{border-bottom:1px solid var(--line2);padding:6px 9px;color:var(--ink2)}
.rep-table tr:last-child td{border-bottom:0}
.rep-lead td, .auth-you td{background:var(--gold-soft);color:var(--gold);font-weight:700}
/* (the owner, 2026-09-22) Every website in the authority table wears an icon: one storefront for a business on
   its own site, a row of storefronts for a listing that points INSIDE a bigger site, whose score is the whole
   brand's. The words that say so live in the franchise icon's tooltip, not in the table: hover, keyboard focus
   or a tap (which focuses it) shows them. */
.auth-ic{position:relative;display:inline-flex;align-items:center;vertical-align:-3px;margin-right:8px}
.auth-ic.own{color:var(--ink3)}
.auth-ic.brand{color:var(--gold);cursor:help;border-radius:4px}
.auth-ic.brand:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* the tooltip floats on <body> (report-view.js authTipShow): the table's sideways-scrolling wrapper clipped a bubble
   drawn inside the icon, so this one is placed from the icon's position and nothing can cut it off */
/* (Jose's note 10 of 30 Sep 2026: over an open list drawer too, whose panel stands at 2147483600; the bubble takes no pointer) */
.auth-float{position:fixed;z-index:2147483646;width:max-content;max-width:290px;padding:9px 11px;border-radius:8px;
  background:var(--surface);border:1px solid var(--line);box-shadow:0 10px 28px rgba(0,0,0,.5);
  font:400 12px/1.5 var(--body);color:var(--ink2);text-align:left;
  opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .12s,transform .12s,visibility .12s;pointer-events:none}
.auth-float.on{opacity:1;visibility:visible;transform:none}
.auth-float::after{content:"";position:absolute;left:var(--ax,16px);top:100%;margin-left:-6px;border:6px solid transparent;border-top-color:var(--line)}
.auth-float.below{transform:translateY(-4px)}
.auth-float.below.on{transform:none}
.auth-float.below::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:var(--line)}
@media (prefers-reduced-motion:reduce){.auth-float{transition:none}}
#area-rows td.in{color:var(--mint);font-weight:700;white-space:nowrap}
#area-rows td.out{color:var(--gold);white-space:nowrap}
/* The one rule for long tables (the polish pass, 2026-09-18): any table over ten rows sits in this window, about
   eight rows tall, scrolling inside, with a fade at the bottom edge and a count line under it (report-view.js
   windowLongTables). Retired the same day into it: .rep-area-scroll (440px) and .rep-lens-scroll (340px). */
.rep-window{position:relative;max-height:318px;overflow:auto}
.rep-window-fade{position:sticky;bottom:0;left:0;right:0;height:30px;margin-top:-30px;background:linear-gradient(rgba(16,21,19,0),var(--surface));pointer-events:none}
.rep-window-count{font:500 10.5px var(--mono);color:var(--ink3);margin:6px 0 0}
.rep-window table{margin-bottom:0}
.rep-grade{display:inline-block;font:700 14px var(--mono);color:var(--gold);border:1px solid var(--gold-line);padding:1px 10px;margin-left:8px;vertical-align:2px}

.rep-matrix th{text-align:center;font-family:var(--mono)}
.rep-matrix th.mx-kw,.rep-matrix th:first-child{text-align:left;font-family:var(--body)}
.rep-matrix td{text-align:center;font-family:var(--mono);font-size:.76rem;color:var(--ink3)}
.rep-matrix td.mx-kw,.rep-matrix td:first-child{text-align:left;font-family:var(--body);color:var(--ink)}
.rep-matrix td.in{color:var(--mint);font-weight:700}
.rep-matrix td.out{color:#4a534e}
.rep-matrix td.na{color:#39413d}
.rep-matrix .mx-rank,.rep-matrix td.mx-rank{font-weight:700;color:var(--gold)}

.rep-feat{display:inline-block;margin-left:6px;padding:0 7px;border-radius:999px;font:600 10px var(--mono)}
.rep-feat-ads{color:var(--gold);background:var(--gold-soft);border:1px solid var(--gold-line)}
.rep-feat-ai{color:var(--mint);background:var(--mint-soft);border:1px solid rgba(67,213,151,.4)}

.rep-lens{margin-top:14px}
.rep-lens:first-child{margin-top:0}
.rep-lens-h{margin:0 0 5px;font-weight:700;font-size:.9rem;color:var(--ink);font-family:var(--body)}
.rep-lens-meta{margin:0 0 6px;color:var(--ink2);font-size:.8rem}
/* .rep-lens-scroll retired 2026-09-18 into .rep-window (above) */

/* ── The share board (who is winning instead) ───────────────────────────── */
/* Identity round W5 (owner pick: variant C, the stat line): one block per
   business — name + the four figures on one line, a full-width bar beneath.
   No header row, ★ inline, dashes hold absent values, gold you-line. */
.shareboard{margin-top:8px;background:var(--surface);border:1px solid var(--line2);padding:8px 16px}
.sb-line{padding:10px 0;border-bottom:1px solid var(--line2);font-size:13px}
.sb-line:last-child{border-bottom:0}
.sb-line.you{background:var(--gold-soft);padding-left:8px;padding-right:8px;margin:0 -8px}
.sb-top{display:flex;justify-content:space-between;gap:14px;align-items:baseline;margin-bottom:6px}
.sb-line .sbname{color:var(--ink);min-width:0;overflow-wrap:break-word}
/* (the re-runs of 3 Oct, P1: a long search in the map-list place pushed the line past 390 px; the values wrap, each one whole
   except the place, whose search may break) */
.sb-top{flex-wrap:wrap}
.sbvals{font:500 .78rem var(--mono);color:var(--ink2);white-space:normal;flex:0 1 auto;min-width:0;text-align:right}
.sbvals .sbv{white-space:nowrap}
.sbvals .sbv.sbv-rank{white-space:normal;overflow-wrap:anywhere}
.sb-line .sbv{color:var(--ink2)}
.sb-line .sbv.dim{color:var(--ink3)}
.sb-line.you .sbname,.sb-line.you .sbv,.sb-line.you .sbvals{color:var(--gold)}
.sbname{color:var(--ink)}
/* two businesses of one name, told apart (the re-run of 3 Oct): a small muted note under the name */
.dup-note{display:block;font:500 .7rem/1.35 var(--body);color:var(--ink3);margin-top:2px;overflow-wrap:anywhere}
@media print{.dup-note{color:#555}}
.sbbar{background:var(--line2);height:9px;overflow:hidden}
.sbfill{background:#246a55;height:100%}
.sbfill.you{background:var(--gold)}
@media (max-width:560px){
  .sb-top{flex-direction:column;gap:2px;align-items:flex-start}
}

/* ── The rival teardown ─────────────────────────────────────────────────── */
.tdown{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.pin-intel-box{background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--gold);padding:15px 17px;margin-top:0}
#pin-intel .pin-intel-box{margin-top:12px}
.pin-intel-box h3{font:700 16px var(--disp);color:var(--ink);margin:0}
.pin-intel-grade{font:500 11px var(--mono);color:var(--gold);margin:3px 0 9px}
.pin-intel-sub{font-size:.82rem;font-weight:700;color:var(--ink);margin:8px 0 3px}
.pin-intel-list{margin:0 0 0 16px;color:var(--ink2);font-size:.82rem}
.pin-intel-list li{padding:2px 0}
.pin-intel-note{color:var(--ink3);font-size:.8rem;border-top:1px solid var(--line2);margin-top:9px;padding-top:8px}
.pin-missing{color:var(--mint);font-style:italic}

/* ── Verbatim AI answers ────────────────────────────────────────────────── */
.ai-box{background:var(--surface);border:1px solid var(--gold-line);padding:14px 17px;margin:0 0 12px}
.ai-box:last-of-type{margin-bottom:0}
.ai-q{margin:0;font-weight:700;font-size:.9rem;color:var(--ink)}
.ai-surface{display:inline-block;font:600 9.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--gold);border:1px solid var(--gold-line);padding:1px 8px;margin-right:8px;vertical-align:1px}
.ai-verdict{margin:7px 0 0;font-size:.82rem;font-weight:700}
.ai-named{color:var(--mint)}
.ai-unnamed{color:var(--bad)}
/* release 32: an answer naming a company under the business's own name that we could not confirm is the business: gray, counted neither way */
.ai-verdict.ai-maybe{color:var(--ink3)}
.ai-brand.ai-maybe{color:var(--ink3);font-style:italic}
.ai-list tr.maybe td{color:var(--ink3)}
/* the polish pass (2026-09-18): the priced searches in three groups, the rows under ten a month folded beneath each */
.vol-group{margin-top:14px}
.vol-group:first-child{margin-top:4px}
.vol-group-h{font:700 15px var(--disp);color:var(--ink);margin:0 0 2px}
.vol-group-n{display:inline-block;font:600 10px var(--mono);color:var(--ink3);border:1px solid var(--line2);border-radius:999px;padding:1px 8px;margin-left:6px;vertical-align:2px}
.vol-group-sub{font-size:.8rem;color:var(--ink3);margin:0 0 6px;max-width:72em}
.vol-fold{margin-top:6px}
.vol-fold>summary{cursor:pointer;font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);padding:6px 10px;background:var(--surface);border:1px solid var(--line2);list-style:none}
.vol-fold>summary::-webkit-details-marker{display:none}
.vol-fold>summary::before{content:"+ ";color:var(--gold)}
.vol-fold[open]>summary::before{content:"\2212 "}
.vol-fold>summary:hover,.vol-fold>summary:focus-visible{color:var(--gold);border-color:var(--gold)}
/* the polish pass (2026-09-18): a list-shaped answer drawn as a list, the customer's row marked */
.ai-listlead{margin:8px 0 0;font-size:.82rem;color:var(--ink2)}
.ai-listwrap{margin-top:6px;padding:4px 10px;max-width:520px}
.ai-list td:first-child,.ai-list th:first-child{width:2.2em;color:var(--ink3)}
.ai-full{margin:8px 0 0}
.ai-full summary{cursor:pointer;font-size:.8rem;font-weight:600;color:var(--mint)}
.ai-text{margin:8px 0 0;padding:10px 12px;border:1px solid var(--line2);background:var(--surface2);
  font-size:.84rem;line-height:1.55;color:var(--ink2);font-style:italic;white-space:pre-wrap}
.ai-mentions{margin:9px 0 0;font:500 11px var(--mono);color:var(--ink3);border-top:1px solid var(--line2);padding-top:8px}
.ai-brand{font-weight:600;color:var(--ink2)}
.ai-you{color:var(--mint);font-weight:700}
/* the ChatGPT sources and ads round (2 Oct 2026): where the AI looked under each answer, the lists it leans on across the
   report, and the ads card's "Inside ChatGPT" group. One row a site, wrapping on a phone (never a sideways scroll). */
.ai-src{margin:10px 0 0;border-top:1px solid var(--line2);padding-top:9px}
.ai-src-h{margin:0;font-size:.8rem;color:var(--ink2)}
.ai-src-k{font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.ai-src-sign{display:inline-block;font:600 10px var(--mono);letter-spacing:.04em;color:var(--mint);background:var(--mint-soft);border:1px solid rgba(67,213,151,.4);border-radius:999px;padding:1px 9px;margin-left:8px;vertical-align:1px}
.ai-src-note,.ai-src-q{margin:6px 0 0;font-size:.8rem;color:var(--ink3)}
.ai-src-q{font-style:italic}
.ai-src-list{list-style:none;margin:6px 0 0;padding:0}
.ai-src-row{padding:5px 0;border-bottom:1px dashed var(--line2)}
.ai-src-row:last-child{border-bottom:0}
.ai-src-line{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;font-size:.84rem}
.ai-src-name{font-weight:600;color:var(--ink);overflow-wrap:anywhere}
a.ai-src-name{color:var(--ink);text-decoration:underline;text-decoration-color:var(--gold-line);text-underline-offset:2px}
a.ai-src-name:hover,a.ai-src-name:focus-visible{color:var(--gold)}
.ai-src-row.you .ai-src-name{color:var(--mint)}
.ai-src-uses,.ai-src-what{font:500 10.5px var(--mono);color:var(--ink3)}
.ai-src-st{font:600 10.5px var(--mono);border-radius:999px;padding:0 8px;border:1px solid var(--line)}
.ai-src-st.good{color:var(--mint);border-color:rgba(67,213,151,.4)}
.ai-src-st.bad{color:var(--bad);border-color:rgba(236,118,99,.45)}
.ai-src-st.quiet{color:var(--ink3)}
.ai-src-title{margin:1px 0 0;font-size:.76rem;color:var(--ink3);overflow-wrap:anywhere}
.ai-sources{margin:14px 0 0;background:var(--surface);border:1px solid var(--gold-line);padding:14px 17px}
.ai-sources-h{font:700 15px var(--disp);color:var(--ink);margin:0 0 2px}
.ai-sources-sub{font-size:.8rem;color:var(--ink3);margin:0 0 4px}
.ai-sources-line{margin:8px 0 0;font-size:.84rem;color:var(--ink2);overflow-wrap:anywhere}
.ai-sources-you .ai-src-sign{margin-left:0;margin-right:4px}
.ai-sources-fix{margin:10px 0 0;padding:8px 11px;border:1px solid rgba(236,118,99,.45);background:var(--bad-soft);font-size:.84rem;color:var(--ink2)}
.ai-ads{margin:14px 0 0;border-top:1px solid var(--line2);padding-top:10px}
.ai-ads-h{font:700 15px var(--disp);color:var(--ink);margin:0 0 4px}
.ai-ads-line{margin:0 0 6px;font-size:.86rem;color:var(--ink2)}
.ai-ads-note{margin:8px 0 0;font-size:.78rem;color:var(--ink3)}

/* ── Search volumes ─────────────────────────────────────────────────────── */
.vol-band{display:inline-block;font:600 11.5px var(--mono);color:var(--mint);border:1px solid rgba(67,213,151,.4);border-radius:999px;padding:0 9px}

/* ── The 90-day plan (prints as a checklist) ────────────────────────────── */
.plan-note{font-size:.85rem;color:var(--ink2);margin:0 0 12px;max-width:72em}
/* ── N1 + P2 + T-B: the ninety days as one ordered list that remembers (the owner, 2026-09-21) ──────────
   The list used to be three headed groups of decorative checkboxes: a span.plan-box marked aria-hidden that
   looked exactly like a control, had never had a listener, and taught a reader on their first click that the
   page was inert. The numbering now runs straight through the months so "in order" is literally true, each
   month is a fold that can be shut once it is finished, and each task carries three real states. */
.plan-prog{display:flex;align-items:center;gap:11px;padding:10px 13px;margin:0 0 12px;
  background:var(--surface2);border:1px solid var(--line2);border-radius:10px}
.plan-prog b{font:700 16px var(--disp);color:var(--mint);flex:0 0 auto;min-width:44px}
.plan-track{flex:1;height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.plan-track i{display:block;height:100%;border-radius:3px;background:var(--mint);transition:width .18s ease}
.plan-progt{flex:0 0 auto;font:500 11px var(--mono);color:var(--ink3)}
.plan-fold{margin:0 0 10px}
.plan-fold:last-child{margin-bottom:0}
.plan-fold>summary{display:flex;align-items:baseline;gap:10px}
.plan-foldname{color:var(--gold);letter-spacing:.06em}
.plan-foldn{margin-left:auto;font:500 10px var(--mono);color:var(--ink3);text-transform:none;letter-spacing:0}
.plan-foldbody{padding:10px 2px 2px}
/* the finding every task in a month shares, said once above them instead of repeated under each */
.plan-shared{list-style:none;font-size:.79rem;color:var(--ink2);margin:2px 0 4px 34px;padding:4px 10px;border:1px solid var(--line);border-radius:6px}
.plan-empty{font-size:.82rem;color:var(--ink3);margin:0}
.plan-list{list-style:none;margin:0;padding:0}
.plan-item{display:flex;gap:12px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line2)}
.plan-item:last-child{border-bottom:0}
.plan-n{flex:0 0 auto;min-width:22px;font:600 11px var(--mono);color:var(--ink3);padding-top:3px}
.plan-item.is-doing .plan-n{color:var(--gold)}
.plan-item.is-done .plan-n{color:var(--mint)}
.plan-item.is-done .plan-body>b{color:var(--ink3);text-decoration:line-through}
.plan-item.is-done .plan-claim,.plan-item.is-done .plan-src{opacity:.5}
/* P2: three states. Real buttons in a radiogroup, so a keyboard reaches them and a reader is told which is set. */
.plan-seg{display:inline-flex;margin-top:6px;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.plan-st{font:600 9.5px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);
  background:transparent;border:0;border-right:1px solid var(--line);padding:5px 10px;cursor:pointer}
.plan-st:last-child{border-right:0}
.plan-st:hover{color:var(--ink)}
.plan-st:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.plan-st-doing.on{background:rgba(230,182,84,.16);color:var(--gold)}
.plan-st-done.on{background:rgba(67,213,151,.16);color:var(--mint)}
.plan-st-todo.on{background:var(--surface2);color:var(--ink)}
@media print{
  /* the controls are screen furniture; the state they set is not, so the rule-through and the count stay */
  .plan-seg{display:none !important}
  .plan-prog{border-color:#999;background:#fff}
  .plan-prog b{color:#1c5f28}
  .plan-item.is-done .plan-body>b{color:#555 !important}
  .plan-foldname{color:#5a4413}
  .plan-shared{color:#333;border-color:#999}
}
/* min-width:0, a flex item that may be narrower than its longest chip: a chapter chip's width:max-content set the step's
   narrowest width, and on a 320 or 360 px phone "Chase Google's top three…" ran 48 px past the screen and the page scrolled
   sideways (found measuring the strip's box for the release review of 30 Sep 2026; the chip's max-width:100% now holds) */
.plan-body{display:block;min-width:0}
.plan-body b{display:block;font-size:.88rem;color:var(--ink)}
.plan-claim{display:block;font-size:.79rem;color:var(--ink2);margin-top:1px}
.plan-src{display:block;font:600 9.5px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--gold);margin-top:3px}

/* ── THE TEXT HEAVY CHAPTERS MADE SHORT, AND THE SHARED DETAILS (builder L2, 28 Sep; the owner: "analyze the entire market
   intel report for similar issues so we can take care of all of them now"; audit A's A-P2-4, -6, -9, -10, -11 and P3-2,
   -3, -4). The folds themselves are V2's details.mi-more, above. ─────────────────────────────────────────────────────── */
/* the plan: a step's chapter as a small chip that opens it (A-P2-11) */
a.plan-src.plan-srcchip{display:inline-flex;align-items:center;width:max-content;max-width:100%;margin:6px 10px 0 0;padding:2px 9px;border:1px solid var(--gold-line);border-radius:999px;text-decoration:none;color:var(--gold);background:transparent;vertical-align:middle}
a.plan-src.plan-srcchip:hover,a.plan-src.plan-srcchip:focus-visible{background:var(--gold-soft);border-color:var(--gold);outline:none}
/* a note behind a "?" (A-P2-6, A-P2-9): a small round button at the end of its line, the note under the line when opened */
.mi-qbtn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:2px;padding:0;vertical-align:1px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink3);font:600 10.5px/1 var(--mono);cursor:pointer}
.mi-qbtn:hover,.mi-qbtn:focus-visible,.mi-qbtn[aria-expanded="true"]{color:var(--gold);border-color:var(--gold);outline:none}
.mi-qnote{margin:-4px 0 12px;padding:6px 12px;border:1px solid var(--gold-line);border-radius:8px;background:var(--gold-soft);max-width:72em;font-size:.8rem;line-height:1.55;color:var(--ink2)}
.mi-qnote p,.mi-qnote .mapcap{margin:0 0 4px;font:inherit;color:inherit}
.mi-qnote > :last-child{margin-bottom:0}
/* who dominates: the three cards, one layout (A-P2-6). Four rows the three cards share (a subgrid): the rank, the name on at
   most two lines (its whole name in its title), one line of facts, one line of chips, each row as tall in all three. */
.mi-pcard .pn{display:flex;flex-wrap:wrap;align-items:center;align-content:flex-start;gap:4px 8px;margin:0}
.mi-pcard .mi-pmarks{margin-left:auto;display:inline-flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
.mi-pcard .mi-pmarks .mi-mark,.mi-pcard .mi-pmarks .mi-named-mark{margin:0}
.mi-pcard .mi-pname{margin:3px 0 4px;line-height:1.3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.mi-pcard .mi-pfacts{margin:0 0 5px}
.mi-pcard .mi-pchips{display:flex;flex-wrap:wrap;align-items:center;align-content:flex-start;gap:4px 6px;margin:0}
.mi-pcard .mi-pchips a.mi-gbp{font:500 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);border-bottom:0}
.mi-pcard .mi-pchips a.mi-gbp:hover,.mi-pcard .mi-pchips a.mi-gbp:focus-visible{color:var(--gold)}
@media (min-width:821px){
  @supports (grid-template-rows:subgrid){
    .mi-podium{grid-template-rows:repeat(4,auto)}
    .mi-pcard{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0;align-content:start}
  }
  @supports not (grid-template-rows:subgrid){.mi-pcard .mi-pname{min-height:2.6em}}
}
/* the openings' one line under its tiles (A-P2-10) */
.mi-opnline{margin:10px 0 0}
/* one date a chapter group (P3-4, report-view.js miChipsOnce): a stamp that says what its group's last one said is kept for a
   screen reader and not drawn; a subscriber's folded chapter is one row and keeps its own */
.rep-card:not(.sb-fold) > h2 .mi-chip.mi-chip-same{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0;padding:0;border:0}
/* full screen says what it shows, and its charts take the screen's width (P3-2): the chapter's own heading, which the kicker
   over it prints on the page, is shown in the box; a drawn chart fills the box's width at its own shape */
.rep-card.mi-fsbox.fs > h2{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 16px}
.rep-card.mi-fsbox.fs > h2 .rep-h2t,.rep-card.mi-fsbox.fs > h2.rep-h2-sr{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;margin:0;padding:0}
.rep-card.mi-fsbox.fs > h2 .rep-h2t{font:700 24px/1.15 var(--disp);color:var(--ink)}
.rep-card.mi-fsbox.fs > h2 .rep-h2t + *{margin-left:0}
.mi-fsbox.fs .rp-histwrap svg,.mi-fsbox.fs svg.rp-spark{width:100%;max-width:none;height:auto;max-height:44vh}
.mi-fsbox.fs .rp-season{max-width:none}
/* the outside twelve's "Show all" is a phone screen's alone (below): a desktop and paper show the twelve whole */
.mi-rowsmore{display:none}
/* (a screen's rules alone: a page of paper is under 760 px wide too, and prints the tables as tables) */
@media screen and (max-width:760px){
  /* who dominates on a phone (A-P2-6): each row a short stacked entry, the number and the name, then its facts, never a table
     of 588 px panned in a panel of 352 with names on three to six lines */
  #milb-tablewrap,#milb-outside{overflow:visible;background:var(--surface);padding:2px 0}
  #milb-tablewrap table,#milb-outside table{display:block;width:100%}
  #milb-tablewrap thead,#milb-outside thead{display:none}
  #milb-tablewrap tbody,#milb-outside tbody{display:block}
  #milb-tablewrap tr,#milb-outside tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 12px;position:relative;padding:9px 10px 9px 40px;border-bottom:1px solid var(--line2)}
  #milb-tablewrap tr:last-child,#milb-outside tr:last-child{border-bottom:0}
  #milb-tablewrap td,#milb-outside td{display:block;padding:0;border:0;background:none;font-size:.78rem;text-align:left;position:static}
  #milb-tablewrap td.lb-n,#milb-outside td.lb-n{position:absolute;left:10px;top:10px;width:24px;font:600 11px var(--mono);color:var(--ink3)}
  #milb-tablewrap td.lb-name,#milb-outside td.lb-name{flex:1 1 100%;font-size:.86rem;color:var(--ink)}
  #milb-tablewrap td[data-u]::after,#milb-outside td[data-u]::after{content:" " attr(data-u)}
  #milb-tablewrap td[data-pre]::before,#milb-outside td[data-pre]::before{content:attr(data-pre) " "}
  #milb-tablewrap tr.you{background:var(--gold-soft)}
  #milb-tablewrap tr.you td{background:none}
  #milb-tablewrap tr.rival,#milb-outside tr.rival{background:rgba(199,146,234,.09)}
  #milb-tablewrap tr.rival td,#milb-outside tr.rival td{background:none}
  #milb-outside .mi-source{padding:0 10px}
  #milb-outside .rp-chips{padding:0 10px 6px}
  /* the first five of the twelve from outside, and "Show all" (report-view.js miChLeaderboard) */
  #milb-outside:not(.lb-all) tr.lb-later{display:none}
  .mi-rowsmore{display:inline-flex;align-items:center;min-height:44px;margin:6px 10px 4px;padding:0 16px;border:1px solid var(--gold-line);border-radius:999px;background:transparent;color:var(--gold);font:600 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
  .mi-rowsmore:hover,.mi-rowsmore:focus-visible{background:var(--gold-soft);border-color:var(--gold);outline:none}
  /* TAP TARGETS (P3-3): 44 px tall where a thumb lands. A name in a table and its Google link grow by padding (an inline
     box's padding moves nothing around it, and its dotted line moves to the text); the plan's steps' states and the map key's
     "what the marks mean" grow outright; a key entry, a "?" and the brief's "See it" take a hit area of 44 px around them. */
  /* (the grown area sits over the row's own words, never under them: a tap on the facts under a name is the name's) */
  td .mi-biz,.mi-pcard .mi-biz{padding:15px 0;position:relative;z-index:1;border-bottom:0;text-decoration:underline dotted var(--gold-line);text-underline-offset:3px}
  .mi-pcard .mi-pname{display:block;-webkit-line-clamp:unset;line-clamp:none;overflow:visible}
  td .mi-biz:hover,td .mi-biz:focus-visible,.mi-pcard .mi-biz:hover,.mi-pcard .mi-biz:focus-visible{border-bottom:0;text-decoration:underline solid var(--gold)}
  td .mi-namewrap a.mi-gbp,.mi-pcard .mi-namewrap a.mi-gbp{padding:15px 4px;position:relative;z-index:1}
  .plan-st{min-height:44px;padding:0 14px}
  .mi-lgmore{min-height:44px}
  .rp-stack .lg span.rp-facet,.rp-legend span.rp-facet,.mi-qbtn,.mi-pcard .mi-pchips a.mi-gbp{position:relative;z-index:1}
  .rp-stack .lg span.rp-facet::after,.rp-legend span.rp-facet::after,.mi-pcard .mi-pchips a.mi-gbp::after{content:"";position:absolute;left:0;right:0;top:50%;height:44px;transform:translateY(-50%)}
  .mi-qbtn::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
}
@media print{
  /* a "?" note prints, and its button does not; the podium prints each name whole */
  .mi-qbtn{display:none !important}
  .mi-qnote,.mi-qnote[hidden]{display:block !important;border-color:#999;background:none;color:#333}
  .mi-pcard .mi-pname{display:block;-webkit-line-clamp:unset;line-clamp:none;overflow:visible}
  a.plan-src.plan-srcchip{border-color:#999;color:#5a4413}
}

/* ── Review digest ──────────────────────────────────────────────────────── */
.rd-lowstar{background:var(--bad-soft);border:1px solid rgba(236,118,99,.4);color:var(--ink);padding:10px 14px;font-size:.85rem;margin:6px 0 0}
.rd-platforms-title,.rd-newest-title{margin-top:18px}
.rd-platform-missing{color:var(--ink3);font-style:italic}
.rd-review{background:var(--surface);border:1px solid var(--line2);padding:12px 15px;margin-top:10px}
.rd-review-low{border-color:rgba(236,118,99,.45)}
.rd-review-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rd-review-source{font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.rd-review-new{font:600 10px var(--mono);color:var(--mint);border:1px solid rgba(67,213,151,.4);border-radius:999px;padding:0 8px}
.rd-review-rating{font:600 12px var(--mono);color:var(--ink2)}
.rd-review-flag{font:600 10px var(--mono);color:var(--bad);border:1px solid rgba(236,118,99,.4);border-radius:999px;padding:0 8px}
.rd-review-title{font-weight:700;font-size:.88rem;color:var(--ink);margin:6px 0 0}
.rd-review-snippet{font-size:.84rem;color:var(--ink2);margin:4px 0 0}
.rd-review-link{font-size:.8rem;display:inline-block;margin-top:6px}

/* ── Market intel / link audit extras ───────────────────────────────────── */
.mi-lowdata{background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--ink);padding:10px 14px;font-size:.85rem;margin:6px 0 8px;max-width:72em}
.mi-source{font:500 10px var(--mono);color:var(--ink3);margin-top:10px}
/* ── Market Intelligence v2 (M3): the owner-approved composition, ported from the
   eco mockup (docs/intel-mockup-2026-09-01.html) onto the report's own tokens. ── */
.mi-chip{display:inline-block;vertical-align:middle;margin-left:12px;font:600 9px var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:2px 9px;border:1px solid}
.mi-chip.live{color:var(--mint);border-color:rgba(67,213,151,.45);background:var(--mint-soft)}
.mi-chip.book{color:var(--ink2);border-color:#33302b;background:var(--surface)}
.mi-chip.dual{color:var(--gold);border-color:var(--gold-line);background:var(--gold-soft)}
.mi-herowrap{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(220px,.7fr);gap:26px;align-items:center}
@media (max-width:900px){.mi-herowrap{grid-template-columns:1fr}}
.mi-hverdict{font:700 30px/1.15 var(--disp);color:var(--ink);max-width:19em;margin:0}
.mi-hverdict b{color:var(--mint)}
.mi-hsub{color:var(--ink2);font-size:.9rem;margin:12px 0 0;max-width:44em}
.mi-fresh{border:1px solid rgba(67,213,151,.35);background:var(--mint-soft);padding:10px 14px;margin:16px 0 0;font-size:.85rem;color:var(--ink2);max-width:50em}
.mi-fresh b{color:var(--mint)}
.mi-fresh.bookline{border-color:var(--line2);background:var(--surface)}
.mi-fresh.bookline b{color:var(--ink)}
.mi-gauge{width:100%;max-width:250px;display:block;margin:0 auto}
.mi-gauge .gtrack{stroke:var(--line);stroke-width:15;fill:none}
.mi-gauge .gfill{stroke:var(--gold);stroke-width:15;fill:none}
.mi-gauge text{fill:var(--gold);font:700 44px var(--disp)}
.mi-gauge .gcap{fill:var(--ink3);font:500 8.5px var(--mono);letter-spacing:.12em;text-transform:uppercase}
/* 02B: the glance as bordered stat cards */
.mi-v2 .rep-stat-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.mi-v2 .rep-stat{background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--mint);padding:13px 15px;min-width:0}
.mi-v2 .rep-stat-warn{border-top-color:var(--gold)}
.mi-v2 .rep-stat b{font-size:34px}
.mi-roi{display:block;font:600 8.5px var(--mono);letter-spacing:.1em;margin-top:3px;color:var(--ink3);text-transform:uppercase}
/* 03B: the full-width market map */
/* `isolation:isolate` is doing real work here, and it fixes three bugs rather than one.
   Leaflet numbers its own layers from 200 (tiles) to 1000 (the attribution and the zoom control), and it never
   creates a stacking context to hold them in. This box did not either -- position:relative with z-index:auto
   makes no context -- so that whole 200-to-1000 ladder competed in the PAGE's root context, where it outranked
   every overlay the report has: the business drawer (60), the pin drill-down (80), the insight card (110) and
   the report overlay (115). Anywhere one of them crossed the map, the map's markers, chips and controls painted
   straight through it. The owner saw it as the side bar being half hidden behind the map; it was all four.
   One declaration contains the ladder inside the map, and the overlays win again without any of them moving. */
.mi-map{position:relative;isolation:isolate;width:100%;aspect-ratio:960/430;overflow:hidden;background:var(--bg);border:1px solid var(--line2);margin-top:12px}
.mi-stage{position:absolute;top:0;left:0;transform-origin:0 0}
/* THE DRAWING WITHOUT THE MAP LIBRARY DRAWS THE MAP'S OWN MARKS (the review of c493f73c, LOW-4): its key is the map's
   key, so a zip is the badge's square (the edge an inset line, so a chosen square's white edge can take its place), your
   zip the purple ring round it (gold until the owner's ruling of 30 Sep 2026), a map point the plus, an outside ring the
   map's grey ring; it drew circles and dots the key never showed. */
.mi-dot{position:absolute;display:flex;align-items:center;justify-content:center;border-radius:6px;background:rgba(20,26,23,.86);box-shadow:inset 0 0 0 1.5px rgba(67,213,151,.8);color:#eef2ef;font:700 11px var(--mono)}
.mi-dot.weak{box-shadow:inset 0 0 0 1.5px rgba(230,182,84,.85)}
.mi-zip{position:absolute;font:500 8.5px var(--mono);color:var(--ink3);letter-spacing:.04em;text-shadow:0 1px 2px #000}
/* YOUR ZIP IS PURPLE (the owner's ruling of 30 Sep 2026: "'a weak zone' is a yellow colored border which is too similar to
   'your zip'"). The report's own --purp, which no other mark of the market map uses; a weak zone stays gold. On paper the
   print sheet's --purp, a darker purple that holds its contrast on white. */
.mi-ring{position:absolute;border-radius:8px;border:3px solid var(--purp)}
/* the competitor you named and your own business, the map's own figures (report-view.js mapMark) */
.mi-smark{position:absolute;width:22px;height:22px;line-height:0}
/* and in the map's order (the delta review of 2f6833cd): the points under the squares, the competitor you named and your
   business over them, as the map stacks them (ticks 100, badges 1000 and up, the two figures 100600 and up). Drawn in
   document order, 61 pluses lay over the sample's eleven squares, on every square's count and in the way of its click. */
.mi-stage .mi-pin{z-index:1}.mi-stage .mi-dot,.mi-stage .mi-ring{z-index:2}.mi-stage .mi-ring{pointer-events:none}.mi-stage .mi-smark{z-index:3}.mi-stage .mi-dot.grp{cursor:pointer}
/* M3.6 S3: the customer's own service area, drawn on the mosaic */
.mi-area-svg{position:absolute;top:0;left:0;pointer-events:none}
.mi-area{fill:rgba(230,182,84,.10);stroke:var(--gold);stroke-width:2;stroke-dasharray:7 5;stroke-linejoin:round}
.mi-lgdot.area{border-radius:3px;background:rgba(230,182,84,.10);box-shadow:none;border:2px dashed var(--gold)}
/* THE KEY UNDER THE MAP (the owner, 28 Sep 2026: "the bottom part that shows all the icons and legends is too cluttered and
   not symmetric"; report-view.js drawMapKey). One box: a line saying why the shaded view is on while that is the map's
   own choice; the shaded view's steps as one scale bar of equal parts, the dot of a zip with no shape under it; the marks
   on the map in the view on screen in a grid of EQUAL columns, one a heading ("Zip codes", "Businesses", "Search points"),
   each mark a short word on one line (its whole sentence is its hover); and "what the marks mean", which opens every mark
   with its sentence in the drawer. As many columns as there are headings where the key is wide enough, ONE column where
   it is not (a phone, a tablet's narrow column): the key's own width decides, a container query. Full screen the same. */
.mi-maplegend{container:mikey/inline-size;margin-top:10px;padding:10px 12px;background:var(--surface);border:1px solid var(--line2);border-radius:3px;font:500 12px/1.4 var(--body);color:var(--ink2)}
.mi-lgstatus{margin:0 0 9px;font:500 12px/1.5 var(--body);color:var(--ink)}
.mi-lgscale{display:grid;grid-template-columns:minmax(0,1fr);gap:6px 14px;align-items:center;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--line2)}
.mi-lgscale .kk,.mi-lghead{font:600 9.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.mi-lgscale .bar{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px}
.mi-lgscale .seg{display:flex;flex-direction:column;gap:4px;min-width:0;text-align:center;font:500 10.5px var(--mono);color:var(--ink2)}
.mi-lgscale .seg i{display:block;height:10px;border:1px solid rgba(67,213,151,.4);box-sizing:border-box;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.mi-lgscale .seg:first-child i{border-radius:2px 0 0 2px}.mi-lgscale .seg:last-child i{border-radius:0 2px 2px 0}
.mi-lgscale .shdot{grid-column:1/-1}
.mi-lgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px 24px}
.mi-lggrp{display:flex;flex-direction:column;gap:3px;min-width:0}
.mi-lghead{margin:0 0 4px;padding-bottom:4px;border-bottom:1px solid var(--line2)}
.mi-maplegend .lg{display:flex;align-items:center;gap:8px;min-width:0;min-height:20px}
.mi-lggrp .lg{white-space:nowrap}
.mi-maplegend .lg > span:first-child{flex:0 0 auto}
@container mikey (min-width:560px){
  .mi-lgscale{grid-template-columns:auto minmax(0,1fr)}
  .mi-lgrid.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container mikey (min-width:660px){.mi-lgrid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mi-lgfoot{display:flex;justify-content:flex-end;margin-top:8px}
.mi-lgmore{flex:0 0 auto;padding:4px 9px;font:600 10.5px var(--mono);letter-spacing:.02em;color:var(--gold);background:transparent;border:1px solid var(--gold-line);border-radius:4px;cursor:pointer;white-space:nowrap}
.mi-lgmore:hover{background:var(--gold-soft)}
.mi-lgfull{display:flex;flex-direction:column;gap:11px;padding:4px 0 8px;font:500 12px/1.5 var(--body);color:var(--ink2)}
.mi-lgfull .mi-lghead{margin:6px 0 0}.mi-lgfull .mi-lghead:first-child{margin-top:0}
/* The key opened in a drawer (the owner, 2026-09-10): the drawer's scroll box draws its own border and
   carries no padding, because a table inside it should meet that border. A KEY should not: its marks sat
   four pixels off the frame and read as though they were falling out of it. */
.rp-drawer-scroll > .mi-lgfull{padding:14px 16px 16px}
.mi-lgfull .lg{display:flex;align-items:flex-start;gap:10px}
.mi-lgfull .lg > span:first-child{flex:0 0 auto;margin-top:2px}
/* ON PAPER WITH NO VIEW ON (the release review of 30 Sep 2026; report-view.js mapLinePaper and drawMapKey): the line of what
   the printed map shows and the head of the whole key print alone; the screen's sentences, which speak of the switch and the
   Layers menu that do not print, stay on the screen (the print rules, below) */
.mi-onpaper{display:none}
.mi-lgref{margin:0 0 8px;font:500 12px/1.5 var(--body);color:var(--ink)}
/* the shaded view's own swatches: a shape's edge (a weak zone's gold, an enclosed zip's dash, your zip's thick purple since
   the owner's ruling of 30 Sep 2026, as the map draws them), the dot of a zip with no shape (report-view.js zipShadeDot),
   and the steps' shades in a row */
.mi-lgdot.shp{width:18px;height:12px;border-radius:2px;background:rgba(67,213,151,.28);box-shadow:none;border:1px solid rgba(67,213,151,.5);box-sizing:border-box}
.mi-lgdot.shp.weak{border:1.8px solid var(--gold)}
.mi-lgdot.shp.enc{border:1.5px dashed rgba(67,213,151,.6)}
.mi-lgdot.shp.you{border:3px solid var(--purp)}
.mi-lgdot.shdot,.mi-lgdot.shades{width:auto;height:auto;border-radius:0;background:none;box-shadow:none;line-height:0}
.mi-lgdot.shdot svg,.mi-lgdot.shades svg{display:block}
.mi-lgdot{width:13px;height:13px;border-radius:50%;background:rgba(67,213,151,.24);box-shadow:inset 0 0 0 1.5px rgba(67,213,151,.75)}
.mi-lgdot.weak{background:rgba(230,182,84,.22);box-shadow:inset 0 0 0 1.5px rgba(230,182,84,.7)}
/* your zip's key is the map's own mark (28 Sep 2026, the key checked against the map): the zip's square with the ring
   round it (.mk-sq.you), where it had been a gold circle nothing on the map draws; the ring purple since the owner's
   ruling of 30 Sep 2026 */
.mi-lgdot.ring{width:11px;height:11px;margin:0 1px;border-radius:3px;background:rgba(20,26,23,.86);border:1.5px solid rgba(67,213,151,.8);box-shadow:0 0 0 2.5px var(--purp);box-sizing:border-box}
/* the service area as a shape (2026-09-07): an enclosed zip in a lighter tone, a counted zip with nothing located, a PO-box zip as a small dot */
.mi-dot.enc{box-shadow:inset 0 0 0 1.5px rgba(67,213,151,.38);color:#cfd8d3}
.mi-dot.zero{font-size:10px;color:var(--ink3)}
.mi-cdot{position:absolute;width:9px;height:9px;border-radius:50%;background:#d8c48a;border:1px solid #0c110f;box-sizing:border-box}
.mi-lgdot.sq.enc{border-color:rgba(67,213,151,.38)}
.mi-lgdot.ctx{width:9px;height:9px;background:#d8c48a;box-shadow:none;border:1px solid #0c110f}
/* 04B: the podium */
.mi-podium{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
@media (max-width:820px){.mi-podium{grid-template-columns:1fr}}
.mi-pcard{background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--gold);padding:14px 16px}
.mi-pcard .pn{font:600 10px var(--mono);color:var(--gold);letter-spacing:.12em}
.mi-pcard h3{margin:3px 0 6px}
.mi-pcard .pm{font:500 11px var(--mono);color:var(--ink2)}
.mi-wsite{font:600 10px var(--mono);letter-spacing:.04em}
.ws-real{color:var(--mint)}.ws-dead{color:var(--bad)}.ws-none{color:var(--ink3)}
.ws-builder,.ws-social,.ws-directory{color:var(--gold)}
.rep-table tr.you td{background:var(--gold-soft);color:var(--gold);font-weight:600}
/* the order's rival, tinted wherever a list draws it, beside its "you named" (Jose's note 4 of 30 Sep 2026; report-view.js
   miRivalOf): the buyer's row is gold, a rival's carries the purple of its mark */
.rep-table tr.rival td{background:rgba(199,146,234,.09)}
.mi-pcard.rival{border-color:rgba(199,146,234,.5);background:rgba(199,146,234,.06)}
.mi-win .row.rival{background:rgba(199,146,234,.09);margin:0 -6px;padding-left:6px;padding-right:6px}
.rep-table td.num,.rep-table th.num{text-align:right;font-family:var(--mono)}
/* 05B: the stacked census bar */
.mi-stackbar{display:flex;height:26px;margin-top:14px;border:1px solid var(--line2)}
.mi-stackbar div{height:100%}
.mi-stacklegend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font:500 10.5px var(--mono);color:var(--ink2)}
.mi-stacklegend .lg{display:flex;align-items:center;gap:6px}
.mi-lgsq{width:11px;height:11px;display:inline-block}
.cf-real{background:#246a55}.cf-dead{background:#7c3a2e}.cf-none{background:#3a423e}.cf-unknown{background:#1b2420}
.cf-builder,.cf-social,.cf-directory{background:#6a5426}
/* 06A: the band rows */
.mi-census{margin-top:12px;background:var(--surface);border:1px solid var(--line2);padding:12px 16px}
.mi-crow{display:grid;grid-template-columns:minmax(120px,.9fr) 2.6fr minmax(80px,.5fr);gap:14px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line2);font-size:.85rem}
.mi-crow:last-child{border-bottom:0}
.mi-cbar{background:var(--line2);height:12px;overflow:hidden}
.mi-cfill{height:100%;background:#246a55}
.mi-cnum{color:var(--ink2);text-align:right;font:500 11px var(--mono)}
/* 07A: the seasonality spark */
.mi-spark{width:100%;height:80px;margin-top:10px;display:block}
.mi-spark-months{display:flex;justify-content:space-between;padding:2px 2px 0;font:500 9px var(--mono);color:var(--ink3)}
.mi-spark polyline{fill:none;stroke:var(--mint);stroke-width:2}
.mi-spark .axis{stroke:#242b28;stroke-width:1}
.mi-tech{margin:12px 0 0}
.mi-tech h5{margin:0;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.mi-tech .why{margin:3px 0 6px;font-size:12.5px;color:var(--ink3)}
/* R-6 (round 11): a business's name links to its own Google profile. Underlined on hover only, so a list of
   twelve names does not turn into a wall of rules. */
a.mi-gbp{color:inherit;text-decoration:none;border-bottom:1px dotted var(--line)}
a.mi-gbp:hover,a.mi-gbp:focus-visible{color:var(--gold);border-bottom-color:var(--gold)}
/* R-11 (round 11): the roll and the raw data fold shut, and open into a window with its own height. */
.rep-fold{margin-top:10px}
.rep-fold>summary{cursor:pointer;font:600 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);padding:8px 10px;background:var(--surface);border:1px solid var(--line2);list-style:none}
.rep-fold>summary::-webkit-details-marker{display:none}
.rep-fold>summary::before{content:"+ ";color:var(--gold)}
.rep-fold[open]>summary::before{content:"\2212 "}
.rep-fold>summary:hover,.rep-fold>summary:focus-visible{color:var(--gold);border-color:var(--gold)}
/* the glance's two numbers (audit A of 28 Sep, A-P2-7): each a line whose words open its list, and the way to Presence */
.mi-glance-line{margin:6px 0 0;font-size:.95rem;color:var(--ink2)}
.mi-glance-line b{color:var(--ink);font-weight:600}
.mi-glance-line b.rp-facet{cursor:pointer;border-bottom:1px dotted var(--ink3)}
.mi-glance-link{font:600 11px var(--mono);letter-spacing:.04em;color:var(--gold);text-decoration:none;border-bottom:1px solid var(--gold-line);margin-left:4px;white-space:nowrap}
.mi-glance-link:hover,.mi-glance-link:focus-visible{color:var(--ink)}
@media print{.mi-glance-link{display:none}.mi-glance-line b{color:#111 !important}.mi-glance-line{color:#333 !important}}
/* a caption's rest, a click away (audit A of 28 Sep, A-P2-9): a small disclosure under its short sentence; paper opens it.
   mi-cmore, never mi-more: a chapter's "More detail" (V2's miFace, L2's miFoldOf) is details.mi-more with rules of its own */
.mi-cmore{margin-top:8px}
.mi-cmore>summary{display:inline-block;padding:3px 9px;font-size:10.5px;letter-spacing:.05em}
.mi-cmore-body{font-size:.84rem;color:var(--ink2);margin:6px 0 0;max-width:50em}
@media print{.mi-cmore-body{color:#333 !important}}
/* the rivals card on paper (P3-7; its screen rules sit with the named mark, below the map's; this block stays above the
   map's print block, which three tests hold as the file's last) */
@media print{.mi-named-name{color:#111 !important}.mi-named-where{color:#333 !important}.mi-named-mark{background:#fff !important;color:#111 !important;border:1px solid #777}}
/* A CHAPTER'S FACE AND ITS "MORE DETAIL" (the owner, 28 Sep: the text heavy chapters; report-view.js miFace): the lead
   figure or figures, one line over them, the box, then everything else in one fold, shut until the reader opens it. The
   fold is the rep-fold's look; paper prints it SHUT, as one line naming what it holds (the print rules below, 28 Sep). */
.mi-take{font-size:.95rem;line-height:1.5;color:var(--ink);margin:0 0 14px;max-width:62em}
.mi-face > .rp-kick{margin-top:18px}
.mi-face > .mi-take + .rp-kick{margin-top:4px}
.mi-face > .rp-split,.mi-face > .rp-tiles,.mi-face > .rp-bars,.mi-face > .rp-heat,.mi-face > .rp-tblwrap,.mi-face > .rep-table-wrap{margin-top:12px}
.mi-face > .rp-kick + *{margin-top:0}
.mi-face > .rep-explain{margin-top:16px}
/* the Reach face's ads block, one element so the website's picture of it opens on it (#who-advertises, sampleDeepLink) */
.mi-face > .mi-face-ads{margin-top:18px}.mi-face-ads > .rp-kick{margin-top:0}.mi-face-ads > .rp-kick + *{margin-top:0}
details.mi-more{margin-top:16px}
details.mi-more>summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:10px 12px;background:var(--surface);border:1px solid var(--line2);border-radius:8px}
details.mi-more>summary::-webkit-details-marker{display:none}
details.mi-more>summary .mi-more-t{font:600 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
details.mi-more>summary .mi-more-t::before{content:"+ ";color:var(--gold)}
details.mi-more[open]>summary .mi-more-t::before{content:"\2212\00a0"}
details.mi-more>summary .mi-more-what{font-size:12px;color:var(--ink3)}
details.mi-more>summary:hover,details.mi-more>summary:focus-visible{border-color:var(--gold);outline:none}
details.mi-more>summary:hover .mi-more-t,details.mi-more>summary:focus-visible .mi-more-t{color:var(--gold)}
details.mi-more[open]>summary{margin-bottom:6px}
.mi-more-body{padding-top:14px}
.mi-more-body > .rp-kick:first-child{margin-top:0}
/* "How we counted" as a definition list (Jose's note 2, 30 Sep 2026): one term a line, its words beside it; the colon after
   a term is for a screen reader and a copy, not the eye; a phone stacks the term over its words; paper keeps one a line */
.mi-defs{margin:0;max-width:78em}
.mi-def{display:grid;grid-template-columns:minmax(120px,210px) minmax(0,1fr);gap:2px 16px;padding:7px 0;border-top:1px solid var(--line2)}
.mi-def:first-child{border-top:0;padding-top:0}
.mi-def dt{font:600 10.5px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);padding-top:3px}
.mi-def dd{margin:0;min-width:0}
.mi-def dd .rp-note{margin:0}
.mi-def-sep{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:560px){.mi-def{grid-template-columns:minmax(0,1fr)}}
@media print{.mi-def{break-inside:avoid;page-break-inside:avoid;border-top-color:#ddd}.mi-def dt{color:#555}}
.rep-tall{max-height:62vh;overflow-y:auto}
@media print{.rep-tall{max-height:none;overflow:visible}}
/* 09A: the openings rows */
.mi-openings{background:var(--surface);border:1px solid var(--line2);padding:6px 16px;margin-top:10px}
.mi-orow{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--line2);align-items:baseline}
.mi-orow:last-child{border-bottom:0}
.mi-orow .on{font:700 20px var(--disp);color:var(--gold);min-width:28px}
.mi-orow b{color:var(--ink);font-size:.9rem}
.mi-orow .od{color:var(--ink2);font-size:.83rem;margin:2px 0 0}
/* 12B: the age-mix bar */
.mi-agebar{display:flex;height:26px;border:1px solid var(--line2);margin-top:14px;max-width:640px}
.mi-agebar div{display:flex;align-items:center;justify-content:center;font:600 10px var(--mono);letter-spacing:.04em;overflow:hidden;white-space:nowrap}
.ab-new{background:#2a4a3d;color:#bfeeda}.ab-mid{background:#1b2420;color:var(--ink2)}.ab-vet{background:#6a5426;color:#f2e6c8}
/* 14A: survey-sourced plan steps */
.plan-svy .plan-src{color:var(--mint)}
/* M3.5: presence glyphs (G Google · Y Yelp · F Facebook) + the census strips */
.mi-pres{display:inline-flex;gap:5px;font:600 9.5px var(--mono);letter-spacing:.04em;white-space:nowrap}
.mi-pg{display:inline-block;min-width:16px;text-align:center;padding:1px 4px;border:1px solid #33302b;color:var(--ink3)}
.mi-pg.on{color:var(--mint);border-color:rgba(67,213,151,.5)}
.mi-pg.warn{color:var(--gold);border-color:var(--gold-line)}
.mi-pg.nc{color:var(--ink3);border-style:dashed}
.mi-pg.off{color:#e0836a;border-color:rgba(224,131,106,.55)}
.mi-crow.mi-head{font:600 9.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);border-bottom:1px solid var(--line);padding:9px 0 5px}
.mi-crow.mi-head:first-child{padding-top:0}
.cf-google{background:#246a55}.cf-yelp{background:#6a5426}.cf-fb{background:#2a4a3d}.cf-dir{background:#3a5a4e}.cf-mail{background:#2f4f6a}
/* I3: the signal stack under the verdict, the coverage card, the map tools and panel, the zip table, the lines, the lane bars, the Ads panel, the pins */
.mi-signals{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:14px 0 0;max-width:44em}
.mi-signals .sg{background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--gold);padding:9px 12px}
.mi-signals .sg b{display:block;font:700 22px var(--disp);color:var(--gold)}
.mi-signals .sg small{display:block;color:var(--ink2);font-size:.78rem;line-height:1.3}
.mi-signals .sgb{grid-column:1 / -1;font:500 10.5px var(--mono);color:var(--ink3)}
.mi-coverage .rep-stat-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.mi-coverage .rep-stat{background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--mint);padding:11px 13px;min-width:0}
.mi-coverage .rep-stat b{font-size:26px}
.mi-maptools{display:flex;gap:10px;align-items:center;margin-top:10px;font:500 10.5px var(--mono);color:var(--ink2)}
.mi-maptools button{font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:5px 11px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.mi-maptools button[aria-pressed="true"]{border-color:var(--gold-line);color:var(--gold);background:var(--gold-soft)}
.mi-dot.clickable{cursor:pointer}
.mi-dot.selected{box-shadow:inset 0 0 0 2.5px #fff}
.mi-heat-svg{position:absolute;top:0;left:0;pointer-events:none}
.mi-heat{stroke:rgba(230,182,84,.55);stroke-width:1}
/* (a map point: the plus the rules of .mk-tick draw, below; an outside ring: the map's .mk-out) */
.mi-pin{position:absolute;width:10px;height:10px}
.mi-odot{position:absolute;border-radius:50%;background:rgba(160,170,185,.12);box-shadow:inset 0 0 0 1.5px rgba(160,170,185,.6);color:#c3ccd6;font:500 9px var(--mono);display:flex;align-items:center;justify-content:center}
.mi-lgdot.pin{width:8px;height:8px;background:#8fb8a8;box-shadow:none;border:1px solid #0c110f}
.mi-lgdot.outside{background:rgba(120,150,170,.16);box-shadow:inset 0 0 0 1px rgba(120,150,170,.45)}
.mi-lgdot.heat{border-radius:3px;background:rgba(230,182,84,.45);box-shadow:none}
.mi-zippanel{margin-top:12px;background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--gold);padding:12px 16px}
.mi-zippanel h3{margin:0 0 6px;font:700 18px var(--disp)}
.mi-zippanel .zp{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px 14px;font-size:.83rem;color:var(--ink2)}
.mi-zippanel .zp b{color:var(--ink);font-family:var(--mono)}
.mi-zippanel .zt{margin:8px 0 0;font-size:.83rem;color:var(--ink2)}
.mi-zippanel .zv{margin:6px 0 0;font:500 10.5px var(--mono);color:var(--gold)}
/* THE ZIP TABLE'S COUNTS AND ITS SOFTEST ZIP (Jose's note 5 of 30 Sep 2026). A count that opens its list looks like one (the
   gold of every count that opens a list, dotted under), and its hover and focus are an underline and a mint ring, never the
   gold box the box under the table calls a weak zone; the softest zip carries a chip of its own beside its zip, not gold, and
   the caption says what it is (report-view.js renderZipTable). Each part of "6 of 16" is a button of its own. */
.mi-ziptable .rp-facet{color:var(--gold);text-decoration:underline dotted;text-underline-offset:3px;cursor:pointer}
.mi-ziptable .rp-facet:hover,.mi-ziptable .rp-facet:focus-visible{box-shadow:none;border-color:var(--line2) !important;text-decoration-style:solid}
.mi-ziptable .rp-facet:focus-visible{outline:2px solid var(--mint);outline-offset:-2px}
.mi-ziptable .zc{display:inline-block;min-width:24px;padding:2px 1px;text-align:right}
.mi-mark.soft{color:var(--ink);border-color:var(--ink3)}
@media print{.mi-ziptable .rp-facet{color:#111;text-decoration:none}}
/* the owner, 2026-09-14: ten rows on screen, the rest by scrolling; the header stays put. The audit of 28 Sep (A-P1-1): the
   window is at most 45% of the screen (report-view.js fitZipTable), and the scroll is no longer contained, so a swipe that
   reaches the table's end moves the page on; print shows fifteen rows and says where the rest are (miPrintCaps) */
.mi-zipscroll{overflow:auto}
.mi-zipscroll.scrolls{border-bottom:1px solid var(--line2)}
.mi-zipscroll thead th{position:sticky;top:0;z-index:1;background:var(--surface);box-shadow:0 1px 0 var(--line)}
@media print{.mi-zipscroll{max-height:none !important;overflow:visible !important}}
/* one line a row: the top name and its count, cut short where it must be, and a "+2" that opens the zip's window with all
   three (its title says them too) */
.mi-ziptable .ztw{display:flex;align-items:center;gap:6px;min-width:0}
.mi-ziptable .zt1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mi-ziptable .zt-rest{display:none}
.mi-zipmore{flex:none;font:600 11px/1 var(--mono);letter-spacing:.02em;padding:4px 8px;min-height:24px;min-width:32px;border:1px solid var(--line);border-radius:999px;background:var(--surface2);color:var(--gold);cursor:pointer}
.mi-zipmore:hover{border-color:var(--gold)}
.mi-zipmore:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (pointer:coarse){.mi-zipmore{min-height:32px;min-width:40px}}
@media (min-width:1180px){.mi-ziptable td{white-space:nowrap}.mi-ziptable td:first-child{white-space:normal}.mi-ziptable td.zt{width:36%;max-width:0}}
@media print{.mi-zipmore{display:none !important}.mi-ziptable .zt-rest{display:inline}.mi-ziptable .ztw{display:block}.mi-ziptable .zt1{white-space:normal;overflow:visible}.mi-ziptable td.zt{max-width:none;white-space:normal}}
/* EVERY LONG TABLE STOPS AT FIFTEEN ROWS ON PAPER (the audit of 28 Sep, A-P2-14; report-view.js miPrintCaps): the hook is a
   scroll window in the market book (.rep-window, .rep-tall, .mi-zipscroll) or the class .rep-printcap on anything holding a
   table; a row marked "you" always prints, and a line printed only on paper says where the whole list is */
.rep-printcap-note{display:none}
@media print{
  .leaflet-marker-icon.mi-mk>.mk-cl{background:#fff;color:#111;border-color:#333;box-shadow:none}
  #mi-book .rep-window tbody tr:nth-child(n+16):not(.you),#mi-book .rep-tall tbody tr:nth-child(n+16):not(.you),#mi-book .mi-zipscroll tbody tr:nth-child(n+16):not(.you),#mi-book .rep-printcap tbody tr:nth-child(n+16):not(.you){display:none !important}
  #mi-book .rep-printcap-note:not([hidden]){display:block;margin:4px 0 10px;font:italic 10.5px/1.4 var(--body);color:#333}
  /* a section holding a table may break between the table's rows (never inside one), so the page before it is not left
     half empty because the whole section would not fit on it */
  #mi-book .mi-sec{break-inside:auto;page-break-inside:auto}
  #mi-book table tr,#mi-book .rp-heat .r,#mi-book .rp-heat .hd,#mi-book .rp-card,#mi-book .rp-q,#mi-book .rep-explain{break-inside:avoid;page-break-inside:avoid}
  /* and a section's heading stays with what follows it, and a figure is never cut in two (a field of squares, like a
     table, may carry on over the page) */
  #mi-book .mi-sec h3,#mi-book .mi-sec .sub,#mi-book .rp-kick{break-after:avoid;page-break-after:avoid}
  #mi-book .rp-tiles,#mi-book .rp-stack,#mi-book .rp-ringwrap,#mi-book .rp-bar,#mi-book svg{break-inside:avoid;page-break-inside:avoid}
  /* the zip table's caption says what a click does, and paper has no clicks */
  #mizip-title{display:none !important}
}
.mi-lines{margin-top:14px;display:grid;gap:10px}
.mi-line{background:var(--surface);border:1px solid var(--line2);border-top:2px solid var(--mint);padding:11px 15px}
.mi-line.gold{border-top-color:var(--gold)}
.mi-line h4{margin:0 0 5px;font:600 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.mi-line p{margin:0;font-size:.86rem;color:var(--ink2)}
.mi-line b{color:var(--ink)}
.mi-line .nm{display:inline-block;margin:4px 8px 0 0;font:500 11px var(--mono);color:var(--ink)}
.mi-line .nm small{color:var(--ink3)}
/* the owner's pass (2026-09-02): the lines carry a visual, not a paragraph */
.mi-line table.mi-soft{width:100%;border-collapse:collapse;margin-top:6px;font-size:.84rem}
.mi-line table.mi-soft td{padding:5px 8px 5px 0;border-bottom:1px solid var(--line2);vertical-align:middle}
.mi-line table.mi-soft tr:last-child td{border-bottom:0}
.mi-line table.mi-soft td.num{font-family:var(--mono);text-align:right;white-space:nowrap;color:var(--ink2)}
.mi-line table.mi-soft td.bar{width:34%}
.mi-line .mi-bar{height:9px;background:var(--line2);overflow:hidden}.mi-line .mi-bar i{display:block;height:100%;background:var(--gold)}
.mi-line .mi-state{font:600 9.5px var(--mono);letter-spacing:.04em;padding:1px 6px;border:1px solid var(--gold-line);color:var(--gold);white-space:nowrap}
.mi-line .mi-state.off{border-color:rgba(224,131,106,.55);color:#e0836a}
.mi-line .mi-dirs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:8px}
.mi-line .mi-dir{background:var(--surface2);border:1px solid var(--line2);padding:9px 11px}
.mi-line .mi-dir b{display:block;font:700 22px var(--disp);color:var(--ink)}.mi-line .mi-dir small{color:var(--ink2);font-size:.78rem}.mi-line .mi-dir .mi-bar{margin-top:6px}.mi-line .mi-dir .mi-bar i{background:#246a55}
.mi-line .mi-dir.miss{border-color:var(--gold-line)}.mi-line .mi-dir.miss small{color:var(--gold)}
.mi-line .mi-stack{display:flex;height:22px;margin-top:8px;border:1px solid var(--line2)}.mi-line .mi-stack div{height:100%;min-width:2px}
.mi-line .mi-stacklegend{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;font:500 10.5px var(--mono);color:var(--ink2)}.mi-line .mi-stacklegend .lg{display:flex;align-items:center;gap:6px}
@media (max-width:700px){.mi-line .mi-dirs{grid-template-columns:1fr}}
.mi-ads{margin-top:14px;background:var(--surface);border:1px solid var(--line2);padding:10px 16px}
.mi-ads summary{cursor:pointer;font:600 10.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.mi-ads-body p{font-size:.86rem;color:var(--ink2);margin:10px 0 0}
.mi-ads-body b{color:var(--ink)}
.mi-orow .op{font:500 10px var(--mono);color:var(--gold);letter-spacing:.06em;margin-left:8px}
@media (max-width:760px){.mi-hverdict{font-size:24px}.mi-signals{grid-template-columns:1fr 1fr}}
/* Print (adversarial M3-1): the market chapters go ink-on-paper like the rest of
   the sheet; the bars keep their fills where the browser allows it. */
@media print{
  .mi-hverdict,.mi-hverdict b,.mi-orow b,.mi-fresh b,.mi-pcard h3,.mi-crow{color:#111 !important}
  .plan-svy .plan-src{color:#1c5f28}
  .mi-hsub,.mi-orow .od,.mi-fresh,.mi-maplegend,.mi-stacklegend,.mi-cnum,.mi-pcard .pm,.mi-line p,.mi-zippanel .zp,.mi-ads-body p{color:#333 !important}
  .mi-signals .sg b,.mi-line b,.mi-zippanel h3{color:#111 !important}
  .mi-maptools{display:none}
  .mi-fresh{border-color:#777;background:#fff}
  .mi-chip{color:#111 !important;border-color:#777 !important;background:#fff !important}
  .mi-pg.off{color:#8a2f1c !important;border-color:#8a2f1c !important}
  .mi-area{stroke:#b08d2f !important;fill:none !important}.mi-lgdot.area{border-color:#b08d2f !important}
  .mi-gauge .gtrack{stroke:#ddd}.mi-gauge .gfill{stroke:#b08d2f}.mi-gauge text{fill:#111}.mi-gauge .gcap{fill:#555}
  .mi-v2 .rep-stat,.mi-pcard,.mi-openings,.mi-census{background:#fff;border-color:#999}
  .mi-map{border-color:#999;break-inside:avoid}
  .mi-dot{background:#fff;box-shadow:inset 0 0 0 1.5px #333;color:#111}
  .mi-dot.weak{box-shadow:inset 0 0 0 1.5px #999}
  .mi-zip{color:#555;text-shadow:none}
  /* your zip's ring in the print sheet's --purp (#7a3ea3, 6.9 to 1 on white; the dark gold #b08d2f it replaces was 3.1): the
     owner's ruling of 30 Sep 2026 made your zip purple and left a weak zone gold */
  .mi-ring{border-color:var(--purp)}
  .mi-lgdot{background:#fff;box-shadow:inset 0 0 0 1.5px #333}
  .mi-lgdot.weak{box-shadow:inset 0 0 0 1.5px #999}
  /* r12-legend-c in print: paper has no button to press, so the grid of short words and the button go and the whole key
     prints, every mark with its full sentence (the shaded view's scale stays, when that view is on). This is why the key
     is built into the page rather than made when the button is pressed. */
  .mi-maplegend{display:block;overflow:visible;background:#fff;border-color:#999}
  .mi-maplegend .mi-lgrid,.mi-lgfoot,.mi-lgmore{display:none !important}
  .mi-maplegend .mi-lgfull,.mi-maplegend .mi-lgfull[hidden]{display:flex !important;color:#333}
  .mi-lgstatus,.mi-lgscale .seg,.mi-lghead,.mi-lgscale .kk{color:#333 !important}
  /* with no view on, the paper's own sentences and not the screen's (the release review of 30 Sep 2026, above) */
  .mi-onscreen{display:none !important}
  .mi-onpaper:not([hidden]){display:block !important}
  .mi-lgref{color:#333 !important}
  .mi-mapnote{background:#fff;border-color:#999;color:#333}
  .mi-stackbar,.mi-agebar,.mi-cbar{border:1px solid #999;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .mi-stackbar div,.mi-agebar div,.mi-lgsq,.mi-cfill{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .cf-real,.mi-cfill{background:#555 !important}.cf-dead{background:#8a2f1c !important}.cf-none{background:#ddd !important}
  .cf-builder,.cf-social,.cf-directory{background:#b08d2f !important}.cf-unknown{background:#eee !important}
  .mi-pg{color:#777 !important;border-color:#bbb !important}.mi-pg.on{color:#1d5c46 !important;border-color:#1d5c46 !important;font-weight:700}
  .mi-pg.warn{color:#8a6a1c !important;border-color:#8a6a1c !important;font-weight:700}.mi-pg.nc{color:#999 !important}
  .ab-new{background:#cfe3d8 !important;color:#111 !important}.ab-mid{background:#eee !important;color:#111 !important}.ab-vet{background:#e8d7a8 !important;color:#111 !important}
  .mi-wsite,.ws-real,.ws-dead,.ws-none,.ws-builder,.ws-social,.ws-directory{color:#333 !important}
  .rep-table tr.you td{background:#f3ead2;color:#5a4413}
  .rep-table tr.rival td,.mi-pcard.rival{background:#f1e8f7}
  .mi-spark polyline{stroke:#111}.mi-spark-months{color:#555}
  a.mi-gbp{color:#111;border-bottom:0}
  .mi-orow .on,.mi-pcard .pn{color:#5a4413}
}

/* ── Website health / citations ─────────────────────────────────────────── */
.rep-flags{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 0}
.rep-flag{font:500 11px var(--mono);color:var(--bad);border:1px solid rgba(236,118,99,.4);padding:2px 10px}
.w-health-list{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
.w-health-item{display:flex;gap:11px;padding:8px 0;border-bottom:1px solid var(--line2);font-size:.82rem}
.w-health-ic{flex:0 0 16px;font:700 12px var(--mono);margin-top:1px}
.w-health-item[data-status="pass"] .w-health-ic{color:var(--mint)}
.w-health-item[data-status="warn"] .w-health-ic{color:var(--gold)}
.w-health-item[data-status="fail"] .w-health-ic{color:var(--bad)}
.w-health-item[data-status="unknown"] .w-health-ic{color:var(--ink3)}
.w-health-item strong{color:var(--ink)}
.w-health-item span:last-child{color:var(--ink2)}
/* (test round 1, batch 5) the site's other address: a finding beside the checks, marked as the free page marks it */
.w-health-unw{font:500 10.5px var(--mono);font-style:normal;color:var(--ink3);letter-spacing:.02em;margin-right:4px}
.w-health-twin{grid-column:1 / -1}
.w-health-note{margin:0 0 8px}   /* (release 31) the graded page and the wall, two notes, read as two */
.c-counts{font-size:.85rem;color:var(--ink2);margin:4px 0 0}
.rep-cit-table td.ok{color:var(--mint);font-weight:700}
.rep-cit-table td.bad{color:var(--bad);font-weight:700}
.rep-cit-table td.warn{color:var(--gold);font-weight:600}
.rep-cit-table td.na{color:#39413d}
.rep-table td.c-dir-name{color:var(--ink)}
.c-mm{margin-top:10px}
.c-mm-row{font-size:.82rem;color:var(--gold);padding:3px 0}
.rep-win{display:flex;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line2);font-size:.85rem;color:var(--ink)}
.rep-win:last-child{border-bottom:0}
.rep-win .imp{flex:0 0 auto;font:600 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid;border-radius:999px;padding:1px 9px}
.imp-high{color:var(--bad);border-color:rgba(236,118,99,.5)}
.imp-medium{color:var(--gold);border-color:var(--gold-line)}
.imp-low{color:var(--ink3);border-color:var(--line)}
.rep-win .eff{margin-left:auto;font:500 10.5px var(--mono);color:var(--ink3);white-space:nowrap}

/* ── The area map (pre-upgrade documents) ───────────────────────────────── */
.rep-map{display:block;width:100%;height:auto;max-height:430px;background:var(--surface);border:1px solid var(--line2)}
.rep-zpoly{stroke-width:1.3}
.rep-zpoly.in{fill:rgba(67,213,151,.2);stroke:rgba(67,213,151,.7)}
.rep-zpoly.out{fill:rgba(230,182,84,.09);stroke:rgba(230,182,84,.45)}
.rep-zpoly.home{stroke-width:2}
.rep-map-zip{font:500 10px var(--mono);fill:#8fa596;text-anchor:middle}
.rep-map-home{fill:var(--gold);stroke:#0b0e0d;stroke-width:1.5}
.rep-map-dot.in{fill:rgba(67,213,151,.75)}
.rep-map-dot.out{fill:rgba(230,182,84,.5)}
/* (release 33, AH-H1) a ZIP whose only top-three listing under the name we could not confirm: gray, neither in nor out */
.rep-zpoly.unconf{fill:rgba(163,172,166,.14);stroke:rgba(163,172,166,.6);stroke-dasharray:4 3}
.rep-map-dot.unconf{fill:rgba(163,172,166,.45);stroke:#a3aca6;stroke-dasharray:3 2}
.rep-map-ring{fill:none;stroke:var(--line);stroke-dasharray:3 4}
.rep-map-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px;font-size:12px;color:var(--ink3)}
.rep-map-legend .lg{display:inline-flex;align-items:center;gap:6px}
.rep-map-legend .sw{display:inline-block;width:12px;height:12px}
.rep-map-legend .sw.in{background:rgba(67,213,151,.5);border:1px solid var(--mint)}
.rep-map-legend .sw.out{background:rgba(230,182,84,.25);border:1px solid var(--gold)}
.rep-map-legend .sw.unconf{background:rgba(163,172,166,.2);border:1px dashed #a3aca6}

/* ── Raw / CTA / footer ─────────────────────────────────────────────────── */
.rep-raw-pre{font-family:var(--mono);font-size:.72rem;white-space:pre-wrap;word-break:break-word;color:var(--ink2)}
/* The raw dump folds closed (owner catch 2026-08-30: it made the technical view
   endless); same summary voice as the AI verbatim folds. */
.rep-raw-fold summary{cursor:pointer;font-size:.8rem;font-weight:600;color:var(--mint)}
.rep-raw-fold[open] summary{margin-bottom:8px}
/* r12-ads-limits (the owner, 2026-09-09): the three things a zero is a zero OF, named one by one rather than
   left in a clause at the end of a paragraph. Ordinary flow content, never a disclosure widget, because this
   report is printed and a reader on paper has nothing to click. */
.rp-qa{display:flex;flex-direction:column;gap:10px;padding:12px 13px 2px}
.rp-qa p{margin:0 0 10px;font:400 13px/1.6 var(--body);color:var(--ink2);max-width:74ch}
.rp-qa b{display:block;margin-bottom:3px;font:600 13px/1.5 var(--body);color:var(--ink)}
.rp-limits{list-style:none;margin:10px 0 12px;padding:0;display:flex;flex-direction:column;gap:8px}
.rp-limits li{margin:0;padding:9px 13px;background:var(--surface);border:1px solid var(--line2);border-radius:6px;font:400 13px/1.55 var(--body);color:var(--ink2);max-width:none}
.rp-limits li b{color:var(--gold);font-weight:600}
@media print{.rp-limits li{background:#fff;border-color:#999;color:#333}.rp-limits li b{color:#5a4413}}
/* r12-raw-fold (the owner, 2026-09-09): the note that says how much of the document is on screen, and the two
   ways to get all of it. The note comes first, because a bounded preview must never read as the whole thing. */
.rep-raw-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.rep-raw-note{flex:1 1 260px;margin:0;font:500 11.5px/1.5 var(--body);color:var(--ink3)}
.rep-raw-btns{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:520px){.rep-raw-tools{flex-direction:column;align-items:stretch}.rep-raw-btns .rp-btn{flex:1 1 auto}}
@media print{.rep-raw-tools{display:none !important}}
.rep-cta-card{margin-top:26px;border-top:1px solid var(--line2);text-align:center;padding-top:26px}
.rep-cta-card h2{text-align:center}
.rep-cta-card p{font-size:.95rem;margin-top:8px;color:var(--ink2)}
.rep-cta-card .btn{display:inline-block;margin-top:12px;font:600 .9rem var(--body);color:#3d2c05;
  background:var(--gold);border:0;padding:11px 22px;text-decoration:none}
.rep-cta-card .btn:hover{filter:brightness(1.07)}
.rep-powered{display:flex;align-items:center;justify-content:center;gap:8px;font:700 10px var(--disp);letter-spacing:.3em;color:var(--ink3);margin:22px 0 4px}
.powlogo{display:block;width:18px;height:18px;border-radius:4px;opacity:.8}
/* (2026-09-21) THE THREE RULES THAT USED TO LIVE HERE ARE GONE. They dressed the walkthrough as its own
   full-width section: a top rule and 26px of margin to separate it from the chapter above, its own
   prose size, and a gold inline link. D2 moved it into the closing card and left them behind, so the
   first of three columns sat exactly 26px lower than its neighbours, set its body copy one size
   smaller, and painted its call to action as a link among two buttons. The asymmetry the owner saw was
   this, not the markup. The column now takes .rep-next .nx like the other two. */

/* ── The clarity round (2026-08-27) + the legend round (2026-08-28) ─────── */
/* D1: the grid's own scan-toggle chips, at the masthead pill size, plus the
   GHOST keywords (dashed, faded — the searches this report's street-corner
   test did not run; a click explains subscriptions run more of them weekly)
   and the street-corner badge right-aligned to the lattice edge. */
.kwsel{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;padding:2px 0 8px;margin:0 0 6px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.kwsel-grid{margin:2px 0 12px;align-items:center}
.kwchip{flex:0 0 auto;font:600 .8rem/1 var(--body,inherit);font-family:inherit;color:var(--ink2);background:var(--surface2);border:1px solid var(--line);border-radius:999px;padding:9px 14px;cursor:pointer;white-space:nowrap}
.kwchip:hover{color:var(--ink);border-color:var(--ink3)}
.kwchip.on{color:var(--bg);background:var(--gold);border-color:var(--gold);font-weight:700}
.kwsel-grid .kwchip{font-size:.68rem;font-weight:600;padding:5px 11px;border-radius:999px}
.kwchip.ghost{color:var(--ink3);background:none;border:1px dashed var(--line);opacity:.62;cursor:pointer}
.kwchip.ghost:hover{opacity:.85;color:var(--ink2);border-color:var(--ink3)}
.kwsel-grid .ins-badge{margin-left:auto}
@media (max-width:900px){
  .kwsel-grid{flex-wrap:wrap;overflow:visible}
  .kwsel-grid .ins-badge{margin-left:0}
}

/* D2: the area-wide column is a different instrument — seam it off the zip block. */
/* (round 2's pre-flight C, F6: the seam is a 1px divider, not a 2px rule down the left, which read as a stripe) */
.rep-matrix th.mx-rank,.rep-matrix td.mx-rank{border-left:1px dashed var(--line);background:rgba(230,182,84,.05)}
.rep-matrix th.mx-rank small{display:block;font-weight:500;color:var(--ink3);text-transform:none;letter-spacing:0;margin-top:2px}
.mx-rank-link{color:var(--gold);font-weight:700;text-decoration:none}
.mx-rank-link:hover{text-decoration:underline}
.mx-ahead{display:block;font-size:.68rem;color:var(--ink3);font-weight:500;margin-top:1px}
.rep-lens{scroll-margin-top:18px}

/* D4: the volume scope chip — a national number and a near-you number are
   different facts. */
.vol-scope{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);border:1px solid var(--line);border-radius:5px;padding:1px 6px;margin-left:8px;vertical-align:1px}
.vol-scope-geo{color:var(--gold);border-color:rgba(230,182,84,.5)}
/* Identity round W4/Q6: the REAL measured local number under the national band. */
.vol-local{display:block;font:500 10.5px var(--mono);color:var(--mint);margin-top:3px}

/* D5: the score's factor bars. Identity round W4/Q7: every row opens its own
   how-it-is-scored overlay on click. */
.w-break{margin:6px 0 14px}
.wb-row{display:grid;grid-template-columns:20px minmax(110px,210px) 1fr 38px;gap:10px;align-items:center;padding:5px 0}
/* the factor's own icon (the owner's asks of 3 Oct): one line weight, the page's ink, gold on hover */
.wb-ic{display:inline-flex;align-items:center;justify-content:center;color:var(--ink3)}
.wb-ic svg{display:block}
.wb-row.wb-click:hover .wb-ic,.wb-row.wb-click:focus-visible .wb-ic{color:var(--gold)}
/* the factor popup's header (the owner's ask of 3 Oct): [kicker over icon + title] left, the score's ring right, the close
   button in the corner above it; the paragraphs run full width below. The ring is transparent: a muted track, the band's arc,
   the number in the page's ink */
#rep-overlay .rov-panel.rov-has-head{padding:22px}
#rep-overlay .rov-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;margin:0 0 14px;padding-right:30px}
#rep-overlay .rov-lead{min-width:0}
#rep-overlay .rov-trow{display:flex;align-items:center;gap:10px;min-width:0}
#rep-overlay .rov-trow .rov-h{margin:0;line-height:1.3;overflow-wrap:anywhere}
#rep-overlay .rov-trow .wb-ic{color:var(--gold);flex:none}
#rep-overlay .rov-aside{display:flex;align-items:center;justify-content:center}
#rep-overlay .rov-has-head .rov-body p{margin:0 0 12px}
#rep-overlay .rov-has-head .rov-body p:last-child{margin-bottom:0}
.wb-ring{flex:none;display:block;background:none;overflow:visible}
.wb-ring-track{fill:none;stroke:var(--line);stroke-width:5}
.wb-ring-arc{fill:none;stroke-width:5;stroke-linecap:round;animation:wbRing .9s cubic-bezier(.2,.7,.2,1) both}
.wb-ring-good .wb-ring-arc{stroke:var(--mint)}
.wb-ring-mid .wb-ring-arc{stroke:var(--gold)}
.wb-ring-low .wb-ring-arc{stroke:var(--bad)}
.wb-ring-n{fill:var(--ink);font:700 18px var(--disp)}
@media (max-width:430px){.wb-ring{width:52px;height:52px}#rep-overlay .rov-head{gap:12px}}
@keyframes wbRing{from{stroke-dashoffset:var(--wb-c,163.36)}}
@media (prefers-reduced-motion:reduce){.wb-ring-arc{animation:none}}
.wb-fine{font-size:.74rem !important;line-height:1.45;color:var(--ink3) !important;margin-top:10px}
/* Technical opens the raw data with a soft glow, once (the owner's asks of 3 Oct); none under reduced motion */
.rep-raw-fold.rep-flash{animation:repFlash 1.1s ease-in-out 2;border-radius:8px}
@keyframes repFlash{0%,100%{box-shadow:0 0 0 0 rgba(230,182,84,0);background-color:transparent}50%{box-shadow:0 0 0 3px rgba(230,182,84,.28);background-color:rgba(230,182,84,.06)}}
@media (prefers-reduced-motion:reduce){.rep-raw-fold.rep-flash{animation:none}}
@media print{.wb-ic{color:#555 !important}.wb-ring-arc{animation:none}.wb-ring-track{stroke:#ccc}.wb-ring-n{fill:#111}}
.wb-row.wb-click{cursor:pointer;border-radius:6px}
.wb-row.wb-click:hover{background:rgba(255,255,255,.025)}
.wb-row.wb-click:hover .wb-label{color:var(--ink)}
/* The graded site's URL is a real link wearing the identical type treatment. */
.rep-stat-url a{color:inherit;text-decoration:none}
.rep-stat-url a:hover{text-decoration:underline}
.wb-label{font-size:.82rem;color:var(--ink2)}
.wb-bar{height:8px;border-radius:5px;background:var(--deep,rgba(255,255,255,.04));border:1px solid var(--line2);overflow:hidden}
.wb-fill{height:100%;border-radius:5px}
.wb-good{background:var(--mint)}
.wb-mid{background:var(--gold)}
.wb-low{background:var(--bad)}
.wb-num{font-size:.8rem;font-weight:700;color:var(--ink);text-align:right}
.wb-group{font-size:.78rem;color:var(--ink3);margin:12px 0 2px;font-weight:600}
.wb-unscored{font-size:.78rem;color:var(--ink3);margin:12px 0 0}

/* D6: the corner drill, the free report's way (the team's test of 29 Sep). Opening a point lights its star and its square
   together (.staropen, .cellopen: the /p/ page's marks); on a desktop the panel is a window with no backdrop, so the circled
   star stays in view, parked beside what was clicked and dragged by its bar (report-view.js ensurePinDrill); on a phone it
   stays the bottom sheet over its backdrop. */
.sdot.has-drill,.cell.has-drill{cursor:pointer}
.cell.has-drill:hover{outline:1px solid var(--gold)}
.sdot.has-drill:focus-visible,.cell.has-drill:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.sdot.staropen{transform:scale(1.24);border-radius:50%;box-shadow:0 0 0 3px rgba(230,182,84,.95),0 0 12px rgba(230,182,84,.55)}
.lattice .cell.cellopen,.lattice .cell.cellopen:hover{outline:3px solid rgba(230,182,84,.9);outline-offset:-3px}
/* no box of its own on a desktop: the page under the panel stays live, and the panel sits in page coordinates */
#pin-drill{position:absolute;top:0;left:0;width:0;height:0;z-index:80}
#pin-drill .pd-back{display:none}
#pin-drill .pd-panel{position:absolute;left:0;top:0;width:min(420px,calc(100vw - 24px));max-height:84vh;display:flex;flex-direction:column;background-color:#101413;border:1px solid var(--line);border-top:2px solid var(--gold);border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.6);overflow:hidden}
#pin-drill.dragging .pd-panel{opacity:.94}
#pin-drill .pd-bar{position:relative;flex:0 0 auto;padding:12px 48px 10px 18px;background:linear-gradient(180deg,rgba(230,182,84,.14),rgba(230,182,84,.04));border-bottom:1px solid var(--line);cursor:grab;touch-action:none;user-select:none}
#pin-drill.dragging .pd-bar{cursor:grabbing}
#pin-drill .pd-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 18px 18px}
.pd-kick{font-size:.66rem;font-weight:700;letter-spacing:.16em;color:var(--ink3);text-transform:uppercase;margin:0 0 4px}
.pd-h{font-size:1.05rem;color:var(--ink);margin:0}
.pd-x{position:absolute;top:8px;right:8px;font-size:1.3rem;line-height:1;color:var(--ink3);background:none;border:0;cursor:pointer;padding:6px}
.pd-x:hover{color:var(--ink)}
.pd-intro{font-size:.86rem;color:var(--ink2);margin:0 0 12px}
.pd-note{font-size:.8rem;color:var(--ink2);margin:-4px 0 12px}
.pd-sec{font-size:.66rem;font-weight:700;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase;margin:14px 0 4px}
.pd-row{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid var(--line2);font-size:.85rem}
.pd-row:last-child{border-bottom:0}
.pd-l{color:var(--ink3);flex:0 0 auto}
.pd-v{color:var(--ink);font-weight:600;text-align:right}
.pd-you .pd-v{color:var(--gold)}
.pd-row.pd-setaside{opacity:.55}
@media (max-width:760px){
  /* the phone's sheet: over the whole screen with its backdrop, pinned to the bottom whatever a desktop's drag left */
  #pin-drill{position:fixed;inset:0;width:auto;height:auto}
  #pin-drill .pd-back{display:block;position:absolute;inset:0;background:rgba(4,6,5,.72)}
  #pin-drill .pd-panel{left:0 !important;right:0;top:auto !important;bottom:0;width:100%;max-height:78vh;border-radius:16px 16px 0 0;border-left:0;border-right:0;border-bottom:0;box-shadow:none}
  #pin-drill .pd-bar{cursor:default;touch-action:auto}
  #pin-drill .pd-body{padding-bottom:max(20px,env(safe-area-inset-bottom))}
}

/* E2: the ad's body copy under its headline. */
.ad-copy{display:block;font-size:.74rem;color:var(--ink3);margin-top:2px;max-width:34em}

/* ── The legend round (2026-08-28, owner-approved mockup C) ─────────────── */
/* Card header rows: the h2 and its instrument cluster share one flex line. */
.rep-headrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.rep-headrow > h2{margin:0 !important;flex:1 1 260px;min-width:0}
.rep-headrow .rep-hsp{flex:1 1 auto}
.rep-cluster{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-left:auto}

/* The instrument badges: icon-only, click-only, pointer cursor. */
.ins-ic{display:inline-flex;align-items:center;justify-content:center;flex:none}
.ins-badge{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;background:rgba(255,255,255,.025);border:1px solid var(--line2);border-radius:999px;padding:4px 7px;font-family:inherit}
.ins-badge:hover{border-color:var(--ink3)}

/* The icon-only info control (crafted glyph, no text, never cursor:help). */
.rep-infobtn{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;padding:0;color:var(--ink3);background:rgba(255,255,255,.02);border:1px solid var(--line2);border-radius:50%;cursor:pointer}
.rep-infobtn:hover{color:var(--gold);border-color:rgba(230,182,84,.5)}
.rep-infobtn svg{display:block}

/* The instrument card popover (opens on CLICK only). */
.ins-card{position:fixed;z-index:110;width:344px;max-width:calc(100vw - 16px);background:#101413;border:1px solid var(--line);border-radius:12px;padding:13px 15px;box-shadow:0 16px 44px rgba(0,0,0,.55)}
.ins-card .ih{display:flex;gap:9px;align-items:center;margin-bottom:3px}
.ins-card .ih b{font-size:.92rem;color:var(--ink)}
.ins-card .ifills{font-size:.74rem;color:var(--ink3);margin:0 0 9px 31px}
.ins-card .irow{display:grid;grid-template-columns:78px 1fr;gap:8px;padding:6px 0;border-top:1px solid var(--line2);font-size:.78rem}
.ins-card .irow .ik{font-size:.62rem;font-weight:700;letter-spacing:.12em;color:var(--ink3);text-transform:uppercase;padding-top:2px}
.ins-card .irow .iv{color:var(--ink2)}
.ins-card .irow .iv small{display:block;color:var(--ink3);font-size:.7rem;margin-top:1px}
.ins-card .icost{display:inline-block;font-size:.68rem;font-weight:700;border-radius:6px;padding:3px 9px;margin-top:9px}
.ins-card .icost.tmint{color:var(--mint);background:rgba(67,213,151,.1);border:1px solid rgba(67,213,151,.35)}
.ins-card .icost.tblue{color:#7fb4e8;background:rgba(127,180,232,.1);border:1px solid rgba(127,180,232,.35)}
.ins-card .icost.tgold{color:var(--gold);background:rgba(230,182,84,.12);border:1px solid rgba(230,182,84,.4)}
.ins-card .iex{display:block;margin-top:10px;font-size:.76rem;font-weight:600;color:var(--gold);cursor:pointer;background:none;border:0;padding:0;font-family:inherit}
.ins-card .iex:hover{text-decoration:underline}
.ins-card .ighost{font-size:.8rem;color:var(--ink2);line-height:1.55}

/* The masthead line under the verdict. */
.mast-what{font-size:.74rem;color:var(--ink3);margin-top:10px}
.mast-what button{font-family:inherit;font-size:.74rem;color:var(--gold);background:none;border:0;cursor:pointer;padding:0;font-weight:600}
.mast-what button:hover{text-decoration:underline}

/* The shared overlay (instruments / examples / area-detail / anatomy). */
#rep-overlay{position:fixed;inset:0;z-index:2147483500}   /* step 8 (2026-09-14): above every full-screen box (z 2147482000), below the drawer */
#rep-overlay .rov-back{position:absolute;inset:0;background:rgba(4,6,5,.76)}
#rep-overlay .rov-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(700px,94vw);max-height:88vh;overflow-y:auto;background:#101413;border:1px solid var(--line);border-radius:14px;padding:20px 22px;scrollbar-width:thin}
#rep-overlay .rov-kick{font-size:.62rem;font-weight:700;letter-spacing:.16em;color:var(--ink3);text-transform:uppercase;margin:0 0 4px}
#rep-overlay .rov-h{font-size:1.05rem;color:var(--ink);margin:0 34px 10px 0}
#rep-overlay .rov-x{position:absolute;top:10px;right:12px;font-size:1.3rem;line-height:1;color:var(--ink3);background:none;border:0;cursor:pointer;padding:6px}
#rep-overlay .rov-x:hover{color:var(--ink)}
#rep-overlay .rov-body{font-size:.86rem;line-height:1.6;color:var(--ink2)}
#rep-overlay .rov-body p{margin:0 0 12px}
@media (max-width:760px){#rep-overlay .rov-panel{left:0;right:0;top:auto;bottom:0;transform:none;width:100%;max-height:84vh;border-radius:16px 16px 0 0;border-left:0;border-right:0;border-bottom:0}}

/* ═══ The Google-page example SCREENSHOTS (data-driven replicas) ══════════
   Framed as a WINDOWS Chrome window: tab strip with minimize/maximize/close,
   a URL bar row, and a page scrollbar — never the macOS traffic lights. */
.shot{border:1px solid #3a423f;border-radius:10px;overflow:hidden;margin:10px 0 4px;box-shadow:0 10px 34px rgba(0,0,0,.45)}
.shot .wtabs{display:flex;align-items:flex-end;background:#dee1e6;padding:6px 0 0 8px;font-family:"Segoe UI",Roboto,Arial,sans-serif}
.shot .wtab{display:flex;align-items:center;gap:7px;background:#fff;border-radius:8px 8px 0 0;padding:6px 14px 6px 10px;font-size:.68rem;color:#3c4043;max-width:240px;min-width:0}
.shot .wtab .wfav{font-weight:700;font-size:.7rem;flex:none}
.shot .wtab .wfav .g{color:#4285f4}
.shot .wtab .wtitle{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shot .wctl{margin-left:auto;display:flex;align-self:stretch;align-items:center}
.shot .wctl span{display:inline-flex;align-items:center;justify-content:center;width:34px;height:100%;padding:8px 0;color:#5f6368;font-size:.72rem;font-family:"Segoe UI Symbol","Segoe UI",sans-serif}
.shot .wctl .wx{font-size:.78rem}
.shot .wbar{display:flex;align-items:center;gap:10px;background:#fff;padding:6px 12px;border-bottom:1px solid #dadce0}
.shot .wbar .wnav{display:flex;gap:12px;color:#5f6368}
.shot .wbar .wurl{flex:1;display:flex;align-items:center;gap:7px;background:#f1f3f4;border-radius:999px;padding:5px 13px;font-family:Roboto,Arial,sans-serif;font-size:.68rem;color:#202124;white-space:nowrap;overflow:hidden}
.shot .wbar .wurl .wsec{color:#5f6368;flex:none;display:inline-flex}
.shot .wbar .wstar{color:#5f6368;flex:none;display:inline-flex}
.gpage{position:relative;background:#fff;color:#202124;font-family:Arial,Roboto,"Segoe UI",sans-serif;padding:0 14px 14px 0;font-size:14px;line-height:1.45}
/* The Windows page scrollbar (SERP pages only; the Maps app has none). */
.gpage:not(.gnoscroll)::after{content:"";position:absolute;top:0;right:0;bottom:0;width:13px;background:linear-gradient(#c1c1c1,#c1c1c1) no-repeat 2.5px 22px/8px 96px,#f1f3f4;border-left:1px solid #e8eaed}
.gpage.gnoscroll{padding-right:0}
.gpage *{font-family:inherit;box-sizing:border-box}
/* The results-page header: logo left, search pill, avatar right. */
.ghead{display:flex;align-items:center;gap:16px;padding:14px 20px 0}
.glogo{font-size:23px;font-weight:500;letter-spacing:-1.5px;line-height:1;flex:none}
.glogo .b{color:#4285f4}.glogo .r{color:#ea4335}.glogo .y{color:#fbbc05}.glogo .g{color:#34a853}
.gsearch{display:flex;align-items:center;gap:10px;border:1px solid #dfe1e5;border-radius:999px;padding:9px 16px;flex:1;max-width:440px;box-shadow:0 1px 6px rgba(32,33,36,.12)}
.gsearch .q{flex:1;color:#202124;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsearch svg{flex:none}
.gava{width:30px;height:30px;border-radius:50%;background:#7b1fa2;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:500;flex:none}
.gtabs{display:flex;gap:22px;margin:12px 0 0;border-bottom:1px solid #ebebeb;font-size:12.5px;color:#5f6368;padding:0 20px}
.gtabs span{padding:0 2px 9px}
.gtabs .on{color:#1a73e8;border-bottom:3px solid #1a73e8;font-weight:500}
.gbodycol{padding:0 20px;max-width:600px}
.gsection{margin-top:15px}
.gsponsored{font-size:13px;font-weight:700;color:#202124;margin-bottom:6px}
.gad .gad-top{display:flex;align-items:center;gap:9px}
.gad .fav{width:26px;height:26px;border-radius:50%;background:#e8f0fe;color:#1a73e8;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:none;border:1px solid #e8eaed}
.gad .gad-site{font-size:14px;color:#202124}
.gad .gad-title{color:#1a0dab;font-size:19px;margin:5px 0 2px;font-weight:400;line-height:1.3}
.gad .gad-desc{color:#4d5156;font-size:14px;max-width:52em}
/* Places (map pack). */
.gplaces-h{font-size:20px;color:#202124;margin:2px 0 8px}
.gchips{display:flex;gap:8px;margin-bottom:10px}
.gchip{font-size:13px;color:#3c4043;border:1px solid #dadce0;border-radius:999px;padding:5px 13px}
.gchip svg{vertical-align:-2px;margin-left:4px}
.gmapstrip{position:relative;height:96px;border-radius:8px 8px 0 0;overflow:hidden;background:#f0ede4}
.gmapstrip .rd{position:absolute;background:#fff;box-shadow:0 0 0 1.5px #e2ded2}
.gmapstrip .rd.hw{background:#fde293;box-shadow:0 0 0 1.5px #f8d575}
.gmapstrip .rd.h{left:0;right:0;height:6px}
.gmapstrip .rd.v{top:0;bottom:0;width:6px}
.gmapstrip .park{position:absolute;background:#c9e7b7;border-radius:6px}
.gmapstrip .gpin{position:absolute}
.gpack{border:1px solid #dadce0;border-radius:8px;overflow:hidden}
.gbiz{display:flex;align-items:flex-start;gap:12px;padding:11px 14px;border-top:1px solid #ebebeb}
.gbiz .gb-l{flex:1;min-width:0}
.gbiz .gb-name{font-size:16px;color:#202124;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gbiz .gb-line{font-size:13px;color:#70757a;margin-top:2px}
.gbiz .gb-line .stars{color:#fbbc04;letter-spacing:-1px;font-size:12.5px}
.gbiz .gb-acts{display:flex;gap:16px;flex:none;padding-top:4px}
.gbiz .gb-act{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:#1a73e8}
.gbiz .gb-act .cir{width:36px;height:36px;border-radius:50%;border:1px solid #dadce0;display:flex;align-items:center;justify-content:center}
.gbiz .gb-photo{width:60px;height:60px;border-radius:8px;background:linear-gradient(135deg,#cfd8dc,#eceff1);flex:none;display:flex;align-items:center;justify-content:center}
.gmore{display:flex;justify-content:center;padding:10px 14px;border-top:1px solid #ebebeb}
.gmore span{font-size:13.5px;color:#1a73e8;border:1px solid #dadce0;border-radius:999px;padding:7px 60px;white-space:nowrap}
/* Organic results. */
.gorg{margin-top:17px}
.gorg .go-top{display:flex;align-items:center;gap:9px}
.gorg .fav{width:26px;height:26px;border-radius:50%;background:#f1f3f4;color:#5f6368;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:none;border:1px solid #e8eaed}
.gorg .go-site{font-size:14px;color:#202124}
.gorg .go-url{font-size:12px;color:#4d5156}
.gorg .go-title{color:#1a0dab;font-size:19px;margin:5px 0 2px;font-weight:400;line-height:1.3}
/* Google Maps replica. */
.gmaps{display:grid;grid-template-columns:280px 1fr;min-height:280px;background:#fff;font-family:Roboto,Arial,sans-serif}
.gmaps .gm-list{border-right:1px solid #ebebeb;background:#fff}
.gmaps .gm-search{display:flex;align-items:center;gap:9px;padding:10px 12px;border-bottom:1px solid #ebebeb}
.gmaps .gm-search .pill{flex:1;display:flex;align-items:center;gap:8px;border:0;border-radius:8px;padding:8px 13px;font-size:13.5px;color:#202124;background:#fff;box-shadow:0 1px 4px rgba(32,33,36,.25)}
.gmaps .gm-chips{display:flex;gap:7px;padding:9px 12px;border-bottom:1px solid #ebebeb}
.gmaps .gm-chips .gchip{font-size:12px;padding:4px 11px}
.gmaps .gm-res{font-size:12px;color:#70757a;padding:8px 12px 2px}
.gmaps .gm-item{display:flex;gap:10px;padding:10px 12px;border-bottom:1px solid #f1f1f1}
.gmaps .gm-il{flex:1;min-width:0}
.gmaps .gm-name{font-size:14.5px;color:#202124;font-weight:500}
.gmaps .gm-meta{font-size:12px;color:#70757a;margin-top:1px}
.gmaps .gm-meta .stars{color:#fbbc04;letter-spacing:-1px}
.gmaps .gm-sub{font-size:12px;color:#70757a}
.gmaps .gm-photo{width:54px;height:54px;border-radius:8px;background:linear-gradient(135deg,#cfd8dc,#eceff1);flex:none}
.gmaps .gm-canvas{position:relative;background:#f0ede4;overflow:hidden}
.gmaps .rd{position:absolute;background:#fff;box-shadow:0 0 0 1.5px #e2ded2}
.gmaps .rd.hw{background:#fde293;box-shadow:0 0 0 1.5px #f8d575}
.gmaps .rd.h{left:0;right:0;height:7px}
.gmaps .rd.v{top:0;bottom:0;width:7px}
.gmaps .park{position:absolute;background:#c9e7b7;border-radius:10px}
.gmaps .water{position:absolute;background:#a6d5f5;border-radius:12px}
.gmaps .gpin{position:absolute}
.gmaps.gm-stack{grid-template-columns:1fr}
/* (the owner, 2026-09-22) the example pictures, made recognisable at a glance */
.gm-bg{position:absolute;inset:0;width:100%;height:100%;display:block}
/* the blue you-are-here dot: its size and place are set through element.style (the CSP blocks style attributes) */
.gm-you{position:absolute;box-sizing:border-box;border-radius:50%;background:#4285f4;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.35);z-index:2}
.gmaps .gm-search .pill{gap:10px;border-radius:24px;padding:9px 14px;box-shadow:0 2px 6px rgba(60,64,67,.28),0 1px 2px rgba(60,64,67,.18)}
.gmaps .gm-search .gm-q{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gmaps .gm-search svg{flex:none}
.gbiz .gb-sub{margin-top:1px}
.gphoto{box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
@media (max-width:640px){.gmaps{grid-template-columns:1fr}.gmaps .gm-canvas{min-height:130px}}
/* Our annotations (gold, in our voice, ON the screenshot). */
.stars{color:#fbbc04}
.anno{position:absolute;border:2px solid #e6b654;border-radius:9px;box-shadow:0 0 0 3px rgba(230,182,84,.22);pointer-events:none}
.anno-tag{position:absolute;background:#e6b654;color:#0b0e0d;font-family:"Inter","Segoe UI",sans-serif;font-size:.62rem;font-weight:800;letter-spacing:.05em;border-radius:5px;padding:2px 8px;pointer-events:none;white-space:nowrap;z-index:3}
.shot-cap{font-size:.76rem;color:var(--ink3);margin-top:10px}
.shot-cap b{color:var(--ink2)}

/* The area-detail diagram + the line-anatomy rows. */
.rov-fig{margin:6px 0 2px}
.rov-fig svg{width:100%;height:auto;display:block}
.rov-figcap{font-size:.7rem;color:var(--ink3);margin-top:6px}
.an-line{font-family:var(--mono,monospace);font-size:1.35rem;color:var(--ink);margin:6px 0 14px;letter-spacing:.02em}
.an-line .a1{color:var(--mint)} .an-line .a2{color:#7fb4e8} .an-line .a3{color:var(--gold)} .an-line .a4{color:var(--ink2)}
.an-row{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:7px 0;border-top:1px solid var(--line2);font-size:.82rem}
.an-row .an-k{font-family:var(--mono,monospace);font-weight:700;text-align:right}
.an-row .an-v{color:var(--ink2)}

/* Mode gating. */
[hidden]{display:none !important}
body.rep-friendly .rep-tech-only{display:none}
body:not(.rep-friendly) .rep-friendly-only{display:none}

@media (max-width:900px){.heromaps{grid-template-columns:1fr}.w-health-list{grid-template-columns:1fr}.tdown{grid-template-columns:1fr}}
@media (max-width:760px){
  .shell{grid-template-columns:1fr}
  .rail{border-right:0;border-bottom:1px solid var(--line2);padding:20px 18px}
  .railin{position:static}
  .railnav{display:none}
  .rep-main{padding:24px 18px 80px}
  .rep-sub{font-size:27px}
  .rep-verdict{font-size:22px}
  .rep-stat b{font-size:32px}
  /* Phones scroll the PAGE, not boxes inside it: the nested vertical caps go,
     tables flow at full length in the document itself. */
  /* 2026-09-18: the two hand-made windows retired into .rep-window, which keeps its height on phones too;
     the reader scrolls the window the way they scroll everything else, and the count line says what is inside */
  /* Wide tables pan sideways under a PINNED first column, so the reader always
     knows which row they are on; tighter cell metrics buy real estate. The
     wrap goes flush (no side padding) so nothing peeks past the pinned column. */
  .rep-table-wrap{padding:4px 0}
  /* The polish pass (2026-09-18, the QA ledger's L-12): a wide table (the roll's fourteen columns, the keyword
     matrix's eleven) pans sideways under its pinned first column, and a fade at the right edge says there is
     more to the right. The fade is drawn by the wrap's own background: two gradients scroll with the content
     and cover two that stay at the edges, so the edge fades only while there is content beyond it. */
  .rep-table-wrap,.rp-tblwrap,.mi-zipscroll{
    background:
      linear-gradient(90deg,var(--surface) 30%,rgba(16,21,19,0)) 0 0 / 40px 100% no-repeat local,
      linear-gradient(90deg,rgba(16,21,19,0),var(--surface) 70%) 100% 0 / 40px 100% no-repeat local,
      linear-gradient(90deg,rgba(0,0,0,.45),rgba(0,0,0,0)) 0 0 / 16px 100% no-repeat scroll,
      linear-gradient(90deg,rgba(0,0,0,0),rgba(0,0,0,.45)) 100% 0 / 16px 100% no-repeat scroll,
      var(--surface)}
  .rep-table th,.rep-table td{padding:6px 7px;font-size:.78rem}
  .rep-table th:first-child,.rep-table td:first-child{position:sticky;left:0;background:var(--surface);z-index:1}
  .rep-matrix td:first-child,.rep-matrix th:first-child{max-width:34vw;overflow-wrap:break-word}
}

/* ── The report tour (2026-08-31): a slim pill riding the masthead's legend row
   (never its own row — the page must not grow), with the site's gold shimmer on
   the un-clicked state as the attention affordance. Screen-only chrome. ── */
.mast-what{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
/* Owner spec 2026-08-31: a pill on the FAR RIGHT of the legend row, the report's
   green for its text. */
/* Scoped under .mast-what: the row's own `.mast-what button` link-style rule
   (0-1-1) would otherwise strip the pill (border:0, padding:0, gold text). */
.mast-what .rep-tourbtn{margin-left:auto;padding:4px 13px;border-radius:999px;border:1px solid var(--line);
  background:transparent;color:var(--mint);font:600 .74rem var(--body);cursor:pointer;
  transition:background .15s ease}
.mast-what .rep-tourbtn:hover{background:var(--mint-soft);text-decoration:none}
/* Un-clicked: a solid GOLD border with a rotating WHITE glint sweeping it — the
   button reads as shiny (the site's lighthouse-beam idiom, replicated locally
   because this stylesheet is deliberately self-contained). */
@property --rep-shimmer-angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes repShimmerRotate { to { --rep-shimmer-angle: 360deg; } }
.mast-what .rep-tourbtn.unseen{border:1.5px solid transparent;
  background-image:
    linear-gradient(var(--bg, #0b0e0d), var(--bg, #0b0e0d)),
    conic-gradient(from var(--rep-shimmer-angle),
      var(--gold) 0deg, var(--gold) 78deg,
      #ffffff 100deg, #ffffff 112deg,
      var(--gold) 134deg, var(--gold) 360deg);
  background-origin:border-box;background-clip:padding-box,border-box;
  box-shadow:0 0 12px rgba(230,182,84,.22);
  animation:repShimmerRotate 3.6s linear infinite}
@media (prefers-reduced-motion: reduce){ .rep-tourbtn.unseen{animation:none} }

/* The tour popovers wear the document's own obsidian (portal popover theme,
   adjusted to this sheet's tokens) — never driver.js's white defaults. Every
   selector is prefixed with body.rep-doc: the vendor sheet lazy-injects AFTER
   this one, so plain equal-specificity rules would lose the cascade to it. */
body.rep-doc .driver-popover{background:#101413;color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.55)}
body.rep-doc .driver-popover *{font-family:var(--body)}
body.rep-doc .driver-popover-title{font:650 15px var(--disp);color:var(--ink)}
body.rep-doc .driver-popover-description{color:var(--ink2);font-size:13px;line-height:1.55}
body.rep-doc .driver-popover-progress-text{color:var(--ink3);font-size:12px}
body.rep-doc .driver-popover-close-btn{color:var(--ink3)}
body.rep-doc .driver-popover-close-btn:hover,body.rep-doc .driver-popover-close-btn:focus{color:var(--ink)}
body.rep-doc .driver-popover-navigation-btns button{background:#141917;color:var(--gold);border:1px solid var(--line);border-radius:8px;text-shadow:none}
body.rep-doc .driver-popover-navigation-btns button:hover{background:#1b201d}
body.rep-doc .driver-popover-arrow-side-left.driver-popover-arrow{border-left-color:#101413}
body.rep-doc .driver-popover-arrow-side-right.driver-popover-arrow{border-right-color:#101413}
body.rep-doc .driver-popover-arrow-side-top.driver-popover-arrow{border-top-color:#101413}
body.rep-doc .driver-popover-arrow-side-bottom.driver-popover-arrow{border-bottom-color:#101413}
/* on a phone the tip is the screen's width less a margin, so it is short enough to sit under its part (report-tour.js phoneAnchor) */
@media (max-width:760px){body.rep-doc .driver-popover{max-width:calc(100vw - 24px)}}

/* ── Print: the instrument on paper — the rail becomes the cover, the sheet
   flips light, long bands flow with row-level protection, the verbatim
   answers open (beforeprint sets the attribute; these rules do the rest),
   and the map prints as quiet grayscale streets under the colored stars. ── */
/* THE PRIVATE LINK NEVER PRINTS (the owner, 29 Sep 2026: "Implement that fix"). A browser prints its own header and footer
   in the sheet's top and bottom margins: the title and the date above, the page's address and its number below. A report's
   address is its private link (?t=, and the standing page's ?m=), so a PDF a customer saved carried the key to their report
   at the foot of every sheet. The sheet has no top or bottom margin now, and a browser draws no header or footer where there
   is no room for one (Chrome and Edge, headless print with the header and footer asked for: none). The 13 mm those margins
   held is the printed body's padding instead, and box-decoration-break clones it onto every page's slice of the body, so
   every sheet keeps 13 mm above and below. The sides keep their margin, which no header or footer uses: Chrome shrinks a
   page whose content is wider than the paper to fit (the $99's roll table is, by about 7%), and it measures that against
   the margins, so side padding would have printed the $99 unshrunk and three pages longer. In print .shell drops the
   screen's 100vh floor, which the taller sheet would have turned into a blank second page under a short document. The
   address bar keeps its link, so refresh and sharing work as before (tests/unit/print-private-link.test.js). */
@page{size:letter;margin:0 13mm}
@media print{
  body.rep-doc{background:#fff;color:#14201c;background-image:none;padding:13mm 0;-webkit-box-decoration-break:clone;box-decoration-break:clone}
  /* PAPER'S OWN INKS (round 2, B4). The report's text tokens are a dark page's (--ink near-white, --ink2 and --ink3 light
     greys), and every line that read them without a print rule of its own printed faded or white: a plan's reading lines,
     a chapter's bold lead, the map key's counts, and some 60 lines more across the four sample pages (a print-medium
     audit of 29 Sep). On paper the three text inks are ink, and the accents take the toner shades this sheet already
     prints its own accents in (mint #1c5f28, gold, red #8a2f1c; blue and purple likewise), so a chip's, a badge's and a
     link's words read at 4.5 to 1 or better on white, and the bars drawn in them print a shade deeper. */
  :root{--ink:#111;--ink2:#333;--ink3:#555;--mint:#1c5f28;--gold:#8a6414;--bad:#8a2f1c;--blue:#1f5f99;--purp:#7a3ea3}
  .shell{display:block;max-width:100%;min-height:0}
  .rail,.rep-sample-ribbon,.skip-link,#card-raw,.rep-tech-only,.rep-cta-card,.rep-tourbtn{display:none !important}
  .rep-main{padding:0}
  .print-cover{display:block;border-bottom:2px solid #14201c;margin-bottom:7mm;padding-bottom:4mm}
  .print-cover .pc-brand{display:flex;align-items:center;gap:8px;font:700 13px var(--disp);letter-spacing:.16em;color:#14201c;margin-bottom:3mm}
  .print-cover .pc-logo{display:block;width:28px;height:28px;border-radius:6px}
  .print-cover .pc-k{font:500 10px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:#5a4413}
  .print-cover h1{font:700 24pt var(--disp);color:#14201c;letter-spacing:0;text-transform:none;margin:2mm 0 1mm}
  .print-cover .pc-sub{color:#333;font-size:11pt}
  .print-cover .pc-verdict{font:700 14pt var(--disp);color:#111;margin-top:3mm}
  .rep-hero{border-color:#ccc}
  .rep-hero h1{color:#5a4413}
  /* THE TITLE PRINTS ONCE (round 2, B6). The cover above (report.html .print-cover) carries the kind, the name, the place
     and day, and the verdict, filled from the same words as the masthead (report-view.js), and the masthead said all four
     again right under it. On paper the masthead keeps only its figures (the hero tiles) and its line under them. */
  #rep-title,#rep-sub,#rep-meta,#rep-verdict{display:none !important}
  /* ...and a masthead left with nothing to print (the $99 and the plans carry no hero tiles) takes its rule with it,
     rather than drawing an empty line under the cover's own. */
  .rep-hero:not(:has(> .rep-herogrid:not([hidden]), > .rep-wow:not([hidden]))){display:none !important}
  .rep-sub,.rep-verdict,.rep-card h2,.rep-card h3,.rep-act,b,strong{color:#111}
  .rep-verdict b{color:#111}
  .rep-act{border-color:#ccc}
  .rep-act::before,.plan-phase h3,.pin-intel-grade,.rep-lens-h,.rd-review-source{color:#5a4413}
  .rep-meta,.rep-wow,.mapcap,.mi-source,.rep-actline,.railnote{color:#555}
  .rep-kw span{color:#333;border-color:#aaa}
  .rep-stat b{color:#111 !important}
  .rep-stat small{color:#555}
  /* the hero band's miniature grid and the ladder keep their colours on paper; the words beside them go ink */
  .hg-cell{border:1px solid #999;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .hg-cell.x,.hg-cell.f{background:#fff;color:#777}
  .hg-kick,.hg-key,.rep-ladder-kick,.rep-ladder-sub,.rep-ladder .rung .v{color:#333}
  .rep-ladder-head,.rep-ladder .rung .rl{color:#111}
  .rep-ladder .rung .bar{background:#fff;border-color:#999}
  .rep-ladder .rung .bar i{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .rep-explain{background:#f2f7f4;color:#333}
  .rep-explain strong{color:#1c5f28}
  .rep-notmeasured{background:#f7f7f7;border-color:#bbb;color:#333}
  .rep-table-wrap,.shareboard,.pin-intel-box,.ai-box,.rd-review,.rep-map,.smap{background:#fff;border-color:#999}
  .pin-intel-box{border-top:2.5px solid #111}
  .ai-box{border-color:#cb9}
  .rep-table th{color:#555;border-color:#999}
  .rep-table td{color:#333;border-color:#ddd}
  .rep-matrix td.in{color:#111}
  .rep-matrix td.out,.rep-matrix td.na{color:#767676}   /* (B4) the quiet grey of an absent cell, at 4.5 to 1 (it was #999, 2.8) */
  .rep-matrix .mx-rank,.rep-matrix td.mx-rank{color:#5a4413}
  /* Screen var(--ink) rules that out-specify the generic print td color. */
  .rep-matrix td.mx-kw,.rep-matrix td:first-child{color:#111}
  .rep-table td.c-dir-name{color:#111}
  .rd-review-title{color:#111}
  #area-rows td.in{color:#111}
  #area-rows td.out{color:#5a4413}
  .rep-lead td,.auth-you td,.sb-line.you{background:#f3ead2;color:#5a4413}
  .auth-ic.own{color:#777}   /* the screen token is a dark-mode grey and prints near-invisible */
  .auth-ic.brand{color:#8a6a1e}
  .base-ic{color:#8a6a1e}   /* section 10: the baseline mark prints in the same ink */
  .auth-float{display:none}
  .sb-line.you .sbname,.sb-line.you .sbv,.sb-line.you .sbvals{color:#5a4413}
  .sbname,.ai-q,.plan-body b,.pin-intel-box h3,.w-health-item strong,.rep-win{color:#111}
  /* (round 2, B4) the screen's .sb-line .sbname out-specifies .sbname above, so the rivals' names printed in the screen's
     near-white; the row's own words take ink on paper at the same weight */
  .sb-line .sbname{color:#111}
  .sb-line .sbv{color:#555}
  .sb-line .sbv.dim{color:#777}
  /* the hero tiles are dark cards on screen: with "Background graphics" ticked they printed dark under dark words */
  .hg-tiles .rep-stat{background:#fff;border-color:#999}
  .hg-tiles .rep-stat.hg-lead{background:#f2f7f4;border-color:#9c9}
  /* a phone's sticky first column (its max-width:760px holds on paper, which is narrower) printed its dark cell under dark
     words; on paper the column is an ordinary one, the reader's own row keeping its wash */
  .rep-table th:first-child,.rep-table td:first-child{position:static;background:none}
  .rep-lead td:first-child,.auth-you td:first-child{background:#f3ead2}
  /* the other grounds that printed dark under words with "Background graphics" ticked (the audit of 29 Sep): the zip
     table's window, a fold's summary, the maps' credit line */
  .mi-zipscroll,.vol-fold>summary,.rep-table-wrap,.rp-tblwrap,.mi-zipscroll thead th{background:#fff}
  .mi-ziptable thead{background:#fff !important}   /* over the narrow column's sticky head, which stands later in the sheet */
  .leaflet-control-attribution{background:#fff !important;color:#555 !important}
  .sbbar{background:#e8e8e8;border:1px solid #999}
  .sbfill{background:#666}
  .sbfill.you{background:#b08d2f}
  /* WHERE COLOUR IS THE MEASUREMENT, IT PRINTS (round 2, B2): "Who's taking the calls", the score bars and the hero
     tiles' goal-line bars printed empty unless the reader ticked "Background graphics"; they print whatever it says now */
  .sbbar,.sbfill,.wb-bar,.wb-fill,.hg-bar,.hg-bar i{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .hg-bar{background:#e8e8e8}
  .sbv,.sbvals,.ai-mentions,.plan-src{color:#555}
  .vol-local{color:#1c5f28}
  .plan-src{color:#5a4413}
  .ai-verdict.ai-named{color:#1c5f28}
  .ai-verdict.ai-unnamed{color:#8a2f1c}
  .ai-verdict.ai-maybe,.ai-brand.ai-maybe{color:#555}
  .ai-you{color:#1c5f28}
  .ai-src-k{color:#5a4413}
  .ai-src-name,a.ai-src-name,.ai-sources-h,.ai-ads-h{color:#111}
  .ai-src-row.you .ai-src-name,.ai-src-st.good,.ai-src-sign{color:#1c5f28}
  .ai-src-st.bad{color:#8a2f1c}
  .ai-src-h,.ai-src-note,.ai-src-q,.ai-src-uses,.ai-src-what,.ai-src-st.quiet,.ai-src-title,.ai-sources-sub,.ai-sources-line,.ai-sources-fix,.ai-ads-line,.ai-ads-note{color:#444}
  .ai-sources{background:#fff;border-color:#cb9}
  .ai-sources-fix{background:#fbefec}
  .ai-src-row,.ai-sources-fix{break-inside:avoid;page-break-inside:avoid}
  .ai-text{background:#f7f7f7;border-color:#bbb;color:#333}
  .ai-full summary{display:none !important}
  .ai-junk{display:none}   /* (B8) an embedded map's furniture inside a verbatim answer: on screen as it came, never on paper */
  /* r13 G-2: the ads fold joins the folds that print. Its summary goes the same way as the others, so the
     standing explanation reads as ordinary paragraphs on paper rather than under a control nobody can press. */
  .rep-fold>summary,.rep-raw-fold>summary,.mi-ads>summary{display:none !important}
  /* (release 31, round 2: KC's and Larson's PDFs printed the searches table's "− 10 MORE UNDER 10 A MONTH" toggle as a bar) the
     fold prints open and each of its rows says "<10/mo" itself, so its toggle, a screen control, goes; and the closing
     "Powered by" line never takes a page of its own (KC's page 22 held only it): it keeps with what is above it */
  .vol-fold>summary{display:none !important}
  .rep-powered{break-before:avoid;page-break-before:avoid}
  /* a market chapter's More detail (V2's and L2's folds) PRINTS SHUT (the coordinator's ruling of 28 Sep: the PDF is the
     summary, the details stay on the page). Its face prints above it; the fold prints one line naming what it holds (the
     summary's .mi-more-print, hidden on the screen) and nothing of its body, open or shut on the screen; the line keeps with
     the face above it, never opening a page alone. */
  details.mi-more{margin-top:6px;break-before:avoid;page-break-before:avoid}
  details.mi-more>summary{display:block !important;padding:0;margin:0;border:0;background:none;cursor:auto}
  details.mi-more>summary .mi-more-t,details.mi-more>summary .mi-more-what{display:none !important}
  details.mi-more>summary .mi-more-print,details.mi-more>summary .mi-more-print[hidden]{display:block !important;font-size:9.5pt;font-style:italic;color:#555}
  details.mi-more>:not(summary){display:none !important}
  .mi-take{color:#111}
  .mi-ads{background:#fff;border-color:#999}
  .mi-ads-body p{color:#333 !important}
  .ai-full > *{display:block !important}
  details.ai-full::details-content{content-visibility:visible !important}
  .pin-intel-list,.pin-intel-note,.plan-claim,.rd-review-snippet,.c-counts,.rep-lens-meta,.w-health-item span:last-child,.plan-note,#card-walkthrough p{color:#333}
  .w-health-item[data-status="pass"] .w-health-ic{color:#1c5f28}
  .w-health-item[data-status="fail"] .w-health-ic{color:#8a2f1c}
  .rep-cit-table td.ok{color:#1c5f28}
  .rep-cit-table td.bad{color:#8a2f1c}
  .rep-cit-table td.warn{color:#5a4413}
  .rep-flag{color:#8a2f1c;border-color:#c99}
  .c-mm-row{color:#5a4413}
  .imp-high{color:#8a2f1c;border-color:#c99}
  .imp-medium{color:#5a4413;border-color:#cb9}
  .vol-band{color:#111;border-color:#777}
  .plan-box{border-color:#111}
  .rd-lowstar{background:#fbeeea;border-color:#dfa08e;color:#111}
  .mi-lowdata{background:#f3ead2;border-color:#cb9;color:#111}
  /* Pale-on-white accent set: mint/gold/salmon darken for toner. */
  .rep-delta-up{color:#1c5f28}
  .rep-delta-down{color:#8a2f1c}
  .rep-delta-flat{color:#555}
  .pin-missing{color:#1c5f28}
  .rd-review-new{color:#1c5f28;border-color:#9c9}
  .rd-review-flag{color:#8a2f1c;border-color:#c99}
  .rd-review-rating{color:#333}
  .rep-feat-ads{color:#5a4413;border-color:#cb9;background:#fff}
  .rep-feat-ai{color:#1c5f28;border-color:#9c9;background:#fff}
  .ai-surface{color:#5a4413;border-color:#cb9}
  .ai-brand{color:#333}
  .w-health-item[data-status="warn"] .w-health-ic{color:#5a4413}
  .rep-grade{color:#5a4413;border-color:#cb9}
  #card-walkthrough a{color:#5a4413}
  /* Bands and breaks: chapters keep their head with their first band; long
     tables flow with protected rows and repeating heads. */
  .rep-act{break-after:avoid;page-break-after:avoid}
  /* CARDS FLOW ACROSS PAGES (round 2, B7). Every card not on an exceptions list refused to split, so a card taller than
     what was left of a page moved whole to the next and left the page behind it mostly empty (the $29's and a plan's
     first pages). A card flows now (a market chapter's sections already did, #mi-book .mi-sec); what stays whole is what
     reads wrong cut: a short card (report-view.js marks one under 520 px on screen print-keep at beforeprint), the figures (the map and its lattice, the hero tiles), a
     card's small units, a table's rows, and a heading, which keeps with what follows it. */
  .rep-stat,.rep-explain,.rd-review,.pin-intel-box,.plan-phase,.sb-line{break-inside:avoid;page-break-inside:avoid}
  .rep-card.print-keep,.heromaps,.rep-herogrid{break-inside:avoid;page-break-inside:avoid}
  /* A MAP LIST FLOWS WITH ITS ROWS WHOLE (round 2's pre-flight C, F1). Every list refused to split, so a 20-row list taller
     than a sheet broke anyway, left its last row alone on a page (Discount Door, page 12 of 23) and pushed the next list to
     a fresh sheet. Only a short list (under 320 px on screen, marked print-keep at beforeprint) stays whole; a long one
     flows, its rows kept whole (.rep-table tr below), its heading and line kept with what follows. */
  .rep-lens.print-keep{break-inside:avoid;page-break-inside:avoid}
  .rep-lens-h,.rep-lens-meta{break-after:avoid;page-break-after:avoid}
  .rep-card>h2,.rep-headrow,.mi-sec>h3,.rep-card>h3{break-after:avoid;page-break-after:avoid}
  .rep-table tr,.plan-item,.ai-q,.ai-verdict,.ai-mentions{break-inside:avoid;page-break-inside:avoid}
  /* THE PLAN'S LAST STEPS NEVER STAND ALONE (the review of 4 Oct, S5: Blue State's print ended on a page holding step 08
     and the footer, 16% full): the last three steps of the plan's last list keep together, so a page the plan spills onto
     holds a group of them, never one */
  .plan-fold:last-of-type .plan-list>.plan-item:nth-last-child(-n+2){break-before:avoid;page-break-before:avoid}
  .plan-fold:last-of-type .plan-list>.plan-item:nth-last-child(n+2):nth-last-child(-n+3){break-after:avoid;page-break-after:avoid}
  .rep-table thead{display:table-header-group}
  .rep-table-wrap,.rep-window{overflow:visible !important;max-height:none !important}
  .rep-window-fade,.rep-window-count{display:none !important}
  /* The grid pair: cells coded by border style for grayscale; the map goes
     light under the colored stars; the fixed 460 stage scales to a half page. */
  .heromaps{grid-template-columns:1fr 1fr}
  .lattice,.smap{break-inside:avoid;page-break-inside:avoid}
  /* (the fix round of 2 Oct 2026: enlarged about its middle by the picture's own --smk, report-view.js, so its points fill it) */
  .sstage{transform:scale(.76) translate(230px,230px) scale(var(--smk,1)) translate(-230px,-230px) !important}
  /* the live street map (zoom, pan, full screen: 1 Oct 2026) is screen furniture: paper keeps the fixed picture, as before */
  .smap .sm-leaf,.smap .mi-mapctl,.g-fshead,.smap .sm-radbtn{display:none !important}
  .stile{filter:saturate(.15)}
  .cell{box-shadow:none !important}
  .cell.pg{background:#fff;color:#111;border:2.5px solid #111}
  .cell.pg .cb{color:#111}
  .cell.pa{background:#fff;color:#333;border:2px dashed #555}
  .cell.pa .cb{color:#333}
  .cell.pr{background:#fff;color:#767676;border:1.5px dotted #888}
  .cell.pr .cb{color:#767676}
  .cell.px{background:#eee;color:#777;border:1px solid #aaa}
  /* W3 on paper: nobody listed is a hollow square with a thin dashed border; the marks, ring and line go dark */
  .cell.pe{background:#fff;color:#888;border:1px dashed #aaa}
  .cell.pe .cb{color:#888}
  .cell .cmark.mv{border-right-color:#111 !important}
  .cell .cmark.wd,.cell .cmark.no{border-color:#333 !important}
  /* (release 33) a wider search's place on paper: a double outline, unlike the gold's dashed and the red's dotted */
  .cell.pw{background:#fff;color:#333;border:3px double #444}
  .cell.pw .cb,.cell .cw,.cwkey,.cwkey .cw{color:#111}
  .cwkey{background:#fff;border:3px double #444}
  .smark{border-color:#111;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .smfrom{border-color:#333}
  .smline{border-top-color:#333}
  /* the search radius prints only when the reader had it on (report-view.css .smap.sm-rad-on .sradius), in grey ink */
  .sradius{border-color:#666;background:rgba(0,0,0,.03)}
  .sradius.wide{border-color:#1f5f99;background:rgba(31,95,153,.04)}
  .mapnote{color:#333}
  .rep-zpoly.in{fill:#e2efe6;stroke:#333}
  .rep-zpoly.out{fill:#fff;stroke:#999;stroke-dasharray:3 3}
  .rep-zpoly.unconf{fill:#eee;stroke:#666;stroke-dasharray:1 2}
  .rep-map-zip{fill:#555}
  .rep-map-home{fill:#b08d2f;stroke:#111}
  .rep-map-legend{color:#555}
  /* The clarity round on paper: the chip row and the drill are screen
     furniture; the seam column, scope chips, and score bars flip light. */
  .kwsel,.kwsel-grid,#pin-drill{display:none !important}
  /* and a point left open on screen prints as every other: no circle round its star, no frame round its square */
  .sdot.staropen{transform:none;box-shadow:none}
  .lattice .cell.cellopen{outline:none}
  /* Legend round on paper: badges, info controls, popovers, and overlays are
     screen furniture; the ad copy flips dark-on-light. */
  .ins-badge,.rep-infobtn,.ins-card,.mast-what,#rep-overlay{display:none !important}
  .ad-copy{color:#555}
  .rep-matrix th.mx-rank,.rep-matrix td.mx-rank{border-left:1px dashed #999;background:#faf6ea}
  .mx-rank-link{color:#5a4413}
  .mx-ahead{color:#555}
  .vol-scope{color:#555;border-color:#999;background:#fff}
  .vol-scope-geo{color:#5a4413;border-color:#cb9}
  .wb-label,.wb-unscored,.wb-group{color:#333}
  .wb-num{color:#111}
  .wb-bar{background:#eee;border-color:#999}
  .wb-good{background:#1c5f28}
  .wb-mid{background:#b08d2f}
  .wb-low{background:#8a2f1c}
  .wb-row{break-inside:avoid;page-break-inside:avoid}
  a{color:inherit;text-decoration:none}
}

/* == The verdict round (2026-08-30): clickable evidence glyphs + the evidence window == */
.rep-cit-table .c-ev-btn{background:none;border:0;padding:0 2px;font:inherit;cursor:pointer;border-bottom:1px dotted currentColor}
.rep-cit-table .c-ev-btn.ok{color:var(--mint);font-weight:700}
.rep-cit-table .c-ev-btn.warn{color:var(--gold);font-weight:700}
.rep-cit-table .c-ev-btn.bad{color:var(--bad);font-weight:700}
.rep-cit-table .c-ev-btn.na{color:#7d8a84;font-weight:600}
.rep-cit-table .c-ev-btn:hover{filter:brightness(1.3)}
.rep-cit-table td.warn,.rep-cit-table .c-ev-btn.warn{font-weight:700}
.c-ev-note{color:var(--ink2);font-size:.86rem;margin:0 0 10px}
.c-ev-list{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
.c-ev-val{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;font-size:.92rem}
.c-ev-val.hit{border-color:var(--mint);background:rgba(67,213,151,.06)}
.c-ev-val.hit .c-ev-v{color:var(--mint);font-weight:700}
.c-ev-tag{font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mint);white-space:nowrap}
.c-ev-ref{color:var(--ink3);font-size:.82rem;margin:0}
@media print{
  .rep-cit-table .c-ev-btn{border-bottom:0;cursor:default}
  .rep-cit-table .c-ev-btn.ok{color:#1c5f28}
  .rep-cit-table .c-ev-btn.bad{color:#8a2f1c}
  .rep-cit-table .c-ev-btn.warn{color:#5a4413}
  .rep-cit-table .c-ev-btn.na{color:#767676}
}

/* I3 W-65 (D-41): the market map on mockup A: Leaflet on the house tiles, badges, ticks, hollow outside rings, the window */
.mi-mapstage{position:relative;width:100%;height:100%}
.mi-mapbox{position:absolute;inset:0;background:#0e1412}
/* (the $29 street map's live map shares the market map's ground and tiles: 1 Oct 2026, report-view.js smLive) */
.mi-map .leaflet-container,.smap .leaflet-container{font-family:inherit;background:#0e1412}
.mi-map .leaflet-tile-pane,.smap .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.72) contrast(1.05) saturate(.25)}
.mi-map .leaflet-control-attribution{background:#0d100fcc;color:var(--ink3);font-size:10px}.mi-map .leaflet-control-attribution a{color:var(--ink3)}
/* the zoom sits in the map's top right corner under the full screen button (the owner, 28 Sep 2026: the controls tidied;
   report-view.js .mi-mapctl), and at the corner itself where that button is hidden (900 px and under) */
.mi-map .leaflet-control-zoom{margin:44px 10px 0 0;border:1px solid var(--line);box-shadow:none}
@media (max-width:900px){.mi-map .leaflet-control-zoom{margin-top:10px}}
.mi-map .leaflet-control-zoom a{width:24px;height:24px;line-height:22px;font-size:15px;background:#141917;color:var(--ink2);border-bottom-color:var(--line)}
.mi-map .leaflet-control-zoom a:hover{background:#1b211e;color:var(--ink)}
.leaflet-marker-icon.mi-mk>.mk-sq,.leaflet-marker-icon.mi-mk>.mk-out,.leaflet-marker-icon.mi-mk>.mk-tick{width:100%;height:100%}
/* the owner, round 11: the square grows with the zoom, about its own centre so its anchor never moves */
.mk-sq{--edge:rgba(67,213,151,.8);transform:scale(var(--mk-scale,1));transform-origin:center center;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:6px;background:rgba(20,26,23,.86);border:1.5px solid var(--edge);color:#eef2ef;font:700 12px var(--mono);cursor:pointer;line-height:1.05;box-sizing:border-box}
.mk-sq small{font:500 8.5px var(--mono);color:var(--ink3);letter-spacing:.04em}.mk-sq.weak{--edge:rgba(230,182,84,.85);border-color:rgba(230,182,84,.85)}
/* your zip's badge wears a purple ring, the owner's ruling of 30 Sep 2026 (it was gold, too like a weak zone's gold edge) */
.mk-sq.you{box-shadow:0 0 0 3px var(--purp)}
/* the shape (2026-09-07): the lighter border of a zip the fill counted with the customer's own; the small square of a counted zip with nothing located; the PO-box dot */
.mk-sq.enc{--edge:rgba(67,213,151,.38);border-color:rgba(67,213,151,.38);color:#cfd8d3}.mk-sq.enc small{color:#8a948f}
/* THE ZIPS AT ONE POINT ARE TOLD APART BY THEIR LOOK, NOT THEIR SIZE (the owner, 28 Sep 2026): their square is sized by
   its total like any other (report-view.js zipBadgeSizes) and drawn as a stack of squares, two edges behind it up and
   to the right in the badge's own edge colour. An outer shadow is never painted under the badge itself, so the stack
   shows only where it stands out. Your zip's purple ring (30 Sep 2026) goes round the top square. */
.mk-sq.grp{box-shadow:3px -3px 0 -1.5px #141a17,3px -3px 0 0 var(--edge),6px -6px 0 -1.5px #141a17,6px -6px 0 0 var(--edge)}
.mk-sq.grp.you{box-shadow:0 0 0 3px var(--purp),6px -6px 0 -1.5px #141a17,6px -6px 0 0 var(--edge)}
.mi-lgdot.sq.grp{box-shadow:2px -2px 0 -1px var(--bg),2px -2px 0 0 rgba(67,213,151,.8)}
.mk-sq.zero{font-size:10px;color:var(--ink3)}
.mk-ctx{width:100%;height:100%;border-radius:50%;background:#d8c48a;border:1px solid #0c110f;box-sizing:border-box}
.leaflet-marker-icon.mi-mk>.mk-ctx{width:100%;height:100%}
/* A MAP POINT IS A PLUS, ON THE MAP AND IN ITS KEY, FROM ONE DRAWING (the owner, 28 Sep 2026: "These pins are placed on
   the map as a plus sign but the icon legend shows it as a blue square which is confusing"). The key's two swatches, a
   point we asked Google from (blue) and one whose winner is open to challenge (gold), are drawn by the very rules that
   draw the map's .mk-tick, so the two cannot drift apart again. */
.mk-tick,.mi-lgdot.tick,.mi-lgdot.pinweak{width:10px;height:10px;position:relative;cursor:pointer;background:none;box-shadow:none;border:0;border-radius:0}
.mk-tick:before,.mk-tick:after,.mi-lgdot.tick:before,.mi-lgdot.tick:after,.mi-lgdot.pinweak:before,.mi-lgdot.pinweak:after,.mi-pin:before,.mi-pin:after{content:"";position:absolute;background:#6fd3f2;left:calc(50% - 1px);top:0;width:2px;height:100%}
.mk-tick:after,.mi-lgdot.tick:after,.mi-lgdot.pinweak:after,.mi-pin:after{transform:rotate(90deg)}
.mk-tick.weak:before,.mk-tick.weak:after,.mi-lgdot.pinweak:before,.mi-lgdot.pinweak:after,.mi-pin.weak:before,.mi-pin.weak:after{background:var(--gold)}
.mi-lgdot.tick,.mi-lgdot.pinweak{cursor:default;flex:none;margin:0 1.5px}
.mk-out{display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(160,170,185,.12);box-shadow:inset 0 0 0 1.5px rgba(160,170,185,.6);color:#c3ccd6;font:500 10px var(--mono);cursor:pointer;box-sizing:border-box}
/* THE MAP'S CONTROLS (the owner, 28 Sep 2026: "6 different options on the top left ... Is there a better way to show these
   so that they don't look so cluttered?"): at the top left one switch for the view and one Layers button, at the top right
   full screen over the zoom. The row keeps clear of that corner (26 px of buttons and 10 of margin each side), so it never
   runs under the zoom, and it wraps before it would. It stands over the map library's own corners (their z-index is 1000)
   so the Layers menu is never drawn under the zoom on a narrow map; the menu opens under its button's right edge, away
   from the corner. */
.mi-mapchips{position:absolute;top:10px;left:10px;z-index:1001;display:flex;gap:6px;flex-wrap:wrap;align-items:flex-start;max-width:calc(100% - 66px)}
/* r12-map-fullscreen (the owner, 2026-09-09; desktop only, D-9): a CSS overlay rather than the Fullscreen API,
   so the map's detail window and the business drawer, both opened from this map, survive it.
   The overlay is on the FRAME and not the map box, because the address view's coverage note and the whole key
   sit below the map and were being covered by it: the pin view can show far fewer businesses than the zip
   view counted, and the sentence that says so has to be on the same screen. */
.mi-mapframe.fs{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;margin:0;z-index:2147482000;
  display:flex;flex-direction:column;gap:8px;padding:12px 14px 14px;background:var(--bg);overflow:auto}
.mi-mapframe.fs .mi-map{flex:1 1 auto;min-height:0;height:auto;aspect-ratio:auto;margin-top:0}
.mi-mapframe.fs .mi-mapnote-host,.mi-mapframe.fs .mi-maplegend{flex:0 0 auto;margin-top:0}
/* FULL SCREEN USES THE KEY'S OWN LAYOUT, SIZED TO THE SCREEN (the owner, 28 Sep 2026: "the bottom part that shows all the
   icons and legends is too cluttered and not symmetric"). It had laid the whole key out under the map, every mark's
   sentence in columns of uneven length (the owner's ruling of 10 Sep, when the page's key was a row of four); the key is
   the same grid everywhere now, one scale and equal columns of short words (.mi-maplegend, below), with the whole of it a
   click away in the drawer, which opens over full screen. Here the grid takes the screen's width and a little more type. */
.mi-mapframe.fs .mi-maplegend{padding:10px 16px 12px}
.mi-mapframe.fs .mi-lggrp .lg{font-size:12.5px;min-height:22px}
.mi-mapframe.fs .mi-lgscale .seg{font-size:11px}
body.mi-mapfs{overflow:hidden}
.mi-mapchip.fs[aria-pressed="true"],.mi-mapbtn.fs[aria-pressed="true"]{color:var(--gold);border-color:var(--gold)}
/* The button is desktop-only: measured at 390px it buys almost nothing, and a control that appears and does
   nothing reads as broken. The overlay is neutralised at the same width, so a reader who narrows the window
   while full screen cannot be left with the map pinned over the page and the exit control hidden. */
@media (max-width:900px){
  .mi-mapchip.fs{display:none}
  .mi-mapframe.fs{position:static;width:auto;height:auto;padding:0;background:none;display:block;overflow:visible}
  .mi-mapframe.fs .mi-map{aspect-ratio:960/430}
  body.mi-mapfs{overflow:auto}
}
@media print{
  .mi-mapframe.fs{position:static;width:auto;height:auto;padding:0;background:none;display:block;overflow:visible}
  .mi-mapframe.fs .mi-map{aspect-ratio:960/430}
}
/* EVERY CONTROL ON AN OPAQUE SURFACE (the review of 28 Sep: an outside ring showed through the lit Outside chip, whose
   gold was a 12% tint over the map). The lit states are the same tints laid over the chip's own ground, worked out solid:
   gold .12 over #141a17 is #2d2d1e, mint .12 is #1a3026. */
.mi-mapchip{display:inline-flex;align-items:center;gap:6px;font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border:1px solid var(--line);background:#141a17;color:var(--ink2);cursor:pointer;border-radius:3px}
.mi-mapchip svg{width:12px;height:12px;display:block}.mi-mapchip[aria-pressed="true"]{border-color:rgba(230,182,84,.6);color:var(--gold);background:#2d2d1e}
.mi-mapchip:hover{color:var(--ink)}
.mi-mapchip:focus-visible,.mi-mapbtn:focus-visible,.mi-layopt input:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
/* The views (the address view 2026-09-09; the shaded zips, the owner, 28 Sep 2026). They change what the map IS rather
   than filtering a layer off it, so they are one segmented switch, set apart from the Layers button, and the view in
   force lights mint, not gold. Since the owner's ruling of 30 Sep 2026 they are toggle buttons in a toolbar (aria-pressed:
   report-view.js), at most one on and none at all allowed, so the lit one is read off aria-pressed; with none on, none
   is lit. */
.mi-mapviews{display:inline-flex;flex:0 0 auto}
.mi-mapviews .mi-mapchip.vw{border-radius:0;position:relative}
.mi-mapviews .mi-mapchip.vw + .mi-mapchip.vw{margin-left:-1px}
.mi-mapviews .mi-mapchip.vw:first-child{border-radius:3px 0 0 3px}
.mi-mapviews .mi-mapchip.vw:last-child{border-radius:0 3px 3px 0}
.mi-mapchip.vw[aria-pressed="true"]{border-color:rgba(67,213,151,.55);color:var(--mint);background:#1a3026;z-index:1}
.mi-mapchip.vw:focus-visible{z-index:2}
/* THE LAYERS MENU (report-view.js): one button, and under it a small opaque panel of checkboxes, one a layer (the map
   points, the outside rings, the dots of the zips with no shape). A layer the address view has no place for is dimmed
   and cannot be ticked there. */
.mi-maplayers{position:relative;flex:0 0 auto}
.mi-mapchip.lyr .car{width:9px;height:9px;margin-left:-1px;transition:transform .15s}
.mi-mapchip.lyr[aria-expanded="true"]{border-color:rgba(230,182,84,.6);color:var(--gold);background:#2d2d1e}
.mi-mapchip.lyr[aria-expanded="true"] .car{transform:rotate(180deg)}
.mi-laymenu{position:absolute;top:calc(100% + 4px);right:0;z-index:1100;min-width:170px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:3px;box-shadow:0 10px 24px rgba(0,0,0,.55)}
.mi-laymenu[hidden]{display:none}
.mi-layopt{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:2px;font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);cursor:pointer;white-space:nowrap}
.mi-layopt:hover{background:#1a211e;color:var(--ink)}
.mi-layopt input{margin:0;width:14px;height:14px;accent-color:var(--gold);cursor:pointer;flex:none}
.mi-layopt svg{width:12px;height:12px;display:block;flex:none}
.mi-layopt.na{opacity:.4;cursor:default}.mi-layopt.na:hover{background:none;color:var(--ink2)}
/* full screen, an icon in the top right corner, the zoom's own size and dress, over the zoom (.leaflet-control-zoom above) */
.mi-mapctl{position:absolute;top:10px;right:10px;z-index:600;display:flex;flex-direction:column;gap:6px}
.mi-mapbtn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:1px solid var(--line);border-radius:2px;background:#141917;color:var(--ink2);cursor:pointer}
.mi-mapbtn:hover{background:#1b211e;color:var(--ink)}
.mi-mapbtn svg{width:13px;height:13px;display:block}
/* (desktop only, as the chip was: under 900 px the full screen overlay is neutralised, above; after the rule that draws it,
   so the cascade hides it) */
@media (max-width:900px){.mi-mapctl{display:none}}
/* ALL OF IT FITS A 320 PX PHONE (the review of c493f73c, LOW-3: the views ran 41 px past the map there). Under 1180 px,
   where the report's column is narrow beside the rail, the switch drops its icons; under 420 px it tightens its letters;
   under 375 px the Layers button keeps its icon and its arrow, its word left to a screen reader. Measured in a browser:
   one row at 320, 390, 768 and 1440 px. */
.mi-mapviews{max-width:100%;flex-wrap:wrap}
@media (max-width:1179px){.mi-mapviews .mi-mapchip.vw svg{display:none}.mi-mapviews .mi-mapchip.vw,.mi-mapchip.lyr{letter-spacing:.04em}}
@media (max-width:420px){
  .mi-mapviews .mi-mapchip.vw{padding:5px 7px;letter-spacing:.04em}
  .mi-mapchip.lyr{padding:5px 8px;letter-spacing:.04em}
}
@media (max-width:374px){
  .mi-mapviews .mi-mapchip.vw{padding:5px 5px;letter-spacing:.02em}
  .mi-mapchip.lyr{gap:3px;padding:5px 6px}
  .mi-mapchip.lyr .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
/* THE SHADED VIEW'S DOT for a zip with no shape in our map's files (report-view.js zipShadeDot): its fill, edge and halo are
   the SVG's own; the box only makes it a button */
.leaflet-marker-icon.mi-mk>.mk-dot{display:block;width:100%;height:100%;cursor:pointer}
/* no figure on the map in the shaded view: the outside rings keep their size and their hover, not their count */
.mi-shaded .mk-out{color:transparent}
/* a shape's hover: the zip and its count, in the window's own dress */
.mi-map .leaflet-tooltip.mi-tip{background:#141917f2;border:1px solid var(--line);border-radius:3px;box-shadow:0 6px 18px rgba(0,0,0,.45);color:var(--ink);font:600 11px/1.35 var(--mono);padding:4px 8px}
.mi-map .leaflet-tooltip-top.mi-tip:before{border-top-color:var(--line)}
.mi-map .leaflet-tooltip-bottom.mi-tip:before{border-bottom-color:var(--line)}
.mi-map .leaflet-tooltip-left.mi-tip:before{border-left-color:var(--line)}
.mi-map .leaflet-tooltip-right.mi-tip:before{border-right-color:var(--line)}
.mi-map path.mi-zipshade:focus{outline:none}
.mi-map path.mi-zipshade:focus-visible{stroke:#eef2ef;stroke-width:2.5px;stroke-opacity:1}
/* A badge too small to carry its zip code carries its count alone (report-view.js sizeBadges, P1-4) */
.mk-sq.tight{font-size:11px}.mk-sq.tight small{display:none}
/* THE MAP ON A PHONE (the quality review of 27 Sep, P1-4). It was a 337 by 150 px strip (the desktop's 960:430), the
   filter chips covered its top, and the key ran off the right edge. On a phone the map is a fixed 360 px tall, the
   chips sit in their own row above the tiles, and the key wraps. The static drawing (no map library) takes the same
   box, its stage drawn to that shape. */
@media (max-width:760px){
  .mi-map{aspect-ratio:auto;height:360px}
  .mi-map.mi-leaf{height:auto}
  .mi-leaf .mi-mapstage{display:flex;flex-direction:column;height:auto}
  .mi-leaf .mi-mapbox{position:relative;inset:auto;height:360px}
  .mi-leaf .mi-mapchips{position:static;order:-1;max-width:none;padding:8px;border-bottom:1px solid var(--line2);background:var(--surface)}
}
/* The key and the zip table wrap wherever the report's column is narrow: on a phone, and on a tablet beside the rail
   (the second-release review of 27 Sep: at 768 px that column is 434 px, and both still scrolled sideways). It holds to
   1179 px (the review of the demand round, L3: at 1024 px, iPad landscape, the full table's rows jumped from 54 px to
   98 to 141 px, the top three wrapping in their narrow column); from 1180 px the column holds the table whole. */
@media (max-width:1179px){
  /* (the key is a grid of its own now, one column where it is narrow: .mi-maplegend's container rules) */
  /* the zip table: rows were 155 to 235 px tall because the top three squeezed into a column a few letters wide. Each
     row is a grid of the six counts, the top three on a second line across the whole row, and the heads say their
     short words; the head row keeps to the top of the table's window as it scrolls */
  .mi-ziptable,.mi-ziptable thead,.mi-ziptable tbody{display:block}
  .mi-ziptable thead{position:sticky;top:0;z-index:2;background:var(--surface)}
  .mi-ziptable tr{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) minmax(0,1.35fr);align-items:end;border-bottom:1px solid var(--line2)}
  .mi-ziptable th,.mi-ziptable td{min-width:0;border-bottom:0;padding:6px 3px;overflow-wrap:break-word}
  .mi-ziptable td{font-size:11.5px}
  .mi-zipscroll .mi-ziptable thead th{position:static;box-shadow:none;font-size:8.5px;letter-spacing:0;line-height:1.25}
  .mi-ziptable th:last-child{display:none}
  .mi-ziptable td:last-child{grid-column:1/-1;padding-top:0;font-size:12px;line-height:1.4;color:var(--ink3)}
  .mi-ziptable th:first-child,.mi-ziptable td:first-child{position:static}
}
.mi-ziptable .zs{display:none}
@media (max-width:1179px){
  .mi-ziptable .zs{display:inline}
  .mi-ziptable .zl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
/* The coverage line. It sits at the foot of the map and is only shown while the pins are, because it is the
   answer to "why are there fewer dots than the zip view counted?" and that question only exists there. */
/* r12-note-below (the owner, 2026-09-09): the address view's coverage note was an overlay pinned inside the
   map, where it covered the zoom controls and, at 390px, a third of the map. It is now a plain block under the
   map box, in its own host, above the key. */
.mi-mapnote-host{margin-top:8px}
.mi-mapnote{font:500 11.5px/1.55 var(--body);color:var(--ink2);background:var(--surface);border:1px solid var(--line2);border-radius:3px;padding:7px 10px}
@media (max-width:520px){.mi-mapnote{font-size:11px;padding:6px 8px}}
.mi-win{position:fixed;z-index:2147483000;width:300px;max-width:82%;background:#141917f2;border:1px solid var(--line);border-top:2px solid var(--gold);box-shadow:0 12px 30px rgba(0,0,0,.5);color:var(--ink);font-size:13px;backdrop-filter:blur(4px)}
/* the summary's own way into the full list, in the map window and in the side panel alike */
.mi-listbtn{display:block;width:100%;margin-top:8px;padding:6px 10px;font:600 11.5px var(--mono,monospace);letter-spacing:.02em;color:var(--gold);background:transparent;border:1px solid var(--gold-line);border-radius:6px;cursor:pointer;text-align:left}
.mi-listbtn:hover{background:var(--gold-soft)}
.mi-win .bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;cursor:grab;background:#1b211e;border-bottom:1px solid var(--line2);font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);user-select:none;touch-action:none}
.mi-win .bar b{color:var(--ink);font:700 13px var(--disp);letter-spacing:.02em;text-transform:none}.mi-win .x{cursor:pointer;color:var(--ink3);font-size:16px;line-height:1;background:none;border:0}.mi-win .x:hover{color:var(--ink)}
.mi-win .body{padding:10px 12px}.mi-win .g{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;color:var(--ink2);font-size:12.5px}.mi-win .g b{color:var(--ink);font-family:var(--mono)}
.mi-win .t{margin:8px 0 0;font-size:12.5px;color:var(--ink2)}.mi-win .v{margin:8px 0 0;font:500 10.5px var(--mono);color:var(--gold)}
.mi-win .row{display:flex;justify-content:space-between;gap:8px;padding:3px 0;border-bottom:1px solid var(--line2);font-size:12.5px}.mi-win .row:last-child{border-bottom:0}.mi-win .row small{color:var(--ink3);font-family:var(--mono)}
/* ZIP CODES THAT SHARE ONE POINT ARE ONE BADGE (the owner, 27 Sep 2026; report-view.js zipGroups): the badge says how many
   zips it holds under their count, and its window lists each zip with its own count, each opening that zip's window */
.mk-sq.grp small{color:var(--ink2)}
.mi-dot.grp{font-size:10px;box-shadow:inset 0 0 0 1.5px rgba(67,213,151,.8),3px -3px 0 -1.5px #141a17,3px -3px 0 0 rgba(67,213,151,.8),6px -6px 0 -1.5px #141a17,6px -6px 0 0 rgba(67,213,151,.8)}
.mi-win .mi-zipchips{display:flex;flex-wrap:wrap;gap:5px 6px;margin-top:10px;max-height:40vh;overflow-y:auto}
.mi-win .mi-zipchip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink2);font:500 11.5px var(--mono);white-space:nowrap;box-sizing:border-box}
.mi-win button.mi-zipchip{cursor:pointer}
.mi-win button.mi-zipchip:hover,.mi-win button.mi-zipchip:focus-visible{border-color:var(--ink3);color:var(--ink);outline:none}
.mi-win .mi-zipchip b{color:var(--ink);font-weight:700}
@media (pointer: coarse){.mi-win .mi-zipchip{min-height:44px}}
.mi-lgdot.sq{border-radius:3px;background:rgba(20,26,23,.86);box-shadow:none;border:1.5px solid rgba(67,213,151,.8)}.mi-lgdot.sq.weak{border-color:rgba(230,182,84,.85);background:rgba(20,26,23,.86);box-shadow:none}
.mi-lgdot.outside{background:rgba(160,170,185,.12);box-shadow:inset 0 0 0 1.5px rgba(160,170,185,.6)}
.mi-mark.ctx{color:#d8c48a;border-color:rgba(216,196,138,.5)}
/* I3 W-66: the marks on the rows, the services census, the roll */
.mi-mark{display:inline-block;font:600 9px var(--mono);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:1px 7px;margin-left:6px;vertical-align:middle;border:1px solid var(--line);color:var(--ink2);white-space:nowrap}   /* a pill never breaks in two (the quality review of 27 Sep) */
.mi-mark.ind{border-color:rgba(230,182,84,.5);color:var(--gold)}.mi-mark.sa{border-color:rgba(127,180,232,.5);color:var(--blue)}.mi-mark.loc{border-color:rgba(199,146,234,.5);color:var(--purp)}
/* the several-locations mark says its words on a tap and to the keyboard (Jose's note 10; report-view.js authTipWire) */
.mi-mark.loc[data-tip]{cursor:help}.mi-mark.loc[data-tip]:focus-visible{outline:2px solid var(--purp);outline-offset:2px}
.mi-mark.org{color:var(--ink3)}.mi-mark.nb{border-color:rgba(67,213,151,.5);color:var(--mint)}.mi-mark.tr{border-color:rgba(236,118,99,.5);color:var(--bad)}
/* the cost of a click: a buyer's own search of another trade says so under its name (report-view.js miChDemand) */
.rp-bar .l .mi-othertrade{display:block;font:500 10.5px var(--mono);color:var(--ink3);margin-top:2px;white-space:normal}
.mi-services{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px 18px;margin:8px 0 4px}
.mi-services .sv{display:grid;grid-template-columns:1fr 70px;gap:8px;align-items:center;font-size:12.5px;color:var(--ink2)}.mi-services .sv .mi-bar{grid-column:1/3}
.mi-services .sv .note{grid-column:1/3;font-size:11.5px;color:var(--ink3);margin-top:-2px}
.mi-filter{font:13px var(--body);padding:6px 10px;border:1px solid var(--line);border-radius:8px;width:18em;background:var(--surface);color:var(--ink);margin:0 10px 0 6px}
.mi-csv{font:600 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mint)}
.mi-roll td{white-space:nowrap}.mi-roll td:first-child{min-width:14em}
/* the roll's names on one line (audit A of 28 Sep, P3-8): a name longer than 20em is cut with an ellipsis, whole on hover
   and in its card; paper wraps it whole (this rule sits above the map's print block, which stays the file's last) */
.mi-roll td:first-child .mi-biz{display:inline-block;max-width:20em;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
@media print{.mi-roll td:first-child{white-space:normal}.mi-roll td:first-child .mi-biz{display:inline;max-width:none;overflow:visible}}
/* THE ROLL FITS ITS WINDOW (R-SITE of 28 Sep: at 1440 its tables were 1,168 to 1,317 px wide in a 936 px window, the outside
   table's heads cut to "WEBS"; at 390, 1,141 px in 352). On screen each table is its window's own width, each column a share
   of it, and a head or a cell wraps rather than widen its column; a name keeps its one line, cut with an ellipsis (whole on
   hover and in its card), and its marks follow it, onto a line of their own when they must. The window's own width decides
   how many columns it holds (a container query, so a laptop's narrower window is not a phone's): all eight from 860 px, six
   below that, and below 600 px the list drawers' shape, the name, the zip (or where it is based) and the reviews the list
   is ordered by. What a narrower window leaves out is on the business's card, one tap on the name, and in the spreadsheet.
   Paper keeps the automatic layout and every name whole (the rules above). */
@media screen{
  #miroll-fold .rep-table-wrap{container:roll / inline-size}
  .mi-roll{table-layout:fixed}
  .mi-roll th{white-space:normal}
  .mi-roll td{white-space:normal}
  .mi-roll td.num{white-space:nowrap}
  .mi-roll td:first-child{min-width:0}
  .mi-roll td:first-child .mi-biz{max-width:100%;white-space:nowrap}
  .mi-roll .mi-mark{max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
  .mi-roll td.spark svg{display:block;max-width:100%;height:auto}
  .mi-roll th:nth-child(1){width:30%}.mi-roll th:nth-child(2){width:7%}.mi-roll th:nth-child(3){width:11%}.mi-roll th:nth-child(4){width:7%}
  .mi-roll th:nth-child(5){width:8%}.mi-roll th:nth-child(6){width:16%}.mi-roll th:nth-child(7){width:8%}.mi-roll th:nth-child(8){width:13%}
  #miroll-outside th:nth-child(1){width:26%}#miroll-outside th:nth-child(2){width:11%}
}
/* a laptop's or a tablet's window: the years and the 24 months are on the card */
@container roll (max-width:859px){
  .mi-roll th:nth-child(n+7),.mi-roll td:nth-child(n+7){display:none}
  .mi-roll th:nth-child(1){width:34%}.mi-roll th:nth-child(2){width:10%}.mi-roll th:nth-child(3){width:14%}.mi-roll th:nth-child(4){width:9%}
  .mi-roll th:nth-child(5){width:11%}.mi-roll th:nth-child(6){width:22%}
  #miroll-outside th:nth-child(1){width:30%}#miroll-outside th:nth-child(2){width:14%}
}
/* a phone's window, as the list drawers (the coordinator, 28 Sep): the name, the zip (or where it is based) and its
   reviews, the key the list is ordered by; the rest of the row is on the business's card, one tap on the name */
@container roll (max-width:599px){
  .mi-roll th:nth-child(n+3),.mi-roll td:nth-child(n+3){display:none}
  .mi-roll th:nth-child(5),.mi-roll td:nth-child(5){display:table-cell}
  .mi-roll th:nth-child(1),#miroll-outside th:nth-child(1){width:56%}
  .mi-roll th:nth-child(2),#miroll-outside th:nth-child(2){width:23%}
  .mi-roll th:nth-child(5){width:21%}
  .mi-roll .mi-namewrap a.mi-gbp{display:none}
}
/* ── W5: the competitor a $29 order names (report-view.js renderRival29, rival29MarkMap, rival29DrillMark; 30 Sep) ───────
   The card's table of counts, each over a bar of its share: yours in gold, the reader's own color on every comparison, and
   the competitor's in purple, the color of the "you named" mark it carries in the drills (.mi-named-mark) and of the small
   number it wears on the street map's points where it is in the top five. The map's stars are green, gold and red, so the
   competitor's own mark is none of the three. Color sits on a full fill or a chip, never a stripe. */
.rv-table{table-layout:fixed}
.rv-table thead th{vertical-align:bottom}
.rv-table th.rv-h0{width:34%}
.rv-table th.rv-hyou{color:var(--gold)}
.rv-table th.rv-hthem{color:var(--purp);overflow-wrap:anywhere}
.rv-table tr.rv-group th{padding-top:12px;color:var(--ink);text-transform:none;letter-spacing:0;font:600 .8rem var(--body)}
.rv-table th.rv-l{text-transform:none;letter-spacing:0;font:500 .8rem var(--body);color:var(--ink2)}
.rv-c{vertical-align:top}
.rv-n{display:block;font:700 .9rem/1.2 var(--mono);color:var(--ink)}
.rv-bar{display:block;height:6px;max-width:180px;margin-top:5px;border-radius:4px;background:rgba(255,255,255,.07);overflow:hidden}
.rv-fill{display:block;height:100%;border-radius:4px;background:var(--gold)}
.rv-them .rv-fill{background:var(--purp)}
.rv-c.rv-none{color:var(--ink3)}
.rv-left{margin:8px 0 0;font-size:.78rem;line-height:1.5;color:var(--ink3);max-width:72em}
.rv-invite{margin:12px 0 0;font-size:.85rem;line-height:1.55;color:var(--ink2);max-width:72em}
.rv-invite a{color:var(--gold);font-weight:600}
/* the street map: a small number on a point's star, at its upper left (the upper right is where a point that was moved wears
   its mark, W3's .smark); it takes no pointer, so the star still opens its drill */
.sdot .rv-badge{position:absolute;top:-6px;left:-8px;min-width:14px;height:14px;padding:0 3px;box-sizing:border-box;border-radius:7px;
  background:var(--purp);color:#0c110f;font:700 9px/14px var(--mono);text-align:center;box-shadow:0 0 0 1.5px #0b0e0d;pointer-events:none}
.rv-cap .rv-key{display:inline-block;min-width:14px;height:14px;padding:0 3px;box-sizing:border-box;border-radius:7px;background:var(--purp);
  color:#0c110f;font:700 9px/14px var(--mono);text-align:center;vertical-align:middle}
/* on paper the number is outlined, so it reads where backgrounds do not print, and the bars keep their fills */
@media print{
  .sdot .rv-badge,.rv-cap .rv-key{background:#fff;color:#7a3ea3;border:1.5px solid #7a3ea3;box-shadow:none}
  .rv-table th.rv-hyou{color:#8a6414}
  .rv-table th.rv-hthem{color:#7a3ea3}
  .rv-bar{background:#eee;border:1px solid #bbb;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .rv-fill{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .rv-invite{color:#333}
}
/* ── The review band (the owner, 2026-09-18)───────────────────────────────────
   A report a person has not read yet says so at the top of the page, in the
   page's own rose, and says why it arrived early. The same link later carries
   the reviewed version and the band turns into one quiet green line, so a
   reader who kept the link can see the verdict change. Page width, not column
   width: it sits above the shell, and it prints, because a reader with the
   paper copy in hand needs the same warning the screen gave. */
.rep-reviewband{background:var(--bad);border-bottom:3px solid #c4442c;padding:14px 22px}
.rep-reviewband p{max-width:1280px;margin:0 auto;font:600 .9rem/1.5 var(--body);color:#2a0e08}
.rep-reviewband p b{color:#2a0e08}
/* The green line is the opposite instrument: it is news a reader can take in at a glance and move past, so it
   keeps the quiet tint the page uses everywhere else rather than the alarm's solid fill. */
.rep-reviewband.ok{background:var(--mint-soft);border-bottom:1px solid rgba(67,213,151,.4);padding:9px 22px}
.rep-reviewband.ok p{font:500 .82rem/1.55 var(--body);color:var(--ink2)}
/* THE REFRESH BUTTON BESIDE THE WORDS (the owner's ruling of 30 Sep 2026: "a button should exist next to the text allowing
   the viewer to refresh the report"). The band's sentence and the button share one row at the band's own width, the
   button right after the words and wrapping under them where the row is narrow; it shows with the green line alone
   (report-view.js reviewRefreshShow), in the line's own mint on a solid ground, and it never prints (below). On a phone,
   where the band is not drawn, the strip's box under the mark carries the same button after the same words. */
.rep-reviewband-row{max-width:1280px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.rep-reviewband-row > p{margin:0;max-width:none;flex:0 1 auto;min-width:0}
.rep-reviewband-go{flex:0 0 auto;display:inline-flex;align-items:center;min-height:28px;padding:4px 12px;border:1px solid rgba(67,213,151,.55);border-radius:4px;background:#132a20;color:var(--mint);font:600 .78rem/1.2 var(--body);letter-spacing:.02em;cursor:pointer}
.rep-reviewband-go:hover{background:#1a3a2c;color:var(--ink)}
.rep-reviewband-go:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.rep-phonemore .rep-reviewband-go{margin-left:4px;vertical-align:middle}
@media (pointer:coarse){.rep-reviewband-go{min-height:44px}}
@media (max-width:760px){
  .rep-reviewband,.rep-reviewband.ok{padding:12px 16px}
  .rep-reviewband p{font-size:.84rem}
}
@media print{
  .rep-reviewband{background:#fff;border:2px solid #b0402c;padding:3mm 4mm;margin-bottom:4mm}
  .rep-reviewband p,.rep-reviewband.ok p{color:#111;max-width:100%;font-weight:600}
  .rep-reviewband.ok{border:1px solid #2f6b52;padding:2mm 4mm}
  .rep-reviewband.ok p{color:#333;font-weight:500}
  /* a control is not a measurement: paper has no button to press (30 Sep 2026) */
  .rep-reviewband-go{display:none !important}
}
/* ── The review status, kept in view (the owner, 28 Sep) ─────────────────────────────────────────────────────────────
   The band above scrolls away with the page; a compact mark of it rides what does not: the sticky rail, right under the
   business's name, and on a phone the start of the sticky chapter strip (.rep-phonetop, near the top of this sheet).
   The band's own two instruments: the rose alarm while a person has not reviewed the report, the quiet green once one
   has. Written by report-view.js reviewMarkSync. Screen only: the band itself prints at the top of the first page, so
   the mark never prints (its print rule sits with the phone strip's). */
.rep-revmark{display:none}
.rep-revmark:not([hidden]){display:flex;align-items:center;gap:8px;width:100%;margin:8px 0 0;padding:6px 10px;
  border:1px solid #c4442c;border-radius:8px;background:var(--bad);color:#2a0e08;font:700 11.5px/1.3 var(--body);
  text-align:left;cursor:pointer}
.rep-revmark.ok{border-color:rgba(67,213,151,.4);background:var(--mint-soft);color:var(--mint);font-weight:600}
.rep-revmark .rep-revmark-i{flex:0 0 auto;width:14px;height:14px}
/* two lines at the phone strip's start break evenly ("Reviewed by / a person", never "Reviewed by a / person") */
.rep-revmark .rep-revmark-t{text-wrap:balance}
.rep-revmark:hover{filter:brightness(1.07)}
.rep-revmark:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* the band a mark leads back to takes the focus, and a keyboard reader sees where it went */
.rep-reviewband:focus{outline:none}
.rep-reviewband:focus-visible{outline:2px solid var(--gold);outline-offset:-5px}
/* on a phone the rail keeps the brand and the controls only; the mark rides the chapter strip instead */
@media (max-width:760px){.rail .rep-revmark{display:none !important}}
/* THE RAIL NEVER HIDES ITS OWN CONTROLS (the review of 28 Sep, HIGH-1). The mark adds its height to a sticky rail that had
   no room to spare: on a 1366 x 657 laptop Download PDF and the Friendly / Technical switch fell below the screen and came
   back only at the page's last pixel (on a 1280 x 577 screen they already did, before the mark). A rail taller than the
   screen now scrolls within itself, and the mark stays at its top while the rest passes under it, on a backing as solid
   as the rail's. The side padding gives the door's glow and the focus rings the room a scrolling box would clip. Wide
   screens only: on a phone the rail is not sticky, and the mark is not in it.
   AND WHAT THE RAIL CANNOT USE GOES ON TO THE PAGE: never overscroll-behavior:contain here. A wheel over the rail, or
   PageDown, Space or an arrow with the focus on a chapter link or the Friendly / Technical switch, held the page still on
   every wide screen, even where the rail had nothing to scroll (the second review of 28 Sep, M1).
   ITS HEIGHT IS THE SMALL VIEWPORT'S where the browser knows the unit (100svh: the screen with any toolbar that comes and
   goes still showing, as on a tablet wider than 760 px), and 100vh before it for one that does not (the second review of
   28 Sep, LOW-3). On a desktop browser the two are the same height. */
@media (min-width:761px){
  .railin{max-height:calc(100vh - 48px);max-height:calc(100svh - 48px);overflow-y:auto;margin:0 -8px;padding:0 8px 4px}
  .rail .rep-revmark:not([hidden]){position:sticky;top:0;z-index:2}
  .rail .rep-revmark.ok{background:linear-gradient(var(--mint-soft),var(--mint-soft)),var(--deep)}
}

/* The market upsell rides the closing-card treatment, but a card with an 85-word paragraph in it is a
   paragraph, not a line: the closing card centres its text and that is unreadable past two lines. The measure
   and the ranging come back for this one card; the heading and the button stay centred with the rest. */
#card-market-upsell p{max-width:54ch;margin:10px auto 0;text-align:left}


/* (release 32) the customer's "is this listing yours?" card never prints; placed before the map's print block, which stays last */
@media print{.idc-card{display:none !important}}
@media print{.mi-map .leaflet-control-zoom,.mi-mapchips,.mi-mapctl,.mi-win,.mi-filter,.mi-csv,.mi-noprint{display:none !important}.mi-map .leaflet-tile-pane{filter:saturate(.15)}.mi-mapbox,.mi-map .leaflet-container{background:#fff}.mk-sq{background:#fff;border-color:#333;color:#111}.mk-sq small{color:#555}.mk-sq.enc{border-color:#aaa;color:#444}.mk-ctx,.mi-cdot{background:#888;border-color:#555}.mi-dot.enc{box-shadow:inset 0 0 0 1.5px #aaa;color:#444}.mk-out{box-shadow:inset 0 0 0 1.5px #777;color:#333}.mk-tick:before,.mk-tick:after{background:#333}.mk-mark{filter:none}.mk-shop path{fill:#2f6b52;stroke:#111}.mk-shop circle{fill:#fff}.mk-area path{stroke:#2f6b52}.mk-watched circle{stroke:#b0402c}.mk-watched circle:last-child{fill:#b0402c}.mk-you path{fill:#8a6b1f;stroke:#333}.mi-mark,.mi-mark.ind,.mi-mark.sa,.mi-mark.loc{color:#111 !important;border-color:#777 !important}.mi-services .sv,.mi-services .sv .num{color:#333 !important}
/* T-1: a printed report shows every chapter, whatever the reader left open on screen */
.railnav .railsub{display:block!important}.railnav .railgrp-chev{display:none}
/* R-3 (2026-09-20): a control is not a measurement. A printed report carries what was measured, and the
   buttons that choose a rival mean nothing on paper. A test holds this block last of its kind in the file
   (it is the map's), so a new print rule joins it rather than following it -- and the test finds the block
   by searching backwards for its opening line, which is why these words do not spell that line out. */
.mi-follow,.mi-named-count{display:none}
.rep-next-card{display:none}
/* the gold ring a website picture's part wears for a moment (sampleDeepLink, the rules at the end of this file) never
   prints: it marks where a reader landed, not anything measured */
.rep-deeplink-hit{outline:none;animation:none}
/* the market map on paper (the owner, 28 Sep 2026): the zips at one point keep their stack in the paper's ink, the shaded
   view's key prints in ink with its swatches as drawn, and a shape's hover never prints */
.mk-sq{--edge:#333}.mk-sq.enc{--edge:#aaa}
.mk-sq.grp{box-shadow:3px -3px 0 -1.5px #fff,3px -3px 0 0 var(--edge),6px -6px 0 -1.5px #fff,6px -6px 0 0 var(--edge)}
/* and the key's squares, your zip's ring and the blue point go to paper with the marks they stand for, as do the drawing
   without the map library's own (the review of c493f73c, LOW-4) */
.mi-lgdot.sq,.mi-lgdot.ring{background:#fff;border-color:#333}.mi-lgdot.sq.enc{border-color:#aaa}
.mi-lgdot.sq.grp{box-shadow:2px -2px 0 -1px #fff,2px -2px 0 0 #333}
.mi-lgdot.tick:before,.mi-lgdot.tick:after,.mi-pin:before,.mi-pin:after{background:#333}
.mi-dot.grp{box-shadow:inset 0 0 0 1.5px #333,3px -3px 0 -1.5px #fff,3px -3px 0 0 #333,6px -6px 0 -1.5px #fff,6px -6px 0 0 #333}
.mi-odot{box-shadow:inset 0 0 0 1.5px #777;color:#333}
.mi-map .leaflet-tooltip{display:none !important}
/* your zip's thick edge in the shaded view is drawn in the report's --purp by report-view.js (the map library writes it as
   the shape's stroke); on paper it takes the print sheet's darker --purp, as the ring does (the owner's ruling of 30 Sep 2026) */
.mi-map path.mi-zipedge.you{stroke:var(--purp)}
.mi-shadekey{background:#fff;border-color:#bbb;color:#333}.mi-shadekey p,.mi-shadekey .kk{color:#333}
.mi-shadekey .sw{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* The competitor the customer named (2026-09-07, D-4): its own mark, unlike every other thing on this map. A
   diamond with a gold ring, so it reads apart from the zip squares, the outside dots, the search points and the
   PO-box dots, and carries the business's name beside it rather than a count. */
/* The two marks stand for a BUSINESS, not a count, which is why they are figures and everything else on this
   map is a badge with a number in it. The competitor's full trading name used to be printed beside its mark,
   across the tiles, at whatever length the name happened to be (the owner, 2026-09-08); the mark carries it
   now and the name is in the hover title and the window a click opens. A mark drawn hollow and dashed sits at
   the CENTRE OF A ZIP rather than at a door, and the legend says so in words as well. */
.mk-mark{display:block;width:22px;height:22px;cursor:pointer;filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))}
.leaflet-marker-icon.mi-mk>.mk-mark{width:22px;height:22px}
/* The address view's teardrops are 16x23 and are anchored ON THEIR TIP. Forced into the 22x22 box the
   ring and star use, the drawing letterboxes and the tip lands about three pixels right of where Leaflet
   anchors it, so every pin sat beside its own address rather than on it. Their own size, and no shadow
   that would blur a point meant to be exact. */
.leaflet-marker-icon.mi-mk>.mk-shop,.leaflet-marker-icon.mi-mk>.mk-area{width:16px;height:23px}
.mk-legend .mk-shop,.mk-legend .mk-area{width:13px;height:19px}
.mk-legend{width:18px;height:18px;background:none;box-shadow:none;border:0;display:inline-flex;align-items:center;justify-content:center;flex:none}
.mk-legend .mk-mark{width:18px;height:18px;filter:none}
/* THE ADDRESS VIEW'S CLUSTERS (the audit of 28 Sep, A-P2-12; report-view.js pinClusters): pins close together at the zoom on
   screen are one round badge in the pins' green with how many it holds; a click zooms in and they part. Bigger for more. */
.leaflet-marker-icon.mi-mk>.mk-cl{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;border-radius:50%;background:rgba(67,213,151,.9);border:2px solid #0c110f;box-shadow:0 0 0 3px rgba(67,213,151,.28),0 1px 3px rgba(0,0,0,.5);color:#0c110f;font:700 11px/1 var(--mono);cursor:pointer}
.leaflet-marker-icon.mi-mk>.mk-cl.s2{font-size:12px}
.leaflet-marker-icon.mi-mk>.mk-cl.s3,.leaflet-marker-icon.mi-mk>.mk-cl.s4{font-size:13px;box-shadow:0 0 0 4px rgba(67,213,151,.3),0 1px 3px rgba(0,0,0,.5)}
.leaflet-marker-icon.mi-mk:focus-visible>.mk-cl{outline:2px solid #e6b654;outline-offset:2px}
.mk-legend .mk-clkey{width:16px;height:16px;filter:none}
/* the mark beside a named competitor wherever the report writes its name */
/* red, matching the map's mark: one idea, one colour. Gold is the reader's own accent everywhere else in this
   report, and spending it on the business they are up against read as though the competitor were theirs. */
/* (audit A of 28 Sep, P3-7: the red read as an alarm beside a business the reader chose to follow; the chip is the
   report's quiet purple now, neither the reader's gold nor the bad news's red) */
.mi-named-mark{display:inline-block;margin-left:5px;font:600 9.5px/1 var(--mono,monospace);letter-spacing:.06em;text-transform:uppercase;color:#0c110f;background:var(--purp);border-radius:3px;padding:2px 5px;vertical-align:middle}
/* the rivals card: each rival's name reads as a name, in the page's own type, and where it trades under it (P3-7) */
.mi-named-name{font:600 1.08rem/1.3 var(--body);color:var(--ink);margin:20px 0 2px}
.mi-named-name:first-child{margin-top:6px}
.mi-named-where{font-size:.86rem;color:var(--ink2);margin:0 0 8px}

/* T-1 (the owner, 2026-09-07): the rail's group labels. Five groups over the existing chapter numbers, so a
   reader sees the shape of the report rather than eighteen equal items. A group with no visible chapters is
   never drawn, which is also what makes a plan carrying fewer chapters read as a shorter rail. */


/* The rail's five groups, closed by default (T-1, the owner 2026-09-07). Eighteen chapters at once is a list to
   scroll past; five named groups is a table of contents. Each carries one stroked line icon in the rail's own
   colour, and the group holding the chapter being read is marked even while it is closed, so a reader who never
   opens anything still knows where they are. What a reader opens is remembered in their own browser. */
.railnav .railgrp{list-style:none;margin:2px 0}
.railnav .railgrp-btn{display:flex;align-items:center;gap:8px;width:100%;padding:7px 8px;border:0;border-radius:7px;background:transparent;cursor:pointer;text-align:left;color:var(--ink2,#a7b1ab);font:600 10px/1.3 var(--mono,monospace);letter-spacing:.1em;text-transform:uppercase;transition:background .18s,color .18s}
.railnav .railgrp-btn:hover{background:rgba(255,255,255,.04);color:var(--ink,#eef2ef)}
.railnav .railgrp-btn:focus-visible{outline:2px solid var(--gold,#e6b654);outline-offset:1px}
.railnav .railgrp-btn.here{color:var(--gold,#e6b654)}
.railnav .railgrp-ico{flex:0 0 15px;opacity:.8}
.railnav .railgrp-btn.here .railgrp-ico{opacity:1}
/* the owner, 2026-09-22 (market parity doc, section 14): a GROUP mark is never gold, so it can never be mistaken for a
   chapter's. Chapter marks are gold (railico, rep-actico) and turn mint when read; a group's label still lights gold
   when the chapter being read is inside it, and its mark goes white rather than following it */
.railnav .railgrp-btn.here .railgrp-ico{color:var(--ink,#eef2ef)}
.railnav .railgrp-name{flex:1 1 auto;min-width:0}
.railnav .railgrp-chev{flex:0 0 8px;height:8px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:rotate(-45deg);opacity:.55;transition:transform .2s ease,opacity .18s}
.railnav .railgrp-btn[aria-expanded="true"] .railgrp-chev{transform:rotate(45deg);opacity:.9}
.railnav .railsub{list-style:none;margin:1px 0 4px;padding:0 0 0 23px}
.railnav .railsub li{margin:0}

/* ── The delta layer (the delta programme, step 8; 2026-09-14): badges, the quiet line, the changes chapter, the
   evidence panel, the board, and the shared full-screen box. One pulse on arrival, one count-up, then still; both off
   under reduced motion. ── */
.mi-dbadge{display:inline-flex;align-items:center;gap:6px;vertical-align:middle;margin-left:12px;font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border:1px solid var(--gold-line);border-radius:999px;background:var(--gold-soft);color:var(--gold);cursor:pointer;white-space:normal;max-width:calc(100% - 12px);text-align:left;line-height:1.4}
.mi-dbadge svg{width:12px;height:12px;flex:0 0 auto}
.mi-dbadge.bad{color:var(--bad);border-color:rgba(255,99,99,.45);background:rgba(255,99,99,.08)}
.mi-dbadge.up{color:var(--mint);border-color:rgba(67,213,151,.45);background:var(--mint-soft)}
.mi-dbadge.pulse{animation:miDeltaPulse .9s ease-out 1}
@keyframes miDeltaPulse{0%{transform:scale(.92);box-shadow:0 0 0 0 rgba(212,175,55,.45)}60%{transform:scale(1.05);box-shadow:0 0 0 9px rgba(212,175,55,0)}100%{transform:scale(1)}}
.mi-unchanged{display:inline-block;vertical-align:middle;margin-left:12px;font:500 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.mi-changes .lead{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:6px 0 2px}
.mi-changes .lead .n{font:700 46px/1 var(--display,var(--body));color:var(--gold);letter-spacing:-.02em}
.mi-changes .lead .w{font-size:1.05rem;color:var(--ink2)}
.mi-changes .sub{font-size:.8rem;color:var(--ink3);margin:0 0 10px}
.mi-changes .mi-chipsrow{display:flex;justify-content:flex-end;margin:0 0 6px}
.mi-dgroup{display:grid;grid-template-columns:30px 1fr;gap:6px 12px;padding:10px 0;border-top:1px solid var(--line)}
.mi-dgroup .g{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;color:var(--gold);background:var(--surface)}
.mi-dgroup .g svg{width:16px;height:16px}
.mi-dgroup .t{font-weight:700;margin:4px 0 6px}
.mi-dnames{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.mi-dname{display:inline-flex;align-items:center;gap:5px;font:500 .78rem var(--body);padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);cursor:pointer;text-align:left;max-width:100%}
.mi-dname svg{flex:0 0 auto;color:var(--gold)}
.mi-dname:hover{border-color:var(--gold)}
.mi-dname.unstable{border-style:dashed;color:var(--ink3)}
.mi-dmore{font:600 .72rem var(--mono);letter-spacing:.06em;color:var(--gold);background:none;border:1px dashed var(--gold-line);border-radius:999px;cursor:pointer;padding:4px 10px}
.mi-dsent{display:flex;gap:10px;align-items:baseline;padding:6px 0;border-top:1px solid var(--line)}
.mi-dsent svg{flex:0 0 auto;color:var(--gold);position:relative;top:1px}
.mi-dsent > span{flex:1 1 auto}
.mi-dsent a{font:600 .66rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--gold);text-decoration:none;white-space:nowrap}
.mi-dnc{font-size:.76rem;color:var(--ink3);margin-top:10px}
.mi-dpanel .mi-dq{padding:10px 0;border-top:1px solid var(--line)}
.mi-dpanel .mi-dq:first-child{border-top:0;padding-top:0}
.mi-dq-n{font:600 .66rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin:0 0 4px}
.mi-dq p{margin:0}
.mi-dq-ft{font-weight:700;font-size:1.05rem}
.mi-dq-sure{margin:0;padding-left:18px}
.mi-dq-sure li{margin:3px 0}
.mi-dq-sure li.warn{color:var(--bad)}
.mi-fsbox.fs{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;margin:0;z-index:2147482000;overflow:auto;background:var(--bg);padding:28px 36px;box-sizing:border-box;border-radius:0}
body.mi-fs{overflow:hidden}
@media (max-width:900px){body.mi-fs{overflow:auto}}
.rep-card.mi-fsbox.fs .mi-dboard{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;align-content:start;padding-top:12px}
.rep-card.mi-fsbox.fs{display:block}
.mi-dboard{display:none}
.mi-dtile > span{display:block}
.mi-dtile{border:1px solid var(--line);border-radius:14px;padding:16px;background:var(--surface);cursor:pointer;text-align:left;color:var(--ink)}
.mi-dtile:hover{border-color:var(--gold)}
.mi-dtile .n{display:flex;align-items:center;gap:8px;font:700 34px/1 var(--display,var(--body));color:var(--gold)}
.mi-dtile .n svg{width:18px;height:18px}
.mi-dtile.bad .n{color:var(--bad)}
.mi-dtile.up .n{color:var(--mint)}
.mi-dtile .w{font-weight:700;margin:8px 0 4px}
.mi-dtile .names{font-size:.76rem;color:var(--ink3);line-height:1.4}
@media (prefers-reduced-motion:reduce){.mi-dbadge.pulse{animation:none}}
@media (max-width:900px){.mi-changes .mi-chipsrow{display:none}.mi-fsbox.fs{position:static;width:auto;height:auto;padding:0;overflow:visible}}
/* the polish pass (2026-09-18, the QA ledger's L-12): a chapter's change badge is one line of text that would not wrap,
   and at 375 px it ran seven pixels past the page; it wraps on phones now */
@media (max-width:760px){.mi-dbadge,.mi-unchanged{margin-left:0;display:inline-flex;margin-top:6px;white-space:normal;max-width:100%;text-align:left}.mi-changes .lead .n{font-size:38px}}

/* ── R-3: follow this rival (the owner, 2026-09-20; plan of record eco docs/market-intel-checkout-2026-09-20.html
   section 12). The control lives in the business drawer, where a reader has just finished reading why one
   business matters, and on the named chapter as one counter line. Gold, because it is the only thing on a
   finished report a customer can DO, and everything else on the page is a measurement. */
.mi-follow{margin:14px 0 4px;padding:12px 14px;border:1px solid var(--gold-line);border-radius:10px;background:var(--gold-soft)}
.mi-follow.is-busy{opacity:.55;pointer-events:none}
.mi-follow-btn{appearance:none;cursor:pointer;font:600 13.5px/1.2 var(--body);color:#3d2c05;background:var(--gold);
  border:1px solid var(--gold);border-radius:8px;padding:9px 14px;max-width:100%;text-align:left;overflow-wrap:break-word}
.mi-follow-btn:hover{filter:brightness(1.06)}
.mi-follow-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
/* a choice already made reads as a state with an undo, not as a second invitation to make it */
.mi-follow-btn.is-on{background:transparent;color:var(--gold);border-color:var(--gold-line)}
.mi-follow-btn.is-on::before{content:"\2713\00a0"}
.mi-follow-note{margin:9px 0 0;font-size:.82rem;line-height:1.5;color:var(--ink2)}
.mi-follow-note.mi-follow-yes{color:var(--mint);margin:0}
.mi-follow-note.mi-follow-no{color:var(--bad);margin:0}
.mi-follow-said{color:var(--gold)}
.mi-named-count{margin:14px 0 0;padding:11px 13px;border:1px solid var(--gold-line);border-radius:10px;
  background:var(--gold-soft);font-size:.86rem;line-height:1.55;color:var(--ink2)}

/* ── D2: one ending, three asks across it (the owner, 2026-09-21) ─────────────────────────────────────────
   The report used to close with three full-width cards, each dressed as a measurement chapter. A reader who
   had just finished forty thousand pixels met three more headings and had to read all of them to find out
   none held a measurement. One card, three columns, equal weight, and it collapses to a stack on a phone. */
/* ONE ROW (the owner, 1 Oct 2026: "The 'What now' cards at the bottom of the report should all [be] in the same row instead
   of being split into two rows"). It was a grid of columns 220 to 320 px wide, as many as fit: three need 984 px at their
   width and the report's column is 948 px on a 1440 px screen, so the third went under the first two. Now the cards share
   one row in equal parts, each up to 320 px, shrinking rather than wrapping; one or two stand in the middle (a subscriber's
   page shows one); they stretch to the tallest, so the buttons on their floors line up; and on a phone they stack. */
.rep-next{display:flex;flex-wrap:nowrap;justify-content:center;align-items:stretch;gap:12px;margin-top:10px}
.rep-next .nx{flex:1 1 0;min-width:0;max-width:320px;background:#101513;border:1px solid var(--line2);border-radius:10px;padding:15px;display:flex;flex-direction:column;align-items:center;text-align:center}
/* the icon each column earned (the owner, 2026-09-21), drawn in the same hand as the chapter icons:
   a 24-unit box, 1.7 stroke, round caps, so they belong to this document and not to an icon library */
.rep-next .nx .nx-ico{width:30px;height:30px;color:var(--gold);margin-bottom:8px;opacity:.9}
.rep-next .nx u{display:block;font:600 9.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold);text-decoration:none;margin-bottom:6px}
.rep-next .nx p{font-size:13px;line-height:1.55;color:var(--ink2);margin:0 0 11px;width:100%}
/* the action sits on the floor of its column, so three columns of unequal prose still line their buttons up */
.rep-next .nx p:last-child{margin:auto 0 0}
/* Every column's action is the same control at the same width, so the three line up on one baseline and
   no column's ask looks bigger than another's by accident. The gold stays on the $99 alone: it is the
   only one of the three that is a purchase, and three gold buttons in a row is three shouts. */
.rep-next .nx .btn{display:block;width:100%;margin-top:0;padding:10px 14px;text-align:center;border-radius:8px}
.rep-next .nx .btn-secondary{background:transparent;color:var(--ink);border:1px solid var(--line)}
.rep-next .nx .btn-secondary:hover{background:var(--surface2);filter:none}
#card-market-upsell .btn{background:var(--gold);color:#3d2c05;border:1px solid var(--gold)}
/* one or two asks stand in the middle, under their heading (the quality review of 27 Sep: a subscriber's page shows
   one column, and it sat alone at the left of a three-column grid; .rep-next above centers them); three fill the row.
   Where the column is narrow beside the rail (a tablet), the three keep the row with a little less room inside each. */
@media(max-width:1180px){.rep-next{gap:10px}.rep-next .nx{padding:13px 11px}.rep-next .nx p{font-size:12.5px}.rep-next .nx .btn{padding:9px 8px;font-size:.84rem}}
@media(max-width:760px){.rep-next{flex-direction:column;align-items:stretch}.rep-next .nx{flex:0 0 auto;max-width:none;padding:15px}.rep-next .nx p{font-size:13px}.rep-next .nx p:last-child{margin:0}.rep-next .nx .btn{padding:10px 14px;font-size:.9rem}}

/* ── The part a website picture opens on (report-view.js sampleDeepLink; the samples only; the owner's ask of 26 Sep) ──
   The page has no fixed header, so the part lands 16 px from the top (the chapter heads' own margin), and one gold ring
   (a full outline, never a stripe) says "this is the part the picture showed", fading once; still, for a reader who
   asks for less motion; never on paper (its print rule joins the map's print block, which a test holds last of its
   kind in this file). Both classes are set by the script, on one element, on a sample only, so no rule here reaches
   a customer's own page. */
.rep-deeplink-at{scroll-margin-top:16px}
.rep-deeplink-hit{outline:2px solid var(--gold);outline-offset:10px;animation:repDeepHit 2.6s ease-out forwards}
@keyframes repDeepHit{0%,55%{outline-color:var(--gold)}100%{outline-color:rgba(230,182,84,0)}}
@media (prefers-reduced-motion:reduce){.rep-deeplink-hit{animation:none}}

/* ── The review chapter's column heads wrap, never cut (the review of 26 Sep, LOW-4) ──────────────────────────────────
   The shared table rule (report-parts.css .rp-tbl th) keeps a head on one line and cuts it with an ellipsis. In "Who is
   pulling away" that cut "a month, 6 mo" and "a month, 12 mo" to the same "A MONTH…" at every width, so a reader could not
   tell six months from twelve. In this chapter a head takes a second line instead of losing its words. */
#card-intel-reviews .rp-tbl th{white-space:normal;text-overflow:clip;vertical-align:bottom}

/* THE PHONE'S FIRST SCREEN (the quality review of 27 Sep): the rail repeated the business, the plan and the market the
   masthead prints right under it, and its gold Download PDF was the loudest thing on the screen. On a phone the rail keeps
   the brand and the controls, and the download is an outline button like the switch beside it. Last in the sheet, so it
   follows the phone rules above it. */
@media (max-width:760px){
  .railkick,.railbiz,.railmeta,.railverdict{display:none !important}
  .rail{padding:14px 18px}
  .railbrand{margin-bottom:10px}
  .raildl{margin-top:0;padding:8px 0;background:transparent;color:var(--gold);border:1px solid var(--gold-line);font-size:12px}
}
/* the zip table's working websites, "26 of 40", on one line at every width (the $99 review of 2 Oct 2026, P3) */
td.zw{white-space:nowrap}
/* an entry of another trade, kept in its list as Google gave it, dimmed and labeled (the engine review of 2 Oct 2026) */
.rep-table tr.rep-setaside td{opacity:.55}

/* (release 32) "We found a listing that may be yours" (identity-confirm-card.js): a full gold border and a soft wash, never an
   edge stripe; the button the CTA card's gold. Off the printed page: it is a question, not a finding. */
.idc-card{border:1px solid var(--gold-line);background:var(--gold-soft);border-radius:10px;padding:16px 18px 14px;margin-top:18px}
.idc-card .idc-p{margin:0 0 10px;color:var(--ink2)}
.idc-card .idc-list{margin:0 0 10px;padding-left:20px;color:var(--ink)}
.idc-card .idc-list li{margin:0 0 6px;overflow-wrap:anywhere}
.idc-card a{color:var(--gold)}
.idc-card .idc-btn{display:inline-block;font:600 .9rem var(--body);color:#3d2c05;background:var(--gold);border:0;border-radius:8px;padding:11px 20px;min-height:44px;cursor:pointer}
.idc-card .idc-btn:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.idc-card .idc-btn[disabled]{opacity:.6;cursor:default}
.idc-card .idc-flash{margin:10px 0 0;border:1px solid var(--mint);background:var(--mint-soft);border-radius:8px;padding:8px 12px;color:var(--ink)}
@media (max-width:520px){.idc-card{padding:14px 14px 12px}.idc-card .idc-btn{width:100%}}