/* V3 editorial modules. CSS caps the grid itself, keeping adjacent tiles aligned. */
.yk-bento{container:yk-bento / inline-size;--bento-vh:100vh;--bento-gap:clamp(8px,.75vw,14px);display:grid;gap:var(--bento-gap);min-width:0;width:100%;max-width:calc(2*var(--bento-vh));margin-inline:auto}
.yk-bento-band{--cols:var(--m-cols);--cap:var(--m-cap);display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-auto-rows:min(calc((100cqw - (var(--cols) - 1)*var(--bento-gap))/var(--cols)),calc((var(--bento-vh) - (var(--cap) - 1)*var(--bento-gap) - 2px)/var(--cap)));gap:var(--bento-gap);min-width:0}
.yk-bento-tile{grid-column:var(--m-x) / span var(--m-w);grid-row:var(--m-y) / span var(--m-h);position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:0;border-radius:clamp(9px,1.2vw,19px);background:var(--yk-deep,#163d2c)}
.yk-bento-tile>img,.yk-bento-tile>video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.yk-bento-tile:focus-within{outline:2px solid var(--yk-gold,#edb733);outline-offset:2px}
@supports(height:100dvh){.yk-bento{--bento-vh:100dvh}}
@container yk-bento (min-width:540px){
    .yk-bento-band{--cols:var(--t-cols);--cap:var(--t-cap)}
    .yk-bento-tile{grid-column:var(--t-x) / span var(--t-w);grid-row:var(--t-y) / span var(--t-h)}
}
@container yk-bento (min-width:920px){
    .yk-bento-band{--cols:var(--d-cols);--cap:var(--d-cap)}
    .yk-bento-tile{grid-column:var(--d-x) / span var(--d-w);grid-row:var(--d-y) / span var(--d-h)}
}
/* Older browsers retain a readable source-ordered square grid. */
@supports not (container-type:inline-size){
    .yk-bento-band{grid-auto-rows:auto}
    .yk-bento-tile{grid-column:auto;grid-row:auto;aspect-ratio:1;max-height:100vh}
}
