.media-layout{gap:10px;width:100%;display:grid}.media-layout-tile{background:hsl(var(--muted));border-radius:12px;min-width:0;min-height:0;position:relative;overflow:hidden}.media-layout-open{text-align:left;width:100%;height:100%;display:block;position:relative;overflow:hidden}.media-layout-open img{-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;width:100%;height:100%;transition:transform .35s}.media-layout-open:hover img{transform:scale(1.025)}.media-layout button:focus-visible,.media-layout-carousel-main:focus-visible{outline:3px solid hsl(var(--ring));outline-offset:3px}.media-layout button:disabled{opacity:.4}.media-layout-overflow{color:#fff;background:#16222d99;justify-content:center;align-items:center;font-size:clamp(1.5rem,4vw,3rem);font-weight:700;display:flex;position:absolute;inset:0}.media-layout-herothumbs{aspect-ratio:1;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr}.media-layout-herothumbs .media-layout-tile-0{grid-area:span 2/span 2}.media-layout-herothumbs[data-count="1"]{grid-template-columns:1fr}.media-layout-herothumbs[data-count="1"] .media-layout-tile-0{grid-area:auto}.media-layout-herothumbs[data-count="2"],.media-layout-herothumbs[data-count="3"]{aspect-ratio:3/2}.media-layout-herothumbs[data-count="2"] .media-layout-tile-1{grid-row:span 2}.media-layout-herothumbs[data-count="4"] .media-layout-tile-3{grid-column:span 3}.media-layout-herothumbs[data-count="5"] .media-layout-tile-4{grid-column:span 2}.media-layout-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.media-layout-grid .media-layout-tile{aspect-ratio:4/3}.media-layout-grid[data-count="1"]{grid-template-columns:1fr}.media-layout-grid[data-count="2"],.media-layout-grid[data-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}.media-layout-mosaic{aspect-ratio:8/5;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr}.media-layout-mosaic .media-layout-tile-0{grid-area:span 2/span 2}.media-layout-mosaic .media-layout-tile-2{grid-area:1/4/span 2}.media-layout-mosaic[data-count="1"]{aspect-ratio:1;grid-template-columns:1fr}.media-layout-mosaic[data-count="1"] .media-layout-tile-0{grid-area:auto}.media-layout-mosaic[data-count="2"] .media-layout-tile-1{grid-area:span 2/span 2}.media-layout-mosaic[data-count="3"] .media-layout-tile-1,.media-layout-mosaic[data-count="3"] .media-layout-tile-2{grid-area:auto/3/auto/span 2}.media-layout-mosaic[data-count="4"] .media-layout-tile-1{grid-column:3}.media-layout-mosaic[data-count="4"] .media-layout-tile-3{grid-area:2/3}.media-layout-mosaic[data-count="5"],.media-layout-mosaic[data-count="6"],.media-layout-mosaic[data-count="7"],.media-layout-mosaic[data-count="8"]{grid-template-rows:1fr 1fr .85fr}.media-layout-mosaic[data-count="5"] .media-layout-tile-4{grid-column:span 4}.media-layout-mosaic[data-count="6"] .media-layout-tile-4,.media-layout-mosaic[data-count="6"] .media-layout-tile-5,.media-layout-mosaic[data-count="7"] .media-layout-tile-6{grid-column:span 2}.media-layout-carousel{grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:center}.media-layout-carousel-main{touch-action:pan-y;grid-area:1/1;min-width:0;position:relative}.media-layout-carousel-main .media-layout-tile{aspect-ratio:4/5}.media-layout-carousel:not(:has(.media-layout-strip)){grid-template-columns:minmax(0,1fr);max-width:640px;margin:auto}.media-layout-video{-o-object-fit:cover;object-fit:cover;background:#000;width:100%;height:100%}.media-layout-counter,.media-layout-duration,.media-layout-expand{color:#fff;background:#17212bcc;border-radius:5px;padding:3px 7px;font-size:12px;position:absolute}.media-layout-counter{pointer-events:none;top:10px;right:10px}.media-layout-duration{pointer-events:none;bottom:10px;right:10px}.media-layout-expand{top:10px;left:10px}.media-layout-play{color:#fff;background:#17212baa;border-radius:50%;padding:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.media-layout-arrows{pointer-events:none;justify-content:space-between;display:flex;position:absolute;top:50%;left:6px;right:6px}.media-layout-arrows button{background:hsl(var(--background));pointer-events:auto;border-radius:50%;padding:8px;box-shadow:0 2px 8px #0003}.media-layout-dots{flex-wrap:wrap;grid-column:1;justify-content:center;display:flex}.media-layout-dots button{place-items:center;min-width:24px;height:28px;display:grid}.media-layout-dots span{background:hsl(var(--muted-foreground));opacity:.4;border-radius:50%;width:6px;height:6px}.media-layout-dots [aria-current] span{opacity:1;background:hsl(var(--primary))}.media-layout-strip{grid-area:1/2;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.media-layout-strip button{aspect-ratio:1;background:hsl(var(--muted));border-radius:10px;position:relative;overflow:hidden}.media-layout-strip img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.media-layout-strip-play{color:#fff;fill:currentColor;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media (width<=639px){.media-layout{gap:6px}.media-layout-herothumbs{aspect-ratio:auto;grid-template-rows:auto 80px;grid-template-columns:repeat(5,minmax(0,1fr));overflow-x:auto}.media-layout-herothumbs .media-layout-tile-0{aspect-ratio:1;grid-area:1/1/auto/-1}.media-layout-herothumbs .media-layout-tile:not(:first-child){grid-area:2}.media-layout-herothumbs[data-count="1"]{grid-template-rows:auto}.media-layout-herothumbs[data-count="2"],.media-layout-herothumbs[data-count="3"]{aspect-ratio:auto}.media-layout-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.media-layout-grid[data-count="3"] .media-layout-tile-0{grid-column:span 2}.media-layout-carousel{grid-template-columns:minmax(0,1fr)}.media-layout-strip{grid-area:3/1;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.media-layout-tile{border-radius:8px}.media-layout-strip .media-layout-duration{padding:1px 3px;font-size:10px;bottom:3px;right:3px}}@media (prefers-reduced-motion:reduce){.media-layout-open img{transition:none}.media-layout-open:hover img{transform:none}}