.ak-otp-template{
    display:grid;
    justify-items:center;
    width:min(720px,100%);
    min-width:0;
    gap:20px;
    padding:clamp(24px,4vw,42px);
    border:1px solid color-mix(in srgb,var(--color-primary) 18%,transparent);
    border-radius:var(--radius-2xl,28px);
    background:var(--color-white,#fff);
    box-shadow:var(--shadow-soft,0 18px 45px rgba(20,31,70,.10));
    color:var(--color-text,#1a1d29);
    font-family:var(--font-inter,Inter,Arial,sans-serif);
    text-align:center;
}

.ak-otp-template h3,
.saas-body .ak-otp-template h3,
.saas-body .dash-card .ak-otp-template h3{
    margin:0 !important;
    color:var(--color-text,#1a1d29) !important;
    font-family:var(--font-inter-black,var(--font-inter,Inter,Arial,sans-serif)) !important;
    font-size:clamp(1.75rem,3vw,2.6rem) !important;
    line-height:1.1 !important;
    letter-spacing:-.035em !important;
}

.ak-otp-icon{
    display:grid;
    width:88px;
    height:88px;
    border-radius:24px;
    background:color-mix(in srgb,var(--color-primary) 14%,var(--color-white));
    place-items:center;
}

.ak-otp-icon img{
    display:block;
    width:48px;
    height:48px;
    object-fit:contain;
    filter:brightness(0) saturate(100%) invert(35%) sepia(97%) saturate(4227%) hue-rotate(226deg) brightness(101%) contrast(101%);
}

.ak-otp-description,
.ak-otp-email,
.ak-otp-timer{
    max-width:620px;
    margin:0;
    color:var(--color-muted,#69728f);
    font-family:var(--font-inter,Inter,Arial,sans-serif);
    font-size:clamp(1rem,2vw,1.2rem);
    line-height:1.55;
}

.ak-otp-email{
    display:grid;
    gap:4px;
}

.ak-otp-email strong{
    color:var(--color-text,#1a1d29);
    overflow-wrap:anywhere;
}

.ak-otp-grid{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,88px));
    justify-content:center;
    width:100%;
    min-width:0;
    gap:14px;
}

.ak-otp-grid input{
    box-sizing:border-box;
    width:100%;
    min-width:0;
    height:82px;
    padding:0;
    border:2px solid color-mix(in srgb,var(--color-primary) 22%,transparent);
    border-radius:18px;
    outline:0;
    background:color-mix(in srgb,var(--color-primary) 5%,var(--color-white));
    color:var(--color-text,#1a1d29);
    font-family:var(--font-inter-black,var(--font-inter,Inter,Arial,sans-serif));
    font-size:clamp(1.45rem,2.8vw,2.1rem);
    text-align:center;
    transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

.ak-otp-grid input:focus{
    border-color:var(--color-primary,#355cff);
    background:var(--color-white,#fff);
    box-shadow:0 0 0 6px color-mix(in srgb,var(--color-primary) 12%,transparent);
}

.ak-otp-back{
    justify-self:start;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--color-primary,#355cff);
    cursor:pointer;
    font-family:var(--font-inter-semi-bold,var(--font-inter,Inter,Arial,sans-serif));
}

.ak-otp-back img{
    filter:brightness(0) saturate(100%) invert(35%) sepia(97%) saturate(4227%) hue-rotate(226deg) brightness(101%) contrast(101%);
}

.ak-otp-submit,
.ak-otp-resend{
    min-height:52px;
    padding:13px 26px;
    border-radius:999px;
    font-family:var(--font-inter-semi-bold,var(--font-inter,Inter,Arial,sans-serif));
    font-size:var(--fs-base,1rem);
    cursor:pointer;
}

.ak-otp-submit{
    border:1px solid var(--color-primary,#355cff);
    background:var(--color-primary,#355cff);
    color:var(--color-white,#fff);
}

.ak-otp-resend{
    border:1px solid color-mix(in srgb,var(--color-primary) 22%,transparent);
    background:var(--color-white,#fff);
    color:var(--color-primary,#355cff);
}

.ak-otp-resend:disabled{
    opacity:.55;
    cursor:not-allowed;
}

.ak-otp-response{
    min-height:20px;
    color:var(--color-danger,#ff3f69);
}

.dash-modal-card .ak-otp-template,
.account-delete-modal-card .ak-otp-template{
    border:0;
    box-shadow:none;
}

[data-ak-otp-lock-purpose].is-otp-global-locked{
    opacity:.55;
    cursor:not-allowed;
}

[data-ak-otp-global-countdown]{
    display:inline;
    margin-left:4px;
    white-space:nowrap;
    font-size:.85em;
}

@media (max-width:685px){
    .ak-otp-template{
        gap:16px;
        padding:22px 16px;
        border-radius:22px;
    }

    .ak-otp-icon{
        width:72px;
        height:72px;
    }

    .ak-otp-grid{
        grid-template-columns:repeat(6,minmax(0,1fr));
        gap:7px;
    }

    .ak-otp-grid input{
        height:58px;
        border-radius:14px;
    }
}

@media (prefers-reduced-motion:reduce){
    .ak-otp-grid input{
        transition:none;
    }
}