/* The root-owned outer wrapper scrolls; original wrap/grid tracks stay native. */
body.mf-depth-mobile .mf-board-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-color: var(--mf-art-cyan, #38bdf8) var(--mf-art-navy, #14243a);
}
body.mf-depth-mobile .mf-mobile-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--mf-art-space-2, 8px);
  min-width: 0;
}
body.mf-depth-mobile #mf-mobile-toggle {
  min-width: var(--mf-art-touch, 48px);
  min-height: var(--mf-art-touch, 48px);
  max-width: 100%;
  padding: var(--mf-art-space-2, 8px) var(--mf-art-space-3, 12px);
  border: 1px solid var(--mf-art-cyan, #38bdf8);
  border-radius: 6px;
  background: var(--mf-art-navy, #14243a);
  color: var(--mf-art-ink, #f8fafc);
  font: inherit;
  font-weight: 700;
  white-space: normal;
  cursor: pointer;
}
body.mf-depth-mobile #mf-mobile-toggle[aria-pressed="true"] {
  background: var(--mf-art-cyan, #38bdf8);
  color: var(--mf-art-navy, #14243a);
}
body.mf-depth-mobile #mf-mobile-toggle:focus-visible {
  outline: 2px solid var(--mf-art-ink, #f8fafc);
  outline-offset: 3px;
}
body.mf-depth-mobile .mf-mobile-note {
  flex: 1 1 220px;
  margin: 0;
  color: var(--mf-art-muted, #b6c3d4);
  font: inherit;
  font-size: 0.85rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
/* Root16 source arithmetic: 44px tracks + native gaps/borders/padding. */
body.mf-depth-mobile.mf-larger-squares #board-wrap:has(> #board[data-size="s"]) { min-width: 393px; }
body.mf-depth-mobile.mf-larger-squares #board-wrap:has(> #board[data-size="m"]) { min-width: 581px; }
body.mf-depth-mobile.mf-larger-squares #board-wrap:has(> #board[data-size="l"]) { min-width: 754px; }
body.mf-depth-mobile.mf-larger-squares #board .cell { font-size: clamp(1rem, 3.5vw, 1.25rem); }
@media (prefers-reduced-motion: reduce) {
  body.mf-depth-mobile #mf-mobile-toggle { transition: none; }
}