*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:#f4f7fb;color:#101828}
.top{background:linear-gradient(135deg,#06142f,#0b2558);color:white;padding:18px 22px;display:flex;justify-content:space-between;align-items:center}
.top h1{margin:0;font-size:22px}.top span{font-size:13px;color:#c9d7ff}.top a{color:#ffc83d;text-decoration:none;font-weight:bold}
.nav{background:#0b1f46;padding:12px;display:flex;gap:10px;overflow:auto}
.nav a{color:white;text-decoration:none;background:#17366f;padding:10px 14px;border-radius:12px;white-space:nowrap;font-size:14px}
.nav a:hover,.btn:hover,button:hover{opacity:.9}
main{padding:18px;max-width:1150px;margin:auto}
.hero{background:linear-gradient(135deg,#0b1f46,#112f70);color:white;border-radius:22px;padding:24px;margin-bottom:18px;box-shadow:0 10px 25px #0002}
.hero h2{margin:0 0 6px}.hero p{margin:0;color:#dbe7ff}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.dash-card{background:white;text-decoration:none;color:#101828;border-radius:22px;padding:20px;box-shadow:0 10px 25px #0001;display:block;border:1px solid #edf0f7}
.dash-card .icon{font-size:30px;margin-bottom:10px}.dash-card b{font-size:32px;color:#071633;display:block}.dash-card span{font-weight:bold;display:block;margin-top:6px}.dash-card small{color:#667085;display:block;margin-top:6px}
.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px}
.page-head h2{margin:0}.page-head p{margin:5px 0 0;color:#667085}
.btn{background:#ffc83d;color:#101828;text-decoration:none;padding:12px 16px;border-radius:14px;font-weight:bold;white-space:nowrap}
.panel{background:white;border-radius:20px;padding:18px;box-shadow:0 10px 25px #0001;display:grid;gap:12px;margin-bottom:20px}
input,textarea,select{padding:14px;border:1px solid #d8deea;border-radius:13px;font-size:15px;width:100%;background:#fff}
textarea{min-height:95px}
button{background:#ffc83d;border:0;border-radius:14px;padding:13px 18px;font-weight:700;cursor:pointer}
button.danger{background:#ff4d4f;color:white}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.item{background:white;border-radius:20px;padding:14px;box-shadow:0 10px 25px #0001;border:1px solid #edf0f7}
.item img{width:100%;height:135px;object-fit:cover;border-radius:15px;background:#0b1f46}
.item h3{font-size:17px;margin:12px 0 5px}.item p{color:#667085;margin:6px 0}
.user-list{display:grid;gap:14px}
.user-card{background:white;border-radius:20px;padding:16px;box-shadow:0 10px 25px #0001;display:grid;grid-template-columns:1.5fr 1.4fr auto;gap:12px;align-items:center}
.user-card h3{margin:0 0 5px}.user-card p{margin:0;color:#344054}.user-card small{color:#667085}
.inline-form{display:flex;gap:8px}.inline-form input{min-width:130px}
.dark{background:#071633}
.login-box{max-width:360px;margin:80px auto;background:white;padding:28px;border-radius:24px;text-align:center}
.login-box h1{color:#071633}.login-box p{color:#667085}.login-box form{display:grid;gap:12px}.error{background:#ffe1e1;color:#b42318;padding:10px;border-radius:10px;margin-bottom:12px}
@media(max-width:760px){
  main{padding:12px}
  .top{padding:14px}.top h1{font-size:18px}
  .page-head{display:grid}
  .user-card{grid-template-columns:1fr}
  .inline-form{display:grid}
}