[hidden] { display: none !important; }
.auth-layout { display: grid; gap: var(--space-7); align-items: start; }
.auth-intro h1 { font-size: var(--font-title); }
.auth-panel { min-width: 0; padding: var(--space-5); background: var(--color-surface); border-radius: var(--radius-medium); box-shadow: var(--shadow-soft); }
.auth-panel h2 { font-size: var(--font-title-small); }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: var(--space-5); }
.field { display: grid; gap: var(--space-2); min-width: 0; }
.field label { font-weight: 600; }
input:not([type="checkbox"]), select { width: 100%; min-width: 0; min-height: 3rem; padding: var(--space-3); border: 1px solid var(--color-muted); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-surface); }
.declaration { display: flex; gap: var(--space-3); align-items: start; }
input[type="checkbox"] { flex: none; width: 1.25rem; height: 1.25rem; margin-block-start: var(--space-1); accent-color: var(--color-primary); }
.password-field { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.password-field input { flex: 1 1 12rem; }
button { cursor: pointer; border: 1px solid transparent; }
button:disabled { cursor: default; opacity: 0.65; }
.secondary { min-height: 3rem; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-muted); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-surface); }
.hint { font-size: var(--font-small); color: var(--color-muted); }
[data-form-status]:not(:empty) { margin-block-start: var(--space-4); border-inline-start: 3px solid var(--color-primary); padding-inline-start: var(--space-3); }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 48rem) { .auth-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-8); } .auth-panel { padding: var(--space-6); } }