@layer component{.mediaCard{isolation:isolate;text-decoration:none;position:relative;overflow:clip}.mediaCard.flipped{border:var(--border-md)solid var(--border-tertiary)}.mediaCard.overlay .mediaCardMedia{position:absolute;inset:0}.mediaCard .mediaCardMedia img,.mediaCard .mediaCardMedia video{object-fit:cover;width:100%;height:100%;filter:var(--filter-img);transition:transform var(--time-xslow)var(--ease-out);position:absolute;inset:0}.mediaCard.overlay{color:var(--white)}.mediaCard.overlay .mediaCardMedia:after{content:"";background:linear-gradient(to top,color-mix(in oklch,var(--black)var(--alpha-primary),transparent)0%,color-mix(in oklch,var(--black)var(--alpha-secondary),transparent)10%,color-mix(in oklch,var(--black)var(--alpha-tertiary),transparent)19%,color-mix(in oklch,var(--black)var(--alpha-quaternary),transparent)27%,color-mix(in oklch,var(--black)var(--alpha-quaternary-i),transparent)37%,color-mix(in oklch,var(--black)var(--alpha-tertiary-i),transparent)46%,color-mix(in oklch,var(--black)var(--alpha-secondary-i),transparent)55%,color-mix(in oklch,var(--black)var(--alpha-primary-i),transparent)66%,transparent 80%);position:absolute;inset:0}.mediaCard.overlay .mediaCardBody{z-index:1;text-align:left;flex-direction:column;align-items:flex-start;display:flex;position:absolute;inset:auto auto 0 0}.mediaCard .mediaCardFoot{align-items:center;gap:var(--gap-xs);width:100%;display:flex}.mediaCard .mediaCardFoot>div{--tap-gap:calc(var(--tap-min) - var(--button-sm));align-items:center;gap:var(--tap-gap);margin-left:auto;display:flex}.mediaCard .mediaCardMark svg{fill:currentColor;stroke:none}.mediaCard.carouselCard{aspect-ratio:3/4;border-radius:calc((var(--button-md)/2) + (var(--inset)*2));width:300px}.mediaCard.carouselCard .mediaCardMedia:after{content:"";background:linear-gradient(180deg,transparent 0%,color-mix(in oklch,var(--black),transparent 50%)100%);position:absolute;inset:0}.mediaCard.carouselCard .mediaCardBody{max-width:min(38rem,84%);padding:calc(var(--inset)*2);gap:0}.mediaCard.carouselCard .mediaCardEyebrow{margin:0 0 var(--gap-xs)0;color:var(--text-primary-i);font-size:var(--text-sm);font-variation-settings:var(--body-variation-medium);letter-spacing:var(--tracking-wd)}.mediaCard.carouselCard .mediaCardTitle{color:var(--text-primary-i);font-size:var(--text-2xl)}.mediaCard.carouselCard .mediaCardText{margin:var(--gap-xs)0 0;max-width:30rem;color:var(--text-primary-i);font-size:var(--text-lg);line-height:var(--leading-md)}.mediaCard.carouselCard .mediaCardCta{margin-top:var(--gap-md)}.mediaCard .mediaCardControl{top:var(--gap-sm);right:var(--gap-sm);z-index:2;position:absolute}.mediaCard .mediaCardControl .icon{transition:rotate var(--time-base)ease}.mediaCard.flipped .mediaCardControl .icon{rotate:45deg}.mediaCard.overlay .mediaCardFaces{border-radius:inherit;transform-style:preserve-3d;transition:transform var(--time-2xslow)var(--ease-out);position:absolute;inset:0;transform:perspective(900px)rotateY(0)}.mediaCard.overlay.flipped .mediaCardFaces{transform:perspective(900px)rotateY(180deg)}.mediaCard.overlay .mediaCardFaces .mediaCardMedia,.mediaCard.overlay .mediaCardFaces .mediaCardTop,.mediaCard.overlay .mediaCardFaces .mediaCardBody{backface-visibility:hidden}.mediaCard.overlay .mediaCardFaces .mediaCardMedia,.mediaCard.overlay .mediaCardFaces .mediaCardBack{border-radius:inherit;overflow:clip}.mediaCard.overlay .mediaCardBack{z-index:1;justify-content:center;align-items:center;gap:var(--gap-xs);padding:var(--gap-lg);background:var(--surface-primary);color:var(--text-primary);backface-visibility:hidden;pointer-events:none;flex-direction:column;display:flex;position:absolute;inset:0;transform:rotateY(180deg)}.mediaCard.overlay .mediaCardFaces .mediaCardBack .mediaCardEyebrow{margin:0 auto var(--gap-xs)auto;width:fit-content;height:fit-content;color:var(--text-primary);font-variation-settings:var(--body-variation-medium-alt);font-size:var(--text-sm);letter-spacing:var(--tracking-xtght);line-height:var(--leading-sm);border:var(--border-md)solid var(--text-primary);border-radius:var(--radius-full);padding:.35em .7em}.mediaCard.overlay .mediaCardFaces .mediaCardBack .mediaCardTitle{color:var(--text-primary);font-variation-settings:var(--body-variation-semi-bold-alt);font-size:var(--text-lg);letter-spacing:var(--tracking-xtght);line-height:var(--leading-md)}.mediaCard.overlay .mediaCardMoreBody{font-variation-settings:var(--body-variation-medium);max-width:18ch;font-size:var(--text-md);letter-spacing:var(--tracking-md);line-height:var(--leading-xl);margin:0 auto}.mediaCard.overlay .mediaCardBack .mediaCardMoreCta{margin-top:var(--gap-xs)}.mediaCard.overlay.flipped .mediaCardBack{pointer-events:auto}.mediaCard.railCard.overlay{aspect-ratio:7/10;width:272px;margin-right:var(--gap-sm);border-radius:calc((var(--button-sm)/2) + var(--gap-sm));cursor:pointer}.mediaCard.railCard.overlay .mediaCardMedia{border-radius:inherit}.mediaCard.railCard.overlay .mediaCardMedia:after{content:"";background:linear-gradient(180deg,transparent 45%,color-mix(in oklch,var(--black),transparent 50%)100%);position:absolute;inset:0}.mediaCard.railCard.overlay .mediaCardBody{gap:calc(var(--inset)/2);padding:var(--gap-lg);inset:auto 0 0}.mediaCard.railCard.overlay .mediaCardEyebrow{color:color-mix(in oklch,var(--white),transparent 5%);font-size:var(--text-sm);font-variation-settings:var(--body-variation-medium-alt);letter-spacing:var(--tracking-md)}.mediaCard.railCard.overlay .mediaCardTitle{color:color-mix(in oklch,var(--white),transparent 5%);font-size:var(--text-lg);font-variation-settings:var(--body-variation-medium);letter-spacing:var(--tracking-xwd);line-height:var(--leading-md)}.mediaCard.railCard.overlay .mediaCardText{color:color-mix(in oklch,var(--white),transparent 14%)}.mediaCard.railCard.panel{gap:var(--gap-sm);width:21rem;margin-right:var(--gap-md);padding:var(--gap-sm);background-color:var(--surface-primary);border:var(--border-sm)solid var(--border-tertiary);border-radius:var(--radius-xl);color:inherit;text-align:left;flex-direction:column;display:flex}.mediaCard.railCard.panel .mediaCardMedia{aspect-ratio:4/3;border-radius:calc(var(--radius-xl) - var(--gap-sm));width:100%;position:relative;overflow:clip}.mediaCard.railCard.panel .mediaCardEyebrow{color:var(--text-tertiary);font-size:var(--text-sm);font-variation-settings:var(--body-variation-semi-bold);letter-spacing:var(--tracking-wd)}.mediaCard.railCard.panel .mediaCardTitle{font-size:var(--text-lg);font-variation-settings:var(--body-variation-semi-bold);letter-spacing:var(--tracking-2xtght);line-height:var(--leading-sm)}.mediaCard.railCard.panel .mediaCardText{color:var(--text-secondary);line-height:var(--leading-md)}.mediaCard.inviteCard{aspect-ratio:var(--ratio-lg);border-radius:calc((var(--button-sm)/2) + (var(--gap-xs)));cursor:pointer}.feedCarousel.square .mediaCard.inviteCard,.feedGrid.square .mediaCard.inviteCard{aspect-ratio:var(--ratio-sq)}.postsVideoGrid .mediaCard.inviteCard,.feedCarousel.tall .mediaCard.inviteCard{aspect-ratio:var(--ratio-xlg)}.mediaCard.inviteCard .mediaCardTop{inset:var(--inset)var(--inset)auto var(--inset);z-index:2;position:absolute}.mediaCard.inviteCard .mediaCardBody{align-items:stretch;gap:calc(var(--gap-xs)/1);padding:var(--inset);color:var(--text-primary-i);inset:auto 0 0}.mediaCard.inviteCard .mediaCardTitle{max-width:50%;color:var(--text-primary-i);font-variation-settings:var(--body-variation-medium);letter-spacing:var(--tracking-md);line-height:var(--leading-md);white-space:normal;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.mediaCard.inviteCard .mediaCardText{max-width:75%;color:var(--text-secondary-i);font-size:var(--text-sm);font-variation-settings:var(--body-variation-regular-alt);letter-spacing:var(--tracking-md);line-height:var(--leading-md);line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.mediaCard.inviteCard .mediaCardFoot{margin-top:var(--gap-sm)}:is(.feedCarousel,.feedGrid) .mediaCard.inviteWide{aspect-ratio:3/2;grid-column:span 2;height:auto}@media (min-width:768px){.mediaCard.carouselCard{width:var(--sheet-lg);aspect-ratio:3/2}}@media (hover:hover) and (pointer:fine){.mediaCard:hover .mediaCardMedia img{transform:scale(1.05)}}@media (prefers-reduced-motion:reduce){.mediaCard .mediaCardMedia img,.mediaCard.overlay .mediaCardFaces{transition:none}}@scope(.cardSheet){:scope{--sheet-panel-pad:calc(var(--inset)/2);--sheet-radius:calc((var(--button-lg)/2) + calc(var(--inset)/2))}:scope .sheetPanel .sheetWrapper{gap:calc(var(--inset))}.sheetAside{position:relative}:scope.sheet.fullscreen .sheetPanel>.sheetHeader{padding-top:var(--safe-top);box-shadow:none;pointer-events:auto;background-color:#0000;padding-bottom:0;position:static}:scope.sheet.fullscreen .sheetHeader .close{background-color:var(--fill-quaternary);box-shadow:none}.sheetAside{aspect-ratio:var(--ratio-sq);border-radius:var(--sheet-radius-inner);overflow:hidden}:scope .sheetAside img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.cardSheetText{width:100%;height:fit-content;padding:var(--inset);gap:var(--inset);flex-direction:column;display:flex;position:relative}.cardSheetEyebrow{margin-bottom:calc(var(--inset)/2);font-feature-settings:var(--font-features-body);font-variation-settings:var(--body-variation-bold);font-size:var(--text-md);letter-spacing:var(--tracking-md);line-height:var(--leading-sm)}:scope h3{font-feature-settings:var(--font-features-heading);font-variation-settings:var(--heading-variation-semi-bold-alt);max-width:12ch;font-size:var(--text-2xl);letter-spacing:var(--tracking-2xtght);line-height:var(--leading-sm)}.cardSheetText p{margin-top:var(--inset);font-variation-settings:var(--body-variation-medium);width:100%;max-width:26ch;font-size:var(--text-md);letter-spacing:var(--tracking-md);line-height:var(--leading-lg)}.cardSheetText ul{padding-left:var(--gap-md);font-variation-settings:var(--body-variation-medium);font-size:var(--text-md);letter-spacing:var(--tracking-md);line-height:var(--leading-lg);margin:0;list-style-type:disc}.cardSheetText ul li:not(:last-of-type){margin-bottom:.05em}.cardSheetActions{margin-top:var(--gap-xs);gap:var(--gap-xs);flex-flow:wrap;width:100%;height:fit-content;display:flex;position:relative}.cardSheetActions .btn{flex:1}.cardSheetActions .btn .text{padding-left:calc(var(--button-lg)*.75);padding-right:calc(var(--button-lg)*.75)}@media (min-width:768px){:scope.wide .sheetWrapper:has(>.sheetAside) .sheetAside{width:62.5%;aspect-ratio:var(--ratio-wd)}.cardSheetText{height:100%;padding-left:calc(var(--gap-xs)*2);padding-right:calc(var(--gap-xs)*2);justify-content:center}.cardSheetActions{margin-top:var(--inset)}.cardSheetActions .btn{flex:none}.cardSheetActions .btn .text{padding-left:var(--button-lg);padding-right:var(--button-lg)}:scope.sheet.fullscreen .sheetPanel>.sheetHeader{padding-top:var(--gap-sm);padding-bottom:var(--gap-sm);pointer-events:none;position:absolute}:scope.sheet.fullscreen .sheetHeader .close{background-color:var(--surface-primary);box-shadow:0 var(--gap-3xs)var(--gap-xs)var(--elevation-secondary)}}}}
