/* v3 phone / vertical — loads last among v3 sheets. v2/mobile.css already
   owns the drawer and topbar; this only tightens v3 canvases. */

html[data-ui='v3'][data-v2].vertical-layout .app > .view,
html[data-ui='v3'][data-v2].layout-mobile .app > .view {
  padding: 24px 16px calc(80px + env(safe-area-inset-bottom, 0px));
}

html[data-ui='v3'][data-v2].vertical-layout .jr-page .jr-book .jr-kpi-lead,
html[data-ui='v3'][data-v2].layout-mobile .jr-page .jr-book .jr-kpi-lead {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-ui='v3'][data-v2].vertical-layout #mi-home-react .mi-where,
html[data-ui='v3'][data-v2].layout-mobile #mi-home-react .mi-where,
html[data-ui='v3'][data-v2].vertical-layout #mi-home-react .mi-what,
html[data-ui='v3'][data-v2].layout-mobile #mi-home-react .mi-what,
html[data-ui='v3'][data-v2].vertical-layout #mi-home-react .mi-when,
html[data-ui='v3'][data-v2].layout-mobile #mi-home-react .mi-when,
html[data-ui='v3'][data-v2].vertical-layout #mi-pos-react .mi-pos-skim,
html[data-ui='v3'][data-v2].layout-mobile #mi-pos-react .mi-pos-skim,
html[data-ui='v3'][data-v2].vertical-layout .srb-grid,
html[data-ui='v3'][data-v2].layout-mobile .srb-grid {
  grid-template-columns: minmax(0, 1fr);
}

html[data-ui='v3'][data-v2].vertical-layout .srb-shell,
html[data-ui='v3'][data-v2].layout-mobile .srb-shell {
  padding: 20px 16px 24px;
}

html[data-ui='v3'][data-v2].layout-mobile .pb-page .pb-card {
  grid-template-columns: 56px minmax(0, 1fr);
  padding: 12px 14px;
}
html[data-ui='v3'][data-v2].layout-mobile .pb-page .pb-card-meta { display: none; }
html[data-ui='v3'][data-v2].layout-mobile .pb-page .pb-card-dia {
  width: 56px;
  height: 32px;
}

html[data-ui='v3'][data-v2].vertical-layout .sz-page .mit-split,
html[data-ui='v3'][data-v2].layout-mobile .sz-page .mit-split,
html[data-ui='v3'][data-v2].vertical-layout .sz-page .sz-tile-board,
html[data-ui='v3'][data-v2].layout-mobile .sz-page .sz-tile-board {
  grid-template-columns: minmax(0, 1fr);
}

html[data-ui='v3'][data-v2].vertical-layout .v3-compare,
html[data-ui='v3'][data-v2].layout-mobile .v3-compare {
  top: auto;
  bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  right: 12px;
}

html[data-ui='v3'][data-v2].vertical-layout .mit-head-actions,
html[data-ui='v3'][data-v2].layout-mobile .mit-head-actions {
  width: 100%;
}
html[data-ui='v3'][data-v2].vertical-layout .mit-head-actions .mi-btn--primary,
html[data-ui='v3'][data-v2].layout-mobile .mit-head-actions .mi-btn--primary {
  flex: 1 1 auto;
}