:root{--ob:#07090e;--deep:#0c1118;--panel:#111925;--surface:#162030;--bd:rgba(255,255,255,.07);--bdg:rgba(201,168,76,.25);--gold:#c9a84c;--gd:rgba(201,168,76,.12);--cyan:#00c8f0;--em:#00d68a;--white:#eef1f5;--tx:rgba(238,241,245,.88);--mt:rgba(238,241,245,.75);--dm:rgba(238,241,245,.55);--FD:"Bebas Neue",sans-serif;--FS:"Playfair Display",serif;--FM:"JetBrains Mono",monospace;--FB:"Inter",sans-serif;
    --canvas:var(--ob);--panel-2:var(--surface);--ink:var(--white);--ink-2:var(--tx);--muted:var(--dm);--rule:rgba(255,255,255,.12);--rule-2:var(--bd);
    --price:var(--gold);--met:var(--cyan);--under:var(--em);--under-soft:rgba(0,214,138,.16);--over:#e0564f;--over-soft:rgba(224,86,79,.15);--fair:rgba(238,241,245,.35);--focus:var(--gold);
    --serif:var(--FS);--sans:var(--FB);--radius:3px;--maxw:1280px;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ob);color:var(--white);font-family:var(--FB);font-size:14.5px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;font-weight:300}
