:root{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --bg:#edf4f8;
  --bg2:#e6eef4;
  --panel:#ffffff;
  --panel2:#f7fafc;
  --text:#000000;
  --muted:#31495d;
  --line:rgba(25,73,108,.16);
  --navy:#0b3457;
  --navy2:#155f8d;
  --accent:#2c82b2;
  --shadow:0 12px 28px rgba(31,65,89,.10);
  color-scheme:light;
}
html[data-theme="dark"]{
  --bg:#0e1a26;
  --bg2:#132333;
  --panel:#182d40;
  --panel2:#20394d;
  --text:#ffffff;
  --muted:#d0dee8;
  --line:rgba(161,199,224,.18);
  --navy:#0a2d4c;
  --navy2:#17618d;
  --accent:#72bde3;
  --shadow:0 14px 30px rgba(0,0,0,.23);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;min-height:100vh;font-size:16.5px;font-weight:350;color:var(--text);
  background:
    radial-gradient(circle at 12% 0%,rgba(54,131,180,.08),transparent 30rem),
    linear-gradient(180deg,var(--bg),var(--bg2));
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  transition:background .25s ease,color .25s ease;
}
.topbar{
  position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;
  gap:18px;padding:16px 22px;color:#fff;
  background:linear-gradient(115deg,#082844 0%,#0d3f67 38%,#17638f 55%,#0d3f67 76%,#082844 100%);
  background-size:260% 260%;animation:navyFlow 15s ease infinite;
  box-shadow:0 7px 22px rgba(4,25,42,.20);border-bottom:1px solid rgba(181,220,242,.18);
}
.brand{min-width:210px}
.topbar strong{font-size:25px;font-weight:400;letter-spacing:.3px;color:#fff}
.sub{display:block;font-size:13px;font-weight:350;color:#dfeaf2;margin-top:4px}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.identity{font-size:14px;font-weight:400;color:#fff;margin-right:3px}
.toolbar-btn{
  min-height:39px;display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:8px 12px;border-radius:9px;border:1px solid rgba(236,247,253,.30);
  background:rgba(255,255,255,.07);color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-decoration:none;font:400 14px/1.2 inherit;cursor:pointer;white-space:nowrap;
  box-shadow:0 4px 12px rgba(0,0,0,.10);transition:.18s ease;
}
.toolbar-btn:hover{background:rgba(255,255,255,.14);transform:translateY(-1px)}
.toolbar-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}
.profile-btn{
  background:linear-gradient(180deg,#32df80,#20bd68)!important;
  border-color:#65eda1!important;color:#062414!important;-webkit-text-fill-color:#062414!important;
  font-weight:600!important;text-shadow:none!important;
}
.signout-btn{
  background:linear-gradient(180deg,#d8404c,#b72431)!important;
  border-color:#ef6e77!important;color:#fff!important;-webkit-text-fill-color:#fff!important;
  font-weight:600!important;text-shadow:0 1px 1px rgba(0,0,0,.35)!important;
}
.nav{
  position:relative;z-index:30;display:flex;gap:2px;flex-wrap:wrap;padding:0 20px;
  background:#0b2f4f;border-bottom:1px solid rgba(131,181,214,.16);box-shadow:0 5px 16px rgba(0,0,0,.11)
}
.nav a{
  color:#f3f8fb!important;text-decoration:none;padding:13px 14px;font-size:15px;font-weight:400;
  border-bottom:2px solid transparent;transition:.18s ease
}
.nav a:hover{background:rgba(255,255,255,.07);border-bottom-color:#8fd0ee;color:#fff!important}
.page{max-width:1240px;margin:27px auto;padding:0 22px 52px;position:relative;z-index:1}
h1,h2,h3{color:var(--text);font-weight:400}
h1{font-size:33px;margin:0 0 22px}
h2{font-size:24px}
h3{font-size:19px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.card,.form,.table-wrap{
  background:linear-gradient(145deg,var(--panel),var(--panel2));
  border:1px solid var(--line);box-shadow:var(--shadow);color:var(--text);
  transition:background .25s,color .25s,border-color .25s,transform .2s,box-shadow .2s
}
.card{border-radius:16px;padding:21px;position:relative;overflow:hidden;animation:panelIn .42s ease both}
.card:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.52}
.card:hover{transform:translateY(-2px)}
.metric{font-size:40px;font-weight:300;color:var(--text);margin:8px 0 3px}
.muted{color:var(--muted)!important;font-size:16px;font-weight:350;line-height:1.5}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 14px;
  border:1px solid rgba(106,185,226,.26);border-radius:9px;
  background:linear-gradient(135deg,#17618d,#2787b7);color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-decoration:none;font-size:14.5px;font-weight:500;cursor:pointer;
  box-shadow:0 5px 14px rgba(0,0,0,.12);transition:.18s ease
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.btn.secondary{background:#4d6577}
.btn.success{background:#237451}
.btn-small{min-height:34px;padding:6px 10px;font-size:13.5px}
.btn-warning{background:linear-gradient(180deg,#c28a24,#976617)!important;color:#fff!important}
.btn-danger,button.btn-danger,a.btn-danger{
  background:linear-gradient(180deg,#c92836,#a81724)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  border:1px solid #ef6670!important;font-weight:650!important;
  text-shadow:0 1px 1px rgba(0,0,0,.48)!important;
  box-shadow:0 5px 14px rgba(107,10,20,.28)!important;
  opacity:1!important;filter:none!important;
}
.btn-danger:hover,button.btn-danger:hover,a.btn-danger:hover{
  background:linear-gradient(180deg,#dc3442,#b71d2b)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;filter:none!important
}
.form{border-radius:16px;padding:21px;margin-bottom:20px}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.field{margin-bottom:14px}
.field label{display:block;font-size:14.5px;font-weight:400;margin-bottom:7px;color:var(--text)}
.field input,.field select,.field textarea{
  width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;
  font-size:16px;font-weight:400;color:var(--text);background:var(--panel);outline:none
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--accent);box-shadow:0 0 0 3px rgba(63,145,191,.11)
}
.table-wrap{overflow:auto;border-radius:16px}
table{width:100%;border-collapse:collapse;color:var(--text)}
th,td{padding:13px 15px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{background:var(--panel2);color:var(--text);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.45px}
td{font-size:15.5px;font-weight:350}
tbody tr:hover{background:rgba(65,139,181,.06)}
.badge{padding:5px 9px;border-radius:999px;background:rgba(66,139,181,.10);border:1px solid var(--line);color:var(--text);font-size:13px;font-weight:500}
.notice{padding:12px 14px;background:rgba(47,132,98,.12);border-left:3px solid #54a985;margin-bottom:18px;border-radius:8px;color:var(--text)}
.login{max-width:440px;margin:9vh auto}.login .card{padding:30px}
.journey{display:grid;grid-template-columns:repeat(7,minmax(110px,1fr));gap:10px;margin-top:16px}
.journey-step{
  background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:13px 9px;
  text-align:center;font-size:14.5px;font-weight:400;color:var(--text)
}
footer{text-align:center;padding:20px;color:var(--muted);font-size:13px}
.iam-toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 18px}
.iam-toolbar .field{margin:0;min-width:190px}
.iam-kpis{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;margin-bottom:18px}
.iam-kpi{padding:17px;border-radius:14px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
.iam-kpi span{display:block;color:var(--muted);font-size:13px;margin-bottom:6px}
.iam-kpi strong{font-size:28px;font-weight:400;color:var(--text)}
.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px}
.status-active{background:#2ecb73}.status-disabled{background:#db4652}.status-locked{background:#e2a93b}
.iam-actions{display:flex;gap:6px;flex-wrap:wrap}
.scope-grid{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:10px}
.scope-item{display:flex;gap:8px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text)}
.scope-item input{width:auto}
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.profile-meta{display:grid;gap:10px}.profile-meta div{padding:12px 13px;background:var(--panel2);border:1px solid var(--line);border-radius:10px}
.profile-meta span{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}.profile-meta strong{color:var(--text);font-weight:500}
.policy-grid{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:14px}
.policy-card{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}
.audit-list{display:grid;gap:8px}.audit-row{display:grid;grid-template-columns:155px 160px 1fr 140px;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
@keyframes navyFlow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
@keyframes panelIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:900px){
  .journey{grid-template-columns:repeat(2,minmax(0,1fr))}
  .iam-kpis,.policy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scope-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .topbar{align-items:flex-start;padding:15px 14px}.brand{min-width:0}.top-actions{max-width:66%;gap:6px}
  .identity{width:100%;text-align:right}.toolbar-btn{padding:7px 9px;font-size:13px}
  .nav{padding:0 7px}.nav a{padding:11px 9px;font-size:13px}
  .page{margin-top:19px;padding-left:14px;padding-right:14px}
  .row,.iam-kpis,.policy-grid,.scope-grid,.journey{grid-template-columns:1fr}
  h1{font-size:29px}.metric{font-size:37px}
}