/* Shared V3 tokens: green social/gaming identity, no luxury-site theme. */
:root{--green:#00865d;--green-dark:#073f31;--green-soft:#e5f5eb;--mint:#36d0a5;--cream:#f7faf2;--ink:#073f31;--muted:#5c7165;--line:#dce8dc;--font:"Segoe UI",Arial,sans-serif}
body{background:var(--cream);color:var(--ink)}
.site-header{background:var(--cream);border-bottom:0;position:relative;height:92px}
.header-inner{max-width:1440px;padding-inline:76px;gap:70px}
.brand{width:145px}
.brand img{filter:brightness(0) saturate(100%) invert(38%) sepia(88%) saturate(973%) hue-rotate(126deg) brightness(86%) contrast(101%)}
.main-nav{font-size:14px}
.main-nav>a[aria-current]{color:var(--green);font-weight:700}
.header-actions{margin-inline-start:auto}
.language-switch button{min-height:44px;min-width:32px}
.button-primary{background:var(--green);border-radius:14px;box-shadow:0 5px 15px #00895710}
.button-primary:hover:not(:disabled){background:#006e4d}
.site-footer{background:#f1f7ed;border-top:1px solid #dce8dc}
.footer-legal a,.footer-bottom,.footer-top>div>p{color:#5b705e}
.official-stores{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:20px;direction:ltr}
.store-badge{display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;border-radius:8px;min-height:54px}
.store-badge:disabled{cursor:default;opacity:1}
.apple-badge{width:162px;height:54px;object-fit:contain}
.google-badge{width:185px;height:72px;object-fit:contain}
.store-status{font-size:11px;color:#61765f;margin:0 0 8px;text-align:center}
.product-chat-person>span{margin-inline-start:auto!important}
.legal-nav a,.legal-document-top,.legal-document-top .text-link{color:#526c5b}
.legal-body>p:first-of-type,.draft-notice{color:#785d2b}
.real-friend,.product-chat-person small{color:#596e5e}
.consent{font-size:12px}
.order-rows>div,.order-rows dd{font-size:12px}
.sample-note,.panel-heading p,.checkout-hint{font-size:12px}
.package-unit{font-size:11px}
.recharge-intro h1,.legal-intro h1{font-family:var(--font);font-weight:800;letter-spacing:-.035em}
.recharge-intro h1{font-size:48px}
.identity-card,.selection-panel,.order-summary,.result-card{border-color:#dce8dc;box-shadow:0 12px 32px #19512d09}
.identity-card h2,.panel-heading h2{font-weight:700}
.identity-emblem{background:#e5f5eb;color:var(--green)}
.package-card{min-height:185px;border-radius:18px}
.package-card.selected{background:#edfaef;border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.package-coin-art{height:68px;width:90px;object-fit:contain;margin:7px auto 8px}
.bonus-tag{position:absolute;top:8px;inset-inline-start:8px;border-radius:8px;background:#f9e5a4;color:#795912;font-size:10px;padding:2px 6px}
.package-unit{color:#56735d}
.sample-note,.panel-heading p,.identity-description,.checkout-hint,.summary-head p,.result-description,.result-disclaimer,.region-note{color:#5e7263}
.summary-icon{background:#ddf3e5;color:var(--green)}
.summary-head{background:#edf7e9}
.summary-privacy,.order-rows dt,.consent{color:#536d5d}
.checkout-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:7px 12px;font-size:11px;margin-top:17px}
.checkout-legal a{text-decoration:underline;text-underline-offset:3px}
.result-mascot{width:145px;height:145px;object-fit:contain}
.help-link{display:flex;align-items:flex-start;gap:6px;font-size:12px;color:#526e60;margin-top:9px;line-height:1.6}
.help-link .icon{width:15px;height:15px;margin-top:3px}
.prototype-lab{color:#5e7263}
.lab-body .bonus-preview{display:flex;gap:7px;align-items:center}
.package-card:has(input:focus-visible),.payment-card:has(input:focus-visible){outline:3px solid #079668;outline-offset:4px}
[dir=rtl] .header-inner{direction:rtl}
[dir=rtl] .recharge-intro h1,[dir=rtl] .legal-intro h1{letter-spacing:0}
@media(max-width:1000px){.header-inner{padding-inline:30px;gap:35px}}
@media(max-width:650px){.site-header{height:auto;min-height:82px}.header-inner{padding:12px 20px;gap:14px;flex-wrap:wrap}.brand{width:108px}.main-nav{font-size:12px;gap:16px}.header-actions{margin-inline-start:auto}.language-switch{gap:2px}.language-switch button{font-size:11px;min-width:30px}.main-nav>a[aria-current]:after{display:none}.recharge-intro h1{font-size:34px}.package-card{min-height:178px}.package-coin-art{height:62px;width:83px}.official-stores{gap:8px}.apple-badge{width:134px;height:45px}.google-badge{width:153px;height:60px}.consent{font-size:12px}.steps li{font-size:10px}}
@media(max-width:370px){.header-inner{gap:9px;padding-inline:16px}.brand{width:90px}.main-nav{font-size:11px;gap:10px}.language-switch button{font-size:10px}.official-stores{gap:0}.apple-badge{width:124px;height:42px}.google-badge{width:145px;height:57px}.c .headline-c h1{font-size:42px}.steps li+li:before{margin-inline:5px;width:8px}[dir=rtl] .steps li{font-size:9px}.payment-card strong{font-size:10px}}

/* V3.2 checkout: readable type, country selection, payment methods below offers. */
@font-face{font-family:WanasaArabic;src:url('assets/fonts/NotoSansArabic-Regular.ttf') format('truetype');font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:WanasaArabic;src:url('assets/fonts/NotoSansArabic-Bold.ttf') format('truetype');font-weight:600 900;font-style:normal;font-display:swap}
[lang=ar] body[data-page=recharge]{font-family:WanasaArabic,Tahoma,Arial,sans-serif;--font:WanasaArabic,Tahoma,Arial,sans-serif}
body[data-page=recharge]{font-size:16px;line-height:1.65}
body[data-page=recharge] button,body[data-page=recharge] select{font-family:inherit}
.recharge-page bdi[dir=ltr]{font-family:'Segoe UI',Arial,sans-serif;letter-spacing:0}
body[data-page=recharge] .site-header{height:auto;min-height:76px}
body[data-page=recharge] .header-inner{max-width:1440px;padding:12px 32px;gap:36px;min-height:76px}
body[data-page=recharge] .main-nav{font-size:16px;gap:24px;white-space:nowrap}
body[data-page=recharge] .header-actions{gap:20px;display:flex;align-items:center}
body[data-page=recharge] .language-switch button{font-size:15px}
.country-control{display:flex;align-items:center;gap:8px;position:relative;flex-wrap:wrap}
.country-control label{display:flex;align-items:center;gap:6px;font-size:14px;color:#486355}
.country-control label .icon{height:18px;width:18px}
.country-control select{font:inherit;font-size:15px;color:#073f31;background:#fff;border:1px solid #c9ddd0;border-radius:10px;min-height:42px;padding:5px 8px;max-width:225px}
.country-source{font-size:13px;color:#526a5c}
.country-reset{font-size:22px;border:0;background:transparent;color:#00865d;min-height:44px;min-width:36px;cursor:pointer}
.recharge-page .wrap{max-width:1440px;padding-inline:32px}
.recharge-intro{padding-top:20px}
.recharge-intro h1{font-size:36px;line-height:1.4}
.recharge-intro .eyebrow{font-size:14px}
.recharge-intro>p:last-child{font-size:16px;line-height:1.65;margin-top:6px}
.recharge-page .steps{margin:20px auto 22px}
.recharge-page .steps li{font-size:15px;gap:10px}
.recharge-page .steps li>span{width:32px;height:32px;font-size:15px}
.recharge-page .steps li+li:before{width:76px;margin-inline:22px}
.recharge-page .identity-card h2{font-size:28px;line-height:1.5}
.recharge-page .identity-description,.recharge-page .field-label{font-size:16px;line-height:1.7}
.recharge-page .id-input-wrap input{font-size:18px}
.recharge-page .help-link,.recharge-page .demo-id,.recharge-page .demo-id button,.recharge-page .identity-foot,.recharge-page .field-error{font-size:14px;line-height:1.7}
.recharge-page .button{font-size:17px;min-height:50px}
.recharge-grid{max-width:1376px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:stretch}
.recharge-main{min-width:0;display:flex;flex-direction:column;gap:12px}
.account-strip{margin:0;padding:12px 18px;min-height:84px;gap:14px;border-radius:18px}
.account-strip>div{min-width:0;line-height:1.5}
.recharge-page .account-avatar{height:48px;width:48px;flex-shrink:0}
.recharge-page .account-strip .small{font-size:14px;color:#52695c}
.recharge-page .account-strip strong{font-size:20px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.recharge-page .small-tag{display:inline-block;font-size:13px;line-height:1.6;padding:1px 7px;white-space:nowrap;color:#745019;background:#f6eddc}
.recharge-page .account-id{font-size:15px;color:#52695c;line-height:1.6}
.recharge-page .change-link{font-size:16px;min-height:44px;flex-shrink:0}
.recharge-page .selection-panel{padding:16px;margin:0;border-radius:18px}
.recharge-page .panel-heading{gap:10px;align-items:center}
.recharge-page .panel-heading h2{font-size:22px;line-height:1.5}
.recharge-page .section-number{font-size:26px;line-height:1.4}
.recharge-page .sample-note{font-size:14px;line-height:1.6;margin:8px 0 12px;align-items:center;color:#52695c}
.recharge-page .sample-note .icon{flex-shrink:0}
.recharge-page .package-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.recharge-page .package-card{border-radius:12px;min-height:162px;padding:7px 5px 0;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;overflow:visible}
.recharge-page .package-coin-art{width:62px;height:46px;margin:0 auto 2px}
.package-info{display:flex;flex-direction:column;align-items:center;min-width:0}
.recharge-page .package-info>strong{font-size:21px;line-height:1.4;font-weight:700;white-space:nowrap}
.recharge-page .package-unit{font-size:13px;margin:0;line-height:1.5;color:#52695c}
.web-exclusive{font-size:13px;line-height:1.6;color:#126045;background:#e7f6ec;border-radius:5px;padding:0 5px;white-space:nowrap}
.recharge-page .package-price{font-size:16px;font-weight:600;line-height:1.5;margin-top:auto;width:calc(100% + 10px);padding:6px 2px;border-top:1px solid #e1ebdf;border-radius:0 0 11px 11px;background:#f5f9f1;color:#007b55;white-space:nowrap}
.recharge-page .selected .package-price{background:#dff3e6}
.recharge-page .selection-check{top:-5px;inset-inline-end:-5px;height:20px;width:20px}
.recharge-page .bonus-tag{font-size:13px;top:-8px;inset-inline-start:4px;z-index:1}
.payment-panel .panel-heading{flex-wrap:wrap}
.payment-panel .panel-heading p{font-size:14px;line-height:1.6;margin:0;margin-inline-start:auto;color:#52695c}
.recharge-page .payment-grid{grid-template-columns:repeat(var(--method-count,5),minmax(0,1fr));gap:8px;margin-top:12px}
.recharge-page .payment-card{border-radius:10px;padding:10px 8px;min-height:48px;gap:6px;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap}
.recharge-page .payment-card strong{font-size:15px;line-height:1.5;white-space:nowrap;font-family:'Segoe UI',Arial,sans-serif}
.recharge-page .radio-dot{position:static;height:16px;width:16px;flex-shrink:0;margin:0}
.recharge-page .payment-card.selected{background:#edfaef;border-color:#00865d}
.country-notice{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.country-notice:empty{display:none}
.checkout-column{min-width:0;display:flex;flex-direction:column}
.recharge-page .order-summary{position:static;border-radius:18px;flex:1;display:flex;flex-direction:column}
.recharge-page .summary-head{padding:22px 20px;display:grid;grid-template-columns:44px 1fr;text-align:start;gap:3px 12px}
.recharge-page .summary-icon{width:44px;height:44px;grid-row:1/3;margin:0}
.recharge-page .summary-head h2{font-size:24px;line-height:1.5}
.recharge-page .summary-head p{font-size:14px;line-height:1.7;margin:0}
.recharge-page .summary-body{padding:22px;flex:1;display:flex;flex-direction:column}
.recharge-page .order-rows>div,.recharge-page .order-rows dd{font-size:17px;line-height:1.7}
.recharge-page .order-rows>div{gap:12px;margin-bottom:16px}
.recharge-page .order-rows dt{color:#52695c;flex-shrink:0}
.recharge-page .order-rows dd{overflow-wrap:anywhere;text-align:end}
.recharge-page .summary-total{font-size:18px;padding:16px 0;margin:4px 0 24px}
.recharge-page .summary-total strong{font-size:28px;line-height:1.5}
.recharge-page .summary-body>.button{font-size:17px;min-height:52px;margin-top:auto}
.recharge-page .checkout-hint{font-size:14px;line-height:1.8;margin-top:12px}
.recharge-page .checkout-legal{font-size:14px;line-height:1.8;gap:6px 14px;margin-top:18px}
.recharge-page .region-note{max-width:1376px;margin:12px auto 0;font-size:14px;line-height:1.8;color:#52695c}
.recharge-page .prototype-lab{margin-top:24px}
.recharge-page .prototype-lab>summary,.recharge-page .lab-body{font-size:14px;line-height:1.8}
.recharge-page .result-card h2{font-size:32px;line-height:1.5}
.recharge-page .result-description,.recharge-page .result-account strong{font-size:18px;line-height:1.7}
.recharge-page .result-disclaimer,.recharge-page .order-reference,.recharge-page .result-account span{font-size:14px;line-height:1.8}
body[data-page=recharge] .footer-legal{font-size:14px;line-height:1.8}
body[data-page=recharge] .footer-bottom,body[data-page=recharge] .footer-top>div>p,body[data-page=recharge] .prototype-pill{font-size:13px;line-height:1.8}
body[data-page=recharge] dialog{font-size:16px;line-height:1.7}
body[data-page=recharge] dialog h2{font-size:28px;line-height:1.5}
body[data-page=recharge] dialog .order-rows>div,body[data-page=recharge] dialog .order-rows dd{font-size:16px;line-height:1.8}
body[data-page=recharge] dialog .demo-checkout-note,body[data-page=recharge] dialog .dialog-note{font-size:14px;line-height:1.8}
body[data-page=recharge] dialog .button{font-size:16px;min-height:48px}
[dir=rtl] .recharge-page .recharge-intro h1{letter-spacing:0}
@media(min-width:1200px){
 .recharge-configure .recharge-intro{padding-top:4px}
 .recharge-configure .recharge-intro .eyebrow{display:none}
 .recharge-configure .recharge-intro h1{font-size:30px;margin:0}
 .recharge-configure .recharge-intro>p:last-child{margin-top:2px}
 .recharge-configure .steps{margin:12px auto 16px}
 .recharge-configure .order-summary{margin:0}
}
@media(min-width:1200px) and (max-width:1330px){
 .recharge-grid{grid-template-columns:minmax(0,1fr) 310px;gap:16px}
 .recharge-page .package-info>strong{font-size:19px}
 .recharge-page .package-price{font-size:15px}
 .recharge-page .payment-grid{gap:6px}
 .recharge-page .payment-card{padding-inline:6px}
 .recharge-page .payment-card strong{font-size:14px}
}
@media(max-width:1199px){
 body[data-page=recharge] .header-inner{flex-wrap:wrap;gap:14px 24px}
 body[data-page=recharge] .header-actions{gap:14px}
 .country-source{display:none}
 .recharge-grid{grid-template-columns:minmax(0,1fr) 320px}
 .recharge-page .package-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .recharge-page .payment-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .recharge-page .package-info>strong{font-size:19px}
 .recharge-page .order-summary{align-self:stretch}
}
@media(max-width:999px){
 .recharge-grid{grid-template-columns:1fr;max-width:760px}
 .recharge-page .package-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
 .recharge-page .payment-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
 .recharge-page .package-info>strong{font-size:18px}
 .recharge-page .package-price{font-size:15px}
 .recharge-page .summary-body>.button{margin-top:0}
 .recharge-page .region-note{max-width:760px}
}
@media(max-width:720px){
 body[data-page=recharge] .header-inner{padding:12px 18px;gap:12px;justify-content:space-between}
 body[data-page=recharge] .brand{width:110px}
 body[data-page=recharge] .main-nav{font-size:15px;gap:20px}
 body[data-page=recharge] .header-actions{flex-basis:100%;justify-content:space-between;margin:0}
 .country-control{flex:1;gap:6px;flex-wrap:nowrap}
 .country-control select{max-width:190px;font-size:14px;min-width:0}
 .country-control label{font-size:14px}
 body[data-page=recharge] .language-switch button{font-size:14px;min-width:32px}
 .recharge-page .wrap{padding-inline:16px}
 .recharge-intro{padding-top:18px}
 .recharge-page .recharge-intro h1{font-size:28px;margin-top:6px}
 .recharge-intro .eyebrow{font-size:13px}
 .recharge-intro>p:last-child{font-size:15px;max-width:360px}
 .recharge-page .steps{margin:20px auto}
 .recharge-page .steps li{font-size:14px;gap:6px}
 .recharge-page .steps li+li:before{width:14px;margin-inline:8px}
 .recharge-page .steps li>span{width:28px;height:28px;font-size:14px}
 .recharge-page .identity-card{padding:24px 18px}
 .recharge-page .identity-card h2{font-size:24px}
 .recharge-page .account-strip{padding:14px 12px;gap:10px;flex-wrap:wrap}
 .recharge-page .account-strip strong{font-size:18px;gap:6px}
 .recharge-page .account-strip>div{flex:1}
 .recharge-page .account-strip .change-link{margin-inline-start:auto}
 .recharge-page .account-avatar{height:42px;width:42px}
 .recharge-page .selection-panel{padding:14px 12px}
 .recharge-page .panel-heading h2{font-size:21px}
 .recharge-page .package-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .recharge-page .package-card{min-height:176px}
 .recharge-page .package-coin-art{width:74px;height:54px}
 .recharge-page .package-info>strong{font-size:21px}
 .recharge-page .package-price{font-size:16px;padding-block:8px}
 .recharge-page .package-unit,.web-exclusive{font-size:14px}
 .payment-panel .panel-heading p{flex-basis:100%;margin:0}
 .recharge-page .payment-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .recharge-page .payment-card{min-height:52px;padding:10px}
 .recharge-page .payment-card strong{font-size:16px}
 .recharge-page .order-summary{margin-top:0}
 .recharge-page .summary-head{padding:18px}
 .recharge-page .summary-body{padding:18px}
 .recharge-page .summary-head h2{font-size:23px}
 .recharge-page .result-card{padding:24px 18px}
 .recharge-page .result-card h2{font-size:26px}
 .recharge-page .result-account{gap:12px}
}
@media(max-width:380px){
 .country-control label{font-size:0;gap:0}
 .country-control label .icon{width:19px;height:19px}
 .country-control select{max-width:160px}
 .recharge-page .steps li{font-size:13px}
 .recharge-page .steps li+li:before{width:8px;margin-inline:4px}
 .recharge-page .package-info>strong{font-size:18px}
 .recharge-page .package-price{font-size:15px}
 .recharge-page .account-strip .change-link{flex-basis:100%;text-align:end}
 .recharge-page .summary-total strong{font-size:25px}
}

/* Keep the larger text; save space by grouping related labels. */
.recharge-page .account-strip .small{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:15px}
.recharge-page .account-strip .account-id{font-weight:400;margin-inline-start:6px}
.recharge-page .small-tag{font-size:14px}
.recharge-page .summary-total>span{font-size:18px}
@media(min-width:1200px){
 body[data-page=recharge] .site-header,body[data-page=recharge] .header-inner{min-height:64px}
 body[data-page=recharge] .header-inner{padding-block:6px}
 .recharge-configure .recharge-intro>p:last-child{display:none}
 .recharge-configure .recharge-intro h1{font-size:28px;line-height:1.4}
 .recharge-configure .steps{margin:8px auto 12px}
 .recharge-configure .account-strip{min-height:76px;padding-block:10px}
 .recharge-configure .recharge-main{gap:10px}
 .recharge-configure .selection-panel{padding:12px}
 .recharge-configure .sample-note{margin:3px 0 9px}
 .recharge-configure .package-card{min-height:136px;padding-top:6px}
 .recharge-configure .package-coin-art{height:40px;margin-bottom:1px}
 .recharge-configure .payment-grid{margin-top:8px}
 .recharge-configure .payment-card{min-height:46px;padding-block:9px}
}
@media(min-width:1200px){
 .recharge-configure>.wrap{display:grid;grid-template-columns:auto 1fr;column-gap:24px}
 .recharge-configure .recharge-intro{text-align:start;align-self:center;padding:0}
 .recharge-configure .recharge-intro h1{font-size:26px}
 .recharge-configure .steps{justify-self:end;margin:12px 0 16px}
 .recharge-configure .recharge-grid,.recharge-configure .region-note{grid-column:1/-1;width:100%}
 .recharge-configure .package-info>strong{font-size:21px}
 .recharge-configure .package-price{font-size:16px}
 .recharge-configure .package-unit{font-size:14px}
 .recharge-configure .account-strip .small{font-size:16px}
 .recharge-configure .recharge-main{gap:8px}
 .recharge-configure .steps{margin-bottom:8px}
 .recharge-configure .payment-panel{padding-block:10px}
 .recharge-configure .packages-panel{flex:1}
 .recharge-configure .summary-head{padding:18px}
 .recharge-configure .summary-body{padding:18px}
 .recharge-configure .order-rows>div{margin-bottom:12px}
 .recharge-configure .summary-total{padding-block:12px;margin-bottom:20px}
 .recharge-configure .checkout-legal{margin-top:14px}
}

/* V3.2.1: shared text scale and local brand assets. */
:root{--text-body:16px;--text-label:16px;--text-help:14px;--text-meta:13px;--text-section:22px}
body[data-page=home],body[data-page=recharge]{font-size:var(--text-body);line-height:1.65}
[lang=ar] body[data-page=home]{font-family:WanasaArabic,Tahoma,Arial,sans-serif;--font:WanasaArabic,Tahoma,Arial,sans-serif}
body[data-page=home] button{font-family:inherit}
body[data-page=home] .main-nav,body[data-page=recharge] .main-nav{font-size:var(--text-label)}
body[data-page=home] .language-switch button,body[data-page=recharge] .language-switch button{font-size:15px}
.c .headline-c .eyebrow,.c .home-recharge .eyebrow{font-size:var(--text-help)}
.c .bodycopy,.c .home-recharge p:not(.eyebrow){font-size:var(--text-body);line-height:1.8}
.c .store-status,.c .tagline-card p,.c .bottom-line,.c .source-caption{font-size:var(--text-help);line-height:1.8}
.c .tagline-card h3{font-size:var(--text-section);line-height:1.5}
.c .home-recharge .button{font-size:17px}
.c .product-card-heading,.c .discover-title strong,.c .product-chat-person strong{font-size:var(--text-label)}
.c .real-friend,.c .discover-title span,.c .product-chat-person small,.c .real-message,.c .voice-message,.c .last-message,.c .scene-caption{font-size:var(--text-help)}
.c .real-message{line-height:1.75}
.c .real-friends{padding-block:12px 14px}
.c .scene-caption{letter-spacing:.08em}
[lang=ar] .c .scene-caption{letter-spacing:0}
.c .mini-wave{min-width:0;overflow:hidden}
.c .mini-wave i{flex-shrink:0}
.c .footer-legal{font-size:var(--text-help);line-height:1.8}
.c .footer-bottom,.c .footer-top>div>p,.c .prototype-pill{font-size:var(--text-meta);line-height:1.8}
.country-control{flex-wrap:nowrap;min-width:0}
.country-label{display:flex;align-items:center;gap:6px;font-size:14px;color:#486355;white-space:nowrap}
.country-label .icon{height:18px;width:18px;flex-shrink:0}
.country-picker{position:relative;min-width:0}
.country-trigger{display:flex;align-items:center;gap:8px;max-width:240px;font:inherit;font-size:15px;color:var(--ink);background:#fff;border:1px solid #c9ddd0;border-radius:10px;min-height:42px;padding:5px 10px;text-align:start;cursor:pointer}
.country-trigger:disabled{cursor:default;color:#526a5c;background:#f0f5ef}
.country-trigger:focus-visible{outline:3px solid #36d0a5;outline-offset:2px}
#country-value{min-width:0}
.country-name{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;max-width:100%}
.country-flag{display:block;width:24px;height:18px;object-fit:contain;flex-shrink:0;border-radius:2px;box-shadow:0 0 0 1px #123c281a}
.country-trigger .country-name>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.country-chevron{flex-shrink:0;font-family:Arial,sans-serif;line-height:1}
.country-source{white-space:nowrap}
.country-options{position:absolute;z-index:30;inset-inline-start:0;top:calc(100% + 8px);min-width:260px;width:max-content;max-width:calc(100vw - 32px);max-height:320px;overflow-y:auto;overscroll-behavior:contain;padding:6px;margin:0;list-style:none;border:1px solid #c9ddd0;border-radius:12px;background:#fff;box-shadow:0 12px 36px #073f3124}
.country-options[hidden]{display:none}
.country-options [role=option]{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:7px;font-size:15px;line-height:1.6;cursor:pointer;color:var(--ink)}
.country-options [role=option]:hover,.country-options [role=option]:focus{background:#edf7e9;outline:2px solid #00865d;outline-offset:-2px}
.country-options [aria-selected=true]{background:#e5f5eb;font-weight:700}
.country-option-check{color:#00865d;min-width:14px}
.order-rows dd .country-name{justify-content:flex-end;text-align:end}
.method-identity{min-width:0;display:flex;align-items:center;gap:8px}
.payment-brand{width:42px;height:28px;object-fit:contain;flex-shrink:0}
.recharge-page .payment-card{gap:6px;padding-inline:10px}
.recharge-page .payment-card strong{white-space:normal;overflow-wrap:normal}
@media(min-width:1200px) and (max-width:1330px){
 .recharge-page .payment-card{padding-inline:6px}
 .method-identity{gap:5px}
 .payment-brand{width:34px;height:24px}
 .recharge-page .payment-card strong{font-size:14px;white-space:nowrap}
}
@media(min-width:721px) and (max-width:999px){
 .method-identity{flex-direction:column;gap:4px}
 .recharge-page .payment-card{align-items:flex-start;min-height:80px}
}
@media(max-width:720px){
 body[data-page=home] .main-nav,body[data-page=recharge] .main-nav{font-size:15px}
 body[data-page=home] .language-switch button,body[data-page=recharge] .language-switch button{font-size:14px}
 .country-trigger{max-width:190px;font-size:14px;padding-inline:8px;gap:6px}
 .country-name{gap:6px}
 .country-options{min-width:240px}
 .method-identity{flex-direction:column;align-items:flex-start;gap:6px}
 .recharge-page .payment-card{min-height:86px;align-items:flex-start;padding:12px}
 .recharge-page .payment-card .radio-dot{margin-top:6px}
 .recharge-page .payment-card strong{font-size:16px;line-height:1.5}
 .c .headline-c .eyebrow{letter-spacing:.06em}
}
@media(max-width:380px){
 .country-label{font-size:0;gap:0}
 .country-trigger{max-width:155px}
 .country-options{min-width:230px}
 .country-flag{width:22px;height:16.5px}
 .c .header-inner{justify-content:space-between}
 .c .header-actions{flex-basis:100%;justify-content:flex-end;display:flex}
 .c .scene-caption{font-size:13px;letter-spacing:.03em}
}
@media(max-width:720px){
 body[data-page=recharge] .header-actions{gap:8px;min-width:0}
 .country-control{gap:4px}
 .country-picker{flex:0 1 auto}
 .country-trigger{width:100%;max-width:190px}
 .country-trigger #country-value{flex:1}
 .country-trigger .country-name{display:flex}
 .country-trigger .country-name>span{min-width:0}
 .country-reset{min-width:28px;width:28px;padding:0;flex-shrink:0}
 .country-label,.language-switch{flex-shrink:0}
}
@media(max-width:380px){.country-trigger{max-width:130px}}
.recharge-page .payment-card>.radio-dot{flex-basis:16px}
@media(max-width:720px){
 .recharge-page .payment-card .method-identity{flex:1}
 .recharge-page .payment-card>.radio-dot{position:absolute;top:12px;inset-inline-end:12px;margin:0}
}

/* V3.2.2: separate navigation, progress heading and checkout sections.
   Taller desktops get more space; short laptop screens retain visible payment choices. */
@media(min-width:1200px){
 body[data-page=recharge] .header-actions{gap:28px}
 body[data-page=recharge] .country-control{gap:10px}
 .recharge-configure{padding-top:16px}
 .recharge-configure .steps{margin:0 0 12px}
 .recharge-configure .recharge-intro{align-self:start}
}
@media(min-width:1200px) and (min-height:760px) and (max-height:839px){
 body[data-page=recharge] .site-header,body[data-page=recharge] .header-inner{min-height:72px}
 body[data-page=recharge] .header-inner{padding-block:10px}
 .recharge-configure{padding-top:24px}
 .recharge-configure .steps{margin-bottom:16px}
 .recharge-configure .recharge-main{gap:12px}
}
@media(min-width:1200px) and (min-height:840px){
 body[data-page=recharge] .site-header,body[data-page=recharge] .header-inner{min-height:80px}
 body[data-page=recharge] .header-inner{padding-block:14px}
 .recharge-configure{padding-top:28px}
 .recharge-configure .steps{margin-bottom:24px}
 .recharge-configure .recharge-main{gap:16px}
 .recharge-configure .account-strip{min-height:84px;padding-block:14px}
 .recharge-configure .selection-panel{padding:18px}
 .recharge-configure .sample-note{margin:6px 0 14px}
 .recharge-configure .payment-grid{margin-top:12px}
 .recharge-configure .summary-head,.recharge-configure .summary-body{padding:22px}
}
@media(min-width:1200px) and (min-height:950px){
 body[data-page=recharge] .site-header,body[data-page=recharge] .header-inner{min-height:88px}
 .recharge-configure{padding-top:36px}
 .recharge-configure .steps{margin-bottom:28px}
}
@media(max-width:1199px){
 .recharge-configure{padding-top:12px}
}

/* Coin and diamond catalogs share the existing green checkout. */
.currency-switch{display:flex;gap:4px;padding:4px;background:#edf5ee;border-radius:12px;margin-inline-start:auto;flex-shrink:0}
.currency-switch button{display:flex;gap:6px;align-items:center;justify-content:center;border:0;border-radius:9px;padding:7px 12px;min-height:38px;color:#52695c;background:transparent;font-size:15px;font-weight:600;cursor:pointer}
.currency-switch button[aria-pressed=true]{background:#00865d;color:white;box-shadow:0 2px 5px #073f3115}
.currency-switch .icon{width:19px;height:19px}
.currency-switch button:focus-visible{outline:3px solid #36d0a5;outline-offset:2px}
.actual-bonus{display:block;font-size:12px;line-height:1.5;color:#007b55;font-weight:500;margin-bottom:3px}
.empty-options{padding:20px;color:#5c7165}
@media(max-width:720px){.packages-panel .panel-heading{flex-wrap:wrap}.currency-switch{flex-basis:100%;margin:8px 0 0}.currency-switch button{flex:1;min-height:42px;font-size:16px}.actual-bonus{font-size:12px}}
@media(min-width:1200px) and (max-height:759px){.currency-switch{padding:2px}.currency-switch button{min-height:30px;padding:3px 10px}}
@media(min-width:1200px) and (max-height:759px){
 .recharge-configure .account-strip{min-height:68px;padding-block:6px}
 .recharge-configure .sample-note{margin:0 0 5px}
 .recharge-configure .package-grid{row-gap:8px}
 .recharge-configure .payment-panel{padding-block:8px}
}
.actual-bonus{font-size:14px;line-height:1.4}

/* A real configured gift is separate from the base quantity. No gift, no badge. */
.recharge-page .package-grid:has(.recharge-bonus-badge){padding-top:22px;row-gap:28px}
.recharge-bonus-badge{position:absolute;bottom:calc(100% - 6px);inset-inline-start:10px;z-index:2;display:flex;align-items:center;justify-content:center;gap:4px;max-width:calc(100% - 20px);padding:3px 9px;border:1px solid #fff;border-radius:9px 9px 9px 2px;background:#c83448;color:#fff;box-shadow:0 3px 8px #9b21301c;font-size:14px;font-weight:700;line-height:1.25;text-align:center;flex-wrap:wrap}
[dir=rtl] .recharge-bonus-badge{border-radius:9px 9px 2px 9px}
.recharge-bonus-badge bdi{white-space:nowrap}
@media(min-width:1200px) and (max-height:759px){.recharge-configure .package-grid:has(.recharge-bonus-badge){padding-top:20px;row-gap:24px}}
@media(min-width:1200px) and (max-height:759px){
 .recharge-configure:has(.recharge-bonus-badge) .package-card{min-height:132px}
 .recharge-configure:has(.recharge-bonus-badge) .package-price{padding-block:4px}
 .recharge-configure:has(.recharge-bonus-badge) .sample-note{margin-bottom:3px}
 .recharge-configure:has(.recharge-bonus-badge) .payment-grid{margin-top:6px}
}
