@layer m3-components{.m3-skeleton{--_c:var(--md-sys-color-surface-container-highest);--_loop:1.6s;--_hl:var(--lightningcss-light,color-mix(in srgb, var(--md-sys-color-surface-container-lowest) 70%, transparent))var(--lightningcss-dark,color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent));gap:var(--md-sys-space-2);width:100%;min-width:0;animation:m3-skeleton-in var(--md-sys-motion-dur-small) var(--md-sys-motion-effects) var(--_delay,0s) both;display:grid}.m3-skeleton__bar{border-radius:var(--md-sys-shape-corner-extra-small);background:var(--_c);height:12px;display:block;position:relative;overflow:hidden}.m3-skeleton__bar:after{content:"";background:linear-gradient(90deg,transparent,var(--_hl),transparent);animation:m3-skeleton-shimmer var(--_loop) linear infinite;position:absolute;inset:0;transform:translate(-100%)}.m3-skeleton[data-variant=rect]{height:120px;display:block}.m3-skeleton[data-variant=rect]>.m3-skeleton__bar{border-radius:var(--md-sys-shape-corner-medium);height:100%}.m3-skeleton[data-variant=circle]{width:var(--md-sys-size-avatar);height:var(--md-sys-size-avatar);flex:none;display:block}.m3-skeleton[data-variant=circle]>.m3-skeleton__bar{border-radius:var(--md-sys-shape-corner-full);height:100%}.m3-skeleton[data-variant=row]{gap:0}.m3-skeleton__row{-moz-column-gap:var(--md-sys-space-4);align-items:center;column-gap:var(--md-sys-space-4);min-height:var(--md-sys-size-table-row);padding-inline:var(--md-sys-space-4);display:grid}.m3-skeleton__row+.m3-skeleton__row{border-block-start:var(--md-sys-border-thin) solid var(--md-sys-color-outline-variant)}.m3-skeleton__cell{min-width:0;display:block}.m3-skeleton__avatar{height:var(--md-sys-size-avatar);border-radius:var(--md-sys-shape-corner-full)}@keyframes m3-skeleton-in{0%{opacity:0}to{opacity:1}}@keyframes m3-skeleton-shimmer{to{transform:translate(100%)}}@keyframes m3-skeleton-pulse{0%{opacity:.45}to{opacity:1}}:root[data-motion=reduce] .m3-skeleton__bar:after{display:none}:root[data-motion=reduce] .m3-skeleton__bar{animation:m3-skeleton-pulse var(--_loop) var(--md-sys-motion-effects) infinite alternate}@media (prefers-reduced-motion:reduce){:root:not([data-motion=expressive]) .m3-skeleton__bar:after{display:none}:root:not([data-motion=expressive]) .m3-skeleton__bar{animation:m3-skeleton-pulse var(--_loop) var(--md-sys-motion-effects) infinite alternate}}@media (forced-colors:active){.m3-skeleton__bar{opacity:.3;background:graytext}.m3-skeleton__bar:after{display:none}}}
