:root{--breakpoint-s:30rem;--breakpoint-m:48rem;--breakpoint-l:64rem;--breakpoint-xl:80rem;--breakpoint-2xl:120rem}.dashboard{gap:var(--space-s);grid-template-columns:1fr;grid-auto-rows:minmax(18rem,1fr);display:grid}@media (min-width:30rem){.dashboard{grid-template-columns:1fr 1fr}}@media (min-width:64rem){.dashboard{max-height:40rem;min-height:var(--min-height,0);grid-template-rows:repeat(2,minmax(9rem,1fr));grid-template-columns:repeat(4,1fr)}.dashboard[data-count="3"]{grid-template-columns:repeat(3,1fr)}}.dashboard.span-full{padding-inline:var(--space-s)}@media (min-width:30rem){.dashboard.span-full{padding-inline:var(--space-l)}}.dashboard .box.box--has-background header{z-index:3}.dashboard .box.box--has-background .box__image,.dashboard .box.box--has-background picture{z-index:1;object-fit:cover;pointer-events:none;width:100%;height:100%;margin:0;position:absolute;top:0;left:0}:is(.dashboard .box.box--has-background .box__image,.dashboard .box.box--has-background picture) img{object-fit:cover;object-position:var(--object-position,center);width:100%;height:100%}.dashboard .box.box--has-background span{max-width:50ch}.dashboard .box.box--has-background .button:not(:hover):not(:focus-visible){border-color:var(--color-neutral-1000);background-color:#0000}.dashboard .box,.dashboard .box.box--square{aspect-ratio:auto;width:auto}@media (min-width:64rem){:is(.dashboard .box,.dashboard .box.box--square):first-child{grid-row:span 2}}@media (min-width:30rem){.dashboard[data-count="2"]{grid-template-rows:repeat(2,1fr)}:is(.dashboard[data-count="1"],.dashboard[data-count="5"]) .box:last-child{grid-column:span 2}}@media (max-width:64rem){.dashboard[data-count="3"] .box:last-child{grid-column:span 2}}@media (min-width:64rem){.dashboard[data-count="1"] .box{grid-area:span 2/span 4}.dashboard[data-count="2"] .box{grid-area:span 2/span 2}.dashboard[data-count="3"] .box{grid-area:span 2/span 1}.dashboard[data-count="4"] .box:first-child,.dashboard[data-count="4"] .box:last-child{grid-column:span 2}.dashboard[data-count="5"] .box:first-child{grid-column:span 1}.dashboard[data-count="5"] .box:nth-child(4){grid-row:span 2}.dashboard[data-count="5"] .box:last-child{grid-column:span 2}}
