/* mobile.css — mobile/PWA/native tweaks layered on top of the prototype's styles.css
   (keeps styles.css byte-identical to the web prototype). Handles notch/home-indicator
   safe areas and touch behavior. */
@supports (padding: max(0px)) {
  .topbar-in { padding-top: max(11px, env(safe-area-inset-top)); }
  .spine-in  { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  .shell {
    padding-left:  max(18px, env(safe-area-inset-left));
    padding-right: max(18px, env(safe-area-inset-right));
    padding-bottom: calc(120px + env(safe-area-inset-bottom));
  }
  .overlay { padding-top: max(64px, calc(48px + env(safe-area-inset-top))); }
}
html, body { overscroll-behavior-y: contain; }
body { -webkit-tap-highlight-color: transparent; }
/* larger comfortable hit targets on touch devices */
@media (pointer: coarse) {
  .iconbtn { width: 42px; height: 42px; }
  .langpill button { padding: 8px 13px; }
}