.auth-page { min-height: 75vh; padding: clamp(26px, 4vw, 64px) 0 80px; background: #f6f5f1; }
.auth-shell { max-width: 1120px; display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); padding: 0; overflow: hidden; border: 1px solid #e1ded7; border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgb(6 50 99 / 7%); }
.auth-story { position: relative; isolation: isolate; display: flex; min-height: 690px; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 34px 42px 30px; color: #fff; background: #062b52; }
.auth-story::before { position: absolute; z-index: -1; inset: 0; content: ''; background: radial-gradient(ellipse at 20% 36%, rgb(210 172 103 / 12%), transparent 60%); }
.auth-story__back { min-height: 36px; display: flex; align-items: center; justify-content: space-between; color: #c4d2e0; font-size: .76rem; }
.auth-story__back .roz-icon { width: 18px; height: 18px; }
.auth-story__back:hover { color: #e5c48a; }
.auth-story__visual { position: relative; display: grid; place-items: center; height: 265px; margin: 8px 0; }
.auth-story__visual img { position: relative; z-index: 1; width: 154px; height: 170px; object-fit: contain; animation: auth-logo-float 7s ease-in-out infinite; }
.auth-story__orbit { position: absolute; width: 240px; height: 240px; border: 1px solid rgb(210 172 103 / 24%); border-radius: 50%; }
.auth-story__orbit--one { transform: rotate(-30deg) scaleX(1.2); }
.auth-story__orbit--two { width: 200px; height: 200px; border-color: rgb(210 172 103 / 12%); transform: rotate(30deg) scaleX(1.3); }
.auth-story__spark { position: absolute; inset: 36px 18% auto auto; width: 8px; height: 8px; border: 1px solid #d2ac67; transform: rotate(45deg); }
.auth-story__copy > span { color: #d2ac67; font-size: .74rem; }
.auth-story__copy h2 { margin: 12px 0 18px; color: #fffaf1; font-size: clamp(2rem, 3vw, 2.9rem); font-weight: 500; line-height: 1.5; }
.auth-story__copy p { max-width: 34ch; margin: 0; color: #b6c9d9; font-size: .86rem; line-height: 2; }
.auth-story__benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 30px 0 0; padding: 23px 0 0; border-top: 1px solid rgb(210 172 103 / 24%); list-style: none; }
.auth-story__benefits li { display: grid; justify-items: start; gap: 10px; color: #c1d0dd; font-size: .62rem; }
.auth-story__benefits .roz-icon { width: 22px; height: 22px; color: #d2ac67; }
.auth-card { align-self: center; padding: clamp(28px, 4.5vw, 64px); }
.auth-card__header { margin-bottom: 26px; }
.auth-card__symbol { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 22px; border: 1px solid #ded8cc; border-radius: 14px; color: var(--color-gold-dark); background: #faf8f3; }
.auth-card__header > span:not(.auth-card__symbol) { color: var(--color-gold-dark); font-size: .74rem; font-weight: 600; }
.auth-card__header h1 { margin: 7px 0 10px; color: var(--color-ink); font-size: clamp(1.55rem, 2.4vw, 2rem); line-height: 1.5; font-weight: 600; }
.auth-card__header p { margin: 0; color: var(--color-muted); font-size: .83rem; line-height: 1.9; }
.auth-methods { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin-bottom: 25px; padding: 5px; border: 1px solid #e5e5e0; border-radius: 12px; background: #f6f6f3; }
.auth-methods a { min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 8px; color: var(--color-muted); font-size: .76rem; transition: color .2s, background .2s; }
.auth-methods a.is-active { color: var(--color-ink); background: #fff; box-shadow: 0 2px 7px rgb(6 50 99 / 7%); }
.auth-methods .roz-icon { width: 17px; height: 17px; }
.auth-basket-note { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 22px; padding: 13px; border-radius: 10px; color: #536b7c; background: #f0f5f8; font-size: .75rem; line-height: 1.9; }
.auth-basket-note .roz-icon { width: 18px; height: 18px; margin-top: 3px; }
.auth-form { display: grid; gap: 19px; }
.auth-form .ui-field { gap: 8px; }
.auth-form .ui-field label { font-size: .8rem; font-weight: 500; }
.auth-form .ui-field input { min-height: 53px; border: 1px solid #d9dfe3; border-radius: 10px; background: #fff; font-size: .95rem; }
.auth-form .ui-field input:focus { border-color: var(--color-gold-dark); box-shadow: 0 0 0 3px rgb(210 172 103 / 15%); }
.auth-form input[type='tel'], .auth-form input[type='email'], .auth-form input[autocomplete='one-time-code'] { direction: ltr; text-align: left; }
.auth-form input[autocomplete='one-time-code'] { text-align: center; font-size: 1.45rem; letter-spacing: .4em; }
.auth-form .ui-field--error input { border-color: var(--color-danger); }
.auth-form .ui-field--error small { color: var(--color-danger); }
.auth-form .ui-button { min-height: 53px; margin-top: 4px; border-radius: 10px; color: #fff; background: var(--color-ink); box-shadow: none; font-size: .86rem; }
.auth-form .ui-button:hover { background: #0b4279; }
.auth-form__help { display: flex; justify-content: flex-end; margin-top: -7px; color: var(--color-gold-dark); font-size: .73rem; }
.auth-form__help a { min-height: 32px; display: inline-flex; align-items: center; }
.auth-form__grid, .auth-form__passwords { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.auth-form__wide { grid-column: 1 / -1; }
.auth-choice { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding-top: 4px; }
.auth-choice > span { width: 100%; color: var(--color-muted); font-size: .8rem; }
.auth-choice label { display: inline-flex; align-items: center; gap: 7px; font-size: .8rem; }
.auth-choice input { accent-color: var(--color-ink); }
.auth-choice small { width: 100%; color: var(--color-danger); }
.auth-mobile-summary { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 13px 16px; border: 1px solid #e5dfd2; border-radius: 10px; background: #faf8f3; color: var(--color-muted); font-size: .78rem; }
.auth-mobile-summary strong { color: var(--color-ink); font-size: .9rem; }
.auth-countdown { margin: -5px 0 0; color: var(--color-gold-dark); font-size: .75rem; }
.auth-countdown--expired { color: var(--color-danger); }
.auth-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px 10px; margin-top: 25px; color: var(--color-muted); font-size: .77rem; }
.auth-links a { color: var(--color-gold-dark); text-decoration: underline; text-underline-offset: 5px; }
.auth-security { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 30px 0 0; padding-top: 22px; border-top: 1px solid #ecece7; color: #708090; font-size: .65rem; }
.auth-security .roz-icon { width: 14px; height: 14px; }
.auth-card .recaptcha-field { overflow-x: auto; }
.auth-methods a:focus-visible, .auth-links a:focus-visible, .auth-form__help a:focus-visible { outline: 2px solid var(--color-gold-dark); outline-offset: 3px; }
@keyframes auth-logo-float { 0%, 100% { transform: translateY(3px); } 50% { transform: translateY(-7px); } }
@media (max-width: 850px) {
    .auth-shell { max-width: 580px; grid-template-columns: 1fr; }
    .auth-story { min-height: 0; padding: 22px 28px; }
    .auth-story__visual { position: absolute; inset: 38px auto auto 25px; width: 100px; height: 110px; margin: 0; opacity: .85; }
    .auth-story__visual img { width: 86px; height: 95px; }
    .auth-story__orbit { width: 130px; height: 130px; }
    .auth-story__orbit--two { width: 100px; height: 100px; }
    .auth-story__spark, .auth-story__benefits, .auth-story__copy p { display: none; }
    .auth-story__copy { max-width: calc(100% - 110px); margin-top: 24px; }
    .auth-story__copy > span { font-size: .65rem; }
    .auth-story__copy h2 { margin: 9px 0 0; font-size: 1.5rem; line-height: 1.5; }
    .auth-card { width: 100%; padding: 30px; }
    .auth-card__symbol { display: none; }
}
@media (max-width: 480px) {
    .auth-page { padding: 18px 0 38px; }
    .auth-shell { width: calc(100% - 28px); border-radius: 16px; }
    .auth-card { padding: 27px 23px; }
    .auth-card__header h1 { font-size: 1.45rem; }
    .auth-story { padding: 20px 23px; }
    .auth-story__copy { margin-top: 16px; }
    .auth-story__copy h2 { font-size: 1.3rem; }
    .auth-story__visual { inset-block-start: 32px; }
    .auth-form__grid, .auth-form__passwords { grid-template-columns: 1fr; }
    .auth-form__wide { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
    .auth-story__visual img { animation: none; }
    .auth-page a, .auth-page input, .auth-page .ui-button { transition: none; }
}