.site-header.header-shadow { box-shadow: 0 5px 18px -6px rgb(0 0 0 / var(--header-shadow-opacity, 12%)); }

#cart-dialog.cart-entry-effect[open] {
    animation: cart-side-in var(--cart-motion-duration, 380ms) cubic-bezier(.22, 1, .36, 1) both;
}
#cart-dialog.cart-entry-effect[open]::backdrop {
    animation: cart-backdrop-in var(--cart-motion-duration, 380ms) ease-out both;
}
.cart-added-dialog.cart-added-entry-effect[open] {
    animation: cart-confirmation-in var(--added-motion-duration, 420ms) cubic-bezier(.22, 1, .36, 1) both;
}
.cart-added-dialog.cart-added-entry-effect[open]::backdrop {
    animation: cart-backdrop-in var(--added-motion-duration, 420ms) ease-out both;
}
#menu-dialog.menu-entry-effect[open] {
    animation: menu-side-in var(--menu-motion-duration, 380ms) cubic-bezier(.22, 1, .36, 1) both;
}
#menu-dialog.menu-entry-effect[open]::backdrop {
    animation: cart-backdrop-in var(--menu-motion-duration, 380ms) ease-out both;
}
.search-panel.search-entry-effect[open] {
    animation: search-panel-in var(--search-motion-duration, 320ms) cubic-bezier(.22, 1, .36, 1) both;
}
.search-panel.search-entry-effect[open]::backdrop {
    animation: cart-backdrop-in var(--search-motion-duration, 320ms) ease-out both;
}
@keyframes menu-side-in {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}
@keyframes search-panel-in {
    from { opacity: 0; transform: translateY(var(--search-entry-offset, -28px)); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes cart-side-in {
    from { transform: translateX(-100%); }
    to { transform: translateX(0); }
}
@keyframes cart-confirmation-in {
    from { opacity: 0; transform: translateY(var(--added-entry-offset, 56px)); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes cart-backdrop-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
@media (max-width: 600px) {
    .cart-added-dialog.cart-added-entry-effect { --added-entry-offset: calc(100% + 16px); }
}
@media (max-width: 700px) {
    .search-panel.search-entry-effect { --search-entry-offset: calc(-100% - 8px); }
}
html.a11y-motion #cart-dialog.cart-entry-effect,
html.a11y-motion #cart-dialog.cart-entry-effect::backdrop,
html.a11y-motion #menu-dialog.menu-entry-effect,
html.a11y-motion #menu-dialog.menu-entry-effect::backdrop,
html.a11y-motion .search-panel.search-entry-effect,
html.a11y-motion .search-panel.search-entry-effect::backdrop,
html.a11y-motion .cart-added-dialog.cart-added-entry-effect,
html.a11y-motion .cart-added-dialog.cart-added-entry-effect::backdrop { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
    #cart-dialog.cart-entry-effect, #cart-dialog.cart-entry-effect::backdrop,
    #menu-dialog.menu-entry-effect, #menu-dialog.menu-entry-effect::backdrop,
    .search-panel.search-entry-effect, .search-panel.search-entry-effect::backdrop,
    .cart-added-dialog.cart-added-entry-effect, .cart-added-dialog.cart-added-entry-effect::backdrop { animation: none !important; }
}