@layer pages {
  /* Block: home-container */
  .home-container {
    max-width: 800px;
    margin: 0 auto;
    padding-left: var(--space-md);
    padding-right: var(--space-md);
    width: 100%;
  }

  /* Home header with flexbox layout */
  .home-header {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    margin-bottom: var(--space-md);
    gap: var(--space-md);
    position: relative;
  }

  /* Left section: logo and subtitle */
  .home-header__left {
    display: flex;
    gap: var(--space-sm);
    flex: 1;
  }

  .home-header__logo {
    margin: 0;
    flex-shrink: 0;
    margin-left: -5px;
  }

  .home-header__logo svg {
    max-width: 170px;
    max-height: 24px;
    display: block;
  }

  .home-header__subtitle {
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    white-space: nowrap;
    margin-top: auto;
  }

  .home-header__last-updated {
    margin: 0;
    margin-top: auto;
    white-space: nowrap;
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    position: absolute;
    top: calc(-1 * var(--space-md));
    right: calc(-1 * var(--space-lg));
  }

  /* Responsive adjustments */
  @media (max-width: 60ch) {
    .home-header__left {
      margin-top: 10px;
    }
  }

  /* Home page specific styles */
  .home-container .notice {
    margin-bottom: var(--space-md);
  }
}