a{color:var(--gold)}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
b,strong{font-weight:500}
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:0 56px;height:68px;background:rgba(7,9,14,.93);backdrop-filter:blur(24px);border-bottom:1px solid var(--bd)}
.nlogo{display:flex;align-items:center;gap:12px;text-decoration:none}
.lt{font-family:var(--FD);font-size:19px;letter-spacing:3px;color:var(--white)}
.lt span{color:var(--gold)}
.nl{display:flex;gap:4px;list-style:none;align-items:center;padding:0;margin:0}
.nl a{color:rgba(238,241,245,.78);text-decoration:none;font-family:var(--FM);font-size:12px;letter-spacing:1.5px;text-transform:uppercase;padding:8px 14px;border-radius:3px;transition:all .2s}
.nl a:hover,.nl a.active{color:var(--gold)}
.nc{border:1px solid rgba(201,168,76,.4)!important;color:var(--gold)!important}
.nc:hover{background:var(--gd)!important}
.ham{display:none;background:none;border:none;padding:8px;cursor:pointer;z-index:1001;flex-shrink:0}
.ham span{display:block;width:24px;height:2px;background:var(--gold);border-radius:2px;transition:all .3s}
.ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ham.open span:nth-child(2){opacity:0}
.ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nl-mobile{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(7,9,14,.97);backdrop-filter:blur(12px);flex-direction:column;align-items:center;justify-content:center;gap:8px;z-index:1000}
.nl-mobile.open{display:flex}
.nl-mobile a{color:rgba(238,241,245,.85);text-decoration:none;font-family:var(--FM);font-size:14px;letter-spacing:2px;text-transform:uppercase;padding:14px 32px;border-radius:3px;width:80%;text-align:center;border:1px solid rgba(201,168,76,.15);transition:all .2s}
.nl-mobile a:hover{color:var(--gold);border-color:rgba(201,168,76,.5);background:rgba(201,168,76,.08)}
.nl-mobile .nc{margin-top:12px;background:linear-gradient(135deg,#c9a84c,#7a5c1a);color:#07090e!important;border:none!important;font-weight:600}
.wrap{max-width:var(--maxw);margin:0 auto;padding:110px 20px 64px}
.mast{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:56px 0 22px;border-bottom:1px solid var(--bd)}
/* Pages whose header is eyebrow, title, strap as siblings: the eyebrow and the
   title each take a full row. Without this the eyebrow became a narrow column
   of its own and squeezed the title onto three to seven lines on 24 pages. */
.mast:has(>.eyebrow){flex-wrap:wrap}
.mast>.eyebrow{flex:0 0 100%;font-family:var(--FM);font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);margin:0 0 -10px}
.mast>h1{flex:0 0 100%;margin:0}
.mast>.strap{flex:1 1 420px;margin:0;color:var(--mt);max-width:72ch;font-size:15px;line-height:1.7}
.brand{font-family:var(--FM);font-size:9.5px;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin:0 0 14px;display:flex;align-items:center;gap:10px}
.brand::after{content:"";flex:1;max-width:48px;height:1px;background:var(--gold)}
h1{font-family:var(--FD);font-weight:400;font-size:clamp(38px,5vw,64px);line-height:.95;letter-spacing:-.3px;margin:0 0 12px;color:var(--white)}
h1 em{font-family:var(--FS);font-style:italic;color:var(--gold)}
.lede{margin:0;color:var(--mt);max-width:62ch;font-size:15px;font-weight:300;line-height:1.7}
.status{text-align:right;color:var(--dm);font-size:12px;line-height:1.6;min-width:230px;font-family:var(--FM)}
.status b{color:var(--white);font-weight:500}
.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--em);margin-right:6px;vertical-align:1px;animation:pd 2s infinite}
.live-dot.stale{background:var(--dm);animation:none}
@keyframes pd{0%,100%{box-shadow:0 0 0 0 rgba(0,214,138,.5)}50%{box-shadow:0 0 0 6px rgba(0,214,138,0)}}
.refresh,.btn{margin-top:6px;border:1px solid rgba(201,168,76,.4);background:transparent;color:var(--gold);padding:7px 14px;border-radius:3px;cursor:pointer;font-family:var(--FM);font-size:10.5px;letter-spacing:2px;text-transform:uppercase;transition:all .2s}
.refresh:hover,.btn:hover{background:var(--gd);border-color:var(--gold)}
.reading{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);background:var(--panel);border:1px solid var(--bd);border-top:none;margin-bottom:18px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);border-right:1px solid var(--bd)}
.kpi{padding:18px 20px 16px;border-bottom:1px solid var(--bd);border-right:1px solid var(--bd)}
.kpi:nth-child(3n){border-right:none}
.kpi:nth-last-child(-n+3){border-bottom:none}
.kpi .lab{font-family:var(--FM);font-size:9.5px;letter-spacing:2px;text-transform:uppercase;color:var(--dm);margin-bottom:8px}
.kpi .val{font-family:var(--FD);font-size:34px;line-height:1;letter-spacing:.5px;color:var(--white)}
.kpi .val.small{font-size:28px}
.kpi .sub{font-size:12px;color:var(--dm);margin-top:7px}
.kpi .val.under{color:var(--em)}
.kpi .val.over{color:var(--over)}
.kpi .val.price{color:var(--gold)}
.kpi .val.met{color:var(--cyan)}
.ribbon{padding:20px 22px 18px;display:flex;flex-direction:column;justify-content:center}
.ribbon h2{font-family:var(--FD);font-weight:400;font-size:22px;letter-spacing:1px;margin:0 0 6px;color:var(--white)}
.ribbon p{margin:0 0 16px;color:var(--mt);font-size:13px;max-width:54ch;font-weight:300}
.scale{position:relative;height:74px;margin:6px 0 0}
.scale .track{position:absolute;left:0;right:0;top:30px;height:14px;border-radius:2px;overflow:hidden;display:flex}
.scale .seg{height:100%}
.scale .tick{position:absolute;top:48px;font-family:var(--FM);font-size:10px;color:var(--dm);transform:translateX(-50%);white-space:nowrap}
.scale .tick::before{content:"";position:absolute;left:50%;top:-6px;width:1px;height:5px;background:var(--rule)}
.scale .ext{position:absolute;top:22px;width:1px;height:30px;background:var(--mt);opacity:.55}
.scale .ext span{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-family:var(--FM);font-size:9.5px;color:var(--mt);white-space:nowrap}
.scale .now{position:absolute;top:24px;width:3px;height:26px;background:var(--gold);transform:translateX(-50%);border-radius:1px}
.scale .now span{position:absolute;top:-22px;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--ob);font-family:var(--FM);font-size:10.5px;padding:2px 7px;border-radius:2px;white-space:nowrap;font-weight:600}
.regime-line{margin-top:12px;font-size:13px;color:var(--mt)}
.regime-line b{font-weight:500;color:var(--white)}
.toolbar{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;padding:14px 0 16px;border-bottom:1px solid var(--bd);margin-bottom:16px}
.group{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--mt)}
.group .gl{font-family:var(--FM);font-size:9.5px;letter-spacing:2px;text-transform:uppercase;color:var(--dm);margin-right:2px}
.seg-btns{display:inline-flex;border:1px solid var(--rule);border-radius:3px;overflow:hidden;background:var(--panel)}
.seg-btns button{border:none;background:transparent;padding:6px 12px;cursor:pointer;font-family:var(--FM);font-size:11px;letter-spacing:1px;color:var(--mt);border-right:1px solid var(--bd)}
.seg-btns button:last-child{border-right:none}
.seg-btns button[aria-pressed="true"]{background:var(--gold);color:var(--ob)}
select{font-family:var(--FB);font-size:13px;padding:6px 10px;border:1px solid var(--rule);border-radius:3px;background:var(--panel);color:var(--white)}
select option{background:var(--panel);color:var(--white)}
label.chk{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
input[type=checkbox]{accent-color:var(--gold)}
.toolbar .spacer{flex:1}
.panel{background:var(--panel);border:1px solid var(--bd);margin-bottom:18px}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:16px 18px 0}
.panel-h h2{font-family:var(--FD);font-weight:400;font-size:22px;letter-spacing:1px;margin:0;color:var(--white)}
.panel-h .note{font-size:12px;color:var(--dm);text-align:right;max-width:60%}
.chart{width:100%;height:460px}
.chart.short{height:380px}
.chart.mid{height:400px}
.grid3{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px;margin-bottom:18px}
.grid3 .panel{margin-bottom:0;display:flex;flex-direction:column}
.grid2{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:18px;margin-bottom:18px}
.grid2 .panel{margin-bottom:0}
.panel-b{padding:12px 18px 16px;flex:1}
table{width:100%;border-collapse:collapse;font-size:12.5px}
th,td{text-align:right;padding:7px 6px;border-bottom:1px solid var(--bd);vertical-align:top}
th{font-family:var(--FM);font-weight:400;color:var(--dm);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase}
th:first-child,td:first-child{text-align:left}
tr:last-child td{border-bottom:none}
td.under{color:var(--em)}
td.over{color:var(--over)}
tr.sel td{background:var(--gd);color:var(--white)}
.ok{color:var(--em)}
.bad{color:var(--over)}
.stat-list{margin:0;padding:0;list-style:none}
.stat-list li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--bd);font-size:13px}
.stat-list li:last-child{border-bottom:none}
.stat-list li span:first-child{color:var(--mt)}
.stat-list li b{font-weight:500;text-align:right;color:var(--white)}
.bars{margin-top:10px}
.bar-row{display:grid;grid-template-columns:110px 1fr 52px;align-items:center;gap:10px;font-size:12.5px;padding:4px 0}
.bar-row .b{height:9px;background:var(--surface);border-radius:2px;overflow:hidden}
.bar-row .b i{display:block;height:100%}
.bar-row .n{text-align:right;color:var(--mt)}
.notes{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;padding:26px 0 0;border-top:1px solid var(--bd);color:var(--mt);font-size:14px}
.notes h3{font-family:var(--FD);font-weight:400;font-size:21px;letter-spacing:1px;margin:0 0 8px;color:var(--white)}
.notes p{margin:0 0 12px;max-width:70ch;line-height:1.7}
.notes code{font-family:var(--FM);font-size:12px;background:var(--surface);padding:1px 6px;border-radius:3px;color:var(--gold)}
.notes .fine{font-size:12.5px;color:var(--dm)}
.state{padding:60px 20px;text-align:center;color:var(--mt)}
.state h2{font-family:var(--FD);font-weight:400;margin:0 0 8px;font-size:26px;letter-spacing:1px;color:var(--white)}
.state p{margin:0 auto;max-width:60ch}
.state .btn{margin-top:14px}
.hidden{display:none!important}
footer{background:var(--deep);border-top:1px solid var(--bd);padding:64px 80px 36px}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.fb p{font-size:13.5px;color:var(--mt);line-height:1.8;font-weight:300;margin-top:12px;max-width:250px}
.fc h4{font-family:var(--FM);font-size:9.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);margin-bottom:16px;font-weight:400}
.fc a{display:block;color:var(--mt);text-decoration:none;font-size:13.5px;margin-bottom:9px;transition:color .2s;font-weight:300}
.fc a:hover{color:var(--white)}
.fbot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding-top:28px;border-top:1px solid var(--bd)}
.fbot p{font-family:var(--FM);font-size:9.5px;color:var(--dm);letter-spacing:.8px}
.fdis{font-size:10.5px;color:var(--dm);line-height:1.6;font-style:italic;margin-bottom:20px;padding:14px 18px;border-left:2px solid rgba(201,168,76,.2)}
@media(max-width:1024px){.nl{display:none}.ham{display:flex;flex-direction:column;gap:5px}nav{padding:0 24px}footer{padding:52px 28px}.fg{grid-template-columns:1fr 1fr}.grid3,.grid2,.reading,.notes{grid-template-columns:1fr}.kpis{border-right:none;border-bottom:1px solid var(--bd)}}
@media(max-width:768px){nav{padding:0 16px}footer{padding:44px 16px}.fg{grid-template-columns:1fr!important;gap:28px!important}.fbot{flex-direction:column!important;text-align:center;gap:8px}
    .mast{flex-direction:column;align-items:flex-start;padding-top:40px}.mast>*,.mast>.eyebrow,.mast>h1,.mast>.strap{flex:none}.mast>.eyebrow{margin:0 0 -8px}.status{text-align:left}.kpis{grid-template-columns:repeat(2,1fr)}.kpi:nth-child(3n){border-right:1px solid var(--bd)}.kpi:nth-child(2n){border-right:none}.kpi:nth-last-child(-n+3){border-bottom:1px solid var(--bd)}.kpi:nth-last-child(-n+2){border-bottom:none}.chart{height:340px}.wrap{padding:68px 12px 40px}.panel-h{flex-direction:column;gap:4px}.panel-h .note{text-align:left;max-width:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.subnav{position:fixed;top:68px;left:0;right:0;z-index:190;display:flex;align-items:center;gap:4px;padding:0 56px;height:42px;background:rgba(12,17,24,.96);backdrop-filter:blur(16px);border-bottom:1px solid var(--bd);overflow-x:auto;white-space:nowrap}
.subnav .sl{font-family:var(--FM);font-size:9.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);margin-right:14px}
.subnav a{color:rgba(238,241,245,.7);text-decoration:none;font-family:var(--FM);font-size:11px;letter-spacing:1.2px;text-transform:uppercase;padding:6px 12px;border-radius:3px;transition:all .2s}
.subnav a:hover{color:var(--gold)}
.subnav a.active{color:var(--ob);background:var(--gold)}
@media(max-width:1024px){.subnav{padding:0 24px}}
@media(max-width:768px){.subnav{padding:0 12px;height:40px}.subnav .sl{display:none}.wrap{padding-top:108px!important}}
/* Research sub-navigation: a left rail on wide screens, where eleven items no longer fit a
     single row, and the original horizontal strip everywhere else. Nothing is hidden either way.
     The site header is 68px tall and fixed, so the rail starts there; .wrap's 110px top padding
     exists to clear the horizontal strip and is reduced to 68px once the strip is gone. */
  @media (min-width:1200px){
    .subnav{top:68px;right:auto;width:248px;height:calc(100vh - 68px);
      display:flex;flex-direction:column;align-items:stretch;gap:1px;
      overflow-x:hidden;overflow-y:auto;white-space:normal;
      padding:16px 0 28px;border-bottom:none;border-right:1px solid var(--bd)}
    .subnav .sl{padding:0 18px 10px;font-size:10px;opacity:.75;flex:0 0 auto}
    .subnav a{display:block;flex:0 0 auto;padding:8px 18px;border:none;border-left:2px solid transparent;line-height:1.35}
    .subnav a:hover{border-left-color:rgba(201,168,76,.45);background:rgba(255,255,255,.035);color:var(--ink)}
    .subnav a.active{border-left:3px solid var(--gold);background:rgba(201,168,76,.14);
      color:var(--gold);font-weight:700;padding-left:17px}
    body>main>.wrap,body>.wrap{margin-left:248px;padding-top:88px}
    body>footer{margin-left:248px}
  }
.grid2>.panel,.grid3>.panel{min-width:0}
.panel-b{min-width:0}

/* ---- skip link: keyboard users reach content without tabbing the whole nav */
.skip{position:absolute;left:-9999px;top:0;z-index:400;background:var(--gold);color:var(--ob);
  padding:10px 18px;font-family:var(--FM);font-size:12px;letter-spacing:1px;text-transform:uppercase}
.skip:focus{left:0}

/* ---- sub-nav group headings */
.subnav .sg{font-family:var(--FM);font-size:8.5px;letter-spacing:2px;text-transform:uppercase;
  color:var(--dm);opacity:.7;padding:0 10px 0 14px;white-space:nowrap;flex:0 0 auto;
  border-left:1px solid var(--bd);margin-left:6px}
.subnav .sg:first-of-type{border-left:none;margin-left:0}
@media(min-width:1200px){
  .subnav .sg{display:block;border-left:none;margin:14px 0 4px;padding:0 18px;
    font-size:9px;letter-spacing:2.2px;opacity:.55}
  .subnav .sg:first-of-type{margin-top:0}
}
/* horizontal strip below 1200px: show that it scrolls */
@media(max-width:1199px){
  .subnav{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 14px,#000 calc(100% - 22px),transparent 100%);
          mask-image:linear-gradient(to right,transparent 0,#000 14px,#000 calc(100% - 22px),transparent 100%)}
}

/* ---- data tables: associate every header with its cells */
table caption{caption-side:top;text-align:left;font-family:var(--FM);font-size:9.5px;
  letter-spacing:2px;text-transform:uppercase;color:var(--dm);padding:0 0 8px}

/* ---- print: analysts print research; give them something readable */
@media print{
  nav,.subnav,.skip,footer,.chart-controls,.seg-btns,button,select{display:none!important}
  html,body{background:#fff!important;color:#000!important}
  .panel,.reading,section,main{background:#fff!important;color:#000!important;
    border-color:#bbb!important;box-shadow:none!important;break-inside:avoid}
  h1,h2,h3{color:#000!important;break-after:avoid}
  a{color:#000!important;text-decoration:underline}
  main{padding:0!important;margin:0!important;max-width:100%!important}
  table{width:100%!important;overflow:visible!important;font-size:10pt}
  .panel-b,.scrollx{overflow:visible!important}
  @page{margin:16mm}
}

/* ---- sub-nav legibility -------------------------------------------------
   Page names were set as labels: uppercase mono, 11px, 1.2px tracking, 70%
   opacity. That is hard to scan for names like "Flows and Positioning".
   Names now read as names (Inter, sentence case, near-full contrast); the
   group headings keep the uppercase mono label treatment, so the hierarchy
   comes from a difference in kind, not just a difference in opacity. */
.subnav a{
  font-family:var(--FB);
  font-size:13px;
  letter-spacing:.1px;
  text-transform:none;
  color:rgba(238,241,245,.92);
  font-weight:400;
}
.subnav a:hover{color:var(--gold);background:rgba(255,255,255,.04)}
.subnav a.active{font-weight:600}

@media(min-width:1200px){
  .subnav{width:248px;padding:18px 0 30px}
  .subnav a{padding:7px 18px;line-height:1.35}
  .subnav .sg{
    font-family:var(--FM);font-size:8.5px;letter-spacing:2.4px;text-transform:uppercase;
    color:var(--gold);opacity:.62;margin:16px 0 5px;padding:0 18px;display:block;
  }
  .subnav .sg:first-of-type{margin-top:2px}
  .subnav a.active{
    color:var(--gold);background:rgba(201,168,76,.13);
    border-left:3px solid var(--gold);padding-left:15px;
  }
}
/* horizontal strip: keep names readable but tighter */
@media(max-width:1199px){
  .subnav a{font-size:12.5px;padding:6px 11px}
  .subnav .sg{font-size:8px;letter-spacing:1.8px;color:var(--gold);opacity:.55}
  .subnav a.active{color:var(--ob);background:var(--gold);font-weight:600}
}

/* ---- pre-rendered readings ---------------------------------------------
   Written into the HTML by prerender.py after each pipeline run, so that
   crawlers that do not execute JavaScript still see the page's numbers.
   The page's own scripts draw the same figures below; this is the static
   fallback and the machine-readable copy, not a duplicate for its own sake. */
.prerender{margin:0 0 26px;padding:20px 24px 14px;border:1px solid var(--bd);
  background:rgba(255,255,255,.017);border-left:2px solid rgba(201,168,76,.5)}
.prerender h2{font-family:var(--FM);font-size:9.5px;letter-spacing:2.4px;
  text-transform:uppercase;color:var(--gold);margin:0 0 8px;font-weight:500}
.prerender .pr-note{font-size:12.5px;line-height:1.6;color:var(--mt);margin:0 0 14px;max-width:70ch}
.prerender table{width:100%;border-collapse:collapse}
.prerender caption{display:none}
.prerender th[scope="row"]{text-align:left;font-weight:400;color:var(--mt);
  font-size:13px;padding:7px 14px 7px 0;border-bottom:1px solid var(--rule);white-space:normal}
.prerender td{border-bottom:1px solid var(--rule);padding:7px 0}
.prerender .pr-v{font-family:var(--FM);font-size:14px;color:var(--ink);
  white-space:nowrap;padding-right:16px}
.prerender .pr-c{font-size:12px;color:var(--dm);line-height:1.5}
.prerender tr:last-child th,.prerender tr:last-child td{border-bottom:none}
@media(max-width:620px){
  .prerender{padding:16px 16px 10px}
  .prerender .pr-c{display:none}
}
@media print{.prerender{break-inside:avoid;border-left-color:#999}}

/* ---- sub-nav, second pass -----------------------------------------------
   The first pass fixed the page names but left the group headings too small
   and too dim to act as headings, and "All readings and method" clipped at
   the rail edge. Headings now get real size and contrast and are allowed to
   wrap; the rail widened to 248px (content offset moved with it). */
@media(min-width:1200px){
  .subnav .sg{
    font-family:var(--FM);
    font-size:9.5px;
    letter-spacing:1.4px;
    text-transform:uppercase;
    color:var(--gold);
    opacity:1;
    font-weight:500;
    white-space:normal;       /* wrap instead of clipping */
    line-height:1.4;
    margin:22px 0 6px;
    padding:0 20px;
    display:block;
  }
  .subnav .sg:first-of-type{margin-top:4px}
  .subnav a{
    font-size:14px;
    color:rgba(238,241,245,.96);
    padding:8px 20px;
    line-height:1.4;
    white-space:normal;       /* long names wrap rather than truncate */
  }
  .subnav a:hover{color:var(--gold);background:rgba(255,255,255,.05)}
  .subnav a.active{
    color:var(--gold);background:rgba(201,168,76,.15);
    border-left:3px solid var(--gold);padding-left:17px;font-weight:600;
  }
  .subnav .sl{font-size:10px;letter-spacing:2.2px;opacity:.9;padding:0 20px 12px}
}

/* ---- indicator scorecard ------------------------------------------------ */
#sc-table{width:100%;border-collapse:collapse;font-size:13px;min-width:820px}
#sc-table caption{caption-side:top;text-align:left;font-family:var(--FM);font-size:9.5px;
  letter-spacing:2px;text-transform:uppercase;color:var(--dm);padding:0 0 10px}
#sc-table thead th{text-align:left;font-family:var(--FM);font-size:9.5px;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--dm);font-weight:500;padding:0 14px 9px 0;
  border-bottom:1px solid var(--rule);white-space:nowrap}
#sc-table tbody th[scope="row"]{text-align:left;font-weight:500;color:var(--ink);
  padding:11px 14px 11px 0;border-bottom:1px solid var(--rule);white-space:nowrap;font-size:13.5px}
#sc-table tbody th a{color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(201,168,76,.4)}
#sc-table tbody th a:hover{color:var(--gold)}
#sc-table td{padding:11px 14px 11px 0;border-bottom:1px solid var(--rule);vertical-align:top}
#sc-table td.claim{color:var(--mt);font-size:12.5px;line-height:1.5;max-width:32ch}
#sc-table td.mono{font-family:var(--FM);white-space:nowrap;color:var(--ink)}
#sc-table tr.thin td.mono,#sc-table tr.thin th[scope="row"] a,#sc-table tr.thin td.claim{opacity:.55}
.verdict{display:inline-block;font-family:var(--FM);font-size:9.5px;letter-spacing:1.3px;
  text-transform:uppercase;padding:4px 9px;border-radius:2px;white-space:nowrap;border:1px solid}
.v-good{color:#6fcf97;border-color:rgba(111,207,151,.45);background:rgba(111,207,151,.09)}
.v-bad{color:#e06c6c;border-color:rgba(224,108,108,.45);background:rgba(224,108,108,.09)}
.v-flat{color:var(--mt);border-color:var(--rule);background:rgba(255,255,255,.03)}
.v-none{color:var(--dm);border-color:var(--rule);background:transparent}
@media(max-width:820px){#sc-table td.claim{display:none}#sc-table{min-width:0}}

/* scorecard: summary strip, plain-English key, section dividers */
.sc-sum{font-size:15px;line-height:1.6;color:var(--ink);margin:0 0 10px}
.sc-sum b{font-family:var(--FM);color:var(--gold);font-size:17px;font-weight:500}
.sc-read{font-size:13px;line-height:1.65;color:var(--mt);margin:0 0 14px;max-width:76ch}
.sc-key{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--rule);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:9px 26px}
.sc-key li{font-size:12px;line-height:1.55;color:var(--dm);min-width:0}
.sc-key b{color:var(--mt);font-weight:500}
#sc-table tr.sec th{font-family:var(--FM);font-size:9px;letter-spacing:1.8px;text-transform:uppercase;
  color:var(--gold);opacity:.8;padding:22px 0 7px;border-bottom:1px solid var(--rule);font-weight:500}
#sc-table tr.sec:first-child th{padding-top:4px}

/* ---- scorecard, readability pass ---------------------------------------
   Three things were fighting the reader:
   1. a global `th` rule set uppercase mono with 1.5px tracking, so every
      indicator name read as a label rather than a name;
   2. a global `td{text-align:right}` left the claims column ragged-left;
   3. four stacked blocks of text sat between the heading and the table. */
#sc-table tbody th[scope="row"]{
  font-family:var(--FB);
  text-transform:none;
  letter-spacing:0;
  font-size:14px;
  font-weight:500;
  color:var(--ink);
  line-height:1.35;
  white-space:normal;
  padding-right:20px;
}
#sc-table tbody th[scope="row"] a{border-bottom:none;color:var(--ink)}
#sc-table tbody th[scope="row"] a:hover{color:var(--gold);border-bottom:1px solid var(--gold)}
#sc-table td.claim{text-align:left;max-width:34ch}
#sc-table td.mono{text-align:right}
#sc-table thead th{text-align:right}
#sc-table thead th:first-child,#sc-table thead th:nth-child(2){text-align:left}
#sc-table thead th:last-child{text-align:right}
#sc-table td:last-child{text-align:right}
#sc-table caption{display:none}          /* the h2 and summary already say this */
/* the provenance line belongs under the table, not between heading and data */
#sc-note{font-size:11.5px;color:var(--dm);line-height:1.55;margin:14px 0 0;
  padding-top:12px;border-top:1px solid var(--rule)}
.sc-read{margin:0 0 18px}

/* ---- front door: three ways in ----------------------------------------- */
.doors{margin:22px 0 26px}
.doors-lead{font-size:13px;color:var(--mt);margin:0 0 12px}
.doors-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:12px}
.door{display:block;min-width:0;padding:16px 18px;border:1px solid var(--bd);
  background:rgba(255,255,255,.017);text-decoration:none;transition:all .18s}
.door:hover{border-color:rgba(201,168,76,.55);background:rgba(201,168,76,.06)}
.door-k{display:block;font-family:var(--FM);font-size:9px;letter-spacing:2px;
  text-transform:uppercase;color:var(--gold);opacity:.85;margin-bottom:7px}
.door-t{display:block;font-family:var(--FB);font-size:16px;color:var(--ink);
  font-weight:500;margin-bottom:6px;line-height:1.25}
.door:hover .door-t{color:var(--gold)}
.door-d{display:block;font-size:12.5px;color:var(--dm);line-height:1.5}
.doors-foot{font-size:12.5px;color:var(--dm);line-height:1.6;margin:14px 0 0}
.doors-foot b{color:var(--mt);font-weight:500}
@media print{.doors{display:none}}

/* ---- typography rule ----------------------------------------------------
   The stylesheet had no separation between LABEL type and CONTENT type, so
   global rules written for tiny column captions leaked onto real content
   three separate times: the nav page names, the scorecard row headers, and
   table headers generally. The rule, stated once:

     LABEL type  - JetBrains Mono, uppercase, letter-spaced, small, dim.
                   Only for: eyebrows, column captions, group headings,
                   status chips, verdict badges. Never for anything a
                   reader has to READ rather than glance at.
     CONTENT type - Inter, sentence case, no tracking, full contrast.
                   Everything else, including every row header that names
                   a thing rather than labelling a column.

   `th` is ambiguous by nature: a column caption is a label, a row header is
   content. The global `th` rule stays for column captions; row headers opt
   out here, once, for the whole site. */
th[scope="row"]{
  font-family:var(--FB);
  text-transform:none;
  letter-spacing:0;
  font-size:13.5px;
  font-weight:500;
  color:var(--ink);
}
/* sentences are never right-aligned; only figures are */
td.claim,td.note,td.text,th[scope="row"]{text-align:left}

/* ---- methods table of contents ----------------------------------------- */
.toc{border:1px solid var(--bd);border-left:2px solid rgba(201,168,76,.5);
  background:rgba(255,255,255,.017);padding:18px 22px;margin:0 0 26px;max-height:none}
.toc-h{font-family:var(--FM);font-size:9.5px;letter-spacing:2.4px;text-transform:uppercase;
  color:var(--gold);margin-bottom:4px}
.toc-c{font-size:11.5px;color:var(--dm);margin:0 0 12px}
.toc ul{list-style:none;margin:0;padding:0}
.toc>ul>li>a{display:block;font-size:14px;font-weight:500;color:var(--ink);
  text-decoration:none;padding:7px 0 5px;line-height:1.35}
.toc>ul>li>a:hover{color:var(--gold)}
.toc ul ul{margin:0 0 10px;padding:0 0 0 2px;
  columns:2;column-gap:26px}
.toc li.t3{break-inside:avoid;margin:0}
.toc li.t3 a{display:block;font-size:12px;color:var(--dm);text-decoration:none;
  padding:3px 0;line-height:1.4}
.toc li.t3 a:hover{color:var(--gold)}
@media(max-width:700px){.toc ul ul{columns:1}}
@media(min-width:1200px){/* A sticky block taller than the viewport does not stick - it sits over
     whatever scrolls beneath it. The methods contents has grown to 71 entries
     and was covering the build-status panel. Cap it to the viewport and let it
     scroll internally. */
  .toc{position:sticky;top:88px;z-index:5;
    max-height:calc(100vh - 112px);overflow-y:auto;
    scrollbar-width:thin;scrollbar-color:var(--bd) transparent}
  .toc::-webkit-scrollbar{width:8px}
  .toc::-webkit-scrollbar-thumb{background:var(--bd);border-radius:4px}
  .toc::-webkit-scrollbar-track{background:transparent}}
@media print{.toc{display:none}}
/* anchored headings should not hide under the fixed masthead */
#main h2[id],#main h3[id]{scroll-margin-top:96px}

/* ---- glossary ----------------------------------------------------------- */
.gl-jump{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 22px;padding:0 0 16px;
  border-bottom:1px solid var(--rule)}
.gl-jump a{font-family:var(--FM);font-size:11px;color:var(--dm);text-decoration:none;
  padding:5px 9px;border:1px solid var(--bd);min-width:28px;text-align:center}
.gl-jump a:hover{color:var(--gold);border-color:rgba(201,168,76,.5)}
.gl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
  gap:2px;margin:0 0 26px}
.gl-item{padding:16px 18px;border:1px solid var(--bd);background:rgba(255,255,255,.014);
  min-width:0;scroll-margin-top:96px}
.gl-item h3{font-family:var(--FB);font-size:15px;font-weight:600;color:var(--gold);
  margin:0 0 7px;letter-spacing:0;text-transform:none}
.gl-item p{font-size:13px;line-height:1.62;color:var(--mt);margin:0 0 10px}
.gl-link{font-family:var(--FM);font-size:10px;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--dm);text-decoration:none}
.gl-link:hover{color:var(--gold)}
@media print{.gl-jump,.gl-link{display:none}.gl-grid{display:block}.gl-item{border:none;padding:8px 0}}

/* ---- tested claim pages ------------------------------------------------- */
.claim-verdict{border:1px solid var(--bd);border-left:2px solid rgba(201,168,76,.5);
  background:rgba(255,255,255,.017);padding:20px 24px;margin:0 0 26px}
.cv-badge{margin-bottom:14px}
.cv-badge .verdict{font-size:11px;letter-spacing:1.6px;padding:6px 13px}
.cv-table{width:100%;border-collapse:collapse}
.cv-table caption{caption-side:top;text-align:left;font-family:var(--FM);font-size:9.5px;
  letter-spacing:2px;text-transform:uppercase;color:var(--dm);padding:0 0 12px}
.cv-table th[scope="row"]{text-align:left;font-family:var(--FB);text-transform:none;
  letter-spacing:0;font-weight:400;color:var(--mt);font-size:13.5px;
  padding:9px 16px 9px 0;border-bottom:1px solid var(--rule);white-space:nowrap}
.cv-table td{padding:9px 0;border-bottom:1px solid var(--rule);vertical-align:baseline}
.cv-table td.mono{font-family:var(--FM);font-size:17px;color:var(--ink);
  white-space:nowrap;padding-right:20px;text-align:left;width:1%}
.cv-table td.cv-note{font-size:12px;color:var(--dm);line-height:1.5;text-align:left}
.cv-table tr:last-child th,.cv-table tr:last-child td{border-bottom:none}
.bridge{border-left:2px solid rgba(201,168,76,.5)}
.bridge h2{font-family:var(--FB);font-size:17px;font-weight:600;color:var(--ink);
  text-transform:none;letter-spacing:0;margin:0 0 10px}
.bridge p{font-size:13.5px;line-height:1.7;color:var(--mt);margin:0 0 10px;max-width:74ch}
.claim-foot p{font-size:11.5px;color:var(--dm);line-height:1.6;margin:0}

/* claim page comparison bars */
.cv-chart{margin:4px 0 20px;padding:0}
.cv-chart svg{display:block;width:100%;max-width:620px;height:auto}
.cvc-cap{font-family:var(--FM);font-size:8.5px;letter-spacing:1.6px;fill:var(--dm)}
.cvc-lab{font-family:var(--FB);font-size:12.5px;fill:var(--mt)}
.cvc-val{font-family:var(--FM);font-size:14px;fill:var(--ink)}
.cvc-foot{font-family:var(--FM);font-size:10px;letter-spacing:1.2px;fill:var(--dm)}
@media print{.cv-chart svg rect{opacity:1!important}}

/* claim registry index */
.reg-list{display:grid;grid-template-columns:1fr;gap:1px;margin-top:14px}
.reg-item{display:flex;justify-content:space-between;align-items:center;gap:18px;
  padding:13px 16px;border:1px solid var(--bd);background:rgba(255,255,255,.014);
  text-decoration:none;transition:all .16s}
.reg-item:hover{border-color:rgba(201,168,76,.5);background:rgba(201,168,76,.05)}
.reg-q{font-family:var(--FB);font-size:14.5px;color:var(--ink);line-height:1.35;min-width:0}
.reg-item:hover .reg-q{color:var(--gold)}
.reg-item.thin .reg-q{color:var(--mt)}
.reg-m{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.reg-n{font-family:var(--FM);font-size:10.5px;color:var(--dm);white-space:nowrap}
@media(max-width:620px){
  .reg-item{flex-direction:column;align-items:flex-start;gap:9px}
  .reg-m{gap:10px}
}

/* ---- the indicator itself, on each claim page --------------------------- */
.claim-indicator{margin:0 0 24px;padding:0}
.ci-svg{display:block;width:100%;height:auto}
.ci-frame{fill:none;stroke:var(--rule);stroke-width:1}
.ci-ep{fill:var(--gold);opacity:.16}
.ci-thr{stroke:#e06c6c;stroke-width:1;stroke-dasharray:4 3;opacity:.75}
.ci-l{fill:none;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.ci-main{stroke:var(--gold)}
.ci-alt{stroke:#6f9dcf}
.ci-faint{stroke:var(--mt);stroke-width:1;opacity:.45}
.ci-t{font-family:var(--FM);font-size:9px;letter-spacing:1.5px;fill:var(--dm);
  text-transform:uppercase}
.ci-ax{font-family:var(--FM);font-size:9px;fill:var(--dm)}
.ci-lg{font-family:var(--FB);font-size:10.5px;fill:var(--mt)}
.claim-indicator figcaption{font-size:12.5px;line-height:1.65;color:var(--mt);
  margin-top:12px;max-width:80ch}
.claim-indicator figcaption b{color:var(--ink);font-weight:600}

/* plain-language lead above the comparison bars */
.cv-lead{font-size:14.5px;line-height:1.7;color:var(--ink);margin:0 0 16px;max-width:76ch}
.cv-lead b{color:var(--gold);font-weight:600}

/* previous / next across the registry */
.claim-pager{display:grid;grid-template-columns:1fr auto 1fr;gap:1px;margin:26px 0 0}
.pg{display:block;padding:14px 16px;border:1px solid var(--bd);
  background:rgba(255,255,255,.014);text-decoration:none;min-width:0}
.pg:hover{border-color:rgba(201,168,76,.5);background:rgba(201,168,76,.05)}
.pg-k{display:block;font-family:var(--FM);font-size:8.5px;letter-spacing:1.8px;
  text-transform:uppercase;color:var(--dm);margin-bottom:6px}
.pg-t{display:block;font-family:var(--FB);font-size:13px;color:var(--mt);line-height:1.35}
.pg:hover .pg-t{color:var(--gold)}
.pg-next{text-align:right}
.pg-all{text-align:center}
@media(max-width:620px){.claim-pager{grid-template-columns:1fr}.pg-next{text-align:left}}

/* rail: claim count, and the contextual second level */
.subnav .sub-count{display:block;font-family:var(--FM);font-size:9px;letter-spacing:1.4px;
  color:var(--dm);opacity:.8;padding:2px 0 7px 20px;text-decoration:none}
.subnav .sub-count:hover{color:var(--gold);opacity:1;background:none}
.subnav .sub-count.on{color:var(--gold);opacity:1}
.subnav a.sub{font-size:12px;color:var(--mt);padding:4px 14px 4px 32px;line-height:1.32;
  position:relative}
.subnav a.sub::before{content:"";position:absolute;left:22px;top:0;bottom:0;
  border-left:1px solid var(--rule)}
.subnav a.sub:hover{color:var(--gold)}
.subnav a.sub.active{color:var(--gold);background:rgba(201,168,76,.10);
  border-left:2px solid var(--gold);padding-left:30px;font-weight:500}
@media(max-width:1199px){.subnav .sub-count{display:none}.subnav a.sub{padding-left:11px}}
@media print{.claim-pager{display:none}}

/* an instantaneous trigger (a moving-average crossing) has no width to shade */
.ci-mark{stroke:var(--gold);stroke-width:1.5;opacity:.85}
.ci-dot{fill:var(--gold);opacity:.95}

/* dashboard: the full page index, generated from the nav groups */
/* The Start here panel. The directory shared a three-column row with two
   notes, so it had a third of the width and its own five groups stacked into
   a single strip of 38 links. Setting a column count inside that third only
   made each column 92px. The directory takes the whole row; the two notes sit
   beneath it, side by side, where they read as footnotes rather than as peers
   of the index. */
.startgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px}
.startgrid>.sitemap-block{grid-column:1/-1;margin-bottom:6px}
.sitemap-block{display:grid;grid-template-columns:repeat(5,1fr);gap:18px 26px;align-items:start}
@media(max-width:1180px){.sitemap-block{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.sitemap-block{grid-template-columns:repeat(2,1fr)}
  .startgrid{grid-template-columns:1fr}}
/* the collapsed claim list inside the index */
.sm-sub details>summary{cursor:pointer;list-style:none;font-family:var(--FM);font-size:9px;
  letter-spacing:1.4px;text-transform:uppercase;color:var(--dm);padding:2px 0}
.sm-sub details>summary::-webkit-details-marker{display:none}
.sm-sub details>summary::after{content:" \25be";color:var(--dm)}
.sm-sub details[open]>summary::after{content:" \25b4"}
.sm-sub details>summary:hover{color:var(--gold)}
.sm-group{min-width:0}
.sm-h{font-family:var(--FM);font-size:9px;letter-spacing:1.8px;text-transform:uppercase;
  color:var(--gold);opacity:.85;margin-bottom:7px}
.sm-list{list-style:none;margin:0;padding:0}
.sm-list li{margin:0 0 3px}
.sm-list a{font-size:13.5px;color:var(--ink);text-decoration:none;line-height:1.4}
.sm-list a:hover{color:var(--gold)}
.sm-sub{margin-top:7px!important}
.sm-sub>span{display:block;font-family:var(--FM);font-size:9px;letter-spacing:1.4px;
  text-transform:uppercase;color:var(--dm);margin-bottom:4px}
.sm-sub ul{list-style:none;margin:0;padding:0 0 0 10px;border-left:1px solid var(--rule)}
.sm-sub a{font-size:12px;color:var(--mt)}
.gl-heading{font-family:var(--FM);font-size:9.5px;letter-spacing:2.4px;text-transform:uppercase;
  color:var(--gold);margin:0 0 12px;font-weight:500}

/* ---- narrow screens ------------------------------------------------------
   The claim chart is drawn in a 720-wide viewBox scaled to 100%. On a 360px
   phone that is a 0.5x scale, so 9px axis text renders at about 4px. Scale the
   type up as the viewport narrows. */
@media(max-width:620px){
  .ci-t{font-size:13px;letter-spacing:.6px}
  .ci-ax{font-size:13px}
  .ci-lg{font-size:13px}
  .cvc-lab{font-size:17px}
  .cvc-val{font-size:19px}
  .cvc-cap{font-size:13px;letter-spacing:1px}
  .cvc-foot{font-size:14px}
  /* the verdict table's third column is commentary; the figure is the point */
  .cv-table td.cv-note{display:none}
  .cv-table td.mono{font-size:16px}
  .claim-verdict{padding:16px}
  .cv-lead{font-size:14px}
  .sitemap-block{grid-template-columns:1fr;gap:14px}
  .sm-sub ul{padding-left:8px}
  .claim-indicator figcaption{font-size:12px}
}
@media(max-width:400px){
  .ci-t{font-size:15px}
  .ci-ax{font-size:15px}
  .ci-lg{font-size:15px}
}

/* the Scorecard while you are reading one of its claims: context, not a
   second current page */
.subnav a.parent{color:var(--gold);opacity:.9}
@media(min-width:1200px){
  .subnav a.parent{background:rgba(201,168,76,.05);border-left:2px solid rgba(201,168,76,.4);
    padding-left:16px}
}

/* ---- portfolio page ----------------------------------------------------- */
.pf-lead{border-left:2px solid rgba(201,168,76,.5)}
.pf-headline{font-size:17px;line-height:1.65;color:var(--ink);margin:0 0 12px;max-width:76ch}
.pf-headline b{color:var(--gold);font-weight:600}
.pf-sub{font-size:13px;line-height:1.7;color:var(--mt);margin:0;max-width:78ch}
.pf-read{font-size:13.5px;line-height:1.7;color:var(--mt);margin:0 0 16px;max-width:78ch}


/* ---- interactive portfolio tool ----------------------------------------- */
.pf-tool{border:1px solid var(--bd);border-left:2px solid rgba(201,168,76,.55);
  background:rgba(255,255,255,.017);padding:20px 22px;margin:0 0 26px}
.pf-hide{display:none}
.pf-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:16px 24px;margin-bottom:14px}
.pf-ctl label{display:block;font-family:var(--FM);font-size:9px;letter-spacing:1.8px;
  text-transform:uppercase;color:var(--dm);margin-bottom:7px}
.pf-ctl label b{color:var(--gold);font-size:12px;letter-spacing:.5px}
.pf-ctl input[type=range]{width:100%;accent-color:var(--gold);cursor:pointer}
.pf-ctl select{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--bd);
  color:var(--ink);font-family:var(--FB);font-size:13px;padding:6px 8px;border-radius:2px}
.pf-seg{display:flex;gap:1px}
.pf-seg button{flex:1;background:rgba(255,255,255,.03);border:1px solid var(--bd);
  color:var(--mt);font-family:var(--FB);font-size:12.5px;padding:6px 4px;cursor:pointer}
.pf-seg button.on{background:rgba(201,168,76,.13);border-color:rgba(201,168,76,.5);color:var(--gold)}
.pf-window{font-family:var(--FM);font-size:10px;letter-spacing:1.2px;color:var(--dm);
  margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
.pf-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:14px 20px;
  margin-bottom:16px}
.pf-stat{min-width:0}
.pf-k{display:block;font-family:var(--FM);font-size:8.5px;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--dm);margin-bottom:5px}
.pf-stat b{display:block;font-family:var(--FM);font-size:21px;color:var(--ink);line-height:1.1}
.pf-d{display:block;font-size:11px;color:var(--mt);margin-top:4px}
.pf-headline{font-size:15px;line-height:1.65;color:var(--ink);margin:0 0 18px;max-width:78ch}
.pf-headline b{color:var(--gold);font-weight:600}
.pf-chart{margin:0 0 8px}
.pf-svg{display:block;max-width:100%;height:auto}
.pf-frame{fill:none;stroke:var(--rule);stroke-width:1}
.pf-zero{stroke:var(--bd);stroke-width:1;stroke-dasharray:3 3}
.pf-l{fill:none;stroke-width:1.8;stroke-linejoin:round}
.pf-main-l{stroke:var(--gold)}
.pf-base-l{stroke:var(--mt);stroke-width:1.3;opacity:.7}
.pf-alt-l{stroke:#6f9dcf;stroke-width:1.5}
.pf-dot{fill:var(--gold);opacity:.9}
.pf-pt{font-family:var(--FM);font-size:10px;fill:var(--mt)}
.pf-ax{font-family:var(--FM);font-size:10px;fill:var(--dm)}
.pf-lg{font-family:var(--FB);font-size:11px;fill:var(--mt)}
.pf-cap{font-size:11.5px;color:var(--dm);line-height:1.6;margin:6px 0 0;max-width:80ch}
.pf-read{font-size:13.5px;line-height:1.7;color:var(--mt);margin:0 0 16px;max-width:78ch}
.pf-read b{color:var(--gold)}
.pf-tw{overflow-x:auto}
.pf-t{width:100%;border-collapse:collapse;font-size:13px}
.pf-t caption{caption-side:top;text-align:left;font-family:var(--FM);
  font-size:9.5px;letter-spacing:2px;text-transform:uppercase;color:var(--dm);padding:14px 0 10px;line-height:1.6}
.pf-t thead th{text-align:right;font-family:var(--FM);font-size:9.5px;
  letter-spacing:1.4px;text-transform:uppercase;color:var(--dm);font-weight:500;
  padding:0 0 9px 14px;border-bottom:1px solid var(--rule);white-space:nowrap}
.pf-t thead th:first-child{text-align:left;padding-left:0}
.pf-t tbody th{text-align:left;font-family:var(--FB);text-transform:none;
  letter-spacing:0;font-weight:500;color:var(--ink);font-size:13.5px;
  padding:9px 14px 9px 0;border-bottom:1px solid var(--rule)}
.pf-t td{padding:9px 0 9px 14px;border-bottom:1px solid var(--rule);
  font-family:var(--FM);text-align:right;white-space:nowrap;color:var(--ink)}
.pf-t tr.pf-base th,.pf-t tr.pf-base td{color:var(--mt)}
.pf-t tr.pf-sel th{color:var(--gold)}
.pf-when{color:var(--dm);font-size:10.5px;margin-left:4px}
.pf-gain{color:#6fcf97}
.pf-cost{color:#e06c6c}
.pf-alt2-l{stroke:var(--mt);stroke-width:1.3;stroke-dasharray:4 3}
@media(max-width:620px){
  .pf-tool{padding:16px 14px}
  .pf-stat b{font-size:18px}
  /* a table is a card per row on a phone: every column stays visible
     instead of hiding off the right edge of a sideways scroll */
  .pf-t thead{display:none}
  .pf-t,.pf-t tbody{display:block;width:100%}
  .pf-t caption{display:block;width:100%;padding:12px 0 6px}
  .pf-t tr{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;padding:10px 0;border-bottom:1px solid var(--rule)}
  .pf-t tbody th{grid-column:1/-1;border:0;padding:0 0 2px;font-size:14px}
  .pf-t td{display:flex;justify-content:space-between;align-items:baseline;gap:8px;border:0;padding:2px 0;white-space:normal;font-size:12.5px;text-align:right}
  .pf-t td::before{content:attr(data-l);font-family:var(--FB);color:var(--dm);font-size:11.5px;text-align:left}
}
.pf-lead{stroke:var(--dm);stroke-width:.8;opacity:.6}

.pf-key{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--rule)}
.pf-key li{font-size:13px;line-height:1.65;color:var(--mt);margin:0 0 10px;max-width:84ch}
.pf-key li:last-child{margin-bottom:0}
.pf-key b{color:var(--ink);font-weight:500}
.pf-static-note{font-size:12px;line-height:1.6;color:var(--dm);margin:10px 0 0;max-width:80ch;border-left:2px solid var(--rule);padding-left:12px}

/* ---- grid column counts as classes, not inline styles -------------------
   These were written inline. An inline style beats a media query, so the
   mobile single-column rule below could never apply and every one of these
   stayed multi-column on a phone - two panels side by side in 450px each,
   wrapping body text to three words a line. */
.gt-12-1{grid-template-columns:1.2fr 1fr}
.gt-2{grid-template-columns:1fr 1fr}
.gt-3{grid-template-columns:repeat(3,1fr)}
.gt-4{grid-template-columns:repeat(4,1fr)}
.no-br{border-right:none}
@media(max-width:820px){
  .gt-12-1,.gt-2{grid-template-columns:1fr}
  .gt-3,.gt-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .gt-3,.gt-4{grid-template-columns:1fr}
}
.sc-fire{color:var(--gold);font-weight:600;letter-spacing:.04em}
.pf-share-row{display:flex;gap:10px;align-items:center;margin:0 0 14px;flex-wrap:wrap}
.pf-share-row .pf-k{margin:0;white-space:nowrap}
#pf-share{flex:1;min-width:220px;background:rgba(255,255,255,.03);border:1px solid var(--bd);color:var(--mt);
  font-family:var(--FM);font-size:11px;padding:6px 8px;border-radius:2px}
.rb-btn{width:100%;background:rgba(201,168,76,.15);border:1px solid rgba(201,168,76,.6);color:var(--gold);
  font-family:var(--FB);font-size:13px;font-weight:600;padding:7px 10px;cursor:pointer;letter-spacing:.03em}
.rb-btn:hover{background:rgba(201,168,76,.25)}
.rb-verdict{font-family:var(--FM);font-size:16px;font-weight:600;letter-spacing:.04em;margin:0 0 12px;min-height:1.4em}
#rb-history{width:100%;border-collapse:collapse;font-size:12.5px}
#rb-history th,#rb-history td{padding:7px 10px 7px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
#rb-history thead th{font-family:var(--FM);font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--dm);font-weight:500}
#rb-history caption{caption-side:top;text-align:left;font-family:var(--FM);font-size:9.5px;letter-spacing:2px;text-transform:uppercase;color:var(--dm);padding:14px 0 10px}
.ca-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:560px}
.ca-table th,.ca-table td{padding:7px 10px 7px 0;border-bottom:1px solid var(--rule);text-align:right;white-space:nowrap}
.ca-table th:first-child,.ca-table td:first-child{text-align:left}
.ca-table thead th{font-family:var(--FM);font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--dm);font-weight:500}
.ca-table tbody th{font-family:var(--FB);font-weight:500;color:var(--ink);text-transform:none;letter-spacing:0;font-size:13px}
.ca-table tr.ca-pooled th,.ca-table tr.ca-pooled td{border-top:2px solid var(--bd);padding-top:9px}
@media(max-width:620px){.ca-table{min-width:0;font-size:11.5px}}
/* collapsible tested-claims group in the rail */
.subnav .rail-tog{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;color:var(--dm);
  font-family:var(--FM);font-size:10px;letter-spacing:1.2px;padding:2px 0 6px 12px;cursor:pointer;text-align:left}
.subnav .rail-tog:hover{color:var(--gold)}
.subnav .rail-tog-c{display:inline-block;transition:transform .15s ease}
.subnav .rail-tog[aria-expanded="false"] .rail-tog-c{transform:rotate(-90deg)}
.subnav .rail-tog[aria-expanded="false"] .rail-tog-n::after{content:" tested claims"}
.subnav .rail-tog[aria-expanded="true"] .rail-tog-n::after{content:" tested claims"}
.subnav .rail-claims.collapsed{display:none}
@media(max-width:1200px){.rail-tog{display:none}.rail-claims.collapsed{display:contents}}
/* interactive claim chart */
.cc-wrap{margin:0 0 18px}
.cc-live{width:100%;height:520px}
.cc-ctl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:6px 0 0;font-family:var(--FM);font-size:10.5px;letter-spacing:.06em;color:var(--dm)}
.cc-ctl button{background:rgba(255,255,255,.03);border:1px solid var(--bd);color:var(--mt);font-family:var(--FM);font-size:10.5px;padding:3px 9px;cursor:pointer;letter-spacing:.06em}
.cc-ctl button:hover,.cc-ctl button.on{color:var(--gold);border-color:rgba(201,168,76,.6)}
.cc-ctl-l{margin-right:2px}.cc-ctl-sep{width:1px;height:14px;background:var(--bd);margin:0 6px}
.cc-ctl-lab{min-width:120px;text-align:center;color:var(--mt)}
.cc-ctl-hint{margin-left:auto;text-transform:none;letter-spacing:0;font-family:var(--FB);font-size:11.5px}
@media(max-width:700px){.cc-live{height:420px}.cc-ctl-hint{display:none}}

/* Charts read at full width. A chart panel inside a two- or three-column
   grid takes the whole row; the stat panels around it keep their columns.
   A chart at a third of the content width, 440px tall, was the complaint. */
.grid2>.panel:has(.chart),.gt-2>.panel:has(.chart),.gt-3>.panel:has(.chart),.grid3>.panel:has(.chart),
.grid2>section:has(.chart),.gt-2>section:has(.chart),.gt-3>section:has(.chart){grid-column:1/-1}
.chart.spark{height:380px}
@media(max-width:900px){.chart{height:380px}.chart.short,.chart.mid,.chart.spark{height:320px}}
#fl-wf tr.wf-open td{opacity:.72}
#fl-wf tr.wf-open td:first-child{border-left:2px solid rgba(201,168,76,.5)}

/* ===== At a glance: the dashboard ================================== */
.dash{margin:0 0 34px}
.dash-hero{display:grid;grid-template-columns:minmax(180px,1fr) minmax(240px,1.4fr) minmax(200px,1.2fr);
  gap:0;border:1px solid var(--bd);background:linear-gradient(180deg,rgba(255,255,255,.025),transparent)}
.dash-hero>div{padding:18px 22px;border-right:1px solid var(--bd)}
.dash-hero>div:last-child{border-right:none}
.dh-k{display:block;font-family:var(--FM);font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--dm);margin:0 0 8px}
.dh-price b{display:block;font-family:var(--FM);font-size:32px;line-height:1;color:var(--ink);font-weight:400}
.dh-verdict b{display:block;font-family:var(--FB);font-size:22px;line-height:1.15;color:var(--gold);font-weight:600;letter-spacing:.01em}
.dh-sub{display:block;font-size:12.5px;color:var(--mt);margin:6px 0 0;line-height:1.4}
.dh-bar{display:flex;align-items:center;gap:9px;margin:14px 0 0}
.dh-lo,.dh-hi{font-family:var(--FM);font-size:10.5px;color:var(--dm);white-space:nowrap}
.dh-track{position:relative;flex:1;height:4px;background:var(--rule);border-radius:2px}
.dh-track i{position:absolute;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 0 3px rgba(201,168,76,.18)}

