:root{
  --ink:#131A26; --ink-2:#1E2836;
  --paper:#F4F6F3; --surface:#fff; --line:#E3E7E2; --line-2:#EDF0EC;
  --text:#131A26; --muted:#6B7684; --faint:#9AA3AE;
  --signal:#E8590C; --signal-bg:#FEF2E9; --signal-line:#F7C9A6;
  --transit:#2563EB; --transit-bg:#EDF2FE; --transit-line:#C5D8FB;
  --ok:#0E7C5A; --ok-bg:#E6F4EF; --ok-line:#BCE0D2;
  --danger:#C92A2A; --danger-bg:#FCEDED; --danger-line:#F0C2C2;
  --gold:#946200; --gold-bg:#FFF8E6; --gold-line:#F2DFA8;
  --violet:#6D3FD4; --violet-bg:#F1ECFC; --violet-line:#D6C7F5;
  --r:10px; --r-sm:7px;
  --fd:'Archivo',system-ui,sans-serif; --fu:'Inter',system-ui,sans-serif; --fm:'JetBrains Mono',ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--fu);background:var(--paper);color:var(--text);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
.mono{font-family:var(--fm);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.num{font-variant-numeric:tabular-nums}
svg.i{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
svg.i.sm{width:13px;height:13px}
svg.i.lg{width:20px;height:20px}
:focus-visible{outline:2px solid var(--transit);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.app{display:flex;min-height:100vh}
.nav{width:214px;flex-shrink:0;background:var(--ink);color:#fff;padding:16px 0;position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column}
.brand{padding:0 16px 16px;display:flex;align-items:center;gap:9px;border-bottom:1px solid rgba(255,255,255,.09)}
.brand .mark{width:30px;height:30px;border-radius:8px;background:var(--signal);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.brand .bn{font-family:var(--fd);font-weight:800;font-size:14px;letter-spacing:-.02em;line-height:1.1}
.brand .bs{font-size:9.5px;color:rgba(255,255,255,.4);letter-spacing:.09em;text-transform:uppercase;font-weight:600}
.ng{padding:13px 12px 3px}
.ng span{font-size:9.5px;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.3);font-weight:700;padding-left:8px}
.nav a{display:flex;align-items:center;gap:9px;padding:7.5px 10px;margin:1px 12px;border-radius:var(--r-sm);color:rgba(255,255,255,.66);font-size:13px;font-weight:500;text-decoration:none;transition:.12s}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav a.on{background:rgba(255,255,255,.11);color:#fff;font-weight:600}
.nav a .cnt{margin-left:auto;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:20px;background:rgba(255,255,255,.14);font-variant-numeric:tabular-nums}
.nav a .cnt.al{background:var(--signal);color:#fff}
.nav-cta{display:flex;align-items:center;justify-content:center;gap:6px;width:calc(100% - 24px);margin:13px 12px 2px;height:33px;border-radius:8px;background:var(--signal);color:#fff;font-size:13px;font-weight:600;letter-spacing:-.01em;transition:.12s}
.nav-cta svg{width:14px;height:14px;stroke-width:2.4}
.nav-cta:hover{background:#F26414}
.nav-cta:active{background:#D14E08}

/* configuración desplegable */
.cfg{position:relative;margin-bottom:10px}
.cfg-b{display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;border-radius:var(--r-sm);color:rgba(255,255,255,.66);font-size:13px;font-weight:500;transition:.12s}
.cfg-b:hover{background:rgba(255,255,255,.06);color:#fff}
.cfg.on .cfg-b{background:rgba(255,255,255,.11);color:#fff}
.cfg-cv{margin-left:auto;transition:transform .15s}
.cfg.on .cfg-cv{transform:rotate(180deg)}
.cfg-pop{position:absolute;bottom:calc(100% + 5px);left:0;right:0;background:var(--ink-2);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:5px;box-shadow:0 -8px 24px rgba(0,0,0,.4);display:none}
.cfg.on .cfg-pop{display:block}
.cfg-pop a{display:flex;align-items:center;gap:9px;padding:8px 10px;margin:0;border-radius:6px;color:rgba(255,255,255,.75);font-size:12.5px;font-weight:500;text-decoration:none}
.cfg-pop a:hover{background:rgba(255,255,255,.1);color:#fff}
.nf{margin-top:auto;padding:12px 16px 0;border-top:1px solid rgba(255,255,255,.09)}
.plan{background:rgba(255,255,255,.06);border-radius:var(--r-sm);padding:9px 10px;font-size:11px}
.plan b{display:block;font-size:12px;margin-bottom:1px}
.plan span{color:rgba(255,255,255,.5)}

.stage{flex:1;min-width:0}
.screen{display:none}.screen.on{display:block}
.top{background:var(--surface);border-bottom:1px solid var(--line);padding:13px 22px;display:flex;align-items:center;gap:13px;position:sticky;top:0;z-index:20}
.top h1{font-family:var(--fd);font-size:19px;font-weight:700;letter-spacing:-.02em}
.top .sub{font-size:12px;color:var(--muted);margin-top:1px}
.top .rt{margin-left:auto;display:flex;align-items:center;gap:8px}
.sync{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);background:var(--paper);padding:5px 10px;border-radius:20px;border:1px solid var(--line)}
.dot{width:6px;height:6px;border-radius:50%;background:var(--ok);flex-shrink:0}
.dot.p{animation:p 2s ease-in-out infinite}@keyframes p{0%,100%{opacity:1}50%{opacity:.35}}
.body{padding:18px 22px 60px}

.ctl{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-sm);font-size:13px;font-weight:500;transition:.12s;white-space:nowrap}
.ctl:hover{border-color:#C9D0C7;background:#FBFCFA}
.ctl.fill{background:var(--ink);color:#fff;border-color:var(--ink)}.ctl.fill:hover{background:var(--ink-2)}
.ctl.sig{background:var(--signal);color:#fff;border-color:var(--signal)}.ctl.sig:hover{filter:brightness(1.06)}
.ctl.wa{background:#25D366;color:#fff;border-color:#25D366}.ctl.wa:hover{filter:brightness(1.05)}
.ctl.sm{height:28px;padding:0 9px;font-size:12px}
.ctl.icon{padding:0;width:34px;justify-content:center}.ctl.icon.sm{width:28px}
.ctl.dang{color:var(--danger);border-color:var(--danger-line)}.ctl.dang:hover{background:var(--danger-bg)}
.qty{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:24px;padding:0 7px;border-radius:6px;background:var(--paper);border:1px solid var(--line);font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.tbl tr.more{cursor:default}
.tbl tr.more:hover{background:none}
.tbl tr.more td{text-align:center;padding:12px}
.ctl.print-cta{background:var(--ink);color:#fff;border-color:var(--ink);height:38px;padding:0 18px;font-size:14px;font-weight:600}
.ctl.print-cta:hover{background:var(--ink-2);border-color:var(--ink-2)}
.ctl:disabled{opacity:.42;cursor:not-allowed}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--surface)}
.seg button{padding:0 13px;height:34px;font-size:13px;font-weight:500;color:var(--muted);border-right:1px solid var(--line)}
.seg button:last-child{border-right:none}
.seg button.on{background:var(--ink);color:#fff;font-weight:600}
.srch{display:flex;align-items:center;gap:7px;height:34px;padding:0 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);min-width:220px;color:var(--faint)}
.srch input{border:none;outline:none;background:none;flex:1;font-size:13px;color:var(--text);min-width:0}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.ch{padding:12px 15px;border-bottom:1px solid var(--line-2);display:flex;align-items:center;gap:10px}
.ch h3{font-size:13.5px;font-weight:700;letter-spacing:-.01em}
.ch .hint{font-size:11.5px;color:var(--muted);font-weight:400}
.ch .rt{margin-left:auto;display:flex;gap:6px;align-items:center}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px;margin-bottom:16px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.kpi .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:5px}
.kpi .v{font-family:var(--fd);font-size:26px;font-weight:700;letter-spacing:-.03em;margin-top:5px;font-variant-numeric:tabular-nums;line-height:1}
.kpi .d{font-size:11.5px;color:var(--muted);margin-top:4px}
.kpi.warn{border-color:var(--signal-line);background:var(--signal-bg)}
.kpi.warn .v,.kpi.warn .k{color:var(--signal)}.kpi.warn .d{color:#B24708}
.kpi.good{border-color:var(--ok-line);background:var(--ok-bg)}
.kpi.good .v,.kpi.good .k{color:var(--ok)}.kpi.good .d{color:#2A6B54}

.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{text-align:left;padding:9px 12px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700;border-bottom:1px solid var(--line);background:#FBFCFA;white-space:nowrap}
.tbl td{padding:10px 12px;border-bottom:1px solid var(--line-2);vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tbody tr{cursor:pointer;transition:background .1s}
.tbl tbody tr:hover{background:#FAFBF9}
.tbl tbody tr.sel{background:var(--transit-bg)}
.tbl .r{text-align:right}
.who{display:flex;flex-direction:column;gap:1px}
.who b{font-weight:600;font-size:13px}
.who span{font-size:11.5px;color:var(--muted)}
.who b[style*="font-weight:500"]{font-size:12.5px}
.chk{width:16px;height:16px;border:1.5px solid #C4CBC2;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;background:#fff;flex-shrink:0}
.chk.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chk svg{width:11px;height:11px;stroke-width:3}

.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;font-size:11.5px;font-weight:600;white-space:nowrap;border:1px solid transparent}
.pill .d2{width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.p-new{background:#F1F3EF;color:#5C6670;border-color:var(--line)}
.p-gold{background:var(--gold-bg);color:var(--gold);border-color:var(--gold-line)}
.p-ok{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-line)}
.p-tr{background:var(--transit-bg);color:var(--transit);border-color:var(--transit-line)}
.p-sig{background:var(--signal-bg);color:var(--signal);border-color:var(--signal-line)}
.p-dead{background:var(--danger-bg);color:var(--danger);border-color:var(--danger-line)}
.p-vio{background:var(--violet-bg);color:var(--violet);border-color:var(--violet-line)}
.days{font-family:var(--fm);font-size:11.5px;font-weight:700;padding:2px 7px;border-radius:5px;background:#F1F3EF;color:var(--muted)}
.days.w{background:var(--signal-bg);color:var(--signal)}
.days.d{background:var(--danger-bg);color:var(--danger)}

.mp{display:inline-flex;flex-direction:column;gap:1px;line-height:1.3;text-align:right}
.mp b{font-size:12.5px;font-weight:700}
.mp span{font-size:11px;color:var(--muted)}
.mp.full b{color:var(--ok)}
.mp.full span{color:var(--ok);font-weight:600}
.mp.block b{color:var(--danger)}
.mp.block span{color:var(--danger)}
.mp.none b{color:var(--faint);font-weight:600}
.rowacts{display:inline-flex;gap:5px;align-items:center;justify-content:flex-end}

/* PAGO — el eje nuevo */
.pay{display:inline-flex;flex-direction:column;gap:1px;line-height:1.3}
.pay .pt{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.pay .ps{font-size:10.5px;font-weight:600;letter-spacing:.02em}
.pay.full .pt{color:var(--ok)}
.pay.full .ps{color:var(--ok)}
.pay.part .ps{color:var(--muted)}
.pay.block .pt{color:var(--danger)}
.pay.block .ps{color:var(--danger)}

.banner{display:flex;gap:12px;align-items:flex-start;padding:12px 15px;border-radius:var(--r);border:1px solid var(--signal-line);background:var(--signal-bg);margin-bottom:15px}
.banner .bi{color:var(--signal);flex-shrink:0;margin-top:1px}
.banner b{display:block;font-size:13.5px;color:#8C3A05;margin-bottom:2px}
.banner p{font-size:12.5px;color:#B24708;line-height:1.5}
.banner .rt{margin-left:auto;flex-shrink:0}

.split{display:grid;grid-template-columns:1fr 330px;gap:15px;align-items:start}
@media(max-width:1180px){.split{grid-template-columns:1fr}}
.split3{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:start}
@media(max-width:900px){.split3{grid-template-columns:1fr}}

/* KANBAN */
.kb{display:flex;gap:11px;overflow-x:auto;padding-bottom:12px;align-items:flex-start}
.kcol{min-width:246px;width:246px;flex-shrink:0;background:#EFF2ED;border-radius:var(--r);border:1px solid var(--line)}
.kch{padding:10px 12px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line)}
.kch .kd{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.kch b{font-size:12px;font-weight:700;letter-spacing:-.01em}
.kch .kn{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted);background:#fff;padding:1px 7px;border-radius:20px;border:1px solid var(--line);font-variant-numeric:tabular-nums}
.kbody{padding:8px;display:flex;flex-direction:column;gap:7px;min-height:70px;max-height:520px;overflow-y:auto}
.kcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 10px;cursor:grab;transition:.12s}
.kcard:hover{border-color:#C4CBC2;box-shadow:0 2px 6px rgba(19,26,38,.07)}
.kcard.drag{opacity:.4}
.kcard b{font-size:12.5px;font-weight:600;display:block;line-height:1.3}
.kcard .kdest{font-size:11px;color:var(--muted);margin-top:2px;display:block}
.kcard .kfoot{display:flex;align-items:center;gap:6px;margin-top:7px;flex-wrap:wrap}
.kcard .kg{font-family:var(--fm);font-size:10.5px;color:var(--faint)}
.kcard .kamt{margin-left:auto;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.kcard .kamt.free{color:var(--ok)}
.tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.tag{font-size:10px;font-weight:700;padding:1.5px 7px;border-radius:5px;letter-spacing:.01em}
.t-urg{background:var(--signal-bg);color:var(--signal)}
.t-old{background:var(--danger);color:#fff}

/* ---- PANEL LATERAL ---- */
.drawer-ov{position:fixed;inset:0;background:rgba(19,26,38,.4);z-index:90;display:none;backdrop-filter:blur(2px)}
.drawer-ov.on{display:block}
.drawer{position:fixed;top:0;right:0;bottom:0;width:390px;max-width:92vw;background:#fff;z-index:95;box-shadow:-12px 0 40px rgba(19,26,38,.18);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .22s ease}
.drawer.on{transform:translateX(0)}
.drw-h{padding:17px 18px;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;gap:12px}
.drw-h h3{font-family:var(--fd);font-size:16px;font-weight:700;letter-spacing:-.02em}
.drw-h span{font-size:12.5px;color:var(--muted);display:block;margin-top:2px}
.drw-h .ctl{margin-left:auto;flex-shrink:0}
.drw-b{flex:1;overflow-y:auto;padding:14px 18px 24px;display:flex;flex-direction:column;gap:8px}
.lk{border:1px solid var(--line);border-radius:var(--r);padding:12px 13px}
.lk-t{display:flex;align-items:center;justify-content:space-between;gap:10px}
.lk-t b{font-size:13px;font-weight:700}
.lk p{font-size:12.5px;color:var(--muted);margin-top:5px}
.lk-f{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;padding-top:9px;border-top:1px solid var(--line-2)}
.lk-f span{font-size:11.5px;color:var(--faint)}
.t-freq{background:var(--ok-bg);color:var(--ok)}
.t-frag{background:var(--gold-bg);color:var(--gold)}
.t-rec{background:var(--violet-bg);color:var(--violet)}
.t-pre{background:var(--ok-bg);color:var(--ok)}
.kbody .kempty{font-size:11.5px;color:var(--faint);text-align:center;padding:16px 8px}

/* CATALOGO */
.grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.prod{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.12s;cursor:pointer}
.prod:hover{border-color:#C4CBC2;box-shadow:0 3px 10px rgba(19,26,38,.07)}
.prod .pimg{height:120px;background:repeating-linear-gradient(45deg,#E8EBE6,#E8EBE6 7px,#F2F4F0 7px,#F2F4F0 14px);display:flex;align-items:center;justify-content:center;color:var(--faint);position:relative}
.prod .pst{position:absolute;top:8px;right:8px}
.prod .pb{padding:11px 12px}
.prod .pb b{font-size:13px;font-weight:600;display:block;line-height:1.3}
.prod .psub2{font-size:11.5px;color:var(--muted);margin-top:1px;display:block}
.prod .prow{display:flex;align-items:baseline;gap:7px;margin-top:6px}
.prod .pprice{font-family:var(--fd);font-size:19px;font-weight:700;letter-spacing:-.02em}
.prod .pvars{display:flex;gap:4px;margin-top:9px;padding-top:9px;border-top:1px solid var(--line-2);flex-wrap:wrap}
.prod .pvar{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:5px;background:var(--paper);border:1px solid var(--line);color:var(--muted)}
.prod .pnone{font-size:11px;color:var(--faint)}

/* STEPS */
.steps{display:grid;grid-template-columns:repeat(4,1fr);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:16px}
.st{padding:13px 14px;border-right:1px solid var(--line-2)}
.st:last-child{border-right:none}
.st .sn{width:21px;height:21px;border-radius:50%;background:var(--line);color:var(--muted);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:7px}
.st.done .sn{background:var(--ok);color:#fff}
.st.now .sn{background:var(--ink);color:#fff}
.st.now{background:#FBFCFA}
.st b{font-size:12.5px;display:block;margin-bottom:2px}
.st p{font-size:11.5px;color:var(--muted);line-height:1.45}

/* TIMELINE */
.tl{padding:4px 15px 14px}
.tli{display:flex;gap:11px;position:relative;padding-bottom:15px}
.tli:last-child{padding-bottom:0}
.tli::before{content:'';position:absolute;left:9px;top:21px;bottom:0;width:1.5px;background:var(--line)}
.tli:last-child::before{display:none}
.tli.done::before{background:var(--ok)}
.tld{width:19px;height:19px;border-radius:50%;background:#fff;border:2px solid var(--line);flex-shrink:0;display:flex;align-items:center;justify-content:center;z-index:1}
.tli.done .tld{background:var(--ok);border-color:var(--ok);color:#fff}
.tli.now .tld{background:var(--transit);border-color:var(--transit);color:#fff;box-shadow:0 0 0 3.5px var(--transit-bg)}
.tld svg{width:11px;height:11px;stroke-width:3}
.tlb b{font-size:12.5px;font-weight:600;display:block}
.tlb span{font-size:11.5px;color:var(--muted)}
.tli.pend .tlb b{color:var(--faint);font-weight:500}

.dl{padding:3px 15px 13px}
.dlr{display:flex;justify-content:space-between;gap:14px;padding:7.5px 0;border-bottom:1px solid var(--line-2);font-size:13px}
.dlr:last-child{border-bottom:none}
.dlr dt{color:var(--muted);flex-shrink:0}
.dlr dd{text-align:right;font-weight:500}

/* FORMS / CONFIG */
.fld{margin-bottom:13px}
.fld label{display:block;font-size:11.5px;font-weight:600;color:var(--muted);margin-bottom:5px}
.fld input,.fld select{width:100%;height:34px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;font-size:13px;outline:none}
.fld input:focus,.fld select:focus{border-color:var(--ink)}
.fld .fh{font-size:11px;color:var(--faint);margin-top:4px;line-height:1.45}
.tgr{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line-2)}
.tgr:last-child{border-bottom:none}
.tgr .tt{font-size:13px;font-weight:500}
.tgr .ts{font-size:11.5px;color:var(--muted);margin-top:1px;line-height:1.45}
.tg{width:34px;height:19px;border-radius:20px;background:#D3D9D1;position:relative;transition:.15s;flex-shrink:0;cursor:pointer}
.tg::after{content:'';position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;transition:.15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.tg.on{background:var(--ok)}.tg.on::after{transform:translateX(15px)}
.sws{display:flex;gap:6px}
.sw{width:26px;height:26px;border-radius:6px;border:2px solid transparent;cursor:pointer}
.sw.on{border-color:var(--ink);box-shadow:0 0 0 2px #fff inset}

/* ROTULO */
.rotwrap{display:grid;grid-template-columns:290px 1fr;gap:15px;align-items:start}
@media(max-width:980px){.rotwrap{grid-template-columns:1fr}}
.lprev{background:#E9EBE7;padding:24px;border-radius:var(--r);display:flex;justify-content:center;border:1px solid var(--line)}
.rot{width:372px;background:#fff;border:1px solid #333;color:#000}
.rtop{display:flex;align-items:center;gap:9px;padding:9px 11px;border-bottom:1.5px solid #000}
.rlogo{width:30px;height:30px;border-radius:6px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:13px;flex-shrink:0}
.rtop b{font-family:var(--fd);font-size:14px;font-weight:800;letter-spacing:-.02em;display:block;line-height:1.1}
.rtop .rsub{font-size:9px;color:#666;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.rg{margin-left:auto;text-align:right}
.rg span{display:block;font-size:8px;color:#666;letter-spacing:.07em;font-weight:700}
.rg b{font-family:var(--fm);font-size:13px;font-weight:700}
.rsec{padding:9px 11px;border-bottom:1px solid #D5D5D5}
.rl{font-size:8.5px;text-transform:uppercase;letter-spacing:.09em;color:#777;font-weight:700;margin-bottom:3px}
.rv{font-size:13px;font-weight:600;line-height:1.35}
.rv small{display:block;font-size:11px;font-weight:400;color:#444;margin-top:1px}
.rdest{background:#F2F2F2}.rdest .rv{font-size:15px;font-weight:700}
.rgrid{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #D5D5D5}
.rgrid>div{padding:8px 11px}
.rgrid>div:first-child{border-right:1px solid #D5D5D5}
.rfoot{display:flex;align-items:center;gap:10px;padding:9px 11px}
.rqr{width:54px;height:54px;flex-shrink:0}
.rft{font-size:9.5px;color:#555;line-height:1.4}
.rft b{display:block;font-size:11px;color:#000;margin-bottom:1px}
.rpay{margin-left:auto;text-align:right;flex-shrink:0;padding:5px 9px;border-radius:5px}
.rpay span{font-size:8.5px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;display:block}
.rpay b{font-family:var(--fd);font-size:19px;font-weight:800;letter-spacing:-.02em;display:block;line-height:1.1}
.rpay.cobrar{background:#000;color:#fff}
.rpay.cobrar span{color:rgba(255,255,255,.6)}
.rpay.nocobrar{background:#0E7C5A;color:#fff}
.rpay.nocobrar span{color:rgba(255,255,255,.7)}
.rpay.nocobrar b{font-size:15px}

/* PHONES */
.phones{display:flex;gap:30px;flex-wrap:wrap;justify-content:center;padding:6px 0 18px}
.pcol{width:382px;max-width:100%}
.pcap{text-align:center;margin-bottom:11px}
.pcap b{font-family:var(--fd);font-size:14.5px;font-weight:700;display:block}
.pcap span{font-size:12px;color:var(--muted)}
.phone{border:9px solid var(--ink);border-radius:32px;overflow:hidden;background:#fff;box-shadow:0 12px 32px rgba(19,26,38,.16)}
.pbar{background:var(--ink);height:21px;display:flex;align-items:center;justify-content:center}
.pbar i{width:70px;height:5px;border-radius:20px;background:rgba(255,255,255,.28)}
.psc{height:640px;overflow-y:auto;background:#fff}
.psc::-webkit-scrollbar{width:0}
.cfh{padding:14px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.cflogo{width:36px;height:36px;border-radius:9px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:15px;flex-shrink:0}
.cfh b{font-family:var(--fd);font-size:14px;font-weight:800;display:block;line-height:1.15}
.cfh span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.cfb{padding:15px 17px 24px}
.osum{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:15px}
.ost{display:flex;gap:11px;padding:11px;align-items:center}
.osimg{width:50px;height:50px;border-radius:8px;background:repeating-linear-gradient(45deg,#E8EBE6,#E8EBE6 6px,#F2F4F0 6px,#F2F4F0 12px);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--faint)}
.ost b{font-size:13px;font-weight:600;display:block;line-height:1.3}
.ost span{font-size:11.5px;color:var(--muted)}
.opay{background:#FBFCFA;border-top:1px solid var(--line-2);padding:10px 11px}
.opl{display:flex;justify-content:space-between;font-size:12px;padding:2px 0;color:var(--muted)}
.opl.tot{border-top:1px dashed var(--line);margin-top:6px;padding-top:7px;color:var(--text)}
.opl.tot .lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--muted);align-self:center}
.opl.tot .amt{font-family:var(--fd);font-size:19px;font-weight:800;letter-spacing:-.02em}
.opl.tot .amt.free{color:var(--ok);font-size:15px}
.cut{display:flex;gap:10px;align-items:center;background:var(--signal-bg);border:1px solid var(--signal-line);border-radius:var(--r);padding:10px 12px;margin-bottom:16px}
.cut svg{color:var(--signal);flex-shrink:0}
.cut b{font-size:12.5px;color:#8C3A05;display:block}
.cut span{font-size:11.5px;color:#B24708;line-height:1.4}
.cff{margin-bottom:14px}
.cff>label{display:block;font-size:12.5px;font-weight:600;margin-bottom:6px}
.cff>label i{color:var(--signal);font-style:normal}
.cin{width:100%;height:45px;border:1px solid var(--line);border-radius:var(--r);padding:0 13px;font-size:14.5px;outline:none;background:#fff;transition:.12s}
.cin:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(19,26,38,.06)}
.cin::placeholder{color:var(--faint)}
.cph{display:flex;align-items:center;height:45px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.cph .cc{padding:0 11px;height:100%;display:flex;align-items:center;background:#FBFCFA;border-right:1px solid var(--line);font-size:14px;color:var(--muted);font-weight:600;flex-shrink:0}
.cph input{border:none;outline:none;flex:1;padding:0 13px;font-size:14.5px;min-width:0;height:100%}
.chint{font-size:11.5px;color:var(--muted);margin-top:5px;display:flex;align-items:flex-start;gap:5px;line-height:1.45}
.chint svg{flex-shrink:0;margin-top:1px}
.chint.ok{color:var(--ok)}
.casc{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.csel{position:relative}
.csel select{width:100%;height:45px;border:1px solid var(--line);border-radius:var(--r);padding:0 32px 0 13px;font-size:14px;outline:none;background:#fff;appearance:none;cursor:pointer}
.csel .cv{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--muted)}
.agp{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.agi{display:flex;gap:10px;padding:11px 12px;border-bottom:1px solid var(--line-2);cursor:pointer;align-items:flex-start}
.agi:last-child{border-bottom:none}
.agi.on{background:var(--transit-bg)}
.agr{width:18px;height:18px;border-radius:50%;border:2px solid #C4CBC2;flex-shrink:0;margin-top:1px}
.agi.on .agr{border-color:var(--transit);border-width:5px}
.agi b{font-size:13px;font-weight:600;display:block}
.agi p{font-size:11.5px;color:var(--muted);line-height:1.4;margin-top:1px}
.agi .tg2{display:inline-block;font-size:10px;font-weight:700;padding:1px 6px;border-radius:4px;background:var(--ok-bg);color:var(--ok);margin-top:5px}
.csub{width:100%;height:50px;background:var(--ink);color:#fff;border-radius:var(--r);font-size:15px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:5px}
.csub:hover{background:var(--ink-2)}
.cleg{font-size:10.5px;color:var(--faint);text-align:center;margin-top:10px;line-height:1.5}

.tkh{padding:17px;text-align:center;border-bottom:1px solid var(--line)}
.tklogo{width:42px;height:42px;border-radius:11px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:17px;margin:0 auto 8px}
.tkh b{font-family:var(--fd);font-size:15px;font-weight:800;display:block}
.tkh span{font-size:11.5px;color:var(--muted)}
.tkhero{padding:22px 17px;text-align:center;background:var(--transit-bg);border-bottom:1px solid var(--transit-line)}
.tkst{display:inline-flex;align-items:center;gap:6px;background:var(--transit);color:#fff;padding:4px 11px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}
.tkhero h2{font-family:var(--fd);font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.25;color:var(--ink)}
.tkhero p{font-size:12.5px;color:#3E5C9E;margin-top:6px}
.tkcode{display:inline-flex;align-items:center;gap:7px;margin-top:12px;background:#fff;border:1px solid var(--transit-line);padding:6px 12px;border-radius:8px}
.tkcode span{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700}
.tkcode b{font-family:var(--fm);font-size:13px;font-weight:700}
.tks{padding:17px}
.tks+.tks{border-top:1px solid var(--line)}
.tks h3{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-bottom:11px}
.pbox{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.prow{display:flex;gap:11px;padding:11px 12px;border-bottom:1px solid var(--line-2);align-items:flex-start}
.prow:last-child{border-bottom:none}
.prow svg{color:var(--muted);flex-shrink:0;margin-top:1px}
.prow .pl{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.prow .pv{font-size:13.5px;font-weight:600;margin-top:1px;line-height:1.35}
.prow .pv small{display:block;font-size:11.5px;font-weight:400;color:var(--muted);margin-top:1px}
.pstrip{background:var(--ink);color:#fff;padding:13px 15px;display:flex;align-items:center;justify-content:space-between;border-radius:var(--r);margin-top:10px}
.pstrip.free{background:var(--ok)}
.pstrip .pl{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:rgba(255,255,255,.55);font-weight:700}
.pstrip .pv{font-size:12px;color:rgba(255,255,255,.75);margin-top:2px}
.pstrip .amt{font-family:var(--fd);font-size:22px;font-weight:800;letter-spacing:-.02em}
.pstrip.free .amt{font-size:17px}
.tkhelp{padding:17px;background:#FBFCFA;border-top:1px solid var(--line);text-align:center}
.tkhelp p{font-size:12.5px;color:var(--muted);margin-bottom:10px}
.tkwa{display:flex;align-items:center;justify-content:center;gap:8px;background:#25D366;color:#fff;height:45px;border-radius:var(--r);font-size:14px;font-weight:600;width:100%}
.tkfoot{padding:13px 17px;text-align:center;font-size:10.5px;color:var(--faint);line-height:1.5}

.ov{position:fixed;inset:0;background:rgba(19,26,38,.5);display:none;align-items:center;justify-content:center;z-index:100;padding:20px;backdrop-filter:blur(2px)}
.ov.on{display:flex}
.modal{background:#fff;border-radius:14px;width:100%;max-width:450px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.28)}
.mh{padding:14px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.mh h3{font-family:var(--fd);font-size:15px;font-weight:700}
.mh .rt{margin-left:auto}
.mb{padding:15px 17px}
.wap{background:#E6DDD4;border-radius:var(--r);padding:13px;margin-bottom:13px}
.wab{background:#D9FDD3;border-radius:9px;padding:9px 11px;font-size:13.5px;line-height:1.5;box-shadow:0 1px 1px rgba(0,0,0,.1)}
.wab .lnk{color:#0A7CFF;text-decoration:underline;word-break:break-all}
.wab .tm{display:block;text-align:right;font-size:10px;color:#667781;margin-top:3px}
.wae{width:100%;min-height:92px;border:1px solid var(--line);border-radius:var(--r-sm);padding:10px;font-size:13px;font-family:inherit;resize:vertical;outline:none;line-height:1.5}
.wae:focus{border-color:var(--ink)}
.vars{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.var{font-family:var(--fm);font-size:11px;padding:2px 7px;border-radius:5px;background:var(--paper);border:1px solid var(--line);color:var(--muted);cursor:pointer}
.var:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.mf{padding:12px 17px;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center;background:#FBFCFA}
.mf .note{font-size:11.5px;color:var(--muted);flex:1;line-height:1.4}
.pitem,.payopt{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;cursor:pointer;transition:.12s;background:#fff}
.pitem:hover,.payopt:hover{border-color:#C4CBC2}
.pitem.on,.payopt.on{border-color:var(--transit);background:var(--transit-bg)}
.pitem .agr,.payopt .agr{width:17px;height:17px;border-radius:50%;border:2px solid #C4CBC2;flex-shrink:0}
.pitem.on .agr,.payopt.on .agr{border-color:var(--transit);border-width:5px}
.pitem .pth{width:34px;height:34px;border-radius:6px;background:repeating-linear-gradient(45deg,#E8EBE6,#E8EBE6 5px,#F2F4F0 5px,#F2F4F0 10px);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--faint)}
.vchip{font-size:12px;font-weight:600;padding:6px 14px;border-radius:var(--r-sm);border:1px solid var(--line);background:#fff;cursor:pointer;transition:.12s}
.vchip:hover{border-color:#C4CBC2}
.vchip.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.nvsec{margin-bottom:15px}
/* combo de producto */
.combo{position:relative}
.combo-in{display:flex;align-items:center;gap:9px;height:44px;padding:0 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;cursor:text;transition:.12s}
.combo-in:hover{border-color:#C4CBC2}
.combo.open .combo-in{border-color:var(--ink);box-shadow:0 0 0 3px rgba(19,26,38,.06)}
.combo-in input{flex:1;border:none;outline:none;background:none;font-size:14px;min-width:0}
.combo.open .cvi{transform:rotate(180deg)}
.combo-pop{position:absolute;top:48px;left:0;right:0;z-index:60;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 10px 30px rgba(19,26,38,.15);max-height:224px;overflow-y:auto;display:none;padding:5px}
.combo.open .combo-pop{display:block}
.copt{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:6px;cursor:pointer;transition:.1s}
.copt:hover{background:var(--paper)}
.copt .pth{width:32px;height:32px;border-radius:6px;background:repeating-linear-gradient(45deg,#E8EBE6,#E8EBE6 5px,#F2F4F0 5px,#F2F4F0 10px);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--faint)}
.copt b{font-size:13px;font-weight:600;display:block}
.copt span{font-size:11.5px;color:var(--muted)}
.copt > div{flex:1;min-width:0}
.copt .pp{font-size:13.5px;font-weight:700;flex-shrink:0}
.cnone{padding:14px;text-align:center;font-size:12.5px;color:var(--faint)}
.chosen{display:flex;align-items:center;gap:11px;border:1px solid var(--transit-line);background:var(--transit-bg);border-radius:var(--r-sm);padding:10px 12px;margin-top:7px}
.chosen .pth{width:34px;height:34px;border-radius:6px;background:#fff;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--faint)}
.chosen b{font-size:13px;font-weight:600;display:block}
.chosen span{font-size:11.5px;color:var(--muted)}
.chosen > div{flex:1;min-width:0}
.chosen .pp{font-size:14px;font-weight:700}
/* duo horizontal */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.duo-b{text-align:left;border:1px solid var(--line);border-radius:var(--r-sm);padding:11px 13px;background:#fff;transition:.12s}
.duo-b:hover{border-color:#C4CBC2}
.duo-b.on{border-color:var(--ink);background:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.duo-b b{font-size:13px;font-weight:700;display:block;margin-bottom:2px}
.duo-b span{font-size:11.5px;color:var(--muted);line-height:1.35;display:block}
.duo-b.on b{color:var(--ink)}
.advrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px;padding:9px 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:#FBFCFA;font-size:12.5px;color:var(--muted)}
.advin{display:flex;align-items:center;gap:3px;font-size:13.5px;font-weight:700;color:var(--text)}
.advin input{width:46px;border:none;border-bottom:1.5px solid var(--muted);background:none;font-size:13.5px;font-weight:700;text-align:center;outline:none;font-variant-numeric:tabular-nums;padding:1px 0}
.advin input:focus{border-color:var(--ink)}

/* ---- EDITOR DE PRODUCTO ---- */
.pd-top{display:flex;gap:14px;align-items:flex-start;margin-bottom:4px}
.pd-img{width:92px;height:92px;border-radius:var(--r);border:1.5px dashed #C9D0C7;background:#FBFCFA;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;flex-shrink:0;color:var(--faint);transition:.12s}
.pd-img:hover{border-color:var(--ink);color:var(--muted)}
.pd-img span{font-size:11px;font-weight:600}
.pd-sec{border-top:1px solid var(--line-2);padding-top:15px;margin-top:15px}
.pd-sec.int{background:#FBFCFA;margin:15px -18px 0;padding:15px 18px;border-bottom:1px solid var(--line-2)}
.pd-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.pd-hint{font-size:11.5px;color:var(--faint);margin-left:auto}
.pd-priv{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--muted);background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:2px 9px;margin-left:auto}
.pd-note{font-size:11.5px;color:var(--muted);margin-top:9px;line-height:1.45}
.axis{border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:8px;overflow:hidden}
.ax-h{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#FBFCFA}
.ax-h b{font-size:13px;font-weight:600}
.ax-b{padding:11px 12px;border-top:1px solid var(--line-2)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:9px;min-height:26px}
.chips:empty{display:none}
.chp{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:4px 8px 4px 11px;border-radius:6px;background:var(--ink);color:#fff}
.chp button{color:rgba(255,255,255,.6);display:flex;padding:1px}
.chp button:hover{color:#fff}
.chp svg{width:11px;height:11px;stroke-width:2.5}
.chip-add{display:flex;gap:6px}
.chip-add input{flex:1;height:32px;border:1px solid var(--line);border-radius:var(--r-sm);padding:0 10px;font-size:12.5px;outline:none;min-width:0}
.chip-add input:focus{border-color:var(--ink)}
.sizes{display:flex;gap:6px;flex-wrap:wrap}
.sz{padding:7px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;font-size:12.5px;font-weight:600;color:var(--muted);transition:.12s}
.sz:hover{border-color:#C4CBC2;color:var(--text)}
.sz.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.szmini{display:inline-flex;align-items:center;justify-content:center;min-width:26px;padding:2px 7px;border-radius:5px;background:var(--paper);border:1px solid var(--line);font-size:11.5px;font-weight:700}
.szmini.warn{background:var(--signal-bg);border-color:var(--signal-line);color:var(--signal)}

/* ---- CARGA MASIVA ---- */
.bk-step{display:flex;align-items:center;gap:11px}
.bk-n{width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bk-step b{font-size:13px;display:block}
.bk-step p{font-size:11.5px;color:var(--muted);margin-top:1px}
.bk-cols{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0 0 33px}
.bkc{font-family:var(--fm);font-size:11px;padding:3px 8px;border-radius:5px;background:var(--paper);border:1px solid var(--line);color:var(--muted)}
.bkc.int{background:var(--ink);color:#fff;border-color:var(--ink)}
.bk-ok{display:flex;align-items:center;gap:10px;background:var(--ok-bg);border:1px solid var(--ok-line);border-radius:var(--r-sm);padding:10px 12px;color:var(--ok)}
.bk-ok b{font-size:13px;display:block}
.bk-ok span{font-size:11.5px;color:#2A6B54}
.nvrow{display:flex;gap:14px;align-items:flex-start}
.nvlbl{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--muted);margin-bottom:7px}
.payopt b{font-size:13px;display:block}
.payopt span{font-size:11.5px;color:var(--muted)}
.stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);height:34px;overflow:hidden}
.stepper button{width:32px;height:100%;font-size:16px;color:var(--muted);transition:.12s}
.stepper button:hover{background:var(--paper);color:var(--text)}
.stepper span{flex:1;text-align:center;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;border-left:1px solid var(--line);border-right:1px solid var(--line);line-height:32px}
.nvprev{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#FBFCFA}
.nvph{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--muted);padding:9px 13px;border-bottom:1px solid var(--line-2);background:#fff}
.nvimg{width:42px;height:42px;border-radius:8px;background:repeating-linear-gradient(45deg,#E8EBE6,#E8EBE6 6px,#F2F4F0 6px,#F2F4F0 12px);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--faint)}
.nvprev b{font-size:13px;font-weight:600;display:block}
.nvprev > div > div > span{font-size:11.5px;color:var(--muted)}
.nvcalc{border-top:1px solid var(--line-2);padding:10px 13px}
.nvcl{display:flex;justify-content:space-between;font-size:12.5px;padding:2px 0;color:var(--muted)}
.nvcl.tot{border-top:1px dashed var(--line);margin-top:6px;padding-top:7px;color:var(--text);align-items:center}
.nvcl.tot .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--muted)}
.nvcl.tot .v{font-family:var(--fd);font-size:18px;font-weight:800;letter-spacing:-.02em}
.nvcl.tot .v.free{color:var(--ok);font-size:16px}
.nvfoot{font-size:11.5px;color:var(--muted);margin-top:8px;padding-top:8px;border-top:1px solid var(--line-2);line-height:1.45}
.nvfoot.ok{color:var(--ok);font-weight:500}
.nvok{text-align:center;padding:6px 0 16px}
.nvokic{width:52px;height:52px;border-radius:50%;background:var(--ok-bg);color:var(--ok);display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.nvokic svg{width:26px;height:26px}
.nvok b{font-family:var(--fd);font-size:18px;font-weight:700;letter-spacing:-.02em;display:block}
.nvok p{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.5;max-width:330px;margin-left:auto;margin-right:auto}
.nvlink{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:var(--r);padding:9px 11px;background:#FBFCFA}
.nvlink span{flex:1;font-size:13px}

.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--ink);color:#fff;padding:11px 18px;border-radius:20px;font-size:13px;font-weight:500;display:flex;align-items:center;gap:8px;z-index:200;opacity:0;transition:.25s;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.toast.on{transform:translateX(-50%) translateY(0);opacity:1}
.nb{background:#FFFDF5;border:1px solid #F0E4BC;border-left:3px solid #D9A800;border-radius:var(--r-sm);padding:10px 13px;font-size:12px;color:#7A5C00;line-height:1.5;margin-top:13px}
.nb b{color:#5C4500}
.calwrap{position:relative}
.calpop{position:absolute;top:40px;left:0;z-index:50;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 34px rgba(19,26,38,.16);padding:12px;width:266px;display:none}

/* ---- BARRA DE DESPACHO ---- */
.dispatch-bar{display:flex;gap:26px;flex-wrap:wrap;align-items:flex-end;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:13px 16px;margin-bottom:15px}
.db-group{display:flex;flex-direction:column;gap:6px}
.db-lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700}
.seg.origin button{display:inline-flex;align-items:center;gap:6px;color:var(--muted)}
.seg.origin button.on{background:var(--ok);color:#fff;border-color:var(--ok)}
.synced{display:flex;align-items:center;gap:12px;background:var(--ok-bg);border:1px solid var(--ok-line);border-radius:var(--r);padding:12px 16px;margin-bottom:15px;color:var(--ok)}
.synced b{font-size:13.5px;display:block}
.synced span{font-size:11.5px;color:#2A6B54}
.synced .ctl{margin-left:auto;background:#fff}

/* ---- PANEL DE IMPORTACION ---- */
.imp-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.imp-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 4px;font-size:11px;font-weight:600;color:var(--muted);border-right:1px solid var(--line-2);transition:.12s}
.imp-tab:last-child{border-right:none}
.imp-tab:hover{background:#FBFCFA;color:var(--text)}
.imp-tab.on{color:var(--ink);background:var(--paper);box-shadow:inset 0 -2px 0 var(--ink)}
.imp-body{padding:14px 15px}
.imp-hint{font-size:12px;color:var(--muted);line-height:1.5;margin-bottom:10px}
.imp-src{display:flex;flex-direction:column;gap:6px}
.src{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;cursor:pointer;transition:.12s}
.src:hover{border-color:#C4CBC2}
.src.on{border-color:var(--transit);background:var(--transit-bg)}
.src .agr{width:16px;height:16px;border-radius:50%;border:2px solid #C4CBC2;flex-shrink:0}
.src.on .agr{border-color:var(--transit);border-width:5px}
.src b{font-size:12.5px;font-weight:600;display:block}
.src span{font-size:11px;color:var(--muted)}
.src > div{flex:1;min-width:0}
.imp-list{display:flex;flex-direction:column;gap:5px;max-height:210px;overflow-y:auto}
.imp-row{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;cursor:pointer;transition:.12s}
.imp-row:hover{border-color:#C4CBC2}
.imp-row b{font-size:12.5px;font-weight:600;display:block}
.imp-row span{font-size:11px;color:var(--muted)}
.imp-ta{width:100%;min-height:112px;border:1px solid var(--line);border-radius:var(--r-sm);padding:10px;font-size:12.5px;font-family:inherit;resize:vertical;outline:none;line-height:1.5}
.imp-ta:focus{border-color:var(--ink)}
.imp-drop{border:1.5px dashed #C9D0C7;border-radius:var(--r);padding:26px 16px;text-align:center;color:var(--muted);background:#FBFCFA;cursor:pointer}
.imp-drop svg{color:var(--faint);margin-bottom:7px}
.imp-drop b{display:block;font-size:13px;color:var(--text);margin-bottom:2px}
.imp-drop p{font-size:11.5px}
.imp-fields{display:flex;flex-direction:column;gap:1px;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.ifld{display:flex;justify-content:space-between;gap:12px;padding:8px 11px;border-bottom:1px solid var(--line-2);font-size:12.5px;background:#fff}
.ifld:last-child{border-bottom:none}
.ifld span{color:var(--muted);flex-shrink:0}
.ifld b{text-align:right;font-weight:600}
.ifld.warn{background:var(--signal-bg)}
.ifld.warn b{color:var(--signal)}

/* ---- CATALOGO: VISTA LISTA ---- */
.plist .prod{display:flex;align-items:center;gap:14px;padding:11px 14px;border-radius:var(--r-sm);margin-bottom:6px}
.plist .prod .pimg{height:44px;width:44px;border-radius:7px;flex-shrink:0}
.plist .prod .pb{padding:0;flex:1;display:flex;align-items:center;gap:14px}
.plist .prod .pb > div:first-child{flex:1;min-width:0}
.plist .prod .pvars{margin:0;padding:0;border:none}
.plist .prod .prow{margin:0}
.plist .pst-inline{flex-shrink:0}
.calpop.on{display:block}
.calhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.calhead b{font-size:13.5px;font-weight:700}
.caldow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
.caldow span{text-align:center;font-size:10.5px;font-weight:700;color:var(--faint);padding:3px 0}
.calgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cald{height:32px;display:flex;align-items:center;justify-content:center;font-size:12.5px;border-radius:6px;cursor:pointer;font-variant-numeric:tabular-nums;transition:.1s}
.cald:hover{background:var(--paper)}
.cald.off{color:var(--faint);opacity:.4;cursor:default}
.cald.off:hover{background:none}
.cald.sel{background:var(--ink);color:#fff;font-weight:700}
.cald.inr{background:var(--transit-bg);color:var(--transit);border-radius:0}
.cald.today{box-shadow:inset 0 0 0 1.5px var(--transit)}
.calfoot{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line-2)}
.calfoot span{font-size:11.5px;color:var(--muted);flex:1}

/* ---- VENTAS ---- */
.tv{display:flex;align-items:center;gap:26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;margin-bottom:15px;flex-wrap:wrap}
.tv-l{flex:1;min-width:220px}
.tv-lbl{display:block;font-size:12px;color:var(--muted);font-weight:500;margin-bottom:7px}
.tv-n{font-family:var(--fd);font-size:52px;font-weight:800;letter-spacing:-.04em;line-height:.95;font-variant-numeric:tabular-nums}
.tv-s{display:block;font-size:13.5px;color:var(--muted);margin-top:9px}
.tv-r{display:flex;gap:14px;flex-shrink:0}
.tv-x{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:13px 18px;min-width:132px}
.tv-x span{display:block;font-size:11.5px;color:var(--muted);font-weight:500}
.tv-x b{font-family:var(--fd);font-size:24px;font-weight:800;letter-spacing:-.03em;display:block;margin-top:4px;font-variant-numeric:tabular-nums}

.rank{padding:6px 15px 14px}
.rk{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid var(--line-2)}
.rk:last-child{border-bottom:none}
.rk-p{width:20px;height:20px;border-radius:50%;background:var(--paper);border:1px solid var(--line);color:var(--muted);font-size:10.5px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rk:first-child .rk-p{background:var(--ink);color:#fff;border-color:var(--ink)}
.rk > b{font-size:13px;font-weight:600;width:132px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-bar{flex:1;height:8px;border-radius:20px;background:var(--line-2);overflow:hidden;min-width:40px}
.rk-bar i{display:block;height:100%;border-radius:20px;background:var(--ink)}
.rk:first-child .rk-bar i{background:var(--ok)}
.rk-n{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;width:38px;text-align:right;flex-shrink:0}

.mpbar{height:16px;border-radius:20px;overflow:hidden;display:flex;gap:3px;margin-bottom:16px}
.mpbar i{display:block;height:100%;border-radius:20px}
.mplist{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.mpi{display:flex;align-items:center;gap:9px;font-size:13.5px}
.dot2{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.mpi b{font-weight:600}
.mpq{color:var(--muted);font-size:12.5px;margin-left:auto}
.mpp{font-family:var(--fd);font-size:15px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;width:42px;text-align:right}

/* ---- CONFIGURACIÓN ---- */
.cfg-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:start;max-width:1180px}
@media(max-width:980px){.cfg-grid{grid-template-columns:1fr}}
.logo-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--line-2)}
.logo-up{width:64px;height:64px;border-radius:14px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:22px;flex-shrink:0;cursor:pointer;transition:.12s}
.logo-up:hover{filter:brightness(1.15)}
.sw{width:30px;height:30px;border-radius:8px;border:2px solid transparent;cursor:pointer;box-shadow:0 0 0 1px var(--line) inset}
.sw.on{border-color:var(--ink);box-shadow:0 0 0 2px #fff inset}
.biz-prev{display:grid;grid-template-columns:118px 1fr;gap:12px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.bp-l{background:var(--ink);padding:11px 9px}
.bp-brand{display:flex;align-items:center;gap:7px;margin-bottom:11px}
.bp-mark{width:18px;height:18px;border-radius:5px;background:var(--signal);flex-shrink:0}
.bp-brand b{color:#fff;font-family:var(--fd);font-size:10.5px;font-weight:800}
.bp-cta{background:var(--signal);color:#fff;font-size:9.5px;font-weight:700;text-align:center;padding:5px;border-radius:6px;margin-bottom:8px}
.bp-item{color:rgba(255,255,255,.5);font-size:9.5px;padding:4px 6px;border-radius:4px}
.bp-item.on{background:rgba(255,255,255,.12);color:#fff;font-weight:600}
.bp-r{background:#fff;padding:12px;margin:9px 9px 9px 0;border-radius:8px;border:1px solid var(--line)}
.bp-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.bp-logo{width:24px;height:24px;border-radius:6px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:9px;flex-shrink:0}
.bp-head b{font-family:var(--fd);font-size:11px;font-weight:800}
.bp-ln{height:7px;border-radius:20px;background:var(--line-2);margin-bottom:6px}
.bp-ln.short{width:62%}
.bp-btn{background:var(--ink);color:#fff;font-size:9.5px;font-weight:700;text-align:center;padding:7px;border-radius:6px;margin-top:11px}

.intg{display:flex;align-items:center;gap:12px;padding:13px 15px;border-bottom:1px solid var(--line-2)}
.ig-m{width:36px;height:36px;border-radius:9px;background:#E8EBE6;color:var(--muted);display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:12px;flex-shrink:0}
.ig-t{flex:1;min-width:0}
.ig-t b{font-size:13.5px;font-weight:600;display:block}
.ig-t span{font-size:11.5px;color:var(--muted);display:block;margin-top:1px}
.intg-body{padding:14px 15px;background:#FBFCFA;border-bottom:1px solid var(--line-2)}

.msg-wrap{display:grid;grid-template-columns:280px 1fr;gap:15px;align-items:start;max-width:1080px}
@media(max-width:900px){.msg-wrap{grid-template-columns:1fr}}
.msg-states{display:flex;flex-direction:column;gap:7px}
.ms{display:flex;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 13px;cursor:pointer;transition:.12s;text-align:left;width:100%}
.ms:hover{border-color:#C4CBC2}
.ms.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:var(--paper)}
.ms-d{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.ms-t{flex:1;min-width:0}
.ms-t b{font-size:13px;font-weight:600;display:block}
.ms-t span{font-size:11.5px;color:var(--muted);display:block;margin-top:1px}
.ms-on{font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px;background:var(--ok-bg);color:var(--ok);flex-shrink:0}
.ms-off{background:#F1F3EF;color:var(--faint)}

/* ---- CONFIG FORMULARIO ---- */
.form-wrap{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start;max-width:1080px}
@media(max-width:980px){.form-wrap{grid-template-columns:1fr}}
.fm-side{position:sticky;top:76px}
.zones{display:flex;gap:6px;flex-wrap:wrap}
.zn{font-size:12px;font-weight:600;padding:5px 11px;border-radius:20px;border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer;transition:.12s}
.zn:hover{border-color:#C4CBC2}
.zn.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.phone-sm{border:7px solid var(--ink);border-radius:26px;overflow:hidden;background:#fff;box-shadow:0 10px 28px rgba(19,26,38,.15)}
.psc-sm{height:520px;overflow-y:auto;background:#fff}
.psc-sm::-webkit-scrollbar{width:0}
.pv-head{padding:12px 14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px}
.pv-logo{width:30px;height:30px;border-radius:8px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:12px;flex-shrink:0}
.pv-head b{font-family:var(--fd);font-size:12.5px;font-weight:800;display:block;line-height:1.1}
.pv-head span{font-size:8.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-weight:600}
.pv-body{padding:13px 14px 18px}
.pv-wel{font-size:12px;color:var(--muted);margin-bottom:11px;line-height:1.45}
.pv-card{display:flex;gap:9px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:9px;margin-bottom:11px}
.pv-img{width:34px;height:34px;border-radius:7px;background:repeating-linear-gradient(45deg,#E8EBE6,#E8EBE6 5px,#F2F4F0 5px,#F2F4F0 10px);display:flex;align-items:center;justify-content:center;color:var(--faint);flex-shrink:0}
.pv-card b{font-size:11.5px;font-weight:600;display:block}
.pv-card span{font-size:10.5px;color:var(--muted)}
.pv-cut{display:flex;align-items:center;gap:7px;background:var(--signal-bg);border:1px solid var(--signal-line);border-radius:8px;padding:8px 10px;font-size:10.5px;color:#B24708;margin-bottom:13px;line-height:1.35}
.pv-cut svg{color:var(--signal);flex-shrink:0}
.pv-cut b{color:#8C3A05}
.pv-f{margin-bottom:11px}
.pv-f > span{font-size:10.5px;font-weight:600;display:block;margin-bottom:4px}
.pv-in{height:34px;border:1px solid var(--line);border-radius:8px;background:#FBFCFA}
.pv-in.srch2{display:flex;align-items:center;gap:7px;padding:0 10px;font-size:11px;color:var(--faint)}
.pv-duo{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pv-duo span{text-align:center;padding:8px;border:1px solid var(--line);border-radius:8px;font-size:11px;font-weight:600;color:var(--muted)}
.pv-duo span.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pv-btn{background:var(--ink);color:#fff;text-align:center;padding:11px;border-radius:9px;font-size:12.5px;font-weight:600;margin-top:14px}
.pv-foot{margin-top:16px;padding-top:12px;border-top:1px solid var(--line-2);font-size:9.5px;color:var(--faint);text-align:center;line-height:1.6}
.pv-foot b{color:var(--muted)}
.pv-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.pv-links span{font-size:9px;text-decoration:underline}

/* ---- ROTULADO ---- */
.fmts{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.fmt{text-align:left;border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;background:#fff;font-size:12.5px;font-weight:600;transition:.12s}
.fmt:hover{border-color:#C4CBC2}
.fmt.on{border-color:var(--ink);background:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.fmt em{display:block;font-style:normal;font-size:11px;font-weight:500;color:var(--muted);margin-top:2px}
.custom{display:flex;align-items:flex-end;gap:9px;margin-top:9px;padding:11px;background:#FBFCFA;border:1px solid var(--line);border-radius:var(--r-sm)}
.cs-f{flex:1}
.cs-f label{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px}
.cs-in{display:flex;align-items:center;height:34px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;padding:0 10px}
.cs-in input{border:none;outline:none;flex:1;font-size:13px;font-weight:600;min-width:0;font-variant-numeric:tabular-nums}
.cs-in span{font-size:11.5px;color:var(--faint);flex-shrink:0}
.cs-x{color:var(--faint);font-size:13px;padding-bottom:9px}
.presets{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.presets span{font-size:11px;font-weight:600;padding:3px 9px;border-radius:5px;background:var(--paper);border:1px solid var(--line);color:var(--muted);cursor:pointer;transition:.1s}
.presets span:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.rot{width:340px;transition:width .18s}
.rnota{padding:11px;text-align:center;border-top:1.5px solid #000;background:#F2F2F2}
.rnota span{font-family:var(--fd);font-size:15px;font-weight:800;letter-spacing:.06em}
.rnota:empty,.rnota span:empty{display:none}
.rot-meta{text-align:center;font-size:11.5px;color:var(--muted);margin-top:9px;font-variant-numeric:tabular-nums}

/* ---- BARRA DE TAMAÑO ---- */
.sizebar{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:11px;margin-bottom:12px}
.sizebar .fmts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.sizebar .fmt{padding:8px 10px;font-size:12px}
.sizebar .fmt em{font-size:10.5px}
.sizebar .custom{margin-top:8px}
@media(max-width:1200px){.sizebar .fmts{grid-template-columns:repeat(2,1fr)}}

/* ================= RESPONSIVE ================= */
.mtop{display:none}
.navov{display:none}
@media(max-width:900px){
  .mtop{display:flex;align-items:center;gap:12px;position:fixed;top:0;left:0;right:0;height:54px;background:var(--ink);z-index:80;padding:0 12px}
  .mbtn,.mcta{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
  .mbtn{background:rgba(255,255,255,.1)}
  .mcta{background:var(--signal);margin-left:auto}
  .mbrand{display:flex;align-items:center;gap:8px;color:#fff;font-family:var(--fd);font-size:14px;font-weight:800}
  .mmark{width:24px;height:24px;border-radius:6px;background:var(--signal);display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .navov{position:fixed;inset:0;background:rgba(19,26,38,.5);z-index:88}
  .navov.on{display:block}
  .nav{position:fixed;top:0;left:0;bottom:0;z-index:89;transform:translateX(-100%);transition:transform .22s ease;width:250px}
  .nav.on{transform:translateX(0)}
  .app{display:block}
  .stage{padding-top:54px}
  .top{padding:12px 14px;flex-wrap:wrap;gap:10px;top:54px}
  .top h1{font-size:17px}
  .top .rt{margin-left:0;width:100%;flex-wrap:wrap}
  .top .rt .srch{flex:1;min-width:140px}
  .body{padding:14px 14px 70px}
  .kpis{grid-template-columns:1fr 1fr}
  .card{overflow-x:auto}
  .tbl{min-width:620px}
  .seg{overflow-x:auto;max-width:100%}
  .seg button{white-space:nowrap;flex-shrink:0}
  .dispatch-bar{gap:14px}
  .dispatch-bar .db-group{width:100%}
  .rotwrap,.form-wrap,.msg-wrap,.cfg-grid,.split,.split3,.map-wrap{grid-template-columns:1fr!important}
  .fm-side{position:static}
  .lprev{padding:16px}
  .rot{max-width:100%}
  .phones{gap:20px}
  .pcol{width:100%;max-width:390px}
  .drawer{width:100%;max-width:100%}
  .modal{max-width:100%!important}
  .mb{max-height:none!important}
  .task{flex-wrap:wrap}
  .tbtn{width:100%;margin-top:6px}
  .steps{grid-template-columns:1fr 1fr}
  .biz-prev{grid-template-columns:1fr}
  .bp-l{display:flex;gap:8px;align-items:center;padding:10px}
  .bp-brand,.bp-cta{margin:0}
  .imp-tabs{grid-template-columns:repeat(2,1fr)}
  .imp-tab{border-bottom:1px solid var(--line-2)}
  .calpop{left:auto!important;right:0!important}
}
@media(max-width:620px){
  .kpis,.minicards,.grid-p{grid-template-columns:1fr}
  .duo,.fmts,.sizebar .fmts,.nvrow,.casc{grid-template-columns:1fr!important;display:grid!important}
  .nvrow > *{width:auto!important}
  .steps{grid-template-columns:1fr}
  .st{border-right:none;border-bottom:1px solid var(--line-2)}
  .tv{flex-direction:column;align-items:stretch;gap:16px}
  .tv-r{width:100%}
  .tv-x{flex:1}
  .tv-n{font-size:40px}
  .mplist{grid-template-columns:1fr}
  .etas{grid-template-columns:1fr 1fr}
  .rk > b{width:96px}
  .top h1{font-size:16px}
  .ch{flex-wrap:wrap}
  .ch .rt{margin-left:0;width:100%}
  .mf{flex-wrap:wrap}
  .mf .note{width:100%;order:-1;margin-bottom:6px}
  .mf .ctl{flex:1;justify-content:center}
  .sec-h{flex-wrap:wrap}
}

.bar{height:6px;border-radius:20px;background:var(--line-2);overflow:hidden;display:flex}
.bar i{display:block;height:100%}

/* ---- RESUMEN ---- */
.dash{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;align-items:start;max-width:1180px;margin:0 auto}
@media(max-width:1100px){.dash{grid-template-columns:1fr}}
.dash-l,.dash-r{min-width:0}
.sec-h{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.sec-h h2{font-family:var(--fd);font-size:15px;font-weight:700;letter-spacing:-.02em}
.sec-h span{font-size:12.5px;color:var(--muted)}
.minicards{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
@media(max-width:820px){.minicards{grid-template-columns:repeat(2,1fr)}}
.mini{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 15px;min-width:0}
.mini.link{cursor:pointer;transition:.12s}
.mini.link:hover{border-color:var(--ink);background:#FBFCFA}
.mn-l{display:block;font-size:11.5px;color:var(--muted);font-weight:500}
.mn-v{display:block;font-family:var(--fd);font-size:21px;font-weight:800;letter-spacing:-.03em;margin-top:5px;font-variant-numeric:tabular-nums;line-height:1.05}
.mn-s{display:block;font-size:11.5px;color:var(--faint);margin-top:5px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed{padding:4px 0}
.fd{display:flex;gap:12px;padding:11px 16px;border-bottom:1px solid var(--line-2)}
.fd:last-of-type{border-bottom:none}
.fd-d{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:5px}
.fd-d.ok{background:var(--ok)}
.fd-d.sig{background:var(--signal)}
.fd-d.tr{background:var(--transit)}
.fd-b{min-width:0}
.fd-b b{font-size:13px;font-weight:600;display:block}
.fd-b span{font-size:12px;color:var(--muted);display:block;margin-top:1px;line-height:1.4}
.fd-b em{font-size:11px;color:var(--faint);font-style:normal;display:block;margin-top:3px}
.fd-foot{padding:11px 16px;border-top:1px solid var(--line-2)}
.fd-foot .ctl{width:100%;justify-content:center}
.todo{display:flex;flex-direction:column;gap:10px}
.task{display:flex;align-items:center;gap:15px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 20px}
.task.urgent{border-color:var(--signal-line);background:var(--signal-bg)}
.tic{width:46px;height:46px;border-radius:12px;background:var(--paper);color:var(--muted);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.task.urgent .tic{background:#fff;color:var(--signal)}
.tic.gold{background:var(--gold-bg);color:var(--gold)}
.tic.red{background:var(--danger-bg);color:var(--danger)}
.tic.blue{background:var(--transit-bg);color:var(--transit)}
.ttx{flex:1;min-width:0}
.ttx b{font-family:var(--fd);font-size:17px;font-weight:700;letter-spacing:-.02em;display:block;line-height:1.25}
.ttx span{font-size:14px;color:var(--muted);display:block;margin-top:3px;line-height:1.4}
.task.urgent .ttx b{color:#8C3A05}
.task.urgent .ttx span{color:#B24708}
.tbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;border-radius:10px;font-size:15px;font-weight:600;flex-shrink:0;transition:.12s}
.tbtn.wa{background:#25D366;color:#fff}
.tbtn.wa:hover{filter:brightness(1.06)}
.tbtn.light{background:var(--surface);color:var(--text);border:1px solid var(--line)}
.tbtn.light:hover{border-color:#C4CBC2;background:#FBFCFA}
.tbtn.dark{background:var(--ink);color:#fff}
.tbtn.dark:hover{background:var(--ink-2)}
.doneline{display:flex;align-items:center;gap:11px;margin-top:12px;padding:14px 20px;background:var(--ok-bg);border:1px solid var(--ok-line);border-radius:12px;color:var(--ok);font-size:14px;font-weight:500}
.doneline .ctl{margin-left:auto;background:#fff}
.empty{max-width:640px;text-align:center;padding:70px 20px;margin:0 auto}
.empty .eic{width:64px;height:64px;border-radius:50%;background:var(--ok-bg);color:var(--ok);display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.empty .eic svg{width:30px;height:30px}
.empty b{font-family:var(--fd);font-size:21px;font-weight:700;letter-spacing:-.02em;display:block}
.empty p{font-size:15px;color:var(--muted);margin-top:6px}
@media(max-width:640px){
  .task{flex-wrap:wrap}
  .tbtn{width:100%;margin-top:4px}
}
</head>
<body>

<svg style="display:none">
<symbol id="i-box" viewBox="0 0 24 24"><path d="M21 8v8a2 2 0 0 1-1 1.7l-7 4a2 2 0 0 1-2 0l-7-4A2 2 0 0 1 3 16V8a2 2 0 0 1 1-1.7l7-4a2 2 0 0 1 2 0l7 4A2 2 0 0 1 21 8z"/><path d="m3.3 7 8.7 5 8.7-5M12 22V12"/></symbol>
<symbol id="i-home" viewBox="0 0 24 24"><path d="m3 10 9-7 9 7v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M9 22V12h6v10"/></symbol>
<symbol id="i-list" viewBox="0 0 24 24"><path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01"/></symbol>
<symbol id="i-kanban" viewBox="0 0 24 24"><rect x="3" y="3" width="5" height="18" rx="1"/><rect x="9.5" y="3" width="5" height="12" rx="1"/><rect x="16" y="3" width="5" height="15" rx="1"/></symbol>
<symbol id="i-grid" viewBox="0 0 24 24"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></symbol>
<symbol id="i-layers" viewBox="0 0 24 24"><path d="m12 2 9 5-9 5-9-5z"/><path d="m3 12 9 5 9-5M3 17l9 5 9-5"/></symbol>
<symbol id="i-chart" viewBox="0 0 24 24"><path d="M3 3v16a2 2 0 0 0 2 2h16"/><path d="M7 14l3-4 3 3 5-6"/></symbol>
<symbol id="i-link" viewBox="0 0 24 24"><path d="M10 13a5 5 0 0 0 7.5.5l3-3a5 5 0 0 0-7-7l-1.7 1.7"/><path d="M14 11a5 5 0 0 0-7.5-.5l-3 3a5 5 0 0 0 7 7l1.7-1.7"/></symbol>
<symbol id="i-pin" viewBox="0 0 24 24"><path d="M20 10c0 5.5-8 12-8 12s-8-6.5-8-12a8 8 0 0 1 16 0z"/><circle cx="12" cy="10" r="2.6"/></symbol>
<symbol id="i-cog" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.6 1.6 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.6 1.6 0 0 0-1.8-.3 1.6 1.6 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1A1.6 1.6 0 0 0 9 19.4a1.6 1.6 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.6 1.6 0 0 0 .3-1.8 1.6 1.6 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1A1.6 1.6 0 0 0 4.6 9a1.6 1.6 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.6 1.6 0 0 0 1.8.3H9a1.6 1.6 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.6 1.6 0 0 0 1 1.5 1.6 1.6 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.6 1.6 0 0 0-.3 1.8V9a1.6 1.6 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.6 1.6 0 0 0-1.5 1z"/></symbol>
<symbol id="i-menu" viewBox="0 0 24 24"><path d="M3 6h18M3 12h18M3 18h18"/></symbol>
<symbol id="i-store" viewBox="0 0 24 24"><path d="M3 9h18l-1.5-5.2A1 1 0 0 0 18.5 3h-13a1 1 0 0 0-1 .8z"/><path d="M4 9v11a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V9"/><path d="M9 21v-6h6v6"/></symbol>
<symbol id="i-tag" viewBox="0 0 24 24"><path d="M12.6 2.7a2 2 0 0 0-1.4-.6H4a2 2 0 0 0-2 2v7.2a2 2 0 0 0 .6 1.4l8.4 8.4a2 2 0 0 0 2.8 0l7.2-7.2a2 2 0 0 0 0-2.8z"/><circle cx="7.5" cy="7.5" r="1.2" fill="currentColor" stroke="none"/></symbol>
<symbol id="i-code" viewBox="0 0 24 24"><path d="m16 18 6-6-6-6M8 6l-6 6 6 6"/></symbol>
<symbol id="i-plug" viewBox="0 0 24 24"><path d="M9 2v6M15 2v6"/><path d="M6 8h12v3a6 6 0 0 1-12 0z"/><path d="M12 17v5"/></symbol>
<symbol id="i-check" viewBox="0 0 24 24"><path d="m20 6-11 11-5-5"/></symbol>
<symbol id="i-x" viewBox="0 0 24 24"><path d="M18 6 6 18M6 6l12 12"/></symbol>
<symbol id="i-alert" viewBox="0 0 24 24"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z"/><path d="M12 9v4M12 17h.01"/></symbol>
<symbol id="i-clock" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></symbol>
<symbol id="i-dl" viewBox="0 0 24 24"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5M12 15V3"/></symbol>
<symbol id="i-sync" viewBox="0 0 24 24"><path d="M3 12a9 9 0 0 1 15-6.7L21 8"/><path d="M21 3v5h-5"/><path d="M21 12a9 9 0 0 1-15 6.7L3 16"/><path d="M3 21v-5h5"/></symbol>
<symbol id="i-search" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></symbol>
<symbol id="i-wa" viewBox="0 0 24 24"><path d="M21 11.5a8.4 8.4 0 0 1-12.6 7.3L3 20.5l1.8-5.2A8.5 8.5 0 1 1 21 11.5z"/><path d="M8.5 9.5c0 3 2.5 5.5 5.5 5.5" stroke-width="1.5"/></symbol>
<symbol id="i-truck" viewBox="0 0 24 24"><path d="M14 17V5a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h2"/><path d="M14 8h4l3 3.5V16a1 1 0 0 1-1 1h-1"/><circle cx="6.5" cy="17.5" r="2"/><circle cx="17.5" cy="17.5" r="2"/></symbol>
<symbol id="i-print" viewBox="0 0 24 24"><path d="M6 9V3h12v6"/><path d="M6 18H4a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-2"/><path d="M6 14h12v7H6z"/></symbol>
<symbol id="i-doc" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6M9 15h6M9 11h3"/></symbol>
<symbol id="i-info" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 16v-4M12 8h.01"/></symbol>
<symbol id="i-user" viewBox="0 0 24 24"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></symbol>
<symbol id="i-card" viewBox="0 0 24 24"><rect x="2" y="5" width="20" height="14" rx="2"/><path d="M2 10h20"/></symbol>
<symbol id="i-cv" viewBox="0 0 24 24"><path d="m6 9 6 6 6-6"/></symbol>
<symbol id="i-plus" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></symbol>
<symbol id="i-cal" viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4"/></symbol>
<symbol id="i-up" viewBox="0 0 24 24"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m17 8-5-5-5 5M12 3v12"/></symbol>
<symbol id="i-lock" viewBox="0 0 24 24"><rect x="4" y="10" width="16" height="11" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></symbol>
<symbol id="i-trash" viewBox="0 0 24 24"><path d="M3 6h18M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/></symbol>
<symbol id="i-cam" viewBox="0 0 24 24"><path d="M3 8a2 2 0 0 1 2-2h2.5l1.3-2h6.4l1.3 2H19a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><circle cx="12" cy="13" r="3.5"/></symbol>
<symbol id="i-spark" viewBox="0 0 24 24"><path d="M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9z"/><path d="M19 15l.8 2.2L22 18l-2.2.8L19 21l-.8-2.2L16 18l2.2-.8z"/></symbol>
</svg>

<div class="mtop">
  <button class="mbtn" onclick="toggleNav()"><svg class="i"><use href="#i-menu"/></svg></button>
  <div class="mbrand"><span class="mmark"><svg class="i sm" style="stroke-width:2;color:#fff"><use href="#i-box"/></svg></span> Tu marca</div>
  <button class="mcta" onclick="openNew()"><svg class="i sm"><use href="#i-plus"/></svg></button>
</div>
<div class="navov" id="navov" onclick="toggleNav()"></div>
<div class="app">
<aside class="nav">
  <div class="brand">
    <div class="mark"><svg class="i" style="stroke-width:2;color:#fff"><use href="#i-box"/></svg></div>
    <div><div class="bn">Tu marca</div><div class="bs">Envíos COD</div></div>
  </div>

  <button class="nav-cta" onclick="openNew()"><svg class="i"><use href="#i-plus"/></svg> Nuevo envío</button>

  <div class="ng"><span>Operación</span></div>
  <a href="#" class="on" data-go="dash"><svg class="i"><use href="#i-home"/></svg> Resumen</a>
  <a href="#" data-go="pedidos"><svg class="i"><use href="#i-list"/></svg> Pedidos <span class="cnt">42</span></a>
  <a href="#" data-go="seguimiento"><svg class="i"><use href="#i-kanban"/></svg> Envíos <span class="cnt al">3</span></a>
  <a href="#" data-go="catalogo"><svg class="i"><use href="#i-grid"/></svg> Catálogo</a>
  <a href="#" data-go="lotes"><svg class="i"><use href="#i-layers"/></svg> Despachar</a>
  <a href="#" data-go="rentabilidad"><svg class="i"><use href="#i-chart"/></svg> Ventas</a>

  <div class="nf">
    <div class="cfg" id="cfg">
      <div class="cfg-pop">
        <a href="#" data-go="negocio"><svg class="i sm"><use href="#i-store"/></svg> Mi negocio</a>
        <a href="#" data-go="rotulado"><svg class="i sm"><use href="#i-tag"/></svg> Rotulado</a>
        <a href="#" data-go="formulario"><svg class="i sm"><use href="#i-doc"/></svg> Formulario</a>
        <a href="#" data-go="mensajes"><svg class="i sm"><use href="#i-wa"/></svg> Mensajes</a>
        <a href="#" data-go="integraciones"><svg class="i sm"><use href="#i-plug"/></svg> Integraciones</a>
      </div>
      <button class="cfg-b" onclick="toggleCfg(event)">
        <svg class="i"><use href="#i-cog"/></svg> Configuración
        <svg class="i sm cfg-cv"><use href="#i-cv"/></svg>
      </button>
    </div>
    <div class="plan"><b>Plan Pro</b><span>S/ 39.90 al mes · renueva 14 set</span></div>
  </div>
</aside>