/* Shared screen layout; report artwork keeps its own export dimensions. */
html { -webkit-text-size-adjust:100%; }
button, a, input, select, textarea { touch-action:manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:3px solid #d99a62; outline-offset:3px; }
#login-view { width:calc(100% - 32px); padding:28px 22px; border-radius:22px; }
#login-view h2 { font-size:22px; margin:0 0 24px; }
#login-view input, #login-view button { min-height:48px; width:100%; font-size:16px; }
#login-view .row { gap:14px; }
#login-user { direction:ltr; text-align:right; }
@media(max-width:700px) {
  body { padding-bottom:calc(94px + env(safe-area-inset-bottom)); }
  #login-view { margin-top:32px!important; }
  .app-hd { padding:18px 16px; }
  .app-hd-in { flex-wrap:wrap; align-items:flex-start; }
  .app-hd h1 { font-size:22px; }
  .app-hd .who { flex-wrap:wrap; max-width:100%; }
  #app-view > .tab-panel, #app-view > #subnav { margin-left:12px; margin-right:12px; }
  #app-view .card { padding:14px; min-width:0; }
  #app-view .grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #app-view .grid > *, #app-view .row > * { min-width:0; max-width:100%; }
  #app-view .row > input, #app-view .row > select, #app-view .row > .autocomplete-wrap { flex:1 1 150px; }
  #app-view input, #app-view select, #app-view textarea { font-size:16px; min-height:44px; }
  #app-view button, #app-view .wa-btn, #app-view summary { min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
  #subnav { flex-wrap:nowrap; overflow-x:auto; padding:4px 0 10px; scrollbar-width:thin; }
  #subnav button { flex:0 0 auto; white-space:nowrap; }
  #bnav button { min-width:0; min-height:52px; font-size:11px; }
  #app-view .rt td { overflow-wrap:anywhere; flex-wrap:wrap; }
  #app-view .act-cell { white-space:normal; }
  #app-view .act-menu { max-width:100%; }
  #app-view .rt td .btn-group { gap:6px; }
  #app-view .stat .num { font-size:24px; }
  .wrap { gap:18px; }
  body:has(.wrap) { padding:14px 12px 32px; }
  .wrap > .panel { width:100%; min-width:0; padding:18px 14px; }
  .panel input, .panel select, .panel textarea { font-size:16px; min-height:44px; }
  .panel .btn { min-height:48px; white-space:normal; }
  .panel .actions { flex-wrap:wrap; gap:10px; }
  .panel .actions > * { flex:1 1 160px; }
}
@media(max-width:360px) {
  #app-view .grid { grid-template-columns:minmax(0,1fr); }
  .dec { padding:10px; }
}