/* The account and official community stay visible before the game library. */
.header-wallet{border:1px solid #79cdb8!important;background:#153b36!important;color:#d6fff1!important;border-radius:10px;padding:10px 14px;min-height:44px;white-space:nowrap;font-size:13px;font-weight:700}
#wallet.wallet-top{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(230px,1fr);gap:28px;margin:22px 0 16px;padding:26px;border:1px solid #476774;background:linear-gradient(120deg,#142c35,#101c30);border-radius:20px;scroll-margin-top:120px}
.wallet-top-main,.wallet-top-account{min-width:0}
#wallet.wallet-top h2{font-size:clamp(23px,3vw,31px);letter-spacing:-.025em;margin:8px 0 0}
#wallet.wallet-top .eyebrow{font-size:10px;letter-spacing:.11em;color:#9ad8ca;margin:0}
#wallet.wallet-top .wallet-session{padding:14px 0 0;gap:10px}
#wallet.wallet-top .wallet-session strong{font-size:13px;color:#d4e8ed}
#wallet.wallet-top .wallet-session p{font-size:12px;line-height:1.5;color:#b4c8d4;margin:4px 0 0}
#wallet.wallet-top .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
#wallet.wallet-top .actions button{min-height:44px;font-size:12px;padding:10px 14px}
#wallet.wallet-top #wallet-address{font-size:12px;margin:12px 0 0;padding:10px;overflow-wrap:anywhere}
html[data-ui-theme=light][data-web3-home] body #wallet-address{background:#fff!important;color:#17243a!important;border-color:#a8b7ca!important}
html[data-ui-theme=dark][data-web3-home] body #wallet-address{background:#080f1c!important;color:#edf2ff!important;border-color:#526680!important}
#wallet.wallet-top #wallet-action-status{font-size:11px;line-height:1.6;color:#b4c8d4;margin:12px 0 0;min-height:18px}
#wallet.wallet-top .wallet-top-account{border-left:1px solid #476774;padding-left:28px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px}
#wallet-balance{font-size:clamp(20px,2.4vw,29px);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;color:#edfff7}
#wallet-tier{font-size:13px;color:#a9ddce}
.wallet-top-account a{font-size:13px;font-weight:700;color:#c5edff;padding:8px 0;min-height:28px}
.wallet-top-account small{font-size:11px;line-height:1.6;color:#b4c8d4}
#wallet [hidden]{display:none!important}
.web3-community{flex-wrap:wrap!important;gap:12px!important}
.web3-community>p{max-width:230px}
.community-social{display:flex;gap:10px;flex:1;justify-content:flex-end}
.web3-community .social-link{display:flex;align-items:center;gap:12px;min-height:60px;box-sizing:border-box;padding:12px 16px;border-radius:12px;border:1px solid #4e6e7b;background:#152e3e;color:#ecfaff;text-decoration:none;white-space:normal;min-width:0;text-align:left}
.social-link svg{width:23px;height:23px;flex-shrink:0;fill:currentColor}
.social-link>span:first-of-type{font-size:13px;font-weight:700;line-height:1.5}
.social-link small{display:block;font-size:10px;font-weight:400;color:#b8d0df}
.social-link>span:last-child{margin-left:auto}
.social-link:hover{border-color:#91d9ef!important;transform:translateY(-1px)}
.social-link:focus-visible,.header-wallet:focus-visible{outline:3px solid #f0c36e;outline-offset:3px}
html[data-ui-theme=light] body #wallet.wallet-top{background:linear-gradient(120deg,#f1faf8,#edf3fa)!important;border-color:#a9c4c5!important}
html[data-ui-theme=light] body #wallet.wallet-top :is(h2,strong,#wallet-tier){color:#173a45!important}
html[data-ui-theme=light] body #wallet.wallet-top :is(.eyebrow,.wallet-session p,#wallet-action-status,small){color:#425d68!important}
html[data-ui-theme=light] body #wallet.wallet-top a{color:#12647a!important}
html[data-ui-theme=light] body .web3-community .social-link{background:#fff!important;border-color:#a1bfc8!important;color:#173c50!important}
html[data-ui-theme=light] body .social-link small{color:#466576!important}
@media(max-width:960px){.community-social{flex-basis:100%;justify-content:stretch}.community-social .social-link{flex:1}.web3-community>p{max-width:none}}
@media(max-width:640px){#wallet.wallet-top{grid-template-columns:1fr;gap:20px;padding:20px;margin-top:16px}#wallet.wallet-top .wallet-top-account{border-left:0;border-top:1px solid #476774;padding:18px 0 0;gap:7px}.header-wallet{font-size:11px;padding:8px 10px}.site-header .brand-name{font-size:13px}.community-social{gap:8px}.web3-community .social-link{padding:10px;gap:8px}.social-link svg{width:18px;height:18px}.social-link small{font-size:9px}.social-link>span:first-of-type{font-size:12px}}
@media(max-width:360px){.site-header .brand-name{display:none}.community-social{flex-wrap:wrap}.community-social .social-link{flex-basis:100%}}

@media(max-width:1000px){html[data-web3-home] body>header{grid-template-columns:minmax(0,1fr) auto}.site-header .header-actions{grid-column:2}.site-header .quick-nav{grid-column:1/-1;grid-row:2}.site-header .brand-name{overflow:hidden;text-overflow:ellipsis}.site-header .brand-logo{flex-shrink:0}}
@media(max-width:430px){.site-header .brand-name{display:none}}
html[data-ui-theme=light] body #wallet.wallet-top :is(.wallet-top-main,.wallet-top-account,.wallet-heading-row,.wallet-heading-row>div,.wallet-session,.wallet-session>div,.actions){background:transparent!important}
@media(max-width:430px){.site-header .brand::after{content:'WORLD 2D';font-size:11px;font-weight:800;letter-spacing:.04em}}
@media(max-width:360px){.site-header .brand::after{content:'W2D'}}
/* 1.0.61: crisp action icons, explicit network state and resilient wallet logos. */
.action-icon{width:18px;height:18px;flex:0 0 18px;display:inline-block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
button:has(>.action-icon){display:inline-flex;align-items:center;justify-content:center;gap:7px}
#wallet button[hidden]{display:none!important}
.header-wallet .action-icon{width:16px;height:16px;flex-basis:16px}
.wallet-network{display:inline-flex;align-items:center;gap:7px;border:1px solid #476774;border-radius:20px;padding:5px 9px;margin:0 0 10px;font-size:11px;color:#bceada}
.wallet-network::before{content:'';width:6px;height:6px;background:#80dab7;border-radius:50%}
.wallet-network[data-online=false]::before{background:#eeb86d}
.wallet-icon{flex:0 0 42px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.wallet-icon-loaded{background:#fff!important;padding:5px;box-sizing:border-box}
.wallet-icon img{width:100%;height:100%;object-fit:contain}
.wallet-choice .wallet-description{min-width:0;overflow-wrap:anywhere}
.wallet-choice-action[aria-pressed=true]{border-color:#8ee0be;box-shadow:inset 0 0 0 1px #8ee0be}
/* Keep the navigation and wallet dialog inside the mobile layout viewport.
   Horizontal page overflow otherwise pans the dialog away from its tap targets. */
html[data-web3-home] .site-header .quick-nav{min-width:0;max-width:100%;flex-wrap:wrap}
#wallet-picker{box-sizing:border-box;width:min(520px,calc(100vw - 28px));max-width:calc(100vw - 28px)}
@media(max-width:640px){#wallet-picker .wallet-description{flex:1 1 140px}}
#wallet-picker button:focus-visible,#wallet button:focus-visible{outline:3px solid #f0c36e;outline-offset:3px}
#wallet .actions button:disabled{cursor:wait;opacity:.65}
html[data-ui-theme=light] body .wallet-network{color:#23554b!important;border-color:#9dbfb2!important}
html[data-ui-theme=light] body .wallet-network::before{background:#237c5d}
html[data-ui-theme=light] body .wallet-network[data-online=false]::before{background:#a66b13}
@media(max-width:360px){.header-wallet{gap:5px!important;padding:8px}.header-wallet .action-icon{width:14px;height:14px;flex-basis:14px}}

/* Current WDG market chart; sized independently from the trading provider. */
#wdg-chart{scroll-margin-top:96px;min-width:0}
.wdg-chart-panel .section-head{flex-wrap:wrap;gap:16px}
.wdg-chart-frame{position:relative;width:100%;height:560px;overflow:hidden;border:1px solid #314151;border-radius:16px;background:#111820}
.wdg-chart-frame iframe{display:block;width:100%;height:100%;border:0}
.wdg-chart-help{margin-bottom:0}
@media(max-width:600px){.wdg-chart-frame{height:480px;border-radius:12px}.wdg-chart-panel .section-head .button{width:100%;text-align:center}}

/* Home header 190: language was added to the actions after the original
   three-column grid was designed. Let the controls wrap in normal flow instead
   of letting an auto-sized grid track paint over the brand at narrow widths. */
html[data-web3-home] body>header.site-header{
 display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
 width:100%;height:auto;min-height:0;gap:16px 24px;
}
html[data-web3-home] body>header.site-header>.brand{
 flex:1 1 180px;min-width:0;max-width:100%;
}
html[data-web3-home] body>header.site-header .brand-logo{flex:0 0 auto}
html[data-web3-home] body>header.site-header .brand-name{
 display:block;min-width:0;white-space:normal;overflow-wrap:anywhere;
 overflow:visible;text-overflow:clip;line-height:1.35;
}
html[data-web3-home] body>header.site-header>.brand::after{content:none}
html[data-web3-home] body>header.site-header>.header-actions{
 position:static;flex:0 1 auto;min-width:0;max-width:100%;
 display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;
}
html[data-web3-home] body>header.site-header .header-wallet{
 min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;
}
html[data-web3-home] body>header.site-header .store-language189{
 flex:0 1 auto;width:auto;max-width:100%;min-width:0;flex-wrap:wrap;
 justify-content:flex-end;gap:7px;
}
html[data-web3-home] body>header.site-header .store-language189 select{
 min-width:0;max-width:100%;width:144px;min-height:44px;
}
html[data-web3-home] body>header.site-header>.quick-nav{
 order:3;flex:1 0 100%;width:100%;min-width:0;max-width:100%;
 display:flex;flex-wrap:wrap;gap:8px;
}
html[data-web3-home] body>header.site-header>.quick-nav a{
 flex:0 1 auto;min-width:0;max-width:100%;min-height:44px;
 display:flex;align-items:center;justify-content:center;
 white-space:normal;overflow-wrap:anywhere;text-align:center;
}
@media(max-width:680px){
 html[data-web3-home] body>header.site-header{gap:12px;padding-top:16px;padding-bottom:16px}
 html[data-web3-home] body>header.site-header>.brand{flex-basis:100%}
 html[data-web3-home] body>header.site-header>.header-actions{flex:1 1 100%;justify-content:flex-start}
 html[data-web3-home] body>header.site-header .store-language189{flex:1 1 100%;justify-content:flex-start}
 html[data-web3-home] body>header.site-header>.quick-nav a{flex:1 1 120px}
}
