/* Employment summary links: immediate lift with a slower, clipped icon zoom. */
.modern-dashboard .summary-grid > .summary-card {
    --card-lift-curve: linear(0, 0.094 5.6%, 0.274 11.1%, 0.455 16.7%, 0.608 22.2%, 0.726 27.8%, 0.812 33.3%, 0.873 38.9%, 0.916 44.4%, 0.944 50%, 0.964 55.6%, 0.976 61.1%, 0.985 66.7%, 0.99 72.2%, 0.994 77.8%, 0.996 83.3%, 0.998 88.9%, 1 100%);
    color: inherit;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(16,24,40,.06), 0 4px 8px rgba(16,24,40,.06);
    transform: translateY(0);
    /* Remove the entrance animation so it cannot delay or override pointer-in. */
    animation: none;
    transition: transform 587ms cubic-bezier(.2,.8,.2,1), box-shadow 587ms cubic-bezier(.2,.8,.2,1);
    transition: transform 587ms var(--card-lift-curve), box-shadow 587ms var(--card-lift-curve);
}

.modern-dashboard .summary-grid > .summary-card:is(:hover, :focus-within) {
    transform: translateY(-10px);
    box-shadow: 0 2px 4px rgba(16,24,40,.06), 0 22px 38px rgba(16,24,40,.16);
}

.modern-dashboard .summary-grid > .summary-card:focus-visible {
    outline: 3px solid var(--dash-primary, #0f766e);
    outline-offset: 4px;
}

.modern-dashboard .summary-visual-frame {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 24px;
    height: 24px;
    overflow: hidden;
    border-radius: 8px;
}

.modern-dashboard .summary-visual-frame.is-people {
    width: 34px;
    height: 34px;
    border-radius: 11px;
}

.modern-dashboard .summary-visual-frame > :is(.summary-icon, .summary-dot, img) {
    flex: none;
    transform: scale(1);
    transition: transform 700ms cubic-bezier(.32,.72,0,1);
}

.modern-dashboard .summary-card:is(:hover, :focus-within) .summary-visual-frame > :is(.summary-icon, .summary-dot, img) {
    transform: scale(1.1);
}

html[data-theme="dark"] .page:not(.login-only-layout) .modern-dashboard .summary-grid > .summary-card {
    box-shadow: 0 1px 2px rgba(0,0,0,.18), 0 4px 8px rgba(0,0,0,.2);
}

html[data-theme="dark"] .page:not(.login-only-layout) .modern-dashboard .summary-grid > .summary-card:is(:hover, :focus-within) {
    box-shadow: 0 2px 4px rgba(0,0,0,.2), 0 22px 38px rgba(0,0,0,.4);
}

@media (prefers-reduced-motion: reduce) {
    .modern-dashboard .summary-grid > .summary-card,
    .modern-dashboard .summary-visual-frame > :is(.summary-icon, .summary-dot, img) {
        animation: none;
        transition: none;
    }
}