/* HdosO-T · Estilos. Identidad: 06_IDENTIDAD_VISUAL_EMSA.md
   Dos interfaces (D-46, D-47):
     · Operador (tablet del patio): mosaicos, botones grandes, barra inferior con el escaneo al centro.
     · Administrativo (oficina): barra institucional azul con módulos en pestañas y subpestañas.
   Tema claro único: bajo sol directo una pantalla oscura se vuelve espejo (01 §8). */
:root{
  --azul:#0025A1; --azul-bri:#004DFF; --azul-pro:#090085;
  --verde:#006500; --verde-bri:#008200;
  --gota-a:#1C3AA5; --gota-c:#00A5ED;
  --fondo:#F5F6F8; --sup:#FFFFFF; --sup-2:#F1F4F9; --sup-azul:#EAF0FF;
  --texto:#0B1220; --suave:#585857; --borde:#D8DEE9;
  --ok:#006500; --alerta:#E8A700; --alerta-txt:#7A5600; --alerta-f:#FFF4D6; --error:#C81E1E; --credito:#1C3AA5;
  --grad-azul:linear-gradient(135deg,#004DFF 0%,#090085 100%);
  --grad-gota:linear-gradient(180deg,#1C3AA5 0%,#00A5ED 100%);
  --sombra:0 1px 2px rgba(11,18,32,.06),0 6px 18px rgba(9,0,133,.07);
  --f-tit:'Poppins','Segoe UI',system-ui,sans-serif;
  --f-txt:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--fondo);color:var(--texto);font-family:var(--f-txt);line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
.num,.n{font-variant-numeric:tabular-nums}
h1,h2{font-family:var(--f-tit);font-weight:700;margin:0;letter-spacing:-.01em;line-height:1.15}
h2{font-size:22px}
h3{font-family:var(--f-tit);font-size:16px;margin:0}
.sub2{color:var(--suave);font-size:14px}
.ayuda{color:var(--suave);font-size:13.5px;margin:6px 0}
.centro{text-align:center}
.mono,.mono-chico{font-family:Consolas,'Courier New',monospace}
.mono-chico{font-size:12px;color:var(--suave)}
small{font-size:12px}
.ico{flex-shrink:0;display:block}

/* ══ Botones ══ */
.b{font-family:var(--f-tit);font-weight:600;font-size:15px;border-radius:12px;border:1px solid transparent;padding:0 18px;min-height:56px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;color:inherit;background:none}
.b:focus-visible,.tq:focus-visible,.pago:focus-visible,.segmento button:focus-visible,.mosaico:focus-visible,a:focus-visible{outline:3px solid var(--gota-c);outline-offset:2px}
.b.pri{background:var(--azul);color:#fff}
.b.sec{background:var(--sup);color:var(--texto);border-color:var(--borde)}
.b.ok{background:var(--verde);color:#fff}
.b.peligro{background:var(--error);color:#fff}
.b.peligro-sec{background:#fff;color:var(--error);border-color:var(--error)}
.b.credito{background:var(--credito);color:#fff}
.b.grande{width:100%;min-height:72px;font-size:18px}
.b.b-chico{min-height:44px;font-size:13px;padding:0 12px;border-radius:10px}
.b[disabled]{opacity:.45;cursor:not-allowed}
.enlace{background:none;border:0;color:var(--azul);font-weight:600;cursor:pointer;padding:4px 0;font-size:13.5px;text-decoration:underline;font-family:inherit}

/* ══ Formularios ══ */
.campo{margin-bottom:12px}
label{display:block;font-family:var(--f-tit);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--suave);margin-bottom:5px}
input,select,textarea{width:100%;min-height:52px;padding:0 14px;font-family:var(--f-txt);font-size:16px;background:var(--sup);color:var(--texto);border:1px solid var(--borde);border-radius:10px}
textarea{min-height:90px;padding:12px 14px;resize:vertical}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--gota-c);outline-offset:1px}
input[type=checkbox]{width:22px;height:22px;min-height:0;accent-color:var(--azul)}
input.grande{font-family:var(--f-tit);font-size:30px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums;min-height:72px}
select[disabled]{background:var(--sup-2);color:var(--suave)}
/* El atributo hidden gana siempre a cualquier display de componente */
[hidden]{display:none!important}
.interruptor{display:flex;align-items:center;gap:10px;text-transform:none;letter-spacing:0;font-size:15px;color:var(--texto);font-family:var(--f-txt);cursor:pointer;margin:6px 0;font-weight:500}
.err-campo{color:var(--error);font-size:13px;font-weight:600;margin-top:5px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.form-rejilla{display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}
.ancho2{grid-column:1/-1}

/* ══ Chips de estado (comunes) ══ */
.chip{background:var(--sup-2);color:var(--texto);border:1px solid var(--borde);padding:6px 12px;border-radius:999px;font-weight:600;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:13px;font-family:var(--f-txt)}
.chip.turno-noche{background:var(--azul-pro);color:#fff;border-color:var(--azul-pro)}
.chip-off{background:var(--alerta-f);border-color:var(--alerta);color:#5A3B00}
.chip-btn{cursor:pointer;min-height:44px}
.punto{width:9px;height:9px;border-radius:50%;background:var(--verde-bri);display:inline-block}
.punto.rojo{background:var(--error)}
.franja-off{background:var(--alerta);color:var(--texto);padding:10px 20px;font-size:14px;font-weight:600}
.franja-noche{background:var(--gota-a);color:#fff;padding:10px 20px;font-size:14px;font-weight:600;display:flex;align-items:center;gap:10px}

/* ══ Interfaz ADMINISTRATIVA · barra institucional (D-47) ══ */
.ad-cab{background:var(--grad-azul);color:#fff;position:sticky;top:0;z-index:40}
.ad-sup{min-height:60px;display:flex;align-items:center;gap:14px;padding:6px 24px;flex-wrap:wrap}
.ad-logo{width:48px;height:40px;border-radius:9px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ad-logo img{height:32px}
.ad-marca{display:flex;flex-direction:column;line-height:1.15}
.ad-marca b{font-family:var(--f-tit);font-size:17px}
.ad-marca small{font-size:11px;opacity:.85;letter-spacing:.08em}
.ad-meta{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.ad-meta .chip{background:rgba(255,255,255,.14);color:#fff;border-color:transparent}
.ad-meta .chip.en-linea{background:#fff;color:var(--verde)}
.ad-meta .chip.chip-off{background:var(--alerta);color:var(--texto)}
.ad-meta .chip.turno-noche{background:rgba(255,255,255,.22)}
.ad-nav{display:flex;align-items:stretch;gap:2px;padding:0 16px;overflow-x:auto;scrollbar-width:thin}
.ad-nav a{display:flex;align-items:center;gap:8px;padding:0 14px;min-height:48px;color:#fff;text-decoration:none;font-weight:500;font-size:14px;opacity:.92;white-space:nowrap;border-radius:10px 10px 0 0}
.ad-nav a[aria-current="page"]{background:var(--fondo);color:var(--azul);font-weight:700;opacity:1}
.ad-nav a:hover:not([aria-current="page"]){background:rgba(255,255,255,.12)}
@media (max-width:1440px){.ad-nav{padding:0 8px}.ad-nav a{padding:0 9px;gap:6px;font-size:13.5px}}
.insignia{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--alerta);color:var(--texto);font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.ad-subnav{background:#fff;border-bottom:1px solid var(--borde);min-height:52px;display:flex;align-items:center;gap:6px;padding:6px 24px;flex-wrap:wrap}
.ad-subnav a{padding:8px 14px;border-radius:8px;color:var(--texto);font-size:14px;text-decoration:none;font-weight:500}
.ad-subnav a[aria-current="page"]{background:var(--sup-azul);color:var(--azul);font-weight:700}
.ad-subnav .der{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ad-subnav .der select{min-height:38px;width:auto;font-size:14px;padding:0 10px}
.ad-main{max-width:1480px;margin:0 auto;padding:22px 24px 60px}

/* ══ Interfaz OPERADOR · mosaicos (D-46) ══ */
body.modo-op{padding-bottom:96px}
.op-cab{min-height:62px;display:flex;align-items:center;gap:14px;padding:6px 20px;background:#fff;border-bottom:1px solid var(--borde);position:sticky;top:0;z-index:40;flex-wrap:wrap}
.op-cab img{height:40px}
.op-pozo{font-family:var(--f-tit);font-weight:700;font-size:18px;color:var(--azul)}
.op-meta{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.op-meta .chip{font-size:14px}
.op-main{max-width:1320px;margin:0 auto;padding:18px 20px 30px}
.op-barra{position:fixed;left:0;right:0;bottom:0;height:84px;background:#fff;border-top:1px solid var(--borde);display:flex;justify-content:center;align-items:stretch;gap:min(140px,14vw);z-index:45;box-shadow:0 -4px 16px rgba(9,0,133,.06)}
.op-barra a{width:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--suave);text-decoration:none;font-weight:600;font-size:14px;position:relative}
.op-barra a[aria-current="page"]{color:var(--azul);font-weight:700;box-shadow:inset 0 4px 0 var(--azul)}
.op-barra .op-escanear{position:absolute;left:50%;top:-30px;transform:translateX(-50%);width:104px;height:104px;border-radius:52px;background:var(--grad-azul);color:#fff;border:5px solid #fff;box-shadow:0 6px 16px rgba(9,0,133,.35);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-family:var(--f-tit);font-size:12px;font-weight:700;cursor:pointer}
.op-barra .insignia{position:absolute;top:12px;left:calc(50% + 6px)}

.mosaicos-op{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.mosaico{background:#fff;border:1px solid var(--borde);border-radius:20px;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;text-decoration:none;color:var(--texto);cursor:pointer;font-family:var(--f-txt);text-align:left;box-shadow:var(--sombra);position:relative;min-height:230px}
.mosaico:hover{border-color:var(--azul)}
.mosaico .mo-ico{width:72px;height:72px;border-radius:18px;background:var(--sup-azul);color:var(--azul);display:flex;align-items:center;justify-content:center}
.mosaico.principal{background:var(--grad-azul);color:#fff;border-color:transparent}
.mosaico.principal .mo-ico{background:rgba(255,255,255,.18);color:#fff}
.mosaico.principal .mo-txt{color:rgba(255,255,255,.9)}
.mosaico b{font-family:var(--f-tit);font-size:24px;line-height:1.15}
.mosaico .mo-txt{font-size:15px;color:var(--suave)}
.mosaico .insignia{position:absolute;top:18px;right:18px;font-size:14px;height:30px;min-width:30px;border-radius:15px}
.resumen-turno{margin-top:18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}

/* ══ Páginas comunes ══ */
.pagina-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.pagina-cab h1{font-size:24px;color:var(--azul)}
.pagina-cab p{margin:4px 0 0;color:var(--suave);font-size:14px}
.pagina-cab .acciones{display:flex;gap:10px;flex-wrap:wrap}
.tarjeta{background:var(--sup);border:1px solid var(--borde);border-radius:14px;padding:16px 18px;box-shadow:var(--sombra)}
.tarjeta + .tarjeta{margin-top:14px}
.tarjeta h3{margin-bottom:10px;color:var(--azul)}
.rejilla-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.rejilla-lateral{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:18px}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:14px;padding:14px 16px;box-shadow:var(--sombra);display:flex;flex-direction:column;gap:2px}
.kpi .et{font-family:var(--f-tit);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--suave)}
.kpi .vl{font-family:var(--f-tit);font-size:26px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums}
.kpi .pie{font-size:13px;color:var(--suave)}
.kpi.azul{background:var(--grad-azul);color:#fff;border-color:transparent}
.kpi.azul .et,.kpi.azul .pie{color:rgba(255,255,255,.88)}
.kpi.verde .vl{color:var(--verde)}
.kpi.credito .vl{color:var(--credito)}
.kpi.alerta{background:var(--alerta-f);border-color:#F0D58A}
.kpi.alerta .et,.kpi.alerta .pie{color:var(--alerta-txt)}
.kpi.error{background:#FBE9E9;border:2px solid var(--error)}
.kpi.error .vl{color:var(--error)}
.mosaicos-ad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.mosaicos-ad .mosaico{min-height:150px;padding:18px;border-radius:16px;gap:6px}
.mosaicos-ad .mosaico .mo-ico{width:46px;height:46px;border-radius:12px}
.mosaicos-ad .mosaico b{font-size:17px}
.mosaicos-ad .mosaico .mo-txt{font-size:13px}
.mosaicos-ad .mosaico .insignia{font-size:12px;height:24px;min-width:24px;top:14px;right:14px}
.nota{background:var(--sup-azul);border-left:4px solid var(--azul);border-radius:0 10px 10px 0;padding:11px 14px;font-size:13.5px;margin:14px 0 0}
.nota.alerta{background:var(--alerta-f);border-left-color:var(--alerta)}
.nota.ok{background:#E6F2E6;border-left-color:var(--verde)}
.nota.err{background:#FBE9E9;border-left-color:var(--error)}
.aviso-off{background:var(--alerta-f);border:1px solid var(--alerta);border-radius:10px;padding:10px 14px;font-size:14px;font-weight:500;margin-bottom:12px}
.vacio{padding:40px;text-align:center;color:var(--suave)}
.filtros{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.filtros .campo{min-width:170px;margin-bottom:0}
.filtros input,.filtros select{min-height:46px;font-size:15px}
.barra-acc{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.barra-acc .b{min-height:46px}

/* ══ Tablas ══ */
.tabla-env{overflow-x:auto;border:1px solid var(--borde);border-radius:12px;background:var(--sup)}
table{width:100%;border-collapse:collapse;font-size:14px}
th{background:var(--sup-2);font-family:var(--f-tit);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--suave);text-align:left;padding:10px 12px;white-space:nowrap}
th.n{text-align:right}
td{padding:9px 12px;border-top:1px solid var(--borde);vertical-align:middle}
td.n{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
td.num{white-space:nowrap}
tfoot td{background:var(--sup-2);font-weight:700}
.acc-celda{white-space:nowrap}
.acc-celda .b + .b{margin-left:5px}
tr.inactivo td{opacity:.5}
.fila-activa td{background:#EAF7FD}

/* ══ Píldoras ══ */
.pill{font-family:var(--f-tit);font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;display:inline-block}
.pill.efe{background:rgba(0,101,0,.12);color:var(--verde)}
.pill.tra{background:rgba(0,165,237,.16);color:var(--gota-a)}
.pill.cre{background:var(--credito);color:#fff}
.pill.curso,.pill.alr{background:var(--alerta-f);color:var(--alerta-txt)}
.pill.cerr{background:rgba(0,101,0,.12);color:var(--verde)}
.pill.canc{background:rgba(88,88,87,.15);color:var(--suave)}
.pill.err{background:var(--error);color:#fff}

/* ══ Venta ══ */
.venta{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.captura{background:var(--sup);border:1px solid var(--borde);border-radius:14px;box-shadow:var(--sombra);overflow:hidden}
.cap-cab{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid var(--borde)}
.cap-cab h2{color:var(--azul);font-size:20px}
.segmento{display:inline-flex;background:var(--sup-2);border:1px solid var(--borde);border-radius:12px;padding:4px;gap:4px}
.segmento button{font-family:var(--f-tit);font-weight:600;font-size:14px;border:0;background:none;padding:0 16px;min-height:48px;border-radius:9px;cursor:pointer;color:var(--suave)}
.segmento button[aria-pressed="true"]{background:var(--azul);color:#fff}
.cap-cols{display:grid;grid-template-columns:1fr 1fr;gap:0}
.cap-col{padding:14px 18px}
.cap-col + .cap-col{border-left:1px solid var(--borde)}
.bloque{margin-bottom:16px}
.bloque-tit{font-family:var(--f-tit);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--suave);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.bloque-tit small{text-transform:none;letter-spacing:0;color:var(--suave);font-weight:500}
.num-paso{width:24px;height:24px;border-radius:50%;background:var(--azul);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px}
.entrada-placa{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:10px}
.captura .veh-card{margin-top:12px;border:2px solid var(--gota-c);border-radius:12px;padding:12px 14px;background:#F2F8FF}
.captura .veh-card.conv{border-color:var(--credito);background:var(--sup-azul)}
.veh-placa{font-family:var(--f-tit);font-weight:700;font-size:24px;letter-spacing:.03em;display:flex;flex-direction:column;line-height:1.15;margin-bottom:8px}
.veh-placa small{font-family:var(--f-txt);font-weight:500;font-size:13px;color:var(--suave);letter-spacing:0}
dl.datos{margin:0;display:grid;grid-template-columns:auto 1fr;gap:5px 12px;font-size:14px}
dl.datos dt{color:var(--suave);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;font-family:var(--f-tit);align-self:center}
dl.datos dd{margin:0;font-weight:600}
.tanques{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tq{background:var(--sup);border:1px solid var(--borde);border-radius:12px;padding:10px 4px;cursor:pointer;text-align:center;font-family:var(--f-tit);display:flex;flex-direction:column;align-items:center;gap:3px;min-height:124px;justify-content:center;color:var(--texto)}
.tq[aria-pressed="true"]{border:3px solid var(--azul);background:var(--sup-azul)}
.tq[disabled]{opacity:.4;cursor:not-allowed;border-style:dashed}
.tq .lt{font-size:15px;font-weight:700}
.tq .mx{font-size:13px;color:var(--suave);font-weight:600}
.tq[aria-pressed="true"] .mx{color:var(--azul)}
.tq .exc{font-size:10px;color:var(--error);font-weight:700;text-transform:uppercase}
.pagos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pago{min-height:60px;border-radius:12px;border:1px solid var(--borde);background:var(--sup);font-family:var(--f-tit);font-weight:700;font-size:15px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--texto)}
.pago small{font-size:10px;font-weight:600;color:var(--suave);text-transform:uppercase}
.pago[disabled]{opacity:.4;cursor:not-allowed}
.pago-efectivo[aria-pressed="true"]{background:#E6F2E6;border:2px solid var(--verde);color:var(--verde)}
.pago-transferencia[aria-pressed="true"]{background:#E5F6FD;border:2px solid var(--gota-c);color:var(--gota-a)}
.pago-credito[aria-pressed="true"]{background:var(--sup-azul);border:2px solid var(--credito);color:var(--credito)}
.nota-turno{background:var(--gota-a);color:#fff;border-radius:9px;padding:8px 12px;font-size:13.5px;margin-bottom:8px;font-weight:500}
.total{display:flex;justify-content:space-between;align-items:baseline;background:var(--sup-2);border-radius:12px;padding:14px 18px}
.total span{font-family:var(--f-tit);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--suave);font-weight:700}
.total b{font-family:var(--f-tit);font-size:36px;font-weight:700;color:var(--azul)}
.cap-pie{border-top:1px solid var(--borde);padding:12px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--sup)}
.faltan{font-size:14px;color:var(--suave)}
.faltan b{color:var(--texto)}
.faltan .listo{color:var(--verde);font-weight:700}
.acciones{display:flex;gap:10px;flex-wrap:wrap}
.acciones.vertical{flex-direction:column;align-items:stretch;margin:12px 0}
.b-confirmar{min-width:240px;font-size:17px;min-height:60px}

/* Cobro del operador (mosaicos): banda del vehículo + tres columnas */
.op-sin-veh{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;align-items:stretch}
.op-sin-veh .grande-escanear{min-height:260px;border-radius:20px;font-size:26px;flex-direction:column;gap:14px}
.banda-veh{border-radius:16px;background:var(--grad-azul);color:#fff;display:flex;align-items:center;gap:22px;padding:18px 26px;flex-wrap:wrap;margin-bottom:16px}
.banda-veh .placa{font-family:var(--f-tit);font-weight:700;font-size:36px;letter-spacing:.05em;line-height:1.1}
.banda-veh .et{font-size:12px;letter-spacing:.1em;opacity:.85}
.banda-veh .cli{flex:1;min-width:220px;display:flex;flex-direction:column}
.banda-veh .cli b{font-size:18px}
.banda-veh .pill-conv{padding:8px 14px;border-radius:999px;background:#fff;color:var(--credito);font-size:13px;font-weight:700}
.banda-veh .b{background:rgba(255,255,255,.16);color:#fff;border-color:transparent;min-height:48px}
.op-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.op-col{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}
.op-col h2{font-size:17px;color:var(--azul)}
.op-col select{min-height:60px;font-size:17px;font-weight:600}
.op-col .tanques{grid-template-columns:repeat(2,1fr)}
.op-col .tq{min-height:130px}
.op-col .pagos{grid-template-columns:1fr}
.op-pie{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:16px}
.op-pie .faltan{flex:1;font-size:15px}

/* ══ Cola ══ */
.cola{background:var(--sup);border:1px solid var(--borde);border-radius:14px;box-shadow:var(--sombra);padding:14px;position:sticky;top:180px;max-height:calc(100vh - 200px);overflow:auto}
.cola-cab{margin-bottom:8px}
.cola-cab h3{color:var(--azul)}
.cola-sec{margin-top:12px}
.cola-tit{font-family:var(--f-tit);font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--suave);display:flex;align-items:center;gap:8px;margin-bottom:6px}
.cuenta{background:var(--sup-2);border:1px solid var(--borde);border-radius:999px;padding:0 8px;font-size:12px;color:var(--texto)}
.cuenta-viva{background:var(--alerta);border-color:var(--alerta);color:var(--texto)}
.cola-total{margin-left:auto;color:var(--texto)}
.cola-item{border:1px solid var(--borde);border-radius:10px;padding:10px 12px;margin-bottom:8px;font-size:13.5px;background:#fff}
.cola-item.curso{border-left:5px solid var(--alerta)}
.cola-item.activo{box-shadow:0 0 0 3px rgba(0,165,237,.35)}
.cola-item.canc{opacity:.7}
.ci-l1{display:flex;justify-content:space-between;gap:8px;font-size:14px}
.ci-l2{color:var(--texto);margin-top:2px}
.ci-l3{color:var(--suave);font-size:12.5px;margin-top:4px;display:flex;gap:5px;flex-wrap:wrap;align-items:center}
.ci-acc{display:flex;gap:6px;margin-top:8px}
.cola-vacia{color:var(--suave);font-size:13.5px;padding:10px 4px;text-align:center}
.grande-vacia{padding:34px 10px;font-size:15px}
.cola-op{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.cola-op .cola-item{padding:14px 16px;font-size:15px}
.cola-op .ci-l1{font-size:16px}
.cola-op .ci-acc .b{min-height:52px;font-size:15px}

/* ══ Impresión (administrativo) ══ */
.estacion{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:18px;align-items:start}
.est-lista,.est-vista{background:var(--sup);border:1px solid var(--borde);border-radius:14px;box-shadow:var(--sombra);padding:16px}
.est-vista{position:sticky;top:180px}
.est-vista-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-family:var(--f-tit)}
.job{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:#fff;border:1px solid var(--borde);border-radius:12px;padding:12px 14px;margin-bottom:8px;cursor:pointer;font-family:var(--f-txt);font-size:14px;color:var(--texto)}
.job.activo{border:2px solid var(--azul)}
.job .job-dat{flex:1;display:flex;flex-direction:column;gap:2px}
.job-l1{display:flex;gap:10px;align-items:baseline;font-size:15px}
.job-l3{color:var(--suave);font-size:12.5px;display:flex;gap:6px;align-items:center}
.vista-ticket{display:flex;justify-content:center;align-items:flex-start;background:#EEF0F4;border-radius:10px;padding:14px 8px;max-height:62vh;overflow:auto}

/* ══ Caja ══ */
.corte-res{border-radius:14px;border:3px solid var(--verde);background:#fff;padding:18px;display:flex;flex-direction:column;gap:8px}
.corte-res.faltante{border-color:var(--error)}
.corte-res.sobrante{border-color:var(--alerta)}
.corte-res .etq{align-self:flex-start;padding:4px 12px;border-radius:999px;background:var(--verde);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em}
.corte-res.faltante .etq{background:var(--error)}
.corte-res.sobrante .etq{background:var(--alerta);color:var(--texto)}
.corte-res .cifra{font-family:var(--f-tit);font-size:42px;font-weight:700;font-variant-numeric:tabular-nums}
.corte-res.faltante .cifra{color:var(--error)}
.corte-res .ln{display:flex;justify-content:space-between;font-size:14px}
.corte-res .ln span{color:var(--suave)}
.monto{font-family:var(--f-tit);font-size:24px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}

/* ══ Reportes y Telegram ══ */
.rep-marco{background:#EEF0F4;border-radius:12px;padding:16px;overflow:auto;display:flex;justify-content:center;align-items:flex-start}
.rep{width:900px;flex-shrink:0;background:#fff;font-family:var(--f-txt);color:var(--texto);box-shadow:0 4px 18px rgba(11,18,32,.18)}
.rep-cab{position:relative;padding:30px 38px 28px;background:var(--grad-azul);color:#fff;display:flex;flex-direction:column;gap:12px;overflow:hidden}
.rep-cab .marca{display:flex;align-items:center;gap:14px}
.rep-cab .logo{width:74px;height:60px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center}
.rep-cab .logo img{height:50px}
.rep-cab .rep-lema{display:flex;flex-direction:column;gap:3px;font-size:12px;letter-spacing:.2em}
.rep-cab .demo{margin-left:auto;padding:5px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.6);font-size:11px;letter-spacing:.08em}
.rep-cab h1{font-size:34px;line-height:1.1;margin-top:4px}
.rep-cab .sub{font-size:16px;opacity:.95}
.rep-cab .fecha{align-self:flex-start;padding:9px 20px;border-radius:999px;background:#fff;color:var(--azul-pro);font-family:var(--f-tit);font-weight:700;font-size:16px}
.rep-cab .ondas{position:absolute;top:0;right:0;opacity:.2}
.rep-cpo{padding:24px 38px;display:flex;flex-direction:column;gap:14px}
.rep-sec{margin:8px 0 0;padding-bottom:8px;border-bottom:2px solid #C9D3F0;font-size:13px;letter-spacing:.18em;color:var(--azul);font-family:var(--f-txt)}
.rep-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.rep-kpis.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rep-kpis.k2{grid-template-columns:repeat(2,minmax(0,1fr))}
.rep-kpi{padding:13px 14px;border-radius:12px;border:1px solid var(--borde);display:flex;flex-direction:column;gap:2px}
.rep-kpi .e{font-size:10.5px;letter-spacing:.1em;color:var(--suave);font-weight:600}
.rep-kpi .v{font-family:var(--f-tit);font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
.rep-kpi .p{font-size:12px;color:var(--suave)}
.rep-kpi.azul{background:var(--grad-azul);color:#fff;border-color:transparent}
.rep-kpi.azul .e,.rep-kpi.azul .p{color:rgba(255,255,255,.9)}
.rep-kpi.b-verde{box-shadow:inset 4px 0 0 var(--verde)}
.rep-kpi.b-cian{box-shadow:inset 4px 0 0 var(--gota-c)}
.rep-kpi.b-cred{box-shadow:inset 4px 0 0 var(--credito)}
.rep-kpi.falt{background:#FBE9E9;border:2px solid var(--error)}
.rep-kpi.falt .v{color:var(--error)}
.rep-kpi.sobr{background:var(--alerta-f);border:2px solid var(--alerta)}
.rep-barra{display:flex;align-items:center;gap:16px}
.rep-barra .lbl{width:200px;display:flex;flex-direction:column;flex-shrink:0}
.rep-barra .lbl b{font-size:14px}
.rep-barra .lbl span{font-size:12px;color:var(--suave)}
.rep-barra .pista{flex:1;height:40px;border-radius:8px;background:#EEF1F8;position:relative;display:flex;align-items:center}
.rep-barra .relleno{height:100%;border-radius:8px;display:flex;align-items:center;padding-left:12px;color:#fff;font-family:var(--f-tit);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:max-content;padding-right:10px}
.rep-barra .pct{position:absolute;right:12px;font-family:var(--f-tit);font-weight:700;font-size:14px;color:var(--azul-pro)}
.rep-cols{height:240px;display:grid;gap:12px;align-items:end}
.rep-cols .col{display:flex;flex-direction:column;align-items:center;gap:5px}
.rep-cols .col b{font-family:var(--f-tit);font-size:12px;color:var(--azul-pro);font-variant-numeric:tabular-nums}
.rep-cols .col .bar{width:100%;border-radius:8px 8px 0 0;background:var(--grad-azul)}
.rep-cols .col span{font-size:12px;font-weight:600}
.rep-cols .col small{font-size:11px;color:var(--suave)}
.rep-tabla{width:100%;border-collapse:collapse;font-size:13px}
.rep-tabla th{background:var(--azul);color:#fff;font-size:10.5px}
.rep-tabla td{padding:8px 10px;border-top:1px solid #E4E8F0}
.rep-tabla tfoot td{background:#EEF1F8}
.rep-pie{min-height:70px;display:flex;align-items:center;gap:24px;padding:0 38px;background:var(--azul);color:#fff;font-size:12px}
.rep-pie span{margin-left:auto;text-align:right;line-height:1.5}
.rep-destacado{padding:12px 16px;border-radius:12px;background:var(--sup-azul);color:var(--azul-pro);font-size:14px}

/* ══ Diálogos y avisos ══ */
.velo-fijo{position:fixed;inset:0;background:rgba(11,18,32,.55);display:flex;align-items:center;justify-content:center;padding:16px;z-index:100;overflow:auto}
.modal{background:var(--sup);border-radius:16px;max-width:480px;width:100%;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.3);max-height:calc(100vh - 32px);display:flex;flex-direction:column}
.modal-ancho{max-width:780px}
.modal-muy-ancho{max-width:1000px}
.modal-cab{padding:15px 22px;font-family:var(--f-tit);font-weight:700;font-size:15px;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--azul)}
.modal-cab.err{background:var(--error)}
.modal-cab.alr{background:var(--alerta);color:var(--texto)}
.modal-cab.ok{background:var(--verde)}
.modal-cpo{padding:20px 22px;overflow:auto;font-size:15px}
.modal-cpo p{margin:0 0 10px}
.modal-pie{padding:0 22px 20px;display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.modal-pie .b{flex:1}
.lineas{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:15px;margin:4px 0 12px}
.lineas .et{color:var(--suave)}
.lineas .vl{font-weight:600;text-align:right;font-family:var(--f-tit)}
.lineas .sep{grid-column:1/-1;height:1px;background:var(--borde)}
.grande-azul{font-size:28px;color:var(--azul)}
#avisos{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:200;width:min(560px,calc(100vw - 32px))}
.aviso{background:var(--verde);color:#fff;padding:13px 18px;border-radius:12px;font-weight:600;font-size:15px;box-shadow:0 8px 24px rgba(0,0,0,.25);transition:opacity .4s,transform .4s}
.aviso.err{background:var(--error)}
.aviso.alr{background:var(--alerta);color:var(--texto)}
.aviso.sale{opacity:0;transform:translateY(8px)}

/* ══ Escáner ══ */
.escaner{display:grid;grid-template-columns:minmax(0,1.3fr) 1fr;gap:16px}
.visor-cam{position:relative;background:#0D1117;border-radius:12px;overflow:hidden;aspect-ratio:4/3}
.visor-cam video{width:100%;height:100%;object-fit:cover;display:block}
.mira{position:absolute;inset:18%;border:3px solid var(--gota-c);border-radius:12px;box-shadow:0 0 0 2000px rgba(0,0,0,.25)}
.cam-msg{position:absolute;left:10px;right:10px;bottom:10px;color:#fff;font-size:13.5px;text-align:center;text-shadow:0 1px 3px #000}
.esc-lado{display:flex;flex-direction:column;gap:10px}
.b-archivo{position:relative}
.esc-sim{border:1px dashed var(--borde);border-radius:10px;padding:10px;display:flex;flex-wrap:wrap;gap:6px}
.esc-sim-tit{width:100%;font-family:var(--f-tit);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--suave)}
.esc-sim small{color:var(--suave);font-weight:500}

/* ══ Acceso ══ */
.acceso{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--grad-azul)}
.acceso-caja{background:var(--sup);border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.3);padding:30px;max-width:860px;width:100%;text-align:center}
.acceso-logo{height:96px}
.acceso h1{font-family:var(--f-tit);color:var(--azul);margin:6px 0 0;font-size:30px}
.acceso .sub{color:var(--suave);margin:2px 0 18px}
.acceso-grupo{text-align:left;margin-top:14px}
.acceso-grupo h2{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--suave);margin-bottom:8px}
.nota-acceso{font-size:13px;color:var(--suave);margin:16px 0 8px}
.talos{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12.5px;color:var(--suave);margin-top:10px}
.talos img{height:22px}

/* ══ Constancia pública ══ */
.publica{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.pub-caja{background:#fff;border-radius:16px;box-shadow:var(--sombra);padding:30px;max-width:460px;text-align:center;border-top:6px solid var(--azul)}
.pub-logo{height:80px}
.pub-caja h1{font-family:var(--f-tit);color:var(--azul);font-size:24px}
.codigo-http{font-family:var(--f-tit);font-size:13px;color:var(--suave);letter-spacing:.2em}
.publica-doc{padding:0 12px 30px}
.pub-barra{position:sticky;top:0;background:var(--azul);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 14px;margin:0 -12px 16px;font-family:var(--f-tit);font-weight:600;z-index:5}
.pub-barra .b{background:#fff;color:var(--azul);min-height:46px}
.pub-hoja{display:flex;justify-content:center}

/* ══ Ticket térmico 80 mm (01 §5) ══ */
.papel{background:#fff;color:#111;width:302px;flex-shrink:0;padding:14px 15px 26px;font-family:'Courier New',monospace;font-size:11.5px;line-height:1.45;box-shadow:0 3px 16px rgba(16,20,24,.24);position:relative}
.papel::after{content:"";position:absolute;left:0;right:0;bottom:0;height:11px;background:repeating-linear-gradient(135deg,#EEF0F4 0 7px,transparent 7px 14px)}
.papel.sin-corte::after{display:none}
.papel .ctr{text-align:center}
.papel .div{border-top:1px dashed #777;margin:6px 0}
.papel .div2{border-top:2px solid #111;margin:6px 0}
.papel .et{font-size:9.5px;color:#444;letter-spacing:.03em}
.papel .lema-tk{letter-spacing:.14em;font-weight:bold}
.papel .big{font-size:13.5px;font-weight:bold}
.papel .fila2{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.papel .leyendas{font-size:8.5px;line-height:1.4;color:#222;padding-left:13px;margin:5px 0}
.papel .leyendas li{margin-bottom:3px}
.tk-row{display:flex;gap:7px;align-items:flex-start;margin:5px 0}
.tk-row svg{flex-shrink:0;margin-top:1px}
.tk-tit{background:#111;color:#fff;text-align:center;font-weight:bold;padding:4px 0;letter-spacing:.08em;font-size:12px;margin:6px 0}
.tk-reimp{border:2px solid #111;text-align:center;font-weight:bold;letter-spacing:.1em;padding:3px 0;margin-bottom:6px}
.tk-pie{font-size:8.5px;color:#444;margin-top:6px}
.qr-par{display:flex;gap:12px;justify-content:center;margin:9px 0}
.qr-par figure{margin:0;text-align:center;font-size:7.5px;color:#222;line-height:1.3;font-weight:bold}
.qr-par figcaption{margin-top:3px}
.qr-vacio{width:96px;height:96px;border:1px dashed #777;display:flex;align-items:center;justify-content:center;font-size:8px;text-align:center}
.logo-tkt{width:132px;margin:0 auto 3px;display:block;filter:grayscale(1) contrast(2.6) brightness(.8)}

/* ══ Constancia carta (01 §6) ══ */
.hoja{background:#fff;color:#111;width:100%;max-width:760px;box-shadow:0 8px 30px rgba(16,20,24,.24);border-radius:4px;overflow:hidden;font-family:var(--f-txt);font-size:12px;line-height:1.45;position:relative}
.hoja-ondas{position:absolute;right:0;bottom:26px;width:270px;height:120px;opacity:.13;pointer-events:none}
.hoja-cab{padding:16px 22px 14px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;border-bottom:3px solid #0025A1}
.hoja-cab img{height:62px;width:auto}
.hoja-tit{font-family:var(--f-tit);font-size:25px;font-weight:700;color:#0025A1;line-height:1.06;text-align:center;flex:1;min-width:210px}
.lema{font-size:8.5px;letter-spacing:.17em;text-transform:uppercase;color:#585857;margin-top:4px;font-weight:600}
.folio-caja{display:grid;gap:5px;min-width:168px}
.folio-tap{background:#090085;color:#fff;border-radius:7px;padding:7px 13px;text-align:center}
.folio-tap .e{font-size:8px;letter-spacing:.16em;text-transform:uppercase;opacity:.8;font-family:var(--f-tit);font-weight:600}
.folio-tap .f{font-family:var(--f-tit);font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}
.valido{background:#006500;color:#fff;border-radius:7px;padding:6px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.valido .t{font-family:var(--f-tit);font-size:9.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;line-height:1.1}
.banda{display:grid;grid-template-columns:repeat(3,1fr);background:#EAF0FF;border-bottom:1px solid #B9C9F0}
.banda .bl{padding:10px 14px;border-right:1px solid #B9C9F0;display:flex;gap:10px;align-items:center}
.banda .bl:last-child{border-right:0}
.banda .e{font-family:var(--f-tit);font-size:8px;letter-spacing:.13em;text-transform:uppercase;color:#0025A1;font-weight:600}
.banda .v{font-weight:700;font-variant-numeric:tabular-nums;font-size:13px;color:#090085;font-family:var(--f-tit)}
.banda .n{font-size:8px;color:#3D5BB5}
.hoja-cpo{padding:16px 22px 20px;position:relative;z-index:1}
.barra-sec{background:#0025A1;color:#fff;font-family:var(--f-tit);font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;padding:6px 13px;border-radius:5px 5px 0 0;margin:0}
.cuerpo-sec{border:1px solid #B9C9F0;border-top:0;border-radius:0 0 5px 5px;padding:12px 14px}
.pdf-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;align-items:start}
.rej{display:grid;gap:8px}
.rej .ln{display:grid;grid-template-columns:22px 1fr;gap:9px;align-items:start}
.rej .e{font-family:var(--f-tit);font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#585857;font-weight:600}
.rej .v{font-weight:700;font-size:12px;color:#111;line-height:1.25}
.ic-c{width:22px;height:22px;border-radius:50%;background:#EAF0FF;display:flex;align-items:center;justify-content:center}
.qr-panel{background:#F2F6FF;border:1px solid #B9C9F0;border-radius:5px;overflow:hidden}
.qr-panel .cab{background:#0025A1;color:#fff;font-family:var(--f-tit);font-size:9px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;padding:6px 11px;text-align:center}
.qr-fila{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:11px;align-items:center}
.qr-fila + .qr-fila{border-top:1px solid #CFDCF7}
.qr-fila .qt{font-family:var(--f-tit);font-size:10.5px;font-weight:700;color:#0025A1;line-height:1.2}
.qr-fila .qs{font-size:9px;color:#48566E;line-height:1.35;margin-top:3px}
.declara{background:#F2F6FF;border-left:4px solid #00A5ED;padding:10px 13px;font-size:11px}
.condi{font-size:9px;line-height:1.45;color:#222;columns:2;column-gap:20px;margin:0;padding-left:14px}
.condi li{margin-bottom:3px;break-inside:avoid}
.legal-lat{font-size:9px;line-height:1.45;color:#333}
.legal-tit{font-family:var(--f-tit);font-size:9.5px;font-weight:700;color:#0025A1;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.firma{margin-top:16px;text-align:center}
.firma .ln{border-top:1px solid #111;width:190px;margin:26px auto 4px}
.firma .rub{font-family:'Segoe Script','Brush Script MT',cursive;font-size:24px;color:#0025A1;margin-bottom:-16px}
.firma-et{font-family:var(--f-tit);font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;color:#0025A1;font-weight:700}
.firma-pie{font-size:9px;margin-top:2px;color:#585857}
.hoja-pie{background:#0025A1;color:#fff;padding:9px 14px;display:flex;justify-content:center;gap:20px;flex-wrap:wrap;position:relative;z-index:1}
.hoja-pie span{display:flex;align-items:center;gap:6px;font-family:var(--f-tit);font-size:9.5px;font-weight:600;letter-spacing:.11em;text-transform:uppercase}

/* ══ Hoja de etiquetas QR, carta 3 × 8 ══ */
.hoja-etiquetas{width:197mm;font-family:var(--f-txt);color:#111}
.rejilla-et{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:31mm}
.et-celda{border:1px dashed #999;display:flex;align-items:center;gap:3mm;padding:2mm 3mm;overflow:hidden}
.et-dat{font-size:9pt;line-height:1.25;min-width:0}
.et-pl{font-family:var(--f-tit);font-weight:700;font-size:13pt}
.et-cl{color:#444;font-size:7.5pt;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:36mm}
.et-instr{font-size:8pt;color:#444;margin-top:3mm}

/* ══ Impresión ══ */
#zona-impresion{position:absolute;left:-10000px;top:0;background:#fff}
@media print{
  body,body.modo-op{background:#fff;padding:0}
  body.imprimiendo > *:not(#zona-impresion){display:none!important}
  body.imprimiendo #zona-impresion{position:static;left:0}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .zona-ticket .papel{width:72mm;box-shadow:none;margin:0;padding:2mm 0}   /* alineado a la izquierda de la hoja */
  .zona-ticket .papel::after{display:none}
  .zona-carta .hoja{box-shadow:none;max-width:none;border-radius:0}
  .zona-reporte .rep{box-shadow:none}
}

/* ══ Adaptación a pantallas menores ══ */
@media screen and (max-width:1180px){
  .venta,.estacion,.rejilla-lateral{grid-template-columns:1fr}
  .cola,.est-vista{position:static;max-height:none}
  .mosaicos-ad{grid-template-columns:repeat(3,minmax(0,1fr))}
  .op-cols{grid-template-columns:1fr 1fr}
}
@media screen and (max-width:820px){
  .cap-cols,.dos,.tres,.form-rejilla,.escaner,.rejilla-2,.cola-op,.op-sin-veh,.op-cols,.mosaicos-op,.resumen-turno{grid-template-columns:1fr}
  .cap-col + .cap-col{border-left:0;border-top:1px solid var(--borde)}
  .tanques{grid-template-columns:repeat(2,1fr)}
  .mosaicos-ad{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pdf-grid,.banda{grid-template-columns:1fr}
  .condi{columns:1}
  .b-confirmar{min-width:0;flex:1}
  .op-barra{gap:0}
  .op-barra a{width:33%}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Aviso persistente de nueva versión (no se puede cerrar: se resuelve con «Actualizar») */
#aviso-version{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:9999;display:flex;gap:14px;align-items:center;max-width:min(760px,calc(100vw - 24px));background:var(--azul-pro);color:#fff;padding:12px 14px 12px 18px;border-radius:14px;box-shadow:0 10px 30px rgba(9,0,133,.35);font-size:15px}
#aviso-version .av-txt{flex:1;min-width:0}
#aviso-version .b{flex-shrink:0;min-height:48px}
body.modo-op #aviso-version{bottom:calc(110px + env(safe-area-inset-bottom,0px))}
@media print{#aviso-version{display:none!important}}

/* Número de versión: siempre visible y discreto (esquina inferior izquierda) */
#marca-version{position:fixed;left:8px;bottom:calc(4px + env(safe-area-inset-bottom,0px));z-index:9998;font:500 11px/1 var(--f-txt);color:var(--suave);opacity:.7;pointer-events:none;letter-spacing:.02em;font-variant-numeric:tabular-nums}
@media print{#marca-version{display:none!important}}
body:has(.acceso) #marca-version{color:#fff;opacity:.6}

/* Nombre del sistema como fórmula química: H₂O-T (el 2 en subíndice, sin mover la línea) */
.marca-h2o sub{font-size:.62em;line-height:0;vertical-align:-.28em;letter-spacing:0}

/* Sección que solo existe en la versión de demostración (no estará en la aplicación final) */

/* Inicio de la oficina: centrado y con tamaños para monitor de escritorio (11/10/2026) */
.inicio-ad{max-width:1360px;margin:0 auto;padding-top:8px}
.inicio-ad .pagina-cab h1{font-size:34px}
.inicio-ad .pagina-cab p{font-size:17px}
.inicio-ad .kpis{gap:18px;margin-bottom:22px}
.inicio-ad .kpi{padding:22px 24px}
.inicio-ad .kpi .et{font-size:13px}
.inicio-ad .kpi .vl{font-size:36px}
.inicio-ad .kpi .pie{font-size:15px}
.inicio-ad .tarjeta{padding:24px 26px}
.inicio-ad .tarjeta h3{font-size:20px;margin-bottom:10px}
.inicio-ad .lineas{font-size:17px;row-gap:12px}
.inicio-ad .tarjeta ul{font-size:16px!important}
.inicio-ad .rejilla-lateral{gap:20px}
@media (max-width:1180px){.inicio-ad .kpi .vl{font-size:28px}.inicio-ad .pagina-cab h1{font-size:28px}}