/* Shared touch layouts. Desktop data tables keep their existing column system. */
html{scroll-padding-top:88px}
body{--mobile-nav-height:56px}
img,svg,canvas{max-width:100%}
html[data-theme=light] .testnet-ribbon{color:var(--tx3)}
html[data-theme=light] .testnet-ribbon a{color:var(--goldtx)}
.created-meta-divider{color:var(--tx3)}
html[data-theme=light] .market-rank.rank-1{color:#644909;background:#f6edda;border-color:#c8a765}
html[data-theme=light] .market-rank.rank-2{color:#43515b;background:#e9edef;border-color:#a3adb2}
html[data-theme=light] .market-rank.rank-3{color:#75472b;background:#f2e9e2;border-color:#bd9780}
.sheet{scroll-padding-block:72px 24px}
body:has(#modal:not([hidden])){overflow:hidden}
#sfTop.back-to-top[data-occluded=true]{visibility:hidden;pointer-events:none}
#sfTop.back-to-top::after{inset:0}
/* Reserve the measured operation-bar height, including wrapped translations. */
body.has-sw #sitefoot.sf.foot{padding-bottom:calc(var(--tradebar-height,84px) + 16px)!important}
body.has-sw #sfTop.back-to-top,body.has-sw .toast{bottom:calc(var(--tradebar-height,84px) + 16px)}

@media(max-width:899px){
 html{scroll-padding-top:80px}
 .top .nav{display:none!important}
 .top .top-in{gap:8px;padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right))!important}
 .top .brand{flex:none}
 .top .top-r{gap:2px;min-width:0}
 .top .thm,.top .cart-btn{width:44px;min-width:44px;height:44px;flex:none}
 .top .btn-wallet{min-height:44px;min-width:44px;max-width:166px;padding-inline:10px;overflow:hidden}
 .top .btn-wallet:not(.pill){max-width:calc(100vw - 204px)}
 .top .btn-wallet.pill{gap:7px}
 .top .btn-wallet .wl-addr{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:var(--z-header,30);background:var(--card);border-top:1px solid var(--line);height:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));padding:0 max(4px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(4px,env(safe-area-inset-left))}
 .tabbar a{display:flex;flex:1;flex-direction:column;align-items:center;min-width:0;min-height:var(--mobile-nav-height);justify-content:center;gap:4px;font-size:10px;line-height:1.3;white-space:nowrap}
 .tabbar svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
 body:not(.is-landing) #sitefoot{padding-bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom))}
 body.has-sw #sitefoot.sf.foot{padding-bottom:calc(var(--mobile-nav-height) + var(--tradebar-height,140px) + 16px + env(safe-area-inset-bottom))!important}
 body.has-sw #sfTop.back-to-top,body.has-sw .toast{bottom:calc(var(--mobile-nav-height) + var(--tradebar-height,140px) + 16px + env(safe-area-inset-bottom))}
 #sfTop.back-to-top{right:max(16px,env(safe-area-inset-right));bottom:calc(var(--mobile-nav-height) + 16px + env(safe-area-inset-bottom))}
 .toast{bottom:calc(var(--mobile-nav-height) + 16px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px);font-size:13px;line-height:1.6;overflow-wrap:anywhere}
 .wal-menu,.lang-menu{max-width:calc(100vw - 32px);max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain}
 .wal-menu button,.wal-menu a,.lang-menu button{min-height:44px}
 .testnet-ribbon{padding-block:0;align-items:center;gap:8px;flex-wrap:wrap}
 .testnet-ribbon>a{display:inline-flex;align-items:center;min-height:44px}
 .account-asset .ck::after{inset:0}
 .account-asset .ck{position:relative;inset:auto}
 body[data-page=market] .sw-in #swc{min-width:44px;max-width:none}
 .modal{padding:12px;align-items:center;top:var(--visual-top,0px);height:var(--visual-height,100dvh);bottom:auto}
 .modal .sheet,.modal .sheet.wide,.modal .sheet.drawer{max-width:min(620px,100%);max-height:calc(var(--visual-height,100dvh) - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overscroll-behavior:contain;overflow-x:hidden;overflow-y:auto;height:auto}
 .modal .sheet .sh{top:0;z-index:3;gap:12px;min-height:44px;background:var(--card)}
 .sheet .sh h3{min-width:0;font-size:18px;line-height:1.5;overflow-wrap:anywhere}
 .sheet [data-x]{display:grid;place-items:center;flex:none;width:44px;min-width:44px;height:44px;position:static;padding:0;font-size:26px}
 .sheet .btn,.sheet .field input,.sheet select,.sheet .stepper button,.sheet .stepper input{min-height:44px}
 .sheet .rows p{gap:16px;line-height:1.8;align-items:baseline}
 .sheet .rows b{min-width:0;max-width:65%;overflow-wrap:anywhere;text-align:right}
 .sheet p,.sheet .hint{overflow-wrap:anywhere}
 .sheet .json{white-space:normal;overflow-wrap:anywhere}
 .sheet .project-verification-select{color:var(--tx);background:var(--bg)}
 .sheet select.project-verification-select{height:48px;min-height:48px;-webkit-appearance:none;appearance:none;padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='m1 1 4 4 4-4' fill='none' stroke='%23969c94' stroke-width='1.5'/%3E%3C/svg%3E");background-position:right 14px center;background-size:10px 6px;background-repeat:no-repeat}
}

@media(max-width:767px){
 /* Primary information stays readable without turning every screen into a table. */
 #app.wrap{padding-inline:max(18px,env(safe-area-inset-left)) max(18px,env(safe-area-inset-right))!important}
 #app h1{font-size:28px!important;line-height:1.25;letter-spacing:-.025em}
 #app h2{line-height:1.5}
 #app p{line-height:1.8}
 input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea{font-size:16px!important;min-height:44px}
 input,select,textarea{scroll-margin-block:96px 120px}
 .btn,.btn.sm,.ib{min-height:44px;line-height:1.5}
 .btn,.btn.sm{font-size:13px;white-space:normal}
 .ib{min-width:44px}
 input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),textarea{-webkit-appearance:none;appearance:none}
 .cv-page #cvQuote,.cv-page #cvSlippage{height:44px;min-height:44px;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='m1 1 4 4 4-4' fill='none' stroke='%23969c94' stroke-width='1.5'/%3E%3C/svg%3E");background-position:right 10px center;background-size:10px 6px;background-repeat:no-repeat;padding-right:28px}
 .tabs>button,.seg>button{min-height:44px}
 .pager button{width:44px;min-width:44px;height:44px}

 /* App header and wallet remain on one row even at 320 CSS pixels. */
 .top .brand span{display:none}
 .top .brand img{width:28px;height:28px}
 .top .top-in{height:68px;gap:4px}
 .top .top-r{margin-left:auto;gap:0}
 .top .btn-wallet{font-size:12px;max-width:144px}
 .top .btn-wallet .wl-addr{font-size:11px}

 /* Landing navigation and secondary calls to action are touch controls too. */
 .ld-h .ld-in{min-height:72px;height:auto;padding-block:10px;gap:10px}
 .ld-h .ld-logo,.ld-h .ld-logo img{flex:none}
 .ld-r{gap:2px;min-width:0;flex:1 1 0;justify-content:flex-end}
 .ld-r .thm,.ld-r .ld-menu{width:44px;min-width:44px;height:44px}
 .ld-launch{min-height:44px;padding:10px 14px;font-size:12px;gap:14px}
 .ld-create-link,.ld-inline-link,.home-process-steps a{min-height:44px;align-items:center;font-size:13px}
 .ld-hero-copy>p,.ld-section-intro>p,.ld-feature-list p,.home-process-steps p,.ld-trade-features p{font-size:14px;line-height:1.85}
 .home-process-intro>p{font-size:14px}
 .ld-hero h1{overflow-wrap:anywhere;letter-spacing:-.03em}
 .ld-nav{top:100%;max-height:calc(100dvh - 72px);overflow-y:auto}

 /* Footer content ends above the persistent app navigation. */
 #sitefoot .sf-mid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 24px;padding-bottom:28px}
 #sitefoot .sf-b{grid-column:1/-1;padding:0}
 #sitefoot .sf-logo{gap:8px;margin-bottom:16px;align-items:center}
 #sitefoot .sf-logo b{font-size:18px}
 #sitefoot .sf-logo span{font-size:10px!important;line-height:1.6}
 #sitefoot .sf-desc{font-size:13px;line-height:1.85;max-width:46ch}
 #sitefoot .sf-b>p{font-size:13px;line-height:1.85;max-width:46ch}
 #sitefoot .sf-b .btn{display:inline-flex;align-items:center;min-height:44px;font-size:13px;margin-top:16px}
 #sitefoot .sf-col{min-width:0}
 #sitefoot .sf-col>summary{min-height:44px;padding:0 0 10px;font-size:13px;line-height:1.7;gap:12px}
 #sitefoot .sf-col>ul{padding:0;margin:0}
 #sitefoot .sf-col li{margin:0}
 #sitefoot .sf-col a,#sitefoot .sf-more>summary{display:flex;align-items:center;min-height:44px;font-size:13px;line-height:1.6;padding:8px 0;overflow-wrap:anywhere}
 #sitefoot .sf-more>ul{margin:0 0 8px;padding-left:12px}
 #sitefoot .sf-bot{font-size:11px;line-height:1.8;gap:8px;padding-bottom:12px}

 /* Project listing and market cards. z-index on a static grid item still stacks. */
 .htbl .ra{flex-wrap:wrap;justify-content:flex-end}
 .htbl .ra .btn{min-height:44px;padding:9px 12px;font-size:12px}
 .market-home .mr[data-t] .c-t{z-index:auto;background:transparent}
 .market-home .mtbl.mk .mr[data-t] .c-n:has([data-market-rank]){z-index:3}
 .market-home .market-list-heading h2,.market-home h2{font-size:17px}
 .market-home .market-intro{font-size:14px}
 .market-home #mcat{gap:24px}
 .market-home #mcat>button{font-size:13px;min-height:44px}
 .market-home .mk-q input{font-size:16px}
 .market-home .vf-t{min-height:44px;font-size:12px;flex:1 0 auto}
 .market-home .market-sort{gap:6px}
 .market-home .market-sort select{min-height:44px;height:44px;max-width:180px;padding-inline:10px}
 .market-home #mkDirection{width:44px;min-width:44px;height:44px}
 .market-home .market-project{min-height:44px}
 .market-home .tn b{font-size:16px}
 .market-home .tn small{font-size:11px}
 .market-home .market-mobile-label{font-size:12px}
 .market-home .mtbl.mk .mr b.num{font-size:15px}
 .market-home .mtbl.mk .mr small{font-size:11px;line-height:1.6}
 .market-home .mr .c-action .btn{min-height:44px;font-size:13px}
 .market-home .hc-project>b{font-size:14px}
 .market-home .hc-price>small,.market-home .hc-volume>small,.market-home .hc-volume>.num{font-size:11px}
 .market-detail #pinfo,.market-detail #pmbc>a,.market-detail #pvper>button{min-height:44px}
 .market-detail #pinfo,.market-detail #pvper>button{min-width:44px}
 .market-detail #mview>button{width:44px;min-width:44px;height:44px;padding:10px}
 .market-detail .lc-i .id{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:12px;position:relative;inset:auto}
 .market-detail .pm-meta,.market-detail .pmode{font-size:12px}
 .market-detail .pm-st>div>span{font-size:12px}
 .market-detail .items .lc-m{font-size:13px}
 .market-detail .items .lc-m small{font-size:11px}
 #app .market-detail .items .act>.btn{min-height:44px;height:auto;padding-block:10px;font-size:13px}
 .swp .sw-clr,.swp.bar #swc{min-height:44px;min-width:44px}

 /* Wallet/asset screens share readable labels and consistent action hit areas. */
 .account-intro,.account-overview dt,.account-overview small,.asset-caption,.asset-number,.asset-quote>span{font-size:12px}
 .account-wallet .account-address{font-size:12px;line-height:1.8;overflow-wrap:anywhere}
 .account-network{font-size:12px}
 .account-header-actions .account-explorer{font-size:12px;min-height:44px}
 .account-header-actions>.btn{font-size:13px;min-height:44px}
 .account-page #mytabs>button{font-size:14px;min-height:48px}
 .account-page #ownFilters>button{min-height:44px;font-size:13px}
 .asset-project{min-height:44px;font-size:14px}
 .account-asset .ck{width:44px;height:44px;min-width:44px}
 .account-asset .ck::after{inset:0}
 .account-asset .asset-core,.account-asset .asset-quote{min-width:0}
 .asset-quantity span,.asset-quote b small,.asset-quote small{font-size:12px}
 .account-page .asset-actions .btn,.asset-actions>a{min-height:44px;font-size:12px}
 .account-selection>span{font-size:12px}
 .account-page .account-selection .lk{min-height:44px}
 .history-card-top,.history-card-details dt,.history-card-link{font-size:12px}
 .history-card-details dd,.history-card-main>div{font-size:13px}
 .history-card-link a,.history-card-details a{display:inline-flex;align-items:center;min-height:44px}
 .history-card-details .cpy,.history-card-link .cpy{width:44px;min-width:44px;height:44px}
 .created-heading p:last-child,.created-connect-panel p:not(.created-eyebrow){font-size:14px}
 .created-copy,.created-wallet-explorer{width:44px;min-width:44px;height:44px}
 .created-wallet,.created-network,.created-wallet-address{font-size:12px}
 .created-revenue-link,.created-market-link,.created-contract,.created-project-name>a{min-height:44px;display:inline-flex;align-items:center}
 .created-project-name>a{min-width:0}
 .created-project-data dt,.created-project-data dd small,.created-conversion-state>div>span{font-size:12px}
 .creator-studio .created-project-actions .btn,.created-upload{min-height:44px;min-width:44px;font-size:12px}
 .created-project-actions{align-items:stretch}
 .creator-studio .created-project-actions .btn{flex:1 1 calc(50% - 8px);min-width:120px;justify-content:center;text-align:center}
 .creator-studio .created-project-actions .created-upload{flex:0 0 44px}
 .created-filters button{min-height:44px;font-size:13px}
 .created-search{height:44px}

 /* Creation forms and conversion controls retain their existing business rules. */
 .cr-page label,.price-field>label,.price-tail-head,.cv-page label{font-size:13px}
 .cr-page .hint,.cr-page .muted,.price-scope-desc,.price-tail-desc,.cv-page .hint,.cv-rules li{font-size:12px;line-height:1.85}
 .cr-page .cr-c,.cr-page .cr-s{padding:20px}
 .price-remove{height:44px;min-height:44px}
 .price-modes button,.price-tabs button{min-height:48px}
 .cv-page #cvTabs>button{min-height:48px;font-size:14px}
 .cv-page #cvMax{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:12px;margin-top:4px}
 .cv-page #cvReverse{width:44px;height:44px}
 .cv-direction{margin-block:-14px}
 .cv-page .cv-amount-box select{min-width:88px;width:88px;font-size:16px}
 .cv-page #cvAmount{font-size:28px!important}
 .cv-page #cvSlippage{width:100px;min-height:44px}
 .cv-header p{font-size:14px}
 .cv-network,.cv-project>a,.cv-balance dt,.cv-rules p,.cv-swap-note,.cv-estimate>div,.cv-estimate b{font-size:12px}
 .cv-estimate>div{gap:14px;align-items:flex-start}
 .cv-page .chips button{font-size:13px;min-height:64px}
 .cv-project{min-width:0;flex-wrap:wrap}
 .cv-project>div{min-width:0;flex:1}
 .cv-project>a{min-height:44px;display:inline-flex;align-items:center}
 .br-c .btn,.br-s .btn{min-height:44px}
}

@media(max-width:599px){
 .ld-launch{min-width:0;flex:0 1 auto;white-space:normal;overflow-wrap:anywhere;text-align:center;font-size:11px;line-height:1.2;padding-inline:10px;gap:0}
 .ld-launch>span{display:none}
}
@media(max-width:359px){
 #app.wrap{padding-inline:16px!important}
 .top .top-in{padding-inline:12px!important}
 .top .btn-wallet{padding-inline:7px;gap:5px;max-width:120px}
 .top .btn-wallet img{width:20px;height:20px}
 .ld-h .ld-in{padding-inline:16px;gap:4px}
 .ld-logo img{width:28px;height:28px}
 .ld-r .thm,.ld-r .ld-menu{width:44px;min-width:44px}
 .ld-launch{gap:8px;padding-inline:10px;font-size:11px}
 .market-options .vf-t{flex-basis:100%}
 .market-options .market-sort{width:100%}
 .market-options .market-sort select{flex:1;max-width:none}
 .market-detail .pm-bc{flex-wrap:wrap;gap:8px}
 .market-detail .pm-convert{font-size:12px}
 .created-project-meta .created-contract{font-size:11px;overflow-wrap:anywhere}
 .account-page .asset-actions{gap:8px;flex-wrap:wrap}
 .asset-quote b{font-size:14px}
 .cr-page .cr-c,.cr-page .cr-s{padding:18px 16px}
}

@media(max-width:767px) and (min-height:501px){
 .modal{align-items:flex-end;padding:0}
 .modal .sheet,.modal .sheet.wide,.modal .sheet.drawer{width:100%;max-width:100%;max-height:calc(var(--visual-height,100dvh) - 16px - env(safe-area-inset-top));border-radius:12px 12px 0 0;border-bottom:0;padding:16px 18px calc(20px + env(safe-area-inset-bottom))}
}
@media(max-height:500px) and (max-width:999px){
 .modal{align-items:center;padding:8px}
 .modal .sheet,.modal .sheet.wide,.modal .sheet.drawer{max-height:calc(var(--visual-height,100dvh) - 16px);padding:12px 18px;border-radius:8px}
 .top .top-in{height:56px}
 .sheet .sh{margin-bottom:12px}
}
@media(min-width:900px) and (max-width:999px){
 .top .brand span{display:none}
 .top .top-in{gap:20px}
 .top .nav>a{white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.sheet,.back-to-top{animation:none;transition:none}}