/* zena-team-badge.css: the badge's only theme-dependent part is its edge. A fill that would melt into the ground (a navy or
   black club on the dark ground, a white club on the light one) gets a 1px hairline-strong edge, decided per theme in JS
   (data-edge "d" and/or "l") and switched here, so a theme change never re-renders a badge. News stays dark on every device. */
.ztb{display:inline-block;flex:none;vertical-align:middle;overflow:visible;--ztb-edge:transparent}
/* the passed size (html() sets --ztb-s inline): above a page-wide svg{width:100%}, below any box that sizes its badge */
svg.ztb:where([style*="--ztb-s"]){width:var(--ztb-s);height:var(--ztb-s)}
.ztb[data-edge~=d]{--ztb-edge:var(--z-hairline-strong,#3a4452)}
@media (prefers-color-scheme:light){
  :root:not([data-theme=dark]):not([data-news-view]) .ztb{--ztb-edge:transparent}
  :root:not([data-theme=dark]):not([data-news-view]) .ztb[data-edge~=l]{--ztb-edge:var(--z-hairline-strong,#bdb8ad)}
}
:root[data-theme=light]:not([data-news-view]) .ztb{--ztb-edge:transparent}
:root[data-theme=light]:not([data-news-view]) .ztb[data-edge~=l]{--ztb-edge:var(--z-hairline-strong,#bdb8ad)}
.ztb-edge{fill:none;stroke:var(--ztb-edge);stroke-width:1;vector-effect:non-scaling-stroke}
.ztb-code{font-variant-numeric:tabular-nums;letter-spacing:0;dominant-baseline:auto}
