:root {
  --color-bg: #0b0d12;
  --color-sidebar: #11141a;
  --color-panel: #151920;
  --color-panel-raised: #1a1f27;
  --color-border: #272d37;
  --color-border-soft: #20252e;
  --color-text: #f2f4ef;
  --color-muted: #9199a6;
  --color-dim: #69717e;
  --color-accent: #c6ff4a;
  --color-accent-dark: #9bdb14;
  --color-violet: #9f8cff;
  --color-coral: #ff7a66;
  --color-amber: #ffbe5c;
  --color-danger: #ff6b6b;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --sidebar-width: 286px;
  --shadow: 0 18px 60px rgba(0, 0, 0, .24);
}

* { box-sizing: border-box; }
html { background: var(--color-bg); scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--color-text); background: var(--color-bg); font-family: "DM Sans", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button { color: inherit; }
button, [data-tab] { cursor: pointer; }
svg { width: 20px; height: 20px; fill: currentColor; }
.hidden { display: none !important; }
.app-shell { min-height: 100vh; }

.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-width); display: flex; flex-direction: column; padding: 24px 16px 18px; background:linear-gradient(180deg,#13171e 0%,#0e1116 100%); border-right: 1px solid #252b34; box-shadow:14px 0 40px rgba(0,0,0,.16); z-index: 40; }
.brand { display: flex; align-items: center; gap: 13px; padding: 0 10px 20px; }
.brand-mark { width: 38px; height: 38px; display: flex; justify-content: center; align-items: center; gap: 3px; border-radius: 11px; background: var(--color-accent); color: #111; }
.brand-mark span { width: 3px; border-radius: 5px; background: currentColor; }
.brand-mark span:nth-child(1) { height: 9px; }.brand-mark span:nth-child(2) { height: 19px; }.brand-mark span:nth-child(3) { height: 13px; }
.brand strong { display: block; font: 800 20px/1 "Manrope", sans-serif; letter-spacing: -.6px; }.brand small { display: block; margin-top: 5px; color:#7f8996; font-size: 10px; font-weight:700; letter-spacing: 1.5px; text-transform: uppercase; }
.sidebar-nav { flex:1;display:flex;flex-direction:column;gap:3px;margin-top:4px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#333a44 transparent; }
.nav-label { margin:13px 12px 5px; color:#687280; font-size:9px; font-weight:800; letter-spacing:1.45px; text-transform:uppercase; }.nav-label-secondary { margin-top:15px; }
.nav-item { position:relative;width:100%;min-height:43px;display:flex;align-items:center;gap:13px;padding:0 13px;border:1px solid transparent;border-radius:10px;background:transparent;color:#a5adb8;text-align:left;font-size:14px;font-weight:650;letter-spacing:-.1px;transition:.18s ease; }
.nav-item:hover { color:var(--color-text);border-color:#282f39;background:#191e25;transform:translateX(2px); }.nav-item.active { color:#eefdcf;border-color:rgba(198,255,74,.2);background:linear-gradient(90deg,rgba(198,255,74,.16),rgba(198,255,74,.035));box-shadow:inset 3px 0 0 var(--color-accent); }.nav-item svg { flex:0 0 auto;width:19px;height:19px;color:#75808d; }.nav-item.active svg{color:var(--color-accent)}.nav-item span { flex:1; }.nav-item b { padding:3px 6px;border-radius:5px;background:rgba(198,255,74,.12);color:var(--color-accent);font-size:9px;letter-spacing:.6px;text-transform:uppercase; }.nav-item.active b { background:var(--color-accent);color:#111; }
.sidebar-status { margin-top:14px;display:flex;align-items:center;gap:12px;padding:15px;border:1px solid #29313b;border-radius:12px;background:linear-gradient(135deg,#171c23,#10141a); }.sidebar-status small,.sidebar-status strong { display:block; }.sidebar-status small { color:#737e8b;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:1px; }.sidebar-status strong { margin-top:4px;color:#d5dae1;font-size:12px; }.status-orb { width:10px;height:10px;flex:0 0 auto;border-radius:50%;background:var(--color-amber);box-shadow:0 0 0 5px rgba(255,190,92,.1); }.status-orb.connected { background:var(--color-accent);box-shadow:0 0 0 5px rgba(198,255,74,.1); }.status-orb.error { background:var(--color-danger);box-shadow:0 0 0 5px rgba(255,107,107,.1); }

.main-area { min-height: 100vh; margin-left: var(--sidebar-width); }.topbar { position: sticky; top: 0; z-index: 30; height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 38px; border-bottom: 1px solid rgba(39,45,55,.9); background: rgba(11,13,18,.88); backdrop-filter: blur(18px); }.page-heading small { display: block; color: var(--color-muted); font-size: 10px; letter-spacing: 1.3px; text-transform: uppercase; }.page-heading h1 { margin: 3px 0 0; font: 700 20px/1.2 "Manrope", sans-serif; letter-spacing: -.4px; }.top-actions { display: flex; align-items: center; gap: 22px; }.live-indicator { display: flex; align-items: center; gap: 8px; color: var(--color-muted); font-size: 12px; }.live-indicator span { width: 7px; height: 7px; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 0 4px rgba(198,255,74,.1); animation: pulse 2s infinite; }.mobile-menu { display: none !important; }
.content { width: min(1480px, 100%); margin: 0 auto; padding: 34px 38px 60px; }.tab-panel { animation: enter .25s ease; }
@keyframes enter { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } } @keyframes pulse { 50% { opacity: .45; } }

.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 42px; padding: 0 17px; border: 1px solid transparent; border-radius: 10px; font-weight: 700; font-size: 13px; transition: .18s ease; }.button svg { width: 16px; height: 16px; }.button-primary { background: var(--color-accent); color: #10130b; }.button-primary:hover { background: #d1ff6d; transform: translateY(-1px); }.button-primary:disabled { opacity: .55; cursor: wait; transform: none; }.button-secondary { border-color: var(--color-border); background: var(--color-panel-raised); color: var(--color-text); }.button-secondary:hover { border-color: #46505f; background: #202630; }.button-light { background: var(--color-text); color: #131613; }.button-light:hover { background: var(--color-accent); }.button-large { min-height: 52px; padding-inline: 24px; }.text-button,.back-button { padding: 0; border: 0; background: transparent; color: var(--color-accent); font-weight: 700; font-size: 13px; }.text-button:hover,.back-button:hover { color: #dcff8f; }.icon-button { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-panel-raised); }.icon-button:hover { border-color: #46505f; }.button-loader { display: none; width: 16px; height: 16px; border: 2px solid rgba(0,0,0,.25); border-top-color: #111; border-radius: 50%; animation: spin .7s linear infinite; }.is-loading .button-label { opacity: .65; }.is-loading .button-loader { display: block; } @keyframes spin { to { transform: rotate(360deg); } }

.hero-card { min-height: 250px; display: flex; justify-content: space-between; gap: 40px; padding: 43px 46px; overflow: hidden; position: relative; border-radius: var(--radius-lg); background: var(--color-accent); color: #11140c; }.hero-card::after { content:""; position:absolute; width:340px; height:340px; right:22%; top:-180px; border: 48px solid rgba(17,20,12,.06); border-radius:50%; }.eyebrow { display: block; color: var(--color-muted); font-size: 10px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }.hero-card .eyebrow { color: rgba(17,20,12,.6); }.hero-copy { position: relative; z-index: 1; }.hero-copy h2 { max-width: 600px; margin: 10px 0 15px; font: 800 clamp(30px,4vw,48px)/1.02 "Manrope", sans-serif; letter-spacing: -2.3px; }.hero-copy h2 em { font-style: normal; color: rgba(17,20,12,.47); }.hero-copy p { max-width: 590px; margin: 0; color: rgba(17,20,12,.67); line-height: 1.6; font-size: 14px; }.hero-action { position: relative; z-index: 1; min-width: 245px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; }.hero-pulse { display:flex; gap:10px; align-items:center; padding:12px 14px; border:1px solid rgba(17,20,12,.12); border-radius:12px; background:rgba(255,255,255,.2); }.hero-pulse>span { width:9px; height:9px; border-radius:50%; background:#111; box-shadow:0 0 0 5px rgba(17,20,12,.09); }.hero-pulse small,.hero-pulse strong { display:block; }.hero-pulse small { font-size:9px; text-transform:uppercase; letter-spacing:.9px; opacity:.5; }.hero-pulse strong { margin-top:2px; font-size:12px; }
.kpi-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin: 16px 0; }.kpi-card { display: flex; align-items: flex-start; gap: 16px; min-height: 130px; padding: 24px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); background: var(--color-panel); }.kpi-icon { flex:0 0 auto; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; color:#10130b; font-weight:900; }.kpi-icon.mint{background:var(--color-accent)}.kpi-icon.violet{background:var(--color-violet)}.kpi-icon.amber{background:var(--color-amber)}.kpi-icon.coral{background:var(--color-coral)}.kpi-card small,.kpi-card span { display:block; }.kpi-card small { margin:1px 0 8px; color:var(--color-muted); font-size:11px; }.kpi-card strong { display:block; font:700 31px/1 "Manrope",sans-serif; letter-spacing:-1px; }.kpi-card span { margin-top:9px; color:var(--color-dim); font-size:10px; }
.panel { border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); background: var(--color-panel); }.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(280px,.7fr); gap:16px; margin-bottom:16px; }.chart-panel { min-height:350px; padding:26px; }.panel-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; }.panel-header h3 { margin:5px 0 0; font:700 17px/1.25 "Manrope",sans-serif; letter-spacing:-.3px; }.chart-legend { display:flex; gap:18px; color:var(--color-muted); font-size:10px; }.chart-legend span::before { content:""; display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; }.chart-legend .answered::before{background:var(--color-accent)}.chart-legend .failed::before{background:var(--color-coral)}.chart-wrap{position:relative;height:255px}.chart-wrap canvas{max-height:255px}.empty-chart{position:absolute;inset:0;display:grid;place-items:center;color:var(--color-dim);font-size:12px}.donut-wrap { position:relative; width:190px; height:190px; margin:4px auto 17px; }.donut-center { position:absolute; inset:0; display:grid; place-content:center; text-align:center; pointer-events:none; }.donut-center strong { font:800 26px/1 "Manrope",sans-serif; }.donut-center small { margin-top:5px; color:var(--color-dim); font-size:9px; text-transform:uppercase; letter-spacing:1px; }.outcome-list{display:flex;flex-direction:column;gap:10px}.outcome-list span{display:flex;align-items:center;color:var(--color-muted);font-size:11px}.outcome-list b{margin-left:auto;color:var(--color-text)}.dot{width:7px;height:7px;margin-right:8px;border-radius:50%}.mint-dot{background:var(--color-accent)}.red-dot{background:var(--color-coral)}.grey-dot{background:#4e5663}
.table-panel { overflow:hidden; }.table-panel>.panel-header { padding:24px 26px 0; }.table-scroll { overflow:auto; }.table-scroll::-webkit-scrollbar { height:6px; }.table-scroll::-webkit-scrollbar-thumb { background:#303742;border-radius:4px; } table { width:100%; border-collapse:collapse; white-space:nowrap; } th { padding:13px 20px; border-top:1px solid var(--color-border-soft); border-bottom:1px solid var(--color-border-soft); color:var(--color-dim); background:#12161c; font-size:9px; letter-spacing:1.1px; text-align:left; text-transform:uppercase; } td { padding:16px 20px; border-bottom:1px solid var(--color-border-soft); color:#bdc3cc; font-size:12px; } tbody tr:last-child td{border-bottom:0} tbody tr.clickable:hover{background:#191e25;cursor:pointer}.table-primary{display:flex;align-items:center;gap:10px}.table-avatar{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:#222832;color:var(--color-accent);font-weight:800;font-size:10px}.table-primary strong,.table-primary small{display:block}.table-primary strong{color:var(--color-text);font-size:12px}.table-primary small{margin-top:3px;color:var(--color-dim);font-size:9px}.progress-cell{min-width:160px}.progress-meta{display:flex;justify-content:space-between;margin-bottom:6px;color:var(--color-muted);font-size:10px}.progress-bar{height:4px;overflow:hidden;border-radius:5px;background:#2a3039}.progress-bar i{display:block;height:100%;border-radius:5px;background:var(--color-accent)}.badge { display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border-radius:6px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.5px }.badge::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.badge.ongoing,.badge.registered,.badge.dialing{color:var(--color-amber);background:rgba(255,190,92,.1)}.badge.completed,.badge.answered,.badge.ended{color:var(--color-accent);background:rgba(198,255,74,.09)}.badge.failed,.badge.error,.badge.not_connected{color:var(--color-danger);background:rgba(255,107,107,.1)}.badge.pending,.badge.draft{color:#929aa6;background:rgba(145,153,166,.1)}.badge.voicemail{color:var(--color-violet);background:rgba(159,140,255,.1)}.row-actions{display:flex;gap:6px;justify-content:flex-end}.row-action{width:29px;height:29px;border:1px solid var(--color-border);border-radius:8px;background:#191e25;color:var(--color-muted)}.row-action:hover{color:var(--color-text);border-color:#46505f}.row-action.danger:hover{color:var(--color-danger);border-color:rgba(255,107,107,.4)}.empty-state td{height:150px;text-align:center;color:var(--color-dim)}

.section-intro { display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin:8px 0 28px; }.section-intro h2 { margin:6px 0 7px;font:800 clamp(28px,4vw,38px)/1.1 "Manrope",sans-serif;letter-spacing:-1.4px }.section-intro p{margin:0;color:var(--color-muted);font-size:13px}.section-intro.split{align-items:center}.test-layout{display:grid;grid-template-columns:minmax(420px,1fr) minmax(330px,.8fr);gap:18px;align-items:start}.test-form{padding:32px}.form-heading{display:flex;gap:14px;align-items:flex-start;margin-bottom:32px}.form-heading h3{margin:0 0 6px;font:700 20px "Manrope",sans-serif}.form-heading p{margin:0;color:var(--color-muted);font-size:12px}.step-badge,.section-number{width:31px;height:31px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:var(--color-accent);color:#10130b;font-weight:900;font-size:10px}.field-label{display:block;margin:0 0 8px;color:#c2c7cf;font-size:11px;font-weight:700}.phone-field{height:64px;display:flex;align-items:center;border:1px solid #363d48;border-radius:12px;background:#101319;transition:.2s}.phone-field:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px rgba(198,255,74,.08)}.phone-field>span{padding-left:18px;color:var(--color-dim);font-size:19px}.phone-field input{flex:1;width:100%;height:100%;padding:0 15px 0 5px;border:0;outline:0;background:transparent;color:var(--color-text);font:700 22px "Manrope",sans-serif;letter-spacing:.5px}.phone-field i{margin-right:16px;color:var(--color-danger);font-style:normal;font-size:16px}.preset-stack{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.preset-row{display:flex;align-items:center;gap:10px;padding:14px;border:1px solid var(--color-border-soft);border-radius:11px;background:#12161c}.preset-icon{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:#252b34;color:var(--color-accent);font-size:9px;font-weight:900}.preset-row div{min-width:0;flex:1}.preset-row small,.preset-row strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preset-row small{color:var(--color-dim);font-size:8px;text-transform:uppercase;letter-spacing:.7px}.preset-row strong{margin-top:3px;font-size:10px}.preset-row>b{display:none}.real-call-notice{display:flex;gap:10px;align-items:center;margin-bottom:22px;padding:12px;border-radius:10px;background:rgba(255,190,92,.07);color:#d9b66c}.real-call-notice>span{width:22px;height:22px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-weight:800;font-size:10px}.real-call-notice p,.real-call-notice strong{display:block;margin:0}.real-call-notice p{font-size:10px;line-height:1.5}.real-call-notice strong{color:var(--color-amber)}.test-form>.button{width:100%}.test-side{display:flex;flex-direction:column;gap:18px}.status-card{min-height:390px;padding:34px;text-align:center}.status-visual{position:relative;width:142px;height:142px;display:grid;place-items:center;margin:0 auto 22px}.ring{position:absolute;border:1px solid rgba(198,255,74,.2);border-radius:50%}.ring-one{inset:16px}.ring-two{inset:0}.status-visual.active .ring-one{animation:ring 1.5s infinite}.status-visual.active .ring-two{animation:ring 1.5s .35s infinite}.phone-core{position:relative;z-index:1;width:72px;height:72px;display:grid;place-items:center;border-radius:50%;background:var(--color-accent);color:#111;font-size:24px;box-shadow:0 0 40px rgba(198,255,74,.16)}@keyframes ring{70%,100%{transform:scale(1.15);opacity:0}}.status-card h3{margin:7px 0 9px;font:700 19px/1.3 "Manrope",sans-serif}.status-card>p{max-width:390px;margin:0 auto;color:var(--color-muted);font-size:12px;line-height:1.6}.call-result{margin-top:18px;padding:13px;border-radius:10px;background:#101319;text-align:left;color:var(--color-muted);font-size:11px}.call-result strong{color:var(--color-text)}.mini-history{padding:24px}.mini-history .panel-header{margin-bottom:10px}.timeline{display:flex;flex-direction:column}.timeline-item{display:grid;grid-template-columns:9px 1fr auto;gap:11px;align-items:center;padding:12px 0;border-bottom:1px solid var(--color-border-soft)}.timeline-item:last-child{border:0}.timeline-item>i{width:7px;height:7px;border-radius:50%;background:var(--color-dim)}.timeline-item>i.success{background:var(--color-accent)}.timeline-item strong,.timeline-item small{display:block}.timeline-item strong{font-size:11px}.timeline-item small{margin-top:3px;color:var(--color-dim);font-size:9px}.timeline-item>span{color:var(--color-muted);font-size:9px}.timeline-empty{padding:25px 0;color:var(--color-dim);font-size:11px;text-align:center}

.filter-bar{display:flex;align-items:center;gap:10px;margin-bottom:14px}.search-box{min-width:260px;flex:1;position:relative}.search-box svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;fill:none;stroke:var(--color-dim);stroke-width:1.8}.search-box input,.filter-bar select,input[type="text"],select{width:100%;height:43px;border:1px solid var(--color-border);border-radius:10px;outline:0;background:var(--color-panel);color:var(--color-text);font-size:12px}.search-box input{padding:0 14px 0 41px}.filter-bar select{width:auto;min-width:160px;padding:0 35px 0 13px}.search-box input:focus,.filter-bar select:focus,input[type="text"]:focus{border-color:#4f5967}.result-count{margin-left:8px;color:var(--color-dim);font-size:10px}.campaign-builder{max-width:980px;margin:0 auto}.builder-steps{display:flex;align-items:center;justify-content:center;margin-bottom:22px}.builder-steps>div{display:flex;align-items:center;gap:9px;color:var(--color-dim)}.builder-steps>div>span{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--color-border);border-radius:50%;font-size:10px}.builder-steps .active{color:var(--color-text)}.builder-steps .active>span{border-color:var(--color-accent);background:var(--color-accent);color:#111}.builder-steps p,.builder-steps strong,.builder-steps small{display:block;margin:0}.builder-steps strong{font-size:10px}.builder-steps small{margin-top:2px;color:var(--color-dim);font-size:8px}.builder-steps>i{width:70px;height:1px;margin:0 17px;background:var(--color-border)}.builder-form{padding:34px}.form-section{display:flex;gap:22px}.form-section-body{width:100%}.form-section-body h3{margin:2px 0 5px;font:700 17px "Manrope",sans-serif}.form-section-body>p{margin:0 0 20px;color:var(--color-muted);font-size:11px}.form-section-body input[type="text"]{padding:0 14px}.form-divider{height:1px;margin:28px 0;background:var(--color-border-soft)}.auto-config{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:14px;padding:16px;border:1px solid var(--color-border-soft);border-radius:11px;background:#12161c}.auto-config small,.auto-config strong{display:block}.auto-config small{color:var(--color-dim);font-size:8px;text-transform:uppercase}.auto-config strong{margin-top:4px;font-size:11px}.auto-config>span{color:var(--color-accent);font-size:9px;font-weight:800;text-transform:uppercase}.upload-zone{height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #46505f;border-radius:13px;background:#11151b;transition:.2s}.upload-zone:hover,.upload-zone.dragging{border-color:var(--color-accent);background:rgba(198,255,74,.025)}.upload-zone input{position:absolute;width:1px;height:1px;opacity:0}.upload-icon{width:42px;height:42px;display:grid;place-items:center;margin-bottom:10px;border-radius:11px;background:#222832;color:var(--color-accent);font-size:20px}.upload-zone strong{font-size:12px}.upload-zone small{margin-top:5px;color:var(--color-dim);font-size:9px}.sample-link{margin-top:12px}.csv-preview{margin-top:12px;padding:14px;border:1px solid var(--color-border);border-radius:10px;background:#11151b}.csv-file-head{display:flex;align-items:center;gap:10px}.csv-file-head>span{width:33px;height:33px;display:grid;place-items:center;border-radius:8px;background:rgba(198,255,74,.1);color:var(--color-accent);font-size:9px;font-weight:900}.csv-file-head strong,.csv-file-head small{display:block}.csv-file-head strong{font-size:11px}.csv-file-head small{margin-top:3px;color:var(--color-dim);font-size:9px}.csv-file-head button{margin-left:auto;border:0;background:transparent;color:var(--color-danger)}.csv-table{margin-top:12px;overflow:auto;max-height:190px}.csv-table table{white-space:nowrap}.csv-table th,.csv-table td{padding:8px 10px;font-size:9px}.form-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:30px -34px -34px;padding:20px 34px;border-top:1px solid var(--color-border-soft);background:#12161c;border-radius:0 0 var(--radius-md) var(--radius-md)}.form-footer p{display:flex;align-items:center;gap:8px;max-width:430px;margin:0;color:var(--color-dim);font-size:9px}.form-footer p span{width:18px;height:18px;display:grid;place-items:center;border:1px solid var(--color-dim);border-radius:50%}
.settings-grid{display:grid;grid-template-columns:1.25fr .8fr .8fr;gap:15px}.connection-card,.resource-card{min-height:250px;padding:28px}.connection-heading{display:flex;align-items:center;gap:12px}.connection-logo,.resource-avatar{width:45px;height:45px;display:grid;place-items:center;border-radius:12px;background:var(--color-accent);color:#111;font:800 16px "Manrope",sans-serif}.connection-heading div{flex:1}.connection-heading small{color:var(--color-dim);font-size:9px;text-transform:uppercase}.connection-heading h3{margin:3px 0 0;font:700 18px "Manrope",sans-serif}.connection-card>p{max-width:500px;margin:25px 0;color:var(--color-muted);font-size:12px;line-height:1.6}.status-chip{display:inline-flex;padding:5px 8px;border-radius:6px;font-size:8px;font-weight:800;text-transform:uppercase}.status-chip.success{color:var(--color-accent);background:rgba(198,255,74,.09)}.status-chip.error{color:var(--color-danger);background:rgba(255,107,107,.09)}.resource-card{text-align:center}.resource-card .eyebrow{text-align:left}.resource-avatar{margin:22px auto 13px;background:var(--color-violet)}.resource-avatar.phone{background:var(--color-amber)}.resource-card h3{margin:0;font:700 15px "Manrope",sans-serif}.resource-card code,.resource-card p{display:block;max-width:220px;margin:7px auto 16px;overflow:hidden;color:var(--color-dim);font-size:9px;text-overflow:ellipsis}.safety-card{grid-column:1/-1;display:flex;align-items:center;gap:20px;padding:27px}.safety-icon{width:50px;height:50px;display:grid;place-items:center;border-radius:13px;background:#222832;color:var(--color-accent);font-size:23px}.safety-card h3{margin:5px 0;font:700 16px "Manrope",sans-serif}.safety-card p{margin:0;color:var(--color-muted);font-size:11px}.detail-kpis{grid-template-columns:repeat(4,1fr)}.back-button{margin-bottom:20px}

.confirm-dialog{width:min(480px,calc(100% - 30px));padding:0;border:1px solid #343b46;border-radius:20px;background:var(--color-panel-raised);color:var(--color-text);box-shadow:var(--shadow)}.confirm-dialog::backdrop{background:rgba(3,5,8,.78);backdrop-filter:blur(5px)}.confirm-dialog form{position:relative;padding:36px;text-align:center}.dialog-close{position:absolute;right:16px;top:16px;width:32px;height:32px;border:1px solid var(--color-border);border-radius:8px;background:#11151b;color:var(--color-muted);font-size:20px}.dialog-icon{width:66px;height:66px;display:grid;place-items:center;margin:0 auto 18px;border-radius:50%;background:var(--color-accent);color:#111;font-size:23px}.confirm-dialog h2{margin:8px 0 10px;font:700 23px/1.35 "Manrope",sans-serif}.confirm-dialog h2 strong{color:var(--color-accent)}.confirm-dialog p{margin:0;color:var(--color-muted);font-size:12px;line-height:1.6}.dialog-summary{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:23px 0;text-align:left}.dialog-summary span{padding:12px;border-radius:9px;background:#11151b;color:var(--color-dim);font-size:9px}.dialog-summary b{display:block;margin-top:4px;color:var(--color-text);font-size:10px}.dialog-actions{display:grid;grid-template-columns:1fr 1.4fr;gap:9px}.detail-drawer{position:fixed;inset:0;z-index:60;visibility:hidden}.detail-drawer.open{visibility:visible}.drawer-backdrop{position:absolute;inset:0;background:rgba(2,4,7,.65);opacity:0;transition:.25s}.drawer-panel{position:absolute;inset:0 0 0 auto;width:min(520px,100%);padding:38px;overflow:auto;border-left:1px solid var(--color-border);background:var(--color-panel);transform:translateX(100%);transition:.25s}.detail-drawer.open .drawer-backdrop{opacity:1}.detail-drawer.open .drawer-panel{transform:none}.drawer-section{margin-top:24px;padding-top:22px;border-top:1px solid var(--color-border)}.drawer-section h4{margin:0 0 10px;font-size:11px;text-transform:uppercase;letter-spacing:1px}.drawer-section p{white-space:pre-wrap;color:var(--color-muted);font-size:12px;line-height:1.7}.drawer-title h2{margin:7px 0;font:800 26px "Manrope",sans-serif}.drawer-meta{color:var(--color-muted);font-size:11px}.drawer-stats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:22px}.drawer-stats div{padding:15px;border-radius:10px;background:#101319}.drawer-stats small,.drawer-stats strong{display:block}.drawer-stats small{color:var(--color-dim);font-size:8px;text-transform:uppercase}.drawer-stats strong{margin-top:5px;font-size:12px}.audio-link{display:inline-flex;margin-top:8px;color:var(--color-accent);font-size:11px}.toast-region{position:fixed;right:22px;bottom:22px;z-index:90;display:flex;flex-direction:column;gap:9px}.toast{min-width:280px;max-width:380px;display:flex;align-items:flex-start;gap:11px;padding:14px 16px;border:1px solid var(--color-border);border-radius:11px;background:#1d222a;box-shadow:var(--shadow);animation:toast-in .25s ease}.toast>span{width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:rgba(198,255,74,.1);color:var(--color-accent);font-size:10px}.toast.error>span{background:rgba(255,107,107,.1);color:var(--color-danger)}.toast strong,.toast small{display:block}.toast strong{font-size:11px}.toast small{margin-top:3px;color:var(--color-muted);font-size:9px}@keyframes toast-in{from{opacity:0;transform:translateY(8px)}}

/* Mini CRM operativo */
.opportunity-promotion{display:inline-flex!important;margin-bottom:10px;padding:5px 8px;border-radius:6px;background:rgba(159,140,255,.12);color:var(--color-violet);font-size:8px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.promotion-field>label{display:block;color:var(--color-muted);font-size:10px;font-weight:700}.select-with-action{display:grid;grid-template-columns:1fr 44px;gap:8px;margin-top:7px}.select-with-action select{margin-top:0}.select-with-action button{border:1px solid rgba(198,255,74,.35);border-radius:9px;background:rgba(198,255,74,.1);color:var(--color-accent);font-size:22px}.select-with-action button:hover{background:var(--color-accent);color:#111}.inline-create{display:grid;grid-template-columns:1.3fr 1fr auto;gap:8px;margin-top:9px;padding:12px;border:1px solid var(--color-border);border-radius:10px;background:#11151b}.inline-create input{margin-top:0}.inline-create .button{height:44px}
.crm-editor{width:min(660px,calc(100% - 30px))}.crm-editor form{text-align:left}.crm-editor h2{text-align:left}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:25px 0}.editor-grid label{color:var(--color-muted);font-size:10px;font-weight:700}.editor-grid input,.editor-grid select{width:100%;height:44px;margin-top:7px;padding:0 12px;border:1px solid var(--color-border);border-radius:9px;background:#101319;color:var(--color-text)}.editor-wide{grid-column:1/-1}.editor-actions{display:flex;justify-content:flex-end;gap:9px;padding-top:18px;border-top:1px solid var(--color-border)}.table-crm-actions{display:flex;justify-content:flex-end;gap:6px}.table-crm-actions button,.opportunity-actions button{width:30px;height:30px;border:1px solid var(--color-border);border-radius:8px;background:#191e25;color:var(--color-muted)}.table-crm-actions button:hover,.opportunity-actions button:hover{border-color:var(--color-accent);color:var(--color-accent)}.table-crm-actions .delete:hover,.opportunity-actions .delete:hover{border-color:var(--color-danger);color:var(--color-danger)}.opportunity-card{position:relative}.opportunity-actions{display:flex;gap:5px;margin-top:12px;padding-top:10px;border-top:1px solid var(--color-border-soft)}
.crm-list{display:grid;gap:9px}.crm-list-item{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 17px;border:1px solid var(--color-border-soft);border-radius:11px;background:#11151b;transition:.18s ease}.crm-list-item:hover{border-color:#3c4653;transform:translateY(-1px)}.crm-list-item strong,.crm-list-item small{display:block}.crm-list-item small{margin-top:4px;color:var(--color-muted);font-size:10px}.crm-list-item b{color:var(--color-accent);font-size:11px}.pipeline-board{display:grid;grid-template-columns:repeat(5,minmax(190px,1fr));gap:14px;overflow-x:auto;padding:2px 0 10px}.pipeline-column{min-height:360px;padding:14px;border:1px solid var(--color-border-soft);border-radius:14px;background:#101319}.pipeline-column>header{display:flex;align-items:center;justify-content:space-between;padding:4px 3px 13px;color:var(--color-muted);font-size:10px;text-transform:uppercase;letter-spacing:.8px}.pipeline-column>header strong{color:var(--color-text);font-size:12px}.pipeline-column>header span{min-width:23px;padding:4px 6px;border-radius:12px;background:#252b34;color:var(--color-text);text-align:center}.opportunity-card{width:100%;margin-bottom:9px;padding:15px;border:1px solid var(--color-border);border-radius:11px;background:var(--color-panel-raised);color:var(--color-text);text-align:left}.opportunity-card strong,.opportunity-card small,.opportunity-card b,.opportunity-card i{display:block}.opportunity-card small{margin:5px 0 13px;color:var(--color-muted);font-size:10px}.opportunity-card b{color:var(--color-accent);font-size:14px}.opportunity-card i{margin-top:7px;color:var(--color-dim);font-size:9px;font-style:normal}.pipeline-empty{padding:26px 10px;color:var(--color-dim);font-size:10px;text-align:center}.stage-bars{display:grid;gap:17px;padding:0 26px 28px}.stage-bars>div{display:grid;grid-template-columns:130px minmax(140px,1fr) 45px;align-items:center;gap:14px;color:var(--color-muted);font-size:11px}.stage-bars i{display:block;height:10px;overflow:hidden;border-radius:9px;background:#252b34}.stage-bars i>b{display:block;height:100%;min-width:0;border-radius:9px;background:linear-gradient(90deg,var(--color-accent-dark),var(--color-accent))}.stage-bars>div>strong{text-align:right;color:var(--color-text);font-size:12px}.outcome-action{width:100%;margin-top:18px}.confirm-dialog textarea,.confirm-dialog select{width:100%;padding:12px 13px;border:1px solid var(--color-border);border-radius:9px;background:#101319;color:var(--color-text);resize:vertical}.confirm-dialog textarea:focus,.confirm-dialog select:focus{outline:2px solid rgba(198,255,74,.18);border-color:var(--color-accent)}

@media(max-width:1100px){.kpi-grid{grid-template-columns:1fr 1fr}.dashboard-grid{grid-template-columns:1fr}.chart-panel.compact{min-height:auto}.test-layout{grid-template-columns:1fr}.settings-grid{grid-template-columns:1fr 1fr}.connection-card{grid-column:1/-1}.hero-card{padding:36px}.hero-action{min-width:210px}.preset-row>b{display:none}}
@media(max-width:800px){:root{--sidebar-width:260px}.sidebar{transform:translateX(-100%);transition:.25s;box-shadow:var(--shadow)}.sidebar.open{transform:none}.main-area{margin-left:0}.topbar{height:72px;padding:0 18px}.mobile-menu{display:inline-flex!important}.live-indicator{display:none}.content{padding:23px 16px 45px}.hero-card{min-height:auto;display:block;padding:29px}.hero-card::after{display:none}.hero-action{align-items:flex-start;gap:25px;margin-top:25px}.hero-copy h2{font-size:34px}.section-intro{align-items:flex-start;flex-direction:column}.section-intro.split{align-items:flex-start}.test-layout{display:block}.test-side{margin-top:15px}.filter-bar{align-items:stretch;flex-wrap:wrap}.search-box{min-width:100%}.filter-bar select{flex:1}.result-count{width:100%}.builder-steps p{display:none}.builder-steps>i{width:35px}.form-section{gap:13px}.form-footer{align-items:stretch;flex-direction:column}.settings-grid{grid-template-columns:1fr}.resource-card,.connection-card{grid-column:auto}.safety-card{grid-column:auto}.top-actions .button{font-size:0;width:42px;padding:0}.top-actions .button svg{width:18px}.page-heading{flex:1}}
@media(max-width:560px){.kpi-grid{grid-template-columns:1fr}.kpi-card{min-height:105px}.hero-pulse{display:none}.hero-action{margin-top:22px}.preset-stack{grid-template-columns:1fr}.test-form,.builder-form{padding:22px}.form-footer{margin:25px -22px -22px;padding:20px 22px}.auto-config{grid-template-columns:1fr}.auto-config>span{display:none}.section-number{display:none}.chart-panel{padding:20px}.settings-grid{display:block}.settings-grid>.panel{margin-bottom:13px}.dialog-summary,.dialog-actions{grid-template-columns:1fr}.confirm-dialog form{padding:30px 22px}.drawer-panel{padding:30px 22px}.toast-region{left:12px;right:12px}.toast{min-width:0;max-width:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
