@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700;800&family=Poppins:wght@500;700;800&display=swap');
:root{
  --red:#C40000; --red2:#B10000; --black:#0b0b0b; --black2:#141414; --white:#fff;
  --gray:#e9e9e9; --muted:#bdbdbd; --yellow:#FFD400; --whatsapp:#25D366;
  --shadow:0 10px 26px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,var(--black),#060606);color:var(--white);
  font-family:Montserrat,Poppins,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;}
a{color:var(--yellow);text-decoration:none}
.container{max-width:1180px;margin:0 auto;padding:18px 16px 40px}
.row{display:flex;gap:16px;flex-wrap:wrap}
.col{flex:1;min-width:300px}
.topbar{position:sticky;top:0;z-index:60;background:linear-gradient(90deg,var(--red2),var(--red));
  border-bottom:3px solid rgba(255,212,0,.35);box-shadow:var(--shadow);}
.topbar-inner{max-width:1180px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.brand{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.brand-logo{display:block;max-height:34px;height:auto;width:auto;object-fit:contain}
@media (max-width:520px){.brand-logo{max-height:30px}}
.brand .title{font-weight:800;letter-spacing:.2px}
.brand .sub{color:rgba(255,255,255,.85);font-size:12px;font-weight:700}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:10px;background:rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.18);color:#fff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;}
.badge.ok{border-color:rgba(37,211,102,.35)}
.badge.warn{border-color:rgba(255,212,0,.35)}
.card{background:var(--black2);border:2px solid rgba(255,255,255,.10);border-radius:14px;padding:18px;box-shadow:var(--shadow);}
h1,h2,h3{margin:0 0 10px} h1{font-size:28px;font-weight:800} h2{font-size:20px;font-weight:800} h3{font-size:16px;font-weight:800}
p{margin:0 0 10px;color:var(--muted);line-height:1.5;font-weight:600}
label{display:block;margin:12px 0 6px;color:var(--gray);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.6px}
input,select,textarea{width:100%;padding:12px;border-radius:12px;border:2px solid rgba(255,255,255,.10);background:#0f0f0f;color:var(--white);outline:none;font-weight:700}
input:focus,select:focus,textarea:focus{border-color:rgba(255,212,0,.55);box-shadow:0 0 0 3px rgba(255,212,0,.18)}
textarea{min-height:120px;resize:vertical}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--yellow);color:#111;border:none;border-radius:12px;
  padding:12px 14px;font-weight:900;cursor:pointer;text-transform:uppercase;letter-spacing:.6px;}
.btn.secondary{background:transparent;border:2px solid rgba(255,255,255,.18);color:var(--white)}
.btn.danger{background:var(--red);color:var(--white)}
.btn.small{padding:9px 10px;border-radius:10px;font-size:12px}
.notice{padding:12px;border-radius:12px;border:2px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:var(--white);font-weight:800}
.notice.key{background:rgba(255,212,0,.10);border-color:rgba(255,212,0,.35)}
.notice.ok{border-color:rgba(37,211,102,.35)}
.notice.danger{border-color:rgba(196,0,0,.45)}
.progress{height:12px;background:#0f0f0f;border:2px solid rgba(255,255,255,.10);border-radius:999px;overflow:hidden}
.progress > div{height:100%;background:linear-gradient(90deg,var(--yellow),#ffea6b);width:0%}
.floatbar{position:sticky;top:74px;z-index:55;background:linear-gradient(90deg,#1a1a1a,#111);
  border:2px solid rgba(255,255,255,.12);border-left:6px solid var(--yellow);border-radius:14px;padding:12px;margin-bottom:12px;box-shadow:var(--shadow);}
.floatbar .meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.smallmuted{color:var(--muted);font-size:12px;font-weight:700}
.table{width:100%;border-collapse:separate;border-spacing:0 10px}
.table th{font-size:12px;color:var(--muted);text-align:left;font-weight:900;text-transform:uppercase;letter-spacing:.6px}
.table td{padding:12px;background:#0f0f0f;border:2px solid rgba(255,255,255,.10);font-weight:700}
.table tr td:first-child{border-radius:12px 0 0 12px}
.table tr td:last-child{border-radius:0 12px 12px 0}
.whatsapp-float{position:fixed;right:16px;bottom:16px;z-index:80;display:inline-flex;align-items:center;gap:10px;
  padding:12px 14px;border-radius:14px;background:var(--whatsapp);color:#06140a;font-weight:900;box-shadow:var(--shadow);
  border:2px solid rgba(0,0,0,.25);text-transform:uppercase;letter-spacing:.4px;}
