@media (max-width: 900px) {
  :root {
    --header-height: 64px;
    --context-height: auto;
    --content-padding: 18px;
  }

  body {
    overflow-y: auto;
  }

  .app-shell {
    display: block;
    height: auto;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: visible;
  }

  .global-header {
    position: sticky;
    top: 0;
    min-height: var(--header-height);
    padding: 0 14px;
  }

  .brand-copy .eyebrow,
  .save-state {
    display: none;
  }

  .brand-mark {
    width: 38px;
    height: 38px;
  }

  .header-actions {
    margin-left: auto;
  }

  #newRecordButton {
    display: none;
  }

  .subject-context {
    display: grid;
    gap: 14px;
    padding: 14px 18px 16px;
  }

  .subject-title-row {
    align-items: flex-start;
    margin-top: 8px;
  }

  .subject-status-group {
    display: none;
  }

  .button-return {
    width: 100%;
  }

  .workspace,
  .app-shell.sidebar-collapsed .workspace {
    display: block;
    overflow: visible;
  }

  .sidebar {
    display: none;
  }

  .content-panel {
    overflow: visible;
    padding-bottom: 40px;
  }

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

  .section-header {
    display: grid;
  }
}

@media (max-width: 560px) {
  :root {
    --content-padding: 14px;
  }

  .global-header {
    gap: 8px;
  }

  .brand-group {
    gap: 8px;
  }

  .brand-title {
    font-size: 0.98rem;
  }

  .subject-title-row h2 {
    white-space: normal;
  }

  .breadcrumb {
    font-size: 0.75rem;
  }

  .foundation-panel,
  .settings-panel {
    padding: 18px;
  }

  .missing-context-panel {
    gap: 18px;
    padding: 28px 20px;
  }

  .missing-context-action {
    width: 100%;
  }

  .toast-region {
    right: 12px;
    bottom: 12px;
    width: calc(100vw - 24px);
  }
}

@media (max-height: 660px) and (min-width: 901px) {
  :root {
    --header-height: 62px;
    --context-height: 98px;
  }

  .subject-context {
    padding-block: 10px;
  }

  .subject-title-row {
    margin-top: 6px;
  }
}

@media (max-width: 1100px) and (min-width: 901px) {
  .record-grid {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 900px) {
  #newRecordButton {
    display: grid;
    width: 42px;
    min-width: 42px;
    padding: 0;
    place-items: center;
    overflow: hidden;
    font-size: 0;
  }

  #newRecordButton::before {
    content: "+";
    font-size: 1.25rem;
  }

  .record-grid,
  .metrics-grid {
    grid-template-columns: 1fr;
  }

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

  .record-form-grid {
    grid-template-columns: 1fr;
  }

  .field-wide {
    grid-column: auto;
  }
}

@media (max-width: 560px) {
  .record-card-header,
  .recent-record-list li,
  .date-group-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .record-badges {
    justify-content: flex-start;
  }

  .record-actions .button {
    flex: 1 1 auto;
  }

  .modal {
    width: calc(100vw - 18px);
    max-height: calc(100dvh - 18px);
    border-radius: var(--radius-md);
  }

  .modal-card {
    max-height: calc(100dvh - 18px);
  }

  .modal-header,
  .modal-body,
  .modal-footer {
    padding: 15px;
  }
}

@media (max-width: 900px) {
  .summary-editor-modal,
  .summary-editor-card {
    max-height: calc(100dvh - 22px);
  }

  .summary-metadata-grid,
  .summary-editor-flags {
    grid-template-columns: 1fr;
  }

  .summary-editor-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .summary-footer-actions {
    width: 100%;
  }
}

