/* The CA + X strip (ca-x.js). Uses the site's own tokens from index-*.css. */
.cax{display:flex;align-items:center;gap:2ch;min-height:48px;padding:6px var(--gutter);background:var(--bg);border-bottom:1px solid var(--line-2);font-size:var(--fs-sm)}
.cax-ca{display:inline-flex;align-items:center;gap:1ch;min-height:var(--tap);min-width:0;padding-left:1.25ch;border:1px solid var(--line-2);background:var(--bg-1)}
.cax-ca.is-empty{padding-right:1.25ch;border-style:dashed}
.cax-k{color:var(--dim);font-weight:600}
.cax-v{color:var(--fg);font-family:var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;cursor:copy}
.cax-ca.is-empty .cax-v{color:var(--dim);cursor:default}
.cax-short{display:none}
.cax-copy{white-space:pre;display:inline-flex;align-items:center;align-self:stretch;flex:none;padding:0 1ch;border:0;border-left:1px solid var(--line-2);background:none;color:var(--accent);font:inherit;cursor:pointer;transition:var(--invert)}
.cax-copy .br{color:var(--faint)}
.cax-copy:hover,.cax-copy:focus-visible{background:var(--accent);color:var(--accent-ink);outline:0}
.cax-copy:hover .br,.cax-copy:focus-visible .br{color:var(--accent-ink)}
.cax-copy.is-done{color:var(--accent-ink);background:var(--accent)}
.cax-note{color:var(--amber);font-size:var(--fs-xs);min-width:0}
.cax-x{display:inline-flex;align-items:center;gap:1ch;flex:none;min-height:var(--tap);margin-left:auto;padding:0 1.25ch;border:1px solid var(--line-2);color:var(--fg);transition:var(--invert)}
.cax-x .cax-xi{display:inline-flex;color:var(--fg-2)}
.cax-x .cax-go{color:var(--accent)}
a.cax-x:hover,a.cax-x:focus-visible{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);outline:0}
a.cax-x:hover .cax-xi,a.cax-x:hover .cax-go,a.cax-x:focus-visible .cax-xi,a.cax-x:focus-visible .cax-go{color:var(--accent-ink)}
.cax-x.is-empty{color:var(--dim);border-style:dashed}
@media (max-width:900px){.cax-note{display:none}}
@media (max-width:640px){
  .cax{gap:1ch;padding:8px 16px}
  .cax-ca{flex:1 1 auto}
  .cax-full{display:none}
  .cax-short{display:inline}
  .cax-x{padding:0 1ch}
}
@media (max-width:380px){.cax:has(.cax-ca.is-empty) .cax-xh{display:none}}