/* govrn-platform dashboard — "The Standard" (black & white).
   Brand-aligned re-skin: pure monochrome, hairlines, mono spec labels,
   Archivo Expanded scores. Severity is fill + weight, never color. */
:root {
  --paper: #f4f3f0;
  --paper-2: #eceae6;
  --ink: #0b0b0b;
  --ink-80: rgba(11,11,11,0.80);
  --ink-55: rgba(11,11,11,0.55);
  --ink-40: rgba(11,11,11,0.40);
  --ink-25: rgba(11,11,11,0.25);
  --line: rgba(11,11,11,0.16);
  --line-2: rgba(11,11,11,0.32);
  --font-display: "Archivo Expanded","Archivo",system-ui,sans-serif;
  --font-text: "Archivo",system-ui,sans-serif;
  --font-mono: "IBM Plex Mono",ui-monospace,Menlo,monospace;
  --track: 0.16em;
  --ease: cubic-bezier(0.22,1,0.36,1);
}
*,*::before,*::after { box-sizing: border-box; }
/* Global zoom — render at 125% like browser Cmd-+ ×2 (uniform scale). */
html { zoom: 1.25; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-text); font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; }
::selection { background:var(--ink); color:var(--paper); }
b { font-weight:700; }
small { display:block; font-family:var(--font-text); font-size:11.5px; color:var(--ink-55); margin-top:3px; font-weight:400; }
.muted { color:var(--ink-55); }

/* top bar */
.top { display:flex; align-items:center; gap:28px; padding:14px 28px; background:var(--paper); border-bottom:1px solid var(--ink); position:sticky; top:0; z-index:10; }
.brand { display:flex; align-items:baseline; gap:7px; text-decoration:none; color:inherit; cursor:pointer; }
a.brand:hover .mark { text-decoration:underline; }
.brand .mark { font-family:var(--font-display); font-weight:900; font-size:19px; text-transform:lowercase; letter-spacing:-0.01em; }
.brand .sub { font-family:var(--font-mono); font-size:10px; letter-spacing:var(--track); text-transform:uppercase; color:var(--ink-55); }
.org { display:flex; flex-direction:column; line-height:1.3; }
.org strong { font-weight:700; }
.org .muted { font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; text-transform:uppercase; }
.live { margin-left:auto; display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:10px; letter-spacing:var(--track); text-transform:uppercase; color:var(--ink-55); }
.live .dot { width:7px; height:7px; border-radius:50%; background:var(--ink); animation:breathe 2.6s var(--ease) infinite; }
@keyframes breathe { 0%,100%{opacity:.25;transform:scale(.85);} 50%{opacity:1;transform:scale(1);} }
.overall { display:flex; flex-direction:column; align-items:flex-end; line-height:1; }
.overall .muted { font-family:var(--font-mono); font-size:9.5px; letter-spacing:var(--track); text-transform:uppercase; margin-top:4px; }

/* scores — big display, no color */
.score { font-family:var(--font-display); font-weight:900; font-size:26px; letter-spacing:-0.02em; color:var(--ink); }
.score small { display:inline; font-family:var(--font-mono); font-size:11px; font-weight:400; color:var(--ink-40); letter-spacing:0; margin:0; }
.score.good,.score.warn,.score.bad { color:var(--ink); }

main { max-width:1180px; margin:0 auto; padding:28px; }
section { margin-bottom:40px; }
h2 { font-family:var(--font-display); font-weight:800; font-size:17px; letter-spacing:-0.01em; margin:0 0 16px; padding-bottom:10px; border-bottom:1px solid var(--ink); }
h2 small,h3 small { display:inline; font-family:var(--font-mono); font-size:10px; letter-spacing:0.04em; color:var(--ink-55); margin:0; }
h3 { font-family:var(--font-display); font-weight:700; font-size:14px; margin:24px 0 12px; }

.hero { border:1px solid var(--ink); border-left:4px solid var(--ink); padding:16px 20px; }
.hero p { margin:0; font-size:15px; }
.alarm { display:inline-block; margin-left:10px; font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; background:var(--ink); color:var(--paper); padding:2px 8px; font-weight:500; }
.ok { display:inline-block; margin-left:10px; font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-55); border:1px solid var(--line); padding:2px 8px; }

