.x-card{border-radius:var(--card-border-radius);font-family:var(--default-font-family);font-weight:var(--font-weight-regular);text-align:start;box-sizing:border-box;padding-block-start:var(--card-padding-block-start, var(--card-padding));padding-block-end:var(--card-padding-block-end, var(--card-padding));padding-inline-start:var(--card-padding-inline-start, var(--card-padding));padding-inline-end:var(--card-padding-inline-end, var(--card-padding));font-style:normal;display:block;position:relative;overflow:hidden}.x-card:before,.x-card:after{content:"";pointer-events:none;border-radius:calc(var(--card-border-radius) - var(--card-border-width));inset:var(--card-border-width);transition:inherit;position:absolute}.x-card:before{z-index:-1}.x-card{contain:paint}.x-card,.x-card:where([data-size="3"]){--card-padding: var(--space-5);--card-border-radius: var(--radius-5)}.x-card:where([data-size="1"]){--card-padding: var(--space-3);--card-border-radius: var(--radius-4)}.x-card:where([data-size="2"]){--card-padding: var(--space-4);--card-border-radius: var(--radius-4)}.x-card:where([data-size="4"]){--card-padding: var(--space-6);--card-border-radius: var(--radius-5)}.x-card:where([data-size="5"]){--card-padding: var(--space-8);--card-border-radius: var(--radius-6)}:where(:root),:where([data-neutral]){--card-surface-box-shadow: 0 0 0 1px var(--neutral-a5);--card-surface-hover-box-shadow: 0 0 0 1px var(--neutral-a7);--card-surface-active-box-shadow: 0 0 0 1px var(--neutral-a6);--card-elevated-box-shadow-inner: 0 0 0 1px var(--neutral-a3), 0 0 0 1px transparent, 0 0 0 .5px var(--black-a1), 0 1px 1px 0 var(--neutral-a2), 0 2px 1px -1px var(--black-a1), 0 1px 3px 0 var(--black-a1);--card-elevated-box-shadow-outer: 0 0 0 0 var(--neutral-a3), 0 0 0 0 transparent, 0 0 0 0 var(--black-a1), 0 1px 1px -1px var(--neutral-a2), 0 2px 1px -2px var(--black-a1), 0 1px 3px -1px var(--black-a1);--card-elevated-hover-box-shadow-inner: 0 0 0 1px var(--neutral-a4), 0 1px 1px 1px var(--black-a1), 0 2px 1px -1px var(--neutral-a3), 0 2px 3px -2px var(--black-a1), 0 3px 12px -4px var(--neutral-a3), 0 4px 16px -8px var(--black-a1);--card-elevated-hover-box-shadow-outer: 0 0 0 0 var(--neutral-a4), 0 1px 1px 0 var(--black-a1), 0 2px 1px -2px var(--neutral-a3), 0 2px 3px -3px var(--black-a1), 0 3px 12px -5px var(--neutral-a3), 0 4px 16px -9px var(--black-a1);--card-elevated-active-box-shadow-inner: 0 0 0 1px var(--neutral-a3), 0 0 0 1px transparent, 0 0 0 .5px var(--black-a1), 0 1px 1px 0 var(--neutral-a4), 0 2px 1px -1px var(--black-a1), 0 1px 3px 0 var(--black-a1);--card-elevated-active-box-shadow-outer: 0 0 0 0 var(--neutral-a3), 0 0 0 0 transparent, 0 0 0 0 var(--black-a1), 0 1px 1px -1px var(--neutral-a4), 0 2px 1px -2px var(--black-a1), 0 1px 3px -1px var(--black-a1)}@supports (color: color-mix(in oklab,white,black)){:where(:root),:where([data-neutral]){--card-surface-box-shadow: 0 0 0 1px color-mix(in oklab, var(--neutral-a5), var(--neutral-5) 25%);--card-surface-hover-box-shadow: 0 0 0 1px color-mix(in oklab, var(--neutral-a7), var(--neutral-7) 25%);--card-surface-active-box-shadow: 0 0 0 1px color-mix(in oklab, var(--neutral-a6), var(--neutral-6) 25%)}}:is(.dark,.dark-theme),:is(.dark,.dark-theme) :where([data-neutral]:not(.light,.light-theme)){--card-elevated-box-shadow-inner: 0 0 0 1px var(--neutral-a6), 0 0 0 1px transparent, 0 0 0 .5px var(--black-a3), 0 1px 1px 0 var(--black-a6), 0 2px 1px -1px var(--black-a6), 0 1px 3px 0 var(--black-a5);--card-elevated-box-shadow-outer: 0 0 0 0 var(--neutral-a6), 0 0 0 0 transparent, 0 0 0 0 var(--black-a3), 0 1px 1px -1px var(--black-a6), 0 2px 1px -2px var(--black-a6), 0 1px 3px -1px var(--black-a5);--card-elevated-hover-box-shadow-inner: 0 0 0 1px var(--neutral-a6), 0 0 1px 1px var(--neutral-a4), 0 0 1px -1px var(--neutral-a4), 0 0 3px -2px var(--neutral-a3), 0 0 12px -2px var(--neutral-a3), 0 0 16px -8px var(--neutral-a7);--card-elevated-hover-box-shadow-outer: 0 0 0 0 var(--neutral-a6), 0 0 1px 0 var(--neutral-a4), 0 0 1px -2px var(--neutral-a4), 0 0 3px -3px var(--neutral-a3), 0 0 12px -3px var(--neutral-a3), 0 0 16px -9px var(--neutral-a7);--card-elevated-active-box-shadow-inner: 0 0 0 1px var(--neutral-a6), 0 0 0 1px transparent, 0 0 0 .5px var(--black-a3), 0 1px 1px 0 var(--black-a6), 0 2px 1px -1px var(--black-a6), 0 1px 3px 0 var(--black-a5);--card-elevated-active-box-shadow-outer: 0 0 0 0 var(--neutral-a6), 0 0 0 0 transparent, 0 0 0 0 var(--black-a3), 0 1px 1px -1px var(--black-a6), 0 2px 1px -2px var(--black-a6), 0 1px 3px -1px var(--black-a5)}.x-card,.x-card:where([data-variant=surface]){--card-border-width: 1px}:is(.x-card,.x-card:where([data-variant=surface])):before{background-color:var(--color-material, var(--color-surface));-webkit-backdrop-filter:var(--backdrop-filter-material, none);backdrop-filter:var(--backdrop-filter-material, none)}:is(.x-card,.x-card:where([data-variant=surface])):after{box-shadow:var(--card-surface-box-shadow)}@media(hover:hover){:is(.x-card,.x-card:where([data-variant=surface])):where(:any-link,button,label):where(:hover):after{box-shadow:var(--card-surface-hover-box-shadow)}}:is(.x-card,.x-card:where([data-variant=surface])):where(:any-link,button,label):where([data-state=open]):after{box-shadow:var(--card-surface-hover-box-shadow)}:is(.x-card,.x-card:where([data-variant=surface])):where(:any-link,button,label):where(:active:not([data-state=open])):after{box-shadow:var(--card-surface-active-box-shadow)}.x-card:where([data-variant=elevated]){--card-border-width: 1px;box-shadow:var(--card-elevated-box-shadow-outer);transition:box-shadow .12s}.x-card:where([data-variant=elevated]):before{background-color:var(--color-material, var(--color-surface));-webkit-backdrop-filter:var(--backdrop-filter-material, none);backdrop-filter:var(--backdrop-filter-material, none)}.x-card:where([data-variant=elevated]):after{box-shadow:var(--card-elevated-box-shadow-inner)}@media(hover:hover){.x-card:where([data-variant=elevated]):where(:any-link,button,label):where(:hover){box-shadow:var(--card-elevated-hover-box-shadow-outer);transition-duration:40ms}.x-card:where([data-variant=elevated]):where(:any-link,button,label):where(:hover):after{box-shadow:var(--card-elevated-hover-box-shadow-inner)}}.x-card:where([data-variant=elevated]):where(:any-link,button,label):where([data-state=open]){box-shadow:var(--card-elevated-hover-box-shadow-outer);transition-duration:40ms}.x-card:where([data-variant=elevated]):where(:any-link,button,label):where([data-state=open]):after{box-shadow:var(--card-elevated-hover-box-shadow-inner)}.x-card:where([data-variant=elevated]):where(:any-link,button,label):where(:active:not([data-state=open])){box-shadow:var(--card-elevated-active-box-shadow-outer);transition-duration:40ms}.x-card:where([data-variant=elevated]):where(:any-link,button,label):where(:active:not([data-state=open])):after{box-shadow:var(--card-elevated-active-box-shadow-inner)}.x-card:where([data-variant=borderless]){--card-border-width: 0px}.x-card:where([data-variant=borderless]):before{-webkit-backdrop-filter:none;backdrop-filter:none;background-color:#0000}.x-card:where([data-variant=borderless]):after{box-shadow:none}@media(hover:hover){.x-card:where([data-variant=borderless]):where(:any-link,button,label):where(:hover){background-color:var(--neutral-a3)}}.x-card:where([data-variant=borderless]):where(:any-link,button,label):where([data-state=open]){background-color:var(--neutral-a3)}.x-card:where([data-variant=borderless]):where(:any-link,button,label):where(:active:not([data-state=open])){background-color:var(--neutral-a4)}.x-card:where(:focus-visible){outline:2px solid var(--focus-8);outline-offset:-1px}.x-card:where(:focus-visible):after{outline:inherit}.x-card:where(:focus-visible):where(:active:not([data-state=open])):before{background-image:linear-gradient(var(--focus-a2),var(--focus-a2))}.x-card>[data-inset]{--inset-radius: calc(var(--card-border-radius) - var(--card-border-width));box-sizing:border-box;overflow:hidden}.x-card>[data-inset=top]{border-start-start-radius:var(--inset-radius);border-start-end-radius:var(--inset-radius);border-end-end-radius:0;border-end-start-radius:0;margin-block-start:calc(0px - var(--card-padding-block-start, var(--card-padding)) + var(--card-border-width));margin-inline-start:calc(0px - var(--card-padding-inline-start, var(--card-padding)) + var(--card-border-width));margin-inline-end:calc(0px - var(--card-padding-inline-end, var(--card-padding)) + var(--card-border-width))}.x-card>[data-inset=bottom]{border-start-start-radius:0;border-start-end-radius:0;border-end-end-radius:var(--inset-radius);border-end-start-radius:var(--inset-radius);margin-block-end:calc(0px - var(--card-padding-block-end, var(--card-padding)) + var(--card-border-width));margin-inline-start:calc(0px - var(--card-padding-inline-start, var(--card-padding)) + var(--card-border-width));margin-inline-end:calc(0px - var(--card-padding-inline-end, var(--card-padding)) + var(--card-border-width))}.x-card>[data-inset=start]{border-start-start-radius:var(--inset-radius);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--inset-radius);margin-block-start:calc(0px - var(--card-padding-block-start, var(--card-padding)) + var(--card-border-width));margin-block-end:calc(0px - var(--card-padding-block-end, var(--card-padding)) + var(--card-border-width));margin-inline-start:calc(0px - var(--card-padding-inline-start, var(--card-padding)) + var(--card-border-width))}.x-card>[data-inset=end]{border-start-start-radius:0;border-start-end-radius:var(--inset-radius);border-end-end-radius:var(--inset-radius);border-end-start-radius:0;margin-block-start:calc(0px - var(--card-padding-block-start, var(--card-padding)) + var(--card-border-width));margin-block-end:calc(0px - var(--card-padding-block-end, var(--card-padding)) + var(--card-border-width));margin-inline-end:calc(0px - var(--card-padding-inline-end, var(--card-padding)) + var(--card-border-width))}