.bento{background:color-mix(in srgb, currentColor 8%, transparent);border-radius:.75rem;flex-wrap:wrap;gap:.75rem;padding:.75rem;display:flex;container-type:inline-size}.bento__cell{color:#fff;border-radius:.75rem;height:120px;position:relative;overflow:hidden}.bento__cell--wide{aspect-ratio:3}.bento__cell--banner{aspect-ratio:2}.bento__cell--landscape{aspect-ratio:3/2}.bento__cell--standard{aspect-ratio:4/3}.bento__cell--square{aspect-ratio:1}.bento__cell--portrait{aspect-ratio:2/3}@container (width<=520px){.bento__cell--wide,.bento__cell--banner,.bento__cell--landscape,.bento__cell--portrait,.bento__cell--standard{aspect-ratio:1}}.bento__meta{text-shadow:0 1px 3px #0000004d;flex-direction:column;display:flex;position:absolute;bottom:.7rem;left:.85rem}.bento__value{font-size:1.25rem;font-weight:700;line-height:1.1}.bento__label{opacity:.9;font-size:.8rem}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{margin:0;line-height:1.5}.demo{max-width:960px;margin:0 auto;padding:2rem 5rem 4rem}.demo header{margin-bottom:2rem}.demo h1{margin:0 0 .5rem}.demo h2{margin:0 0 .25rem}.demo section{margin-top:2.5rem}.demo section>p{color:color-mix(in srgb, currentColor 65%, transparent);margin:0 0 1rem}.demo code{background:color-mix(in srgb, currentColor 12%, transparent);border-radius:.25rem;padding:.1em .35em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}.demo figure{width:100%;height:100%;margin:0;position:relative}.demo figcaption{color:#fff;background:linear-gradient(#0000,#000000a6);padding:.4rem .6rem;font-size:.85rem;position:absolute;bottom:0;left:0;right:0}.balance-toggle{align-items:center;gap:.5rem;margin:0 0 1rem;display:inline-flex}.demo-form{border:1px solid color-mix(in srgb, currentColor 20%, transparent);border-radius:.5rem;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem;margin:0 0 1rem;padding:1rem;display:flex}.demo-form .control{align-items:center;gap:.5rem;display:flex}.demo-form .control-label{font-weight:600}.demo-form .control-value{font-variant-numeric:tabular-nums;min-width:2.5rem;color:color-mix(in srgb, currentColor 65%, transparent)}.playground-snippet{margin:0 0 1.5rem}.playground-stage{margin-inline:auto}.demo-controls{margin:0 0 1rem}.demo-controls button{font:inherit;border:1px solid color-mix(in srgb, currentColor 35%, transparent);background:color-mix(in srgb, currentColor 8%, transparent);color:inherit;cursor:pointer;border-radius:.4rem;padding:.35rem .8rem}.demo-controls button:hover{background:color-mix(in srgb, currentColor 16%, transparent)}._image-grid_1y4mr_1{--_row-height:var(--row-height,140px);--_gap:var(--gap,.5rem);gap:var(--_gap);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}._image-grid_1y4mr_1 li{height:var(--_row-height);overflow:hidden}._image-grid_1y4mr_1 li img{object-fit:cover;width:auto;min-width:100%;height:100%;max-height:100%}