:root{--nav:#102a2b;--ink:#172526;--muted:#6b7c7d;--line:#dfe8e7;--surface:#fff;--bg:#f3f7f6;--brand:#167d6d;--brand-dark:#0e6257;--accent:#dff5ee;--danger:#b84040;--shadow:0 14px 38px rgba(25,53,52,.08)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px}.app-nav{background:var(--nav);min-height:64px}.navbar-brand{letter-spacing:-.4px}.brand-dot{display:inline-block;width:10px;height:10px;background:#46d7ae;border-radius:50%;margin-right:9px;box-shadow:0 0 0 5px rgba(70,215,174,.13)}.navbar .nav-link{color:rgba(255,255,255,.68);margin:0 3px}.navbar .nav-link:hover,.navbar .nav-link.active{color:#fff}.page-heading h1{font-size:1.8rem;font-weight:750;letter-spacing:-.6px;margin:0}.page-heading p{color:var(--muted);margin:.4rem 0 0}.panel-card,.metric-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.panel-card{padding:24px}.panel-card h2{font-size:1.05rem;font-weight:700;margin:0 0 18px}.metric-card{padding:20px;height:100%}.metric-label{display:block;color:var(--muted);font-size:.8rem}.metric-card strong{display:block;font-size:1.9rem;line-height:1.2;margin-top:8px}.btn-primary{--bs-btn-bg:var(--brand);--bs-btn-border-color:var(--brand);--bs-btn-hover-bg:var(--brand-dark);--bs-btn-hover-border-color:var(--brand-dark)}.form-control,.form-select{border-color:#cedbd9;border-radius:10px;padding:.65rem .8rem}.form-control:focus,.form-select:focus{border-color:#47a99a;box-shadow:0 0 0 .2rem rgba(22,125,109,.12)}.status-pill,.window-pill{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.status-pill.ok,.window-pill.open{background:#def5e8;color:#157347}.status-pill.warn,.window-pill.unknown{background:#fff0c9;color:#8a6200}.status-pill.bad,.window-pill.closed{background:#fbe1e1;color:#a02e2e}.detail-list{margin:0}.detail-list div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line);gap:20px}.detail-list div:last-child{border:0}.detail-list dt{color:var(--muted);font-weight:500}.detail-list dd{margin:0;text-align:right;overflow-wrap:anywhere}.copy-field{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#f7faf9}.copy-field code{padding:10px;overflow:auto;flex:1;color:var(--ink)}.copy-field button{border:0;border-left:1px solid var(--line);background:#fff;padding:10px 12px;color:var(--brand);font-weight:650}.setup-list{padding-left:20px}.setup-list li{margin-bottom:8px}.form-card{max-width:980px}.number-preview{background:var(--accent);border-radius:10px;padding:12px 14px}.req{display:block;padding:8px 10px;border-radius:8px}.req.ok{background:#e5f6ec;color:#146c43}.req.bad{background:#f9e3e3;color:#a02e2e}.login-body,.install-body{min-height:100vh;background:radial-gradient(circle at 20% 10%,#dff6ef,transparent 35%),linear-gradient(135deg,#f5faf8,#e7f0ee);display:grid;place-items:center;padding:24px}.login-card,.install-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:22px;padding:36px;box-shadow:0 24px 70px rgba(18,52,49,.12)}.install-card{width:min(760px,100%)}.login-card h1,.install-card h1{font-size:1.65rem;font-weight:750}.brand-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--nav);color:#fff;font-weight:800;margin-bottom:24px}.inbox{display:grid;grid-template-columns:350px minmax(0,1fr);height:calc(100vh - 96px);background:#fff;border:1px solid var(--line);border-radius:17px;overflow:hidden;box-shadow:var(--shadow)}.conversation-sidebar{border-right:1px solid var(--line);overflow-y:auto}.sidebar-head{padding:20px;position:sticky;top:0;background:#fff;z-index:2;border-bottom:1px solid var(--line)}.sidebar-head h1{font-size:1.25rem;font-weight:750;margin-bottom:14px}.conversation-item{display:flex;align-items:center;gap:11px;padding:14px 16px;color:inherit;text-decoration:none;border-bottom:1px solid #edf2f1;position:relative}.conversation-item:hover,.conversation-item.active{background:#eff8f5}.avatar{width:42px;height:42px;border-radius:13px;background:#dcecea;color:var(--brand-dark);font-weight:750;display:grid;place-items:center;flex:0 0 auto}.conversation-copy{min-width:0;flex:1}.conversation-copy>div{display:flex;justify-content:space-between;gap:8px}.conversation-copy strong,.conversation-copy p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-copy time{font-size:.68rem;color:var(--muted);white-space:nowrap}.conversation-copy p{margin:4px 0 0;color:var(--muted);font-size:.8rem}.unread-badge{position:absolute;right:14px;bottom:11px;background:var(--brand);color:#fff;border-radius:99px;min-width:19px;text-align:center;font-size:.7rem;padding:2px 5px}.chat-panel{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;background:#f6f9f8}.chat-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 22px;background:#fff;border-bottom:1px solid var(--line)}.chat-header h2{font-size:1rem;margin:0 0 3px}.chat-header p{font-size:.75rem;color:var(--muted);margin:0}.message-stream{padding:22px;overflow-y:auto}.message-row{display:flex;margin:8px 0}.message-row.outgoing{justify-content:flex-end}.bubble{max-width:min(72%,680px);background:#fff;border:1px solid var(--line);border-radius:6px 16px 16px 16px;padding:10px 12px;box-shadow:0 4px 12px rgba(29,52,50,.05)}.outgoing .bubble{background:#daf4e9;border-color:#c5e8dc;border-radius:16px 6px 16px 16px}.bubble p{margin:0;white-space:normal;overflow-wrap:anywhere}.bubble-meta{display:flex;justify-content:flex-end;gap:8px;font-size:.65rem;color:var(--muted);margin-top:5px}.message-status{font-weight:650}.status-failed{color:var(--danger)}.message-image,.bubble video{display:block;max-width:320px;width:100%;border-radius:10px;margin-bottom:8px}.bubble audio{max-width:280px}.media-missing,.bubble-type{display:block;color:var(--muted);margin-bottom:6px}.composer{background:#fff;border-top:1px solid var(--line);padding:14px 18px}.composer form{display:flex;gap:10px}.composer textarea{resize:none}.window-closed{background:#fff5db;padding:11px;border-radius:10px;color:#765500}.chat-empty{display:grid;place-items:center;align-content:center;text-align:center;height:100%;color:var(--muted)}.chat-empty h2{color:var(--ink);font-size:1.2rem}.empty-icon{font-size:2rem;width:58px;height:58px;border-radius:18px;background:var(--accent);color:var(--brand);display:grid;place-items:center;margin-bottom:15px}.empty-small{padding:40px 20px;text-align:center;color:var(--muted)}.log-payload{white-space:pre-wrap;max-width:600px;max-height:260px;overflow:auto;background:#132324;color:#cce9e1;border-radius:8px;padding:12px;font-size:.72rem}
@media(max-width:850px){.inbox{grid-template-columns:1fr;height:auto;min-height:calc(100vh - 100px)}.conversation-sidebar{max-height:300px;border-right:0;border-bottom:1px solid var(--line)}.chat-panel{min-height:580px}.chat-header{align-items:flex-start;flex-direction:column}.bubble{max-width:88%}}@media(max-width:576px){main.container-fluid{padding:12px!important}.panel-card{padding:17px}.inbox{border-radius:10px}.message-stream{padding:14px}.login-card{padding:25px}.metric-card{padding:15px}.metric-card strong{font-size:1.5rem}}