/* ../../packages/components/styles/layers.css */
@layer reset, foundation, components, semantics;

/* ../../packages/components/styles/reset.css */
@layer reset {
  *, *:before, *:after {
    box-sizing: border-box;
    font: inherit;
    border: 0;
    margin: 0;
    padding: 0;
  }

  html {
    text-size-adjust: 100%;
  }

  body {
    line-height: 1;
  }

  ol, ul, menu {
    list-style: none;
  }

  button, input, select, textarea {
    color: inherit;
    background: none;
  }

  img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
  }

  img, video, canvas {
    height: auto;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
}

/* ../../packages/components/styles/fonts.css */
@layer foundation {
  :root {
    --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-mono: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  }

  body {
    font-family: var(--font-sans);
    font-weight: var(--font-weight-normal);
  }

  code, kbd, pre, samp {
    font-family: var(--font-mono);
  }
}

/* ../../packages/components/styles/scales.css */
@layer foundation {
  :root {
    --font-size-xs: .75rem;
    --font-size-sm: .875rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;
    --font-size-5xl: 3rem;
    --heading-font-size-xl: 1.68421rem;
    --heading-line-height-xl: 1.84211rem;
    --heading-font-size-lg: 1.42105rem;
    --heading-line-height-lg: 1.57895rem;
    --heading-font-size-md: 1.10526rem;
    --heading-line-height-md: 1.31579rem;
    --heading-font-size-sm: 1rem;
    --heading-line-height-sm: 1.31579rem;
    --line-height-tight: 1.2;
    --line-height-snug: 1.35;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.65;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --letter-spacing-tight: -.025em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: .025em;
    --space-0: 0;
    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;
    --space-10: 8rem;
    font-size: 118.75%;
  }

  @media (min-width: 40rem) {
    :root {
      --heading-font-size-xl: 2.52632rem;
      --heading-line-height-xl: 2.63158rem;
      --heading-font-size-lg: 1.89474rem;
      --heading-line-height-lg: 2.10526rem;
      --heading-font-size-md: 1.26316rem;
      --heading-line-height-md: 1.57895rem;
    }
  }
}

/* ../../packages/components/styles/theme.css */
@layer foundation {
  :root {
    --buncss-light: initial;
    --buncss-dark: ;
    color-scheme: light;
    --color-background: #fff;
    --color-surface: #fff;
    --color-text: #111;
    --color-text-body: #0d0d0d;
    --color-text-muted: #4b4b4b;
    --color-border: #e5e5e5;
    --color-link: #1d70b8;
    --color-link-hover: #003078;
    --color-accent: #5b21b6;
    --color-accent-contrast: #fff;
    --color-focus: #fd0;
    --color-focus-shadow: #0b0c0c;
    --color-focus-text: #0b0c0c;
    --color-mark: #ddd6fe;
    --color-mark-text: #0b0c0c;
    --color-error: #d4351c;
    --color-error-text: #942514;
    --color-error-surface: #f6d7d2;
    --color-success: #00703c;
    --color-success-surface: #cce2d8;
    --button-primary: #00703c;
    --button-primary-text: #fff;
    --button-secondary: #e5e5e5;
    --button-secondary-text: #0b0c0c;
    --button-primary-hover: #005a30;
    --button-primary-shadow: #003d20;
    --button-secondary-hover: #d5d5d5;
    --button-secondary-shadow: #929191;
    --button-warning: #d4351c;
    --button-warning-text: #fff;
    --button-warning-hover: #aa2a16;
    --button-warning-shadow: #55150b;
    --control-background: #fff;
    --control-border: #0b0c0c;
    --control-focus-border: #0b0c0c;
  }

  body {
    background: var(--color-background);
    color: var(--color-text);
  }

  @media (prefers-color-scheme: dark) {
    :root {
      --buncss-light: ;
      --buncss-dark: initial;
      color-scheme: dark;
      --color-background: #000;
      --color-surface: #0a0a0a;
      --color-text: #ededed;
      --color-text-body: #c7c7c7;
      --color-text-muted: #8f8f8f;
      --color-border: #242424;
      --color-link: #8ca8ff;
      --color-link-hover: #b8c8ff;
      --color-accent: #7c3aed;
      --color-accent-contrast: #fff;
      --color-mark: #6d28d9;
      --color-mark-text: #fff;
      --color-error: #ff8a78;
      --color-error-text: var(--color-error);
      --color-error-surface: #632b25;
      --color-success: #5bd68b;
      --color-success-surface: #164d2f;
      --color-focus-shadow: #fff;
      --button-primary-shadow: #4caf7a;
      --button-secondary: #303030;
      --button-secondary-text: #fff;
      --button-secondary-hover: #454545;
      --button-secondary-shadow: #8f8f8f;
      --button-warning: #d4351c;
      --button-warning-text: #fff;
      --button-warning-hover: #aa2a16;
      --button-warning-shadow: #ff8a78;
      --control-background: #0a0a0a;
      --control-border: #aaa;
      --control-focus-border: var(--color-focus);
    }
  }
}

/* ../../packages/components/styles/typography.css */
@layer foundation {
  body {
    font-size: var(--font-size-md);
    line-height: var(--line-height-normal);
  }

  strong, b {
    font-weight: var(--font-weight-semibold);
  }

  mark {
    background: var(--color-mark);
    color: var(--color-mark-text);
  }

  .prose {
    max-width: 70ch;
  }

  .prose > * + * {
    margin-block-start: var(--space-4);
  }

  .prose > :-webkit-any(h1, h2, h3, h4) {
    margin-block-start: var(--space-7);
  }

  .prose > :-moz-any(h1, h2, h3, h4) {
    margin-block-start: var(--space-7);
  }

  .prose > :is(h1, h2, h3, h4) {
    margin-block-start: var(--space-7);
  }

  .prose > :-webkit-any(h1, h2, h3, h4) + * {
    margin-block-start: var(--space-3);
  }

  .prose > :-moz-any(h1, h2, h3, h4) + * {
    margin-block-start: var(--space-3);
  }

  .prose > :is(h1, h2, h3, h4) + * {
    margin-block-start: var(--space-3);
  }

  .prose > :first-child {
    margin-block-start: 0;
  }

  .prose h1 {
    letter-spacing: var(--letter-spacing-tight);
  }

  .prose h2 {
    letter-spacing: var(--letter-spacing-tight);
  }

  .prose h3 {
    letter-spacing: var(--letter-spacing-tight);
  }

  .prose h4 {
    letter-spacing: var(--letter-spacing-tight);
  }

  .prose h1 {
    font-weight: var(--font-weight-normal);
  }

  .prose h2 {
    font-weight: var(--font-weight-normal);
  }

  .prose h3 {
    font-weight: var(--font-weight-medium);
  }

  .prose h4 {
    font-weight: var(--font-weight-medium);
  }

  .prose h1 {
    font-size: var(--heading-font-size-xl);
    line-height: var(--heading-line-height-xl);
  }

  .prose h2 {
    font-size: var(--heading-font-size-lg);
    line-height: var(--heading-line-height-lg);
  }

  .prose h3 {
    font-size: var(--heading-font-size-md);
    line-height: var(--heading-line-height-md);
  }

  .prose h4 {
    font-size: var(--heading-font-size-sm);
    line-height: var(--heading-line-height-sm);
  }

  .prose p {
    color: var(--color-text-body);
  }

  .prose li {
    color: var(--color-text-body);
  }

  .prose strong {
    color: var(--color-text);
  }

  .prose b {
    color: var(--color-text);
  }

  .prose em {
    font-style: italic;
  }

  .prose i {
    font-style: italic;
  }

  .prose small {
    font-size: var(--font-size-sm);
  }

  .prose ol {
    padding-inline-start: var(--space-6);
  }

  .prose ol li + li {
    margin-block-start: var(--space-2);
  }

  .prose ul {
    padding-inline-start: var(--space-6);
  }

  .prose ul li + li {
    margin-block-start: var(--space-2);
  }

  .prose ol {
    list-style: decimal;
  }

  .prose ul {
    list-style: disc;
  }

  .prose blockquote {
    border-inline-start: .25rem solid var(--color-border);
    color: var(--color-text-muted);
    font-size: var(--font-size-lg);
    padding-inline-start: var(--space-4);
  }

  .prose blockquote p {
    color: inherit;
  }

  .prose :not(pre) > code {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    padding: .125em .375em;
    font-size: .9em;
  }

  .prose kbd {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    padding: .125em .375em;
    font-size: .9em;
  }

  .prose samp {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    padding: .125em .375em;
    font-size: .9em;
  }

  .prose pre {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    overflow-x: auto;
    padding: var(--space-4);
  }

  .prose pre code {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-normal);
  }

  .prose hr {
    border-block-start: 1px solid var(--color-border);
  }

  .reading-width {
    max-width: 36rem;
    margin-inline-start: auto;
    margin-inline-end: auto;
  }
}

