.modal-overlay{background-color:var(--modal-overlay-bg);-webkit-backdrop-filter:blur(var(--modal-overlay-blur));z-index:270;justify-content:center;align-items:center;animation:.25s ease-out modalFadeIn;display:flex;position:fixed;inset:0}.modal-overlay--auth{align-items:center;padding:clamp(16px,4vw,40px)}.modal-content{background-color:var(--modal-bg);border-radius:var(--modal-radius);padding:var(--modal-padding);width:90%;max-width:420px;box-shadow:var(--modal-shadow);text-align:center;animation:modalSlideUp var(--modal-transition);will-change:transform, opacity;position:relative}.modal-content--auth{width:min(500px,92vw);max-width:500px;padding:clamp(28px,5vw,36px)}.modal-close{width:36px;height:36px;color:var(--color-black);cursor:pointer;z-index:2;transform-origin:50%;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:.25rem;font-size:1.7rem;font-weight:700;line-height:1;transition:color .3s,transform .2s;display:flex;position:absolute;top:12px;right:12px}.modal-close:hover{color:#111827;transform:rotate(90deg)}.modal-title{color:var(--color-black);margin-bottom:8px;font-size:1.5rem;font-weight:700}.modal-subtitle{color:#77737a;margin:.5rem 0;font-size:.875rem}.modal-message{margin-bottom:1rem}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}@media (min-width:768px){.modal-content{max-width:450px}.modal-content--auth{max-width:540px}}@media (min-width:1024px){.modal-content{max-width:500px}.modal-content--auth{max-width:560px}}
.title-login{text-align:center;margin-bottom:18px}.modal-form{flex-direction:column;align-items:center;gap:.7rem;display:flex}.modal-form label{color:var(--color-black);font-size:.875rem;font-weight:500}.entry-area{width:100%;position:relative}.entry-area input{background-color:#0000;border:2px solid #d1d5db;border-radius:6px;outline:none;width:100%;padding:12px 10px;font-size:1rem;transition:border-color .3s,box-shadow .3s}.entry-area input:focus{border-color:#007bff;box-shadow:0 0 8px #007bff4d}.labelline{color:#777;pointer-events:none;background-color:#fff;padding:2px 6px;font-size:1rem;transition:all .3s;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.entry-area input:focus+.labelline,.entry-area input:not(:placeholder-shown)+.labelline{color:#007bff;font-size:.75rem;top:8px;left:10px}.modal-form button.primary,.modal-content--auth>button.primary{background-color:var(--color-black);color:#fff;cursor:pointer;text-transform:uppercase;border:none;border-radius:8px;width:100%;padding:12px;font-size:.875rem;font-weight:600;transition:background-color .3s}.modal-form button.primary:hover,.modal-content--auth>button.primary:hover{background-color:#333}.modal-form button.primary:disabled{background-color:var(--color-gray-light);cursor:not-allowed}.google-login-container{justify-content:center;width:100%;display:flex}.google-btn{color:#3c4043;cursor:pointer;background-color:#fff;border:1px solid #dadce0;border-radius:8px;justify-content:center;align-items:center;gap:10px;width:100%;padding:12px 24px;font-size:14px;font-weight:500;transition:background-color .2s,box-shadow .2s;display:flex}.google-btn:hover{background-color:#f8f9fa;box-shadow:0 1px 2px #3c40434d,0 1px 3px 1px #3c404326}.google-btn:disabled{opacity:.6;cursor:not-allowed}.google-icon{width:18px;height:18px}.modal-form .forgot-password,.modal-form .join-now,.modal-form .login-now,.modal-form .terms{color:#77737a;text-align:center;font-size:.875rem}.modal-form .join-now button,.modal-form .login-now button{color:#007bff;cursor:pointer;background:0 0;border:none;font-size:.875rem;text-decoration:underline}.success-message{background-color:#f0fdf4;border:1px solid #86efac;border-radius:8px;justify-content:center;align-items:center;gap:12px;margin:16px 0;padding:16px;display:flex}.success-icon{color:#fff;background-color:#22c55e;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:16px;font-weight:700;display:flex}.success-text{color:#166534;margin:0;font-size:14px}.error-message{background-color:#fef2f2;border:1px solid #fecaca;border-radius:8px;margin:16px 0;padding:16px}.error-message p{color:#dc2626;text-align:center;margin:0;font-size:14px}
