:root{--red:#c91524;--dark:#181a1f;--muted:#747982;--bg:#f5f6f8}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:linear-gradient(135deg,#fff 0,#fff3f4 45%,#f5f6f8 100%);color:#202124}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}.login-box{width:min(410px,100%);background:#fff;border:1px solid #e5e5e5;border-radius:20px;padding:34px;box-shadow:0 20px 60px #00000012}.logo{width:52px;height:52px;background:var(--red);border-radius:15px;color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:16px}.login-box h1{font-size:24px;margin:0}.login-box p{color:var(--muted);font-size:13px;margin:7px 0 25px}.login-box label{display:block;font-size:12px;font-weight:700;margin:14px 0 7px}.login-box input{width:100%;padding:12px;border:1px solid #ddd;border-radius:9px;outline:none}.login-box input:focus{border-color:var(--red)}.login-box button{width:100%;border:0;background:var(--red);color:#fff;padding:13px;border-radius:9px;margin-top:20px;font-weight:750;cursor:pointer}.login-box>a{display:block;text-align:center;color:var(--red);font-size:12px;text-decoration:none;margin-top:18px}.err{background:#fff0f0;color:#a71924;border:1px solid #ffd0d3;padding:10px;border-radius:8px;font-size:12px}
.dashboard{min-height:100vh;background:#f6f7f9}.side{position:fixed;left:0;top:0;bottom:0;width:235px;background:#fff;border-right:1px solid #e9e9eb;padding:25px 16px}.side .brand{display:flex;align-items:center;gap:10px;margin:0 8px 30px}.side .brandmark{width:38px;height:38px;border-radius:10px;background:var(--red);color:#fff;display:grid;place-items:center;font-weight:800}.side .brand b{font-size:12px}.side .brand span{display:block;font-size:10px;color:var(--muted)}.nav a{display:block;text-decoration:none;color:#555b63;padding:11px 12px;border-radius:9px;font-size:13px;margin:3px 0}.nav a.active,.nav a:hover{background:#fff0f1;color:var(--red);font-weight:700}.main{margin-left:235px;padding:28px;max-width:1500px}.head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.head h1{font-size:25px;margin:0}.head p{font-size:12px;color:var(--muted);margin:5px 0}.logout{color:var(--red);text-decoration:none;font-size:12px;font-weight:700}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:18px}.card{background:#fff;border:1px solid #e7e7e9;border-radius:14px;padding:19px}.card .lbl{font-size:11px;color:var(--muted)}.card .num{font-size:28px;font-weight:800;margin-top:7px}.card .sub{font-size:10px;color:var(--muted);margin-top:4px}.panel{background:#fff;border:1px solid #e7e7e9;border-radius:14px;padding:18px;margin-bottom:18px}.panel-title{font-weight:750;font-size:14px;margin-bottom:15px}.filters{display:flex;gap:9px;flex-wrap:wrap}.filters input,.filters select{border:1px solid #ddd;border-radius:8px;padding:9px 10px;font:inherit;font-size:12px}.filters button{border:0;background:var(--red);color:#fff;border-radius:8px;padding:9px 14px;font-weight:700}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px;min-width:900px}th{background:#fafafa;color:#70747b;text-align:left;padding:10px;border-bottom:1px solid #eee}td{padding:10px;border-bottom:1px solid #f0f0f0;vertical-align:top}.badge{display:inline-block;padding:4px 7px;border-radius:99px;background:#fff0f1;color:var(--red);font-size:10px}.comment{max-width:430px;white-space:normal;line-height:1.5}.actions{display:flex;gap:8px;justify-content:flex-end}.btn{display:inline-block;text-decoration:none;border:1px solid #ddd;padding:8px 11px;border-radius:8px;color:#444;font-size:11px;background:#fff}.btn.red{background:var(--red);color:#fff;border-color:var(--red)}.pagination{display:flex;justify-content:center;gap:5px;margin-top:15px}.pagination a{padding:7px 10px;border:1px solid #ddd;border-radius:7px;text-decoration:none;color:#555;font-size:11px}.pagination a.on{background:var(--red);color:#fff;border-color:var(--red)}.chart-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.bar{margin:9px 0}.barline{display:flex;justify-content:space-between;font-size:11px;margin-bottom:5px}.bartrack{height:8px;background:#f0f0f0;border-radius:99px;overflow:hidden}.barfill{height:100%;background:var(--red);border-radius:99px}@media(max-width:900px){.side{position:static;width:100%;height:auto;padding:15px}.nav{display:flex;overflow:auto}.main{margin-left:0;padding:15px}.cards{grid-template-columns:1fr 1fr}.chart-row{grid-template-columns:1fr}}@media(max-width:500px){.cards{grid-template-columns:1fr}.head{display:block}.actions{margin-top:12px}}