/* Xamira CRM · identidad TERCO, en dos temas.
   Oscuro: negro y plata, como etiqueta de prenda premium. Claro: papel y grafito, la misma etiqueta impresa en blanco.
   Todo color sale de una variable; el tema lo pone tema.js en <html data-theme>. La lógica vive en app.js.
   Lectura primero: texto base de 16 px, etiquetas en letra normal (sin mayúsculas espaciadas) y contraste alto.
   Movimiento «premium»: una curva (--e), tres duraciones, entradas que suben 10 px. */
:root{
  --bg:#070708;--bg2:#0c0c0e;--surface:#111113;--surface2:#16161a;--soft:#19191d;
  --ink:#f3f2ef;--ink2:#d6d6db;--mute:#a7a7ae;--ph:#80808a;--line:#2a2a30;--line2:#1d1d21;--line3:#3a3a42;--focus:#9a9aa3;
  --accent:#f3f2ef;--accent-ink:#0a0a0b;
  --ok:#62d6a0;--warn:#f2b45a;--bad:#ff7a6d;--ok-hi:#c9f5df;--warn-hi:#ffe2b0;--bad-hi:#ffd0cb;--wa:#3ddc84;
  --silver:linear-gradient(180deg,#ffffff 15%,#c9c9ce 55%,#8f8f96 100%);
  --hi:255 255 255;--edge:#fff;--glow:255 255 255;
  --col:linear-gradient(180deg,#0f0f12,#0a0a0c);--ord:linear-gradient(180deg,#18181c,#131316);
  --glass:rgb(7 7 8/.74);--panel:rgb(12 12 14/.88);
  --amb1:rgb(255 255 255/.075);--amb2:rgb(190 196 210/.06);--grain:.05;
  --sh:0 1px 0 rgb(0 0 0/.6),0 22px 44px -26px rgb(0 0 0/.9);--sh-pop:0 24px 60px -12px rgb(0 0 0/.9);
  --f-d:'Barlow Condensed',system-ui,sans-serif;--f-b:'Inter',system-ui,sans-serif;--f-m:'IBM Plex Mono',ui-monospace,monospace;
  --e:cubic-bezier(.16,1,.3,1);--e-io:cubic-bezier(.4,0,.2,1);--t1:140ms;--t2:280ms;--t3:520ms;--r:12px;
  color-scheme:dark}
/* Claro: papel cálido, tinta grafito y botones como etiqueta negra. */
:root[data-theme="light"]{
  --bg:#f3f2ee;--bg2:#ffffff;--surface:#ffffff;--surface2:#fbfaf7;--soft:#eceae4;
  --ink:#121214;--ink2:#2c2c31;--mute:#55555d;--ph:#76767e;--line:#dcd9d1;--line2:#ebe8e1;--line3:#c4c1b8;--focus:#3a3a40;
  --accent:#121214;--accent-ink:#fbfaf7;
  --ok:#11804c;--warn:#9a5600;--bad:#c4281d;--ok-hi:#1fae6b;--warn-hi:#c27a12;--bad-hi:#e5483c;--wa:#128a43;
  --silver:linear-gradient(180deg,#3a3a40 0%,#18181b 55%,#050506 100%);
  --hi:0 0 0;--edge:rgb(255 255 255/.22);--glow:0 0 0;
  --col:linear-gradient(180deg,#f7f6f2,#efede7);--ord:linear-gradient(180deg,#ffffff,#fbfaf8);
  --glass:rgb(243 242 238/.82);--panel:rgb(251 250 247/.94);
  --amb1:rgb(255 255 255/.9);--amb2:rgb(214 210 198/.35);--grain:.035;
  --sh:0 1px 0 rgb(0 0 0/.03),0 18px 36px -26px rgb(40 34 20/.35);--sh-pop:0 24px 60px -16px rgb(40 34 20/.35);
  color-scheme:light}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{overflow-x:clip;scrollbar-color:var(--line3) transparent;scrollbar-width:thin;-webkit-text-size-adjust:100%}
::selection{background:var(--ink);color:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--f-b);-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01";
  padding:0 16px 48px;padding-bottom:calc(64px + env(safe-area-inset-bottom,0px));overflow-x:clip;min-height:100vh;transition:background var(--t3) var(--e-io),color var(--t2)}
/* Capa ambiental: luz que respira arriba y textura de tela encima de todo. */
body::before{content:"";position:fixed;inset:-25% -10% auto;height:90vh;z-index:-1;pointer-events:none;
  background:radial-gradient(40% 55% at 22% 30%,var(--amb1),transparent 70%),radial-gradient(35% 50% at 82% 10%,var(--amb2),transparent 70%);
  animation:drift 26s var(--e-io) infinite alternate}
body::after{content:"";position:fixed;inset:0;z-index:30;pointer-events:none;opacity:var(--grain);mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes drift{to{transform:translate3d(4%,6%,0) scale(1.08)}}
.wrap{max-width:1240px;margin:0 auto}
h1,h2,h3{font-family:var(--f-d);margin:0;text-wrap:balance;text-transform:uppercase;letter-spacing:.03em;line-height:1.08}
h2{font-size:32px;font-weight:700}
h3{font-size:19px;font-weight:700;letter-spacing:.04em}

/* ── Encabezado: cristal fijo, logo TERCO y pestañas ── */
header{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;padding-block:14px}
#top{position:sticky;top:0;z-index:7;flex-wrap:nowrap;animation:drop var(--t3) var(--e) backwards}
#top::before{content:"";position:absolute;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);z-index:-1;
  background:var(--glass);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);
  border-bottom:1px solid transparent;border-image:linear-gradient(90deg,transparent,var(--line3) 20%,var(--line3) 80%,transparent) 1}
@keyframes drop{from{opacity:0;transform:translateY(-12px)}}
.brand{display:flex;align-items:center;gap:12px;font:700 23px/1 var(--f-d);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.brand .logo{width:48px;height:48px;border-radius:50%;flex:0 0 auto;background:#000;box-shadow:0 0 0 1px var(--line3),0 0 0 4px var(--bg),0 0 0 5px var(--line2),0 10px 24px -8px rgb(var(--glow)/.18);
  transition:transform var(--t3) var(--e),box-shadow var(--t2) var(--e)}
.brand:hover .logo{transform:rotate(-8deg) scale(1.05)}
.brand #biz{background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand small{display:block;margin-top:5px;font:600 12px/1 var(--f-d);color:var(--mute);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
nav{display:flex;gap:2px;flex-wrap:wrap}
nav button{position:relative;background:none;border:0;padding:10px 15px;border-radius:999px;font:600 16px/1 var(--f-d);letter-spacing:.07em;text-transform:uppercase;color:var(--mute);cursor:pointer;
  transition:color var(--t1) var(--e-io),background var(--t2) var(--e)}
nav button:hover{color:var(--ink);background:rgb(var(--hi)/.06)}
nav button[aria-current=true]{background:var(--silver);color:var(--accent-ink);box-shadow:inset 0 1px 0 var(--edge),0 8px 22px -10px rgb(var(--glow)/.45);animation:pop var(--t2) var(--e)}
@keyframes pop{from{transform:scale(.92);opacity:.6}}
header nav{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}

/* ── Controles: letra de 16 px (el celular no hace zoom) y placeholder legible ── */
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{background:var(--bg2);border:1px solid var(--line3);border-radius:10px;padding:10px 14px;min-height:44px;min-width:0;max-width:100%;font-size:16px;
  transition:border-color var(--t1) var(--e-io),box-shadow var(--t2) var(--e),background var(--t2) var(--e)}
input:hover,select:hover,textarea:hover{border-color:var(--focus)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 4px rgb(var(--hi)/.1)}
input::placeholder,textarea::placeholder{color:var(--ph);opacity:1}
input[type=color]{width:64px;height:44px;padding:4px;cursor:pointer}
input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:0;border-radius:6px}
input[type=checkbox],input[type=radio]{padding:0;min-height:0;width:20px;height:20px;accent-color:var(--ink);box-shadow:none}
input[type=file]{padding:8px}
textarea{width:100%;min-height:72px}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.btn{position:relative;overflow:hidden;isolation:isolate;background:rgb(var(--hi)/.03);border:1px solid var(--line3);border-radius:10px;padding:10px 18px;min-height:44px;cursor:pointer;
  font:700 16px/1.1 var(--f-d);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);
  transition:transform var(--t1) var(--e),border-color var(--t1) var(--e-io),background var(--t2) var(--e),box-shadow var(--t2) var(--e)}
.btn:hover{border-color:var(--focus);background:rgb(var(--hi)/.07)}
.btn:active{transform:scale(.97)}
.btn.p{background:var(--silver);color:var(--accent-ink);border-color:transparent;box-shadow:inset 0 1px 0 var(--edge),inset 0 -1px 0 rgb(0 0 0/.25),0 10px 26px -12px rgb(var(--glow)/.5)}
.btn.p:hover{box-shadow:inset 0 1px 0 var(--edge),inset 0 -1px 0 rgb(0 0 0/.25),0 14px 34px -12px rgb(var(--glow)/.6);transform:translateY(-1px)}
.btn.p::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,rgb(255 255 255/.55) 50%,transparent 65%);transform:translateX(-120%)}
.btn.p:hover::after{transform:translateX(120%);transition:transform .75s var(--e)}
.btn.d{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 50%,var(--line))}
.btn.d:hover{background:color-mix(in srgb,var(--bad) 12%,transparent)}
.btn.s{padding:7px 13px;min-height:38px;font-size:15px;border-radius:9px}
.btn:disabled{opacity:.45;cursor:default;transform:none}
.bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-block:22px 16px}
.sp{flex:1}

/* ── Tarjeta «etiqueta»: doble filete y luz cenital ── */
.card{position:relative;background:linear-gradient(180deg,var(--surface2),var(--surface));border:1px solid var(--line);border-radius:var(--r);padding:18px;min-width:0;
  outline:1px solid var(--line2);outline-offset:-6px;box-shadow:inset 0 1px 0 rgb(255 255 255/.045),var(--sh);
  transition:border-color var(--t2) var(--e-io),box-shadow var(--t2) var(--e),background var(--t3)}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
