/* Product/co-brand hierarchy: VocabPRO is the product, Master Explorer is its developer. */
.login-page {
  min-height: calc(100vh - 104px);
  display: grid;
  place-items: center;
  padding: var(--space-6) var(--space-4);
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--color-accent) 12%, transparent), transparent 34%),
    var(--color-bg-canvas);
}
.login-card {
  width: min(100%, 420px);
  padding: var(--space-6);
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-2);
}
.login-brand { margin-bottom: var(--space-6); text-align: center; }
.login-brand__product {
  color: var(--color-accent-active);
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.025em;
}
.login-brand__product span {
  display: inline-block;
  margin-left: 4px;
  padding: 2px 6px;
  color: var(--color-text-inverse);
  background: var(--color-accent);
  border-radius: var(--radius-sm);
  font-size: 12px;
  letter-spacing: 0;
  vertical-align: middle;
}
.login-brand p {
  max-width: 320px;
  margin: var(--space-2) auto 0;
  color: var(--color-text-secondary);
  font-size: 13px;
  line-height: 1.45;
}
.login-card__title { margin: 0 0 var(--space-4); font-size: 20px; line-height: 28px; }
.login-card #loginSubmit { width: 100%; min-height: 44px; justify-content: center; }

.master-explorer-signature {
  color: var(--color-text-secondary);
  font-size: 11px;
  line-height: 1.35;
}
.master-explorer-signature span { display: block; }
.master-explorer-signature img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.master-explorer-signature--login {
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
  text-align: center;
}
.master-explorer-signature--login img { width: min(240px, 82%); margin: var(--space-1) auto 0; }
.master-explorer-signature--utility { display: none; }
.master-explorer-signature--sidebar { display: none; }
.master-explorer-signature--mobile { display: none; }
.app-shell--v2 .master-explorer-signature--sidebar {
  display: block;
  margin-top: auto;
  padding: var(--space-5) var(--space-3) var(--space-2);
  border-top: 1px solid var(--color-border);
  opacity: 0.84;
}
.app-shell--v2 .master-explorer-signature--sidebar span {
  margin-bottom: var(--space-1);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.app-shell--v2 .master-explorer-signature--sidebar img { width: min(160px, 100%); }
.app-shell--v2 .master-explorer-signature--utility {
  display: block;
  margin-top: var(--space-3);
  padding: var(--space-3);
  border-top: 1px solid var(--color-border);
}
.app-shell--v2 .master-explorer-signature--utility img { width: min(210px, 76%); margin-top: var(--space-1); }
.platform-owner-header__actions { display: grid; justify-items: end; gap: var(--space-3); }
.master-explorer-signature--owner { text-align: right; }
.master-explorer-signature--owner img { width: 190px; margin-top: 2px; }

@media (max-width: 900px) {
  .app-shell--v2 .master-explorer-signature--sidebar { display: none; }
  .app-shell--v2 .master-explorer-signature--mobile {
    position: fixed;
    right: var(--space-3);
    bottom: calc(61px + env(safe-area-inset-bottom));
    z-index: 44;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: min(190px, calc(100vw - 24px));
    padding: 5px 8px;
    background: color-mix(in srgb, var(--color-surface) 96%, transparent);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    box-shadow: var(--shadow-1);
    backdrop-filter: blur(10px);
    pointer-events: none;
  }
  .app-shell--v2 .master-explorer-signature--mobile span {
    flex: 0 0 auto;
    font-size: 9px;
    font-weight: 650;
    text-transform: uppercase;
  }
  .app-shell--v2 .master-explorer-signature--mobile img { width: min(112px, 66%); }
  .app-shell--v2 .screen { padding-bottom: calc(126px + env(safe-area-inset-bottom)); }
}

@media (max-width: 640px) {
  .login-page { min-height: calc(100vh - 72px); padding: var(--space-3); }
  .login-card { padding: var(--space-5); }
  .platform-owner-header__actions { width: 100%; justify-items: start; }
  .master-explorer-signature--owner { text-align: left; }
}
