:root{--bg:#f4f7fb;--card:#fff;--ink:#111827;--muted:#6b7280;--navy:#061327;--blue:#ed1c24;--green:#22c55e;--orange:#f59e0b;--red:#ef4444;--line:#e5e7eb;--shadow:0 18px 45px rgba(15,23,42,.10)}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink)}
a{text-decoration:none;color:inherit}
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#061327,#123a63)}
.hero-card,.auth-box,.card{background:white;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow)}
.hero-card{padding:44px;width:min(900px,92%)}
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center}
.auth-box{width:min(480px,92%);padding:34px}
h1{font-size:34px;margin:0 0 10px}
.sub{color:var(--muted);line-height:1.6}
.input,select{width:100%;padding:13px;margin:8px 0;border:1px solid var(--line);border-radius:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;padding:12px 18px;font-weight:800;cursor:pointer;background:var(--blue);color:white}
.btn.dark{background:var(--navy)}
.btn.soft{background:#eef6ff;color:#075985}
.btn.red{background:var(--red)}
.pills{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0}
.pill{background:#f3f8ff;border-radius:16px;padding:16px;text-align:center;font-weight:900}
.layout{display:grid;grid-template-columns:270px 1fr;min-height:100vh}
.sidebar{background:var(--navy);color:white;padding:24px;position:sticky;top:0;height:100vh}
.brand{font-size:24px;font-weight:900;margin-bottom:28px}
.brand span{display:block;font-size:12px;color:#9ca3af;margin-top:5px}
.nav a{display:block;padding:13px 14px;margin:7px 0;border-radius:14px;color:#dbeafe;font-weight:700}
.nav a:hover,.nav a.active{background:rgba(255,255,255,.10);color:white}
.main{padding:28px}
.top{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}
.grid{display:grid;gap:20px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.card{padding:24px}
.circle{width:118px;height:118px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;font-weight:900;font-size:21px;background:conic-gradient(var(--blue) var(--p),#e5e7eb 0)}
.table{width:100%;border-collapse:collapse}
.table th,.table td{text-align:left;padding:13px;border-bottom:1px solid var(--line);font-size:14px}
.table th{color:#64748b;text-transform:uppercase;font-size:12px}
.badge{display:inline-flex;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:900}
.good{background:#dcfce7;color:#166534}.warn{background:#fef3c7;color:#92400e}.danger{background:#fee2e2;color:#991b1b}
.notice{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:18px;padding:14px;margin-top:16px;font-size:14px}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.small{font-size:13px;color:var(--muted)}
@media(max-width:1000px){.layout{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.grid-4,.grid-3,.grid-2,.pills{grid-template-columns:1fr}.top{display:block}}

/* MATRIX_MENU_HELPER_V105_START */
a[data-v105-menu="1"] {
  transition: all .18s ease;
}
a[data-v105-menu="1"].active {
  font-weight: 900;
}
@media (max-width: 850px) {
  a[data-v105-menu="1"] {
    text-align: center;
  }
}
/* MATRIX_MENU_HELPER_V105_END */