.dash-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--bd);border-top:none}
/* six gauges: three across on a wide screen and three below, never five with
   one orphaned on its own row, which is what auto-fit produced */
@media(min-width:1500px){.dash-grid{grid-template-columns:repeat(6,1fr)}}
@media(max-width:820px){.dash-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.dash-grid{grid-template-columns:1fr}}
.dash-grid .g-cell:nth-child(3n){border-right:none}
@media(min-width:1500px){.dash-grid .g-cell:nth-child(3n){border-right:1px solid var(--bd)}
  .dash-grid .g-cell:nth-child(6n){border-right:none}}
@media(max-width:820px){.dash-grid .g-cell:nth-child(3n){border-right:1px solid var(--bd)}
  .dash-grid .g-cell:nth-child(2n){border-right:none}}
@media(max-width:520px){.dash-grid .g-cell{border-right:none}}
.g-cell{padding:15px 20px 17px;border-right:1px solid var(--bd);border-bottom:1px solid var(--bd)}
.g-cell:last-child{border-right:none}
.g-name{display:block;font-family:var(--FM);font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--dm)}
.g-val{display:flex;align-items:baseline;gap:8px;margin:7px 0 0}
.g-val{flex-wrap:wrap}
.g-val b{font-family:var(--FM);font-size:20px;color:var(--ink);font-weight:400;white-space:nowrap}
.g-pct{font-family:var(--FM);font-size:11px;color:var(--mt)}
.g-scale{position:relative;height:22px;margin:11px 0 0}
.g-band{position:absolute;top:8px;height:6px;border-radius:1px}
.g-band.cheap{background:rgba(96,196,140,.22)}
.g-band.mid{background:rgba(255,255,255,.05)}
.g-band.dear{background:rgba(226,96,96,.22)}
.g-mark{position:absolute;top:3px;width:2px;height:16px;background:var(--gold);margin-left:-1px}
.g-ends{display:flex;justify-content:space-between;font-family:var(--FM);font-size:9px;color:var(--dm);letter-spacing:.08em;margin:1px 0 0}
.g-note{display:block;font-size:11.5px;color:var(--mt);margin:8px 0 0;line-height:1.4}

