/* Row grid for the rich LENS card. Scoped .lensx-* so it can never collide with
     dashboard.html.j2's page-local .rlx-* set. Colours resolve through the same
     --lens-* chain theme.js defines on .lens-pop, so vector-family pages (own
     token names, no theme.css) inherit correctly. */
  .lensx-rows{display:grid;gap:9px;margin:2px 16px 13px}
  .lensx-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:baseline}
  .lensx-k{
    display:flex;align-items:baseline;gap:6px;white-space:nowrap;
    font:700 9px/1.5 var(--font-ui,Inter,sans-serif);letter-spacing:.09em;text-transform:uppercase;
    color:color-mix(in srgb,var(--lens-accent,#5b9bf0) 80%,var(--lens-text,#d7dce3));
  }
  .lensx-k::before{
    content:"";flex:none;width:6px;height:6px;border-radius:50%;
    background:currentColor;transform:translateY(-1px);
  }
  .lensx-row.up   .lensx-k{color:var(--up,#3da564)}
  .lensx-row.info .lensx-k{color:var(--info,var(--link,#5b9bf0))}
  .lensx-row.warn .lensx-k{color:var(--warn,#e0a030)}
  .lensx-row.dn   .lensx-k{color:var(--down,#d3455b)}
  .lensx-v{
    font:450 11.5px/1.52 var(--font-ui,Inter,sans-serif);
    color:color-mix(in srgb,var(--lens-text,#d7dce3) 86%,var(--lens-mut,#8b93a1));
  }
  .lensx-v b{font-weight:650;color:var(--lens-text,#d7dce3)}
  /* the closing sentence sits under the rows, quieter than them */
  .lens-pop .lensx-note{
    margin:0 16px 13px;padding-top:11px;
    border-top:1px solid color-mix(in srgb,var(--lens-text,#d7dce3) 11%,transparent);
    font:450 11.5px/1.55 var(--font-ui,Inter,sans-serif);
    color:color-mix(in srgb,var(--lens-text,#d7dce3) 80%,var(--lens-mut,#8b93a1));
  }
  .lens-pop .lensx-note b{font-weight:650;color:var(--lens-text,#d7dce3)}
  @media(max-width:640px){
    .lensx-row{grid-template-columns:minmax(0,1fr);gap:2px}
  }