/* Indicadores: cifra grande, etiqueta clara arriba y destello al pasar. */
.kpi{overflow:hidden;padding:18px 18px 16px}
.kpi::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgb(var(--hi)/.07) 48%,transparent 62%);transform:translateX(-100%);pointer-events:none}
.kpi:hover::before{transform:translateX(100%);transition:transform 1s var(--e)}
.kpi:hover{border-color:var(--line3)}
.kpi .v{font:700 42px/1.05 var(--f-d);font-variant-numeric:tabular-nums;letter-spacing:.01em;margin-top:6px;background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:rise var(--t3) var(--e) backwards .12s}
.kpi .v.wn{background-image:linear-gradient(180deg,var(--warn-hi),var(--warn) 70%)}
.kpi .v.pos{background-image:linear-gradient(180deg,var(--ok-hi),var(--ok) 70%)}
.kpi .v.neg{background-image:linear-gradient(180deg,var(--bad-hi),var(--bad) 70%)}
.pos{color:var(--ok)}.neg{color:var(--bad)}.wn{color:var(--warn)}
/* Etiquetas pequeñas: letra normal, 14 px, sin espaciado extra — se leen de un vistazo. */
.kpi .l,.hero .l,.storehead .l,.facts dt{font:600 14px/1.3 var(--f-b);color:var(--mute);letter-spacing:.01em}

/* ── Tablero: columnas como etiquetas de talla ── */
.kan{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px;align-items:flex-start;margin-top:20px;scrollbar-width:thin}
.col{flex:0 0 272px;background:var(--col);border:1px solid var(--line);border-radius:16px;padding:12px;min-height:140px;
  outline:1px dashed var(--line2);outline-offset:-6px;transition:box-shadow var(--t2) var(--e),border-color var(--t2)}
.col.over{border-color:var(--focus);box-shadow:inset 0 0 0 1px var(--focus),0 0 40px -10px rgb(var(--glow)/.25)}
.col h3{display:flex;justify-content:space-between;align-items:center;font-size:17px;letter-spacing:.08em;margin:4px 4px 12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.count{font:700 14px/1 var(--f-d);letter-spacing:.04em;color:var(--accent-ink);background:var(--silver);border-radius:99px;padding:5px 10px;min-width:28px;text-align:center}
.ord{position:relative;background:var(--ord);border:1px solid var(--line);border-radius:12px;padding:13px 14px;margin-bottom:10px;cursor:pointer;
  box-shadow:inset 0 1px 0 rgb(255 255 255/.05),0 10px 20px -16px rgb(0 0 0/.5);transition:transform var(--t2) var(--e),border-color var(--t1),box-shadow var(--t2) var(--e)}
.ord::before{content:"";position:absolute;left:-1px;top:14px;bottom:14px;width:3px;border-radius:2px;background:var(--silver);opacity:0;transition:opacity var(--t2)}
.ord:hover{border-color:var(--line3);box-shadow:inset 0 1px 0 rgb(255 255 255/.07),0 18px 30px -18px rgb(0 0 0/.6)}
.ord:hover::before{opacity:1}
.ord.dragging{opacity:.35;transform:scale(.97) rotate(-1deg)}
.ord-top{display:flex;align-items:flex-start;gap:6px}.ord-top b{flex:1;font:700 18px/1.15 var(--f-d);letter-spacing:.03em;text-transform:uppercase}
.ord-bot{display:flex;align-items:baseline;justify-content:space-between;gap:6px;margin-top:6px}
.amt{font:700 19px var(--f-d);letter-spacing:.02em;font-variant-numeric:tabular-nums;background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.ord .chip{display:inline-block;margin-top:9px}
.ord .m{color:var(--mute);font-size:14px;font-variant-numeric:tabular-nums}
.mv{display:flex;gap:4px;opacity:0;transform:translateX(4px);transition:opacity var(--t1),transform var(--t2) var(--e)}
.ord:hover .mv,.ord:focus-within .mv{opacity:1;transform:none}
@media (hover:none){.mv{opacity:1;transform:none}}
.ic{width:30px;height:30px;border-radius:8px;border:1px solid var(--line3);background:var(--bg2);color:var(--ink2);cursor:pointer;padding:0;line-height:1;font-size:18px;transition:all var(--t1) var(--e-io)}
.ic:hover{color:var(--accent-ink);background:var(--ink);border-color:var(--ink)}
.chip{display:inline-block;font:600 13px/1.5 var(--f-b);letter-spacing:.01em;border-radius:99px;padding:2px 10px;white-space:nowrap;color:var(--mute);
  background:color-mix(in srgb,currentColor 10%,transparent);border:1px solid color-mix(in srgb,currentColor 32%,transparent)}
.chip.wn{color:var(--warn)}.chip.ok{color:var(--ok)}.chip.bad{color:var(--bad)}
.col-empty{border:1px dashed var(--line3);border-radius:12px;padding:22px 14px;text-align:center;color:var(--mute);font:500 14px var(--f-b)}
@keyframes twinkle{50%{opacity:.25;transform:scale(.7)}}
.more{width:100%;background:none;border:0;color:var(--ink2);font:600 14px var(--f-b);padding:10px;cursor:pointer;transition:color var(--t1);text-decoration:underline;text-underline-offset:3px}
.more:hover{color:var(--ink)}

/* ── Cuenta y apariencia ── */
.acct{position:relative}
.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--silver);color:var(--accent-ink);font:700 18px var(--f-d);cursor:pointer;list-style:none;
  box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--line3);transition:transform var(--t2) var(--e),box-shadow var(--t2)}
.avatar:hover{transform:scale(1.06);box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--focus)}
.avatar::-webkit-details-marker{display:none}
.acct-menu{position:absolute;right:0;top:52px;z-index:5;background:linear-gradient(180deg,var(--surface2),var(--surface));border:1px solid var(--line3);border-radius:14px;padding:16px;display:grid;gap:14px;min-width:280px;
  outline:1px solid var(--line2);outline-offset:-6px;box-shadow:var(--sh-pop);transform-origin:top right;animation:menu var(--t2) var(--e)}
.acct-menu .muted{font-size:15px;overflow-wrap:anywhere}
@keyframes menu{from{opacity:0;transform:translateY(-6px) scale(.96)}}
.tema{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--bg2)}
.tema::before{content:"Apariencia";grid-column:1/-1;font:600 14px var(--f-b);color:var(--mute);padding:2px 6px 4px}
.tema button{border:0;border-radius:8px;padding:9px 6px;background:transparent;color:var(--ink2);font:600 14px var(--f-b);cursor:pointer;transition:background var(--t2) var(--e),color var(--t1)}
.tema button:hover{background:rgb(var(--hi)/.06)}
.tema button[aria-pressed=true]{background:var(--silver);color:var(--accent-ink);box-shadow:inset 0 1px 0 var(--edge)}

