:root{--auth-panel:var(--surface-raised);--auth-border:var(--line-strong);--auth-radius:1.35rem;--auth-shadow:0 1.75rem 5rem rgba(0,0,0,.52),0 .35rem 1.4rem rgba(229,9,20,.1)}
.auth-dialog{width:min(58rem,calc(100% - 2rem));padding:0;overflow:hidden;background:var(--auth-panel);border:1px solid var(--auth-border);border-radius:var(--auth-radius);box-shadow:var(--auth-shadow)}
.auth-dialog::backdrop{background:rgba(0,0,0,.76);backdrop-filter:blur(7px)}
.auth-dialog .dialog-close{position:absolute;z-index:3;top:1rem;right:1rem;background:rgba(5,5,5,.46);border-color:var(--line-strong)}
.auth-shell{display:grid;grid-template-columns:minmax(15rem,.83fr) minmax(23rem,1.17fr);min-height:34rem;background:radial-gradient(circle at 78% 0,rgba(229,9,20,.11),transparent 36%),var(--auth-panel)}
.auth-aside{position:relative;display:flex;min-height:100%;flex-direction:column;justify-content:space-between;overflow:hidden;padding:2.3rem;background:linear-gradient(145deg,#151515,#080808 63%);border-right:1px solid var(--line)}
.auth-aside::before{position:absolute;inset:0;content:"";opacity:.4;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:2rem 2rem;mask-image:linear-gradient(to bottom,black,transparent 75%)}
.auth-aside>*{position:relative}.auth-aside img{width:8.4rem;height:auto;object-fit:contain;object-position:left;filter:drop-shadow(0 .35rem .8rem rgba(0,0,0,.4))}.auth-kicker{margin:0 0:.9rem;color:var(--red-bright);font-size:.67rem;font-weight:800;letter-spacing:.18em}.auth-aside h3{max-width:14rem;margin:0;color:var(--white);font-size:clamp(1.6rem,3vw,2.35rem);line-height:1.02;letter-spacing:-.06em}.auth-aside p:not(.auth-kicker){max-width:15rem;margin:1.1rem 0 0;color:var(--text-muted);font-size:.9rem;line-height:1.65}.auth-aside-mark{font-size:.7rem;color:var(--text-faint);letter-spacing:.06em;text-transform:uppercase}
.auth-panel{align-self:center;padding:3.2rem clamp(1.5rem,5vw,4rem);background:transparent}.auth-panel h2{margin:.42rem 0 .55rem;color:var(--white);font-size:clamp(1.85rem,4vw,2.55rem);line-height:1.08;letter-spacing:-.055em}.auth-description{max-width:29rem;margin:0;color:var(--text-muted);font-size:.94rem;line-height:1.6}.auth-form{display:grid;gap:1rem;margin-top:1.8rem}.auth-field{display:grid;gap:.45rem;color:var(--text);font-size:.79rem;font-weight:700;letter-spacing:.01em}.auth-field input{box-sizing:border-box;width:100%;height:3.15rem;padding:.75rem .9rem;border:1px solid var(--line-strong);border-radius:.7rem;background:rgba(5,5,5,.45);color:var(--white);font:inherit;font-size:.94rem;font-weight:500;transition:border-color var(--motion-fast),box-shadow var(--motion-fast),background var(--motion-fast)}.auth-field input:hover{border-color:rgba(255,255,255,.28)}.auth-field input:focus{outline:0;border-color:var(--red-bright);background:rgba(5,5,5,.72);box-shadow:0 0 0 3px var(--red-wash)}
.password-input{position:relative}.password-input input{padding-right:4.7rem}.password-toggle{position:absolute;top:50%;right:.45rem;transform:translateY(-50%);min-width:3.55rem;border:0;border-radius:.42rem;padding:.43rem .5rem;background:transparent;color:var(--text-muted);font:inherit;font-size:.72rem;font-weight:800;cursor:pointer}.password-toggle:hover{color:var(--white);background:rgba(255,255,255,.08)}.password-toggle:focus-visible{outline:2px solid var(--red-bright);outline-offset:1px}.auth-options{display:flex;justify-content:space-between;align-items:center;margin-top:-.18rem}.auth-link,.auth-switch button{border:0;padding:0;background:transparent;color:var(--white);font:inherit;font-size:.79rem;font-weight:800;cursor:pointer;text-decoration:underline;text-decoration-color:rgba(229,9,20,.65);text-underline-offset:.26rem}.auth-link:hover,.auth-switch button:hover{color:var(--red-bright)}.auth-link:focus-visible,.auth-switch button:focus-visible{outline:2px solid var(--red-bright);outline-offset:4px}
.auth-alert{margin:0;border:1px solid rgba(255,77,87,.4);border-radius:.65rem;padding:.7rem .8rem;background:rgba(229,9,20,.12);color:#ffd7da;font-size:.8rem;line-height:1.45}.auth-primary{display:flex;justify-content:center;align-items:center;gap:.7rem;min-height:3.15rem;border:1px solid var(--red);border-radius:.7rem;padding:.75rem 1rem;background:var(--red);color:var(--white);font:inherit;font-size:.9rem;font-weight:850;cursor:pointer;box-shadow:0 .6rem 1.3rem rgba(229,9,20,.2);transition:transform var(--motion-fast),background var(--motion-fast),box-shadow var(--motion-fast)}.auth-primary:hover{background:var(--red-bright);transform:translateY(-1px);box-shadow:0 .8rem 1.6rem rgba(229,9,20,.28)}.auth-primary:focus-visible{outline:2px solid var(--white);outline-offset:3px}.auth-primary:disabled{cursor:wait;opacity:.7;transform:none}.button-spinner{width:.85rem;height:.85rem;border:2px solid rgba(255,255,255,.42);border-top-color:var(--white);border-radius:50%;animation:auth-spin .7s linear infinite}.auth-switch{margin:1.15rem 0 0;color:var(--text-muted);font-size:.82rem;text-align:center}@keyframes auth-spin{to{transform:rotate(360deg)}}
.account-menu{align-items:center}.account-menu .nav-login,.account-menu .nav-logout,.account-menu .nav-signup{min-height:2.35rem;border-radius:.55rem;padding:.45rem .76rem;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer}.account-menu .nav-login{border:1px solid var(--line-strong);background:transparent;color:var(--white)}.account-menu .nav-login:hover{border-color:rgba(255,255,255,.34);background:rgba(255,255,255,.06)}.account-menu .nav-signup{border:1px solid var(--red);background:var(--red);color:var(--white)}.account-menu .nav-signup:hover{background:var(--red-bright)}.account-menu .nav-logout{border:0;background:transparent;color:var(--text-muted)}.account-menu .nav-logout:hover{color:var(--white)}.account-menu button:focus-visible{outline:2px solid var(--red-bright);outline-offset:2px}
@media(max-width:45rem){.auth-dialog{width:min(29rem,calc(100% - 1.25rem))}.auth-shell{display:block;min-height:0}.auth-aside{display:none}.auth-panel{padding:3.6rem 1.25rem 1.55rem}.auth-dialog .dialog-close{top:.7rem;right:.7rem}.auth-panel h2{font-size:2rem}.auth-field input,.auth-primary{min-height:3.1rem}.account-menu .nav-login,.account-menu .nav-signup{padding:.42rem .56rem}.nav-browse{display:none}}
@media(prefers-reduced-motion:reduce){.auth-primary,.auth-field input{transition:none}.button-spinner{animation:none}}
.auth-dialog{max-height:calc(100vh - 1.25rem);overflow:auto;overscroll-behavior:contain}
.auth-shell{min-height:0}
@media(max-width:45rem){.auth-dialog{max-height:calc(100vh - .75rem);margin:.375rem auto}.auth-panel{padding-bottom:2rem}}
.password-help{margin:-.35rem 0 0;color:var(--text-muted);font-size:.73rem;line-height:1.45}.auth-divider{display:flex;align-items:center;gap:.7rem;color:var(--text-faint);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.auth-divider::before,.auth-divider::after{height:1px;flex:1;content:"";background:var(--line)}.auth-google{display:flex;min-height:3.1rem;justify-content:center;align-items:center;gap:.7rem;border:1px solid var(--line-strong);border-radius:.7rem;background:rgba(255,255,255,.04);color:var(--white);font-size:.88rem;font-weight:800;text-decoration:none;transition:border-color var(--motion-fast),background var(--motion-fast)}.auth-google span{display:grid;width:1.35rem;height:1.35rem;place-items:center;border-radius:50%;background:#fff;color:#4285f4;font-family:Arial,sans-serif;font-weight:900}.auth-google:hover{border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.09)}.auth-google:focus-visible{outline:2px solid var(--red-bright);outline-offset:3px}
.auth-google-direct{display:flex;min-height:3.15rem;align-items:center;justify-content:center;gap:.75rem;padding:.7rem 1.25rem;border-radius:.75rem;background:#ffffff!important;color:#1f1f1f!important;font-size:.92rem!important;font-weight:600!important;text-decoration:none;border:1px solid rgba(255,255,255,.2);box-shadow:0 3px 10px rgba(0,0,0,.22);transition:transform var(--motion-fast),box-shadow var(--motion-fast);margin-bottom:.85rem;box-sizing:border-box}
.auth-google-direct:hover{background:#f8f9fa!important;transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.32);color:#1f1f1f!important}
.auth-google-direct .google-icon{width:19px;height:19px;flex-shrink:0}


