.auth-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;min-height:-webkit-fill-available;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;backdrop-filter:blur(8px);animation:fadeIn .3s ease-out;overflow-y:auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.auth-modal-content{background:linear-gradient(135deg,#1a2332,#0f1621);border-radius:24px;max-width:480px;width:100%;max-height:90vh;overflow-y:auto;padding:2.5rem;position:relative;border:1px solid rgba(100,181,246,.2);box-shadow:0 20px 60px #00000080;animation:slideUp .4s ease-out;margin:auto}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-modal-close{position:absolute;top:1.25rem;right:1.25rem;background:#ffffff1a;border:none;color:#fff;font-size:1.75rem;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;line-height:1;z-index:10}.auth-modal-close:hover{background:#f4433633;transform:rotate(90deg)}.auth-tabs{display:flex;gap:.5rem;margin-bottom:2rem;background:#ffffff0d;padding:.35rem;border-radius:12px}.auth-tab{flex:1;padding:.875rem 1.5rem;background:transparent;border:none;color:#fff9;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:all .3s}.auth-tab:hover{color:#fffc;background:#ffffff0d}.auth-tab.active{background:linear-gradient(135deg,#1976d2,#1565c0);color:#fff;box-shadow:0 4px 12px #1976d24d}.auth-title{font-size:1.875rem;font-weight:700;margin-bottom:.5rem;color:#fff;text-align:center}.auth-subtitle{color:#fff9;text-align:center;margin-bottom:2rem;font-size:1rem}.auth-form{display:flex;flex-direction:column;gap:1.25rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{color:#ffffffe6;font-weight:600;font-size:.9rem;margin-bottom:.25rem}.form-group input{padding:.875rem 1.125rem;background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:10px;color:#fff;font-size:1rem;transition:all .3s;font-family:inherit}.form-group input:focus{outline:none;border-color:#1976d2;background:#ffffff1f;box-shadow:0 0 0 3px #1976d21a}.form-group input::placeholder{color:#fff6}.form-help{color:#ffffff80;font-size:.85rem;margin-top:.25rem}.auth-forgot-password{background:none;border:none;color:#64b5f6;font-size:.875rem;text-align:right;cursor:pointer;padding:0;margin-top:-.5rem;transition:color .3s}.auth-forgot-password:hover{color:#1976d2;text-decoration:underline}.btn-auth{width:100%;padding:1rem 1.5rem;font-size:1rem;font-weight:600;margin-top:.5rem}.beta-notice{background:#64b5f626;border:1px solid rgba(100,181,246,.3);border-radius:10px;padding:1rem;color:#64b5f6;font-size:.9rem;text-align:center;margin-top:.5rem}.auth-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;gap:1.5rem}.auth-spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.1);border-top-color:#1976d2;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.auth-loading p{color:#ffffffb3;font-size:1rem}.auth-error{background:#f4433626;border:1px solid rgba(244,67,54,.3);border-radius:10px;padding:1rem;color:#f44336;font-size:.9rem;margin-top:1rem;animation:shake .5s}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.auth-success{background:#4caf5026;border:1px solid rgba(76,175,80,.3);border-radius:10px;padding:1rem;color:#4caf50;font-size:.9rem;margin-top:1rem;animation:slideIn .4s}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.user-menu{position:relative;display:inline-block}.user-menu-button{display:flex;align-items:center;gap:.625rem;padding:.5rem 1rem;background:#1976d21a;border:1px solid rgba(25,118,210,.3);border-radius:8px;color:#fff;cursor:pointer;transition:all .3s;font-weight:600;font-size:.95rem}.user-menu-button:hover{background:#1976d233;border-color:#1976d280}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem}.user-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.user-menu-dropdown{position:absolute;top:calc(100% + .5rem);right:0;background:#1a2332;border:1px solid rgba(100,181,246,.2);border-radius:12px;min-width:220px;box-shadow:0 8px 32px #0006;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .3s;z-index:1000}.user-menu-dropdown.active{opacity:1;visibility:visible;transform:translateY(0)}.user-menu-header{padding:1rem;border-bottom:1px solid rgba(255,255,255,.1)}.user-menu-name{font-weight:600;color:#fff;margin-bottom:.25rem}.user-menu-email{font-size:.85rem;color:#fff9}.user-menu-badge{display:inline-block;padding:.25rem .625rem;background:#4caf5033;color:#4caf50;border-radius:12px;font-size:.75rem;font-weight:600;margin-top:.5rem;text-transform:uppercase;letter-spacing:.05em}.user-menu-items{padding:.5rem}.user-menu-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;color:#fffc;text-decoration:none;border-radius:8px;transition:all .3s;cursor:pointer;background:none;border:none;width:100%;text-align:left;font-size:.95rem}.user-menu-item:hover{background:#ffffff14;color:#fff}.user-menu-item.logout{color:#f44336}.user-menu-item.logout:hover{background:#f443361a}#app-user-bar{max-width:calc(100vw - 20px)}@media (max-width: 768px){#app-user-bar{top:60px!important;right:10px!important;padding:.5rem .75rem!important;gap:.5rem!important}#app-user-bar a{font-size:.8rem!important}#app-user-bar .user-menu-button{padding:.4rem .75rem!important;font-size:.85rem!important}#app-user-bar .user-menu-button span{display:none!important}}@media (max-width: 768px){.auth-modal{padding:10px;align-items:flex-start;padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(10px,env(safe-area-inset-bottom))}.auth-modal-content{padding:1.5rem 1.25rem;max-height:100%;max-width:100%;border-radius:16px;margin:10px auto}.auth-modal-close{width:36px;height:36px;font-size:1.5rem;top:1rem;right:1rem}.auth-title{font-size:1.5rem}.auth-subtitle{font-size:.9rem;margin-bottom:1.5rem}.auth-tabs{margin-bottom:1.5rem}.auth-tab{padding:.75rem 1rem;font-size:.9rem}.form-group{gap:.4rem}.form-group label{font-size:.85rem}.form-group input{padding:.75rem 1rem;font-size:16px}.btn-auth{padding:.875rem 1.25rem;font-size:.95rem}.user-menu-button{padding:.5rem .75rem;font-size:.875rem}.user-avatar{width:28px;height:28px;font-size:.75rem}.beta-notice,.auth-error,.auth-success{font-size:.85rem;padding:.875rem}}@media (max-width: 375px){.auth-modal-content{padding:1.25rem 1rem}.auth-title{font-size:1.25rem}.auth-subtitle{font-size:.85rem}.auth-tab{padding:.65rem .75rem;font-size:.85rem}.form-group input{padding:.65rem .875rem}.btn-auth{padding:.75rem 1rem}}
