.login-page { background: var(--surface); }
.login-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(350px, .9fr) minmax(470px, 1.1fr); }
.login-brand-panel {
    position: relative;
    display: flex;
    overflow: hidden;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(2rem, 5vw, 5rem);
    color: rgba(255, 255, 255, .82);
    background:
        radial-gradient(circle at 100% 0, rgba(28, 202, 188, .26), transparent 35%),
        linear-gradient(150deg, #071b2f 0%, #123f66 72%, #0b776f 150%);
}
.login-brand-panel::after { position: absolute; right: -90px; bottom: 8%; width: 270px; height: 270px; content: ""; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 45px rgba(255,255,255,.035), 0 0 0 90px rgba(255,255,255,.025); }
.login-brand-panel > * { position: relative; z-index: 1; }
.login-brand-panel h1 { max-width: 620px; margin-bottom: 1.1rem; color: white; font-size: clamp(2.5rem, 5vw, 4.8rem); line-height: .98; letter-spacing: -.055em; }
.login-brand-panel > div p:last-child { max-width: 560px; font-size: 1.08rem; }
.security-note { max-width: 430px; margin: 0; font-size: .83rem; }
.login-form-panel { display: grid; padding: 2rem; place-items: center; background: #f6f8fa; }
.login-card { display: grid; width: min(430px, 100%); gap: 1.25rem; padding: clamp(1.4rem, 4vw, 2.5rem); }
.login-card h2 { margin: 0; font-size: 1.65rem; }
.login-card .muted { margin: .35rem 0 0; }
.setup-callout { margin: 0; padding: .7rem; background: var(--blue-100); border-radius: 8px; font-size: .82rem; text-align: center; }
.simple-auth-shell { display: grid; min-height: 100vh; align-content: center; gap: 1.5rem; padding: 2rem 1rem; background: var(--canvas); }
.setup-card { width: min(520px, 100%); margin: 0 auto; padding: clamp(1.4rem, 4vw, 2.4rem); }
.setup-card > h1 { font-size: 1.8rem; }
.success-panel { text-align: center; }
.success-icon { display: grid; width: 58px; height: 58px; margin: 0 auto 1rem; place-items: center; color: white; background: var(--success); border-radius: 50%; font-size: 1.65rem; font-weight: 800; }
.success-panel .button { margin-top: .75rem; }

@media (max-width: 850px) {
    .login-shell { grid-template-columns: 1fr; }
    .login-brand-panel { min-height: 320px; padding: 1.8rem; }
    .login-brand-panel h1 { max-width: 500px; font-size: clamp(2rem, 9vw, 3.2rem); }
    .login-brand-panel .security-note { display: none; }
    .login-form-panel { padding: 1.25rem; }
}