:root{
  --tinta:#0d2f36; --petroleo:#10454f; --petroleo-2:#16606d;
  --menta:#2ec4b6; --menta-osc:#1c9b90;
  --arena:#f6f7f5; --papel:#ffffff; --linea:#e2e7e6;
  --gris:#5d6b6e; --gris-claro:#8b989b;
  --rojo:#c0392b; --ambar:#d68910; --verde:#1e8449;
  --sombra:0 1px 2px rgba(13,47,54,.06),0 4px 14px rgba(13,47,54,.06);
  --radio:10px;
  --sans:"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);background:var(--arena);color:var(--tinta);font-size:14.5px;line-height:1.55}
a{color:var(--petroleo-2);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 .5rem;font-weight:650;letter-spacing:-.01em}
h1{font-size:1.5rem}h2{font-size:1.15rem}h3{font-size:1rem}

/* Barra superior */
.barra{background:var(--petroleo);color:#fff;padding:0 1.25rem;display:flex;align-items:center;gap:1.25rem;height:56px;position:sticky;top:0;z-index:50}
.marca{display:flex;align-items:center;gap:.6rem;font-weight:700;letter-spacing:-.02em;font-size:1.05rem;color:#fff}
.marca:hover{text-decoration:none}
.logo{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,var(--menta),#7fe0d5);display:grid;place-items:center;color:var(--petroleo);font-weight:800;font-size:.8rem}
.barra .der{margin-left:auto;display:flex;align-items:center;gap:.9rem;font-size:.85rem;color:#cfe3e2}
.barra .der a{color:#cfe3e2}
.selector-empresa{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:7px;padding:.32rem .55rem;font-family:inherit;font-size:.85rem;max-width:240px}
.selector-empresa option{color:#111}

/* Menú */
.menu{background:var(--papel);border-bottom:1px solid var(--linea);padding:0 1.25rem;display:flex;gap:.15rem;overflow-x:auto}
.menu a{padding:.7rem .8rem;color:var(--gris);font-size:.9rem;white-space:nowrap;border-bottom:2px solid transparent}
.menu a:hover{color:var(--petroleo);text-decoration:none}
.menu a.act{color:var(--petroleo);border-bottom-color:var(--menta);font-weight:600}

.envoltura{max-width:1180px;margin:0 auto;padding:1.5rem 1.25rem 4rem}
.cabecera{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.2rem;flex-wrap:wrap}
.cabecera .sub{color:var(--gris);font-size:.9rem;margin:0}
.cabecera .acc{margin-left:auto;display:flex;gap:.5rem;flex-wrap:wrap}

/* Tarjetas */
.tarjeta{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra);padding:1.1rem 1.2rem;margin-bottom:1rem}
.tarjeta>h2:first-child,.tarjeta>h3:first-child{margin-top:0}
.rejilla{display:grid;gap:1rem}
.r2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.r3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.r4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}

/* Indicadores */
.dato{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);padding:.9rem 1rem;box-shadow:var(--sombra)}
.dato .n{font-size:1.7rem;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.dato .e{font-size:.78rem;color:var(--gris);text-transform:uppercase;letter-spacing:.05em;margin-top:.2rem}
.dato.rojo .n{color:var(--rojo)}.dato.ambar .n{color:var(--ambar)}.dato.verde .n{color:var(--verde)}

/* Tablas */
table{width:100%;border-collapse:collapse;font-size:.88rem}
th{text-align:left;font-weight:600;color:var(--gris);border-bottom:1px solid var(--linea);padding:.55rem .6rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
td{padding:.6rem;border-bottom:1px solid var(--linea);vertical-align:top}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:#f9fbfb}
.tabla-caja{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra);overflow-x:auto}
.vacio{padding:2.2rem 1rem;text-align:center;color:var(--gris-claro)}

/* Etiquetas */
.eti{display:inline-block;padding:.16rem .5rem;border-radius:20px;font-size:.74rem;font-weight:600;border:1px solid transparent;white-space:nowrap}
.eti.gris{background:#eef1f1;color:var(--gris)}
.eti.verde{background:#e6f4ec;color:var(--verde)}
.eti.ambar{background:#fdf3e3;color:var(--ambar)}
.eti.rojo{background:#fae9e7;color:var(--rojo)}
.eti.menta{background:#e4f7f4;color:var(--menta-osc)}
.eti.azul{background:#e7eff3;color:var(--petroleo-2)}

/* Botones */
.btn{display:inline-block;padding:.5rem .9rem;border-radius:8px;border:1px solid var(--linea);background:var(--papel);color:var(--tinta);font-size:.88rem;font-family:inherit;cursor:pointer;font-weight:500}
.btn:hover{text-decoration:none;border-color:var(--gris-claro)}
.btn.p{background:var(--petroleo);border-color:var(--petroleo);color:#fff}
.btn.p:hover{background:var(--petroleo-2);border-color:var(--petroleo-2)}
.btn.m{background:var(--menta);border-color:var(--menta);color:#06333a}
.btn.m:hover{background:var(--menta-osc);color:#fff}
.btn.chico{padding:.3rem .6rem;font-size:.8rem}
.btn.peligro{color:var(--rojo);border-color:#f0cdc8}
.btn.peligro:hover{background:#fae9e7}

/* Formularios */
label{display:block;font-size:.82rem;font-weight:600;color:var(--gris);margin-bottom:.28rem}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],select,textarea{
  width:100%;padding:.5rem .65rem;border:1px solid var(--linea);border-radius:8px;font-family:inherit;font-size:.9rem;background:var(--papel);color:var(--tinta)}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(46,196,182,.35);outline-offset:0;border-color:var(--menta)}
textarea{min-height:82px;resize:vertical}
.campo{margin-bottom:.85rem}
.campos{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.ayuda{font-size:.78rem;color:var(--gris-claro);margin-top:.25rem}
fieldset{border:1px solid var(--linea);border-radius:var(--radio);padding:1rem;margin:0 0 1rem}
legend{font-size:.8rem;font-weight:700;color:var(--petroleo);text-transform:uppercase;letter-spacing:.05em;padding:0 .4rem}

/* Barra de avance */
.barrita{height:7px;background:#eef1f1;border-radius:20px;overflow:hidden;min-width:80px}
.barrita i{display:block;height:100%;border-radius:20px;background:var(--menta)}
.barrita.rojo i{background:var(--rojo)}.barrita.ambar i{background:var(--ambar)}.barrita.verde i{background:var(--verde)}

/* Avisos */
.aviso{padding:.75rem 1rem;border-radius:8px;margin-bottom:1rem;font-size:.9rem}
.aviso.ok{background:#e6f4ec;color:var(--verde);border:1px solid #bfe3cd}
.aviso.mal{background:#fae9e7;color:var(--rojo);border:1px solid #f0cdc8}
.aviso.info{background:#e7f1f3;color:var(--petroleo);border:1px solid #cbe0e3}

/* Entrada */
.entrada{min-height:100vh;display:grid;place-items:center;background:linear-gradient(160deg,var(--petroleo),#07272e)}
.entrada .caja{background:var(--papel);border-radius:14px;padding:2rem;width:min(400px,92vw);box-shadow:0 18px 50px rgba(0,0,0,.25)}
.entrada .marca{color:var(--petroleo);justify-content:center;margin-bottom:.3rem;font-size:1.25rem}
.entrada .lema{text-align:center;color:var(--gris);font-size:.85rem;margin-bottom:1.4rem}

/* Cláusulas */
.clausula{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;color:var(--petroleo-2);font-weight:600}
.pie{margin-top:2.5rem;padding-top:1rem;border-top:1px solid var(--linea);color:var(--gris-claro);font-size:.78rem;text-align:center}
.der{text-align:right}.cen{text-align:center}
.nowrap{white-space:nowrap}
.mini{font-size:.8rem;color:var(--gris)}