:root{--primary-blue:#0056b3;--primary-blue-hover:#003f88;--primary-blue-light:#0066cc;--primary-blue-dark:#002d5a;--text-primary:#1a1a1a;--text-secondary:#666666;--text-tertiary:#999999;--border-color:#e0e0e0;--border-color-light:#f0f0f0;--background-white:#ffffff;--background-gray:#fafafa;--background-input:#f7f9fc;--shadow-sm:0 2px 8px rgba(0, 0, 0, 0.04);--shadow-md:0 4px 16px rgba(0, 0, 0, 0.08);--shadow-lg:0 8px 32px rgba(0, 0, 0, 0.12);--shadow-xl:0 20px 60px rgba(0, 0, 0, 0.15);--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:20px;--transition-base:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);--transition-smooth:all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);--font-family:"Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-behavior:smooth}body{min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#f5f7fa 0%,#e8ecf1 100%);color:var(--text-primary);font-family:var(--font-family);line-height:1.6;padding:2rem 1rem;position:relative;overflow-x:hidden}.register-container{width:100%;max-width:1200px;height:90vh;min-height:650px;max-height:900px;display:grid;grid-template-columns:1.2fr 1fr;background:var(--background-white);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-xl);position:relative;z-index:10;backdrop-filter:blur(20px);border:1px solid rgb(255 255 255 / .8)}.register-container::before{content:"";background:linear-gradient(135deg,rgb(0 86 179 / .08) 0%,rgb(0 102 204 / .04) 100%),url(../images/promo.png) center/cover no-repeat;grid-column:1 / 2;width:100%;height:100%;filter:brightness(.97) contrast(1.03) saturate(1.05);position:relative}.register-card{position:relative;grid-column:2 / 3;display:flex;flex-direction:column;justify-content:flex-start;padding:3rem 3.5rem;background:rgb(255 255 255 / .98);border-left:1px solid var(--border-color-light);overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;scrollbar-gutter:stable}.register-card::-webkit-scrollbar{width:10px}.register-card::-webkit-scrollbar-track{background:#fff0;border-radius:10px}.register-card::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#cbd5e0 0%,#a0aec0 100%);border-radius:10px;border:2px solid rgb(255 255 255 / .5);transition:var(--transition-base)}.register-card::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#a0aec0 0%,#718096 100%);border-color:rgb(255 255 255 / .3)}.register-card{scrollbar-width:thin;scrollbar-color:#cbd5e0 #fff0}.logo-section{text-align:center;margin-bottom:2.5rem;padding-top:.5rem;animation:fadeInDown 0.6s ease-out}@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.logo-section .mcl-logo{width:150px;height:150px;margin-bottom:.5rem;object-fit:contain;filter:drop-shadow(0 4px 8px rgb(0 0 0 / .1));transition:var(--transition-smooth)}.logo-section .mcl-logo{display:block;width:140px;height:140px;object-fit:contain;padding:0;margin:0 auto .2rem;transform:scale(1.25)}.logo-section .mcl-logo:hover{transform:scale(1.05) rotate(2deg);filter:drop-shadow(0 6px 12px rgb(0 86 179 / .2))}.logo-section h2{font-size:1.35rem;font-weight:600;color:var(--text-primary);margin-bottom:.35rem;letter-spacing:-.02em;line-height:1.3}form h3{text-align:center;margin-bottom:1.75rem;color:var(--text-primary);font-size:1.25rem;font-weight:600;letter-spacing:-.01em;line-height:1.4}form h3{margin-top:.5rem;margin-bottom:.5rem}.google-login.top{text-align:center;margin:0 0 1.25rem 0}.google-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;width:100%;padding:.875rem 1.25rem;border:1.5px solid var(--border-color);border-radius:var(--radius-md);background:var(--background-white);color:var(--text-primary);font-size:.9375rem;font-weight:500;text-decoration:none;transition:var(--transition-base);box-shadow:var(--shadow-sm);cursor:pointer;position:relative;overflow:hidden}.google-btn::before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgb(0 0 0 / .03);transform:translate(-50%,-50%);transition:width 0.6s,height 0.6s}.google-btn:hover::before{width:300px;height:300px}.google-btn img{width:20px;height:20px;object-fit:contain;position:relative;z-index:1}.google-btn span{position:relative;z-index:1}.google-btn:hover{background:var(--background-gray);border-color:#b8b8b8;transform:translateY(-2px);box-shadow:var(--shadow-md)}.google-btn:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.google-btn:focus-visible{outline:3px solid rgb(0 86 179 / .2);outline-offset:2px}.divider{display:flex;align-items:center;justify-content:center;margin:1.5rem 0;color:var(--text-tertiary);font-size:.8125rem;font-weight:500;position:relative;text-transform:uppercase;letter-spacing:.08em}.divider::before,.divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--border-color),transparent);margin:0 1rem}.form-group{display:flex;flex-direction:column;margin-bottom:1.25rem}.form-group label{font-size:.875rem;font-weight:500;margin-bottom:.5rem;color:var(--text-primary);letter-spacing:.01em;line-height:1.4;transition:var(--transition-base)}.form-group:focus-within label{color:var(--primary-blue)}.form-group input,.form-group textarea{padding:.75rem 1rem;border:1.5px solid var(--border-color);border-radius:var(--radius-md);outline:none;transition:var(--transition-base);background:var(--background-input);font-family:var(--font-family);font-size:.9375rem;color:var(--text-primary);line-height:1.5;width:100%}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-tertiary);opacity:.8;transition:var(--transition-base)}.form-group input:hover,.form-group textarea:hover{border-color:#a8a8a8;background:rgb(247 249 252 / .8)}.form-group input:focus,.form-group textarea:focus{border-color:var(--primary-blue);background:var(--background-white);box-shadow:0 0 0 4px rgb(0 86 179 / .08);transform:translateY(-1px)}.form-group input:focus::placeholder,.form-group textarea:focus::placeholder{opacity:.5;transform:translateX(4px)}.form-group textarea{resize:vertical;min-height:80px;max-height:200px;font-family:var(--font-family)}.form-group input[type="file"]{padding:.625rem 1rem;background:var(--background-white);cursor:pointer;font-size:.875rem;border:1.5px dashed var(--border-color)}.form-group input[type="file"]:hover{border-color:var(--primary-blue);border-style:solid}.form-group input[type="file"]::file-selector-button{padding:.5rem 1.125rem;margin-right:1rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--background-gray) 0%,#f0f0f0 100%);color:var(--text-primary);font-weight:500;font-size:.875rem;cursor:pointer;transition:var(--transition-base)}.form-group input[type="file"]::file-selector-button:hover{background:linear-gradient(135deg,#e8e8e8 0%,#dadada 100%);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.25rem}.form-row .form-group{margin-bottom:0}.form-group.checkbox{flex-direction:row;align-items:center;gap:.625rem;margin-bottom:1.5rem}.form-group.checkbox input[type="checkbox"]{width:18px;height:18px;min-width:18px;cursor:pointer;accent-color:var(--primary-blue);transition:var(--transition-base)}.form-group.checkbox input[type="checkbox"]:hover{transform:scale(1.1)}.form-group.checkbox input[type="checkbox"]:focus-visible{outline:2px solid rgb(0 86 179 / .3);outline-offset:2px}.form-group.checkbox label{margin-bottom:0;font-size:.875rem;font-weight:400;color:var(--text-secondary);cursor:pointer;line-height:1.5;user-select:none}.form-group.checkbox label a{color:var(--primary-blue);text-decoration:none;font-weight:500;transition:var(--transition-base);position:relative}.form-group.checkbox label a::after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--primary-blue-light);transition:width 0.3s ease}.form-group.checkbox label a:hover{color:var(--primary-blue-light)}.form-group.checkbox label a:hover::after{width:100%}#registerBtn{width:100%;padding:.9375rem 1.5rem;margin-top:.5rem;margin-bottom:1.25rem;background:linear-gradient(135deg,var(--primary-blue) 0%,var(--primary-blue-dark) 100%);color:var(--background-white);font-size:1rem;font-weight:600;border:none;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-base);box-shadow:0 4px 14px rgb(0 86 179 / .25);letter-spacing:.02em;position:relative;overflow:hidden}#registerBtn::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .2),transparent);transition:left 0.6s}#registerBtn:hover::before{left:100%}#registerBtn:hover{background:linear-gradient(135deg,var(--primary-blue-hover) 0%,var(--primary-blue-dark) 100%);transform:translateY(-2px);box-shadow:0 6px 20px rgb(0 86 179 / .35)}#registerBtn:active{transform:translateY(0);box-shadow:0 2px 8px rgb(0 86 179 / .25)}#registerBtn:focus-visible{outline:3px solid rgb(0 86 179 / .3);outline-offset:2px}#registerBtn:disabled{background:linear-gradient(135deg,#b0b0b0 0%,#909090 100%);cursor:not-allowed;transform:none;box-shadow:none;opacity:.6}.login-redirect{text-align:center;font-size:.9375rem;color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.6}.login-redirect a{color:var(--primary-blue);text-decoration:none;font-weight:600;transition:var(--transition-base);position:relative}.login-redirect a::after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--primary-blue-light);transition:width 0.3s ease}.login-redirect a:hover{color:var(--primary-blue-light)}.login-redirect a:hover::after{width:100%}.register-footer{text-align:center;font-size:.8rem;color:var(--text-tertiary);margin-top:1.5rem;border-top:1px solid var(--border-color-light);padding-top:1rem;line-height:1.6}.register-footer a{color:var(--primary-blue);text-decoration:none;transition:var(--transition-base);font-weight:500}.register-footer a:hover{color:var(--primary-blue-light);text-decoration:underline}body::before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:#f5f5f5 url(../images/flex/courier-pattern.svg) center/contain no-repeat;background-attachment:fixed;background-repeat:no-repeat;background-size:100%;opacity:.6;pointer-events:none;z-index:0}body::after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgb(0 0 0 / .2) 0%,rgb(0 86 179 / .05) 50%,rgb(0 0 0 / .15) 100%);pointer-events:none;z-index:1}.register-card *{position:relative;z-index:1}@media (max-width:1024px){.register-container{max-width:900px;grid-template-columns:1fr 1fr;height:85vh}.register-card{padding:2.5rem 2.5rem}}@media (max-width:768px){body{padding:1rem}.register-container{grid-template-columns:1fr;height:auto;max-height:none;min-height:auto}.register-container::before{display:none}.register-card{grid-column:1;padding:2rem 1.5rem;border-left:none}.logo-section{margin-bottom:2rem}.form-row{grid-template-columns:1fr;gap:0}.form-row .form-group{margin-bottom:1.25rem}}@media (max-width:480px){body{padding:.5rem}.register-card{padding:1.5rem 1rem}.logo-section h2{font-size:1.2rem}.logo-section p{font-size:.8125rem}form h3{font-size:1.1rem}#registerBtn{padding:.8125rem 1.25rem;font-size:.9375rem}.form-group input,.form-group textarea{padding:.6875rem .875rem;font-size:.875rem}.google-btn{padding:.8125rem 1rem;font-size:.875rem}}*:focus-visible{outline:2px solid rgb(0 86 179 / .5);outline-offset:2px}button:focus-visible,a:focus-visible{outline:3px solid rgb(0 86 179 / .4);outline-offset:2px}@media print{body::before,body::after{display:none}.register-container{box-shadow:none;border:1px solid var(--border-color)}.register-card{overflow:visible}}@media (prefers-contrast:high){:root{--border-color:#666666;--text-secondary:#333333}.form-group input,.form-group textarea{border-width:2px}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}.toggle-eye{font-size:1.2em;color:#444;opacity:.6;transition:opacity 0.2s ease}.toggle-eye:hover{opacity:1}.otp-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgb(0 0 0 / .45);backdrop-filter:blur(5px);z-index:9999;justify-content:center;align-items:center;animation:fadeIn 0.3s ease forwards}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.otp-box{background:#fff;padding:2rem 2.5rem;border-radius:12px;box-shadow:0 10px 40px rgb(0 0 0 / .2);text-align:center;width:90%;max-width:400px;animation:popUp 0.4s ease forwards;transform:translateY(-20px)}@keyframes popUp{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.otp-box h3{color:var(--primary-blue);margin-bottom:10px}.otp-box p{color:var(--text-secondary);font-size:.95rem;margin-bottom:1rem}.otp-box input{width:100%;padding:.75rem;font-size:1rem;border:1.5px solid var(--border-color);border-radius:8px;text-align:center;letter-spacing:4px;outline:none;transition:all 0.3s ease}.otp-box input:focus{border-color:var(--primary-blue);box-shadow:0 0 6px rgb(0 86 179 / .3)}.otp-box button{margin-top:1rem;background:var(--primary-blue);color:#fff;border:none;border-radius:8px;padding:.8rem 1.5rem;cursor:pointer;font-size:1rem;font-weight:600;transition:var(--transition-base);box-shadow:0 4px 12px rgb(0 86 179 / .25)}.otp-box button:hover{background:var(--primary-blue-hover);transform:translateY(-2px)}#otpStatus{margin-top:1rem;font-size:.9rem;color:#0056b3}.logo-section h2{margin-top:0;margin-bottom:.25rem}.logo-section{margin-bottom:2.5rem;padding-top:.5rem}