.dash-row{display:grid;grid-template-columns:1.25fr 1fr;gap:0;border:1px solid var(--bd);border-top:none}
.dash-card{padding:16px 20px 18px;border-right:1px solid var(--bd)}
.dash-card:last-child{border-right:none}
.dc-h{font-family:var(--FM);font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--dm);margin:0 0 12px}
.dc-n{color:var(--gold)}
.dc-b{display:flex;flex-wrap:wrap;gap:7px}
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--bd);padding:5px 10px;
  font-size:12.5px;color:var(--ink);background:rgba(255,255,255,.02);text-decoration:none}
.chip:hover{border-color:rgba(201,168,76,.6)}
.chip i{width:6px;height:6px;border-radius:50%;flex:none}
.chip.up i{background:#60c48c}.chip.down i{background:#e26060}
.chip .lbl{font-family:var(--FM);font-size:10px;color:var(--dm);text-decoration:none;letter-spacing:.06em}
.dc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.dc-stat b{display:block;font-family:var(--FM);font-size:23px;color:var(--ink);font-weight:400;line-height:1}
.dc-stat span{display:block;font-family:var(--FM);font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--dm);margin:6px 0 0;line-height:1.35}
.dc-f{font-size:12px;color:var(--mt);line-height:1.5;margin:13px 0 0}
.dash-note{font-size:12.5px;color:var(--dm);line-height:1.5;margin:12px 2px 0}
@media(max-width:900px){
  .dash-hero{grid-template-columns:1fr}
  .dash-hero>div{border-right:none;border-bottom:1px solid var(--bd)}
  .dash-row{grid-template-columns:1fr}
  .dash-card{border-right:none;border-bottom:1px solid var(--bd)}
  .dc-stats{grid-template-columns:repeat(3,1fr)}
}
.asof-line{font-family:var(--FM);font-size:10.5px;letter-spacing:.08em;color:var(--dm);margin:14px 0 0}

