.component--base-skeleton{--inset-default:-.05em;--inset-overlap:-.15em;--background:var(--color-gray-3);--shimmer-background:#fff0;--shimmer-foreground:#ffffffbf;--inset:var(--inset-default);position:relative;overflow-x:hidden}.component--base-skeleton.is-overlay{block-size:calc(100% - var(--inset)*2);inline-size:calc(100% - var(--inset)*2);inset:var(--inset);position:absolute}.component--base-skeleton.has-overlap{--inset:var(--inset-overlap)}.component--base-skeleton .shape{background-color:var(--background)}@media (prefers-reduced-motion:no-preference){.component--base-skeleton .shape:before{background:linear-gradient(to right, var(--shimmer-background), var(--shimmer-foreground), var(--shimmer-background));content:"";width:50%;height:100%;animation-name:skeleton-loader-shine-animation;animation-duration:1s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute;left:0}}.component--base-skeleton .square{clip-path:inset(0 round .25rem)}.component--base-skeleton .box{clip-path:inset(0 round 1rem)}.component--base-skeleton .circle{clip-path:inset(0 round 1000rem)}.component--base-skeleton .line{background-color:var(--background);clip-path:inset(0 round 8px);position:relative;overflow:hidden}@media (prefers-reduced-motion:no-preference){.component--base-skeleton .line:before{background:linear-gradient(to right, var(--shimmer-background), var(--shimmer-foreground), var(--shimmer-background));content:"";width:50%;height:100%;animation-name:skeleton-loader-shine-animation;animation-duration:1s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute;left:0}}@keyframes skeleton-loader-shine-animation{0%{transform:translate(-90%)}to{transform:translate(200%)}}