:root{--twitch:#9147ff;--tiktok:#ff0050;--bg:#0d0d12;--surface:#14141e;--surface2:#1c1c2a;--text:#e8e8f0;--muted:#77779a;--radius:10px}*{box-sizing:border-box}body,html{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:Space Mono,monospace;overflow:hidden}body.overlay-body,html.overlay-root{background:transparent}body:has(.overlay-mode),html:has(.overlay-mode){background:transparent}button,input{font:inherit}.chatfusion{display:flex;flex-direction:column;height:100vh;min-width:0}.app-header{background:var(--surface);border-bottom:1px solid #ffffff0d;flex-shrink:0;gap:12px;justify-content:space-between;padding:14px 20px}.app-header,.logo{align-items:center;display:flex}.logo{font-family:Syne,sans-serif;font-size:1.1rem;font-weight:800;gap:8px}.logo svg{flex-shrink:0}.logo-twitch{color:var(--twitch)}.logo-sep{color:var(--muted)}.logo-tiktok{color:var(--tiktok)}.config{background:var(--surface2);border-bottom:1px solid #ffffff08;display:flex;flex-shrink:0;flex-wrap:wrap;gap:10px;padding:12px 20px}.input-group{align-items:center;background:var(--bg);border:1px solid #ffffff12;border-radius:var(--radius);display:flex;flex:1 1;min-width:180px;overflow:hidden;transition:border-color .2s}.input-group:focus-within{border-color:#ffffff30}.input-prefix{align-items:center;border-right:1px solid #ffffff10;display:flex;font-size:.7rem;font-weight:700;height:36px;letter-spacing:.05em;padding:0 10px;white-space:nowrap}.input-prefix.twitch{color:var(--twitch)}.input-prefix.tiktok{color:var(--tiktok)}.input-group input{background:transparent;border:0;color:var(--text);flex:1 1;font-size:.78rem;height:36px;min-width:0;outline:0;padding:0 10px}.input-group input::placeholder{color:var(--muted)}.btn{border:0;border-radius:var(--radius);cursor:pointer;font-family:Syne,sans-serif;font-size:.8rem;font-weight:700;height:36px;letter-spacing:.03em;padding:0 18px;transition:opacity .2s,transform .1s;white-space:nowrap}.btn:hover{opacity:.85}.btn:active{transform:scale(.97)}.btn-connect{background:linear-gradient(135deg,var(--twitch),var(--tiktok));color:#fff}.btn-overlay{background:#f7f7ff;color:#15151f}.filters{background:var(--bg);border-bottom:1px solid #ffffff06;display:flex;flex-shrink:0;gap:8px;padding:8px 20px}.filter-btn{background:transparent;border:1px solid #ffffff12;border-radius:20px;color:var(--muted);cursor:pointer;font-size:.68rem;padding:4px 12px;transition:all .2s}.filter-btn.active{background:#ffffff15;border-color:#ffffff25;color:var(--text)}.filter-btn.active.twitch{background:#9147ff20;border-color:var(--twitch);color:var(--twitch)}.filter-btn.active.tiktok{background:#ff005020;border-color:var(--tiktok);color:var(--tiktok)}.chat{display:flex;flex:1 1;flex-direction:column;gap:4px;min-height:0;overflow-y:auto;padding:12px 16px;scroll-behavior:smooth}.chat::-webkit-scrollbar{width:4px}.chat::-webkit-scrollbar-track{background:transparent}.chat::-webkit-scrollbar-thumb{background:#ffffff10;border-radius:2px}.msg{align-items:flex-start;animation:slideIn .18s ease-out;border-left:2px solid transparent;border-radius:8px;display:flex;gap:8px;line-height:1.45;padding:6px 10px;transition:background .15s}.msg:hover{background:#ffffff05}@keyframes slideIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.msg.twitch{border-left-color:var(--twitch)}.msg.tiktok{border-left-color:var(--tiktok)}.msg-source{align-items:center;border-radius:4px;display:flex;flex-shrink:0;height:18px;justify-content:center;margin-top:1px;width:18px}.msg-source svg{height:10px;width:10px}.msg.twitch .msg-source{background:#9147ff22}.msg.tiktok .msg-source{background:#ff005022}.msg-body{flex:1 1;font-size:.82rem;min-width:0;overflow-wrap:anywhere}.source-tag{align-items:center;border-radius:4px;box-shadow:inset 0 0 0 1px #ffffff18;color:#fff;display:inline-flex;font-size:.55rem;font-weight:700;height:17px;letter-spacing:.06em;margin-right:6px;padding:0 6px;vertical-align:middle}.source-tag.twitch{background:var(--twitch)}.source-tag.tiktok{background:var(--tiktok)}.msg-author{color:var(--author-color,var(--twitch));font-size:.75rem;font-weight:700;margin-right:6px}.msg.tiktok .msg-author{color:var(--tiktok)}.msg-time{color:var(--muted);float:right;font-size:.65rem;margin-left:8px;margin-top:2px}.msg-text{color:var(--text)}.chat-emote{height:28px;margin:-4px 1px -6px;max-width:150px;object-fit:contain;vertical-align:middle;width:auto}.bttv-emote,.seventv-emote{height:30px}.msg-badges{align-items:center;display:inline-flex;gap:3px;margin-right:5px;vertical-align:middle}.twitch-badge{display:block;flex-shrink:0;height:18px;object-fit:contain;width:18px}.badge-fallback{align-items:center;background:#ffffff12;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff18;color:var(--muted);display:inline-flex;font-size:.5rem;font-weight:700;height:17px;justify-content:center;line-height:1;width:17px}.sys-msg{animation:slideIn .2s ease-out;background:#ffffff05;border-radius:6px;color:var(--muted);font-size:.7rem;padding:6px;text-align:center}.sys-msg.error{background:#ff000010;color:#ff6b6b}.sys-msg.ok{background:#00ff9010;color:#4caf93}.empty{align-items:center;color:var(--muted);display:flex;flex:1 1;flex-direction:column;font-size:.8rem;gap:12px;justify-content:center;padding:40px;text-align:center}.empty-icon{animation:pulse 2.5s ease-in-out infinite;font-size:2.5rem;opacity:.3}@keyframes pulse{0%,to{opacity:.3}50%{opacity:.6}}.toast{background:var(--surface2);border:1px solid #ffffff15;border-radius:10px;bottom:20px;font-size:.75rem;opacity:0;padding:10px 16px;pointer-events:none;position:fixed;right:20px;transform:translateY(8px);transition:all .25s;z-index:99}.toast.show{opacity:1;transform:translateY(0)}.autoscroll-btn{background:var(--surface2);border:1px solid #ffffff20;border-radius:20px;bottom:20px;color:var(--muted);cursor:pointer;font-size:.7rem;left:50%;opacity:0;padding:6px 16px;pointer-events:none;position:fixed;transform:translateX(-50%);transition:opacity .2s}.autoscroll-btn.visible{opacity:1;pointer-events:all}.overlay-mode,.overlay-mode .chat{background:transparent}.overlay-mode .chat{gap:8px;justify-content:flex-end;overflow:hidden;padding:24px}.overlay-mode .msg{align-self:flex-start;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-left-width:4px;box-shadow:0 10px 28px #00000045;max-width:min(760px,calc(100vw - 48px));padding:8px 12px;text-shadow:0 1px 2px #000}.overlay-mode .msg,.overlay-mode .msg:hover{background:#07070cbd}.overlay-mode .msg-body{font-size:1rem}.overlay-mode .msg-author{font-size:.9rem}.overlay-mode .msg-time{display:none}.overlay-mode .source-tag{height:19px}.overlay-mode .chat-emote{height:34px}.overlay-mode .bttv-emote,.overlay-mode .seventv-emote{height:36px}@media (max-width:640px){.app-header,.config,.filters{padding-left:12px;padding-right:12px}.btn{flex:1 1}}