/* Rande ID DEV — desktop em paridade visual com mobile RDS 2.2.
   Esta folha só cria composição espacial, nunca substitui tokens/cor da UI móvel. */
.desktop-register-heading,.desktop-register-subtitle{display:none}
@media (min-width:900px) {
  html,body{height:100%;background:#0B0B0C!important;color:#F5F7FA!important;overflow:hidden!important}
  body{font-family:var(--v-ui,Onest,sans-serif)!important}
  #app:not(.is-booting){
    width:100%;height:100dvh!important;min-height:0!important;
    display:grid!important;place-items:center!important;
    overflow:hidden!important;background:#0B0B0C!important;
  }
  #app>.shell{
    display:block!important;position:relative!important;
    width:min(1080px,calc(100vw - 48px))!important;
    max-width:1080px!important;height:min(656px,calc(100dvh - 48px))!important;
    min-height:0!important;margin:auto!important;padding:0!important;
    background:#151618!important;border:1px solid #333942!important;
    border-radius:10px!important;box-shadow:0 24px 70px rgba(0,0,0,.32);
    overflow:hidden!important;isolation:isolate!important;
  }
  #app .shell>.vertice-auth-aside{display:none!important}
  #app .shell>.auth-card{
    display:grid!important;grid-template-columns:minmax(0,42%) minmax(0,58%)!important;
    grid-template-rows:minmax(0,1fr) auto!important;
    align-items:stretch!important;justify-content:normal!important;
    height:100%!important;min-height:0!important;max-height:none!important;
    width:100%!important;max-width:none!important;margin:0!important;padding:0!important;
    background:#151618!important;overflow:hidden!important;isolation:isolate!important;
  }
  #app .auth-card>.screen-head{
    grid-column:1!important;grid-row:1 / 3!important;
    display:flex!important;flex-direction:column!important;align-items:flex-start!important;
    justify-content:center!important;position:relative!important;inset:auto!important;
    width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
    max-height:none!important;box-sizing:border-box!important;
    margin:0!important;padding:44px clamp(28px,4vw,56px)!important;
    background:#111316!important;border:0!important;border-right:1px solid #2A3037!important;
    overflow:hidden!important;z-index:3!important;
  }
  #app .auth-card>.screen-head::before{
    content:'';position:absolute;left:clamp(28px,4vw,56px);right:clamp(28px,4vw,56px);
    top:72px;height:1px;background:linear-gradient(90deg,#343B44,transparent);pointer-events:none;
  }
  #app .auth-card .screen-head>.topline{
    position:absolute!important;left:clamp(28px,4vw,56px);right:clamp(28px,4vw,56px);
    top:26px!important;width:auto!important;min-height:40px!important;
    display:flex!important;justify-content:flex-start!important;align-items:center!important;
    gap:8px!important;transform:none!important;animation:none!important;
  }
  #app .auth-card .topline>.brand{
    margin:0!important;color:#F5F7FA!important;
    font:650 19px/1.2 var(--v-display,Syne,sans-serif)!important;letter-spacing:-.055em!important;
  }
  #app .auth-card>.screen-head>.brand{
    position:absolute!important;left:clamp(28px,4vw,56px);top:34px;
    color:#F5F7FA!important;
    font:650 19px/1.2 var(--v-display,Syne,sans-serif)!important;
  }
  #app .auth-card .topline>.back{
    display:grid!important;place-items:center!important;position:static!important;
    width:38px!important;height:38px!important;min-width:38px!important;
    margin:0!important;transform:none!important;color:#C0CAD6!important;
    border:0!important;border-radius:8px!important;
  }
  #app .auth-card .topline>.back:hover{background:#232A32!important}
  #app .auth-card .screen-head .heading{
    display:block!important;width:100%!important;max-width:330px!important;
    margin:0!important;padding:0!important;text-align:left!important;
  }
  #app .auth-card .screen-head .heading h1{
    font:650 clamp(29px,3vw,40px)/1.12 var(--v-display,Syne,sans-serif)!important;
    color:#F5F7FA!important;letter-spacing:-.055em!important;text-wrap:balance;
  }
  #app .auth-card .screen-head .heading p{
    max-width:320px;margin:18px 0 0!important;
    color:#AEBAC8!important;font:450 14px/1.7 var(--v-ui,Onest,sans-serif)!important;
  }
  #app .auth-card.screen-register .screen-head .progress.progress-continuous{
    position:absolute!important;top:100px;left:clamp(28px,4vw,56px);right:clamp(28px,4vw,56px);
    width:auto!important;margin:0!important;height:5px!important;background:#333942!important;
  }
  #app .auth-card .desktop-register-heading{display:none}
  #app .auth-card.screen-register .desktop-register-heading{
    display:block!important;max-width:330px!important;margin:0!important;color:#F5F7FA!important;
    font:650 clamp(28px,3vw,39px)/1.17 var(--v-display,Syne,sans-serif)!important;
    letter-spacing:-.05em!important;text-align:left!important;
  }
  #app .auth-card.screen-register .desktop-register-subtitle{
    display:block!important;max-width:320px;margin:16px 0 0!important;color:#ADB8C6!important;
    font:450 14px/1.7 var(--v-ui,Onest,sans-serif)!important;
  }
  #app .auth-card>.screen-body,
  #app .auth-card>.screen-body.form,
  #app .auth-card>.screen-body.registration-layout {
    box-sizing:border-box!important;
    display:flex!important;flex-direction:column!important;
    justify-content:safe center!important;align-items:stretch!important;
    grid-column:2!important;grid-row:1!important;
    position:relative!important;width:100%!important;min-width:0!important;
    height:100%!important;min-height:0!important;max-height:none!important;
    margin:0!important;padding:34px clamp(26px,4.8vw,56px) 12px!important;
    background:#151618!important;overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior:contain!important;scrollbar-width:thin!important;
    scrollbar-color:#3A424C transparent!important;
    flex:initial!important;z-index:1!important;
  }
  #app .auth-card>.screen-body .field-label{
    position:static!important;display:block!important;width:auto!important;height:auto!important;
    padding:0!important;overflow:visible!important;clip:auto!important;white-space:normal!important;
  }
  #app .auth-card>.screen-body.form{gap:13px!important}
  /* A escolha de cadastro tinha padding lateral de 2px vindo do mobile.
     O desktop precisa usar exatamente o mesmo recuo dos outros formulários. */
  #app .auth-card.screen-signup-choice>.screen-body.signup-options{
    padding:32px clamp(26px,4.8vw,56px)!important;
    gap:14px!important;
    align-items:stretch!important;justify-content:safe center!important;
    box-sizing:border-box!important;
  }
  #app .auth-card.screen-signup-choice .signup-option{
    width:100%!important;min-height:78px!important;
    padding:16px 18px!important;gap:14px!important;
    border-radius:10px!important;
  }
  #app .auth-card.screen-signup-choice .signup-option>span{min-width:0}
  #app .auth-card.screen-signup-choice .signup-option small{
    line-height:1.45!important;
  }
  #app .auth-card.screen-login>.screen-body.login-form{
    padding:34px clamp(26px,4.8vw,56px) 12px!important;
    overflow-x:hidden!important;overflow-y:auto!important;min-height:0!important;
  }
  #app .auth-card .login-fields{display:flex;flex-direction:column;gap:14px}
  #app .auth-card .login-form{flex:initial!important}
  #app .auth-card .field-inner{
    min-height:48px!important;height:51px!important;background:#1D2127!important;
    border:1px solid #3A414A!important;border-radius:8px!important;color:#A9B7C7!important;
  }
  #app .auth-card .field-inner:focus-within{
    background:#242A32!important;border-color:#98AABD!important;
    box-shadow:0 0 0 2px rgba(214,227,240,.08)!important;
  }
  #app .auth-card .field-inner input,#app .auth-card .field-inner select{
    color:#F5F7FA!important;font-size:16px!important;background:transparent!important;
  }
  #app .auth-card .login-methods{background:#1A1D22!important;border-color:#3B434C!important}
  #app .auth-card .account-list,#app .auth-card .empty,
  #app .auth-card .signup-option{background:#1A1D22!important;border-color:#363E47!important}
  #app .auth-card .signup-option:hover,#app .auth-card .account-row:hover{background:#252B33!important}
  #app .auth-card .section-label,#app .auth-card .field-label{color:#C3CDD7!important;font-size:12px!important}
  #app .auth-card>.bottom-actions{
    box-sizing:border-box!important;grid-column:2!important;grid-row:2!important;
    position:relative!important;display:flex!important;flex:none!important;
    width:100%!important;min-width:0!important;margin:0!important;
    padding:15px clamp(26px,4.8vw,56px) 32px!important;
    justify-content:flex-end!important;align-items:center!important;
    border:0!important;background:#151618!important;
    z-index:3!important;gap:12px!important;
  }
  #app .auth-card>.bottom-actions>.btn{flex:0 1 auto!important;min-width:182px!important}
  #app .auth-card>.bottom-actions>.text-button{flex:none!important}
  #app .auth-card>.bottom-actions.login-actions{
    display:grid!important;grid-template-columns:1fr auto!important;gap:10px 14px!important;
  }
  #app .auth-card>.bottom-actions.login-actions>.btn{grid-column:2;grid-row:1;justify-self:end;width:220px!important}
  #app .auth-card>.bottom-actions.login-actions>.google-button{
    grid-column:1;grid-row:1;min-width:0!important;width:100%!important;
    background:#222830!important;border-color:#444C58!important;color:#F5F7FA!important;
  }
  #app .auth-card>.bottom-actions.login-actions>.login-signup{
    grid-column:1/-1;grid-row:2;margin:1px 0 0!important;justify-content:flex-end!important;
    color:#ADB7C3!important;
  }
  #app .auth-card .btn,.auth-card .signup-option{border-radius:8px!important}
  #app .auth-card .btn.primary{
    background:#DDE8F0!important;border:1px solid #E9F0F7!important;
    color:#111820!important;box-shadow:none!important;
  }
  #app .auth-card .btn.primary:hover{background:#F5F8FA!important}
  #app .auth-card .btn.outline{background:#242B33!important;color:#F5F7FA!important;border-color:#49515A!important}
  #app .auth-card>.screen-body.registration-layout{
    overflow:hidden!important;justify-content:flex-start!important;
    padding:0 clamp(26px,4.8vw,56px) 0!important;gap:0!important;
  }
  #app .auth-card .registration-scroll{
    flex:1 1 auto!important;min-height:0!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    justify-content:safe center!important;
    padding:32px 0 16px!important;
  }
  /* O título de cada etapa é apresentado apenas na coluna fixa esquerda. */
  #app .auth-card .registration-scroll>.heading{
    display:none!important;
  }
  #app .auth-card .registration-scroll>.heading h1{
    font-size:22px!important;line-height:1.25!important;
  }
  #app .auth-card .registration-consent{flex:none!important}
  #app .auth-card .auth-slide-ghost{
    background:#151618!important;overflow:hidden!important;
    max-width:58%!important;pointer-events:none!important;
  }
  #app .shell>.foot{display:none!important}
  /* Cabeçalho imutável espacialmente: texto e barra mudam sem deslizar. */
  #app .auth-card>.screen-head>.heading,
  #app .auth-card>.screen-head>.desktop-register-heading,
  #app .auth-card>.screen-head>.desktop-register-subtitle{
    display:none!important;
  }
  #app .auth-card>.screen-head>.desktop-live-copy{
    display:flex!important;flex-direction:column;justify-content:center;
    width:100%!important;max-width:335px!important;
    height:170px!important;min-height:170px!important;
    margin:0!important;padding:0!important;align-self:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;position:relative!important;z-index:3!important;
  }
  #app .desktop-live-title{
    margin:0!important;color:#F5F7FA!important;
    font:650 clamp(29px,3vw,40px)/1.12 var(--v-display,Syne,sans-serif)!important;
    letter-spacing:-.055em!important;overflow-wrap:normal;
    text-wrap:balance;
  }
  #app .desktop-live-description{
    margin:16px 0 0!important;max-width:320px!important;color:#ADB8C6!important;
    font:450 14px/1.7 var(--v-ui,Onest,sans-serif)!important;
  }
  #app .desktop-live-description[hidden]{display:none!important}
  #app .auth-card>.screen-head .progress.desktop-fixed-progress{
    display:block!important;
    position:absolute!important;top:100px!important;
    left:clamp(28px,4vw,56px)!important;right:clamp(28px,4vw,56px)!important;
    width:auto!important;margin:0!important;height:5px!important;
    transform-origin:left center;z-index:4!important;
  }
  /* O cartão fica no lugar. Apenas body/rodapé deslizam na área direita.
     O segundo cartão é transparente, recortado somente à coluna de conteúdo. */
  #app .shell>.auth-card.desktop-swipe-out,
  #app .shell>.auth-card.desktop-swipe-in{
    position:absolute!important;inset:0!important;
    width:100%!important;height:100%!important;
    max-width:none!important;max-height:none!important;
    margin:0!important;padding:0!important;
    overflow:hidden!important;box-sizing:border-box!important;
    transform:none!important;animation:none!important;
    contain:layout paint;
  }
  #app .shell>.auth-card.desktop-swipe-out{
    z-index:1!important;background:#151618!important;
  }
  #app .shell>.auth-card.desktop-swipe-out>.screen-head{z-index:5!important}
  #app .shell>.auth-card.desktop-swipe-out>.screen-body,
  #app .shell>.auth-card.desktop-swipe-out>.bottom-actions{
    pointer-events:none!important;will-change:transform;
  }
  #app .shell>.auth-card.desktop-swipe-in{
    z-index:2!important;background:transparent!important;
    clip-path:inset(0 0 0 42%)!important;pointer-events:none!important;
  }
  #app .shell>.auth-card.desktop-swipe-in>.screen-head{visibility:hidden!important}
  #app .shell>.auth-card.desktop-swipe-in>.screen-body,
  #app .shell>.auth-card.desktop-swipe-in>.bottom-actions{
    backface-visibility:hidden;will-change:transform;
  }
  #app .shell.is-slide-under,#app .shell.is-slide-in{
    position:relative!important;inset:auto!important;
    width:min(1080px,calc(100vw - 48px))!important;max-width:1080px!important;
    height:min(656px,calc(100dvh - 48px))!important;
    animation:none!important;transform:none!important;
  }
}
@media (min-width:900px) and (max-height:680px) {
 #app .auth-card>.screen-head{padding-top:40px!important;padding-bottom:32px!important}
 #app .auth-card>.screen-body{padding-top:17px!important}
 #app .auth-card>.bottom-actions{padding-bottom:18px!important}
}
@media (prefers-reduced-motion:reduce){
 #app .auth-card .auth-slide-ghost{animation:none!important}
}