@layer reset, tokens, base, components;

@import url("/assets/reset-628a138a.css") layer(reset);
@import url("/assets/tokens/colors-264136a4.css") layer(tokens);
@import url("/assets/tokens/typography-c670ea02.css") layer(tokens);
@import url("/assets/tokens/effects-c20d78a5.css") layer(tokens);
@import url("/assets/tokens/spacing-a14176a6.css") layer(tokens);
@import url("/assets/tokens/shape-2c27d790.css") layer(tokens);
@import url("/assets/base/document-04dc4d35.css") layer(base);
@import url("/assets/base/typography-066ca238.css") layer(base);
@import url("/assets/components/icons-fd3038a6.css") layer(components);
@import url("/assets/components/buttons-bfefa20c.css") layer(components);
@import url("/assets/components/application-navigation-a954c692.css") layer(components);

@layer components {
  .offline-page {
    display: flex;
    flex-direction: column;
  }

  .offline-page .application-shell__content {
    display: grid;
    flex: 1;
    place-items: center;
  }

  .offline-page .application-navigation__brand,
  .offline-page .context-label,
  .offline-page .primary-navigation__item {
    color: var(--color-text-disabled);
  }

  .offline-page .application-navigation__summary,
  .offline-page .primary-navigation__item {
    background: transparent;
    cursor: default;
  }

  .offline-page .primary-navigation__item {
    inline-size: 100%;
  }

  .offline-page .context-label {
    min-inline-size: 0;
  }

  .offline-page [data-offline-context] {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .offline-page .context-label .icon {
    flex-shrink: 0;
  }

  .offline-page__message {
    display: grid;
    justify-items: center;
    gap: var(--space-md);
    inline-size: 100%;
    max-inline-size: 38rem;
    padding: var(--space-xl) var(--space-xl) var(--space-3xl);
    text-align: center;
  }

  .offline-page__icon {
    inline-size: 4.6875rem;
    block-size: 4.6875rem;
    margin-block-end: var(--space-xs);
    color: var(--color-text-muted);
  }

  .offline-page__title {
    max-inline-size: 18ch;
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-black);
    line-height: var(--line-height-tight);
  }

  .offline-page__description {
    color: var(--color-text-secondary);
    font-size: var(--font-size-xl);
  }

  .offline-page__retry {
    margin-block-start: var(--space-xs);
  }
}