/* Native sign-in content stays readable before the sculpted model is ready. */
.card-slot{position:relative;width:min(100%,384px);flex:none}
.signin-card{--card-rule:rgba(82,92,109,.2);--card-fill:var(--surface);width:100%;padding:0;border:0;border-radius:16px;background:none;box-shadow:none;backdrop-filter:none;isolation:isolate;transform:perspective(1500px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg));transition:transform .5s cubic-bezier(.2,.7,.2,1)}
[data-theme=dark] .signin-card{--card-rule:rgba(211,215,222,.25)}
.signin-card:focus-within{transform:perspective(1500px) rotateX(0deg) rotateY(0deg)}
.signin-card .card-content{z-index:1;padding:28px 24px 24px;border:1px solid var(--card-rule);border-radius:16px;background:var(--card-fill);box-shadow:0 24px 48px -24px var(--shadow),inset 0 1px 0 var(--glass-rim);text-align:center}
.signin-card .card-content>div{position:relative}
.signin-card h2{font-family:var(--font);font-size:1.5rem;font-weight:600;line-height:1.35;letter-spacing:-.025em;margin:0 0 6px;color:var(--text)}
.signin-card .description{font-size:.875rem;line-height:1.6;text-align:center;max-width:100%;color:var(--secondary);margin:0 auto 27px}
.signin-card .microsoft-sso{position:relative;min-height:54px;font-weight:600}
.signin-card .microsoft-sso img{width:20px;height:20px}
.signin-card .account-note{text-align:center;font-size:.75rem;line-height:1.6;color:var(--secondary);margin:16px 0 0}
.signin-card #preview-content{min-height:177px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.signin-card #preview-content .description{margin-bottom:23px}
.signin-card .secondary-button{margin:0}
.card-3d-ready .signin-card{transform-origin:0 0;transition:none;will-change:transform}
.card-3d-ready .signin-card .card-content{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.card-3d-ready .signin-card .microsoft-sso,.card-3d-ready .signin-card .microsoft-sso:hover{background:transparent;box-shadow:none;border-color:transparent;transform:none}
[data-motion=paused] .signin-card *{animation-play-state:paused!important}
@media(min-width:900px){.card-slot{min-width:340px}}
@media(max-width:899px){.signin-card .card-content{padding:25px 24px 22px}}
@media(prefers-reduced-motion:reduce){.signin-card,.signin-card *{animation:none!important;transition:none!important}:root:not(.card-3d-ready) .signin-card{transform:none!important}}