/* Layout: app shell — nav rail (marca + selector de tienda) | área de trabajo. Chats = lista | conversación | ficha. Celular = pestañas abajo, un panel a la vez. */
:root{
  --bg:#F4F2F3; --surface:#FFFFFF; --surface-2:#EEEAEC; --line:#E1DADE; --fg:#1F1A1D; --muted:#6D6469;
  --accent:#7A1F35; --accent-fg:#FFFFFF; --accent-soft:#F4E4E9; --mine:#F7EDF0;
  --ok:#1E7A4C; --ok-soft:#E3F3EA; --warn:#A35F00; --warn-soft:#FBEFD9; --bad:#B42318; --bad-soft:#FBE6E3; --info:#2D5BA8; --info-soft:#E4ECF8;
  --t-yellow:#E8B530; --t-orange:#E9773E; --t-green:#2E9E5E; --t-blue:#4A74D9; --t-wine:#7A1F35; --t-grey:#8A8186; --t-purple:#6B4FA3; --t-teal:#2F7F86;
  --scrim:rgba(20,8,14,.45); --shadow:0 12px 32px rgba(40,10,20,.14);
  --f-display:"Bricolage Grotesque", "Figtree", system-ui, sans-serif;
  --f-body:"Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#141113; --surface:#1C181A; --surface-2:#262124; --line:#352E32; --fg:#EFE9EC; --muted:#A79DA2;
  --accent:#E07A93; --accent-fg:#1A0E12; --accent-soft:#3A1F28; --mine:#2E1C23;
  --ok:#5CC98D; --ok-soft:#173326; --warn:#E9A94A; --warn-soft:#3A2A12; --bad:#F07A6E; --bad-soft:#3D1C19; --info:#86A9EE; --info-soft:#1C2A42;
  --t-wine:#E07A93; --t-grey:#9A9196; --scrim:rgba(0,0,0,.6); --shadow:0 12px 32px rgba(0,0,0,.5); color-scheme:dark }}
:root[data-theme="dark"]{
  --bg:#141113; --surface:#1C181A; --surface-2:#262124; --line:#352E32; --fg:#EFE9EC; --muted:#A79DA2;
  --accent:#E07A93; --accent-fg:#1A0E12; --accent-soft:#3A1F28; --mine:#2E1C23;
  --ok:#5CC98D; --ok-soft:#173326; --warn:#E9A94A; --warn-soft:#3A2A12; --bad:#F07A6E; --bad-soft:#3D1C19; --info:#86A9EE; --info-soft:#1C2A42;
  --t-wine:#E07A93; --t-grey:#9A9196; --scrim:rgba(0,0,0,.6); --shadow:0 12px 32px rgba(0,0,0,.5); color-scheme:dark }

html,body{height:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:14px;line-height:1.45;overflow:hidden}
*{box-sizing:border-box}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.num,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}

.app{display:grid;grid-template-columns:220px minmax(0,1fr);height:100%}
.side{background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;gap:2px;padding:14px 10px}
.brand{display:flex;align-items:center;gap:10px;padding:8px;margin-bottom:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);text-align:left;width:100%}
.brand:hover{background:var(--surface-2)}
.brand-mark{width:32px;height:32px;border-radius:8px;background:var(--accent);color:var(--accent-fg);display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:16px;flex:none}
.brand .bt{min-width:0;flex:1}
.brand b{display:block;font-family:var(--f-display);font-size:16px;font-weight:700;letter-spacing:-.01em}
.brand small{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.caret{color:var(--muted);font-size:12px}
.navbtn{display:flex;align-items:center;gap:10px;border:0;background:none;padding:9px 10px;border-radius:8px;color:var(--muted);font-weight:600;text-align:left;width:100%}
.navbtn svg{width:19px;height:19px;flex:none}
.navbtn:hover{background:var(--surface-2);color:var(--fg)}
.navbtn[aria-current="page"]{background:var(--accent-soft);color:var(--accent)}
.navbtn .cnt{margin-left:auto;background:var(--accent);color:var(--accent-fg);border-radius:10px;font-size:11px;padding:0 6px;font-family:var(--f-mono)}
.side-foot{margin-top:auto;padding:10px 8px;color:var(--muted);font-size:12px}

.main{min-width:0;display:flex;flex-direction:column;height:100%;overflow:hidden}
.topbar{display:flex;align-items:center;gap:10px 12px;padding:10px 20px;border-bottom:1px solid var(--line);background:var(--surface);flex-wrap:wrap}
.topbar h1{font-family:var(--f-display);font-size:20px;font-weight:700;margin:0;letter-spacing:-.01em}
.topbar .grow{flex:1}
.store-top{display:none;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:5px 9px;font-weight:600;font-size:13px;max-width:100%;min-width:0}
.store-top span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill-demo{font-size:11px;font-weight:600;color:var(--warn);background:var(--warn-soft);padding:3px 8px;border-radius:20px;white-space:nowrap}
.seg{display:inline-flex;background:var(--surface-2);border-radius:9px;padding:3px;gap:2px;max-width:100%;overflow-x:auto}
.seg button{border:0;background:none;padding:5px 11px;border-radius:7px;font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.content{flex:1;min-height:0;overflow:auto;position:relative}
.page{padding:20px 24px 40px;max-width:1180px}

/* selector de tienda */
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:30}
.storepanel{position:fixed;top:calc(14px + env(safe-area-inset-top,0px));left:calc(10px + env(safe-area-inset-left,0px));width:min(330px,calc(100% - 32px));background:var(--surface);border-radius:14px;box-shadow:var(--shadow);z-index:31;padding:10px;display:grid;gap:4px;max-height:calc(100% - 28px);overflow:auto}
.storepanel h4{margin:8px 8px 2px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.storeopt{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;border:0;background:none;border-radius:9px;padding:8px;text-align:left;width:100%}
.storeopt:hover{background:var(--surface-2)}
.storeopt[aria-current="true"]{background:var(--accent-soft)}
.storeopt .sm{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font-weight:700;font-size:12px;color:#fff}
.storeopt b{display:block;font-size:13.5px}
.storeopt span{display:block;font-size:12px;color:var(--muted)}
.storeopt .st{font-size:11px;font-weight:700;padding:2px 7px;border-radius:20px}
.st-on{background:var(--ok-soft);color:var(--ok)} .st-off{background:var(--surface-2);color:var(--muted)}
.addstore{border:1px dashed var(--line);background:none;border-radius:9px;padding:9px;font-weight:600;color:var(--muted);margin-top:6px}

/* chats */
.chats{display:grid;grid-template-columns:330px minmax(0,1fr) 310px;height:100%;position:relative}
.chats.no-ficha{grid-template-columns:330px minmax(0,1fr)}
.chats.no-ficha .ficha{display:none}
.list{border-right:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;min-height:0}
.list-head{padding:12px;display:grid;gap:10px;border-bottom:1px solid var(--line);position:relative}
.searchrow{display:flex;gap:6px}
.search{display:flex;align-items:center;gap:8px;background:var(--surface-2);border-radius:8px;padding:7px 10px;flex:1;min-width:0}
.search input{border:0;background:none;outline:none;flex:1;min-width:0}
.filterbtn{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 10px;font-weight:600;font-size:13px;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.filterbtn[aria-expanded="true"],.filterbtn.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.tagmenu{position:absolute;left:12px;right:12px;top:52px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:8;padding:6px;display:grid;gap:2px;max-height:340px;overflow:auto}
.tagmenu button{display:flex;justify-content:space-between;align-items:center;border:0;background:none;padding:7px 8px;border-radius:7px;text-align:left}
.tagmenu button:hover{background:var(--surface-2)}
.tagmenu .n{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.activef{display:flex;gap:6px;flex-wrap:wrap}
.activef button{border:0;background:var(--accent-soft);color:var(--accent);border-radius:20px;padding:3px 10px;font-weight:700;font-size:12px}
.callstrip{display:flex;align-items:center;gap:10px;width:100%;border:0;border-radius:10px;padding:9px 11px;background:var(--warn-soft);color:var(--warn);font-weight:600;font-size:13px;text-align:left}
.callstrip svg{width:18px;height:18px;flex:none}
.callstrip b{font-family:var(--f-mono)}
.callstrip .go{margin-left:auto;white-space:nowrap}
.callstrip.on{background:var(--fg);color:var(--bg)}
.callrow{padding:12px;border-bottom:1px solid var(--line);display:grid;gap:8px}
.callrow .top{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center}
.callrow .top b{display:block}
.callrow .top span{font-size:12.5px;color:var(--muted)}
.callrow .tel{display:flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:13px}
.callrow .res{display:flex;gap:6px;flex-wrap:wrap}
.callrow .res button{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:5px 9px;font-size:12.5px;font-weight:600}
.callrow .res .win{background:var(--ok-soft);color:var(--ok);border-color:transparent}
.callrow .log{font-size:12px;color:var(--muted)}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:20px;padding:4px 10px;font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.chip[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.chip .n{font-family:var(--f-mono);font-size:11px;opacity:.8}
.items{overflow:auto;flex:1}
.item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;padding:11px 12px;border-bottom:1px solid var(--line);cursor:pointer;background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left}
.item:hover{background:var(--surface-2)}
.item[aria-current="true"]{background:var(--accent-soft)}
.av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;color:#fff;flex:none}
.item .nm{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.item .lm{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.item .meta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;font-size:11.5px;color:var(--muted)}
.item .row{display:flex;gap:5px;align-items:center;margin-top:4px;flex-wrap:wrap}
.unread{background:var(--accent);color:var(--accent-fg);border-radius:10px;font-size:11px;padding:0 6px;font-family:var(--f-mono);font-weight:500}
.who{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:4px}
.who.asesora{background:var(--bad-soft);color:var(--bad)}
.who.ia{background:var(--info-soft);color:var(--info)}
.who.bot,.who.cerrado{background:var(--surface-2);color:var(--muted)}
.tag{--tc:var(--t-grey);display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:2px 8px 2px 6px;border-radius:6px;white-space:nowrap;
  background:color-mix(in srgb,var(--tc) 16%,var(--surface));color:color-mix(in srgb,var(--tc) 72%,var(--fg));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tc) 30%,transparent)}
.tag i{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--tc)}
.tag.sys{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tc) 45%,transparent);border:0;outline:1px dashed color-mix(in srgb,var(--tc) 50%,transparent);outline-offset:-1px}
.empty{display:grid;place-items:center;text-align:center;gap:6px;padding:40px 20px;color:var(--muted)}
.empty b{color:var(--fg);font-size:15px}

.conv{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg)}
.conv-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surface);border-bottom:1px solid var(--line);flex-wrap:wrap}
.conv-head .t{min-width:0}
.conv-head .t b{display:block;font-size:15px}
.conv-head .t span{font-size:12px;color:var(--muted)}
.iconbtn{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 10px;font-size:13px;font-weight:600;display:inline-flex;gap:6px;align-items:center;justify-content:center}
.iconbtn:hover{background:var(--surface-2)}
.iconbtn svg{width:18px;height:18px}
.back{display:none}
.window{font-size:12px;color:var(--ok);background:var(--ok-soft);padding:3px 8px;border-radius:20px;font-weight:600;white-space:nowrap}
.window.off{color:var(--muted);background:var(--surface-2)}
.banner{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 16px;background:var(--bad-soft);color:var(--bad);font-weight:600;font-size:13px;border-bottom:1px solid var(--line)}
.banner.ia{background:var(--info-soft);color:var(--info)}
.banner .grow{flex:1;min-width:180px}
.banner button{border:0;border-radius:7px;padding:6px 12px;font-weight:700;font-size:12.5px}
.btn-solid{background:var(--accent);color:var(--accent-fg);border:0}
.btn-ghost{background:var(--surface);color:var(--fg);border:1px solid var(--line)!important}
.msgs{flex:1;overflow:auto;padding:18px 16px;display:flex;flex-direction:column;gap:6px}
.m{max-width:min(78%,520px);display:flex;flex-direction:column;gap:3px}
.m.out{align-self:flex-end;align-items:flex-end}
.m .by{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:0 4px}
.m .by.ia{color:var(--info)} .m .by.ase{color:var(--ok)}
.bub{background:var(--surface);border:1px solid var(--line);padding:8px 11px;border-radius:12px;white-space:pre-wrap;overflow-wrap:anywhere}
.m.out .bub{background:var(--mine);border-color:transparent}
.bub small{display:block;text-align:right;color:var(--muted);font-size:10.5px;margin-top:3px;font-family:var(--f-mono)}
.media{display:flex;align-items:center;gap:10px;padding:10px 12px;min-width:200px;border-radius:12px;background:var(--surface-2);font-weight:600;font-size:13px;color:var(--muted)}
.media svg{width:22px;height:22px;flex:none}
.photo{border-radius:12px;overflow:hidden;max-width:260px;border:1px solid var(--line);background:var(--surface)}
.photo img,.photo video{display:block;width:100%;max-height:300px;object-fit:cover}
.m audio{max-width:260px}
.form{font-family:var(--f-mono);font-size:12.5px;line-height:1.55}
.sysm{align-self:center;font-size:12px;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:4px 12px;margin:6px 0;text-align:center;max-width:92%}
.closed{padding:8px 14px;background:var(--warn-soft);color:var(--warn);font-size:12.5px;font-weight:600;border-top:1px solid var(--line)}
.composer{border-top:1px solid var(--line);background:var(--surface);padding:10px 12px;display:flex;gap:6px;align-items:flex-end;position:relative}
.composer textarea{flex:1;min-width:0;resize:none;border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:var(--bg);min-height:40px;max-height:120px;outline:none}
.composer textarea:focus{border-color:var(--accent)}
.composer .iconbtn{height:40px;min-width:40px;padding:0 9px}
.send{background:var(--accent);color:var(--accent-fg);border:0;border-radius:10px;padding:9px 14px;font-weight:700;height:40px}
.qrmenu{position:absolute;left:12px;right:12px;bottom:calc(100% + 6px);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);max-height:300px;overflow:auto;z-index:5}
.qrmenu button{display:block;width:100%;text-align:left;border:0;background:none;padding:9px 12px;border-bottom:1px solid var(--line)}
.qrmenu button:hover{background:var(--surface-2)}
.qrmenu b{font-family:var(--f-mono);font-size:12px;color:var(--accent)}
.qrmenu span{display:block;color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.ficha{border-left:1px solid var(--line);background:var(--surface);overflow:auto;padding:16px;display:grid;gap:18px;align-content:start}
.sec h3{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.sec h3 button{border:0;background:none;color:var(--accent);font-weight:700;font-size:12px;letter-spacing:0;text-transform:none;padding:0}
.kv{display:grid;grid-template-columns:96px minmax(0,1fr);gap:5px 10px;font-size:13px}
.kv dt{color:var(--muted)} .kv dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.steps{display:flex;flex-wrap:wrap;gap:4px}
.steps span{font-size:11.5px;padding:3px 8px;border-radius:5px;background:var(--surface-2);color:var(--muted);font-weight:600}
.steps span.done{background:var(--ok-soft);color:var(--ok)}
.steps span.now{background:var(--accent);color:var(--accent-fg)}
.tagbox{display:flex;flex-wrap:wrap;gap:6px}
.tagbox button{border:0;cursor:pointer;background:none;padding:0}
.tagbox .off{opacity:.42}
.wide{width:100%;padding:10px;border-radius:10px;font-weight:700;display:flex;justify-content:center;gap:6px}
.btnrow{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.note{font-size:12.5px;color:var(--muted)}
.cost{display:flex;justify-content:space-between;align-items:baseline;font-size:13px}
.ordbadge{display:flex;justify-content:space-between;align-items:center;background:var(--ok-soft);color:var(--ok);border-radius:10px;padding:9px 12px;font-weight:700;font-size:13px;margin-top:12px}
.edit{display:grid;gap:8px}
.edit .field input,.edit .field select{padding:6px 8px}
.irow{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) 30px;gap:6px;align-items:center}
.irow select{border:1px solid var(--line);border-radius:8px;padding:6px;background:var(--bg);min-width:0}
.irow button{border:0;background:var(--surface-2);border-radius:7px;height:30px}

/* pages */
.ph{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.ph h2{font-family:var(--f-display);font-size:24px;margin:0;letter-spacing:-.015em;text-wrap:balance}
.ph p{margin:4px 0 0;color:var(--muted);max-width:62ch}
.ph .grow{flex:1}
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;min-width:0}
.grid{display:grid;gap:14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:14px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px}
.kpi .l{font-size:12px;color:var(--muted);font-weight:600}
.kpi .v{font-family:var(--f-display);font-size:28px;font-weight:700;letter-spacing:-.02em;margin-top:2px;font-variant-numeric:tabular-nums}
.kpi .s{font-size:12px;color:var(--muted);margin-top:2px}
.kpi .s b{color:var(--ok)}
.two{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px}
.card h3{margin:0 0 4px;font-size:15px}
.card .sub{color:var(--muted);font-size:12.5px;margin:0 0 14px}
.funnel{display:grid;gap:8px}
.fr{display:grid;grid-template-columns:130px minmax(0,1fr) 92px;gap:10px;align-items:center;font-size:13px}
.fr .bar{height:22px;background:var(--surface-2);border-radius:5px;overflow:hidden}
.fr .bar i{display:block;height:100%;background:var(--accent);border-radius:5px}
.fr .val{text-align:right;font-family:var(--f-mono);font-size:12.5px}
.fr .val em{font-style:normal;color:var(--muted)}
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td.r,th.r{text-align:right}
tr:last-child td{border-bottom:0}
.good{color:var(--ok);font-weight:700} .badv{color:var(--bad);font-weight:700}

.orders{display:grid;gap:8px}
.ord{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:grid;grid-template-columns:minmax(150px,1.2fr) minmax(170px,1.5fr) minmax(150px,1fr) 170px auto;gap:10px 16px;align-items:center}
.ord.owner{grid-template-columns:minmax(150px,1.2fr) minmax(170px,1.5fr) minmax(150px,1fr) 80px 170px auto}
.ord .id{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.ord .c b{display:block}
.ord .c span,.ord .d span{font-size:12.5px;color:var(--muted);display:block}
.ord .money{font-family:var(--f-mono);font-size:12.5px}
.ord select{width:100%;border-radius:8px;padding:6px 8px;font-weight:700;font-size:12.5px;border:1px solid transparent}
.ord .acts{display:flex;gap:6px}
.st-new{background:var(--info-soft);color:var(--info)}
.st-mid{background:var(--warn-soft);color:var(--warn)}
.st-ok{background:var(--ok-soft);color:var(--ok)}
.st-bad{background:var(--bad-soft);color:var(--bad)}
.ord-head{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}

/* config */
.cfg{display:grid;grid-template-columns:200px minmax(0,1fr);gap:20px;align-items:start}
.cfgnav{display:grid;gap:2px;position:sticky;top:0}
.cfgnav button{border:0;background:none;text-align:left;padding:8px 10px;border-radius:8px;font-weight:600;color:var(--muted)}
.cfgnav button[aria-current="true"]{background:var(--surface);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line)}
.cfgnote{font-size:12px;color:var(--muted);padding:8px 10px;border-top:1px solid var(--line);margin-top:8px}
.tagrow{display:grid;grid-template-columns:170px minmax(0,1fr) minmax(0,1fr);gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px;align-items:start}
.tagrow:last-child{border-bottom:0}
.tagrow .h{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}
.flow{display:grid}
.fstep{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px}
.fstep .dot{display:flex;flex-direction:column;align-items:center}
.fstep .dot b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-family:var(--f-mono);background:var(--surface-2);color:var(--muted)}
.fstep .dot b.ia{background:var(--info-soft);color:var(--info)}
.fstep .dot b.bot{background:var(--accent-soft);color:var(--accent)}
.fstep .dot i{flex:1;width:2px;background:var(--line);min-height:14px}
.fstep .body{padding-bottom:16px;min-width:0}
.fstep .body b{display:block}
.fstep .body p{margin:2px 0 0;color:var(--muted);font-size:13px}
.kw{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.kw span{font-family:var(--f-mono);font-size:11.5px;background:var(--surface-2);padding:2px 6px;border-radius:4px}
.toggle{width:36px;height:20px;border-radius:12px;background:var(--line);border:0;position:relative;flex:none}
.toggle::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s}
.toggle[aria-pressed="true"]{background:var(--ok)}
.toggle[aria-pressed="true"]::after{left:18px}
.seqrow{display:grid;grid-template-columns:110px minmax(0,1fr) 36px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.seqrow:last-child{border-bottom:0}
.alert{background:var(--warn-soft);color:var(--warn);border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600}
.assets{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.asset{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface);display:flex;flex-direction:column}
.asset .th{aspect-ratio:4/3;max-width:100%;background:var(--surface-2);display:grid;place-items:center;color:var(--muted)}
.asset .th svg{width:30px;height:30px}
.asset .th img{width:100%;height:100%;object-fit:cover}
.asset .ab{padding:8px 10px;display:grid;gap:2px}
.asset .ab b{font-size:12.5px}
.asset .ab span{font-size:11.5px;color:var(--muted)}
.asset .key{font-family:var(--f-mono);font-size:10.5px;color:var(--accent)}
.upload{border:1px dashed var(--line);border-radius:10px;display:grid;place-items:center;text-align:center;padding:16px;color:var(--muted);font-weight:600;cursor:pointer;min-height:150px}
.upload:hover{background:var(--surface-2)}
.wallet{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center}
.wallet .big{font-family:var(--f-display);font-size:30px;font-weight:700;letter-spacing:-.02em}
.meter{height:8px;border-radius:5px;background:var(--surface-2);overflow:hidden;grid-column:1/-1}
.meter i{display:block;height:100%;background:var(--ok)}
.stock{overflow-x:auto}
.stock td input{width:58px;border:1px solid var(--line);border-radius:6px;padding:4px 6px;background:var(--bg);text-align:right;font-family:var(--f-mono)}
.stock td.low input{border-color:var(--bad);color:var(--bad);background:var(--bad-soft)}
.stock td.na{color:var(--muted);text-align:center}
.field{display:grid;gap:5px;font-size:13px;min-width:0}
.field label{font-weight:600;font-size:12.5px;color:var(--muted)}
.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--bg);width:100%;min-width:0}
.field textarea{min-height:90px;resize:vertical;font-size:13px}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.zones{display:flex;flex-wrap:wrap;gap:6px}
.zones span{background:var(--bad-soft);color:var(--bad);font-size:12.5px;padding:3px 9px;border-radius:20px;font-weight:600}
.qrl > div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.qrl b{font-family:var(--f-mono);color:var(--accent);font-size:12.5px}
.qrl span{color:var(--muted);white-space:pre-wrap}

