body{margin:0;font-family:Arial;background:#f4f7fb;}
.header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#0b3f9c;color:white;}
.logo{height:70px;}
.title{font-size:22px;font-weight:bold;}
.roles{display:flex;justify-content:center;padding:10px;background:#eef2ff;}
.role-tab{padding:10px 18px;border-radius:12px;background:#1f6fe5;color:white;margin:0 5px;cursor:pointer;}
.container{display:flex;height:85vh;}
.left{width:18%;background:#e9edff;padding:10px;}
.center{width:52%;padding:20px;}
.right{width:30%;background:#eef2ff;padding:20px;}

.panel-btn{background:white;margin-bottom:10px;padding:12px;border-radius:10px;cursor:pointer;}
.section{background:white;padding:15px;border-radius:10px;margin-bottom:15px;}

.spin{animation:spin 10s linear infinite;}
.big{height:160px;}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

#loaderOverlay{
position:fixed;top:0;left:0;width:100%;height:100%;
background:rgba(0,0,0,.6);
display:none;justify-content:center;align-items:center;z-index:9999;
}
.loaderBox{background:white;padding:40px;border-radius:12px;text-align:center;}