/* ../../packages/components/styles/adjacent-navigation.css */
@layer components {
  .adjacent-navigation {
    display: grid;
    gap: var(--space-4);
  }

  .adjacent-navigation .adjacent-navigation-direction {
    font-size: var(--font-size-sm);
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
  }

  .adjacent-navigation .adjacent-navigation-link {
    background: color-mix(in srgb, currentcolor 4%, transparent);
    color: var(--color-text);
    display: grid;
    gap: var(--space-1);
    overflow-wrap: anywhere;
    padding: var(--space-4);
    text-decoration: none;
    min-inline-size: 0;
  }

  .adjacent-navigation .adjacent-navigation-link:visited:not(:focus-visible) {
    color: var(--color-text);
  }

  .adjacent-navigation .adjacent-navigation-link:hover:not(:focus-visible) {
    background: color-mix(in srgb, currentcolor 8%, transparent);
    color: var(--color-text);
  }

  .adjacent-navigation .adjacent-navigation-link:hover:not(:focus-visible) .adjacent-navigation-direction {
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  .adjacent-navigation .adjacent-navigation-next {
    text-align: end;
  }

  .adjacent-navigation .adjacent-navigation-previous .adjacent-navigation-direction:before {
    content: "";
    display: inline-block;
    vertical-align: .08em;
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    width: .4em;
    height: .4em;
  }

  .adjacent-navigation .adjacent-navigation-next .adjacent-navigation-direction:after {
    content: "";
    display: inline-block;
    vertical-align: .08em;
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    width: .4em;
    height: .4em;
  }

  .adjacent-navigation .adjacent-navigation-previous .adjacent-navigation-direction:before {
    margin-inline-end: .35em;
    rotate: 135deg;
  }

  .adjacent-navigation .adjacent-navigation-next .adjacent-navigation-direction:after {
    margin-inline-start: .35em;
    rotate: -45deg;
  }

  @media (min-width: 40rem) {
    .adjacent-navigation {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .adjacent-navigation .adjacent-navigation-next {
      grid-column: 2;
    }
  }

  @media (forced-colors: active) {
    .adjacent-navigation .adjacent-navigation-link {
      border: .0625rem solid linktext;
    }
  }
}

/* ../../packages/components/styles/app-shell.css */
@layer components {
  .app-shell {
    --app-shell-navigation-inset-block-start: 0rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-block-size: 100vh;
  }

  @supports (min-block-size: 100dvh) {
    .app-shell {
      min-block-size: 100dvh;
    }
  }

  .app-shell-header {
    background: var(--color-background);
    border-block-end: .0625rem solid var(--color-border);
  }

  .app-shell-body {
    min-inline-size: 0;
    width: 100%;
  }

  @media (min-width: 48rem) {
    .app-shell-body {
      display: grid;
      grid-template-columns: 14rem minmax(0, 1fr);
    }
  }

  .app-shell-navigation {
    background: var(--color-background);
    border-block-end: .0625rem solid var(--color-border);
    position: relative;
  }

  .app-shell-navigation .app-shell-navigation-summary {
    color: var(--color-text);
    align-items:  center;
    column-gap: var(--space-2);
    cursor: pointer;
    display: inline-flex;
    padding: var(--space-2) var(--space-5);
  }

  .app-shell-navigation .app-shell-navigation-summary::marker {
    content: "";
  }

  .app-shell-navigation .app-shell-navigation-summary:before {
    content: "";
    display: inline-block;
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    width: .45rem;
    height: .45rem;
    rotate: 45deg;
  }

  .app-shell-navigation .app-shell-navigation-summary:hover {
    text-decoration-line: underline;
    text-decoration-thickness: .1875rem;
    text-underline-offset: .18em;
  }

  .app-shell-navigation .app-shell-navigation-content {
    padding: var(--space-3);
  }

  .app-shell-navigation .app-shell-navigation-disclosure[open] > .app-shell-navigation-summary:before {
    rotate: 225deg;
  }

  .app-shell-navigation .app-shell-navigation-disclosure > .app-shell-navigation-summary:focus-visible {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    text-decoration: none;
  }

  .app-shell-navigation .app-shell-navigation-disclosure:not([open]) + .app-shell-navigation-content {
    display: none;
  }

  @media (min-width: 48rem) {
    .app-shell-navigation {
      border-block-end: 0;
      border-inline-end: .0625rem solid var(--color-border);
      max-block-size: calc(100vh - var(--app-shell-navigation-inset-block-start));
      overflow-y: auto;
      padding: var(--space-7) var(--space-5);
      position: sticky;
      align-self:  start;
      top: var(--app-shell-navigation-inset-block-start);
    }

    @supports (max-block-size: 100dvh) {
      .app-shell-navigation {
        max-block-size: calc(100dvh - var(--app-shell-navigation-inset-block-start));
      }
    }

    .app-shell-navigation .app-shell-navigation-summary {
      display: none;
    }

    .app-shell-navigation .app-shell-navigation-content {
      display: block;
      padding: 0;
    }

    .app-shell-navigation .app-shell-navigation-disclosure:not([open]) + .app-shell-navigation-content {
      display: block;
      padding: 0;
    }

    @media not (forced-colors: active) {
      .app-shell-navigation::-webkit-scrollbar {
        width: .5rem;
      }

      .app-shell-navigation::-webkit-scrollbar-track {
        background: none;
      }

      .app-shell-navigation::-webkit-scrollbar-thumb {
        background-color: color-mix(in srgb, var(--color-text) 20%, transparent);
        border-radius: 999px;
        transition: background-color .15s;
      }

      .app-shell-navigation:hover::-webkit-scrollbar-thumb {
        background-color: color-mix(in srgb, var(--color-text) 45%, transparent);
      }

      .app-shell-navigation:focus-within::-webkit-scrollbar-thumb {
        background-color: color-mix(in srgb, var(--color-text) 45%, transparent);
      }

      .app-shell-navigation::-webkit-scrollbar-thumb:hover {
        background-color: color-mix(in srgb, var(--color-text) 60%, transparent);
      }

      .app-shell-navigation::-webkit-scrollbar-thumb:active {
        background-color: color-mix(in srgb, var(--color-text) 75%, transparent);
      }

      .app-shell-navigation:focus-visible {
        outline: none;
        scrollbar-color: var(--color-focus) transparent;
      }

      .app-shell-navigation:focus-visible::-webkit-scrollbar-thumb {
        background-color: var(--color-focus);
        box-shadow: inset 0 0 0 .0625rem var(--color-focus-shadow);
      }

      @media (prefers-reduced-motion: reduce) {
        .app-shell-navigation::-webkit-scrollbar-thumb {
          transition: none;
        }
      }
    }
  }

  .app-shell-main {
    min-inline-size: 0;
  }

  @media (forced-colors: active) {
    .app-shell-header, .app-shell-navigation {
      border-color: canvastext;
    }
  }
}

/* ../../packages/components/styles/auth.css */
@layer components {
  .auth-layout {
    container-type: inline-size;
    display: flex;
    padding-block: clamp(var(--space-6), 9vh, var(--space-8)) var(--space-7);
    padding-inline: var(--space-4);
    flex-direction: column;
    justify-content: flex-start;
    min-block-size: 100vh;
    inline-size: min(100%, 30rem);
    margin-inline-start: auto;
    margin-inline-end: auto;
  }

  @supports (min-block-size: 100dvh) {
    .auth-layout {
      min-block-size: 100dvh;
    }
  }

  @media (min-width: 40rem) {
    .auth-layout {
      padding-inline: var(--space-5);
    }
  }

  .auth-layout > .error-summary-container {
    margin-block-end: var(--space-6);
  }

  .auth-layout > .form-stack {
    align-items: stretch;
    gap: var(--space-5);
    inline-size: 100%;
  }

  .auth-layout > .form-stack > .form-field {
    inline-size: 100%;
  }

  .auth-layout > .form-stack > .form-field .password-input {
    inline-size: 100%;
  }

  .auth-header {
    display: flex;
    gap: var(--space-2);
    flex-direction: column;
    margin-block-end: var(--space-5);
  }

  .auth-header > h1 {
    font-size: var(--heading-font-size-xl);
    letter-spacing: var(--letter-spacing-tight);
    line-height: var(--heading-line-height-xl);
  }

  .auth-header > p {
    color: var(--color-text-body);
    font-size: var(--font-size-lg);
  }

  .auth-header > :first-child {
    margin-block-start: 0;
  }

  .auth-header > :last-child {
    margin-block-end: 0;
  }

  .auth-actions {
    display: flex;
    align-items: stretch;
    gap: var(--space-3);
    flex-direction: column;
    inline-size: 100%;
  }

  .auth-actions > a {
    align-self:  flex-start;
  }

  .auth-actions > .button-primary {
    inline-size: 100%;
  }

  @container (width >= 24rem) {
    .auth-actions {
      align-items:  center;
      flex-direction: row;
      gap: var(--space-5);
    }

    .auth-actions > .button-primary {
      inline-size: auto;
    }
  }
}

/* ../../packages/components/styles/breadcrumbs.css */
@layer components {
  .breadcrumbs {
    font-size: var(--font-size-sm);
  }

  .breadcrumbs .breadcrumbs-list {
    display: flex;
    align-items: baseline;
    gap: var(--space-2) var(--space-3);
    list-style: none;
    flex-wrap: wrap;
    padding: 0;
  }

  .breadcrumbs .breadcrumbs-item {
    display: flex;
    align-items: baseline;
    margin: 0;
  }

  .breadcrumbs .breadcrumbs-item + .breadcrumbs-item:before {
    content: "";
    border-block-start: .0625rem solid;
    border-inline-end: .0625rem solid;
    block-size: .45em;
    inline-size: .45em;
    margin-inline-end: var(--space-3);
    translate: 0 -.05em;
    rotate: 45deg;
  }
}

/* ../../packages/components/styles/cards-and-panes.css */
@layer components {
  .card-grid {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
    inline-size: 100%;
    min-inline-size: 0;
  }

  .card-grid > * {
    min-inline-size: 0;
  }

  .card {
    background: var(--color-surface);
    border: .0625rem solid var(--color-border);
    display: flex;
    gap: var(--space-2);
    padding: var(--space-4);
    flex-direction: column;
    min-inline-size: 0;
  }

  .card > * {
    overflow-wrap: anywhere;
    min-inline-size: 0;
    margin: 0;
  }

  .card > footer {
    display: flex;
    align-items: baseline;
    gap: var(--space-2) var(--space-4);
    flex-wrap: wrap;
    margin-block-start: auto;
    padding-block-start: var(--space-2);
  }

  .card > footer > * {
    overflow-wrap: anywhere;
    max-inline-size: 100%;
  }

  .pane {
    background: var(--color-surface);
    border: .0625rem solid var(--color-border);
    display: grid;
    align-content:  start;
    gap: var(--space-4);
    padding: var(--space-4);
    min-inline-size: 0;
  }

  .pane > * {
    overflow-wrap: anywhere;
    min-inline-size: 0;
    margin: 0;
  }

  .pane > header {
    display: flex;
    align-items: baseline;
    gap: var(--space-2) var(--space-5);
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .pane > header > * {
    overflow-wrap: anywhere;
    max-inline-size: 100%;
    margin: 0;
  }

  .pane > footer {
    display: flex;
    align-items: baseline;
    gap: var(--space-2) var(--space-5);
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .pane > footer > * {
    overflow-wrap: anywhere;
    max-inline-size: 100%;
    margin: 0;
  }

  .pane > footer {
    margin-block-start: var(--space-2);
  }

  @media (min-width: 40rem) {
    .card-grid {
      gap: var(--space-5);
    }

    .card {
      padding: var(--space-4) var(--space-6);
    }

    .pane {
      padding: var(--space-6);
    }
  }

  @container narrow-column (width <= 24rem) {
    .pane {
      padding: var(--space-4);
    }
  }

  @media (forced-colors: active) {
    .card, .pane {
      border-color: canvastext;
    }
  }
}

/* ../../packages/components/styles/interactive.css */
@layer components {
  :where(a:any-link) {
    color: var(--color-link);
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
  }

  :where(a:any-link:visited:not(:focus-visible)) {
    color: var(--color-link);
  }

  :where(a:any-link:hover:not(:focus-visible)) {
    color: var(--color-link-hover);
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  .link, .back-link {
    color: var(--color-link);
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
  }

  :is(.link, .back-link):visited:not(:focus-visible) {
    color: var(--color-link);
  }

  :is(.link, .back-link):hover:not(:focus-visible) {
    color: var(--color-link-hover);
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  a:focus-visible {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    text-decoration: none;
  }

  @media (forced-colors: active) {
    a:focus-visible {
      outline-color: highlight;
    }
  }

  a.back-link {
    font-size: .9em;
  }

  a.back-link:not(:focus-visible) {
    color: var(--color-text);
  }

  a.back-link:visited:not(:focus-visible) {
    color: var(--color-text);
  }

  a.back-link:hover:not(:focus-visible) {
    color: var(--color-text);
  }

  a.back-link:before {
    content: "";
    display: inline-block;
    vertical-align: .08em;
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    width: .4em;
    height: .4em;
    margin-inline-end: .35em;
    rotate: 135deg;
  }

  .button {
    cursor: pointer;
    display: inline-block;
    line-height: var(--line-height-normal);
    padding: var(--space-2) var(--space-4);
    text-align: center;
    text-decoration: none;
    border: 0;
    border-block-end: .125rem solid #0000;
    align-self:  flex-start;
    width: -moz-fit-content;
    width: fit-content;
  }

  .button:active:not(:disabled) {
    box-shadow: none;
    border-block-end-color: #0000;
    translate: 0 .125rem;
  }

  .button:focus:not(:disabled) {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    border-block-end-color: #0000;
  }

  @media (forced-colors: active) {
    .button:focus:not(:disabled) {
      outline-color: highlight;
    }
  }

  .button:disabled {
    cursor: not-allowed;
    opacity: .5;
  }

  @media (forced-colors: active) {
    .button {
      border: .125rem solid buttontext;
    }
  }

  .button-primary {
    background: var(--button-primary);
    border-block-end-color: var(--button-primary-shadow);
    color: var(--button-primary-text);
  }

  .button-primary:hover:not(:disabled) {
    background: var(--button-primary-hover);
  }

  .button-primary:focus:hover:not(:disabled) {
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 .1875rem var(--color-focus);
    color: var(--button-primary-text);
  }

  .button-secondary {
    background: var(--button-secondary);
    border-block-end-color: var(--button-secondary-shadow);
    color: var(--button-secondary-text);
  }

  .button-secondary:hover:not(:disabled) {
    background: var(--button-secondary-hover);
  }

  .button-secondary:focus:hover:not(:disabled) {
    background: var(--button-secondary-hover);
    box-shadow: 0 0 0 .1875rem var(--color-focus);
    color: var(--button-secondary-text);
  }

  .button-warning {
    background: var(--button-warning);
    border-block-end-color: var(--button-warning-shadow);
    color: var(--button-warning-text);
  }

  .button-warning:hover:not(:disabled) {
    background: var(--button-warning-hover);
  }

  .button-warning:focus:hover:not(:disabled) {
    background: var(--button-warning-hover);
    box-shadow: 0 0 0 .1875rem var(--color-focus);
    color: var(--button-warning-text);
  }
}

/* ../../packages/components/styles/links.css */
@layer components {
  .link-current {
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
  }

  .link-current:not(:focus-visible) {
    color: currentColor;
  }

  .link-current:visited:not(:focus-visible) {
    color: currentColor;
  }

  .link-current:hover {
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }
}

/* ../../packages/components/styles/forms.css */
@layer components {
  .visually-hidden {
    clip-path: inset(50%);
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
    height: 1px;
  }

  .error-summary-container {
    display: block;
  }

  .error-summary {
    background: var(--color-background);
    border: .3125rem solid var(--color-error);
    display: grid;
    gap: var(--space-5);
    padding: var(--space-5);
  }

  .error-summary h2 {
    margin: 0;
  }

  .error-summary ul {
    margin: 0;
  }

  .error-summary h2 {
    font-size: var(--font-size-2xl);
    line-height: var(--line-height-snug);
  }

  .error-summary ul {
    display: grid;
    gap: var(--space-1);
    list-style: none;
    padding: 0;
  }

  .error-summary a {
    color: var(--color-error);
    display: inline-block;
    font-weight: var(--font-weight-semibold);
  }

  .summary-list {
    container-type: inline-size;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    inline-size: 100%;
    margin: 0;
  }

  .summary-list .summary-list-row {
    border-block-end: .0625rem solid var(--color-border);
    display: grid;
    gap: var(--space-2);
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr);
    padding-block: var(--space-4);
  }

  .summary-list .summary-list-key {
    color: var(--color-text);
    font-weight: var(--font-weight-semibold);
  }

  .summary-list .summary-list-value {
    margin: 0;
  }

  .summary-list .summary-list-actions {
    margin: 0;
  }

  .summary-list .summary-list-value {
    min-width: 0;
  }

  .summary-list .summary-list-actions {
    display: flex;
    justify-content: flex-start;
  }

  .summary-list .summary-list-action-group {
    display: flex;
    align-items:  center;
    gap: var(--space-2);
    flex-wrap: wrap;
  }

  .summary-list .summary-list-action-group > * + * {
    border-inline-start: .0625rem solid var(--color-border);
    padding-inline-start: var(--space-2);
  }

  @container (width >= 40rem) {
    .summary-list .summary-list-row {
      align-items:  start;
      column-gap: var(--space-4);
      grid-template-columns: minmax(10rem, .35fr) minmax(0, 1fr) auto;
    }

    .summary-list .summary-list-actions {
      justify-content: flex-end;
    }
  }

  .form-field {
    display: flex;
    gap: var(--space-2);
    flex-direction: column;
    width: 100%;
    min-width: 0;
    max-width: 40rem;
  }

  .form-field .form-field-label {
    display: block;
  }

  .form-field .form-field-help {
    color: var(--color-text-muted);
  }

  .form-stack {
    display: flex;
    align-items:  flex-start;
    gap: var(--space-6);
    flex-direction: column;
    width: 100%;
    min-width: 0;
  }

  .fieldset {
    display: flex;
    gap: var(--space-2);
    flex-direction: column;
    width: 100%;
    min-width: 0;
    max-width: 40rem;
  }

  .fieldset .fieldset-legend {
    padding: 0;
  }

  .fieldset .fieldset-legend-sm {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-normal);
  }

  .fieldset .fieldset-legend-md {
    font-size: var(--font-size-xl);
    line-height: var(--line-height-snug);
  }

  .fieldset .fieldset-legend-lg {
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-snug);
  }

  .fieldset .fieldset-subtext {
    color: var(--color-text-muted);
  }

  .fieldset .fieldset-content {
    display: flex;
    gap: var(--space-5);
    flex-direction: column;
  }

  .fieldset-error {
    border-inline-start: .25rem solid var(--color-error);
    padding-inline-start: var(--space-4);
  }

  .fieldset-error .fieldset-error-message {
    color: var(--color-error);
  }

  .form-field-control:where(input:not([type]), input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="time"], select, textarea) {
    background: var(--control-background);
    border: .125rem solid var(--control-border);
    color: var(--color-text);
    display: block;
    padding: var(--space-2);
    width: 24rem;
    max-width: 100%;
  }

  .form-field-control:where(input:not([type]), input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="time"], select, textarea):focus {
    border-color: var(--control-focus-border);
    box-shadow: inset 0 0 0 .125rem var(--control-focus-border), 0 0 0 .125rem var(--color-focus);
    outline: .125rem solid #0000;
  }

  @media (forced-colors: active) {
    .form-field-control:where(input:not([type]), input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="time"], select, textarea):focus {
      outline-color: highlight;
    }
  }

  .form-field-control:where(textarea) {
    resize: vertical;
    min-height: 8rem;
  }

  .input-group {
    display: inline-flex;
    align-items: stretch;
    max-width: 100%;
  }

  .input-group .input-group-prefix {
    background: var(--color-border);
    border: .125rem solid var(--control-border);
    display: flex;
    padding-inline: var(--space-2);
    white-space: nowrap;
    align-items:  center;
  }

  .input-group .input-group-suffix {
    background: var(--color-border);
    border: .125rem solid var(--control-border);
    display: flex;
    padding-inline: var(--space-2);
    white-space: nowrap;
    align-items:  center;
  }

  .input-group .input-group-prefix {
    border-inline-end: 0;
  }

  .input-group .input-group-suffix {
    border-inline-start: 0;
  }

  .input-group > .form-field-control {
    position: relative;
    min-width: 0;
  }

  .input-group > .form-field-control:focus {
    z-index: 1;
  }

  .form-field-error {
    border-inline-start: .25rem solid var(--color-error);
    padding-inline-start: var(--space-4);
  }

  .form-field-error .form-field-error-message {
    color: var(--color-error);
  }

  .form-field-error .form-field-control:where(input:not([type]), input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="time"], select, textarea) {
    border-color: var(--color-error);
  }

  .form-field-error .input-group .input-group-prefix {
    border-color: var(--color-error);
  }

  .form-field-error .input-group .input-group-suffix {
    border-color: var(--color-error);
  }

  .input-width-2 {
    width: 5.4ex;
  }

  .input-width-4 {
    width: 9ex;
  }

  .input-width-8 {
    width: 16.2ex;
  }

  .input-width-12 {
    width: 23.4ex;
  }

  .input-width-20 {
    width: 38.4ex;
  }

  .input-width-full {
    width: 100%;
  }

  .date-input {
    display: inline-grid;
    align-self:  flex-start;
    align-items:  flex-end;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 5.4ex) minmax(0, 5.4ex) minmax(0, 9ex);
    width: calc(19.8ex + 2 * var(--space-4));
    max-width: 100%;
  }

  .date-input .date-input-part {
    display: flex;
    gap: var(--space-2);
    flex-direction: column;
    min-width: 0;
  }

  .date-input .form-field-control {
    width: 100%;
    min-width: 0;
  }

  .date-input .form-field-control[aria-invalid="true"] {
    border-color: var(--color-error);
  }

  .password-input {
    display: flex;
    align-items: stretch;
    gap: var(--space-2);
    width: 24rem;
    max-width: 100%;
  }

  .password-input > input {
    flex: 1;
    min-width: 0;
  }

  .password-input > input.form-field-control {
    width: auto;
  }

  .password-input .password-input-toggle {
    display: none;
  }

  .password-input .password-input-toggle > span {
    grid-area: 1 / 1;
  }

  .password-input .password-input-toggle > [data-password-hide-label] {
    visibility: hidden;
  }

  .password-input .password-input-toggle[aria-pressed="true"] > [data-password-show-label] {
    visibility: hidden;
  }

  .password-input .password-input-toggle[aria-pressed="true"] > [data-password-hide-label] {
    visibility: visible;
  }

  .password-toggle-on .password-input-toggle {
    display: grid;
  }
}

