/* merchants and traders (js/stream2.js): level chips and usage bars */
.s2-level { font-weight: 600; }
.s2-level.l0 { background: color-mix(in oklab, var(--muted, #888) 18%, transparent); color: var(--text); }
.s2-level.l1 { background: color-mix(in oklab, #3b82f6 22%, transparent); color: #9cc2ff; }
.s2-level.l2 { background: color-mix(in oklab, #22c55e 22%, transparent); color: #8de3ad; }
.s2-level.l3 { background: color-mix(in oklab, #f5b301 26%, transparent); color: #ffd56b; }
:root[data-scheme="light"] .s2-level.l1 { color: #1d4ed8; } :root[data-scheme="light"] .s2-level.l2 { color: #15803d; } :root[data-scheme="light"] .s2-level.l3 { color: #a16207; }
.s2-bar { appearance: none; -webkit-appearance: none; display: block; width: 100%; height: 8px; border: 0; border-radius: 999px; background: var(--glass-2, rgba(127,127,127,.15)); overflow: hidden; }
.s2-bar::-webkit-progress-bar { background: var(--glass-2, rgba(127,127,127,.15)); border-radius: 999px; }
.s2-bar::-webkit-progress-value { background: var(--accent, #8b7cff); border-radius: 999px; }
.s2-bar::-moz-progress-bar { background: var(--accent, #8b7cff); border-radius: 999px; }
.s2-bar.sm { height: 5px; margin: 4px 0 2px; max-width: 160px; }
.s2-usercard { margin-top: 16px; }
tr.strong td { font-weight: 600; } tr.muted td { color: var(--muted); font-size: 12.5px; }