/* Individual transforms preserve the existing open/closed icon rotations. */
.action-icon{--icon-x:0px;--icon-y:0px;--icon-turn:0deg;--icon-scale:1.14;transform-origin:center;transition:translate .22s,rotate .22s,scale .22s,filter .22s}
.action-icon:not(svg){display:inline-block}
.scroll-cue>.action-icon,.back-top-link>.action-icon{display:grid}
.action-icon[data-icon-motion=arrow]{--icon-x:3px;--icon-y:-3px}
.action-icon[data-icon-motion=down]{--icon-y:3px}
.action-icon[data-icon-motion=up]{--icon-y:-3px}
.action-icon[data-icon-motion=next]{--icon-x:3px}
.action-icon[data-icon-motion=previous]{--icon-x:-3px}
.action-icon[data-icon-motion=lift]{--icon-y:-2px}
.action-icon[data-icon-motion=twist]{--icon-turn:12deg}
.action-icon[data-icon-motion=pulse]{--icon-scale:1.2}
.action-control:focus-visible .action-icon,.compact-select:focus-within .select-chevron{
  translate:var(--icon-x) var(--icon-y);rotate:var(--icon-turn);scale:var(--icon-scale);
  filter:drop-shadow(0 0 5px color-mix(in srgb,currentColor 28%,transparent));
}
@media(hover:hover) and (pointer:fine){
  .action-control:not(:disabled):not([aria-disabled=true]):hover .action-icon{
    translate:var(--icon-x) var(--icon-y);rotate:var(--icon-turn);scale:var(--icon-scale);
    filter:drop-shadow(0 0 5px color-mix(in srgb,currentColor 28%,transparent));
    animation:none;
  }
}
.action-control:not(:disabled):active .action-icon{scale:.94;translate:0 0}
.brand-tile>span.brand-action-icon{position:absolute;top:7px;right:7px;display:grid;place-items:center;width:24px;height:24px;margin:0;padding:0;font-size:16px;line-height:1;color:var(--lime);background:transparent}
.compact-select{position:relative}
.compact-select select{appearance:none;-webkit-appearance:none;padding-right:38px}
.compact-select select:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.select-chevron{position:absolute;right:14px;top:50%;width:16px;height:16px;transform:translateY(-50%);pointer-events:none;fill:none;stroke:var(--lime);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dialog-close{display:grid;place-items:center;min-width:44px;min-height:44px;border-radius:50%}
@keyframes action-icon-invite{
  0%,65%,100%{translate:0 0;rotate:0deg;scale:1;filter:none}
  77%{translate:var(--icon-x) var(--icon-y);rotate:var(--icon-turn);scale:var(--icon-scale);filter:drop-shadow(0 0 5px color-mix(in srgb,currentColor 25%,transparent))}
  90%{translate:0 0;rotate:0deg;scale:1;filter:none}
}
@media(max-width:760px),(hover:none) and (pointer:coarse){
  .action-control.is-action-visible .action-icon{animation:action-icon-invite 3.8s ease-in-out var(--action-delay,0s) infinite}
  .action-control:is(:disabled,[aria-disabled=true],[aria-expanded=true],[aria-pressed=true],:focus-visible,:active) .action-icon,
  details[open]>.action-control .action-icon,.compact-select:focus-within .select-chevron{animation:none}
}
@media(max-width:760px){
  .site-header .shop-cta{min-width:60px;gap:5px;padding-inline:10px}
  .site-header .shop-cta>svg{display:block;width:14px;height:14px}
}
@media(max-width:360px){.site-header .shop-cta{min-width:56px;gap:4px;padding-inline:8px}}
.actions-page-hidden .action-icon{animation-play-state:paused!important}
body.motion-paused .action-icon{animation:none!important;translate:0 0!important;rotate:0deg!important;scale:1!important;transition:none}
@media(prefers-reduced-motion:reduce){
  .action-icon{animation:none!important;translate:0 0!important;rotate:0deg!important;scale:1!important;transition:none}
}
