/* Forms share the same quiet surfaces and controls as the dashboard. */
.form-page .auth-overlay { display: none; }
.form-page main { padding-top: 40px; padding-bottom: 48px; }
.form-shell { width: 100%; margin-inline: auto; }
.login-shell { max-width: 460px; }
.signup-shell { max-width: 1000px; }
.form-heading { margin-bottom: 28px; text-align: left; }
.form-heading h1 { font-size: 28px; line-height: 1.25; font-weight: 650; letter-spacing: -.025em; margin-bottom: 10px; }
.form-heading p { color: #94a3b8; line-height: 1.6; }
.form-surface { background: #111827; border: 1px solid rgba(255,255,255,.10); border-radius: 12px; padding: 28px; box-shadow: none; }
.form-page main label { color: #cbd5e1; font-size: 13px; font-weight: 500; }
.form-page main label > i { display: none; }
.form-page main :is(input:not([type=checkbox]):not([type=hidden]), select, textarea):not(#website) {
    min-height: 44px; border-width: 1px; border-radius: 8px; font-size: 14px;
    background: #0f172a !important; border-color: #334155 !important;
    padding: 11px 13px; transition: border-color .18s ease, background-color .18s ease;
}
.form-page main input[autocomplete$="password"] { padding-right: 48px !important; }
.form-page main :is(input, textarea)::placeholder { color: #94a3b8 !important; opacity: 1; }
.form-page main :is(input, select, textarea):focus-visible { border-color: #38bdf8 !important; box-shadow: none !important; outline-offset: 2px; }
.form-page main :is(input[type=checkbox], input[type=radio]) { accent-color: #0284c7; flex-shrink: 0; }
.form-page main :is(button[type=submit], a[href^="/auth/google"]) { min-height: 44px; border-width: 1px; box-shadow: none; }
.form-page main a { color: #38bdf8; }
.password-toggle { width: 40px; height: 40px; right: 2px !important; border-radius: 6px; color: #94a3b8; }
.password-toggle:hover { color: #e2e8f0; background: rgba(255,255,255,.04); }
.login-options { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.login-options label { margin: 0; }
.login-options :is(a, span) { font-size: 13px; }
.signup-layout { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 24px; align-items: start; }
.signup-plans > p { text-align: left; font-size: 12px; color: #94a3b8; letter-spacing: .04em; }
#planCards { display: grid; grid-template-columns: 1fr; gap: 16px; }
#planCards > div { background: #111827; border: 1px solid #334155; border-radius: 12px; box-shadow: none; opacity: 1; padding: 20px; }
#planCards .plan-card { cursor: pointer; }
#planCards .plan-card.selected { background: rgba(2,132,199,.10); border-color: #38bdf8 !important; box-shadow: none; }
#planCards .plan-card:hover { border-color: #64748b; }
#planCards .plan-check { background: #0284c7; }
#planCards .plan-check.hidden { display: none; }
#planCards .text-yellow-400 { color: #38bdf8; }
#planCards .text-white\/50 { color: #94a3b8; }
.plan-recommendation { position: static; transform: none; margin-bottom: 12px; }
.plan-recommendation span { background: rgba(2,132,199,.15); color: #7dd3fc; border-radius: 4px; box-shadow: none; padding: 4px 6px; }
.signup-form-wrap { min-width: 0; }
#signupForm > .grid { gap: 16px; margin-bottom: 20px; }
#proFields { margin-top: 24px; padding-top: 24px; border-top: 1px solid #334155; }
#proFields h4 { font-weight: 600; color: #e2e8f0; }
#proFields .grid { gap: 16px; }
.contact-shell { max-width: 1000px; display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 48px; align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 24px; padding-top: 24px; border-top: 1px solid #334155; }
.contact-info > div { display: flex; align-items: flex-start; gap: 12px; }
.contact-info i { color: #38bdf8; margin-top: 3px; width: 20px; }
.contact-info .contact-label { color: #cbd5e1; font-size: 13px; margin-bottom: 4px; }
.contact-info .contact-detail { color: #94a3b8; font-size: 14px; overflow-wrap: anywhere; }
#contactForm .grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
#contactForm textarea { min-height: 160px; }
@media(max-width: 767px) {
 .form-page main { padding-top: 28px; }
 .form-surface { padding: 22px; }
 .signup-layout, .contact-shell { grid-template-columns: minmax(0,1fr); gap: 28px; }
 .form-heading h1 { font-size: 26px; }
 .contact-info { gap: 16px; }
}
@media(max-width: 479px) {
 #signupForm .grid, #contactForm .grid { grid-template-columns: minmax(0,1fr); }
 .form-surface { padding: 20px; }
}

.form-page main label a { text-decoration: underline; text-underline-offset: 3px; }

.form-page main a[href^="/auth/google"] { color: #e2e8f0; }