.dynamics-seal-host{position:relative;display:inline-flex;align-items:center;isolation:isolate}
.dynamics-seal-mark{overflow:hidden;position:relative;transition:border-color .22s ease,box-shadow .22s ease,background .22s ease}
.dynamics-seal-mark::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid transparent;border-top-color:rgba(197,19,25,.72);opacity:0;transform:rotate(-35deg);pointer-events:none}
.dynamics-seal-mark img{display:block;width:18px;height:18px;object-fit:contain;opacity:.72;transform:translateY(.2px) rotate(0);transition:opacity .22s ease,transform .28s cubic-bezier(.2,.7,.2,1),filter .22s ease}

.dynamics-seal--interactive{position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:opacity .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s ease,background .22s ease}
.dynamics-seal--interactive:hover,.dynamics-seal--interactive.is-open{opacity:1;border-color:rgba(197,19,25,.22);background:rgba(255,255,255,.94);box-shadow:0 8px 24px rgba(18,18,18,.06);transform:translateY(-1px)}
.dynamics-seal--interactive:hover .dynamics-seal-mark,.dynamics-seal--interactive.is-open .dynamics-seal-mark,.dynamics-seal--interactive.is-holding .dynamics-seal-mark{border-color:rgba(197,19,25,.48);background:rgba(197,19,25,.025);box-shadow:0 0 0 3px rgba(197,19,25,.035)}
.dynamics-seal--interactive:hover .dynamics-seal-mark img,.dynamics-seal--interactive.is-open .dynamics-seal-mark img,.dynamics-seal--interactive.is-holding .dynamics-seal-mark img{opacity:.96;transform:translateY(.2px) rotate(5deg) scale(1.04);filter:saturate(1.08)}
.dynamics-seal--interactive.is-holding{opacity:1;border-color:rgba(197,19,25,.30);box-shadow:0 8px 24px rgba(18,18,18,.06),0 0 0 2px rgba(197,19,25,.035)}
.dynamics-seal--interactive.is-holding .dynamics-seal-mark::after{opacity:1;animation:dynamicsHoldSweep 5s linear forwards}
.dynamics-seal--interactive.is-open .dynamics-seal-mark::after{opacity:1;animation:dynamicsSealSweep .7s cubic-bezier(.2,.7,.2,1) 1}
.dynamics-seal--interactive:focus-visible{outline:2px solid rgba(197,19,25,.6);outline-offset:4px}

.dynamics-popover{position:absolute;z-index:30;left:50%;bottom:calc(100% + 12px);width:min(300px,calc(100vw - 32px));padding:17px 18px 16px;border:1px solid rgba(255,255,255,.11);border-radius:14px;background:linear-gradient(135deg,rgba(30,30,32,.82) 0%,rgba(42,39,42,.76) 56%,rgba(25,25,27,.80) 100%);box-shadow:0 18px 46px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055);backdrop-filter:blur(14px) saturate(112%);-webkit-backdrop-filter:blur(14px) saturate(112%);opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,8px) scale(.985);transform-origin:50% 100%;transition:opacity .2s ease,transform .22s cubic-bezier(.2,.7,.2,1),visibility .2s step-end;text-align:left;overflow:hidden}
.dynamics-popover::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.055) 0%,rgba(255,255,255,.018) 30%,transparent 58%);pointer-events:none}
.dynamics-popover::after{content:"";position:absolute;left:50%;bottom:-5px;width:9px;height:9px;background:rgba(31,30,32,.86);border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);transform:translateX(-50%) rotate(45deg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.dynamics-popover.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1);transition:opacity .2s ease,transform .22s cubic-bezier(.2,.7,.2,1),visibility 0s}
.dynamics-popover-kicker{position:relative;z-index:1;display:block;margin-bottom:5px;color:rgba(255,104,108,.94);font-size:8px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.dynamics-popover strong{position:relative;z-index:1;display:block;color:rgba(255,255,255,.96);font-family:"Barlow Condensed",Inter,sans-serif;font-size:21px;line-height:1;text-transform:uppercase}
.dynamics-popover p{position:relative;z-index:1;margin:9px 0 12px;color:rgba(237,237,237,.84);font-size:10.5px;line-height:1.55}
.dynamics-popover small{position:relative;z-index:1;display:block;padding-top:10px;border-top:1px solid rgba(255,255,255,.1);color:rgba(222,222,222,.62);font-size:7.5px;font-weight:700;letter-spacing:.12em;line-height:1.35;text-transform:uppercase}

@keyframes dynamicsHoldSweep{from{transform:rotate(-35deg)}to{transform:rotate(325deg)}}
@keyframes dynamicsSealSweep{from{transform:rotate(-35deg)}to{transform:rotate(325deg)}}

@media(max-width:640px){
  .dynamics-seal-mark img{width:17px;height:17px}
  .dynamics-popover{left:0;bottom:calc(100% + 10px);width:min(280px,calc(100vw - 30px));padding:16px 16px 15px;transform:translate(0,7px) scale(.985);transform-origin:0 100%}
  .dynamics-popover.is-open{transform:translate(0,0) scale(1)}
  .dynamics-popover::after{left:20px;transform:rotate(45deg)}
}

@media(prefers-reduced-motion:reduce){
  .dynamics-seal--interactive,.dynamics-seal-mark,.dynamics-seal-mark img,.dynamics-popover{transition:none}
  .dynamics-seal--interactive.is-holding .dynamics-seal-mark::after{animation-duration:5s}
  .dynamics-seal--interactive.is-open .dynamics-seal-mark::after{animation:none;opacity:.72}
}
