:root{
  --navy:#0F2D4A; --teal:#10B981; --blue:#3B82F6; --amber:#F59E0B;
  --bg:#F8FAFC; --surface:#FFFFFF; --line:#E2E8F0; --muted:#64748B; --text:#0F172A;
  --danger:#EF4444; --radius:18px; --shadow:0 14px 35px rgba(15,45,74,.08);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
.shell{min-height:100vh;display:grid;grid-template-columns:240px 1fr}
.sidebar{background:var(--navy);color:white;padding:24px 18px;display:flex;flex-direction:column;gap:26px}
.brand{display:flex;gap:12px;align-items:center;font-weight:800;font-size:19px}
.brand img{width:38px;height:38px}
.nav{display:grid;gap:8px}
.nav button{background:transparent;border:0;color:#DCE7F0;padding:12px 14px;border-radius:12px;text-align:left}
.nav button.active,.nav button:hover{background:rgba(255,255,255,.1);color:white}
.sidebar-foot{margin-top:auto;font-size:12px;color:#BFD0DF}
.main{padding:26px}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.kicker{color:var(--muted);font-size:13px}
h1,h2,h3,p{margin-top:0}
.grid-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.stat{display:flex;justify-content:space-between;align-items:center}
.stat strong{font-size:32px}
.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:700}
.badge.green{background:#D1FAE5;color:#047857}.badge.orange{background:#FEF3C7;color:#B45309}.badge.blue{background:#DBEAFE;color:#1D4ED8}
.columns{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin-top:18px}
.list{display:grid;gap:10px}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px;border:1px solid var(--line);border-radius:14px}
.row small{color:var(--muted)}
.btn{border:0;border-radius:12px;padding:10px 14px;font-weight:750}
.btn.primary{background:var(--navy);color:white}.btn.success{background:var(--teal);color:white}.btn.danger{background:#FEE2E2;color:#B91C1C}.btn.ghost{background:#EFF6FF;color:#1D4ED8}
.page{display:none}.page.active{display:block}
.form{display:grid;gap:14px}
label{display:grid;gap:7px;font-size:13px;color:#334155}
input,select{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:white}
.auth{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.auth-panel{display:flex;align-items:center;justify-content:center;padding:32px}
.auth-card{max-width:440px;width:100%}
.hero{background:linear-gradient(145deg,#0F2D4A 0%,#143A5C 55%,#10B981 135%);color:white;display:flex;align-items:flex-end;padding:48px}
.hero h2{font-size:42px;max-width:540px}
.hero p{color:#D4E2EE;max-width:500px}
.mobile-nav{display:none}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}
.toast{position:fixed;right:20px;bottom:20px;background:var(--navy);color:white;padding:12px 16px;border-radius:12px;box-shadow:var(--shadow)}
.request-actions{display:flex;gap:8px;flex-wrap:wrap}
.empty{padding:24px;text-align:center;color:var(--muted)}
.integration{display:flex;justify-content:space-between;align-items:center;padding:14px;border:1px solid var(--line);border-radius:14px}
@media(max-width:900px){
  .shell{display:block}.sidebar{display:none}.main{padding:18px 16px 88px}
  .grid-stats{grid-template-columns:1fr 1fr}.columns{grid-template-columns:1fr}
  .mobile-nav{position:fixed;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,1fr);background:white;border-top:1px solid var(--line);z-index:20}
  .mobile-nav button{border:0;background:white;padding:13px 4px;font-size:12px;color:var(--muted)}
  .mobile-nav button.active{color:var(--navy);font-weight:800}
  .auth{grid-template-columns:1fr}.hero{display:none}
}
@media(max-width:560px){.grid-stats{grid-template-columns:1fr}.topbar{align-items:flex-start;gap:10px}.card{padding:15px}}