/* Thream global responsive safety layer: preserves desktop/mobile designs while preventing overflow across screen sizes. */
*,*::before,*::after{box-sizing:border-box}
html,body,#root{width:100%;max-width:100%;min-width:0;overflow-x:clip}
body{margin:0;-webkit-text-size-adjust:100%;text-size-adjust:100%}
img,video,canvas,svg,iframe{max-width:100%;height:auto}
input,textarea,select,button{min-width:0}
textarea{max-width:100%}
pre,code{max-width:100%;overflow-wrap:anywhere}
table{max-width:100%}
[class*="flex"]>* ,[class*="grid"]>*{min-width:0}
section,article,main,aside,header,footer,nav,div{overflow-wrap:anywhere}

/* Wide data/content surfaces remain usable instead of forcing page overflow. */
table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Dialogs and overlays must always fit the visible screen. */
[role="dialog"]{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px);overflow:auto}

/* Prevent oversized fixed-width cards/panels from escaping narrow containers. */
[class*="w-["]{max-width:100%}
[class*="min-w-["]{max-width:100%}

@media (max-width:1279px){
  /* Give app content more breathing room on laptops and tablets. */
  main[class*="max-w-7xl"],main[class*="max-w-6xl"],main[class*="max-w-5xl"],main[class*="max-w-4xl"]{width:100%;max-width:100%}
}

@media (max-width:1023px){
  /* Dense multi-column utility panels should shrink rather than overflow. */
  [class*="gap-6"],[class*="gap-5"]{column-gap:1rem}
  [class*="px-6"]{padding-left:1rem;padding-right:1rem}
}

@media (max-width:767px){
  html,body,#root{min-height:100%;}
  body{overscroll-behavior-x:none}
  input,textarea,select{font-size:16px!important}
  button,a,input,textarea,select{touch-action:manipulation}
  [role="dialog"]{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px);border-radius:20px!important}
  [class*="px-6"],[class*="px-8"],[class*="px-10"]{padding-left:1rem!important;padding-right:1rem!important}
  [class*="p-8"],[class*="p-10"]{padding:1rem!important}
  [class*="text-5xl"],[class*="text-6xl"],[class*="text-7xl"]{font-size:clamp(2rem,10vw,3rem)!important;line-height:1.05!important}
  [class*="rounded-[32px]"],[class*="rounded-[36px]"],[class*="rounded-[40px]"]{border-radius:24px!important}
  nav.fixed.bottom-0{padding-bottom:max(.4rem,env(safe-area-inset-bottom))}
}

@media (max-width:479px){
  [class*="gap-4"]{column-gap:.75rem}
  [class*="px-4"]{padding-left:.75rem;padding-right:.75rem}
  [class*="p-6"]{padding:1rem!important}
}

/* Landscape phones: keep important app surfaces usable above bottom navigation. */
@media (max-height:520px) and (orientation:landscape){
  [role="dialog"]{max-height:calc(100dvh - 8px)}
  nav.fixed.bottom-0{position:sticky}
}