/* GLOBYR v12 | mobile-first hardening and unified native wallet */
:root{--g12-pad:clamp(14px,3vw,28px)}
html,body{min-width:280px}
#landing,#workspace,.site-header,.app-header,.app-canvas,.workspace-content,.provider-section,.provider-row,.g9-atlas,.g10-cross,.g10-market-card{min-width:0;max-width:100%}
.site-header .brand,.app-header-actions,.app-breadcrumb,.hero-copy{min-width:0}
.app-breadcrumb strong{overflow-wrap:anywhere}
.provider-row{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(68px,max-content) 20px;align-items:center;column-gap:clamp(10px,1.6vw,21px);row-gap:8px;padding:20px clamp(12px,2vw,20px);border:1px solid var(--line);border-radius:16px;margin:0 0 12px;box-shadow:none;min-width:0}
.provider-row>div{min-width:0}
.provider-row h3{line-height:1.3;font-weight:740;overflow-wrap:break-word}
.provider-row p{line-height:1.55;overflow-wrap:break-word}
.provider-row>.provider-monogram{width:44px;height:44px;min-width:44px;flex-shrink:0;margin:0}
.provider-row>.provider-count{font-variant-numeric:tabular-nums;text-align:right;font-size:clamp(.76rem,1vw,.875rem);white-space:normal;overflow-wrap:break-word}
.provider-row>.icon{min-width:0}
.g12-wallet-market .app-header-actions>.wallet-button{display:none!important}
.g12-wallet-market #g11-wallet-network{display:grid!important}
.g12-wallet-market #g11-wallet-network[hidden]{display:grid!important}
.g12-native-slot{min-width:0}
.g12-native-slot[hidden]{display:none!important}
.g12-native-slot .wallet-button{display:inline-flex!important;justify-content:center;align-items:center;gap:8px;min-height:42px;max-width:100%;width:100%;white-space:normal;text-align:center;background:var(--accent);color:#172200;border:1px solid var(--accent);border-radius:9px;padding:9px 12px;font:700 .81rem/1.3 var(--sans);overflow-wrap:anywhere}
.g12-native-slot .wallet-button .wallet-label{white-space:normal;max-width:none;overflow-wrap:anywhere;text-overflow:initial}
.g12-native-market #g11-wallet-action{display:none!important}
#g11-wallet-action[hidden]{display:none!important}
.g12-footer-theme{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;flex-shrink:0}
.g12-footer-theme [data-theme-toggle]{display:inline-flex!important}
#site-header #g10-site-menu{display:none!important}
.g11-wallet-network{grid-template-columns:minmax(0,1fr) minmax(120px,190px)}
.g9-atlas-head>*{min-width:0}
.g10-network-options button{min-width:0;min-height:44px;line-height:1.3}
.g10-network-options button small{min-width:0}
.g10-market-metrics>div{min-width:0}
.market-status{line-height:1.5;min-height:0;white-space:normal;overflow-wrap:anywhere;display:flex;align-items:center;gap:8px}
.market-status .network-dot{flex-shrink:0}
.hero-route,.preview-route,.preview-columns,.g7-group,.g7-group a{min-width:0}
.preview-panel{min-width:0;max-width:100%}
.provider-section{min-width:0}
@media(max-width:960px){
 .provider-row{grid-template-columns:42px minmax(0,1fr) 20px;grid-template-rows:auto auto;gap:4px 12px;align-items:start}
 .provider-row>.provider-monogram{grid-column:1;grid-row:1 / span 2;width:42px;height:42px;min-width:42px}
 .provider-row>div{grid-column:2;grid-row:1}
 .provider-row>.provider-count{grid-column:2;grid-row:2;text-align:left;color:var(--muted);font-size:.78rem;justify-self:start;margin-top:2px;white-space:normal}
 .provider-row>.icon{grid-column:3;grid-row:1 / span 2;align-self:center}
 .g11-wallet-network{grid-template-columns:minmax(0,1fr) minmax(120px,190px)}
}
@media(max-width:800px){
 .site-header{height:auto!important;min-height:64px;padding-block:10px!important;gap:8px;flex-wrap:nowrap}
 .site-header>.brand{min-width:0;flex:0 1 auto}
 .site-header>.brand span{min-width:0}
 .site-header>a.button{flex:0 0 auto;white-space:nowrap;margin-left:auto}
 .site-header nav{display:none!important}
 .app-header{height:auto!important;min-height:65px;padding-block:10px!important;padding-inline:var(--g12-pad)!important;gap:10px}
 .app-canvas{padding-inline:var(--g12-pad)!important}
 #landing main{padding-inline:var(--g12-pad)!important}
 .g11-wallet-network{grid-template-columns:minmax(0,1fr);gap:12px;padding:14px}
 .g12-native-slot .wallet-button{width:100%}
 .g10-cross-toolbar{min-width:0}
 .provider-section{padding-inline:0}
 .provider-row{padding:18px 14px;grid-template-columns:42px minmax(0,1fr) 18px;gap:4px 10px}
 .provider-row p{font-size:clamp(.82rem,3.3vw,.94rem)}
 .provider-row h3{font-size:clamp(.98rem,4vw,1.15rem)}
 .g7-band,.g7-groups,.g7-group,.g7-steps,.g7-terms{min-width:0}
 .g7-group{break-inside:avoid}
 .hero h1{overflow-wrap:normal;word-break:normal}
 .g10-market-card{min-width:0}
}
@media(max-width:420px){
 .site-header>.brand{gap:5px!important}
 .site-header>.brand img{width:30px!important;height:30px!important}
 .site-header>.brand span{font-size:clamp(.87rem,4vw,1.05rem)!important}
 .site-header>a.button{font-size:.79rem!important;min-height:40px!important;padding:8px 10px!important}
 .site-header>a.button .icon{width:15px;height:15px}
 .app-header{padding-inline:12px!important}
 .app-breadcrumb{gap:6px!important;flex:1 1 auto}
 .app-breadcrumb>span:not(.g9-header-mark){display:none}
 .app-breadcrumb>.icon{display:none}
 .app-breadcrumb strong{font-size:clamp(.77rem,3.4vw,.9rem);min-width:0}
 .g9-header-mark{width:21px!important;height:21px!important}
 .provider-row{grid-template-columns:36px minmax(0,1fr) 16px;gap:4px 9px;padding:14px 11px;border-radius:13px}
 .provider-row>.provider-monogram{width:36px;height:36px;min-width:36px;font-size:17px}
 .provider-row>.provider-count{font-size:.75rem}
 .provider-row h3{font-size:1rem}
 .provider-row p{font-size:.83rem;line-height:1.5}
 .provider-row>.icon{width:15px}
 .g10-market-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 .g10-market-metrics>div:last-child{grid-column:1/-1}
 .g10-network-options{gap:5px!important}
 .g10-network-options button{padding:8px 3px!important;font-size:clamp(.66rem,3vw,.79rem)!important;overflow-wrap:anywhere}
 .g10-network-options button small{font-size:.6rem}
 .g10-search input{min-width:0;width:100%}
 .g10-sort select{max-width:100%}
 .g9-atlas-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:330px){
 .site-header{gap:6px}
 .site-header>.brand span{font-size:.83rem!important}
 .site-header>a.button{font-size:.72rem!important;padding:6px 8px!important}
 .provider-row{grid-template-columns:34px minmax(0,1fr) 15px;gap:3px 7px}
 .provider-row>.provider-monogram{width:34px;height:34px;min-width:34px}
 .g10-network-options button{font-size:.66rem!important}
}
@media(prefers-reduced-motion:reduce){.provider-row{transition:none!important}}

/* Responsive wallet-to-protocol diagram: never clip protocol labels on phones. */
@media(max-width:800px){
 .connection-section{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:18px!important;padding:32px 0!important}
 .connection-section>div,.connection-section>section{min-width:0}
 .connection-map{display:grid!important;grid-template-columns:minmax(0,1fr)!important;justify-content:stretch!important;align-items:stretch;gap:10px!important;padding:16px!important;width:100%;max-width:100%;min-width:0;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
 .map-wallet,.map-globyr{display:flex!important;align-items:center;gap:8px;min-width:0;white-space:normal!important;justify-content:flex-start}
 .map-connector{display:block!important;width:1px!important;height:20px!important;margin:0 0 0 15px!important}
 .map-globyr{font-size:1rem}
 .map-globyr img{width:28px!important;height:28px!important;flex-shrink:0}
 .map-protocols{margin:6px 0 0!important;padding:0!important;min-width:0!important;position:static!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
 .map-protocols:before,.map-protocols:after,.map-protocols span:before{display:none!important}
 .map-protocols span{padding:9px 7px;border:1px solid var(--line);border-radius:8px;min-width:0;overflow-wrap:break-word;font-size:.8rem;display:flex;gap:4px;align-items:center}
 .map-protocols .g11-morpho-logo{width:16px!important;height:16px!important;flex-shrink:0}
}
@media(max-width:390px){
 .map-protocols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .connection-map{padding:12px!important}
}

/* Text zoom and compact footer resilience */
.landing-footer{flex-wrap:wrap;gap:clamp(12px,2vw,28px)}
.landing-footer p{min-width:0;flex:1 1 150px;line-height:1.55}
.g12-footer-theme{min-width:44px}
@media(max-width:800px){
 .landing-footer{padding:22px var(--g12-pad) 26px!important}
 .section-heading{display:flex;flex-wrap:wrap;align-items:start;gap:8px 18px}
 .section-heading h2,.section-heading p{min-width:0;overflow-wrap:break-word}
 .g7-reveal-text{overflow-wrap:normal;hyphens:auto}
}
@media(max-width:400px){
 .hero .hero-actions{align-items:stretch}
 .hero .hero-actions .button{width:100%}
 .g7-group{min-width:0}
 .g7-group h3{overflow-wrap:break-word}
}

/* Fixed wallet primary contrast independent of light/dark theme */
.g12-native-slot .wallet-button[data-connect]{background:#c8ff12!important;border-color:#c8ff12!important;color:#142000!important;box-shadow:0 3px 0 #85aa00!important}
.g12-native-slot .wallet-button[data-connect]:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.g12-native-slot .wallet-button[data-connect] svg,.g12-native-slot .wallet-button[data-connect] .icon{color:#142000!important}

/* v12.1: show protocol counts on compact layouts; legacy CSS hid them. */
@media(max-width:800px){
  .provider-row>.provider-count{
    display:block!important;
    grid-column:2;
    grid-row:2;
    justify-self:start;
    align-self:start;
    min-width:0;
    max-width:100%;
    white-space:normal;
    overflow-wrap:break-word;
    line-height:1.35;
    margin:2px 0 0;
    font-size:clamp(.72rem,2.8vw,.82rem);
  }
  .provider-row>div{min-width:0}
}
@media(max-width:340px){
  .provider-row{row-gap:7px}
  .provider-row>.provider-count{font-size:.72rem}
}