/* Responsive adjustments */

  @media (max-width: 1080px) {
    :root {
      --side-toggle-width: 88px;
      --side-toggle-height: 58px;
      --side-toggle-right: 10px;
      --library-toggle-height: var(--side-toggle-height);
      --side-toggle-top: 10px;
    }
    .layout, .selected, .backup-grid {
      grid-template-columns: 1fr;
    }
    .theme-toggle {
      top: calc(var(--side-toggle-top) + var(--library-toggle-height) + var(--side-toggle-gap));
      right: var(--side-toggle-right);
    }
    .library-selector-shell {
      top: var(--side-toggle-top);
      right: var(--side-toggle-right);
      width: var(--side-toggle-width);
    }
    .system-toggle {
      top: var(--side-toggle-top);
      right: var(--side-toggle-right);
    }
    .sidebar {
      position: static;
    }
    .quiz-topbar {
      flex-direction: column;
      align-items: stretch;
    }
    .quiz-setup-actions {
      grid-template-columns: 1fr;
    }
    .quiz-setup-buttons {
      justify-content: stretch;
    }
    .quiz-setup-side {
      justify-items: stretch;
    }
    .quiz-difficulty-control {
      justify-content: center;
      width: 100%;
    }
    .quiz-setup-buttons > button {
      width: 100%;
    }
    .empty-guide-steps {
      grid-template-columns: 1fr;
    }
    .library-selector-option[data-library-help]::after {
      right: auto;
      left: 0;
      top: calc(100% + 8px);
      width: min(270px, calc(100vw - 24px));
      transform: translateY(-4px);
    }
    .library-selector-option[data-library-help]:hover::after,
    .library-selector-option[data-library-help]:focus-visible::after {
      transform: translateY(0);
    }
    .study-timer-controls {
      grid-template-columns: 1fr;
    }
    .drive-share-step {
      align-items: stretch;
      flex-direction: column;
    }
    .drive-share-step button {
      width: 100%;
    }
    .drive-share-action-stack {
      width: 100%;
      justify-items: stretch;
    }
    .shared-pack-status-inline {
      max-width: none;
    }
    .anatomy-entry-card {
      min-height: 460px;
    }
    .anatomy-quiz-actions {
      grid-template-columns: 1fr;
    }
    .consent-banner-body {
      grid-template-columns: 1fr;
    }
    .consent-banner {
      left: 50%;
      right: auto;
      bottom: 16px;
      width: min(1120px, calc(100vw - 32px));
      transform: translateX(-50%);
      padding: 14px;
      border-radius: 18px;
    }
    .consent-banner-main {
      grid-template-columns: 42px minmax(0, 1fr);
      gap: 12px;
      align-items: start;
    }
    .consent-banner-icon {
      width: 42px;
      height: 42px;
      border-radius: 13px;
    }
    .consent-banner-icon svg {
      width: 23px;
      height: 23px;
    }
    .consent-banner-actions {
      grid-column: 1 / -1;
      justify-content: stretch;
      gap: 8px;
    }
    .consent-banner-actions .btn-primary {
      flex: 1 1 auto;
      min-width: 0;
    }
    .consent-details-link {
      min-width: 88px;
      padding-inline: 8px;
    }
    .consent-detail-row {
      grid-template-columns: 1fr;
      gap: 3px;
    }
  }
  @media (max-width: 640px) {
    :root {
      --side-toggle-width: 82px;
      --side-toggle-height: 54px;
      --library-toggle-height: var(--side-toggle-height);
    }
    .embedded-note-head,
    .study-timer-head {
      align-items: flex-start;
      flex-direction: column;
    }
    .anatomy-entry-face {
      padding: 0;
    }
    .theme-toggle {
      width: var(--side-toggle-width);
      height: var(--side-toggle-height);
      min-height: var(--side-toggle-height);
      padding: 6px;
      gap: 5px;
      border-radius: 14px;
    }
    .library-selector-shell {
      top: var(--side-toggle-top);
      right: var(--side-toggle-right);
      width: var(--side-toggle-width);
    }
    .system-toggle {
      top: var(--side-toggle-top);
      right: var(--side-toggle-right);
    }
    .library-selector-switch .mobile-switch-mechanism {
      transform: translate(-50%, -50%) scale(1.06);
    }
    .theme-toggle-ui {
      width: 30px;
      height: 18px;
    }
    .theme-toggle-thumb {
      width: 10px;
      height: 10px;
    }
    .theme-toggle[aria-pressed="true"] .theme-toggle-thumb {
      transform: translateX(12px);
    }
    .theme-toggle-copy {
      min-width: 0;
    }
    .theme-toggle-title {
      font-size: 9px;
    }
    .theme-toggle-value {
      font-size: 8px;
    }
  }
  @media (max-width: 600px) and (pointer: coarse) {
    html,
    body {
      max-width: 100%;
      overflow-x: hidden;
    }
    .wrap {
      width: 100%;
      max-width: 100%;
      padding: calc(env(safe-area-inset-top, 0px) + 10px) 10px 18px;
    }
    .hero.has-gqb-logo-game {
      min-height: 0;
      height: 0;
      margin: 0;
      padding: 0;
      border: 0;
      border-radius: 0;
      background: transparent !important;
      box-shadow: none !important;
      overflow: visible;
    }
    .hero.has-gqb-logo-game::after,
    .hero.has-gqb-logo-game::before,
    .hero.has-gqb-logo-game > h1,
    .hero.has-gqb-logo-game > p,
    .hero.has-gqb-logo-game > .pill-row {
      display: none !important;
    }
    .hero.has-gqb-logo-game > .gqb-logo-game-host:not(.is-docked) {
      display: none !important;
    }
    .layout {
      gap: 10px;
    }
    .card,
    .sidebar,
    .main {
      border-radius: 18px;
    }
    .main,
    .sidebar {
      padding: 12px;
    }
    .library-utility-stack,
    #selectedBadges {
      display: none !important;
    }
    .tabs {
      gap: 8px;
      padding-right: 64px;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }
    .tab-btn {
      min-height: 42px;
      padding: 10px 14px;
      white-space: nowrap;
    }
    .theme-toggle,
    .system-toggle,
    .library-selector-shell {
      display: none !important;
    }
    #imageModal {
      padding: 0 !important;
      align-items: stretch;
      justify-content: stretch;
    }
    #imageModal .viewer {
      width: 100vw;
      height: 100dvh;
      max-width: none;
      max-height: none;
      border: 0;
      border-radius: 0;
    }
    #imageModal .viewer-toolbar {
      top: calc(env(safe-area-inset-top, 0px) + 10px);
      right: calc(env(safe-area-inset-right, 0px) + 10px);
      left: calc(env(safe-area-inset-left, 0px) + 10px);
    }
    #imageModal .viewer-toolbar-main {
      max-width: calc(100vw - 20px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
    }
    #imageModal .viewer-toolbar button {
      min-height: 42px;
    }
    #imageModal .viewer-enhance-panel {
      max-width: min(100%, 320px);
    }
  }

/* Touch compatibility refinements */
#viewerStage {
  touch-action: none;
  overscroll-behavior: contain;
}

@media (max-width: 640px) {
  .library-import-progress-panel {
    right: max(12px, env(safe-area-inset-right));
    left: max(12px, env(safe-area-inset-left));
    bottom: max(12px, env(safe-area-inset-bottom));
    width: auto;
    border-radius: 16px;
  }
}
button, .btn, .chip, .sort-trigger, .sort-option, .tab-btn, .group-badge, input[type="range"], input[type="text"], input[type="search"], textarea, select, label[for] {
  touch-action: manipulation;
}
