#app-container:has(.sng-auth-screen){display:block;height:100dvh;overflow:hidden}
.sng-auth-screen{--auth-ink:#172c42;--auth-muted:#718093;--auth-blue:#347deb;box-sizing:border-box;min-height:100vh;width:100%;padding:38px 32px 22px;background:#f2f5fa;color:var(--auth-ink);font:14px/1.5 'Segoe UI','Microsoft YaHei',sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center}
.sng-auth-screen *{box-sizing:border-box}
.sng-auth-screen button,.sng-auth-screen input{font:inherit}
.auth-shell{position:relative;display:grid;grid-template-columns:43% 57%;width:min(1060px,100%);min-height:620px;background:#fff;border:1px solid #e4eaf2;border-radius:22px;overflow:hidden;box-shadow:0 18px 70px #233d5c0d}
.auth-window-controls{position:absolute;right:16px;top:14px;display:flex;gap:3px;z-index:2}
.auth-window-controls button{display:grid;place-items:center;width:32px;height:30px;border:0;border-radius:6px;background:transparent;color:#75849a;cursor:pointer}
.auth-window-controls button:hover{background:#edf2f8;color:#263e58}
.auth-window-controls button[data-window=close]:hover{background:#e55361;color:white}
.auth-window-controls button:disabled{cursor:default;opacity:.5}
.auth-brand .auth-studio-logo{width:42px;height:42px;object-fit:contain;flex-shrink:0;border-radius:11px}
.auth-visual{position:relative;overflow:hidden;min-height:620px;background:#1d3b57;color:white;display:flex;flex-direction:column;justify-content:space-between;padding:34px 34px 28px;isolation:isolate}
.auth-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:48% center;z-index:-3}
.auth-visual-shade{position:absolute;inset:0;background:linear-gradient(180deg,#102c46a6 0%,#102c4629 28%,#102c46c9 65%,#102c46f0 100%);z-index:-2}
.auth-brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;width:fit-content}
.auth-brand>span{display:grid;place-items:center;width:42px;height:42px;border:1px solid #ffffff47;background:#ffffff12;border-radius:11px;font-size:21px}
.auth-brand strong{display:block;font-size:19px;letter-spacing:2px;font-weight:650}
.auth-brand small{font-size:9px;letter-spacing:2.2px;color:#ffffffac}
.auth-visual-copy{margin-top:auto;padding:85px 0 49px}
.auth-line{display:block;width:33px;height:3px;background:#8fbfff;margin-bottom:25px}
.auth-visual-copy h2{font-size:37px;line-height:1.55;letter-spacing:2px;font-weight:600;margin:0 0 18px;color:white;white-space:pre-line;overflow-wrap:anywhere}
.auth-brand strong,.auth-brand small,.auth-visual-copy p,.auth-visual-footer span{overflow-wrap:anywhere;white-space:pre-line}
.auth-visual-copy p{font-size:13px;color:#dfebf6c9;margin:0}
.auth-visual-footer{display:flex;gap:12px;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.15px;color:#ffffff80;border-top:1px solid #ffffff21;padding-top:19px}
.auth-panel{padding:62px 58px 38px;align-self:center;min-width:0}
.auth-heading{margin:0 0 31px}
.auth-eyebrow{font-size:10px;letter-spacing:2.3px;font-weight:600;color:#8291a3}
.auth-heading h1{font-size:30px;letter-spacing:1px;line-height:1.4;font-weight:650;margin:11px 0 9px;color:#172c42}
.auth-heading p{margin:0;font-size:13px;color:var(--auth-muted);line-height:1.85}
.auth-field{margin:0 0 21px;min-width:0}
.auth-field>label,.auth-contact-heading>label{display:block;font-size:13px;font-weight:600;color:#33465b;margin-bottom:9px}
.auth-input-wrap{display:flex;align-items:center;gap:11px;border:1px solid #dfe6ee;border-radius:9px;background:#fcfdff;padding:0 14px;transition:border-color .15s,box-shadow .15s}
.auth-input-wrap:focus-within{border-color:#6e9fec;box-shadow:0 0 0 3px #347deb12;background:#fff}
.auth-input-wrap>i{color:#97a4b3;font-size:14px;flex-shrink:0;width:15px;text-align:center}
.auth-input-wrap input{width:100%;min-width:0;outline:none;border:0;background:transparent;color:#253b52;height:48px;font-size:13px;box-shadow:none;padding:0}
.auth-input-wrap input::placeholder{color:#a0aab7;opacity:1}
.auth-eye{display:grid;place-items:center;background:none;border:0;color:#8997a8;cursor:pointer;width:24px;min-width:24px;height:34px;padding:0;font-size:13px}
.auth-submit{width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:18px;border:0;border-radius:9px;background:var(--auth-blue);color:white;font-size:14px;font-weight:600;letter-spacing:.3px;cursor:pointer;box-shadow:0 5px 15px #347deb19;transition:background .15s}
.auth-submit:hover{background:#246bda}
.auth-submit>i{font-size:12px}
.auth-submit:disabled{opacity:.65;cursor:wait}
.auth-options{display:flex;align-items:center;justify-content:center;gap:17px;margin:25px 0 33px}
.auth-options button{font-size:12px;padding:4px 0;border:0;background:none;cursor:pointer;color:#65778d;white-space:nowrap}
.auth-options button:last-child{color:#347deb}
.auth-options>span{height:10px;width:1px;background:#e2e8ef;flex-shrink:0}
.auth-options button:hover,.auth-back:hover{color:#2369d5}
.auth-device-note{border-top:1px solid #eef1f6;padding-top:18px;color:#98a3b1;display:flex;align-items:flex-start;gap:8px;font-size:11px;line-height:1.9}
.auth-device-note>i{font-size:12px;line-height:1.8;color:#8aa5c4}
.auth-page-footer{padding-top:23px;font-size:11px;color:#98a3b1;letter-spacing:.4px}
.auth-feedback{font-size:12px;color:#bd4c54;line-height:1.7;margin:0 0 13px;white-space:pre-wrap;overflow-wrap:anywhere}
.auth-feedback:empty{display:none}
.auth-back{border:0;background:none;padding:0;color:#768699;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:8px;margin-bottom:22px}
.auth-register{padding:56px 43px 30px}
.auth-heading.compact{margin-bottom:24px}
.auth-heading.compact h1{font-size:26px;margin-top:8px}
.auth-register .auth-field{margin-bottom:17px}
.auth-register .auth-input-wrap input{height:44px}
.auth-contact-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;gap:12px}
.auth-contact-heading>label{margin:0}
.auth-contact-switch{display:flex;padding:3px;background:#f1f4f8;border-radius:6px;gap:2px}
.auth-contact-switch button{padding:3px 10px;border:0;background:none;border-radius:4px;font-size:11px;color:#7d8b9c;cursor:pointer}
.auth-contact-switch button[aria-pressed=true]{background:#fff;color:#347deb;box-shadow:0 1px 4px #233d5c0a}
.auth-field-note{font-size:11px;color:#8996a6;line-height:1.85;margin:9px 0 0}
.auth-password-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auth-password-pair .auth-input-wrap{gap:7px;padding:0 10px}
.auth-password-pair .auth-input-wrap>i{display:none}
.auth-nickname-note{display:flex;align-items:flex-start;gap:7px;margin:0 0 19px;color:#8190a2;font-size:11px;line-height:1.85}
.auth-nickname-note>i{margin-top:4px;flex-shrink:0;color:#91a9c5}
.auth-recovery-card{display:flex;align-items:flex-start;gap:15px;padding:20px;background:#f5f8fc;border:1px solid #e9eef5;border-radius:10px;margin:0 0 22px}
.auth-recovery-icon{width:34px;height:34px;display:grid;place-items:center;background:#e7effc;color:#347deb;border-radius:8px;flex-shrink:0}
.auth-recovery-card strong{font-size:14px;font-weight:600}
.auth-recovery-card p{color:#7a899b;font-size:12px;line-height:1.85;margin:7px 0 0}
.auth-recovery-methods{display:grid;gap:12px;margin:20px 0}
.auth-recovery-methods>div{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid #e8edf3;border-radius:7px;font-size:12px;color:#91a0b1}
.auth-recovery-methods small{margin-left:auto;font-size:10px}
.auth-recovery-methods~.auth-submit{margin-top:24px}
.auth-device-card{background:#f6f8fb;border:1px solid #e6ecf3;border-radius:10px;padding:20px}
.auth-device-title{font-size:13px;font-weight:600;color:#3b526d;display:flex;align-items:center;gap:8px}
.auth-device-title small{margin-left:auto;font-size:10px;font-weight:400;color:#93a2b2}
.auth-device-card code{display:block;margin-top:9px;font:12px/1.9 Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;user-select:text;color:#59718b}
.auth-device-card details{margin-top:17px;font-size:11px;color:#7a8ca0}
.auth-device-card summary{cursor:pointer}
.auth-device-actions{display:flex;gap:12px;margin:18px 0}
.auth-secondary{border:1px solid #dfe6ef;background:white;padding:10px 15px;border-radius:7px;color:#5d7590;font-size:12px;cursor:pointer}
.auth-secondary:disabled{opacity:.5;cursor:default}
.auth-error-action{display:block;border:0;background:none;padding:8px 0 0;font-size:12px;color:#347deb;cursor:pointer}
.sng-auth-screen :focus-visible{outline:2px solid #4d8bec;outline-offset:3px}
.sng-auth-screen input:focus-visible{outline:none}
.auth-field:has(.auth-forgot-username){position:relative}
.auth-field:has(.auth-forgot-username)>label{padding-right:100px}
.auth-forgot-username{position:absolute;right:0;top:0;border:0;padding:0;background:none;color:#347deb;font-size:12px!important;cursor:pointer}
.auth-panel[data-auth-view=username]{padding-top:4px;padding-bottom:18px}
.auth-panel[data-auth-view=username] .auth-back{margin-bottom:12px}
.auth-panel[data-auth-view=username] .auth-heading{margin-bottom:16px}
.auth-panel[data-auth-view=username] .auth-heading h1{font-size:27px;margin:6px 0}
.auth-recovery-progress{display:flex;gap:22px;list-style:none;padding:0;margin:0 0 20px;font-size:12px;color:#94a1b1}
.auth-recovery-progress li{display:flex;align-items:center;gap:8px}
.auth-recovery-progress li>span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#f0f3f8}
.auth-recovery-progress [aria-current=step]{color:#347deb;font-weight:600}
.auth-recovery-progress [aria-current=step]>span{background:#eaf2ff}
.auth-recovery-channels{display:flex;gap:10px;margin-bottom:18px}
.auth-recovery-channels button{flex:1;border:1px solid #dfe6ee;border-radius:9px;padding:11px 6px;background:white;color:#718093;font-size:12px;cursor:pointer}
.auth-recovery-channels [aria-pressed=true]{color:#347deb;border-color:#78a5f0;background:#f0f6ff}
.auth-recovery-help{display:flex;flex-direction:column;gap:5px;border-top:1px solid #eef1f6;padding-top:14px;margin-top:18px;color:#8996a6;font-size:11px}
.auth-recovery-help button,.auth-recovery-destination button,.auth-resend{align-self:flex-start;background:none;border:0;padding:0;color:#347deb;cursor:pointer;font-size:12px!important}
.auth-recovery-unavailable{display:flex;gap:7px;font-size:11px;line-height:1.7;color:#7a899b;margin:0 0 14px}
.auth-panel[data-auth-view=username] .auth-submit:disabled{cursor:not-allowed}
.auth-recovery-destination{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#f5f8fc;border-radius:9px;padding:14px;margin-bottom:20px;font-size:12px;color:#718093;overflow-wrap:anywhere}
.auth-resend{white-space:nowrap;flex-shrink:0;align-self:center}
.auth-resend:disabled{color:#98a3b1;cursor:default}
.auth-found-accounts{max-height:150px;overflow:auto;overscroll-behavior:contain;display:grid;gap:10px;margin-bottom:22px}
.auth-found-accounts label{display:flex;align-items:center;gap:12px;min-width:0;padding:18px;border:1px solid #dfe6ee;border-radius:10px;cursor:pointer}
.auth-found-accounts label:has(input:checked){background:#f0f6ff;border-color:#78a5f0}
.auth-found-accounts input{accent-color:#347deb;flex-shrink:0}
.auth-found-accounts span{min-width:0;flex:1}
.auth-found-accounts small{display:block;font-size:11px;color:#7d8b9c}
.auth-found-accounts strong{display:block;font-size:20px;color:#172c42;overflow-wrap:anywhere}
.auth-found-accounts i{color:#347deb;flex-shrink:0}
.auth-recovery-result-actions{display:grid;gap:12px}
.auth-panel[data-auth-view=username] .auth-feedback{max-height:48px;overflow:auto}
@media(max-height:600px){
 .auth-panel[data-auth-view=username]{padding-bottom:10px}
 .auth-panel[data-auth-view=username] .auth-back{margin-bottom:8px}
 .auth-panel[data-auth-view=username] .auth-heading{margin-bottom:10px}
 .auth-panel[data-auth-view=username] .auth-heading h1{font-size:24px;margin:4px 0}
 .auth-panel[data-auth-view=username] .auth-field{margin-bottom:12px}
 .auth-panel[data-auth-view=username] .auth-input-wrap input{height:40px}
 .auth-panel[data-auth-view=username] .auth-submit{height:40px}
 .auth-recovery-progress,.auth-recovery-channels{margin-bottom:12px}
 .auth-recovery-help{margin-top:12px;padding-top:10px}
 .auth-found-accounts{max-height:110px;margin-bottom:14px}
}
@media(max-width:1050px){.auth-panel{padding:58px 32px 36px}.auth-register{padding:56px 30px 30px}.auth-visual{padding:30px 26px}.auth-visual-copy h2{font-size:31px}}
@media(max-width:750px){.sng-auth-screen{padding:24px 18px}.auth-shell{grid-template-columns:1fr;max-width:470px;min-height:0}.auth-visual{display:none}.auth-panel{padding:58px 28px 36px}.auth-password-pair{grid-template-columns:1fr;gap:0}.auth-options{gap:13px}.auth-heading h1{font-size:27px}}
@media(prefers-reduced-motion:reduce){.sng-auth-screen *{transition:none!important}}
/* Desktop authentication is the window itself; no surrounding page or footer. */
html.sng-auth-window,html.sng-auth-window body{margin:0!important;padding:0!important;background:#fff!important;overflow:hidden}
.sng-auth-window #app-container{height:100dvh;overflow:hidden}
.sng-auth-window .sng-auth-screen{padding:0;background:#fff;justify-content:flex-start}
.sng-auth-window .auth-shell{width:100%;max-width:none;height:100dvh;border:0;border-radius:0;box-shadow:none}
.sng-auth-window .auth-visual{border-radius:0}
.sng-auth-window .auth-page-footer{display:none}
.sng-auth-window .auth-shell::before{content:'';position:absolute;left:0;right:130px;top:0;height:30px;z-index:3;-webkit-app-region:drag}
.sng-auth-window .auth-brand{-webkit-app-region:drag}
.sng-auth-window button,.sng-auth-window input,.sng-auth-window textarea,.sng-auth-window a:not(.auth-brand){-webkit-app-region:no-drag}
/* Expanding the machine code scrolls its card, never the login window. */
.auth-panel.auth-device{height:100%;min-height:0;display:flex;flex-direction:column;padding-top:0;padding-bottom:24px;align-self:stretch;overflow:hidden}
.auth-device>.auth-back{flex-shrink:0;margin-bottom:14px;align-self:flex-start}
.auth-device>.auth-heading{flex-shrink:0;margin-bottom:18px}
.auth-device>.auth-device-card{flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:#b8c5d5 transparent;-webkit-app-region:no-drag}
.auth-device>.auth-device-actions{flex-shrink:0;margin:14px 0}
.auth-device>.auth-field-note{flex-shrink:0;margin-top:0}
/* All auth views share a bounded shell and an independent right-hand viewport. */
html:has(.sng-auth-screen),body:has(.sng-auth-screen){height:100dvh;overflow:hidden}
.sng-auth-screen{height:100dvh;min-height:0;overflow:hidden}
.auth-shell{height:min(620px,calc(100dvh - 106px));min-height:0;grid-template-columns:minmax(0,43fr) minmax(0,57fr);grid-template-rows:minmax(0,1fr);flex-shrink:0}
.auth-visual{height:100%;min-height:0;min-width:0}
.auth-panel-viewport{min-height:0;min-width:0;height:100%;padding-top:48px;display:flex;flex-direction:column;overflow:hidden}
.auth-panel{flex-shrink:1;max-height:100%;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:#b8c5d5 transparent;align-self:stretch;margin-block:auto;padding-top:14px;padding-bottom:28px;overflow-wrap:anywhere}
.auth-panel.auth-device{max-height:100%;margin:0;flex-shrink:0;overflow:hidden;padding-top:0;padding-bottom:24px}
.auth-register .auth-heading.compact{margin-bottom:18px}
.auth-register .auth-back{margin-bottom:14px}
.auth-recovery-card>div{min-width:0}
.auth-panel[data-auth-view=recovery] .auth-heading{margin-bottom:20px}
.auth-panel[data-auth-view=recovery] .auth-recovery-card{padding:16px;margin-bottom:12px}
.auth-panel[data-auth-view=recovery] .auth-recovery-methods{gap:10px;margin:14px 0}
.auth-panel[data-auth-view=recovery]>.auth-submit{margin-top:16px}
.auth-window-controls{z-index:4}
.auth-role-choice{border:0;padding:0;margin:0 0 18px;display:flex;gap:10px;min-width:0}.auth-role-choice legend{font-weight:600;margin-bottom:9px;color:var(--auth-ink)}.auth-role-choice label{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 8px;border:1px solid #e0e7f0;border-radius:9px;cursor:pointer;font-size:13px}.auth-role-choice label:has(input:checked){border-color:#347deb;background:#edf4ff;color:#347deb}.auth-role-choice input{width:14px;height:14px;flex-shrink:0;accent-color:#347deb;margin:0}
.auth-panel:has(.auth-role-choice) .auth-heading{margin-bottom:20px}.auth-panel:has(.auth-role-choice) .auth-options{margin:18px 0}.auth-panel:has(.auth-role-choice) .auth-device-note{padding-top:12px}
.auth-login-preferences{display:flex;align-items:center;gap:26px;margin:-2px 0 18px;color:#718093;font-size:12px}
.auth-login-preferences label{display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none;white-space:nowrap}
.auth-login-preferences input{appearance:auto;position:static;width:14px;height:14px;margin:0;accent-color:#347deb;cursor:pointer;flex-shrink:0}
.auth-login-preferences label:has(input:disabled){opacity:.6;cursor:default}
.auth-login-preferences input:disabled{cursor:default}
.auth-preference-note{font-size:11px;color:#8996a6;margin:-8px 0 16px}
.sng-auth-window #app-container>.sng-auth{box-sizing:border-box;height:100dvh;min-height:0;overflow:hidden}
.sng-auth-window .sng-auth-card{min-width:0;max-height:100%;overflow:auto;overscroll-behavior:contain;overflow-wrap:anywhere}
@media(max-width:750px){.auth-shell{grid-template-columns:minmax(0,1fr);height:calc(100dvh - 88px)}.auth-panel{padding-top:14px}.sng-auth-window .auth-shell{height:100dvh}}
/* Fit identity selection and saved-login options inside the fixed desktop window. */
.auth-panel[data-auth-view=login]:has(.auth-role-choice){padding-top:8px;padding-bottom:18px}
.auth-panel[data-auth-view=login]:has(.auth-role-choice) .auth-heading{margin-bottom:16px}
.auth-panel[data-auth-view=login]:has(.auth-role-choice) .auth-heading h1{margin:8px 0 6px}
.auth-panel[data-auth-view=login]:has(.auth-role-choice) .auth-field{margin-bottom:14px}
.auth-panel[data-auth-view=login] .auth-role-choice{margin-bottom:14px}
.auth-panel[data-auth-view=login] .auth-role-choice legend{margin-bottom:6px}
.auth-panel[data-auth-view=login] .auth-role-choice label{padding-block:8px}
.auth-panel[data-auth-view=login]:has(.auth-role-choice) .auth-login-preferences{margin-bottom:12px}
.auth-panel[data-auth-view=login]:has(.auth-role-choice) .auth-options{margin:12px 0}
.auth-panel[data-auth-view=login]:has(.auth-role-choice) .auth-device-note{padding-top:10px}
/* Leave room for authentication feedback without making the whole panel scroll. */
.auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-heading p{display:none}
.auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-heading{margin-bottom:8px}
.auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-field{margin-bottom:10px}
.auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-role-choice{margin-bottom:10px}
.auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-login-preferences{margin-bottom:8px}
.auth-panel[data-auth-view=login] .auth-feedback:not(:empty){max-height:60px;overflow:auto;margin-bottom:8px}
@media(max-height:600px){
  .sng-auth-window .auth-panel[data-auth-view=login]{padding-top:4px;padding-bottom:12px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-heading{margin-bottom:10px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-heading h1{font-size:25px;margin:4px 0}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-field{margin-bottom:10px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-field>label{margin-bottom:6px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-input-wrap input{height:40px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-submit{height:40px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-role-choice{margin-bottom:10px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-role-choice label{padding-block:6px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-login-preferences{margin-bottom:10px}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-options{margin:8px 0}
  .sng-auth-window .auth-panel[data-auth-view=login] .auth-device-note{padding-top:8px}
  .sng-auth-window .auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-heading{margin-bottom:6px}
  .sng-auth-window .auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-role-choice{margin-bottom:6px}
  .sng-auth-window .auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-field{margin-bottom:6px}
  .sng-auth-window .auth-panel[data-auth-view=login]:has(.auth-feedback:not(:empty)) .auth-login-preferences{margin-bottom:6px}
}