body.auth-view { margin: 0; background: var(--vc-canvas); }
body.auth-view > header { display: none; }

.auth-stage { display: grid; place-items: center; min-height: max(53.125rem, 100vh); padding: 2.75rem 1.125rem 4rem; }
.auth-content { width: min(100%, 26.25rem); }
.auth-brand { display: flex; align-items: center; justify-content: center; gap: var(--vc-space-md); margin-bottom: var(--vc-space-xl); }
.auth-brand-mark { display: grid; place-items: center; width: 2.125rem; height: 2.125rem; border-radius: 0.5625rem; background: var(--vc-auth-mark-bg); color: var(--vc-on-accent); font-size: 1.125rem; font-weight: 710; letter-spacing: -.065em; }
.auth-brand-name { color: var(--vc-auth-brand-text); font-size: 0.875rem; font-weight: 660; letter-spacing: -.015em; }
.auth-window { padding: var(--vc-space-2xl); border: var(--vc-border-width) solid var(--vc-auth-border); border-radius: var(--vc-radius-panel); background: var(--vc-surface); box-shadow: var(--vc-shadow-auth); }
.auth-heading h1 { margin: 0; font-size: var(--vc-font-auth-title); line-height: 1.2; font-weight: 670; letter-spacing: -.035em; }
.auth-switch { display: grid; grid-template-columns: 1fr 1fr; gap: var(--vc-space-2xs); margin: var(--vc-space-xl) 0; padding: var(--vc-space-2xs); border: var(--vc-border-width) solid var(--vc-auth-switch-border); border-radius: var(--vc-radius-control); background: var(--vc-auth-switch-bg); }
.auth-switch button { min-height: 1.875rem; border: 0; border-radius: var(--vc-radius-small); background: transparent; color: var(--vc-auth-switch-text); font-size: var(--vc-font-control); font-weight: 570; cursor: pointer; }
.auth-switch button[aria-pressed="true"] { background: var(--vc-surface); color: var(--vc-auth-switch-selected-text); box-shadow: var(--vc-shadow-auth-selection); }
.auth-switch button:hover:not([aria-pressed="true"]) { color: var(--vc-auth-switch-text-hover); }
.auth-panel .vc-button { width: 100%; min-height: 2.4375rem; margin-top: 0.4375rem; }
.auth-name-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--vc-space-md); }

body.auth-view #account-section, body.auth-view #invitation-section, body.auth-view #platform-section { display: none; }
body.auth-view > main > section:not(#auth-section) { max-width: 40.625rem; margin: 0 auto 2.625rem; padding: 0 1.375rem; }
body.auth-view > main > section:not(#auth-section) h2 { font-size: 0.9375rem; font-weight: 650; }
body.auth-view #club-list { padding-left: 1.25rem; color: var(--vc-secondary); font-size: var(--vc-font-body); }
body.auth-view #club-list button { padding: 0.1875rem 0; border: 0; background: none; color: var(--vc-accent); cursor: pointer; }

@media (max-width: 32.5rem) {
  .auth-stage { min-height: 100vh; padding: 1.6875rem 1rem 2.5rem; }
  .auth-brand { margin-bottom: var(--vc-space-xl); }
  .auth-window { padding: var(--vc-space-xl); }
  .auth-name-row { grid-template-columns: 1fr; gap: var(--vc-space-lg); }
}