@media (max-width: 560px) {
  .summary-editor-section {
    padding: 15px;
  }

  .summary-editor-body {
    gap: 12px;
  }

  .draft-recovery-banner {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .rich-editor-toolbar {
    gap: 5px;
  }

  .rich-editor-toolbar button,
  .rich-editor-toolbar select {
    min-height: 38px;
  }

  .rich-editor-surface {
    min-height: 240px;
    padding: 14px;
  }

  .rich-editor.compact .rich-editor-surface {
    min-height: 150px;
  }

  .summary-footer-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .summary-footer-actions .button {
    width: 100%;
  }
}

@media (max-width: 700px) {
  .section-header-actions {
    width: 100%;
    justify-content: stretch;
  }

  .section-header-actions .button {
    flex: 1 1 auto;
  }

  .note-link-list {
    grid-template-columns: 1fr;
  }

  .quick-detail-origin-banner {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }
}

/* Foundation 06 */
@media (max-width: 1180px) {
  .overview-progress-lead {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .overview-progress-meta {
    flex-wrap: wrap;
  }

  .progress-category-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .overview-progress-lead {
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .overview-progress-meta {
    width: 100%;
    align-items: flex-start;
  }

  .overview-personal-perception {
    width: auto;
    max-width: 100%;
  }

  .overview-progress-score {
    width: 112px;
    height: 112px;
  }

  .overview-progress-score > div {
    width: 84px;
    height: 84px;
  }

  .progress-category-grid,
  .overview-fact-grid,
  .overview-lower-grid,
  .overview-editor-meta-grid {
    grid-template-columns: 1fr;
  }

  .overview-panel-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .overview-history-panel .button {
    width: 100%;
  }
}

@media (max-width: 560px) {
  .overview-progress-panel,
  .overview-moment-panel,
  .overview-list-panel,
  .overview-history-panel {
    padding: 16px;
  }

  .overview-record-list li {
    align-items: flex-start;
    flex-direction: column;
  }

  .overview-record-list strong {
    white-space: normal;
  }

  .overview-editor-modal,
  .overview-editor-card {
    max-height: calc(100dvh - 18px);
  }
}

@media (max-width: 1300px) {
  .exercise-session-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .exercise-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .exercise-session-modal,
  .exercise-session-modal-card,
  .testquest-import-modal,
  .test-quest-import-card {
    max-height: calc(100dvh - 22px);
  }

  .exercise-session-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .exercise-session-header .record-badges {
    justify-content: flex-start;
  }
}

@media (max-width: 680px) {
  .exercise-metrics-grid,
  .session-detail-summary,
  .imported-question-body {
    grid-template-columns: 1fr 1fr;
  }

  .question-statement {
    grid-column: 1 / -1;
  }

  .exercise-session-modal-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .exercise-session-footer-start,
  .exercise-session-footer-actions {
    width: 100%;
  }

  .exercise-session-footer-actions .button,
  .exercise-session-footer-start .button {
    flex: 1 1 auto;
  }
}

@media (max-width: 480px) {
  .exercise-metrics-grid,
  .session-detail-summary,
  .session-stats-grid,
  .imported-question-body {
    grid-template-columns: 1fr;
  }

  .session-performance {
    grid-template-columns: 1fr;
  }

  .imported-question-summary {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .question-result-badge {
    grid-column: 2;
    justify-self: start;
  }

  .json-import-textarea {
    min-height: 220px;
  }
}

/* Foundation 08: Error Records */
@media (max-width: 1100px) {
  .error-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

@media (max-width: 760px) {
  .error-source-grid,
  .error-metadata-grid,
  .error-link-list {
    grid-template-columns: 1fr;
  }

  .error-source-block:nth-child(3),
  .error-important-toggle {
    grid-column: auto;
  }

  .error-editor-state,
  .error-evidence-context,
  .error-editor-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .error-mini-event {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

@media (max-width: 560px) {
  .error-metrics-grid {
    grid-template-columns: 1fr;
  }

  .error-card {
    padding: 15px;
  }

  .error-group-heading {
    align-items: flex-start;
  }

  .error-creation-panel > div:last-child {
    grid-template-columns: 1fr;
  }

  .error-creation-panel > div:last-child > strong,
  .error-creation-panel > div:last-child > p {
    grid-column: auto;
  }

  .error-editor-modal,
  .error-editor-card,
  .error-evidence-card {
    max-height: calc(100dvh - 18px);
  }

  .error-editor-section {
    padding: 14px;
  }
}

@media (max-width: 760px) {
  .error-editor-footer-status {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .restore-mode-options,
  .restore-metrics,
  .diagnostic-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .restore-modal,
  .diagnostic-modal,
  .pending-imports-modal {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
  }

  .restore-card,
  .diagnostic-card,
  .pending-imports-card {
    max-height: calc(100dvh - 20px);
  }

  .restore-footer-actions,
  .maintenance-actions {
    width: 100%;
  }
}

@media (max-width: 560px) {
  .restore-mode-options,
  .restore-metrics,
  .diagnostic-metrics {
    grid-template-columns: 1fr;
  }

  .maintenance-actions,
  .restore-footer-actions,
  .restore-card .modal-footer,
  .diagnostic-card .modal-footer {
    display: grid;
  }

  .maintenance-actions .button,
  .restore-footer-actions .button,
  .restore-card .modal-footer > .button,
  .diagnostic-card .modal-footer > .button {
    width: 100%;
  }

  .diagnostic-status,
  .pending-import-heading {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 900px) {
  .guided-flow-detail {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .guided-flow-actions {
    max-width: none;
    justify-content: flex-start;
  }

  .guided-flow-secondary-action {
    margin-left: 0;
    text-align: left;
  }

  .metacognitive-check-heading,
  .metacognitive-check-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .metacognitive-status {
    max-width: none;
    align-self: flex-start;
  }

  .metacognitive-check-actions select {
    min-width: 0;
    width: 100%;
    flex: none;
  }
}

@media (max-width: 620px) {
  .guided-flow-panel {
    gap: 14px;
    padding: 15px;
  }

  .guided-flow-header,
  .overview-progress-panel-header,
  .metacognitive-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .guided-flow-total {
    align-self: flex-start;
  }

  .guided-flow-detail {
    gap: 14px;
    padding: 14px;
  }

  .guided-flow-actions .button {
    width: 100%;
  }

  .consolidation-evidence-grid {
    grid-template-columns: 1fr;
  }

  .flow-help-modal,
  .metacognitive-modal,
  .consolidation-modal,
  .flow-help-card,
  .metacognitive-card,
  .consolidation-card {
    max-height: calc(100dvh - 16px);
  }

  .metacognitive-section {
    padding: 14px;
  }
}

/* Foundation 10: Guided consolidation flow */
@media (max-width: 620px) {
  .guided-flow-system-notice {
    align-items: stretch;
    flex-direction: column;
  }

  .guided-flow-system-notice .button {
    width: 100%;
  }
}

/* Fundação 10: pontuação integrada ao roteiro */
@container guided-flow-panel (max-width: 760px) {
  .guided-flow-navigation {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .guided-flow-progress-summary {
    padding-right: 0;
    padding-bottom: 18px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}

@container guided-flow-track (max-width: 640px) {
  .guided-flow-track {
    --guided-stage-size: 38px;
    --guided-stage-gap: 5px;
    --guided-stage-padding-inline: 3px;
    --guided-stage-label-size: 0.7rem;
    --guided-stage-score-size: 0.64rem;
  }
}

@container guided-flow-track (max-width: 500px) {
  .guided-flow-track {
    --guided-stage-size: 34px;
    --guided-stage-gap: 2px;
    --guided-stage-padding-inline: 1px;
    --guided-stage-label-size: 0.66rem;
    --guided-stage-score-size: 0.61rem;
  }
}

@container guided-flow-track (max-width: 380px) {
  .guided-flow-track {
    --guided-stage-size: 30px;
    --guided-stage-gap: 0px;
    --guided-stage-padding-inline: 0px;
    --guided-stage-label-size: 0.61rem;
    --guided-stage-score-size: 0.58rem;
  }
}

@media (max-width: 480px) {
  .guided-flow-progress-summary {
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .guided-flow-progress-meta {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .guided-flow-progress-meta .overview-personal-perception {
    width: auto;
    max-width: none;
  }
}


/* Estabilização v0.1 */
@media (max-width: 700px) {
  .import-warning-panel {
    align-items: stretch;
    flex-direction: column;
  }

  .import-warning-panel .button {
    width: 100%;
  }

  .restore-requirement-hint {
    width: 100%;
    flex-basis: auto;
  }
}


@media (max-width: 900px) {
  .app-shell.missing-context-mode {
    display: grid;
    grid-template-rows: var(--header-height) minmax(0, 1fr);
    min-height: 100vh;
    min-height: 100dvh;
  }

  .missing-context-mode .global-header {
    position: static;
  }

  .missing-context-mode .workspace,
  .missing-context-mode.sidebar-collapsed .workspace {
    display: grid;
    min-height: 0;
  }

  .missing-context-mode .content-panel {
    display: grid;
    min-height: 0;
    place-items: center;
    padding: 28px 18px 40px;
  }
}

@media (max-width: 420px) {
  .missing-context-mode .brand-copy .eyebrow {
    display: block;
  }

  .missing-context-panel {
    padding: 24px 18px;
  }

  .missing-context-copy h2 {
    font-size: 1.65rem;
  }
}