*{box-sizing:border-box}
body{margin:0;font:18px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#1d2430;background:#fafaf7}
header,main{max-width:860px;margin:0 auto;padding:0 20px}
header{padding-top:24px}
main{padding-bottom:3rem}
.vol{color:#5b6573;text-decoration:none;font-size:15px}
.vol:hover{text-decoration:underline}
h1{font-size:2rem;line-height:1.2;margin:1.4rem 0 .8rem}
h2{font-size:1.35rem;line-height:1.3;margin:2rem 0 .6rem}
.intro{color:#5b6573}
.aviso{background:#eef6f2;border:1px solid #cfe5db;border-radius:10px;padding:.8rem 1rem;font-size:.95rem}
a{color:#0b6b4f}
:focus-visible{outline:3px solid #1a73e8;outline-offset:2px}
.nota{font-size:.88rem;color:#5b6573;margin:.4rem 0 .8rem}

.barra,.vistas{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}
button,.boton{font:inherit;font-weight:600;color:#fff;background:#0b6b4f;border:2px solid #0b6b4f;border-radius:10px;padding:.65rem 1.1rem;cursor:pointer;text-decoration:none;display:inline-block;min-height:44px}
button.sec,.vista{color:#0b6b4f;background:#fff}
.vista[aria-pressed="true"]{color:#fff;background:#0b6b4f}
button:hover,.boton:hover{filter:brightness(.95)}
button.mini{font-size:.88rem;padding:.35rem .75rem;min-height:38px}

.resumen{font-weight:600;color:#0b6b4f;min-height:1.6em;margin:.4rem 0}
.estado{min-height:1.5em;margin:.2rem 0;font-weight:600;color:#0b6b4f}

.tabla{overflow-x:auto;border:1px solid #e3e6eb;border-radius:12px;background:#fff}
table{border-collapse:collapse;width:100%;font-size:.88rem;min-width:640px}
th,td{padding:.45rem .6rem;text-align:left;border-bottom:1px solid #eef0f3;white-space:nowrap;vertical-align:top}
th{background:#f4f5f7;font-weight:700;position:sticky;top:0}
td.num,th.num{color:#5b6573;text-align:right}
td.marca{background:#fff3e0;box-shadow:inset 0 0 0 2px #b86b00}
td.marca .ins{display:inline-block;margin-left:.4rem;font-size:.75rem;font-weight:700;color:#8a4a00}
td.marca.sel{background:#ffe0b2;box-shadow:inset 0 0 0 3px #7a3d00}
td.vacio-celda{font-style:italic;color:#8a4a00}
td.motivo{white-space:normal;min-width:240px}

.reglas{list-style:none;margin:1rem 0;padding:0;display:grid;gap:1rem}
.tarjeta{background:#fff;border:1px solid #e3e6eb;border-radius:12px;padding:1rem 1.2rem}
.tarjeta h3{margin:0 0 .5rem;font-size:1.1rem;line-height:1.3}
.tarjeta h3 .n{display:inline-block;min-width:1.6rem;height:1.6rem;line-height:1.6rem;text-align:center;border-radius:99px;background:#0b6b4f;color:#fff;font-size:.9rem;margin-right:.5rem}
.tarjeta dl{margin:0;display:grid;gap:.5rem}
.tarjeta dt{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:#0b6b4f;font-weight:700}
.tarjeta dd{margin:0;font-size:.95rem}
.tarjeta ul{margin:.2rem 0 0;padding-left:1.1rem;font-size:.92rem}
.tarjeta .ninguna{color:#5b6573;font-style:italic}
.tarjeta .acc{margin-top:.8rem}

.cuentas,.limites{padding-left:1.2rem}
.cuentas li,.limites li{margin:.4rem 0}
.cta{background:#eef6f2;border:1px solid #cfe5db;border-radius:12px;padding:0 1.4rem 1.2rem;margin-top:2rem}

@media (max-width:520px){
  body{font-size:17px}
  h1{font-size:1.6rem}
  .vista,.barra button{width:100%}
}