/* MANTA APPARELS V68 — site-wide mobile fit, typography and overflow refinement.
   Additive visual layer only: no route, API, form action, or business rule changes. */

:root{--manta-mobile-gutter:clamp(10px,3.2vw,16px)}
html,body{width:100%;max-width:100%;min-width:320px;overflow-x:clip}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
#app,.app{width:100%;max-width:100%;min-width:0;overflow-x:clip}
img,svg,video,canvas,iframe{max-width:100%}
button,input,select,textarea{max-width:100%;font:inherit}
.page,.team-content,.devices-page,.team-dashboard,.share-page,.wallet-v54-page{box-sizing:border-box;width:100%;min-width:0;max-width:100%;margin-inline:auto}
.page :is(section,article,aside,form,fieldset),.team-content :is(section,article,aside,form),.devices-page :is(section,article,aside){min-width:0;max-width:100%}
.page :is(h1,h2,h3,h4,p,small,label,li),.team-content :is(h1,h2,h3,p,small,label){overflow-wrap:break-word;word-break:normal}
.page :is(input,select,textarea),.team-content :is(input,select,textarea){min-width:0;width:100%;max-width:100%}
.page :is(.grid2,.grid3,.overview-grid,.quick-actions,.menu-grid,.list,.section-head,.card,.row),.page :is(.grid2,.grid3,.overview-grid,.quick-actions,.menu-grid)>*,.page :is(.list,.row)>*{min-width:0}
.page :is(.card,.section,.panel,.stat,.mini-card,.hero){max-width:100%}
.page :is(.price,.amount,.money,.currency,.stat strong,.overview-card strong){font-variant-numeric:tabular-nums lining-nums}
.page :is(button,.btn,[role=button]){min-width:0;max-width:100%;overflow-wrap:break-word}
.page :is(.table-wrap,.table-responsive,.table-scroll,.history-table-wrap,.responsive-table){max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.page :is(table){max-width:100%;border-collapse:separate;border-spacing:0}
.page :is(pre,code){max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}

/* Shared app header: preserve its artwork, only prevent narrow-screen compression. */
.top.home-top-reference{box-sizing:border-box;width:100%;min-width:0;max-width:100%;gap:clamp(5px,1.8vw,12px);padding-left:clamp(8px,2.8vw,18px);padding-right:clamp(8px,2.8vw,18px)}
.top.home-top-reference .brand-wrap{min-width:0;max-width:52%;flex:0 1 auto}
.top.home-top-reference .brandmark{display:block;max-width:100%;object-fit:contain}
.top.home-top-reference .top-actions{min-width:0;gap:clamp(4px,1.4vw,8px)}
.top.home-top-reference .lang-toggle{max-width:30vw;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top.home-top-reference .icon{flex:0 0 auto}
.bottom.home-bottom-nav{box-sizing:border-box;width:100%;max-width:980px;padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right));padding-bottom:calc(7px + env(safe-area-inset-bottom))}
.bottom.home-bottom-nav .nav-item{min-width:0;overflow:hidden}
.bottom.home-bottom-nav .nav-item small{max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* Profile metrics: keep all three values on a single line, even for large balances. */
.profile-reference-page .profile-reference-metrics{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0!important;align-items:stretch!important;width:100%!important;min-width:0!important;overflow:hidden!important;padding:9px 4px!important}
.profile-reference-page .profile-reference-metric{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-width:0!important;padding:6px 4px!important;text-align:left!important;overflow:hidden!important}
.profile-reference-page .profile-reference-metric .metric-icon{width:clamp(24px,7.4vw,34px)!important;height:clamp(24px,7.4vw,34px)!important;flex:0 0 clamp(24px,7.4vw,34px)!important;font-size:clamp(15px,4.4vw,21px)!important;border-radius:10px!important}
.profile-reference-page .profile-reference-metric>div{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;min-width:0!important;max-width:100%!important;overflow:hidden!important}
.profile-reference-page .profile-reference-metric small{display:block!important;max-width:100%!important;font-size:clamp(8px,2.35vw,11px)!important;line-height:1.18!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}
.profile-reference-page .profile-reference-metric b{display:block!important;max-width:100%!important;font-size:clamp(8px,2.65vw,12px)!important;line-height:1.15!important;letter-spacing:-.42px!important;white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;font-variant-numeric:tabular-nums!important;margin-top:3px!important}

/* Home featured packages: two compact cards side-by-side on phones, as in the reference. */
.home-page .home-featured-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:clamp(7px,2vw,12px)!important;align-items:stretch!important;width:100%!important;min-width:0!important}
.home-page .home-featured-package{display:flex!important;flex-direction:column!important;justify-content:space-between!important;gap:7px!important;min-width:0!important;width:100%!important;padding:clamp(7px,2vw,11px)!important;border-radius:18px!important;overflow:hidden!important}
.home-page .featured-package-ribbon{display:flex!important;align-items:center!important;justify-content:center!important;align-self:flex-start!important;max-width:100%!important;padding:6px 8px!important;margin:0!important;border-radius:9px 9px 9px 3px!important;font-size:clamp(8px,2.5vw,11px)!important;line-height:1.18!important;white-space:normal!important;text-align:center!important}
.home-page .home-featured-package .package-card-top{display:grid!important;grid-template-columns:minmax(48px,.62fr) minmax(0,1fr)!important;align-items:center!important;gap:7px!important;width:100%!important;min-width:0!important}
.home-page .home-featured-package .package-image,.home-page .home-featured-package .package-image-fallback{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:clamp(86px,25vw,118px)!important;min-width:0!important;min-height:0!important;max-height:none!important;padding:3px!important;margin:0!important;border-radius:12px!important;object-fit:contain!important}
.home-page .home-featured-package .package-image-fallback{flex-direction:column!important;font-size:clamp(23px,7vw,36px)!important}
.home-page .home-featured-package .package-image-fallback small{font-size:7px!important;text-align:center!important;overflow-wrap:anywhere!important}
.home-page .home-featured-package .package-main{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:4px!important;min-width:0!important;width:100%!important}
.home-page .home-featured-package .package-main .tag{display:inline-flex!important;max-width:100%!important;padding:4px 6px!important;font-size:clamp(7px,2vw,9px)!important;line-height:1.1!important;overflow-wrap:anywhere!important}
.home-page .home-featured-package .package-main h3{display:block!important;width:100%!important;min-width:0!important;margin:1px 0!important;font-size:clamp(10px,3.1vw,14px)!important;line-height:1.18!important;font-weight:900!important;overflow-wrap:break-word!important}
.home-page .home-featured-package .package-main .price{display:block!important;width:100%!important;margin:1px 0!important;font-size:clamp(11px,3.4vw,16px)!important;line-height:1.12!important;letter-spacing:-.45px!important;white-space:nowrap!important;overflow-wrap:normal!important}
.home-page .home-featured-package .package-facts{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:4px!important;width:100%!important;margin:3px 0 0!important}
.home-page .home-featured-package .package-facts span,.home-page .home-featured-package .package-facts span:last-child{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:2px!important;width:100%!important;min-width:0!important;padding:5px 6px!important;border-radius:8px!important}
.home-page .home-featured-package .package-facts small{display:block!important;max-width:100%!important;font-size:clamp(6.5px,1.9vw,8px)!important;line-height:1.12!important;white-space:normal!important}
.home-page .home-featured-package .package-facts b{display:block!important;max-width:100%!important;text-align:left!important;font-size:clamp(7.5px,2.2vw,9px)!important;line-height:1.12!important;white-space:nowrap!important}
.home-page .home-featured-package .home-package-details{width:100%!important;min-height:34px!important;margin:1px 0 0!important;padding:7px 5px!important;border-radius:11px!important;font-size:clamp(8px,2.45vw,10px)!important;line-height:1.12!important;white-space:normal!important;gap:3px!important;text-align:center!important}
.home-page .home-featured-package .home-package-details span{font-size:10px!important}
.home-page .package-see-all-mobile{min-height:40px!important;font-size:12px!important}

