@media (max-width: 76rem) {
  .materias-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 70rem) {
  .showcase-state-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 56rem) {
  .materias-toolbar {
    grid-template-columns: 1fr 1fr;
  }

  .materias-toolbar__search {
    grid-column: 1 / -1;
  }

  .materias-toolbar__summary {
    margin-top: 1.45rem;
    text-align: right;
  }
}

@media (min-width: 54.001rem) {
  .app-sidebar {
    transition: transform var(--transition-medium);
  }

  .app-shell.is-sidebar-collapsed .app-sidebar {
    transform: translateX(-105%);
  }

  .app-shell.is-sidebar-collapsed .app-content {
    margin-left: 0;
  }
}

@media (max-width: 54rem) {
  .app-content {
    margin-left: 0;
  }

  .app-sidebar {
    width: min(19rem, calc(100vw - 2.5rem));
    transform: translateX(-105%);
    transition: transform var(--transition-medium);
  }

  .app-shell.is-navigation-open .app-sidebar {
    transform: translateX(0);
  }

  .app-topbar__menu-button {
    display: grid;
  }
}

@media (min-width: 54.001rem) {
  .app-sidebar-backdrop {
    display: none;
  }
}

@media (max-width: 48rem) {
  .m3-showcase__grid {
    grid-template-columns: 1fr;
  }

  .showcase-card--wide {
    grid-column: auto;
  }
}

@media (max-width: 42rem) {
  .app-main {
    padding: 1.35rem max(1rem, var(--safe-area-right)) max(2rem, var(--safe-area-bottom))
      max(1rem, var(--safe-area-left));
  }

  .app-topbar {
    min-height: 4.25rem;
    padding-right: max(1rem, var(--safe-area-right));
    padding-left: max(1rem, var(--safe-area-left));
  }

  .app-topbar__identity span {
    display: none;
  }

  .page-header {
    align-items: flex-start;
    flex-direction: column;
    gap: var(--space-4);
  }

  .page-header__actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .page-header__actions > .button {
    flex: 1 1 12rem;
  }

  .foundation-card {
    grid-template-columns: 1fr;
  }

  .theme-preview__option,
  .showcase-actions .button {
    width: 100%;
  }

  .persistent-alert {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .persistent-alert__actions {
    grid-column: 1 / -1;
  }

  .modal-overlay {
    align-items: flex-end;
    padding: 0;
  }

  .modal {
    width: 100%;
    max-height: calc(100dvh - max(1rem, var(--safe-area-top)));
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  }

  .modal--assunto-form,
  .modal--backup-import,
  .modal--structure-move {
    height: 100dvh;
    max-height: 100dvh;
    border-top: 0;
    border-radius: 0;
  }

  .modal__header,
  .side-panel__header {
    padding: var(--space-4);
    padding-top: max(var(--space-4), var(--safe-area-top));
  }

  .modal__body,
  .side-panel__body {
    padding: var(--space-4);
  }

  .modal__footer,
  .side-panel__footer {
    padding: var(--space-3) var(--space-4);
    padding-bottom: max(var(--space-3), var(--safe-area-bottom));
  }

  .side-panel {
    width: 100%;
    border-left: 0;
  }

  .overlay-actions {
    flex-direction: column-reverse;
  }

  .overlay-actions .button {
    width: 100%;
  }

  .materias-grid {
    grid-template-columns: 1fr;
  }

  .materias-toolbar {
    grid-template-columns: 1fr;
  }

  .materias-toolbar__search {
    grid-column: auto;
  }

  .materias-toolbar__summary {
    margin-top: 0;
    text-align: left;
    white-space: normal;
  }

  .materia-card {
    min-height: auto;
  }

  .materia-card__footer {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .materia-card__reorder,
  .materia-card__actions,
  .materia-card__actions .button {
    width: 100%;
  }

  .materia-card__reorder .icon-button {
    width: auto;
    flex: 1;
  }

  .color-picker__options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .materia-summary {
    grid-template-columns: 1fr;
  }

  .app-notifications {
    right: max(var(--space-3), var(--safe-area-right));
    bottom: max(var(--space-3), var(--safe-area-bottom));
    left: max(var(--space-3), var(--safe-area-left));
    width: auto;
  }
}

@media (max-width: 34rem) {
  .app-sidebar {
    width: min(18rem, calc(100vw - 2rem));
  }

  .page-header__actions,
  .settings-actions,
  .recovery-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .page-header__actions > .button,
  .page-header__actions > .action-menu,
  .settings-actions .button,
  .recovery-actions .button {
    width: 100%;
  }

  .page-header__actions > .button,
  .page-header__actions > .action-menu {
    flex: 0 0 auto;
  }

  .page-header__actions .action-menu > .icon-button {
    width: 100%;
  }

  .breadcrumb__list {
    align-items: flex-start;
  }

  .color-picker__options {
    grid-template-columns: 1fr;
  }
}

@media (max-height: 34rem) and (orientation: landscape) {
  .modal-overlay {
    align-items: stretch;
    padding: 0;
  }

  .modal {
    width: 100%;
    max-width: none;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }
}