.phone-auth {
        display: grid;
        gap: 14px;
    }

    .phone-auth-step {
        display: none;
        gap: 14px;
        animation: phoneAuthIn .18s ease-out;
    }

    .phone-auth-step[hidden] {
        display: none !important;
    }

    .phone-auth[data-auth-step="phone"] [data-auth-screen="phone"],
    .phone-auth[data-auth-step="code"] [data-auth-screen="code"],
    .phone-auth[data-auth-step="profile"] [data-auth-screen="profile"] {
        display: grid;
    }

    @keyframes phoneAuthIn {
        from {
            opacity: 0;
            transform: translateY(6px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .phone-auth-head {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #0f172a;
        font-size: 1rem;
        font-weight: 900;
    }

    .phone-auth-head i {
        color: #7042F4;
    }

    .phone-auth-hint {
        margin: 0;
        color: #475569;
        font-size: .85rem;
        line-height: 1.7;
    }

    .phone-auth .field {
        display: grid;
        gap: 6px;
    }

    .phone-auth .field label {
        color: #1e293b;
        font-size: .8rem;
        font-weight: 900;
    }

    .phone-auth .input {
        width: 100%;
        min-height: 44px;
        border: 1.5px solid #cbd5e1;
        border-radius: 8px;
        padding: 9px 12px;
        background: #f8fafc;
        font-family: inherit;
        font-size: .9rem;
    }

    .phone-auth .phone-auth-code {
        text-align: center;
        font-size: 1.2rem;
        font-weight: 900;
        letter-spacing: 4px;
    }

    .phone-auth-primary {
        min-height: 46px;
        border: 0;
        border-radius: 8px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        background: #7042F4;
        color: #fff;
        font-family: inherit;
        font-size: .95rem;
        font-weight: 900;
        cursor: pointer;
        transition: background .15s ease;
    }

    .phone-auth-primary:hover {
        background: var(--brand-700);
    }

    .phone-auth-primary:disabled {
        opacity: .65;
        cursor: not-allowed;
    }

    .phone-auth-primary.is-busy {
        opacity: .92;
    }

    .phone-auth-spinner {
        width: 16px;
        height: 16px;
        border: 2px solid rgba(255, 255, 255, .45);
        border-top-color: #fff;
        border-radius: 50%;
        animation: phoneAuthSpin .7s linear infinite;
    }

    @keyframes phoneAuthSpin {
        to {
            transform: rotate(360deg);
        }
    }

    .phone-auth-link {
        appearance: none;
        background: transparent;
        border: 0;
        color: #7042F4;
        font-family: inherit;
        font-size: .82rem;
        font-weight: 800;
        cursor: pointer;
        padding: 0;
    }

    .phone-auth-link:disabled {
        color: #94a3b8;
        cursor: not-allowed;
    }

    .phone-auth-turnstile {
        min-height: 0;
        transition: min-height .16s ease;
    }

    .phone-auth-turnstile:not(:empty) {
        min-height: 65px;
    }

    .phone-auth-consent {
        padding: 12px 14px;
        border: 1.5px solid #bfdbfe;
        border-radius: 10px;
        background: #eff6ff;
    }

    .terms-check-label {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: .86rem;
        color: #1e293b;
        line-height: 1.7;
        cursor: pointer;
    }

    .terms-check-label input[type="checkbox"] {
        margin-top: 3px;
        flex-shrink: 0;
        accent-color: #2563eb;
        width: 18px;
        height: 18px;
        cursor: pointer;
    }

    .terms-check-label a {
        color: #2563eb;
        text-decoration: underline;
        font-weight: 900;
        text-underline-offset: 3px;
    }

    .terms-check-label b {
        color: #b91c1c;
        font-weight: 900;
    }

    .phone-auth-status {
        min-height: 18px;
        color: #64748b;
        font-size: .8rem;
        font-weight: 800;
        line-height: 1.7;
    }

    .phone-auth-status.ok {
        color: #047857;
    }

    .phone-auth-status.error {
        color: #b91c1c;
    }

    /* Modal wrapper */
    .auth-modal-overlay {
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, .58);
        z-index: 9999;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 16px;
    }

    .auth-modal-overlay.is-open {
        display: flex;
    }

    .auth-modal {
        position: relative;
        width: min(440px, 100%);
        background: #fff;
        border-radius: 14px;
        padding: 22px;
        box-shadow: 0 24px 60px rgba(15, 23, 42, .25);
        max-height: calc(100vh - 32px);
        overflow-y: auto;
    }

    .auth-modal-close {
        position: absolute;
        top: 10px;
        left: 10px;
        appearance: none;
        background: transparent;
        border: 0;
        font-size: 1.4rem;
        color: #94a3b8;
        cursor: pointer;
        padding: 6px 10px;
        line-height: 1;
    }

    .auth-modal-close:hover {
        color: #0f172a;
    }