:root{color-scheme:dark;--chat-font-size:14px;--toolbar-height:30px}
*{box-sizing:border-box}
html{background:#18191d;scrollbar-color:#50535c #18191d;scrollbar-width:thin}
body{margin:0;padding-top:var(--toolbar-height);background:#18191d;color:#ededf0;font-family:"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
body::-webkit-scrollbar{width:6px}body::-webkit-scrollbar-track{background:#18191d}body::-webkit-scrollbar-thumb{background:#50535c;border-radius:4px}
.toolbar{position:fixed;z-index:100;inset:0 0 auto;height:var(--toolbar-height);display:flex;align-items:center;gap:7px;padding:0 8px;background:#25262d;border-bottom:1px solid #383a43;font-size:11px;line-height:1;user-select:none}
#platforms{display:flex;align-items:center;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none}
.platform{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;color:#e3e4ea;font-variant-numeric:tabular-nums;text-decoration:none;border-radius:3px;padding:3px 2px}
.platform:hover{background:#3b3d48;color:#fff}.platform:focus-visible{outline:1px solid #ab91ed}
.platform img{display:block;height:13px;width:13px;object-fit:contain}.platform[data-state="pending"]{opacity:.45}.platform[data-state="connecting"],.platform[data-state="disconnected"]{opacity:.65}
.platform img[alt="X"]{filter:invert(1)}
#total{color:#a9acb8;border-left:1px solid #494b56;padding-left:7px;font-variant-numeric:tabular-nums;white-space:nowrap}
.connection{width:5px;height:5px;border-radius:50%;background:#d9a85d;flex-shrink:0}.connection[data-state="connected"]{background:#7dcc91}
.font-controls{margin-left:auto;display:flex;align-items:center;gap:2px;flex-shrink:0}
.font-controls button{width:23px;height:23px;padding:0;border:1px solid transparent;border-radius:4px;background:transparent;color:#e9eaf0;font:18px/20px "Segoe UI",sans-serif;cursor:pointer}
.font-controls button:hover{background:#3a3d48}.font-controls button:focus-visible{outline:1px solid #ab91ed;outline-offset:-1px}.font-controls button:disabled{opacity:.3;cursor:default}
.font-controls output{min-width:21px;text-align:center;color:#b8bbc7;font:11px/1 "Segoe UI",sans-serif;font-variant-numeric:tabular-nums}
#status{padding:6px 9px;color:#d6bf93;font-size:11px;background:#24232a;overflow-wrap:anywhere}#status[hidden]{display:none}
#messages{padding:3px 4px 5px;font-size:var(--chat-font-size)}
.message{display:block;width:100%;margin:0;padding:5px;border-bottom:1px solid #25262c;line-height:1.4;overflow-wrap:anywhere}
.author{font-weight:650}.badge,.service-icon{height:1em;width:1em;object-fit:contain;margin-right:3px;vertical-align:-.13em}
.rank{display:inline-block;margin-right:4px;padding:0 3px;border-radius:3px;background:#464154;color:#fff;font-size:.62em;vertical-align:.13em;line-height:1.6}.rank[data-kind="moderator"]{background:#287d37}.rank[data-kind="vip"]{background:#a22c86}.rank[data-kind="broadcaster"]{background:#a93636}
.contents{color:#e7e7ec;white-space:pre-wrap}.contents a{color:#b5a0f0;text-decoration:none}.contents a:hover{text-decoration:underline}
.emote{height:1.65em;max-width:100%;vertical-align:-.36em;object-fit:contain}.reply{font-size:.82em;color:#a9acb8;display:block;margin-bottom:2px}
#empty{color:#a9acb8;font-size:13px;padding:12px;margin:0}#latest{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);padding:7px 12px;border:1px solid #7961b0;border-radius:6px;background:#302742;color:#fff;font:12px "Segoe UI",sans-serif;cursor:pointer}
[hidden]{display:none!important}
@media(max-width:340px){.toolbar{gap:4px;padding-inline:5px}#platforms{gap:4px}#total{display:none}.platform img{width:12px;height:12px}}