:root{
  --blue:#0f4e7d;
  --blue2:#174f78;
  --sidebar:#202d33;
  --sidebar2:#263840;
  --bg:#e9eef4;
  --line:#c8d4df;
  --text:#46535f;
  font-family:"Segoe UI",Arial,sans-serif;
  color:var(--text);
  background:var(--bg)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);font-size:14px}
a{text-decoration:none;color:inherit}.topbar{height:48px;position:fixed;left:0;right:0;top:0;z-index:50;background:var(--blue);color:#fff;display:flex;align-items:center;box-shadow:0 1px 2px #0003}
.menu-btn{width:48px;height:48px;margin:0;border:0;border-radius:0;background:transparent;color:white;font-size:20px;cursor:pointer}
.brand{font-size:18px;letter-spacing:.1px}.brand b{font-weight:700}.top-user{margin-left:auto;padding:0 20px;font-size:12px;font-weight:600}
.sidebar{position:fixed;left:0;top:48px;bottom:0;width:220px;background:var(--sidebar);color:#c8d2d7;z-index:40;transition:.2s}
.userbox{height:66px;padding:10px 14px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #31424a}
.avatar{font-size:28px;opacity:.7}.userbox b{display:block;color:#d7dee2;font-size:12px;max-width:145px;overflow:hidden;text-overflow:ellipsis}.userbox span{display:block;font-size:11px;margin-top:4px}.userbox i{display:inline-block;width:8px;height:8px;background:#21b66f;border-radius:50%;margin-right:5px}
.sidebar nav{padding-top:4px}.sidebar nav a{display:flex;align-items:center;gap:10px;min-height:42px;padding:10px 15px;border-left:4px solid transparent;color:#f1f4f5;font-size:13px}
.sidebar nav a span{width:18px;text-align:center;opacity:.95}.sidebar nav a:hover{background:#2b3f48}.sidebar nav a.active{background:#6f98b0;border-left-color:#d7eaf4;color:#fff;font-weight:600}
.nav-title{padding:14px 15px 6px;color:#82939b;font-size:10px;font-weight:700;letter-spacing:.8px}
.content-wrap{margin-left:220px;padding:65px 18px 30px;min-height:100vh;transition:.2s}.sidebar-collapsed .sidebar{left:-220px}.sidebar-collapsed .content-wrap{margin-left:0}
.page-head{border-bottom:1px solid #aebdca;padding:0 0 10px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:end}.page-head h1{font-size:21px;font-weight:400;margin:0;color:#4b5965}.page-head span{font-size:12px;color:#8999a6}
.info-banner{background:#d4d9df;border-radius:2px;padding:14px 16px;margin-bottom:18px;color:#222;font-size:12px}
.section-title{font-size:16px;color:#657785;border-bottom:1px solid #aebdca;padding:0 0 9px;margin:14px 0 16px}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;margin-bottom:24px}
.metric{height:82px;color:#fff;display:flex;box-shadow:0 2px 6px #0003;border-radius:2px;overflow:hidden}
.metric-icon{width:82px;background:#0002;display:flex;align-items:center;justify-content:center;font-size:34px}
.metric>div:last-child{padding:13px 10px}.metric span{display:block;font-size:12px}.metric b{display:block;font-size:16px;margin-top:7px}.green{background:#08bf6d}.orange{background:#f6b446}.blue{background:#1590d2}.purple{background:#7770ba}.red{background:#d35e5e}
.panel,.login-card{background:#fff;border:1px solid #cdd8e1;box-shadow:0 2px 5px #0002;border-radius:2px}.panel{padding:14px;margin-bottom:18px;overflow:auto}
.panel h1,.panel h2{font-weight:400;color:#556572}.panel h1{font-size:20px}.panel h2{font-size:16px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.narrow{max-width:560px}
label{display:block;font-size:12px;font-weight:600;margin:10px 0 5px;color:#53636f}
input,select,textarea{width:100%;padding:8px 10px;border:1px solid #bcc9d3;border-radius:2px;background:#fff;color:#394853;font:inherit;outline:none}
input:focus,select:focus,textarea:focus{border-color:#3c8dbc;box-shadow:0 0 0 1px #3c8dbc22}textarea{resize:vertical}
button{border:0;border-radius:2px;padding:8px 14px;background:#0f4e7d;color:#fff;font-weight:600;cursor:pointer;margin-top:10px}button:hover{background:#0c426b}.small{padding:5px 9px;margin:0;font-size:11px}
.inline{display:flex;gap:8px}.inline button{margin:0}.checks{display:flex;flex-wrap:wrap;gap:8px 16px}.checks label,.checkline{font-weight:400}.checks input,.checkline input{width:auto}
table{width:100%;border-collapse:collapse;font-size:12px;background:#fff}th,td{text-align:left;padding:10px 9px;border:1px solid #d8e0e6;white-space:nowrap}th{color:#53616b;background:#f8fafb;font-weight:700}.empty{text-align:center;color:#84939e}
.status{display:inline-block;padding:3px 7px;border-radius:2px;background:#e7edf2}.status.sent{background:#dff3e5;color:#267646}.status.failed{background:#f8dddd;color:#9e3c3c}.status.processing{background:#fff0c7;color:#8e6d12}.status.pending{background:#e4eff8;color:#346987}
.muted,small{color:#738590}.alert{padding:10px 13px;border-radius:2px;margin-bottom:15px}.success{background:#dff2e4;border:1px solid #b8ddc2}.danger{background:#f7dddd;border:1px solid #e8baba}
.auth-body{background:#d8dee6}.login-wrap{min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding-top:120px}.login-card{width:360px;padding:18px}.login-card h1{text-align:center;color:#343b41;font-size:25px;line-height:1.2;margin:0 0 18px}.login-card h1::first-line{font-weight:700}.login-card .muted{background:#d9eef8;color:#33759b;padding:14px;text-align:center;margin:0 0 16px;border:1px solid #bcdfea}.login-card button{width:100%;background:#0f4e7d}
@media(max-width:1180px){.cards{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){.top-user{display:none}.sidebar{left:-220px}.content-wrap{margin-left:0}.sidebar-collapsed .sidebar{left:0}.grid2{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr}.content-wrap{padding-left:10px;padding-right:10px}.brand{font-size:15px}}
@media(max-width:520px){.cards{grid-template-columns:1fr}.login-wrap{padding:70px 12px}.login-card{width:100%}}

.button-link{display:inline-block;background:#0f4e7d;color:#fff;padding:6px 10px;border-radius:2px;font-size:11px;font-weight:700;text-decoration:none;vertical-align:middle}
.button-link:hover{background:#0c426b;color:#fff}