.milk-breadcrumb {
    display: flex !important;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: .42rem !important;
    margin: 0 0 .8rem !important;
    padding: .55rem .75rem !important;
    border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent) !important;
    border-radius: 12px !important;
    background: color-mix(in srgb, var(--bg-card-inner) 92%, transparent) !important;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--accent-primary) 8%, transparent) !important;
    color: var(--text-main) !important;
    font-size: .66rem !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: .01em !important;
    text-transform: none !important;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}

.milk-breadcrumb a {
    color: var(--accent-primary) !important;
    font-weight: 900 !important;
    text-decoration: none !important;
}

.milk-breadcrumb a:hover,
.milk-breadcrumb a:focus-visible {
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

.milk-breadcrumb strong,
.milk-breadcrumb b {
    color: var(--text-main) !important;
    font-weight: 900 !important;
}

.milk-breadcrumb > span[aria-hidden="true"] {
    color: var(--accent-primary) !important;
    font-weight: 900 !important;
}

@media (max-width: 520px) {
    .milk-breadcrumb {
        gap: .32rem !important;
        padding: .5rem .62rem !important;
        font-size: .62rem !important;
    }
}