/* ../../packages/components/styles/select.css */
@layer components {
  .select {
    appearance: none;
    background-image: linear-gradient(45deg, #0000 calc(50% - .0625rem), currentColor calc(50% - .0625rem) calc(50% + .0625rem), #0000 calc(50% + .0625rem)), linear-gradient(135deg, #0000 calc(50% - .0625rem), currentColor calc(50% - .0625rem) calc(50% + .0625rem), #0000 calc(50% + .0625rem));
    background-position: right calc(.75rem + .1591em) center, right calc(.75rem - .1591em) center;
    background-repeat: no-repeat;
    background-size: .3182em .3182em, .3182em .3182em;
    padding-inline-end: var(--space-7);
  }

  @media (forced-colors: active) {
    .select {
      appearance: auto;
      background-image: none;
      padding-inline-end: var(--space-2);
    }
  }
}

/* ../../packages/components/styles/search.css */
@layer components {
  .search-form {
    display: grid;
    gap: var(--space-3);
  }

  .search-controls, .searchable-list-controls {
    display: flex;
    align-items: stretch;
    gap: var(--space-3);
    flex-wrap: wrap;
  }

  :is(.search-controls, .searchable-list-controls) > .button {
    align-self: auto;
  }

  .search-input {
    flex: 18rem;
    width: 100%;
  }

  .search-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    block-size: calc(1lh + 2 * var(--space-2));
    cursor: pointer;
    display: block;
    height: calc(1lh + 2 * var(--space-2));
    inline-size: calc(1lh + 2 * var(--space-2));
    min-block-size: calc(1lh + 2 * var(--space-2));
    min-inline-size: calc(1lh + 2 * var(--space-2));
    width: calc(1lh + 2 * var(--space-2));
    background-color: #0000;
    background-image: linear-gradient(45deg, #0000 calc(50% - .0625rem), currentColor calc(50% - .0625rem) calc(50% + .0625rem), #0000 calc(50% + .0625rem)), linear-gradient(135deg, #0000 calc(50% - .0625rem), currentColor calc(50% - .0625rem) calc(50% + .0625rem), #0000 calc(50% + .0625rem));
    background-position: center;
    background-repeat: no-repeat;
    background-size: .75rem .75rem;
    background-attachment: scroll, scroll;
    background-origin: padding-box, padding-box;
    background-clip: border-box, border-box;
    border: 0;
    margin: 0;
    padding: 0;
  }

  @media (forced-colors: active) {
    .search-input::-webkit-search-cancel-button {
      forced-color-adjust: none;
    }
  }

  .search-status {
    color: var(--color-text-muted);
  }
}

/* ../../packages/components/styles/searchable-list.css */
@layer components {
  .searchable-list {
    display: grid;
    gap: var(--space-5);
    max-inline-size: 40rem;
  }

  .searchable-list .searchable-list-form .form-field {
    max-width: none;
  }

  .searchable-list .searchable-list-results {
    border-block-start: .0625rem solid var(--color-border);
    display: grid;
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .searchable-list .searchable-list-item {
    border-block-end: .0625rem solid var(--color-border);
  }

  .searchable-list .searchable-list-item > a {
    display: block;
    padding: var(--space-4) var(--space-2);
  }

  .searchable-list .searchable-list-empty {
    margin: 0;
  }
}

/* ../../packages/components/styles/choices.css */
@layer components {
  .choice {
    --choice-control-size: 2.5rem;
    --choice-indicator-size: 1rem;
    position: relative;
    max-width: 40rem;
  }

  .choice .choice-input {
    block-size: var(--choice-control-size);
    inline-size: var(--choice-control-size);
    opacity: 0;
    position: absolute;
    z-index: 1;
    margin: 0;
    top: 0;
  }

  .choice .choice-input:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .choice .choice-input:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .choice .choice-input:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .choice .choice-input:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .choice .choice-input:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .choice .choice-input:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .choice .choice-label {
    cursor: pointer;
    display: block;
    min-block-size: var(--choice-control-size);
    position: relative;
    padding-block-start: calc((var(--choice-control-size)  - 1lh) / 2);
    padding-inline-start: calc(var(--choice-control-size)  + var(--space-3));
  }

  .choice .choice-label:before {
    box-sizing: border-box;
    content: "";
    position: absolute;
  }

  .choice .choice-label:after {
    box-sizing: border-box;
    content: "";
    position: absolute;
  }

  .choice .choice-label:before {
    background: var(--control-background);
    block-size: var(--choice-control-size);
    border: .125rem solid var(--control-border);
    inline-size: var(--choice-control-size);
    top: 0;
  }

  .choice .choice-label:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
    left: 0;
  }

  .choice .choice-label:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
    left: 0;
  }

  .choice .choice-label:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
    left: 0;
  }

  .choice .choice-label:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    right: 0;
  }

  .choice .choice-label:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    right: 0;
  }

  .choice .choice-label:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    right: 0;
  }

  .choice .choice-label:after {
    display: none;
  }

  .choice .choice-label-text {
    display: block;
  }

  .choice .choice-subtext {
    display: block;
  }

  .choice .choice-subtext {
    color: var(--color-text-muted);
    margin-block-start: var(--space-1);
  }

  .choice.choice-with-subtext .choice-label {
    padding-block-start: 0;
  }

  .choice.choice-radio .choice-label:before {
    border-radius: 50%;
  }

  .choice.choice-radio .choice-label:after {
    border-radius: 50%;
  }

  .choice.choice-radio .choice-label:after {
    background: var(--color-text);
    block-size: var(--choice-indicator-size);
    inline-size: var(--choice-indicator-size);
    top: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-radio .choice-label:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-radio .choice-label:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-radio .choice-label:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-radio .choice-label:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-radio .choice-label:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-radio .choice-label:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc((var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  @media (forced-colors: active) {
    .choice.choice-radio .choice-label:after {
      background: canvastext;
    }
  }

  .choice.choice-checkbox .choice-label:after {
    border-block-end: .25rem solid var(--color-text);
    border-inline-start: .25rem solid var(--color-text);
    block-size: .75rem;
    inline-size: 1.35rem;
    top: .65rem;
    rotate: -45deg;
  }

  .choice.choice-checkbox .choice-label:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: .55rem;
  }

  .choice.choice-checkbox .choice-label:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: .55rem;
  }

  .choice.choice-checkbox .choice-label:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: .55rem;
  }

  .choice.choice-checkbox .choice-label:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: .55rem;
  }

  .choice.choice-checkbox .choice-label:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: .55rem;
  }

  .choice.choice-checkbox .choice-label:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: .55rem;
  }

  @media (forced-colors: active) {
    .choice.choice-checkbox .choice-label:after {
      border-color: canvastext;
    }
  }

  .choice.choice-boxed .choice-label {
    border: .125rem solid var(--color-border);
    padding-block: calc(var(--space-4)  + (var(--choice-control-size)  - 1lh) / 2) var(--space-4);
    padding-inline: calc(var(--space-4)  + var(--choice-control-size)  + var(--space-3)) var(--space-4);
    border-radius: .25rem;
  }

  .choice.choice-boxed .choice-label:before {
    top: var(--space-4);
  }

  .choice.choice-boxed .choice-label:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
    left: var(--space-4);
  }

  .choice.choice-boxed .choice-label:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
    left: var(--space-4);
  }

  .choice.choice-boxed .choice-label:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
    left: var(--space-4);
  }

  .choice.choice-boxed .choice-label:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    right: var(--space-4);
  }

  .choice.choice-boxed .choice-label:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    right: var(--space-4);
  }

  .choice.choice-boxed .choice-label:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
    right: var(--space-4);
  }

  .choice.choice-boxed .choice-input {
    top: var(--space-4);
  }

  .choice.choice-boxed .choice-input:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: var(--space-4);
  }

  .choice.choice-boxed .choice-input:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: var(--space-4);
  }

  .choice.choice-boxed .choice-input:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: var(--space-4);
  }

  .choice.choice-boxed .choice-input:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: var(--space-4);
  }

  .choice.choice-boxed .choice-input:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: var(--space-4);
  }

  .choice.choice-boxed .choice-input:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: var(--space-4);
  }

  .choice.choice-boxed.choice-radio .choice-label:after {
    top: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-radio .choice-label:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-radio .choice-label:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-radio .choice-label:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-radio .choice-label:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-radio .choice-label:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-radio .choice-label:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc(var(--space-4)  + (var(--choice-control-size)  - var(--choice-indicator-size)) / 2);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:after {
    top: calc(var(--space-4)  + .65rem);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc(var(--space-4)  + .55rem);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc(var(--space-4)  + .55rem);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: calc(var(--space-4)  + .55rem);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc(var(--space-4)  + .55rem);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc(var(--space-4)  + .55rem);
  }

  .choice.choice-boxed.choice-checkbox .choice-label:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: calc(var(--space-4)  + .55rem);
  }

  .choice.choice-boxed.choice-with-subtext .choice-label {
    padding-block-start: var(--space-4);
  }

  .choice .choice-input:checked + .choice-label:after {
    display: block;
  }

  .choice .choice-input:focus-visible + .choice-label:before {
    border-color: var(--control-focus-border);
    box-shadow: inset 0 0 0 .125rem var(--control-focus-border), 0 0 0 .1875rem var(--color-focus);
    outline: .125rem solid #0000;
  }

  @media (forced-colors: active) {
    .choice .choice-input:focus-visible + .choice-label:before {
      outline-color: highlight;
    }
  }

  .choice .choice-input[aria-invalid="true"] + .choice-label:before {
    border-color: var(--color-error);
  }

  .choice .choice-input:disabled + .choice-label {
    cursor: not-allowed;
    opacity: .55;
  }

  .choice.choice-boxed .choice-input:checked + .choice-label {
    background: color-mix(in srgb, var(--color-accent) 12%, var(--color-background));
    border-color: var(--color-accent);
    box-shadow: inset 0 0 0 .0625rem var(--color-accent);
  }

  @media (forced-colors: active) {
    .choice.choice-boxed .choice-input:checked + .choice-label {
      border-color: canvastext;
    }
  }

  .choice.choice-boxed .choice-input:focus-visible + .choice-label {
    outline: .1875rem solid var(--color-focus);
    outline-offset: .125rem;
  }

  @media (forced-colors: active) {
    .choice.choice-boxed .choice-input:focus-visible + .choice-label {
      outline-color: highlight;
    }
  }

  .fieldset-content > .choice:first-child {
    margin-block-start: var(--space-4);
  }
}

