.account-nav {
  position: absolute;
  z-index: 3;
  top: 16px;
  right: 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: calc(100% - 24px);
  font: 12px/1.5 system-ui, sans-serif;
}

.account-nav form { margin: 0; }
a.account-nav__button { text-decoration: none; }
.account-nav__name { min-width: 0; color: #ffffff80; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-nav__button {
  flex-shrink: 0;
  white-space: nowrap;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: #ffffff80;
  font: 700 12px/1.5 Orbitron, system-ui, sans-serif;
  letter-spacing: .12em;
  cursor: pointer;
  transition: color .2s, background .2s, border-color .2s;
}
.account-nav__button:hover { color: #fff; background: #ffffff0d; border-color: #ffffff1a; }

/* Окно входа и регистрации в стиле главной: шрифт Manrope, поля со скруглением, кнопка-капсула.
   data-auth-style="window" — полоса арта «Окно в сон» сверху, белая кнопка; "sky" — арт «Граница сна» на всё окно, синеватая кнопка.
   Страницы подтверждения email (.auth-action-card) берут общий вид без арта. Подробности — docs/AUTH_DIALOG.md */
@font-face { font-family: Manrope; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/manrope-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Manrope; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/manrope-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
.auth-dialog {
  --auth-ease: cubic-bezier(.22, 1, .36, 1);
  position: relative;
  width: min(440px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 32px;
  overflow: auto;
  border: 0;
  border-radius: 24px;
  color: #fff;
  background: #070b16;
  box-shadow: 0 0 0 1px #ffffff1a, 0 32px 80px -24px #000;
  font: 400 15px/22px Manrope, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.auth-dialog[open] { animation: auth-enter .5s var(--auth-ease); }
.auth-dialog::backdrop { background: #00000080; backdrop-filter: blur(8px); }
.auth-dialog [hidden] { display: none !important; }
.auth-close {
  position: absolute;
  z-index: 3;
  top: 16px;
  right: 16px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #ffffff0f;
  color: #ffffffb3;
  cursor: pointer;
  transition: background-color .3s var(--auth-ease), color .3s var(--auth-ease);
}
.auth-close:hover { background: #ffffff1f; color: #fff; }
.auth-heading { margin-bottom: 24px; }
.auth-heading h2 { margin: 0; font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: -.02em; }
.auth-brand { display: none; font: 900 13px/16px Orbitron, sans-serif; letter-spacing: .16em; }
.auth-brand b { color: #38bdf8; font-weight: 900; }
.auth-art, .auth-sky, .auth-icon { display: none; }
.auth-form { display: grid; gap: 8px; }
/* Поля плотно, а согласие, политика и кнопка отделены прежним воздухом (8 + 8 px) */
.auth-form > [data-registration-legal], .auth-form > .auth-privacy-note { margin-top: 8px; }
/* Согласие и политика — одна группа: между ними 4 px */
.auth-form > [data-registration-legal]:not([hidden]) + .auth-privacy-note { margin-top: -4px; }
.auth-legal-check { display: flex; gap: 10px; align-items: flex-start; color: #ffffffa6; font-size: 13px; line-height: 19px; word-spacing: .1em; }
.auth-legal-check input { flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: #0ea5e9; }
.auth-privacy-note { margin: 0; font-size: 13px; line-height: 18px; text-align: center; }
.auth-legal-check a, .auth-privacy-note a { color: #9fd4f5; text-underline-offset: 3px; }
/* Политика конфиденциальности приглушена, чтобы не спорить с кнопкой */
.auth-privacy-note a { color: #ffffff80; text-decoration-color: #ffffff40; transition: color .3s var(--auth-ease); }
.auth-privacy-note a:hover { color: #fff; }
.auth-field label { display: block; margin-bottom: 4px; color: #ffffffb3; font-size: 13px; line-height: 18px; font-weight: 600; }
.auth-input { position: relative; }
.auth-field input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #ffffff1f;
  border-radius: 12px;
  background: #ffffff08;
  color: #fff;
  font: 500 15px/22px Manrope, system-ui, sans-serif;
  transition: border-color .3s var(--auth-ease), box-shadow .3s var(--auth-ease), background-color .3s var(--auth-ease);
}
.auth-field input::placeholder { color: #ffffff59; }
.auth-field input:focus { outline: 0; border-color: #7dd3fc99; background: #ffffff14; box-shadow: 0 0 0 4px #0ea5e926; }
.auth-field input:-webkit-autofill { -webkit-text-fill-color: #fff; box-shadow: 0 0 0 1000px #121826 inset; }
.auth-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.auth-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  margin-top: 8px;
  padding: 0 24px;
  border: 0;
  border-radius: 9999px;
  background: #fff;
  color: #000;
  font: 600 16px/24px Manrope, system-ui, sans-serif;
  cursor: pointer;
  box-shadow: 0 16px 40px -16px #ffffff59;
  transition: transform .3s var(--auth-ease), background-color .3s var(--auth-ease), box-shadow .3s var(--auth-ease);
}
.auth-submit:hover { transform: translateY(-1px); }
.auth-submit:active { transform: scale(.98); }
.auth-submit-crystal { width: 16px; height: 16px; flex: none; }
.auth-dialog button:disabled { opacity: .5; cursor: wait; }
.auth-dialog[aria-busy="true"] .auth-submit::before { content: ""; width: 14px; height: 14px; border: 2px solid #0003; border-top-color: #000; border-radius: 50%; animation: auth-spin .7s linear infinite; }
.auth-message { margin: 0 0 20px; padding: 12px 16px; border-radius: 12px; background: #ef444426; color: #fca5a5; font-size: 14px; line-height: 20px; }
.auth-switch { margin: 20px 0 0; text-align: center; color: #ffffff8c; font-size: 14px; line-height: 20px; }
.auth-switch button { padding: 0; border: 0; background: transparent; color: #fff; font: 700 14px/20px Manrope, system-ui, sans-serif; cursor: pointer; }
.auth-switch button:hover { text-decoration: underline; text-underline-offset: 3px; }
button:focus-visible { outline: 2px solid var(--dream-accent); outline-offset: 4px; }
@keyframes auth-enter { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes auth-spin { to { transform: rotate(360deg); } }
.auth-field-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.auth-help { padding: 0; border: 0; background: none; color: #9fd4f5; font: 600 13px/18px Manrope, system-ui, sans-serif; cursor: pointer; }
.auth-help:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.auth-sent-copy { margin: 0 0 24px; color: #ffffffa6; }
.auth-sent-copy strong { display: block; margin-top: 6px; color: #fff; font-weight: 600; overflow-wrap: anywhere; }

/* Вход и регистрация без видимого заголовка: режим понятен по полям и кнопке, название окна остаётся для экранных читалок.
   Восстановление пароля, повторное письмо и «Подтвердите email» показывают заголовок. */
.auth-dialog[data-auth-mode="login"] .auth-heading, .auth-dialog[data-auth-mode="register"] .auth-heading { margin-bottom: 0; }
.auth-dialog[data-auth-mode="login"] .auth-heading h2, .auth-dialog[data-auth-mode="register"] .auth-heading h2 { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Стиль «Окно»: полоса арта с логотипом сверху, плотная тёмная панель, белая кнопка (кристалл — при регистрации) */
.auth-dialog[data-auth-style] { padding: 0; }
.auth-dialog[data-auth-style="window"] .auth-art { display: block; position: relative; height: 132px; }
.auth-dialog[data-auth-style="window"] .auth-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; -webkit-mask-image: linear-gradient(#000 45%, transparent); mask-image: linear-gradient(#000 45%, transparent); }
.auth-dialog[data-auth-style="window"] .auth-art .auth-brand { display: block; position: absolute; left: 50%; top: 24px; transform: translateX(-50%); white-space: nowrap; text-shadow: 0 2px 12px #0008; }
.auth-dialog[data-auth-style="window"] .auth-body { position: relative; margin-top: -28px; padding: 0 32px 32px; }
.auth-dialog[data-auth-style="window"][data-auth-mode="login"] .auth-body, .auth-dialog[data-auth-style="window"][data-auth-mode="register"] .auth-body { margin-top: -16px; padding-top: 0; }
.auth-dialog[data-auth-style="window"] .auth-close { background: #00000059; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }

/* Стиль «Небо»: арт маяка на всё окно уходит в тёмно-синее звёздное небо, форма и заголовок по центру, поля-капсулы с иконками */
.auth-dialog[data-auth-style="sky"] { isolation: isolate; box-shadow: 0 0 0 1px #ffffff14, 0 32px 80px -24px #000, 0 0 80px -30px #0ea5e9; }
.auth-dialog[data-auth-style="sky"] .auth-sky { display: block; position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; }
.auth-dialog[data-auth-style="sky"]::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(#070b1600 0%, #070b1600 16%, #070b16cc 30%, #070b16 46%); }
.auth-dialog[data-auth-style="sky"]::after { content: ""; position: absolute; left: 15%; right: 15%; top: 0; height: 1px; background: linear-gradient(90deg, transparent, #0ea5e9, #8b5cf6, transparent); box-shadow: 0 0 16px 1px #0ea5e999; }
.auth-dialog[data-auth-style="sky"] .auth-body { padding: 148px 32px 32px; }
.auth-dialog[data-auth-style="sky"][data-auth-mode="login"] .auth-body, .auth-dialog[data-auth-style="sky"][data-auth-mode="register"] .auth-body { padding-top: 136px; }
/* Логотип по центру сверху, как в стиле «Окно» */
.auth-dialog[data-auth-style="sky"] .auth-brand--sky { display: block; position: absolute; left: 50%; top: 24px; transform: translateX(-50%); white-space: nowrap; text-shadow: 0 2px 12px #000; }
.auth-dialog[data-auth-style="sky"] .auth-heading h2 { text-shadow: 0 2px 16px #070b16; }
.auth-dialog[data-auth-style="sky"] .auth-close { background: #00000059; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.auth-dialog[data-auth-style="sky"] .auth-field label { padding-left: 16px; }
.auth-dialog[data-auth-style="sky"] .auth-field-heading { padding-right: 16px; }
.auth-dialog[data-auth-style="sky"] .auth-icon { display: block; position: absolute; left: 16px; top: 50%; width: 18px; height: 18px; color: #ffffff73; transform: translateY(-50%); pointer-events: none; }
.auth-dialog[data-auth-style="sky"] .auth-field input { padding-left: 44px; border-radius: 9999px; background: #070b16b3; }
.auth-dialog[data-auth-style="sky"] .auth-legal-check { padding: 0 8px; }
.auth-dialog[data-auth-style="sky"] .auth-submit { background: #1e3a6e; color: #fff; box-shadow: 0 0 0 1px #7dd3fc59, 0 0 32px -6px #0ea5e9b3; }
.auth-dialog[data-auth-style="sky"] .auth-submit:hover { background: #28498a; }
.auth-dialog[data-auth-style="sky"] .auth-submit-crystal { display: none; }
.auth-dialog[data-auth-style="sky"][aria-busy="true"] .auth-submit::before { border-color: #ffffff4d; border-top-color: #fff; }

@media (max-width: 480px) {
  .account-nav { right: 12px; }
  .auth-dialog { width: calc(100% - 24px); padding: 28px 20px 24px; }
  .auth-dialog[data-auth-style] { padding: 0; }
  .auth-dialog[data-auth-style="window"] .auth-body { padding: 0 20px 24px; }
  .auth-dialog[data-auth-style="sky"] .auth-body { padding: 128px 20px 24px; }
  .auth-dialog[data-auth-style="sky"][data-auth-mode="login"] .auth-body, .auth-dialog[data-auth-style="sky"][data-auth-mode="register"] .auth-body { padding-top: 116px; }
  .auth-heading h2 { font-size: 28px; line-height: 34px; }
  .auth-field input { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .auth-dialog[open], .auth-dialog[aria-busy="true"] .auth-submit::before { animation: none; }
  .auth-submit { transition: none; }
}
.auth-action-page { min-height: 100svh; height: auto; overflow: auto; padding: 24px 16px; display: grid; place-items: center; }
.auth-action-card { position: relative; margin: 0; max-height: none; width: min(448px, 100%); }
.auth-action-page { grid-template-rows: 1fr auto; }
.auth-action-footer { width: 100%; }
.auth-heading h1 { font-size: 27px; line-height: 1.2; letter-spacing: -.025em; margin: 0; }
.auth-action-copy { color: #ffffffa6; margin: 0 0 24px; overflow-wrap: anywhere; }
.auth-action-copy strong { color: #fff; }
a.auth-submit { text-decoration: none; }
.auth-action-link { color: var(--dream-accent); }
.auth-form .errorlist { color: #f87171; margin: 8px 0 0; padding: 0; list-style: none; font-size: 13px; }

.login-prompt { box-sizing: border-box; width: min(360px, calc(100% - 32px)); max-height: calc(100svh - 32px); padding: 30px 26px 18px; overflow: auto; border: 1px solid #294050; border-radius: 22px; background: linear-gradient(150deg, #14232e, #0c151d 65%); color: #edf5fa; text-align: center; font: 14px/1.55 system-ui, sans-serif; box-shadow: 0 24px 80px #0009; }
.login-prompt::backdrop { background: #0009; backdrop-filter: blur(4px); }
.login-prompt__close { position: absolute; top: 10px; right: 12px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #9cabb7; font: 25px/1 system-ui, sans-serif; cursor: pointer; }
.login-prompt__icon { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 18px; border: 1px solid #81c8ec36; border-radius: 18px; background: #81c8ec12; color: #9bd8f5; }
.login-prompt__icon svg { width: 29px; height: 29px; }
.login-prompt__icon svg[hidden] { display: none; }
.login-prompt h2 { margin: 0 0 12px; font-size: 21px; line-height: 1.25; font-weight: 650; letter-spacing: -.02em; }
.login-prompt h2:focus { outline: none; }
.login-prompt p { margin: 0; color: #bdccd7; }
.login-prompt .login-prompt__hint { margin-top: 8px; color: #7f96a6; font-size: 12px; }
.login-prompt__submit { display: flex; justify-content: center; align-items: center; gap: 12px; width: 100%; margin-top: 24px; padding: 12px 14px; border: 1px solid #bce9ff80; border-radius: 12px; background: #9bd8f5; color: #0a1a24; font: 650 14px/1.4 system-ui, sans-serif; cursor: pointer; }
.login-prompt__submit:hover { background: #b7e7fc; }
.login-prompt__later { width: 100%; margin-top: 6px; padding: 10px 4px; border: 0; border-radius: 10px; background: transparent; color: #94aab9; font: inherit; font-size: 12px; cursor: pointer; }
.login-prompt__later:hover, .login-prompt__close:hover { background: #ffffff08; color: #edf5fa; }
.login-prompt button:focus-visible { outline: 2px solid #9bd8f5; outline-offset: 3px; }
.login-prompt .login-prompt__status { margin-top: 12px; color: #a3d8f0; font-size: 12px; }
.login-prompt__url { box-sizing: border-box; width: 100%; margin-top: 10px; padding: 10px; border: 1px solid #365263; border-radius: 8px; background: #091119; color: #d5e8f4; font: 12px/1.5 system-ui, sans-serif; }
