html {
  scrollbar-gutter: stable;
}

.xiatre-account {
  position: relative;
  flex-shrink: 0;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
}

.xiatre-account-loading {
  display: inline-block;
  width: 4.5rem;
  height: 1.6rem;
  border-radius: 4px;
  background: rgb(255 255 255 / 0.06);
  animation: xiatre-auth-pulse 1.2s ease-in-out infinite;
}

@keyframes xiatre-auth-pulse {
  0%,
  100% {
    opacity: 0.45;
  }
  50% {
    opacity: 0.9;
  }
}

.xiatre-account-signin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.85rem;
  padding: 0 0.75rem;
  border: 1px solid rgb(255 255 255 / 0.14);
  border-radius: 4px;
  background: rgb(255 255 255 / 0.04);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.xiatre-account-signin:hover {
  border-color: rgb(255 255 255 / 0.28);
  background: rgb(255 255 255 / 0.08);
}

.xiatre-account-chip {
  position: relative;
}

.xiatre-account-trigger {
  display: inline-flex;
  align-items: center;
  min-height: 1.85rem;
  padding: 0 0.65rem;
  border: 1px solid rgb(255 255 255 / 0.14);
  border-radius: 4px;
  background: rgb(255 255 255 / 0.05);
  color: inherit;
  cursor: pointer;
}

.xiatre-account-trigger:hover {
  border-color: rgb(255 255 255 / 0.26);
}

.xiatre-account-trigger--icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  width: 36px;
  padding: 0;
}

.xiatre-account-trigger--icon .xiatre-account-icon {
  display: block;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  opacity: 0.9;
  pointer-events: none;
}

.xiatre-account-profile {
  margin: 0 0 0.45rem;
  line-height: 1.45;
  color: #e2e8f0;
  font-weight: 600;
}

.xiatre-account-menu {
  position: absolute;
  top: calc(100% + 0.35rem);
  right: 0;
  z-index: 80;
  min-width: 14rem;
  padding: 0.75rem 0.85rem;
  border-radius: 0.75rem;
  box-shadow: 0 12px 32px rgb(0 0 0 / 0.45);
}

.xiatre-account-menu[hidden] {
  display: none !important;
}