/* All route pages: common mobile-safe sizing and scroll behavior. */
@media(max-width:640px){
 .page{padding-left:var(--manta-mobile-gutter)!important;padding-right:var(--manta-mobile-gutter)!important;padding-bottom:calc(112px + env(safe-area-inset-bottom))!important}
 .page :is(h1){font-size:clamp(19px,5.5vw,27px)!important;line-height:1.2!important}
 .page :is(h2){font-size:clamp(15px,4.25vw,21px)!important;line-height:1.25!important}
 .page :is(h3){font-size:clamp(13px,3.65vw,18px)!important;line-height:1.28!important}
 .page :is(.card,.mini-card,.stat,.menu-tile){border-radius:16px}
 .page :is(.card,.mini-card){padding:clamp(10px,3vw,14px)}
 .page :is(.section-head){gap:8px;align-items:center;flex-wrap:wrap}
 .page :is(.section-head)>:first-child{min-width:0;flex:1 1 150px}
 .page :is(.section-head)>button{flex:0 0 auto;max-width:48%;white-space:normal}
 .page :is(.row){gap:8px;padding:10px}
 .page :is(.row)>:first-child{min-width:0;overflow-wrap:anywhere}
 .page :is(.row)>:last-child{flex:0 0 auto;max-width:55%;text-align:right}
 .page :is(.btn,button[type=submit]){min-height:40px}
 .page :is(.field,input,select,textarea){font-size:16px}
 .page :is(.hero){border-radius:18px}
 .page :is(.hero p){line-height:1.5}
 .page :is(.table-wrap,.table-responsive,.table-scroll,.history-table-wrap,.responsive-table){margin-inline:-2px;padding-bottom:3px}
 .page :is(.table-wrap table,.table-responsive table,.table-scroll table,.history-table-wrap table,.responsive-table table){min-width:520px}
 .page :is(.list,.history-list,.transaction-list){min-width:0;width:100%}
 .page :is(.list-item,.history-item,.transaction-item){min-width:0;max-width:100%;overflow-wrap:anywhere}
 .page .page-title,.page .section-title{max-width:100%;min-width:0;overflow-wrap:break-word}
 .modal{padding:0!important;align-items:flex-end!important;overflow-y:auto!important}
 .modal .sheet{width:100%!important;max-width:560px!important;max-height:min(90dvh,760px)!important;padding:clamp(16px,4vw,22px)!important;padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;overflow-y:auto!important;overscroll-behavior:contain}
 #toast{max-width:calc(100vw - 28px);width:max-content;text-align:center;white-space:normal;overflow-wrap:anywhere}
}
@media(max-width:390px){
 .top.home-top-reference .brand-wrap{max-width:47%}
 .top.home-top-reference .lang-toggle{max-width:25vw;padding-inline:5px;font-size:10px}
 .top.home-top-reference .profile-top-menu{width:33px;min-width:33px}
 .top.home-top-reference .icon{width:34px;height:34px;min-width:34px}
 .profile-reference-page .profile-reference-identity{grid-template-columns:58px minmax(0,1fr) 58px!important;gap:7px!important}
 .profile-reference-page .profile-reference-avatar{width:56px!important;height:56px!important}
 .profile-reference-page .profile-brand-slogan img{width:56px!important;height:50px!important}
 .profile-reference-page .profile-brand-slogan b{font-size:7.5px!important}
 .profile-reference-page .profile-reference-metrics{padding:7px 2px!important}
 .profile-reference-page .profile-reference-metric{gap:3px!important;padding:5px 2px!important}
 .profile-reference-page .profile-reference-metric .metric-icon{width:23px!important;height:23px!important;flex-basis:23px!important;font-size:14px!important}
 .profile-reference-page .profile-reference-metric small{font-size:8px!important}
 .profile-reference-page .profile-reference-metric b{font-size:8px!important;letter-spacing:-.48px!important}
 .home-page .home-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
 .home-page .home-featured-package{padding:7px!important;border-radius:15px!important}
 .home-page .home-featured-package .package-card-top{grid-template-columns:minmax(43px,.58fr) minmax(0,1fr)!important;gap:5px!important}
 .home-page .home-featured-package .package-image,.home-page .home-featured-package .package-image-fallback{height:clamp(78px,24vw,98px)!important}
 .home-page .home-featured-package .package-main .price{font-size:11px!important}
 .home-page .home-featured-package .package-facts span{padding:4px!important}
 .home-page .home-featured-package .home-package-details{font-size:8px!important;min-height:32px!important}
}
@media(max-width:340px){
 .home-page .home-featured-package .package-card-top{grid-template-columns:minmax(38px,.5fr) minmax(0,1fr)!important}
 .home-page .home-featured-package .package-main h3{font-size:9px!important}
 .home-page .home-featured-package .package-main .price{font-size:10px!important}
 .home-page .home-featured-package .package-facts small{font-size:6px!important}
 .home-page .home-featured-package .package-facts b{font-size:7px!important}
 .profile-reference-page .profile-reference-metric b{font-size:7.5px!important}
}
@media(min-width:641px) and (max-width:899px){
 .home-page .home-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .home-page .home-featured-package .package-card-top{grid-template-columns:minmax(100px,.78fr) minmax(0,1.22fr)!important}
}
@media(prefers-reduced-motion:reduce){.home-page .home-featured-package,.profile-reference-page .profile-reference-metric{transition:none!important}}