:root{--vino:#2A0A12;--vino2:#43121F;--rojo:#C8102E;--rojo2:#9E0B23;--papel:#F4F6F8;--blanco:#fff;--tinta:#1F2430;--gris:#6B7280;--linea:#D9DDE3;
--cian:#00A0DC;--magenta:#E5007D;--amarillo:#FFD100;--negro:#1A1A1A;--verde:#1F9D55;--ambar:#B86E00;--suave:#F7EEF0;
color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--papel:#14161B;--blanco:#1E2128;--tinta:#ECEDEF;--gris:#9AA1AD;--linea:#343843;--suave:#2C1A20;color-scheme:dark}}
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--papel);color:var(--tinta);font:16px/1.5 "Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
padding-bottom:env(safe-area-inset-bottom,0px)}
a{color:var(--rojo)}
.barra{background:var(--vino);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px;
padding:calc(10px + env(safe-area-inset-top,0px)) 18px 10px;position:sticky;top:0;z-index:20;flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.marca .registro{width:36px;height:36px}
.marca b{display:block;font-size:20px;line-height:1.1}
.marca small{display:block;color:#D9A7B2;font-size:12px}
.cmyk{display:none}
.barra::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:5px;
background:linear-gradient(90deg,var(--cian) 0 25%,var(--magenta) 25% 50%,var(--amarillo) 50% 75%,var(--negro) 75%)}
.contenido{max-width:640px;margin:0 auto;padding:26px 16px 48px}
.contenido.ancho{max-width:1200px}
h1{font-size:clamp(26px,5vw,34px);line-height:1.15;margin:8px 0 6px}
h2{font-size:18px;margin:26px 0 10px;display:flex;align-items:center;gap:10px}
.intro p{color:var(--gris);margin:0 0 14px;max-width:52ch}
.paso{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--rojo);color:#fff;font-size:14px}
.tarjeta{background:var(--blanco);border:1px solid var(--linea);border-radius:14px;padding:18px}
.tarjeta>h2:first-child{margin-top:0}
.angosta{max-width:460px;margin:24px auto}
.centrado{text-align:center}
.oculto{display:none!important}
.soltar{display:block;border:2px dashed var(--linea);border-radius:12px;padding:26px 16px;text-align:center;cursor:pointer;background:var(--papel)}
.soltar:hover,.soltar.encima{border-color:var(--rojo)}
.soltar input{position:absolute;opacity:0;width:1px;height:1px}
.soltar strong{display:block;font-size:18px;color:var(--rojo)}
.soltar span{color:var(--gris);font-size:14px}
.soltar:focus-within{outline:3px solid var(--cian);outline-offset:2px}
.lista-archivos{list-style:none;margin:10px 0 0;padding:0}
.lista-archivos li{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;border-bottom:1px solid var(--linea);font-size:15px}
.lista-archivos li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lista-archivos li small{color:var(--gris);white-space:nowrap}
.lista-archivos li.mal small{color:var(--rojo)}
.opciones{display:grid;gap:8px}
.opcion{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--linea);border-radius:10px;padding:11px 12px;cursor:pointer;background:var(--blanco)}
.opcion:has(input:checked){border-color:var(--rojo);background:var(--suave);box-shadow:inset 4px 0 0 var(--rojo)}
.opcion input{margin-top:4px;accent-color:var(--rojo);width:18px;height:18px}
.opcion b{display:block}.opcion small{color:var(--gris)}
.campo{display:block;margin:12px 0;font-size:14px;color:var(--gris)}
.campo input,.campo select,.campo textarea{display:block;width:100%;margin-top:4px;font:inherit;font-size:16px;color:var(--tinta);background:var(--blanco);
border:1px solid var(--linea);border-radius:9px;padding:10px 12px}
.campo input:focus,.campo select:focus,.campo textarea:focus,.buscar input:focus{outline:2px solid var(--rojo);outline-offset:0;border-color:var(--rojo)}
.campo.corto input{max-width:140px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.boton{display:inline-block;font:inherit;font-weight:600;border:1px solid var(--linea);background:var(--blanco);color:var(--tinta);border-radius:9px;
padding:10px 16px;cursor:pointer;text-decoration:none;text-align:center}
.boton:hover{border-color:var(--rojo)}
.boton:focus-visible{outline:3px solid var(--cian);outline-offset:2px}
.boton.grande,.boton.principal{background:var(--rojo);border-color:var(--rojo);color:#fff}
.boton.grande{display:block;width:100%;font-size:18px;padding:15px;margin-top:12px}
.boton.grande:hover,.boton.principal:hover{background:var(--rojo2)}
.boton.secundario{display:block;margin-top:8px}
.boton.whatsapp{display:block;background:#1FA855;border-color:#1FA855;color:#fff;margin-top:12px}
.boton[disabled]{opacity:.6;cursor:wait}
.resumen{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--papel);border-radius:10px;padding:14px;margin-top:18px}
.resumen strong{font-size:26px;color:var(--rojo);white-space:nowrap}
.progreso{position:relative;height:30px;background:var(--papel);border-radius:9px;overflow:hidden;margin-top:12px}
.progreso div{position:absolute;inset:0 auto 0 0;width:0;background:var(--rojo);transition:width .2s}
.progreso span{position:relative;display:block;text-align:center;line-height:30px;font-size:14px;font-weight:600;mix-blend-mode:difference;color:#fff}
.letra-chica{color:var(--gris);font-size:13px;margin:12px 0 0}
.aviso{border-radius:10px;padding:12px 14px;margin:0 0 14px;border:1px solid}
.aviso p{margin:2px 0}
.aviso.error{background:#FDECEE;border-color:#F3B4BE;color:#8A0B1F}
.aviso.ok{background:#E8F6EE;border-color:#A7DDBE;color:#13643A}
.aviso.info{background:#EAF6FC;border-color:#A9DDF3;color:#0B5B7E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .aviso.error{background:#3A1219;color:#FFB8C3}:root:not([data-theme="light"]) .aviso.ok{background:#12301F;color:#A7E8C1}:root:not([data-theme="light"]) .aviso.info{background:#0E2A38;color:#A9DDF3}}
.grande-aviso{font-size:17px}
.folio-etiqueta{margin:0;color:var(--gris);font-size:14px}
.folio{font-size:44px;font-weight:800;letter-spacing:.04em;margin:0 0 10px;color:var(--rojo)}
.linea-tiempo{list-style:none;padding:0;margin:16px 0;display:grid;gap:0}
.linea-tiempo li{position:relative;padding:8px 0 8px 32px;color:var(--gris)}
.linea-tiempo li::before{content:"";position:absolute;left:6px;top:13px;width:14px;height:14px;border-radius:50%;border:2px solid var(--linea);background:var(--blanco)}
.linea-tiempo li:not(:last-child)::after{content:"";position:absolute;left:13px;top:29px;width:2px;height:calc(100% - 16px);background:var(--linea)}
.linea-tiempo li.hecho{color:var(--tinta)}.linea-tiempo li.hecho::before{background:var(--verde);border-color:var(--verde)}
.linea-tiempo li.actual{color:var(--tinta);font-weight:700}.linea-tiempo li.actual::before{background:var(--rojo);border-color:var(--rojo);box-shadow:0 0 0 5px rgba(200,16,46,.18)}
.datos{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:16px 0}
.datos dt{color:var(--gris)}.datos dd{margin:0}
/* panel */
.menu{display:flex;gap:4px;flex-wrap:wrap}
.menu a{color:#F3E6E9;text-decoration:none;padding:7px 12px;border-radius:8px}
.menu a.activo,.menu a:hover{background:var(--vino2);color:#fff}
.menu a.tenue{color:#C79AA5}
.globo{display:inline-block;min-width:20px;padding:0 6px;border-radius:10px;background:var(--rojo);color:#fff;font-size:12px;text-align:center}
.globo:empty,.globo[data-cero]{display:none}
.cabeza-panel{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.cabeza-panel h1{margin:0}
.tenue{color:var(--gris)}
.buscar{display:flex;gap:6px}
.buscar input{font:inherit;padding:9px 12px;border:1px solid var(--linea);border-radius:9px;min-width:240px;background:var(--blanco);color:var(--tinta)}
.filtros{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 14px}
.filtros a{text-decoration:none;color:var(--tinta);border:1px solid var(--linea);background:var(--blanco);border-radius:20px;padding:6px 14px;font-size:14px}
.filtros a.activo{border-color:var(--vino);background:var(--vino);color:#fff}
.tabla{background:var(--blanco);border:1px solid var(--linea);border-radius:12px;overflow:hidden}
.fila{display:grid;grid-template-columns:130px 1fr 90px 110px 120px;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--linea);
color:var(--tinta);text-decoration:none;border-left:4px solid transparent}
.fila:last-child{border-bottom:0}
.fila:hover{background:var(--papel)}
.fila small{display:block;color:var(--gris);font-size:13px}
.fila.estado-nuevo{border-left-color:var(--rojo)}
.fila.estado-imprimiendo{border-left-color:var(--magenta)}
.fila.estado-listo{border-left-color:var(--verde)}
.f-total{font-weight:700;text-align:right}
.chip{display:inline-block;text-align:center;border-radius:20px;padding:4px 12px;font-size:13px;font-weight:700;background:var(--papel);color:var(--gris)}
.chip.grande{font-size:16px;padding:8px 18px}
.chip-nuevo.chip{background:var(--rojo);color:#fff}
.chip-imprimiendo.chip{background:var(--magenta);color:#fff}
.chip-listo.chip{background:var(--verde);color:#fff}
.chip-entregado.chip{background:#4B5563;color:#fff}
.vacio{background:var(--blanco);border:1px dashed var(--linea);border-radius:12px;padding:40px;text-align:center;color:var(--gris)}
.columnas{display:grid;grid-template-columns:1fr 360px;gap:16px;align-items:start}
.columnas aside .tarjeta+.tarjeta{margin-top:16px}
.miniaturas{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin-top:14px}
.mini{border:1px solid var(--linea);border-radius:10px;padding:10px;background:var(--papel);min-width:0}
.mini img{display:block;width:100%;height:200px;object-fit:contain;background:#fff;border-radius:6px}
.sin-vista{height:200px;display:grid;place-items:center;text-align:center;color:var(--gris);font-size:13px;background:var(--blanco);border-radius:6px}
.mini b{display:block;margin-top:8px;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mini small{color:var(--gris);font-size:12px}
.mini .acciones{display:flex;gap:12px;margin-top:6px;font-size:14px}
.botones-estado{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.botones-estado .boton.actual{outline:3px solid var(--tinta);outline-offset:1px}
.botones-estado .chip-nuevo{border-color:var(--rojo)}.botones-estado .chip-imprimiendo{border-color:var(--magenta)}.botones-estado .chip-listo{border-color:var(--verde)}
.nuevo-aviso{position:sticky;top:76px;z-index:15;background:var(--rojo);color:#fff;border-radius:10px;padding:12px 16px;margin-bottom:12px;animation:entra .35s ease-out}
.nuevo-aviso a{color:#fff;font-weight:700}
@keyframes entra{from{transform:translateY(-10px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.tabla-tarifas{display:grid;gap:10px}
.tarifa{display:grid;grid-template-columns:1.2fr 1.4fr 120px auto;gap:12px;align-items:end;padding:12px 16px}
.tarifa small{display:block;color:var(--gris)}
.tarifa .campo{margin:0}
code{background:var(--blanco);border:1px solid var(--linea);border-radius:5px;padding:1px 6px}
@media (max-width:900px){.columnas{grid-template-columns:1fr}.tarifa{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
 .fila{grid-template-columns:1fr auto;grid-template-areas:"folio chip" "cliente total"}
 .f-folio{grid-area:folio}.f-cliente{grid-area:cliente}.f-total{grid-area:total}.fila .chip{grid-area:chip}.f-entrega{display:none}
 .buscar input{min-width:0;flex:1}.buscar{width:100%}
}
.total-pedido{margin:4px 0 0;font-size:18px}.total-pedido b{color:var(--rojo)}
.tarjeta>input.oculto+h2{margin-top:0}