/* ../../packages/components/styles/disclosure.css */
@layer components {
  .disclosure {
    max-inline-size: 40rem;
  }

  .disclosure > .disclosure-summary {
    color: var(--color-link);
    cursor: pointer;
    font-weight: var(--font-weight-normal);
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
    width: -moz-fit-content;
    width: fit-content;
  }

  .disclosure > .disclosure-summary:hover:not(:focus) {
    color: var(--color-link-hover);
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  .disclosure > .disclosure-summary:focus {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    text-decoration: none;
  }

  @media (forced-colors: active) {
    .disclosure > .disclosure-summary:focus {
      outline-color: highlight;
    }
  }

  .disclosure > .disclosure-content {
    border-inline-start: .1875rem solid var(--color-border);
    display: grid;
    gap: var(--space-3);
    margin-block-start: var(--space-3);
    padding-inline-start: var(--space-4);
  }

  .disclosure > .disclosure-content > * {
    margin: 0;
  }
}

/* ../../packages/components/styles/dialog.css */
@layer components {
  .dialog {
    background: var(--color-surface);
    color: var(--color-text);
    overflow: hidden;
    border: 0;
    block-size: 100vh;
    max-block-size: none;
    inline-size: 100%;
    max-inline-size: none;
    margin: 0;
    padding: 0;
    inset: 0;
  }

  .dialog::backdrop {
    background: #0000008c;
  }

  .dialog .dialog-close {
    position: absolute;
    z-index: 1;
    margin: 0;
    top: max(var(--space-2), env(safe-area-inset-top));
  }

  .dialog .dialog-close:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    right: max(var(--space-2), env(safe-area-inset-right));
  }

  .dialog .dialog-close:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    right: max(var(--space-2), env(safe-area-inset-right));
  }

  .dialog .dialog-close:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    right: max(var(--space-2), env(safe-area-inset-right));
  }

  .dialog .dialog-close:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    left: max(var(--space-2), env(safe-area-inset-right));
  }

  .dialog .dialog-close:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    left: max(var(--space-2), env(safe-area-inset-right));
  }

  .dialog .dialog-close:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    left: max(var(--space-2), env(safe-area-inset-right));
  }

  .dialog .dialog-close > .button {
    color: currentColor;
    display: inline-flex;
    padding: var(--space-2);
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
    background: none;
    border: 0;
    align-items:  center;
    min-block-size: 2.75rem;
  }

  .dialog .dialog-close > .button:hover:not(:-webkit-any(:disabled, :focus-visible)) {
    color: var(--color-link-hover);
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
    background: none;
  }

  .dialog .dialog-close > .button:hover:not(:-moz-any(:disabled, :focus-visible)) {
    color: var(--color-link-hover);
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
    background: none;
  }

  .dialog .dialog-close > .button:hover:not(:is(:disabled, :focus-visible)) {
    color: var(--color-link-hover);
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
    background: none;
  }

  .dialog .dialog-close > .button:focus-visible:not(:disabled) {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    text-decoration: none;
  }

  .dialog .dialog-content {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    block-size: 100%;
    padding-block-start: calc(max(var(--space-2), env(safe-area-inset-top))  + 2.75rem);
    padding-block-end: max(var(--space-5), env(safe-area-inset-bottom));
    padding-inline-start: max(var(--space-4), env(safe-area-inset-left));
    padding-inline-end: max(var(--space-4), env(safe-area-inset-right));
  }

  @media not (forced-colors: active) {
    .dialog .dialog-content::-webkit-scrollbar {
      width: .5rem;
    }

    .dialog .dialog-content::-webkit-scrollbar-track {
      background: none;
    }

    .dialog .dialog-content::-webkit-scrollbar-thumb {
      background-color: color-mix(in srgb, var(--color-text) 20%, transparent);
      border-radius: 999px;
    }

    .dialog .dialog-content:hover::-webkit-scrollbar-thumb {
      background-color: color-mix(in srgb, var(--color-text) 45%, transparent);
    }

    .dialog .dialog-content:focus-within::-webkit-scrollbar-thumb {
      background-color: color-mix(in srgb, var(--color-text) 45%, transparent);
    }

    .dialog .dialog-content::-webkit-scrollbar-thumb:hover {
      background-color: color-mix(in srgb, var(--color-text) 60%, transparent);
    }

    .dialog .dialog-content::-webkit-scrollbar-thumb:active {
      background-color: color-mix(in srgb, var(--color-text) 75%, transparent);
    }

    .dialog .dialog-content:focus-visible {
      outline: none;
      scrollbar-color: var(--color-focus) transparent;
    }

    .dialog .dialog-content:focus-visible::-webkit-scrollbar-thumb {
      background-color: var(--color-focus);
      box-shadow: inset 0 0 0 .0625rem var(--color-focus-shadow);
    }
  }

  @media (min-width: 40rem) {
    .dialog {
      border: .0625rem solid var(--color-border);
      inline-size: min(40rem, calc(100% - 2 * var(--space-5)));
      max-block-size: calc(100vh - 2 * var(--space-5));
      block-size: auto;
      margin: auto;
    }

    .dialog .dialog-close {
      top: var(--space-3);
    }

    .dialog .dialog-close:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
      right: var(--space-3);
    }

    .dialog .dialog-close:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
      right: var(--space-3);
    }

    .dialog .dialog-close:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
      right: var(--space-3);
    }

    .dialog .dialog-close:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
      left: var(--space-3);
    }

    .dialog .dialog-close:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
      left: var(--space-3);
    }

    .dialog .dialog-close:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
      left: var(--space-3);
    }

    .dialog .dialog-content {
      max-block-size: calc(100vh - 2 * var(--space-5));
      padding: var(--space-6);
      block-size: auto;
      padding-block-start: calc(var(--space-6)  + 2.75rem);
    }
  }

  @supports (block-size: 100dvh) {
    .dialog {
      block-size: 100dvh;
    }

    @media (min-width: 40rem) {
      .dialog {
        block-size: auto;
        max-block-size: calc(100dvh - 2 * var(--space-5));
      }

      .dialog .dialog-content {
        max-block-size: calc(100dvh - 2 * var(--space-5));
      }
    }
  }

  @media (forced-colors: active) {
    .dialog {
      border-color: canvastext;
    }

    .dialog .dialog-close > .button:focus-visible:not(:disabled) {
      outline-color: highlight;
    }
  }
}

