.tabs{display:flex;gap:4px;padding:8px 10px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.tabs a{font-size:.8em;padding:5px 11px;border-radius:14px;color:var(--muted);text-decoration:none;background:#f2f4f6}
.tabs a.on{background:var(--accent);color:#fff}
.ub{background:var(--accent);color:#fff;border-radius:10px;font-size:.7em;padding:1px 7px;font-weight:700;margin-left:6px}
.wdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.wdot.open{background:#2ecc71}.wdot.shut{background:#c4c9cf}
.conv .row1 .pv{flex:1;min-width:0;margin-top:3px}
.chead .acts{display:flex;gap:6px;align-items:center}
.chead select{width:auto;padding:5px 8px;font-size:.85em}
.wbar{padding:6px 18px;font-size:.8em;background:#fff8e6;color:#8a6d1f;border-bottom:1px solid #f0e2c0}
.wbar.ok{background:#eefaf3;color:#1f7a4d;border-color:#cdebd9}
.mwrap{display:flex;flex-direction:column;max-width:68%}
.mwrap.inbound{align-self:flex-start}.mwrap.outbound{align-self:flex-end;align-items:flex-end}
.mwrap .m{max-width:100%}
.mwrap:hover .mact{visibility:visible}
.mact{visibility:hidden;display:flex;gap:4px;margin-top:3px}
.mact button{background:#fff;color:var(--muted);border:1px solid var(--line);padding:2px 8px;font-size:.75em;border-radius:12px}
.mact button:hover{background:var(--chip);color:var(--accent)}
.m img.media,.m video.media{max-width:280px;max-height:320px;border-radius:8px;display:block;margin-bottom:4px;cursor:pointer}
.m audio{max-width:260px;display:block}
.m .doc{display:inline-flex;gap:6px;align-items:center;padding:7px 11px;background:rgba(0,0,0,.05);border-radius:8px;text-decoration:none;color:var(--ink)}
.m .quote{border-left:3px solid var(--accent);background:rgba(0,0,0,.04);padding:4px 8px;border-radius:4px;font-size:.82em;color:var(--muted);margin-bottom:5px}
.m .who{font-size:.68em;color:var(--accent);font-weight:600;margin-bottom:2px}
.tick{margin-left:4px}.tick.read{color:#34b7f1}.tick.failed{color:var(--danger);cursor:help}
.reacts{font-size:.85em;background:#fff;border:1px solid var(--line);border-radius:12px;padding:1px 7px;margin-top:-5px;position:relative;z-index:1}
.daysep{align-self:center;font-size:.72em;color:var(--muted);background:#fff;padding:3px 11px;border-radius:10px;margin:6px 0}
.callline{align-self:center;font-size:.8em;background:#fff;border:1px solid var(--line);padding:5px 13px;border-radius:14px;color:var(--muted)}
.replybar{display:flex;justify-content:space-between;align-items:center;padding:6px 14px;background:#f3f8f5;border-top:1px solid var(--line);font-size:.85em;color:var(--muted)}
.composer .icon{background:transparent;color:var(--muted);font-size:1.15em;padding:6px 10px;border:1px solid var(--line)}
.composer .icon:hover{background:var(--chip)}
.chat{position:relative}
.pop{position:absolute;bottom:62px;left:12px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.15);width:330px;max-height:320px;overflow:auto;z-index:20}
.pop .it{padding:9px 12px;border-bottom:1px solid var(--line);cursor:pointer;font-size:.88em;display:flex;justify-content:space-between;gap:8px}
.pop .it:hover{background:var(--chip)}
.pop .it b{display:block}.pop .it small{color:var(--muted)}
.pop .x{color:var(--danger);padding:0 4px}
.emojis{position:fixed;background:#fff;border:1px solid var(--line);border-radius:20px;padding:4px 6px;box-shadow:0 4px 16px rgba(0,0,0,.15);z-index:30}
.emojis span{cursor:pointer;font-size:1.35em;padding:2px 4px}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:60;cursor:zoom-out}
.lightbox img{max-width:92vw;max-height:92vh}
.disabledbar{padding:13px 16px;background:var(--panel);border-top:1px solid var(--line);color:var(--muted);font-size:.88em;text-align:center}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#1a2230;color:#fff;padding:10px 18px;border-radius:10px;font-size:.88em;z-index:80}
