:root{
  --navy:#111827; --ink:#1f2937; --muted:#6b7280; --line:#e5e7eb; --bg:#ffffff; --panel:#f9fafb;
  --coral:#E2543E; --purple:#5B4FC7; --teal:#2BB68F;
  --b-low:#DFF3EA; --b-low-t:#0F6E56;
  --b-emerging:#FDF2D7; --b-emerging-t:#854F0B;
  --b-material:#FBE3C9; --b-material-t:#9A5410;
  --b-high:#F8D2C4; --b-high-t:#993C1D;
  --b-vhigh:#F5C1C1; --b-vhigh-t:#791F1F;
  --b-insuff:#EEF0F2; --b-insuff-t:#5F6570;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);line-height:1.55}
.wrap{max-width:960px;margin:0 auto;padding:0 20px}
.site-head{background:var(--navy);color:#fff}
.head-row{display:flex;align-items:center;justify-content:space-between;padding:14px 20px}
.wordmark{color:#fff;text-decoration:none;font-weight:700;font-size:22px;letter-spacing:.2px}
.wm-g{color:var(--teal)} .wm-dot{color:var(--coral)}
.site-head nav a{color:#d1d5db;text-decoration:none;margin-left:18px;font-size:14px}
.site-head nav a:hover{color:#fff}
.site-head nav a.cta{background:var(--teal);color:#04342C;padding:7px 12px;border-radius:6px;font-weight:700}
main{padding:34px 20px 60px}
h1{font-size:30px;margin:.2em 0 .4em} h2{font-size:21px;margin:1.4em 0 .5em}
.eyebrow{color:var(--coral);font-size:12px;letter-spacing:2px;font-weight:700;text-transform:uppercase}
.lead{color:var(--muted);max-width:64ch}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px 20px;margin:18px 0}
.btn{display:inline-block;background:var(--navy);color:#fff;padding:11px 18px;border-radius:8px;text-decoration:none;font-weight:700;border:0;font-size:15px;cursor:pointer}
.btn.teal{background:var(--teal);color:#04342C}
label{display:block;font-weight:700;font-size:14px;margin:14px 0 4px}
input[type=text],input[type=email],select,textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:7px;font-size:15px;font-family:inherit}
.fine{color:var(--muted);font-size:12px}
.site-foot{border-top:1px solid var(--line);padding:18px 0;color:var(--muted);font-size:13px}
.site-foot a{color:var(--muted)}
.progress{height:8px;background:var(--line);border-radius:4px;margin:10px 0 24px}
.progress i{display:block;height:8px;background:var(--teal);border-radius:4px}
.q{border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:14px 0}
.q p.qt{margin:0 0 10px;font-weight:700;font-size:15px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts label{display:flex;align-items:center;gap:6px;font-weight:400;font-size:13px;margin:0;border:1px solid var(--line);border-radius:7px;padding:7px 10px;cursor:pointer}
.opts label.nee{border-style:dashed;color:var(--muted)}
.mech-band{border-radius:8px;color:#fff;font-weight:700;font-size:13px;padding:7px 12px;margin:22px 0 10px}
.mech-band.Human{background:var(--coral)} .mech-band.Organisational{background:var(--purple)} .mech-band.Delivery{background:var(--teal)}
/* heatmap */
.hm-dim{margin:26px 0 8px;font-weight:700;font-size:14px;letter-spacing:1px;text-transform:uppercase}
.hm-dim.Human{color:var(--coral)} .hm-dim.Organisational{color:var(--purple)} .hm-dim.Delivery{color:var(--teal)}
.hm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.cell{border-radius:9px;padding:12px 14px;min-height:86px;position:relative;border:1px solid rgba(0,0,0,.06)}
.cell .code{font-size:11px;font-weight:700;letter-spacing:1px;opacity:.75}
.cell .nm{font-weight:700;font-size:14px;margin:2px 0 6px}
.cell .bd{font-size:12px;font-weight:700}
.cell .mk{font-size:11px;margin-top:6px}
.band-LowExposure{background:var(--b-low);color:var(--b-low-t)}
.band-EmergingConcern{background:var(--b-emerging);color:var(--b-emerging-t)}
.band-MaterialConcern{background:var(--b-material);color:var(--b-material-t)}
.band-HighConcern{background:var(--b-high);color:var(--b-high-t)}
.band-VeryHighConcern{background:var(--b-vhigh);color:var(--b-vhigh-t)}
.band-InsufficientEvidence{background:repeating-linear-gradient(45deg,var(--b-insuff),var(--b-insuff) 8px,#e4e7ea 8px,#e4e7ea 16px);color:var(--b-insuff-t)}
.legend{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.legend span{font-size:12px;padding:5px 10px;border-radius:6px;font-weight:700}
.macro{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin:12px 0}
.macro .m{border:1px solid var(--line);border-radius:9px;padding:12px 14px}
.macro .m b{display:block;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.macro .m .r{font-size:18px;font-weight:700;margin:4px 0}
.macro .m .why{font-size:12px;color:var(--muted)}
.claims{border-left:4px solid var(--coral);background:var(--panel);padding:14px 18px;border-radius:0 9px 9px 0;margin:26px 0;font-size:14px}
table.reg{width:100%;border-collapse:collapse;font-size:14px}
table.reg th,table.reg td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
table.reg th{background:var(--panel)}
.notice{background:#eef4ff;border:1px solid #c6d6f5;border-radius:8px;padding:12px 16px;font-size:14px}
.err{background:#fdecec;border:1px solid #f5c1c1;border-radius:8px;padding:12px 16px;font-size:14px;color:#791F1F}

/* v2 heatmap: at-a-glance strip + segmented band meters */
.f-low{background:#5DCAA5} .f-emerging{background:#FAC775} .f-material{background:#EF9F27} .f-high{background:#E24B4A} .f-vhigh{background:#A32D2D}
/* insufficient evidence: hatched in both themes (was missing entirely, so pills rendered invisible) */
.f-insuff{background:repeating-linear-gradient(45deg,#D3D1C7,#D3D1C7 5px,#F1EFE8 5px,#F1EFE8 10px)}
.t-low{color:#0F6E56} .t-emerging{color:#854F0B} .t-material{color:#9A5410} .t-high{color:#A32D2D} .t-vhigh{color:#791F1F} .t-insuff{color:#5F5E5A}
.lt-low{color:#04342C} .lt-emerging{color:#633806} .lt-material{color:#412402} .lt-high{color:#FCEBEB} .lt-vhigh{color:#FCEBEB}
.seg-insuff{background:repeating-linear-gradient(45deg,#D3D1C7,#D3D1C7 5px,#F1EFE8 5px,#F1EFE8 10px)}
.strip{display:grid;grid-template-columns:repeat(17,1fr);gap:4px;margin:6px 0 4px}
.strip-cell{height:36px;border-radius:4px}
.strip-cell.exp{outline:2px dashed rgba(0,0,0,.35);outline-offset:-3px}
.strip-labels{display:grid;grid-template-columns:repeat(17,1fr);gap:4px;margin-bottom:8px}
.strip-labels span{font-size:10px;color:var(--muted);text-align:center}
.mgroup{border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:6px}
.mrow{display:flex;align-items:center;gap:14px;padding:10px 14px;border-bottom:1px solid var(--line)}
.mgroup .mrow:last-child{border-bottom:0}
.mcode{font-size:12px;color:var(--muted);width:28px;flex:none}
.mname{font-size:14px;font-weight:700;flex:1;min-width:0}
.tag-exp{font-size:11px;font-weight:400;color:var(--muted);border:1px dashed #c9cdd3;border-radius:4px;padding:1px 7px;margin-left:8px;white-space:nowrap}
.tag-partial{color:var(--muted);font-weight:700;margin-left:6px}
.meter{display:flex;gap:3px;flex:none}
.meter .seg{width:22px;height:10px;border-radius:2px;background:#fff;border:1px solid var(--line)}
.meter .seg[class*=" f-"],.meter .seg.seg-insuff{border:0;width:24px;height:12px}
.mband{font-size:12px;font-weight:700;width:140px;text-align:right;flex:none}
.legend .lp{font-size:11px;font-weight:700;padding:4px 11px;border-radius:999px}
@media (max-width:640px){
  .mrow{flex-wrap:wrap;gap:8px}
  .mband{width:auto}
  .strip-cell{height:24px}
}

/* v2.1: meter fill specificity fix (fills must outrank the base segment rule) */
.meter .seg.f-low{background:#5DCAA5}
.meter .seg.f-emerging{background:#FAC775}
.meter .seg.f-material{background:#EF9F27}
.meter .seg.f-high{background:#E24B4A}
.meter .seg.f-vhigh{background:#A32D2D}
.meter .seg.seg-insuff{background:repeating-linear-gradient(45deg,#D3D1C7,#D3D1C7 5px,#F1EFE8 5px,#F1EFE8 10px)}

/* v2.2: macro lens meters */
.mmeter{margin:2px 0 8px}
.macro .m .r{margin:4px 0 2px}

/* v2.3: gradient pill bars replacing segmented meters (site-brand gradient; length encodes band level) */
.gbar{display:block;width:130px;height:12px;border-radius:999px;background:#e8eaee;overflow:hidden;flex:none}
.gbar i{display:block;height:100%;border-radius:999px;background-image:linear-gradient(90deg,#2BB68F 0%,#5DCAA5 18%,#FAC775 38%,#EF9F27 58%,#E24B4A 80%,#A32D2D 100%);background-position:0 0;background-repeat:no-repeat}
.gbar-m{width:100%;max-width:170px;margin:2px 0 8px}
.gbar-insuff{background:repeating-linear-gradient(45deg,#D3D1C7,#D3D1C7 5px,#F1EFE8 5px,#F1EFE8 10px)}
.mrow .gbar{margin-left:auto;margin-right:14px}

/* v2.5: strength-polarity lenses run the gradient inverted: adversity on the left, health on the right */
.gbar-strength i{background-image:linear-gradient(90deg,#A32D2D 0%,#E24B4A 20%,#EF9F27 42%,#FAC775 62%,#5DCAA5 82%,#2BB68F 100%)}

/* v2.6: dark mode, keyed to the site's dx-theme preference */
.theme-toggle{background:none;border:1px solid rgba(255,255,255,.35);color:#d1d5db;border-radius:6px;padding:4px 9px;margin-left:14px;cursor:pointer;font-size:14px;line-height:1}
.theme-toggle:hover{color:#fff;border-color:#fff}
[data-theme="dark"] body{background:#0f1420;color:#e5e7eb}
[data-theme="dark"] .site-head{background:#0a0e18}
[data-theme="dark"] h1,[data-theme="dark"] h2{color:#f3f4f6}
[data-theme="dark"] .lead,[data-theme="dark"] .fine,[data-theme="dark"] .why,[data-theme="dark"] .mcode,[data-theme="dark"] .strip-labels span{color:#9ca3af}
[data-theme="dark"] .panel,[data-theme="dark"] .claims{background:#171e2e;border-color:#2a3346;color:#e5e7eb}
[data-theme="dark"] .macro .m,[data-theme="dark"] .mgroup,[data-theme="dark"] .q{background:#141a29;border-color:#2a3346}
[data-theme="dark"] .mrow{border-color:#2a3346}
[data-theme="dark"] .mname{color:#e5e7eb}
[data-theme="dark"] .macro .m b{color:#9ca3af}
[data-theme="dark"] input[type=text],[data-theme="dark"] input[type=email],[data-theme="dark"] input[type=password],[data-theme="dark"] select,[data-theme="dark"] textarea{background:#0f1420;border-color:#2a3346;color:#e5e7eb}
[data-theme="dark"] .opts label{border-color:#2a3346;color:#d1d5db}
[data-theme="dark"] .btn{background:#e5e7eb;color:#111827}
[data-theme="dark"] .btn.teal{background:var(--teal);color:#04342C}
[data-theme="dark"] .gbar{background:#232b3d}
[data-theme="dark"] .meter .seg{background:#0f1420;border-color:#2a3346}
[data-theme="dark"] .gbar-insuff,[data-theme="dark"] .seg-insuff{background:repeating-linear-gradient(45deg,#2a3346,#2a3346 5px,#1a2233 5px,#1a2233 10px)}
[data-theme="dark"] .t-low{color:#5DCAA5}[data-theme="dark"] .t-emerging{color:#FAC775}[data-theme="dark"] .t-material{color:#EF9F27}[data-theme="dark"] .t-high{color:#F09595}[data-theme="dark"] .t-vhigh{color:#F7C1C1}[data-theme="dark"] .t-insuff{color:#9ca3af}
[data-theme="dark"] .band-InsufficientEvidence{color:#9ca3af}
[data-theme="dark"] .site-foot{border-color:#2a3346;color:#9ca3af}
[data-theme="dark"] .site-foot a{color:#9ca3af}
[data-theme="dark"] table.reg th{background:#171e2e}
[data-theme="dark"] table.reg th,[data-theme="dark"] table.reg td{border-color:#2a3346}
[data-theme="dark"] .notice{background:#132036;border-color:#28436b;color:#cfe0f5}
[data-theme="dark"] .err{background:#2e1516;border-color:#5c2a2a;color:#f5c1c1}
[data-theme="dark"] .progress{background:#232b3d}
[data-theme="dark"] .strip-cell.exp{outline-color:rgba(255,255,255,.45)}

/* v2.7: readable links in dark mode (default browser blue disappears on navy) */
[data-theme="dark"] main a{color:#7FD4B8}
[data-theme="dark"] main a:hover{color:#A8E6D0}
[data-theme="dark"] main a:visited{color:#7FD4B8}
[data-theme="dark"] .btn,[data-theme="dark"] .btn:visited{color:#111827}
[data-theme="dark"] .btn.teal,[data-theme="dark"] .btn.teal:visited{color:#04342C}

/* v2.8: form fields legible in dark mode (visible borders, matching widths, native styling suppressed) */
[data-theme="dark"] input[type=text],
[data-theme="dark"] input[type=email],
[data-theme="dark"] input[type=password],
[data-theme="dark"] select,
[data-theme="dark"] textarea{
  background:#1a2233;border:1px solid #3a4560;color:#e5e7eb;
  -webkit-appearance:none;appearance:none;box-shadow:none;
}
input[type=password]{width:100%;padding:10px;border:1px solid var(--line);border-radius:7px;font-size:15px;font-family:inherit}
[data-theme="dark"] input:focus,[data-theme="dark"] select:focus,[data-theme="dark"] textarea:focus{outline:none;border-color:var(--teal)}

/* v2.9: resting field borders bright enough to read without focus */
[data-theme="dark"] input[type=text],
[data-theme="dark"] input[type=email],
[data-theme="dark"] input[type=password],
[data-theme="dark"] select,
[data-theme="dark"] textarea{background:#1e2740;border-color:#5a6785}

/* v3.0: lead paragraphs use the full content width (64ch cap removed) */
.lead{max-width:none}

/* v3.1: at-a-glance strip as mini pills, matching the page's bar language */
.strip{gap:8px;margin:6px 0 4px}
.strip-cell{height:14px;border-radius:999px}
.strip-cell.exp{outline:2px dashed rgba(0,0,0,.3);outline-offset:2px}
[data-theme="dark"] .strip-cell.exp{outline-color:rgba(255,255,255,.45)}
.strip-labels{gap:8px}
@media (max-width:640px){.strip-cell{height:12px}}

/* v3.2: at-a-glance pills grouped by dimension with coloured group rules */
.strip2{display:flex;gap:26px;margin:6px 0 10px}
.sgroup{display:flex;flex-direction:column;min-width:0}
.spills{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px}
.slabels{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;margin-top:5px}
.slabels span{font-size:10px;color:var(--muted);text-align:center}
.srule{height:3px;border-radius:2px;margin-top:7px;opacity:.85}
.srule.Human{background:var(--coral)} .srule.Organisational{background:var(--purple)} .srule.Delivery{background:var(--teal)}
.sname{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;font-weight:700;margin-top:5px;text-align:center}
.sname.Human{color:var(--coral)} .sname.Organisational{color:var(--purple)} .sname.Delivery{color:var(--teal)}
@media (max-width:640px){.strip2{flex-direction:column;gap:14px}}

/* v3.3: client-visible execution state (scoring rules v1.1) and adverse tile weighting */
.state-banner{display:flex;align-items:flex-start;gap:14px;border-radius:10px;padding:14px 18px;margin:18px 0}
.state-banner.state-pressured{background:#FBF3E3;border:1px solid #EAD3A8}
.state-banner.state-controlled{background:#E9F7F1;border:1px solid #BDE5D5}
.state-pill{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:5px 13px;border-radius:999px;flex:none}
.state-pressured .state-pill{background:#EF9F27;color:#412402}
.state-controlled .state-pill{background:#5DCAA5;color:#04342C}
.state-why{font-size:14px;line-height:1.55}
.state-pressured .state-why{color:#633806}
.state-controlled .state-why{color:#085041}
.macro .m.m-adverse{border-left:4px solid #C24E22;background:#FDF8F3}
[data-theme="dark"] .state-banner.state-pressured{background:#2b2210;border-color:#5a4620}
[data-theme="dark"] .state-banner.state-controlled{background:#0f2a22;border-color:#1d5a45}
[data-theme="dark"] .state-pressured .state-why{color:#FAC775}
[data-theme="dark"] .state-controlled .state-why{color:#9FE1CB}
[data-theme="dark"] .macro .m.m-adverse{background:#241a12;border-left-color:#E24B4A}

/* v3.4: section framing lines */
.sect-frame{font-size:14px;margin:-4px 0 14px}

/* v3.5: strength-polarity lenses use a solid fill in the state's own colour */
.gbar i.solid{background-image:none}
.gbar i.solid.f-low{background-color:#5DCAA5}
.gbar i.solid.f-emerging{background-color:#FAC775}
.gbar i.solid.f-high{background-color:#E24B4A}
.gbar i.solid.f-vhigh{background-color:#A32D2D}

/* v3.6: app header layout on small screens */
@media (max-width:740px){
  .head-row{flex-direction:column;align-items:flex-start;gap:10px;padding:12px 16px}
  .wordmark{font-size:20px}
  .site-head nav{display:flex;flex-wrap:wrap;align-items:center;gap:9px 16px}
  .site-head nav a{margin-left:0;font-size:13px;white-space:nowrap}
  .site-head nav a.cta{padding:6px 11px}
  .theme-toggle{margin-left:0}
}

/* v4.0: narrative line, populated signature diagram, and page reveal motion */
.narrative{font-size:19px;line-height:1.5;color:var(--ink);margin:6px 0 2px;font-weight:700}
[data-theme="dark"] .narrative{color:#f3f4f6}
.dgwrap{margin:20px 0 6px}
.dg{display:block;width:100%}
.dgbox{stroke:rgba(0,0,0,.12)}
.dg .f-insuff{fill:#EEF0F2}
.dg .f-low{fill:#5DCAA5}.dg .f-emerging{fill:#FAC775}.dg .f-material{fill:#EF9F27}.dg .f-high{fill:#E24B4A}.dg .f-vhigh{fill:#A32D2D}
.dgt{font-size:12px;font-weight:700;text-anchor:middle;fill:#1f2937}
.dgr{font-size:12px;text-anchor:middle;fill:#1f2937}
.dg .f-high + .dgt, .dg .f-vhigh + .dgt{fill:#fff}
.dgbox.f-high ~ text{fill:#1f2937}
.dgop{font-size:22px;font-weight:700;text-anchor:middle;fill:var(--muted)}
.dgdiv{stroke:#9ca3af;stroke-width:2}
.dgarrow,.dgloop{fill:none;stroke:#9ca3af;stroke-width:2}
.dgloop{stroke-dasharray:5 4}
.dgahp{fill:#9ca3af}
.dgl{font-size:11px;text-anchor:middle;fill:var(--muted)}
.dgstate.state-controlled{fill:#9FE1CB}
.dgstate.state-pressured{fill:#FAC775}
.dgcap{max-width:none}
[data-theme="dark"] .dgt,[data-theme="dark"] .dgr{fill:#0f1420}
[data-theme="dark"] .dgl{fill:#9ca3af}
[data-theme="dark"] .dgbox{stroke:rgba(255,255,255,.15)}
[data-theme="dark"] .dg .f-insuff{fill:#2a3346}

/* motion: reveal, staggered, honouring reduced-motion */
@keyframes ter-grow{from{width:0}}
@keyframes ter-pop{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes ter-fade{from{opacity:0}to{opacity:1}}
.gbar i{animation:ter-grow .6s cubic-bezier(.2,.7,.3,1) backwards}
.strip-cell{animation:ter-pop .4s ease-out backwards}
.spills .strip-cell:nth-child(1){animation-delay:.05s}.spills .strip-cell:nth-child(2){animation-delay:.09s}
.spills .strip-cell:nth-child(3){animation-delay:.13s}.spills .strip-cell:nth-child(4){animation-delay:.17s}
.spills .strip-cell:nth-child(5){animation-delay:.21s}.spills .strip-cell:nth-child(6){animation-delay:.25s}
.spills .strip-cell:nth-child(7){animation-delay:.29s}
.state-banner{animation:ter-fade .5s ease-out .35s backwards}
.narrative{animation:ter-fade .45s ease-out backwards}
.macro .m{animation:ter-pop .4s ease-out backwards}
.macro .m:nth-child(2){animation-delay:.06s}.macro .m:nth-child(3){animation-delay:.12s}.macro .m:nth-child(4){animation-delay:.18s}
.dgwrap{animation:ter-fade .5s ease-out .2s backwards}
@media (prefers-reduced-motion: reduce){
  .gbar i,.strip-cell,.state-banner,.narrative,.macro .m,.dgwrap{animation:none}
}

/* v4.1: wide-canvas diagram; readable text at full width, panning on small screens */
.dgt{font-size:15px}
.dgr{font-size:14px}
.dgop{font-size:26px}
.dgl{font-size:13px}
@media (max-width:640px){
  .dgwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .dg{min-width:680px}
}

/* v5.0: polish pass — typography, masthead, depth, brand accent, exhibit panel */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Source+Sans+3:wght@400;500;600;700&display=swap');
body{font-family:'Source Sans 3',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
h1,h2,.wordmark,.mname,.state-pill,.mband,.macro .m .r,.narrative,.legend .lp,.sname{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
h2{font-size:22px;letter-spacing:-.01em;margin:1.6em 0 .5em}
.eyebrow{letter-spacing:2.5px}

/* masthead */
.fullbleed{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.masthead{background:#111827;color:#e5e7eb;padding:34px 0 30px;margin-top:-34px;margin-bottom:30px;border-top:3px solid transparent;border-image:linear-gradient(90deg,#2BB68F,#8A55C9,#E24B4A,#F07E22) 1}
.masthead .eyebrow{color:#F19B86}
.mast-title{color:#fff;font-size:34px;font-weight:800;letter-spacing:-.02em;margin:.15em 0 .35em}
.title-rule{height:3px;width:96px;border-radius:2px;background:linear-gradient(90deg,#2BB68F,#8A55C9,#E24B4A,#F07E22);margin:0 0 16px}
.mast-lead{color:#b8bfca;max-width:70ch}
.mast-narrative{color:#f3f4f6;font-size:20px;margin-top:10px}
.masthead .state-banner{margin-bottom:0}
.masthead .state-banner.state-pressured{background:rgba(239,159,39,.13);border-color:rgba(239,159,39,.45)}
.masthead .state-banner.state-controlled{background:rgba(93,202,165,.12);border-color:rgba(93,202,165,.4)}
.masthead .state-pressured .state-why{color:#FAC775}
.masthead .state-controlled .state-why{color:#9FE1CB}
[data-theme="dark"] .masthead{background:#0a0e18}

/* depth instead of borders */
.macro .m,.mgroup,.state-banner,.q,.panel{border-color:rgba(17,24,39,.06);box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06);border-radius:12px}
.macro .m.m-adverse{box-shadow:0 1px 2px rgba(194,78,34,.08),0 4px 14px rgba(194,78,34,.12)}
[data-theme="dark"] .macro .m,[data-theme="dark"] .mgroup,[data-theme="dark"] .state-banner,[data-theme="dark"] .q,[data-theme="dark"] .panel{box-shadow:0 1px 2px rgba(0,0,0,.4),0 6px 18px rgba(0,0,0,.35);border-color:rgba(255,255,255,.06)}

/* exhibit panel for the signature diagram */
.dgpanel{background:linear-gradient(180deg,#fafbfc,#f3f5f8);border:1px solid rgba(17,24,39,.05);border-radius:14px;padding:26px 26px 14px;box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.dgcap-in{margin:10px 4px 6px}
.dgbox{filter:drop-shadow(0 2px 3px rgba(17,24,39,.18))}
[data-theme="dark"] .dgpanel{background:linear-gradient(180deg,#141a29,#10151f);border-color:rgba(255,255,255,.06)}

/* v5.1: masthead as a contained hero card (kills the stray boundary line and separates it from the nav) */
.fullbleed{margin-left:0;margin-right:0}
.masthead{position:relative;overflow:hidden;border-radius:16px;margin:8px 0 30px;padding:30px 28px 26px;
  background:linear-gradient(180deg,#151E36,#101828);border:none;border-top:none;border-image:none;
  box-shadow:0 2px 4px rgba(17,24,39,.12),0 10px 30px rgba(17,24,39,.18)}
.masthead::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,#2BB68F,#8A55C9,#E24B4A,#F07E22)}
.masthead .wrap{max-width:none;width:auto;margin:0;padding:0}
.masthead{margin-top:8px}
[data-theme="dark"] .masthead{background:linear-gradient(180deg,#151E36,#0d1322);box-shadow:0 2px 4px rgba(0,0,0,.5),0 12px 34px rgba(0,0,0,.45)}
@media (max-width:640px){.masthead{padding:22px 18px 20px;border-radius:13px}}

/* v5.2: mobile-native formula (the wide SVG hides on small screens) */
.dgm{display:none}
@media (max-width:640px){
  .dg{display:none;min-width:0}
  .dgwrap{overflow-x:visible}
  .dgm{display:flex;flex-direction:column;align-items:center;gap:12px;padding:4px 0 6px}
  .dgm-row{display:flex;align-items:center;gap:12px;width:100%;justify-content:center}
  .dgm-box{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 16px;border-radius:10px;min-width:120px;
    box-shadow:0 2px 4px rgba(17,24,39,.15)}
  .dgm-box b{font-size:13px;font-family:'Inter',sans-serif}
  .dgm-box i{font-style:normal;font-size:12px}
  .dgm-box.f-low{background:#5DCAA5;color:#0b2b21}
  .dgm-box.f-emerging{background:#FAC775;color:#3d2a05}
  .dgm-box.f-material{background:#EF9F27;color:#3d2a05}
  .dgm-box.f-high{background:#E24B4A;color:#fff}
  .dgm-box.f-vhigh{background:#A32D2D;color:#fff}
  .dgm-box.f-insuff{background:#EEF0F2;color:#4b5563}
  .dgm-state.state-controlled{background:#9FE1CB;color:#04342C}
  .dgm-state.state-pressured{background:#FAC775;color:#412402}
  .dgm-op{font-size:20px;font-weight:700;color:var(--muted)}
  .dgm-div{height:2px;background:#9ca3af;border-radius:2px;width:82%}
  .dgm-arrow{font-size:20px;color:var(--muted);line-height:1}
  .dgm-loop{font-size:12px;color:var(--muted)}
  [data-theme="dark"] .dgm-box.f-insuff{background:#2a3346;color:#9ca3af}
}

/* v5.3: mechanism rows stack on small screens (name line, then full-width bar) */
@media (max-width:640px){
  .mrow{display:grid;grid-template-columns:32px 1fr auto;grid-template-areas:"code name band" "code bar bar";
    row-gap:9px;column-gap:10px;align-items:start;padding:12px 10px}
  .mcode{grid-area:code;padding-top:1px}
  .mname{grid-area:name}
  .mband{grid-area:band;width:auto;text-align:right;white-space:nowrap;padding-top:1px}
  .mrow .gbar{grid-area:bar;width:100%;margin:0}
}

/* v5.4: neutral state when evidence is insufficient, and visible hatching in dark mode */
.state-banner.state-not-assessed{background:#f3f4f6;border:1px solid #d8dce2}
.state-not-assessed .state-pill{background:#9ca3af;color:#111827}
.state-not-assessed .state-why{color:#4b5563}
.dgstate.state-not-assessed{fill:#D3D7DE}
.dgm-state.state-not-assessed{background:#D3D7DE;color:#374151}
[data-theme="dark"] .state-banner.state-not-assessed{background:#1b2233;border-color:#39435c}
[data-theme="dark"] .state-not-assessed .state-why{color:#c2c8d4}
[data-theme="dark"] .dgstate.state-not-assessed{fill:#4a5568}
[data-theme="dark"] .masthead .state-banner.state-not-assessed{background:rgba(156,163,175,.16);border-color:rgba(156,163,175,.45)}
[data-theme="dark"] .masthead .state-not-assessed .state-why{color:#d7dbe3}
/* strip pills: insufficient evidence must stay visible on dark backgrounds */
[data-theme="dark"] .strip-cell.f-insuff{background:repeating-linear-gradient(45deg,#4a5568,#4a5568 5px,#2c3448 5px,#2c3448 10px)}
[data-theme="dark"] .gbar-insuff{background:repeating-linear-gradient(45deg,#4a5568,#4a5568 5px,#2c3448 5px,#2c3448 10px)}

/* v5.5: adversity-driven diagram colours and graded Pressured severity */
.dgsub{font-size:10px;text-anchor:middle;fill:#4b5563}
[data-theme="dark"] .dgsub{fill:#374151}
/* graded verdict: one adverse condition is amber, three or more is red */
.dgstate.state-pressured.sev-warn{fill:#FAC775}
.dgstate.state-pressured.sev-severe{fill:#E24B4A}
.dgm-state.state-pressured.sev-warn{background:#FAC775;color:#412402}
.dgm-state.state-pressured.sev-severe{background:#E24B4A;color:#fff}
.state-banner.state-pressured.sev-severe{background:#FDECEC;border-color:#F0BDBD}
.state-pressured.sev-severe .state-pill{background:#E24B4A;color:#fff}
.state-pressured.sev-severe .state-why{color:#7f1d1d}
[data-theme="dark"] .state-banner.state-pressured.sev-severe{background:#2b1414;border-color:#5c2a2a}
[data-theme="dark"] .state-pressured.sev-severe .state-why{color:#F5B8B8}
[data-theme="dark"] .masthead .state-banner.state-pressured.sev-severe{background:rgba(226,75,74,.15);border-color:rgba(226,75,74,.5)}
[data-theme="dark"] .masthead .state-pressured.sev-severe .state-why{color:#F5B8B8}

/* v5.6: evidence loop drawn as a lens, and the materially-exposed baseline state */
.dgloop.loop-low{stroke:#2BB68F}
.dgloop.loop-material{stroke:#EF9F27}
.dgloop.loop-vhigh{stroke:#E24B4A}
.dgloop.loop-insuff{stroke:#9ca3af}
.dgahp.ahp-low{fill:#2BB68F} .dgahp.ahp-material{fill:#EF9F27} .dgahp.ahp-vhigh{fill:#E24B4A} .dgahp.ahp-insuff{fill:#9ca3af}
.dgl.lbl-low{fill:#0b6b52;font-weight:600}
.dgl.lbl-material{fill:#8a5200;font-weight:600}
.dgl.lbl-vhigh{fill:#a32d2d;font-weight:600}
[data-theme="dark"] .dgl.lbl-low{fill:#1a7d60}
[data-theme="dark"] .dgl.lbl-material{fill:#8a5200}
[data-theme="dark"] .dgl.lbl-vhigh{fill:#a32d2d}
.dgm-loop.lbl-low{color:#0b6b52;font-weight:600}
.dgm-loop.lbl-material{color:#8a5200;font-weight:600}
.dgm-loop.lbl-vhigh{color:#a32d2d;font-weight:600}
/* materially exposed shares the severe palette */
.dgstate.state-materially-exposed{fill:#E24B4A}
.dgm-state.state-materially-exposed{background:#E24B4A;color:#fff}
.state-banner.state-materially-exposed{background:#FDECEC;border-color:#F0BDBD}
.state-materially-exposed .state-pill{background:#E24B4A;color:#fff}
.state-materially-exposed .state-why{color:#7f1d1d}
[data-theme="dark"] .state-banner.state-materially-exposed{background:#2b1414;border-color:#5c2a2a}
[data-theme="dark"] .state-materially-exposed .state-why{color:#F5B8B8}
[data-theme="dark"] .masthead .state-banner.state-materially-exposed{background:rgba(226,75,74,.15);border-color:rgba(226,75,74,.5)}
[data-theme="dark"] .masthead .state-materially-exposed .state-why{color:#F5B8B8}

/* v5.7: banner reason list reads as sentences */
.state-why b{display:block;margin-bottom:4px}

/* v5.8: expandable artefact guidance in the practitioner workspace */
.art-detail{margin-top:8px;border-top:1px solid rgba(17,24,39,.07);padding-top:6px}
.art-detail summary{cursor:pointer;font-size:13px;font-weight:600;color:#0b6b52;list-style:none}
.art-detail summary::-webkit-details-marker{display:none}
.art-detail summary::before{content:'\25B8 ';color:#9ca3af}
.art-detail[open] summary::before{content:'\25BE '}
.art-detail p{margin:8px 0}
[data-theme="dark"] .art-detail{border-color:rgba(255,255,255,.08)}
[data-theme="dark"] .art-detail summary{color:#7FD4B8}

/* v6.0: research evidence page */
.statbar{display:flex;gap:14px;flex-wrap:wrap;margin:14px 0 6px}
.statbar div{flex:1 1 150px;background:var(--panel,#f9fafb);border-radius:12px;padding:14px 16px;
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.statbar b{display:block;font-family:'Inter',sans-serif;font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1}
.statbar span{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1.2px;margin-top:6px}
[data-theme="dark"] .statbar div{background:#141a29}

.casegrid{margin:12px 0 8px;border-radius:12px;overflow:hidden;
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.cg-head,.cg-row{display:grid;grid-template-columns:1.15fr 1fr .85fr .95fr 1.1fr 1.7fr;gap:1px;align-items:stretch}
.cg-head span{background:#f3f4f6;font-size:11px;text-transform:uppercase;letter-spacing:1.1px;font-weight:700;color:#4b5563;padding:10px 12px}
.cg-row span{background:#fff;padding:11px 12px;font-size:13px;display:flex;align-items:center}
.cg-row.cg-success span{background:#fbfefc}
.cg-case{flex-direction:column!important;align-items:flex-start!important;gap:3px}
.cg-tag{font-style:normal;font-size:10px;text-transform:uppercase;letter-spacing:.8px;font-weight:700;
  color:#0b6b52;background:#dff3ea;border-radius:999px;padding:2px 7px}
.cg-cell{font-weight:600}
.cg-cell.f-low{background:#e9f7f1!important;color:#08513f}
.cg-cell.f-emerging{background:#fdf4e0!important;color:#6b4708}
.cg-cell.f-material{background:#fbeacd!important;color:#7a4a05}
.cg-cell.f-high{background:#fbe0de!important;color:#8f2320}
.cg-cell.f-vhigh{background:#f6cfcd!important;color:#6f1a18}
.cg-outcome,.cg-pattern{color:var(--muted);font-size:12.5px}
[data-theme="dark"] .cg-head span{background:#171e2e;color:#9ca3af}
[data-theme="dark"] .cg-row span{background:#121826}
[data-theme="dark"] .cg-row.cg-success span{background:#101a18}
[data-theme="dark"] .cg-cell.f-low{background:#0f2a22!important;color:#9FE1CB}
[data-theme="dark"] .cg-cell.f-emerging{background:#2b2210!important;color:#FAC775}
[data-theme="dark"] .cg-cell.f-material{background:#33240c!important;color:#EF9F27}
[data-theme="dark"] .cg-cell.f-high{background:#2e1516!important;color:#F09595}
[data-theme="dark"] .cg-cell.f-vhigh{background:#3a1414!important;color:#F7C1C1}
[data-theme="dark"] .cg-tag{background:#123a2c;color:#9FE1CB}

.cardgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin:12px 0}
.ccard{background:var(--panel,#f9fafb);border-radius:12px;padding:14px 16px;
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.ccard b{font-family:'Inter',sans-serif;font-size:14px}
.ccard p{margin:6px 0 0;font-size:13px;color:var(--muted);line-height:1.5}
[data-theme="dark"] .ccard{background:#141a29}

.boundary{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin:12px 0}
.bx{border-radius:12px;padding:14px 16px;background:var(--panel,#f9fafb);
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.bx-does{border-left:4px solid #2BB68F}
.bx-not{border-left:4px solid #C24E22}
.bx b{display:block;font-family:'Inter',sans-serif;font-size:14px;margin-bottom:5px}
.bx p{margin:0;font-size:13px;color:var(--muted);line-height:1.55}
[data-theme="dark"] .bx{background:#141a29}

.sources{margin:16px 0;background:var(--panel,#f9fafb);border-radius:12px;padding:12px 16px}
.sources summary{cursor:pointer;font-weight:600;font-family:'Inter',sans-serif;font-size:14px;list-style:none;color:#0b6b52}
.sources summary::-webkit-details-marker{display:none}
.sources summary::before{content:'\25B8 ';color:#9ca3af}
.sources[open] summary::before{content:'\25BE '}
.reflist{margin:10px 0 4px 20px;padding:0}
.reflist li{font-size:12.5px;color:var(--muted);line-height:1.55;margin-bottom:6px}
[data-theme="dark"] .sources{background:#141a29}
[data-theme="dark"] .sources summary{color:#7FD4B8}

@media (max-width:820px){
  .cg-head{display:none}
  .cg-row{grid-template-columns:1fr;gap:0;margin-bottom:10px;border-radius:10px;overflow:hidden}
  .cg-row span{padding:9px 12px}
  .cg-cell::before{content:attr(data-label);font-weight:400;color:var(--muted);
    text-transform:uppercase;font-size:10px;letter-spacing:1px;margin-right:8px}
}

/* v6.1: subtle dimension and condition colour coding */
.dimhead{position:relative;padding-left:14px}
.dimhead::before{content:'';position:absolute;left:0;top:.15em;bottom:.15em;width:4px;border-radius:2px}
.dimhead.dim-human::before{background:var(--coral,#D85A30)}
.dimhead.dim-organisational::before{background:var(--purple,#534AB7)}
.dimhead.dim-delivery::before{background:var(--teal,#1D9E75)}
.dimhead.dim-human{color:#B4491F}
.dimhead.dim-organisational{color:#453C9E}
.dimhead.dim-delivery{color:#0F7D5B}
.panel.mech{border-left:3px solid transparent}
.panel.mech.dim-human{border-left-color:rgba(216,90,48,.55)}
.panel.mech.dim-organisational{border-left-color:rgba(83,74,183,.5)}
.panel.mech.dim-delivery{border-left-color:rgba(29,158,117,.5)}
.macro .m.lens-load{border-top:3px solid rgba(216,90,48,.5)}
.macro .m.lens-coupling{border-top:3px solid rgba(83,74,183,.5)}
.macro .m.lens-capacity{border-top:3px solid rgba(29,158,117,.5)}
.macro .m.lens-evidence-loop{border-top:3px solid rgba(148,163,184,.6)}
[data-theme="dark"] .dimhead.dim-human{color:#F19B86}
[data-theme="dark"] .dimhead.dim-organisational{color:#A79EF5}
[data-theme="dark"] .dimhead.dim-delivery{color:#7FD4B8}

/* v6.2: six-case matrix, first two columns aligned with their row */
.cg-row span{align-items:flex-start}
.cg-case,.cg-outcome{justify-content:flex-start}
.cg-cell,.cg-pattern{align-items:flex-start}

/* v6.3: dimension summary bars */
.dimsum{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:10px 0 6px}
.dsum{background:var(--panel,#f9fafb);border-radius:12px;padding:13px 15px;border-top:3px solid transparent;
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.dsum.dim-human{border-top-color:rgba(216,90,48,.75)}
.dsum.dim-organisational{border-top-color:rgba(83,74,183,.7)}
.dsum.dim-delivery{border-top-color:rgba(29,158,117,.7)}
.dsum-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.dsum-head b{font-family:'Inter',sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:1.2px}
.dsum.dim-human .dsum-head b{color:#B4491F}
.dsum.dim-organisational .dsum-head b{color:#453C9E}
.dsum.dim-delivery .dsum-head b{color:#0F7D5B}
.dsum-band{font-size:12px;font-weight:700;white-space:nowrap}
.dsum .gbar{width:100%}
.dsum-note{display:block;font-size:11px;color:var(--muted);margin-top:7px}
[data-theme="dark"] .dsum{background:#141a29}
[data-theme="dark"] .dsum.dim-human .dsum-head b{color:#F19B86}
[data-theme="dark"] .dsum.dim-organisational .dsum-head b{color:#A79EF5}
[data-theme="dark"] .dsum.dim-delivery .dsum-head b{color:#7FD4B8}

/* v6.4: expandable mechanism explanation */
.mexp{margin:0 14px 10px 46px;border-top:1px solid rgba(17,24,39,.06);padding-top:6px}
.mexp summary{cursor:pointer;font-size:12px;color:#0b6b52;list-style:none;font-weight:600}
.mexp summary::-webkit-details-marker{display:none}
.mexp summary::before{content:'\25B8 ';color:#9ca3af}
.mexp[open] summary::before{content:'\25BE '}
.mexp p{margin:7px 0;font-size:13px;line-height:1.55;color:var(--ink)}
.mexp p.fine{color:var(--muted)}
[data-theme="dark"] .mexp{border-color:rgba(255,255,255,.07)}
[data-theme="dark"] .mexp summary{color:#7FD4B8}
[data-theme="dark"] .mexp p{color:#d1d5db}
@media (max-width:640px){.mexp{margin-left:14px}}

/* ==========================================================================
   v6.5: PRINT AND PDF
   The heatmap is a board-pack artefact. Printing drops the furniture, forces the
   light palette, opens every disclosure so nothing is hidden on paper, keeps the
   band colours, and stops rows and panels breaking across pages.
   ========================================================================== */
@media print {
  @page { size: A4; margin: 14mm 12mm; }
  html, body { background: #fff !important; color: #111827 !important; }
  /* force light rendering even if the reader is in dark mode */
  [data-theme="dark"] body, [data-theme="dark"] .masthead, [data-theme="dark"] .panel,
  [data-theme="dark"] .macro .m, [data-theme="dark"] .mgroup, [data-theme="dark"] .dsum,
  [data-theme="dark"] .claims, [data-theme="dark"] .dgpanel, [data-theme="dark"] .dgwrap { background: #fff !important; color: #111827 !important; }
  [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] .mname { color: #111827 !important; }
  .site-head, .site-foot, .theme-toggle, nav, .btn, form { display: none !important; }
  .wrap { max-width: none; padding: 0; }
  /* the masthead becomes a plain header block rather than a dark card */
  .masthead { background: #fff !important; box-shadow: none !important; border: none !important;
              border-bottom: 2px solid #111827 !important; border-radius: 0 !important;
              padding: 0 0 10px !important; margin: 0 0 14px !important; }
  .masthead::before { display: none !important; }
  .mast-title { color: #111827 !important; font-size: 22pt !important; }
  .mast-lead, .mast-narrative { color: #374151 !important; }
  .masthead .state-banner { border: 1px solid #9ca3af !important; background: #f3f4f6 !important; }
  .masthead .state-why { color: #111827 !important; }
  .title-rule { display: none !important; }
  /* open every disclosure so nothing is invisible on paper */
  details { display: block !important; }
  details > summary { display: none !important; }
  details[open] > *, details > * { display: revert !important; }
  .mexp, .art-detail, .sources { border-top: 1px solid #e5e7eb !important; }
  /* keep colour: without this most browsers strip backgrounds */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  /* nothing should break mid-thought */
  .mrow, .dsum, .macro .m, .ccard, .bx, .cg-row, .panel, .claims, .dgwrap { break-inside: avoid; page-break-inside: avoid; }
  h1, h2 { break-after: avoid; page-break-after: avoid; }
  .mgroup { break-inside: auto; }
  /* remove interaction affordances and motion */
  .gbar i, .strip-cell, .state-banner, .narrative, .macro .m, .dgwrap { animation: none !important; }
  a { text-decoration: none; color: #111827 !important; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; color: #6b7280; }
  .fine, .dsum-note { color: #4b5563 !important; }
  .dg { max-width: 100% !important; }
  .dgm { display: none !important; }   /* mobile formula never prints */
}

/* v6.6: risk landscape grid */
.land{margin:12px 0 6px;border-radius:12px;overflow:hidden;
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.land-head,.land-row{display:grid;grid-template-columns:170px repeat(5,1fr);gap:1px}
.land-head span{background:#f3f4f6;padding:9px 10px;font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:1px;text-align:center}
.land-head .land-dimcol{background:#f3f4f6}
.land-row{border-top:1px solid #eef0f3}
.land-dim{background:#fff;padding:12px 12px;display:flex;flex-direction:column;justify-content:center;gap:2px;
  border-left:3px solid transparent}
.land-row.dim-human .land-dim{border-left-color:rgba(216,90,48,.75)}
.land-row.dim-organisational .land-dim{border-left-color:rgba(83,74,183,.7)}
.land-row.dim-delivery .land-dim{border-left-color:rgba(29,158,117,.7)}
.land-dim b{font-family:'Inter',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:1.1px}
.land-row.dim-human .land-dim b{color:#B4491F}
.land-row.dim-organisational .land-dim b{color:#453C9E}
.land-row.dim-delivery .land-dim b{color:#0F7D5B}
.land-dim em{font-style:normal;font-size:11px;color:var(--muted)}
.land-cell{background:#fff;padding:10px 8px;display:flex;flex-wrap:wrap;gap:5px;align-content:center;justify-content:center;min-height:52px}
.land-cell.f-low-bg{background:#f4fbf8}
.land-cell.f-emerging-bg{background:#fffaf0}
.land-cell.f-material-bg{background:#fff6e8}
.land-cell.f-high-bg{background:#fdf1f0}
.land-cell.f-vhigh-bg{background:#fbebea}
.chip{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:24px;padding:0 8px;
  border-radius:999px;font-family:'Inter',sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.3px}
.chip.f-low{background:#5DCAA5;color:#04342C}
.chip.f-emerging{background:#FAC775;color:#412402}
.chip.f-material{background:#EF9F27;color:#3d2a05}
.chip.f-high{background:#E24B4A;color:#fff}
.chip.f-vhigh{background:#A32D2D;color:#fff}
.chip.f-insuff{background:repeating-linear-gradient(45deg,#D3D1C7,#D3D1C7 4px,#F1EFE8 4px,#F1EFE8 8px);color:#4b5563}
.land-unassessed{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fafbfc;padding:10px 14px;border-top:1px solid #eef0f3}
.land-unassessed b{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}
.land-unassessed em{font-style:normal;font-size:11px;color:var(--muted)}
[data-theme="dark"] .land-head span,[data-theme="dark"] .land-head .land-dimcol{background:#171e2e;color:#9ca3af}
[data-theme="dark"] .land-dim,[data-theme="dark"] .land-cell{background:#121826}
[data-theme="dark"] .land-row{border-color:#232b3d}
[data-theme="dark"] .land-cell.f-low-bg{background:#0f1f1b}
[data-theme="dark"] .land-cell.f-emerging-bg{background:#1f1a10}
[data-theme="dark"] .land-cell.f-material-bg{background:#241c0f}
[data-theme="dark"] .land-cell.f-high-bg{background:#221315}
[data-theme="dark"] .land-cell.f-vhigh-bg{background:#251213}
[data-theme="dark"] .land-unassessed{background:#141a29;border-color:#232b3d}
[data-theme="dark"] .land-row.dim-human .land-dim b{color:#F19B86}
[data-theme="dark"] .land-row.dim-organisational .land-dim b{color:#A79EF5}
[data-theme="dark"] .land-row.dim-delivery .land-dim b{color:#7FD4B8}
[data-theme="dark"] .chip.f-insuff{background:repeating-linear-gradient(45deg,#4a5568,#4a5568 4px,#2c3448 4px,#2c3448 8px);color:#d1d5db}

/* v6.7: where to look first */
.attn{margin:14px 0 6px;background:var(--panel,#f9fafb);border-radius:12px;padding:14px 16px;
  box-shadow:0 1px 2px rgba(17,24,39,.05),0 4px 14px rgba(17,24,39,.06)}
.attn-title{display:block;font-family:'Inter',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin-bottom:10px}
.attn-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.attn-item{display:flex;align-items:center;gap:10px}
.attn-code{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:28px;padding:0 9px;
  border-radius:8px;font-family:'Inter',sans-serif;font-weight:700;font-size:12.5px}
.attn-code.f-material{background:#EF9F27;color:#3d2a05}
.attn-code.f-high{background:#E24B4A;color:#fff}
.attn-code.f-vhigh{background:#A32D2D;color:#fff}
.attn-name{font-size:13.5px;line-height:1.35;font-weight:600}
.attn-name em{display:block;font-style:normal;font-size:11.5px;font-weight:700;margin-top:2px}
.attn-note{margin:12px 0 0}
[data-theme="dark"] .attn{background:#141a29}

/* v6.8: export action and privacy line */
.pageactions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0 2px}
.export-btn{background:#111827;color:#fff}
[data-theme="dark"] .export-btn{background:#e5e7eb;color:#111827}
.privacyline{font-size:12px;color:var(--muted);margin:10px 0 0;line-height:1.5}
.privacyline a{color:inherit;text-decoration:underline}

@media (max-width:820px){
  .land-head{display:none}
  .land-row{grid-template-columns:1fr;gap:0}
  .land-cell{justify-content:flex-start;min-height:0;padding:8px 12px}
  .land-cell:empty{display:none}
  .land-cell::before{content:attr(data-band);font-size:10px;text-transform:uppercase;letter-spacing:1px;
    color:var(--muted);margin-right:8px;align-self:center}
}
@media print{
  .pageactions{display:none !important}
  .land-cell,.land-dim{background:#fff !important}
  .attn{border:1px solid #e5e7eb !important}
}

/* v6.9: radial count indicators. These show a fraction of countable things
   (adverse conditions, mechanisms assessed) and never a derived score. */
.dials{display:flex;gap:22px;flex-wrap:wrap;margin:16px 0 0}
.dial{display:flex;align-items:center;gap:11px}
.dial svg{width:64px;height:64px;flex:none}
.dial-track{fill:none;stroke:var(--dial-track,rgba(255,255,255,.16));stroke-width:6}
.dial-arc{fill:none;stroke-width:6;stroke-linecap:round;transition:stroke-dasharray .6s ease-out}
.dial-num{font-family:'Inter',sans-serif;font-size:17px;font-weight:700;text-anchor:middle;
  dominant-baseline:middle;fill:var(--dial-num,#e5e7eb)}
.dial-den{font-size:11px;font-weight:400;fill:var(--dial-den,#9ca3af)}
.dial-cap b{display:block;font-family:'Inter',sans-serif;font-size:12px;text-transform:uppercase;
  letter-spacing:1.1px;color:var(--dial-lab,#c8cedb);line-height:1.3}
.dial-cap em{display:block;font-style:normal;font-size:11px;color:var(--dial-sub,#8d97a8);margin-top:3px;max-width:160px;line-height:1.4}
.dial-ok .dial-arc{stroke:#5DCAA5}
.dial-warn .dial-arc{stroke:#FAC775}
.dial-severe .dial-arc{stroke:#E24B4A}
.dial-neutral .dial-arc{stroke:#9ca3af}
/* Superseded by the v7.1 surface block below. These rules assumed a light page and
   painted the numeral #111827 even inside the dark masthead, which erased it. */
@media (max-width:640px){
  .dials{gap:16px}
  .dial svg{width:56px;height:56px}
  .dial-cap em{max-width:none}
}
@media print{
  .dial-track{stroke:#d1d5db !important}
  .dial-num{fill:#111827 !important}
  .dial-den{fill:#6b7280 !important}
  .dial-cap b{color:#374151 !important}
  .dial-cap em{color:#6b7280 !important}
  .dial-arc{transition:none !important}
}

/* v7.1: the dial pair sits in its own full-width row beneath the state text, running
   left to right, and its ink follows the surface it lands on.

   Two arrangements are supported deliberately, because the dials markup sits inside
   .state-banner on one build and as a sibling of it on the other:
     a) inside  .state-banner -> the pair wraps onto a second row within the card
     b) sibling of .state-banner -> the pair is already a full-width row on the masthead
   Either way the result is: below the text, left to right, readable. */

/* --- layout ------------------------------------------------------------------ */
.dials,.dials-row{display:flex;flex-direction:row;flex-wrap:wrap;gap:34px;align-items:center}
.dials .dial,.dials-row .dial{flex:0 1 auto}
.dials .dial-cap em,.dials-row .dial-cap em{max-width:190px}

/* (a) dials inside the banner: the banner is a flex row, so let it wrap and give the
   pair a 100% basis. The state text then reclaims the full width it used to give up. */
.state-banner{flex-wrap:wrap}
.state-banner > .state-pill{order:1}
.state-banner > .state-why{order:2;flex:1 1 240px;min-width:0}
.state-banner > .dials{order:3;flex:1 0 100%;margin:15px 0 0;padding-top:14px;
  border-top:1px solid var(--dial-rule,rgba(17,24,39,.12))}

/* (b) dials as a sibling, sitting directly on the masthead */
.wrap > .dials,.wrap > .dials-row{margin:16px 0 0;padding-top:15px;
  border-top:1px solid var(--dial-rule,rgba(255,255,255,.10))}
.masthead .wrap > .dials,.masthead .wrap > .dials-row{margin-top:18px}

@media (max-width:640px){
  .dials,.dials-row{gap:18px}
  .dials .dial,.dials-row .dial{flex:1 1 46%}
}

/* --- ink by surface ---------------------------------------------------------- */
/* Dark surfaces. The masthead is dark in both themes, so dials laid directly on it
   keep the light ink the dials were originally designed for. */
.masthead{--dial-num:#e5e7eb;--dial-den:#9ca3af;--dial-lab:#c8cedb;--dial-sub:#8d97a8;
  --dial-track:rgba(255,255,255,.16);--dial-rule:rgba(255,255,255,.14)}

/* Light surfaces. In light theme every state banner is a pale card (pink, cream, mint
   or grey), so dials inside one need dark ink. This is the fix for the pink case. */
.state-banner{--dial-num:#111827;--dial-den:#6b7280;--dial-lab:#374151;--dial-sub:#6b7280;
  --dial-track:rgba(17,24,39,.14);--dial-rule:rgba(17,24,39,.12)}

/* Exception: inside the masthead these three states are drawn as a translucent tint
   over the dark card, so they are dark surfaces and the ink goes back to light.
   Materially exposed and pressured+severe are excluded on purpose: they stay solid
   pink even in the masthead, which is exactly where the unreadable text came from. */
.masthead .state-banner.state-pressured,
.masthead .state-banner.state-controlled,
.masthead .state-banner.state-not-assessed{
  --dial-num:#e5e7eb;--dial-den:#9ca3af;--dial-lab:#c8cedb;--dial-sub:#8d97a8;
  --dial-track:rgba(255,255,255,.16);--dial-rule:rgba(255,255,255,.14)}

/* Pressured escalated to severe is repainted solid pink, so it must not inherit the
   light ink from the pressured rule above. Needs the extra class to win the tie. */
.masthead .state-banner.state-pressured.sev-severe{
  --dial-num:#111827;--dial-den:#6b7280;--dial-lab:#374151;--dial-sub:#6b7280;
  --dial-track:rgba(17,24,39,.14);--dial-rule:rgba(17,24,39,.12)}

/* Dark theme: every banner surface is dark, including materially exposed, so light ink
   applies throughout. Listed last so it beats the masthead exception above on a tie. */
[data-theme="dark"] .state-banner,
[data-theme="dark"] .masthead .state-banner,
[data-theme="dark"] .masthead .state-banner.state-materially-exposed,
[data-theme="dark"] .masthead .state-banner.state-pressured.sev-severe{
  --dial-num:#e5e7eb;--dial-den:#9ca3af;--dial-lab:#c8cedb;--dial-sub:#8d97a8;
  --dial-track:rgba(255,255,255,.16);--dial-rule:rgba(255,255,255,.14)}

/* Print: the masthead flattens to white, so force dark ink on every surface. */
@media print{
  .masthead,.state-banner,[data-theme="dark"] .state-banner,
  [data-theme="dark"] .masthead .state-banner{
    --dial-num:#111827 !important;--dial-den:#6b7280 !important;--dial-lab:#374151 !important;
    --dial-sub:#6b7280 !important;--dial-track:#d1d5db !important;--dial-rule:#d1d5db !important}
}