/* ../../packages/components/styles/empty-state.css */
@layer components {
  .empty-state {
    background: var(--color-surface);
    border: .0625rem dashed var(--color-border);
    display: grid;
    gap: var(--space-3);
    padding: var(--space-7) var(--space-5);
    text-align: center;
    justify-items: center;
  }

  .empty-state .empty-state-title {
    margin: 0;
  }

  .empty-state .empty-state-content > * {
    margin: 0;
  }

  .empty-state .empty-state-content {
    color: var(--color-text-muted);
    display: grid;
    gap: var(--space-2);
    max-inline-size: 40rem;
  }

  .empty-state .empty-state-actions {
    display: flex;
    align-items:  center;
    gap: var(--space-3);
    flex-wrap: wrap;
    justify-content: center;
  }

  @media (forced-colors: active) {
    .empty-state {
      border-color: canvastext;
    }
  }
}

/* ../../packages/components/styles/item-list.css */
@layer components {
  .item-list {
    container: item-list / inline-size;
    list-style: none;
    inline-size: 100%;
    min-inline-size: 0;
    margin: 0;
    padding: 0;
  }

  .item-list .item-list-item {
    border-block-end: .0625rem solid var(--color-border);
    display: grid;
    grid-template-areas: "leading content" ". actions";
    grid-template-columns: auto minmax(0, 1fr);
    padding-block: var(--space-3);
    gap: 0;
    min-inline-size: 0;
    margin: 0;
  }

  .item-list .item-list-leading {
    grid-area: leading;
    align-self:  start;
    min-inline-size: 0;
    max-inline-size: 8rem;
    margin-inline-end: var(--space-3);
  }

  .item-list .item-list-leading > * {
    max-inline-size: 100%;
  }

  .item-list .item-list-content {
    display: grid;
    gap: var(--space-1);
    grid-area: content;
    min-inline-size: 0;
  }

  .item-list .item-list-content > * {
    overflow-wrap: anywhere;
    min-inline-size: 0;
  }

  .item-list .item-list-supporting {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
    overflow-wrap: anywhere;
    margin: 0;
  }

  .item-list .item-list-actions {
    display: flex;
    gap: var(--space-2) var(--space-4);
    grid-area: actions;
    flex-wrap: wrap;
    min-inline-size: 0;
    margin-block-start: var(--space-2);
  }

  .item-list .item-list-actions > * {
    overflow-wrap: anywhere;
    max-inline-size: 100%;
  }

  .item-list .item-list-actions > a:any-link {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
  }

  .item-list .item-list-actions > a:any-link:not(:focus-visible) {
    color: currentColor;
  }

  .item-list .item-list-actions > a:any-link:visited:not(:focus-visible) {
    color: currentColor;
  }

  .item-list .item-list-actions > a:any-link:hover:not(:focus-visible) {
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  @container item-list (width >= 36rem) {
    .item-list .item-list-item {
      align-items:  start;
      grid-template-areas: "leading content actions";
      grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .item-list .item-list-actions {
      justify-content: flex-end;
      margin-block-start: 0;
      margin-inline-start: var(--space-3);
    }
  }

  @media (forced-colors: active) {
    .item-list .item-list-item {
      border-block-end-color: canvastext;
    }
  }
}

/* ../../packages/components/styles/menu.css */
@layer components {
  .menu-link, .menu-button {
    color: var(--color-text);
    cursor: pointer;
    display: block;
    font: inherit;
    font-weight: var(--font-weight-normal);
    padding: var(--space-2) var(--space-4);
    text-align: start;
    background: none;
    border: 0;
    inline-size: 100%;
  }

  :is(.menu-link, .menu-button):hover:not(:focus-visible) {
    background: color-mix(in srgb, var(--color-text) 8%, transparent);
  }

  :is(.menu-link, .menu-button):focus-visible {
    background: var(--color-focus);
    box-shadow: inset 0 -.25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
  }

  @media (forced-colors: active) {
    :is(.menu-link, .menu-button):focus-visible {
      outline-color: highlight;
    }
  }

  .menu-button {
    text-decoration: none;
  }

  .menu-link {
    text-decoration: none;
  }

  .menu-link:hover:not(:focus-visible) {
    text-decoration-line: underline;
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  .menu {
    display: inline-block;
    position: relative;
    block-size: -moz-fit-content;
    block-size: fit-content;
  }

  .menu > .menu-summary {
    cursor: pointer;
    display: inline-flex;
    align-items:  center;
    gap: var(--space-2);
    list-style: none;
    text-decoration-line: underline;
    text-decoration-thickness: .0625rem;
    text-underline-offset: .18em;
  }

  .menu > .menu-summary::-webkit-details-marker {
    display: none;
  }

  .menu > .menu-summary:before {
    content: "";
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    flex: none;
    block-size: .45em;
    inline-size: .45em;
    translate: 0 -.15em;
    rotate: 45deg;
  }

  .menu > .menu-summary[data-menu-chevron="false"]:before {
    display: none;
  }

  .menu > .menu-summary:hover:not(:focus-visible) {
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  .menu > .menu-summary:focus-visible {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    text-decoration: none;
  }

  @media (forced-colors: active) {
    .menu > .menu-summary:focus-visible {
      outline-color: highlight;
    }
  }

  .menu[open] > .menu-summary:before {
    translate: 0 .15em;
    rotate: 225deg;
  }

  .menu > .menu-content {
    background: var(--color-surface);
    border: .0625rem solid var(--color-border);
    max-inline-size: min(20rem, calc(100vw - 2 * var(--space-4)));
    position: absolute;
    z-index: 2;
    inline-size: max-content;
    min-inline-size: 12rem;
  }

  @media (forced-colors: active) {
    .menu > .menu-content {
      border-color: canvastext;
    }
  }

  .menu[data-menu-placement="bottom"] > .menu-content {
    top: calc(100% + var(--space-2));
  }

  .menu[data-menu-placement="top"] > .menu-content {
    translate: 0 calc(-100% - var(--space-2));
    top: 0;
  }

  .menu[data-menu-align="start"] > .menu-content:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .menu[data-menu-align="start"] > .menu-content:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .menu[data-menu-align="start"] > .menu-content:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .menu[data-menu-align="start"] > .menu-content:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .menu[data-menu-align="start"] > .menu-content:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .menu[data-menu-align="start"] > .menu-content:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .menu[data-menu-align="end"] > .menu-content:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    right: 0;
  }

  .menu[data-menu-align="end"] > .menu-content:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    right: 0;
  }

  .menu[data-menu-align="end"] > .menu-content:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    right: 0;
  }

  .menu[data-menu-align="end"] > .menu-content:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    left: 0;
  }

  .menu[data-menu-align="end"] > .menu-content:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    left: 0;
  }

  .menu[data-menu-align="end"] > .menu-content:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    left: 0;
  }

  .menu-list {
    list-style: none;
    padding: var(--space-2) 0;
    margin: 0;
  }

  .menu-item {
    margin: 0;
  }
}

/* ../../packages/components/styles/navigation-links.css */
@layer components {
  .navigation-links {
    --navigation-links-current-background: color-mix(in srgb, var(--color-text) 6%, transparent);
  }

  .navigation-links .navigation-links-list {
    display: flex;
    gap: var(--space-4);
    list-style: none;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
  }

  .navigation-links .navigation-links-item {
    margin: 0;
  }

  .navigation-links .navigation-links-link {
    display: block;
    padding: var(--space-1) var(--space-2);
    text-decoration: none;
    text-decoration-skip-ink: none;
    text-underline-offset: .25em;
  }

  .navigation-links :where(.navigation-links-link:any-link:not(:focus-visible)) {
    color: inherit;
  }

  .navigation-links .navigation-links-link:hover:not([aria-current="page"]):not(:focus-visible) {
    text-decoration-line: underline;
    text-decoration-thickness: .1875rem;
  }

  .navigation-links .navigation-links-link[aria-current="page"]:not(:focus-visible) {
    background: var(--navigation-links-current-background);
    text-decoration: none;
  }

  @media (prefers-color-scheme: dark) {
    .navigation-links {
      --navigation-links-current-background: color-mix(in srgb, var(--color-text) 10%, transparent);
    }
  }

  @media (forced-colors: active) {
    .navigation-links .navigation-links-link[aria-current="page"]:not(:focus-visible) {
      outline: .125rem solid canvastext;
      outline-offset: -.125rem;
    }
  }
}

/* ../../packages/components/styles/tables.css */
@layer components {
  .table-scroll {
    overflow: auto;
    max-inline-size: 100%;
  }

  .table {
    border-collapse: collapse;
    inline-size: 100%;
  }

  .table thead {
    background: var(--color-background);
    position: sticky;
    z-index: 1;
    top: 0;
  }

  .table .table-caption {
    font-size: var(--font-size-lg);
    text-align: start;
    margin-block-end: var(--space-3);
  }

  .table .table-header {
    border-block-end: .0625rem solid var(--color-border);
    padding: var(--space-3);
    text-align: start;
    vertical-align: top;
    white-space: nowrap;
  }

  .table .table-header:first-child {
    padding-inline-start: 0;
  }

  .table .table-header:last-child {
    padding-inline-end: 0;
  }

  .table .table-cell {
    border-block-end: .0625rem solid var(--color-border);
    padding: var(--space-3);
    text-align: start;
    vertical-align: top;
    white-space: nowrap;
  }

  .table .table-cell:first-child {
    padding-inline-start: 0;
  }

  .table .table-cell:last-child {
    padding-inline-end: 0;
  }

  .table .table-header {
    font-weight: var(--font-weight-semibold);
  }

  .table .table-sort-link {
    color: inherit;
    display: inline-flex;
    align-items:  center;
    gap: var(--space-1);
    white-space: nowrap;
  }

  .table .table-sort-indicator {
    color: var(--color-text-muted);
    flex: 0 0 .625rem;
    block-size: 1rem;
    inline-size: .625rem;
  }

  .table .table-sort-indicator path {
    fill: none;
    stroke: currentcolor;
    stroke-linecap: square;
    stroke-linejoin: miter;
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
  }

  .table .table-cell-numeric {
    font-variant-numeric: tabular-nums;
    text-align: end;
  }

  .table .table-cell-date {
    font-variant-numeric: tabular-nums;
  }

  .table .table-cell-wrap {
    white-space: normal;
  }

  @media (forced-colors: active) {
    .table .table-sort-indicator {
      color: canvastext;
    }
  }
}

/* ../../packages/components/styles/tag.css */
@layer components {
  .tag {
    --tag-background: #e5e5e5;
    --tag-text: #111;
    background: var(--tag-background);
    color: var(--tag-text);
    display: inline-flex;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-tight);
    padding: var(--space-1) var(--space-2);
  }

  .tag.tag-notice {
    --tag-background: #d2e8f7;
    --tag-text: #003078;
  }

  .tag.tag-success {
    --tag-background: var(--color-success-surface);
    --tag-text: var(--color-success);
  }

  .tag.tag-warning {
    --tag-background: #fff0b3;
    --tag-text: #594400;
  }

  .tag.tag-error {
    --tag-background: var(--color-error-surface);
    --tag-text: var(--color-error-text);
  }

  @media (prefers-color-scheme: dark) {
    .tag {
      --tag-background: #303030;
      --tag-text: #ededed;
    }

    .tag.tag-notice {
      --tag-background: #16324a;
      --tag-text: #b8d9ff;
    }

    .tag.tag-warning {
      --tag-background: #574711;
      --tag-text: #ffe58a;
    }
  }

  @media (forced-colors: active) {
    .tag {
      color: canvastext;
      background: canvas;
      border: .0625rem solid;
    }
  }
}

