/* SurgeLab mobile hotfix v3 — scoped, non-destructive */
html,body{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%}
html{padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}

/* Do NOT globally change image/canvas/svg sizing. It breaks animated UI/media. */

/* Nav styles are in /css/nav.css — do NOT add nav overrides here */

@media (max-width:768px){
  h1,.title,.hero-title{font-size:clamp(30px,8vw,46px) !important;line-height:1.06 !important}
  h2{font-size:clamp(24px,6vw,34px) !important}
  p,.sub,.hero-sub,.lead{font-size:15px !important;line-height:1.65 !important}
  .hero-btns,.btn-row,.cta-row{display:flex;flex-direction:column;gap:12px}
  .hero-btns > *, .btn-row > *, .cta-row > *{width:100%;text-align:center}

  /* Keep homepage stats horizontal */
  .stats{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:8px !important;align-items:start}
  .stat{padding:18px 10px !important;min-width:0}
  .stat-num{font-size:clamp(24px,5vw,34px) !important}
  .stat-label{font-size:10px !important;line-height:1.35 !important}
}

@media (max-width:520px){
  nav{padding-left:16px !important;padding-right:16px !important}
  .wrap{padding-left:16px !important;padding-right:16px !important}
  .hero,.hero-s,section{padding-left:16px !important;padding-right:16px !important}
  .hero-labels,.floating-labels,.desktop-only{display:none !important}

  /* Explicitly keep these in one row on phones */
  .stats{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:6px !important}
  .stat{padding:14px 6px !important}
  .stat-num{font-size:22px !important}
  .stat-label{font-size:9px !important;line-height:1.25 !important}
}

/* App pages only: keep fixes narrowly scoped */
@media (max-width:768px){
  .main{max-width:100%;overflow-x:hidden;word-break:break-word}
  .shell{max-width:100vw;overflow-x:hidden}
  .section,.detail-section,.panel,.card{max-width:100%}
  .stats .stat-card{min-width:calc(33.3% - 6px)}
  .detail-grid{grid-template-columns:1fr 1fr !important}
  table{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .sidebar{width:min(84vw,300px) !important}
  /* Touch-friendly targets */
  .dbtn,.pill,.pri-btn,.vbtn,.ping-btn{min-height:44px;touch-action:manipulation}
  .pill{min-height:44px;display:inline-flex;align-items:center}
  button,input[type="file"]+button{touch-action:manipulation}
  /* Prevent text overflow */
  .kv-value,.pending-name,.case-name,.detail-name,.page-title{word-break:break-word;overflow-wrap:break-word}
  .case-detail{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* Full-width inputs on mobile */
  input.search-bar,textarea{width:100% !important;max-width:100% !important;font-size:16px !important}
  /* Prevent iOS zoom on input focus */
  input,textarea,select{font-size:16px !important}
  /* Scroll containers */
  .prod-board,.pending-tabs{-webkit-overflow-scrolling:touch}
}

@media (max-width:560px){
  .detail-grid{grid-template-columns:1fr !important}
  .stats .stat-card{min-width:100%}
  .pill{margin:0 4px 6px 0}
}