:root{--md:#4A5A6A;--dark:#1F2B3A;--light:#D8DEE4;--white:#fff;--error:#D32F2F;--success:#2E7D32}
*{box-sizing:border-box;margin:0;padding:0}
.register-page{min-height:100vh;background:linear-gradient(135deg,var(--light),var(--white));display:flex;align-items:center;justify-content:center;padding:20px}
.register-container{width:100%;max-width:680px;background:var(--white);border-radius:18px;box-shadow:0 10px 40px rgba(74,90,106,.15);overflow:hidden}
.register-right{padding:32px 36px;position:relative}
.btn-back{position:absolute;top:16px;right:16px;width:34px;height:34px;background:var(--light);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--md);text-decoration:none;font-size:14px;transition:.3s}
.btn-back:hover{background:var(--dark);color:var(--white);transform:rotate(90deg)}
.form-header{text-align:center;margin-bottom:20px}
.form-header h2{font-size:22px;font-weight:900;color:#111;margin-bottom:4px}
.form-header p{font-size:13px;color:#777}
.alert-box{padding:10px 14px;border-radius:8px;font-size:13px;font-weight:600;margin-bottom:14px}
.alert-error{background:#fdecea;color:var(--error);border:1px solid #f5c6c6}
.alert-success{background:#e8f5e9;color:var(--success);border:1px solid #b7ddb7}
.alert-box a{color:inherit;font-weight:700}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-group label{font-size:12px;font-weight:700;color:#333;display:flex;align-items:center;gap:5px}
.form-group input[type=text],.form-group input[type=email],.form-group input[type=tel],.form-group input[type=password]{width:100%;padding:10px 12px;border:2px solid var(--light);border-radius:8px;font-size:13px;outline:none;transition:.3s;background:var(--white);color:#1F2B3A}
.form-group input:focus{border-color:var(--md);box-shadow:0 0 0 3px rgba(74,90,106,.1)}
.form-group input.error{border-color:var(--error)}
.pw-wrap{position:relative}
.pw-wrap input{padding-right:42px}
.toggle-btn{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;color:#999;font-size:16px;cursor:pointer;padding:0}
.error-msg{font-size:11px;color:var(--error);display:none}
.error-msg.show{display:block}
.terms-group{justify-content:center}
.checkbox-label{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:#666;cursor:pointer;font-weight:400}
.checkbox-label input[type=checkbox]{width:15px;height:15px;margin-top:2px;cursor:pointer;accent-color:var(--dark)}
.checkbox-label a{color:var(--md);font-weight:700;text-decoration:none}
.btn-submit{width:100%;background:var(--dark);color:var(--white);border:none;padding:13px;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;transition:.3s;margin-top:4px}
.btn-submit:hover{background:var(--md);transform:translateY(-2px);box-shadow:0 6px 18px rgba(31,43,58,.3)}
.btn-submit:disabled{background:#999;cursor:not-allowed;transform:none}
.btn-loader i{animation:spin 1s linear infinite;display:inline-block}
@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.login-link{text-align:center;margin-top:16px;font-size:13px;color:#666}
.login-link a{color:var(--md);font-weight:700;text-decoration:none}
@media(max-width:600px){.register-right{padding:24px 18px}.form-row{grid-template-columns:1fr}.register-container{border-radius:12px}}