/* ../../packages/components/styles/task-list.css */
@layer components {
  .task-list {
    container: task-list / inline-size;
    list-style: none;
    inline-size: 100%;
    min-inline-size: 0;
    margin: 0;
    padding: 0;
  }

  .task-list .task-list-item {
    border-block-end: .0625rem solid var(--color-border);
    display: grid;
    gap: var(--space-3);
    grid-template-areas: "content" "status";
    padding-block: var(--space-4);
    position: relative;
    min-inline-size: 0;
  }

  .task-list .task-list-content {
    display: grid;
    gap: var(--space-1);
    grid-area: content;
    min-inline-size: 0;
  }

  .task-list .task-list-content > * {
    overflow-wrap: anywhere;
    min-inline-size: 0;
  }

  .task-list .task-list-link {
    justify-self: start;
  }

  .task-list .task-list-link:after {
    content: "";
    position: absolute;
    inset: 0;
  }

  .task-list .task-list-hint {
    color: var(--color-text-muted);
    margin: 0;
  }

  .task-list .task-list-status {
    grid-area: status;
    overflow-wrap: anywhere;
    pointer-events: none;
    position: relative;
    align-self:  start;
    min-inline-size: 0;
  }

  @container task-list (width >= 36rem) {
    .task-list .task-list-item {
      align-items:  start;
      grid-template-areas: "content status";
      grid-template-columns: minmax(0, 1fr) auto;
    }

    .task-list .task-list-status {
      justify-self: end;
      margin-inline-start: var(--space-3);
      max-inline-size: 16rem;
      text-align: end;
    }
  }

  @media (forced-colors: active) {
    .task-list .task-list-item {
      border-block-end-color: canvastext;
    }
  }
}

/* ../../packages/components/styles/error-page.css */
@layer components {
  .error-page {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    display: grid;
    gap: var(--space-6);
    padding: var(--space-5);
    max-width: 48rem;
  }

  .error-page .error-page-heading {
    display: grid;
    gap: var(--space-3);
  }

  .error-page .error-page-status {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
    margin: 0;
  }

  .error-page .error-page-title {
    margin: 0;
  }

  .error-page .error-page-description {
    margin: 0;
  }

  .error-page .error-page-description {
    font-size: var(--font-size-lg);
  }

  .error-page .error-page-details {
    border-inline-start: .25rem solid var(--color-border);
    padding-inline-start: var(--space-4);
  }

  .error-page .error-page-details > * {
    margin: 0;
  }

  .error-page .error-page-actions {
    display: flex;
    align-items:  center;
    gap: var(--space-4);
    flex-wrap: wrap;
  }

  @media (min-width: 40rem) {
    .error-page {
      padding: var(--space-7);
    }
  }
}

/* ../../packages/components/styles/form-success.css */
@layer components {
  .form-success {
    display: grid;
    gap: var(--space-6);
    max-width: 48rem;
  }

  .form-success .form-success-mark {
    background: var(--color-success-surface);
    color: var(--color-success);
    display: flex;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    border-radius: 50%;
    justify-content: center;
    align-items:  center;
    width: 3rem;
    height: 3rem;
  }

  @media (forced-colors: active) {
    .form-success .form-success-mark {
      border: .0625rem solid canvastext;
    }
  }

  .form-success .form-success-heading {
    display: grid;
    gap: var(--space-3);
  }

  .form-success .form-success-status {
    color: var(--color-success);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    letter-spacing: .12em;
    text-transform: uppercase;
    margin: 0;
  }

  .form-success .form-success-title {
    margin: 0;
  }

  .form-success .form-success-description {
    margin: 0;
  }

  .form-success .form-success-details {
    border-block: .125rem solid var(--color-border);
    display: grid;
    gap: var(--space-3);
    padding-block: var(--space-5);
  }

  .form-success .form-success-details > * {
    margin: 0;
  }

  .form-success .form-success-identifier {
    margin: 0;
  }

  .form-success .form-success-identifier div {
    display: grid;
    gap: var(--space-1);
  }

  .form-success .form-success-identifier dt {
    color: var(--color-text-muted);
    font-weight: var(--font-weight-semibold);
  }

  .form-success .form-success-identifier dd {
    overflow-wrap: anywhere;
    margin: 0;
  }

  .form-success .form-success-actions {
    display: flex;
    align-items:  center;
    gap: var(--space-4);
    flex-wrap: wrap;
  }
}

/* ../../packages/components/styles/notification.css */
@layer components {
  .notification {
    --notification-accent: #1d70b8;
    --notification-action: #1d70b8;
    --notification-icon: #fff;
    --notification-surface: #e7f1fa;
    background: var(--notification-surface);
    border-inline-start: .25rem solid var(--notification-accent);
    display: grid;
    align-items:  start;
    gap: var(--space-3);
    grid-template-columns: auto minmax(0, 1fr);
    padding: var(--space-4);
  }

  .notification.notification-success {
    --notification-accent: var(--color-success);
    --notification-action: var(--color-success);
    --notification-surface: var(--color-success-surface);
  }

  .notification.notification-error {
    --notification-accent: var(--color-error);
    --notification-action: var(--color-error);
    --notification-surface: var(--color-error-surface);
  }

  .notification .notification-mark {
    background: var(--notification-accent);
    color: var(--notification-icon);
    display: flex;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    border-radius: 50%;
    justify-content: center;
    align-items:  center;
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1;
  }

  @media (forced-colors: active) {
    .notification .notification-mark {
      border: .125rem solid;
    }
  }

  .notification .notification-content {
    display: grid;
    gap: var(--space-2);
    min-inline-size: 0;
  }

  .notification .notification-header {
    display: flex;
    align-items:  start;
    gap: var(--space-2);
    justify-content: space-between;
    min-inline-size: 0;
  }

  .notification .notification-title {
    margin: 0;
  }

  .notification .notification-body {
    margin: 0;
  }

  .notification .notification-body > * {
    margin: 0;
  }

  .notification .notification-title {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    letter-spacing: var(--letter-spacing-normal);
    line-height: var(--line-height-normal);
    min-inline-size: 0;
  }

  .notification .notification-body {
    min-inline-size: 0;
  }

  .notification .notification-dismiss {
    color: var(--notification-action);
    cursor: pointer;
    display: none;
    font: inherit;
    position: relative;
    text-decoration: underline;
    text-underline-offset: .15em;
    background: none;
    border: 0;
    flex: none;
    align-self:  start;
    padding: 0;
  }

  .notification .notification-dismiss:after {
    content: "";
    inline-size: calc(100% + 2 * var(--space-3));
    position: absolute;
    block-size: 2.75rem;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .notification .notification-dismiss:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: 50%;
  }

  .notification .notification-dismiss:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: 50%;
  }

  .notification .notification-dismiss:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):after {
    left: 50%;
  }

  .notification .notification-dismiss:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: 50%;
  }

  .notification .notification-dismiss:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: 50%;
  }

  .notification .notification-dismiss:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):after {
    right: 50%;
  }

  .notification .notification-dismiss:hover {
    text-decoration-thickness: .15em;
  }

  .notification .notification-dismiss:focus-visible {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
    text-decoration: none;
  }

  @media (forced-colors: active) {
    .notification .notification-dismiss:focus-visible {
      outline-color: highlight;
    }
  }

  @media (prefers-color-scheme: dark) {
    .notification {
      --notification-accent: #3275aa;
      --notification-action: #9ecbff;
      --notification-surface: #16324a;
    }

    .notification.notification-success {
      --notification-accent: #2b8552;
      --notification-action: var(--color-success);
    }

    .notification.notification-error {
      --notification-accent: #a84437;
      --notification-action: var(--color-error);
    }
  }

  .notification-dismiss-on .notification-dismiss {
    display: block;
  }
}

/* ../../packages/components/styles/pagination.css */
@layer components {
  .pagination {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items:  center;
    gap: var(--space-2);
    max-inline-size: 100%;
    margin-block-start: var(--space-4);
  }

  .pagination .pagination-link {
    box-sizing: border-box;
    display: inline-flex;
    padding-block: var(--space-2);
    white-space: nowrap;
    justify-content: center;
    align-items:  center;
    min-block-size: 2.75rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
  }

  .pagination .pagination-link:not(:focus-visible) {
    color: currentColor;
  }

  .pagination .pagination-link:visited:not(:focus-visible) {
    color: currentColor;
  }

  .pagination .pagination-link-previous {
    grid-column: 1;
    justify-self: start;
  }

  .pagination .pagination-link-previous:before {
    content: "";
    display: inline-block;
    vertical-align: .08em;
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    width: .4em;
    height: .4em;
    margin-inline-end: .35em;
    rotate: 135deg;
  }

  .pagination .pagination-summary {
    display: inline-flex;
    grid-column: 2;
    text-align: center;
    white-space: nowrap;
    justify-content: center;
    align-items:  center;
    min-block-size: 2.75rem;
  }

  .pagination .pagination-pages {
    display: none;
  }

  .pagination .pagination-link-next {
    grid-column: 3;
    justify-self: end;
  }

  .pagination .pagination-link-next:after {
    content: "";
    display: inline-block;
    vertical-align: .08em;
    border-block-end: .125rem solid;
    border-inline-end: .125rem solid;
    width: .4em;
    height: .4em;
    margin-inline-start: .35em;
    rotate: -45deg;
  }

  .pagination .pagination-ellipsis {
    display: inline-flex;
    text-align: center;
    justify-content: center;
    align-items:  center;
    min-inline-size: 2.5rem;
  }

  .pagination .pagination-link-current:not(:focus-visible) {
    background: var(--color-accent);
    color: var(--color-accent-contrast);
    text-decoration: none;
  }

  @media (min-width: 40rem) {
    .pagination {
      display: flex;
      flex-wrap: nowrap;
    }

    .pagination .pagination-link-previous {
      grid-row: auto;
      margin-inline-start: calc(var(--space-3) * -1);
    }

    .pagination .pagination-summary {
      display: none;
    }

    .pagination .pagination-pages {
      display: flex;
      align-items:  center;
      gap: var(--space-2);
    }

    .pagination .pagination-link-next {
      grid-row: auto;
    }

    .pagination .pagination-link {
      padding: var(--space-2) var(--space-3);
      min-block-size: 2.5rem;
      min-inline-size: 2.5rem;
    }

    .pagination .pagination-link-previous:before {
      content: none;
    }

    .pagination .pagination-link-next:after {
      content: none;
    }
  }
}

/* ../../packages/components/styles/page-header.css */
@layer components {
  .page-header {
    display: flex;
    align-items:  end;
    gap: var(--space-5);
    justify-content: space-between;
  }

  .page-header .page-header-content {
    display: grid;
    gap: var(--space-2);
    max-inline-size: 48rem;
  }

  .page-header .page-header-title {
    margin: 0;
  }

  .page-header .page-header-subtitle {
    margin: 0;
  }

  .page-header .page-header-context {
    margin: 0;
  }

  .page-header .page-header-title {
    font-size: var(--heading-font-size-xl);
    font-weight: var(--font-weight-normal);
    letter-spacing: var(--letter-spacing-tight);
    line-height: var(--heading-line-height-xl);
  }

  .page-header .page-header-subtitle {
    color: var(--color-text-muted);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-snug);
  }

  .page-header .page-header-context {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
    letter-spacing: var(--letter-spacing-wide);
    line-height: var(--line-height-normal);
    text-transform: uppercase;
  }

  .page-header .page-header-actions {
    display: flex;
    align-items:  center;
    gap: var(--space-3);
    flex: none;
  }

  @media (max-width: 40rem) {
    .page-header {
      flex-direction: column;
      align-items: stretch;
    }

    .page-header .page-header-actions {
      flex-wrap: wrap;
      flex: none;
      align-items:  flex-start;
      inline-size: 100%;
      min-inline-size: 0;
    }
  }
}

