/* Large portrait displays keep all 39 yaku on a single poster. */
@media screen {
  html:not(.printing) body.portrait-display #stage { width:2160px; height:3840px; }
  html:not(.printing) body.portrait-display header { flex-direction:column; align-items:flex-start; gap:22px; }
  html:not(.printing) body.portrait-display .lead { max-width:none; }
  html:not(.printing) body.portrait-display .filters { gap:14px; }
  html:not(.printing) body.portrait-display main[data-view="overview"] .overview {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(2,minmax(0,1fr)); gap:26px;
  }
  html:not(.printing) body.portrait-display .ov-col { min-height:0; }
  html:not(.printing) body.portrait-display .ov-card { flex-shrink:0; }
  html:not(.printing) body.portrait-display .ov-head .nm { line-height:1.3; }
  html:not(.printing) body.portrait-display main[data-view="route"] {
    grid-template-columns:1fr; grid-template-rows:minmax(0,1fr) minmax(0,1fr);
  }
  html:not(.printing) body.portrait-display .detail { min-height:0; }
  html:not(.printing) body.portrait-display .sc-cols { grid-template-columns:1fr; }
  html:not(.printing) body.portrait-display main[data-view="sanma"] .sanmaview,
  html:not(.printing) body.portrait-display main[data-view="rules"] .rulesview {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:auto;
  }
  html:not(.printing) body.portrait-display .sanmaview .sv-col,
  html:not(.printing) body.portrait-display .rulesview .sv-col { min-height:min-content; }
  html:not(.printing) body.portrait-display .sanmaview .sv-col:nth-child(2) { grid-row:span 2; }
  html:not(.printing) body.portrait-display .fv-cards { grid-template-columns:1fr; }
  html:not(.printing) body.portrait-display .cv { grid-template-columns:1fr 1fr; overflow:auto; }
  html:not(.printing) body.portrait-display .cv-col { min-height:min-content; }
}

/* Same query as MOBILE_QUERY in index.html, including landscape phones. */
@media screen and (max-width:999px), screen and (max-width:1199px) and (min-aspect-ratio:7/10) {
  html { -webkit-text-size-adjust:100%; }
  #stage {
    padding-left:max(10px,env(safe-area-inset-left));
    padding-right:max(10px,env(safe-area-inset-right));
    padding-bottom:max(14px,env(safe-area-inset-bottom));
  }
  .detail { max-height:86dvh; padding-bottom:max(28px,env(safe-area-inset-bottom)); }
  .d-close { width:44px; height:44px; }
  .vbtn { min-height:44px; }
  .viewtoggle { width:100%; }
}

@media screen and (min-width:761px) and (max-width:999px), screen and (min-width:1000px) and (max-width:1199px) and (min-aspect-ratio:7/10) {
  /* Flatten pairs only in the tablet grid, so an odd preceding card leaves no hole. */
  .ov-pair { display:contents; }
}

/* Duoの内画面など、役カード2枚を読める幅がある時だけ並べる。 */
@media screen and (min-width:620px) and (max-width:760px) {
  main[data-view="overview"] .overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ov-col, .ov-pair { display:contents; }
}
