/* The public account pages share the landing page's palette and navigation. */
:root {
    --bg-gradient: linear-gradient(135deg, #fbfafd 0%, #f3edf9 52%, #f8f5fc 100%);
    --glass-bg: rgba(255, 255, 255, .52);
    --ios-radius: 32px;
    --accent-blue: #7c3aed;
    --accent-blue-hover: #6d28d9;
}
html { overflow-x: clip; }
body.account-ui.public-auth {
    background-color: #f3edf9 !important;
    background-image: var(--bg-gradient) !important;
    overflow-x: clip;
}
.account-ui.public-auth .nav-container { animation: none; }
.account-ui.public-auth .page-wrapper {
    min-height: calc(100vh - var(--home-header-height, 84px));
    min-height: calc(100svh - var(--home-header-height, 84px));
    padding: 32px 24px 60px;
    min-width: 0;
}
.account-ui.public-auth .container { min-width: 0; }
.account-ui.public-auth .card { background: var(--glass-bg); border-radius: var(--ios-radius); }
.account-ui.public-auth .bg-blob {
    background: linear-gradient(180deg, rgba(192, 132, 252, .28), rgba(221, 214, 254, .22)) !important;
    border: 0;
    border-radius: 50%;
    filter: blur(100px) !important;
    animation: public-auth-float 14s ease-in-out infinite alternate !important;
}
.account-ui.public-auth .bg-blob-2 {
    top: 35% !important;
    right: 5% !important;
    background: linear-gradient(180deg, rgba(168, 85, 247, .24), rgba(233, 213, 255, .18)) !important;
    animation-delay: -7s !important;
}
.account-ui.public-auth .modal-badge { color: var(--accent-purple); background: rgba(124, 58, 237, .1); }
.account-ui.public-auth .btn { background: var(--accent-purple); box-shadow: 0 4px 14px rgba(124, 58, 237, .25); }
.account-ui.public-auth .btn:hover { background: var(--accent-purple-hover); }
.account-ui.public-auth .form-group input:focus { border-color: var(--accent-purple); box-shadow: 0 0 0 4px rgba(124, 58, 237, .12); }
.account-ui.public-auth .step.active .circle { box-shadow: 0 4px 12px rgba(124, 58, 237, .3); }
@keyframes public-auth-float {
    from { transform: translate(0, 0) scale(1); }
    to { transform: translate(40px, 50px) scale(1.1); }
}
@media (max-width: 680px) {
    .account-ui.public-auth .page-wrapper { padding: 24px 16px 40px; }
    .account-ui.public-auth .card { border-radius: 24px; }
    .account-ui.public-auth .form-group input,
    .account-ui.public-auth .form-group select,
    .account-ui.public-auth .form-group textarea { font-size: 16px; }
    .account-ui.public-auth .glass-dropdown { max-width: calc(100vw - 32px); }
}
@media (prefers-reduced-motion: reduce) {
    .account-ui.public-auth .bg-blob { animation: none !important; }
}