:root{--red:#C80000;--black:#0b0b0b;--muted:#666;--bg:#fff;--card:#fff;--line:#e9e9e9}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--black)}
a{color:var(--red);text-decoration:none} a:hover{text-decoration:underline}
.brandbar{display:flex;align-items:center;gap:14px;background:var(--black);padding:14px 18px}
.brandbar .title{color:#fff;font-weight:800;letter-spacing:.5px}
.brandbar .subtitle{color:#fff;opacity:.8;font-size:13px;margin-top:2px}
.brandbar img{height:44px;width:auto;display:block}
.container{max-width:1180px;margin:22px auto;padding:0 18px}
.card{border:1px solid var(--line);border-radius:14px;background:var(--card);padding:18px;box-shadow:0 2px 14px rgba(0,0,0,.04)}
.grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:980px){.grid{grid-template-columns:1.25fr .75fr}}
.h1{font-size:22px;font-weight:900;margin:0 0 10px}
.h2{font-size:15px;font-weight:900;margin:18px 0 8px;color:var(--red)}
.small{color:var(--muted);font-size:13px;line-height:1.35}
label{display:block;font-weight:700;margin:10px 0 6px}
input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font-size:14px}
button{background:var(--red);color:#fff;border:0;border-radius:10px;padding:10px 14px;font-weight:900;cursor:pointer}
.table{width:100%;border-collapse:collapse;overflow:hidden;border-radius:12px;border:1px solid var(--line)}
.table th{background:var(--red);color:#fff;text-align:left;padding:10px;font-size:13px}
.table td{padding:10px;border-top:1px solid var(--line);font-size:13px}
.table tr:nth-child(even) td{background:#f6f6f6}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;border:1px solid var(--line);font-size:12px}
.badge.red{border-color:rgba(200,0,0,.35);color:var(--red);background:rgba(200,0,0,.06)}
hr{border:0;border-top:1px solid var(--line);margin:14px 0}
.heatwrap{display:grid;grid-template-columns:repeat(5, minmax(0, 1fr));gap:8px}
.heatcell{border:1px solid var(--line);border-radius:12px;padding:10px;min-height:68px}
.heatcell .s{font-weight:900}
.heatcell .n{font-size:12px;color:#333;margin-top:6px}


/* Logo sizing (no distortion) — universal clamp */
.logoCard{display:flex;align-items:center;justify-content:center;padding:10px 12px 6px;overflow:hidden}
.heroLogo{display:block;width:100%;max-width:560px;max-height:min(340px,42vh);height:auto;object-fit:contain;margin:0 auto 8px}
.loginLogo{display:block;width:100%;max-width:420px;max-height:min(260px,28vh);height:auto;object-fit:contain;margin:0 auto 8px}
@media(max-width:420px){.heroLogo{max-width:360px;max-height:min(260px,38vh)}.loginLogo{max-width:280px;max-height:min(200px,24vh)}}