/* sharingu GTM — additions only. Tokens only (DESIGN_TOKENS.md rule 1): no hardcoded hex for chrome.
   Orange never carries text (rule 2). Green = verified only (3). Red = error only (4).
   colour = meaning, grey = nav/count chrome (5). Machine speaks mono (6). No emoji (7). */

.gtm{display:grid;grid-template-columns:210px 1fr;gap:0;align-items:start}
@media(max-width:820px){.gtm{grid-template-columns:1fr}.side{display:none}}

/* left rail — nav is grey chrome, never coloured */
.side{position:sticky;top:64px;padding:22px 0 40px;border-right:1px solid var(--line);min-height:60vh}
.side__l{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);padding:0 14px 7px}
.side__i{display:flex;align-items:center;gap:8px;width:100%;background:none;border:0;cursor:pointer;
  font:600 13px var(--sans);color:var(--ink-2);padding:7px 14px;text-align:left;border-radius:var(--r-sm)}
.side__i:hover{background:var(--paper-2);color:var(--ink)}
.side__i[aria-current=true]{background:var(--paper-3);color:var(--ink);font-weight:700}
.side__n{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.side__g{margin-bottom:18px}

.body{padding:22px 0 60px;min-width:0}
@media(min-width:821px){.body{padding-left:26px}}

/* verdict line — the report opens on its one-line verdict, not a stat grid (rule 8) */
.verdict{font-family:var(--display);font-size:19px;font-weight:800;letter-spacing:-.02em;
  margin-bottom:3px}
.verdict em{font-style:normal;color:var(--ink-3);font-weight:600}
.sub{font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-bottom:20px}

.sect{margin:26px 0 9px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sect h2{font-family:var(--display);font-size:14px;font-weight:800;letter-spacing:-.01em}
.sect .m{font-family:var(--mono);font-size:11px;color:var(--ink-3)}

.box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.box + .box{margin-top:10px}

/* funnel — one band. Brand is a FILL here (allowed), everything else grey chrome. */
.fnl{display:flex;height:26px;border-radius:var(--r-sm);overflow:hidden;gap:2px;background:var(--paper-2)}
.fnl__s{min-width:3px;transition:.15s}
.fnl__s:hover{filter:brightness(.94)}
.fnl__k{display:flex;gap:12px;flex-wrap:wrap;margin-top:9px;font-family:var(--mono);font-size:10.5px;color:var(--ink-2)}
.fnl__k b{font-weight:700;color:var(--ink)}
.dot{width:7px;height:7px;border-radius:2px;display:inline-block;margin-right:5px;vertical-align:-1px}

/* rows */
.r{display:flex;align-items:flex-start;gap:12px;padding:11px 14px;border-top:1px solid var(--line);cursor:pointer}
.r:first-child{border-top:0}
.r:hover{background:var(--paper-2)}
.r__m{flex:1;min-width:0}
.r__t{font:700 13.5px var(--display);letter-spacing:-.01em;color:var(--ink);display:flex;
  align-items:baseline;gap:7px;flex-wrap:wrap}
.r__d{font-size:12.5px;color:var(--ink-2);margin-top:2px;line-height:1.45}
.r__c{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px;align-items:center}
.r__a{display:flex;gap:3px;flex:none;opacity:.42;transition:.12s}
.r:hover .r__a,.r__a:focus-within{opacity:1}
@media(hover:none){.r__a{opacity:1}}

/* signal buttons — mono text, ink chrome. Selected = ink fill (never orange text). */
.sg{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.04em;padding:4px 7px;
  border:1px solid var(--line);border-radius:5px;background:var(--surface);color:var(--ink-3);
  cursor:pointer;white-space:nowrap;transition:.12s}
.sg:hover{border-color:var(--ink-3);color:var(--ink)}
.sg[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.sg--no[aria-pressed=true]{background:var(--paper-3);border-color:var(--ink-3);color:var(--ink-2)}

.ico{width:13px;height:13px;flex:none;stroke:currentColor;vertical-align:-2px}

/* kpi strip — mono numbers (the machine speaks mono) */
.kp{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.kp__c{background:var(--surface);padding:11px 13px}
.kp__n{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3)}
.kp__v{font-family:var(--display);font-size:21px;font-weight:800;letter-spacing:-.03em;margin-top:2px}
.kp__c--hero{background:var(--brand-tint)}      /* brand as a FILL, ink text on top (rule 2) */

.bar{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.in{height:32px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  color:var(--ink);padding:0 10px;font:13px var(--sans);min-width:180px;flex:1}
.b{height:32px;padding:0 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);
  color:var(--ink);font:600 12.5px var(--sans);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.b:hover{background:var(--paper-2)}
.b--go{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.b--go:hover{background:var(--ink-2)}

/* board */
.bd{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px}
.bd__c{flex:0 0 210px;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-card);padding:9px}
.bd__c.over{border-color:var(--ink-3);background:var(--paper-3)}
.bd__h{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--ink-2);
  display:flex;align-items:center;gap:6px;padding:2px 3px 8px}
.bd__k{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 9px;
  margin-bottom:6px;cursor:grab;font-size:12.5px}
.bd__k b{font:700 12.5px var(--display)}

/* modal */
.scrimx{position:fixed;inset:0;background:var(--scrim);opacity:0;pointer-events:none;transition:.15s;z-index:60}
.scrimx.on{opacity:1;pointer-events:auto}
.md{position:fixed;z-index:61;left:50%;top:50%;transform:translate(-50%,-48%) scale(.98);opacity:0;
  pointer-events:none;width:min(560px,94vw);max-height:88vh;overflow:auto;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--shadow-3);transition:.15s}
.md.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.md__h{display:flex;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);
  font:800 14px var(--display)}
.md__b{padding:14px 16px}
.md__f{display:flex;gap:8px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.f{margin-bottom:11px}
.f label{display:block;font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.f input,.f select,.f textarea{width:100%;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-sm);color:var(--ink);padding:8px 10px;font:13px var(--sans)}
.f textarea{font-family:var(--sans);resize:vertical}

/* palette */
.pl{position:fixed;inset:0;background:var(--scrim-heavy);display:none;z-index:70;padding-top:12vh}
.pl.on{display:block}
.pl__b{width:min(560px,92vw);margin:0 auto;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-card);box-shadow:var(--shadow-3);overflow:hidden}
.pl__s{display:flex;align-items:center;gap:9px;padding:13px 15px;border-bottom:1px solid var(--line)}
.pl__s input{flex:1;border:0;outline:0;background:none;font:14px var(--sans);color:var(--ink)}
.pl__r{max-height:52vh;overflow:auto;padding:6px}
.pl__i{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:var(--r-sm);cursor:pointer;font-size:13px}
.pl__i:hover,.pl__i.on{background:var(--paper-2)}
.pl__i .m{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}

.tst{position:fixed;left:50%;transform:translateX(-50%);bottom:22px;background:var(--ink);color:var(--paper);
  padding:9px 15px;border-radius:999px;font:600 12.5px var(--sans);z-index:80;box-shadow:var(--shadow-2)}

.tw{overflow-x:auto}
table.g{width:100%;border-collapse:collapse;font-size:12.5px}
table.g th{text-align:left;font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
table.g td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
table.g tr:last-child td{border-bottom:0}
.mono{font-family:var(--mono)}
.ta{width:100%;min-height:150px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-sm);color:var(--ink);padding:11px;font:13px/1.6 var(--mono);resize:vertical}