:root{color:#18212b;background:#f4f7f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--ink: #17212b;--muted: #697783;--line: rgba(24, 33, 43, .1);--panel: rgba(255, 255, 255, .86);--panel-solid: #ffffff;--teal: #0f766e;--teal-bright: #22b8a5;--blue: #2868c7;--gold: #c89b32;--danger: #b13b4a;--shadow: 0 22px 60px rgba(28, 42, 55, .13);--shadow-soft: 0 10px 28px rgba(28, 42, 55, .09)}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select{font:inherit}button{border:0;border-radius:8px;background:linear-gradient(135deg,#0f766e,#2868c7);color:#fff;display:inline-flex;gap:8px;align-items:center;justify-content:center;min-height:42px;padding:10px 15px;cursor:pointer;box-shadow:0 12px 24px #0f766e30;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}button:hover{transform:translateY(-1px);box-shadow:0 16px 32px #2868c733}button:active{transform:translateY(0)}button:disabled{cursor:wait;opacity:.68;transform:none;box-shadow:none}button.ghost,.secondaryAction,.iconButton,.dangerAction{background:#ffffffc7;color:var(--ink);border:1px solid var(--line);box-shadow:none}.dangerAction{color:var(--danger)}.dangerAction:hover{border-color:#b13b4a3d;box-shadow:0 14px 28px #b13b4a1f}.iconButton{width:42px;padding:0}.primaryAction{width:100%;justify-content:space-between;margin-top:4px}.login{min-height:100vh;display:grid;place-items:center;position:relative;overflow:hidden;padding:24px;background:radial-gradient(circle at 15% 18%,rgba(34,184,165,.18),transparent 30%),linear-gradient(135deg,#f7fafb,#e8eef3 48%,#f5f1e5)}.loginTexture,.shell:before{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(23,33,43,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(23,33,43,.035) 1px,transparent 1px);background-size:42px 42px;-webkit-mask-image:linear-gradient(to bottom,black,transparent 82%);mask-image:linear-gradient(to bottom,black,transparent 82%)}.loginPanel{width:min(460px,calc(100vw - 32px));background:#ffffffc2;border:1px solid rgba(255,255,255,.72);border-radius:8px;padding:30px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:riseIn .52s ease both}.brand,.sideBrand,.topIdentity,.topActions,.pageTitle,.metricTop,.panelTitle,.trustStrip,.sideStatus{display:flex;align-items:center}.brand{gap:14px;margin-bottom:24px}.brandMark,.pageIcon,.iconBadge{display:inline-grid;place-items:center;flex:0 0 auto;border-radius:8px;color:#fff;background:linear-gradient(135deg,var(--teal),var(--blue));box-shadow:0 14px 30px #0f766e38}.brandMark{width:52px;height:52px}.brandMark.small{width:42px;height:42px}.iconBadge,.pageIcon{width:38px;height:38px}.iconBadge.mini{width:30px;height:30px;border-radius:8px}.iconBadge.whatsapp{background:linear-gradient(135deg,#128c7e,#24d366)}.iconBadge,.iconBadge svg{color:#fff;stroke:#fff}.brand h1,h1,h2,h3,p{margin:0}.brand p,.pageTitle p,header span,.metrics span,.metrics small,.sideBrand p{color:var(--muted)}form{display:grid;gap:12px}.field,label{display:grid;gap:7px;color:#44525e;font-weight:650}.field.compact{min-width:0}.fieldLabel{display:inline-flex;align-items:center;gap:7px;min-width:0}.helpTip{position:relative;display:inline-grid;place-items:center;width:22px;height:22px;color:var(--blue);background:#2868c714;border:1px solid rgba(40,104,199,.16);border-radius:999px;cursor:help;outline:none;transition:transform .16s ease,background .16s ease,color .16s ease}.helpTip:hover,.helpTip:focus{color:#fff;background:linear-gradient(135deg,var(--teal),var(--blue));transform:translateY(-1px)}.tooltip{position:absolute;left:50%;bottom:calc(100% + 10px);z-index:20;width:min(300px,calc(100vw - 42px));display:grid;gap:8px;padding:12px;color:#dce6e2;background:#121b24f7;border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 18px 44px #121b2438;font-size:13px;font-weight:520;line-height:1.35;opacity:0;pointer-events:none;transform:translate(-50%) translateY(6px) scale(.98);transition:opacity .15s ease,transform .15s ease}.tooltip:after{content:"";position:absolute;left:50%;top:100%;width:10px;height:10px;background:#121b24f7;transform:translate(-50%,-5px) rotate(45deg)}.tooltip strong{color:#f6d784;font-weight:750}.helpTip:hover .tooltip,.helpTip:focus .tooltip{opacity:1;transform:translate(-50%) translateY(0) scale(1)}input,select{width:100%;border:1px solid rgba(24,33,43,.12);border-radius:8px;min-height:43px;padding:11px 12px;background:#ffffffdb;outline:none;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}input:focus,select:focus{border-color:#2868c785;box-shadow:0 0 0 4px #2868c71f}.error{color:var(--danger);background:#b13b4a14;border:1px solid rgba(177,59,74,.16);border-radius:8px;padding:10px 12px}.trustStrip{gap:8px;flex-wrap:wrap;margin-top:18px}.trustStrip span,.sideStatus{border:1px solid rgba(24,33,43,.1);border-radius:999px;padding:7px 10px;color:#43515d;background:#ffffffa3;display:inline-flex;align-items:center;gap:6px;font-size:13px}.shell{min-height:100vh;display:grid;grid-template-columns:280px minmax(0,1fr);background:linear-gradient(120deg,rgba(40,104,199,.08),transparent 36%),linear-gradient(145deg,#f5f7f8,#eef3f4 58%,#f7f2e6)}aside{position:sticky;top:0;height:100vh;color:#fff;padding:22px;background:linear-gradient(180deg,#121d28fa,#13292ff5),#17212b;box-shadow:18px 0 50px #17212b24}.sideBrand{gap:12px;margin-bottom:28px}.sideBrand p{font-size:13px}nav{display:grid;gap:8px}nav button{position:relative;width:100%;justify-content:flex-start;background:transparent;color:#dce6e2;text-align:left;box-shadow:none;border:1px solid transparent}nav button:before{content:"";position:absolute;left:-1px;width:3px;height:22px;border-radius:999px;background:transparent;transition:background .18s ease}nav button:hover,nav button.active{background:#ffffff17;border-color:#ffffff14}nav button.active:before{background:var(--gold)}.sideStatus{position:absolute;left:22px;right:22px;bottom:22px;justify-content:center;background:#ffffff14;color:#dce6e2;border-color:#ffffff1f}.liveDot{width:9px;height:9px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 6px #22c55e21;animation:pulse 1.8s ease infinite}main{min-width:0;padding:24px;position:relative}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;background:#ffffffa8;border:1px solid rgba(255,255,255,.78);border-radius:8px;padding:12px;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.topIdentity,.topActions{gap:10px}.avatar{width:42px;height:42px;border-radius:8px;display:grid;place-items:center;color:#fff;font-weight:800;background:linear-gradient(135deg,#17212b,#2868c7)}header div div{display:grid}section{display:grid;gap:18px;animation:fadeSlide .26s ease both}.pageTitle{gap:13px}.pageToolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.pageTitle h1{font-size:clamp(28px,3vw,40px);line-height:1.05;letter-spacing:0}.metrics{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:14px}.metrics article,.queuePanel,.formsGrid form,.tableWrap,.notice,.empty{background:var(--panel);border:1px solid rgba(255,255,255,.74);border-radius:8px;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.metrics article{min-height:154px;display:grid;gap:12px;padding:16px;overflow:hidden;position:relative;transition:transform .18s ease,box-shadow .18s ease}.metrics article:after{content:"";position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--teal),var(--blue),var(--gold))}.metrics article:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.metricTop{justify-content:space-between;gap:12px}.metrics strong{font-size:38px;line-height:1}.metrics small{display:inline-flex;gap:6px;align-items:center;font-size:13px}.queuePanel{padding:16px}.panelTitle{gap:8px;color:#33424f;font-weight:800;margin-bottom:12px}.queueCards{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:10px}.queueCard{display:flex;gap:10px;align-items:center;min-height:96px;padding:12px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:linear-gradient(135deg,#ffffffeb,#ffffffad),#ffffffc7;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.queueCard:hover{transform:translateY(-2px);border-color:#2868c733;box-shadow:0 12px 28px #1c2a371a}.queueIcon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;color:#fff;background:linear-gradient(135deg,var(--teal),var(--blue))}.queueIcon svg{color:#fff;stroke:#fff}.queueCard.failed .queueIcon{background:linear-gradient(135deg,#b13b4a,#d97706)}.queueCard.completed .queueIcon{background:linear-gradient(135deg,#0f766e,#22c55e)}.queueCard.delayed .queueIcon,.queueCard.paused .queueIcon{background:linear-gradient(135deg,#c89b32,#2868c7)}.queueCard div{display:grid;gap:3px;min-width:0}.queueCard span{color:var(--muted);font-size:12px;font-weight:750;text-transform:uppercase}.queueCard strong{color:var(--ink);font-size:28px;line-height:1}.queueCard small{color:#44525e;font-weight:650}.inlineForm{display:grid;grid-template-columns:220px minmax(260px,1fr) auto;gap:10px;align-items:center;background:#ffffff8a;border:1px solid rgba(255,255,255,.76);border-radius:8px;padding:12px;box-shadow:var(--shadow-soft)}.appGrid{display:grid;grid-template-columns:repeat(2,minmax(280px,1fr));gap:14px}.appCard{display:grid;gap:14px;padding:16px;background:var(--panel);border:1px solid rgba(255,255,255,.74);border-radius:8px;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.appCardHeader,.assignRow,.appActions,.assignedChannel{display:flex;align-items:center;gap:10px}.appCardHeader{justify-content:space-between}.appCardHeader h3{font-size:21px}.appCardHeader p,.appWebhook,.mutedLine{color:var(--muted)}.appWebhook{padding:10px 12px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#18212b0a;overflow-wrap:anywhere}.appSectionTitle{display:inline-flex;align-items:center;gap:7px;color:#33424f;font-size:13px;font-weight:850;text-transform:uppercase}.assignedChannels{display:grid;gap:8px}.assignedChannel{padding:10px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#ffffff9e}.assignedChannel div{display:grid;gap:2px;min-width:0;flex:1}.assignedChannel small{color:var(--muted);overflow-wrap:anywhere}.assignRow{display:grid;grid-template-columns:minmax(0,1fr) auto}.appActions{justify-content:flex-end;flex-wrap:wrap}.formsGrid{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:16px}.channelGrid{display:grid;grid-template-columns:repeat(3,minmax(240px,1fr));gap:14px}.channelCard{display:grid;gap:15px;min-height:250px;padding:16px;background:var(--panel);border:1px solid rgba(255,255,255,.74);border-radius:8px;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.channelCard:hover{transform:translateY(-3px);border-color:#2868c72e;box-shadow:var(--shadow)}.channelCardTop,.channelActions,.modalHeader,.modalActions{display:flex;align-items:center;justify-content:space-between;gap:10px}.channelBody{display:grid;gap:5px}.channelBody h3{font-size:20px}.channelBody p{color:#41515e;overflow-wrap:anywhere}.channelBody span,.channelMeta small,.modalEyebrow{color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase}.channelMeta{display:grid;gap:3px;padding:11px;border-radius:8px;background:#18212b0b}.channelMeta strong{font-size:13px;color:#33424f}.channelError{color:var(--danger);background:#b13b4a14;border:1px solid rgba(177,59,74,.14);border-radius:8px;padding:10px}.channelActions{justify-content:flex-end;flex-wrap:wrap}.statusPill{display:inline-flex;align-items:center;min-height:28px;padding:6px 9px;border-radius:999px;color:#44525e;background:#18212b12;font-size:12px;font-weight:800}.statusPill.connected{color:#0f766e;background:#0f766e1f}.statusPill.connecting{color:#2868c7;background:#2868c71f}.statusPill.failed{color:var(--danger);background:#b13b4a1f}.modalOverlay{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:#121b248f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:fadeSlide .16s ease both}.modalPanel{width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:auto;background:#fffffff0;border:1px solid rgba(255,255,255,.78);border-radius:8px;padding:18px;box-shadow:0 26px 80px #121b2447;animation:riseIn .22s ease both}.modalHeader{margin-bottom:14px}.modalHeader h2{font-size:28px}.modalEyebrow{display:inline-flex;align-items:center;gap:6px}.channelTypeSwitch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:6px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#18212b0b;margin-bottom:14px}.channelTypeSwitch button{background:transparent;color:#44525e;border:1px solid transparent;box-shadow:none}.channelTypeSwitch button.active{color:#fff;background:linear-gradient(135deg,var(--teal),var(--blue));box-shadow:0 12px 24px #2868c72e}.modalForm{gap:13px}.formSplit{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modalActions{justify-content:flex-end;margin-top:4px}.formsGrid form{padding:18px}.formsGrid h3{display:flex;align-items:center;gap:10px;margin-bottom:4px}.check{display:flex;align-items:center;grid-template-columns:none;font-weight:600;gap:8px}.check input{width:auto}.qrFrame{width:fit-content;display:grid;gap:10px;justify-items:center;background:var(--panel-solid);border:1px solid rgba(24,33,43,.1);border-radius:8px;padding:14px;box-shadow:var(--shadow-soft)}.qr{width:260px;height:260px;border-radius:8px}.tableWrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;border-bottom:1px solid rgba(24,33,43,.08);padding:13px 12px;vertical-align:top;max-width:320px;overflow-wrap:anywhere}th{color:#44525e;font-size:12px;text-transform:uppercase;font-weight:800}tbody tr{transition:background .16s ease}tbody tr:hover{background:#2868c70e}.notice,.empty{padding:16px}.notice{border-left:4px solid var(--gold)}.keyNotice{display:grid;gap:10px}.keyNotice code{display:block;padding:10px 12px;border-radius:8px;background:#18212b0f}.empty{color:var(--muted);display:flex;gap:10px;align-items:center}.queueActions,.tableFilters,.tableActions,.pager{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}.tableFilters input{min-width:180px;width:auto}.inlineForm textarea{min-height:44px;resize:vertical}.templateForm{grid-template-columns:repeat(3,minmax(0,1fr))}.modalPanel.wide{max-width:min(980px,calc(100vw - 28px))}.integrationModal{display:grid;gap:16px}.integrationSection{display:grid;gap:12px;padding:14px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#ffffffa3}.integrationSection h3{color:#24313c;font-size:18px}.integrationSectionHeader,.codeBlockHeader,.apiKeyRow{display:flex;align-items:center;justify-content:space-between;gap:10px}.integrationGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.integrationGrid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}.integrationColumns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.integrationField{display:grid;gap:6px;min-width:0;padding:10px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#18212b09}.integrationField span{color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase}.integrationField code{color:#17232f;font-weight:750}.integrationHint,.integrationWarning{margin:0;padding:10px 12px;border-radius:8px}.integrationHint{color:#33424f;background:#2868c714}.integrationWarning{display:grid;gap:8px;color:#68430b;border:1px solid rgba(200,155,50,.25);background:#c89b3221}.integrationWarning code{display:block;padding:9px 10px;border-radius:8px;color:#143c36;background:#ffffffad}.apiKeyList{display:grid;gap:8px}.apiKeyRow{padding:10px;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#ffffff9e}.apiKeyRow div{display:grid;gap:2px}.apiKeyRow small{color:var(--muted)}.eventList{display:flex;flex-wrap:wrap;gap:8px}.eventList span{padding:7px 9px;border:1px solid rgba(15,118,110,.18);border-radius:999px;color:#0f766e;background:#0f766e14;font-size:12px;font-weight:800}.codeBlock{display:grid;overflow:hidden;border:1px solid rgba(24,33,43,.08);border-radius:8px;background:#0f172a}.codeBlockHeader{padding:10px 12px;color:#e5eefc;background:#ffffff0f}.codeBlock pre{margin:0;max-height:360px;overflow:auto;padding:14px;color:#e5eefc;font-size:12px;line-height:1.5;white-space:pre-wrap}.copyButton{width:fit-content;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:8px 11px;border:1px solid rgba(40,104,199,.18);border-radius:8px;color:#2868c7;background:#2868c717;box-shadow:none}.copyButton.compact{min-height:28px;padding:5px 8px;font-size:12px}.codeBlockHeader .copyButton{color:#e5eefc;border-color:#fff3;background:#ffffff1a}.jsonDetail{background:#0f172a;border-radius:8px;color:#e5eefc;font-size:12px;line-height:1.5;max-height:62vh;overflow:auto;padding:16px;white-space:pre-wrap}code{overflow-wrap:anywhere;color:#143c36}@keyframes riseIn{0%{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes fadeSlide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{box-shadow:0 0 0 4px #22c55e21}50%{box-shadow:0 0 0 9px #22c55e08}}@media(max-width:980px){.shell{grid-template-columns:1fr}aside{position:static;height:auto}.sideStatus{position:static;margin-top:16px}nav{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics,.queueCards,.appGrid,.channelGrid,.integrationGrid,.integrationGrid.compact,.integrationColumns,.formsGrid,.inlineForm{grid-template-columns:1fr}.pageToolbar,.modalActions{align-items:stretch;flex-direction:column}}@media(max-width:620px){main{padding:14px}header{align-items:stretch;flex-direction:column;gap:10px}.topActions{justify-content:space-between}.formSplit,.channelTypeSwitch,.assignRow{grid-template-columns:1fr}}
