/* Modestan · Sistema de gestión — diseño v3 "Sobrio" (29/10/2026).
   Neutro, plano y con un solo acento (el rojo de la marca, solo para la acción principal y alertas).
   La estructura de las pantallas es la de v2; v3 cambia tokens y, al final del archivo, la capa "sobrio". */
@font-face{font-family:"Archivo";src:url(/assets/fonts/archivo-latin-wdth-normal.woff2) format("woff2-variations"),url(/assets/fonts/archivo-latin-wdth-normal.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Big Shoulders Display";src:url(/assets/fonts/big-shoulders-display-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --bg:#F6F7F9; --surface:#FFFFFF; --surface-2:#F9FAFB; --surface-3:#F1F3F5; --line:#E3E6EA; --line-strong:#D0D5DB;
  --ink:#14161A; --muted:#5D6470; --faint:#8A919B;
  --brand-red:#E40D18; --red:#D70F19; --red-ink:#B40C15; --red-soft:#FDECEC;
  --ok:#157A46; --ok-soft:#E7F4EC; --warn:#935600; --warn-soft:#FBF1E0;
  --c-venta:#D70F19; --c-presu:#5D6470; --c-caja:#5D6470; --c-stock:#5D6470; --c-combo:#5D6470; --c-cli:#5D6470; --c-aud:#5D6470; --c-fac:#5D6470;   /* un solo acento: el rojo de la marca */
  --draw:#2B2F35; --draw-soft:#B4AFA6; --shelf:#F0EDE8;
  --shadow:0 1px 2px rgba(16,24,40,.04);
  --shadow-lg:0 10px 30px rgba(16,24,40,.14);
  --font:"Archivo","Segoe UI",system-ui,sans-serif;
  --display:"Big Shoulders Display","Archivo",sans-serif;
  --mono:ui-monospace,"Cascadia Mono",Consolas,monospace;
  --r:10px; --r-md:8px; --r-sm:6px;
  --side-w:252px; --z-sticky:10; --z-nav:20; --z-toast:90;
  --ease:cubic-bezier(.32,.72,0,1); --scrim:rgba(15,18,22,.42);
  --logo:url(/assets/logo/logo-completo-sobre-claro.png);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0F1012; --surface:#16171A; --surface-2:#191B1E; --surface-3:#202226; --line:#2A2D32; --line-strong:#383C43;
  --ink:#ECEDEF; --muted:#A3A8B0; --faint:#7D838C;
  --red:#F0444C; --red-ink:#FF6B72; --red-soft:#2E1517; --ok:#4CBF86; --ok-soft:#14261C; --warn:#E5A44E; --warn-soft:#2D2210;
  --c-venta:#F0444C; --c-presu:#A3A8B0; --c-caja:#A3A8B0; --c-stock:#A3A8B0; --c-combo:#A3A8B0; --c-cli:#A3A8B0; --c-aud:#A3A8B0; --c-fac:#A3A8B0;
  --draw:#D5D9DE; --draw-soft:#5E656E; --shelf:#24272B;
  --shadow:0 1px 2px rgba(0,0,0,.25); --shadow-lg:0 10px 30px rgba(0,0,0,.45); --scrim:rgba(0,0,0,.6);
  --logo:url(/assets/logo/logo-completo-sobre-oscuro.png); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0F1012; --surface:#16171A; --surface-2:#191B1E; --surface-3:#202226; --line:#2A2D32; --line-strong:#383C43;
  --ink:#ECEDEF; --muted:#A3A8B0; --faint:#7D838C;
  --red:#F0444C; --red-ink:#FF6B72; --red-soft:#2E1517; --ok:#4CBF86; --ok-soft:#14261C; --warn:#E5A44E; --warn-soft:#2D2210;
  --c-venta:#F0444C; --c-presu:#A3A8B0; --c-caja:#A3A8B0; --c-stock:#A3A8B0; --c-combo:#A3A8B0; --c-cli:#A3A8B0; --c-aud:#A3A8B0; --c-fac:#A3A8B0;
  --draw:#D5D9DE; --draw-soft:#5E656E; --shelf:#24272B;
  --shadow:0 1px 2px rgba(0,0,0,.25); --shadow-lg:0 10px 30px rgba(0,0,0,.45); --scrim:rgba(0,0,0,.6);
  --logo:url(/assets/logo/logo-completo-sobre-oscuro.png); color-scheme:dark}

*{box-sizing:border-box}
html,body{height:100%}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 var(--font);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent;transition:background-color .25s}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:2.5px solid var(--red);outline-offset:2px}
[hidden]{display:none!important}
.num{font-variant-numeric:tabular-nums}
.fig{font-stretch:88%;font-weight:680;letter-spacing:-.015em}
.code{font-family:var(--mono);font-size:12px;color:var(--muted)}
.muted{color:var(--muted)} .faint{color:var(--faint)}
.up{color:var(--ok)} .down{color:var(--red-ink)}
.r{text-align:right}
.logo{display:block;background:var(--logo) no-repeat left center/contain;aspect-ratio:240/143}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- módulos: color e ícono ---------- */
[data-mod]{--mc:var(--muted)}
[data-mod="venta"],[data-mod="ventas"]{--mc:var(--c-venta)} [data-mod="presupuestos"]{--mc:var(--c-presu)} [data-mod="caja"]{--mc:var(--c-caja)}
[data-mod="stock"]{--mc:var(--c-stock)} [data-mod="combos"]{--mc:var(--c-combo)} [data-mod="clientes"]{--mc:var(--c-cli)}
[data-mod="auditoria"],[data-mod="usuarios"]{--mc:var(--c-aud)} [data-mod="comprobantes"],[data-mod="facturacion"]{--mc:var(--c-fac)} [data-mod="inicio"],[data-mod="ayuda"],[data-mod="mas"]{--mc:var(--ink)}
.chip-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none;color:var(--mc);background:color-mix(in srgb,var(--mc) 13%,transparent)}
.chip-ic svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9}
.chip-ic.lg{width:48px;height:48px;border-radius:14px}
.chip-ic.lg svg{width:24px;height:24px}

/* ---------- shell ---------- */
.app{display:grid;grid-template-columns:var(--side-w) minmax(0,1fr);min-height:100%}
.side{position:sticky;top:0;height:100vh;height:100dvh;display:flex;flex-direction:column;padding:20px 14px 14px;background:var(--surface);border-right:1px solid var(--line)}
.brand{padding:0 8px 18px;display:flex;align-items:center;gap:10px}
.brand .logo{width:96px}
.env{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--warn);background:var(--warn-soft);padding:3px 8px;border-radius:999px;margin-left:auto}
.nav{display:flex;flex-direction:column;gap:2px;overflow:auto;margin:0 -4px;padding:0 4px}
.nav .grp{margin:16px 10px 6px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.nav .grp:first-child{margin-top:2px}
.nav a{display:flex;align-items:center;gap:11px;padding:6px 8px;border-radius:12px;color:var(--muted);font-size:14.5px;font-weight:560;text-decoration:none;transition:background-color .15s,color .15s}
.nav a .chip-ic{width:30px;height:30px;border-radius:9px}
.nav a .chip-ic svg{width:17px;height:17px}
.nav a:hover{background:var(--surface-3);color:var(--ink)}
.nav a[aria-current="page"]{background:color-mix(in srgb,var(--mc) 10%,var(--surface));color:var(--ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mc) 25%,transparent)}
.nav a[aria-current="page"] .chip-ic{background:var(--mc);color:#fff}
.nav .pronto{margin-left:auto;font-size:10.5px;font-weight:650;color:var(--faint);background:var(--surface-3);padding:1px 7px;border-radius:999px}
.side-cta{margin:4px 0 14px}
.side-foot{margin-top:auto;padding:12px 8px 2px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;font-size:13px}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--ink);display:grid;place-items:center;font-weight:700;font-size:13px;color:var(--surface);flex:none}
.side-foot .who{min-width:0;line-height:1.3}
.side-foot .who span{font-weight:620}
.side-foot small{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.out-btn{all:unset;cursor:pointer;margin-left:auto;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:var(--muted);flex:none}
.out-btn:hover{background:var(--surface-3);color:var(--ink)}
.out-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}

.main{min-width:0;display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;gap:10px;padding:12px 32px;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.mbrand{display:none}
.search{flex:1;min-width:0;max-width:440px;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px 12px;color:var(--faint);box-shadow:var(--shadow)}
.search:focus-within{border-color:var(--ink)}
.search svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.search input{border:0;background:none;outline:none;flex:1;min-width:0;color:var(--ink)}
.search input::placeholder{color:var(--muted)}
.kbd{font:600 11px var(--mono);color:var(--faint);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:1px 6px;white-space:nowrap}
.top .sp{flex:1}
.seg{display:inline-flex;background:var(--surface-3);border-radius:12px;padding:3px;gap:2px}
.seg button{all:unset;cursor:pointer;padding:6px 12px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--muted);display:inline-flex;align-items:center;gap:6px;transition:background-color .15s,color .15s}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.seg button:focus-visible{outline:2px solid var(--red)}
.seg svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9}
.tema-sw{display:inline-flex;background:var(--surface-3);border-radius:999px;padding:3px;gap:2px}
.tema-sw button{all:unset;cursor:pointer;width:32px;height:30px;border-radius:999px;display:grid;place-items:center;color:var(--muted)}
.tema-sw button svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9}
.tema-sw button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.icon-btn{all:unset;cursor:pointer;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);flex:none;transition:background-color .15s}
.icon-btn:hover{background:var(--surface-3)}
.icon-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.icon-btn:focus-visible{outline:2px solid var(--red)}
.icon-btn.sm{width:32px;height:32px;border-radius:9px}
.icon-btn[disabled]{opacity:.35;pointer-events:none}
.suc-sel{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:8px 12px;font-size:13.5px;font-weight:600;max-width:200px}
.vercomo{font-size:12.5px;color:var(--warn);background:var(--warn-soft);padding:6px 12px;border-radius:999px;white-space:nowrap;font-weight:650}

.view{padding:28px 32px 72px;display:flex;flex-direction:column;gap:22px;max-width:1360px;width:100%;margin:0 auto}
.head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.head h1{margin:0;font:700 38px/1 var(--display);text-transform:uppercase;letter-spacing:.01em;text-wrap:balance}
.head .ctx{margin:6px 0 0;color:var(--muted);font-size:14.5px}
.head .actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.help-link{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);padding:6px 11px;border-radius:999px;border:1px dashed var(--line-strong)}
.help-link:hover{color:var(--ink);border-style:solid}
.help-link svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.back{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-size:13.5px;font-weight:600;color:var(--muted);margin-bottom:8px}
.back:hover{color:var(--red-ink)}
.back svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}

.btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 16px;min-height:42px;border-radius:12px;font-weight:620;font-size:14.5px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);white-space:nowrap;transition:background-color .15s,border-color .15s,transform .12s,box-shadow .15s}
.btn:hover{background:var(--surface-3)}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 4px 14px color-mix(in srgb,var(--red) 30%,transparent)}
.btn.primary:hover{background:var(--red-ink);border-color:var(--red-ink)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.btn.ghost{border-color:transparent;background:transparent}
.btn.ghost:hover{background:var(--surface-3)}
.btn.danger{color:var(--red-ink)}
.btn.danger:hover{background:var(--red-soft);border-color:var(--red-soft)}
.btn:focus-visible{outline:2.5px solid var(--red);outline-offset:2px}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.btn[disabled]{opacity:.45;pointer-events:none;box-shadow:none}
.btn.sm{padding:6px 12px;min-height:34px;font-size:13.5px;border-radius:10px}
.btn.lg{min-height:52px;font-size:16px;padding:12px 22px;border-radius:14px}
.btn.block{width:100%}
.btn .spin,.spin{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.link{all:unset;cursor:pointer;margin-left:auto;font-size:13.5px;font-weight:620;color:var(--red-ink)}
.link:hover{text-decoration:underline}
a.link{text-decoration:none}

.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);min-width:0;box-shadow:var(--shadow)}
.panel > header{display:flex;align-items:center;gap:10px;padding:18px 20px 0;flex-wrap:wrap}
.panel > header h2{margin:0;font-size:16px;font-weight:700}
.panel > header .sub{color:var(--muted);font-size:13.5px}
.panel .body{padding:14px 20px 20px}

