.workbench[data-astro-cid-5mhzz7x5]{gap:var(--gap-sm);grid-template-rows:auto minmax(0,1fr);block-size:100%;min-block-size:0;inline-size:100%;min-inline-size:0;display:grid}.selector-readout[data-astro-cid-5mhzz7x5]{min-inline-size:0;padding:var(--padding-sm) var(--padding);gap:var(--gap-sm);border-radius:calc(var(--radius) * .65);corner-shape:var(--corner-shape);background:color-mix(in oklch, var(--surface) 88%, transparent);box-shadow:var(--shadow-full);display:grid;& .selector-line,& .selector-expression,& .badges{flex-wrap:wrap;align-items:baseline;display:flex}& .selector-line{justify-content:space-between;gap:var(--gap-sm) var(--gap)}& .selector-expression,& .badges{gap:var(--gap-sm)}& .selector-expression>span[data-astro-cid-5mhzz7x5]{color:var(--text-muted);font-size:1rem;font-weight:var(--fw-semibold)}& .selector-expression code{overflow-wrap:anywhere;min-inline-size:0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}& .badges{justify-content:flex-end;& span{background:var(--surface-strong);color:var(--text);font-size:.875rem;font-weight:var(--fw-semibold);border-radius:999px;padding:.2rem .55rem}& .specificity-badge{background:color-mix(in oklch, var(--brand-blue) 14%, var(--surface-strong));gap:.35rem;display:inline-flex;& strong{color:var(--brand-blue);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:800}}}& .status,& .selector-description{text-wrap:pretty;margin:0}& .status{color:var(--text-muted)}& .selector-description{color:var(--text-muted);font-size:1rem}}[data-selector-state=matched] .status[data-astro-cid-5mhzz7x5]{color:var(--success)}[data-selector-state=invalid] .status[data-astro-cid-5mhzz7x5]{color:var(--danger)}[data-selector-state=not-evaluable] .status[data-astro-cid-5mhzz7x5]{color:var(--warning)}.workbench[data-astro-cid-5mhzz7x5]:is([data-selector-state=matched],[data-selector-state=no-match]) [data-astro-cid-5mhzz7x5][data-selector-support]{background:color-mix(in oklch, var(--success) 18%, var(--surface-strong));color:var(--success)}.workbench[data-astro-cid-5mhzz7x5][data-selector-state=not-evaluable] [data-astro-cid-5mhzz7x5][data-selector-support]{background:color-mix(in oklch, var(--warning) 20%, var(--surface-strong));color:var(--warning)}.preview-panel[data-astro-cid-5mhzz7x5]{border-radius:calc(var(--radius) * .75);corner-shape:var(--corner-shape);background:color-mix(in oklch, var(--surface) 82%, transparent);min-block-size:0;min-inline-size:0;box-shadow:var(--shadow-full);overflow:hidden}.preview-viewport[data-astro-cid-5mhzz7x5]{overscroll-behavior:contain;scrollbar-width:thin;block-size:100%;min-block-size:20rem;inline-size:100%;position:relative;overflow:auto}.scenario[data-astro-cid-5mhzz7x5]{min-block-size:100%;min-inline-size:100%;padding:var(--padding);position:relative}.overlays[data-astro-cid-5mhzz7x5]{z-index:3;pointer-events:none;position:absolute;inset:0 auto auto 0;& .match-overlay{border:3px solid var(--brand-orange);border-radius:calc(var(--radius) * .35);corner-shape:var(--corner-shape);background:color-mix(in oklch, var(--brand-orange) 16%, transparent);box-shadow:0 0 0 2px color-mix(in oklch, var(--surface) 82%, transparent);position:absolute}}.selector-specificity-popover{z-index:20;max-inline-size:min(22rem,100vw - 2rem);padding:var(--padding-sm);gap:calc(var(--gap-sm) / 2);border:1px solid color-mix(in oklch, var(--text) 18%, transparent);border-radius:calc(var(--radius) * .45);corner-shape:var(--corner-shape);background:var(--surface-strong);color:var(--text);box-shadow:var(--shadow-full);pointer-events:none;font-size:.875rem;display:grid;position:fixed;&[hidden]{display:none}& .specificity-popover-heading{justify-content:space-between;align-items:baseline;gap:var(--gap);font-weight:var(--fw-semibold);display:flex}& .specificity-popover-tuple{color:var(--brand-blue);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:800}& .specificity-popover-columns{color:var(--text-muted);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.875rem}}[data-selector-specificity-trigger]{cursor:help;border-radius:.2rem;&:focus-visible{outline:2px solid var(--link);outline-offset:2px}}@media (width<=40rem){.preview-viewport[data-astro-cid-5mhzz7x5]{min-block-size:17rem}}@media (forced-colors:active){.preview-panel[data-astro-cid-5mhzz7x5],.selector-readout[data-astro-cid-5mhzz7x5]{border:1px solid canvastext}}
