@media (max-width: 76rem) {
  .desktop-nav a:nth-last-child(-n + 2) { display: none; }
  .compact-search { width: 11rem; }
  .mobile-more-wrap { display: block; }
  .settings-button { display: none; }
}

@media (max-width: 61rem) {
  :root { --header-height: 4rem; }

  body { padding-bottom: calc(4.75rem + env(safe-area-inset-bottom)); }

  .header-inner { gap: var(--space-3); }
  .desktop-nav,
  .compact-search,
  .add-button span,
  .settings-button { display: none; }
  .header-actions { margin-left: auto; }
  .add-button { min-width: 2.75rem; padding: 0; }
  .mobile-more-wrap { display: block; }
  .brand-copy small { display: none; }
  .collection-overflow-link { display: none !important; }

  .mobile-nav {
    position: fixed;
    z-index: var(--z-navigation);
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    min-height: calc(4.5rem + env(safe-area-inset-bottom));
    padding: var(--space-2) var(--space-2) env(safe-area-inset-bottom);
    border-top: 1px solid var(--color-border);
    background: rgba(14, 31, 47, 0.96);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }

  .mobile-nav a {
    position: relative;
    display: grid;
    place-items: center;
    align-content: center;
    min-width: 0;
    min-height: 3.75rem;
    padding: var(--space-1);
    border-radius: var(--radius-sm);
    color: var(--color-text-muted);
    gap: 0.18rem;
  }

  .mobile-nav a[aria-current="page"] {
    background: rgba(39, 66, 93, 0.66);
    color: var(--color-text);
  }

  .mobile-nav a[aria-current="page"]::before {
    position: absolute;
    top: 0;
    width: 1.5rem;
    height: 2px;
    border-radius: var(--radius-pill);
    background: var(--color-action-bright);
    content: "";
  }

  .mobile-nav span {
    max-width: 100%;
    overflow: hidden;
    font-size: clamp(0.59rem, 2.2vw, 0.7rem);
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hero {
    grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.65fr);
    min-height: 35rem;
  }

  .hero h1 { font-size: clamp(2.4rem, 6vw, 4rem); }
  .hero-lab-card { padding: var(--space-5); }
  .feature-grid { grid-template-columns: 1fr 1fr; }
  .feature-card:last-child { grid-column: 1 / -1; }
  .legal-footer { padding-bottom: var(--space-8); }
  .toast { bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
}

@media (max-width: 56rem) {
  .hero {
    grid-template-columns: 1fr;
    min-height: auto;
    padding-top: var(--space-16);
    padding-bottom: var(--space-16);
    gap: var(--space-12);
  }

  .hero-content { max-width: 36rem; }
  .hero h1 { font-size: clamp(2.4rem, 11vw, 3.5rem); }
  .hero-body { font-size: var(--text-base); }
  .hero-lab-card { width: min(84vw, 21rem); justify-self: center; transform: rotate(1.5deg); }
  .section-heading { grid-template-columns: 1fr; align-items: start; gap: var(--space-4); }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card:last-child { grid-column: auto; }
  .feature-card { min-height: 16rem; padding: var(--space-6); }
  .feature-card > svg { margin-top: var(--space-8); }
  .standard-view { padding-top: var(--space-12); }
  .empty-state { min-height: 22rem; }
  .settings-card { grid-template-columns: 2.25rem 1fr; padding: var(--space-5); gap: var(--space-3); }
  .settings-card--no-icon { grid-template-columns: 1fr; }
  .filter-disclosure summary { display: list-item; }
  .filter-disclosure:not([open]) .filter-grid { display: none; }
  .filter-grid { grid-template-columns: 1fr 1fr; margin-top: var(--space-4); }
  .library-controls__footer { align-items: stretch; flex-wrap: wrap; }
  .library-controls__footer > .filter-field { width: 100%; }
  .view-toggle { flex: 1; }
  .view-toggle button { flex: 1; }
  .resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
  .resource-card { min-height: 22rem; grid-template-rows: 7rem 1fr; }
  .resource-card__body { padding: var(--space-4); }
  .resource-card__summary { -webkit-line-clamp: 2; }
  .resource-grid--list { grid-template-columns: 1fr; }
  .resource-grid--list .resource-card { grid-template-columns: 7rem minmax(0, 1fr); min-height: 12rem; }
  .resource-detail__identity { grid-template-columns: minmax(8rem, 11rem) minmax(0, 1fr); gap: var(--space-5); }
  .resource-detail__layout { grid-template-columns: 1fr; }
  .resource-content, .resource-sidebar { padding: var(--space-5); }
  .storage-banner { align-items: stretch; flex-direction: column; }
  .storage-banner .button { width: 100%; }
  .connection-banner, .update-banner { align-items: stretch; flex-direction: column; }
  .update-banner__actions .button { flex: 1; }
  .note-editor { padding: var(--space-5); }
  .resource-editor-form { grid-template-columns: 1fr; }
  .editor-aside { position: static; }
  .editor-actions { grid-column: auto; }
  .collection-panel > header { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 33.125rem) {
  .brand-copy strong { font-size: 0.9rem; }
  .brand-mark { width: 1.15rem; }
  .header-inner { padding-right: 0.75rem; padding-left: 0.75rem; }
  .header-actions { gap: 0.3rem; }
  .icon-button,
  .add-button { min-width: 2.6rem; padding-right: 0.55rem; padding-left: 0.55rem; }
  .language-trigger svg { display: none; }
  .mobile-nav span { font-size: 0.58rem; }
  .hero-actions .button { width: 100%; }
  .segmented-control { display: grid; }
  .filter-grid, .resource-grid { grid-template-columns: 1fr; }
  .resource-grid--list .resource-card { grid-template-columns: 1fr; grid-template-rows: 6rem 1fr; }
  .resource-detail__identity { grid-template-columns: 1fr; }
  .resource-detail__cover { max-width: 11rem; }
  .editor-section, .editor-aside { padding: var(--space-4); }
  .editor-actions, .collection-create-form { grid-template-columns: 1fr; flex-direction: column; }
  .editor-actions .button, .collection-create-form .button { width: 100%; }
  .collection-add-control { width: 100%; flex-direction: column; align-items: stretch; }
}

@media (min-width: 100rem) {
  .hero { border-right: 1px solid var(--color-border); border-left: 1px solid var(--color-border); }
}

@media (max-height: 26.5625rem) and (max-width: 56rem) and (orientation: landscape) {
  .hero {
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 0.45fr);
    padding-top: var(--space-8);
    padding-bottom: var(--space-8);
  }

  .hero-lab-card {
    width: min(32vw, 15rem);
  }

  .status-pill {
    margin-bottom: var(--space-4);
  }
}