/* Rande ID 2026-10-29 — UX correction / fixed rails, scroll only content */
#app .shell{height:100dvh;min-height:0}
#app .shell .auth-card{display:flex;flex-direction:column;justify-content:flex-start!important;min-height:0;overflow:hidden;padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:0}
#app .auth-card>.screen-head{flex:0 0 auto;min-height:0;max-height:22dvh;position:relative;z-index:2;padding:2px 0 13px;border-bottom:1px solid #282D34;background:#0B0B0C}
#app .auth-card .screen-head .topline{min-height:43px;display:flex;align-items:center;justify-content:center;position:relative}
#app .auth-card .screen-head .topline>.back{position:absolute;left:0;top:50%;transform:translateY(-50%);margin:0;min-height:42px}
#app .auth-card .screen-head .topline>.brand{margin:0 auto}
#app .auth-card .brand{font-family:var(--v-display);font-size:18px!important;font-weight:650;line-height:1.15;letter-spacing:-.05em;white-space:nowrap}
#app .auth-card .brand .brand-accent{font:inherit!important;letter-spacing:inherit!important;color:#A5BFE2;margin-left:0}
#app .auth-card .screen-head .progress{margin:12px 0 0;display:flex;gap:6px;width:100%}
#app .auth-card .screen-head .progress span{flex:1;height:3px;border-radius:4px;background:#2D333A}
#app .auth-card .screen-head .progress span.on{background:#ABB9CB}
#app .auth-card>.screen-body{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex:1 1 auto!important;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#353B43 transparent;margin:0!important;padding:25px 2px 18px;gap:14px}
#app .auth-card>.screen-body.registration-layout{display:flex;flex-direction:column;overflow:hidden;gap:0;padding:0!important}
#app .registration-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#303841 transparent;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:14px;padding:27px 2px 22px}
#app .registration-scroll>.heading{margin:0 0 11px!important;flex:none}
#app .auth-card>.screen-body>.heading{margin:0 0 12px!important;flex:none}
#app .auth-card .heading{text-align:center}
#app .auth-card .heading h1{font-size:clamp(25px,6vw,31px);line-height:1.13}
#app .auth-card .heading p{margin:5px 0 0}
#app .auth-card>.bottom-actions{flex:0 0 auto;position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:0!important;padding:14px 1px 16px!important;border-top:1px solid #272D34;background:#0B0B0C}
#app .auth-card>.bottom-actions .btn{flex:1;min-width:0;min-height:49px}
#app .auth-card>.bottom-actions .text-button{flex:0 0 auto}
#app .auth-card>.screen-body .bottom-actions{display:none}
#app .auth-card.screen-register .field-label,
#app .auth-card.screen-login .field-label,
#app .auth-card.screen-mfa .field-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#app .auth-card .field{position:relative;display:grid;gap:4px}
#app .auth-card .field-inner,
#app .auth-card .field-inner:focus-within,
#app .auth-card.screen-login .field-inner:focus-within{
  border:1px solid #444A52!important;background:#1C1F24!important;box-shadow:none!important;border-radius:8px!important
}
#app .auth-card .field-inner:focus-within{border-color:#ACB2BB!important;background:#20242A!important}
#app .auth-card input:focus-visible,
#app .auth-card select:focus-visible{outline:0!important;outline-offset:0!important}
#app .auth-card .field-inner:has(input[aria-invalid="true"]){border-color:#B36E73!important}
#app .auth-card .rande-field-help[hidden],
#app .auth-card .cpf-feedback[hidden],
#app .auth-card .privacy-error[hidden]{display:none!important}
#app .auth-card .rande-field-help{font-size:11px;color:#E79AA3;line-height:1.4;margin:5px 2px 0;min-height:0}
#app .auth-card .rande-field-help.is-error{color:#E79AA3}
#app .auth-card .cpf-feedback{font-size:11px;line-height:1.4;justify-content:flex-start;text-align:left;margin:1px 0}
#app .auth-card .cpf-feedback.is-good{color:#A4D6B8}
#app .auth-card .cpf-private-field:has(+ .cpf-feedback:not([hidden])) .rande-field-help{display:none!important}
#app .auth-card .privacy-accept{display:flex;gap:13px;align-items:flex-start;margin:9px 0 0;padding:17px 16px;background:#181C21;border:1px solid #383F48;border-radius:8px;text-align:left;color:#D6DFEA;font:500 12px/1.55 var(--v-ui);cursor:pointer}
#app .auth-card .privacy-accept input[type=checkbox]{flex:0 0 auto;display:block;appearance:auto;width:19px;height:19px;margin:0;accent-color:#DDE8F0;cursor:pointer}
#app .auth-card .privacy-accept:focus-within{border-color:#AAB4C0}
#app .auth-card .privacy-accept span{flex:1}
#app .auth-card .privacy-error{font-size:11px;color:#ECA2AB;line-height:1.4;margin:0 2px}
#app .auth-card .footnote{display:none}
#app .auth-card .password-feedback{display:none!important}
#app .auth-card .otp-note{display:none}
#app .auth-card .otp-delivery-state{display:none}
#app .auth-card .login-hint{display:none}
#app .auth-card .login-form{gap:12px!important}
#app .auth-card .login-form .heading{margin-bottom:4px}
#app .auth-card .login-form .login-signup{margin-top:5px}
#app .auth-card .login-methods{flex:none}
#app .auth-card .google-divider{margin:2px 0}
#app .auth-card .registration-scroll .google-button{flex:0 0 auto}
#app .auth-card .registration-scroll .photo-control{flex:0 0 auto}
#app .auth-card .otp-assistance{flex:none}
#app .auth-card>.bottom-actions .btn.primary{background:#DDE8F0;color:#101820;border-color:#E9F0F7}
#app .shell>.foot{flex:0 0 auto;min-height:36px!important;padding-bottom:2px;margin:0}
#app .shell>.foot .foot-link{display:none}
#app .auth-card.screen-account{overflow-y:auto}
#app .auth-card.screen-account>.screen-body{flex:0 0 auto!important}
@media(max-height:600px){
 #app .shell .auth-card{padding-top:calc(3px + env(safe-area-inset-top))}
 #app .auth-card .screen-head .topline{min-height:38px}
 #app .registration-scroll{padding-top:15px}
 #app .auth-card>.bottom-actions{padding:7px 0 9px!important}
 #app .shell>.foot{min-height:28px!important}
}
@media(min-width:920px) and (min-height:620px){
 #app .shell{grid-template-columns:minmax(0,1fr) 470px}
 #app .shell .auth-card{grid-column:2;grid-row:1}
 #app .shell>.foot{grid-column:2;grid-row:2}
}
@media(prefers-reduced-motion:reduce){#app .auth-card>.screen-body,#app .registration-scroll{scroll-behavior:auto}}

/* Selects have no placeholder; retain an explicit contextual label. */
#app .auth-card.screen-register .field:has(select)>.field-label{
  position:static!important;width:auto!important;height:auto!important;overflow:visible!important;
  clip:auto!important;white-space:normal!important;display:block!important;margin-bottom:4px;
  font-size:11px;color:#AFBAC7
}