/* ../../packages/components/styles/skip-link.css */
@layer components {
  .skip-link {
    clip-path: inset(50%);
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    z-index: 100;
    block-size: .0625rem;
    inline-size: .0625rem;
    top: 0;
  }

  .skip-link:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .skip-link:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .skip-link:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 0;
  }

  .skip-link:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .skip-link:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .skip-link:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 0;
  }

  .skip-link:focus {
    background: var(--color-focus);
    clip-path: none;
    color: var(--color-focus-text);
    overflow: visible;
    padding: var(--space-2) var(--space-3);
    white-space: normal;
    block-size: auto;
    inline-size: auto;
    top: var(--space-3);
    translate: -50%;
  }

  .skip-link:focus:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 50%;
  }

  .skip-link:focus:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 50%;
  }

  .skip-link:focus:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
    left: 50%;
  }

  .skip-link:focus:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 50%;
  }

  .skip-link:focus:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 50%;
  }

  .skip-link:focus:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
    right: 50%;
  }

  @media (forced-colors: active) {
    .skip-link:focus {
      border: .125rem solid canvastext;
    }
  }
}

/* ../../packages/components/styles/side-navigation.css */
@layer components {
  .side-navigation {
    --side-navigation-current-background: color-mix(in srgb, var(--color-text) 3%, transparent);
  }

  .side-navigation .side-navigation-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .side-navigation .side-navigation-group-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .side-navigation .side-navigation-item {
    margin: 0;
  }

  .side-navigation .side-navigation-group {
    margin: 0;
  }

  .side-navigation .side-navigation-item + .side-navigation-item {
    margin-block-start: var(--space-2);
  }

  .side-navigation .side-navigation-group + .side-navigation-group {
    margin-block-start: var(--space-6);
  }

  .side-navigation .side-navigation-item + .side-navigation-group {
    margin-block-start: var(--space-6);
  }

  .side-navigation .side-navigation-group-list {
    margin-block-start: var(--space-2);
  }

  .side-navigation .side-navigation-group-label {
    color: var(--color-text-muted);
    display: block;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-snug);
    padding: 0 var(--space-3);
  }

  .side-navigation .side-navigation-link {
    display: block;
    padding: var(--space-1) var(--space-3);
    text-decoration: none;
  }

  .side-navigation :where(.side-navigation-link:any-link:not(:focus-visible)) {
    color: var(--color-text);
  }

  .side-navigation .side-navigation-link:hover:not(:focus-visible) {
    color: var(--color-text);
    text-decoration-line: underline;
    text-decoration-skip-ink: none;
    text-decoration-thickness: .1875rem;
  }

  .side-navigation .side-navigation-link[aria-current="page"]:not(:focus-visible) {
    background: var(--side-navigation-current-background);
    border-inline-start: .25rem solid var(--color-accent);
    text-decoration: none;
    padding-inline-start: calc(var(--space-3)  - .25rem);
  }

  .side-navigation .side-navigation-link[aria-current="page"]:hover:not(:focus-visible) {
    text-decoration-line: underline;
  }

  @media (prefers-color-scheme: dark) {
    .side-navigation {
      --side-navigation-current-background: color-mix(in srgb, var(--color-text) 6%, transparent);
    }
  }

  @media (forced-colors: active) {
    .side-navigation .side-navigation-link[aria-current="page"]:not(:focus-visible) {
      border-inline-start-color: linktext;
    }
  }
}

