.oi{--oi-pink:#ffb2b2;--oi-red:#c8443c}.oi-plate{border:1px solid var(--line);background:#fff;position:relative;overflow:hidden}.oi-plate img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}html.js .oi-plate:not(.is-live) img{transform:scale(1.03)}.oi-plate:before{content:"";pointer-events:none;background-image:linear-gradient(to right, color-mix(in srgb, var(--line) 55%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in srgb, var(--line) 55%, transparent) 1px, transparent 1px);opacity:.55;background-size:32px 32px;position:absolute;inset:0}.oi-callout{pointer-events:none;border-radius:9999px;position:absolute;transform:translate(-50%,-50%)}.oi-callout:after{content:"";border:1.5px solid color-mix(in srgb, var(--oi-red) 45%, transparent);opacity:0;border-radius:9999px;transition:opacity .5s .2s;position:absolute;inset:0}.is-live .oi-callout:after{opacity:1}.oi-ping{border:2px solid var(--oi-red);opacity:0;border-radius:9999px;position:absolute;inset:0}.is-live .oi-ping{animation:2.6s cubic-bezier(.16,.8,.3,1) infinite oi-ping;animation-delay:var(--oi-delay,0s)}.is-live .oi-ping.oi-ping-2{animation-delay:calc(var(--oi-delay,0s) + .7s)}@keyframes oi-ping{0%{opacity:0;transform:scale(.55)}12%{opacity:.85}70%{opacity:0;transform:scale(2.1)}to{opacity:0;transform:scale(2.1)}}.oi-rail-line{background:var(--line);width:1px;position:absolute;top:0;left:0}.oi-rail-fill{background:var(--foreground);width:1px;transition:height .45s cubic-bezier(.2,.7,.2,1);position:absolute;top:0;left:0}.oi-rail-item{transition:color .35s,opacity .35s}.oi-rail-dot{transition:transform .35s cubic-bezier(.2,.7,.2,1),background-color .35s,border-color .35s}.oi-swap{animation:.45s cubic-bezier(.2,.7,.2,1) both oi-swap-in}@keyframes oi-swap-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.oi-seg-thumb{transition:transform .4s cubic-bezier(.3,.9,.25,1),width .4s cubic-bezier(.3,.9,.25,1)}.oi-progress{transform-origin:0;transition:transform .12s linear}.oi-num{font-variant-numeric:tabular-nums;transition:color .5s,opacity .5s}.is-live .oi-float{animation:6s ease-in-out infinite oi-float}@keyframes oi-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (prefers-reduced-motion:reduce){.oi-plate img,html.js .oi-plate:not(.is-live) img{transition:none;transform:none}.is-live .oi-ping,.is-live .oi-float,.oi-swap{animation:none}.is-live .oi-ping{opacity:.7;transform:scale(1.25)}.oi-rail-fill,.oi-progress,.oi-seg-thumb{transition:none}}@media print{.oi-noprint{display:none!important}.oi{--oi-red:#fe0000}.oi-step{break-inside:avoid;page-break-inside:avoid}.oi-plate:before{display:none}.oi-plate{border-color:#bbb}.oi-sticky-print-reset,.oi-step>div>div:first-child{position:static!important}}
