.auth-modal {
    --auth-wine: var(--landing-wine, #8e304b);
    --auth-paper: var(--landing-paper, #faf8f4);
    --auth-ink: var(--landing-ink, #27231f);
    --auth-muted: var(--landing-muted, #6e6760);
    --auth-line: var(--landing-line, #dfdad2);
    box-sizing: border-box;
    width: min(900px, calc(100vw - 48px));
    max-width: none;
    max-height: calc(100dvh - 48px);
    padding: 0;
    border: 1px solid #ffffff30;
    border-radius: 12px;
    background: var(--auth-paper);
    color: var(--auth-ink);
    font: 14px/1.5 Arial, Helvetica, sans-serif;
    box-shadow: 0 32px 110px #24141b55;
    overflow: auto;
    overscroll-behavior: contain;
}
.auth-modal[open] { position: fixed; inset: 0; margin: auto; z-index: 100; }
.auth-modal::backdrop { background: #21161bb8; backdrop-filter: blur(5px); }
.auth-modal [hidden] { display: none !important; }
.auth-modal *, .auth-modal *::before, .auth-modal *::after { box-sizing: border-box; }
.auth-modal-open, .auth-page-open { overflow: hidden; }
.auth-page-open::before { content: ''; position: fixed; inset: 0; z-index: 90; background: #21161bb8; backdrop-filter: blur(5px); }
.auth-shell { display: grid; grid-template-columns: 0.78fr 1.22fr; min-height: 530px; }
.auth-story { position: relative; isolation: isolate; overflow: hidden; min-width: 0; background: #411d2b; color: #fff; }
.auth-story > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 59% center; opacity: .65; }
.auth-story::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #35152355 0%, #35152322 28%, #351523ee 100%); }
.auth-story-content { display: flex; flex-direction: column; justify-content: space-between; gap: 90px; height: 100%; padding: 36px 32px; }
.auth-brand { display: flex; align-items: center; gap: 12px; font-size: 18px; font-weight: 700; letter-spacing: 3px; line-height: 1; }
.auth-brand small { display: block; margin-top: 7px; font-size: 7px; font-weight: 400; letter-spacing: 2.5px; }
.auth-brand-mark { display: grid; place-content: center; width: 40px; height: 40px; border: 1px solid #ffffff60; border-radius: 50%; font: italic 33px/1 Georgia, serif; letter-spacing: -3px; padding-right: 3px; }
.auth-story .auth-story-eyebrow { margin: 0 0 20px; color: #edc8d4; font-size: 8px; font-weight: 700; letter-spacing: 2px; }
.auth-story .auth-story-title { margin: 0; font: 400 42px/1.12 Georgia, 'Times New Roman', serif; letter-spacing: -1.5px; }
.auth-story-title em { color: #e7b4c3; }
.auth-story .auth-story-note { margin: 22px 0 0; color: #e1cdd4; font-size: 12px; line-height: 1.8; }
.auth-story-line { display: block; width: 38px; height: 1px; margin-top: 28px; background: #e7b4c3; }
.auth-main { position: relative; min-width: 0; padding: 40px 42px 30px; }
.auth-close { position: absolute; top: 17px; right: 17px; display: grid; place-items: center; width: 34px; height: 34px; padding: 8px; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--auth-muted); cursor: pointer; }
.auth-close svg { width: 18px; height: 18px; }
.auth-close:hover { border-color: var(--auth-line); background: #f0ece5; color: var(--auth-wine); }
.auth-modal a:focus-visible, .auth-modal button:focus-visible, .auth-modal summary:focus-visible { outline: 2px solid var(--auth-wine); outline-offset: 4px; }
.auth-panel .auth-eyebrow { margin: 0 0 16px; color: var(--auth-wine); font-size: 9px; font-weight: 700; letter-spacing: 1.7px; }
.landing-page .auth-title { margin: 0; color: var(--auth-ink); font: 400 35px/1.12 Georgia, 'Times New Roman', serif; letter-spacing: -1.1px; }
.auth-title:focus { outline: none; }
.auth-panel .auth-description { margin: 14px 0 26px; color: var(--auth-muted); font-size: 13px; line-height: 1.7; }
.auth-field { margin-bottom: 17px; }
.auth-field > label { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 600; }
.auth-field input:not([type="radio"]) { display: block; width: 100%; min-width: 0; min-height: 48px; padding: 12px 14px; border: 1px solid var(--auth-line); border-radius: 5px; background: #fffdfb; color: var(--auth-ink); font: 14px/1.4 Arial, Helvetica, sans-serif; transition: border-color .15s, box-shadow .15s; }
.auth-field input::placeholder { color: #9b9189; opacity: 1; }
.auth-field input:focus { outline: none; border-color: var(--auth-wine); box-shadow: 0 0 0 3px #8e304b12; }
.auth-field input:-webkit-autofill { -webkit-box-shadow: 0 0 0 50px #fffdfb inset; -webkit-text-fill-color: var(--auth-ink); }
.auth-field small { display: block; margin-top: 7px; color: var(--auth-muted); font-size: 10px; line-height: 1.6; }
.auth-phone-row { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: end; gap: 10px; }
.auth-phone-row > div { min-width: 0; }
.auth-phone-row label { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 600; }
.auth-phone-row .auth-phone-country input { padding-inline: 10px; }
.auth-phone-row input:disabled { background: #f2eee8; color: var(--auth-muted); }
.auth-identity-row { grid-template-columns: minmax(0, 1fr); }
.auth-identity-row.auth-phone-row-with-country { grid-template-columns: 96px minmax(0, 1fr); }
.auth-password { position: relative; }
.auth-password input { padding-right: 48px !important; }
.auth-password button { position: absolute; top: 5px; right: 5px; display: grid; place-items: center; width: 38px; height: 38px; padding: 9px; border: 0; border-radius: 4px; background: transparent; color: #8e7f79; cursor: pointer; }
.auth-password button:hover { background: #f5efea; color: var(--auth-wine); }
.auth-password svg { width: 20px; height: 20px; }
.auth-eye-slash { display: none; }
.auth-password button[aria-pressed="true"] .auth-eye-slash { display: block; }
.auth-modal a { color: var(--auth-wine); font-weight: 600; text-decoration: none; }
.auth-modal a:hover { text-decoration: underline; text-underline-offset: 3px; }
.auth-recovery { margin: -3px 0 24px; text-align: right; font-size: 11px; }
.auth-submit { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; min-height: 49px; padding: 13px 18px; border: 1px solid var(--auth-wine); border-radius: 5px; background: var(--auth-wine); color: #fff; font: 600 13px/1.4 Arial, Helvetica, sans-serif; cursor: pointer; transition: background .15s; }
.auth-submit > .app-icon { width: 18px; height: 18px; }
.auth-submit:hover { background: #74253d; }
.auth-submit:disabled { opacity: .65; cursor: wait; }
.auth-panel .auth-switch { margin: 22px 0 0; text-align: center; color: var(--auth-muted); font-size: 12px; }
.auth-switch a { margin-left: 4px; }
.auth-panel .auth-footnote { margin: 26px 0 0; padding-top: 17px; border-top: 1px solid var(--auth-line); text-align: center; color: #9b9189; font-size: 9px; letter-spacing: .2px; }
.auth-channel { min-width: 0; padding: 0; margin: 0 0 20px; border: 0; }
.auth-channel legend { margin-bottom: 9px; padding: 0; color: var(--auth-muted); font-size: 11px; }
.auth-channel-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.auth-channel-options label { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 43px; padding: 10px; border: 1px solid var(--auth-line); border-radius: 5px; background: #fffdfb; cursor: pointer; color: var(--auth-muted); font-size: 12px; font-weight: 600; }
.auth-channel-options label:has(input:checked) { color: var(--auth-wine); border-color: var(--auth-wine); background: #f6eaf0; }
.auth-channel-options label:has(input:focus-visible) { outline: 2px solid var(--auth-wine); outline-offset: 3px; }
.auth-channel-options input { width: 15px; height: 15px; margin: 0; accent-color: var(--auth-wine); }
.auth-optional { margin: -2px 0 20px; color: var(--auth-muted); font-size: 10px; }
.auth-optional summary { cursor: pointer; }
.auth-optional summary span { color: #9b9189; }
.auth-optional .auth-field { margin: 13px 0 0; }
.auth-notice { margin: 0 0 18px; padding: 12px 14px; border: 1px solid #ddc3cc; border-radius: 5px; background: #f4e9ee; color: #77314a; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.auth-notice-success, .auth-notice-info { color: #635448; background: #f2eee6; border-color: #ded5c7; }
.auth-panel .auth-help { margin: -3px 0 22px; color: var(--auth-muted); font-size: 11px; line-height: 1.7; }
.auth-field .auth-code { min-height: 58px; text-align: center; font-size: 24px; letter-spacing: 8px; }
.auth-main .auth-loading { margin: 0 0 18px; font-size: 11px; color: var(--auth-wine); }
#auth-content[aria-busy="true"] { opacity: .6; }
@media (max-width: 700px) {
    .auth-modal { width: calc(100vw - 24px); max-width: 480px; max-height: calc(100dvh - 24px); }
    .auth-shell { grid-template-columns: 1fr; min-height: 0; }
    .auth-story { display: none; }
    .auth-main { padding: 32px 26px 24px; }
    .auth-panel .auth-eyebrow { margin-bottom: 17px; padding-right: 32px; }
    .landing-page .auth-title { max-width: 310px; font-size: 32px; }
    .auth-panel .auth-description { margin-bottom: 23px; }
    .auth-panel[data-auth-view="register"] .auth-description { margin: 10px 0 18px; }
    .auth-panel[data-auth-view="register"] .auth-field { margin-bottom: 13px; }
    .auth-panel[data-auth-view="register"] .auth-field input { min-height: 44px; padding-block: 10px; }
    .auth-panel[data-auth-view="register"] .auth-channel { margin-bottom: 16px; }
    .auth-panel[data-auth-view="register"] .auth-footnote { display: none; }
}
@media (max-width: 360px) {
    .auth-modal { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
    .auth-main { padding: 30px 20px 22px; }
    .landing-page .auth-title { font-size: 29px; }
    .auth-channel-options { gap: 8px; }
    .auth-channel-options label { padding: 9px 5px; font-size: 11px; }
    .auth-phone-row:not(.auth-identity-row), .auth-identity-row.auth-phone-row-with-country { grid-template-columns: 86px minmax(0, 1fr); gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .auth-modal * { transition: none !important; scroll-behavior: auto !important; }
}