@layer component{.home-landing-section.home-ugc{display:flex;flex-direction:column;gap:var(--spacing-home-landing-header-to-media)}.home-ugc-track{display:flex;gap:var(--spacing-xl);list-style:none;margin:0;box-sizing:border-box;width:100%;padding-block:0;padding-inline:var(--spacing-xl);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--spacing-xl);scrollbar-width:none;-webkit-overflow-scrolling:touch}.home-ugc-track::-webkit-scrollbar{display:none}.home-ugc-card:first-child{margin-inline-start:auto}.home-ugc-card:last-child{margin-inline-end:auto}.home-ugc-card{position:relative;flex:0 0 240px;aspect-ratio:9/16;border:1px solid var(--stroke);border-radius:var(--radius-xl);corner-shape:squircle;background-color:var(--alt-surface);overflow:hidden;scroll-snap-align:center}@media (min-width:1024px){.home-ugc-card{flex-basis:320px}.home-ugc-track{scroll-snap-type:x proximity}}.home-ugc-card__media,.home-ugc-card__video{position:absolute;inset:0}.home-ugc-card__video{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.home-ugc-card__toggle{position:absolute;inset:0;z-index:5;margin:0;padding:0;border:0;background:transparent;cursor:pointer;border-radius:inherit}.home-ugc-card__toggle:focus-visible{outline:2px solid var(--interactive-text);outline-offset:-2px}.home-ugc-card__meta{position:absolute;inset-inline:0;bottom:0;z-index:2;display:flex;flex-direction:column;gap:var(--spacing-sm);padding:var(--spacing-xl);padding-top:calc(3 * var(--spacing-xl));background:linear-gradient(180deg,transparent 0,color-mix(in srgb,var(--inverted-surface) 78%,transparent) 100%);color:var(--text-on-inverted-surface);pointer-events:none}.home-ugc-card__quote{line-height:1.4;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.home-ugc-card__byline,.home-ugc-card__quote{margin:0;font-family:var(--font-body);font-size:var(--font-size-body-small)}.home-ugc-card__byline{font-weight:var(--font-heavy)}.home-ugc-card__handle{font-weight:var(--font-normal);opacity:.8}.home-ugc-card__sound{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);z-index:4;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--inverted-surface) 55%,transparent);color:var(--text-on-inverted-surface);pointer-events:none}.home-ugc-card__sound svg{width:16px;height:16px}.home-ugc-card__sound-on{display:none}[data-ugc-sound=on] .home-ugc-card__sound-on{display:block}[data-ugc-sound=on] .home-ugc-card__sound-off{display:none}.home-ugc-card__play{position:absolute;top:50%;left:50%;translate:-50% -50%;z-index:3;width:56px;height:56px;border-radius:50%;display:none;place-items:center;background:var(--surface);border:1px solid var(--stroke);color:var(--text);pointer-events:none}.home-ugc-card__play svg{width:20px;height:20px;display:block;margin-left:2px}.home-ugc-card--placeholder .home-ugc-card__play{display:grid}@media (prefers-reduced-motion:reduce){.home-ugc-card--video:not([data-ugc-consent=true]) .home-ugc-card__play{display:grid}}.home-ugc-card--pink{--ugc-weak:var(--weak-branded-surface);--ugc-strong:var(--strong-branded-surface)}.home-ugc-card--purple{--ugc-weak:var(--alt-weak-branded-surface-01);--ugc-strong:var(--alt-strong-branded-surface-01)}.home-ugc-card--yellow{--ugc-weak:var(--alt-weak-branded-surface-02);--ugc-strong:var(--alt-strong-branded-surface-02)}.home-ugc-card__poster{position:absolute;inset:0;background:linear-gradient(170deg,var(--ugc-weak) 0,var(--ugc-strong) 145%)}.home-ugc-blob{position:absolute;top:20%;left:50%;translate:-50%;width:46%;aspect-ratio:49/48;height:auto}.home-ugc-blob__side{opacity:.45}.home-ugc-blob__side,.home-ugc-blob__top{fill:var(--ugc-strong)}.home-ugc-card__caption{position:absolute;inset-inline:0;bottom:0;display:flex;flex-direction:column;gap:var(--spacing-xs);padding:var(--spacing-xl);text-align:center;color:var(--text)}.home-ugc-card__caption-title{margin:0;font-family:var(--font-display);font-size:var(--font-size-body-regular);font-weight:var(--font-heavy)}.home-ugc-card__caption-hint{margin:0;font-family:var(--font-body);font-size:var(--font-size-body-small)}}