/* Touch tablets only; phone, mouse desktop and print retain their own contracts. */
@media screen and (min-width: 761px) {
  html:has(body.pz-tablet-play) { height: auto !important; overflow: auto !important; }
  body.pz-tablet-play { height: auto !important; min-height: 100dvh; overflow: visible !important; }
  /* ID scope beats the legacy fixed-height shell rules without editing engine DOM. */
  html body.pz-tablet-play :is(#app, #main-content, .view.active),
  html body.pz-tablet-play :is(#app, #main-content, .view.active):is(#app, #main-content, .view.active) [data-pzt-path] {
    height: auto !important; max-height: none !important; min-height: 0 !important;
    min-width: 0 !important; max-width: 100% !important; width: 100% !important;
    overflow: visible !important; display: block !important; position: static !important;
    grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: none !important;
    flex: none !important; box-sizing: border-box !important;
  }
  html body.pz-tablet-play [data-pzt-view] { padding: 8px 12px 28px !important; scroll-margin-top: var(--header-height,56px); }
  html body.pz-tablet-play [data-pzt-path] { margin-top: 0 !important; margin-left: auto !important; margin-right: auto !important; }
  html body.pz-tablet-play :is(#app, #main-content, .view.active):is(#app, #main-content, .view.active) [data-pzt-settings] { display: none !important; }
  html body.pz-tablet-play :is(#app, #main-content, .view.active):is(#app, #main-content, .view.active) [data-pzt-settings-open] {
    display: block !important; position: static !important; width: 100% !important;
    height: auto !important; min-height: 0 !important; max-height: none !important;
    overflow: visible !important; box-sizing: border-box !important; margin: 0 0 12px !important;
  }
  .pzt-settings-toggle { display: none; }
  body.pz-tablet-play .pzt-settings-toggle {
    display: block; width: 100%; min-height: 44px; margin: 0 auto 10px;
    border: 1px solid #99cfc8; border-radius: 12px; background: #ecfdf5; color: #115e59;
    font: 800 16px system-ui, sans-serif; cursor: pointer;
  }
  html body.pz-tablet-play :is(#app, #main-content, .view.active):is(#app, #main-content, .view.active) [data-pzt-port] {
    overflow: auto !important; max-width: 100% !important; width: 100% !important;
    max-height: none !important; padding: 8px !important; box-sizing: border-box !important;
    text-align: center; overscroll-behavior-x: contain;
  }
  html body.pz-tablet-play [data-pzt-board] { margin-left: auto !important; margin-right: auto !important; }
  html body.pz-tablet-play [data-pzt-actions] { margin: 10px auto !important; max-width: 720px !important; }
  html body.pz-tablet-play :is(#app,#main-content,.view.active):is(#app,#main-content,.view.active) [data-pzt-actions] {
    display: flex !important; flex-wrap: wrap !important; gap: 8px !important;
    width: min(100%,720px) !important;
  }
  html body.pz-tablet-play [data-pzt-actions] > button { flex: 1 1 140px !important; min-height: 44px !important; padding: 8px 12px !important; font-size: 15px !important; }
  html body.pz-tablet-play [data-pzt-actions] > :not(button) { flex-basis: 100%; min-width: 0; }
  html body.pz-tablet-play #sudoku-play-layout { width: 100% !important; }
  html body.pz-tablet-play #sudoku-side-panel { width: 100% !important; max-width: 520px !important; margin: 12px auto !important; }
  html body.pz-tablet-play :is(#stb-board,#tt-board) { width: 100% !important; height: auto !important; overflow: auto !important; justify-content: safe center !important; }
  html body.pz-tablet-play :is(#stb-board,#tt-board) svg { flex-shrink: 0; height: auto !important; max-height: none !important; }
  html body.pz-tablet-play :is(.fs-panel,.bp-panel,.se-panel,.lo-panel,.cmx-panel) { min-width: 0 !important; width: 100% !important; box-sizing: border-box !important; }
  html body.pz-tablet-play #fs-basket-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  html body.pz-tablet-play .fs-basket { min-height: 0 !important; }
  html body.pz-tablet-play #view-fair-share .fs-pool { min-height: 0 !important; }
  html body.pz-tablet-play :is(#sudoku-board,#kk-board,#ms-board,#sk-board) { flex-shrink: 0 !important; }
  html body.pz-tablet-play #sudoku-board { gap: 0 !important; padding: 0 !important; }
  html body.pz-tablet-play #sudoku-board > * { width: 100% !important; height: 100% !important; min-width: 0 !important; min-height: 0 !important; box-sizing: border-box !important; }
  html body.pz-tablet-play #sudoku-side-kp-nums { grid-template-columns: repeat(5,minmax(0,1fr)) !important; }
  html body.pz-tablet-play #view-star-battle .stb-grid { width: min(100%, 520px) !important; height: auto !important; aspect-ratio: 1; min-width: 360px; }
  html body.pz-tablet-play #view-tents-trees .tt-grid { --tt-cell: 44px !important; }
  /* SVG width already includes its own inset: outer padding otherwise clips its last cell. */
  html body.pz-tablet-play #view-generator #board-area #fc-board { padding: 0 !important; border: 0 !important; }
}
