.item-control[data-astro-cid-ib4zf253]{border:1px solid color-mix(in oklch, var(--brand-blue) 24%, transparent);border-radius:var(--radius);corner-shape:var(--corner-shape);background:color-mix(in oklch, var(--surface) 88%, transparent);overflow:clip;&::details-content{block-size:0;transition:block-size .3s ease, content-visibility .3s ease allow-discrete;overflow:clip}&[open]::details-content{block-size:auto}&[open] summary[data-astro-cid-ib4zf253]{background:color-mix(in oklch, var(--brand-orange) 18%, var(--surface));&:after{content:"−"}}@media (prefers-reduced-motion:reduce){&::details-content{transition:none}}}summary[data-astro-cid-ib4zf253]{min-block-size:2.75rem;padding:var(--padding-sm) var(--padding);justify-content:space-between;align-items:center;gap:var(--gap-sm);cursor:pointer;list-style:none;display:flex;&::-webkit-details-marker{display:none}&:after{content:"+";inline-size:1rem;color:var(--brand-orange);font-weight:var(--fw-bold);text-align:center;flex:none}&:focus-visible{outline:2px solid var(--brand-blue);outline-offset:-2px}}.item-properties[data-astro-cid-ib4zf253]{color:color-mix(in oklch, var(--text) 72%, transparent);text-align:end;font-size:.875rem;line-height:1.2}.item-fields[data-astro-cid-ib4zf253]{padding:var(--padding);border-block-start:1px solid color-mix(in oklch, var(--brand-blue) 18%, transparent);gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid;& .lab-field:has([data-control=itemAlignSelf]),& .content-type,& .flex-presets,& .custom-flex-fields{grid-column:1/-1}& .flex-presets{min-inline-size:0;& [data-radio-group=itemFlexPreset]{inline-size:100%}}& .custom-flex-fields{gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid;&[hidden]{display:none}}@media (width<=30rem){grid-template-columns:minmax(0,1fr);& .lab-field:has([data-control=itemAlignSelf]){grid-column:auto}& .custom-flex-fields{grid-template-columns:minmax(0,1fr)}}}.item-actions[data-astro-cid-ib4zf253]{padding:0 var(--padding) var(--padding);justify-content:flex-end;display:flex;& button{min-block-size:2.5rem;padding:var(--padding-sm) var(--padding);border:var(--border);border-radius:var(--radius);corner-shape:var(--corner-shape);align-items:center;gap:var(--gap-sm);background:color-mix(in oklch, var(--brand-orange) 22%, var(--surface));color:var(--text);cursor:pointer;display:inline-flex;&:focus-visible{outline:2px solid var(--brand-blue);outline-offset:2px}&:disabled{opacity:.45;cursor:not-allowed}& svg{block-size:1rem;inline-size:1rem}}}[data-astro-cid-2gp6ueis][data-lab-root=flexbox]{& .lab-group-fields .inputs{gap:var(--gap);grid-template-columns:minmax(0,1fr);display:grid}& [data-radio-group]{inline-size:100%;min-inline-size:0}}.item-toolbar[data-astro-cid-2gp6ueis]{justify-content:space-between;align-items:center;gap:var(--gap);inline-size:100%;display:flex;& output{font-variant-numeric:tabular-nums;color:color-mix(in oklch, var(--text) 72%, transparent)}& button{min-block-size:2.5rem;padding:var(--padding-sm) var(--padding);border-radius:var(--radius);corner-shape:var(--corner-shape);background:var(--brand-blue);color:var(--on-brand-blue);font-weight:var(--fw-semibold);cursor:pointer;border:none;&:focus-visible{outline:2px solid var(--brand-orange);outline-offset:2px}&:disabled{opacity:.45;cursor:not-allowed}}}.separate-gap-controls[data-astro-cid-2gp6ueis]{gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid;&[hidden]{display:none}@media (width<=30rem){grid-template-columns:minmax(0,1fr)}}.item-controls[data-astro-cid-2gp6ueis]{gap:var(--gap-sm);inline-size:100%;display:grid}.preview-surface[data-astro-cid-2gp6ueis]{place-self:stretch stretch;min-inline-size:0;padding:clamp(.25rem,1vw,1rem)}.preview-board[data-astro-cid-2gp6ueis]{position:relative}.preview-flexbox[data-astro-cid-2gp6ueis]{z-index:1;box-sizing:border-box;border:1px solid color-mix(in oklch, var(--brand-blue) 55%, transparent);border-radius:calc(var(--radius) * 1.15);corner-shape:var(--corner-shape);background:repeating-linear-gradient(transparent 0 calc(1.5rem - 1px), color-mix(in oklch, var(--brand-blue) 12%, transparent) calc(1.5rem - 1px) 1.5rem), repeating-linear-gradient(90deg, transparent 0 calc(1.5rem - 1px), color-mix(in oklch, var(--brand-blue) 12%, transparent) calc(1.5rem - 1px) 1.5rem);background-color:var(--surface-strong);scrollbar-width:thin;scrollbar-color:var(--brand-orange) transparent;padding:clamp(.75rem,2vw,1.5rem);position:relative;overflow:auto;box-shadow:inset 0 0 0 1px oklch(100% 5.96046e-8 none/.1),0 1.5rem 3rem oklch(0% none none/.16)}[data-lab-root=flexbox] [data-preview] [data-flexbox-preview-item]{z-index:1;border:1px solid color-mix(in oklch, var(--brand-blue) 55%, transparent);border-radius:calc(var(--radius) * .75);corner-shape:var(--corner-shape);background:color-mix(in oklch, var(--brand-blue) 48%, var(--surface));min-block-size:3.5rem;min-inline-size:3.5rem;color:var(--on-brand-blue);font-size:clamp(1rem,.8rem + .5vw,1.35rem);font-weight:var(--fw-bold);align-content:center;place-items:center;gap:.15rem;padding:0;transition:background-color .2s,flex-basis .25s,flex-grow .25s,flex-shrink .25s;display:grid;position:relative;box-shadow:inset 0 0 0 1px oklch(100% 5.96046e-8 none/.16),0 .45rem 1rem oklch(0% none none/.14)}[data-lab-root=flexbox] [data-flexbox-preview-item]:is(:hover,:focus-within){background:color-mix(in oklch, var(--brand-orange) 72%, var(--surface));color:var(--on-brand-orange)}[data-lab-root=flexbox] [data-preview] [data-edit-flexbox-item]{block-size:100%;min-block-size:3.5rem;inline-size:100%;padding:var(--padding-sm);color:inherit;cursor:pointer;background:0 0;border:0;place-items:center;display:grid;&:focus-visible{outline:2px solid var(--brand-orange);outline-offset:-3px}}[data-lab-root=flexbox] [data-preview] [data-remove-preview-flexbox-item]{z-index:2;border-radius:calc(var(--radius) * .6);opacity:0;background:var(--brand-orange);block-size:1.5rem;inline-size:1.5rem;color:var(--on-brand-orange);box-shadow:var(--shadow-full);cursor:pointer;border:0;place-items:center;padding:0;transition:opacity .2s,transform .2s;display:grid;position:absolute;inset-block-start:.25rem;inset-inline-end:.25rem;transform:scale(.85);& svg{block-size:1rem;inline-size:1rem}&:focus-visible{opacity:1;outline:2px solid var(--text);outline-offset:2px;transform:scale(1)}&:disabled{cursor:not-allowed;opacity:.4}@media (any-hover:none){opacity:1;transform:scale(1)}}[data-lab-root=flexbox] [data-flexbox-preview-item]:is(:hover,:focus-within) [data-remove-preview-flexbox-item]{opacity:1;transform:scale(1)}.preview-add-item[data-astro-cid-2gp6ueis]{z-index:3;min-block-size:2.5rem;padding:var(--padding-sm) var(--padding);border-radius:var(--radius);corner-shape:var(--corner-shape);align-items:center;gap:var(--gap-sm);background:var(--brand-blue);color:var(--on-brand-blue);box-shadow:var(--shadow-full);font-weight:var(--fw-semibold);cursor:pointer;border:0;display:inline-flex;position:absolute;inset-block-end:var(--gap);inset-inline-end:var(--gap);&:focus-visible{outline:2px solid var(--brand-orange);outline-offset:2px}&:disabled{opacity:.45;cursor:not-allowed}}[data-lab-root=flexbox] [data-preview] [data-flexbox-preview-item][data-content-type=text]{font-size:.875rem;font-weight:var(--fw-regular);text-align:center;overflow-wrap:anywhere;line-height:1.35}@media (width<=40rem){.preview-surface[data-astro-cid-2gp6ueis]{padding:0}.preview-flexbox[data-astro-cid-2gp6ueis]{padding:var(--padding-sm)}}