.auth-kicker,
.auth-switcher {
    display: none;
}

@media (max-width: 767px) {
    body.auth-screen {
        --auth-page: #01010a;
        --auth-panel: #0b1024;
        --auth-field: #111a31;
        --auth-border: rgba(107, 177, 211, 0.26);
        --auth-text: #f0f6ff;
        --auth-muted: #a9b9d1;
        min-height: 100dvh;
        background:
            radial-gradient(circle at 50% 7rem, rgba(34, 148, 177, 0.17), transparent 18rem),
            radial-gradient(circle at 88% 35rem, rgba(111, 64, 177, 0.14), transparent 20rem),
            var(--auth-page) !important;
        color: var(--auth-text);
    }

    body.light.auth-screen {
        --auth-page: #f3f1ff;
        --auth-panel: #fff;
        --auth-field: #fbfaff;
        --auth-border: rgba(121, 39, 199, 0.23);
        --auth-text: #625d83;
        --auth-muted: #746f94;
    }

    body.auth-screen > .site-header.neon-header,
    body.light.auth-screen > .site-header.neon-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 9px 12px;
        min-height: 0;
        margin: 0;
        padding: calc(10px + env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));
        border: 0;
        border-bottom: 1px solid var(--auth-border);
        border-radius: 0;
        background: linear-gradient(115deg, rgba(35, 137, 164, 0.12), rgba(100, 61, 170, 0.08)), var(--auth-page) !important;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14) !important;
        text-align: left;
    }

    body.auth-screen .site-header .brand-link {
        grid-column: 1;
        grid-row: 1;
        display: inline-flex;
        justify-content: flex-start;
        width: auto;
        min-width: 0;
    }

    body.auth-screen .site-header .brand-stack {
        flex-direction: row;
        align-items: center;
        gap: 9px;
        margin: 0;
        padding: 0;
    }

    body.auth-screen .site-header .icon-wrapper {
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        margin: 0;
    }

    body.auth-screen .site-header .logo-icon {
        width: 44px;
        height: 44px;
    }

    body.auth-screen .site-header .brand-wordmark {
        align-items: flex-start;
    }

    body.auth-screen .site-header .brand-kicker,
    body.auth-screen .site-header .header-tagline {
        display: none;
    }

    body.auth-screen .site-header .brand-name {
        font-size: 1.16rem;
        line-height: 1;
        letter-spacing: 0.025em;
    }

    body.auth-screen .site-header .header-actions {
        grid-column: 2;
        grid-row: 1;
        position: static;
        display: flex;
        align-items: center;
        width: auto;
        margin: 0;
    }

    body.auth-screen .site-header .pwa-install-button,
    body.auth-screen .site-header .theme-toggle span {
        display: none !important;
    }

    body.auth-screen .site-header .header-preferences {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 6px;
        width: auto;
    }

    body.auth-screen .site-header .theme-toggle,
    body.auth-screen .site-header .language-switcher summary {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 42px;
        width: 42px;
        height: 42px;
        min-height: 42px;
        padding: 0 !important;
        font-size: 0.82rem;
    }

    body.auth-screen .site-header .language-switcher,
    body.auth-screen .site-header .language-switcher summary {
        width: auto;
    }

    body.auth-screen .site-header .language-switcher summary {
        min-width: 48px;
        padding-inline: 5px !important;
    }

    body.auth-screen .site-header .site-nav {
        grid-column: 1 / -1;
        grid-row: 2;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        width: 100%;
        max-width: none;
        margin: 0;
    }

    body.auth-screen .site-header .site-nav .guest-nav-login,
    body.auth-screen .site-header .site-nav .guest-nav-register {
        display: none !important;
    }

    body.auth-screen .site-header .site-nav .guest-nav-home,
    body.auth-screen .site-header .site-nav .guest-nav-about {
        display: inline-flex;
        flex: 0 1 auto;
        width: auto;
        min-width: 0;
        min-height: 34px;
        padding: 6px 12px;
        border: 1px solid var(--auth-border);
        border-radius: 999px;
        background: rgba(75, 135, 178, 0.09);
        color: var(--auth-muted);
        font-size: 0.76rem;
        font-weight: 700;
        text-decoration: none;
    }

    body.auth-screen .site-header .site-nav .guest-nav-home::before {
        content: "←";
        margin-right: 5px;
    }

    body.auth-screen main.auth-main {
        width: min(100%, 440px);
        margin: 0 auto;
        padding: 26px 16px calc(20px + env(safe-area-inset-bottom)) !important;
    }

    body.auth-screen .auth-panel {
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.auth-screen .auth-intro {
        margin: 0 4px 17px;
    }

    body.auth-screen .auth-kicker {
        display: block;
        margin-bottom: 6px;
        color: #6fd4e0;
        font-size: 0.69rem;
        font-weight: 800;
        letter-spacing: 0.25em;
    }

    body.light.auth-screen .auth-kicker {
        color: #007b98;
    }

    body.auth-screen .auth-intro h2 {
        margin: 0;
        color: var(--auth-text);
        font-size: clamp(1.9rem, 8vw, 2.35rem);
        font-weight: 800;
        line-height: 1.08;
        text-align: left;
    }

    body.auth-screen .auth-switcher {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px;
        margin-bottom: 14px;
        padding: 4px;
        border: 1px solid var(--auth-border);
        border-radius: 17px;
        background: rgba(82, 136, 178, 0.1);
    }

    body.auth-screen .auth-switcher a {
        display: grid;
        place-items: center;
        min-height: 42px;
        border-radius: 12px;
        color: var(--auth-muted);
        font-size: 0.91rem;
        font-weight: 700;
        text-decoration: none;
    }

    body.auth-screen .auth-switcher a[aria-current="page"] {
        background: var(--auth-panel);
        color: var(--auth-text);
        box-shadow: 0 3px 12px rgba(0, 0, 0, 0.14);
    }

    body.auth-screen .auth-form {
        margin: 0;
        padding: 22px 18px !important;
        border: 1px solid var(--auth-border) !important;
        border-radius: 24px !important;
        background: var(--auth-panel) !important;
        box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22) !important;
    }

    body.auth-screen .auth-form .auth-field {
        margin-bottom: 15px;
    }

    body.auth-screen .auth-form.space-y-4 > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0;
    }

    body.auth-screen .auth-form .text-right {
        margin-bottom: 18px;
    }

    body.auth-screen .auth-form label {
        color: var(--auth-text);
    }

    body.auth-screen .auth-form input:not([type="checkbox"]),
    body.auth-screen .auth-form select {
        min-height: 52px;
        border: 1px solid var(--auth-border) !important;
        border-radius: 15px;
        background: var(--auth-field) !important;
        color: var(--auth-text) !important;
        font-size: 16px;
    }

    body.auth-screen .auth-form input:focus,
    body.auth-screen .auth-form select:focus {
        outline: 2px solid #58c8d8;
        outline-offset: 1px;
    }

    body.auth-screen .auth-form input[type="checkbox"] {
        width: 19px;
        height: 19px;
        flex: 0 0 19px;
    }

    body.auth-screen .auth-form label[for="terms_accepted"],
    body.auth-screen .auth-form label[for="terms_accepted"] span {
        color: var(--auth-muted) !important;
    }

    body.auth-screen .auth-form .auth-submit {
        min-height: 52px;
        margin-top: 4px;
        border: 0 !important;
        border-radius: 15px;
        background: linear-gradient(115deg, #176f86, #6740a8) !important;
        color: #fff !important;
        font-size: 1rem;
        box-shadow: 0 10px 24px rgba(67, 60, 160, 0.24) !important;
    }

    body.auth-screen .auth-switch-message {
        margin-top: 18px;
        color: var(--auth-muted);
        font-size: 0.88rem;
        line-height: 1.5;
    }

    body.auth-screen .auth-switch-message a,
    body.auth-screen .auth-form .text-right a,
    body.auth-screen .auth-form label[for="terms_accepted"] a,
    body.auth-screen .auth-footer a {
        color: #79d8e3;
    }

    body.light.auth-screen .auth-switch-message a,
    body.light.auth-screen .auth-form .text-right a,
    body.light.auth-screen .auth-form label[for="terms_accepted"] a,
    body.light.auth-screen .auth-footer a {
        color: #705098;
    }

    body.auth-screen .auth-footer {
        max-width: 440px;
        margin: 0 auto;
        padding: 5px 18px calc(24px + env(safe-area-inset-bottom));
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        color: var(--auth-muted);
        font-size: 0.76rem;
    }

    body.auth-screen .auth-footer .auth-footer-auth-link {
        display: none;
    }

    body.auth-screen .auth-footer a {
        display: inline;
        width: auto;
        min-height: 0;
    }

    body.auth-screen .auth-footer .space-x-4,
    body.auth-screen .auth-footer .flex {
        gap: 6px 14px;
        margin-top: 8px;
    }
}