@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');
:root{--primary:#6d28d9;--secondary:#06b6d4;--pink:#ec4899;--dark:#172033}
*{box-sizing:border-box}body{font-family:Poppins,Segoe UI,sans-serif;color:var(--dark)}
.hero-bg{min-height:100vh;background:linear-gradient(-45deg,#4f46e5,#7c3aed,#db2777,#0891b2);background-size:400% 400%;animation:gradient 12s ease infinite;position:relative;overflow:hidden}
.hero-bg:before,.login-bg:before{content:"";position:absolute;width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.13);top:-120px;right:-100px;animation:float 7s ease-in-out infinite}
.portal-card,.login-card{background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-radius:30px;box-shadow:0 30px 80px rgba(0,0,0,.22);position:relative;z-index:2}
.portal-card{max-width:850px;width:100%}.logo-orb,.header-icon{width:72px;height:72px;border-radius:22px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary),var(--pink));color:#fff;font-size:32px;box-shadow:0 12px 30px rgba(109,40,217,.35);animation:pulse 2.5s infinite}
.choice-card{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:#172033;padding:28px 18px;border-radius:22px;background:#fff;box-shadow:0 10px 25px rgba(0,0,0,.08);transition:.35s;height:100%}
.choice-card i{font-size:38px}.choice-card span{font-size:13px;color:#6b7280}.choice-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 40px rgba(0,0,0,.15)}
.student-choice i{color:#6d28d9}.admin-choice i{color:#db2777}
.app-bg,.admin-bg{background:#f4f7fb}.gradient-nav{background:linear-gradient(100deg,#4f46e5,#7c3aed,#db2777)}
.form-shell,.dashboard-card{background:#fff;border-radius:26px;box-shadow:0 15px 45px rgba(30,41,59,.08);overflow:hidden}
.form-header{padding:28px;display:flex;align-items:center;gap:20px;color:#fff;background:linear-gradient(110deg,#4f46e5,#7c3aed,#db2777)}
.header-icon{background:rgba(255,255,255,.18);box-shadow:none;width:64px;height:64px;font-size:27px;flex:none}
.form-section{padding:28px;border-bottom:1px solid #eef1f6}.form-section h5{font-weight:700;margin-bottom:22px}.form-section h5 span{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;background:#ede9fe;color:#6d28d9;margin-right:10px;font-size:13px}
.form-control,.form-select{border-radius:12px;padding:11px 14px;border:1px solid #dfe4ec}.form-control:focus,.form-select:focus{border-color:#8b5cf6;box-shadow:0 0 0 .2rem rgba(139,92,246,.12)}
.submit-btn{border-radius:14px;padding:15px;margin-top:22px;background:linear-gradient(90deg,#4f46e5,#db2777);border:0;box-shadow:0 12px 25px rgba(109,40,217,.22);transition:.3s}.submit-btn:hover{transform:translateY(-2px)}
.login-bg{background:linear-gradient(135deg,#111827,#4f46e5,#db2777);min-height:100vh;position:relative;overflow:hidden}.login-card{max-width:450px;width:100%}
.stat-card{border-radius:22px;padding:25px;color:#fff;display:flex;gap:18px;align-items:center;box-shadow:0 15px 30px rgba(0,0,0,.12);transition:.3s}.stat-card:hover{transform:translateY(-5px)}.stat-card i{font-size:38px}.stat-card h2{font-weight:800;margin:0}.stat-card small{opacity:.85}.stat-one{background:linear-gradient(135deg,#4f46e5,#7c3aed)}.stat-two{background:linear-gradient(135deg,#0891b2,#06b6d4)}.stat-three{background:linear-gradient(135deg,#db2777,#ec4899)}
.quick-action{display:flex;align-items:center;gap:12px;text-decoration:none;color:#172033;padding:17px 12px;border-bottom:1px solid #eef1f6;transition:.25s}.quick-action:hover{background:#f7f5ff;padding-left:18px;color:#6d28d9}.detail-section{padding:22px 0;border-bottom:1px solid #eef1f6}.detail-section h5{font-weight:700;margin-bottom:18px}.detail-box{background:#f8fafc;border-radius:14px;padding:14px;height:100%}.detail-box small{color:#64748b;font-size:11px;display:block;margin-bottom:4px}.detail-box div{font-weight:500;word-break:break-word}
@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(25px)}}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@media print{nav,.btn{display:none!important}.dashboard-card{box-shadow:none}.admin-bg{background:#fff}}
@media(max-width:576px){.form-header{padding:22px;align-items:flex-start}.form-section{padding:20px}.form-header h2{font-size:1.25rem}}