/* ---------- inicio ---------- */
.hello{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.hello h1{margin:0;font:700 44px/1 var(--display);text-transform:uppercase}
.hello p{margin:6px 0 0;color:var(--muted)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.tile{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);text-decoration:none;color:inherit;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s,border-color .15s;position:relative;overflow:hidden}
.tile::after{content:"";position:absolute;right:-30px;bottom:-30px;width:90px;height:90px;border-radius:50%;background:color-mix(in srgb,var(--mc) 8%,transparent)}
.tile:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:color-mix(in srgb,var(--mc) 40%,var(--line))}
.tile b{font-size:15.5px;font-weight:700}
.tile > div > span{font-size:13px;color:var(--muted);line-height:1.35}
.tile.hero{background:var(--red);border-color:var(--red);color:#fff;--mc:#fff}
.tile.hero > div > span{color:rgba(255,255,255,.85)}
.tile.hero .chip-ic{background:rgba(255,255,255,.2);color:#fff}
.tile.hero::after{background:rgba(255,255,255,.1)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.stats.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.stat{padding:16px 18px;display:flex;flex-direction:column;gap:4px;min-width:0;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.stat .l{font-size:13px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:8px}
.stat .l .chip-ic{width:26px;height:26px;border-radius:8px}
.stat .l .chip-ic svg{width:15px;height:15px}
.stat .v{font-size:28px;line-height:1.15}
.stat .d{font-size:13px;color:var(--muted)}
a.stat:hover{border-color:var(--line-strong)}
.cols{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:20px;align-items:start}
.cols-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.chart svg{width:100%;height:auto;display:block}
.chart .ax{fill:var(--faint);font:500 11px var(--font)}
.chart .gr{stroke:var(--line);stroke-width:1;stroke-dasharray:3 4}
.chart .bar{fill:color-mix(in srgb,var(--ink) 70%,transparent)}
.chart .bar.hoy{fill:var(--red)}
.chart .bar.cerr{fill:var(--line-strong)}
.alerts{display:flex;flex-direction:column;gap:8px}
.alert{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);text-decoration:none;color:inherit}
.alert.warn{background:var(--warn-soft);border-color:transparent}
.alert.bad{background:var(--red-soft);border-color:transparent}
.alert b{font-weight:650}
.alert .chev{margin-left:auto;color:var(--faint);display:flex}
.alert svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;flex:none}

.list{display:flex;flex-direction:column}
.item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 14px;padding:12px 0;border-top:1px solid var(--line);align-items:center;text-decoration:none;color:inherit}
.item:first-child{border-top:0}
.item.ic{grid-template-columns:auto minmax(0,1fr) auto}
.item.ic > .chip-ic{grid-row:1 / span 2}
.item .t{font-weight:600;min-width:0}
.item .s{font-size:13px;color:var(--muted)}
.item .r{grid-row:1 / span 2;grid-column:-2;text-align:right}
a.item:hover .t{color:var(--red-ink)}
.item .n{font-size:26px;line-height:1}
.item .s b{color:var(--red-ink);font-weight:600}

.pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:620;padding:3px 10px;border-radius:999px;white-space:nowrap}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.ok{color:var(--ok);background:var(--ok-soft)}
.pill.warn{color:var(--warn);background:var(--warn-soft)}
.pill.bad{color:var(--red-ink);background:var(--red-soft)}
.pill.neutral{color:var(--muted);background:var(--surface-3)}
.pill.neutral::before{display:none}

/* ---------- combos ---------- */
.combo-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:20px;align-items:start}
.clist{display:flex;flex-direction:column;padding:8px;gap:4px}
.clist a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 10px;padding:12px 14px;border-radius:12px;text-decoration:none;color:inherit}
.clist a:hover{background:var(--surface-3)}
.clist a[aria-current="true"]{background:color-mix(in srgb,var(--c-combo) 10%,var(--surface));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--c-combo) 40%,transparent)}
.clist .t{font-weight:620;font-size:14px}
.clist .s{font-size:12.5px;color:var(--muted)}
.clist .n{grid-row:1 / span 2;grid-column:2;align-self:center;font-size:22px}
.sheet > header{padding:20px 22px 0}
.sheet h2{margin:0;font-size:21px;font-weight:700;letter-spacing:-.01em}
.sheet .meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:4px;font-size:13.5px;color:var(--muted)}
.plan{display:grid;grid-template-columns:310px minmax(0,1fr);gap:8px 28px;padding:14px 22px 20px;align-items:start}
.drawing{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2);padding:12px;margin:0;background-image:radial-gradient(color-mix(in srgb,var(--ink) 9%,transparent) 1px,transparent 1px);background-size:14px 14px}
.drawing svg{display:block;width:100%;height:auto}
.drawing figcaption{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--line);margin-top:8px;padding-top:6px}
.dw-post{stroke:var(--draw);stroke-width:3.2;stroke-linecap:round}
.dw-post.back{stroke:var(--draw-soft)}
.dw-shelf{fill:var(--shelf);stroke:var(--draw);stroke-width:1.3;stroke-linejoin:round}
.dw-beam{stroke:var(--draw);stroke-width:3}
.dw-col{fill:#2F5FA8;stroke:var(--draw);stroke-width:.8}
.dw-hole{fill:var(--surface-2)}
.dw-plate{fill:var(--draw)}
.dw-beam-r{fill:#F08A1C;stroke:#B9600A;stroke-width:.8}
line.dw-beam-r.back{stroke:#C77416;stroke-width:3}
.dw-brace-r{stroke:#5B83C4;stroke-width:1.4}
.limit .dw-col{fill:var(--red)} .limit .dw-beam-r{fill:var(--red);stroke:var(--red-ink)} .limit .dw-brace-r{stroke:var(--red)}
.dw-bolt{fill:var(--draw)}
.dw-brace{fill:none;stroke:var(--draw);stroke-width:1.4}
.dw-dim{stroke:var(--muted);stroke-width:.9;fill:none}
.dw-dimt{fill:var(--muted);font:500 10.5px var(--font)}
.dw-ball circle{fill:var(--surface);stroke:var(--draw);stroke-width:1.1}
.dw-ball text{fill:var(--ink);font:650 10.5px var(--font)}
.dw-lead{stroke:var(--draw);stroke-width:.8;fill:none}
.limit .dw-shelf{fill:var(--red-soft);stroke:var(--red)}
.limit .dw-post{stroke:var(--red)}
.limit .dw-post.back{opacity:.4}
.limit .dw-bolt{fill:var(--red)}
.limit .dw-brace,.limit .dw-beam{stroke:var(--red)}
.dw-ball.limit circle{stroke:var(--red);fill:var(--red)}
.dw-ball.limit text{fill:#fff}
.bom{width:100%;border-collapse:collapse}
.bom th{font-size:11.5px;font-weight:700;color:var(--faint);text-align:left;padding:0 10px 8px 0;border-bottom:1px solid var(--line);white-space:nowrap;text-transform:uppercase;letter-spacing:.04em}
.bom td{padding:12px 10px 12px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.bom .ball{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center;font-size:11.5px;font-weight:700}
.bom tr.limit .ball{background:var(--red);border-color:var(--red);color:#fff}
.bom .q{font-size:18px;white-space:nowrap}
.bom .pn{font-weight:620}
.bom tr.limit .pn{color:var(--red-ink)}
.bom .alc{white-space:nowrap}
.bom tr.limit .alc{color:var(--red-ink);font-weight:700}
.bar-h{height:6px;border-radius:3px;background:var(--surface-3);margin-top:6px;min-width:60px}
.bar-h i{display:block;height:100%;border-radius:3px;background:var(--c-combo)}
.bom tr.limit .bar-h i{background:var(--red)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.plan .note{margin:12px 0 0;max-width:62ch}
.summary{display:grid;grid-template-columns:auto minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);border-top:1px solid var(--line)}
.summary > div{padding:18px 22px;min-width:0}
.summary > div + div{border-left:1px solid var(--line)}
.summary .l{font-size:13px;color:var(--muted);margin-bottom:4px;font-weight:600}
.summary .big{font-size:46px;line-height:1}
.summary .big small{font-size:14px;font-weight:500;color:var(--muted);font-stretch:100%;letter-spacing:0;margin-left:4px}
.summary p{margin:0;font-size:14px}
.summary p b{color:var(--red-ink);font-weight:650}
.money{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:14px;margin:0}
.money dt{color:var(--muted)} .money dd{margin:0;text-align:right;font-weight:620}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line-strong);border-radius:12px;background:var(--surface);overflow:hidden}
.stepper button{all:unset;cursor:pointer;width:36px;height:36px;display:grid;place-items:center;font-size:18px;font-weight:650}
.stepper button:hover{background:var(--surface-3)}
.stepper button:focus-visible{outline:2px solid var(--red);outline-offset:-2px}
.stepper input{width:46px;text-align:center;border:0;background:none;font-weight:700;outline:none;padding:0}
.sim-out{font-size:13px;color:var(--muted);margin-top:6px}
.cmp-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 36px;gap:8px;align-items:center;padding:6px 0}

/* ---------- tablas y filtros ---------- */
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--line)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{all:unset;cursor:pointer;font-size:13.5px;font-weight:600;padding:6px 13px;border-radius:999px;background:var(--surface-3);color:var(--muted);white-space:nowrap;transition:background-color .15s,color .15s}
.chip:hover{color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--surface)}
.chip:focus-visible{outline:2px solid var(--red)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);padding:0 16px;overflow-x:auto}
.tabs button{all:unset;cursor:pointer;padding:14px 12px;font-weight:650;font-size:14.5px;color:var(--muted);border-bottom:2.5px solid transparent;display:inline-flex;gap:8px;align-items:center;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--ink);border-color:var(--red)}
.tabs button svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9}
table.data{width:100%;border-collapse:collapse;font-size:14px}
table.data th{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);white-space:nowrap}
table.data td{padding:13px 16px;border-bottom:1px solid var(--line);white-space:nowrap}
table.data td.wrap{white-space:normal;min-width:160px}
table.data tr:last-child td{border-bottom:0}
table.data tbody tr.sel{cursor:pointer;transition:background-color .12s}
table.data tbody tr.sel:hover td{background:var(--surface-2)}
table.data tbody tr[aria-selected="true"] td{background:color-mix(in srgb,var(--red) 7%,transparent)}
table.data tr.anulado td{color:var(--faint);text-decoration:line-through}
table.data tr.anulado td .pill{text-decoration:none}
.stock-layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,24vw,360px);gap:20px;align-items:start}
/* planilla de stock: celdas más compactas para que entren todas las columnas sin cortar los números */
@media (min-width:821px){
  table.data.planilla th,table.data.planilla td{padding-left:12px;padding-right:12px}
  table.data.planilla th:first-child,table.data.planilla td:first-child{padding-left:18px}
  table.data.planilla th:last-child,table.data.planilla td:last-child{padding-right:18px}
  table.data.planilla td.wrap{min-width:130px}
}
table.data .num{font-variant-numeric:tabular-nums}
.ledger{display:flex;flex-direction:column}
.mv{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:1px 10px;padding:10px 0;border-top:1px solid var(--line);align-items:center}
.mv:first-child{border-top:0}
.mv .q{font-size:17px}
.mv .q.in{color:var(--ok)} .mv .q.out{color:var(--red-ink)}
.mv .m{font-weight:620;font-size:14px}
.mv .w{font-size:12.5px;color:var(--muted)}
.mv .bal{text-align:right;font-size:12.5px;color:var(--muted)}
.big-stock{display:flex;align-items:baseline;gap:8px;margin:2px 0 4px}
.big-stock .fig{font-size:42px;line-height:1}
.more{display:flex;justify-content:center;padding:14px}
.mo{display:none}

/* ---------- formularios ---------- */
.form{display:flex;flex-direction:column;gap:14px}
.form.sep{padding-top:16px;margin-top:8px;border-top:1px solid var(--line)}
.f{display:flex;flex-direction:column;gap:5px;min-width:0}
.f label,.f .lbl{font-size:13px;font-weight:620;color:var(--muted)}
.f .hint{font-size:12.5px;color:var(--faint)}
.input{border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:9px 12px;background:var(--surface);min-width:0;width:100%;min-height:42px;transition:border-color .15s,box-shadow .15s}
.input:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--ink) 10%,transparent)}
.input.r{text-align:right}
.input[readonly]{background:var(--surface-2);color:var(--muted)}
textarea.input{resize:vertical;min-height:80px;line-height:1.45}
select.input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239A948A' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;padding-right:34px}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.span2{grid-column:span 2}
.span-all{grid-column:1 / -1}
.check{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.check input{accent-color:var(--red);width:19px;height:19px;margin:0;flex:none}
.note{font-size:13px;color:var(--muted);margin:0}
.warnline{margin:10px 0 0;font-size:13.5px;color:var(--red-ink);font-weight:560}
.okline{margin:10px 0 0;font-size:13.5px;color:var(--ok);font-weight:560}
.empty{padding:28px 8px;text-align:center;color:var(--muted);font-size:14px}
.err-box{margin:0;padding:12px 16px;border-radius:var(--r-sm);background:var(--red-soft);color:var(--red-ink);font-size:14px;font-weight:560}
.info-box{padding:12px 16px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);font-size:13.5px;color:var(--muted);display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.info-box b{color:var(--ink);font-weight:650}
.info-box.warn{background:var(--warn-soft);border-color:transparent;color:var(--ink)}
.info-box .btn{margin-left:auto}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}

