@cardstack/boxel-cli 0.9.0 → 0.10.0-unstable.0

package/bundled-test-harness/assets/workspace-chooser-Cu84Gd_E.css

@@ -1,1317 +0,0 @@
-
-  .archived-card[data-scopedcss-916d2a767c-9115c24cc7] {
-    display: flex;
-    flex-direction: column;
-    width: var(--workspace-chooser-card-width);
-    position: relative;
-  }
-  .tile[data-scopedcss-916d2a767c-9115c24cc7] {
-    min-width: var(--workspace-chooser-tile-width);
-    width: var(--workspace-chooser-tile-width);
-    height: 10.375rem;
-    border-radius: var(--boxel-border-radius-xl);
-    background-color: var(--boxel-500);
-    background-image: var(--workspace-background-image-url);
-    background-position: center;
-    background-size: cover;
-    background-repeat: no-repeat;
-    position: relative;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    overflow: hidden;
-  }
-  .tile[data-scopedcss-916d2a767c-9115c24cc7]::after {
-    content: '';
-    position: absolute;
-    inset: 0;
-    border-radius: var(--boxel-border-radius-xl);
-    border: 1px solid rgba(255 255 255 / 25%);
-    pointer-events: none;
-    z-index: 3;
-  }
-  /* Dim the tile so an archived workspace reads as inactive. */
-  .tile-overlay[data-scopedcss-916d2a767c-9115c24cc7] {
-    position: absolute;
-    inset: 0;
-    background: rgba(24 25 32 / 55%);
-    z-index: 1;
-  }
-  .archive-badge[data-scopedcss-916d2a767c-9115c24cc7] {
-    position: absolute;
-    top: 0.5rem;
-    left: 0.5rem;
-    z-index: 2;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 1.75rem;
-    height: 1.75rem;
-    border-radius: var(--boxel-border-radius-sm);
-    background: rgba(0 0 0 / 45%);
-    backdrop-filter: blur(6px);
-    color: var(--boxel-light);
-    --icon-color: var(--boxel-light);
-  }
-  .realm-icon-wrapper[data-scopedcss-916d2a767c-9115c24cc7] {
-    flex-shrink: 0;
-    position: relative;
-    z-index: 2;
-    border-radius: calc(
-      var(--boxel-border-radius-xs) + var(--boxel-border-radius-sm)
-    );
-    display: flex;
-    box-shadow: 0 2px 6px rgb(0 0 0 / 30%);
-    opacity: 0.85;
-  }
-  .realm-icon-wrapper[data-scopedcss-916d2a767c-9115c24cc7]::after {
-    content: '';
-    position: absolute;
-    inset: 0;
-    border-radius: inherit;
-    box-shadow: inset 0 0 0 1px rgba(255 255 255 / 50%);
-    z-index: 1;
-    pointer-events: none;
-  }
-  .workspace-realm-icon[data-scopedcss-916d2a767c-9115c24cc7] {
-    --boxel-realm-icon-size: 2.625rem;
-    --boxel-realm-icon-border-radius: calc(
-      var(--boxel-border-radius-xs) + 6px
-    );
-    --boxel-realm-icon-background-color: var(--boxel-light);
-  }
-  .restore-btn[data-scopedcss-916d2a767c-9115c24cc7] {
-    position: absolute;
-    bottom: 0.5rem;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 2;
-    display: inline-flex;
-    align-items: center;
-    gap: var(--boxel-sp-5xs);
-    padding: var(--boxel-sp-5xs) var(--boxel-sp-sm);
-    border: 1px solid rgba(255 255 255 / 45%);
-    border-radius: var(--boxel-border-radius-xxl);
-    background: rgba(0 0 0 / 55%);
-    backdrop-filter: blur(6px);
-    color: var(--boxel-light);
-    --icon-color: var(--boxel-light);
-    font: 700 var(--boxel-font-xs);
-    letter-spacing: var(--boxel-lsp);
-    cursor: pointer;
-    opacity: 0;
-    transition: opacity 0.15s ease;
-  }
-  .archived-card:hover .restore-btn[data-scopedcss-916d2a767c-9115c24cc7],
-  .restore-btn[data-scopedcss-916d2a767c-9115c24cc7]:focus-visible {
-    opacity: 1;
-  }
-  .restore-btn[data-scopedcss-916d2a767c-9115c24cc7]:hover {
-    background: var(--boxel-highlight);
-    color: var(--boxel-highlight-foreground);
-    border-color: var(--boxel-highlight);
-    --icon-color: var(--boxel-highlight-foreground);
-  }
-  .restore-pending[data-scopedcss-916d2a767c-9115c24cc7] {
-    position: absolute;
-    bottom: 0.5rem;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 2;
-  }
-  .restore-spinner[data-scopedcss-916d2a767c-9115c24cc7] {
-    --boxel-loading-indicator-size: 1.5rem;
-  }
-  .info[data-scopedcss-916d2a767c-9115c24cc7] {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding-top: var(--boxel-sp-xs);
-    gap: var(--boxel-sp-5xs);
-    max-width: var(--workspace-chooser-tile-width);
-  }
-  .info > span[data-scopedcss-916d2a767c-9115c24cc7] {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    width: 100%;
-    text-align: center;
-    letter-spacing: var(--boxel-lsp);
-  }
-  .info > .name[data-scopedcss-916d2a767c-9115c24cc7] {
-    color: var(--boxel-light);
-    font: 400 var(--boxel-font-sm);
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
-    text-wrap: wrap;
-    overflow-wrap: anywhere;
-  }
-  .status[data-scopedcss-916d2a767c-9115c24cc7] {
-    color: var(--boxel-400);
-    font: 400 var(--boxel-font-xs);
-    text-transform: capitalize;
-  }
-  .restore-error[data-scopedcss-916d2a767c-9115c24cc7] {
-    color: var(--boxel-danger);
-    font: 600 var(--boxel-font-xs);
-    text-wrap: wrap;
-    overflow-wrap: anywhere;
-  }
-
-  @layer PretComponent {
-    .pretui-visually-hidden[data-scopedcss-1129855c2f-6ec51e5ae3] {
-      position: absolute;
-      inline-size: 1px;
-      block-size: 1px;
-      margin: -1px;
-      padding: 0;
-      border: 0;
-      overflow: hidden;
-      clip-path: inset(50%);
-      white-space: nowrap;
-    }
-    .pretui-visually-hidden[data-focusable='true'][data-scopedcss-1129855c2f-6ec51e5ae3]:focus-within,
-    .pretui-visually-hidden[data-focusable='true'][data-scopedcss-1129855c2f-6ec51e5ae3]:focus {
-      position: static;
-      inline-size: auto;
-      block-size: auto;
-      margin: 0;
-      overflow: visible;
-      clip-path: none;
-      white-space: normal;
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-alert[data-scopedcss-b6fa244805-fb5a3b5d57] {
-      --pretui-alert-mix: 20%;
-      display: flex;
-      gap: var(--boxel-sp-xs);
-      padding: var(--boxel-sp-2xs) var(--boxel-sp-xs);
-      border-radius: var(--boxel-border-radius);
-      background-color: color-mix(in oklch, var(--pretui-alert-hue) var(--pretui-alert-mix), var(--card));
-      color: var(--foreground);
-      box-shadow: 0 0 0 1px color-mix(in oklch, var(--pretui-alert-hue) 25%, var(--border));
-      font-size: var(--boxel-font-size-xs);
-    }
-    .pretui-alert-glyph[data-scopedcss-b6fa244805-fb5a3b5d57] {
-      width: 1rem;
-      height: 1rem;
-      border-radius: 50%;
-      flex: none;
-      display: grid;
-      place-items: center;
-      background-color: var(--pretui-alert-hue);
-      color: var(--pretui-alert-on-hue);
-      margin-top: 1px;
-    }
-    .pretui-alert-body[data-scopedcss-b6fa244805-fb5a3b5d57] {
-      display: grid;
-      gap: var(--boxel-sp-6xs);
-      min-width: 0;
-    }
-    .pretui-alert-title[data-scopedcss-b6fa244805-fb5a3b5d57] {
-      margin: 0;
-      font-weight: 600;
-    }
-    .pretui-alert-action[data-scopedcss-b6fa244805-fb5a3b5d57] {
-      margin-top: var(--boxel-sp-3xs);
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-avatar[data-scopedcss-5178d38d8c-4c5bd031e9] {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      /* the default diameter, declared once */
-      --_avatar-size: var(--pretui-avatar-size, 1.5rem);
-      --_avatar-hue: var(--pretui-chip-hue, var(--primary));
-      width: var(--_avatar-size);
-      height: var(--_avatar-size);
-      /* 0.42 of the diameter; rounded to the whole pixel below where
-         round() is supported */
-      font-size: calc(var(--_avatar-size) * 0.42);
-      border-radius: 50%;
-      font-family: var(--font-mono);
-      font-weight: 600;
-      background-color: color-mix(in oklch, var(--_avatar-hue) 16%, var(--card));
-      color: var(--foreground);
-      box-shadow: 0 0 0 1px color-mix(in oklch, var(--_avatar-hue) 28%, var(--border));
-      overflow: hidden;
-      flex: none;
-    }
-    /* Gated rather than declared after the calc() fallback: a value
-       containing var() is accepted at parse time, so an engine without
-       round() would keep it, fail at computed-value time, and inherit
-       the parent's font size instead of using the fallback. */
-    @supports (font-size: round(1px, 1px)) {
-      .pretui-avatar[data-scopedcss-5178d38d8c-4c5bd031e9] {
-        font-size: round(calc(var(--_avatar-size) * 0.42), 1px);
-      }
-    }
-    /* A photo gets a neutral ring: the name's hue carries no meaning once
-       the photo shows. The ring sits on the root, whose overflow: hidden
-       circle would clip an outline on the square img. */
-    .pretui-avatar[data-has-image][data-scopedcss-5178d38d8c-4c5bd031e9] {
-      box-shadow: 0 0 0 1px color-mix(in oklch, var(--foreground) 10%, transparent);
-    }
-    .pretui-avatar img[data-scopedcss-5178d38d8c-4c5bd031e9] {
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-dialog[data-scopedcss-fd5ccb4071-98262ab512] {
-      border: 0;
-      padding: 0;
-      background: var(--card);
-      color: var(--foreground);
-      border-radius: var(--radius-surface, 10px);
-      box-shadow: var(--pretui-shadow-overlay, 0 0 0 1px var(--border), 0 12px 40px rgb(16 24 40 / 0.18));
-      width: min(560px, calc(100vw - 32px));
-      max-height: calc(100dvh - 64px);
-      font-family: var(--font-sans);
-      font-size: var(--text-body, 15px);
-    }
-    .pretui-dialog[data-size='s'][data-scopedcss-fd5ccb4071-98262ab512] {
-      width: min(400px, calc(100vw - 32px));
-    }
-    .pretui-dialog[data-size='l'][data-scopedcss-fd5ccb4071-98262ab512] {
-      width: min(760px, calc(100vw - 32px));
-    }
-    .pretui-dialog[data-scopedcss-fd5ccb4071-98262ab512]::backdrop {
-      background: var(--pretui-overlay-scrim, rgb(16 24 40 / 0.4));
-    }
-    .pretui-dialog[open][data-scopedcss-fd5ccb4071-98262ab512] {
-      opacity: 1;
-      transform: none;
-      transition: opacity 200ms cubic-bezier(0.23, 1, 0.32, 1),
-        transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
-    }
-    @starting-style {
-      .pretui-dialog[open][data-scopedcss-fd5ccb4071-98262ab512] {
-        opacity: 0;
-        transform: translateY(6px) scale(0.98);
-      }
-    }
-    .pretui-dialog-inner[data-scopedcss-fd5ccb4071-98262ab512] {
-      display: grid;
-      gap: var(--space-4, 11px);
-      padding: var(--space-6, 19px);
-    }
-    .pretui-dialog-title[data-scopedcss-fd5ccb4071-98262ab512] {
-      font-size: var(--text-heading, 19px);
-      font-weight: var(--weight-heading, 700);
-      letter-spacing: var(--track-heading, -0.02em);
-    }
-    .pretui-dialog-body[data-scopedcss-fd5ccb4071-98262ab512] {
-      color: var(--muted-foreground);
-      line-height: calc(var(--leading-body, 24px) / var(--text-body, 15px));
-    }
-    .pretui-dialog-footer[data-scopedcss-fd5ccb4071-98262ab512] {
-      display: flex;
-      justify-content: flex-end;
-      gap: var(--space-3, 8px);
-      border-top: 1px solid var(--border);
-      padding-top: var(--space-4, 11px);
-    }
-    @media (prefers-reduced-motion: reduce) {
-      .pretui-dialog[open][data-scopedcss-fd5ccb4071-98262ab512] {
-        transition: none;
-      }
-    }
-  }
-
-  /* above Button's layer, so these win by layer order, not file order */
-  @layer PretComponent, PretComposite;
-  @layer PretComposite {
-    .pretui-iconbtn[data-scopedcss-bcde96c7a5-2e8d552068] {
-      padding: 0;
-      width: var(--pretui-button-h, 2.24em);
-    }
-    /* square against Button's 24px minimum height at xs */
-    .pretui-iconbtn[data-size='xs'][data-scopedcss-bcde96c7a5-2e8d552068] {
-      width: max(var(--pretui-button-h, 2.24em), 1.5rem);
-    }
-    /* block-level, so the glyph is not set on Button's label line and
-       its baseline */
-    .pretui-iconbtn-glyph[data-scopedcss-bcde96c7a5-2e8d552068] {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-    /* pressed is a tint one step stronger than the filled appearance's,
-       so it reads on outlined, plain and filled alike; an accent fill has
-       no stronger step and a link has no fill, so toggles use another
-       appearance */
-    .pretui-iconbtn[aria-pressed='true'][data-scopedcss-bcde96c7a5-2e8d552068]:not(
-        [data-appearance='accent'],
-        [data-appearance='link']
-      ) {
-      --_iconbtn-pressed-base: var(--background);
-      --pretui-btn-surface: color-mix(
-        in oklch,
-        var(--pretui-tone) 28%,
-        var(--_iconbtn-pressed-base)
-      );
-      --pretui-btn-surface-hover: color-mix(
-        in oklch,
-        var(--pretui-btn-tint) 34%,
-        var(--_iconbtn-pressed-base)
-      );
-    }
-    /* over the outlined appearance's own base surface, when a theme sets
-       one, so pressing changes the tint and not the base */
-    .pretui-iconbtn[aria-pressed='true'][data-appearance='outlined'][data-scopedcss-bcde96c7a5-2e8d552068] {
-      --_iconbtn-pressed-base: var(
-        --pretui-button-secondary-bg,
-        var(--background)
-      );
-    }
-    /* not when disabled, whose GrayText edge from Button is its only cue */
-    @media (forced-colors: active) {
-      .pretui-iconbtn[aria-pressed='true'][data-scopedcss-bcde96c7a5-2e8d552068]:not(
-          :disabled,
-          [aria-disabled='true']
-        ) {
-        border-color: Highlight;
-      }
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-item[data-scopedcss-8d0ffb3c65-39abb89535] {
-      display: flex;
-      align-items: center;
-      gap: var(--pretui-item-gap, var(--space-4, 11px));
-      min-width: 0;
-      font-size: var(--text-ui-md, 12.5px);
-      letter-spacing: var(--track-ui, 0.01em);
-      color: var(--foreground);
-    }
-    .pretui-item[data-align='start'][data-scopedcss-8d0ffb3c65-39abb89535] {
-      align-items: flex-start;
-    }
-    .pretui-item[data-size='xs'][data-scopedcss-8d0ffb3c65-39abb89535] {
-      font-size: 10.5px;
-    }
-    .pretui-item[data-size='s'][data-scopedcss-8d0ffb3c65-39abb89535] {
-      font-size: var(--text-ui-sm, 11.5px);
-    }
-    .pretui-item[data-size='l'][data-scopedcss-8d0ffb3c65-39abb89535] {
-      font-size: 14px;
-    }
-    .pretui-item[data-size='xl'][data-scopedcss-8d0ffb3c65-39abb89535] {
-      font-size: 16px;
-    }
-    .pretui-item-lead[data-scopedcss-8d0ffb3c65-39abb89535] {
-      flex: none;
-      display: flex;
-      align-items: center;
-    }
-    /* min-width:0 is half the fix; without the three truncation
-       declarations on the text it hard-clips instead of ellipsising
-       */
-    .pretui-item-body[data-scopedcss-8d0ffb3c65-39abb89535] {
-      flex: 1 1 auto;
-      min-width: 0;
-      display: grid;
-      gap: 2px;
-    }
-    .pretui-item-title[data-scopedcss-8d0ffb3c65-39abb89535] {
-      display: block;
-      min-width: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      font-weight: 500;
-    }
-    .pretui-item-link[data-scopedcss-8d0ffb3c65-39abb89535] {
-      color: inherit;
-      text-decoration: none;
-    }
-    .pretui-item-link[data-scopedcss-8d0ffb3c65-39abb89535]:hover {
-      text-decoration: underline;
-    }
-    .pretui-item-link[data-scopedcss-8d0ffb3c65-39abb89535]:focus-visible {
-      outline: 2px solid var(--ring);
-      outline-offset: 2px;
-      border-radius: 3px;
-    }
-    .pretui-item-desc[data-scopedcss-8d0ffb3c65-39abb89535] {
-      display: block;
-      min-width: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      color: var(--muted-foreground);
-      font-size: 0.94em;
-    }
-    .pretui-item-content[data-scopedcss-8d0ffb3c65-39abb89535] {
-      min-width: 0;
-      margin-block-start: 2px;
-    }
-    .pretui-item-trail[data-scopedcss-8d0ffb3c65-39abb89535] {
-      flex: none;
-      display: flex;
-      align-items: center;
-      gap: var(--space-3, 8px);
-      color: var(--muted-foreground);
-      font-size: 0.94em;
-      font-variant-numeric: tabular-nums;
-    }
-    .pretui-item-actions[data-scopedcss-8d0ffb3c65-39abb89535] {
-      flex: none;
-      display: flex;
-      align-items: center;
-      gap: var(--space-2, 6px);
-    }
-    /* Unnamed container query on the nearest ancestor container (List's
-       row, or whatever the caller made a container). At this width the
-       trailing meta wraps under the body rather than crushing the title. */
-    @container (max-width: 22rem) {
-      .pretui-item[data-scopedcss-8d0ffb3c65-39abb89535] {
-        flex-wrap: wrap;
-      }
-      .pretui-item-trail[data-scopedcss-8d0ffb3c65-39abb89535] {
-        margin-inline-start: auto;
-      }
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-broken[data-scopedcss-ff94cba008-71a083bb1d] {
-      display: inline-flex;
-      align-items: center;
-      gap: 6px;
-      padding: 2px 8px;
-      border-radius: 6px;
-      background: var(--inset, var(--boxel-100));
-      color: var(--ink-3, var(--boxel-400));
-      font-size: var(--text-ui-sm, 11.5px);
-      font-family: var(--font-mono);
-      outline: 1px dashed var(--line-strong, var(--boxel-400));
-      outline-offset: -1px;
-      text-decoration: line-through;
-      text-decoration-color: color-mix(in oklch, var(--ink-3, var(--boxel-400)) 50%, transparent);
-    }
-    .pretui-broken svg[data-scopedcss-ff94cba008-71a083bb1d] {
-      flex: none;
-    }
-    .pretui-broken-id[data-scopedcss-ff94cba008-71a083bb1d] {
-      opacity: 0.7;
-    }
-  }
-
-  @layer PretComponent {
-    @keyframes pretui-spin-data-scopedcss-168137d984-a3a2d631cc {
-      to {
-        transform: rotate(360deg);
-      }
-    }
-    .pretui-spinner[data-scopedcss-168137d984-a3a2d631cc] {
-      display: inline-block;
-      border-radius: 50%;
-      border: 1.5px solid color-mix(in oklch, currentColor 25%, transparent);
-      border-top-color: currentColor;
-      animation: pretui-spin-data-scopedcss-168137d984-a3a2d631cc 0.7s linear infinite;
-      flex: none;
-    }
-    @media (prefers-reduced-motion: reduce) {
-      .pretui-spinner[data-scopedcss-168137d984-a3a2d631cc] {
-        animation-duration: 2.8s;
-      }
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-empty[data-scopedcss-b2f493050b-b045568bce] {
-      display: grid;
-      place-items: center;
-      text-align: center;
-      gap: var(--boxel-sp-xs);
-      padding: var(--boxel-sp-3xl) var(--boxel-sp-lg);
-      position: relative;
-      overflow: hidden;
-      border-radius: var(--radius);
-      background-color: var(--canvas);
-      color: var(--foreground);
-    }
-    /* compact: the well an empty note sits in inside a card section */
-    .pretui-empty[data-size='s'][data-scopedcss-b2f493050b-b045568bce] {
-      padding: var(--boxel-sp);
-    }
-    .pretui-empty-texture[data-scopedcss-b2f493050b-b045568bce] {
-      position: absolute;
-      inset: 0;
-      pointer-events: none;
-      background: radial-gradient(
-        ellipse 60% 45% at 50% 42%,
-        color-mix(in oklch, var(--primary) 8%, transparent),
-        transparent 70%
-      );
-    }
-    .pretui-empty-title[data-scopedcss-b2f493050b-b045568bce] {
-      position: relative;
-      font-family: var(--font-serif);
-      font-size: var(--boxel-heading-font-size);
-      font-weight: var(--boxel-heading-font-weight);
-    }
-    .pretui-empty[data-size='s'] .pretui-empty-title[data-scopedcss-b2f493050b-b045568bce] {
-      font-size: var(--boxel-font-size);
-    }
-    .pretui-empty-msg[data-scopedcss-b2f493050b-b045568bce] {
-      position: relative;
-      margin: 0;
-      font-size: var(--boxel-font-size-xs);
-      max-width: 34ch;
-    }
-    .pretui-empty-action[data-scopedcss-b2f493050b-b045568bce] {
-      position: relative;
-      margin-top: var(--boxel-sp-2xs);
-    }
-    /* Two equal paths with a rule between. The rule is drawn on the
-       separator itself so it stretches to whatever the row/column is —
-       no measurement, and it flips axis with the fold. */
-    /* flex-wrap rather than a container query: EmptyState is often an auto
-       -sized grid/flex item, and `container-type: inline-size` would apply
-       inline-size containment to it and collapse that case. Wrapping folds
-       the two paths into a stack at exactly the width where they stop
-       fitting, with no containment side effect. */
-    .pretui-empty-paths[data-scopedcss-b2f493050b-b045568bce] {
-      position: relative;
-      display: flex;
-      flex-wrap: wrap;
-      align-items: center;
-      justify-content: center;
-      gap: var(--boxel-sp-sm);
-    }
-    .pretui-empty-sep[data-scopedcss-b2f493050b-b045568bce] {
-      display: flex;
-      align-items: center;
-      flex: 1 1 6rem;
-      gap: var(--boxel-sp-xs);
-      margin-top: var(--boxel-sp-2xs);
-      font-size: var(--boxel-font-size-2xs);
-      text-transform: lowercase;
-    }
-    .pretui-empty-sep[data-scopedcss-b2f493050b-b045568bce]::before,
-    .pretui-empty-sep[data-scopedcss-b2f493050b-b045568bce]::after {
-      content: '';
-      flex: 1;
-      min-inline-size: var(--boxel-sp-sm);
-      block-size: 1px;
-      background-color: var(--border);
-    }
-  }
-
-  @layer PretComponent {
-    @keyframes pretui-shimmer-data-scopedcss-537b3a02bc-0566fde4f2 {
-      from {
-        background-position: 200% 0;
-      }
-      to {
-        background-position: -200% 0;
-      }
-    }
-    .pretui-skeleton[data-scopedcss-537b3a02bc-0566fde4f2] {
-      display: block;
-      width: var(--_w, 100%);
-      height: var(--_h, 12px);
-      border-radius: 6px;
-      background: linear-gradient(90deg, var(--inset, var(--boxel-100)) 40%, var(--hover, var(--boxel-100)) 50%, var(--inset, var(--boxel-100)) 60%);
-      background-size: 200% 100%;
-      animation: pretui-shimmer-data-scopedcss-537b3a02bc-0566fde4f2 1.6s linear infinite;
-    }
-    @media (prefers-reduced-motion: reduce) {
-      .pretui-skeleton[data-scopedcss-537b3a02bc-0566fde4f2] {
-        animation: none;
-      }
-    }
-  }
-
-  .pretui-data[data-scopedcss-cf92ce48c1-f088545998] {
-    container-type: inline-size;
-    display: block;
-    min-width: 0;
-    color: var(--foreground);
-    font-size: var(--text-ui-md, 12.5px);
-    letter-spacing: var(--track-ui, 0.01em);
-  }
-  .pretui-sr[data-scopedcss-cf92ce48c1-f088545998] {
-    position: absolute;
-    width: 1px;
-    height: 1px;
-    overflow: hidden;
-    clip: rect(0 0 0 0);
-    white-space: nowrap;
-  }
-  .pretui-data-loading[data-scopedcss-cf92ce48c1-f088545998] {
-    display: grid;
-    gap: var(--pretui-data-gap, var(--space-3, 8px));
-  }
-  .pretui-data-loading-head[data-scopedcss-cf92ce48c1-f088545998] {
-    display: flex;
-    align-items: center;
-    gap: var(--space-3, 8px);
-    color: var(--muted-foreground);
-    font-family: var(--font-mono);
-    font-size: var(--text-ui-sm, 11.5px);
-    letter-spacing: var(--track-eyebrow, 0.08em);
-    text-transform: uppercase;
-  }
-  .pretui-data-skeleton[data-scopedcss-cf92ce48c1-f088545998] {
-    display: grid;
-    gap: 7px;
-    padding: var(--space-4, 11px) var(--space-5, 14px);
-    border-radius: var(--radius-surface, 10px);
-    background: var(--card);
-    box-shadow: var(--pretui-shadow-hairline, 0 0 0 1px var(--border));
-  }
-  .pretui-data-errmsg[data-scopedcss-cf92ce48c1-f088545998] {
-    margin: 0 0 var(--space-2, 6px);
-    max-width: 60ch;
-  }
-  /* Unnamed container query only (a named one silently drops every
-     later rule in the transpiled stylesheet). It resolves against the
-     nearest ANCESTOR container — .pretui-data above — so it styles the
-     children, never the container element itself. */
-  @container (max-width: 24rem) {
-    .pretui-data-skeleton[data-scopedcss-cf92ce48c1-f088545998] {
-      padding: var(--space-3, 8px) var(--space-4, 11px);
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-list[data-scopedcss-d9a8b45361-cd067b2df8] {
-      min-width: 0;
-      font-size: var(--text-ui-md, 12.5px);
-      letter-spacing: var(--track-ui, 0.01em);
-      color: var(--foreground);
-    }
-    .pretui-list[data-size='xs'][data-scopedcss-d9a8b45361-cd067b2df8] {
-      font-size: 10.5px;
-    }
-    .pretui-list[data-size='s'][data-scopedcss-d9a8b45361-cd067b2df8] {
-      font-size: var(--text-ui-sm, 11.5px);
-    }
-    .pretui-list[data-size='l'][data-scopedcss-d9a8b45361-cd067b2df8] {
-      font-size: 14px;
-    }
-    .pretui-list[data-size='xl'][data-scopedcss-d9a8b45361-cd067b2df8] {
-      font-size: 16px;
-    }
-    .pretui-list[data-bordered][data-scopedcss-d9a8b45361-cd067b2df8] {
-      border-radius: var(--radius-surface, 10px);
-      background: var(--card);
-      box-shadow: var(--pretui-shadow-hairline, 0 0 0 1px var(--border));
-      overflow: hidden;
-    }
-    .pretui-list[aria-busy='true'][data-scopedcss-d9a8b45361-cd067b2df8] {
-      opacity: 0.62;
-    }
-    .pretui-list-header[data-scopedcss-d9a8b45361-cd067b2df8],
-    .pretui-list-footer[data-scopedcss-d9a8b45361-cd067b2df8] {
-      display: flex;
-      align-items: center;
-      gap: var(--space-3, 8px);
-      padding: 0.62em var(--space-4, 11px);
-      color: var(--muted-foreground);
-    }
-    .pretui-list-header[data-scopedcss-d9a8b45361-cd067b2df8] {
-      box-shadow: inset 0 -1px 0 var(--border);
-    }
-    .pretui-list-footer[data-scopedcss-d9a8b45361-cd067b2df8] {
-      box-shadow: inset 0 1px 0 var(--border);
-    }
-    .pretui-list-rows[data-scopedcss-d9a8b45361-cd067b2df8] {
-      list-style: none;
-      margin: 0;
-      padding: 0;
-      min-width: 0;
-    }
-    .pretui-list-row[data-scopedcss-d9a8b45361-cd067b2df8] {
-      min-width: 0;
-      position: relative;
-    }
-    .pretui-list-line[data-scopedcss-d9a8b45361-cd067b2df8] {
-      container-type: inline-size;
-      display: flex;
-      align-items: center;
-      gap: var(--space-3, 8px);
-      min-width: 0;
-      padding: 0.62em var(--space-4, 11px);
-    }
-    /* The divider and the hover both sit on the summary line, so a hover
-       tint never paints over the hairline above it. */
-    .pretui-list[data-divided]
-      .pretui-list-row
-      + .pretui-list-row
-      > .pretui-list-line[data-scopedcss-d9a8b45361-cd067b2df8] {
-      box-shadow: inset 0 1px 0 var(--border);
-    }
-    /* A selected row keeps its tint under the pointer, summary and
-       detail alike. */
-    .pretui-list-row:not([data-selected='true']) > .pretui-list-line[data-scopedcss-d9a8b45361-cd067b2df8]:hover {
-      background: var(--hover, var(--boxel-100));
-    }
-    .pretui-list-row[data-scopedcss-d9a8b45361-cd067b2df8]:focus-visible {
-      outline: 2px solid var(--ring);
-      outline-offset: -2px;
-    }
-    /* Selection reads in a still frame and in greyscale (Law 8): a rule on
-       the inline start, not colour alone. */
-    .pretui-list-row[data-selected='true'][data-scopedcss-d9a8b45361-cd067b2df8] {
-      background: var(--pretui-selected, var(--boxel-100));
-    }
-    .pretui-list-row[data-selected='true'][data-scopedcss-d9a8b45361-cd067b2df8]::before {
-      content: '';
-      position: absolute;
-      inset-block: 0;
-      inset-inline-start: 0;
-      inline-size: 2px;
-      background: var(--primary);
-    }
-    .pretui-list-pick[data-scopedcss-d9a8b45361-cd067b2df8] {
-      flex: none;
-      display: flex;
-      align-items: center;
-    }
-    .pretui-list-body[data-scopedcss-d9a8b45361-cd067b2df8] {
-      flex: 1 1 auto;
-      min-width: 0;
-    }
-    .pretui-list-expbtn[data-scopedcss-d9a8b45361-cd067b2df8] {
-      flex: none;
-      display: inline-grid;
-      place-content: center;
-      inline-size: 1.7em;
-      block-size: 1.7em;
-      padding: 0;
-      border: 0;
-      border-radius: 6px;
-      background: none;
-      color: var(--muted-foreground);
-      cursor: pointer;
-    }
-    .pretui-list-expbtn[data-scopedcss-d9a8b45361-cd067b2df8]:hover {
-      background: var(--hover, var(--boxel-100));
-      color: var(--foreground);
-    }
-    .pretui-list-expbtn[data-scopedcss-d9a8b45361-cd067b2df8]:focus-visible {
-      outline: 2px solid var(--ring);
-      outline-offset: 1px;
-    }
-    .pretui-list-chev[data-scopedcss-d9a8b45361-cd067b2df8] {
-      display: block;
-      line-height: 1;
-      transition: transform var(--pretui-dur-snap, 180ms)
-        var(--pretui-ease-snap, cubic-bezier(0.2, 0.9, 0.25, 1.05));
-    }
-    .pretui-list-expbtn[aria-expanded='true'] .pretui-list-chev[data-scopedcss-d9a8b45361-cd067b2df8] {
-      transform: rotate(90deg);
-    }
-    /* tabindex=-1 so a click in the detail focuses the detail, not the
-       row, and the row's Enter/Space stay with the row. */
-    .pretui-list-detail[data-scopedcss-d9a8b45361-cd067b2df8]:focus {
-      outline: none;
-    }
-    .pretui-list-detail[data-scopedcss-d9a8b45361-cd067b2df8] {
-      min-width: 0;
-      padding: 0.62em var(--space-4, 11px) 0.85em;
-      box-shadow: inset 0 1px 0 var(--border);
-    }
-    @media (prefers-reduced-motion: reduce) {
-      .pretui-list-chev[data-scopedcss-d9a8b45361-cd067b2df8] {
-        transition: none;
-      }
-    }
-    .pretui-list-box[data-scopedcss-d9a8b45361-cd067b2df8] {
-      appearance: none;
-      width: 15px;
-      height: 15px;
-      margin: 0;
-      border-radius: 5px;
-      background: var(
-        --pretui-control-rest,
-        var(--field, var(--boxel-light))
-      );
-      box-shadow: 0 0 0 1px var(--pretui-control-border, var(--input));
-      cursor: pointer;
-      display: inline-grid;
-      place-content: center;
-      flex: none;
-    }
-    .pretui-list-radio[data-scopedcss-d9a8b45361-cd067b2df8] {
-      border-radius: 50%;
-    }
-    .pretui-list-box[data-scopedcss-d9a8b45361-cd067b2df8]:checked {
-      background: var(--primary);
-      box-shadow:
-        0 0 0 1px color-mix(in oklch, var(--primary) 70%, var(--border)),
-        var(--pretui-edge-highlight, inset 0 1px 0 rgb(255 255 255 / 0.14));
-    }
-    .pretui-list-box[data-scopedcss-d9a8b45361-cd067b2df8]:checked::before {
-      content: '';
-      width: 9px;
-      height: 9px;
-      background: var(--primary-foreground);
-      clip-path: polygon(
-        14% 47%,
-        38% 70%,
-        86% 18%,
-        96% 30%,
-        39% 89%,
-        4% 58%
-      );
-    }
-    .pretui-list-radio[data-scopedcss-d9a8b45361-cd067b2df8]:checked::before {
-      clip-path: circle(50%);
-      width: 7px;
-      height: 7px;
-    }
-    .pretui-list-box[data-scopedcss-d9a8b45361-cd067b2df8]:focus-visible {
-      outline: 2px solid var(--ring);
-      outline-offset: 2px;
-    }
-    /* Coarse pointers get the 44px floor without changing the fine-pointer
-       rhythm. */
-    @media (pointer: coarse) {
-      .pretui-list-line[data-scopedcss-d9a8b45361-cd067b2df8] {
-        min-block-size: 44px;
-      }
-      .pretui-list-expbtn[data-scopedcss-d9a8b45361-cd067b2df8] {
-        inline-size: 2.4em;
-        block-size: 2.4em;
-      }
-      .pretui-list-box[data-scopedcss-d9a8b45361-cd067b2df8] {
-        width: 20px;
-        height: 20px;
-      }
-    }
-  }
-
-  @layer PretComponent {
-    @keyframes pretui-pixel-on-data-scopedcss-cae5827e83-74a3a9dccc {
-      0%,
-      100% {
-        opacity: 0.15;
-      }
-      50% {
-        opacity: 1;
-      }
-    }
-    @keyframes pretui-shimmer-text-data-scopedcss-cae5827e83-74a3a9dccc {
-      from {
-        background-position: 200% 0;
-      }
-      to {
-        background-position: -200% 0;
-      }
-    }
-    .pretui-loading[data-scopedcss-cae5827e83-74a3a9dccc] {
-      display: inline-flex;
-      align-items: center;
-      gap: 10px;
-    }
-    .pretui-pixelgrid[data-scopedcss-cae5827e83-74a3a9dccc] {
-      display: grid;
-      grid-template-columns: repeat(3, 4px);
-      gap: 1.5px;
-    }
-    .pretui-pixel[data-scopedcss-cae5827e83-74a3a9dccc] {
-      width: 4px;
-      height: 4px;
-      background: var(--foreground);
-      border-radius: 1px;
-      opacity: 0.15;
-    }
-    .pretui-pixel[data-round][data-scopedcss-cae5827e83-74a3a9dccc] {
-      border-radius: 50%;
-    }
-    .pretui-shimmer-label[data-scopedcss-cae5827e83-74a3a9dccc] {
-      font-size: var(--text-ui-md, 12.5px);
-      font-weight: 500;
-      background-image: linear-gradient(90deg, var(--ink-3, var(--boxel-400)) 35%, var(--foreground) 50%, var(--ink-3, var(--boxel-400)) 65%);
-      background-size: 200% 100%;
-      -webkit-background-clip: text;
-      background-clip: text;
-      color: transparent;
-      animation: pretui-shimmer-text-data-scopedcss-cae5827e83-74a3a9dccc 1.4s linear infinite;
-      white-space: nowrap;
-    }
-    .pretui-elapsed[data-scopedcss-cae5827e83-74a3a9dccc] {
-      font-family: var(--font-mono);
-      font-size: 12px;
-      color: var(--ink-3, var(--boxel-400));
-      font-variant-numeric: tabular-nums;
-    }
-    @media (prefers-reduced-motion: reduce) {
-      .pretui-pixel[data-scopedcss-cae5827e83-74a3a9dccc] {
-        animation: none !important;
-        opacity: 0.6;
-      }
-      .pretui-shimmer-label[data-scopedcss-cae5827e83-74a3a9dccc] {
-        animation: none;
-        color: var(--muted-foreground);
-        background: none;
-      }
-    }
-  }
-
-  @layer PretComponent {
-    .pretui-scroller[data-scopedcss-11ca330a13-f16dc4fa82] {
-      position: relative;
-      display: block;
-      min-width: 0;
-      container-type: inline-size;
-    }
-    .pretui-scroller-viewport[data-scopedcss-11ca330a13-f16dc4fa82] {
-      min-width: 0;
-      overscroll-behavior: contain;
-      scrollbar-width: thin;
-      scrollbar-gutter: stable;
-    }
-    .pretui-scroller-viewport[data-scopedcss-11ca330a13-f16dc4fa82]:focus-visible {
-      outline: 2px solid var(--ring);
-      outline-offset: 2px;
-      border-radius: var(--radius-surface, 10px);
-    }
-    .pretui-scroller-viewport[data-orientation='horizontal'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      overflow-x: auto;
-      overflow-y: hidden;
-    }
-    .pretui-scroller-viewport[data-orientation='vertical'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      overflow-x: hidden;
-      overflow-y: auto;
-    }
-    .pretui-scroller-viewport[data-orientation='both'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      overflow: auto;
-    }
-    .pretui-scroller-viewport[data-hide-scrollbar='true'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      scrollbar-width: none;
-    }
-    .pretui-scroller-edge[data-scopedcss-11ca330a13-f16dc4fa82] {
-      position: absolute;
-      opacity: 0;
-      pointer-events: none;
-      /* An opacity fade is not motion that encodes a state change so much
-         as a state change that would otherwise pop; it stays short and it
-         is cut entirely under reduced motion. */
-      transition: opacity 140ms linear;
-    }
-    .pretui-scroller-edge[data-side='start-x'][data-scopedcss-11ca330a13-f16dc4fa82],
-    .pretui-scroller-edge[data-side='end-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      inset-block: 0;
-      inline-size: var(--pretui-scroller-fade, 28px);
-    }
-    .pretui-scroller-edge[data-side='start-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      inset-inline-start: 0;
-    }
-    .pretui-scroller-edge[data-side='end-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      inset-inline-end: 0;
-    }
-    .pretui-scroller-edge[data-side='start-y'][data-scopedcss-11ca330a13-f16dc4fa82],
-    .pretui-scroller-edge[data-side='end-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      inset-inline: 0;
-      block-size: var(--pretui-scroller-fade, 28px);
-    }
-    .pretui-scroller-edge[data-side='start-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      inset-block-start: 0;
-    }
-    .pretui-scroller-edge[data-side='end-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      inset-block-end: 0;
-    }
-    /* Sibling combinators off the viewport's own attributes: the state
-       never round-trips through Glimmer, so a flick costs no renders. */
-    .pretui-scroller-viewport[data-start-x='clipped'] ~ .pretui-scroller-edge[data-side='start-x'][data-scopedcss-11ca330a13-f16dc4fa82],
-    .pretui-scroller-viewport[data-end-x='clipped'] ~ .pretui-scroller-edge[data-side='end-x'][data-scopedcss-11ca330a13-f16dc4fa82],
-    .pretui-scroller-viewport[data-start-y='clipped'] ~ .pretui-scroller-edge[data-side='start-y'][data-scopedcss-11ca330a13-f16dc4fa82],
-    .pretui-scroller-viewport[data-end-y='clipped'] ~ .pretui-scroller-edge[data-side='end-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      opacity: 1;
-    }
-    .pretui-scroller[data-edge='none'] .pretui-scroller-edge[data-scopedcss-11ca330a13-f16dc4fa82] {
-      display: none;
-    }
-    .pretui-scroller[data-edge='fade'] .pretui-scroller-edge[data-side='start-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to right,
-        var(--pretui-scroller-ground, var(--card)),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='fade'] .pretui-scroller-edge[data-side='end-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to left,
-        var(--pretui-scroller-ground, var(--card)),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='fade'] .pretui-scroller-edge[data-side='start-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to bottom,
-        var(--pretui-scroller-ground, var(--card)),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='fade'] .pretui-scroller-edge[data-side='end-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to top,
-        var(--pretui-scroller-ground, var(--card)),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='shadow'] .pretui-scroller-edge[data-side='start-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to right,
-        color-mix(in oklch, var(--foreground) 14%, transparent),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='shadow'] .pretui-scroller-edge[data-side='end-x'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to left,
-        color-mix(in oklch, var(--foreground) 14%, transparent),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='shadow'] .pretui-scroller-edge[data-side='start-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to bottom,
-        color-mix(in oklch, var(--foreground) 14%, transparent),
-        transparent
-      );
-    }
-    .pretui-scroller[data-edge='shadow'] .pretui-scroller-edge[data-side='end-y'][data-scopedcss-11ca330a13-f16dc4fa82] {
-      background: linear-gradient(
-        to top,
-        color-mix(in oklch, var(--foreground) 14%, transparent),
-        transparent
-      );
-    }
-    @media (prefers-reduced-motion: reduce) {
-      .pretui-scroller-edge[data-scopedcss-11ca330a13-f16dc4fa82] {
-        transition: none;
-      }
-    }
-  }
-
-  .intro[data-scopedcss-9c42952c7e-0aadf83a58] {
-    margin: 0;
-  }
-  /* The dialog renders inside the chooser, whose light-on-dark scrollbar
-     color is inherited; restate it for the dialog's light surface. */
-  .realm-list-frame[data-scopedcss-9c42952c7e-0aadf83a58] {
-    scrollbar-color: color-mix(
-        in oklch,
-        var(--muted-foreground) 50%,
-        transparent
-      )
-      transparent;
-  }
-  .realm-list-frame[data-scopedcss-9c42952c7e-0aadf83a58] .pretui-scroller-viewport {
-    max-height: min(50dvh, 26rem);
-  }
-  /* Realm icons are rounded squares on the workspace tiles; match them. */
-  .realm-icon[data-scopedcss-9c42952c7e-0aadf83a58] .pretui-avatar {
-    border-radius: var(--boxel-border-radius-xs);
-  }
-  .loading[data-scopedcss-9c42952c7e-0aadf83a58] {
-    display: flex;
-    justify-content: center;
-    padding: var(--boxel-sp-lg) 0;
-  }
-
-  .manage-catalogs[data-scopedcss-9c42952c7e-bfb1490ce6] {
-    display: inline-flex;
-  }
-  .manage-catalogs[data-scopedcss-9c42952c7e-bfb1490ce6] .pretui-iconbtn {
-    color: var(--boxel-light);
-    background: transparent;
-  }
-  .manage-catalogs[data-scopedcss-9c42952c7e-bfb1490ce6] .pretui-iconbtn:hover,
-  .manage-catalogs[data-scopedcss-9c42952c7e-bfb1490ce6] .pretui-iconbtn:focus-visible {
-    color: var(--boxel-highlight);
-  }
-
-  @keyframes fadeIn-data-scopedcss-d65ff592b2-89330100a6 {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-  .workspace-chooser[data-scopedcss-d65ff592b2-89330100a6] {
-    --workspace-chooser-gutter: 5rem;
-    --workspace-chooser-card-width: fit-content;
-    --workspace-chooser-tile-width: var(--boxel-xxs-container);
-    /* Favorites until the grid is measured; capped so the tile never
-       outgrows a content area narrower than 1.5 tiles. */
-    --workspace-chooser-enlarged-tile-width: min(
-      var(--boxel-xxs-container) * 1.5,
-      100vw - 2 * var(--workspace-chooser-gutter)
-    );
-  }
-  .sort-controls[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    align-items: center;
-    white-space: nowrap;
-  }
-  .sort-select[data-scopedcss-d65ff592b2-89330100a6] {
-    flex-shrink: 0;
-    /* Keep the icon and label on one line at narrow top-bar widths. */
-    --boxel-select-trigger-content-wrap: nowrap;
-    --boxel-select-background-color: var(--boxel-800);
-    --boxel-select-text-color: var(--boxel-light);
-    --boxel-select-border-color: var(--boxel-light-25);
-    --boxel-select-focus-border-color: var(--boxel-light-50);
-    --icon-color: var(--boxel-light);
-  }
-  /* Below this top-bar width the label would push the trigger over the
-     profile button, so show the icon only and keep the label for screen
-     readers. */
-  @container (width <= 20rem) {
-    .sort-select[data-scopedcss-d65ff592b2-89330100a6] {
-      --boxel-select-trigger-gap: var(--boxel-sp-2xs);
-    }
-    .sort-select .sort-label[data-scopedcss-d65ff592b2-89330100a6] {
-      position: absolute;
-      width: 1px;
-      height: 1px;
-      margin: -1px;
-      overflow: hidden;
-      clip-path: inset(50%);
-    }
-  }
-  .boxel-select__dropdown.workspace-chooser-sort-dropdown {
-    --boxel-dropdown-background-color: var(--boxel-650);
-    --boxel-dropdown-border-color: var(--boxel-light-25);
-    --boxel-dropdown-text-color: var(--boxel-light);
-    --boxel-dropdown-selected-text-color: var(--boxel-light);
-    --boxel-dropdown-hover-color: var(--boxel-700);
-    --boxel-dropdown-highlight-color: var(--boxel-650);
-    --boxel-dropdown-highlight-hover-color: var(--boxel-700);
-    --boxel-dropdown-selected-highlighted-color: var(--boxel-700);
-    --boxel-dropdown-selected-hover-color: var(--boxel-700);
-  }
-  .workspace-chooser-sort-dropdown .boxel-select-option-checkmark {
-    --icon-color: var(--boxel-highlight);
-    color: var(--boxel-highlight);
-  }
-  .workspace-chooser__content[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: var(--boxel-sp-lg);
-    height: 100%;
-    /* The bottom always clears the floating AI assistant button, which
-       sits over the chooser's bottom-right corner. */
-    padding: calc(var(--workspace-chooser-gutter) + 3.75rem)
-      var(--workspace-chooser-gutter)
-      max(
-        var(--workspace-chooser-gutter),
-        calc(
-          var(--container-button-size) + var(--operator-mode-spacing) +
-            var(--boxel-sp)
-        )
-      );
-    overflow: auto;
-    /* Fade in only the contents; the dark chooser background above
-       paints immediately so the grey operator-mode canvas never flashes
-       between the (dark) sign-in screen and the (dark) chooser. */
-    opacity: 0;
-    animation: fadeIn-data-scopedcss-d65ff592b2-89330100a6 0.5s ease-in forwards;
-  }
-  .sections-wrapper[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    flex-direction: column;
-    gap: calc(var(--boxel-sp-lg) * 2);
-  }
-  .workspace-section[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    flex-direction: column;
-    gap: var(--boxel-sp-lg);
-  }
-  .section-header[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    align-items: center;
-    gap: var(--boxel-sp-xs);
-  }
-  .section-header-icon[data-scopedcss-d65ff592b2-89330100a6] {
-    --icon-color: var(--boxel-teal);
-    color: var(--boxel-teal);
-    flex-shrink: 0;
-  }
-  .section-header--toggle[data-scopedcss-d65ff592b2-89330100a6] {
-    background: none;
-    border: none;
-    padding: 0;
-    cursor: pointer;
-    width: fit-content;
-    text-align: left;
-  }
-  .section-disclosure-icon[data-scopedcss-d65ff592b2-89330100a6] {
-    --icon-color: var(--boxel-light);
-    --icon-fill: var(--boxel-light);
-    color: var(--boxel-light);
-    flex-shrink: 0;
-    transition: transform 0.15s ease;
-  }
-  .section-header--toggle.is-expanded .section-disclosure-icon[data-scopedcss-d65ff592b2-89330100a6] {
-    transform: rotate(90deg);
-  }
-  .section-count[data-scopedcss-d65ff592b2-89330100a6] {
-    color: var(--boxel-400);
-    font: 600 var(--boxel-font-sm);
-    letter-spacing: var(--boxel-lsp);
-  }
-  .workspace-chooser__title[data-scopedcss-d65ff592b2-89330100a6] {
-    color: var(--boxel-light);
-    font: 400 var(--boxel-font-lg);
-    letter-spacing: var(--boxel-lsp);
-  }
-  .workspace-list[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    flex-wrap: wrap;
-    gap: calc(var(--boxel-sp-lg) + var(--boxel-sp-lg));
-    padding: var(--boxel-sp-xs) 0;
-  }
-  .section-empty[data-scopedcss-d65ff592b2-89330100a6] {
-    color: var(--boxel-400);
-    font: 400 var(--boxel-font-sm);
-  }
-  .unreachable-notice[data-scopedcss-d65ff592b2-89330100a6] {
-    display: flex;
-    align-items: center;
-    gap: var(--boxel-sp-2xs);
-    max-width: 40rem;
-    padding: var(--boxel-sp-xs) var(--boxel-sp-sm);
-    border-radius: var(--boxel-border-radius);
-    background-color: var(--boxel-light-10);
-    color: var(--boxel-light);
-    font: 400 var(--boxel-font-sm);
-    letter-spacing: var(--boxel-lsp-xs);
-  }
-  .unreachable-notice-icon[data-scopedcss-d65ff592b2-89330100a6] {
-    flex-shrink: 0;
-  }
-  .unreachable-notice-spinner[data-scopedcss-d65ff592b2-89330100a6] {
-    flex-shrink: 0;
-  }
-  /* One tile per row, filling the chooser's own width, which is less
-     than the viewport's when the AI assistant panel is open. */
-  @media (max-width: 30rem) {
-    .workspace-chooser[data-scopedcss-d65ff592b2-89330100a6] {
-      --workspace-chooser-gutter: var(--boxel-sp);
-      --workspace-chooser-card-width: 100%;
-      --workspace-chooser-tile-width: 100%;
-      --workspace-chooser-enlarged-tile-width: 100%;
-    }
-    .sections-wrapper[data-scopedcss-d65ff592b2-89330100a6] {
-      width: 100%;
-    }
-  }