/* Approved email/code sign-in, scoped away from the operations workspace. */
body:not(.signed-in) { background:#f4f5f7; }
body:not(.signed-in) > .topbar { display:none; }
body:not(.signed-in) > main { margin:0; min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:60px 24px; }
#login-section { --accent:#196c63; color:#20292e; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; width:100%; max-width:440px; margin:0; padding:0; background:transparent; border:0; border-radius:0; text-align:center; }
body:not(.signed-in) #message:not(:empty) { margin:18px auto 0; max-width:440px; text-align:center; font-size:13px; }
#login-section .login-brand { display: block; margin: 0 auto 32px; width: 210px; height: 44px; object-fit: cover; }
#login-section .login-card { background: #fff; border: 1px solid #e0e5e8; border-radius: 20px; padding: 36px 36px 30px; box-shadow: 0 5px 18px #1b303b04; }
#login-section .step-icon { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #dcebe7; background: #eef6f3; color: var(--accent); border-radius: 14px; margin: 0 auto 21px; }
#login-section .step-icon svg { width: 24px; height: 24px; }
#login-section h1 { font-size: 25px; font-weight: 620; letter-spacing: -.8px; line-height: 1.25; margin: 0 0 11px; }
#login-section .intro { margin: 0; color: #758088; font-size: 14px; line-height: 1.65; }
#login-section .intro strong { display: inline-block; font-weight: 500; color: #35424b; overflow-wrap: anywhere; max-width: 100%; }
#login-section form { margin-top: 30px; text-align: left; }
#login-section label, #login-section legend { display: block; font-size: 13px; font-weight: 550; margin: 0 0 9px; color: #35414a; }
#login-section input { font: inherit; font-size: 15px; width: 100%; height: 49px; border: 1px solid #d4dce1; border-radius: 9px; background: #fff; padding: 0 14px; color: #27323a; outline: none; transition: border-color .15s, box-shadow .15s; }
#login-section input::placeholder { color: #9ba4ab; }
#login-section input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px #196c6312; }
#login-section button { font: inherit; cursor: pointer; }
#login-section button:focus-visible { outline: 3px solid #a0c9c1; outline-offset: 4px; }
#login-section .primary { width: 100%; min-height: 48px; border: 1px solid var(--accent); border-radius: 9px; background: var(--accent); color: #fff; font-size: 14px; font-weight: 550; display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 18px; transition: background .15s; }
#login-section .primary svg { width: 18px; height: 18px; }
#login-section .primary:hover:not(:disabled) { background: #125b53; }
#login-section .primary:disabled { background: #85aaa4; border-color: #85aaa4; cursor: not-allowed; }
#login-section .form-note { color: #889199; font-size: 12px; text-align: center; margin: 17px 0 0; line-height: 1.5; }
#login-section .access-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 23px 0 0; font-size: 12px; line-height: 1.5; color: #869098; }
#login-section .access-note svg { width: 15px; height: 15px; flex: 0 0 auto; }
#login-section .text-button { display: inline-flex; align-items: center; justify-content: center; padding: 4px 2px; min-height: 28px; border: none; background: transparent; color: var(--accent); font-size: 12px; font-weight: 550; border-radius: 4px; }
#login-section .text-button:hover:not(:disabled) { text-decoration: underline; text-underline-offset: 3px; }
#login-section .text-button:disabled { color: #8b959a; cursor: not-allowed; }
#login-section #change-email { margin-top: 5px; }
#login-section #code-form { margin-top: 23px; }
#login-section fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
#login-section .code-inputs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
#login-section .code-digit { text-align: center; height: 56px; min-width: 0; padding: 0; border-radius: 9px; font-size: 24px; font-weight: 550; font-variant-numeric: tabular-nums; caret-color: var(--accent); }
#login-section .code-digit.has-value { background: #f7faf9; border-color: #b8cec9; }
#login-section .code-digit:focus { background: #fff; border-color: var(--accent); }
#login-section .resend-row { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 5px; margin-top: 19px; color: #859098; font-size: 12px; }
#login-section .feedback { font-size: 12px; color: #78858b; line-height: 1.5; margin: 11px 0 0; }
#login-section .feedback:empty { display: none; }
#login-section .intro { display:block; }
#login-section input { margin:0; }
#login-section input:focus-visible { outline:none; }
#login-section button:disabled { opacity:1; }
#login-section .feedback.error { color:var(--error); }
#login-section #hosted-login { margin-top:12px; }
#login-section #login-form { max-width:none; }
#login-section #auth0-login { margin-top:26px; }
@media(max-width:480px) {
 body:not(.signed-in) > main { padding:40px 20px; }
 #login-section .login-brand { width:190px; height:39px; margin-bottom:25px; }
 #login-section .login-card { padding:30px 24px 26px; border-radius:17px; }
 #login-section h1 { font-size:23px; }
 #login-section .code-inputs { gap:7px; }
 #login-section .code-digit { height:51px; font-size:22px; }
}
@media(max-width:360px) { #login-section .login-card { padding:28px 18px; } #login-section .code-inputs { gap:5px; } }
@media(prefers-reduced-motion:reduce) { #login-section * { transition:none!important; } }
