:root{--ink:#1d2425;--muted:#657174;--line:#dce3e2;--canvas:#f5f7f6;--surface:#fff;--green:#168a55;--green-soft:#e8f5ed;--indigo:#4a55a6;--indigo-soft:#eef0fc;--amber:#9a6500;--amber-soft:#fff5dd;--red:#b43a3a;--red-soft:#fff0ef;--sidebar:#182322}*{box-sizing:border-box}html{background:var(--canvas)}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Inter",Segoe UI,sans-serif;letter-spacing:0;background:var(--canvas)}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #7aa2eb;outline-offset:2px}.app-shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100dvh}.sidebar{background:var(--sidebar);color:#eaf0ee;padding:22px 14px;display:flex;flex-direction:column;gap:30px;min-width:0}.brand{display:flex;align-items:center;gap:10px;font-weight:750;font-size:18px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;background:var(--green);color:#fff;border-radius:6px;font-weight:800}.nav-list{display:grid;gap:4px}.nav-item{display:flex;align-items:center;gap:11px;width:100%;min-height:42px;border:0;border-radius:6px;padding:0 11px;background:transparent;color:#b9c8c4;text-align:left}.nav-item svg{width:18px;height:18px}.nav-item:hover,.nav-item.is-active{background:#2a3b37;color:#fff}.sidebar-foot{margin-top:auto;padding:14px;border-top:1px solid #34433f;display:grid;gap:4px;font-size:13px;color:#b9c8c4}.sidebar-foot strong{color:#fff;overflow-wrap:anywhere}.main-content{min-width:0;overflow-x:hidden}.topbar{min-height:90px;padding:20px clamp(18px,3vw,42px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--surface)}h1,h2,h3,p{margin:0}h1{font-size:24px;line-height:1.2}h2{font-size:19px}h3{font-size:16px}.eyebrow{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--muted);margin-bottom:5px}.topbar p:not(.eyebrow),.section-heading p,.content-band>p,.panel-title p{color:var(--muted);font-size:14px;margin-top:4px}.topbar-actions{display:flex;align-items:center;gap:10px}.server-pill,.dry-run-pill{display:inline-flex;align-items:center;min-height:30px;padding:0 10px;border-radius:999px;background:var(--amber-soft);color:var(--amber);font-size:12px;font-weight:700}.server-pill.is-ok{background:var(--green-soft);color:var(--green)}.icon-button{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink)}.icon-button svg{width:18px}.icon-fallback{position:absolute;clip:rect(0 0 0 0)}.notice{margin:18px clamp(18px,3vw,42px) 0;padding:12px 14px;border-left:3px solid var(--indigo);background:var(--indigo-soft);color:#303b82;font-size:14px}.notice.is-error{border-color:var(--red);background:var(--red-soft);color:var(--red)}.view{display:none;padding:28px clamp(18px,3vw,42px) 42px;min-width:0}.view.is-active{display:block}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}.button{min-height:40px;border:1px solid transparent;border-radius:6px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:14px}.button svg{width:16px;height:16px}.button-primary{background:var(--green);color:#fff}.button-primary:hover{background:#107447}.button-secondary{background:#fff;border-color:var(--line);color:var(--ink)}.button-danger{background:var(--red);color:#fff}.button-full{width:100%}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:28px}.metric-card{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:18px;display:grid;gap:6px}.metric-label{font-size:13px;color:var(--muted)}.metric-card strong{font-size:22px;overflow-wrap:anywhere}.metric-card span:last-child{font-size:13px;color:var(--muted)}.content-band{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px;min-width:0}.activation-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:0;margin:22px 0 0;list-style:none}.activation-list li{display:flex;gap:10px;min-width:0}.activation-list li>span{display:grid;place-items:center;flex:0 0 30px;height:30px;background:var(--indigo-soft);color:var(--indigo);border-radius:50%;font-weight:700}.activation-list strong{font-size:14px}.activation-list p{margin-top:4px;font-size:13px;color:var(--muted)}.conversation-layout,.configuration-grid,.simulator-layout{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.7fr);gap:18px;min-width:0}.list-panel,.transcript-panel{background:var(--surface);border:1px solid var(--line);border-radius:8px;min-width:0}.list-panel{padding:12px}.transcript-panel{display:grid;grid-template-rows:auto minmax(280px,1fr) auto;min-height:560px}.panel-title{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px}.panel-title>span{background:var(--indigo-soft);color:var(--indigo);padding:3px 8px;border-radius:999px;font-size:12px;font-weight:700}.compact-actions{display:flex;gap:8px;flex-wrap:wrap}.stack-list{display:grid;gap:8px}.list-item{width:100%;border:1px solid var(--line);border-radius:6px;background:#fff;padding:12px;text-align:left;color:var(--ink)}button.list-item:hover,button.list-item.is-selected{border-color:var(--indigo);background:var(--indigo-soft)}.list-item strong,.list-item span{display:block}.list-item span{font-size:12px;color:var(--muted);margin-top:4px}.message-list{min-width:0;overflow:auto;padding:16px;background:#fbfcfb;display:grid;align-content:start;gap:10px}.message{max-width:78%;padding:10px 12px;border-radius:8px;background:#eef1f0;font-size:14px;overflow-wrap:anywhere}.message.is-operator,.message.is-bot{justify-self:end;background:var(--green-soft)}.message span{display:block;margin-top:5px;color:var(--muted);font-size:11px}.reply-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px;border-top:1px solid var(--line)}input,textarea,select{width:100%;border:1px solid #bdc9c5;border-radius:6px;background:#fff;color:var(--ink);padding:10px 11px}textarea{min-height:110px;resize:vertical}label{display:block;margin:14px 0 6px;font-weight:700;font-size:13px}.empty-state{padding:26px 12px;text-align:center;color:var(--muted);font-size:14px}.result-box{margin-top:14px;padding:12px;border-left:3px solid var(--indigo);background:var(--indigo-soft);font-size:14px}.simulator-layout{grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr)}.example-row{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.example-button{min-height:36px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);padding:0 10px;font-size:13px}.security-example{border-color:#e4bd78;color:var(--amber);margin-bottom:14px}.decision-panel{min-height:330px}.decision-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0 0}.decision-facts div{border-top:1px solid var(--line);padding-top:9px}.decision-facts dt{font-size:12px;color:var(--muted)}.decision-facts dd{margin:4px 0 0;font-size:13px;font-weight:700;overflow-wrap:anywhere}.table-band{padding:0}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:650px}th,td{padding:13px 16px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}th{color:var(--muted);font-size:12px}.row-actions{display:flex;gap:6px}.row-actions .button{min-height:34px;padding:0 9px;font-size:12px}.auth-overlay,.confirm-overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:18px;background:rgba(22,33,31,.56)}.auth-card,.confirm-dialog{width:min(100%,420px);border-radius:8px;background:#fff;padding:28px;box-shadow:0 18px 55px rgba(0,0,0,.24);display:grid;gap:14px}.auth-card h1{font-size:22px}.auth-card p{color:var(--muted);font-size:14px}.form-error{color:var(--red)!important}.confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:900px){.app-shell{display:block;padding-bottom:72px}.sidebar{position:fixed;z-index:10;bottom:0;left:0;right:0;height:72px;padding:8px 6px;background:#182322;border-top:1px solid #34433f}.sidebar>.brand,.sidebar-foot{display:none}.nav-list{grid-template-columns:repeat(6,minmax(0,1fr));gap:2px}.nav-item{min-height:54px;padding:4px;flex-direction:column;justify-content:center;gap:3px;font-size:10px;text-align:center}.nav-item svg{width:18px}.topbar{min-height:84px;padding:17px 18px}.topbar h1{font-size:21px}.topbar-actions .server-pill{display:none}.view{padding:22px 18px 30px}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.activation-list{grid-template-columns:1fr 1fr}.conversation-layout,.configuration-grid,.simulator-layout{grid-template-columns:minmax(0,1fr)}.list-panel{max-height:250px;overflow:auto}.transcript-panel{min-height:480px}.section-heading{align-items:flex-start}.section-heading .button{flex:0 0 auto}.decision-facts{grid-template-columns:1fr}.compact-actions{justify-content:flex-end}.topbar p:not(.eyebrow){display:none}}@media(max-width:520px){.metric-grid,.activation-list{grid-template-columns:minmax(0,1fr)}.topbar{align-items:flex-start}.topbar-actions{margin-top:2px}.section-heading{display:grid}.section-heading .button{justify-self:start}.reply-form{grid-template-columns:minmax(0,1fr)}.reply-form .button{width:100%}.content-band{padding:16px}.auth-card{padding:22px}}
[hidden]{display:none!important}
.activation-review-band{display:grid;gap:16px}.activation-readiness-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.activation-readiness-item{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.activation-readiness-item strong,.activation-readiness-item span{display:block}.activation-readiness-item span{margin-top:4px;color:var(--muted);font-size:.9rem}.activation-review-actions{display:flex;align-items:center;justify-content:space-between;gap:16px}.activation-review-actions p{margin:0;color:var(--muted);font-size:.9rem;max-width:560px}@media(max-width:700px){.activation-readiness-list{grid-template-columns:minmax(0,1fr)}.activation-review-actions{align-items:flex-start;flex-direction:column}.activation-review-actions .button{width:100%}}
[hidden]{display:none!important}@media(max-width:520px){.nav-item{min-width:0}.nav-item span{display:none}}
.onboarding-status{margin-bottom:18px}.onboarding-status-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.onboarding-status-heading h3{margin:0}.onboarding-metrics{display:grid;grid-template-columns:repeat(2,minmax(92px,1fr));gap:12px;margin:0}.onboarding-metrics div{border-left:2px solid var(--indigo);padding-left:10px}.onboarding-metrics dt{font-size:12px;color:var(--muted)}.onboarding-metrics dd{margin:3px 0 0;font-weight:700;font-size:20px}.onboarding-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:18px}.onboarding-step{min-width:0;min-height:72px;padding:10px;border:1px solid var(--line);border-radius:6px;background:#fff;text-align:left;color:var(--ink)}.onboarding-step strong,.onboarding-step span{display:block;overflow-wrap:anywhere}.onboarding-step strong{font-size:12px}.onboarding-step span{margin-top:5px;font-size:12px;color:var(--muted)}.onboarding-step.is-client_approved{border-color:var(--green);background:var(--green-soft)}.onboarding-step.is-proposed{border-color:#e4bd78;background:var(--amber-soft)}.onboarding-step.is-missing{border-style:dashed}.onboarding-step:focus-visible{outline:3px solid var(--indigo);outline-offset:2px}.onboarding-blockers{margin:14px 0 0;color:var(--muted);font-size:14px}.field-guide{margin:8px 0 0;color:var(--muted);font-size:13px;min-height:38px}.onboarding-status+.configuration-grid{margin-top:18px}@media(max-width:900px){.onboarding-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:520px){.onboarding-status-heading{display:grid}.onboarding-metrics{width:100%}.onboarding-steps{grid-template-columns:minmax(0,1fr)}.onboarding-step{min-height:58px;display:flex;justify-content:space-between;gap:12px;align-items:center}.onboarding-step span{margin-top:0;text-align:right}}
.version-history{margin-top:22px;padding-top:14px;border-top:1px solid var(--line)}.history-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);min-width:0}.history-item strong,.history-item span{display:block}.history-item span{margin-top:4px;color:var(--muted);font-size:12px;overflow-wrap:anywhere}.history-item .button{flex:0 0 auto}@media(max-width:520px){.history-item{align-items:flex-start;flex-direction:column}.history-item .button{width:100%}}
.setup-locale-control{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:12px}.setup-locale-label{font-size:12px;color:var(--muted);margin-right:2px}.setup-locale-button{min-width:40px;min-height:32px;padding:0 9px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);font-weight:700;font-size:12px}.setup-locale-button[aria-pressed="true"]{border-color:var(--indigo);background:var(--indigo-soft);color:var(--indigo)}@media(max-width:520px){.setup-locale-control{margin-top:10px}.setup-locale-label{width:100%}}
.whatsapp-connection-band{border-top:0}.whatsapp-connection-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:0}.whatsapp-connection-summary h2{margin:3px 0 6px;font-size:19px}.whatsapp-connection-summary p:last-child{margin:0;color:var(--muted);font-size:14px;overflow-wrap:anywhere}.whatsapp-connection-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.status-chip{display:inline-flex;align-items:center;min-height:30px;padding:0 9px;border:1px solid var(--line);border-radius:999px;background:#f4f6f5;color:var(--muted);font-size:12px;font-weight:700}.status-chip.is-connected{border-color:var(--green);background:var(--green-soft);color:#176b43}.status-chip.is-attention{border-color:#e4bd78;background:var(--amber-soft);color:var(--amber)}.whatsapp-qr-dialog{max-width:460px}.whatsapp-qr-dialog>div:first-child p:last-child{margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.5}.whatsapp-qr-image{width:min(100%,300px);aspect-ratio:1;justify-self:center;object-fit:contain;border:1px solid var(--line);border-radius:6px;background:#fff;padding:10px}.whatsapp-qr-dialog .notice{margin:0}.whatsapp-qr-dialog .button svg{width:16px;height:16px}.whatsapp-qr-dialog .button{display:inline-flex;align-items:center;gap:7px}@media(max-width:520px){.whatsapp-connection-summary{align-items:flex-start;flex-direction:column}.whatsapp-connection-actions{justify-content:flex-start}.whatsapp-connection-actions .button{width:100%}.whatsapp-qr-dialog{padding:22px}.whatsapp-qr-dialog .confirm-actions{display:grid;grid-template-columns:minmax(0,1fr)}.whatsapp-qr-dialog .button{justify-content:center}}
/* CLIENT-UX-01A: base visual compartida, sin cambiar contratos del panel. */
:root{--ink:#17211f;--ink-soft:#4d5a56;--line:#d9e1dd;--canvas:#f4f6f3;--surface:#fff;--surface-muted:#edf1ee;--green:#137a52;--green-strong:#0c613f;--green-soft:#e4f3ea;--coral:#d45c4b;--coral-soft:#fff0ed;--amber:#9a6500;--amber-soft:#fff5dd;--indigo:#4458a2;--indigo-soft:#eef0fc;--red:#b43a3a;--red-soft:#fff0ef;--sidebar:#17211f;--sidebar-line:#34433f}
html,body{min-height:100%;background:var(--canvas)}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;line-height:1.45}
button,input,textarea,select{font:inherit}button{transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #e28a79;outline-offset:3px}
.app-shell[aria-hidden="true"]{visibility:hidden;pointer-events:none}.app-shell{background:var(--canvas)}
.sidebar{padding:20px 14px 16px;background:var(--sidebar);gap:26px;border-right:1px solid var(--sidebar-line)}.brand{gap:9px;font-size:19px;letter-spacing:0}.brand-mark{width:32px;height:32px;background:var(--coral);border-radius:7px;box-shadow:none}.brand-context{display:block;margin-left:auto;color:#adbbb5;font-size:11px;font-weight:600}.nav-list{gap:3px}.nav-item{min-height:44px;border-radius:6px;padding:0 10px;color:#bac8c2;font-weight:650}.nav-item:hover{background:#24322e;color:#fff}.nav-item.is-active{background:#f4f6f3;color:var(--ink);box-shadow:inset 3px 0 0 var(--coral)}.nav-item.is-active svg{color:var(--coral)}.sidebar-foot{border-color:var(--sidebar-line);padding:14px 8px 0;color:#b8c5bf}.sidebar-foot .eyebrow{color:#9aa9a2}
.topbar{min-height:92px;padding:18px clamp(22px,3.5vw,54px);background:#fff;border-bottom:1px solid var(--line)}.topbar h1{font-size:25px;font-weight:760;color:var(--ink)}.eyebrow{font-size:11px;letter-spacing:0;color:var(--ink-soft);font-weight:750}.topbar p:not(.eyebrow),.section-heading p,.content-band>p,.panel-title p{color:var(--ink-soft)}.server-pill,.dry-run-pill{min-height:32px;border-radius:999px;background:var(--amber-soft);color:var(--amber);font-size:12px}.server-pill.is-ok{background:var(--green-soft);color:var(--green-strong)}.icon-button{width:44px;height:44px;border-color:var(--line);border-radius:6px}.icon-button:hover{border-color:var(--coral);color:var(--coral)}
.view{padding:30px clamp(22px,3.5vw,54px) 52px}.summary-view{display:none;gap:18px}.summary-view.is-active{display:grid}.summary-lead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:4px 0 8px}.summary-lead h2{max-width:720px;font-size:clamp(24px,2.6vw,34px);line-height:1.1;color:var(--ink)}.summary-lead p:last-child{max-width:620px;margin-top:9px;color:var(--ink-soft);font-size:15px}.summary-lead .button{flex:0 0 auto}.button{min-height:44px;border-radius:6px;font-weight:720}.button-primary{background:var(--green);color:#fff}.button-primary:hover{background:var(--green-strong)}.button-secondary{border-color:var(--line);background:#fff}.button-secondary:hover{border-color:var(--ink);background:var(--surface-muted)}
.content-band{background:transparent;border-color:var(--line);padding:22px 0}.operational-pulse{border-top:2px solid var(--ink);border-bottom:1px solid var(--line);padding-top:18px}.pulse-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.pulse-heading h2{font-size:18px;color:var(--ink)}.pulse-caption{color:var(--ink-soft);font-size:13px;text-align:right}.activation-list{position:relative;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:20px 0 0}.activation-list::before{content:"";position:absolute;top:15px;left:15px;right:15px;height:1px;background:var(--line)}.activation-list li{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;padding-right:16px;background:transparent}.activation-list li>span{position:relative;width:31px;height:31px;background:#fff;border:1px solid var(--line);color:var(--coral);border-radius:50%;z-index:1}.activation-list li:first-child>span{border-color:var(--green);background:var(--green-soft);color:var(--green-strong)}.activation-list strong{font-size:14px;color:var(--ink)}.activation-list p{color:var(--ink-soft)}
.whatsapp-connection-band{display:block;padding:22px;border:1px solid var(--line);border-left:4px solid var(--green);background:#fff}.whatsapp-connection-summary h2{font-size:21px;color:var(--ink)}.whatsapp-connection-actions .button{min-width:184px}.status-chip{border-radius:999px;background:var(--surface-muted);color:var(--ink-soft)}.metric-grid{gap:10px;margin:0;order:3}.metric-card{min-height:126px;border:1px solid var(--line);border-radius:7px;background:#fff;padding:16px;box-shadow:none}.metric-card:first-child{border-top:3px solid var(--green)}.metric-card:nth-child(2){border-top:3px solid var(--coral)}.metric-card:nth-child(3){border-top:3px solid var(--indigo)}.metric-card:nth-child(4){border-top:3px solid var(--amber)}.metric-card strong{font-size:21px;color:var(--ink)}.metric-label,.metric-card span:last-child{color:var(--ink-soft)}.activation-review-band{order:4;border-top:1px solid var(--line);border-bottom:0;padding:22px 0 0}.activation-review-band .section-heading{margin-bottom:8px}.activation-review-actions{padding-top:14px;border-top:1px solid var(--line)}.notice{border-left-color:var(--coral);background:var(--coral-soft);color:#8c3328}.notice.is-error{border-color:var(--red);background:var(--red-soft);color:var(--red)}
.auth-overlay{z-index:40;background:var(--canvas);padding:clamp(20px,5vw,72px)}.login-surface{width:min(100%,1000px);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);gap:clamp(34px,7vw,92px);align-items:center}.login-intro{padding:20px 0;display:grid;gap:16px}.login-intro .brand{font-size:23px;color:var(--ink)}.login-intro .brand-context{display:none}.login-intro h1{max-width:560px;font-size:clamp(38px,5vw,62px);line-height:1.02;letter-spacing:0;color:var(--ink)}.login-intro>p:last-child{max-width:480px;color:var(--ink-soft);font-size:17px;line-height:1.55}.auth-card{width:100%;padding:30px;border:1px solid var(--line);border-top:4px solid var(--coral);border-radius:8px;box-shadow:none;gap:16px}.auth-card h2{font-size:24px;color:var(--ink)}.auth-card p{color:var(--ink-soft)}.auth-card input{min-height:48px;border-color:#bcc9c3}.auth-card .button{margin-top:4px}.confirm-overlay{z-index:50;background:rgba(23,33,31,.55)}.confirm-dialog{border-radius:8px;box-shadow:0 20px 54px rgba(14,23,20,.26)}.list-panel,.transcript-panel{border-radius:8px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(max-width:900px){.app-shell{padding-bottom:76px}.sidebar{height:76px;background:var(--sidebar)}.nav-item{min-height:56px}.topbar{min-height:84px;padding:16px 18px}.view{padding:24px 18px 38px}.summary-lead{align-items:flex-start}.activation-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.activation-list::before{display:none}.activation-list li{padding-right:0}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.login-surface{grid-template-columns:minmax(0,1fr);gap:24px;max-width:520px}.login-intro{padding:0}.login-intro h1{font-size:42px}.auth-overlay{align-content:center}.brand-context{display:none}}
@media(max-width:520px){.summary-lead{display:grid;gap:18px}.summary-lead .button{width:100%}.pulse-heading{display:grid;gap:6px}.pulse-caption{text-align:left}.activation-list{grid-template-columns:minmax(0,1fr);gap:14px}.activation-list li{grid-template-columns:31px minmax(0,1fr)}.metric-grid{grid-template-columns:minmax(0,1fr)}.metric-card{min-height:104px}.whatsapp-connection-band{padding:18px}.whatsapp-connection-actions .button{width:100%}.activation-review-actions{display:grid}.activation-review-actions .button{width:100%}.login-intro h1{font-size:36px}.auth-overlay{padding:20px}.auth-card{padding:24px 20px}.topbar-actions .server-pill{display:none}}
/* CLIENT-UX-01B: recorrido de negocio guiado sin cambiar contratos del onboarding. */
.configuration-heading{align-items:flex-end;margin-bottom:24px}.configuration-heading>div:first-child{max-width:720px}.configuration-heading h2{font-size:clamp(25px,2.7vw,34px);line-height:1.1;color:var(--ink)}.configuration-heading-actions{display:grid;justify-items:end;gap:10px;max-width:360px}.configuration-heading-actions p{margin:0;text-align:right;color:var(--ink-soft);font-size:13px;line-height:1.45}.configuration-heading-actions .button{min-width:218px}.onboarding-status{margin:0}.onboarding-status-heading{align-items:flex-end;padding-bottom:16px;border-bottom:1px solid var(--line)}.onboarding-status-heading h3{font-size:21px;color:var(--ink)}.onboarding-status-heading p:not(.eyebrow){max-width:650px}.onboarding-metrics{gap:22px}.onboarding-metrics div{border-left:0;padding-left:0}.onboarding-metrics dd{font-size:24px;color:var(--ink)}.onboarding-steps{margin-top:18px;gap:7px}.onboarding-step{min-height:92px;padding:13px 12px;border-radius:7px;background:transparent;transition:border-color .16s ease,background-color .16s ease}.onboarding-step:hover{border-color:var(--coral);background:var(--coral-soft)}.onboarding-step[aria-current="step"]{border:2px solid var(--indigo);background:var(--indigo-soft);box-shadow:inset 0 3px 0 var(--coral)}.onboarding-step strong{font-size:13px;color:var(--ink)}.onboarding-step span{font-size:12px;color:var(--ink-soft)}.onboarding-step.is-client_approved{border-color:var(--green);background:var(--green-soft)}.onboarding-step.is-proposed{border-color:#e6be78;background:var(--amber-soft)}.onboarding-step.is-missing{border-style:dashed}.onboarding-workspace{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(270px,.55fr);gap:0;margin:26px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line);background:#fff;min-width:0}.onboarding-workspace-main{min-width:0;padding:28px clamp(20px,3vw,36px) 30px}.onboarding-workspace-main h3{font-size:24px;line-height:1.2;color:var(--ink)}.onboarding-workspace-main textarea{min-height:184px;padding:14px;line-height:1.55}.onboarding-workspace-main .field-guide{min-height:0;margin:9px 0 18px;color:var(--ink-soft);font-size:15px;line-height:1.45}.onboarding-workspace-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.onboarding-workspace-aside{display:grid;align-content:start;gap:10px;min-width:0;padding:28px;border-left:1px solid var(--line);background:var(--surface-muted)}.onboarding-workspace-aside h3{font-size:18px;line-height:1.3;color:var(--ink)}.onboarding-workspace-aside>p:not(.eyebrow){color:var(--ink-soft);font-size:14px;line-height:1.5}.onboarding-aside-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 0}.onboarding-aside-metrics div{padding-top:12px;border-top:1px solid var(--line)}.onboarding-aside-metrics dt{font-size:12px;color:var(--ink-soft)}.onboarding-aside-metrics dd{margin:4px 0 0;color:var(--ink);font-size:21px;font-weight:750}.proposal-result{display:grid;gap:9px;border-left-color:var(--coral);background:var(--coral-soft);color:var(--ink)}.proposal-result .button{justify-self:start}.publication-preview{margin-top:0}.publication-preview .panel-title{padding:0 0 14px;border-bottom:1px solid var(--line)}.publication-preview-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.publication-preview-items .list-item{border-radius:6px;background:transparent}.configuration-details{display:grid;gap:0;margin-top:0;padding:0}.configuration-details details{border-bottom:1px solid var(--line)}.configuration-details details:last-child{border-bottom:0}.configuration-details summary{display:flex;align-items:center;min-height:58px;padding:0 2px;color:var(--ink);cursor:pointer;font-size:15px;font-weight:750;list-style:none}.configuration-details summary::-webkit-details-marker{display:none}.configuration-details summary::after{content:"+";margin-left:auto;color:var(--coral);font-size:22px;font-weight:400}.configuration-details details[open] summary::after{content:"−"}.configuration-detail-content{padding:2px 0 22px}.configuration-detail-content .panel-title{padding:0 0 12px}.configuration-detail-content .stack-list{gap:0}.configuration-detail-content .list-item{border-width:1px 0 0;border-radius:0;background:transparent;padding:13px 0}.version-history{margin-top:0;padding-top:0}.history-item{padding:13px 0}.history-item .button{min-height:44px}.configuration-details .empty-state{padding:18px 0;text-align:left}.configuration-details .list-item .button{margin-top:10px}.configuration-details .list-item strong{color:var(--ink)}
@media(max-width:900px){.configuration-heading{align-items:flex-start;display:grid}.configuration-heading-actions{justify-items:start;max-width:680px}.configuration-heading-actions p{text-align:left}.onboarding-status-heading{align-items:flex-start}.onboarding-steps{grid-template-columns:repeat(3,minmax(0,1fr))}.onboarding-workspace{grid-template-columns:minmax(0,1fr)}.onboarding-workspace-aside{border-top:1px solid var(--line);border-left:0;padding:22px}.publication-preview-items{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.configuration-heading-actions,.configuration-heading-actions .button{width:100%}.onboarding-status-heading{display:grid;gap:16px}.onboarding-metrics{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}.onboarding-steps{grid-template-columns:minmax(0,1fr)}.onboarding-step{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:14px}.onboarding-step span{margin-top:0;text-align:right}.onboarding-workspace{margin:20px -18px;border-top-width:2px}.onboarding-workspace-main{padding:24px 18px}.onboarding-workspace-main textarea{min-height:168px}.onboarding-workspace-actions{display:grid}.onboarding-workspace-actions .button{width:100%}.onboarding-workspace-aside{padding:22px 18px}.publication-preview-items{grid-template-columns:minmax(0,1fr)}.publication-preview .panel-title{display:grid}.publication-preview .status-chip{justify-self:start}.configuration-details summary{min-height:56px}.history-item .button{width:100%}}

/* ─────────────────────────────────────────────────────────────────────────
   Tema oscuro del panel.

   Se anexa como capa en vez de reescribir el archivo: lo de arriba está
   minificado y sostiene un panel con seis vistas en funcionamiento. Tocarlo
   de raíz sería rehacer lo que ya sirve. Aquí solo se redefinen las variables
   y se apagan los blancos que están escritos a mano, que es donde el tema
   claro sobrevive a las variables.

   La paleta es la misma de la landing: el cliente no debería sentir que
   cambió de producto al entrar a operar.
   ───────────────────────────────────────────────────────────────────────── */

:root {
  --ink: #ffffff;
  --ink-soft: #a1a1aa;
  --muted: #a1a1aa;
  --line: rgba(255, 255, 255, .10);
  --canvas: #08080a;
  --surface: #131316;
  --surface-muted: #1a1a1e;
  --sidebar: #0b0b0e;
  --sidebar-line: rgba(255, 255, 255, .08);

  --green: #3f9e6c;
  --green-strong: #2f8055;
  --green-soft: rgba(63, 158, 108, .16);
  --coral: #d4b483;
  --coral-soft: rgba(212, 180, 131, .12);
  --amber: #d4b483;
  --amber-soft: rgba(212, 180, 131, .12);
  /* El lila era el único acento frío del panel y no existe en el sitio.
     Se reconduce al mismo dorado: el cliente no debería ver dos paletas. */
  --indigo: #d4b483;
  --indigo-soft: rgba(212, 180, 131, .12);
  --red: #f87171;
  --red-soft: rgba(248, 113, 113, .12);
}

/* Los blancos escritos a mano son los que delatan el tema claro: las
   variables no los alcanzan. */
.topbar,
.metric-card,
.list-panel,
.transcript-panel,
.whatsapp-connection-band,
.onboarding-workspace,
.auth-card,
.confirm-dialog,
.icon-button,
.button-secondary,
.example-button,
.setup-locale-button,
.onboarding-step,
.list-item,
input, textarea, select {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line);
}

.message-list { background: #0e0e11; }
.message { background: rgba(255, 255, 255, .06); color: var(--ink); }
.message.is-operator,
.message.is-bot { background: rgba(212, 180, 131, .16); }

.activation-list li > span { background: var(--surface); border-color: var(--line); }
.status-chip { background: rgba(255, 255, 255, .05); border-color: var(--line); }
.whatsapp-qr-image { background: #fff; border-color: var(--line); }

/* El botón principal recoge el de la landing: blanco sólido, no verde. */
.button-primary { background: #fff; color: #000; border-color: #fff; }
.button-primary:hover { background: #e4e4e7; }
.button-secondary:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .2); }
.button { border-radius: 999px; }
.button-danger { background: var(--red); color: #1a0d0d; }

/* Sobre claro, bajar la opacidad apagaba un botón. Sobre casi negro lo hace
   GRIS CLARO: en el resumen, lo más brillante de la pantalla eran justamente
   las dos cosas que el cliente todavía no puede tocar. Un botón inhabilitado
   se apaga con su propio color, no con transparencia. */
.button:disabled,
.button[disabled],
.button[aria-disabled='true'] {
  opacity: 1;
  background: rgba(255, 255, 255, .05);
  color: #6b6b74;
  border-color: rgba(255, 255, 255, .08);
  cursor: not-allowed;
  box-shadow: none;
}
.button:disabled:hover,
.button[disabled]:hover { background: rgba(255, 255, 255, .05); }

.nav-item.is-active { background: rgba(255, 255, 255, .09); color: #fff; box-shadow: inset 3px 0 0 var(--coral); }
.nav-item:hover { background: rgba(255, 255, 255, .06); }
.sidebar { border-right-color: var(--sidebar-line); }

.auth-overlay { background: var(--canvas); }
.confirm-overlay { background: rgba(0, 0, 0, .72); }
.auth-card { border-top-color: var(--coral); }

input::placeholder, textarea::placeholder { color: #52525b; }
input:focus-visible, textarea:focus-visible, select:focus-visible,
button:focus-visible { outline-color: rgba(255, 255, 255, .55); }

/* La marca del panel es la misma que la del sitio: contorno, no bloque. */
.brand-mark { background: #fff; color: #000; }

/* Bordes de acento de las tarjetas de métrica: sobre oscuro pierden fuerza. */
.metric-card:first-child { border-top-color: var(--green); }
.metric-card:nth-child(2) { border-top-color: var(--coral); }
.metric-card:nth-child(3) { border-top-color: var(--indigo); }
.metric-card:nth-child(4) { border-top-color: var(--amber); }

.operational-pulse { border-top-color: rgba(255, 255, 255, .3); }
.onboarding-workspace { border-top-color: rgba(255, 255, 255, .3); }
.onboarding-workspace-aside { background: var(--surface-muted); border-left-color: var(--line); }
.onboarding-step:hover { background: var(--coral-soft); border-color: var(--coral); }
.configuration-details summary::after { color: var(--coral); }

/* ── Torre de control ──────────────────────────────────────────────────────
   Seis tarjetas en vez de cuatro. La primera es la única que puede alarmar:
   cuántas conversaciones esperan a una persona. Las demás informan; ésa pide
   que alguien haga algo, y por eso cambia de color cuando deja de ser cero. */
.metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.metric-card:nth-child(5) { border-top: 3px solid var(--green); }
.metric-card:nth-child(6) { border-top: 3px solid var(--indigo); }
.metric-card.is-alerta { border-color: var(--coral); background: var(--coral-soft); }
.metric-card.is-alerta strong { color: var(--coral); }

/* Medidor de consumo. Verde mientras alcanza, ámbar al acercarse, coral cuando
   ya hay excedente — que se cobra, no corta el servicio. */
.consumption-meter { height: 10px; margin: 16px 0 18px; border-radius: 999px; background: var(--surface-muted); overflow: hidden; }
.consumption-meter-fill { height: 100%; width: 0; border-radius: 999px; background: var(--green); transition: width .3s ease; }
.consumption-meter-fill.is-warning { background: var(--amber); }
.consumption-meter-fill.is-over { background: var(--coral); }
#consumption-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Carga de catálogo: el endpoint existía desde el principio y nunca tuvo
   pantalla, así que el catálogo se cargaba por terminal. */
#catalogo-form { display: grid; gap: 6px; max-width: 560px; }
#catalogo-form input[type="file"] { padding: 10px; border: 1px dashed var(--line); border-radius: 6px; background: var(--surface-muted); }
#catalogo-form .button { justify-self: start; margin-top: 10px; }

@media (max-width: 900px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #consumption-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .metric-grid, #consumption-facts { grid-template-columns: minmax(0, 1fr); }
}
.catalogo-formato { margin: 14px 0 18px; padding: 14px 16px; border-left: 3px solid var(--indigo); background: var(--surface-muted); display: grid; gap: 8px; }
.catalogo-formato p:not(.eyebrow) { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.5; }
.catalogo-formato code { padding: 1px 5px; border-radius: 4px; background: rgba(127,127,127,.16); font-size: 13px; }
