/* Mobile safety layer: keep core actions visible and prevent horizontal clipping. */
body {
  overflow-x: hidden;
}

.board-header,
.board-brand,
.board-shell,
.board-intro,
.board-hero {
  min-width: 0;
}

.board-header {
  width: 100%;
}

.board-brand {
  flex: 0 1 auto;
}

.board-header .primary-action {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .board-brand > span {
    font-size: 1.45rem;
  }

  .board-brand strong {
    white-space: nowrap;
    font-size: 0.95rem;
  }

  .board-header .primary-action {
    padding: 0.58rem 0.72rem;
    font-size: 0.82rem;
  }

  .hero-flow {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    max-width: 100%;
  }

  .board-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: visible;
  }

  .board-tabs button {
    min-width: 0;
    padding: 0.7rem 0.35rem;
    font-size: 0.82rem;
  }

  .board-intro p,
  .board-hero > p {
    overflow-wrap: anywhere;
  }
}
