/* Shared device sizing. Screen-only so existing printed forms and reports retain their layout. */
@media screen {
  html { -webkit-text-size-adjust: 100%; scroll-padding-block: 110px; }
  body[data-device-layout] { overflow-wrap: break-word; }
  body[data-device-layout] :is(main,section,article,aside,form,fieldset,.card,.head-row,.admin-tabpane) { min-width: 0; }
  body[data-device-layout] :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) {
    box-sizing: border-box; min-width: 0; max-width: 100%; font-size: 16px;
  }
  body[data-device-layout] :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select) { min-height: 44px; }
  body[data-device-layout] :is(button,summary) { min-height: 44px; min-width: 44px; }
  body[data-device-layout] :is(.menu-toggle,.school-menu-toggle,.btn-edit,.btn-danger,#takwim-prev,#takwim-next) { min-width: 44px; }
  body[data-device-layout] :is(.menu-toggle,.school-menu-toggle) { flex-shrink: 0; }
  body[data-device-layout] :is(button,a,summary,input,select,textarea):focus-visible { outline: 3px solid #977027; outline-offset: 3px; }
  body[data-device-layout] :is(.tablewrap,.scrolltable,.table-scroll,.tabrow) { min-width: 0; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
  body[data-device-layout] :is(.modal,.app-help,dialog) { max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; }
  body[data-device-layout] .modal-overlay { overflow-y: auto; padding: 16px; }
  body[data-device-layout] :is(.modal-actions,.admin-form-actions,.head-controls,.admin-filters,.admin-editor-tools) { flex-wrap: wrap; }
  body[data-device-layout] .modal-actions { position: sticky; bottom: 0; padding-block: 12px 0; background: inherit; }
  body[data-device-layout] :is(.authbox,.authbox a,.authbox button) { white-space: normal; }
  body[data-device-layout] .authbox { flex-wrap: wrap; }
  body[data-device-layout] .authbox :is(a,button) { display: inline-flex; align-items: center; min-height: 44px; }
  body[data-device-layout] :is(.pss-links,.tabs) :is(a,summary) { min-height: 44px; }
  body[data-device-layout] .pss-hero-search { max-width: 520px; }
  body[data-device-layout] .pss-hero-search button { flex-shrink: 0; font-size: 14px; }
  body[data-device-layout] .pss-visitor-details summary { align-content: center; }
  body[data-device-layout] :is(.pss-visitor-note,#visitor-status,.pss-visitor-metrics span) { font-size: 13px; }

  /* Administration uses the available desktop workspace; tables scroll inside their own region. */
  body[data-device-layout=admin] main { width: 100%; max-width: 1440px; padding: 28px 32px 48px; }
  body[data-device-layout=admin] header.topnav .bar { max-width: 1440px; padding: 12px 32px; }
  body[data-device-layout=admin] :is(.card,.admin-section-grid>*,.admin-command-center>*,.admin-form-grid>*) { min-width: 0; }
  body[data-device-layout=admin] .card { padding: 24px; }
  body[data-device-layout=admin] :is(.sub,.page-sub,.admin-scope-note span,.admin-statusline,.field-label,.admin-table-meta) { font-size: 14px; line-height: 1.6; }
  body[data-device-layout=admin] :is(th,td) { font-size: 14px; }
  body[data-device-layout=admin] :is(.admin-table-actions,.action-group) { gap: 8px; }
  body[data-device-layout=admin] :is(.btn-primary,.btn-secondary,.btn-clear,.tab-btn,.btn-edit,.btn-danger) { font-size: 14px; }
  body[data-device-layout=admin] .admin-filters { flex: 1 1 480px; min-width: 0; }
  body[data-device-layout=admin] .admin-filters :is(input,select) { flex: 1 1 160px; width: auto; }
  body[data-device-layout=admin] .head-row>div { min-width: 0; max-width: 100%; }
  body[data-device-layout=admin] .tabrow { padding: 8px; scroll-padding-inline: 8px; }
  body[data-device-layout=admin] .admin-form-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body[data-device-layout=admin] nav.links { display: flex; flex: 1 1 100%; width: 100%; max-width: 100%; min-width: 0; flex-wrap: wrap; gap: 8px; order: 3; }
  body[data-device-layout=admin] .brand { flex: 1 1 220px; min-width: 0; }
  body[data-device-layout=admin] .authbox { order: 4; }
  body[data-device-layout=admin] nav.links a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 12px; font-size: 14px; }
  body[data-device-layout=admin] .stats { grid-template-columns: repeat(3,minmax(0,1fr)); }

  /* Booking stays task-focused, with a wider schedule and records view on large screens. */
  body[data-device-layout=booking] main { max-width: 1120px; }
  body[data-device-layout=booking] header.topnav .bar { max-width: 1120px; }
  body[data-device-layout=booking] .authcard { max-width: 480px; }
  body[data-device-layout=booking] :is(.booking-steps,.grid,.datepick,.room-availability,.slotgrid,.blockgrid)>* { min-width: 0; }
  body[data-device-layout=booking] .datefilter { gap: 12px; flex-wrap: wrap; }
  body[data-device-layout=booking] .datefilter input { min-width: 160px; }
  body[data-device-layout=booking] :is(.banner p,.page-sub,.app-rule span,.hint-esok,.room-choice small,.slotbtn .t) { font-size: 14px; line-height: 1.5; }
}
@media screen and (min-width: 821px) {
  body[data-device-layout=booking] { padding-bottom: 96px; }
  body[data-device-layout=booking] nav.links { display: flex; gap: 8px; flex-wrap: wrap; max-width: 100%; }
  body[data-device-layout=booking] .brand { flex: 1 1 220px; }
  body[data-device-layout=booking] nav.links a { display: inline-flex; min-height: 44px; padding: 8px 12px; align-items: center; font-size: 14px; }
  body[data-device-layout=booking] .slotgrid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  body[data-device-layout=booking] .booking-records { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body[data-device-layout=booking] .app-nav { width: min(100%,1120px); }
  body[data-device-layout=admin] .app-nav { width: min(100%,1120px); }
}
@media screen and (min-width: 701px) and (max-width: 1100px) {
  body[data-device-layout=pss] .pss-home-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body[data-device-layout=pss] .pss-weekly-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body[data-device-layout=pss] .pss-weekly-grid>.pss-weekly-card { grid-column: auto; }
  body[data-device-layout=pss] .pss-weekly-grid>.pss-visitors { grid-column: 1/-1; }
  body[data-device-layout=pss] .pss-visitor-metrics { max-width: 420px; }
  body[data-device-layout=pss] .pss-visitor-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
  body[data-device-layout=pss] .pss-home-hero { gap: 20px; }
  body[data-device-layout=pss] .pss-home-inner h1 { font-size: clamp(40px,5vw,56px); }
  body[data-device-layout=pss] .hero-actions { flex-wrap: wrap; }
  body[data-device-layout=pss] .reading-scene { min-width: 0; }
}
@media screen and (max-width: 820px) {
  body[data-device-layout] :is(.pss-footer .pss-shell>div,.foot-inner,.linkrow) { flex-wrap: wrap; }
  body[data-device-layout=admin] main { padding: 20px 16px 100px; }
  body[data-device-layout=admin] header.topnav .bar { padding: 12px 16px; }
  body[data-device-layout=admin] :is(.card,.admin-command-center) { padding: 20px; }
  body[data-device-layout=admin] .admin-section-grid { grid-template-columns: minmax(0,1fr); }
  body[data-device-layout=admin] .admin-filters { flex-basis: 100%; }
  body[data-device-layout=admin] .stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body[data-device-layout=admin] .brand h1 { white-space: normal; font-size: 16px; }
  body[data-device-layout=admin] .authbox { width: 100%; }
  body[data-device-layout=admin] .admin-product-switcher { grid-template-columns: repeat(3,minmax(0,1fr)); }
  body[data-device-layout=admin] .admin-product-switcher a { padding: 12px; }
  body[data-device-layout=booking] main { padding-inline: 20px; }
  body[data-device-layout=booking] .app-nav { max-width: 100%; }
}
@media screen and (max-width: 600px) {
  body[data-device-layout=admin] :is(.admin-form-grid,.admin-product-switcher) { grid-template-columns: minmax(0,1fr); }
  body[data-device-layout=admin] :is(.admin-form-grid .span-2,.admin-form-actions) { grid-column: auto; }
  body[data-device-layout=admin] .admin-filters :is(input,select,button) { flex: 1 1 100%; width: 100%; }
  body[data-device-layout=admin] :is(.card,.admin-command-center) { padding: 16px; }
  body[data-device-layout=admin] :is(.modal,.modal.wide) { padding: 20px 16px; }
  body[data-device-layout=admin] .admin-command-copy h2 { overflow-wrap: anywhere; }
  body[data-device-layout=admin] .admin-product-switcher small { font-size: 12px; }
  body[data-device-layout=booking] main { padding-inline: 16px; }
  body[data-device-layout] .modal-overlay { align-items: center; }
  body[data-device-layout=school] .school-shortcuts a { min-height: 112px; }
  body[data-device-layout=pss] .pss-hero-search { flex-wrap: wrap; }
  body[data-device-layout=pss] .pss-hero-search input { flex: 1 1 150px; }
  body[data-device-layout=pss] .pss-hero-search button { flex: 1 1 100px; }
}
@media screen and (max-height: 600px) and (orientation: landscape) {
  body[data-device-layout] :is(header.topnav,.pss-nav,.sitehead) { position: relative; }
  body[data-device-layout] :is(.modal,.app-help) { max-height: calc(100dvh - 24px); }
}