:root {
  --navy: #0b2545; --navy2: #13315c; --accent: #1d4e89;
  --bg: #f5f7fa; --line: #d8dee9; --neg: #9b1c1c; --ok: #14532d;
}
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.5 "Segoe UI", Arial, sans-serif; background: var(--bg); color: #1a2233; }
header { background: var(--navy); color: #fff; display: flex; align-items: center; gap: 1.5rem; padding: 0 1.25rem; flex-wrap: wrap; }
.brand { font-weight: 600; padding: .8rem 0; letter-spacing: .3px; }
nav { display: flex; flex-wrap: wrap; }
nav a { color: #cdd9ee; text-decoration: none; padding: .8rem .6rem; font-size: 13.5px; }
nav a:hover { color: #fff; background: var(--navy2); }
.empresa { margin-left: auto; }
.empresa select { background: var(--navy2); color: #fff; border: 1px solid var(--accent); border-radius: 4px; padding: .35rem .5rem; }
main { max-width: 1100px; margin: 1.5rem auto; padding: 0 1.25rem; }
h1 { font-size: 1.35rem; color: var(--navy); margin: .2rem 0 1rem; }
h2 { font-size: 1.05rem; color: var(--navy2); margin: 1.5rem 0 .5rem; }
table { border-collapse: collapse; width: 100%; background: #fff; box-shadow: 0 1px 2px rgba(11,37,69,.08); }
th { background: var(--navy2); color: #fff; text-align: left; font-weight: 500; font-size: 13px; padding: .5rem .6rem; }
td { border-bottom: 1px solid var(--line); padding: .4rem .6rem; }
tr:hover td { background: #eef3fa; }
.r { text-align: right; }
.pad { padding-left: 1.6rem; }
.muted { color: #8a94a6; }
.neg { color: var(--neg); }
.tot td { font-weight: 600; background: #e8eef7; border-top: 2px solid var(--navy2); }
.grp td { font-weight: 600; color: var(--navy); background: #eef2f8; }
.nocontab td, .pill.nocontab { background: #fbf6ec; }
.cards { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.card { background: #fff; border-top: 3px solid var(--accent); box-shadow: 0 1px 2px rgba(11,37,69,.08); padding: .7rem 1rem; min-width: 160px; }
.card .k { font-size: 12.5px; color: #5b6678; }
.card .v { font-size: 1.25rem; font-weight: 600; color: var(--navy); }
.flash { padding: .55rem .9rem; border-radius: 4px; margin-bottom: 1rem; }
.flash.ok { background: #e5f3e8; color: var(--ok); border: 1px solid #b7dec2; }
.flash.bad { background: #fbe9e9; color: var(--neg); border: 1px solid #eec3c3; }
.inline-form { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; background: #fff; padding: .75rem; margin-bottom: 1rem; box-shadow: 0 1px 2px rgba(11,37,69,.08); }
input, select { border: 1px solid var(--line); border-radius: 4px; padding: .4rem .5rem; font: inherit; }
input.qty { width: 80px; text-align: right; }
.w60 { width: 70px; } .w90 { width: 110px; }
button { background: var(--accent); color: #fff; border: 0; border-radius: 4px; padding: .45rem 1rem; font: inherit; cursor: pointer; }
button:hover { background: var(--navy2); }
button.sec { background: #6b7688; }
button.x { background: none; color: var(--accent); padding: 0 .3rem; font-size: 14px; }
button.x:hover { background: none; color: var(--navy); }
.pill { display: inline-block; border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: .25rem .8rem; margin: 0 .3rem .4rem 0; text-decoration: none; color: var(--navy2); font-size: 13.5px; }
.pill.sel { background: var(--navy); color: #fff; border-color: var(--navy); }
.nav-fecha { display: flex; gap: .6rem; align-items: center; margin-bottom: 1rem; }
.nav-fecha a { color: var(--accent); text-decoration: none; }
details { margin-bottom: 1rem; }
summary { cursor: pointer; color: var(--accent); margin-bottom: .5rem; }
@media print {
  header, .inline-form, button, .nav-fecha { display: none; }
  body { background: #fff; }
  @page { size: A4; margin: 15mm; }
}
.login-body { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: var(--navy); }
.login-card { background: #fff; border-radius: 8px; padding: 2rem 2.2rem; width: 340px; box-shadow: 0 8px 30px rgba(0,0,0,.35); }
.login-brand { font-size: 1.15rem; font-weight: 600; color: var(--navy); margin-bottom: 1.2rem; text-align: center; }
.login-card label, .inline-form.col label { display: block; font-size: 13px; color: #5b6678; margin-bottom: .8rem; }
.login-card input, .inline-form.col input { display: block; width: 100%; margin-top: .25rem; }
.login-card button { width: 100%; margin-top: .3rem; }
.inline-form.col { flex-direction: column; align-items: stretch; max-width: 380px; }
.userchip { color: #cdd9ee; font-size: 13px; padding: .8rem 0; }
.userchip a { color: #fff; text-decoration: none; margin-left: .5rem; }
.acciones details { display: inline-block; margin-right: .8rem; }
.grants { background: #fff; padding: .6rem; }
.grants label { display: block; font-size: 13.5px; margin-bottom: .3rem; }
.grants .nc { margin-left: 1rem; color: #8a6d1a; font-size: 12.5px; }
tr.muted td { color: #9aa3b2; }
table.mini { width: auto; min-width: 260px; margin: .4rem 0; }
td.detalle { font-size: 13px; color: #43506a; max-width: 480px; }