/* The evidence grid. Colour encodes WHAT IS KNOWN, never bullish or bearish:
   colouring 36 rules green and red would rebuild the scoreboard this site
   exists to argue against. A wall of grey with two coloured cells IS the
   finding, visible before a word is read. */
.ev-card{border:1px solid var(--bd);border-top:none;padding:16px 20px 18px}
.ev-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(126px,1fr));gap:5px}
.ev-cell{position:relative;display:block;padding:8px 9px 9px;border:1px solid var(--bd);
  background:rgba(255,255,255,.02);text-decoration:none;min-height:52px}
.ev-cell:hover{border-color:rgba(201,168,76,.6)}
.ev-cell b{font-size:11px;line-height:1.28;color:var(--mt);font-weight:400;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;hyphens:auto}
.ev-cell .lbl{display:block;font-family:var(--FM);font-size:9px;letter-spacing:.06em;color:var(--dm);
  text-decoration:none;margin:4px 0 0}
.ev-cell.judged{background:rgba(201,168,76,.10);border-color:rgba(201,168,76,.45)}
.ev-cell.judged b{color:var(--ink)}
.ev-cell.own{background:rgba(122,162,247,.07);border-color:rgba(122,162,247,.3)}
.ev-cell.firing::after{content:"";position:absolute;top:6px;right:6px;width:5px;height:5px;
  border-radius:50%;background:var(--gold)}