.xiatre-account-menu:not([hidden]) {
  animation: xiatre-account-menu-in 160ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes xiatre-account-menu-in {
  from {
    opacity: 0;
    transform: translateY(-0.3rem) scale(0.98);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .xiatre-account-menu:not([hidden]) {
    animation: none;
  }
}

.xiatre-account-menu--house {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  box-sizing: border-box;
  width: min(19rem, calc(100vw - 1.25rem));
  min-width: min(17rem, calc(100vw - 1.25rem));
  padding: 0.75rem;
  border: 1px solid rgb(255 255 255 / 0.13);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 88% 4%, rgb(129 140 248 / 0.09), transparent 38%),
    rgb(10 11 15 / 0.96);
  box-shadow:
    0 24px 64px -20px rgb(0 0 0 / 0.86),
    0 8px 24px -16px rgb(0 0 0 / 0.72),
    inset 0 1px 0 rgb(255 255 255 / 0.06);
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  transform-origin: top right;
  font-family: var(--font-sans, "LXGW WenKai", "PingFang SC", "Microsoft YaHei UI", system-ui, sans-serif);
  font-size: 0.82rem;
  letter-spacing: 0.02em;
  line-height: 1.3;
}

.xiatre-account-menu.card--xire {
  box-shadow: 0 0 48px 16px rgb(var(--ac) / 0.1);
}

.xiatre-account-menu.card--xire[data-xire-theme="indigo"] {
  --ac: 129 140 248;
  --ng50: 248 250 252;
  --ng400: 148 163 184;
  --ng700: 51 65 85;
  --ng950: 2 6 23;
  border: 1px solid rgb(var(--ng700) / 0.9);
  background: rgb(var(--ng950) / 0.92);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xire[data-xire-theme="ink"] {
  --ac: 28 27 25;
  --ng50: 28 25 23;
  --ng400: 120 113 108;
  --ng700: 214 211 209;
  --ng950: 250 250 250;
  border: 1px solid rgb(var(--ng700) / 0.9);
  background: rgb(var(--ng950));
  color: rgb(var(--ng50));
}

@media (min-width: 768px) {
  .xiatre-account-menu.card--xire[data-xire-theme="ink"] {
    --ac: 168 165 174;
    --ng50: 250 250 249;
    --ng400: 168 162 158;
    --ng700: 68 64 60;
    --ng950: 28 27 25;
    border: 1px solid rgb(var(--ng700) / 0.9);
    background: rgb(var(--ng950) / 0.94);
    color: rgb(var(--ng50));
  }
}

.xiatre-account-menu.card--xire[data-xire-theme="green"] {
  --ac: 52 211 153;
  --ng50: 250 250 250;
  --ng400: 161 161 170;
  --ng700: 6 95 70;
  --ng950: 2 44 34;
  border: 1px solid rgb(var(--ng700) / 0.75);
  background: rgb(var(--ng950) / 0.94);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xisa {
  box-shadow: 0 0 48px 16px rgb(var(--ac) / 0.08);
}

.xiatre-account-menu.card--xisa[data-xisa-theme="black"] {
  --ac: 245 245 245;
  --ng50: 245 245 245;
  --ng400: 138 138 138;
  --ng700: 31 31 31;
  --ng950: 10 10 10;
  border: 1px solid rgb(var(--ng700) / 0.95);
  background: rgb(var(--ng950) / 0.94);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xisa[data-xisa-theme="white"] {
  --ac: 10 10 10;
  --ng50: 10 10 10;
  --ng400: 106 106 106;
  --ng700: 214 214 214;
  --ng950: 245 245 245;
  border: 1px solid rgb(var(--ng700) / 0.85);
  background: rgb(var(--ng950) / 0.96);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xisa[data-xisa-theme="gray"] {
  --ac: 245 245 245;
  --ng50: 245 245 245;
  --ng400: 160 160 160;
  --ng700: 63 63 63;
  --ng950: 46 46 46;
  border: 1px solid rgb(var(--ng700) / 0.9);
  background: rgb(var(--ng950) / 0.94);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xivo {
  backdrop-filter: blur(10px);
  box-shadow:
    inset 0 1px 0 0 rgb(255 255 255 / 0.04),
    0 0 48px 16px rgb(var(--ac) / 0.09);
}

.xiatre-account-menu.card--xivo[data-xivo-theme="warm"] {
  --ac: 224 138 60;
  --ng50: 250 247 242;
  --ng400: 183 168 147;
  --ng700: 118 98 78;
  --ng950: 26 21 17;
  border: 1px solid rgb(var(--ng700) / 0.75);
  background: rgb(var(--ng950) / 0.94);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xivo[data-xivo-theme="olive"] {
  --ac: 56 148 108;
  --ng50: 244 248 246;
  --ng400: 124 144 134;
  --ng700: 72 88 80;
  --ng950: 12 22 18;
  border: 1px solid rgb(var(--ng700) / 0.75);
  background: rgb(var(--ng950) / 0.94);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xivo[data-xivo-theme="plum"] {
  --ac: 192 132 252;
  --ng50: 250 245 255;
  --ng400: 167 139 186;
  --ng700: 88 56 120;
  --ng950: 28 18 38;
  border: 1px solid rgb(var(--ng700) / 0.75);
  background: rgb(var(--ng950) / 0.94);
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xire .xiatre-account-profile,
.xiatre-account-menu.card--xivo .xiatre-account-profile,
.xiatre-account-menu.card--xisa .xiatre-account-profile,
.xiatre-account-menu.card--xire .xiatre-account-wallet,
.xiatre-account-menu.card--xivo .xiatre-account-wallet,
.xiatre-account-menu.card--xisa .xiatre-account-wallet {
  color: rgb(var(--ng50));
}

.xiatre-account-menu.card--xire .xiatre-account-hint,
.xiatre-account-menu.card--xivo .xiatre-account-hint,
.xiatre-account-menu.card--xisa .xiatre-account-hint {
  color: rgb(var(--ng400));
}

.xiatre-account-menu.card--xire .xiatre-account-signout,
.xiatre-account-menu.card--xivo .xiatre-account-signout,
.xiatre-account-menu.card--xisa .xiatre-account-signout {
  border-color: rgb(var(--ng700) / 0.65);
}

.xiatre-account-menu.card--xire .xiatre-account-signout:hover,
.xiatre-account-menu.card--xivo .xiatre-account-signout:hover,
.xiatre-account-menu.card--xisa .xiatre-account-signout:hover {
  background: rgb(var(--ac) / 0.12);
  border-color: rgb(var(--ac) / 0.45);
}

.xiatre-account-wallet {
  margin: 0 0 0.35rem;
  line-height: 1.45;
  color: #e2e8f0;
}

.xiatre-account-header {
  display: grid;
  grid-template-columns: 2.55rem minmax(0, 1fr) 1.9rem;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  padding: 0.1rem;
}

.xiatre-account-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.55rem;
  height: 2.55rem;
  border: 1px solid rgb(255 255 255 / 0.12);
  border-radius: 0.8rem;
  background:
    radial-gradient(circle at 28% 18%, rgb(129 140 248 / 0.28), transparent 48%),
    linear-gradient(145deg, rgb(255 255 255 / 0.08), rgb(255 255 255 / 0.025));
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.09),
    0 8px 22px -14px rgb(129 140 248 / 0.7);
  color: var(--house-fg, #f1f5f9);
}

.xiatre-account-avatar .xiatre-account-icon {
  width: 1rem;
  height: 1rem;
  opacity: 0.92;
}

.xiatre-account-identity {
  min-width: 0;
}

.xiatre-account-kicker {
  display: block;
  margin-bottom: 0.18rem;
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.56rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  line-height: 1;
  color: var(--house-muted, #8a8e96);
}

.xiatre-account-menu--house .xiatre-account-profile {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.025em;
  line-height: 1.25;
  color: var(--house-fg, #f1f5f9);
}

.xiatre-account-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0;
  border: 0;
  border-radius: 0.58rem;
  background: transparent;
  color: var(--house-muted, #8a8e96);
  cursor: pointer;
  transition: background-color 140ms ease, color 140ms ease;
}

.xiatre-account-close:hover {
  background: rgb(255 255 255 / 0.07);
  color: var(--house-fg, #f1f5f9);
}

.xiatre-account-close:focus-visible {
  outline: 2px solid rgb(255 255 255 / 0.18);
  outline-offset: 1px;
}

.xiatre-account-close .house-tool-icon {
  width: 0.88rem;
  height: 0.88rem;
  pointer-events: none;
}

.xiatre-account-credit {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.2rem;
  margin: 0 0 0.45rem;
  padding: 0.45rem 0.55rem 0.4rem;
  border: 1px solid rgb(255 255 255 / 0.1);
  border-radius: 0.5rem;
  background: rgb(255 255 255 / 0.035);
  box-sizing: border-box;
}

.xiatre-account-menu--house .xiatre-account-credit {
  margin: 0;
  gap: 0.5rem;
  padding: 0.78rem 0.85rem 0.72rem;
  border-color: rgb(255 255 255 / 0.105);
  border-radius: 0.72rem;
  background:
    linear-gradient(135deg, rgb(255 255 255 / 0.055), transparent 72%),
    rgb(255 255 255 / 0.022);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.035);
}

.xiatre-account-credit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.xiatre-account-credit-label {
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--house-muted, #8a8e96);
}

.xiatre-account-credit-value {
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.92rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--house-fg, #f1f5f9);
  line-height: 1;
  letter-spacing: 0.04em;
}

.xiatre-account-menu--house .xiatre-account-signout {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  width: 100%;
  min-height: 2.35rem;
  margin: 0;
  padding: 0 0.72rem;
  border: 1px solid transparent;
  border-radius: 0.68rem;
  background: transparent;
  color: var(--house-muted, #8a8e96);
  cursor: pointer;
  font-family: var(--font-sans, "LXGW WenKai", system-ui, sans-serif);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-align: left;
  transition:
    background-color 150ms ease,
    border-color 150ms ease,
    color 150ms ease;
}

.xiatre-account-menu--house .xiatre-account-signout:hover {
  border-color: rgb(248 113 113 / 0.14);
  background: rgb(248 113 113 / 0.065);
  color: rgb(252 165 165);
}

.xiatre-account-menu--house .xiatre-account-signout:focus-visible {
  outline: 2px solid rgb(255 255 255 / 0.18);
  outline-offset: 1px;
}

.xiatre-account-menu--house .xiatre-account-signout .house-tool-icon {
  display: block;
  width: 0.9rem;
  height: 0.9rem;
  flex-shrink: 0;
  pointer-events: none;
  opacity: 0.82;
}

.xiatre-account-hint {
  margin: 0 0 0.55rem;
  line-height: 1.4;
  color: #8a8e96;
  font-size: 0.68rem;
}

.xiatre-account-menu--house .xiatre-account-hint {
  margin: 0;
  color: var(--house-muted, #8a8e96);
  letter-spacing: 0.03em;
}

.xiatre-account-menu--house .xiatre-account-credit-value {
  font-size: 1.25rem;
  letter-spacing: 0.02em;
}

.xiatre-account-menu--house .xiatre-account-hint--name {
  margin: 0.25rem 0 0.38rem;
  font-size: 0.63rem;
  line-height: 1.35;
}

.xiatre-account-menu--house .xiatre-account-name-form {
  margin: 0;
}

.xiatre-account-signout {
  display: block;
  width: 100%;
  padding: 0.45rem 0.55rem;
  border: 1px solid rgb(255 255 255 / 0.1);
  border-radius: 4px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-align: left;
}

.xiatre-account-signout:hover {
  background: rgb(255 255 255 / 0.06);
}

.xiatre-account-hint--name {
  margin: 0 0 0.45rem;
}

.xiatre-account-name-form {
  display: flex;
  gap: 0.35rem;
  margin: 0 0 0.55rem;
}

.xiatre-account-name-input {
  flex: 1;
  min-width: 0;
  padding: 0.4rem 0.5rem;
  border: 1px solid rgb(255 255 255 / 0.14);
  border-radius: 4px;
  background: rgb(255 255 255 / 0.04);
  color: inherit;
  font: inherit;
}

.xiatre-account-name-input:focus {
  outline: none;
  border-color: rgb(255 255 255 / 0.28);
}

.xiatre-account-name-save {
  flex-shrink: 0;
  padding: 0.4rem 0.55rem;
  border: 1px solid rgb(255 255 255 / 0.14);
  border-radius: 4px;
  background: rgb(255 255 255 / 0.08);
  color: inherit;
  cursor: pointer;
  font: inherit;
}

.xiatre-account-name-save:hover {
  background: rgb(255 255 255 / 0.12);
}

.xiatre-account-name-save:disabled {
  opacity: 0.55;
  cursor: wait;
}

/* Sign-in page */
.signin-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 0;
  padding: 2rem 0 3rem;
}

.signin-shell .xiatre-login-card,
.signin-shell .signin-card {
  margin: 0;
}

.signin-shell--house .signin-card {
  max-width: 22rem;
  width: 100%;
}

.signin-shell h1,
.signin-shell .xiatre-login-title {
  margin: 0 0 0.35rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  letter-spacing: 0.28em;
  font-weight: 600;
  text-transform: uppercase;
  text-align: center;
}

.signin-shell .xiatre-login-card.card--xire .xiatre-login-title {
  margin: 0.55rem 0 0;
  min-height: 2.55rem;
  font-family: "LXGW WenKai", ui-serif, serif;
  font-size: clamp(1.15rem, 4vw, 1.3rem);
  letter-spacing: 0.02em;
  text-transform: none;
  line-height: 1.3;
}

.signin-shell .xiatre-login-card.card--xivo .xiatre-login-title {
  min-height: 0;
  margin: 0.45rem 0 0.35rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  text-transform: uppercase;
  line-height: 1.4;
  color: rgb(var(--ac) / 0.9);
}

.signin-shell .xiatre-login-card.card--xisa .xiatre-login-title {
  min-height: 0;
  margin: 0.45rem 0 0.35rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  text-transform: uppercase;
  line-height: 1.4;
  color: rgb(var(--ac) / 0.9);
}

.signin-shell .lead,
.signin-shell .xiatre-login-lead {
  margin: 0 0 1.5rem;
  color: #8a8e96;
  font-size: 0.92rem;
  line-height: 1.5;
  text-align: center;
}

.signin-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.65rem;
  min-height: 2.65rem;
  width: 100%;
}

.signin-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  width: 100%;
  box-sizing: border-box;
  min-height: 2.65rem;
  padding: 0 1rem;
  border-radius: 6px;
  border: 1px solid rgb(255 255 255 / 0.14);
  background: rgb(255 255 255 / 0.04);
  color: inherit;
  font: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.signin-btn:hover {
  background: rgb(255 255 255 / 0.08);
  border-color: rgb(255 255 255 / 0.24);
}

.signin-btn--apple {
  background: #f5f5f7;
  color: #111;
  border-color: #f5f5f7;
}

.signin-btn--apple:hover {
  background: #fff;
  border-color: #fff;
}

.xiatre-login-card.card--xisa[data-xisa-theme="white"] .signin-btn--apple,
.xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple {
  background: #111;
  color: #f5f5f7;
  border-color: #111;
}

.xiatre-login-card.card--xisa[data-xisa-theme="white"] .signin-btn--apple:hover,
.xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple:hover {
  background: #000;
  border-color: #000;
}

@media (min-width: 768px) {
  .xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple,
  .xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple:hover {
    background: #f5f5f7;
    color: #111;
    border-color: #f5f5f7;
  }

  .xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple:hover {
    background: #fff;
    border-color: #fff;
  }
}

html.xire-desktop-shell .xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple {
  background: #f5f5f7;
  color: #111;
  border-color: #f5f5f7;
}

html.xire-desktop-shell .xiatre-login-card.card--xire[data-xire-theme="ink"] .signin-btn--apple:hover {
  background: #fff;
  border-color: #fff;
}

.signin-note {
  margin-top: 1rem;
  color: #8a8e96;
  font-size: 0.78rem;
  line-height: 1.45;
}

.signin-back {
  display: inline-block;
  margin-top: 1.25rem;
  color: #8a8e96;
  font-size: 0.82rem;
}

.signin-back:hover {
  color: #e2e8f0;
}

.legal-page section {
  margin-top: 1.75rem;
  max-width: 42rem;
}

.legal-page h2 {
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 0.5rem;
}

.legal-page p,
.legal-page li {
  color: var(--house-muted, #8a8e96);
  line-height: 1.65;
  font-size: 0.95rem;
}

.legal-page ul {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.legal-page code {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.88em;
}

.signin-unconfigured {
  padding: 0.75rem 0.85rem;
  border: 1px solid rgb(251 191 36 / 0.25);
  border-radius: 6px;
  background: rgb(251 191 36 / 0.06);
  color: #fcd34d;
  font-size: 0.82rem;
  line-height: 1.45;
}

/* Overlay login gate (XIRE / XIVO / XISA) */
html.xiatre-auth-gated body {
  overflow: hidden;
}

.xiatre-login-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  background: transparent;
  pointer-events: none !important;
}

html.xiatre-auth-gated .xiatre-login-overlay,
html.xiatre-auth-gated #xiatre-login-overlay {
  pointer-events: auto !important;
}

.xiatre-login-overlay:has(.card--xire),
.xiatre-login-overlay:has(.card--xivo),
.xiatre-login-overlay:has(.card--xisa) {
  background: rgb(0 0 0 / 0.62) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

.xiatre-login-card {
  width: 100%;
  max-width: 22rem;
  padding: 1.75rem 1.5rem 1.5rem;
  border-radius: 1rem;
  color: #e2e8f0;
  pointer-events: auto;
}

.xiatre-login-card--house {
  border: 1px solid rgb(255 255 255 / 0.12);
  background: #0d1018;
  box-shadow: 0 24px 56px rgb(0 0 0 / 0.55);
}

.xiatre-login-card--house .xiatre-login-title {
  margin: 0.45rem 0 0.35rem;
  text-indent: 0.28em;
}

.xiatre-login-card--house .signin-product-mark img,
.xiatre-login-card--house .signin-product-mark svg {
  width: 2rem;
  height: 2rem;
  border-radius: 0.5rem;
}

.signin-product-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.1rem;
  height: 3.1rem;
  margin: 0 auto 0.15rem;
  color: rgb(var(--ac) / 0.92);
}

.signin-product-mark svg {
  width: 2rem;
  height: 2rem;
}

.xiatre-login-card.card--xire .xiatre-login-title {
  margin: 0.55rem 0 0;
  min-height: 2.55rem;
  font-family: "LXGW WenKai", ui-serif, serif;
  font-size: clamp(1.15rem, 4vw, 1.3rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.3;
  text-transform: none;
  text-align: center;
  color: rgb(var(--ac) / 0.9);
}

.xiatre-login-card.card--xivo .xiatre-login-title {
  min-height: 0;
  margin: 0.45rem 0 0.35rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  line-height: 1.4;
  text-transform: uppercase;
  text-align: center;
  color: rgb(var(--ac) / 0.9);
}

.xiatre-login-card.card--xisa .xiatre-login-title {
  min-height: 0;
  margin: 0.45rem 0 0.35rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  line-height: 1.4;
  text-transform: uppercase;
  text-align: center;
  color: rgb(var(--ac) / 0.9);
}

.xiatre-login-card.card--xivo .signin-product-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.1rem;
  height: 3.1rem;
  margin: 0 auto 0.15rem;
  color: rgb(var(--ac) / 0.92);
}

.xiatre-login-card.card--xivo .signin-product-mark svg {
  width: 2rem;
  height: 2rem;
  transform: translateX(-0.12rem);
}

.xiatre-login-card.card--xisa .signin-product-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.1rem;
  height: 3.1rem;
  margin: 0 auto 0.15rem;
  color: rgb(var(--ac) / 0.92);
}

.xiatre-login-card.card--xisa .signin-product-mark svg {
  width: 2rem;
  height: 2rem;
  transform: translateX(-0.12rem);
}

.xiatre-login-card.card--xivo .xiatre-account-loading,
.xiatre-login-card.card--xisa .xiatre-account-loading {
  display: none;
}

.xiatre-login-card.card--xisa:has(.signin-actions:empty) {
  padding: 1.35rem 1.5rem;
}

.xiatre-login-card.card--xisa:has(.signin-actions:empty) .xiatre-login-lead {
  margin-bottom: 0;
}

.xiatre-login-card.card--xivo .signin-actions:empty,
.xiatre-login-card.card--xisa .signin-actions:empty {
  min-height: 0;
  display: none;
}

.xiatre-login-card.card--xire .xiatre-login-lead,
.xiatre-login-card.card--xivo .xiatre-login-lead,
.xiatre-login-card.card--xisa .xiatre-login-lead {
  color: rgb(var(--ng400));
}

.xiatre-login-card.card--xire .xiatre-login-note,
.xiatre-login-card.card--xivo .xiatre-login-note,
.xiatre-login-card.card--xisa .xiatre-login-note,
.xiatre-login-card.card--xire .xiatre-login-back,
.xiatre-login-card.card--xivo .xiatre-login-back,
.xiatre-login-card.card--xisa .xiatre-login-back {
  color: rgb(var(--ng400));
}

.xiatre-login-card.card--xire .xiatre-login-back:hover,
.xiatre-login-card.card--xivo .xiatre-login-back:hover,
.xiatre-login-card.card--xisa .xiatre-login-back:hover {
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xire .xiatre-login-back,
.xiatre-login-card.card--xivo .xiatre-login-back,
.xiatre-login-card.card--xisa .xiatre-login-back {
  color: rgb(var(--ng400));
}

.xiatre-login-card.card--xivo .xiatre-login-back,
.xiatre-login-card.card--xivo .signin-back {
  display: inline-block;
  margin: 1rem 0 0;
  text-align: left;
}

.xiatre-login-card.card--xisa .xiatre-login-guest,
.xiatre-login-card.card--xisa .xiatre-login-back,
.xiatre-login-card.card--xisa .signin-back {
  display: block;
  width: fit-content;
  text-align: left;
}

.xiatre-login-card.card--xisa .xiatre-login-guest {
  margin: 0.85rem 0 0;
  padding: 0;
  min-height: 0;
  border: 0;
  background: none;
  font: 400 0.78rem / 1.4 inherit;
  color: rgb(var(--ng400));
  cursor: pointer;
}

.xiatre-login-card.card--xisa .xiatre-login-back,
.xiatre-login-card.card--xisa .signin-back {
  margin: 0.4rem 0 0;
}

.xiatre-login-card.card--xire {
  box-shadow: 0 0 72px 32px rgb(var(--ac) / 0.12);
}

.xiatre-login-card.card--xire[data-xire-theme="indigo"] {
  --ac: 129 140 248;
  --ng50: 248 250 252;
  --ng400: 148 163 184;
  --ng700: 51 65 85;
  --ng950: 2 6 23;
  border: 1px solid rgb(var(--ng700) / 0.9);
  background: rgb(var(--ng950) / 0.72);
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xire[data-xire-theme="ink"] {
  --ac: 28 27 25;
  --ng50: 28 25 23;
  --ng400: 120 113 108;
  --ng700: 214 211 209;
  --ng950: 250 250 250;
  border: 1px solid rgb(var(--ng700) / 0.9);
  background: rgb(var(--ng950));
  color: rgb(var(--ng50));
}

@media (min-width: 768px) {
  .xiatre-login-card.card--xire[data-xire-theme="ink"] {
    --ac: 168 165 174;
    --ng50: 250 250 249;
    --ng400: 168 162 158;
    --ng700: 68 64 60;
    --ng950: 28 27 25;
    border: 1px solid rgb(var(--ng700) / 0.9);
    background: rgb(var(--ng950) / 0.88);
    color: rgb(var(--ng50));
  }
}

.xiatre-login-card.card--xire[data-xire-theme="green"] {
  --ac: 52 211 153;
  --ng50: 250 250 250;
  --ng400: 161 161 170;
  --ng700: 6 95 70;
  --ng950: 2 44 34;
  border: 1px solid rgb(var(--ng700) / 0.75);
  background: rgb(var(--ng950) / 0.78);
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xisa {
  text-align: left;
  box-shadow: 0 0 72px 32px rgb(var(--ac) / 0.1) !important;
}

.xiatre-login-card.card--xisa[data-xisa-theme="black"] {
  --ac: 245 245 245;
  --ng50: 245 245 245;
  --ng400: 138 138 138;
  --ng700: 31 31 31;
  --ng950: 10 10 10;
  border: 1px solid rgb(31 31 31 / 0.95) !important;
  background: rgb(10 10 10 / 0.82) !important;
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xisa[data-xisa-theme="white"] {
  --ac: 10 10 10;
  --ng50: 10 10 10;
  --ng400: 106 106 106;
  --ng700: 214 214 214;
  --ng950: 245 245 245;
  border: 1px solid rgb(214 214 214 / 0.85) !important;
  background: rgb(245 245 245 / 0.94) !important;
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xisa[data-xisa-theme="gray"] {
  --ac: 245 245 245;
  --ng50: 245 245 245;
  --ng400: 160 160 160;
  --ng700: 63 63 63;
  --ng950: 46 46 46;
  border: 1px solid rgb(63 63 63 / 0.9) !important;
  background: rgb(46 46 46 / 0.88) !important;
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xivo {
  text-align: left;
  backdrop-filter: blur(10px) !important;
  box-shadow:
    inset 0 1px 0 0 rgb(255 255 255 / 0.04),
    0 0 72px 32px rgb(var(--ac) / 0.11) !important;
}

.xiatre-login-card.card--xivo[data-xivo-theme="warm"] {
  --ac: 224 138 60;
  --ng50: 250 247 242;
  --ng400: 183 168 147;
  --ng700: 118 98 78;
  --ng950: 26 21 17;
  border: 1px solid rgb(var(--ng700) / 0.75) !important;
  background: rgb(var(--ng950) / 0.82) !important;
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xivo[data-xivo-theme="olive"] {
  --ac: 56 148 108;
  --ng50: 244 248 246;
  --ng400: 124 144 134;
  --ng700: 72 88 80;
  --ng950: 12 22 18;
  border: 1px solid rgb(var(--ng700) / 0.75) !important;
  background: rgb(var(--ng950) / 0.82) !important;
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xivo[data-xivo-theme="plum"] {
  --ac: 164 88 112;
  --ng50: 250 246 247;
  --ng400: 156 128 138;
  --ng700: 70 54 62;
  --ng950: 22 12 16;
  border: 1px solid rgb(var(--ng700) / 0.75) !important;
  background: rgb(var(--ng950) / 0.82) !important;
  color: rgb(var(--ng50));
}

.xiatre-login-card.card--xire .xiatre-login-lead,
.xiatre-login-card.card--xivo .xiatre-login-lead,
.xiatre-login-card.card--xisa .xiatre-login-lead,
.xiatre-login-card.card--xire .xiatre-login-note,
.xiatre-login-card.card--xivo .xiatre-login-note,
.xiatre-login-card.card--xisa .xiatre-login-note,
.xiatre-login-card.card--xire .xiatre-login-back,
.xiatre-login-card.card--xivo .xiatre-login-back,
.xiatre-login-card.card--xisa .xiatre-login-back {
  color: rgb(var(--ng400));
}

.xiatre-login-card.card--xire .xiatre-login-back:hover,
.xiatre-login-card.card--xivo .xiatre-login-back:hover,
.xiatre-login-card.card--xisa .xiatre-login-back:hover {
  color: rgb(var(--ng50));
}

#xire-header-tools-anchor {
  pointer-events: none;
}

.xiatre-login-card.card--xire .xiatre-login-note,
.xiatre-login-card.card--xivo .xiatre-login-note,
.xiatre-login-card.card--xisa .xiatre-login-note,
.xiatre-login-card--house .xiatre-login-note,
.xiatre-login-card.card--xire .signin-note,
.xiatre-login-card.card--xivo .signin-note,
.xiatre-login-card.card--xisa .signin-note,
.xiatre-login-card--house .signin-note {
  display: none !important;
}

#xire-header-tools {
  position: relative;
  z-index: 100003;
  pointer-events: auto !important;
}

#xire-header-tools[data-portaled="1"] {
  position: fixed;
  z-index: 100003;
  pointer-events: auto !important;
}

html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xire-header-tools,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xire-header-tools[data-portaled="1"],
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) .locale-dock,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xivo-header-tools {
  z-index: 100050 !important;
  pointer-events: none !important;
}

html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xire-header-tools > :not(#locale-switcher):not(#xire-desktop-download):not(#xire-help-btn),
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) .locale-dock > :not(#locale-switcher):not(#xisa-desktop-download):not(#xisa-help-btn),
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xivo-header-tools > :not(#locale-switcher):not(#locale-switcher-menu):not(#xivo-desktop-download):not(#xivo-help-btn) {
  display: none !important;
}

html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xivo-app-header,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xivo-brand-lockup {
  position: relative;
  z-index: 100001;
  pointer-events: auto;
}

html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #locale-switcher,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #locale-switcher-trigger,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xire-desktop-download,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xire-help-btn,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xivo-desktop-download,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xivo-help-btn,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xisa-desktop-download,
html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #xisa-help-btn {
  pointer-events: auto !important;
}

html.xiatre-auth-gated:not(:has(.xiatre-account--in)) #locale-switcher-menu {
  z-index: 100051 !important;
  pointer-events: auto !important;
}

#xire-header-tools button,
#xire-header-tools .xiatre-account-trigger {
  pointer-events: auto;
}

.xiatre-login-title {
  margin: 0 0 0.35rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  letter-spacing: 0.28em;
  font-weight: 600;
  text-transform: uppercase;
  text-align: center;
}

.xiatre-login-lead {
  margin: 0 0 1.25rem;
  color: #8a8e96;
  font-size: 0.88rem;
  line-height: 1.5;
  text-align: center;
}

.xiatre-login-note {
  margin: 0.85rem 0 0;
  color: #8a8e96;
  font-size: 0.72rem;
  line-height: 1.45;
}

.xiatre-login-back {
  display: inline-block;
  margin-top: 1rem;
  color: #8a8e96;
  font-size: 0.78rem;
  text-decoration: none;
}

.xiatre-login-back:hover {
  color: #e2e8f0;
}
