@media (min-width: 1500px) {
  main {
    padding-top: 44px;
  }
  .work-grid {
    grid-template-columns: minmax(0, 1fr) 280px;
  }
  .settings {
    padding: 20px 24px;
  }
  .drop-zone,
  .empty-state {
    min-height: 410px;
  }
}
@media (max-width: 1120px) {
  .app-shell {
    grid-template-columns: 170px minmax(0, 1fr);
  }
  .sidebar {
    padding-left: 10px;
    padding-right: 10px;
  }
  .brand {
    padding: 0 9px;
  }
  .brand strong {
    font-size: 21px;
  }
  .nav-index {
    display: none;
  }
  main {
    padding: 26px 24px 15px;
  }
  .topbar {
    padding: 0 24px;
  }
  .app-footer {
    padding-left: 24px;
    padding-right: 24px;
  }
  .work-grid {
    grid-template-columns: minmax(0, 1fr) 230px;
  }
  .settings {
    padding-left: 16px;
    padding-right: 16px;
  }
  .section-toolbar {
    padding: 15px 14px;
  }
  .toolbar-left .limit {
    display: none;
  }
  .metrics > div {
    padding-left: 17px;
  }
  .metrics strong {
    font-size: 21px;
  }
}
@media (max-width: 850px) {
  .app-shell {
    display: block;
  }
  .sidebar {
    position: static;
    height: auto;
    padding: 14px 20px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    display: block;
  }
  .brand {
    padding: 0;
  }
  .brand img {
    width: 31px;
    height: 31px;
  }
  .brand strong {
    font-size: 21px;
  }
  .brand small {
    display: none;
  }
  .nav-caption,
  .sidebar-bottom {
    display: none;
  }
  .tool-nav {
    flex-direction: row;
    margin-top: 14px;
    gap: 10px;
  }
  .nav-item {
    width: auto;
    min-width: 132px;
    border-radius: 5px 5px 0 0;
    height: 41px;
  }
  .topbar {
    height: 47px;
  }
  .page-heading {
    margin-bottom: 22px;
  }
  h1 {
    font-size: 25px;
  }
  .metrics {
    margin-bottom: 23px;
  }
  .work-grid {
    grid-template-columns: minmax(0, 1fr) 235px;
  }
  .drop-zone,
  .empty-state {
    min-height: 330px;
  }
}
@media (max-width: 620px) {
  .sidebar {
    padding: 14px 17px 0;
  }
  .topbar {
    padding: 0 18px;
  }
  .breadcrumb {
    gap: 10px;
    font-size: 11px;
  }
  .local-badge {
    font-size: 10px;
  }
  main {
    padding: 24px 16px 12px;
  }
  h1 {
    font-size: 23px;
  }
  .eyebrow {
    font-size: 10px;
  }
  .page-heading {
    gap: 10px;
  }
  .quiet-button {
    font-size: 11px;
    padding: 0 9px;
    height: 33px;
  }
  .metrics {
    padding: 15px 0;
    gap: 10px 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 22px;
  }
  .metrics > div {
    padding-left: 18px;
  }
  .metrics > div:nth-child(3) {
    padding-left: 0;
    border: 0;
  }
  .metrics span {
    font-size: 10px;
  }
  .metrics strong {
    font-size: 22px;
  }
  .metrics small {
    font-size: 10px;
  }
  .work-grid {
    display: flex;
    flex-direction: column;
  }
  .data-area {
    width: 100%;
  }
  .settings {
    border-left: 0;
    border-top: 1px solid var(--line);
    padding: 20px;
  }
  .drop-zone,
  .empty-state {
    min-height: 260px;
  }
  .settings .field {
    margin-bottom: 15px;
  }
  .settings-heading {
    margin-bottom: 18px;
  }
  .section-toolbar {
    padding: 14px 12px;
  }
  .section-toolbar h2 {
    font-size: 13px;
  }
  .secondary-button {
    font-size: 11px;
    height: 31px;
  }
  .toolbar-actions {
    gap: 2px;
  }
  .table-footer {
    font-size: 10px;
    padding: 10px 12px;
    gap: 8px;
  }
  .inline-label {
    gap: 4px;
  }
  .app-footer {
    padding: 8px 17px 20px;
    font-size: 9px;
  }
  .rename-table {
    min-width: 510px;
  }
  .table-scroll {
    max-height: 340px;
  }
  .export-area {
    margin-top: 18px;
  }
  .column-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 8px;
  }
  .brand {
    gap: 10px;
  }
  .check-row {
    font-size: 12px;
  }
  .message {
    font-size: 11px;
  }
  .file-item .file-meta {
    display: none;
  }
  .field-divider {
    margin: 19px 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
  }
}
