@layer components {
  .ui-sheet{position:relative;border-radius:var(--ui-radius-xl);background:linear-gradient(180deg, var(--ui-surface-sheet), var(--ui-surface-sheet-lo));color:var(--ui-text-body);box-shadow:var(--ui-elevation-rise-2)}

  .ui-sheet[data-elevation="1"] {
    box-shadow: var(--ui-elevation-rise-1);
  }

  .ui-sheet[data-elevation="3"] {
    box-shadow: var(--ui-elevation-rise-3);
  }

  .ui-sheet[data-elevation="flat"] {
    background: var(--ui-surface-sheet);
    box-shadow: var(--ui-elevation-flat);
  }

  .ui-well {
    border-radius: var(--ui-radius-md);
    background: var(--ui-surface-well);
    box-shadow: var(--ui-elevation-sink);
  }
}

@layer theme{:root,:host{--color-zinc-0:oklch(98.6% .0008 265);--color-zinc-95:oklch(19.4% .0019 265)}:root,:host{--color-code-function:var(--ui-code-function);--color-code-keyword:var(--ui-code-keyword);--color-code-number:var(--ui-code-number);--color-code-property:var(--ui-code-property);--color-code-string:var(--ui-code-string);--color-code-surface:light-dark(var(--color-zinc-0), var(--color-zinc-95))}}