.ev-key{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0 0;font-family:var(--FM);font-size:9.5px;
  letter-spacing:.08em;color:var(--dm);align-items:center}
.ev-key span{display:inline-flex;align-items:center;gap:6px}
.ev-sw{width:11px;height:11px;border:1px solid var(--bd);display:inline-block}
.ev-sw.ev-judged{background:rgba(201,168,76,.10);border-color:rgba(201,168,76,.45)}
.ev-sw.ev-thin{background:rgba(255,255,255,.02)}
.ev-sw.ev-own{background:rgba(122,162,247,.07);border-color:rgba(122,162,247,.3)}
.ev-key .ev-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);display:inline-block}
@media(max-width:520px){.ev-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}}
.sc-scatter-wrap{margin:0 0 22px}
.sc-scatter{width:100%;height:420px}
.sc-scatter-note{margin:8px 2px 0;line-height:1.5;max-width:74ch}
@media(max-width:700px){.sc-scatter{height:340px}}
/* the scorecard table is 820px wide; on a phone it becomes cards */
@media(max-width:700px){
  #sc-table{min-width:0}
  #sc-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  #sc-table tr{display:block;border:1px solid var(--bd);margin:0 0 8px;padding:10px 12px;background:rgba(255,255,255,.02)}
  #sc-table tr.sec{background:none;border:none;padding:14px 0 4px}
  #sc-table td,#sc-table th[scope="row"]{display:flex;justify-content:space-between;gap:12px;
    border:none;padding:3px 0;text-align:right}
  #sc-table th[scope="row"]{text-align:left;font-size:13px;padding-bottom:7px}
  #sc-table td::before{content:attr(data-l);font-family:var(--FM);font-size:9.5px;letter-spacing:1.1px;
    text-transform:uppercase;color:var(--dm);text-align:left;flex:none}
}

