@layer components {
  .ui-sidebar {
    align-content: start;
    gap: var(--ui-space-lg);
    padding: var(--ui-space-lg) var(--ui-space-lg) var(--ui-space-2xl) var(--ui-space-xl);
    display: grid;
  }

  .ui-nav-group {
    display: grid;
  }

  .ui-nav-group>h4{display:flex;align-items:center;min-height:2rem;margin:0 0 var(--ui-space-3xs);color:var(--ui-text-muted);font:var(--ui-weight-medium) var(--ui-text-eyebrow)/1rem var(--font-family-sans);letter-spacing:var(--ui-tracking-eyebrow);text-transform:uppercase}

  .ui-nav-link {
    min-height: 2rem;
    color: var(--ui-text-muted);
    font-size: var(--ui-text-small);
    box-shadow: inset 1px 0 0 var(--ui-line-divider);
    transition: color var(--ui-duration-quick);
    align-items: center;
    padding: .3125rem 0 .3125rem 1rem;
    line-height: 1.4;
    text-decoration: none;
    display: flex;
    position: relative;
  }

  .ui-nav-link:before {
    content: "";
    width: 2px;
    transition: background-color var(--ui-duration-quick);
    background: none;
    border-radius: 1px;
    margin-left: -.5px;
    position: absolute;
    top: .4375rem;
    bottom: .4375rem;
    left: 0;
  }

  .ui-nav-link:hover {
    color: var(--ui-text-strong);
  }

  .ui-nav-link:hover:before {
    background: var(--ui-line-mark);
  }

  .ui-nav-link:is([aria-current="page"], [aria-current="true"]) {
    color: var(--ui-text-strong);
    font-weight: var(--ui-weight-medium);
  }

  .ui-nav-link:is([aria-current="page"], [aria-current="true"]):before {
    background: var(--ui-text-strong);
  }

  .ui-nav-link:focus-visible{outline:2px solid var(--ui-focus);outline-offset:1px;border-radius:var(--ui-radius-sm)}

  .ui-nav-link > .ui-badge {
    margin-left: auto;
  }
}

@layer theme{:root,:host{--color-zinc-0:oklch(98.6% .0008 265);--color-zinc-95:oklch(19.4% .0019 265)}:root,:host{--font-family-sans:var(--font-sans, ui-sans-serif), system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"}: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))}:root,:host{--font-sans:"Geist", "Noto Sans TC"}}