/* ---------- venta ---------- */
.sale-layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;align-items:start}
.ticket{position:sticky;top:84px}
.cat-venta > header{align-items:center}
.vista-seg{margin-left:auto}
.vbody{padding:6px 16px 16px}
.vic{width:26px;height:26px;stroke:var(--draw);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
svg.mini{display:block;height:100%;width:auto;max-width:100%}
.vl-h,.vl-row{display:grid;grid-template-columns:56px minmax(0,1fr) 128px 104px 128px;gap:14px;align-items:center}
.vl-h{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);padding:10px;border-bottom:1px solid var(--line)}
.vl-row{padding:9px 10px;border-bottom:1px solid var(--line);cursor:pointer;border-radius:12px;transition:background-color .12s}
.vl-row:last-child{border-bottom:0}
.vl-row:hover{background:var(--surface-2)}
.vl-row:focus-visible{outline:2px solid var(--red);outline-offset:-2px}
.vl-row.en{background:color-mix(in srgb,var(--red) 7%,transparent)}
.vl-ic{width:56px;height:48px;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:4px}
.vl-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.vl-main .t{font-weight:620;font-size:14.5px}
.kind{font-size:11px;font-weight:700;color:var(--c-combo);margin-right:2px;text-transform:uppercase;letter-spacing:.04em}
.vl-main .s{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vl-st{font-size:13px}
.vl-pr{text-align:right;font-size:16.5px}
.vl-act{display:flex;justify-content:flex-end}
.vl-act .stepper button{width:34px;height:34px}
.vl-act .stepper input{width:36px}
.vc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;padding-top:8px}
.vc{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);overflow:hidden;transition:border-color .15s,box-shadow .15s,transform .15s}
.vc:hover{border-color:var(--ink);transform:translateY(-2px)}
.vc:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.vc.en{border-color:var(--red);box-shadow:inset 0 0 0 1.5px var(--red)}
.vc-fig{position:relative;height:140px;display:grid;place-items:center;padding:14px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.vc-fig .vic{width:56px;height:56px;stroke-width:1.2}
.vc-q{position:absolute;top:8px;left:8px;font-size:11.5px;font-weight:700;color:#fff;background:var(--red);padding:2px 9px;border-radius:999px}
.vc-b{display:flex;flex-direction:column;gap:3px;padding:12px 14px 14px}
.vc-b .k{display:flex;justify-content:space-between;gap:6px;align-items:center}
.vc-b .t{font-weight:620;font-size:14px;line-height:1.3}
.vc-b .st{font-size:12.5px}
.vc-b .p{font-size:19px;margin-top:4px}
.steps{display:flex;gap:6px;margin-bottom:14px}
.steps span{flex:1;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:650;color:var(--faint)}
.steps span i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;background:var(--surface-3);color:var(--muted);flex:none}
.steps span.on{color:var(--ink)} .steps span.on i{background:var(--ink);color:var(--surface)}
.steps span.ok i{background:var(--ok);color:#fff}
.cbte{display:grid;grid-template-columns:repeat(3,auto);justify-content:space-between;gap:4px 12px;padding:12px 14px;margin-bottom:14px;background:var(--surface-2);border:1px dashed var(--line-strong);border-radius:var(--r-sm);font-size:12.5px;color:var(--muted)}
.cbte b{display:block;color:var(--ink);font-weight:700;font-size:13.5px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:10px 0;border-top:1px solid var(--line)}
.line:first-child{border-top:0}
.line .t{font-weight:620;font-size:14px}
.line .x{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.line .x .stepper button{width:32px;height:32px;font-size:16px}
.line .x .stepper input{width:36px}
.line .pr{grid-row:1 / span 2;grid-column:2;text-align:right;font-weight:700}
.explode{margin-top:12px;padding:12px 14px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line);font-size:13px}
.explode h3{margin:0 0 6px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.explode ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:3px}
.explode li{display:flex;justify-content:space-between;gap:10px}
.explode li.short{color:var(--red-ink);font-weight:650}
.totals{display:flex;justify-content:space-between;align-items:baseline;margin-top:16px;padding-top:14px;border-top:1.5px solid var(--ink)}
.totals > span:first-child{font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:13px}
.totals .g{font-size:34px;line-height:1}
.pagos{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.pago{display:grid;grid-template-columns:minmax(0,1fr) 124px 36px;gap:8px;align-items:center}
.pago-falta{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
.pago-falta b{color:var(--ink)}
.pago-falta.mal b{color:var(--red-ink)}
.del{all:unset;cursor:pointer;width:36px;height:38px;display:grid;place-items:center;border-radius:10px;color:var(--faint)}
.del:hover{color:var(--red-ink);background:var(--red-soft)}
.del:focus-visible{outline:2px solid var(--red)}
.del svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
.cartbar{display:none}
.cli-libre{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:8px;margin:-2px 0 12px}

/* ---------- presupuestos ---------- */
.pz-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.92fr);gap:20px;align-items:start}
.pz-form{display:flex;flex-direction:column;gap:16px;min-width:0}
.ir{display:grid;grid-template-columns:76px 124px 76px minmax(0,1fr) 36px;gap:8px 10px;padding:14px 0;border-top:1px solid var(--line);align-items:end}
.ir:first-child{border-top:0;padding-top:4px}
.ir > .dsc{grid-column:1 / -1}
.ir .imp{text-align:right;font-size:17px;font-weight:700;padding-bottom:9px;white-space:nowrap}
.ir .sub{font-size:12px;color:var(--muted);margin-top:5px;line-height:1.4}
.ir .lbl-m{display:block;font-size:12px;font-weight:620;color:var(--muted);margin-bottom:4px}
.pz-add{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.pz-add select{flex:1;min-width:220px}
.pz-tot{display:grid;grid-template-columns:1fr auto;gap:5px 16px;font-size:14px;margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line)}
.pz-tot dt{color:var(--muted)} .pz-tot dd{margin:0;text-align:right;font-weight:620}
.pz-tot .gt{font-size:28px;line-height:1.1;color:var(--ink)}
.pz-tot dt.gtl{align-self:end;color:var(--ink);font-weight:700}
.pz-int{margin-top:12px;padding:12px 14px;border-radius:var(--r-sm);background:var(--surface-2);border:1px dashed var(--line-strong);font-size:13px;display:flex;justify-content:space-between;gap:6px 14px;flex-wrap:wrap}
.pz-prev{position:sticky;top:84px}
.pz-prev .body{padding:14px}
.sheet-wrap{position:relative;overflow:hidden;border-radius:6px;background:var(--surface-3)}
.sheet-wrap .a4{position:absolute;top:0;left:0;transform-origin:0 0}
.code-n{font-stretch:88%;color:var(--red-ink);font-weight:700}

/* ---------- caja y cuentas ---------- */
.stats.four .v{font-size:24px}
td.chev-c{width:30px;padding-left:0;color:var(--faint)}
td.chev-c svg{display:block;width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.panel > header .hint{margin-left:auto;color:var(--faint);font-size:13px}
.adj{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px}
.adj img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.file-btn{position:relative;overflow:hidden}
.file-btn input{position:absolute;inset:0;opacity:0;cursor:pointer}
.file-btn:focus-within{outline:2px solid var(--red);outline-offset:2px}
.arq{display:grid;grid-template-columns:1fr auto;gap:6px 16px;font-size:14.5px;margin:6px 0 0}
.arq dt{color:var(--muted)} .arq dd{margin:0;text-align:right;font-weight:650}
.arq .gt{font-size:26px}
.cc-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:20px;align-items:start}
.aging{display:flex;gap:2px;height:7px;min-width:96px;border-radius:4px;overflow:hidden;background:var(--surface-3)}
.aging i{display:block;height:100%}
.a0{background:var(--draw-soft)} .a1{background:var(--warn)} .a2{background:var(--red)} .a3{background:var(--red-ink)}
.legend{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);padding:12px 18px 16px}
.legend i,.cc-age dt i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.cc-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.cc-top .l{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;font-weight:600}
.cc-top .fig{font-size:38px;line-height:1}
.cc-lim{min-width:200px;font-size:13px;color:var(--muted);text-align:right}
.cc-lim b{font-weight:650}
.cc-lim .bar-h i{background:var(--c-cli)}
.cc-lim.over .bar-h i{background:var(--red)}
.cc-age{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0 0}
.cc-age div{background:var(--surface-2);padding:10px 12px;min-width:0;border-radius:var(--r-sm)}
.cc-age dt{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-age dd{margin:2px 0 0;font-weight:700;font-size:14.5px}
.cc-acts{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 4px}
.cc-h{margin:20px 0 8px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}

/* ---------- drawer, modal, toast ---------- */
body.lock{overflow:hidden}
.dr-scrim{position:fixed;inset:0;z-index:50;background:var(--scrim);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s .2s}
.dr-scrim.show{opacity:1;visibility:visible;transition:opacity .28s ease,visibility 0s}
.drawer{position:fixed;top:10px;right:10px;bottom:10px;z-index:51;width:min(480px,calc(100vw - 20px));display:flex;flex-direction:column;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-lg);transform:translateX(110%);visibility:hidden;transition:transform .22s var(--ease),visibility 0s .22s;overflow:hidden}
.drawer.show{transform:none;visibility:visible;transition:transform .32s var(--ease),visibility 0s}
.dr-grab{display:none}
.dr-head{position:relative;padding:16px 18px 16px 22px;border-bottom:1px solid var(--line)}
.dr-bar{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.dr-kind{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--red-ink)}
.dr-pos{margin-left:auto;margin-right:4px;font-size:12.5px;color:var(--faint)}
.dr-head h2{margin:0;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.012em;text-wrap:balance}
.dr-meta{margin:3px 0 0;font-size:13.5px;color:var(--muted)}
.dr-body{flex:1;overflow:auto;overscroll-behavior:contain}
.dr-amt{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:20px 22px 16px}
.dr-amt .l{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
.dr-amt .fig{font-size:38px;line-height:1}
.dr-amt .tags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.dr-sec{padding:14px 22px;border-top:1px solid var(--line)}
.dr-sec h3{margin:0 0 8px;display:flex;justify-content:space-between;gap:10px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.dr-ln{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 12px;padding:9px 0;border-top:1px solid var(--line)}
.dr-ln:first-of-type{border-top:0}
.dr-ln .t{font-weight:620;font-size:14px;line-height:1.3}
.dr-ln .imp{text-align:right;font-weight:700;white-space:nowrap}
.dr-ln .s{font-size:12.5px;color:var(--muted)}
.dr-kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:6px 12px;margin:0;font-size:14px}
.dr-kv dt{color:var(--muted)} .dr-kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.dr-foot{display:flex;gap:8px;padding:14px 22px calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:var(--surface);flex-wrap:wrap}
.dr-foot .btn{flex:1}
.dr-photo{display:block;max-width:100%;border-radius:var(--r-sm);border:1px solid var(--line);margin-top:4px}

.modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:16px;background:var(--scrim);animation:fadeIn .18s ease}
.modal-box{position:relative;width:100%;max-width:540px;max-height:calc(100dvh - 32px);overflow:auto;background:var(--surface);color:var(--ink);border-radius:22px;padding:24px;box-shadow:var(--shadow-lg);animation:mIn .25s cubic-bezier(.16,1,.3,1)}
.modal-box.wide{max-width:780px}
@keyframes mIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal-box h2{margin:0 0 6px;font-size:20px;font-weight:700;padding-right:44px}
.modal-box > p{margin:0 0 14px;color:var(--muted);font-size:14.5px}
.modal-x{position:absolute;top:18px;right:18px}
.modal-box .acts{margin-top:20px}
.copy-box{display:flex;gap:8px;align-items:center;margin-top:8px}
.copy-box input{font-family:var(--mono);font-size:12.5px}

/* buscador rápido (Ctrl+K) */
.modal-box.cmdk{max-width:640px;padding:0;overflow:hidden;display:flex;flex-direction:column}
.cmdk .modal-x{display:none}
.cmdk-in{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}
.cmdk-in svg{width:20px;height:20px;stroke:var(--muted);fill:none;stroke-width:2;flex:none}
.cmdk-in input{border:0;background:none;outline:none;flex:1;font-size:17px;min-width:0}
.cmdk-list{max-height:min(60dvh,460px);overflow:auto;padding:8px}
.cmdk-grp{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:10px 10px 4px}
.cmdk-it{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;cursor:pointer;text-decoration:none;color:inherit}
.cmdk-it[aria-selected="true"],.cmdk-it:hover{background:var(--surface-3)}
.cmdk-it .t{font-weight:620;display:block}
.cmdk-it .s{font-size:12.5px;color:var(--muted);display:block}
.cmdk-it .r{margin-left:auto;font-size:13px;color:var(--muted);white-space:nowrap}
.cmdk-foot{display:flex;gap:14px;padding:10px 16px;border-top:1px solid var(--line);font-size:12px;color:var(--faint)}

.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,14px);opacity:0;background:var(--ink);color:var(--surface);padding:14px 18px;border-radius:16px;display:flex;gap:12px;align-items:flex-start;max-width:min(580px,calc(100vw - 32px));box-shadow:var(--shadow-lg);transition:opacity .2s cubic-bezier(.25,1,.5,1),transform .25s cubic-bezier(.25,1,.5,1);z-index:var(--z-toast);font-size:14px;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.toast a{color:inherit}
.toast svg{width:20px;height:20px;flex:none;stroke:#4FC48C;fill:none;stroke-width:2.4;margin-top:1px}
.toast.err svg{stroke:#FF6B72}
@keyframes flash{from{background:var(--ok-soft)}to{background:transparent}}
.flash{animation:flash 1.4s ease-out}

/* ---------- pantalla de comprobante (después de cada operación) ---------- */
.done{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:24px;align-items:start}
.done-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:26px;display:flex;flex-direction:column;gap:14px;position:sticky;top:20px}
.done-ok{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--ok-soft);color:var(--ok);animation:pop .45s cubic-bezier(.2,1.4,.4,1)}
.done-ok svg{width:32px;height:32px;stroke:currentColor;fill:none;stroke-width:2.6}
@keyframes pop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.done-card h1{margin:0;font:700 32px/1 var(--display);text-transform:uppercase}
.done-card .big{font-size:40px;line-height:1}
.done-card .acts{grid-template-columns:1fr;margin-top:4px}
.done-card .acts.two{grid-template-columns:1fr 1fr}
.done-prev{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}

