:root { --azul:#1565F9; --verde:#16A34A; --rojo:#DC2626; --gris-bg:#F3F4F6; --borde:#E5E7EB; --texto:#1F2937; --suave:#6B7280; }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body { margin:0; background:var(--gris-bg); color:var(--texto); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
#root { max-width:480px; margin:0 auto; min-height:100vh; background:#fff; padding-bottom:env(safe-area-inset-bottom); }
.header { background:linear-gradient(155deg,#0D2E8C,var(--azul)); color:#fff; padding:20px 18px; }
.logo { font-size:13px; font-weight:800; opacity:.85; margin:0 0 4px; }
.negocio { font-size:19px; font-weight:800; margin:0; }
.contenido { padding:16px; }
.vacio { text-align:center; color:var(--suave); padding:40px 10px; font-size:14px; }
.card { border:1px solid var(--borde); border-radius:14px; padding:14px; margin-bottom:14px; background:#fff; }
.card h2 { font-size:15px; margin:0 0 10px; }
.estado { border-radius:14px; padding:14px; margin-bottom:14px; font-size:14px; line-height:1.45; }
.estado strong { display:block; font-size:16px; margin-bottom:2px; }
.e-ok { background:#DCFCE7; color:#166534; }
.e-aviso { background:#FEF3C7; color:#92400E; }
.e-mal { background:#FEE2E2; color:#991B1B; }
.e-info { background:#DBEAFE; color:#1E40AF; }
.fila { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid var(--borde); }
.fila:last-child { border-bottom:none; }
.fila .k { font-size:12px; color:var(--suave); font-weight:700; }
.fila .v { font-size:15px; font-weight:800; word-break:break-all; }
.copiar { border:1px solid var(--borde); background:var(--gris-bg); border-radius:9px; padding:7px 11px; font-size:12px; font-weight:800; cursor:pointer; flex-shrink:0; font-family:inherit; color:var(--texto); }
.copiar.listo { background:#DCFCE7; color:#166534; border-color:#BBF7D0; }
.nota { font-size:12.5px; color:var(--suave); line-height:1.5; margin:10px 0 0; }
label { display:block; font-size:12px; font-weight:700; color:var(--suave); margin:12px 0 4px; }
input[type=text], input[type=number] { width:100%; border:1px solid var(--borde); border-radius:10px; padding:11px 12px; font-size:16px; font-family:inherit; }
.archivo { display:block; width:100%; border:2px dashed #BFD7FF; background:#F5F9FF; color:var(--azul); border-radius:12px; padding:16px; text-align:center; font-weight:800; font-size:14px; cursor:pointer; }
.archivo input { display:none; }
.preview { max-width:100%; max-height:200px; border-radius:10px; margin-top:10px; display:block; }
.archivo-nombre { font-size:12.5px; color:var(--suave); margin-top:8px; word-break:break-all; }
.enviar { width:100%; margin-top:14px; background:var(--azul); color:#fff; border:none; border-radius:12px; padding:14px; font-weight:800; font-size:15px; cursor:pointer; font-family:inherit; }
.enviar:disabled { background:var(--borde); color:var(--suave); cursor:not-allowed; }
.msg { font-size:13px; font-weight:700; margin-top:10px; }
.msg.err { color:var(--rojo); } .msg.ok { color:var(--verde); }
.hist { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:9px 0; border-bottom:1px solid var(--borde); font-size:13px; }
.hist:last-child { border-bottom:none; }
.fila.total { border-top: 2px solid var(--borde); margin-top: 4px; }
.hist small { display:block; color:var(--suave); font-size:11.5px; margin-top:2px; }
.chip { border-radius:20px; padding:3px 10px; font-size:11px; font-weight:800; flex-shrink:0; }
.c-confirmado { background:#DCFCE7; color:#166534; } .c-pendiente { background:#DBEAFE; color:#1E40AF; } .c-rechazado { background:#FEE2E2; color:#991B1B; }
.seguro { font-size:11.5px; color:var(--suave); text-align:center; padding:6px 20px 24px; line-height:1.5; margin:0; }