body {
  overflow-x: hidden;
}

.primary-button,
.secondary-button,
.choice-button {
  min-width: 0;
  white-space: normal;
}

.app-shell,
.sidebar,
.topbar,
.study-tools,
.workspace,
.trainer,
.trainer-stage,
.prompt-block,
.practice-actions,
.prompt-content-with-visual,
.answer-form,
.answer-row {
  min-width: 0;
}

.workspace {
  max-width: 100%;
}

.category-strip {
  min-width: 0;
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  overflow-x: hidden;
}

.topic-filter-card {
  min-width: 0;
  overflow-x: hidden;
}

.category-button {
  max-width: 100%;
  flex: 1 1 116px;
  width: auto;
  hyphens: auto;
}

.set-progress-mini,
.prompt-chip {
  background: #d8f0ec;
  color: #075f5c;
}

.tool-toggle,
.direction-button,
.audio-button {
  min-width: 0;
  line-height: 1.15;
  white-space: normal;
}

.trainer-header {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "meta score"
    "direction direction";
  gap: 12px 16px;
}

.trainer-footer-actions {
  margin-inline-start: auto;
  min-width: 0;
}

.trainer-meta {
  grid-area: meta;
  min-width: 0;
}

.direction-tabs {
  grid-area: direction;
  justify-self: stretch;
  width: min(100%, 560px);
}

.fixed-mode-note {
  grid-area: direction;
  justify-self: start;
}

.prompt-chip,
.card-count,
.mastery-chip,
.question-type-pill {
  min-width: 0;
  overflow-wrap: anywhere;
}

.question-type-pill strong {
  min-width: 0;
  font-size: 12px;
  font-weight: 950;
  overflow-wrap: anywhere;
}

.prompt-chip {
  max-width: min(100%, 220px);
  hyphens: auto;
}

.card-count,
.detail-tags span {
  color: #3b4656;
}

.mastery-chip.learning {
  color: #8a5a00;
}

.mini-score {
  grid-area: score;
}

.detail-tags span {
  overflow-wrap: anywhere;
}

.language-fallback-note {
  border-color: rgba(16, 120, 116, 0.22);
  background: #eef8f6;
  color: #1f6865;
  font-weight: 800;
}

@media (max-width: 720px) {
  .trainer-header {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "meta"
      "direction";
    gap: 12px;
  }

  .trainer-meta {
    gap: 8px;
  }

  .question-type-pill,
  .prompt-chip,
  .card-count,
  .mastery-chip {
    justify-content: flex-start;
    text-align: start;
  }

  .trainer-footer > .secondary-button,
  .trainer-footer-actions,
  .trainer-footer-actions .primary-button,
  .trainer-footer-actions .secondary-button {
    width: 100%;
  }

  .trainer-footer-actions {
    margin-inline-start: 0;
  }

  .mini-score {
    display: none;
  }

  .fixed-mode-note {
    justify-self: stretch;
    border-radius: 8px;
    text-align: center;
  }

  .app-shell.focus-mode .workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .category-button {
    flex-basis: 104px;
  }
}
