.auth-section { position:relative; overflow:hidden; padding:74px 0 90px; }
.auth-section::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 24% 38%,var(--soft-blue),transparent 52%); }
.auth-shell { position:relative; display:grid; grid-template-columns:1fr 440px; gap:100px; align-items:center; max-width:1060px; }
.auth-intro { padding:20px 0; }
.auth-intro h1 { font-size:48px; line-height:1.25; font-weight:630; letter-spacing:-1.7px; margin:16px 0 22px; }
.auth-intro>p { color:var(--muted); font-size:16px; line-height:1.9; }
.auth-intro-note { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:12px; }
.auth-note-dot { height:5px; width:5px; background:var(--accent); border-radius:50%; }
.auth-orbit { position:relative; width:280px; height:230px; display:grid; place-items:center; margin:14px 0 24px; }
.auth-orbit-ring { position:absolute; width:210px; height:210px; border:1px solid var(--border); border-radius:50%; transform:rotate(-24deg) scaleY(.68); }
.auth-orbit-ring::before { content:""; position:absolute; inset:27px; border:1px solid var(--border); border-radius:50%; }
.auth-orbit-ring::after { content:""; position:absolute; inset:-27px; border:1px dashed var(--border); border-radius:50%; }
.auth-orbit-core { display:grid; place-items:center; width:75px; height:75px; border:1px solid var(--border); background:var(--surface); border-radius:24px; box-shadow:0 12px 50px var(--soft-blue); }
.auth-orbit-core img { width:40px; height:40px; }
.auth-orbit-point { position:absolute; width:8px; height:8px; border:2px solid var(--bg); border-radius:50%; background:var(--accent); box-shadow:0 0 0 6px var(--soft-blue); }
.auth-orbit .point-one { left:41px; top:146px; }
.auth-orbit .point-two { right:57px; top:80px; }
.auth-orbit .point-three { right:77px; bottom:38px; background:var(--purple); }
.auth-panel { border:1px solid var(--border); border-radius:24px; padding:34px 36px 25px; background:var(--surface); box-shadow:0 22px 70px rgba(0,0,0,.08); }
.auth-overline { font-size:10px; letter-spacing:.16em; color:var(--accent); font-weight:600; }
.auth-panel-heading h2 { font-size:27px; line-height:1.4; font-weight:620; letter-spacing:-.4px; margin:10px 0 7px; }
.auth-panel-heading p { color:var(--muted); font-size:13px; }
.auth-form { margin-top:27px; }
.auth-field { margin-bottom:18px; }
.auth-field label { display:block; font-size:12px; font-weight:550; margin-bottom:7px; }
.auth-field label span { font-weight:400; color:var(--muted); margin-left:5px; }
.auth-field input { width:100%; min-width:0; border:1px solid var(--border); border-radius:10px; color:var(--text); background:var(--bg); padding:12px 14px; font-size:14px; height:47px; transition:border-color .18s; }
.auth-field input::placeholder { color:var(--muted); opacity:.7; }
.auth-field input:hover { border-color:var(--muted); }
.auth-field input:focus { border-color:var(--accent); outline:2px solid var(--soft-blue); outline-offset:2px; }
.auth-field input[aria-invalid="true"] { border-color:#e99292; }
.auth-password-wrap { position:relative; }
.auth-password-wrap input { padding-right:46px; }
.auth-password-toggle { position:absolute; right:5px; top:5px; width:37px; height:37px; border:0; border-radius:7px; display:grid; place-items:center; color:var(--muted); background:transparent; }
.auth-password-toggle:hover { color:var(--text); background:var(--surface-raised); }
.auth-field-hint { display:block; color:var(--muted); font-size:11px; margin-top:6px; }
.auth-forgot { display:block; margin:-2px 0 19px auto; border:0; background:transparent; color:var(--accent); padding:2px 0; font-size:12px; }
.auth-forgot:hover { text-decoration:underline; }
.auth-recovery { font-size:12px; line-height:1.7; padding:12px 14px; background:var(--soft-blue); border:1px solid var(--border); border-radius:9px; color:var(--muted); margin-bottom:18px; }
.auth-error { font-size:12px; color:#edaaa9; background:rgba(210,94,94,.08); border:1px solid rgba(210,94,94,.18); padding:11px 13px; border-radius:9px; margin-bottom:17px; }
[data-theme="light"] .auth-error { color:#ac3e3d; }
.auth-submit { width:100%; min-height:47px; }
.auth-form-status { font-size:11px; line-height:1.6; color:var(--muted); text-align:center; margin-top:7px; }
.auth-form-status:empty { display:none; }
.auth-spinner { width:15px; height:15px; border:2px solid rgba(255,255,255,.3); border-top-color:currentColor; border-radius:50%; animation:auth-spin .8s linear infinite; }
.auth-switch { display:flex; justify-content:center; gap:7px; font-size:12px; color:var(--muted); padding:22px 0; }
.auth-switch a { color:var(--accent); }
.auth-switch a:hover { text-decoration:underline; }
.auth-panel-footer { display:flex; align-items:center; justify-content:center; gap:7px; border-top:1px solid var(--border); padding-top:18px; color:var(--muted); font-size:10px; }
@keyframes auth-spin { to { transform:rotate(360deg); } }
@media (max-width:1024px) { .auth-shell { gap:50px; grid-template-columns:1fr 410px; } .auth-intro h1 { font-size:41px; } }
@media (max-width:820px) { .auth-section { padding:42px 0 58px; } .auth-shell { grid-template-columns:minmax(0,460px); justify-content:center; gap:28px; } .auth-intro { padding:0; text-align:center; } .auth-intro .eyebrow { font-size:10px; } .auth-intro h1 { font-size:32px; margin:10px 0 13px; } .auth-intro>p { font-size:13px; } .auth-orbit,.auth-intro-note { display:none; } }
@media (max-width:480px) { .auth-shell { width:calc(100% - 32px); } .auth-section { padding:29px 0 44px; } .auth-panel { padding:27px 23px 22px; border-radius:19px; } .auth-panel-heading h2 { font-size:24px; } .auth-field input { font-size:16px; } .auth-intro h1 { font-size:28px; } }
@media (prefers-reduced-motion:reduce) { .auth-spinner { animation:none; } .auth-field input { transition:none; } }