@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text&family=Roboto:wght@400;500;600;700&display=swap');
* { margin:0; padding:0; box-sizing:border-box; font-family:"Roboto",sans-serif; }

body {
    min-height:100vh; min-height:100dvh;
    display:flex; align-items:center; justify-content:center;
    background: linear-gradient(135deg, #eef0f8 0%, #e0e7ff 50%, #f0fdf4 100%) !important;
    padding:20px;
}

.register-container {
    background:#fff !important; width:100%; max-width:440px;
    border-radius:28px;
    box-shadow:0 20px 60px rgba(106,17,203,0.12),0 4px 16px rgba(0,0,0,0.06);
    overflow:hidden;
}

.register-banner {
    background:linear-gradient(135deg,#6a11cb,#2575fc) !important;
    padding:28px 32px 24px; text-align:center; color:white;
}
.robot-icon {
    width:70px;height:70px;margin:0 auto 12px;border-radius:20px;
    background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;
    overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.2);
}
.robot-icon img { width:85%;height:85%;object-fit:contain; }
.logo h1 { font-family:"DM Serif Text",serif;font-size:24px;font-weight:400;margin-bottom:4px;color:white !important; }
.tagline { font-size:13px;opacity:0.85;color:white !important; }

.register-form-wrap { padding:24px 32px 32px; }

.form-group { margin-bottom:14px; }
.form-group label { display:block;font-size:13px;font-weight:600;color:#555 !important;margin-bottom:6px;letter-spacing:0.02em; }
.form-group input {
    width:100%;padding:12px 16px;
    border:1.5px solid #e5e7eb;border-radius:14px;
    font-size:16px;color:#111 !important;background:#f9fafb !important;
    outline:none;transition:border-color 0.2s,box-shadow 0.2s,background 0.2s;
}
.form-group input:focus { border-color:#6a11cb !important;background:#fff !important;box-shadow:0 0 0 4px rgba(106,17,203,0.08); }

.register-btn {
    width:100%;padding:14px;
    background:linear-gradient(135deg,#6a11cb,#2575fc) !important;
    color:#fff !important;border:none;border-radius:14px;
    font-size:15px;font-weight:700;cursor:pointer;margin-top:6px;
    transition:opacity 0.2s,transform 0.1s;
    box-shadow:0 4px 16px rgba(106,17,203,0.3);
}
.register-btn:hover { opacity:0.92; }
.register-btn:active { transform:scale(0.98); }

.error-msg { color:#dc2626;font-size:13px;text-align:center;margin-top:10px;min-height:18px;font-weight:500; }
.login-text { text-align:center;margin-top:18px;font-size:14px;color:#888 !important; }
.login-text a { color:#6a11cb !important;font-weight:700;text-decoration:none; }
.login-text a:hover { text-decoration:underline; }

@media (max-width:480px) {
    body { padding:0; background:linear-gradient(135deg, #eef0f8 0%, #e0e7ff 50%, #f0fdf4 100%) !important; }
    .register-container { border-radius:0;box-shadow:none;max-width:100%;min-height:100dvh;display:flex;flex-direction:column; }
    .register-banner { padding:40px 24px 20px; }
    .register-form-wrap { padding:20px 24px 40px;flex:1; }
}