/* lens cards */
.lenses { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--ink); }
.lens { padding:22px; border-right:1px solid var(--line); }
.lens:last-child { border-right:0; }
.lens header { display:flex; align-items:baseline; justify-content:space-between; }
.lens h3 { margin:0; font-family:var(--font-mono); font-size:10.5px; letter-spacing:var(--track); text-transform:uppercase; color:var(--ink-55); font-weight:500; }
.lens .score { font-size:48px; line-height:1; }
.lens .blurb { font-family:var(--font-mono); font-size:9.5px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink-40); margin:8px 0 16px; }
.bar { display:flex; height:6px; border:1px solid var(--ink); overflow:hidden; }
.bar span { height:100%; }
.b-pass { background:var(--ink); }
.b-partial { background:var(--ink-40); }
.b-fail { background:repeating-linear-gradient(45deg,var(--ink-25),var(--ink-25) 2px,transparent 2px,transparent 4px); }
.b-na { background:transparent; }
.counts { list-style:none; display:flex; gap:14px; margin:12px 0 0; padding:0; font-family:var(--font-mono); font-size:9.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-55); }
.counts b { color:var(--ink); font-weight:700; }

/* tables */
table.grid { width:100%; border-collapse:collapse; border:1px solid var(--ink); }
.grid thead th { text-align:left; font-family:var(--font-mono); font-size:10px; text-transform:uppercase; letter-spacing:var(--track); color:var(--ink-55); font-weight:500; padding:9px 14px; border-bottom:1px solid var(--ink); }
.grid td { padding:11px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
.grid tbody tr:last-child td { border-bottom:0; }
.grid tbody tr:hover { background:var(--paper-2); }
@media (max-width:760px){ table.grid, .grid { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap; } }

/* badges — monochrome scale (critical = solid ink, info = faint) */
.sev,.risk,.pill,.act,.disp,.hitl,.flag,.indep { display:inline-block; font-family:var(--font-mono); font-size:9.5px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; padding:2px 7px; border:1px solid var(--line); }
.sev-critical,.risk-critical { background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
.sev-high,.risk-high { color:var(--ink); border-color:var(--ink); font-weight:700; }
.sev-medium,.risk-med { color:var(--ink-80); border-color:var(--line-2); }
.sev-low,.risk-low { color:var(--ink-55); border-color:var(--line); }
.sev-info { color:var(--ink-40); border-color:transparent; }
.hitl.yes { color:var(--ink-80); border-color:var(--line-2); }
.hitl.no { background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
.pill-new { color:var(--ink); border-color:var(--ink); font-weight:700; }
.pill-triaged { color:var(--ink-80); border-color:var(--line-2); }
.pill-resolved { color:var(--ink-55); border-color:var(--line); }
.pill-dismissed { color:var(--ink-40); border-color:transparent; }
.act-none { color:var(--ink-40); border-color:transparent; }
.act-proposed { color:var(--ink-80); border-color:var(--line-2); }
.act-approved { color:var(--ink); border-color:var(--ink); }
.act-applied { background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
.disp-retain { color:var(--ink-80); border-color:var(--line-2); }
.disp-replace { color:var(--ink-55); border-color:var(--line); }
.disp-retire { background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
.disp-tbd { color:var(--ink-40); border-color:transparent; }
.flag { color:var(--ink); border-color:var(--ink); margin-right:4px; font-weight:700; }
.sev-summary,.act-summary { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }

/* attestations */
.attestations { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--ink); }
.att { padding:20px; border-right:1px solid var(--line); display:flex; flex-direction:column; }
.att:last-child { border-right:0; }
.att-declined { background:var(--ink); color:var(--paper); }
.att-declined .att-lens { color:rgba(244,243,240,0.6); }
.att-declined .score { color:var(--paper); }
.att-declined small { color:rgba(244,243,240,0.6); }
.att header { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:10px; }
.att .att-lens { font-family:var(--font-mono); font-size:9.5px; font-weight:500; letter-spacing:var(--track); text-transform:uppercase; color:var(--ink-55); }
.att .score { font-size:26px; }
.att p { margin:0 0 14px; font-size:12.5px; line-height:1.5; }
.att footer { margin-top:auto; display:flex; flex-direction:column; gap:6px; }
.att .signer { font-family:var(--font-mono); font-size:10px; letter-spacing:0.04em; text-transform:uppercase; font-weight:500; }
.att .indep { align-self:flex-start; font-size:9px; letter-spacing:0.1em; text-transform:uppercase; padding:1px 7px; border:1px solid var(--line); }
.att .indep.yes { border-color:var(--line-2); }
.att .indep.no { background:var(--ink); color:var(--paper); }
.att-declined .indep { border-color:rgba(244,243,240,0.4); color:rgba(244,243,240,0.85); }

footer { max-width:1180px; margin:0 auto; padding:20px 28px 50px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; border-top:1px solid var(--ink); font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-55); }

/* tenant switcher */
.switch { display:flex; gap:6px; flex-wrap:wrap; }
.t-pill { font-family:var(--font-mono); font-size:9.5px; letter-spacing:0.1em; text-transform:uppercase; padding:3px 9px; border:1px solid var(--line); color:var(--ink-55); }
.t-pill:hover { border-color:var(--ink); color:var(--ink); }
.t-pill.on { background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }

/* monitoring not-connected (honesty state) */
.live.off { color:var(--ink-55); }
.live.off .dot { background:var(--ink-40); animation:none; }
.notice { border:1px solid var(--ink); border-left:4px solid var(--ink); padding:12px 16px; margin-bottom:18px; font-size:13px; line-height:1.5; }
.notice b { font-weight:700; }

/* cost & efficiency (tokenomics) */
.cost-stats { display:flex; border:1px solid var(--ink); margin-bottom:14px; }
.cost-stat { flex:1; padding:14px 18px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:3px; }
.cost-stat:last-child { border-right:0; }
.cost-stat.hl { background:var(--ink); color:var(--paper); }
.cost-stat .cv { font-family:var(--font-display); font-weight:900; font-size:24px; letter-spacing:-0.02em; }
.cost-stat .cl { font-family:var(--font-mono); font-size:9px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-55); }
.cost-stat.hl .cl { color:rgba(244,243,240,0.6); }
.tier { display:inline-block; font-family:var(--font-mono); font-size:9.5px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; padding:2px 7px; border:1px solid var(--line); }
.tier-frontier { background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
.tier-workhorse { color:var(--ink-80); border-color:var(--line-2); }
.tier-lightweight { color:var(--ink-55); border-color:var(--line); }

@media (max-width:820px) {
  .lenses,.attestations { grid-template-columns:1fr; }
  .cost-stats { flex-wrap:wrap; } .cost-stat { flex:1 1 50%; }
  .switch { order:4; width:100%; }
  .lens,.att { border-right:0; border-bottom:1px solid var(--line); }
  .top { flex-wrap:wrap; gap:14px; } .live { margin-left:0; order:3; } main { padding:18px; }
}

/* ===== readability pass — larger, higher-contrast labels (a dashboard has to be scannable) ===== */
body { font-size: 15.5px; }
small { font-size: 13px; }
.muted { color: rgba(11,11,11,0.64); }
.brand .mark { font-size: 22px; }
.brand .sub { font-size: 12px; color: rgba(11,11,11,0.62); }
.org strong { font-size: 16px; }
.org .muted { font-size: 12px; color: rgba(11,11,11,0.64); }
.live { font-size: 12.5px; color: rgba(11,11,11,0.6); }
.overall .muted { font-size: 11.5px; }
.score small { font-size: 13.5px; }
h2 { font-size: 19px; }
h2 small, h3 small { font-size: 13px; }
h3 { font-size: 16px; }
.hero p { font-size: 16.5px; }
.alarm, .ok { font-size: 12.5px; }
.lens h3 { font-size: 13px; color: rgba(11,11,11,0.72); }
.lens .blurb { font-size: 11.5px; color: rgba(11,11,11,0.55); }
.counts { font-size: 12.5px; }
.grid thead th { font-size: 12.5px; color: rgba(11,11,11,0.66); }
.grid td { font-size: 15px; }
.sev, .risk, .pill, .act, .disp, .hitl, .flag, .indep, .tier { font-size: 11.5px; }
.att .att-lens { font-size: 12px; }
.att p { font-size: 14.5px; }
.att .signer { font-size: 12px; }
.att .indep { font-size: 10.5px; }
footer { font-size: 12px; }
.t-pill { font-size: 12px; }
.notice { font-size: 15px; }
.cost-stat .cv { font-size: 27px; }
.cost-stat .cl { font-size: 11px; }