body { display: block; padding: 28px 20px; }
.account-shell { width: min(100%, 900px); margin: 0 auto; }
.account-header { display: flex; align-items: center; gap: 15px; }
.account-header .logo { width: 64px; height: 64px; }
.account-header .eyebrow { margin: 0 0 4px; }
.account-header h1 { font-size: clamp(26px, 4vw, 34px); }
.header-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.header-actions button { margin: 0; }
.header-link { display: inline-block; padding: 13px 16px; border-radius: 9px; font-weight: 700; text-decoration: none; }
.header-link:focus-visible { outline: 3px solid #98d9cd; outline-offset: 2px; }
.auth-card { width: 100%; box-shadow: 0 8px 28px #123b370d; }
#login-panel { width: min(100%, 460px); margin: 20px auto 0; }
.account-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
h2 { margin: 0 0 14px; font-size: 20px; }
.identity { margin: 10px 0 20px; color: #607a7c; }
.secondary { background: #e5f0ed; color: #145752; }
.secondary:hover { background: #cfe4de; }
[hidden] { display: none !important; }
@media (max-width: 680px) { .account-grid { grid-template-columns: 1fr; } .auth-card { padding: 25px; } }
@media (max-width: 540px) { .account-header { flex-wrap: wrap; } .header-actions { margin-left: 0; } }