/* Shared language UI; mobile-only additions stay hidden on desktop. */
.mobile-only,.mobile-hero-title,.mobile-hero-description,.language-trigger,.account-glyph { display:none; }
.desktop-hero-title { background:none; -webkit-text-fill-color:var(--text); }
.desktop-hero-title>span { background:linear-gradient(110deg,#bf87ef,#e3c8ff);background-clip:text;-webkit-text-fill-color:transparent; }
.language-overlay { position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:20px;background:#090611bb;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);animation:veil-in .25s ease-out; }
.language-panel { width:min(520px,100%);max-height:calc(100dvh - 40px);overflow:auto;border-radius:27px;padding:30px;background:linear-gradient(145deg,#483052d9,#171020f5);border-color:#e5b8ff4d;outline:none;animation:modal-arrive .4s cubic-bezier(.2,.8,.2,1);overscroll-behavior:contain; }
.language-close { position:absolute;inset-inline-end:14px;top:13px;width:44px;height:44px;font-size:28px;border:1px solid #e5bfff22;border-radius:50%; }
.language-panel-icon { display:grid;place-items:center;width:48px;height:48px;border-radius:15px;border:1px solid #e1b6ff55;background:#ca9af81a;color:#e3bcff;margin-bottom:19px; }
.language-panel h2 { font-size:27px;font-weight:500;margin:0 40px 9px 0;line-height:1.5; }
.language-panel>p { font-size:16px;color:#bfa4cf;line-height:1.8;margin:0 0 24px; }
.language-options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.language-option { min-height:59px;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:start;padding:12px 15px;border:1px solid #d3a4f229;border-radius:12px;background:#ffffff04;color:#d3bfdc;font-size:16px;line-height:1.5; }
.language-option:hover { background:#c18feb14;border-color:#d5a7f779; }
.language-option[aria-pressed=true] { border-color:#cda2ee;background:#af73db24;color:#f1deff;box-shadow:inset 0 1px 0 #fff2; }
.language-option .icon { width:16px;height:16px;color:#d5a6fa; }
body.language-open { overflow:hidden; }
html[dir=rtl] .hero-art,html[dir=rtl] .exchange-window,html[dir=rtl] .brand,html[dir=rtl] .token-brand,html[dir=rtl] .balance { direction:ltr; }
html[dir=rtl] .hero-copy,html[dir=rtl] .mission,html[dir=rtl] .modal,html[dir=rtl] .language-panel,html[dir=rtl] .rewards-card { text-align:right; }
html[dir=rtl] .button .icon { transform:scaleX(-1); }
html[dir=rtl] input[type=email],html[dir=rtl] #referral,html[dir=rtl] #wallet-address,html[dir=rtl] .share-url,html[dir=rtl] .contract-vault bdi { direction:ltr;text-align:left; }
html[dir=rtl] .language-panel h2 { margin:0 0 9px 40px; }
html:not([lang^=zh]) .hero h1 { overflow-wrap:anywhere; }
html:not([lang^=zh]) .mission-bottom { flex-wrap:wrap; }
html:not([lang^=zh]) .mission-kicker { overflow-wrap:anywhere; }
@media(max-width:760px){
  .desktop-hero-title,.desktop-hero-description,.footer-desktop,#faq{display:none!important;}
  .mobile-only,.mobile-hero-title,.mobile-hero-description{display:block;}
  .nav-actions{gap:10px;}
  #account-btn,.language-trigger{display:grid;place-items:center;position:relative;width:46px;height:46px;min-height:46px;padding:0;border:1px solid #d9b6f13d;border-radius:14px;color:#dbc4ed;background:linear-gradient(140deg,#ddb9fc14,#b78be506);box-shadow:inset 0 1px 0 #fff1;}
  .account-glyph{display:block;width:21px;height:21px;}
  #account-btn .account-label{display:none;}
  #account-btn[data-registered=true]:after{content:'';position:absolute;width:5px;height:5px;background:#b7dfc4;border-radius:50%;right:8px;top:8px;}
  .language-trigger>.icon{width:22px;height:22px;}
  .hero h1{font-size:clamp(34px,9vw,43px);letter-spacing:-1.1px;line-height:1.36;}
  .hero h1>.mobile-hero-title{background:none;-webkit-text-fill-color:var(--text);}
  .mobile-hero-title>span{background:linear-gradient(110deg,#c28cf0,#e7d0ff);background-clip:text;-webkit-text-fill-color:transparent;}
  .hero-copy>p{margin-top:22px;}
  .hero-copy .mobile-hero-description{line-height:1.9;}
  .ecosystem-section{padding-top:42px;padding-bottom:32px;}
  .ecosystem-heading{margin-bottom:23px;}
  .ecosystem-eyebrow{font:14px var(--number);letter-spacing:1px;color:#c59cdb;}
  .ecosystem-heading h2{font-size:28px;line-height:1.5;letter-spacing:-.5px;font-weight:500;margin:10px 0 8px;}
  .ecosystem-heading p{font-size:16px;color:#b39bc2;margin:0;}
  .ecosystem-links{display:flex;flex-direction:column;gap:12px;}
  .ecosystem-link{display:flex;align-items:center;gap:15px;min-height:109px;padding:20px 18px;border:1px solid #d5a5f22a;border-radius:17px;background:linear-gradient(135deg,#c792ef0a,#ad6adb04);box-shadow:inset 0 1px 0 #fff1;}
  .ecosystem-icon{display:grid;place-items:center;flex-shrink:0;width:43px;height:47px;border:1px solid #d8adf13a;border-radius:13px;background:#bb86e70c;color:#d5acee;}
  .ecosystem-icon .icon{width:21px;height:21px;}
  .ecosystem-link-copy{display:flex;flex-direction:column;gap:7px;min-width:0;}
  .ecosystem-link-copy strong{font-weight:500;font-size:19px;line-height:1.5;}
  .ecosystem-link-copy>span{font-size:15px;line-height:1.75;color:#b49ac4;}
  .ecosystem-link>.icon{margin-inline-start:auto;width:17px;height:17px;color:#a37bbb;}
  footer.wrap{border:0;padding-top:6px;padding-bottom:max(26px,env(safe-area-inset-bottom));}
  .footer-vault{border-radius:22px;padding:25px 23px 23px;overflow:hidden;isolation:isolate;}
  .footer-vault:after{content:'';position:absolute;inset:-60px -130px 0 50%;pointer-events:none;z-index:-2;background:radial-gradient(ellipse,#b26de126,transparent 65%);}
  .footer-vault-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;}
  .token-brand{display:flex;align-items:center;gap:11px;}
  .token-brand>svg{height:44px;width:36px;color:#d4a2ef;filter:drop-shadow(0 0 12px #ae6dd244);}
  .token-brand strong{font:600 31px/1.3 var(--number);letter-spacing:-.8px;}
  .token-brand span{display:block;font:14px/1.5 var(--number);letter-spacing:.4px;color:#a98abc;margin-top:3px;}
  .network-badge{display:flex;align-items:center;gap:7px;white-space:nowrap;font:14px var(--number);padding:9px 10px;border:1px solid #d5aff22b;border-radius:20px;color:#c4adcf;background:#d9aaff08;}
  .network-badge i{width:5px;height:5px;border-radius:50%;background:#d8b068;}
  .footer-tagline{font-size:16px;color:#bfa6cc;line-height:1.85;margin:24px 0 22px;}
  .contract-vault{border:1px solid #d4a6ef2b;border-radius:14px;padding:13px 16px 18px;background:#0d081d40;}
  .contract-vault>div{display:flex;justify-content:space-between;align-items:center;gap:13px;color:#b99dca;font-size:14px;margin-bottom:5px;}
  .contract-vault button{width:44px;height:44px;}
  .contract-vault bdi{font:14px/1.9 var(--number);display:block;color:#dbc3eb;overflow-wrap:anywhere;direction:ltr;text-align:start;}
  .footer-quick-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px;}
  .footer-quick-links>a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:83px;padding:14px 7px;text-align:center;border:1px solid #c89be124;background:#d2a3f107;border-radius:13px;color:#c9acd9;font-size:14px;line-height:1.6;overflow-wrap:anywhere;}
  .footer-quick-links .icon{height:20px;width:20px;}
  .mobile-footer-end{display:flex;justify-content:space-between;align-items:center;gap:19px;padding:24px 3px 0;}
  .mobile-footer-end>div{display:flex;flex-direction:column;gap:8px;color:#b196c1;font-size:15px;line-height:1.75;}
  .mobile-footer-end small{font-size:14px;color:#8e759f;}
  .back-to-top{width:46px;height:46px;border:1px solid #cca4e42e;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:#b48dcd;background:#bb87db08;}
  html:not([lang^=zh]) .hero h1{font-size:clamp(32px,8.6vw,41px);letter-spacing:-1px;}
  html:not([lang^=zh]) .hero-buttons{display:flex;flex-wrap:wrap;gap:14px;}
  html:not([lang^=zh]) .hero-buttons>.button{flex-basis:100%;white-space:normal;text-align:center;line-height:1.65;padding-block:14px;}
  html:not([lang^=zh]) .hero-buttons .text-link{width:100%;justify-content:center;}
  html:not([lang^=zh]) .hero-meta{flex-direction:column;align-items:flex-start;}
  html:not([lang^=zh]) .stat:nth-child(2){flex-wrap:wrap;}
  html:not([lang^=zh]) .mission h3{font-size:29px;overflow-wrap:anywhere;}
  html:not([lang^=zh]) .button-claim,html:not([lang^=zh]) .register-row>.button,html:not([lang^=zh]) .task-action>.button{white-space:normal;text-align:start;line-height:1.6;padding-block:13px;}
  html:not([lang^=zh]) .reward-breakdown>div{flex-wrap:wrap;}
  html:not([lang^=zh]) .reward-breakdown b{margin-inline-start:auto;}
  html:not([lang^=zh]) .balance{flex-wrap:wrap;gap:5px 12px;}
  html:not([lang^=zh]) .modal .button-primary{white-space:normal;text-align:start;padding-block:14px;line-height:1.6;}
  html:not([lang^=zh]) .checkbox-row{align-items:flex-start;}
  html:not([lang^=zh]) .checkbox-row input{flex-shrink:0;}
  .language-overlay{padding:14px;}
  .language-panel{padding:28px 22px 23px;max-height:calc(100dvh - 28px);}
}
@media(max-width:375px){
  .nav-actions{gap:8px;}
  #account-btn,.language-trigger{width:44px;height:44px;min-height:44px;border-radius:13px;}
  .nav-wrap>.brand{gap:8px;}
  .nav-wrap>.brand>span{font-size:18px;letter-spacing:3px;}
  .hero h1{font-size:33px;}
  .ecosystem-heading h2{font-size:26px;}
  .ecosystem-link{gap:12px;padding:19px 15px;}
  .ecosystem-link-copy strong{font-size:18px;}
  .ecosystem-link-copy>span{font-size:15px;}
  .ecosystem-icon{width:36px;height:42px;}
  .footer-vault{padding-inline:19px;}
  .footer-vault-heading{align-items:flex-start;flex-wrap:wrap;gap:16px;}
  .token-brand strong{font-size:29px;}
  .token-brand span{font-size:14px;}
  .network-badge{font-size:14px;padding:8px 10px;}
  .language-options{gap:9px;}
  .language-option{font-size:15px;padding-inline:12px;min-height:58px;}
}
@media(prefers-reduced-motion:reduce){.language-overlay,.language-panel{animation:none!important;}}
@media(max-width:760px){.nav-actions{margin:0;margin-inline-start:auto;}}
html[dir=rtl] .journey-indicator,html[dir=rtl] .modal-progress>span,html[dir=rtl] .progress-meta>strong,html[dir=rtl] .chapter-seal,html[dir=rtl] .discovery-count,html[dir=rtl] .stage-reward strong,html[dir=rtl] .main-stat>div,html[dir=rtl] .stat:nth-child(2)>div{direction:ltr;unicode-bidi:isolate;}
.account-label{display:contents;}
@media(max-width:760px){#account-btn .account-label{display:none;}}
.reward-card-bottom>span{min-width:0;white-space:normal;line-height:1.7;overflow-wrap:anywhere;}
