.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 120; padding: 0.75rem 1rem; background: var(--text); color: var(--page); border-radius: var(--radius-sm); transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
.site-shell { min-height: 100vh; }
.topbar { position: sticky; top: 0; z-index: 30; display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.85rem clamp(1.25rem, 4vw, 4rem); border-bottom: 1px solid var(--line-soft); background: rgb(11 20 28 / 96%); }
.brand { display: flex; align-items: center; gap: 0.75rem; color: var(--text); }
.brand:hover { text-decoration: none; }
.brand span:last-child { display: grid; }
.brand small { color: var(--text-muted); }
.brand__mark { display: grid; width: 44px; height: 44px; place-items: center; background: var(--cyan); color: white; font-size: 0.82rem; font-weight: 900; border-radius: var(--radius-sm); }
.brand__mark--large { width: 62px; height: 62px; margin-bottom: 1.25rem; font-size: 1rem; }
.topbar__nav { display: flex; align-items: center; gap: 0.35rem; }
.topbar__nav > a:not(.button) { min-height: 40px; padding: 0.55rem 0.75rem; color: var(--text-muted); font-weight: 750; border-radius: var(--radius-sm); }
.topbar__nav > a.is-active { background: var(--surface); color: var(--cyan-hover); }
.topbar__nav form { margin-left: 0.35rem; }
.page { width: min(100%, 1320px); margin-inline: auto; padding: clamp(2rem, 5vw, 5rem) clamp(1.25rem, 4vw, 4rem); }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.page-heading__copy { max-width: 44rem; color: var(--text-muted); font-size: 1.05rem; }
.auth-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(24rem, 0.9fr); min-height: 100vh; }
.auth-brand, .auth-panel { display: grid; align-content: center; padding: clamp(2rem, 7vw, 7rem); }
.auth-brand { min-height: 100vh; background: var(--nav); }
.auth-brand h1 { max-width: 12ch; font-size: clamp(3rem, 6vw, 5.6rem); }
.auth-brand__copy { max-width: 36rem; margin: 1.5rem 0 0; color: #c4dce4; font-size: 1.08rem; }
.auth-panel { background: var(--surface); }
.auth-panel__inner { width: min(100%, 28rem); margin-inline: auto; }
.auth-panel h2 { margin-bottom: 0.45rem; font-size: 1.8rem; }
.auth-back { display: block; margin-top: 1.25rem; text-align: center; }
@media (max-width: 800px) {
  .auth-layout { grid-template-columns: 1fr; }
  .auth-brand { min-height: auto; padding-block: 3rem; }
  .auth-brand h1 { font-size: 2.8rem; }
  .auth-panel { min-height: 56vh; }
  .topbar { align-items: flex-start; }
  .topbar__nav > a:not(.button) { display: none; }
}