/* cross-asset heatmap */
.ca-heat-wrap{margin:0 0 26px}
.ca-heat{overflow-x:auto}
.ca-heat table{border-collapse:collapse;width:100%;min-width:520px}
.ca-heat th{font-family:var(--FM);font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--dm);font-weight:400;padding:8px 10px;text-align:center;vertical-align:bottom}
.ca-heat th.rule{text-align:left;width:34%;text-transform:none;letter-spacing:0;font-size:12.5px;color:var(--mt)}
.ca-heat td{padding:0;border:1px solid var(--bg)}
.ca-heat .hc{display:block;padding:11px 6px 9px;text-align:center;font-family:var(--FM)}
.ca-heat .hc b{display:block;font-size:14px;font-weight:400;color:var(--ink)}
.ca-heat .hc s{display:block;font-size:9px;color:var(--dm);text-decoration:none;margin:3px 0 0;letter-spacing:.06em}
.ca-heat-note{margin:10px 2px 0;line-height:1.5;max-width:78ch}

/* base-rate bars: two outcomes per bin, on one baseline */
.br-bars-wrap{margin:0 0 24px}
.br-bars{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:2px;
  border:1px solid var(--bd);padding:16px 14px 12px;background:rgba(255,255,255,.015)}
.brb{display:flex;flex-direction:column;justify-content:flex-end;padding:0 5px}
/* align-items:flex-end shrank each column to the height of its own label, so
   a bar set to "81%" was 81% of nothing and the panel rendered empty. The
   columns must fill the plot; the bar is positioned from the bottom inside
   them, which is what makes the percentages comparable. */