/* ── Progreso y cifras grandes ── */
.hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:center}
@media (max-width:720px){.hero{grid-template-columns:1fr}}
.big{font:700 42px/1.05 var(--f-d);font-variant-numeric:tabular-nums;margin:4px 0 12px;background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}.big .muted{font:500 17px var(--f-b);-webkit-text-fill-color:var(--mute)}
.prog{height:10px;border-radius:99px;background:var(--bg2);border:1px solid var(--line);overflow:hidden;margin-bottom:8px}
.prog i{display:block;height:100%;background:linear-gradient(90deg,color-mix(in srgb,var(--ok) 70%,#000),var(--ok));border-radius:99px;transform-origin:left;animation:grow 1.1s var(--e) backwards .15s}
@keyframes grow{from{transform:scaleX(0)}}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px;margin:0}
.facts dd{margin:3px 0 0;font:700 21px var(--f-d);letter-spacing:.02em;font-variant-numeric:tabular-nums}

/* ── Xamira: la nave en una burbuja oscura (en los dos temas) y panel de cristal ── */
.xbub{position:fixed;right:22px;bottom:calc(22px + env(safe-area-inset-bottom,0px));width:62px;height:62px;border-radius:50%;border:0;isolation:isolate;
  background:transparent;color:#f3f2ef;font:700 24px/1 var(--f-d);letter-spacing:0;cursor:pointer;z-index:8;
  animation:halo 3.4s var(--e-io) infinite,rise var(--t3) var(--e) backwards .4s;transition:transform var(--t2) var(--e)}
.xbub::before{content:"";position:absolute;inset:0;border-radius:50%;z-index:-2;background:conic-gradient(#fff,#4a4a52,#d9d9de,#26262b,#fff);animation:spin 5s linear infinite}
.xbub::after{content:"";position:absolute;inset:2px;border-radius:50%;z-index:-1;background:radial-gradient(circle at 35% 28%,#26262b,#070708 70%)}
.xbub .ufo-mini{width:46px;margin:2px auto 0;color:#f3f2ef;filter:drop-shadow(0 0 6px rgb(255 255 255/.4))}
.xbub:hover{transform:scale(1.08) rotate(-6deg)}
.xbub:active{transform:scale(.94)}
@keyframes spin{to{transform:rotate(1turn)}}
@keyframes halo{0%{box-shadow:0 12px 30px -8px rgb(0 0 0/.6),0 0 0 0 rgb(var(--glow)/.22)}70%,100%{box-shadow:0 12px 30px -8px rgb(0 0 0/.6),0 0 0 18px rgb(var(--glow)/0)}}
.xpanel{position:fixed;z-index:9;background:var(--panel);-webkit-backdrop-filter:blur(24px) saturate(1.3);backdrop-filter:blur(24px) saturate(1.3);border-left:1px solid var(--line3);display:flex;flex-direction:column;
  top:0;right:0;bottom:0;width:min(460px,100vw);box-shadow:-30px 0 80px -20px rgb(0 0 0/.5);animation:slide .5s var(--e)}
@keyframes slide{from{transform:translateX(40px);opacity:0}}
@media (max-width:640px){.xpanel{top:auto;left:0;height:86vh;width:100vw;border-left:0;border-top:1px solid var(--line3);border-radius:22px 22px 0 0;animation-name:sheet}}
@keyframes sheet{from{transform:translateY(60px);opacity:0}}
.xhead{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}
.xhead b{font:700 24px/1 var(--f-d);letter-spacing:.12em;text-transform:uppercase;background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.xhead b::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--ok);margin-right:10px;vertical-align:.18em;box-shadow:0 0 0 0 var(--ok);animation:live 2s infinite}
@keyframes live{70%,100%{box-shadow:0 0 0 7px transparent}}
.xhead small{display:block;margin-top:5px;color:var(--mute);font:500 14px var(--f-b)}
.xhead .ic{width:38px;height:38px;border-radius:50%;font-size:22px}
.xlog{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px}
.msg{max-width:88%;padding:11px 15px;border-radius:16px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;animation:bubble .4s var(--e) backwards}
.msg.me{align-self:flex-end;background:var(--silver);color:var(--accent-ink);border-bottom-right-radius:5px;transform-origin:bottom right;box-shadow:0 10px 24px -14px rgb(var(--glow)/.4)}
.msg.ai{align-self:flex-start;background:var(--surface2);border:1px solid var(--line);border-bottom-left-radius:5px;transform-origin:bottom left}
/* Widgets de Xamira en el CRM (xamira-widgets.js): toman el tema del CRM, claro u oscuro. */
.msg.ai.xwb{align-self:stretch;max-width:100%;background:none;border:0;padding:0;white-space:normal;--xw-bg:var(--surface2);--xw-ink:var(--ink);--xw-mute:var(--mute);--xw-line:var(--line);--xw-soft:var(--soft);--xw-ok:var(--ok);--xw-ok-bg:rgb(var(--hi)/.06);--xw-warn:var(--warn);--xw-warn-bg:rgb(var(--hi)/.06);--xw-accent:var(--accent);--xw-accent-bg:rgb(var(--hi)/.06);--xw-accent-ink:var(--ink);
  --xw-chip-line:var(--line3);--xw-chip-ink:var(--ink);--xw-chip-p-bg:var(--accent);--xw-chip-p-ink:var(--accent-ink)}
.msg.ai.xwb .xw{border:1px solid var(--line)}.msg.ai.xwb.xwb-chips{align-self:flex-start}
.msg.wait{color:transparent;background-image:linear-gradient(90deg,var(--mute) 30%,var(--ink) 50%,var(--mute) 70%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;border-color:transparent;animation:sheen 1.4s linear infinite}
@keyframes bubble{from{opacity:0;transform:translateY(8px) scale(.94)}}
@keyframes sheen{from{background-position:100% 0}to{background-position:-100% 0}}
.xhint{color:var(--mute);font-size:15px;text-align:center;margin:auto 0}
.xhint::before{content:"✦";display:block;font-size:22px;color:var(--ink);margin-bottom:10px;animation:twinkle 3.2s var(--e-io) infinite}
.xhint button{display:block;margin:8px auto;background:rgb(var(--hi)/.03);border:1px solid var(--line3);border-radius:99px;padding:10px 18px;font-size:15px;color:var(--ink);cursor:pointer;
  transition:all var(--t2) var(--e);animation:rise var(--t3) var(--e) backwards}
.xhint button:nth-of-type(2){animation-delay:60ms}.xhint button:nth-of-type(3){animation-delay:120ms}.xhint button:nth-of-type(4){animation-delay:180ms}
.xhint button:hover{border-color:var(--ink);background:rgb(var(--hi)/.07);transform:translateY(-1px)}
.xform{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
.xform textarea{flex:1;resize:none;min-height:46px;max-height:160px;border-radius:14px}
.keybox{font:500 14px var(--f-m);background:var(--bg2);border:1px dashed var(--line3);border-radius:8px;padding:10px;overflow-wrap:anywhere;margin:8px 0}
a.btn{text-decoration:none;color:inherit;display:inline-block}
a.btn.p{color:var(--accent-ink)}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left;text-transform:inherit;letter-spacing:inherit;transition:color var(--t1)}
.linkbtn:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ── Tienda dentro del cliente ── */
.storehead{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.storehead>div:first-child{flex:1;min-width:220px}.storehead h3{font-size:28px}
.pgrid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.pcard{transition:transform var(--t2) var(--e),border-color var(--t2)}
.pcard:hover{transform:translateY(-3px);border-color:var(--line3)}
.pcard .pimg{aspect-ratio:4/5;border-radius:8px;background:var(--soft);overflow:hidden;margin-bottom:12px}
.pcard .pimg img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--e)}
.pcard:hover .pimg img{transform:scale(1.05)}
.imgpick{display:grid;gap:6px;justify-items:start}
.imgpick img,.imgpick .ph{width:96px;height:96px;object-fit:cover;border-radius:10px;background:var(--soft)}
.matrix th,.matrix td{text-align:center;padding:6px}.matrix tbody th{text-align:left}
.lines{list-style:none;margin:8px 0 0;padding:0}
.lines li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.lines li:last-child{border-bottom:0}
.grid.k4{grid-template-columns:repeat(4,1fr)}
@media (max-width:820px){.grid.k4{grid-template-columns:repeat(2,1fr)}.kpi .v{font-size:34px}}

/* ── Tablas ── */
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums;font-size:15px}
th,td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{font:600 14px var(--f-b);color:var(--mute);letter-spacing:.01em}
tbody tr{transition:background var(--t1)}
tr.click{cursor:pointer}tr.click:hover{background:rgb(var(--hi)/.04)}
tr.click:hover>td:first-child{box-shadow:inset 3px 0 0 var(--ink)}
tbody tr:last-child>td{border-bottom:0}
td.n,th.n{text-align:right}
td.wrap{white-space:normal;min-width:240px}
.pill{display:inline-block;padding:2px 11px;border-radius:99px;font:600 13px/1.6 var(--f-b);letter-spacing:.01em;color:var(--ink2);
  background:color-mix(in srgb,currentColor 9%,transparent);border:1px solid color-mix(in srgb,currentColor 30%,transparent)}
.pill.ok{color:var(--ok)}.pill.bad{color:var(--bad)}.pill.wn{color:var(--warn)}

/* ── Formularios: etiqueta clara encima de cada campo ── */
.form{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.form label{display:grid;gap:6px;font:600 14px/1.35 var(--f-b);color:var(--ink2)}
.form label input,.form label select,.form label textarea{font:400 16px var(--f-b);color:var(--ink)}
.form .full{grid-column:1/-1}
.two{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
@media (max-width:420px){.two{grid-template-columns:1fr}}

/* ── Reportes: barras que crecen ── */
.hb{display:grid;grid-template-columns:130px 1fr 100px;gap:10px;align-items:center;margin-block:8px;font-size:15px}
.hb .t{background:var(--bg2);border:1px solid var(--line);border-radius:4px;height:16px;overflow:hidden}
.hb .t i{display:block;height:100%;background:var(--silver);border-radius:3px;transform-origin:left;animation:grow 1s var(--e) backwards}
.hb:nth-child(2) .t i{animation-delay:50ms}.hb:nth-child(3) .t i{animation-delay:100ms}.hb:nth-child(4) .t i{animation-delay:150ms}.hb:nth-child(5) .t i{animation-delay:200ms}.hb:nth-child(n+6) .t i{animation-delay:250ms}
.muted{color:var(--mute)}
.empty{padding:32px;text-align:center;color:var(--mute)}
#main>.empty:only-child{font:600 15px var(--f-d);letter-spacing:.24em;text-transform:uppercase;background:linear-gradient(90deg,var(--mute) 30%,var(--ink) 50%,var(--mute) 70%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 1.4s linear infinite}
.card.empty h3{margin-bottom:8px}
.al{padding:11px 13px;border-radius:8px;background:var(--soft);margin-block:6px;border:1px solid var(--line)}
.al.bad{border-left:4px solid var(--bad)}.al.wn{border-left:4px solid var(--warn)}
.tabs{display:flex;gap:4px;margin-block:10px;flex-wrap:wrap;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--bg2);width:fit-content;max-width:100%}
.tabs button{padding:9px 15px;border:0;background:transparent;border-radius:8px;cursor:pointer;color:var(--ink2);font:700 15px var(--f-d);letter-spacing:.06em;text-transform:uppercase;transition:color var(--t1),background var(--t2) var(--e)}
.tabs button:hover{color:var(--ink);background:rgb(var(--hi)/.05)}
.tabs button[aria-current=true]{background:var(--silver);color:var(--accent-ink);box-shadow:inset 0 1px 0 var(--edge)}
.toast{position:fixed;left:16px;right:16px;bottom:calc(20px + env(safe-area-inset-bottom,0px));max-width:460px;margin:auto;background:var(--silver);color:var(--accent-ink);padding:14px 18px;border-radius:12px;z-index:31;
  font-size:16px;font-weight:600;box-shadow:0 20px 50px -12px rgb(0 0 0/.5),0 0 0 1px rgb(var(--glow)/.3);animation:toast .5s var(--e)}
@keyframes toast{from{opacity:0;transform:translateY(16px) scale(.96)}}
.notes{white-space:pre-wrap;color:var(--mute);margin-top:8px}

/* ── Entrada: «el arrebatamiento». La nave se llevó a quien lo traía puesto; solo queda el jersey flotando en el haz.
   Se ve mientras no hay sesión (el encabezado está oculto) y también como pantalla de carga. ── */
.abduct{display:none;position:relative;margin:0 auto 14px;width:min(340px,78vw);padding-top:clamp(24px,6vh,56px);pointer-events:none;color:#ececef}
:root[data-theme="light"] .abduct{color:#1c1c20}
#top[hidden]~.abduct{display:block}
.ufo{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 18px 40px rgb(var(--glow)/.14))}
.ufo *{transform-box:fill-box;transform-origin:center}
/* Llegada: la nave baja, el haz se enciende de arriba abajo y al final aparece el jersey. */
.u-nave-in{animation:llega 1s var(--e) backwards}
.u-haz{transform-origin:top;animation:beamIn 1.1s var(--e) backwards .45s,flicker 3.8s var(--e-io) infinite 1.6s}
.u-rayo{transform-origin:top;animation:beamIn .9s var(--e) backwards .35s}
.u-rem{animation:aparece .8s var(--e) backwards .8s,viento 3.2s var(--e-io) infinite 1.6s}
.u-rem-r{animation-delay:.9s,1.9s;--giro:-1}
.u-prenda{animation:aparece 1.2s var(--e) backwards 1s,levitate 5.6s var(--e-io) infinite 2.2s}
/* Vida: la nave flota, las luces corren en secuencia, las líneas de velocidad laten y suben motas por el haz. */
.u-nave{animation:hover 4.6s var(--e-io) infinite 1s}
.u-luz{animation:luz 1.8s var(--e-io) infinite}
.u-luz:nth-of-type(2){animation-delay:.3s}.u-luz:nth-of-type(3){animation-delay:.6s}
.u-vel-l{animation:vel 2.4s var(--e-io) infinite;--dx:-5px}
.u-vel-r{animation:vel 2.4s var(--e-io) infinite;--dx:5px}
.u-motas circle{opacity:0;animation:mota 3.6s var(--e-io) infinite}
.u-motas circle:nth-child(2){animation-delay:.7s}.u-motas circle:nth-child(3){animation-delay:1.4s}.u-motas circle:nth-child(4){animation-delay:2.1s}.u-motas circle:nth-child(5){animation-delay:2.8s}
@keyframes llega{from{opacity:0;transform:translateY(-40px) scale(.94)}}
@keyframes aparece{from{opacity:0;transform:translateY(10px) scale(.9)}}
@keyframes hover{50%{transform:translateY(-6px) rotate(-1.2deg)}}
@keyframes beamIn{from{transform:scaleY(0);opacity:0}}
@keyframes flicker{0%,100%{opacity:1}48%{opacity:.78}52%{opacity:.95}}
@keyframes luz{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes vel{50%{transform:translateX(var(--dx));opacity:.45}}
@keyframes viento{50%{transform:rotate(calc(var(--giro,1) * 8deg)) scale(.92)}}
@keyframes levitate{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-12px) rotate(4deg)}}
@keyframes mota{0%{opacity:0;transform:translateY(0)}20%{opacity:.9}100%{opacity:0;transform:translateY(-80px)}}
.login{max-width:440px;margin:0 auto;text-align:center;padding:30px 28px 26px!important;animation:rise .8s var(--e) backwards .5s}
.login::before{content:"";display:block;height:62px;margin:0 auto 16px;background:url(/brand/terco-logo.svg) center/contain no-repeat}
:root[data-theme="light"] .login::before{filter:invert(1)}
.login h1{font-size:42px;letter-spacing:.3em;margin:0 0 6px .15em;background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.login h1::after{content:"— ✦ —";display:block;font-size:12px;letter-spacing:.5em;color:var(--mute);-webkit-text-fill-color:var(--mute);margin-top:10px}
.login p{font:500 16px/1.45 var(--f-b)}
#top[hidden]~main>.empty:only-child{padding-top:8px}
#top[hidden]~main .login{border-top-color:var(--focus);box-shadow:inset 0 1px 0 rgb(255 255 255/.12),0 -40px 70px -50px rgb(var(--glow)/.5),var(--sh)}
dialog{border:1px solid var(--line3);border-radius:16px;background:linear-gradient(180deg,var(--surface2),var(--surface));color:var(--ink);max-width:min(480px,calc(100vw - 32px));padding:24px;font-size:17px;
  outline:1px solid var(--line2);outline-offset:-7px;box-shadow:var(--sh-pop)}
dialog[open]{animation:dlg .4s var(--e)}
@keyframes dlg{from{opacity:0;transform:translateY(12px) scale(.96)}}
dialog::backdrop{background:rgb(0 0 0/.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

/* ── Coreografía de entrada: cada vista sube en cascada (≤ 300 ms en total) ── */
@keyframes rise{from{opacity:0;transform:translateY(10px)}}
#main>*{animation:rise var(--t3) var(--e) backwards}
#main>:nth-child(2){animation-delay:40ms}#main>:nth-child(3){animation-delay:80ms}#main>:nth-child(4){animation-delay:120ms}#main>:nth-child(5){animation-delay:160ms}#main>:nth-child(n+6){animation-delay:200ms}
.grid.k4>.kpi{animation:rise var(--t3) var(--e) backwards}
.grid.k4>.kpi:nth-child(2){animation-delay:50ms}.grid.k4>.kpi:nth-child(3){animation-delay:100ms}.grid.k4>.kpi:nth-child(4){animation-delay:150ms}
.kan>.col{animation:rise var(--t3) var(--e) backwards}
.kan>.col:nth-child(2){animation-delay:40ms}.kan>.col:nth-child(3){animation-delay:80ms}.kan>.col:nth-child(4){animation-delay:120ms}.kan>.col:nth-child(5){animation-delay:160ms}.kan>.col:nth-child(n+6){animation-delay:200ms}
.col>.ord{animation:rise .45s var(--e) backwards .18s}
.nueva{animation:rise .45s var(--e) backwards .1s}

/* Cuadrícula del pedido del club (el «Formato» de Drive). */
fieldset.comision{margin-top:12px;display:grid;gap:8px;font-size:15px;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
fieldset.comision legend{font:700 15px var(--f-d);letter-spacing:.08em;text-transform:uppercase;padding:0 6px}
.formato tr.ok td{background:color-mix(in srgb,var(--ok) 8%,transparent)}
.formato tfoot td{border-top:1px solid var(--line3);padding-top:8px}
.formato input[type=checkbox]{width:20px;height:20px;accent-color:var(--ink)}
.unirlist{display:grid;gap:8px;max-height:340px;overflow:auto;padding:4px 0;font-size:15px}
.formato .ic{border:0;background:none;color:var(--mute);font-size:20px;cursor:pointer}
/* Renglones quitados: plegados, tachados y con su motivo; se restauran con un clic. */
.anuladas{margin-top:10px;font-size:15px}
.anuladas summary{cursor:pointer;color:var(--mute);font-weight:600;padding:6px 0}
.anuladas .anul{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:8px 0;border-top:1px solid var(--line)}
.anuladas s,.anulp s{color:var(--mute)}
tr.anulp td{color:var(--mute)}
/* Propuesta de diseño en la tarjeta: frente, espalda y portada. */
.propimgs{display:grid;grid-template-columns:repeat(3,minmax(0,160px));gap:14px}
.propslot{display:grid;gap:6px;font:600 14px var(--f-b);color:var(--mute);text-align:center;cursor:pointer}
.propslot img,.propslot .ph{aspect-ratio:1/1;width:100%;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:var(--soft);transition:transform var(--t2) var(--e),border-color var(--t2)}
.propslot .ph{display:grid;place-items:center;font-size:28px;color:var(--mute);border-style:dashed}
.propslot:hover img,.propslot:hover .ph{border-color:var(--ink);transform:translateY(-2px)}
/* Formato compacto: una pieza por renglón sin desperdiciar alto. */
.formato table{font-size:15px}
.formato th,.formato td{padding:7px 9px;white-space:nowrap}
.formato td b{font-weight:600}
.formato th:first-child,.formato td:first-child{width:1%;color:var(--mute)}
.formato .linkbtn{font-size:14px;text-decoration:underline;background:none;border:0;cursor:pointer}
details.mas{margin-top:14px;border:1px solid var(--line);border-radius:12px;padding:12px 16px;background:var(--bg2);transition:border-color var(--t2)}
details.mas[open]{border-color:var(--line3)}
details.mas summary{cursor:pointer;font:700 17px var(--f-d);letter-spacing:.06em;text-transform:uppercase}
details.mas[open] summary{margin-bottom:10px}
details.mas[open]>:not(summary){animation:rise var(--t2) var(--e) backwards}
/* Solicitudes nuevas de las tiendas, en el Dashboard. */
.nuevas{margin-top:14px}.nuevas.vacia{padding:14px 18px;display:flex;align-items:center;gap:10px}
.nuevas.vacia::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px var(--ok)}
.nueva{display:flex;gap:12px;align-items:center;padding:13px 0;border-top:1px solid var(--line)}
.nueva .q{flex:1;min-width:0}.nueva .q b{font:700 18px var(--f-d);letter-spacing:.04em;text-transform:uppercase}
.nueva .acc{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.btn.wa{color:var(--wa);border-color:color-mix(in srgb,var(--wa) 45%,var(--line))}
.btn.wa:hover{background:color-mix(in srgb,var(--wa) 12%,transparent)}
@media (max-width:640px){.nueva{flex-direction:column;align-items:stretch}.nueva .acc{justify-content:flex-start}}
.fotoslot{display:grid;gap:4px;justify-items:center}.fotoslot .propslot{width:100%}
.nueva .idea{margin:6px 0;white-space:pre-wrap;font-size:16px;padding-left:10px;border-left:3px solid var(--line3)}
.nueva .refs{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.nueva .refs img{width:60px;height:60px;object-fit:cover;border-radius:8px;display:block;border:1px solid var(--line);transition:transform var(--t2) var(--e)}
.nueva .refs a:hover img{transform:scale(1.08) rotate(-2deg)}
/* Fotos del producto de la tienda: casillas chicas; la vacía se lee como «subir», no como botón de acción. */
.fotos{display:flex;flex-wrap:wrap;gap:12px;margin:6px 0 4px}
.foto{display:grid;gap:4px;justify-items:center;width:84px}
.foto small{font-size:13px;color:var(--mute);text-align:center;line-height:1.25}
.foto .tile{position:relative;width:84px;height:84px;border-radius:10px;overflow:hidden}
.foto .tile img{width:100%;height:100%;object-fit:cover;display:block;border:1px solid var(--line);border-radius:10px}
.foto .vacia{display:grid;place-content:center;justify-items:center;gap:2px;border:1.5px dashed var(--line3);color:var(--mute);font-size:13px;cursor:pointer;background:transparent;transition:all var(--t2) var(--e)}
.foto .vacia span{font-size:18px;line-height:1}
.foto .vacia:hover,.foto .vacia:focus-within{border-color:var(--ink);color:var(--ink);background:rgb(var(--hi)/.04)}
.foto .rm{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;border:0;background:rgb(0 0 0/.7);color:#fff;font-size:15px;line-height:1;cursor:pointer;padding:0}

/* ── Celular ── */
@media (max-width:640px){
  body{padding-inline:14px}
  header{flex-wrap:wrap;gap:10px 12px;padding-block:10px}
  #top{flex-wrap:wrap}
  header nav{order:3;width:calc(100% + 28px);margin-inline:-14px;padding-inline:14px}
  .brand{font-size:20px}.brand .logo{width:40px;height:40px}
  h2{font-size:27px}
  .kpi{padding:16px 14px 14px}.kpi .v,.big{font-size:29px;overflow-wrap:anywhere}
  .bar{margin-block:18px 12px}
  .bar input{flex:1 1 100%}
  .kan{scroll-snap-type:x mandatory;margin-inline:-14px;padding-inline:14px;scroll-padding-inline:14px}.col{flex-basis:84vw;scroll-snap-align:start}
  .xbub{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:56px;height:56px}
  .login{margin-top:6vh}.login h1{font-size:38px}
}
@media print{header,nav,.bar button,.bar a,.tabs,.xbub,.storehead,.grid.k4{display:none!important}
  body{background:#fff;color:#000}body::before,body::after{display:none}
  .card{background:#fff;box-shadow:none;outline:0;border-color:#ccc}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ── Radiografía: control de calidad antes de mandar a producir ── */
.rxbtn{display:flex;align-items:center;gap:8px;width:100%;margin-top:10px;padding:8px 10px;border-radius:9px;border:1px dashed var(--line3);background:transparent;color:var(--mute);
  font:600 14px var(--f-b);text-align:left;cursor:pointer;transition:border-color var(--t1),background var(--t2) var(--e),color var(--t1)}
.rxbtn::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:currentColor}
.rxbtn:hover{border-color:var(--focus);color:var(--ink);background:rgb(var(--hi)/.05)}
.rxbtn.rx-por_revisar{color:var(--warn);border-style:solid;border-color:color-mix(in srgb,var(--warn) 45%,var(--line))}
.rxbtn.rx-autorizada{color:var(--ok);border-style:solid;border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
.rxbtn.rx-por_revisar::before{animation:live 2s infinite;box-shadow:0 0 0 0 currentColor}
.rx{border-color:var(--line3);scroll-margin-top:96px}
@media (max-width:640px){.rx{scroll-margin-top:130px}}
.rxl{list-style:none;margin:0;padding:0}
.rxc{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.rxc:first-child{border-top:0}
.rxc i{flex:0 0 auto;width:10px;height:10px;margin-top:6px;border-radius:50%}
.rxc.falla i{background:var(--bad);box-shadow:0 0 10px var(--bad)}.rxc.alerta i{background:var(--warn)}.rxc.ok i{background:var(--ok)}
.rxc b{font-weight:600}
.rxok{margin:0;color:var(--ok);font-weight:600}
.form label.chk{display:flex;align-items:center;gap:10px;font:500 16px var(--f-b);color:var(--ink);cursor:pointer}
.rxbtn.rx-pedida{color:var(--ink2);border-style:solid}
.rxbtn.rx-pedida::before{animation:live 1.6s infinite;box-shadow:0 0 0 0 currentColor}
.formato{scroll-margin-top:96px}
/* Veredicto arriba: una frase que dice si está lista y qué falta. */
.rxv{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.rxv .sello{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font:700 22px/1 var(--f-b);color:var(--bg)}
.rxv.ok .sello{background:var(--ok)}.rxv.wn .sello{background:var(--warn)}.rxv.bad .sello{background:var(--bad)}
.rxt{font:700 24px/1.15 var(--f-d);letter-spacing:.02em;text-transform:uppercase}
.rxv.ok .rxt{color:var(--ok)}.rxv.wn .rxt{color:var(--warn)}.rxv.bad .rxt{color:var(--bad)}
.rxres{margin:0 0 14px;padding:12px 14px;border-left:3px solid var(--ink);background:rgb(var(--hi)/.03);border-radius:0;white-space:pre-wrap}
.rxres .muted{display:block;font-size:13px;margin-bottom:2px}
.rxlab{font:600 14px var(--f-b);color:var(--mute);margin:16px 0 8px}
.rxp{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid var(--line3);border-radius:10px;margin-bottom:8px}
.rxp.alerta{border-color:color-mix(in srgb,var(--warn) 50%,var(--line))}.rxp.falla{border-color:color-mix(in srgb,var(--bad) 55%,var(--line));background:color-mix(in srgb,var(--bad) 5%,transparent)}
.rxp b{font-weight:600;font-size:16px}.rxp .btn{flex:0 0 auto}
.rxmal{border:1px solid color-mix(in srgb,var(--bad) 55%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--bad) 5%,transparent)}
.rxmal td.wrap{min-width:200px}
.rxx{display:flex;gap:12px;align-items:center;padding:12px 14px;border:1px dashed var(--line3);border-radius:10px}
.rxx>div{flex:1}.rxx b{font-weight:600;font-size:16px}
.rxx .dot{flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--mute)}
.rxx .dot.vivo{background:var(--ok);box-shadow:0 0 0 0 var(--ok);animation:live 1.6s infinite}
.rxbien{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.rxbien summary{cursor:pointer;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;list-style:none}
.rxbien summary::-webkit-details-marker{display:none}
.rxbien summary>span:first-child{color:var(--ok);font-weight:600}
.rxbien summary>span:first-child::before{content:"✓ ";}
@media (max-width:640px){.rxp,.rxx{flex-direction:column;align-items:stretch}.rxt{font-size:21px}}
.rxbtn.rx-detenido{color:var(--bad);border-style:solid;border-color:color-mix(in srgb,var(--bad) 50%,var(--line))}
.rx .al{margin-bottom:12px}

/* ── Hoja de control de calidad visual (radiografía de Xamira) ──
   Orden: franja del veredicto, datos clave, archivos con miniatura, conteo pieza por pieza, asimetría, evidencias,
   revisiones con pastilla, «Por confirmar» y botones. Números tabulares; las miniaturas van sobre blanco porque son lienzos. */
.rx{--rxacc:#8fb3ff;font-variant-numeric:tabular-nums}
:root[data-theme="light"] .rx{--rxacc:#2456c4}
.rxv{padding:14px 16px;border-radius:12px;border:1px solid var(--line3);align-items:flex-start}
.rxv .sello{margin-top:2px}
.rxv>div{min-width:0}
.rxv.ok{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 9%,transparent)}
.rxv.wn{border-color:color-mix(in srgb,var(--warn) 50%,var(--line));background:color-mix(in srgb,var(--warn) 10%,transparent)}
.rxv.bad{border-color:color-mix(in srgb,var(--bad) 55%,var(--line));background:color-mix(in srgb,var(--bad) 10%,transparent)}
.rxv .rxt{overflow-wrap:anywhere}
.rxsub{font-weight:500;margin-top:4px;color:var(--ink)}
.rxv a{color:inherit;font-weight:600;text-underline-offset:3px}
.rxnota{margin:4px 0;font-weight:600;color:var(--ink);white-space:pre-wrap}
.rxdatos{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px 20px;margin:0 0 4px;padding:4px 0 14px;border-bottom:1px solid var(--line)}
.rxdatos dt{font-size:13px;color:var(--mute)}
.rxdatos dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.rxdatos dd .muted{font-weight:400}
.rxarch{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.rxarch figure,.rxevid figure{margin:0;display:grid;gap:8px;align-content:start;min-width:0}
.rxarch figcaption,.rxevid figcaption{font-size:15px;min-width:0}
.rxzm{display:block;width:100%;padding:0;border:1px solid var(--line3);border-radius:10px;background:#fff;cursor:zoom-in;overflow:hidden;transition:border-color var(--t1),transform var(--t2) var(--e)}
.rxzm:hover{border-color:var(--focus)}
.rxzm:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.rxzm img{display:block;width:100%;height:auto}
.rxarch .rxzm img{max-height:440px;object-fit:contain}
.rxevid .rxzm img{max-height:260px;object-fit:contain}
.rxzm.vacio{display:grid;place-items:center;aspect-ratio:3/4;color:var(--mute);background:var(--soft);cursor:default;font-size:14px}
.rx .mono{font:500 13px/1.45 var(--f-m);overflow-wrap:anywhere;color:var(--ink2);margin-top:2px}
.rxevid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}
details.rxsec>summary{cursor:pointer;list-style:none}
details.rxsec>summary::-webkit-details-marker{display:none}
details.rxsec>summary::after{content:"";display:inline-block;width:7px;height:7px;margin-left:10px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(-45deg);transition:transform .2s;vertical-align:.12em}
details.rxsec[open]>summary::after{transform:rotate(45deg)}
.rxconteo td{white-space:normal;vertical-align:top}
.rxconteo td:nth-child(3){min-width:150px}
.rxconteo tr.mal td{background:color-mix(in srgb,var(--bad) 7%,transparent)}
.rxprob{color:var(--bad);font-size:14px;margin-top:2px}
.rxconteo td.rxarchc{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rxconteo .c-linea{display:none}
.rx h4{margin:0;font:700 19px/1.2 var(--f-d);letter-spacing:.05em;text-transform:uppercase}
.rxasim{margin-top:18px;border:2px solid var(--rxacc);border-radius:12px;padding:14px 16px;display:grid;gap:10px}
.rxasim h4{color:var(--rxacc)}
.rxasim p{margin:0;white-space:pre-line}
.rxcks{list-style:none;margin:0;padding:0}
.rxck{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line)}
.rxck:first-child{border-top:0}
.rxck>div{flex:1;min-width:0}
.rxck b{font-weight:600}
.rxck .pill{flex:0 0 auto;min-width:58px;text-align:center;margin-top:1px}
.rxck .btn{flex:0 0 auto}
.rxbien .rxcks{margin-top:6px}
.rxbien summary>span:first-child::before{content:none}
.rxdec{margin-top:18px;border-radius:12px;padding:14px 16px;background:color-mix(in srgb,var(--warn) 10%,transparent);border:1px solid color-mix(in srgb,var(--warn) 40%,var(--line));display:grid;gap:8px}
.rxdec h4{color:var(--warn)}
.rxdec ul{margin:0;padding-left:1.15rem;display:grid;gap:8px}
.rxacc{margin-top:18px}
dialog.rxzoom{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;outline:0;background:rgb(0 0 0/.94);color:#fff;box-shadow:none}
dialog.rxzoom::backdrop{background:rgb(0 0 0/.6)}
.rxzoom figure{margin:0;height:100%;display:grid;grid-template-rows:1fr auto;overflow:auto;overscroll-behavior:contain}
.rxzoom img{display:block;max-width:100%;max-height:calc(100dvh - 56px);margin:auto;object-fit:contain;background:#fff;cursor:zoom-in}
.rxzoom img.grande{max-height:none;width:100%;cursor:zoom-out}
.rxzoom figcaption{padding:12px 64px;text-align:center;font:500 14px var(--f-m);overflow-wrap:anywhere}
.rxzoom .rxzx{position:fixed;top:max(12px,env(safe-area-inset-top,0px));right:12px;z-index:2;background:rgb(0 0 0/.6);color:#fff;border-color:rgb(255 255 255/.4)}
@media (max-width:640px){
  .rxdatos{grid-template-columns:1fr 1fr}
  .rxarch{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.rxarch .rxzm img{max-height:240px}
  .rxarch .mono{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px}
  .rxarch figcaption,.rxevid figcaption{font-size:14px}
  .rxconteo thead{display:none}
  .rxconteo tr{display:grid;grid-template-columns:22px 1fr auto;gap:0 10px;align-items:start;padding:10px 4px;border-bottom:1px solid var(--line)}
  .rxconteo td{padding:0;border:0}
  .rxconteo td.c-dato{display:none}
  .rxconteo td.c-n{color:var(--mute)}
  .rxconteo .c-linea{display:block;font-size:14px;margin-top:2px}
  .rxconteo tr.mal td{background:none}.rxconteo tr.mal{background:color-mix(in srgb,var(--bad) 7%,transparent);border-radius:8px}
  .rxevid{grid-template-columns:1fr 1fr;gap:10px}.rxevid .rxzm img{max-height:160px}
  .rxv{padding:12px 14px;gap:12px}.rxv .sello{width:32px;height:32px;font-size:18px}
  .rxck{flex-wrap:wrap}.rxck .btn{width:100%}
  .rxacc{flex-wrap:wrap}.rxacc .sp{display:none}.rxacc .btn{flex:1 1 100%}.rxacc .btn.p{order:3}
  .rxzoom figcaption{padding:12px 16px 20px}
}

/* ── Archivado: columna plegada al final del tablero ── */
.col.arch.plegada{flex:0 0 64px;min-height:220px;display:flex;flex-direction:column;align-items:center;gap:14px;padding:14px 0;cursor:pointer;color:var(--mute);font:inherit;text-align:center;transition:border-color var(--t2),color var(--t1),background var(--t2) var(--e)}
.col.arch.plegada:hover{border-color:var(--focus);color:var(--ink);background:rgb(var(--hi)/.04)}
.col.arch .vlab{writing-mode:vertical-rl;transform:rotate(180deg);font:700 16px var(--f-d);letter-spacing:.14em;text-transform:uppercase}
.col.arch{opacity:.92}
.ord.archivada{cursor:pointer;opacity:.85}.ord.archivada:hover{opacity:1}
.ord.archivada .more{width:auto;padding:6px 0 0;margin-left:8px;display:inline}
.ord .mv .ic svg{display:block;margin:auto}
.archf{display:grid;gap:12px;min-width:min(380px,80vw)}
.archf .chk{display:flex;gap:10px;align-items:center;font-size:16px;cursor:pointer}
.archf .nota{display:grid;gap:6px;font:600 14px var(--f-b);color:var(--ink2)}
.archf .bar{margin:6px 0 0}

/* Liga al sitio comercial desde el CRM */
#nav .sitio-link{margin-left:auto;align-self:center;white-space:nowrap;font:600 13px var(--f-b,inherit);color:var(--ok,#8ee6a2);text-decoration:none;padding:8px 12px;border:1px solid var(--line,#2a2a2e);border-radius:999px}#nav .sitio-link:hover{background:rgba(255,255,255,.06)}

/* Avisos: campanita con contador y lista */
.avisos{position:relative}
.campana{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid var(--line,#2a2a2e);background:transparent;color:inherit;display:grid;place-content:center;cursor:pointer}
.campana .cnt{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#e4002b;color:#fff;font:700 11px/20px var(--f-b,inherit);text-align:center}
.campana.suena{animation:campana .8s ease-in-out 2}@keyframes campana{0%,100%{transform:rotate(0)}20%{transform:rotate(14deg)}40%{transform:rotate(-12deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}
.av-menu{position:absolute;right:0;top:48px;width:min(360px,calc(100vw - 24px));max-height:70vh;overflow:auto;z-index:20;background:var(--surface);color:var(--ink);border:1px solid var(--line3);border-radius:18px;box-shadow:var(--sh-pop,0 24px 60px rgba(0,0,0,.45))}
@media (max-width:640px){.av-menu{position:fixed;left:12px;right:12px;top:calc(68px + env(safe-area-inset-top,0px));width:auto;max-height:calc(100dvh - 90px)}}
.av-cab{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line,#2a2a2e)}
.av-item{display:grid;gap:2px;padding:12px 14px;border-bottom:1px solid var(--line,#2a2a2e);cursor:pointer;text-align:left;width:100%;background:none;border-left:3px solid transparent;color:inherit;font:inherit}
.av-item:hover{background:var(--soft)}.av-item.nuevo{border-left-color:#e4002b}.av-item b{font-size:14px}.av-item span{font-size:13px;opacity:.75}.av-item small{font-size:11px;opacity:.55}
.av-vacio{padding:18px 14px;opacity:.7;font-size:14px}
.av-pie{padding:12px 14px;display:grid;gap:8px}.av-pie p{margin:0;font-size:12px;opacity:.7}

/* Conversaciones de Xamira en el sitio */
#convlista{display:grid;gap:6px;margin-top:10px}
.conv{border:1px solid var(--line,#2a2a2e);border-radius:14px;padding:0 12px}
.conv summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;padding:10px 0;align-items:center}
.conv-f{font-size:12px;opacity:.7;white-space:nowrap}.conv-q{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-r{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap}
.conv-t{padding:4px 0 12px;display:grid;gap:6px;font-size:14px}.conv-t p{margin:0}.conv-t b{margin-right:6px}
.cv-x{padding-left:10px;border-left:3px solid #e4002b}.cv-h{font-size:12px;opacity:.75}.cv-h code{font-size:11px;word-break:break-all}.cv-s{font-style:italic;opacity:.7}
@media (max-width:640px){.conv summary{grid-template-columns:1fr}}

/* Envío en la tarjeta del pedido */
.envdir{line-height:1.45}.envtar{display:grid;gap:6px;margin-top:10px}.envtar>div{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line,#2a2a2e);border-radius:12px;flex-wrap:wrap}
.envguia{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding:12px;border-radius:14px;background:rgba(142,230,162,.08);border:1px solid rgba(142,230,162,.3)}
.envtar>div.elegida{border-color:#8ee6a2}
/* Secciones plegables de la tarjeta del pedido */
details.plegable>summary{list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;margin:0}details.plegable>summary::-webkit-details-marker{display:none}details.plegable>summary h3{margin:0}details.plegable>summary .muted{flex:1;font-size:13px}
details.plegable>summary .chev{width:9px;height:9px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(-45deg);transition:transform .2s;margin-right:4px}details.plegable[open]>summary .chev{transform:rotate(45deg)}
details.plegable[open]>summary{margin-bottom:10px}
.two{align-items:start}

/* ── Taller de costura: solo tablero y Formato, celular primero ── */
.tl-tabs{display:flex;gap:6px;margin:18px 0 14px;padding:4px;border:1px solid var(--line);border-radius:14px;background:var(--col)}
.tl-tabs button{flex:1;min-height:48px;border:0;border-radius:10px;background:none;color:var(--mute);cursor:pointer;font:700 16px/1 var(--f-d);letter-spacing:.06em;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;gap:8px;transition:color var(--t1),background var(--t2) var(--e)}
.tl-tabs button span{font:600 13px/1 var(--f-b);letter-spacing:0;color:inherit;opacity:.8}
.tl-tabs button[aria-selected=true]{background:var(--silver);color:var(--accent-ink);box-shadow:inset 0 1px 0 var(--edge)}
.tl-board{display:grid;gap:14px}
.tl-col{display:none}.tl-col.on{display:block}
.tl-col h3{display:none}
.tl-ord{display:block;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;background:var(--ord);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:10px;
  min-height:72px;box-shadow:var(--sh);transition:border-color var(--t2),transform var(--t1) var(--e)}
.tl-ord:hover{border-color:var(--line3)}.tl-ord:active{transform:scale(.99)}
.tl-ord b{display:block;font:700 21px/1.15 var(--f-d);letter-spacing:.03em;text-transform:uppercase}
.tl-ord span{display:block;margin-top:4px;color:var(--mute);font-size:15px}
.tl-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:18px 0 10px}
.tl-name{font-size:32px;margin-bottom:14px;overflow-wrap:anywhere}
.tl-res{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.tl-res .chip b{color:var(--ink)}
.tl-filas{list-style:none;margin:0;padding:0}
.tl-filas li{display:flex;gap:14px;padding:12px 2px;border-top:1px solid var(--line2)}
.tl-filas .q{flex:0 0 auto;min-width:28px;font:700 22px/1.1 var(--f-d);font-variant-numeric:tabular-nums;text-align:right}
.tl-campos{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:2px}.tl-campos i{font-style:normal;color:var(--mute);font-size:13px}.tl-campos b{font-size:17px}
.tl-back{margin:16px 2px 0;font-size:15px}
.tl-cta{position:sticky;bottom:0;z-index:5;margin:16px -14px 0;padding:22px 14px calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,var(--bg) 20px)}
.tl-cta .btn{width:100%;min-height:54px;font-size:19px}
@media (min-width:900px){
  .tl-tabs{display:none}
  .tl-board{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:22px;align-items:start}
  .tl-col{display:block;background:var(--col);border:1px solid var(--line);border-radius:16px;padding:12px}
  .tl-col h3{display:flex;justify-content:space-between;font-size:17px;letter-spacing:.08em;margin:4px 4px 12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
  .tl-name,.tl-head,.tl-fmt,.tl-back,.tl-cta{max-width:760px;margin-inline:auto}
  .tl-cta{position:static;background:none;padding:0;margin-top:18px}
  .tl-cta .btn{width:auto;float:right;padding-inline:28px}
}
.tl-pz b{font:700 20px/1 var(--f-d);letter-spacing:.04em;margin-right:4px}
.tl-tabs{overflow-x:auto;scrollbar-width:none}.tl-tabs::-webkit-scrollbar{display:none}
.tl-tabs button{flex:1 0 auto;padding-inline:10px}
@media (max-width:420px){.tl-tabs{gap:2px}.tl-tabs button{font-size:13px;letter-spacing:.03em;gap:4px;padding-inline:6px}}
.tl-pdf{margin-left:4px}

/* Encabezado a prueba de nombres largos: el nombre del negocio se recorta con «…» y la campana y la cuenta
   nunca se salen de la pantalla, sin importar qué negocio se registre. */
.brand{min-width:0;flex:0 1 auto}
.brand>div{min-width:0}
.brand #biz{display:block;overflow:hidden;text-overflow:ellipsis;max-width:min(42vw,420px);padding-block:2px}
.brand small{overflow:hidden;text-overflow:ellipsis}
#top>.avisos,#top>.acct{flex:0 0 auto}
.acct-menu{max-width:calc(100vw - 28px)}
@media (max-width:640px){
  .brand{flex:1 1 0}
  .brand #biz{max-width:100%}
  #top>.sp{display:none}
}

/* ── Configuración: menú de secciones a la izquierda (arriba en el celular) y una sección a la vez ── */
.cfg{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;align-items:start;margin-top:26px}
.cfg-nav{position:sticky;top:96px;display:grid;gap:4px}
.cfg-nav h2{font-size:30px;margin:0 0 14px 12px}
.cfg-nav button{display:grid;gap:2px;text-align:left;background:none;border:1px solid transparent;border-radius:12px;padding:11px 14px;cursor:pointer;color:var(--ink);
  transition:background var(--t2) var(--e),border-color var(--t1)}
.cfg-nav button b{font:700 17px/1.1 var(--f-d);letter-spacing:.06em;text-transform:uppercase}
.cfg-nav button span{font-size:13px;color:var(--mute)}
.cfg-nav button:hover{background:rgb(var(--hi)/.05)}
.cfg-nav button[aria-current]{background:var(--surface);border-color:var(--line3);box-shadow:inset 3px 0 0 var(--ink),var(--sh)}
.cfg-body{min-width:0;max-width:820px}
.cfg-sec>h2{font-size:34px;margin:4px 0 16px}
.cfg-sec{animation:rise var(--t3) var(--e) backwards}
.cfg-card{background:linear-gradient(180deg,var(--surface2),var(--surface));border:1px solid var(--line);border-radius:16px;padding:6px 22px;margin-bottom:16px;box-shadow:inset 0 1px 0 rgb(255 255 255/.04),var(--sh)}
.cfg-row{display:flex;align-items:center;gap:18px 24px;padding:18px 0;border-bottom:1px solid var(--line2)}
.cfg-row:last-child{border-bottom:0}
.cfg-row>div:first-child{flex:1;display:grid;gap:3px;min-width:0}
.cfg-row b{font:600 16px/1.3 var(--f-b)}
.cfg-row span{font-size:14px;color:var(--mute);line-height:1.4}
.cfg-row>input,.cfg-row>select{flex:0 1 340px;width:100%}
.cfg-row.apilada{flex-direction:column;align-items:stretch}
.cfg-row.apilada>input{flex:none}
.cfg-acts{display:flex;gap:8px;flex-wrap:wrap}
.cfg-tiempos{display:grid;gap:8px;margin-top:4px}.cfg-fase{display:grid;grid-template-columns:minmax(0,1fr) 72px 72px;gap:8px;align-items:center}.cfg-fase input[type=number]{min-width:0}
.cfg-fase .cfg-cliente{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--mute)}.cfg-fase .cfg-cliente input{width:auto;margin:0}
@media (min-width:640px){.cfg-fase{grid-template-columns:minmax(0,1fr) 80px 80px auto}.cfg-fase .cfg-cliente{grid-column:auto}}
.cfg-etapas{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:2px 0 0;padding:0;counter-reset:et}
.cfg-etapas li{counter-increment:et;display:flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;border:1px solid var(--line3);border-radius:99px;font:600 14px var(--f-b)}
.cfg-etapas li::before{content:counter(et);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--silver);color:var(--accent-ink);font:700 12px var(--f-b)}
.cfg-foot{display:flex;justify-content:flex-end;padding:16px 0 18px;border-top:1px solid var(--line2);margin-top:4px}
.cfg-lead{margin:18px 0 6px;color:var(--ink2);font-size:15px;line-height:1.5}
.cfg-h{margin:22px 0 4px;font-size:19px}
.cfg-note{margin:0 0 18px;font-size:14px;color:var(--mute);line-height:1.5}
.cfg-people{list-style:none;margin:0;padding:6px 0 0}
.cfg-people li{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line2)}
.cfg-av{flex:0 0 40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--silver);color:var(--accent-ink);font:700 18px var(--f-d)}
.cfg-who{flex:1;min-width:0;display:grid}
.cfg-who b{font:600 16px/1.3 var(--f-b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cfg-who span{font-size:14px;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pill.tl{color:var(--warn)}
.cfg-x{flex:0 0 36px;height:36px;border-radius:50%;font-size:22px;color:var(--mute)}
button.cfg-x:hover{color:var(--bad);background:color-mix(in srgb,var(--bad) 12%,transparent)}
.cfg-add{display:flex;gap:10px;padding:18px 0 14px}
.cfg-add input{flex:1;min-width:0}
.cfg-log{list-style:none;margin:0;padding:0 0 12px;max-height:420px;overflow:auto}
.cfg-log li{display:grid;grid-template-columns:90px minmax(0,1fr) auto;gap:12px;padding:9px 0;border-bottom:1px solid var(--line2);font-size:14px;align-items:center}
.cfg-log time{color:var(--mute)}.cfg-log span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cfg-log code{font:500 12px var(--f-m);color:var(--ink2);background:rgb(var(--hi)/.05);border-radius:6px;padding:2px 7px}
/* Formularios largos (envíos, agentes) dentro de la tarjeta: grupos con título y casillas como interruptores. */
.cfg-card .form{padding:6px 0 4px}
.cfg-card .form>b.full{font:700 15px var(--f-d);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);padding-top:12px;border-top:1px solid var(--line2);margin-top:4px}
.cfg-card .form>b.full:first-child{border-top:0;margin-top:0;padding-top:4px}
.cfg-card label.chk input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:0 0 44px;width:44px;height:26px;border-radius:99px;background:var(--line3);position:relative;cursor:pointer;transition:background var(--t2) var(--e)}
.cfg-card label.chk input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--bg2);box-shadow:0 1px 3px rgb(0 0 0/.35);transition:transform var(--t2) var(--e)}
.cfg-card label.chk input[type=checkbox]:checked{background:var(--ok)}
.cfg-card label.chk input[type=checkbox]:checked::after{transform:translateX(18px)}
.cfg-card #convlista{padding-bottom:12px}
.cfg-card .keybox{margin:8px 0}
@media (max-width:860px){
  .cfg{grid-template-columns:1fr;gap:6px;margin-top:14px}
  .cfg-nav{position:static;display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;margin-inline:-14px;padding:8px 14px;background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  .cfg-nav::-webkit-scrollbar{display:none}
  .cfg-nav h2{display:none}
  .cfg-nav button{flex:0 0 auto;padding:9px 14px;border:1px solid var(--line3);border-radius:99px}
  .cfg-nav button span{display:none}
  .cfg-nav button[aria-current]{background:var(--silver);color:var(--accent-ink);box-shadow:none;border-color:transparent}
  .cfg-sec>h2{font-size:28px;margin:12px 0 12px}
  .cfg-card{padding:4px 16px}
  .cfg-row{flex-direction:column;align-items:stretch;gap:10px}
  .cfg-row>input,.cfg-row>select{flex:none}
  .cfg-add{flex-wrap:wrap}.cfg-add input{flex:1 1 100%}.cfg-add select{flex:1}
  .cfg-log li{grid-template-columns:72px minmax(0,1fr)}.cfg-log code{grid-column:2}
}

/* ── Bienvenida de un negocio nuevo ── */
.bv{max-width:760px;margin:28px auto 0;animation:rise var(--t3) var(--e) backwards}
.bv-hero{text-align:center;padding:30px 12px 26px}
.bv-tag{display:inline-block;font:700 14px var(--f-d);letter-spacing:.2em;text-transform:uppercase;color:var(--mute);border:1px solid var(--line3);border-radius:99px;padding:6px 16px}
.bv h1{font-size:clamp(46px,11vw,92px);line-height:.95;margin:18px 0 12px;letter-spacing:.02em}
.bv h1 span{background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.bv-precio{font-size:18px;color:var(--ink2);margin:0}.bv-precio b{color:var(--ink)}
.bv-pasos{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:12px}
.bv-paso{display:flex;gap:18px;background:linear-gradient(180deg,var(--surface2),var(--surface));border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:var(--sh)}
.bv-n{flex:0 0 38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--silver);color:var(--accent-ink);font:700 20px var(--f-d)}
.bv-paso b{font:700 21px/1.15 var(--f-d);letter-spacing:.04em;text-transform:uppercase}
.bv-paso p{margin:6px 0 10px;color:var(--ink2);font-size:15px;line-height:1.55}
.bv-cta{display:flex;justify-content:center;padding:26px 0 10px}
.bv-cta .btn{min-height:56px;padding-inline:40px;font-size:19px}
.prueba{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 14px;padding:12px 16px;border:1px solid var(--line3);border-radius:14px;background:rgb(var(--hi)/.03)}
.prueba-d{font:600 15px var(--f-b)}.prueba-d b{font:700 22px var(--f-d)}
@media (max-width:640px){.bv{margin-top:8px}.bv-paso{padding:16px;gap:14px}.bv-cta .btn{width:100%}}
/* Taller: encabezado del Formato con aire; el PDF es la acción, en rojo TERCO; el resumen por talla, aparte. */
.tl-fhead{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line2)}
.tl-fhead h3{margin:0 0 4px}.tl-fhead .muted{font-size:15px}
.tl-pdf{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;background:#e4002b;color:#fff;text-decoration:none;
  font:700 16px/1 var(--f-d);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 10px 24px -12px rgb(228 0 43/.7);transition:transform var(--t1) var(--e),filter var(--t1)}
.tl-pdf:hover{filter:brightness(1.08);transform:translateY(-1px)}
.tl-resb{padding:14px 0 6px}
.tl-lab{display:block;font:700 13px var(--f-d);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.tl-res{gap:8px;margin-bottom:6px}
.tl-res .chip{font-size:13.5px;padding:4px 12px}
@media (max-width:640px){.tl-pdf{width:100%;justify-content:center}}

/* ── Suscripción, anuncio de Jarvix y niveles de Xamira ── */
.prueba-d.ok{color:var(--ok)}.prueba-d.wn{color:var(--warn)}
.bv-sub{margin:14px 0 0}.bv-sub .linkbtn{font:600 15px var(--f-b);text-decoration:underline;text-underline-offset:4px}
.bv-ok{margin:12px 0 0;color:var(--ok);font-weight:600}
.jarvix{position:relative;overflow:hidden;display:flex;align-items:center;gap:20px 28px;flex-wrap:wrap;margin:0 0 14px;padding:22px 24px;border-radius:18px;color:#f6f5f2;
  background:radial-gradient(120% 140% at 100% 0%,rgb(228 0 43/.38),transparent 55%),linear-gradient(135deg,#141418,#09090b);border:1px solid rgb(255 255 255/.12);box-shadow:var(--sh)}
.jx-txt{flex:1 1 360px;min-width:0}
.jx-tag{display:inline-block;font:700 12px var(--f-d);letter-spacing:.18em;text-transform:uppercase;color:#ff9aa9;margin-bottom:8px}
.jarvix h3{font-size:26px;margin:0 0 6px;color:#fff}
.jarvix p{margin:0 0 12px;color:#d9d8de;font-size:15px;line-height:1.5;max-width:640px}
.jx-niv{display:flex;flex-wrap:wrap;gap:6px 16px;list-style:none;margin:0;padding:0;font-size:14px;color:#9b9ba3}.jx-niv li.si{color:#8fe6b0}
.jx-cta{flex:0 0 auto;display:inline-flex;align-items:center;min-height:50px;padding:0 26px;border-radius:12px;background:#e4002b;color:#fff;text-decoration:none;
  font:700 17px var(--f-d);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 12px 28px -12px rgb(228 0 43/.8);transition:transform var(--t1) var(--e),filter var(--t1)}
.jx-cta:hover{filter:brightness(1.08);transform:translateY(-1px)}
@media (max-width:640px){.jarvix{padding:18px}.jarvix h3{font-size:22px}.jx-cta{width:100%;justify-content:center}}
.niveles{list-style:none;margin:0;padding:6px 0}
.niveles li{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line2)}.niveles li:last-child{border-bottom:0}
.niveles li>div{flex:1;display:grid;gap:3px;min-width:0}.niveles b{font:600 16px var(--f-b)}.niveles span{font-size:14px;color:var(--mute);line-height:1.45}
.nv-ok{flex:0 0 30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line3);color:var(--mute);font-weight:700}
.niveles li.si .nv-ok{background:var(--ok);border-color:transparent;color:#06150d}
@media (max-width:640px){.niveles li{flex-wrap:wrap}.niveles li>div{flex:1 1 calc(100% - 44px)}.niveles li .btn{margin-left:44px}}
/* Aviso esencial: falta la clave de Anthropic */
.esencial{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;margin:0 0 14px;padding:16px 18px;border-radius:14px;border:1px solid color-mix(in srgb,var(--warn) 55%,var(--line));
  background:color-mix(in srgb,var(--warn) 10%,var(--surface))}
.esencial>div{flex:1 1 300px;display:grid;gap:4px}.esencial b{font:700 19px var(--f-d);letter-spacing:.04em;text-transform:uppercase;color:var(--warn)}
.esencial span{font-size:15px;color:var(--ink2);line-height:1.45}
.es-ic{flex:0 0 34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--warn);color:#1a1205;font:800 20px var(--f-d)}
@media (max-width:640px){.esencial .btn{width:100%}}
.nav-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--warn);margin-left:6px;vertical-align:super;box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 25%,transparent)}
.cfg-card.falta{border-color:color-mix(in srgb,var(--warn) 50%,var(--line))}
.clave-pasos{margin:0 0 4px;padding-left:20px;display:grid;gap:6px;font-size:15px;color:var(--ink2)}.clave-pasos a{color:var(--ink);text-underline-offset:3px}
.pill.ok{color:var(--ok)}.pill.wn{color:var(--warn)}
/* Gasto de Xamira en el mes */
.gasto{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:flex-end;padding:16px 0 4px;border-top:1px solid var(--line2)}
.gasto>div{display:grid;gap:2px}.g-l{font-size:13px;color:var(--mute)}
.gasto b{font:700 30px/1.05 var(--f-d);font-variant-numeric:tabular-nums}.gasto b small{font:600 13px var(--f-b);color:var(--mute)}
.gasto p{flex:1 1 100%;margin:0;font-size:13px}.gasto a{color:inherit}
/* Organizadores de la tienda */
.orgs{margin-bottom:14px}
.org-l{list-style:none;margin:0;padding:0}
.org-l li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line2)}
.org-l li>div{flex:1;min-width:0;display:grid}.org-l li>div span{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.org-av{flex:0 0 34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--silver);color:var(--accent-ink);font:700 16px var(--f-d)}
.org-add{display:flex;flex-wrap:wrap;gap:8px;padding-top:12px}.org-add input[type=email]{flex:2 1 220px}.org-add input[name=nombre]{flex:1 1 140px}

/* Testimonios del sitio (Configuración) */
.tm-filtros{display:flex;gap:6px;flex-wrap:wrap;padding:12px 0 4px}.tm-filtros .chip{cursor:pointer;border:1px solid var(--line2);background:none}.tm-filtros .chip.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.tm-lista{list-style:none;margin:0;padding:8px 0 10px;display:grid;gap:10px}
.tm-it{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:12px;border:1px solid var(--line2);border-radius:14px;background:var(--surface);transition:border-color var(--t2) var(--e),box-shadow var(--t2) var(--e)}.tm-it.si{border-color:var(--ok);box-shadow:inset 3px 0 0 var(--ok)}
.tm-it>img,.tm-sinfoto{width:96px;height:96px;border-radius:10px;object-fit:cover;background:var(--surface2)}.tm-sinfoto{display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--mute)}
.tm-info{display:grid;gap:4px;min-width:0}.tm-meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--mute)}.tm-meta>b{font:700 18px var(--f-d);color:var(--ink)}
.tm-autor{font:600 15px var(--f-b)}.tm-info p{margin:0;font-size:14px;line-height:1.4;color:var(--ink2)}.tm-coms{font-size:13px}.tm-coms b{font-weight:600;color:var(--ink)}
.tm-acts{display:flex;gap:8px 12px;flex-wrap:wrap;align-items:center;margin-top:6px}.tm-acts .chk{font-size:14px;font-weight:600}.tm-acts select,.tm-acts input{min-height:34px;padding:4px 10px;font-size:14px}.tm-acts input{flex:1 1 180px}
@media (max-width:600px){.tm-it{grid-template-columns:72px 1fr}.tm-it>img,.tm-sinfoto{width:72px;height:72px}}

/* Propuestas express (Xamira): tres imágenes por tarjeta, cifras y su prospecto. */
.px-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.px-card{padding:0;overflow:hidden;display:grid}.px-imgs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px;background:#000}.px-imgs img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}.px-imgs a{display:block}.px-ph{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--muted);background:var(--card2,#f3f3f3);text-transform:capitalize}
.px-b{padding:12px 14px 14px;display:grid;gap:8px}.px-club{font:700 20px var(--f-d);letter-spacing:.04em;text-transform:uppercase}
.px-cifras{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px}.px-cifras .ok{color:var(--ok,#1e9e4a);font-weight:600}.px-cifras .bad{color:var(--bad,#c0392b);font-weight:600}
.px-cant{width:84px;padding:7px 10px;border-radius:10px;border:1px solid var(--line);font:inherit}

/* Columna Leads del tablero: prospectos que aún no son pedido. */
.col.leads{background:color-mix(in srgb,var(--col) 70%,var(--accent,#e4002b) 6%)}.ord.lead{cursor:default}.ord.lead .ord-top{align-items:center;gap:8px}.ord.lead .ord-top .chip{white-space:nowrap}
.ord.lead .acc{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.lead-refs{display:flex;gap:4px;margin-top:8px}.lead-refs img{width:56px;height:56px;object-fit:cover;border-radius:8px;background:#fff}