:root{--bg: #0f1420;--panel: #171e2e;--panel2: #1e2740;--text: #e6ebf5;--muted: #8b96ad;--accent: #4f8cff;--ok: #2ecc71;--warn: #f39c12;--err: #e74c3c}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}.app{max-width:1100px;margin:0 auto;padding:0 16px 40px}.topbar{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid #263048;flex-wrap:wrap}.topbar h1{font-size:18px;margin:0}.topbar nav{display:flex;gap:6px;flex:1}.tab{background:var(--panel);color:var(--text);border:1px solid #2a3450;padding:7px 14px;border-radius:8px;cursor:pointer}.tab.active{background:var(--accent);border-color:var(--accent)}.ws{font-size:12px;padding:4px 10px;border-radius:999px}.ws.ok{background:#123a24;color:var(--ok)}.ws.ko{background:#3a1212;color:var(--err)}main{padding-top:18px}h2{font-size:15px;margin:22px 0 10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.grid8{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media (max-width: 800px){.grid8{grid-template-columns:repeat(2,1fr)}}.card{border-radius:10px;padding:12px;border:1px solid #2a3450}.card.free{background:#14231b;border-color:#1f4d33}.card.busy{background:#2b2412;border-color:#6e5a1e}.card.off{background:var(--panel);opacity:.65}.card-title{font-weight:700;margin-bottom:4px}.card .state{font-size:12px;margin-bottom:8px;color:var(--muted)}.card dl{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0;font-size:12px}.card dt{color:var(--muted)}.card dd{margin:0}.campaign-form{display:flex;flex-direction:column;gap:10px;max-width:460px;background:var(--panel);padding:16px;border-radius:10px;border:1px solid #2a3450}label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}input,textarea,select{background:var(--panel2);color:var(--text);border:1px solid #2a3450;border-radius:6px;padding:8px;font:inherit}.webrtc-box{background:var(--panel2);border:1px solid #2a3450;border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:8px}.webrtc-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.webrtc-head button{background:var(--panel);color:var(--text);border:1px solid #2a3450;border-radius:6px;padding:6px 12px;cursor:pointer}.warn{color:var(--warn);font-size:13px;margin:0}.toasts{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;z-index:100;max-width:360px}.toast{background:var(--panel2);border:1px solid #2a3450;border-radius:8px;padding:10px 14px;font-size:13px;box-shadow:0 4px 16px #0006;animation:toast-in .2s ease-out}.toast.ok{border-color:#1f4d33}.toast.warn{border-color:#6e5a1e}.toast.err{border-color:#6e1e1e}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}button.primary{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:10px;font-weight:600;cursor:pointer}button.primary:disabled{opacity:.5;cursor:default}.error{color:var(--err)}.ok{color:var(--ok)}.muted{color:var(--muted);font-size:12px}.badge{padding:2px 10px;border-radius:999px;font-size:12px;background:var(--panel2)}.badge.s-bridged,.badge.s-ended{background:#123a24;color:var(--ok)}.badge.s-failed,.badge.s-interrupted{background:#3a1212;color:var(--err)}.badge.s-winner,.badge.s-client_dialing,.badge.s-dialing{background:#2b2412;color:var(--warn)}.campaign-list{display:flex;flex-direction:column;gap:8px}.campaign{background:var(--panel);border:1px solid #2a3450;border-radius:10px;padding:10px 14px}.campaign-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.legs{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.leg{font-size:12px;padding:3px 8px;border-radius:6px;background:var(--panel2)}.leg.st-answered,.leg.st-bridged{color:var(--ok)}.leg.st-failed,.leg.st-ended{color:var(--muted)}.leg.r-client{border:1px dashed #3a4569}.table{width:100%;border-collapse:collapse;background:var(--panel);border-radius:10px;overflow:hidden}.table th,.table td{text-align:left;padding:8px 10px;border-bottom:1px solid #232d45;font-size:13px}.table th{color:var(--muted);font-weight:600}.logbox{background:var(--panel);border:1px solid #2a3450;border-radius:10px;padding:10px 14px;max-height:420px;overflow-y:auto;font-family:ui-monospace,monospace;font-size:12px}.log{padding:2px 0}.log .ts{color:var(--muted);margin-right:10px}.log.l-warn{color:var(--warn)}.log.l-error{color:var(--err)}.sms-form{display:flex;flex-direction:column;gap:10px;max-width:460px;background:var(--panel);padding:16px;border-radius:10px;border:1px solid #2a3450}
