.reset-page { min-height: 100vh; display: grid; place-items: center; padding: 2rem 1rem; background: var(--bg-body); }
.reset-card { width: min(31rem, 100%); padding: 2rem 2.5rem 2.25rem; border: 1px solid var(--border-strong); border-radius: 8px; background: var(--bg-panel); box-shadow: var(--shadow); }
.reset-brand { display: flex; align-items: center; gap: .9rem; margin-bottom: 1.5rem; font-size: 1.2rem; }
.reset-brand .brand-mark { width: 2.4rem; height: 2.4rem; }
.reset-brand .brand-mark::before { inset: .4rem; }
.reset-brand .brand-mark::after { inset: .8rem -.35rem -.35rem .8rem; }
.reset-brand .brand-mark i { width: .25rem; height: .25rem; }
.reset-card .preference-bar { margin-bottom: 1.5rem; }
.reset-card .form-heading { margin-bottom: 1.5rem; text-align: left; }
.reset-card .form-heading h1 { margin: 0 0 .55rem; font-size: 1.65rem; }
.form-success { margin-bottom: 1.1rem; padding: .8rem 1rem; border: 1px solid var(--success); border-radius: 6px; background: var(--success-soft); color: var(--success); font-size: .85rem; }
.reset-link-box { display: grid; gap: .45rem; margin-bottom: 1.1rem; padding: .8rem 1rem; border: 1px solid var(--primary); border-radius: 6px; background: var(--primary-soft); color: var(--text-secondary); font-size: .8rem; }
.reset-link-box a { overflow-wrap: anywhere; color: var(--primary-hover); }
.reset-back { display: block; margin-top: 1.25rem; text-align: center; color: var(--primary-hover); font-size: .85rem; }
.reset-login-link { display: grid; place-items: center; text-decoration: none; }
@media (max-width: 520px) { .reset-page { padding: 1rem .75rem; } .reset-card { padding: 1.25rem 1.1rem 1.5rem; } }