/* FleetPro · hoja compartida. Misma paleta y tipografia que la app. */
:root{
  --noir:#0A0B0C; --carbon:#111316; --panel:#16191D; --steel:#1E2229;
  --line:#282D35; --guards:#C8102E; --chalk:#E9E7E2; --platinum:#8E949E;
  --dim:#565C66; --amber:#E0A32E; --jade:#4FA173;
  --display:'Oswald','Barlow Condensed','Arial Narrow',system-ui,sans-serif;
  --body:'Inter','Helvetica Neue',Arial,system-ui,sans-serif;
  --mono:'JetBrains Mono','SF Mono',ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:radial-gradient(900px 520px at 50% -10%,#1B1F25 0%,transparent 62%),var(--noir);
  color:var(--chalk);font-family:var(--body);font-size:15px;line-height:1.6;
  min-height:100vh;-webkit-font-smoothing:antialiased;
}
a{color:var(--chalk)}
.envoltura{max-width:640px;margin:0 auto;padding:56px 24px 80px}
.ancho{max-width:820px}
.marca{text-align:center;margin-bottom:34px}
.marca img{width:96px;height:auto;display:block;margin:0 auto 16px}
.marca h1{font-family:var(--display);font-size:34px;font-weight:300;letter-spacing:.34em;
  margin-left:.34em;text-transform:uppercase}
.marca p{font-family:var(--display);font-size:11px;letter-spacing:.28em;color:var(--platinum);
  text-transform:uppercase;margin-top:8px}
.regla{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);margin:28px 0}
.tarjeta{background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:30px 26px}
.tarjeta.acento{border-left:2px solid var(--guards)}
h2{font-family:var(--display);font-size:20px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:14px}
h3{font-family:var(--display);font-size:14px;font-weight:400;letter-spacing:.16em;
  text-transform:uppercase;color:var(--platinum);margin:26px 0 8px}
p{margin-bottom:14px;color:#C9C7C2}
ul{margin:0 0 16px 20px;color:#C9C7C2}
li{margin-bottom:7px}
.boton{display:inline-flex;align-items:center;gap:9px;background:var(--guards);color:#fff;
  font-family:var(--display);font-size:13px;letter-spacing:.18em;text-transform:uppercase;
  padding:14px 26px;border:none;border-radius:3px;text-decoration:none;cursor:pointer;
  transition:background .2s}
.boton:hover{background:#E01532}
.boton:disabled{background:var(--steel);color:var(--dim);cursor:not-allowed}
.boton.secundario{background:transparent;border:1px solid var(--line);color:var(--chalk)}
.boton.secundario:hover{background:var(--steel)}
label{display:block;font-family:var(--display);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--platinum);margin-bottom:6px}
input{width:100%;background:#0D0F12;border:1px solid var(--line);border-radius:3px;
  padding:13px 14px;color:var(--chalk);font-family:var(--mono);font-size:15px;margin-bottom:18px}
input:focus{outline:none;border-color:var(--guards)}
.icono{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  margin:0 auto 20px;font-size:26px}
.icono.ok{background:rgba(79,161,115,.12);border:1px solid rgba(79,161,115,.4);color:var(--jade)}
.icono.mal{background:rgba(200,16,46,.1);border:1px solid rgba(200,16,46,.4);color:var(--guards)}
.centro{text-align:center}
.aviso{font-size:13px;padding:12px 14px;border-radius:3px;margin-bottom:18px}
.aviso.error{background:rgba(200,16,46,.09);border:1px solid rgba(200,16,46,.35);color:#F2A0AC}
.aviso.bien{background:rgba(79,161,115,.09);border:1px solid rgba(79,161,115,.35);color:#9FD3B6}
.oculto{display:none}
.pie{text-align:center;margin-top:40px;font-size:12px;color:var(--dim)}
.pie a{color:var(--platinum);text-decoration:none;margin:0 9px}
.pie a:hover{color:var(--chalk)}
.fecha{font-family:var(--mono);font-size:12px;color:var(--dim)}
table{width:100%;border-collapse:collapse;margin-bottom:18px;font-size:14px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
th{font-family:var(--display);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--platinum)}
