/* Mobile auth compact overrides: loaded after split page-auth.css. */
@media (max-width: 760px) {
    body.page-auth {
        min-height: 100svh !important;
        overflow-x: hidden !important;
        background:
            radial-gradient(circle at 18% 8%, rgba(45, 141, 240, 0.14), transparent 34%),
            radial-gradient(circle at 84% 16%, rgba(34, 206, 199, 0.16), transparent 32%),
            linear-gradient(180deg, #f8fcff 0%, #edf7ff 100%) !important;
    }

    body.page-auth .site-header {
        display: none !important;
    }

    body.page-auth main,
    body.page-auth .auth-stage {
        min-height: 100svh !important;
        padding: 8px 0 18px !important;
    }

    body.page-auth .auth-stage > .container {
        width: min(calc(100vw - 16px), 480px) !important;
        max-width: min(calc(100vw - 16px), 480px) !important;
        padding-inline: 0 !important;
    }

    body.page-auth .auth-shell {
        width: 100% !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 9px !important;
    }

    body.page-auth .auth-shell::before,
    body.page-auth .auth-shell::after,
    body.page-auth .auth-panel::before,
    body.page-auth .auth-panel::after,
    body.page-auth .auth-showcase::before,
    body.page-auth .auth-showcase::after {
        content: none !important;
        display: none !important;
    }

    body.page-auth .auth-showcase {
        order: 1 !important;
        min-height: 166px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 112px !important;
        grid-template-rows: auto auto !important;
        gap: 10px !important;
        align-items: center !important;
        padding: 14px !important;
        border-radius: 14px !important;
        overflow: hidden !important;
        color: #ffffff !important;
        background:
            radial-gradient(circle at 78% 16%, rgba(255, 255, 255, 0.34), transparent 32%),
            linear-gradient(135deg, #0a3569 0%, #167fca 58%, #19c6c7 100%) !important;
        box-shadow:
            0 18px 42px rgba(27, 105, 170, 0.2),
            inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
    }

    body.page-auth .auth-showcase-copy {
        max-width: none !important;
        gap: 6px !important;
    }

    body.page-auth .auth-kicker {
        min-height: 24px !important;
        padding-inline: 9px !important;
        color: rgba(237, 251, 255, 0.9) !important;
        font-size: 0.68rem !important;
    }

    body.page-auth .auth-showcase-copy h1 {
        max-width: 8.5em !important;
        font-size: clamp(1.7rem, 7.6vw, 2.1rem) !important;
        line-height: 1.08 !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.page-auth .auth-showcase-copy p {
        max-width: 17em !important;
        display: -webkit-box !important;
        overflow: hidden !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        font-size: 0.82rem !important;
        line-height: 1.5 !important;
        color: rgba(230, 246, 255, 0.82) !important;
    }

    body.page-auth .auth-motion-board {
        grid-column: 2 !important;
        grid-row: 1 / 3 !important;
        width: 112px !important;
        min-height: 112px !important;
        height: 112px !important;
        border-radius: 14px !important;
        background:
            linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px),
            linear-gradient(0deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px),
            rgba(255, 255, 255, 0.1) !important;
        background-size: 24px 24px, 24px 24px, auto !important;
    }

    body.page-auth .auth-robot-core {
        width: 80px !important;
        height: 80px !important;
    }

    body.page-auth .auth-robot-core::before {
        inset: 8px !important;
        border-radius: 12px !important;
    }

    body.page-auth .auth-motion-logo {
        width: 56px !important;
        height: 56px !important;
    }

    body.page-auth .auth-orbit-ring-a {
        width: 108px !important;
        height: 108px !important;
    }

    body.page-auth .auth-orbit-ring-b {
        width: 132px !important;
        height: 80px !important;
    }

    body.page-auth .auth-flow-card,
    body.page-auth .auth-signal-strip,
    body.page-auth .auth-chip-row,
    body.page-auth .auth-feature-list {
        display: none !important;
    }

    body.page-auth .auth-panel {
        order: 2 !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-rows: auto auto auto auto !important;
        gap: 10px !important;
        padding: 12px !important;
        border-radius: 14px !important;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 255, 0.94)) !important;
        border: 1px solid rgba(130, 185, 232, 0.26) !important;
        box-shadow: 0 18px 44px rgba(48, 101, 152, 0.12) !important;
    }

    body.page-auth .auth-tabs {
        height: 44px !important;
        min-height: 44px !important;
        margin: 0 !important;
        border-radius: 12px !important;
        background: rgba(223, 239, 252, 0.68) !important;
    }

    body.page-auth .auth-tabs a {
        min-height: 36px !important;
        border-radius: 10px !important;
        font-size: 0.92rem !important;
    }

    body.page-auth .auth-heading {
        gap: 4px !important;
        padding-inline: 2px !important;
    }

    body.page-auth .auth-heading .eyebrow {
        min-height: 25px !important;
        padding-inline: 9px !important;
        font-size: 0.72rem !important;
    }

    body.page-auth .auth-heading h2 {
        font-size: clamp(1.72rem, 8vw, 2.15rem) !important;
        line-height: 1.08 !important;
    }

    body.page-auth .auth-heading p {
        font-size: 0.84rem !important;
        line-height: 1.45 !important;
    }

    body.page-auth .auth-form-card {
        height: auto !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px !important;
        border-radius: 12px !important;
        background: #ffffff !important;
        border: 1px solid rgba(137, 188, 230, 0.28) !important;
        box-shadow: 0 12px 28px rgba(54, 106, 155, 0.07) !important;
    }

    body.page-auth .auth-panel .field {
        gap: 0 !important;
    }

    body.page-auth .auth-panel .field span {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0 0 0 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    body.page-auth .auth-panel .field input {
        min-height: 46px !important;
        border-radius: 10px !important;
        padding-inline: 13px !important;
        font-size: 16px !important;
    }

    body.page-auth .auth-panel .button[type="submit"] {
        min-height: 46px !important;
        margin: 0 !important;
        border-radius: 10px !important;
        font-size: 0.96rem !important;
    }

    body.page-auth .auth-inline-note {
        min-height: 42px !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        border-radius: 12px !important;
        font-size: 0.84rem !important;
    }

    body.page-auth .auth-panel-flash-stack {
        max-height: none !important;
        margin: 0 !important;
    }
}