.button-group[data-v-4a75f37d]{--orientation: row;display:flex;flex-flow:row wrap;flex-flow:var(--orientation) wrap}.button-group .button[data-v-4a75f37d]{margin:5px}.button-group--grouped[data-v-4a75f37d] .button{margin:0;border-radius:0}.button-group--grouped[data-v-4a75f37d] .button:first-child{border-top-left-radius:4px;border-top-left-radius:var(--radius-default);border-bottom-left-radius:4px;border-bottom-left-radius:var(--radius-default)}.button-group--grouped[data-v-4a75f37d] .button:last-child{border-top-right-radius:4px;border-top-right-radius:var(--radius-default);border-bottom-right-radius:4px;border-bottom-right-radius:var(--radius-default)}.button-group--vertical[data-v-4a75f37d]{--orientation: column}.gallery[data-v-48632cd6]{display:grid;grid-template-columns:repeat(6,1fr);grid-template-columns:repeat(var(--gallery-columns, 6),1fr);grid-gap:10px;margin-top:10px}.image[data-v-48632cd6]{background-color:#5540bf;border-radius:4px;border-radius:var(--radius-default);max-width:400px}.image img[data-v-48632cd6]{-o-object-fit:cover;object-fit:cover;margin:0}.button svg[data-v-48632cd6]{width:16px}.shades[data-v-a08db177]{--h: 360;--s: 50%;--l: 50%;--hex: #bf4040;display:flex;flex-wrap:wrap;margin-top:20px;gap:10px}.box[data-v-a08db177]{--base-10: hsl(var(--h) var(--s) calc(var(--l) + 5%));--base-20: hsl(var(--h) var(--s) calc(var(--l) + 15%));--base-30: hsl(var(--h) var(--s) calc(var(--l) + 25%));--base-40: hsl(var(--h) var(--s) calc(var(--l) + 35%));--base-50: hsl(var(--h) var(--s) calc(var(--l) + 45%));--base-60: hsl(var(--h) var(--s) calc(var(--l) + 55%));--color-space: hsl(var(--h) var(--s) var(--l)) display: block;background-color:var(--color-space);border-radius:4px;border-radius:var(--radius-default);width:60px;height:60px}label[data-v-a08db177]{--label-size: 36px;border-radius:50%;border:1px solid #fff;width:36px;width:var(--label-size);height:36px;height:var(--label-size);display:flex;justify-content:center;align-items:center}input[type=color][data-v-a08db177]{visibility:hidden;position:absolute}@supports (color: hsl(from white h s l)){.box[data-v-a08db177]{--base-10: oklch(from var(--hex) 75% c h);--base-20: oklch(from var(--hex) 65% c h);--base-30: oklch(from var(--hex) 45% c h);--base-40: oklch(from var(--hex) 35% c h);--base-50: oklch(from var(--hex) 25% c h);--base-60: oklch(from var(--hex) 20% c h)}}.interactive-wrapper[data-v-799c3169]{border:1px solid rgb(108,118,147);border:1px solid var(--color-silver);padding:.7rem;margin:1rem 0;border-radius:4px;border-radius:var(--radius-default);position:relative}.interactive-wrapper span[data-v-799c3169]{text-transform:uppercase;color:#6c7693;color:var(--color-silver);font-size:.875rem;font-size:var(--text-sm);font-family:Source Code Pro,SF Mono,consolas,menlo,monospace;font-family:var(--font-mono);font-weight:700;font-weight:var(--fw-bold);background:#1a1c1f;background:var(--color-light, var(--color-default-black));position:absolute;top:-10px;padding:0 10px}.theme-control[data-v-b9ea54bf]{border:1px solid rgba(0,0,0,.1);border:var(--border);border-radius:4px;border-radius:var(--radius-default)}.preview-body[data-v-b9ea54bf]{--v-text-color: hsl(0, 0%, 19%);--v-bg-color: hsl(0, 0%, 96%);--v-accent-color: hsl(240, 76%, 67%);--v-font: var(--font-sans);padding:1.2rem 2rem;background:#f5f5f5;background:var(--v-bg-color);color:#303030;color:var(--v-text-color);border-radius:4px;border-radius:var(--radius-default);margin-top:10px}[data-v-theme=dark][data-v-b9ea54bf]{--v-text-color: hsl(0, 0%, 100%);--v-bg-color: hsl(0, 0%, 0%);--v-accent-color: hsl(145, 63%, 49%);--v-font: var(--font-mono)}[data-v-theme=spacegray][data-v-b9ea54bf]{--v-text-color: hsl(0, 0%, 100%);--v-bg-color: hsl(210, 28%, 29%);--v-accent-color: hsl(33, 66%, 49%)}[data-v-theme=warm][data-v-b9ea54bf]{--v-bg-color: hsl(37, 90%, 91%);--v-accent-color: hsl(196, 97%, 49%);--v-text-color: hsl(35, 9%, 37%);--v-font: var(--font-serif)}.card[data-v-b9ea54bf]{font-family:var(--v-font)}.card button[data-v-b9ea54bf]{--v-button-padding: 8px 16px;padding:8px 16px;padding:var(--v-button-padding);background-color:var(--v-accent-color)}