/* modal */
.mwrap{position:fixed;inset:0;display:grid;place-items:center;z-index:32;padding:16px}
.modal{background:var(--surface);border-radius:14px;box-shadow:var(--shadow);width:min(560px,100%);max-height:calc(100% - 32px);overflow:auto;padding:20px;display:grid;gap:14px;position:relative}
.modal h3{font-family:var(--f-display);font-size:20px;margin:0}
.modal pre{margin:0;background:var(--surface-2);border-radius:10px;padding:12px;font-family:var(--f-mono);font-size:12.5px;white-space:pre-wrap}
.modal textarea{width:100%;min-height:260px;border:1px solid var(--line);border-radius:10px;padding:12px;font-family:var(--f-mono);font-size:12.5px;background:var(--bg)}
.total{display:flex;justify-content:space-between;background:var(--surface-2);border-radius:10px;padding:10px 12px;font-weight:700}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:10px 16px;border-radius:10px;font-weight:600;font-size:13px;z-index:40;box-shadow:var(--shadow);max-width:calc(100% - 32px)}
.bar-svg text{fill:var(--muted);font-size:11px;font-family:var(--f-mono)}

@media (max-width:1180px){
  .chats{grid-template-columns:300px minmax(0,1fr)}
  .chats .ficha{display:none}
  .chats.ficha-open .ficha{display:grid;position:absolute;right:0;top:0;bottom:0;width:min(340px,92vw);z-index:6;box-shadow:var(--shadow)}
  .two{grid-template-columns:minmax(0,1fr)}
  .ord,.ord.owner{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media (max-width:860px){
  .app{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}
  .side{grid-row:2;flex-direction:row;padding:4px 6px calc(4px + env(safe-area-inset-bottom,0px));border-right:0;border-top:1px solid var(--line);justify-content:space-around}
  .side .brand,.side-foot{display:none}
  .store-top{display:inline-flex}
  .topbar h1{display:none}
  .navbtn{flex-direction:column;gap:2px;font-size:11px;padding:6px 4px;align-items:center;position:relative}
  .navbtn .cnt{position:absolute;top:2px;left:calc(50% + 6px);margin:0}
  .main{grid-row:1}
  .topbar{padding:8px 16px}
  .chats{grid-template-columns:minmax(0,1fr)}
  .chats .conv{display:none}
  .chats.open .list{display:none}
  .chats.open .conv{display:flex}
  .back{display:inline-flex}
  .page{padding:16px 16px 32px}
  .cfg{grid-template-columns:minmax(0,1fr)}
  .cfgnav{display:flex;overflow-x:auto;position:static}
  .cfgnav button{white-space:nowrap}
  .cfgnote{display:none}
  .tagrow{grid-template-columns:minmax(0,1fr)}
  .fr{grid-template-columns:100px minmax(0,1fr) 80px}
  .m{max-width:88%}
  .conv-head .window{order:5}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ===== Agregados de la app real ===== */
body{margin:0}
.empty{align-content:center}
.boot{height:100%;display:grid;place-items:center;padding:16px;overflow:auto}
.auth{width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;display:grid;gap:14px;box-shadow:var(--shadow)}
.auth .brand-mark{width:40px;height:40px;font-size:20px;border-radius:10px}
.auth h1{font-family:var(--f-display);font-size:24px;margin:0;letter-spacing:-.015em}
.auth p{margin:0;color:var(--muted)}
.auth .send{width:100%}
.auth .link{border:0;background:none;color:var(--accent);font-weight:600;padding:0;justify-self:start}
.err{background:var(--bad-soft);color:var(--bad);border-radius:10px;padding:9px 12px;font-size:13px;font-weight:600}
.okmsg{background:var(--ok-soft);color:var(--ok);border-radius:10px;padding:9px 12px;font-size:13px;font-weight:600}
.send:disabled,.iconbtn:disabled,.btn-solid:disabled{opacity:.5;cursor:default}
.side-foot button{border:0;background:none;color:inherit;padding:0;text-align:left;font-size:12px;display:block;width:100%}
.side-foot button:hover{color:var(--fg)}
.side-foot b{color:var(--fg);font-weight:600}
.navbtn.me{display:none}
.daysep{align-self:center;font-size:11.5px;font-weight:700;color:var(--muted);background:var(--surface-2);border-radius:20px;padding:3px 10px;margin:8px 0 4px}
.bub .meta{display:flex;gap:4px;align-items:center;justify-content:flex-end;font-family:var(--f-mono);font-size:10.5px;color:var(--muted);margin-top:2px;line-height:1.2}
.bub.mediab .meta{padding:0 6px 3px}
.list-head > *{min-width:0}
.search input{width:100%}
.tick{font-family:var(--f-body);font-weight:700;letter-spacing:-.15em}
.tick.read{color:var(--info)}
.tick.failed{color:var(--bad);letter-spacing:0}
.m .failnote{font-size:12px;color:var(--bad);background:var(--bad-soft);border-radius:8px;padding:6px 9px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;max-width:100%}
.m .failnote button{border:0;background:var(--bad);color:#fff;border-radius:6px;padding:3px 8px;font-weight:700;font-size:11.5px}
.m .wrapb{position:relative;display:flex;align-items:flex-end;gap:4px;max-width:100%}
.m.out .wrapb{flex-direction:row-reverse}
.m .rbtn{opacity:0;border:0;background:var(--surface);border-radius:50%;width:26px;height:26px;color:var(--muted);flex:none;font-size:13px;box-shadow:0 1px 2px rgba(0,0,0,.1)}
.m:hover .rbtn,.m .rbtn:focus-visible{opacity:1}
@media (hover:none){.m .rbtn{opacity:.55}}
.react{position:absolute;bottom:-10px;right:8px;background:var(--surface);border:1px solid var(--line);border-radius:12px;font-size:12px;padding:0 5px;line-height:18px}
.m.out .react{right:auto;left:8px}
.quote{border-left:3px solid var(--accent);background:var(--surface-2);border-radius:6px;padding:4px 8px;font-size:12.5px;color:var(--muted);margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.m .bub .cap{display:block;margin-top:6px}
.bub.mediab{padding:4px;display:grid;gap:4px}
.bub.mediab .cap{margin:0;padding:2px 6px 4px}
.bub img.pic{display:block;max-width:min(280px,100%);max-height:320px;border-radius:9px;cursor:zoom-in;background:var(--surface-2)}
.bub img.stk{width:140px;height:140px;object-fit:contain;display:block}
.bub video{display:block;max-width:min(300px,100%);max-height:340px;border-radius:9px;background:#000}
.bub audio{display:block;width:260px;max-width:100%}
.doc{display:flex;gap:10px;align-items:center;padding:8px 10px;border-radius:9px;background:var(--surface-2);color:inherit;text-decoration:none;min-width:200px}
.doc svg{width:26px;height:26px;flex:none;color:var(--accent)}
.doc b{display:block;font-size:13px;overflow-wrap:anywhere}
.doc span{font-size:11.5px;color:var(--muted)}
.mpend{display:flex;align-items:center;gap:8px;padding:12px;color:var(--muted);font-size:13px;min-width:180px}
.adcard{align-self:center;max-width:min(92%,440px);background:var(--info-soft);color:var(--info);border-radius:12px;padding:8px 12px;font-size:12.5px;text-align:center}
.adcard b{display:block;color:var(--fg)}
.loadmore{align-self:center;margin:4px 0 10px}
.replybar{display:flex;gap:10px;align-items:center;padding:8px 12px;background:var(--surface-2);border-top:1px solid var(--line);font-size:12.5px}
.replybar .quote{flex:1;margin:0;background:var(--surface)}
.replybar button{border:0;background:none;font-size:18px;color:var(--muted);padding:0 4px}
.recbar{flex:1;display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;border-radius:10px;background:var(--bad-soft);color:var(--bad);font-weight:700;font-family:var(--f-mono)}
.recdot{width:10px;height:10px;border-radius:50%;background:var(--bad);animation:blink 1s infinite}
@keyframes blink{50%{opacity:.25}}
.composer.locked{justify-content:center}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:50;display:grid;place-items:center;padding:16px;cursor:zoom-out}
.lightbox img{max-width:100%;max-height:100%;border-radius:8px}
.preview{display:grid;place-items:center;background:var(--surface-2);border-radius:10px;padding:10px;min-height:120px}
.preview img,.preview video{max-width:100%;max-height:50vh;border-radius:8px}
.modal .close{position:absolute;top:12px;right:12px;border:0;background:none;font-size:22px;color:var(--muted);line-height:1}
.modal .row{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.check{display:flex;gap:8px;align-items:center;font-size:13.5px}
.check input{width:16px;height:16px;accent-color:var(--accent)}
.checks{display:grid;gap:6px}
.stlist{display:grid;gap:6px;margin:0;padding:0;list-style:none;font-size:13px}
.stlist li{display:flex;gap:8px;align-items:flex-start}
.stlist .y{color:var(--ok);font-weight:700}
.stlist .n{color:var(--bad);font-weight:700}
.copyrow{display:flex;gap:6px;align-items:center;min-width:0}
.copyrow code{flex:1;min-width:0;font-family:var(--f-mono);font-size:12.5px;background:var(--surface-2);border-radius:7px;padding:7px 9px;overflow:auto;white-space:nowrap}
.loglist{font-family:var(--f-mono);font-size:11.5px;color:var(--muted);display:grid;gap:4px;max-height:220px;overflow:auto}
.danger{border-color:var(--bad-soft)}
.btn-danger{background:var(--bad);color:#fff;border:0;border-radius:10px;padding:9px 14px;font-weight:700}
.pillst{font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap}
.lrow{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.lrow:last-child{border-bottom:0}
.lrow input,.lrow select{border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:var(--bg);min-width:0;width:100%}
.lrow .acts{display:flex;gap:6px}
.swatches{display:flex;gap:6px;flex-wrap:wrap}
.swatches button{width:24px;height:24px;border-radius:6px;border:2px solid transparent}
.swatches button[aria-pressed="true"]{border-color:var(--fg)}
.storebar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 16px;background:var(--warn-soft);color:var(--warn);font-weight:600;font-size:13px;border-bottom:1px solid var(--line)}
.storebar .grow{flex:1;min-width:160px}
.storebar button{border:0;border-radius:7px;padding:6px 12px;font-weight:700;font-size:12.5px;background:var(--surface);color:var(--fg)}
.spin{width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:rot .8s linear infinite;display:inline-block;flex:none}
@keyframes rot{to{transform:rotate(360deg)}}
.notify{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.notesbox{width:100%;min-height:70px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--bg);resize:vertical;font-size:13px}
.namein{width:100%;border:1px solid transparent;border-radius:6px;padding:2px 4px;background:none;font-weight:600;margin-left:-4px}
.namein:hover{border-color:var(--line)}
.namein:focus{border-color:var(--accent);background:var(--bg);outline:none}
@media (max-width:860px){
  .lrow{grid-template-columns:minmax(0,1fr) 100px}
  .lrow .acts{grid-column:1/-1}
  .navbtn.me{display:flex}
  .composer .iconbtn.hide-sm{display:none}
  .conv-head{flex-wrap:nowrap;gap:8px;padding:8px 10px}
  .conv-head .t b,.conv-head .t span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .conv-head .window{order:0;font-size:11px;padding:2px 7px}
  .conv-head .iconbtn{padding:6px 8px}
  .composer{padding:8px}
  .composer .iconbtn{min-width:38px;padding:0 7px}
  .send{padding:9px 12px}
}
/* Celular/tablet: la conversación ocupa todo el ancho */
@media (max-width:1180px){ .chats.no-ficha,.chats.ficha-open{grid-template-columns:300px minmax(0,1fr)} }
@media (max-width:860px){ .chats.no-ficha,.chats.ficha-open{grid-template-columns:minmax(0,1fr)} }
/* Etiquetas rápidas encima del cuadro de escribir */
.tagbar{display:flex;gap:4px;padding:6px 12px 0;background:var(--surface);border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tagbar button{flex:1 0 auto;border:0;border-radius:7px;padding:7px 10px;font-size:12px;font-weight:700;white-space:nowrap;color:var(--fg);background:color-mix(in srgb,var(--c) 18%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 45%,transparent)}
.tagbar button:hover{background:color-mix(in srgb,var(--c) 30%,transparent)}
.tagbar button[aria-pressed="true"]{background:var(--c);color:#fff;box-shadow:none}
#tagbar:not(:empty) + #composer .composer{border-top:0}
@media (max-width:860px){ .tagbar{flex-wrap:wrap;padding:6px 8px 0} .tagbar button{flex:1 1 30%;padding:6px 4px;font-size:11px} }

/* =================== Bot Suyon AI =================== */
.page.full{max-width:none}
.bswitch{display:inline-flex;align-items:center;gap:8px;font-weight:700;cursor:pointer;user-select:none}
.bswitch input{appearance:none;width:42px;height:24px;border-radius:20px;background:var(--line);position:relative;cursor:pointer;margin:0;transition:background .15s}
.bswitch input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.bswitch input:checked{background:var(--ok)}
.bswitch input:checked::after{left:21px}
.bswitch.sm{font-size:13px}
.bwho{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end}
.bcnt{display:inline-block;min-width:18px;padding:0 6px;border-radius:10px;background:var(--accent);color:var(--accent-fg);font-size:11px;font-family:var(--f-mono);text-align:center;vertical-align:middle}
.bbar{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin-bottom:12px}
.bbar input,.bbar select{border:1px solid var(--line);border-radius:8px;padding:7px 10px;background:var(--surface);font-weight:600;min-height:38px}
.bbar #bname{min-width:180px;flex:0 1 260px}
.bbar .grow,.brow .grow,.bphead .grow{flex:1}
.bwrap{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start}
.bpal{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.bpal h4{margin:0 0 0 6px;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bpal h4:first-child{margin-left:0}
.bpal button{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:20px;padding:6px 12px;min-height:38px;font-size:13px}
.bpal button:hover{background:var(--surface-2)}
.bpal .note{flex-basis:100%}
.kdot{width:10px;height:10px;border-radius:3px;flex:none;display:inline-block}
.bcanvas-wrap{flex:999 1 520px;min-width:0;height:min(76vh,860px);overflow:auto;border:1px solid var(--line);border-radius:14px;background-color:var(--surface);background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:20px 20px}
.bsizer{position:relative}
.bcanvas{position:absolute;left:0;top:0;transform-origin:0 0}
.bzoom{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.bzoom button{border:0;background:none;min-width:36px;height:36px;font-weight:700}
.bzoom span{font-family:var(--f-mono);font-size:12px;min-width:44px;text-align:center}
.bedges{position:absolute;inset:0;pointer-events:none;color:var(--muted)}
.bedges path{fill:none;stroke:currentColor;stroke-width:1.6;opacity:.65}
.bedges path.hot{color:var(--accent);opacity:1;stroke-width:2.2}
.bedges path.err{stroke-dasharray:5 5}
.bedges text{fill:var(--muted);font-size:11px;font-weight:700;font-family:var(--f-body);paint-order:stroke;stroke:var(--surface);stroke-width:4px;stroke-linejoin:round}
.bedges text.hot{fill:var(--accent)}
.bnode{position:absolute;box-sizing:border-box;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface);cursor:grab;touch-action:none;user-select:none;display:flex;flex-direction:column;gap:2px;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.bnode:active{cursor:grabbing}
.bnode[aria-pressed="true"]{box-shadow:0 0 0 3px var(--accent)}
.bnode small{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--kc,var(--muted))}
.bnode b{font-size:14px;line-height:1.25}
.bnode .bsum{font-size:12px;color:var(--muted);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.bst{font-family:var(--f-mono);font-size:11px;color:var(--fg);margin-top:4px}
.bst.muted{color:var(--muted)}
.bad{color:var(--bad)!important}
.ok{color:var(--ok)!important}
.k-start{--kc:#D9C9D0;background:#1F1A1D;color:#fff;border-color:#1F1A1D}
.bnode.k-start .bsum,.bnode.k-start .bst{color:#D9C9D0}
.k-send{--kc:var(--accent)}
.bnode.waits{border-style:dashed;border-color:var(--warn)}
.k-free{--kc:var(--ok);background:var(--ok-soft);border-color:var(--ok)}
.k-act{--kc:var(--fg)}
.k-wait{--kc:var(--warn);background:var(--warn-soft);border-color:var(--warn);border-style:dashed}
.k-ia{--kc:var(--info);background:var(--info-soft);border-color:var(--info)}
.k-hand{--kc:var(--bad);background:var(--bad-soft);border-color:var(--bad)}
.kdot.k-send{background:var(--accent)} .kdot.k-free{background:var(--ok)} .kdot.k-act{background:var(--fg)} .kdot.k-wait{background:var(--warn)} .kdot.k-ia{background:var(--info)} .kdot.k-hand{background:var(--bad)}
.kpill{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:var(--surface-2);color:var(--kc,var(--fg));white-space:nowrap}
.kpill.k-start{color:#fff}
.kpill.bad{background:var(--bad-soft);color:var(--bad)} .kpill.warn{background:var(--warn-soft);color:var(--warn)} .kpill.info{background:var(--info-soft);color:var(--info)}
.bpanel{flex:1 1 320px;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;gap:12px;align-content:start;max-height:min(76vh,860px);overflow:auto}
.bphead{display:flex;gap:6px;align-items:center}
.bform{display:grid;gap:10px}
.bform input,.bform select,.bform textarea,.bseq input,.bseq select,.bseq textarea,.bfrow input{border:1px solid var(--line);border-radius:8px;padding:7px 9px;background:var(--bg);min-width:0}
.bform textarea,.bseq textarea{width:100%;resize:vertical;font-size:13px}
.brow{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.chk{display:flex;gap:8px;align-items:center;font-weight:600;font-size:13px}
.fields2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.fields3{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.bitems{display:grid;gap:8px}
.bitem{border:1px solid var(--line);border-radius:10px;padding:8px;display:grid;gap:6px;background:var(--surface)}
.bitem input{width:100%}
.bopts,.bcase{display:grid;gap:6px}
.bcase{border:1px solid var(--line);border-radius:10px;padding:8px}
.bh{margin:6px 0 0;font-size:13px}
.bstats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.bstats div{background:var(--surface-2);border-radius:8px;padding:6px 8px}
.bstats span{display:block;font-size:11px;color:var(--muted)}
.bstats b{font-family:var(--f-mono);font-size:15px}
.btest{display:grid;gap:6px;margin-top:6px}
.bbub{background:var(--surface-2);border-radius:10px;padding:8px 10px;white-space:pre-wrap;font-size:13px}
.bfile{font-family:var(--f-mono);font-size:12px;color:var(--info)}
.bseq{display:grid;gap:10px;margin-bottom:14px}
.bstep{border:1px solid var(--line);border-radius:10px;padding:10px;display:grid;gap:8px}
.bstep.allfail{border-color:var(--bad);background:var(--bad-soft)}
.bstep .bt{font-family:var(--f-mono);font-weight:700;background:var(--surface-2);border-radius:6px;padding:2px 8px}
.bstepstats{font-size:12.5px;color:var(--muted)}
.bstepstats b{color:var(--fg);font-family:var(--f-mono)}
.okbox,.warnbox{border-radius:10px;padding:10px 12px;font-size:13px;margin:10px 0}
.okbox{background:var(--ok-soft);color:var(--ok);font-weight:600}
.warnbox{background:var(--warn-soft);color:var(--fg)}
.warnbox ol{margin:6px 0 0;padding-left:18px}
.bcode{width:100%;border:1px solid var(--line);border-radius:10px;padding:12px;font-family:var(--f-mono);font-size:12.5px;line-height:1.5;background:var(--bg);resize:vertical}
.savebar{position:sticky;bottom:0;display:flex;gap:10px;align-items:center;justify-content:flex-end;background:var(--bg);padding:10px 0;z-index:2}
.btable{width:100%;border-collapse:collapse;font-size:13px}
.btable th,.btable td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
.btable td{font-family:var(--f-mono)}
.bfrow{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.bfrow:last-child{border-bottom:0}
.bthumb{width:56px;height:56px;border-radius:8px;object-fit:cover;background:var(--surface-2);display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--muted);flex:none}
.bthumb.none{background:var(--warn-soft);color:var(--warn)}
.avgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.avcol{display:grid;gap:6px;align-content:start;border-top:4px solid var(--kc,var(--line))}
.avcol.k-hand{background:var(--surface)} .avcol.k-wait{background:var(--surface);border-style:solid} .avcol.k-send{--kc:var(--info)}
.avrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:8px 10px;min-height:44px}
.avrow:hover{background:var(--surface-2)}
.avrow .note:first-of-type{grid-column:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avrow .mono{grid-column:2;grid-row:1}
.avev{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.avev:last-child{border-bottom:0}
.avev.read{opacity:.6}
@media (max-width:860px){
  .bpal h4{flex-basis:100%;margin:4px 0 0}
  .bpanel{max-width:none;max-height:none}
  .bcanvas-wrap{height:62vh}
  .fields2{grid-template-columns:minmax(0,1fr)}
}


/* =================== Pulido: colores y movimiento =================== */
:root{--k-start:#2B2328;--k-send:#C2416B;--k-wait:#D98A1C;--k-free:#1E9E63;--k-act:#7454C9;--k-ia:#2F6FE0;--k-hand:#D43A2F;--k-goto:#1F9AA3;--ease:cubic-bezier(.2,.8,.2,1)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--k-start:#E9DDE3;--k-send:#F06A93;--k-wait:#F2A93B;--k-free:#3CCB87;--k-act:#A68BF5;--k-ia:#6EA0FF;--k-hand:#FF6B5E;--k-goto:#45C6CF}}
:root[data-theme="dark"]{--k-start:#E9DDE3;--k-send:#F06A93;--k-wait:#F2A93B;--k-free:#3CCB87;--k-act:#A68BF5;--k-ia:#6EA0FF;--k-hand:#FF6B5E;--k-goto:#45C6CF}

/* Mensajes: cada quien su color */
.m.s-ia .bub{background:color-mix(in srgb,var(--k-ia) 13%,var(--surface));border-color:color-mix(in srgb,var(--k-ia) 25%,transparent)}
.m.s-bot .bub{background:color-mix(in srgb,var(--k-free) 12%,var(--surface));border-color:color-mix(in srgb,var(--k-free) 25%,transparent)}
.m .by.bot{color:var(--k-free)} .m .by.ia{color:var(--k-ia)}
.m{animation:pop .22s var(--ease) both}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes flow{to{stroke-dashoffset:-24}}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--c,var(--accent)) 55%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
@keyframes slidein{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

/* Lista y navegación */
.item{transition:background .15s}
.navbtn{transition:background .15s,color .15s,transform .15s}
.navbtn:active,.iconbtn:active,.send:active,.chip:active{transform:scale(.97)}
.send{transition:filter .15s,transform .1s,box-shadow .15s}
.send:not(:disabled):hover{filter:brightness(1.08);box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 35%,transparent)}
.iconbtn{transition:background .15s,transform .1s}
.card{animation:rise .3s var(--ease) both}
.toast{animation:rise .25s var(--ease) both}
.modal{animation:pop .2s var(--ease) both}

/* Franja de llamadas */
.callbar{margin:10px 12px 0;border-radius:12px;border:1px solid var(--line);background:var(--surface);overflow:hidden;animation:rise .3s var(--ease) both}
.callbar.hot{border-color:color-mix(in srgb,var(--k-wait) 55%,var(--line));background:color-mix(in srgb,var(--k-wait) 8%,var(--surface))}
.cb-head{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;padding:9px 12px;text-align:left}
.cb-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--k-wait);color:#fff;flex:none;--c:var(--k-wait)}
.callbar:not(.hot) .cb-ic{background:var(--ok);--c:var(--ok)}
.callbar.hot .cb-ic{animation:pulse 2s infinite}
.cb-ic svg{width:17px;height:17px}
.cb-t{flex:1;min-width:0;display:grid}
.cb-t b{font-size:14px}
.cb-t span{font-size:12px;color:var(--muted)}
.cb-list{max-height:min(52vh,460px);overflow:auto;border-top:1px solid var(--line);padding:4px 8px 8px;animation:rise .2s var(--ease) both}
.cb-list h5{margin:10px 4px 4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:flex;gap:6px}
.cb-list h5 span{font-family:var(--f-mono)}
.cb-row{display:grid;gap:6px;padding:8px;border-radius:10px;transition:opacity .2s,background .15s}
.cb-row:hover{background:var(--surface-2)}
.cb-row.done{opacity:.55}
.cb-row.saving{opacity:.4;pointer-events:none}
.cb-name{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;border:0;background:none;padding:0;text-align:left}
.cb-tag{font-size:11px;font-weight:800;padding:1px 7px;border-radius:20px}
.cb-tag.y{background:color-mix(in srgb,var(--k-wait) 20%,transparent);color:var(--k-wait)}
.cb-tag.l{background:color-mix(in srgb,var(--k-ia) 18%,transparent);color:var(--k-ia)}
.cb-res{font-size:11.5px;font-weight:600}
.cb-res.ok{color:var(--ok)} .cb-res.warn{color:var(--warn)} .cb-res.bad{color:var(--bad)}
.cb-acts{display:flex;gap:5px;flex-wrap:wrap}
.cb-acts .iconbtn{padding:5px 8px}
.cb-acts svg{width:15px;height:15px}
.cb-btn{border:1px solid var(--line);background:var(--surface);border-radius:20px;padding:3px 8px;font-size:11.5px;font-weight:700;transition:background .15s,color .15s,transform .1s}
.cb-btn.ok:hover{background:var(--ok);color:#fff;border-color:var(--ok)}
.cb-btn.warn:hover{background:var(--warn);color:#fff;border-color:var(--warn)}
.cb-btn.bad:hover{background:var(--bad);color:#fff;border-color:var(--bad)}
.cb-btn:active{transform:scale(.95)}

/* Bot: bloques con color propio */
.k-start{--kc:var(--k-start)} .k-send{--kc:var(--k-send)} .k-wait{--kc:var(--k-wait)} .k-free{--kc:var(--k-free)}
.k-act{--kc:var(--k-act)} .k-ia{--kc:var(--k-ia)} .k-hand{--kc:var(--k-hand)}
.bnode{background:color-mix(in srgb,var(--kc) 7%,var(--surface));border:1px solid color-mix(in srgb,var(--kc) 35%,var(--line));border-top:4px solid var(--kc);color:var(--fg);
  transition:box-shadow .18s var(--ease),transform .18s var(--ease);animation:rise .35s var(--ease) both;animation-delay:var(--d,0ms)}
.bnode:hover{box-shadow:0 10px 24px color-mix(in srgb,var(--kc) 22%,transparent);transform:translateY(-2px)}
.bnode[aria-pressed="true"]{box-shadow:0 0 0 3px color-mix(in srgb,var(--kc) 55%,transparent),0 12px 28px color-mix(in srgb,var(--kc) 25%,transparent)}
.bnode.k-start{background:var(--k-start);color:var(--surface);border-color:var(--k-start)}
.bnode.k-start small,.bnode.k-start .bsum,.bnode.k-start .bst{color:color-mix(in srgb,var(--surface) 75%,transparent)}
.bnode.waits{border-style:solid;border-top-style:solid;background-image:repeating-linear-gradient(135deg,transparent 0 10px,color-mix(in srgb,var(--k-wait) 6%,transparent) 10px 20px)}
.bnode small{display:flex;align-items:center;gap:6px;color:var(--kc)}
.bnode .kn{font-family:var(--f-mono);font-size:10px;min-width:18px;height:18px;border-radius:6px;display:grid;place-items:center;background:var(--kc);color:var(--surface)}
.bnode.k-start .kn{background:var(--surface);color:var(--k-start)}
.kic{display:inline-grid;place-items:center}
.livedot{width:7px;height:7px;border-radius:50%;background:var(--ok);margin-left:auto;--c:var(--ok);animation:pulse 2.2s infinite}
.bedges path.hot{stroke-dasharray:7 5;animation:flow .7s linear infinite}
.bpal button{border-color:color-mix(in srgb,var(--kc) 40%,var(--line));transition:transform .12s,box-shadow .15s,background .15s}
.bpal button .kic{color:var(--kc)}
.bpal button:hover{background:color-mix(in srgb,var(--kc) 12%,var(--surface));transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--kc) 20%,transparent)}
.kpill{display:inline-flex;gap:6px;align-items:center;background:color-mix(in srgb,var(--kc,var(--muted)) 15%,var(--surface));color:var(--kc,var(--fg))}
.kpill.k-start{color:var(--k-start)}
.bpanel{animation:slidein .25s var(--ease) both}
.bphead~.field input:focus,.bform input:focus,.bform textarea:focus,.bform select:focus{outline:2px solid var(--accent);outline-offset:0}
.seg button{transition:background .15s,color .15s}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-fg)}
.bswitch input{transition:background .2s}
.avcol{border-top-color:var(--kc)}
.avcol.k-send{--kc:var(--k-ia)}
.avrow{transition:transform .12s,background .15s}
.avrow:hover{transform:translateX(3px)}
.avev{animation:rise .25s var(--ease) both}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important}}

/* ---------- Simulador del bot ---------- */
.simwrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
.simphone{display:flex;flex-direction:column;height:min(72vh,720px);min-height:460px;background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.simhead{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line)}
.simhead b{display:block;font-weight:700}
.simhead span{display:block;color:var(--muted);font-size:12px}
.simav{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);flex:none}
.simmsgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.simm{display:flex;flex-direction:column;max-width:78%;animation:pop .22s ease-out}
.simm.me{align-self:flex-end;align-items:flex-end}
.simm.them{align-self:flex-start}
.simb{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:7px 10px;white-space:pre-wrap;overflow-wrap:anywhere;display:grid;gap:5px}
.simm.me .simb{background:var(--mine);border-color:transparent}
.simm.s-ia .simb{background:color-mix(in srgb,var(--k-ia) 13%,var(--surface));border-color:color-mix(in srgb,var(--k-ia) 25%,transparent)}
.simm.s-bot .simb{background:color-mix(in srgb,var(--k-free) 12%,var(--surface));border-color:color-mix(in srgb,var(--k-free) 25%,transparent)}
.simb img,.simb video{display:block;max-width:min(260px,100%);max-height:300px;border-radius:8px;background:var(--surface-2)}
.simb audio{width:240px;max-width:100%}
.simb i{font-style:normal;font-family:var(--f-mono);font-size:10.5px;color:var(--muted);justify-self:end}
.simby{font-size:11px;font-weight:600;color:var(--muted);margin:0 4px 2px}
.simby.ia{color:var(--k-ia)}
.simby.bot{color:var(--k-free)}
.simsys{align-self:center;max-width:92%;font-size:12.5px;background:var(--warn-soft);color:var(--warn);border-radius:9px;padding:6px 10px;text-align:center;animation:pop .22s ease-out}
.simtyping{display:flex;gap:4px;padding:11px 12px}
.simtyping b{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:blink 1s infinite}
.simtyping b:nth-child(2){animation-delay:.2s}
.simtyping b:nth-child(3){animation-delay:.4s}
.simempty{margin:auto;max-width:340px;text-align:center;display:grid;gap:8px;justify-items:center;color:var(--muted)}
.simempty b{color:var(--fg);font-family:var(--f-display);font-size:16px}
.simquick{display:flex;gap:6px;overflow-x:auto;padding:8px 12px 0;border-top:1px solid var(--line)}
.simquick button{flex:none;border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:4px 10px;font-size:12.5px;color:var(--fg)}
.simquick button:hover:not(:disabled){background:var(--surface-2)}
.simform{display:flex;gap:8px;padding:8px 12px 12px;align-items:center}
.simform input#simtxt{flex:1;min-width:0;border:1px solid var(--line);border-radius:20px;padding:9px 14px;background:var(--surface);color:var(--fg);font:inherit}
.simpic{cursor:pointer;flex:none}
.simside{display:grid;gap:10px}
.simside .card{padding:12px 14px}
.simside h3{margin:0 0 8px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.simside select{width:100%}
.simstate{display:flex;gap:10px;align-items:flex-start}
.simstate b{display:block}
.simstate .dot{width:10px;height:10px;border-radius:50%;background:var(--t-grey);margin-top:5px;flex:none}
.simstate .dot.on{background:var(--ok);animation:pulse 1.6s infinite;--c:var(--ok)}
.simstate .dot.off{background:var(--warn)}
.simtags{display:flex;flex-wrap:wrap;gap:5px}
.simvars{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin:0;font-size:13px}
.simvars dt{font-family:var(--f-mono);color:var(--muted);font-size:12px}
.simvars dd{margin:0;overflow-wrap:anywhere}
.simjobs{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.simjobs li{display:flex;justify-content:space-between;gap:8px;font-size:13px}
@media (max-width:900px){.simwrap{grid-template-columns:1fr}.simphone{height:70vh}}
@media (prefers-reduced-motion:reduce){.simm,.simsys{animation:none}.simtyping b,.simstate .dot.on{animation:none}}

/* ---------- Clientes ---------- */
.cli{display:flex;flex-direction:column;height:100%;min-height:0;padding:16px 20px;gap:10px}
.clihead{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.clititle{display:flex;align-items:baseline;gap:10px}
.clititle #clitotal{font-weight:700;font-size:14px;white-space:nowrap}
a.iconbtn{text-decoration:none;color:inherit}
.cliq{flex:0 1 340px}
.clihead select{border:1px solid var(--line);border-radius:8px;padding:7px 8px;background:var(--surface);color:var(--fg);font:inherit;font-size:13px}
.clitags{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.clitags button{border:0;background:none;padding:0;cursor:pointer;flex:none}
.clitags .off{opacity:.45}
.cliwrap{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px}
.clilist{min-height:0;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.clitable{width:100%;border-collapse:collapse;font-size:13px}
.clitable th{position:sticky;top:0;background:var(--surface);text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);z-index:1}
.clitable td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.clitable tr[data-cli]{cursor:pointer;transition:background .12s}
.clitable tr[data-cli]:hover{background:var(--surface-2)}
.clitable tr.sel{background:var(--accent-soft)}
.clitable .r{text-align:right}
.nowrap{white-space:nowrap}
.cliwho{display:flex;align-items:center;gap:10px;min-width:0}
.cliwho b{display:block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cliwho small{display:block;color:var(--muted);font-size:11.5px}
.cliav{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:12px;letter-spacing:.02em}
.cliav.lg{width:44px;height:44px;font-size:15px}
.clichips{display:flex;flex-wrap:wrap;gap:4px;min-width:170px;max-width:300px}
.clisum{max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pillsm{display:inline-block;font-size:11.5px;font-weight:600;border-radius:20px;padding:2px 8px;background:var(--surface-2);color:var(--muted)}
.pillsm.ad{background:var(--info-soft);color:var(--info)}
.clilist .loadmore{margin:12px auto;display:flex}
.clidet{min-height:0;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.clipick{margin:auto;max-width:260px;text-align:center}
.clidhead{display:flex;gap:12px;align-items:center}
.clidhead .namein{font-size:16px;font-family:var(--f-display)}
.clix{display:none}
.clidact{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 4px}
.clidact .send{height:36px;padding:0 14px}
.clisec{border-top:1px solid var(--line);padding:12px 0 6px}
.clisec h3{margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.clisech{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.clisech h3{margin:0}
.iconbtn.sm{padding:3px 8px;font-size:12px}
.send.sm{height:32px;padding:0 12px;font-size:13px}
.clivars{display:grid;gap:6px}
.clivar{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:6px}
.clivar input{border:1px solid var(--line);border-radius:7px;padding:6px 8px;background:var(--bg);color:var(--fg);font:inherit;font-size:13px;min-width:0}
.clivar input[data-vk]{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.clivbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.clisec.danger h3{color:var(--bad)}
.clidanger{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:6px 0}
.clidanger b{display:block;font-size:13px}
.clidanger .note{display:block;font-size:12px}
.iconbtn.bad{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 35%,var(--line))}
.iconbtn.bad:hover{background:var(--bad-soft)}
@media (max-width:1500px){.clitable th:nth-child(5),.clitable td:nth-child(5){display:none}}
@media (max-width:1100px){.cliwrap{grid-template-columns:minmax(0,1fr) 340px}}
@media (max-width:860px){
  .cli{padding:12px 16px}
  .cliq{flex:1 1 100%}
  .cliwrap{grid-template-columns:1fr}
  .clidet{display:none}
  .cliwrap.open .clidet{display:flex;position:fixed;inset:0;z-index:40;border-radius:0;border:0;padding:14px 16px 90px}
  .clix{display:inline-flex}
  .clitable th:nth-child(2),.clitable td:nth-child(2),.clitable th:nth-child(4),.clitable td:nth-child(4){display:none}
  .clichips{max-width:150px}
}

/* ---------- Pantalla de entrada ---------- */
.bootx{height:100%;overflow:auto}
.authx{min-height:100%;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}
.authbrand{position:relative;overflow:hidden;color:#FBF3F5;padding:40px 56px;display:flex;flex-direction:column;gap:28px;
  background:radial-gradient(1200px 600px at -10% -20%,#9B2C47 0%,transparent 55%),radial-gradient(900px 500px at 110% 120%,#3B0E1C 0%,transparent 60%),linear-gradient(160deg,#6E1A30,#4A1020)}
.authbrand::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000,transparent 80%);pointer-events:none}
.authbrand>*{position:relative}
.ab-top{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-size:18px;letter-spacing:-.01em}
.ab-mark{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#FBF3F5;color:#6E1A30;font-family:var(--f-display);font-weight:800;font-size:17px}
.ab-copy{margin-top:auto;max-width:520px;display:grid;gap:14px}
.ab-kicker{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#F2B8C6}
.ab-copy h2{margin:0;font-family:var(--f-display);font-size:clamp(30px,3.4vw,44px);line-height:1.05;letter-spacing:-.025em;font-weight:700;text-wrap:balance}
.ab-copy p{margin:0;font-size:16px;line-height:1.5;color:rgba(251,243,245,.82);max-width:460px}
.ab-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:9px}
.ab-list li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:rgba(251,243,245,.92)}
.ab-list li::before{content:"";flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;background:rgba(255,255,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FBF3F5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/11px no-repeat}
.ab-demo{max-width:420px;display:grid;gap:8px;padding:16px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px);margin-bottom:auto}
.abm{max-width:85%;padding:8px 11px;border-radius:12px;font-size:13px;line-height:1.4;animation:rise .5s ease-out both}
.abm span{display:block;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.75;margin-bottom:2px}
.abm.in{justify-self:end;background:#FBF3F5;color:#3B0E1C;border-bottom-right-radius:4px}
.abm.out{background:rgba(46,158,94,.22);border:1px solid rgba(46,158,94,.35);border-bottom-left-radius:4px}
.abm.ia{background:rgba(74,116,217,.24);border-color:rgba(74,116,217,.4);animation-delay:.5s}
.abm.out:not(.ia){animation-delay:.25s}
.abtags{display:flex;gap:6px;animation:rise .5s .38s ease-out both}
.abtags i{font-style:normal;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;background:color-mix(in srgb,var(--c) 30%,transparent);border:1px solid color-mix(in srgb,var(--c) 55%,transparent)}
.ab-foot{font-size:12px;color:rgba(251,243,245,.6)}
.authside{display:grid;place-items:center;padding:32px 24px;background:var(--bg)}
.authside .auth{box-shadow:none;border:0;background:transparent;padding:8px;width:min(380px,100%);gap:16px}
.auth-h{display:grid;gap:6px;margin-bottom:6px}
.authside .auth h1{font-size:28px}
.authside .field input{height:44px}
.authside .send{height:46px;font-size:15px}
@media (max-width:900px){
  .authx{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .authbrand{padding:22px 20px 26px;gap:14px}
  .ab-copy{margin-top:0;gap:8px}
  .ab-copy h2{font-size:26px}
  .ab-copy p{font-size:14px}
  .ab-list,.ab-demo,.ab-foot{display:none}
  .authside{place-items:start center;padding:24px 16px 40px}
}
@media (prefers-reduced-motion:reduce){.abm,.abtags{animation:none}}

/* ---------- Datos para el prompt ({llave}) ---------- */
.bvars{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 8px}
.bvars button{border:1px solid var(--line);background:var(--surface-2);border-radius:6px;padding:2px 7px;font-family:var(--f-mono);font-size:11.5px;color:var(--fg);cursor:pointer}
.bvars button:hover{border-color:var(--accent);color:var(--accent)}
.bpwrap{position:relative}
.bvmenu{position:absolute;left:12px;top:12px;z-index:20;width:min(360px,calc(100% - 24px));max-height:260px;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:4px;display:grid}
.bvmenu button{display:flex;gap:10px;align-items:baseline;text-align:left;border:0;background:none;padding:7px 9px;border-radius:7px;cursor:pointer;color:var(--fg)}
.bvmenu button b{flex:none;font-size:12px;color:var(--accent)}
.bvmenu button span{font-size:12.5px;color:var(--muted)}
.bvmenu button[aria-selected="true"],.bvmenu button:hover{background:var(--accent-soft)}

/* ---------- Reportes ---------- */
.rep{padding:16px 20px 40px;display:grid;gap:14px;align-content:start;overflow:auto;height:100%}
.rephead{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.repdates{display:flex;gap:6px;align-items:center}
.repdates[hidden]{display:none}
.repdates input{border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:var(--surface);color:var(--fg);font:inherit;font-size:13px}
#repbody{display:grid;gap:14px}
.rtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.rtiles.sm{grid-template-columns:repeat(3,minmax(0,1fr))}
.rtile{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;gap:2px;animation:rise .35s ease-out both}
.rtile.hi{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--surface))}
.rtl{font-size:12px;color:var(--muted);font-weight:600}
.rtv{font-family:var(--f-display);font-size:28px;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.rts{font-size:12px;color:var(--muted)}
.rcard{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;min-width:0}
.rcard h3{margin:0;font-size:14px}
.rsub{margin:2px 0 10px;font-size:12px;color:var(--muted)}
.rch{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap}
.seg.sm button{padding:3px 9px;font-size:12px}
.rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.rempty{margin:6px 0 0}
.hbars{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hbars li{display:grid;grid-template-columns:minmax(70px,120px) minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13px}
.hbn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbt{height:12px;background:var(--surface-2);border-radius:4px;overflow:hidden}
.hbt i{display:block;height:100%;background:var(--accent);border-radius:0 4px 4px 0;transition:width .5s ease}
.hbt i.mute{background:var(--t-grey)}
.hbars li:hover .hbt i{filter:brightness(1.12)}
.hbv{font-family:var(--f-mono);font-size:12.5px;font-variant-numeric:tabular-nums;text-align:right;min-width:62px}
.hbv small{display:inline-block;margin-left:6px;color:var(--muted);font-size:11px;min-width:30px}
.vchart{position:relative;height:190px;padding:0 0 22px 34px}
.vgrid{position:absolute;inset:0 0 22px 34px;pointer-events:none}
.vgrid span{position:absolute;left:0;right:0;border-top:1px dashed var(--line)}
.vgrid em{position:absolute;left:-34px;top:-8px;width:28px;text-align:right;font-style:normal;font-family:var(--f-mono);font-size:10.5px;color:var(--muted)}
.vcols{position:relative;height:100%;display:flex;align-items:flex-end;gap:2px;border-bottom:1px solid var(--line)}
.vcol{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;outline:none;cursor:default}
.vcol i{display:block;width:min(70%,22px);background:var(--accent);border-radius:4px 4px 0 0;transition:height .45s ease}
.vcol:hover i,.vcol:focus i{filter:brightness(1.15)}
.vcol span{position:absolute;bottom:-20px;font-size:10.5px;color:var(--muted);font-family:var(--f-mono);white-space:nowrap}
.vtip{position:absolute;top:-6px;transform:translateX(-50%);background:var(--fg);color:var(--surface);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px;white-space:nowrap;pointer-events:none;z-index:2}
.rtable{overflow-x:auto}
.rtable table{width:100%;border-collapse:collapse;font-size:13px}
.rtable th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;padding:8px 10px;border-bottom:1px solid var(--line)}
.rtable td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.rtable td small{display:block;color:var(--muted);font-size:11px}
.rtable .r{text-align:right}
.rrate{display:inline-block;width:80px;height:8px;background:var(--surface-2);border-radius:4px;overflow:hidden;margin-right:8px;vertical-align:middle}
.rrate i{display:block;height:100%;background:var(--accent);border-radius:0 4px 4px 0}
.rnote{margin:0;font-size:12px}
@media (max-width:860px){.rep{padding:12px 16px 90px}.rtv{font-size:24px}.hbars li{grid-template-columns:minmax(60px,90px) minmax(0,1fr) auto}}
@media (prefers-reduced-motion:reduce){.rtile{animation:none}.hbt i,.vcol i{transition:none}}

/* ---------- Perfil de WhatsApp ---------- */
.wprof{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.wpic{display:grid;justify-items:center;gap:8px;max-width:200px;text-align:center}
.wpimg{position:relative;width:112px;height:112px;border-radius:50%;overflow:hidden;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-family:var(--f-display);font-size:40px;border:1px solid var(--line)}
.wpimg img{width:100%;height:100%;object-fit:cover}
.wpspin{position:absolute}
.wpinfo{display:grid;gap:4px;min-width:0;flex:1}
.wpname{font-family:var(--f-display);font-size:20px}
.steps{margin:6px 0 0;padding-left:20px;display:grid;gap:8px;font-size:13.5px}

/* ---------- Pedidos ---------- */
.ped{padding:16px 20px 40px;display:grid;gap:12px;align-content:start;grid-auto-rows:max-content;overflow:auto;height:100%}
.pedhead{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pedq{flex:0 1 300px}
.pdays{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.pday{flex:none;display:grid;justify-items:center;gap:1px;min-width:64px;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--fg);cursor:pointer}
.pday span{font-size:11.5px;color:var(--muted);text-transform:capitalize}
.pday b{font-family:var(--f-display);font-size:18px}
.pday small{font-size:10px;color:var(--bad)}
.pday.on{border-color:var(--accent);background:var(--accent-soft)}
.pday.on span{color:var(--accent)}
.pchips{display:flex;gap:6px;flex-wrap:wrap}
.pchips button{border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:4px 10px;font-size:12.5px;display:inline-flex;gap:6px;align-items:center;color:var(--fg);cursor:pointer}
.pchips button.on{background:var(--fg);color:var(--surface);border-color:var(--fg)}
.pchips b{font-family:var(--f-mono);font-size:11.5px}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.ptot{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;align-items:baseline}
.plist{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:auto}
.ptable{width:100%;border-collapse:collapse;font-size:13px}
.ptable th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--surface)}
.ptable td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.ptable td small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.ptable tr[data-po]{cursor:pointer;transition:background .12s}
.ptable tr[data-po]:hover{background:var(--surface-2)}
.ptable .r{text-align:right}
.pres{max-width:280px}
.psrc{font-family:var(--f-body)}
.psrc.s-ia{color:var(--info)!important}
.psrc.s-shopify{color:var(--ok)!important}
.pmodo{display:inline-block;font-size:11px;font-weight:700;border-radius:6px;padding:1px 6px;background:var(--surface-2)}
.pmodo.m-lima{background:color-mix(in srgb,var(--t-blue) 16%,transparent);color:var(--t-blue)}
.pmodo.m-agencia{background:color-mix(in srgb,var(--t-orange) 18%,transparent);color:var(--t-orange)}
.pmodo.m-ce_prov{background:color-mix(in srgb,var(--t-teal) 18%,transparent);color:var(--t-teal)}
.opill{display:inline-block;font-size:11.5px;font-weight:700;border-radius:20px;padding:2px 9px;white-space:nowrap}
.t-info{background:var(--info-soft);color:var(--info)}
.t-warn{background:var(--warn-soft);color:var(--warn)}
.t-acc{background:var(--accent-soft);color:var(--accent)}
.t-run{background:color-mix(in srgb,var(--t-purple) 16%,transparent);color:var(--t-purple)}
.t-ok{background:var(--ok-soft);color:var(--ok)}
.t-bad{background:var(--bad-soft);color:var(--bad)}
.t-mute{background:var(--surface-2);color:var(--muted)}
.dot.t-info{background:var(--info)}.dot.t-warn{background:var(--warn)}.dot.t-acc{background:var(--accent)}.dot.t-run{background:var(--t-purple)}.dot.t-ok{background:var(--ok)}.dot.t-bad{background:var(--bad)}.dot.t-mute{background:var(--muted)}
.pmodal{position:fixed;inset:0;z-index:60;background:var(--scrim);display:grid;place-items:center;padding:16px;animation:fade .15s ease-out}
@keyframes fade{from{opacity:0}to{opacity:1}}
.pmbox{width:min(760px,100%);max-height:calc(100vh - 32px);display:flex;flex-direction:column;background:var(--surface);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;animation:pop .2s ease-out}
.pmh{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line)}
.pmh h2{margin:0;font-family:var(--f-display);font-size:20px}
.pmbody{overflow:auto;padding:4px 18px 14px}
.pmbody section{padding:12px 0;border-bottom:1px solid var(--line)}
.pmbody section:last-child{border-bottom:0}
.pmbody h3{margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.pmsec{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.pmsec h3{margin:0}
.pmodos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pmo{border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:grid;gap:2px;cursor:pointer}
.pmo input{position:absolute;opacity:0;pointer-events:none}
.pmo b{font-size:13px}
.pmo span{font-size:11.5px;color:var(--muted)}
.pmo.on{border-color:var(--accent);background:var(--accent-soft)}
.pflow{display:flex;gap:6px;flex-wrap:wrap}
.pflow button{border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:18px;padding:5px 11px;font-size:12.5px;font-weight:600;cursor:pointer}
.pflow button.on.t-info{background:var(--info);color:#fff;border-color:var(--info)}
.pflow button.on.t-warn{background:var(--warn);color:#fff;border-color:var(--warn)}
.pflow button.on.t-acc{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.pflow button.on.t-run{background:var(--t-purple);color:#fff;border-color:var(--t-purple)}
.pflow button.on.t-ok{background:var(--ok);color:#fff;border-color:var(--ok)}
.pflow button.on.t-bad{background:var(--bad);color:#fff;border-color:var(--bad)}
.pflow button.on.t-mute{background:var(--muted);color:#fff;border-color:var(--muted)}
.pgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pgrid .pwide{grid-column:1/-1}
.pgrid input,.pit input,.pit select,.pmoney input{border:1px solid var(--line);border-radius:8px;padding:7px 9px;background:var(--bg);color:var(--fg);font:inherit;font-size:13px;width:100%;min-width:0}
.pitems{display:grid;gap:6px}
.pit{display:grid;grid-template-columns:minmax(0,1.4fr) 86px minmax(0,1fr) 64px auto;gap:6px}
.pmoney{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.pmoney .field{width:150px}
.pmsaldo{padding:8px 0;font-weight:700}
.phist{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:12.5px;max-height:160px;overflow:auto}
.pmf{display:flex;gap:8px;align-items:center;padding:12px 18px;border-top:1px solid var(--line);flex-wrap:wrap;background:var(--surface)}
.fped{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:4px}
.fped button{width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 8px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;cursor:pointer;color:var(--fg)}
.fped button:hover{background:var(--surface-2)}
.pshurl{display:flex;gap:8px;align-items:center;background:var(--surface-2);border-radius:8px;padding:8px 10px;margin:4px 0 10px;overflow:hidden}
.pshurl .mono{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.autos{display:grid;gap:10px}
.auto{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:8px;transition:border-color .15s,background .15s}
.auto.on{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 4%,var(--surface))}
.ahead{display:flex;gap:10px;align-items:flex-start}
.ahead b{display:block;font-size:13.5px}
.ahead .note{display:block;font-size:12px}
.pill-cat{font-size:11px;color:var(--muted);background:var(--surface-2);border-radius:12px;padding:2px 8px;white-space:nowrap}
.afoot{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.afoot input{border:1px solid var(--line);border-radius:6px;padding:3px 6px;background:var(--bg);color:var(--fg)}
@media (max-width:860px){
  .ped{padding:12px 16px 90px}
  .pedq{flex:1 1 100%}
  .ptable thead{display:none}
  .ptable,.ptable tbody{display:block}
  .ptable tr[data-po]{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .ptable td{padding:0;border:0}
  .ptable td:nth-child(1){grid-row:1/3}
  .ptable td:nth-child(2){grid-column:2}
  .ptable td:nth-child(3){grid-column:2}
  .ptable td:nth-child(4){grid-column:2;font-size:12.5px}
  .ptable td:nth-child(5){grid-column:3;grid-row:1}
  .ptable td:nth-child(6){grid-column:3;grid-row:2;text-align:right}
  .ptable td:nth-child(7){grid-column:3;grid-row:3}
  .pmodos{grid-template-columns:1fr}
  .pgrid{grid-template-columns:1fr}
  .pit{grid-template-columns:76px minmax(0,1fr) 54px auto}
  .pit [data-it="producto"]{grid-column:1/-1}
  .pmodal{padding:0;place-items:end stretch}
  .pmbox{max-height:94vh;border-radius:14px 14px 0 0}
}
@media (prefers-reduced-motion:reduce){.pmodal,.pmbox{animation:none}}

/* Botones para tocar (bot) */
.bopts{display:grid;gap:4px;font-size:12.5px;font-weight:600;color:var(--muted)}
.bopts i{font-style:normal;font-weight:400}
.bopts-out{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.bopts-out span{border:1px solid color-mix(in srgb,var(--info) 40%,transparent);color:var(--info);border-radius:14px;padding:2px 9px;font-size:12px;font-weight:600}
.simopts{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px;max-width:85%}
.simopts button{border:1px solid color-mix(in srgb,var(--info) 45%,var(--line));background:var(--surface);color:var(--info);border-radius:16px;padding:4px 11px;font-size:12.5px;font-weight:600;cursor:pointer}
.simopts button:hover{background:var(--info-soft)}

/* Clientes: números y segmentos */
.clikpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.clikpis:empty{display:none}
.clikpi{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:grid;gap:2px;min-width:0}
.clikpi span{font-size:12px;color:var(--muted);font-weight:600}
.clikpi b{font-family:var(--f-display);font-size:22px;line-height:1.1}
.clikpi small{font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cliseg{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.cliseg button{flex:none;border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:16px;padding:4px 11px;font-size:12.5px;font-weight:600;cursor:pointer}
.cliseg button b{font-family:var(--f-mono);font-size:11.5px;color:var(--muted);margin-left:2px}
.cliseg button[aria-pressed="true"]{background:var(--fg);color:var(--surface);border-color:var(--fg)}
.cliseg button[aria-pressed="true"] b{color:inherit}
.pillsm.seg-una{background:var(--info-soft);color:var(--info)}
.pillsm.seg-frecuente{background:var(--ok-soft);color:var(--ok)}
.pillsm.seg-vip{background:var(--accent-soft);color:var(--accent)}
.pillsm.seg-reactivar{background:var(--warn-soft);color:var(--warn)}
@media (max-width:860px){.clikpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.linkbtn{border:0;background:none;padding:0;color:var(--accent);font:inherit;font-weight:600;text-decoration:underline;cursor:pointer}

/* Cómo vende la tienda (mensajes o Shopify) */
.canales{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.canal{position:relative;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;gap:4px;cursor:pointer;background:var(--surface);transition:border-color .15s,background .15s}
.canal input{position:absolute;opacity:0;pointer-events:none}
.canal b{font-size:14px;display:flex;gap:8px;align-items:center}
.canal span{font-size:12.5px;color:var(--muted);line-height:1.4}
.canal:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.canal:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:600px){.canales{grid-template-columns:1fr}}

/* Marca Control Total (CT) */
.brand-mark svg,.ab-mark svg{width:72%;height:72%;display:block}
.brand-mark{background:var(--t-wine)}
.ab-mark{background:#16111A}

/* Barra lateral oscura (PC). En celular sigue la barra de abajo clara. */
@media (min-width:861px){
  .side{--sb-bg:#141015;--sb-fg:#F3EEF1;--sb-muted:#A79DA3;--sb-line:rgba(255,255,255,.09);--sb-hover:rgba(255,255,255,.06);
    background:var(--sb-bg);border-right:1px solid #000;color:var(--sb-fg);color-scheme:dark}
  .side .brand{background:rgba(255,255,255,.04);border-color:var(--sb-line);color:var(--sb-fg)}
  .side .brand:hover{background:var(--sb-hover)}
  .side .brand small,.side .caret{color:var(--sb-muted)}
  .side .brand-mark{background:#7A1F35}
  .side .navbtn{color:var(--sb-muted)}
  .side .navbtn:hover{background:var(--sb-hover);color:var(--sb-fg)}
  .side .navbtn[aria-current="page"]{background:rgba(224,122,147,.16);color:#fff;box-shadow:inset 3px 0 0 #E07A93}
  .side .navbtn[aria-current="page"] svg{color:#F2B6C4}
  .side .navbtn .cnt{background:#E5484D;color:#fff}
  .side .side-foot{color:var(--sb-muted);border-top:1px solid var(--sb-line);padding-top:12px}
  .side .side-foot b{color:var(--sb-fg)}
  .side .side-foot button:hover{color:var(--sb-fg)}
}
.trans{display:block;margin-top:6px;padding:6px 9px;border-radius:8px;background:color-mix(in srgb,var(--info) 9%,transparent);color:var(--fg);font-size:13px;font-style:italic;line-height:1.4;max-width:320px}
.trans.off{color:var(--muted);background:var(--surface-2);font-style:normal;font-size:12px}

/* Conectar WhatsApp con un clic */
.esconn{border-color:color-mix(in srgb,var(--ok) 35%,var(--line))}
.esbtns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.esbtn{display:flex;gap:10px;align-items:center;text-align:left;padding:12px 14px;border-radius:12px;min-height:58px}
.esbtn span{display:grid;gap:2px}
.esbtn small{font-weight:400;font-size:12px;opacity:.85}
.esbtn svg{width:22px;height:22px;flex:none}
@media (max-width:700px){.esbtns{grid-template-columns:1fr}}

/* Planes de alumnos */
.planpill{border:1px solid color-mix(in srgb,var(--info) 40%,var(--line));background:var(--info-soft);color:var(--info);border-radius:20px;padding:4px 12px;font-size:12.5px;font-weight:700;cursor:pointer}
.planpill.warn{background:var(--warn-soft);color:var(--warn);border-color:color-mix(in srgb,var(--warn) 40%,var(--line))}
.paywall{max-width:560px;margin:40px auto;display:grid;gap:14px}
.paywall h2{margin:0;font-family:var(--f-display)}
.paywall p{margin:0}
.plprice td{padding:8px 0;border-bottom:1px solid var(--line)}
.plprice .pltot td{border-bottom:0;padding-top:10px;font-size:15px}
.plpay{display:grid;gap:6px}
.plpay h4{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.pnl{display:grid;gap:14px}
.pnacts{display:inline-flex;gap:6px;align-items:center;position:relative}
.pnmore summary{list-style:none;cursor:pointer}
.pnmore summary::-webkit-details-marker{display:none}
.pnmenu{position:absolute;right:0;top:calc(100% + 4px);z-index:10;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);display:grid;min-width:170px;padding:4px}
.pnmenu button{border:0;background:none;text-align:left;padding:8px 10px;border-radius:7px;font-size:13px;color:var(--fg);cursor:pointer}
.pnmenu button:hover{background:var(--surface-2)}

/* Panel · demos agendadas */
.pntabs{margin:0 0 14px;align-self:flex-start}
.pnbadge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--bad,#c0392b);color:#fff;font-size:11px;font-weight:700;margin-left:4px}
.demolist{display:grid;gap:10px}
.demoday{margin:12px 0 0;font-size:13px;color:var(--muted)}.demoday::first-letter{text-transform:uppercase}
.demo{display:grid;grid-template-columns:90px 1fr auto;gap:14px;align-items:center;padding:14px 16px}
.demotime b{display:block;font-size:16px}.demotime small,.demoinfo small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}
.demoinfo .opill{margin-left:6px;vertical-align:1px}
.demoacts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.pndays{display:flex;gap:6px;flex-wrap:wrap}
.pnday input{position:absolute;opacity:0;pointer-events:none}
.pnday span{display:inline-block;padding:7px 12px;border:1px solid var(--line);border-radius:999px;cursor:pointer;font-size:13.5px}
.pnday input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.pnday input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:760px){.demo{grid-template-columns:70px 1fr}.demoacts{grid-column:1/-1;justify-content:flex-start}}
.pnper input{width:100%;min-width:64px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);font:inherit}
.pnper td,.pnper th{white-space:nowrap}
.field:has(.pnper){overflow-x:auto}
.shout{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px;font:12px/1.5 ui-monospace,Menlo,monospace;white-space:pre-wrap;word-break:break-word;max-height:420px;overflow:auto;margin:10px 0 0}
.shres{display:grid;gap:6px;margin-top:10px}
.shag{padding:10px 12px;border:1px solid var(--line);border-radius:10px}.shag small{display:block;color:var(--muted);margin-top:2px}
.shsteps{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.shsteps li{position:relative;padding-left:22px;color:var(--muted);font-size:13.5px}
.shsteps li::before{content:"";position:absolute;left:4px;top:5px;width:10px;height:10px;border-radius:50%;border:2px solid var(--line);background:var(--surface)}
.shsteps li.ok{color:var(--fg)}.shsteps li.ok::before{background:var(--ok,#1F8A5B);border-color:var(--ok,#1F8A5B)}

/* ===== Envíos a provincia (Shalom / Olva) ===== */
.env{padding:16px 20px 60px;max-width:1280px}
.envhead{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.envhead .grow{flex:1}
#envtop{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
#envtop:empty{display:none}
.envtot{font-size:13.5px;color:var(--muted)}.envtot b{color:var(--fg);font-family:var(--f-mono)}
#envtop .search{max-width:520px;width:100%}
.pchips .dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.pchips button.rr{border-color:var(--bad);color:var(--bad)}.pchips button.rr.on{background:var(--bad);color:#fff;border-color:var(--bad)}
.pchips button.dv{border-color:var(--bad);color:var(--bad);font-weight:700}.pchips button.dv.on{background:var(--bad);color:#fff}
.ecards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,430px),1fr));gap:12px;align-items:start}
.ecard{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--sc);border-radius:12px;padding:12px 14px;display:flex;gap:10px;min-width:0}
.ecard.rr{border-color:var(--bad);border-left-width:4px;box-shadow:0 0 0 1px color-mix(in srgb,var(--bad) 30%,transparent)}
.ecard.dv{border:2px solid var(--bad);border-left-width:6px;background:color-mix(in srgb,var(--bad-soft) 45%,var(--surface))}
.ecard.rg.old{border-color:var(--warn);background:color-mix(in srgb,var(--warn-soft) 40%,var(--surface))}
.ecmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.ectop{display:flex;align-items:baseline;gap:8px}
.ecname{font-size:15px;min-width:0;overflow:hidden;text-overflow:ellipsis}
.ecdays{margin-left:auto;font-family:var(--f-mono);font-size:12px;color:var(--muted);white-space:nowrap}
.ecsub{font-size:12.5px;color:var(--muted)}
.ecrow{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ecrow select{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:5px 8px;font-size:13px;font-weight:600;max-width:100%}
.ecod,.eord{border:1px solid var(--line);background:var(--surface-2);border-radius:8px;padding:4px 9px;font-family:var(--f-mono);font-size:13px;font-weight:700;letter-spacing:.03em}
.ecod{background:var(--fg);color:var(--surface);border-color:var(--fg);font-size:14px}
.olv{background:var(--t-orange);color:#fff;border-radius:6px;padding:2px 7px;font-size:11px;font-weight:700}
.rvb{background:var(--ok-soft);color:var(--ok);border-radius:10px;padding:1px 7px;font-size:11px;font-weight:700}
.ecsh{font-size:12.5px;background:var(--info-soft);color:var(--info);border-radius:8px;padding:5px 9px}
.ecmoney{display:flex;gap:6px 14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}.ecmoney b{color:var(--fg);font-family:var(--f-mono)}
.ecmoney .sal{margin-left:auto;font-weight:700;color:var(--fg);font-family:var(--f-mono)}
.ecitems{font-size:13px;line-height:1.4;background:var(--surface-2);border-radius:8px;padding:6px 9px}
.wab{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:13px}
.wab a{background:#25d366;color:#fff;text-decoration:none;border-radius:8px;padding:4px 10px;font-weight:700;font-size:12.5px}
.wab input,.dvr input,.dvr select{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:4px 7px;font-size:13px;width:140px}
.cpb{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:3px 8px;font-size:12px;font-weight:600}
.sgw{border:1px solid var(--line);border-radius:10px;padding:7px 9px}
.sgt{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-bottom:6px}.sgt b{color:var(--fg)}
.sgr{display:flex;gap:5px;flex-wrap:wrap}
.sgb{min-width:46px;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:8px;padding:4px 6px;font-size:12px;line-height:1.15;display:flex;flex-direction:column;align-items:center}
.sgb small{font-size:10.5px}
.sgb.on{background:var(--ok);border-color:var(--ok);color:#fff;font-weight:700}
.sgb.nx{border-style:dashed;border-color:var(--accent);color:var(--accent)}
.sgb:disabled{opacity:.35;cursor:default}
.nqb{border:1px solid var(--bad);background:none;color:var(--bad);border-radius:8px;padding:3px 8px;font-size:12px;white-space:nowrap}
.nqb.on{background:var(--bad);color:#fff;font-weight:700}
.nql,.fal{font-size:12px;font-weight:700;color:var(--bad)}
.okc{font-size:12px;font-weight:600;color:var(--ok)}
.rrl,.dvl{font-size:12px;font-weight:700;color:#fff;background:var(--bad);border-radius:6px;padding:4px 8px;align-self:flex-start}
.dvd{border:1px dashed var(--bad);border-radius:10px;padding:8px 10px;font-size:12.5px;display:flex;flex-direction:column;gap:4px}
.dvt{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:700}
.dvs{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:4px}
.dvr{display:flex;align-items:center;gap:8px}.dvr span{width:84px;color:var(--muted);flex:none}.dvr b{flex:1;min-width:0;overflow-wrap:anywhere}
.ecact{display:flex;gap:6px;flex-wrap:wrap}
.ecqr{flex:none;width:76px;height:76px;padding:4px;border:1px solid var(--line);border-radius:8px;background:#fff;align-self:flex-start}
.ecqr svg{width:100%;height:100%;display:block}
.qrbig{background:#fff;border-radius:14px;padding:18px;width:min(86vw,360px);text-align:center;color:#222}.qrbig svg{width:100%;height:auto}
.regpanels{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:12px;margin-bottom:6px}
.regpanels textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px;background:var(--surface);margin-top:8px}
.regrow{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.regrow input,.regrow select{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 8px;max-width:100%}
.regout{margin:8px 0 0;padding-left:0;list-style:none;font-size:13px;display:flex;flex-direction:column;gap:4px}
.regout li.bad{color:var(--warn)}
.regmsg{margin-top:8px;font-size:13px;line-height:1.5}
.kp{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:8px 0}
.kp>div{background:var(--surface-2);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.kp span,.kp small{font-size:12px;color:var(--muted)}.kp b{font-family:var(--f-mono);font-size:16px}
.lst{display:flex;flex-direction:column;margin:8px 0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.lst>div{display:flex;justify-content:space-between;gap:10px;padding:6px 10px;font-size:13px;border-bottom:1px solid var(--line)}.lst>div:last-child{border-bottom:0}
.lst b{font-family:var(--f-mono)}
.tbw{overflow-x:auto;margin:8px 0}
.tb{width:100%;border-collapse:collapse;font-size:12.5px}.tb th,.tb td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}.tb th:first-child,.tb td:first-child{text-align:left}
.env .rcard{margin-bottom:12px}
.repgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:4px 14px}.repgrid h4{margin:10px 0 0;font-size:13px}
.ajgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:12px}
.ajgrid textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px;background:var(--surface)}
.ajprod{border:1px solid var(--line);border-radius:10px;padding:4px 10px 10px;margin:8px 0}
.rcR{border:1px solid var(--line);border-left:4px solid var(--info);border-radius:8px;padding:8px 10px;margin:6px 0;font-size:13px}
.rcR.bad{border-left-color:var(--bad)}
.rcl{display:flex;gap:8px;padding:6px 0;align-items:flex-start}.rcl input{width:20px;height:20px;flex:none}
.rcok{padding:6px 0;color:var(--ok)}
@media (max-width:860px){
  .env{padding:12px 12px 60px}
  .envhead .seg{order:3;width:100%}
  .ecqr{width:60px;height:60px}
  .side{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .side .navbtn{flex:1 0 58px}
}

/* ===== Envíos con la misma cara del artifact «Guías Shalom» ===== */
.env.gs{max-width:660px;margin:0 auto;padding:16px 14px 60px;font-size:15px;line-height:1.4}
.gsh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:20px;margin:0 0 2px;font-family:var(--f-body);font-weight:700}
.grow-sp{flex:1}
.gbtn{font:600 13px var(--f-body);padding:7px 12px;border-radius:999px;border:0;color:#fff;cursor:pointer}
.gbtn.blue{background:#2f6fd0}.gbtn.green{background:#2e8b57}
.gsub{color:var(--muted);font-size:13px;margin-bottom:12px;display:flex;justify-content:space-between;gap:8px}
.gtabs{display:flex;gap:6px;margin-bottom:10px;overflow-x:auto;scrollbar-width:none}.gtabs::-webkit-scrollbar{display:none}
.gtabs .gchip{flex:1 0 auto;text-align:center;padding:9px 12px}
.gs #envtop{gap:0;margin:0}
.gsq{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--fg);font-size:15px;margin-bottom:10px}
.gchips{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:8px;scrollbar-width:none}.gchips::-webkit-scrollbar{display:none}
.gchip{flex:none;border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:99px;padding:6px 11px;font-size:13px;cursor:pointer;white-space:nowrap}
.gchip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.gchip.rch{border-color:#c0392b;color:#c0392b}.gchip.rch.on{background:#c0392b;color:#fff}
.gchip.dch{border-color:#8e1b12;color:#8e1b12;font-weight:700}.gchip.dch.on{background:#8e1b12;color:#fff}
.gcard{background:var(--surface);border:2px solid var(--fc,var(--line));border-left:5px solid var(--sc);border-radius:12px;padding:11px 12px;margin-bottom:9px}
.gcard.rr{border:3px solid #c0392b!important;box-shadow:0 0 0 1px #c0392b33}
.gcard.dv{border:3px solid #8e1b12!important;background:linear-gradient(0deg,rgba(192,57,43,.10),rgba(192,57,43,.10)),var(--surface)}
.gcard.rg{--fc:#d4a20a}.gcard.rg.old{--fc:#c0392b}.gcard.rg.old .gdy{color:#c0392b;font-weight:600}
.gcb{display:flex;gap:10px;align-items:flex-start}.gcl{flex:1;min-width:0}
.gtop{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.gnm{font-weight:600}
.gdy{font-size:12px;color:var(--muted);white-space:nowrap}
.gds{color:var(--muted);font-size:13px;margin:1px 0 8px}
.grow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.grow select{margin-left:auto;padding:7px 8px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--fg);font-size:14px}
.gcod{font:600 15px var(--f-mono);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:3px 8px;color:var(--fg);cursor:pointer}
.gcod:hover{border-color:var(--accent)}
.gord{font:13px var(--f-mono);background:none;border:0;padding:2px 0;cursor:pointer;color:var(--muted);text-decoration:underline dotted}.gord:hover{color:var(--accent)}
.gord2{font:13px var(--f-mono);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:3px 8px;cursor:pointer;color:var(--fg)}
.gmny{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;margin-top:9px;font-size:12px;color:var(--muted)}
.gmny label{display:flex;flex-direction:column;gap:2px}.gmny label.wide{flex:1}
.gmny input{width:88px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);font-size:14px}
.gmny input[type=text]{width:100%}
.gmny select{padding:7px 8px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--fg);font-size:14px;max-width:100%}
.gmny b{color:var(--fg)}
.gsal{margin-left:auto;font-weight:600;font-size:14px;color:var(--fg);padding-bottom:6px}
.gs .wab{margin-top:8px}.gs .wab b{font:600 14px var(--f-mono)}.gs .wab small{color:var(--muted)}
.gpol{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--muted)}
.gpol label{display:flex;flex-direction:column;gap:2px}.gpol b{color:var(--fg);padding-bottom:7px}
.gpol input{width:84px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);font-size:14px}
.gpbs{display:flex;gap:6px;flex-wrap:wrap}
.gpbt{border:1px dashed var(--accent);background:none;color:var(--accent);border-radius:8px;padding:6px 10px;font-size:13px;cursor:pointer;margin-top:9px}
.gpdl{border:0;background:none;color:var(--muted);font-size:16px;cursor:pointer;padding:6px}
.gs .sgw{margin-top:9px}
.gs .dvl,.gs .rrl{display:inline-block;margin-top:8px}
.gs .dvd{margin-top:9px}
.gs .fal,.gs .okc{margin-top:8px}
.gshl{font-size:12.5px;background:var(--info-soft);color:var(--info);border-radius:8px;padding:5px 9px;margin-top:8px;font-weight:400;display:block}
.gact{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.gmini{border:1px solid var(--line);background:var(--bg);color:var(--muted);border-radius:8px;padding:4px 9px;font-size:12px;cursor:pointer}
.grdl{border:1px solid var(--line);background:none;color:var(--muted);border-radius:8px;padding:5px 10px;font-size:12px;cursor:pointer}.grdl:hover{color:#c0392b;border-color:#c0392b}
.grgl{font-size:13px;margin-top:6px}.grgl b{font-weight:600}
.gqr{flex:none;width:76px;height:76px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:3px;cursor:zoom-in}.gqr svg{width:100%;height:100%;display:block}
.gemp{text-align:center;color:var(--muted);padding:30px 0;font-size:14px}
.gta{width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.gline{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:6px}
.gline input,.gline select{padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:14px;max-width:100%}
.gsmall{font-size:12px;color:var(--muted)}
.gmsg{margin-top:6px;font-size:13px;line-height:1.5}
.gs .h3{font-size:12px;color:var(--muted);margin:16px 2px 0;text-transform:uppercase;letter-spacing:.04em}
.gpre input{width:110px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:14px;text-align:right}
.gs .lst>div{align-items:center}
.gs .rcard{border-radius:12px}
.gav{position:fixed;inset:0;z-index:70;background:#7a1f3d;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;gap:12px}
.gav .gi{font-size:60px;line-height:1}.gav h2{margin:0;font-size:28px;line-height:1.15;max-width:420px}.gav p{margin:0;font-size:16px;opacity:.92;max-width:380px}
.gav .gn{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}.gav .gn div{background:rgba(255,255,255,.14);border-radius:14px;padding:12px 16px;min-width:130px}
.gav .gn b{display:block;font-size:32px;line-height:1.05}.gav .gn span{font-size:13px;opacity:.9}
.gav .gb{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap;justify-content:center}.gav button{border:0;border-radius:12px;padding:13px 20px;font-weight:700;font-size:15px;cursor:pointer}
.gav .g1{background:#fff;color:#7a1f3d}.gav .g2b{background:rgba(255,255,255,.16);color:#fff}
.gav .gbar{position:absolute;left:0;bottom:0;height:5px;background:#fff;width:100%}
@media (prefers-reduced-motion:no-preference){.gav .gbar{animation:gbar 6s linear forwards}@keyframes gbar{to{width:0}}}
@media (max-width:860px){.env.gs{padding:12px 12px 60px}}
.gbadges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.gpill{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:#fff;background:var(--pc);border-radius:99px;padding:3px 10px;letter-spacing:.01em}
.gscroll{position:fixed;right:18px;bottom:24px;display:flex;flex-direction:column;gap:8px;z-index:30}
.gscroll button{width:46px;height:46px;border-radius:50%;border:0;background:var(--accent);color:var(--accent-fg);font-size:17px;box-shadow:0 4px 14px rgba(0,0,0,.22);cursor:pointer}
.gscroll button:active{transform:scale(.94)}
@media (max-width:860px){.gscroll{right:12px;bottom:calc(78px + env(safe-area-inset-bottom,0px))}.gscroll button{width:42px;height:42px}}
.pqa{white-space:nowrap}
.pq{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:4px 8px;font-size:12px;font-weight:600;margin-right:4px;cursor:pointer}
.pq.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 40%,var(--line))}.pq.ok:hover{background:var(--ok-soft)}
.pq.warn{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 40%,var(--line))}.pq.warn:hover{background:var(--warn-soft)}
.pq.bad{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,var(--line))}.pq.bad:hover{background:var(--bad-soft)}
/* Chats que esperan que la asesora confirme la compra */
.item.pc{position:relative;background:color-mix(in srgb,#F5C518 14%,var(--surface));box-shadow:inset 4px 0 0 #E0A800}
.item.pc[aria-current="true"]{background:color-mix(in srgb,#F5C518 24%,var(--surface))}
.pcdot{position:absolute;top:9px;left:40px;width:11px;height:11px;border-radius:50%;background:#E5484D;border:2px solid var(--surface);z-index:1}
.pcb{font-size:11px;font-weight:700;color:#8a5a00;background:#FCE9A8;border-radius:10px;padding:1px 7px;white-space:nowrap}
.chip.pcchip[aria-pressed="true"]{background:#E0A800;border-color:#E0A800;color:#1d1400}
.tmsep{margin:6px 8px 2px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.saldopill{border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:99px;padding:5px 11px;font-size:12.5px;font-weight:600;white-space:nowrap;cursor:pointer;margin-right:6px}
.saldopill.warn{background:var(--bad-soft);border-color:var(--bad);color:var(--bad)}
.sdrow{display:flex;gap:12px;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.sdrow label{display:flex;flex-direction:column;gap:3px}.sdrow input{border:1px solid var(--line);border-radius:8px;padding:6px 8px;width:130px;background:var(--surface)}
@media (max-width:860px){.saldopill{font-size:11px;padding:4px 8px;max-width:46vw;overflow:hidden;text-overflow:ellipsis}}

/* Qué vende la tienda: sin variantes → sin tallas ni colores */
body[data-rubro="simple"] .only-ropa{display:none!important}
body[data-rubro="simple"] .pit{grid-template-columns:minmax(0,1fr) 64px auto}
@media (max-width:700px){body[data-rubro="simple"] .pit{grid-template-columns:minmax(0,1fr) 64px auto}body[data-rubro="simple"] .pit [data-it="producto"]{grid-column:auto}}

/* Asistente de inicio */
.asis{position:fixed;inset:0;z-index:60;overflow-y:auto;background:var(--bg);padding:24px 16px 48px}
.asis-box{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.asis-top{display:flex;align-items:center;gap:10px}
.asis-logo{width:34px;height:34px;border-radius:9px;background:#7A1F35;display:grid;place-items:center}
.asis-logo svg{width:24px;height:24px}
.asis-steps{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap}
.asis-steps li{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);padding:5px 10px 5px 5px;border-radius:999px;background:var(--surface);border:1px solid var(--line)}
.asis-steps li span{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--line);font-weight:700;font-size:11px;color:var(--fg)}
.asis-steps li.on{color:var(--fg);border-color:#7A1F35;font-weight:600}
.asis-steps li.on span{background:#7A1F35;color:#fff}
.asis-steps li.done span{background:#2e8b57;color:#fff}
.asis-form{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:14px}
.asis-form h1{margin:0;font-size:22px;line-height:1.25}
.asis-form .sub{margin:-6px 0 4px;color:var(--muted);font-size:14px;line-height:1.5}
.asis-form textarea,.asis-form input[type=text],.asis-form input:not([type]),.asis-form input[inputmode]{width:100%;font:inherit;font-size:14px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:var(--surface);color:var(--fg)}
.asis-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.asis-prices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.asis-money{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}
.asis-money span{padding:0 8px 0 10px;color:var(--muted);font-size:13px}
.asis-money input{border:0!important;padding-left:0!important}
.asis-check{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font-size:13.5px;line-height:1.4;cursor:pointer}
.asis-check input{margin-top:3px;accent-color:#7A1F35}
.asis-nav{display:flex;align-items:center;gap:10px;padding-top:6px;border-top:1px solid var(--line)}
.asis-tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.asis-tl li{display:flex;gap:12px;padding:0 0 16px;position:relative}
.asis-tl li:not(:last-child)::before{content:"";position:absolute;left:17px;top:38px;bottom:2px;width:2px;background:var(--line)}
.asis-ic{flex:0 0 36px;height:36px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,#7A1F35 12%,var(--surface));font-size:17px}
.asis-tl b{font-size:14.5px}
.asis-tl p{margin:3px 0 0;font-size:13.5px;color:var(--muted);line-height:1.45}
.asis-files{display:flex;flex-direction:column;gap:12px}
.asis-file{display:grid;grid-template-columns:200px minmax(0,1fr);gap:14px;padding:12px;border:1px solid var(--line);border-radius:12px;align-items:start}
.asis-file.ok{border-color:#2e8b57;background:color-mix(in srgb,#2e8b57 6%,var(--surface))}
.asis-file figure{margin:0;display:flex;flex-direction:column;gap:4px}
.asis-file figcaption{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600}
.asis-ref,.asis-own{width:100%;max-height:220px;object-fit:contain;border-radius:8px;background:var(--surface-2);display:block}
.asis-ref.none{display:grid;place-items:center;height:110px;font-size:12px;color:var(--muted);border:1px dashed var(--line)}
.asis-ref.aud,.asis-own.aud{display:flex;align-items:center;gap:6px;padding:10px;height:auto}
.asis-ref.aud audio,.asis-own.aud audio{width:100%;min-width:0}
.asis-own{max-width:160px;max-height:120px}
.asis-fi{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.asis-fi b{font-size:14.5px}
.asis-need{font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--line);color:var(--muted)}
.asis-need.req{background:color-mix(in srgb,#7A1F35 14%,var(--surface));color:var(--fg)}
.asis-mine{display:flex;align-items:center;gap:8px;font-size:13px;color:#2e8b57;font-weight:600}
@media (max-width:640px){
  .asis{padding:14px 12px 40px}
  .asis-form{padding:16px}
  .asis-grid{grid-template-columns:1fr}
  .asis-prices{grid-template-columns:repeat(2,minmax(0,1fr))}
  .asis-file{grid-template-columns:1fr}
  .asis-steps li{font-size:0;padding:4px}
  .asis-steps li.on{font-size:12.5px;padding-right:10px}
}
.asis-check input{width:auto!important;flex:0 0 auto;margin-top:3px}
.asis-check span{text-align:left;flex:1}
.asis .link{background:none;border:0;color:var(--muted);text-decoration:underline;cursor:pointer;font:inherit;font-size:13px;padding:0}
.viewpill{border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:999px;padding:5px 11px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.viewpill.on{background:#fff4d6;border-color:#e2b23c;color:#5b4300}
.viewband{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 16px;background:#fff4d6;color:#5b4300;font-size:13px;border-bottom:1px solid #f0d58a}
.viewband button{border:1px solid #e2b23c;background:#fffaf0;color:#5b4300;border-radius:8px;padding:4px 10px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
@media (max-width:640px){.viewpill{padding:5px 8px;font-size:12px}}

/* Carritos abandonados */
.kpage{max-width:900px}
.kbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0 10px}
.kbar input{flex:1 1 200px;border:1px solid var(--line);border-radius:10px;padding:8px 11px;background:var(--surface);color:var(--fg);font:inherit}
.klist{display:flex;flex-direction:column;gap:10px}
.kcard{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.khead,.kfoot{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kitems{font-size:13.5px;line-height:1.5}
.kpill{font-size:12px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--surface-2)}
.kpill.ok{background:color-mix(in srgb,#2e8b57 16%,var(--surface));color:var(--fg)}
.kpill.info{background:color-mix(in srgb,#2f6fd0 14%,var(--surface));color:var(--fg)}
.kpill.warn{background:color-mix(in srgb,#e2b23c 22%,var(--surface));color:var(--fg)}
.send.sm{padding:5px 12px;font-size:12.5px;border-radius:9px}
/* Logo nuevo (laptop + prenda + crecimiento) */
.brand-mark,.ab-mark,.side .brand-mark,.asis-logo{background:#F3E6D9!important;overflow:hidden;padding:0}
.brand-mark img,.ab-mark img,.asis-logo img{width:100%;height:100%;display:block;object-fit:cover}
/* Billetera IA */
.pnstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:14px 0}
.pnstats .card{display:flex;flex-direction:column;gap:4px}
.pnstats b{font-size:22px}
.iacard.low{border-color:#e2b23c}
.iarow{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.iarow>div{display:flex;flex-direction:column;gap:2px}
.iarow b{font-size:17px}
.iarow .iabig{font-size:26px}
.iapill{border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:999px;padding:5px 11px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.iapill.low{background:#fde8e8;border-color:#e57373;color:#8a1c1c}