.brb-plot{display:flex;align-items:stretch;gap:5px;height:120px}
.brb-col{flex:1;position:relative;height:100%;background:rgba(255,255,255,.05)}
.brb-col i{position:absolute;bottom:0;left:0;right:0;display:block}
.brb-col.up i{background:rgba(96,196,140,.55)}
.brb-col.down i{background:rgba(226,96,96,.5)}
.brb-col b{position:absolute;left:0;right:0;text-align:center;
  font-family:var(--FM);font-size:9.5px;color:var(--mt);font-weight:400;line-height:1}
.brb-lab{font-family:var(--FM);font-size:9px;letter-spacing:.06em;color:var(--dm);
  text-align:center;margin:9px 0 0;border-top:1px solid var(--bd);padding:7px 0 0}
.brb-lab .lbl{display:block;text-decoration:none;color:var(--mt);font-size:8.5px;margin:2px 0 0}
.br-bars-key{display:flex;gap:16px;margin:10px 2px 0;font-family:var(--FM);font-size:9.5px;
  letter-spacing:.08em;color:var(--dm)}
.br-bars-key span{display:inline-flex;align-items:center;gap:6px}
.br-bars-key i{width:11px;height:11px;display:inline-block}
.br-bars-key i.up{background:rgba(96,196,140,.55)}
.br-bars-key i.down{background:rgba(226,96,96,.5)}
.br-bars-note{margin:10px 2px 0;line-height:1.5;max-width:78ch}

/* the correction log: 85 entries in one page was unreadable */
.chg-intro{margin:0 0 14px}
details.chg{border-top:1px solid var(--bd);padding:0}
details.chg summary{cursor:pointer;list-style:none;padding:11px 26px 11px 0;position:relative;
  font-family:var(--FB);font-size:14.5px;color:var(--mt);line-height:1.4}
details.chg summary::-webkit-details-marker{display:none}
details.chg summary:hover{color:var(--gold)}
details.chg summary::after{content:"+";position:absolute;right:4px;top:10px;font-family:var(--FM);
  font-size:15px;color:var(--dm)}
details.chg[open] summary::after{content:"\2212"}
details.chg[open] summary{color:var(--ink)}
.chg-b{padding:0 0 14px}
.chg-b p{margin:0 0 10px}
.sc-key{display:flex;flex-wrap:wrap;gap:16px;margin:8px 2px 0;font-family:var(--FM);font-size:9.5px;
  letter-spacing:.08em;color:var(--dm);align-items:center}
.sc-key span{display:inline-flex;align-items:center;gap:7px}
.sc-key .k-dot{width:11px;height:11px;border-radius:50%;display:inline-block}
.sc-key .k-judged{background:#c9a84c}
.sc-key .k-thin{background:rgba(232,236,240,.30);width:8px;height:8px}
.sc-key .k-own{background:rgba(122,162,247,.75);width:8px;height:8px}
.sc-key .k-fire{background:rgba(232,236,240,.30);box-shadow:0 0 0 2px #c9a84c;width:8px;height:8px}

/* The valuation band strip. Its five columns were set inline, which no media
   query can override, so on a phone "VERY EXPENSIVE" was crushed into a
   thirty-eight pixel column. The proportions are the point and are kept; only
   the labels change. */
.band-labels,.band-bars{display:grid;grid-template-columns:1fr 2fr 4fr 2fr 1fr;gap:3px}
.band-labels{font-family:var(--FM);font-size:10px;letter-spacing:.06em;color:var(--dm);text-align:center}
.band-bars{margin-top:4px}
/* One label per band, never two. The first attempt shipped both a long and a
   short label and hid one with CSS; with the stylesheet stale a reader saw
   "VERY CHEAPV CHEAP", the second half struck through. Nothing is duplicated
   now: the type shrinks and the words wrap. */
@media(max-width:900px){.band-labels{font-size:8.5px;letter-spacing:0;line-height:1.2}}
@media(max-width:560px){.band-labels{font-size:7.5px}}

/* <s> means strikethrough. Using it as a plain label meant that whenever the
   stylesheet was missing or stale - a cached CSS, a failed upload - every one
   of these labels rendered struck through, which is what a reader saw on the
   valuation band strip. They are spans now, so a missing stylesheet degrades
   to plain text rather than to text marked as deleted. */
.lbl{text-decoration:none}

/* A gauge with no percentile has nothing to place on the scale. Drawing the
   cheap/dear band with no marker looked like a control that had failed. */
.g-cell.g-noscale .g-scale,.g-cell.g-noscale .g-ends{display:none}
.g-cell.g-noscale .g-note{margin-top:12px}

/* subscribe block: quiet by design. The site's argument is that most signals
   cannot be told from chance, and a loud email capture in the middle of that
   argument would undercut it. Reads as another panel, not as an interruption. */
.sub-panel{border-top:2px solid var(--gold);margin-top:34px}
.sub-lead{font-size:1.18rem;font-weight:600;color:var(--ink);margin:0 0 10px}
.sub-btn{display:inline-block;margin:6px 0 2px;padding:11px 20px;border:1px solid var(--gold);
  color:var(--gold);text-decoration:none;font-weight:600;letter-spacing:.01em}
.sub-btn:hover{background:var(--gold);color:#0d1117}
@media(max-width:700px){.sub-btn{display:block;text-align:center}}

/* the identity, set apart. It is the whole argument of one page and should
   read as a statement rather than as a sentence containing symbols. */
.eq{font-size:1.1rem;text-align:center;margin:16px 0;padding:12px 10px;
  border-left:2px solid var(--gold);background:rgba(255,255,255,.02);letter-spacing:.01em}
@media(max-width:700px){.eq{font-size:1rem;text-align:left}}

/* episode timeline key */
.tl-key{font-size:12px;color:var(--mt);margin:12px 0 16px;line-height:2}
.tl-sw{display:inline-block;width:22px;height:10px;vertical-align:middle;margin-right:6px;border-radius:1px}
#tl-wrap{margin:4px 0 2px}
#tl-wrap svg{min-width:760px}

/* the spectrum: the one thing on the page a reader should be able to answer
   from without reading a sentence */
#cec-spectrum{margin:2px 0 6px}
#cec-spectrum svg{min-width:520px}
@media(max-width:700px){#cec-spectrum{overflow-x:auto}}
#cec-read{font-size:1.05rem;margin:10px 0 18px;color:var(--tx)}

/* ---- wide tables scroll inside their panel instead of being clipped.
   build.py wraps every table not already in a scrolling container; the
   body clips sideways overflow, so without this the right-hand columns of a
   wide table on a phone were simply cut off. */
.tscroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.tscroll>table{width:100%}
.prerender{overflow-x:auto}
@media print{.tscroll,.prerender{overflow:visible!important}}

/* ---- the evidence brief is three columns of prose; on a phone each question
   becomes a card (question, then the evidence, then its strength) instead of a
   table the reader has to scroll sideways through */
@media(max-width:700px){
  #briefTable thead{display:none}
  #briefTable,#briefTable tbody,#briefTable tr,#briefTable td{display:block;width:auto}
  #briefTable caption{display:block}
  #briefTable tr{padding:12px 0;border-bottom:1px solid var(--bd)}
  #briefTable td{border:none!important;padding:3px 0!important;text-align:left!important;white-space:normal!important}
  #briefTable td:first-child{font-size:14px}
  #briefTable td:last-child{font-family:var(--FM);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gold)}
  #rotWrap td>span{display:block}
}
