.auth-page{min-height:calc(100vh - 160px);padding:40px 0 60px;display:flex;align-items:center;background:radial-gradient(circle at 10% 20%,rgba(19,91,236,.06) 0,rgba(246,248,252,1) 90%)}.auth-container{max-width:960px}.auth-header{text-align:center;margin-bottom:36px}.auth-badge{display:inline-flex;align-items:center;gap:6px;background:var(--primary-light);color:var(--primary);padding:6px 14px;border-radius:var(--radius-full);font-family:var(--font-heading);font-size:.8rem;font-weight:700;margin-bottom:12px;border:1px solid rgba(19,91,236,.2)}.auth-title{font-size:2.3rem;margin-bottom:10px;color:#0b1f48}.auth-desc{color:var(--text-muted);max-width:620px;margin:0 auto;font-size:.95rem;line-height:1.6}.role-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:28px;gap:28px;margin-bottom:30px}.role-card{background:white;border-radius:var(--radius-xl);padding:36px 30px;border:2px solid var(--border-color);box-shadow:var(--shadow-md);display:flex;flex-direction:column;transition:var(--transition);position:relative;overflow:hidden}.role-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.role-teacher:hover{border-color:var(--primary)}.role-student:hover{border-color:var(--accent)}.role-icon-box{width:70px;height:70px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;margin-bottom:20px}.teacher-gradient{background:var(--primary-gradient);box-shadow:0 8px 20px rgba(19,91,236,.35)}.student-gradient{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 8px 20px rgba(245,158,11,.35)}.role-badge{display:inline-block;font-size:.75rem;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-family:var(--font-heading)}.role-badge.badge-student{color:#d97706}.role-name{font-size:1.5rem;margin-bottom:12px}.role-detail{font-size:.9rem;color:var(--text-muted);line-height:1.5;margin-bottom:20px}.role-features{list-style:none;margin-bottom:28px;flex:1 1}.role-features li{display:flex;align-items:center;gap:8px;font-size:.88rem;color:#334155;margin-bottom:8px}.role-btn-group{display:flex;flex-direction:column;gap:10px}.role-btn{width:100%;padding:12px 20px}.role-btn-outline{width:100%;padding:10px 20px;font-size:.9rem}.auth-footer-note{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.85rem;color:var(--text-muted);margin-top:24px}.form-auth-container{max-width:540px}.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--text-muted);font-size:.88rem;font-weight:600;margin-bottom:16px;transition:var(--transition)}.back-link:hover{color:var(--primary)}.auth-card{background:white;border-radius:var(--radius-xl);border:1px solid var(--border-color);box-shadow:var(--shadow-lg);padding:32px 30px}.auth-card-header{text-align:center;margin-bottom:20px}.role-mini-icon{width:48px;height:48px;border-radius:var(--radius-md);margin:0 auto 12px;display:flex;align-items:center;justify-content:center}.auth-card-header h2{font-size:1.5rem;margin-bottom:4px}.auth-card-header p{font-size:.88rem;color:var(--text-muted)}.auth-tabs-nav{display:grid;grid-template-columns:1fr 1fr;background:var(--bg-surface);padding:4px;border-radius:var(--radius-md);margin-bottom:22px;grid-gap:4px;gap:4px}.auth-tab-btn{padding:10px 14px;border-radius:var(--radius-sm);border:none;background:transparent;font-family:var(--font-heading);font-size:.9rem;font-weight:600;color:var(--text-muted);cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;gap:6px}.auth-tab-btn.active{background:white;color:var(--primary);box-shadow:var(--shadow-sm)}.auth-tab-btn.active.student-active{color:#d97706}.auth-error-alert{background:var(--danger-light);color:var(--danger);border:1px solid #fecaca;border-radius:var(--radius-md)}.auth-error-alert,.auth-success-alert{padding:10px 14px;font-size:.88rem;margin-bottom:16px;display:flex;align-items:center;gap:8px}.auth-success-alert{background:var(--success-light);color:var(--success);border:1px solid #a7f3d0;border-radius:var(--radius-md)}.quick-demo-box{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--primary-light);border:1px dashed #bfdbfe;padding:10px 14px;border-radius:var(--radius-md);margin-bottom:20px}.student-demo-box{background:var(--warning-light);border-color:#fde68a}.quick-demo-info{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--text-main);font-weight:600}.form-help-text{font-size:.78rem;color:var(--text-muted);margin-top:2px}.text-uppercase{text-transform:uppercase;font-weight:600;letter-spacing:.05em}.auth-submit-btn{width:100%;padding:12px;font-size:1rem;margin-top:10px}.auth-card-footer{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border-color);font-size:.88rem;color:var(--text-muted)}.link-switch{color:var(--primary);font-weight:700;text-decoration:underline}.password-input-wrapper{position:relative;display:flex;align-items:center}.password-input-wrapper .form-input{padding-right:42px;width:100%}.password-toggle-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:transparent;border:none;cursor:pointer;color:var(--text-muted);display:flex;align-items:center;justify-content:center;padding:4px;border-radius:4px;transition:color .15s ease}.password-toggle-btn:hover{color:var(--primary)}@media (max-width:768px){.role-grid{grid-template-columns:1fr}}