.login-container[data-v-5a10a749]{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:20px}.login-card[data-v-5a10a749]{background:#fff;border-radius:20px;padding:40px;-webkit-box-shadow:0 20px 60px rgba(0,0,0,.1);box-shadow:0 20px 60px rgba(0,0,0,.1);width:100%;max-width:800px;-webkit-animation:slideUp-data-v-5a10a749 .6s ease-out;animation:slideUp-data-v-5a10a749 .6s ease-out}@-webkit-keyframes slideUp-data-v-5a10a749{0%{opacity:0;-webkit-transform:translateY(30px);transform:translateY(30px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideUp-data-v-5a10a749{0%{opacity:0;-webkit-transform:translateY(30px);transform:translateY(30px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.login-header[data-v-5a10a749]{text-align:center;margin-bottom:40px}.login-header .logo[data-v-5a10a749]{margin-bottom:20px}.login-header .logo img[data-v-5a10a749]{width:80px;height:80px;border-radius:50%;-webkit-box-shadow:0 4px 12px rgba(0,0,0,.1);box-shadow:0 4px 12px rgba(0,0,0,.1)}.login-header h1[data-v-5a10a749]{margin:0 0 12px 0;font-size:32px;font-weight:700;color:#2c3e50;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.login-header p[data-v-5a10a749]{margin:0;color:#7f8c8d;font-size:16px}.role-selection[data-v-5a10a749]{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px}.role-card[data-v-5a10a749]{background:#f8f9fa;border-radius:16px;padding:24px;text-align:center;cursor:pointer;-webkit-transition:all .3s ease;transition:all .3s ease;border:2px solid transparent}.role-card[data-v-5a10a749]:hover{background:#e9ecef;-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-box-shadow:0 8px 25px rgba(0,0,0,.1);box-shadow:0 8px 25px rgba(0,0,0,.1)}.role-card.active[data-v-5a10a749]{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-box-shadow:0 8px 25px rgba(102,126,234,.3);box-shadow:0 8px 25px rgba(102,126,234,.3)}.role-card.active .role-icon[data-v-5a10a749]{background:hsla(0,0%,100%,.2)}.role-card.active .role-icon i[data-v-5a10a749],.role-card.active .role-title[data-v-5a10a749]{color:#fff}.role-card.active .role-desc[data-v-5a10a749]{color:hsla(0,0%,100%,.9)}.role-icon[data-v-5a10a749]{width:60px;height:60px;border-radius:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin:0 auto 16px;-webkit-transition:all .3s ease;transition:all .3s ease}.role-icon i[data-v-5a10a749]{font-size:24px;-webkit-transition:color .3s ease;transition:color .3s ease}.role-icon.student-icon[data-v-5a10a749]{background:linear-gradient(135deg,#4facfe,#00f2fe)}.role-icon.student-icon i[data-v-5a10a749]{color:#fff}.role-icon.teacher-icon[data-v-5a10a749]{background:linear-gradient(135deg,#43e97b,#38f9d7)}.role-icon.teacher-icon i[data-v-5a10a749]{color:#fff}.role-icon.parent-icon[data-v-5a10a749]{background:linear-gradient(135deg,#fa709a,#fee140)}.role-icon.parent-icon i[data-v-5a10a749]{color:#fff}.role-title[data-v-5a10a749]{font-size:18px;font-weight:600;color:#2c3e50;margin-bottom:8px}.role-desc[data-v-5a10a749],.role-title[data-v-5a10a749]{-webkit-transition:color .3s ease;transition:color .3s ease}.role-desc[data-v-5a10a749]{font-size:14px;color:#7f8c8d;line-height:1.4}.login-form[data-v-5a10a749]{-webkit-animation:fadeIn-data-v-5a10a749 .4s ease-out;animation:fadeIn-data-v-5a10a749 .4s ease-out}.login-form .el-form-item[data-v-5a10a749]{margin-bottom:24px}.login-form .el-input[data-v-5a10a749]{border-radius:12px}.login-form .el-input[data-v-5a10a749] .el-input__inner{border-radius:12px;border:2px solid #e9ecef;padding:12px 16px 12px 50px;height:48px;font-size:16px;-webkit-transition:all .3s ease;transition:all .3s ease}.login-form .el-input[data-v-5a10a749] .el-input__inner:focus{border-color:#667eea;-webkit-box-shadow:0 0 0 3px rgba(102,126,234,.1);box-shadow:0 0 0 3px rgba(102,126,234,.1)}.login-form .el-input[data-v-5a10a749] .el-input__prefix{left:16px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:20px;height:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.login-form .el-input[data-v-5a10a749] .el-input__prefix .el-input__icon{color:#7f8c8d;font-size:16px;line-height:1;-webkit-transition:color .3s ease;transition:color .3s ease}.login-form .el-input[data-v-5a10a749] .el-input.is-focus .el-input__prefix .el-input__icon{color:#667eea}@-webkit-keyframes fadeIn-data-v-5a10a749{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeIn-data-v-5a10a749{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.login-btn[data-v-5a10a749]{width:100%;height:48px;border-radius:12px;font-size:16px;font-weight:600;background:linear-gradient(135deg,#667eea,#764ba2);border:none;-webkit-transition:all .3s ease;transition:all .3s ease}.login-btn[data-v-5a10a749]:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px);-webkit-box-shadow:0 8px 25px rgba(102,126,234,.3);box-shadow:0 8px 25px rgba(102,126,234,.3)}.login-btn[data-v-5a10a749]:active{-webkit-transform:translateY(0);transform:translateY(0)}.demo-accounts[data-v-5a10a749]{margin-top:24px;padding-top:24px;border-top:1px solid #e9ecef;text-align:center}.demo-accounts p[data-v-5a10a749]{margin:0 0 12px 0;color:#7f8c8d;font-size:14px}.demo-buttons[data-v-5a10a749]{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap}.demo-buttons .el-button[data-v-5a10a749]{border-radius:20px;font-size:12px;padding:6px 16px}.demo-buttons .el-button[data-v-5a10a749]:hover{-webkit-transform:translateY(-1px);transform:translateY(-1px)}@media (max-width:768px){.login-container[data-v-5a10a749]{padding:15px}.login-card[data-v-5a10a749]{padding:30px 20px}.login-header[data-v-5a10a749]{margin-bottom:30px}.login-header h1[data-v-5a10a749]{font-size:28px}.login-header .logo img[data-v-5a10a749]{width:60px;height:60px}.role-selection[data-v-5a10a749]{grid-template-columns:1fr;gap:15px}.role-card[data-v-5a10a749]{padding:20px}.role-icon[data-v-5a10a749]{width:50px;height:50px;margin-bottom:12px}.role-icon i[data-v-5a10a749]{font-size:20px}.role-title[data-v-5a10a749]{font-size:16px}.role-desc[data-v-5a10a749]{font-size:13px}.login-form .el-input[data-v-5a10a749] .el-input__inner{padding:10px 12px 10px 45px;height:44px;font-size:15px}.login-form .el-input[data-v-5a10a749] .el-input__prefix{left:14px}.login-form .el-input[data-v-5a10a749] .el-input__prefix .el-input__icon{font-size:15px}.login-form .login-btn[data-v-5a10a749]{height:44px;font-size:15px}}@media (max-width:480px){.login-card[data-v-5a10a749]{padding:25px 15px}.login-header h1[data-v-5a10a749]{font-size:24px}.demo-buttons[data-v-5a10a749]{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.demo-buttons .el-button[data-v-5a10a749]{width:120px}.login-form .el-input[data-v-5a10a749] .el-input__inner{padding:8px 10px 8px 40px;height:40px;font-size:14px}.login-form .el-input[data-v-5a10a749] .el-input__prefix{left:12px;width:16px;height:16px}.login-form .el-input[data-v-5a10a749] .el-input__prefix .el-input__icon{font-size:14px}.login-form .login-btn[data-v-5a10a749]{height:40px;font-size:14px}}