@tulipfarm/sprout 0.3.1 → 0.5.0

package/dist/styles/table.css

@@ -10,16 +10,8 @@
   }
 
   .sprout-table {
-    --sprout-table-hover: color-mix(
-      in oklab,
-      var(--sprout-hover) 55%,
-      var(--sprout-surface)
-    );
-    --sprout-table-head-bg: color-mix(
-      in oklab,
-      var(--sprout-hover) 70%,
-      var(--sprout-surface)
-    );
+    --sprout-table-hover: color-mix(in oklab, var(--sprout-hover) 55%, var(--sprout-surface));
+    --sprout-table-head-bg: color-mix(in oklab, var(--sprout-hover) 70%, var(--sprout-surface));
     width: 100%;
     caption-side: bottom;
     border-collapse: collapse;
@@ -45,21 +37,21 @@
       background-color: var(--sprout-table-hover);
     }
   }
-  .sprout-table-row:has([aria-expanded="true"]),
+  .sprout-table-row:has([aria-expanded='true']),
   .sprout-table-row[data-interactive]:has(:focus-visible) {
     --sprout-table-row-bg: var(--sprout-table-hover);
     background-color: var(--sprout-table-hover);
   }
-  .sprout-table-row[data-state="selected"],
-  .sprout-table-body > .sprout-table-row[data-state="selected"]:hover {
+  .sprout-table-row[data-state='selected'],
+  .sprout-table-body > .sprout-table-row[data-state='selected']:hover {
     --sprout-table-row-bg: var(--sprout-primary-subtle);
     background-color: var(--sprout-primary-subtle);
   }
-  .sprout-table-row[data-state="selected"] > td:first-child {
+  .sprout-table-row[data-state='selected'] > td:first-child {
     position: relative;
   }
-  .sprout-table-row[data-state="selected"] > td:first-child::before {
-    content: "";
+  .sprout-table-row[data-state='selected'] > td:first-child::before {
+    content: '';
     position: absolute;
     inset-block: 0;
     inset-inline-start: 0;
@@ -88,10 +80,10 @@
     white-space: nowrap;
     text-align: start;
   }
-  .sprout-table-head[data-align="right"] {
+  .sprout-table-head[data-align='right'] {
     text-align: end;
   }
-  .sprout-table-cell[data-align="right"] {
+  .sprout-table-cell[data-align='right'] {
     text-align: end;
     font-variant-numeric: tabular-nums;
   }
@@ -117,7 +109,7 @@
   }
   .sprout-table-head[data-sticky-end]::before,
   .sprout-table-cell[data-sticky-end]::before {
-    content: "";
+    content: '';
     pointer-events: none;
     position: absolute;
     inset-block: 0;
@@ -132,33 +124,31 @@
     color: var(--sprout-muted);
   }
 
-  .sprout-table[data-variant="grid"] .sprout-table-row {
+  .sprout-table[data-variant='grid'] .sprout-table-row {
     border-color: var(--sprout-input);
   }
-  .sprout-table[data-variant="grid"] > .sprout-table-header {
+  .sprout-table[data-variant='grid'] > .sprout-table-header {
     position: sticky;
     top: 0;
     z-index: 10;
     background: var(--sprout-table-head-bg);
   }
-  .sprout-table[data-variant="grid"]
-    > .sprout-table-header
-    > .sprout-table-row {
+  .sprout-table[data-variant='grid'] > .sprout-table-header > .sprout-table-row {
     border-bottom: 0;
   }
-  .sprout-table[data-variant="grid"] .sprout-table-head {
+  .sprout-table[data-variant='grid'] .sprout-table-head {
     padding: 0 12px;
     box-shadow: inset 0 -1px var(--sprout-input);
   }
-  .sprout-table[data-variant="grid"] .sprout-table-cell {
+  .sprout-table[data-variant='grid'] .sprout-table-cell {
     padding: 10px 12px;
   }
-  .sprout-table[data-variant="grid"] .sprout-table-head,
-  .sprout-table[data-variant="grid"] .sprout-table-cell {
+  .sprout-table[data-variant='grid'] .sprout-table-head,
+  .sprout-table[data-variant='grid'] .sprout-table-cell {
     border-inline-end: 1px solid var(--sprout-input);
   }
-  .sprout-table[data-variant="grid"] .sprout-table-head:last-child,
-  .sprout-table[data-variant="grid"] .sprout-table-cell:last-child {
+  .sprout-table[data-variant='grid'] .sprout-table-head:last-child,
+  .sprout-table[data-variant='grid'] .sprout-table-cell:last-child {
     border-inline-end: 0;
   }
 
@@ -248,7 +238,7 @@
     align-items: center;
     gap: 4px;
   }
-  .sprout-table-head[data-align="right"] > .sprout-table-head-inner {
+  .sprout-table-head[data-align='right'] > .sprout-table-head-inner {
     flex-direction: row-reverse;
   }
   .sprout-table-hint,
@@ -273,11 +263,18 @@
     cursor: grab;
     touch-action: none;
   }
-  .sprout-table-handle + .sprout-button-size-column-header {
-    margin-inline-start: 0;
+  .sprout-button.sprout-table-sort {
+    margin-inline-start: -8px;
+    padding: 0 8px;
+    font-size: var(--sprout-text-sm);
+    line-height: 20px;
+  }
+  .sprout-button.sprout-table-sort-end {
+    flex-direction: row-reverse;
+    margin-inline: 0 -8px;
   }
-  .sprout-table-handle + .sprout-button-size-column-header-end {
-    margin-inline-end: 0;
+  .sprout-table-handle + .sprout-button.sprout-table-sort {
+    margin-inline: 0;
   }
   .sprout-table-handle:disabled {
     cursor: not-allowed;
@@ -305,7 +302,7 @@
     user-select: none;
   }
   .sprout-table-resizer::after {
-    content: "";
+    content: '';
     position: absolute;
     inset-block: 0;
     inset-inline-end: 2px;
@@ -338,16 +335,15 @@
     z-index: 20;
     background: var(--sprout-table-head-bg);
   }
-  .sprout-table-head[data-pinned="start"],
-  .sprout-table-cell[data-pinned="start"] {
+  .sprout-table-head[data-pinned='start'],
+  .sprout-table-cell[data-pinned='start'] {
     box-shadow: inset -1px 0 var(--sprout-input);
   }
-  .sprout-table-head[data-pinned="end"],
-  .sprout-table-cell[data-pinned="end"] {
+  .sprout-table-head[data-pinned='end'],
+  .sprout-table-cell[data-pinned='end'] {
     box-shadow: inset 1px 0 var(--sprout-input);
   }
-  .sprout-table[data-pin-start]
-    :is(.sprout-table-head, .sprout-table-cell)[data-selection] {
+  .sprout-table[data-pin-start] :is(.sprout-table-head, .sprout-table-cell)[data-selection] {
     position: sticky;
     z-index: 1;
     background: var(--sprout-table-row-bg, var(--sprout-surface));
@@ -410,7 +406,7 @@
     outline: none;
   }
   .sprout-table-link::after {
-    content: "";
+    content: '';
     position: absolute;
     inset: 0;
   }
@@ -424,21 +420,14 @@
     box-shadow: inset 0 0 0 var(--sprout-focus-width) var(--sprout-focus-ring);
   }
   .sprout-table-row[data-linked]
-    :is(
-      .sprout-table-handle,
-      [data-slot="checkbox"],
-      .sprout-table-toggle,
-      .sprout-table-hint
-    ),
+    :is(.sprout-table-handle, [data-slot='checkbox'], .sprout-table-toggle, .sprout-table-hint),
   .sprout-table-row[data-linked] > td[data-selection],
   .sprout-table-row[data-linked] > td[data-sticky-end] {
     position: relative;
     z-index: 10;
   }
   .sprout-table-row[data-linked] > td[data-sticky-end],
-  .sprout-table[data-pin-start]
-    .sprout-table-row[data-linked]
-    > td[data-selection] {
+  .sprout-table[data-pin-start] .sprout-table-row[data-linked] > td[data-selection] {
     position: sticky;
   }
   .sprout-table-row[data-drop-target] {
@@ -459,7 +448,7 @@
   .sprout-table-input {
     min-width: 6rem;
   }
-  .sprout-table-cell[data-align="right"] .sprout-table-input {
+  .sprout-table-cell[data-align='right'] .sprout-table-input {
     text-align: end;
   }
   .sprout-table-select {
@@ -519,27 +508,27 @@
 
   /* Stack layout: under 36rem each row becomes a card of label and value pairs. */
   @container sprout-table (width < 36rem) {
-    .sprout-table[data-narrow="stack"],
-    .sprout-table[data-narrow="stack"] > :is(thead, tbody, tfoot),
-    .sprout-table[data-narrow="stack"] .sprout-table-row,
-    .sprout-table[data-narrow="stack"] .sprout-table-cell {
+    .sprout-table[data-narrow='stack'],
+    .sprout-table[data-narrow='stack'] > :is(thead, tbody, tfoot),
+    .sprout-table[data-narrow='stack'] .sprout-table-row,
+    .sprout-table[data-narrow='stack'] .sprout-table-cell {
       display: block;
     }
-    .sprout-table[data-narrow="stack"] {
+    .sprout-table[data-narrow='stack'] {
       min-width: 0 !important;
     }
-    .sprout-table[data-narrow="stack"] > thead {
+    .sprout-table[data-narrow='stack'] > thead {
       position: absolute;
       width: 1px;
       height: 1px;
       overflow: hidden;
       clip-path: inset(50%);
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-row {
+    .sprout-table[data-narrow='stack'] .sprout-table-row {
       position: relative;
       padding: 10px 8px;
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-cell {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell {
       display: flex;
       gap: 12px;
       padding: 2px 0;
@@ -547,28 +536,24 @@
       text-align: start;
       overflow-wrap: anywhere;
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-cell[data-label]::before {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell[data-label]::before {
       content: attr(data-label);
       flex: 0 0 40%;
       color: var(--sprout-muted);
       font-weight: 400;
     }
-    .sprout-table[data-narrow="stack"]
-      .sprout-table-cell:first-of-type[data-label]::before,
-    .sprout-table[data-narrow="stack"]
-      .sprout-table-row[data-group]
-      .sprout-table-cell::before {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell:first-of-type[data-label]::before,
+    .sprout-table[data-narrow='stack'] .sprout-table-row[data-group] .sprout-table-cell::before {
       content: none;
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-cell:first-of-type {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell:first-of-type {
       font-weight: 500;
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-cell:empty,
-    .sprout-table[data-narrow="stack"]
-      .sprout-table-cell[data-selection]:empty {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell:empty,
+    .sprout-table[data-narrow='stack'] .sprout-table-cell[data-selection]:empty {
       display: none;
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-cell[data-selection] {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell[data-selection] {
       position: absolute;
       inset-block-start: 10px;
       inset-inline-start: auto;
@@ -576,20 +561,17 @@
       width: auto;
       min-width: 0;
     }
-    .sprout-table[data-narrow="stack"] .sprout-table-cell[data-sticky-end],
-    .sprout-table[data-narrow="stack"] .sprout-table-cell[data-pinned] {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell[data-sticky-end],
+    .sprout-table[data-narrow='stack'] .sprout-table-cell[data-pinned] {
       position: static;
       width: auto;
       background: none;
       box-shadow: none;
     }
-    .sprout-table[data-narrow="stack"]
-      .sprout-table-cell[data-sticky-end]::before {
+    .sprout-table[data-narrow='stack'] .sprout-table-cell[data-sticky-end]::before {
       content: none;
     }
-    .sprout-table[data-narrow="stack"]
-      .sprout-table-row[data-state="selected"]
-      > td:first-child::before {
+    .sprout-table[data-narrow='stack'] .sprout-table-row[data-state='selected'] > td:first-child::before {
       content: none;
     }
   }
@@ -597,8 +579,7 @@
   @media (prefers-reduced-motion: no-preference) {
     .sprout-table-row,
     .sprout-table-cell[data-sticky-end] {
-      transition: background-color var(--sprout-motion-fast)
-        var(--sprout-motion-ease);
+      transition: background-color var(--sprout-motion-fast) var(--sprout-motion-ease);
     }
   }
 }

package/dist/styles/tabs.css

@@ -5,7 +5,7 @@
     gap: 8px;
     min-width: 0;
   }
-  .sprout-tabs[data-orientation="vertical"] {
+  .sprout-tabs[data-orientation='vertical'] {
     flex-direction: row;
   }
 
@@ -17,20 +17,18 @@
     justify-content: center;
     box-sizing: border-box;
     width: fit-content;
-    height: 32px;
+    height: var(--sprout-control-height);
     padding: 3px;
     border-radius: calc(var(--sprout-radius-control) + 2px);
     color: var(--sprout-muted);
   }
-  .sprout-tabs-list[data-orientation="vertical"] {
+  .sprout-tabs-list[data-orientation='vertical'] {
     flex-direction: column;
     align-items: stretch;
     height: fit-content;
   }
   .sprout-tabs-list-default {
     gap: 2px;
-    height: 36px;
-    padding: 4px;
     border-radius: calc(var(--sprout-radius-control) + 4px);
     background: var(--sprout-secondary);
   }
@@ -54,7 +52,7 @@
     border-radius: 0;
     background: transparent;
   }
-  .sprout-tabs-list-steps[data-orientation="vertical"] {
+  .sprout-tabs-list-steps[data-orientation='vertical'] {
     justify-content: flex-start;
     width: fit-content;
     border-bottom: 0;
@@ -86,17 +84,17 @@
     user-select: none;
     -webkit-tap-highlight-color: transparent;
   }
-  .sprout-tabs-trigger:has(> [data-icon="inline-start"]) {
+  .sprout-tabs-trigger:has(> [data-icon='inline-start']) {
     padding-inline-start: 6px;
   }
-  .sprout-tabs-trigger:has(> [data-icon="inline-end"]) {
+  .sprout-tabs-trigger:has(> [data-icon='inline-end']) {
     padding-inline-end: 6px;
   }
   .sprout-tabs-trigger svg {
     flex-shrink: 0;
     pointer-events: none;
   }
-  .sprout-tabs-trigger svg:not([class*="size-"]) {
+  .sprout-tabs-trigger svg:not([class*='size-']) {
     width: 16px;
     height: 16px;
   }
@@ -119,7 +117,7 @@
 
   /* The underline for line and steps lists. */
   .sprout-tabs-trigger::after {
-    content: "";
+    content: '';
     position: absolute;
     inset-inline: 0;
     bottom: -3px;
@@ -128,12 +126,12 @@
     opacity: 0;
     pointer-events: none;
   }
-  .sprout-tabs-trigger[data-orientation="vertical"] {
+  .sprout-tabs-trigger[data-orientation='vertical'] {
     flex: none;
     width: 100%;
     justify-content: flex-start;
   }
-  .sprout-tabs-trigger[data-orientation="vertical"]::after {
+  .sprout-tabs-trigger[data-orientation='vertical']::after {
     inset-inline: auto -3px;
     inset-block: 0;
     bottom: 0;
@@ -156,9 +154,7 @@
       0 1px 2px rgb(0 0 0 / 0.3);
   }
   @media (prefers-color-scheme: dark) {
-    :root:not(.light):not(.dark)
-      .sprout-tabs-list-default
-      > .sprout-tabs-trigger[data-active] {
+    :root:not(.light):not(.dark) .sprout-tabs-list-default > .sprout-tabs-trigger[data-active] {
       border-color: color-mix(in oklab, var(--sprout-text) 16%, transparent);
       background: color-mix(in oklab, var(--sprout-text) 9%, transparent);
       box-shadow:
@@ -181,8 +177,7 @@
     bottom: -1px;
     background: var(--sprout-primary);
   }
-  .sprout-tabs-list-steps
-    > .sprout-tabs-trigger[data-orientation="vertical"]::after {
+  .sprout-tabs-list-steps > .sprout-tabs-trigger[data-orientation='vertical']::after {
     inset-inline: auto -1px;
     bottom: 0;
   }
@@ -216,8 +211,7 @@
         box-shadow var(--sprout-motion-fast, 120ms) ease-out;
     }
     .sprout-tabs-trigger::after {
-      transition: opacity var(--sprout-motion-normal, 180ms)
-        var(--sprout-motion-ease, ease-out);
+      transition: opacity var(--sprout-motion-normal, 180ms) var(--sprout-motion-ease, ease-out);
     }
   }
 }

package/dist/styles/textarea.css

@@ -36,16 +36,16 @@
     background-color: var(--sprout-hover);
     opacity: 0.5;
   }
-  .sprout-textarea[aria-invalid="true"] {
+  .sprout-textarea[aria-invalid='true'] {
     border-color: var(--sprout-danger);
   }
-  .sprout-textarea[aria-invalid="true"]:focus-visible {
+  .sprout-textarea[aria-invalid='true']:focus-visible {
     outline-color: var(--sprout-danger);
   }
 
   .sprout-textarea-variant-embedded,
   .sprout-textarea-variant-embedded:focus-visible,
-  .sprout-textarea-variant-embedded[aria-invalid="true"] {
+  .sprout-textarea-variant-embedded[aria-invalid='true'] {
     border-color: transparent;
     border-radius: 0;
     background-color: transparent;

package/dist/styles/themes/chatgpt.css

@@ -6,15 +6,15 @@
  * that subtree.
  */
 @layer base {
-  [data-sprout-theme="chatgpt"] {
+  [data-sprout-theme='chatgpt'] {
     --sprout-font: ui-sans-serif, system-ui, sans-serif;
     --sprout-radius-control: 0.75rem;
     --sprout-radius-panel: 1rem;
   }
 
-  [data-sprout-theme="chatgpt"],
-  .light[data-sprout-theme="chatgpt"],
-  .light [data-sprout-theme="chatgpt"] {
+  [data-sprout-theme='chatgpt'],
+  .light[data-sprout-theme='chatgpt'],
+  .light [data-sprout-theme='chatgpt'] {
     --sprout-canvas: #f9f9f9;
     --sprout-surface: #ffffff;
     --sprout-hover: #f0f0f0;
@@ -40,17 +40,13 @@
     --sprout-success-subtle: #e8f4eb;
     --sprout-warning: #8a4b08;
     --sprout-warning-subtle: #fdf1dc;
-    --sprout-primary-subtle: color-mix(
-      in oklab,
-      var(--sprout-primary) 10%,
-      var(--sprout-surface)
-    );
+    --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
     --sprout-secondary: #eeeeee;
     --sprout-overlay: rgb(18 18 18 / 0.35);
   }
 
-  .dark[data-sprout-theme="chatgpt"],
-  .dark [data-sprout-theme="chatgpt"] {
+  .dark[data-sprout-theme='chatgpt'],
+  .dark [data-sprout-theme='chatgpt'] {
     --sprout-canvas: #212121;
     --sprout-surface: #2f2f2f;
     --sprout-hover: #3e3e3e;
@@ -76,18 +72,14 @@
     --sprout-success-subtle: #1c3223;
     --sprout-warning: #eec27e;
     --sprout-warning-subtle: #34291b;
-    --sprout-primary-subtle: color-mix(
-      in oklab,
-      var(--sprout-primary) 16%,
-      var(--sprout-surface)
-    );
+    --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
     --sprout-secondary: #404040;
     --sprout-overlay: rgb(8 8 8 / 0.65);
   }
 
   @media (prefers-color-scheme: dark) {
-    :root:not(.light):not(.dark)[data-sprout-theme="chatgpt"],
-    :root:not(.light):not(.dark) [data-sprout-theme="chatgpt"] {
+    :root:not(.light):not(.dark)[data-sprout-theme='chatgpt'],
+    :root:not(.light):not(.dark) [data-sprout-theme='chatgpt'] {
       --sprout-canvas: #212121;
       --sprout-surface: #2f2f2f;
       --sprout-hover: #3e3e3e;
@@ -113,11 +105,7 @@
       --sprout-success-subtle: #1c3223;
       --sprout-warning: #eec27e;
       --sprout-warning-subtle: #34291b;
-      --sprout-primary-subtle: color-mix(
-        in oklab,
-        var(--sprout-primary) 16%,
-        var(--sprout-surface)
-      );
+      --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
       --sprout-secondary: #404040;
       --sprout-overlay: rgb(8 8 8 / 0.65);
     }

package/dist/styles/themes/claude.css

@@ -6,15 +6,15 @@
  * that subtree.
  */
 @layer base {
-  [data-sprout-theme="claude"] {
-    --sprout-font: ui-serif, Georgia, "Times New Roman", serif;
+  [data-sprout-theme='claude'] {
+    --sprout-font: ui-serif, Georgia, 'Times New Roman', serif;
     --sprout-radius-control: 0.5rem;
     --sprout-radius-panel: 0.875rem;
   }
 
-  [data-sprout-theme="claude"],
-  .light[data-sprout-theme="claude"],
-  .light [data-sprout-theme="claude"] {
+  [data-sprout-theme='claude'],
+  .light[data-sprout-theme='claude'],
+  .light [data-sprout-theme='claude'] {
     --sprout-canvas: #f5f4ed;
     --sprout-surface: #faf9f5;
     --sprout-hover: #efede9;
@@ -40,17 +40,13 @@
     --sprout-success-subtle: #e8f4eb;
     --sprout-warning: #8a4b08;
     --sprout-warning-subtle: #fdf1dc;
-    --sprout-primary-subtle: color-mix(
-      in oklab,
-      var(--sprout-primary) 10%,
-      var(--sprout-surface)
-    );
+    --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
     --sprout-secondary: #edece7;
     --sprout-overlay: rgb(18 18 18 / 0.35);
   }
 
-  .dark[data-sprout-theme="claude"],
-  .dark [data-sprout-theme="claude"] {
+  .dark[data-sprout-theme='claude'],
+  .dark [data-sprout-theme='claude'] {
     --sprout-canvas: #262624;
     --sprout-surface: #30302e;
     --sprout-hover: #40403d;
@@ -76,18 +72,14 @@
     --sprout-success-subtle: #1c3223;
     --sprout-warning: #eec27e;
     --sprout-warning-subtle: #34291b;
-    --sprout-primary-subtle: color-mix(
-      in oklab,
-      var(--sprout-primary) 16%,
-      var(--sprout-surface)
-    );
+    --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
     --sprout-secondary: #42423f;
     --sprout-overlay: rgb(8 8 8 / 0.65);
   }
 
   @media (prefers-color-scheme: dark) {
-    :root:not(.light):not(.dark)[data-sprout-theme="claude"],
-    :root:not(.light):not(.dark) [data-sprout-theme="claude"] {
+    :root:not(.light):not(.dark)[data-sprout-theme='claude'],
+    :root:not(.light):not(.dark) [data-sprout-theme='claude'] {
       --sprout-canvas: #262624;
       --sprout-surface: #30302e;
       --sprout-hover: #40403d;
@@ -113,11 +105,7 @@
       --sprout-success-subtle: #1c3223;
       --sprout-warning: #eec27e;
       --sprout-warning-subtle: #34291b;
-      --sprout-primary-subtle: color-mix(
-        in oklab,
-        var(--sprout-primary) 16%,
-        var(--sprout-surface)
-      );
+      --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
       --sprout-secondary: #42423f;
       --sprout-overlay: rgb(8 8 8 / 0.65);
     }

package/dist/styles/themes/cloudflare.css

@@ -6,15 +6,15 @@
  * that subtree.
  */
 @layer base {
-  [data-sprout-theme="cloudflare"] {
+  [data-sprout-theme='cloudflare'] {
     --sprout-font: ui-sans-serif, system-ui, sans-serif;
     --sprout-radius-control: 0.25rem;
     --sprout-radius-panel: 0.5rem;
   }
 
-  [data-sprout-theme="cloudflare"],
-  .light[data-sprout-theme="cloudflare"],
-  .light [data-sprout-theme="cloudflare"] {
+  [data-sprout-theme='cloudflare'],
+  .light[data-sprout-theme='cloudflare'],
+  .light [data-sprout-theme='cloudflare'] {
     --sprout-canvas: #f7f7f8;
     --sprout-surface: #ffffff;
     --sprout-hover: #f1f2f2;
@@ -40,17 +40,13 @@
     --sprout-success-subtle: #e8f4eb;
     --sprout-warning: #8a4b08;
     --sprout-warning-subtle: #fdf1dc;
-    --sprout-primary-subtle: color-mix(
-      in oklab,
-      var(--sprout-primary) 10%,
-      var(--sprout-surface)
-    );
+    --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
     --sprout-secondary: #efefef;
     --sprout-overlay: rgb(18 18 18 / 0.35);
   }
 
-  .dark[data-sprout-theme="cloudflare"],
-  .dark [data-sprout-theme="cloudflare"] {
+  .dark[data-sprout-theme='cloudflare'],
+  .dark [data-sprout-theme='cloudflare'] {
     --sprout-canvas: #1a1b1e;
     --sprout-surface: #222327;
     --sprout-hover: #323337;
@@ -76,18 +72,14 @@
     --sprout-success-subtle: #1c3223;
     --sprout-warning: #eec27e;
     --sprout-warning-subtle: #34291b;
-    --sprout-primary-subtle: color-mix(
-      in oklab,
-      var(--sprout-primary) 16%,
-      var(--sprout-surface)
-    );
+    --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
     --sprout-secondary: #343539;
     --sprout-overlay: rgb(8 8 8 / 0.65);
   }
 
   @media (prefers-color-scheme: dark) {
-    :root:not(.light):not(.dark)[data-sprout-theme="cloudflare"],
-    :root:not(.light):not(.dark) [data-sprout-theme="cloudflare"] {
+    :root:not(.light):not(.dark)[data-sprout-theme='cloudflare'],
+    :root:not(.light):not(.dark) [data-sprout-theme='cloudflare'] {
       --sprout-canvas: #1a1b1e;
       --sprout-surface: #222327;
       --sprout-hover: #323337;
@@ -113,11 +105,7 @@
       --sprout-success-subtle: #1c3223;
       --sprout-warning: #eec27e;
       --sprout-warning-subtle: #34291b;
-      --sprout-primary-subtle: color-mix(
-        in oklab,
-        var(--sprout-primary) 16%,
-        var(--sprout-surface)
-      );
+      --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
       --sprout-secondary: #343539;
       --sprout-overlay: rgb(8 8 8 / 0.65);
     }