:root { --red:#D62828; --yellow:#FFC300; --black:#0F172A; --bg:#ffffff; --fg:#0f172a; }
* { box-sizing:border-box; } body { margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu; background:var(--bg); color:var(--fg); }
header { background:var(--red); color:#fff; } .container{max-width:1200px;margin:0 auto;padding:16px;}
.nav a{color:#fff;text-decoration:none;margin-right:16px;font-weight:700}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:16px;margin-bottom:16px;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.badge{background:var(--yellow);padding:4px 8px;border-radius:999px;font-weight:700;color:#111}
.grid{display:grid;gap:16px} .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))} .grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.small{font-size:12px;color:#475569} .button{background:var(--red);color:#fff;padding:8px 12px;border-radius:12px;border:0;font-weight:800;cursor:pointer}
.button.alt{background:var(--yellow);color:#111} select{padding:6px 8px;border:1px solid #cbd5e1;border-radius:8px}
table{width:100%;border-collapse:collapse} th,td{padding:8px;border-bottom:1px solid #e5e7eb;text-align:left;font-size:14px}
.progress{height:10px;background:#e5e7eb;border-radius:12px;overflow:hidden} .progress>div{height:10px;background:var(--red)}
footer{border-top:1px solid #e5e7eb;margin-top:32px}
.tag{display:inline-block;background:#eef2ff;color:#3730a3;border-radius:999px;padding:2px 8px;font-weight:700;font-size:12px;margin-right:6px}
.hidden{display:none}