/* ../../packages/components/styles/uploader.css */
@layer components {
  [data-upload-fallback], [data-upload-form] {
    container-type: inline-size;
  }

  .upload-dropzone {
    background: var(--color-background);
    border: .125rem dashed var(--color-border);
    cursor: pointer;
    display: grid;
    align-content:  center;
    gap: var(--space-2);
    padding: var(--space-4);
    position: relative;
    text-align: center;
    justify-items: center;
    min-height: 6.5rem;
  }

  .upload-dropzone:hover {
    border-color: var(--color-link);
  }

  .upload-dropzone[data-drag-active="true"] {
    border-color: var(--color-link);
  }

  .upload-dropzone[data-drag-active="true"] {
    outline: .1875rem solid var(--color-focus);
    outline-offset: .125rem;
  }

  .upload-dropzone:focus-within {
    outline: .1875rem solid var(--color-focus);
    outline-offset: .125rem;
  }

  .upload-input {
    clip: rect(0 0 0 0);
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: .0625rem;
    height: .0625rem;
  }

  .upload-dropzone-icon {
    border: .0625rem solid var(--color-border);
    display: inline-flex;
    font-size: var(--font-size-xl);
    border-radius: 100%;
    justify-content: center;
    align-items:  center;
    width: 2.5rem;
    height: 2.5rem;
  }

  .upload-dropzone-copy, .upload-dropzone-meta {
    max-width: 32rem;
  }

  .upload-dropzone-action, .upload-link-action {
    color: var(--color-link);
    text-decoration: underline;
  }

  .upload-dropzone-meta, .upload-state {
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
  }

  .upload-fallback-picker {
    display: grid;
    gap: var(--space-2);
  }

  .upload-fallback-picker-surface {
    background: var(--button-secondary);
    border: .0625rem solid var(--color-border);
    box-shadow: 0 .125rem 0 var(--button-secondary-shadow);
    color: var(--button-secondary-text);
    cursor: pointer;
    display: flex;
    align-items:  center;
    gap: var(--space-2);
    padding: var(--space-3);
    max-width: 100%;
  }

  .upload-fallback-picker-surface:hover {
    background: var(--button-secondary-hover);
  }

  .upload-fallback-picker-surface:has(.upload-fallback-input:valid) {
    background: var(--color-success-surface);
  }

  .upload-fallback-picker-surface:has(.upload-fallback-input:valid):hover {
    background: color-mix(in srgb, var(--color-success-surface) 85%, var(--color-success));
  }

  .upload-fallback-picker-surface:focus-within {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
  }

  .upload-fallback-picker-surface:has(.upload-fallback-input:valid):focus-within {
    background: var(--color-focus);
    box-shadow: 0 .25rem var(--color-focus-shadow);
    color: var(--color-focus-text);
    outline: .1875rem solid #0000;
  }

  .upload-fallback-input {
    color: inherit;
    cursor: pointer;
    font: inherit;
    outline: 0;
    background: none;
    border: 0;
    flex: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .upload-fallback-input::-webkit-file-upload-button {
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-decoration: underline;
    text-underline-offset: .18em;
    background: none;
    border: 0;
    margin-inline-end: var(--space-3);
    padding: 0;
  }

  .upload-fallback-input::file-selector-button {
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-decoration: underline;
    text-underline-offset: .18em;
    background: none;
    border: 0;
    margin-inline-end: var(--space-3);
    padding: 0;
  }

  .upload-fallback-picker-surface:hover .upload-fallback-input::-webkit-file-upload-button {
    text-decoration-thickness: .1875rem;
  }

  .upload-fallback-picker-surface:hover .upload-fallback-input::file-selector-button {
    text-decoration-thickness: .1875rem;
  }

  .upload-fallback-state-icon {
    background: var(--color-success);
    color: var(--color-background);
    display: none;
    border-radius: 100%;
    flex: 0 0 1.25rem;
    justify-content: center;
    align-items:  center;
    height: 1.25rem;
    line-height: 1;
  }

  .upload-fallback-picker-surface:has(.upload-fallback-input:valid) .upload-fallback-state-icon {
    display: inline-flex;
  }

  .upload-fallback-meta {
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    margin: 0;
  }

  .upload-fallback-actions, .upload-form-actions {
    display: flex;
    margin-block-start: var(--space-5);
  }

  .upload-fallback-actions {
    display: none;
  }

  [data-upload-fallback]:has(.upload-fallback-input:valid) .upload-fallback-actions {
    display: flex;
  }

  .upload-list {
    border-block: .0625rem solid var(--color-border);
    list-style: none;
    margin: var(--space-5) 0 0;
    padding: 0;
  }

  .upload-list:empty {
    display: none;
  }

  .upload-item {
    display: grid;
    gap: var(--space-3);
    padding-block: var(--space-4);
    min-width: 0;
  }

  .upload-item + .upload-item {
    border-block-start: .0625rem solid var(--color-border);
  }

  .upload-summary {
    display: grid;
    gap: var(--space-2);
    grid-template-columns: minmax(0, 1fr);
  }

  .upload-filename {
    font-weight: var(--font-weight-normal);
    overflow-wrap: anywhere;
  }

  .upload-status-actions {
    display: flex;
    align-items:  center;
    gap: var(--space-3);
    flex-wrap: wrap;
    justify-content: flex-end;
    min-width: 0;
  }

  .upload-status-actions .upload-state {
    margin-inline-end: auto;
  }

  .upload-state {
    display: inline-flex;
    align-items:  center;
    gap: var(--space-2);
  }

  .upload-state-icon {
    display: inline-grid;
    border-radius: 100%;
    place-items:  center;
    width: 1.25rem;
    height: 1.25rem;
    line-height: 1;
  }

  .upload-item[data-status="uploaded"] .upload-state {
    color: var(--color-success);
  }

  .upload-item[data-status="failed"] .upload-state {
    color: var(--color-error);
  }

  .upload-item[data-status="canceled"] .upload-state {
    color: var(--color-text-secondary);
  }

  .upload-item[data-status="uploaded"] .upload-state-icon:before {
    content: "✓";
  }

  .upload-item[data-status="uploaded"] .upload-state-icon {
    background: var(--color-success-surface);
    color: var(--color-success);
  }

  .upload-item[data-status="failed"] .upload-state-icon:before {
    content: "!";
  }

  .upload-item[data-status="failed"] .upload-state-icon {
    background: var(--color-error-surface);
    color: var(--color-error);
  }

  .upload-item[data-status="uploading"] .upload-state-icon {
    display: none;
  }

  .upload-item progress {
    appearance: none;
    background: var(--color-border);
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    width: 100%;
    height: .375rem;
  }

  .upload-item progress::-webkit-progress-bar {
    background: var(--color-border);
    border-radius: 999px;
  }

  .upload-item progress::-webkit-progress-value {
    background: var(--button-primary);
    border-radius: 999px;
  }

  .upload-item progress::-moz-progress-bar {
    background: var(--button-primary);
    border-radius: 999px;
  }

  .upload-link-action {
    color: inherit;
    cursor: pointer;
    font-weight: var(--font-weight-normal);
    padding: var(--space-1);
    background: none;
    border: 0;
  }

  .upload-error {
    border-inline-start: .25rem solid var(--color-error);
    padding: var(--space-3);
    margin-block-start: var(--space-4);
  }

  @container (width >= 30rem) {
    .upload-dropzone {
      min-height: 8.5rem;
      padding: var(--space-5);
    }

    .upload-fallback-picker-surface {
      gap: var(--space-3);
      padding: var(--space-3) var(--space-4);
    }

    .upload-summary {
      align-items:  center;
      gap: var(--space-4);
      grid-template-columns: minmax(0, 1fr) auto;
    }

    .upload-status-actions {
      justify-content: flex-end;
    }

    .upload-status-actions .upload-state {
      margin-inline-end: 0;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .upload-dropzone {
      transition: none;
    }
  }

  @media (forced-colors: active) {
    .upload-dropzone, .upload-fallback-picker-surface, .upload-list, .upload-item + .upload-item {
      border-color: canvastext;
    }

    .upload-fallback-picker-surface:focus-within {
      outline-color: highlight;
    }

    .upload-fallback-state-icon, .upload-state-icon {
      forced-color-adjust: none;
    }
  }
}

/* ../../packages/components/styles/user-identity.css */
@layer components {
  .user-identity {
    --_user-identity-avatar-size: 2rem;
    display: inline-grid;
    text-align: start;
    align-items:  center;
    min-inline-size: 0;
  }

  .user-identity .user-identity-avatar {
    background: var(--color-mark);
    block-size: var(--_user-identity-avatar-size);
    border: .0625rem solid var(--color-border);
    color: var(--color-mark-text);
    display: inline-flex;
    font-size: var(--font-size-sm);
    inline-size: var(--_user-identity-avatar-size);
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    flex: none;
    justify-content: center;
    align-items:  center;
  }

  .user-identity .user-identity-avatar img {
    object-fit: cover;
    block-size: 100%;
    inline-size: 100%;
  }

  .user-identity:has( > .user-identity-content) {
    gap: var(--space-2);
    grid-template-columns: auto minmax(0, 1fr);
  }

  .user-identity .user-identity-content {
    display: grid;
    min-inline-size: 0;
  }

  .user-identity .user-identity-secondary {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    overflow-wrap: anywhere;
  }

  :where(a, button, summary, [tabindex]):focus-visible :is(.user-identity .user-identity-secondary) {
    color: currentColor;
  }
}

/* ../../packages/components/styles/semantics.css */
@layer semantics {
  [hidden] {
    display: none;
  }

  small {
    font-size: var(--font-size-sm);
  }
}

/* ../../packages/components/styles/index.css */


/* styles/index.css */
.auth-layout .auth-example-back {
  margin-block-end: var(--space-6);
}

.auth-layout .auth-example-header-with-action {
  margin-block-end: var(--space-3);
}

.auth-layout .auth-example-form-link {
  margin-block: 0 var(--space-5);
}

.demo-shell-body {
  max-width: 108rem;
  margin-inline-start: auto;
  margin-inline-end: auto;
}

.demo-shell {
  --app-shell-navigation-inset-block-start: calc(2rem + 2 * var(--space-3)  + .0625rem);
}

.site-header {
  display: flex;
  align-items:  center;
  gap: var(--space-3) var(--space-6);
  flex-wrap: wrap;
}

.site-header > .navigation-links {
  margin-inline-start: calc(-1 * var(--space-2));
}

.site-header .site-title {
  display: inline-flex;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-normal);
  align-items:  center;
  gap: var(--space-2);
  text-decoration: none;
}

.site-header :where(.site-title:any-link:not(:focus-visible)) {
  color: inherit;
}

.site-header :where(.site-title:hover:not(:focus-visible)) {
  text-decoration-line: underline;
  text-decoration-skip-ink: none;
  text-decoration-thickness: .1875rem;
}

.site-header-blog {
  border-block-end: .0625rem solid var(--color-border);
  padding: var(--space-3) var(--space-4);
}

@media (min-width: 40rem) {
  .site-header-blog {
    padding-inline: var(--space-5);
  }
}

.demo-header {
  color: var(--color-text);
  display: flex;
  padding: var(--space-3) var(--space-4);
  align-items:  center;
}

.demo-header .site-header {
  flex: 1;
}

@media (min-width: 40rem) {
  .demo-header {
    padding-inline: var(--space-5);
  }
}

@media (min-width: 48rem) {
  .demo-header {
    block-size: var(--app-shell-navigation-inset-block-start);
    padding-inline: max(calc((100% - 108rem) / 2 + var(--space-5)  + var(--space-3)), calc(var(--space-5)  + var(--space-3)));
    position: sticky;
    z-index: 1;
    top: 0;
  }
}

.blog-page .blog-back {
  margin-block-end: var(--space-5);
}

.blog-page .blog-date {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.blog-page .blog-list {
  margin-block-start: var(--space-5);
}

.blog-page .blog-list h2 {
  font-size: var(--heading-font-size-md);
  line-height: var(--heading-line-height-md);
  margin: 0;
}

.blog-page .blog-list .item-list-supporting {
  margin-block-start: var(--space-1);
}

.blog-page .zip-menu-example {
  border: .0625rem solid var(--color-border);
  display: grid;
  gap: var(--space-4);
  padding: var(--space-5);
}

.blog-adjacent-navigation, .component-adjacent-navigation {
  border-block-start: .0625rem solid var(--color-border);
  margin-block-start: var(--space-8);
  padding-block-start: var(--space-5);
}

.site-mark {
  flex: none;
  block-size: 2rem;
  inline-size: 2rem;
}

.page {
  padding: var(--space-5) var(--space-4);
  max-width: 108rem;
  margin-inline-start: auto;
  margin-inline-end: auto;
}

@media (min-width: 40rem) {
  .page {
    padding: var(--space-7) var(--space-5);
  }
}

@media (min-width: 48rem) {
  .page {
    padding: var(--space-7) var(--space-8);
    margin-inline-start: 0;
    margin-inline-end: 0;
  }
}

.specimen {
  max-width: 48rem;
}

.task-list-narrow-specimen {
  max-inline-size: 22rem;
}

.menu-specimens {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
}

.account-menu-specimens {
  display: flex;
  align-items:  center;
  gap: var(--space-5);
  flex-wrap: wrap;
}

.account-menu-summary {
  padding: var(--space-1);
  text-decoration: none;
  min-block-size: 3.5rem;
}

.account-menu-summary:hover:not(:focus-visible) {
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
  text-decoration: none;
}

.searchable-list .searchable-list-item > a {
  display: grid;
  gap: var(--space-1);
  text-decoration: none;
}

.searchable-list .searchable-list-item > a:not(:focus-visible) {
  color: var(--color-text);
}

.searchable-list .searchable-list-item > a > strong {
  font-weight: var(--font-weight-normal);
  text-decoration-line: underline;
  text-decoration-thickness: .0625rem;
  text-underline-offset: .18em;
}

.searchable-list .searchable-list-item > a > span {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.searchable-list .searchable-list-item > a:hover:not(:focus-visible) > strong {
  text-decoration-skip-ink: none;
  text-decoration-thickness: .1875rem;
}

.searchable-list .searchable-list-item > a:focus-visible > strong {
  color: inherit;
}

.searchable-list .searchable-list-item > a:focus-visible > span {
  color: inherit;
}

.dialog .searchable-list-dialog-content {
  display: grid;
  gap: var(--space-5);
}

.dialog .searchable-list-dialog-content > h2 {
  margin: 0;
}

.dialog .dialog-example-content {
  display: grid;
  gap: var(--space-5);
}

.dialog .dialog-example-content > h2 {
  margin: 0;
}

.prose .specimen-section {
  border-block-start: .0625rem solid var(--color-border);
  margin-block-start: var(--space-8);
  padding-block-start: var(--space-5);
}

.prose .specimen-section-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-normal);
  margin-block-start: 0;
}

.library-directory {
  border-block-start: .0625rem solid var(--color-border);
  padding-block-start: var(--space-5);
}

.library-directory > section {
  margin-block-start: var(--space-6);
}

.library-directory > section > ul {
  margin-block-start: var(--space-3);
}

.specimen-section-content {
  margin-block-start: var(--space-4);
}

.specimen-section-content > * + * {
  margin-block-start: var(--space-4);
}

.button-row {
  display: flex;
  align-items:  flex-start;
  gap: var(--space-4);
  flex-wrap: wrap;
}

.tag-row {
  display: flex;
  align-items:  flex-start;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.tag-examples {
  display: grid;
  align-items: baseline;
  gap: var(--space-2) var(--space-3);
  grid-template-columns: minmax(0, 1fr);
  max-width: 100%;
}

.tag-examples dt {
  margin: 0;
}

.tag-examples dd {
  margin: 0;
}

.tag-examples dd {
  min-width: 0;
}

@media (min-width: 30rem) {
  .tag-examples {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.table-pagination-summary {
  margin-block-start: var(--space-4);
}

.item-list-section-header {
  display: flex;
  align-items:  center;
  gap: var(--space-3) var(--space-5);
  flex-wrap: wrap;
  justify-content: space-between;
}

.item-list-section-header > * {
  margin: 0;
}

.item-list-mark {
  background: var(--color-mark);
  border: .0625rem solid var(--color-border);
  display: inline-flex;
  color: var(--color-mark-text);
  border-radius: 50%;
  justify-content: center;
  align-items:  center;
  min-block-size: 2.5rem;
  inline-size: 2.5rem;
}

.item-list-mark-alternate {
  border-radius: .25rem;
}

.item-list-narrow-specimen {
  inline-size: 100%;
  max-inline-size: 24rem;
}

.current-color-link-example {
  background: var(--button-primary);
  color: var(--button-primary-text);
  padding: var(--space-4);
  width: -moz-fit-content;
  width: fit-content;
}

.multi-step-form {
  display: grid;
  gap: var(--space-6);
  max-width: 48rem;
}

.multi-step-form header {
  display: grid;
  gap: var(--space-2);
}

.multi-step-form header > * {
  margin: 0;
}

.date-fields {
  display: flex;
  align-items:  end;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.standalone-question .fieldset {
  gap: var(--space-4);
}

.standalone-question .fieldset-legend {
  margin-block-end: var(--space-2);
}

.cards-and-panes-specimen {
  max-inline-size: 72rem;
}

.cards-and-panes-specimen .cards-and-panes-narrow-specimen {
  inline-size: 100%;
  max-inline-size: 20rem;
}

.summary-card {
  gap: var(--space-2);
  padding-block: var(--space-4);
}

.summary-card > h3 {
  font-size: var(--font-size-md);
  line-height: var(--line-height-snug);
}

.summary-card .summary-card-metric {
  display: flex;
  align-items: baseline;
  gap: var(--space-1) var(--space-3);
  flex-wrap: wrap;
}

.summary-card .summary-card-metric > * {
  margin: 0;
}

.summary-card .summary-card-value {
  font-size: var(--font-size-4xl);
  line-height: var(--line-height-tight);
}

.summary-card .summary-card-detail {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.summary-card > footer {
  border-block-start: .0625rem solid var(--color-border);
  margin-block-start: 0;
  padding-block-start: var(--space-3);
}

@media (min-width: 40rem) {
  .summary-card {
    gap: var(--space-4);
    padding-block: var(--space-5);
  }
}

.utility-link {
  font-size: var(--font-size-sm);
}

.dashboard-example {
  padding: var(--space-4);
  min-inline-size: 0;
  max-inline-size: 108rem;
  margin-inline-start: auto;
  margin-inline-end: auto;
}

.dashboard-example .dashboard-example-header {
  display: grid;
  gap: var(--space-2);
  margin-block-end: var(--space-6);
}

.dashboard-example .dashboard-example-header > * {
  margin: 0;
}

.dashboard-example .dashboard-example-header > .back-link {
  margin-block-end: var(--space-3);
}

.dashboard-example .dashboard-example-header > h1 {
  font-size: var(--heading-font-size-xl);
  line-height: var(--heading-line-height-xl);
}

.dashboard-example .dashboard-example-eyebrow {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
  letter-spacing: var(--letter-spacing-wide);
  text-transform: uppercase;
}

.dashboard-example .dashboard-example-main {
  display: grid;
  gap: var(--space-6);
  min-inline-size: 0;
}

.dashboard-example .dashboard-example-summary {
  display: grid;
  gap: var(--space-3);
  min-inline-size: 0;
}

.dashboard-example .dashboard-example-summary > h2 {
  margin: 0;
}

.dashboard-example :is(.dashboard-example-summary > h2, .pane > header > h2) {
  font-size: var(--font-size-xl);
  line-height: var(--line-height-snug);
}

.dashboard-example .dashboard-example-regions {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: minmax(0, 1fr);
  min-inline-size: 0;
}

.dashboard-example .dashboard-example-regions > * {
  min-inline-size: 0;
}

@media (min-width: 40rem) {
  .dashboard-example .dashboard-example-summary {
    gap: var(--space-4);
  }

  .dashboard-example .dashboard-example-regions {
    gap: var(--space-5);
  }
}

@media (min-width: 70rem) {
  .dashboard-example {
    padding: var(--space-6);
  }

  .dashboard-example .dashboard-example-regions {
    gap: var(--space-5);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-example .dashboard-example-regions > :first-child {
    grid-row: span 2;
  }
}

/* styles/app.css */