:root { color-scheme: dark; font-family: system-ui, -apple-system, sans-serif; color: #e8eef4; background: #0d1822; }
* { box-sizing: border-box; }
body { margin: 0; }
.account-shell { min-height: 100svh; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(360px, 1fr); }
.account-art { background: #08131b; display: flex; align-items: center; justify-content: center; padding: clamp(20px, 4vw, 64px); }
.account-art img { display: block; width: 100%; height: auto; max-height: 90svh; object-fit: contain; }
.account-panel { display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 5vw, 80px); border-left: 1px solid #2d3c47; }
.account-form { width: 100%; max-width: 420px; margin: auto; padding: 32px 0; }
.eyebrow { font-size: .72rem; letter-spacing: .18em; font-weight: 700; color: #7cd5b7; }
h1 { font-size: clamp(1.8rem, 3vw, 2.6rem); margin: 16px 0 32px; letter-spacing: -.03em; }
label { display: block; margin: 20px 0; font-weight: 600; font-size: .94rem; }
input { display: block; width: 100%; margin-top: 9px; padding: 14px; border: 1px solid #52616d; border-radius: 8px; color: #f5f7fa; background: #152532; font: inherit; min-height: 48px; }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid #96e9d0; outline-offset: 4px; }
button { width: 100%; min-height: 48px; padding: 14px 24px; border: 0; border-radius: 8px; background: #83dfbf; color: #10281e; font: inherit; font-weight: 700; cursor: pointer; margin: 10px 0; }
button:hover { background: #a4efd5; }
p, footer { line-height: 1.6; color: #b8c6d0; font-size: .9rem; }
footer { text-align: center; font-size: .78rem; }
a { color: #96e9d0; text-underline-offset: 3px; }
.form-error { color: #ffcfca; padding: 14px; background: #472626; border: 1px solid #c57c74; border-radius: 8px; }
.default-password-warning { background: #fff0ba; color: #4b3400; border: 2px solid #c79013; padding: 16px; border-radius: 8px; line-height: 1.6; }
.default-password-warning a { color: #4b3400; font-weight: 700; display: inline-block; }
@media (max-width: 900px) {
    .account-shell { grid-template-columns: 1fr; }
    .account-art { padding: 16px; }
    .account-art img { max-height: 30svh; }
    .account-panel { border-left: 0; border-top: 1px solid #2d3c47; padding: 24px; }
    .account-form { padding: 8px 0 24px; }
    h1 { margin-bottom: 20px; }
}