/* ---------- login ---------- */
.login{position:fixed;inset:0;z-index:90;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--bg);overflow:auto}
.login-art{position:relative;background:#0F1011;color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:44px;overflow:hidden;min-height:100%}
.login-art::before,.login-art::after{content:"";position:absolute;top:-10%;height:130%;width:150px;background:linear-gradient(180deg,#1A1B1E,#121315);transform:skewX(24deg)}
.login-art::before{right:24%} .login-art::after{right:-4%}
.login-art .logo{width:150px;position:relative;z-index:1;background-image:url(/assets/logo/logo-completo-sobre-oscuro.png)}
.login-art h2{position:relative;z-index:1;margin:0;font:700 64px/.95 var(--display);text-transform:uppercase;max-width:9ch}
.login-art h2 em{font-style:normal;color:#E40D18}
.login-art ul{position:relative;z-index:1;list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;color:#C9CCD1;font-size:15px}
.login-art li{display:flex;gap:10px;align-items:center}
.login-art li svg{width:18px;height:18px;stroke:#E40D18;fill:none;stroke-width:2.2;flex:none}
.login-art small{position:relative;z-index:1;color:#7F848C}
.login-side{position:relative;display:grid;place-items:center;padding:32px 20px}
.login-card{width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px;animation:lgIn .6s cubic-bezier(.16,1,.3,1) both}
@keyframes lgIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.login-card .logo{display:none;width:120px;margin:0 auto 10px}
.login h1{margin:0;font:700 46px/1 var(--display);text-transform:uppercase}
.login-sub{margin:-6px 0 6px;color:var(--muted);font-size:15px}
.lf{display:flex;flex-direction:column;gap:6px}
.lf label{font-size:13px;font-weight:620;color:var(--muted)}
.lf input{width:100%;background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;padding:13px 14px;color:var(--ink);outline:none;font-size:16px;transition:border-color .15s,box-shadow .15s}
.lf input:focus{border-color:var(--ink);box-shadow:0 0 0 4px color-mix(in srgb,var(--ink) 10%,transparent)}
.pw{position:relative}
.pw input{padding-right:48px}
.pw button{all:unset;cursor:pointer;position:absolute;right:5px;top:50%;transform:translateY(-50%);width:40px;height:40px;display:grid;place-items:center;color:var(--muted);border-radius:8px}
.pw button:hover{color:var(--ink)}
.pw svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.login-err{min-height:20px;margin:-4px 0 0;color:var(--red-ink);font-size:13.5px;font-weight:560}
.btn.primary.login-btn{min-height:52px;font-size:16px}
.login-foot{margin:4px 0 0;font-size:13px;color:var(--muted)}
.login-info{padding:12px 14px;border-radius:12px;background:var(--surface-3);color:var(--ink);font-size:13.5px;margin:0}
.login-tema{position:absolute;top:18px;right:18px}
.shake{animation:shake .34s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.boot{position:fixed;inset:0;z-index:100;background:var(--bg);display:grid;place-items:center;transition:opacity .4s}
.boot .logo{width:150px;animation:lgIn .7s cubic-bezier(.16,1,.3,1) both}
.boot.out{opacity:0;pointer-events:none}

.idle{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:var(--scrim)}
.idle-box{width:100%;max-width:400px;background:var(--surface);color:var(--ink);border-radius:22px;padding:24px;box-shadow:var(--shadow-lg)}
.idle-box h2{margin:0 0 6px;font-size:20px;font-weight:700}
.idle-box p{margin:0;color:var(--muted);font-size:14.5px}
.idle-box .cd{display:block;margin:14px 0 18px;font-size:48px;line-height:1;color:var(--red-ink)}
.idle-box .acts{margin-top:0}

/* ---------- menú "Más", próximamente, ayuda ---------- */
.menu-list{display:flex;flex-direction:column;padding:6px}
.menu-list > a,.menu-list > button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;width:100%;text-decoration:none;color:inherit}
.menu-list > a:hover,.menu-list > button:hover{background:var(--surface-3)}
.menu-list .lbl{font-weight:620}
.menu-list .pronto,.menu-list .val{margin-left:auto;font-size:12.5px;color:var(--muted)}
.menu-list .chev{margin-left:auto;color:var(--faint);display:flex}
.menu-list .chev svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.menu-list .pronto + .chev,.menu-list .val + .chev{margin-left:8px}
.soon{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.soon > div{padding:26px}
.soon > div + div{border-left:1px solid var(--line)}
.soon .fase{display:inline-block;font-size:12.5px;font-weight:700;color:var(--red-ink);background:var(--red-soft);padding:4px 11px;border-radius:999px}
.soon h2{margin:12px 0 6px;font-size:21px;font-weight:700}
.soon p{margin:0;color:var(--muted);max-width:56ch}
.soon ul{margin:10px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.guide{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);cursor:pointer;text-decoration:none;color:inherit}
.guide:hover{border-color:color-mix(in srgb,var(--mc) 45%,var(--line))}
.guide b{font-size:16px}
.guide span{color:var(--muted);font-size:13.5px}
.guide-steps{counter-reset:paso;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.guide-steps li{counter-increment:paso;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start}
.guide-steps li::before{content:counter(paso);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--mc);color:#fff;font-weight:700;font-size:14px}
.guide-steps b{display:block}
.guide-steps span{color:var(--muted);font-size:14px}
.tip{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-md);background:var(--surface-2);border:1px dashed var(--line-strong);font-size:13.5px;color:var(--muted)}
.tip svg{width:18px;height:18px;stroke:var(--warn);fill:none;stroke-width:2;flex:none;margin-top:1px}

/* recorrido guiado */
.tour-ring{position:fixed;z-index:95;border-radius:14px;box-shadow:0 0 0 4px var(--red),0 0 0 9999px rgba(10,10,10,.55);pointer-events:none;transition:all .3s var(--ease)}
.tour-pop{position:fixed;z-index:96;width:min(330px,calc(100vw - 32px));background:var(--surface);color:var(--ink);border-radius:18px;padding:18px;box-shadow:var(--shadow-lg);transition:top .3s var(--ease),left .3s var(--ease)}
.tour-pop h3{margin:0 0 6px;font-size:17px}
.tour-pop p{margin:0 0 14px;color:var(--muted);font-size:14px}
.tour-pop .row{display:flex;align-items:center;gap:8px}
.tour-pop .row .n{font-size:12.5px;color:var(--faint);margin-right:auto}

/* ---------- auditoría ---------- */
.aud{display:grid;grid-template-columns:130px minmax(0,1fr);gap:2px 16px;padding:12px 0;border-top:1px solid var(--line)}
.aud:first-child{border-top:0}
.aud .w{font-size:12.5px;color:var(--muted)}
.aud .a{font-family:var(--mono);font-size:11.5px;color:var(--faint)}
.aud .res{font-size:14px}

/* ---------- documentos imprimibles (A4 y ticket de 80 mm) ---------- */
.a4{position:relative;width:210mm;min-height:297mm;background:#fff;color:#18181A;font-family:Helvetica,Arial,sans-serif;font-size:8.6pt;line-height:1.35;padding:13mm 15mm 0;display:flex;flex-direction:column;box-shadow:0 1px 2px rgba(0,0,0,.08),0 10px 30px rgba(0,0,0,.12);font-variant-numeric:normal;-webkit-font-smoothing:auto}
.a4 *{box-sizing:border-box}
.dc-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:5mm;padding-bottom:5mm;border-bottom:.5mm solid #18181A}
.dc-emp img{width:34mm;display:block;margin-bottom:2mm}
.dc-emp div{color:#5E6168;font-size:7.8pt;line-height:3.9mm}
.dc-emp b{color:#18181A}
.dc-x{width:17mm;height:17mm;border:.5mm solid #18181A;display:grid;place-content:center;text-align:center;font-weight:800;font-size:22pt;line-height:1;margin-top:1mm}
.dc-x small{display:block;font-size:5.4pt;font-weight:700;letter-spacing:.02em;margin-top:1mm}
.dc-doc{text-align:right}
.dc-doc h1{margin:0;font-size:16pt;letter-spacing:.01em;line-height:1.05;text-transform:uppercase}
.dc-doc .nro{font-size:12pt;font-weight:800;color:#D70F19;margin-top:1.5mm}
.dc-doc dl{display:grid;grid-template-columns:auto auto;justify-content:end;gap:.6mm 3mm;margin:2.5mm 0 0;font-size:8pt;color:#5E6168}
.dc-doc dd{margin:0;color:#18181A;font-weight:600}
.dc-cli{margin-top:5mm;display:grid;grid-template-columns:1.3fr 1fr;gap:5mm}
.dc-box{background:#F4F4F2;border-radius:2mm;padding:3.5mm 4mm}
.dc-box h4{margin:0 0 1.5mm;font-size:6.6pt;letter-spacing:.08em;color:#7A7D84;text-transform:uppercase}
.dc-box strong{display:block;font-size:12.5pt;line-height:1.15;margin-bottom:1.5mm}
.dc-box dl{display:grid;grid-template-columns:22mm minmax(0,1fr);margin:0;font-size:7.8pt;line-height:4.3mm}
.dc-box dt{color:#7A7D84} .dc-box dd{margin:0}
.dc-t{width:100%;border-collapse:collapse;margin-top:6mm}
.dc-t th{text-align:left;font-size:6.8pt;letter-spacing:.06em;text-transform:uppercase;color:#7A7D84;padding:0 2mm 2mm;border-bottom:.35mm solid #18181A}
.dc-t td{padding:2.4mm 2mm;border-bottom:.2mm solid #E2E2DE;vertical-align:top}
.dc-t .r{text-align:right;white-space:nowrap}
.dc-t .c{color:#7A7D84;font-size:7.4pt;white-space:nowrap}
.dc-t .imp{font-weight:700}
.dc-t .inc{display:block;color:#7A7D84;font-size:6.9pt;margin-top:.6mm}
.dc-foot{display:grid;grid-template-columns:1fr 80mm;gap:6mm;margin-top:6mm;align-items:start}
.dc-let h4,.dc-cond h4{margin:0 0 1.5mm;font-size:6.6pt;letter-spacing:.08em;color:#7A7D84;text-transform:uppercase}
.dc-let p{margin:0;font-style:italic}
.dc-sum dl{display:grid;grid-template-columns:1fr auto;margin:0}
.dc-sum dt,.dc-sum dd{margin:0;padding:1.3mm 0;border-bottom:.2mm solid #E2E2DE}
.dc-sum dt{color:#5E6168} .dc-sum dd{text-align:right}
.dc-grand{margin-top:2.5mm;background:#18181A;color:#fff;border-radius:1.5mm;padding:3.2mm 4mm;display:flex;justify-content:space-between;align-items:center}
.dc-grand span{font-size:8pt;font-weight:700;letter-spacing:.06em}
.dc-grand b{font-size:14pt}
.dc-pay{margin-top:3mm;font-size:7.8pt}
.dc-pay div{display:flex;justify-content:space-between;padding:.8mm 0}
.dc-sena{margin-top:3mm;background:#FDECEC;border-radius:1.5mm;padding:2.2mm 3mm;display:flex;justify-content:space-between;font-size:8pt}
.dc-sena b{color:#D70F19}
.dc-cond{margin-top:7mm;font-size:7.8pt}
.dc-cond dl{display:grid;grid-template-columns:30mm minmax(0,1fr);margin:0;line-height:4.4mm}
.dc-cond dt{color:#7A7D84} .dc-cond dd{margin:0}
.dc-cond ul{margin:2mm 0 0;padding:0;list-style:none;color:#7A7D84;font-size:7.2pt;line-height:3.6mm}
.dc-obs{margin-top:3mm;border:.25mm solid #E2E2DE;border-radius:1.5mm;padding:2.5mm 3mm;white-space:pre-wrap;overflow-wrap:anywhere}
.dc-sign{margin-top:auto;padding-top:16mm;display:flex;justify-content:space-between;color:#7A7D84;font-size:7.5pt}
.dc-sign div{width:68mm;border-top:.3mm solid #18181A;padding-top:1.6mm}
.dc-pie{margin-top:6mm;border-top:.25mm solid #E2E2DE;display:flex;justify-content:space-between;gap:4mm;color:#7A7D84;font-size:6.8pt;padding:2.6mm 0 7mm}
.dc-legal{margin-top:3mm;text-align:center;font-size:7pt;font-weight:700;letter-spacing:.06em;color:#7A7D84;text-transform:uppercase}
.dc-anulada{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.dc-anulada span{transform:rotate(-24deg);border:1.2mm solid #D70F19;color:#D70F19;font-size:40pt;font-weight:900;padding:2mm 8mm;opacity:.35;letter-spacing:.1em}
.tk{width:80mm;background:#fff;color:#000;font-family:ui-monospace,Consolas,monospace;font-size:8.6pt;line-height:1.35;padding:5mm 4mm 7mm;box-shadow:0 1px 2px rgba(0,0,0,.08),0 10px 30px rgba(0,0,0,.12)}
.tk *{box-sizing:border-box}
.tk .c{text-align:center}
.tk img{width:30mm;display:block;margin:0 auto 2mm;filter:grayscale(1) contrast(1.4)}
.tk hr{border:0;border-top:.3mm dashed #000;margin:2.5mm 0}
.tk .row{display:flex;justify-content:space-between;gap:3mm}
.tk .big{font-size:12pt;font-weight:800}
.tk .it{margin:1.2mm 0}
.tk .it .d{font-weight:700}
.print-page{background:var(--surface-3);min-height:100vh;padding:20px 16px 40px;display:flex;flex-direction:column;align-items:center;gap:16px}
.print-bar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center}
.print-scale{width:100%;display:flex;justify-content:center;overflow:hidden}
@media print{
  @page{size:A4;margin:0}
  body{background:#fff!important}
  .print-bar,.toast,.done-card,.mnav{display:none!important}
  .done{display:block}
  .print-page{padding:0;background:#fff;display:block}
  .print-scale{display:block;overflow:visible;height:auto!important}
  .print-scale .a4,.print-scale .tk{transform:none!important;box-shadow:none;margin:0}
}

/* ---------- responsive ---------- */
.mnav{display:none}
@media (max-width:1400px){.cc-layout,.stock-layout{grid-template-columns:minmax(0,1fr)}}
/* barra superior en pantallas medianas (notebook chica, tablet horizontal): que nada quede afuera */
@media (max-width:1180px) and (min-width:821px){
  .top{padding:12px 20px;gap:8px}
  .top .kbd{display:none}
  .top .suc-sel{max-width:150px}
  .seg button{padding:6px 9px}
}
@media (max-width:1100px){table.data.planilla .hx{display:none}}
@media (min-width:961px) and (max-width:1180px){.top .search{min-width:120px}}
@media (max-width:1180px){
  :root{--side-w:224px}
  .cols,.cols-2,.stock-layout,.sale-layout,.combo-layout,.pz-layout,.done{grid-template-columns:minmax(0,1fr)}
  .pz-prev,.ticket,.done-card{position:static}
  .clist{flex-direction:row;overflow-x:auto}
  .clist a{min-width:230px}
  .plan{grid-template-columns:260px minmax(0,1fr)}
  .summary{grid-template-columns:auto minmax(0,1fr)}
  .summary > div:nth-child(3){border-left:0;border-top:1px solid var(--line)}
  .summary > div:nth-child(4){border-top:1px solid var(--line)}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .login{grid-template-columns:minmax(0,1fr)}
  .login-art{display:none}
  .login-card .logo{display:block}
}
@media (max-width:820px){
  body{font-size:15.5px}
  .app{grid-template-columns:minmax(0,1fr)}
  .side{display:none}
  .top{padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top,0px));flex-wrap:wrap;gap:8px}
  .mbrand{display:block}
  .mbrand .logo{height:30px;width:52px}
  .top .search,.top .seg{display:none}
  .top .kbd{display:none}
  body.v-stock .top .search,body.v-venta .top .search{display:flex;order:3;flex-basis:100%;max-width:none;box-shadow:none}
  body.v-stock .search input,body.v-venta .search input{font-size:16px}
  .top .suc-sel{max-width:140px;min-width:0;flex:0 1 auto;padding:7px 10px}
  .top #ayudaBtn{display:none} /* en el celular la guía está en Más */
  .view{padding:18px 16px calc(108px + env(safe-area-inset-bottom,0px));gap:16px}
  .head h1{font-size:32px}
  .hello h1{font-size:36px}
  .head .actions{margin-left:0;width:100%}
  .head .actions .btn{flex:1}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .tile{padding:14px;gap:10px}
  .tile > div > span{display:none}
  .tile.hero{grid-column:1 / -1;flex-direction:row;align-items:center}
  .tile.hero > div > span{display:inline}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stats.three .stat:last-child{grid-column:1 / -1}
  .stat{padding:14px}
  .stat .v{font-size:23px}
  .plan{grid-template-columns:minmax(0,1fr)}
  .drawing{max-width:340px;margin:0 auto;width:100%}
  .summary{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .summary > div{padding:14px 16px}
  .summary > div:nth-child(2){border-left:1px solid var(--line)}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .input,select.input{font-size:16px;min-height:46px}
  .btn{min-height:46px}
  .btn.sm{min-height:38px}
  .chips.scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
  .chips.scroll::-webkit-scrollbar{display:none}
  .toolbar{padding:10px 12px}
  .vbody{padding:4px 10px 12px}
  .vl-h{display:none}
  .vl-row{grid-template-columns:48px minmax(0,1fr) auto;grid-template-areas:"ic main pr" "ic st act";gap:4px 12px;padding:10px 4px}
  .vl-ic{grid-area:ic;width:48px;height:48px;align-self:start}
  .vl-main{grid-area:main} .vl-st{grid-area:st;align-self:center} .vl-pr{grid-area:pr} .vl-act{grid-area:act}
  .vc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .vc-fig{height:112px;padding:10px}
  .stepper button{width:42px;height:42px}
  .vl-act .stepper button{width:40px;height:40px}
  .mnav{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;position:fixed;left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:var(--z-nav);background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:22px;padding:6px;box-shadow:var(--shadow-lg)}
  .mnav.n4{grid-template-columns:repeat(4,1fr)}
  .mnav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;color:var(--muted);font-size:11px;font-weight:620;text-decoration:none;min-height:50px;border-radius:16px}
  .mnav a svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8}
  .mnav a[aria-current="page"]{color:var(--ink);background:var(--surface-3)}
  .mnav a.fab{color:#fff;background:var(--red);margin-top:-22px;min-height:62px;border-radius:20px;box-shadow:0 8px 20px color-mix(in srgb,var(--red) 40%,transparent);justify-content:center}
  .mnav a.fab svg{width:26px;height:26px}
  .toast{bottom:calc(96px + env(safe-area-inset-bottom,0px));left:12px;right:12px;max-width:none;transform:translateY(14px)}
  .toast.show{transform:none}
  body.has-cart .toast{bottom:calc(160px + env(safe-area-inset-bottom,0px))}
  .cartbar{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:10px;position:fixed;left:14px;right:14px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:var(--z-nav);background:var(--ink);color:var(--surface);border-radius:16px;padding:14px 18px;font-weight:650;box-shadow:var(--shadow-lg)}
  .cartbar .tot{margin-left:auto}
  body.has-cart .view{padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))}
  .panel > header .hint{display:none}
  .drawer{top:auto;left:0;right:0;bottom:0;width:auto;max-height:92dvh;border-radius:22px 22px 0 0;border-bottom:0;transform:translateY(105%)}
  .drawer.show{transform:none}
  .dr-grab{display:block;width:42px;height:5px;border-radius:3px;background:var(--line-strong);margin:-4px auto 10px}
  .dr-amt .fig{font-size:32px}
  .modal{align-items:end;padding:0}
  .modal-box{max-width:none;border-radius:22px 22px 0 0;max-height:92dvh;padding:22px 16px calc(22px + env(safe-area-inset-bottom,0px))}
  .modal:has(.cmdk){align-items:start}
  .modal-box.cmdk{border-radius:0 0 22px 22px;padding:0}
  .ir{grid-template-columns:70px minmax(0,1fr) 64px 36px}
  .ir .ir-imp{grid-column:1 / -2}
  .cc-age{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cc-lim{text-align:left}
  .soon{grid-template-columns:minmax(0,1fr)}
  .soon > div + div{border-left:0;border-top:1px solid var(--line)}
  .aud{grid-template-columns:minmax(0,1fr)}
  .tabs{padding:0 8px}
  .tbl-cards table.data thead{display:none}
  .tbl-cards table.data,.tbl-cards table.data tbody{display:block}
  .tbl-cards table.data tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:13px 16px;border-bottom:1px solid var(--line)}
  .tbl-cards table.data tr:last-child{border-bottom:0}
  .tbl-cards table.data td{display:block;padding:0;border:0;white-space:normal}
  .tbl-cards table.data td[data-k]{grid-column:1}
  .tbl-cards table.data td.r,.tbl-cards table.data td[data-r]{grid-column:2;text-align:right}
  .tbl-cards table.data td.hm,.tbl-cards table.data td.chev-c{display:none}
  .tbl-cards table.data td.mo{display:block}
  .tbl-cards table.data tbody tr.sel:hover td{background:none}
  .tbl-cards table.data tbody tr[aria-selected="true"]{background:color-mix(in srgb,var(--red) 7%,transparent)}
  .tbl-cards table.data tbody tr[aria-selected="true"] td{background:none}
  .done-card{padding:20px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ---------- venta sencilla ---------- */
.vs{display:flex;flex-direction:column;gap:16px;max-width:760px;width:100%}
.vs-paso > header{gap:12px}
.vs-n{width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--surface);display:grid;place-items:center;font-weight:700;font-size:14px}
.vs-buscar{position:relative}
.vs-res{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);padding:6px;max-height:360px;overflow:auto}
.vs-op{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;width:100%;padding:8px 10px;border-radius:10px}
.vs-op:hover,.vs-op:focus-visible{background:var(--surface-3)}
.vs-op > span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.vs-op .muted{font-size:12.5px}
.vs-op svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2}
.vs-crear{color:var(--red-ink)}
.vs-nuevo{margin-top:14px;padding:16px;border-radius:14px;background:var(--surface-2);border:1.5px dashed var(--red)}
.vs-nuevo h3{margin:0;display:flex;align-items:center;gap:8px;font-size:15px}
.vs-nuevo h3 svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2}
.vs-items{margin-top:12px}
.vs-it{display:grid;grid-template-columns:48px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.vs-it:first-child{border-top:0}
.vs-it .vl-ic{width:48px;height:44px}
.vs-meta div{display:flex;flex-direction:column;padding:10px 12px;border-radius:12px;background:var(--surface-2)}
.vs-meta .lbl{font-size:12px;color:var(--muted);font-weight:600}
.okline svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4;vertical-align:-3px}
@media (max-width:480px){.vs-ok-extra{display:none}}
@media (max-width:820px){.vs-it{grid-template-columns:44px minmax(0,1fr) auto;}.vs-it > b{grid-column:2}.vs-meta{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- mensajes, avisos y crédito ---------- */
.campana{position:relative}
.badge{position:absolute;top:-5px;right:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--red);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;border:2px solid var(--bg)}
.avisos{display:flex;flex-direction:column;gap:8px;padding:16px 32px 0;max-width:1360px;width:100%;margin:0 auto}
.aviso{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);animation:mIn .3s ease}
.aviso.imp{background:var(--red-soft);border-color:transparent}
.aviso p{margin:2px 0 0;font-size:14px}
.aviso > div:nth-child(2){flex:1;min-width:0}
.aviso-acts{display:flex;gap:6px;flex-wrap:wrap}
.msg{padding:10px 12px;border-radius:14px;background:var(--surface-2);margin-bottom:8px;border:1px solid transparent}
.msg.mio{background:color-mix(in srgb,var(--c-cli) 10%,var(--surface))}
.msg.nuevo{border-color:var(--ink)}
.msg.imp{background:var(--red-soft)}
.msg-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.msg-h b{color:var(--ink);font-size:13.5px}
.msg p{margin:4px 0 0;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.credito{display:block;margin-top:10px;padding:0 8px;font-size:11.5px;color:var(--faint);text-decoration:none}
.credito b{color:var(--muted);font-weight:700}
.credito.mob{display:none;text-align:center;padding:0 0 calc(110px + env(safe-area-inset-bottom,0px));margin:0}
.login-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.55}
.login-art::before,.login-art::after{z-index:0;opacity:.6}
.login-art > *:not(.login-video){position:relative;z-index:1}
@media (max-width:900px){
  .login{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .login-art{display:flex;min-height:34vh;padding:24px}
  .login-art h2{font-size:40px}
  .login-art ul,.login-art small{display:none}
  .login-card .logo{display:none}
}
@media (max-width:820px){.avisos{padding:12px 16px 0}.aviso{flex-wrap:wrap}.aviso-acts{flex-basis:100%;justify-content:flex-end}.aviso:nth-child(n+2){display:none}.credito.mob{display:block}.view{padding-bottom:16px}}

/* ---------- inicio estilo Apple ---------- */
.ios-hello span{font-size:13px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.ios-hello h1{margin:4px 0 0;font:700 40px/1.05 -apple-system,BlinkMacSystemFont,"SF Pro Display",var(--font);letter-spacing:-.025em}
.ios-apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:18px 10px;padding:6px 0}
.ios-app{display:flex;flex-direction:column;align-items:center;gap:7px;text-decoration:none;color:var(--ink);font-size:12.5px;font-weight:560}
.ios-ic{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;color:#fff;background:linear-gradient(160deg,color-mix(in srgb,var(--mc) 78%,#fff) 0%,var(--mc) 100%);box-shadow:0 6px 16px color-mix(in srgb,var(--mc) 30%,transparent),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .2s cubic-bezier(.2,1.4,.4,1)}
.ios-app[data-mod="ayuda"] .ios-ic,.ios-app[data-mod="comprobantes"] .ios-ic{--mc:#5B6472}
.ios-ic svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.8}
.ios-app:hover .ios-ic{transform:translateY(-3px) scale(1.04)}
.ios-app:active .ios-ic{transform:scale(.94)}
.wg-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.wg{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:24px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(20px);border:1px solid var(--line);box-shadow:var(--shadow);min-height:150px;color:var(--ink);text-decoration:none;transition:transform .2s,box-shadow .2s}
.wg:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.wg-wide{grid-column:span 2}
.wg-ventas{grid-column:span 2}
.wg-h{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--muted)}
.wg-h svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.1}
.wg-big{font-size:34px;line-height:1.1;font-weight:700;letter-spacing:-.02em}
.wg-l{font-size:13px;color:var(--muted)}
.wg-foot{font-size:12px;color:var(--faint);margin-top:auto}
.wg-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.wg-row > div:first-child{display:flex;flex-direction:column;gap:2px}
.wg-alerta{background:var(--warn-soft);border-color:transparent}
.ring-box{position:relative;width:84px;height:84px;flex:none}
.ring-box span{position:absolute;inset:0;display:grid;place-items:center;font-weight:700;font-size:15px}
.ring{width:84px;height:84px;transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--surface-3);stroke-width:9}
.ring-fg{fill:none;stroke-width:9;stroke-linecap:round;transition:stroke-dasharray .8s ease}
.mini-bars{display:flex;align-items:flex-end;gap:5px;height:90px;margin-top:auto}
.mini-bars i{flex:1;border-radius:6px 6px 3px 3px;background:color-mix(in srgb,var(--ink) 22%,transparent)}
.mini-bars i.hoy{background:var(--red)}
.wg-list{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column}
.wg-list li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:14px}
.wg-list li:first-child{border-top:0}
.wg-list li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:1180px){.wg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){
  .ios-hello h1{font-size:32px}
  .ios-apps{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 6px}
  .ios-ic{width:58px;height:58px;border-radius:16px}
  .wg-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .wg{padding:15px;min-height:128px;border-radius:22px}
  .wg-big{font-size:26px}
  .wg-wide,.wg-ventas{grid-column:1 / -1}
}

/* ---------- chat de mensajes (campana) ---------- */
.drawer.drawer-chat{width:min(440px,calc(100vw - 20px))}
.chat{display:flex;flex-direction:column;height:100%;min-height:0}
.chat-cargando{display:grid;place-items:center;padding:40px}
.chat-head{padding:14px 16px 12px;border-bottom:1px solid var(--line);flex:none}
.chat-bar{display:flex;align-items:center;gap:10px}
.chat-bar h2{margin:0;flex:1;font-size:22px;font-weight:700;letter-spacing:-.012em}
.chat-who{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.chat-who b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-who span{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-q{margin-top:12px;max-width:none;box-shadow:none}
.chat-q input{font-size:16px}
.chat-list{flex:1;overflow:auto;overscroll-behavior:contain;padding:6px 8px 12px}
.ch-row{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;width:100%;padding:10px;border-radius:14px}
.ch-row:hover,.ch-row:focus-visible{background:var(--surface-3)}
.ch-row:focus-visible{outline:2px solid var(--red)}
.ch-av{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14.5px;color:#fff;background:var(--c-aud)}
.ch-av[data-rol="dueno"]{background:var(--c-venta)}
.ch-av[data-rol="vendedor"]{background:var(--c-stock)}
.ch-av[data-rol="secretaria"]{background:var(--c-cli)}
.ch-av[data-rol="deposito"]{background:var(--c-caja)}
.ch-av.canal{background:var(--surface-3);color:var(--ink)}
.ch-av.canal[data-c="sistema"]{background:var(--red-soft);color:var(--red-ink)}
.ch-av svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9}
.chat-bar .ch-av{width:36px;height:36px;font-size:13px}
.ch-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ch-top{display:flex;align-items:baseline;gap:8px}
.ch-top b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ch-rol{font-size:12px;color:var(--faint);white-space:nowrap}
.ch-ts{margin-left:auto;font-size:12px;color:var(--faint);white-space:nowrap}
.ch-prev{font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ch-row.nl .ch-prev{color:var(--ink);font-weight:600}
.ch-row.nl .ch-ts{color:var(--red-ink);font-weight:700}
.ch-borr{color:var(--red-ink);font-weight:600}
.ch-badge{flex:none;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--red);color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center}
.chat-hilo{flex:1;overflow:auto;overscroll-behavior:contain;padding:12px 14px;display:flex;flex-direction:column;gap:4px;background:var(--surface-2)}
.chat-dia{display:flex;justify-content:center;margin:10px 0 6px}
.chat-dia span{font-size:12px;font-weight:650;color:var(--muted);background:var(--surface-3);padding:3px 10px;border-radius:999px}
.chat-mas{all:unset;cursor:pointer;align-self:center;font-size:13px;font-weight:650;color:var(--red-ink);padding:6px 12px;border-radius:999px;margin-bottom:4px}
.chat-mas:hover{background:var(--surface-3)}
.chat-vacio{margin:auto;text-align:center;color:var(--muted);font-size:14px;padding:30px 10px}
.burbuja{align-self:flex-start;max-width:82%;padding:8px 12px 6px;border-radius:18px 18px 18px 6px;background:var(--surface);border:1px solid var(--line);margin-top:6px}
.burbuja.seguida{margin-top:0;border-top-left-radius:6px}
.burbuja.mia{align-self:flex-end;background:var(--red);border-color:transparent;color:#fff;border-radius:18px 18px 6px 18px}
.burbuja.mia.seguida{border-top-right-radius:6px;border-top-left-radius:18px}
.burbuja.imp:not(.mia){background:var(--red-soft);border-color:transparent}
.burbuja.sis{max-width:92%}
.burbuja p{margin:0;font-size:15px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.burbuja .b-de{display:block;font-size:12.5px;color:var(--red-ink);margin-bottom:2px}
.burbuja .pill{margin-bottom:4px}
.burbuja.mia .pill{background:rgba(255,255,255,.2);color:#fff}
.burbuja .link{display:inline-block;margin:4px 0 0;font-size:13.5px}
.burbuja.mia .link{color:#fff}
.b-meta{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:2px;font-size:11.5px;color:var(--faint);white-space:nowrap}
.burbuja.mia .b-meta{color:rgba(255,255,255,.8)}
.chat-err{color:var(--red-ink);font-weight:700}
.burbuja.mia .chat-err{color:#fff;text-decoration:underline}
.b-del{all:unset;cursor:pointer;display:grid;place-items:center;width:22px;height:22px;border-radius:6px;margin-left:2px;opacity:.55}
.b-del svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.9}
.b-del:hover,.b-del:focus-visible{opacity:1;background:rgba(0,0,0,.08)}
@media (hover:hover){.b-del{opacity:0}.burbuja:hover .b-del,.b-del:focus-visible{opacity:.7}}
.chat-comp{flex:none;border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:6px;background:var(--surface)}
.chat-imp{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.chat-row{display:flex;align-items:flex-end;gap:8px}
.chat-row textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:20px;padding:10px 14px;font:inherit;font-size:16px;line-height:1.35;background:var(--surface-2);color:var(--ink);max-height:140px;outline:none}
.chat-row textarea:focus{border-color:var(--ink)}
.chat-send{width:44px;height:44px;padding:0;border-radius:50%;flex:none;display:grid;place-items:center}
.chat-send svg{width:19px;height:19px;margin:0}
.chat-solo{flex:none;margin:0;padding:14px 16px calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);font-size:13.5px;color:var(--muted);text-align:center}
@media (max-width:820px){.drawer.drawer-chat{height:92dvh;width:auto}.drawer.drawer-chat .dr-grab{display:block}}

/* ---------- verificación en dos pasos y anti-robots ---------- */
.dp-intro{margin:0 0 4px;color:var(--muted)}
.dp-pasos{margin:8px 0 0;padding-left:22px;display:flex;flex-direction:column;gap:16px;line-height:1.45}
.dp-pasos li::marker{font-weight:700;color:var(--ink)}
.dp-qr{width:200px;max-width:100%;margin:12px 0;padding:10px;background:#fff;border-radius:14px;border:1px solid var(--line)}
.dp-qr svg{display:block;width:100%;height:auto}
.dp-manual{margin-top:10px;font-size:14px}
.dp-manual summary{cursor:pointer;color:var(--muted);font-weight:600}
.dp-clave{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dp-clave code,.dp-respaldo code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:15px;letter-spacing:.06em;user-select:all}
.dp-form{display:flex;gap:8px;margin-top:10px}
.dp-codigo{font-size:22px !important;letter-spacing:.2em;text-align:center;font-variant-numeric:tabular-nums;max-width:220px}
.dp-respaldo{list-style:none;padding:14px;margin:12px 0;display:grid;grid-template-columns:repeat(2,1fr);gap:8px 16px;background:var(--surface-3);border-radius:14px}
.dp-ok{display:flex;align-items:center;gap:10px;margin:12px 0;font-weight:600}
.dp-card{max-width:440px}
.dp-card #dpBox h2{margin:0 0 6px}
.login .dp-codigo{max-width:none}
.login details.login-foot summary{cursor:pointer;font-weight:600;margin-bottom:6px}
.ts{min-height:65px}
@media (max-width:420px){.dp-respaldo{grid-template-columns:1fr}.dp-form{flex-direction:column}.dp-codigo{max-width:none}}

/* ---------- precio de la línea: conservar el de lista o calculadora ---------- */
.vs-pr{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;margin-left:8px;padding:4px 10px 4px 8px;border-radius:999px;background:var(--surface-3);color:var(--ink);border:1px solid color-mix(in srgb,var(--c-venta) 45%,var(--line));font-size:13.5px;font-weight:600;white-space:nowrap;transition:background-color .15s,color .15s}
.vs-pr:hover{color:var(--ink);background:color-mix(in srgb,var(--c-venta) 12%,var(--surface-3))}
.vs-pr:focus-visible{outline:2px solid var(--red)}
.vs-pr svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9;flex:none}
.vs-pr.mod{background:var(--red-soft);color:var(--red-ink)}
.vs-pr s{margin-left:3px;font-weight:500}
.vs-pr svg{color:var(--c-venta)}
.vs-pr-acc{margin-left:2px;padding-left:8px;border-left:1px solid var(--line-strong);color:var(--c-venta);font-weight:650}
.vs-pr.mod .vs-pr-acc{color:var(--red-ink)}
@media (max-width:820px){.vs-it .vs-pr{margin:6px 0 0;display:flex;width:max-content;max-width:100%;flex-wrap:wrap}}
.line .x .vs-pr{margin-left:2px}
.pc-box{max-width:420px}
.pc-opc{display:grid;gap:10px}
.pc-op{all:unset;cursor:pointer;display:flex;align-items:center;gap:14px;padding:16px;border:1.5px solid var(--line);border-radius:var(--r);background:var(--surface-2);transition:border-color .15s,background-color .15s}
.pc-op:hover:not([disabled]){border-color:var(--line-strong);background:var(--surface)}
.pc-op:focus-visible{outline:2.5px solid var(--red);outline-offset:2px}
.pc-op[disabled]{opacity:.5;cursor:not-allowed}
.pc-op b{display:block;font-size:16px}
.pc-op .muted{display:block;font-size:13.5px}
.pc-pant{display:flex;flex-direction:column;align-items:flex-end;gap:2px;padding:14px 16px;border-radius:var(--r);background:var(--surface-3);min-height:104px;justify-content:flex-end;text-align:right}
.pc-cinta{font-size:13.5px;color:var(--muted);min-height:20px}
.pc-val{font-size:40px;line-height:1.1;word-break:break-all}
.pc-dif{font-size:13px;color:var(--muted);min-height:19px}
.pc-dif .up,.pc-dif .down{font-weight:650}
.pc-rap{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.pc-teclas{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pc-k{all:unset;cursor:pointer;display:grid;place-items:center;height:54px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line);font-size:22px;font-weight:600;font-variant-numeric:tabular-nums;user-select:none;-webkit-user-select:none;transition:background-color .1s,transform .08s}
.pc-k:hover{background:var(--surface-3)}
.pc-k:active{transform:scale(.96)}
.pc-k:focus-visible{outline:2px solid var(--red)}
.pc-k.fn{color:var(--muted);font-size:19px}
.pc-k.op{background:var(--surface-3);color:var(--c-venta);font-size:24px}
.pc-k.igual{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.pc .acts{display:flex;gap:10px;justify-content:flex-end}
.pc .acts .btn.primary{flex:1;justify-content:center}
.pc .err-box{margin:10px 0 0}
@media (max-width:820px){.pc-box{max-width:none}.pc-k{height:58px}}

/* =====================================================================
   Diseño v3 · "sobrio": misma estructura, piel de sistema de gestión serio.
   Íconos de línea sin fondo de color, superficies planas con borde de 1 px,
   radios chicos, títulos en la letra del texto y el rojo solo donde importa.
   ===================================================================== */
.fig{font-stretch:100%;font-weight:620;letter-spacing:-.01em}

/* íconos: línea gris, sin cuadradito de color */
.chip-ic{background:transparent;color:var(--muted);border-radius:6px}
.chip-ic.lg{background:var(--surface-3);border-radius:8px}
.chip-ic svg{stroke-width:1.7}

/* menú lateral: barrita roja en lo seleccionado, nada de fondos de color */
.side{padding:18px 12px 12px}
.brand{padding:0 8px 16px}
.env{background:transparent;border:1px solid var(--line-strong);color:var(--muted);font-size:10px;letter-spacing:.08em;padding:2px 7px;border-radius:4px}
.nav .grp{font-size:10.5px;letter-spacing:.07em;font-weight:650;margin:18px 10px 4px}
.nav a{position:relative;border-radius:6px;padding:5px 8px;font-weight:520;font-size:14px;gap:10px}
.nav a .chip-ic{width:26px;height:26px}
.nav a .chip-ic svg{width:17px;height:17px}
.nav a:hover{background:var(--surface-3)}
.nav a[aria-current="page"]{background:var(--surface-3);box-shadow:none;color:var(--ink);font-weight:600}
.nav a[aria-current="page"]::before{content:"";position:absolute;left:-4px;top:7px;bottom:7px;width:3px;border-radius:0 2px 2px 0;background:var(--red)}
.nav a[aria-current="page"] .chip-ic{background:transparent;color:var(--ink)}
.nav .pronto{border-radius:4px}
.side-cta{margin:2px 0 12px}
.avatar{background:var(--surface-3);color:var(--ink);border:1px solid var(--line);font-weight:650}
.out-btn{border-radius:6px}

/* barra superior y controles */
.top{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}
.search{box-shadow:none;border-radius:8px}
.search:focus-within{border-color:var(--line-strong);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 8%,transparent)}
.kbd{border-bottom-width:1px;border-radius:4px}
.seg,.tema-sw{border-radius:8px;border:1px solid var(--line);background:var(--surface-2)}
.seg button,.tema-sw button{border-radius:6px}
.seg button[aria-pressed="true"],.tema-sw button[aria-pressed="true"]{box-shadow:0 0 0 1px var(--line-strong);background:var(--surface)}
.icon-btn,.suc-sel{border-radius:8px}
.icon-btn.sm{border-radius:6px}
.vercomo{border-radius:6px}

/* títulos: la letra del texto, sin mayúsculas gigantes (la condensada queda en el logo) */
.head h1,.hello h1,.ios-hello h1{font:650 26px/1.2 var(--font);text-transform:none;letter-spacing:-.015em}
.head .ctx,.hello p{font-size:14px}
.ios-hello span{font-size:12px;letter-spacing:.05em}
.view{gap:20px}

/* botones */
.btn{border-radius:8px;font-weight:580;min-height:40px;padding:8px 15px}
.btn:active{transform:none}
.btn.primary,.btn.primary:hover{box-shadow:none}
.btn.sm{border-radius:6px;min-height:32px}
.btn.lg{border-radius:8px;min-height:48px}
.help-link{border-radius:6px;border-style:solid;border-color:var(--line)}

/* superficies planas */
.panel,.stat,.tile,.info-box,.alert{box-shadow:none}
.panel > header{padding:16px 18px 0}
.panel > header h2{font-size:15px;font-weight:650}
.panel .body{padding:12px 18px 18px}
.tile{border-radius:var(--r)}
.tile::after{display:none}
.tile:hover{transform:none;box-shadow:none;border-color:var(--line-strong)}
.tile.hero .chip-ic{background:rgba(255,255,255,.16)}
.stat .v{font-size:26px}
.pill{border-radius:4px;font-weight:600;padding:2px 8px}

/* inicio: accesos como botones de herramienta, widgets planos */
.ios-apps{grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:14px 10px}
.ios-ic{width:52px;height:52px;border-radius:10px;background:var(--surface);border:1px solid var(--line);color:var(--ink);box-shadow:none}
.ios-app[data-mod="ayuda"] .ios-ic,.ios-app[data-mod="comprobantes"] .ios-ic{--mc:var(--muted)}
.ios-app[data-mod="venta"] .ios-ic{background:var(--red);border-color:var(--red);color:#fff}
.ios-ic svg{width:24px;height:24px;stroke-width:1.7}
.ios-app:hover .ios-ic{transform:none;border-color:var(--line-strong)}
.ios-app:active .ios-ic{transform:none}
.wg{border-radius:var(--r);background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;padding:16px}
.wg:hover{transform:none;box-shadow:none;border-color:var(--line-strong)}
.wg-h{font-size:12px;font-weight:650;text-transform:uppercase;letter-spacing:.05em}
.wg-big{font-size:clamp(22px,2.1vw,30px);font-weight:650;overflow-wrap:anywhere}
.wg .wg-h[style]{color:var(--muted)!important}

/* avisos: franja fina con filo rojo en lugar de bloques rojos */
.aviso{border-radius:8px;padding:10px 14px;box-shadow:none;animation:none}
.aviso.imp{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--red)}
.aviso p{font-size:13.5px}

/* tablas, listas y filtros */
table.data th,.vl-h,.bom th{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--muted)}
table.data td{padding:11px 16px}
.chip{border-radius:6px;font-weight:560;padding:5px 11px}
.chip[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-strong)}
.tabs button{border-bottom-width:2px;font-weight:600}
.vl-row{border-radius:6px}
.vl-ic{border-radius:6px}
.stepper{border-radius:8px}
.input{border-radius:6px}
.input:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 8%,transparent)}

/* venta */
.vs-n{width:26px;height:26px;font-size:13px;background:var(--surface-3);color:var(--ink);border:1px solid var(--line-strong)}
.vs-res{border-radius:10px}
.vs-op{border-radius:6px}
.vs-meta div{border-radius:8px}
.vs-nuevo{border-radius:10px;border-width:1px}
.vs-pr{border-radius:6px}
.cbte{border-radius:8px}
.steps span.on i{background:var(--ink)}

/* modales, menú móvil, avisos flotantes */
.modal-box{border-radius:12px}
.drawer{border-radius:12px}
.toast{border-radius:8px}
.pc-op{border-radius:10px;border-width:1px}
.pc-k{border-radius:8px}
.pc-pant{border-radius:10px}
.pc-k.op{color:var(--ink)}

/* ingreso */
.login-art::before,.login-art::after{display:none}
.login-art h2{font:650 44px/1.1 var(--font);text-transform:none;letter-spacing:-.02em}
.login h1{font:650 30px/1.2 var(--font);text-transform:none;letter-spacing:-.015em}

@media (max-width:820px){
  .head h1,.hello h1,.ios-hello h1{font-size:23px}
  .modal-box{border-radius:12px 12px 0 0}
  .mnav{box-shadow:0 -1px 0 var(--line),0 6px 18px rgba(0,0,0,.08)}
  .mnav{border-radius:14px}
  .mnav a{border-radius:10px}
  .mnav a[aria-current="page"]{background:transparent;color:var(--ink)}
  .mnav a.fab{box-shadow:none;border-radius:12px}
}

/* ---------- comprobante de venta: modelo "Grupo Modestan" (hoja.js · hojaVenta) ---------- */
@font-face{font-family:"GM Hanken";src:url(/assets/doc/HankenGrotesk-normal-400.ttf);font-weight:400;font-display:block}
@font-face{font-family:"GM Hanken";src:url(/assets/doc/HankenGrotesk-normal-600.ttf);font-weight:600;font-display:block}
@font-face{font-family:"GM Hanken";src:url(/assets/doc/HankenGrotesk-normal-700.ttf);font-weight:700;font-display:block}
@font-face{font-family:"GM Hanken";src:url(/assets/doc/HankenGrotesk-normal-800.ttf);font-weight:800;font-display:block}
@font-face{font-family:"GM Mont";src:url(/assets/doc/Montserrat-600.ttf);font-weight:600;font-display:block}
@font-face{font-family:"GM Mont";src:url(/assets/doc/Montserrat-700.ttf);font-weight:700;font-display:block}
@font-face{font-family:"GM Mont";src:url(/assets/doc/Montserrat-800.ttf);font-weight:800;font-display:block}
.a4.gm{--g1:#5f6166;--g2:#8b8d92;--g3:#d9dadc;--g4:#eeeff0;--g5:#f7f7f8;font-family:"GM Hanken",Arial,sans-serif;font-size:10.5px;line-height:1.35;color:#141414;padding:34px 40px 0;overflow:hidden;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.a4.gm::before{content:"";position:absolute;left:0;top:0;right:0;height:6px;background:linear-gradient(90deg,#141414 0 78%,#E40D18 78% 100%)}
.gm p,.gm h1,.gm h3,.gm dl,.gm dd,.gm ul{margin:0;padding:0}
.gm-marca{display:flex;align-items:center;gap:10px}
.gm-marca svg{flex:none}
.gm-wm{font-family:"GM Mont",Arial,sans-serif;font-weight:800;letter-spacing:.01em;line-height:1}
.gm-wm b{color:#E40D18;font-weight:800}
.gm-cab{display:grid;grid-template-columns:1fr 78px 1fr;gap:18px;align-items:start;padding-bottom:16px;border-bottom:1.5px solid #141414}
.gm-emp .gm-wm{font-size:27px}
.gm-emp p{margin-top:9px;line-height:1.55;color:var(--g1);font-size:9.6px}
.gm-emp p b{color:#141414;font-weight:700}
.gm-letra{border:1.5px solid #141414;border-radius:6px;text-align:center;padding:8px 4px 7px;margin-top:2px}
.gm-letra .l{font-family:"GM Mont";font-weight:800;font-size:30px;line-height:1}
.gm-letra small{display:block;margin-top:5px;font-size:6.6px;line-height:1.25;color:var(--g1);text-transform:uppercase;letter-spacing:.04em}
.gm-doc{text-align:right}
.gm-doc h1{font-family:"GM Mont";font-weight:800;font-size:23px;letter-spacing:.06em;line-height:1.1}
.gm-doc .nro{margin-top:4px;font-family:"GM Mont";font-weight:700;font-size:13px}
.gm-doc .nro span{color:#E40D18}
.gm-doc dl{margin-top:9px;display:grid;grid-template-columns:auto auto;justify-content:end;gap:3px 12px;font-size:9.6px;color:var(--g1)}
.gm-doc dt{text-align:right}
.gm-doc dd{text-align:right;color:#141414;font-weight:600}
.gm-cli{margin-top:14px;display:grid;grid-template-columns:1.25fr 1fr;border:1px solid var(--g3);border-radius:8px;overflow:hidden}
.gm-cli>dl{padding:11px 14px;display:grid;grid-template-columns:86px 1fr;gap:4px 8px;font-size:10px;align-content:start}
.gm-cli>dl+dl{border-left:1px solid var(--g3);background:var(--g5)}
.gm-cli dt{color:var(--g2);text-transform:uppercase;font-size:8px;letter-spacing:.08em;padding-top:1.5px;font-weight:600}
.gm-cli dd{font-weight:600}
.gm-cli dl:first-child dd:first-of-type{font-weight:800;font-size:11px}
.gm-det{position:relative;margin-top:14px}
.gm-sello{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:.04;pointer-events:none}
.gm table{width:100%;border-collapse:collapse;position:relative}
.gm thead th{background:#141414;color:#fff;font-family:"GM Mont";font-weight:700;font-size:8.2px;letter-spacing:.12em;text-transform:uppercase;padding:8px 10px;text-align:left}
.gm thead th:first-child{border-radius:6px 0 0 6px}.gm thead th:last-child{border-radius:0 6px 6px 0}
.gm th.r,.gm td.r{text-align:right}.gm th.c,.gm td.c{text-align:center}
.gm tbody td{padding:8.6px 10px;border-bottom:1px solid var(--g4);font-size:10.2px;vertical-align:top}
.gm tbody tr:nth-child(even) td{background:rgba(247,247,248,.7)}
.gm td.cod{font-family:"GM Mont";font-weight:600;font-size:8.8px;color:var(--g1);white-space:nowrap}
.gm td.desc b{font-weight:700}
.gm td.imp{font-weight:700}
.gm td.r{white-space:nowrap}
.gm .tag{display:inline-block;font-family:"GM Mont";font-size:6.8px;font-weight:700;letter-spacing:.1em;padding:1.5px 5px;border-radius:3px;margin-left:5px;vertical-align:1px}
.gm .t-c{background:#fde7e8;color:#E40D18}.gm .t-i{background:#e9eaec;color:#141414}
.gm-res{margin-top:14px;display:grid;grid-template-columns:1fr 262px;gap:18px;align-items:start}
.gm-obs h3{font-family:"GM Mont";font-weight:700;font-size:8.2px;letter-spacing:.14em;text-transform:uppercase;color:var(--g2);margin-bottom:6px}
.gm-obs ul{list-style:none;display:flex;flex-direction:column;gap:3.5px;font-size:9.4px;color:var(--g1);line-height:1.4}
.gm-obs li{display:flex;gap:7px}
.gm-obs li::before{content:"";flex:none;width:5px;height:5px;margin-top:4.5px;background:#E40D18;transform:rotate(45deg)}
.gm-obs li b{color:#141414}
.gm-tot{border:1px solid var(--g3);border-radius:8px;overflow:hidden}
.gm-tot div{display:flex;justify-content:space-between;padding:6.5px 13px;font-size:10.2px}
.gm-tot div span:first-child{color:var(--g1)}
.gm-tot div+div{border-top:1px solid var(--g4)}
.gm-tot .total{background:#141414;color:#fff;padding:11px 13px;align-items:center;border-top:0}
.gm-tot .total span:first-child{color:#fff;font-family:"GM Mont";font-weight:700;letter-spacing:.14em;font-size:9px;display:flex;align-items:center;gap:7px}
.gm-tot .total span:first-child::before{content:"";width:7px;height:7px;background:#E40D18;transform:rotate(45deg)}
.gm-tot .total span:last-child{font-family:"GM Mont";font-weight:800;font-size:16.5px}
.gm-letras{margin-top:6px!important;font-size:8.6px;color:var(--g1);font-style:italic;text-align:right;line-height:1.35}
.gm-firmas{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.gm-firmas div{border-top:1px solid var(--g2);padding-top:5px;font-size:8.6px;color:var(--g2);text-align:center;text-transform:uppercase;letter-spacing:.08em}
.gm-grupo{margin-top:auto;padding:16px 0 0;border-top:1px solid var(--g3);display:grid;grid-template-columns:86px 1fr 86px;align-items:center}
.gm-qr img{display:block;width:80px;height:80px}
.gm-qr small{display:block;width:80px;text-align:center;font-size:7px;color:var(--g2);margin-top:3px;letter-spacing:.04em}
.gm-centro{text-align:center}
.gm-tit{display:inline-flex;flex-direction:column;align-items:center}
.gm-tit .grp{font-family:"GM Mont";font-weight:600;font-size:8.6px;letter-spacing:.62em;color:var(--g2);margin-left:.62em}
.gm-tit .gm-marca{margin-top:4px}
.gm-tit .gm-wm{font-size:21px}
.gm-marcas3{margin-top:13px;display:flex;justify-content:center;align-items:center}
.gm-marcas3 .sub{display:flex;align-items:center;gap:7px;padding:0 20px}
.gm-marcas3 .sub+.sub{border-left:1px solid var(--g3)}
.gm-marcas3 .gm-wm{font-size:12.4px}
.gm-marcas3 .tx{display:flex;flex-direction:column;align-items:flex-start}
.gm-marcas3 .ds{font-family:"GM Mont";font-weight:600;font-size:6.6px;letter-spacing:.42em;color:var(--g1);margin-top:2.5px}
.gm-marcas3 .ds i{font-style:normal;color:#E40D18}
.gm-der{justify-self:end;text-align:right;font-size:7.6px;color:var(--g2);line-height:1.5}
.gm-der b{display:block;color:#141414;font-family:"GM Mont";font-weight:700;font-size:8px;letter-spacing:.1em}
.gm-confian{margin-top:14px;padding:12px 0 14px;border-top:1px solid var(--g4);display:flex;align-items:center;justify-content:center;gap:30px}
.gm-confian span{font-family:"GM Mont";font-weight:600;font-size:6.8px;letter-spacing:.32em;color:var(--g2);text-transform:uppercase}
.gm-confian img{display:block;width:auto}
.gm-base{background:#141414;color:#c9cacd;margin:0 -40px;padding:8px 40px;display:flex;justify-content:space-between;font-size:8.2px;letter-spacing:.03em}
.gm-base b{color:#fff;font-weight:600}

/* ---------- Feed ---------- */
.avatar.con-foto,.fd-av.con-foto{object-fit:cover;padding:0}
.fd{display:flex;flex-direction:column;gap:14px;max-width:680px;width:100%}
.fd-av{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--surface-3);border:1px solid var(--line);color:var(--ink);font-weight:650;font-size:14px}
.fd-av.sm{width:30px;height:30px;font-size:12px}
.fd-av.lg{width:46px;height:46px;font-size:17px}
.fd-nuevo{padding:14px 16px}
.fd-yo{display:flex;gap:12px;align-items:flex-start}
.fd-yo textarea{min-height:46px;resize:none;border-radius:8px;font-size:15px}
.fd-perfil{position:relative;cursor:pointer;flex:none}
.fd-cam{position:absolute;right:-3px;bottom:-3px;width:20px;height:20px;border-radius:50%;background:var(--ink);color:var(--surface);display:grid;place-items:center;border:2px solid var(--surface)}
.fd-cam svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.2}
.fd-prev{position:relative;margin:12px 0 0 58px;max-width:320px}
.fd-prev img{display:block;width:100%;border-radius:8px;border:1px solid var(--line)}
.fd-prev .icon-btn{position:absolute;top:6px;right:6px;background:var(--surface)}
.fd-barra{display:flex;align-items:center;gap:8px;margin:12px 0 0 58px;flex-wrap:wrap}
.fd-barra .btn.primary{margin-left:auto;min-width:96px}
.fd-tip{font-size:12.5px}
.fd-cuenta{font-size:12px}
.fd-lista{display:flex;flex-direction:column;gap:14px}
.fd-post{padding:14px 16px}
.fd-autor{display:flex;align-items:center;gap:10px}
.fd-autor > div{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.fd-autor b{font-weight:650;font-size:14.5px}
.fd-autor span{font-size:12.5px;color:var(--muted)}
.fd-borrar{margin-left:auto;border-color:transparent;color:var(--faint)}
.fd-borrar:hover{color:var(--red-ink)}
.fd-texto{margin-top:10px;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.fd-texto a{color:var(--red-ink)}
.fd-foto{display:block;margin:10px -16px 0;background:var(--surface-3)}
.fd-foto img{display:block;width:100%;max-height:560px;object-fit:contain}
.fd-acc{display:flex;align-items:center;gap:4px;margin-top:10px;padding-top:8px;border-top:1px solid var(--line);flex-wrap:wrap}
.fd-btn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:6px;font-size:13.5px;font-weight:560;color:var(--muted)}
.fd-btn:hover{background:var(--surface-3);color:var(--ink)}
.fd-btn:focus-visible{outline:2px solid var(--red)}
.fd-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.fd-btn.on{color:var(--red-ink)}
.fd-btn.on svg{fill:currentColor}
.fd-quienes{margin-left:auto;font-size:12.5px;color:var(--muted)}
.fd-coms{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.fd-com{display:flex;gap:8px;align-items:flex-start}
.fd-burbuja{background:var(--surface-3);border-radius:10px;padding:7px 11px;font-size:14px;line-height:1.4;overflow-wrap:anywhere;min-width:0}
.fd-burbuja b{font-weight:650}
.fd-burbuja > span{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.fd-burbuja .link{margin:0;font-size:11.5px}
.fd-comf{display:flex;gap:8px;align-items:center}
.fd-comf .input{min-height:36px;border-radius:18px;padding:6px 14px}
.fd-vacio{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 16px;text-align:center}
.fd-vacio svg{width:30px;height:30px;stroke:var(--faint);fill:none;stroke-width:1.6}
@media (max-width:820px){
  .fd-prev,.fd-barra{margin-left:0}
  .fd-post,.fd-nuevo{padding:12px 14px}
  .fd-foto{margin:10px -14px 0}
  .fd-quienes{margin-left:0;width:100%;padding-left:10px}
}