:root{--teal: #126c60;--teal-dark: #0B5C52;--teal-light: #0B6E71;--orange: #F1A31F;--orange-hover: #d4911a;--cream: #FBF8F3;--white: #FFFFFF;--gray-50: #f8f9fa;--gray-100: #f1f3f5;--gray-200: #e9ecef;--gray-300: #dee2e6;--gray-400: #ced4da;--gray-500: #adb5bd;--gray-600: #868e96;--gray-700: #495057;--gray-800: #343a40;--gray-900: #212529;--font-display: "Montserrat", system-ui, -apple-system, sans-serif;--font-body: "Inter", system-ui, -apple-system, sans-serif;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--ease: cubic-bezier(.4, 0, .2, 1);--duration: .3s}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:100px 1.5rem 2rem;background:linear-gradient(160deg,#f0f9f8 0%,var(--cream, #fdf6e3) 40%,#fef5e4 100%)}.auth-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}.shape{position:absolute;border-radius:50%;opacity:.07}.shape-1{width:600px;height:600px;background:var(--teal, #126C60);top:-200px;right:-200px;animation:float-slow 20s ease-in-out infinite}.shape-2{width:400px;height:400px;background:var(--orange, #E08A3C);bottom:-150px;left:-100px;animation:float-slow 15s ease-in-out infinite reverse}.shape-3{width:300px;height:300px;background:var(--teal, #126C60);top:50%;left:30%;animation:float-slow 18s ease-in-out infinite 3s}@keyframes float-slow{0%,to{transform:translate(0) scale(1)}50%{transform:translate(30px,-20px) scale(1.05)}}.auth-container{display:grid;grid-template-columns:1fr 1.2fr;max-width:980px;width:100%;background:var(--white, #ffffff);border-radius:var(--radius-xl, 24px);overflow:hidden;box-shadow:0 25px 80px #00000014,0 4px 20px #0000000a;position:relative;z-index:1;animation:slideUp .6s var(--ease, cubic-bezier(.22, 1, .36, 1)) both}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-brand{background:linear-gradient(160deg,var(--teal-dark, #0B5C52) 0%,var(--teal, #126C60) 50%,#1a7a5a 100%);padding:3rem;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.auth-brand:before{content:"";position:absolute;top:-50%;right:-40%;width:80%;height:100%;background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);pointer-events:none}.brand-content{position:relative;z-index:1}.brand-badge{display:inline-block;background:#ffffff1f;color:#ffffffe6;font-size:.75rem;font-weight:700;padding:6px 14px;border-radius:var(--radius-full);letter-spacing:.06em;text-transform:uppercase;margin-bottom:2rem;backdrop-filter:blur(8px)}.auth-brand h1{color:#fff;font-family:Montserrat,system-ui,-apple-system,sans-serif;font-size:clamp(2.2rem,4vw,3rem);line-height:1.1;margin-bottom:1rem}.auth-brand p{color:#ffffffbf;font-size:1rem;line-height:1.6;max-width:280px}.brand-features{margin-top:2.5rem;display:flex;flex-direction:column;gap:1rem}.feature{display:flex;align-items:center;gap:.75rem;color:#ffffffd9;font-size:.88rem;font-weight:500}.feature-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#ffffff1a;border-radius:10px;font-size:1rem}.brand-footer{position:relative;z-index:1;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.12);color:#ffffff80;font-size:.78rem;letter-spacing:.03em}.auth-form-panel{padding:3rem;display:flex;align-items:center;justify-content:center}.auth-form-content{width:100%;max-width:400px}.auth-header{margin-bottom:2rem}.auth-header h2{font-family:Montserrat,system-ui,-apple-system,sans-serif;font-size:1.8rem;font-weight:700;margin-bottom:.3rem}.auth-header p{color:var(--gray-500);font-size:.92rem}.google-section{margin-bottom:1.5rem}.google-btn-wrap{display:flex;justify-content:center;min-height:44px}.google-loading{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem;background:#f8f9fa;border-radius:var(--radius-md);color:var(--gray-600);font-size:.88rem;font-weight:500}.google-spinner{width:20px;height:20px;border:2px solid var(--gray-200);border-top-color:var(--teal);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.divider{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;color:var(--gray-500);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;font-weight:600}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--gray-200)}.auth-form{display:flex;flex-direction:column;gap:1rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.form-group label{display:block;font-family:var(--font-display);font-size:.82rem;font-weight:600;color:var(--gray-700);margin-bottom:.4rem}.input-wrap{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:14px;width:18px;height:18px;color:var(--gray-400);pointer-events:none;transition:color .2s}.input-wrap:focus-within .input-icon{color:var(--teal)}.auth-form input{width:100%;padding:13px 14px 13px 44px;font-family:var(--font-body);font-size:.92rem;background:var(--gray-50);border:2px solid var(--gray-200);border-radius:var(--radius-md);transition:all .25s var(--ease);color:var(--gray-900)}.auth-form input.no-icon{padding-left:14px}.auth-form input:focus{outline:none;border-color:var(--teal);background:var(--white);box-shadow:0 0 0 4px #126c6014}.auth-form input::placeholder{color:var(--gray-400)}.password-hint{font-size:.72rem;color:var(--gray-400);margin-top:.3rem}.form-error{background:#fef2f2;color:#dc2626;padding:10px 14px;border-radius:var(--radius-sm);font-size:.82rem;font-weight:500;border:1px solid #fecaca;animation:shake .3s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.btn-login{margin-top:.5rem;padding:15px 32px;font-size:.95rem}.btn-spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;display:inline-block}.auth-footer{margin-top:2rem;text-align:center;font-size:.88rem;color:var(--gray-500)}.auth-footer a{color:var(--teal);font-weight:600;transition:opacity .2s}.auth-footer a:hover{opacity:.7}@media(max-width:768px){.auth-page{padding:80px 1rem 1.5rem}.auth-container{grid-template-columns:1fr;max-width:440px}.auth-brand{padding:2rem;min-height:auto}.auth-brand h1{font-size:1.8rem}.brand-features,.brand-footer{display:none}.auth-form-panel{padding:2rem}.form-row{grid-template-columns:1fr}}
