/* ============================================================
   Report additions. Everything here extends styles.css in its
   own idiom: one serif face, micro-caps labels, hairlines,
   square corners. Segment colours follow the Value Map ladder:
   the higher the class, the deeper the ink. The rose accent is
   kept for one thing only, the new EV entrants (challengers).
   ============================================================ */
:root{
  --c-mass:#80B4D8; --c-mass-s:#5E9DCB;
  --c-mid:#4E8FBE;  --c-mid-s:#2E7BAB;
  --c-prem:#2C6FA0; --c-prem-s:#1D4E74;
  --c-lux:#123449;  --c-lux-s:#0B2233;
  --c-ev:var(--accent); --c-out:var(--muted-2);
}
.toc{display:flex;flex-wrap:wrap;gap:4px 18px;padding:9px 0 0;margin:0 0 4px}
.toc a{font:400 11px/1.6 var(--ui);color:var(--muted);text-decoration:none;border-bottom:1px solid transparent}
.toc a:hover{color:var(--ink);border-bottom-color:var(--line-strong)}
.intro{margin:34px 0 8px;max-width:980px}
.kicker{margin:0 0 12px;font:600 8.5px/1 var(--ui);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.intro .title{margin:0;font:600 30px/1.22 var(--display);letter-spacing:-.025em;color:var(--ink)}
.intro .sub{margin:12px 0 0;font:400 13px/1.6 var(--ui);color:var(--muted)}
.chartcard{margin:18px 0 6px}
.chartbar .lead{margin:0;display:block}
.chartbar .lead h2{font:600 8.5px/1 var(--ui);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);margin:0 0 7px}
.chartbar .lead p{font:600 15.5px/1.35 var(--display);letter-spacing:-.012em;color:var(--ink);max-width:95ch}
.figsub{margin:2px 0 12px;font:400 11px/1.55 var(--ui);color:var(--muted);max-width:110ch}
.svgbox{position:relative;width:100%}
.kpis.scqa{grid-template-columns:repeat(3,1fr);margin-top:14px}
.kpi p{margin:0;font:400 12.5px/1.6 var(--ui);color:var(--ink)}
ol.answers{list-style:none;counter-reset:a;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:16px;max-width:110ch}
ol.answers li{counter-increment:a;display:grid;grid-template-columns:34px 1fr;gap:6px;font:400 13px/1.65 var(--ui);color:var(--ink)}
ol.answers li::before{content:counter(a);font:600 22px/1 var(--display);color:var(--ink-2);padding-top:2px}
ol.answers b,.obs b{font-weight:600}
.cycle{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.cycle .kpi{display:flex;flex-direction:column;gap:7px;padding-top:12px}
.cycle .kpi h3{margin:0}
.cycle .kpi .v{font:600 16px/1.2 var(--display);letter-spacing:-.015em}
.cycle .kpi p{font-size:11.5px;color:var(--muted)}
.cycle .kpi .fx{margin-top:auto;font:600 11px/1.4 var(--ui);color:var(--ink)}
.cycle .kpi.peak{border-top:2px solid var(--ink)}
.normkpis{grid-template-columns:repeat(4,1fr);margin:6px 0 0}
.normkpis .kpi{border-top:3px solid var(--seg)}
.normkpis .row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.normkpis .lbl2{font:400 10.5px/1.4 var(--ui);color:var(--muted);margin-top:6px}
.normkpis .rng{font:400 10.5px/1.4 var(--ui);color:var(--muted-2);font-variant-numeric:tabular-nums}
.normkpis .all{margin-top:12px;padding-top:8px;border-top:1px solid var(--line);font:400 10.5px/1.5 var(--ui);color:var(--muted)}
.normkpis .all b{color:var(--ink);font-weight:600}
.kpis.quads{grid-template-columns:repeat(4,1fr);margin:18px 0 0}
.kpis.quads .who{display:block;margin-top:10px;font:500 11.5px/1.55 var(--ui)}
.kpis.jlrk,.kpis.riskk{grid-template-columns:repeat(4,1fr);margin:6px 0 0}
.kpis.riskk{margin:6px 0 18px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.sm{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px 18px}
.smcell{min-width:0}
.smhd{display:flex;justify-content:space-between;align-items:baseline;gap:6px;border-bottom:1px solid var(--line);padding-bottom:4px;margin-bottom:2px}
.smhd .n{font:600 11px/1.3 var(--ui);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.smhd .v{font:600 13px/1 var(--display);font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.smhd .v small{font:400 9px/1 var(--ui);color:var(--muted-2);margin-left:3px}
.smt{font:400 9px/1 var(--ui);fill:var(--muted-2);font-variant-numeric:tabular-nums}
.smline{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.smmed{fill:none;stroke:var(--muted-2);stroke-width:1.2;stroke-dasharray:3 3}
.smgrid{stroke:rgba(21,26,40,.07);stroke-width:1}
.smzero{stroke:rgba(21,26,40,.25);stroke-width:1}
.obs{margin:16px 0 8px;padding:2px 0 2px 16px;border-left:2px solid var(--line-strong);max-width:110ch}
.obs .notes-lbl{margin:0 0 10px}
.obs ul{margin:0;padding-left:16px;display:flex;flex-direction:column;gap:10px}
.obs li{font:400 12.5px/1.65 var(--ui);color:var(--ink)}
table.trend td,table#cutstbl td,table.imp td{font-size:11.5px}
.tag{display:inline-block;padding:3px 8px;background:var(--subtle);color:var(--muted);font:600 8.5px/1.2 var(--ui);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.tag.ev{background:var(--accent-tint);color:var(--accent)}
td.up{color:var(--gain)} td.down{color:var(--fall)}
.flag{display:inline-block;margin-left:7px;padding:2px 6px;font:600 8px/1.2 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);background:var(--accent-tint);vertical-align:1px}
.mk{fill:none}
.lblx{font:500 11px/1 var(--ui);fill:var(--ink);paint-order:stroke;stroke:#fff;stroke-width:3.2px;stroke-linejoin:round}
.lead-line{stroke:var(--muted-2);stroke-width:.8;opacity:.7}
.quadlbl{font:600 9px/1 var(--ui);letter-spacing:.18em;text-transform:uppercase;fill:var(--muted)}
.thr{stroke:var(--muted-2);stroke-width:1.2;stroke-dasharray:6 4}
.foot{margin:48px 0 0;padding-top:14px;border-top:1px solid var(--line);font:400 10.5px/1.5 var(--ui);color:var(--muted-2)}
#datatbl td,#srctbl td,#cutsrc td{font-size:11.5px}
@media (max-width:1080px){
  .pair{grid-template-columns:1fr}
  .cycle{grid-template-columns:repeat(2,1fr)}
  .normkpis,.kpis.quads,.kpis.jlrk,.kpis.riskk{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .intro .title{font-size:22px}
  .kpis.scqa,.cycle,.normkpis,.kpis.quads,.kpis.jlrk,.kpis.riskk{grid-template-columns:1fr}
  .normkpis .kpi,.kpis.quads .kpi,.kpis.jlrk .kpi,.kpis.riskk .kpi,.cycle .kpi,.kpis.scqa .kpi{display:block}
  .lblx{font-size:17px;stroke-width:5px}
  .quadlbl{font-size:13px}
  .sm{grid-template-columns:repeat(2,1fr)}
}
button.chip{appearance:none;-webkit-appearance:none}
#mapkey,#matrixkey{margin:0 0 12px}
/* chapter openers: one big name per part of the report */
.segopen{display:flex;flex-direction:column;gap:6px;margin:76px 0 0;border-top:4px solid var(--seg);padding-top:16px}
.segopen .k{font:600 11px/1.4 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.segopen .n{font-family:var(--display);font-size:52px;line-height:1.02;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.segopen + .deck{margin-top:14px}
@media (max-width:700px){.segopen{margin-top:52px}.segopen .n{font-size:36px}}
/* executive-summary answers with a small chart beside each */
ol.answers.sum li{grid-template-columns:34px 1fr 260px;gap:6px 28px;align-items:start;padding-bottom:16px;border-bottom:1px solid #E6EAF0}
ol.answers.sum .minichart{width:260px}
ol.answers.sum .minichart svg{display:block;overflow:visible}
@media (max-width:860px){ol.answers.sum li{grid-template-columns:34px 1fr}ol.answers.sum .minichart{grid-column:2;max-width:320px;width:100%}}
/* footnotes */
sup.fn{font:600 9.5px/1 var(--ui);vertical-align:super;margin-left:1px;white-space:nowrap}
sup.fn a{color:var(--ink-2);text-decoration:none}
sup.fn a:hover{text-decoration:underline}
.reflist{margin:18px 0 0;padding-top:12px;border-top:1px solid #E6EAF0;max-width:110ch}
.reflist ol{margin:6px 0 0;padding-left:28px;columns:2;column-gap:36px;font:400 11.5px/1.6 var(--ui);color:var(--muted)}
.reflist li{break-inside:avoid}
.reflist a{color:var(--ink);text-decoration:none;border-bottom:1px solid #C9D3DF}
.reflist span{color:var(--muted-2)}
@media (max-width:700px){.reflist ol{columns:1}}
/* case sub-headings inside the cases chapter */
.casehead{display:flex;flex-direction:column;gap:3px;margin:56px 0 0;border-top:2px solid var(--seg);padding-top:12px}
.casehead .k{font:600 11px/1.4 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.casehead .n{font-family:var(--display);font-size:32px;line-height:1.1;font-weight:600;color:var(--ink)}
.casehead + .deck{margin-top:10px}
/* how to read this: the model's limits, before any number */
.howto{margin:22px 0 4px;padding:14px 20px 14px 18px;border-left:3px solid var(--ink);background:var(--subtle);max-width:110ch}
.howto ul{margin:6px 0 0;padding-left:18px;font:400 13.5px/1.6 var(--ui);color:var(--ink)}
.howto li+li{margin-top:4px}
/* chapter bar: stays on screen under the masthead, marks the current chapter */
.toc{position:sticky;top:var(--topbar-h,52px);z-index:35;background:var(--paper);border-bottom:1px solid var(--line);
  flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;align-items:center;gap:2px 16px;padding:8px 0;margin:0 0 4px}
.toc::-webkit-scrollbar{display:none}
.toc a{white-space:nowrap;flex:none}
.toc a.on{color:var(--ink);border-bottom-color:var(--ink)}
.toc a.key{margin-left:auto;color:#fff;background:var(--ink);padding:3px 10px;border:0;font-weight:600;letter-spacing:.01em}
.toc a.key::after{content:" →"}
.toc a.key:hover{background:var(--ink-2);color:#fff}
.toc a.key.on{background:var(--ink-2)}
.toc a.key + a{margin-left:0}
#p-report [id]{scroll-margin-top:calc(var(--topbar-h,52px) + 56px)}
.toc a.key{position:sticky;right:0;box-shadow:-14px 0 0 var(--paper)}
.segopen[id]{scroll-margin-top:calc(var(--topbar-h,52px) + 44px)}
/* source lists fold away; the footnote numbers in the text already link straight to each source */
details.reflist summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;user-select:none}
details.reflist summary::-webkit-details-marker{display:none}
details.reflist summary .notes-lbl{margin:0}
details.reflist summary .n{font:600 11px/1 var(--ui);color:var(--muted)}
details.reflist summary .tg{font:400 11.5px/1 var(--ui);color:var(--ink-2);border:1px solid var(--line-strong);padding:4px 9px}
details.reflist summary .tg::after{content:" ↓"}
details.reflist[open] summary .tg{font-size:0}
details.reflist[open] summary .tg::before{content:"Hide ↑";font-size:11.5px}
details.reflist[open] summary .tg::after{content:""}
details.reflist summary:hover .tg{color:var(--ink);border-color:var(--ink)}
