/* App-only adjustments. Original Gallery Guide and Stanza styles are never edited. */
html{background:#f7f5ef}
/* Keep the viewport stationary sideways without restricting map or carousel gestures.
   clip avoids creating a new scroll container around sticky discovery controls. */
html,body{max-width:100%;overflow-x:clip;overscroll-behavior-x:none}
body{overscroll-behavior-y:none}main{padding-bottom:max(12px,env(safe-area-inset-bottom))}
.native-app main{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
button,input,select,summary{touch-action:manipulation}
.app-footer-links{display:flex;gap:16px;flex-wrap:wrap}.app-footer-links button{font-size:12px;padding:6px 0;border:0;text-decoration:underline;text-underline-offset:3px}
.mobile-offline{font-size:13px;background:#eceee1;border:1px solid #d5d6ca;padding:12px;margin:12px 0}
.app-about h2{font:30px Georgia,serif}.app-about h3{font-size:16px;margin-top:24px}.app-about p{max-width:65ch}
@media(max-width:760px){button,summary,.layout-switch button,.view-tabs button,.presets button,.nav-actions button,.reset-actions button{min-height:44px}.rail-toolbar select{min-height:44px}.mode-tabs{gap:12px}.mode-tabs button{font-size:13px}.nav-actions button{font-size:11px}.controls select{font-size:16px}.map-rail{max-height:none;overflow:visible}.rail-toolbar{position:static}footer{flex-wrap:wrap}dialog{max-height:calc(100dvh - 32px);padding-bottom:max(18px,env(safe-area-inset-bottom))}}
/* WKWebView date controls have intrinsic widths; let both grid tracks shrink. */
@media(max-width:760px){
  .native-app .controls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .native-app .controls>label{min-width:0}
  .native-app .controls input[type="date"]{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;-webkit-appearance:none;appearance:none}
  .native-app .controls input[type="date"]::-webkit-date-and-time-value{text-align:left;min-width:0}
}
/* Filter checkboxes retain their size inside the full-width mobile input rule. */
.native-app .filter-options input[type="checkbox"]{width:16px;height:16px;min-width:16px;min-height:16px;max-width:16px;padding:0;flex:0 0 16px;margin:0 10px 0 0}
.native-app .filter-options label{min-height:44px}
/* Center dialogs within the safe viewport, including asymmetric safe-area insets. */
.native-app dialog{max-width:calc(100vw - 32px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));max-height:calc(100dvh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));transform:translate(calc((env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px))/2),calc((env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))/2))}

/* Modal screens own vertical scrolling; horizontal scrolling belongs to their
   explicit nested carousels/tabs, never the surrounding screen. */
html body dialog{box-sizing:border-box;overflow-x:hidden;overscroll-behavior-x:none}