.pattern-preview.clip-reveal-preview{display:grid;min-height:168px;padding:18px;place-items:center;overflow:hidden;isolation:isolate}.pattern-preview.clip-reveal-preview.pattern-preview--inspector{min-height:220px;padding:32px}.clip-reveal-card{position:relative;display:grid;width:min(100%,18rem);min-height:86px;overflow:hidden;border:1px solid color-mix(in srgb,var(--clip-accent-a) 32%,transparent);border-radius:16px;color:var(--clip-text);text-decoration:none;background:rgba(8,17,31,.92);box-shadow:0 18px 36px rgba(2,6,23,.3);isolation:isolate}.clip-reveal-preview--inspector .clip-reveal-card{width:min(100%,22rem);min-height:112px}.clip-reveal-card__base,.clip-reveal-card__panel{grid-area:1/1;display:grid;place-items:center;width:100%;height:100%}.clip-reveal-card__base{gap:.4rem}.clip-reveal-card__kicker{font-size:.66rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--clip-accent-a) 62%,white)}.clip-reveal-card__label,.clip-reveal-card__panel-label{font-size:.94rem;font-weight:850}.clip-reveal-card__panel{color:#04111f;background:linear-gradient(90deg,var(--clip-accent-a),var(--clip-accent-b));transition:-webkit-clip-path var(--clip-duration) cubic-bezier(.2,.8,.2,1);transition:clip-path var(--clip-duration) cubic-bezier(.2,.8,.2,1);transition:clip-path var(--clip-duration) cubic-bezier(.2,.8,.2,1),-webkit-clip-path var(--clip-duration) cubic-bezier(.2,.8,.2,1)}.clip-reveal-preview--inset .clip-reveal-card__panel{-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0)}.clip-reveal-preview--circle .clip-reveal-card__panel{-webkit-clip-path:circle(0 at var(--clip-origin) 50%);clip-path:circle(0 at var(--clip-origin) 50%)}.clip-reveal-preview--polygon .clip-reveal-card__panel{-webkit-clip-path:polygon(0 0,0 0,0 50%,0 100%,0 100%);clip-path:polygon(0 0,0 0,0 50%,0 100%,0 100%)}.clip-reveal-preview--inset .clip-reveal-card:is(:hover,:focus-visible) .clip-reveal-card__panel{-webkit-clip-path:inset(0 calc(100% - var(--clip-extent)) 0 0);clip-path:inset(0 calc(100% - var(--clip-extent)) 0 0)}.clip-reveal-preview--circle .clip-reveal-card:is(:hover,:focus-visible) .clip-reveal-card__panel{-webkit-clip-path:circle(var(--clip-extent) at var(--clip-origin) 50%);clip-path:circle(var(--clip-extent) at var(--clip-origin) 50%)}.clip-reveal-preview--polygon .clip-reveal-card:is(:hover,:focus-visible) .clip-reveal-card__panel{-webkit-clip-path:polygon(0 0,var(--clip-poly-stop) 0,100% 50%,var(--clip-poly-stop) 100%,0 100%);clip-path:polygon(0 0,var(--clip-poly-stop) 0,100% 50%,var(--clip-poly-stop) 100%,0 100%)}.clip-reveal-card:focus-visible{outline:2px solid var(--clip-accent-a);outline-offset:4px}.clip-reveal-preview:not(.pattern-preview--inspector) .clip-reveal-card__panel{animation-duration:2.8s;animation-timing-function:cubic-bezier(.45,0,.2,1);animation-iteration-count:infinite}.clip-reveal-preview:not(.pattern-preview--inspector).clip-reveal-preview--inset .clip-reveal-card__panel{animation-name:clipRevealInsetStage}.clip-reveal-preview:not(.pattern-preview--inspector).clip-reveal-preview--circle .clip-reveal-card__panel{animation-name:clipRevealCircleStage}.clip-reveal-preview:not(.pattern-preview--inspector).clip-reveal-preview--polygon .clip-reveal-card__panel{animation-name:clipRevealPolygonStage}@keyframes clipRevealInsetStage{0%,18%,to{-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0)}42%,72%{-webkit-clip-path:inset(0 calc(100% - var(--clip-extent)) 0 0);clip-path:inset(0 calc(100% - var(--clip-extent)) 0 0)}}@keyframes clipRevealCircleStage{0%,18%,to{-webkit-clip-path:circle(0 at var(--clip-origin) 50%);clip-path:circle(0 at var(--clip-origin) 50%)}42%,72%{-webkit-clip-path:circle(var(--clip-extent) at var(--clip-origin) 50%);clip-path:circle(var(--clip-extent) at var(--clip-origin) 50%)}}@keyframes clipRevealPolygonStage{0%,18%,to{-webkit-clip-path:polygon(0 0,0 0,0 50%,0 100%,0 100%);clip-path:polygon(0 0,0 0,0 50%,0 100%,0 100%)}42%,72%{-webkit-clip-path:polygon(0 0,var(--clip-poly-stop) 0,100% 50%,var(--clip-poly-stop) 100%,0 100%);clip-path:polygon(0 0,var(--clip-poly-stop) 0,100% 50%,var(--clip-poly-stop) 100%,0 100%)}}@media (prefers-reduced-motion:reduce){.clip-reveal-card__panel{transition-duration:0s}.clip-reveal-preview:not(.pattern-preview--inspector) .clip-reveal-card__panel{animation:none}.clip-reveal-preview--inset .clip-reveal-card__panel{-webkit-clip-path:inset(0 calc(100% - var(--clip-extent)) 0 0);clip-path:inset(0 calc(100% - var(--clip-extent)) 0 0)}.clip-reveal-preview--circle .clip-reveal-card__panel{-webkit-clip-path:circle(var(--clip-extent) at var(--clip-origin) 50%);clip-path:circle(var(--clip-extent) at var(--clip-origin) 50%)}.clip-reveal-preview--polygon .clip-reveal-card__panel{-webkit-clip-path:polygon(0 0,var(--clip-poly-stop) 0,100% 50%,var(--clip-poly-stop) 100%,0 100%);clip-path:polygon(0 0,var(--clip-poly-stop) 0,100% 50%,var(--clip-poly-stop) 100%,0 100%)}}