:root {
    color-scheme: light;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #1e293b;
    background: #f8fafc;
}

* { box-sizing: border-box; }

body { margin: 0; min-height: 100vh; }

a { color: #ad1457; text-underline-offset: 2px; }
a:hover { color: #880e4f; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #f48fb1; outline-offset: 2px; }

.recovery-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 2rem 1rem;
}

.recovery-card {
    width: 100%;
    max-width: 24rem;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background: #fff;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
    animation: card-enter 260ms ease-out both;
}

.recovery-card__header { padding: 1.75rem 1.5rem 1rem; text-align: center; }
.recovery-brand { display: inline-block; margin-bottom: 1.25rem; font-size: 1.1rem; font-weight: 700; text-decoration: none; }
.recovery-card h1 { margin: 0; font-size: 1.5rem; line-height: 1.25; }
.recovery-card__header p { margin: 0.6rem 0 0; color: #64748b; font-size: 0.875rem; line-height: 1.5; }
.recovery-card__body { padding: 0.75rem 1.5rem 1.5rem; }

.form-group { margin-bottom: 1rem; }
.form-group label { display: block; margin-bottom: 0.4rem; font-size: 0.875rem; font-weight: 600; }
.form-group input {
    width: 100%;
    min-height: 2.65rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    background: #fff;
    color: #1e293b;
    font: inherit;
}
.form-group input::placeholder { color: #94a3b8; }
.form-hint { margin: 0.4rem 0 0; color: #64748b; font-size: 0.75rem; line-height: 1.4; }

.recovery-button {
    width: 100%;
    min-height: 2.65rem;
    padding: 0.625rem 1rem;
    border: 0;
    border-radius: 0.5rem;
    background: #e91e63;
    color: #fff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}
.recovery-button:hover { background: #c2185b; }
.recovery-button:disabled { opacity: 0.65; cursor: wait; }

.recovery-status { margin-bottom: 1rem; padding: 0.75rem; border-radius: 0.5rem; font-size: 0.875rem; line-height: 1.5; }
.recovery-status--error { background: #fef2f2; color: #991b1b; }
.recovery-status--success { background: #fce4ec; color: #880e4f; }
.recovery-secondary { margin: 1rem 0 0; color: #64748b; font-size: 0.875rem; line-height: 1.5; text-align: center; }
[hidden] { display: none !important; }

@keyframes card-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .recovery-card { animation: none; } }
@media (max-width: 360px) { .recovery-card__header { padding-inline: 1rem; } .recovery-card__body { padding-inline: 1rem; } }
