:root{--bg: #0f172a;--panel: #1e293b;--accent: #38bdf8;--ok: #22c55e;--error: #ef4444;--texto: #e2e8f0;font-family:-apple-system,system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--texto);min-height:100vh}#app{display:flex;flex-direction:column;min-height:100vh}.oculto{display:none!important}#app-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--panel);position:sticky;top:0;z-index:10;flex-wrap:wrap;gap:8px}#nav-principal{display:flex;gap:6px;flex-wrap:wrap}#nav-principal button,.boton{background:var(--accent);color:#052a3a;border:none;padding:10px 14px;border-radius:10px;font-weight:600;font-size:14px}.boton-secundario{background:transparent;border:1px solid var(--accent);color:var(--accent)}.boton-peligro{background:var(--error);color:#fff}#btn-logout{background:transparent;color:var(--texto);border:1px solid #475569}#contenido{flex:1;padding:16px;max-width:min(100%,clamp(640px,92vw,1200px));margin:0 auto;width:100%}.grid-tarjetas{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.grid-tarjetas>.tarjeta{margin-bottom:0}.tarjeta{background:var(--panel);border-radius:14px;padding:16px;margin-bottom:14px}input,select{width:100%;padding:12px;border-radius:10px;border:1px solid #475569;background:#0b1220;color:var(--texto);font-size:16px;margin-bottom:10px}label{font-size:13px;color:#94a3b8;display:block;margin-bottom:4px}#lector-camara{width:100%;border-radius:14px;overflow:hidden}.aviso-ok{color:var(--ok);font-weight:600}.aviso-error{color:var(--error);font-weight:600}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:8px 6px;border-bottom:1px solid #334155}.barra{background:var(--accent);height:10px;border-radius:5px}#banner-offline{background:#7c2d12;color:#fff;padding:10px 14px;text-align:center;font-size:13px}.badge-caso{display:inline-block;background:#38bdf826;border:1px solid var(--accent);color:var(--accent);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600}.badge-uso-general{display:inline-block;background:#94a3b81f;border:1px solid #475569;color:#94a3b8;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600}.escanear-con-lateral{display:flex;flex-direction:column;gap:14px}.escanear-principal{min-width:0}.panel-gasto-lateral{background:var(--panel);border-radius:14px;padding:16px;height:fit-content}.panel-gasto-lateral h4{margin-top:0}@media (min-width: 900px){.escanear-con-lateral{flex-direction:row;align-items:flex-start}.escanear-principal{flex:2}.panel-gasto-lateral{flex:1;position:sticky;top:74px}}@media (min-width: 640px){#contenido{padding:24px}}@media (max-width: 599px){#contenido{max-width:100%;padding:12px}.grid-tarjetas{grid-template-columns:1fr}}