/* Recharge screen and the illustrated mall entrance in the game header. */
.player-header{grid-template-columns:58px minmax(0,1fr) 88px 56px}
.wealth{min-width:0}.wealth>span{overflow:hidden;text-overflow:ellipsis}
.mall-entry{width:56px;height:70px;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:1px 3px 3px;border:1px solid #ebc66a;border-radius:9px;background:radial-gradient(ellipse at 50% 30%,#418079,#123c3d 70%);color:#fff0ae;box-shadow:inset 0 0 0 1px #513a21,0 3px 0 #352214;font-weight:800;text-shadow:0 2px 1px #462312;font-size:13px;line-height:18px;flex:none}
.mall-entry-icon{display:block;width:48px;height:48px;max-width:none;object-fit:contain;filter:drop-shadow(0 1px 1px #102c29)}
.mall-entry:active{transform:translateY(2px);box-shadow:inset 0 0 0 1px #513a21,0 1px 0 #352214}
@media(max-width:360px){.player-header{grid-template-columns:50px minmax(0,1fr) 72px 48px}.mall-entry{width:48px;height:64px;font-size:12px;line-height:17px}.mall-entry-icon{width:42px;height:42px}}
.shop-recharge{display:flex;justify-content:flex-end;margin:12px 0 0}
#game.recharge-mode{background:#063e4a}
.recharge-page{--recharge-deep:#032e36;--recharge-muted:#826345;height:100%;display:flex;flex-direction:column;overflow:hidden;color:var(--cream);font-family:"Recharge Sans","Microsoft YaHei","PingFang SC",sans-serif;font-size:13px}
.recharge-page button{font-family:inherit}
.recharge-toolbar{height:64px;flex:none;background:var(--recharge-deep);display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;padding:10px 12px;padding-top:calc(10px + env(safe-area-inset-top));min-height:calc(64px + env(safe-area-inset-top))}
.recharge-toolbar h1{text-align:center;color:var(--gold);font-family:"Recharge Serif","Noto Serif SC","STKaiti","KaiTi",serif;font-size:24px;line-height:34px;font-weight:700}
.recharge-back{width:44px;height:44px;min-height:44px;background:none;border:0;padding:0;color:var(--gold);font-size:28px;line-height:1}
.recharge-nav-space{width:44px;height:44px}
.recharge-frame{display:flex;flex-direction:column;flex:1;min-height:0}
.recharge-hero{height:174px;position:relative;flex:none;overflow:hidden;border-bottom:1px solid var(--brass);background:#063e4a}
.recharge-texture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.recharge-halo{position:absolute;top:-28px;right:-30px;width:210px;height:210px}
.recharge-hero-copy{position:absolute;left:20px;top:12px;z-index:1}
.recharge-kicker{font-size:11px;line-height:16px;color:var(--gold);opacity:.8;font-weight:500;margin-bottom:4px}
.recharge-hero-copy h2{font-family:"Recharge Serif","Noto Serif SC","STKaiti","KaiTi",serif;color:var(--gold);font-weight:900;font-size:29px;line-height:39px}
.recharge-hero-art{position:absolute;right:-2px;top:-8px;width:190px;height:200px;object-fit:contain;max-width:none}
.recharge-balance{position:absolute;z-index:2;left:20px;top:130px;display:flex;align-items:center;gap:7px;min-width:188px;max-width:calc(100% - 40px);height:29px;padding:4px 6px;background:var(--recharge-deep);border:1px solid var(--brass);border-radius:20px;white-space:nowrap}
.recharge-balance span{font-size:11px;font-weight:500;line-height:16px}
.recharge-balance strong{font-size:14px;line-height:20px;color:var(--gold);font-variant-numeric:tabular-nums}
.recharge-sparkle{position:absolute;pointer-events:none}
.recharge-sparkle.sparkle-one{top:36px;right:182px;width:9px;height:9px}
.recharge-sparkle.sparkle-two{top:134px;right:21px;width:7px;height:7px}
.recharge-desktop-copy{display:none}
.recharge-main{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0}
.recharge-catalog{flex:1;min-height:0;padding:12px 16px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--brass) transparent}
.recharge-section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;height:28px;margin-bottom:12px;color:var(--gold)}
.recharge-section-title h2{font-size:14px;line-height:20px;font-weight:700}
.recharge-section-title>span{font-size:11px;line-height:16px;font-weight:500;white-space:nowrap}
.recharge-packs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.recharge-pack{width:100%;height:122px;min-width:0;padding:8px 10px 7px;text-align:left;border:1px solid var(--brass);border-radius:10px;background:linear-gradient(#fff4d9,#efdfb9);color:var(--ink);display:flex;flex-direction:column;gap:3px;font-weight:400;position:relative}
.recharge-pack.selected{background:linear-gradient(#fff8dc,#f5d998);border:2px solid #ce4730;padding:7px 9px 6px}
.recharge-bonus{font-size:11px;line-height:16px;white-space:nowrap;color:var(--recharge-muted);font-weight:500}
.recharge-pack.selected .recharge-bonus{color:var(--red)}
.recharge-quantity{display:flex;align-items:center;gap:2px;height:54px;flex:none;min-width:0}
.recharge-coins{width:61px;height:48.1579px;max-width:none;flex:none}
.recharge-amount{display:flex;flex-direction:column;min-width:0;line-height:1}
.recharge-amount strong{font-size:27px;line-height:34px;font-weight:900;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-.6px}
.recharge-amount small{font-size:11px;line-height:16px;font-weight:500;color:var(--recharge-muted)}
.recharge-card-price{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #c0913548;height:29px;flex:none;gap:6px}
.recharge-card-price b{font-size:14px;line-height:20px;font-weight:700}
.recharge-check{width:19px;height:19px;border:1px solid var(--brass);border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;font-size:12px;line-height:16px}
.recharge-pack.selected .recharge-check{background:var(--red);border-color:var(--red);color:var(--gold)}
.recharge-use{text-align:center;font-size:11px;line-height:18px;color:var(--gold);margin-top:12px}
.recharge-footer{flex:none;padding:10px 16px calc(4px + env(safe-area-inset-bottom));background:var(--recharge-deep);box-shadow:0 -5px 12px #032e363d}
.recharge-summary{font-size:13px;line-height:20px;margin-bottom:7px}
.recharge-summary p{line-height:20px}
.recharge-summary b{color:var(--gold);font-size:14px}
.recharge-summary p>span{font-size:11px;font-weight:500}
.recharge-selected-label{display:none}
.recharge-page .recharge-pay{display:block;width:100%;height:48px;min-height:48px;padding:0 8px;border:1.5px solid var(--gold);border-radius:8px;background:linear-gradient(#ffe7a0,#d89d37);box-shadow:0 3px #392311b3,inset 0 2px 1px #fff8c9a6;color:var(--ink);font-size:17px;line-height:20px;font-weight:700;text-shadow:none;opacity:1;cursor:not-allowed}
.recharge-closed{text-align:center;color:var(--gold);font-size:11px;line-height:16px;margin-top:8px;opacity:.85}
.recharge-links{display:flex;align-items:center;justify-content:center;gap:12px;font-size:11px;line-height:16px;height:36px;color:var(--recharge-muted)}
.recharge-links .text-button{min-height:36px;padding:0 5px;font-size:11px;line-height:16px;text-decoration:none;color:var(--gold)}
@media(max-width:360px){
 .recharge-catalog{padding-left:12px;padding-right:12px}.recharge-packs{gap:10px}
 .recharge-pack{padding-left:7px;padding-right:7px}.recharge-pack.selected{padding-left:6px;padding-right:6px}
 .recharge-bonus{font-size:9px}.recharge-amount strong{font-size:23px;letter-spacing:-.8px}
 .recharge-hero-copy{left:16px}.recharge-hero-copy h2{font-size:27px}.recharge-balance{left:16px;min-width:170px}
 .recharge-hero-art{right:-27px}.recharge-halo{right:-55px}.recharge-quantity{gap:0}
}
@media(min-width:700px) and (max-width:1099px){.recharge-hero-art{right:28px}.recharge-halo{right:0}.recharge-hero-copy{left:28px}.recharge-balance{left:28px}}
@media(min-width:1100px){
 #game.recharge-mode{width:calc(100% - 80px);max-width:1032px;height:min(700px,calc(100dvh - 48px));max-height:none;border:2px solid var(--brass);border-radius:16px}
 .recharge-toolbar{padding-top:10px;min-height:64px}
 .recharge-frame{flex-direction:row}
 .recharge-hero{width:310px;height:auto;border-bottom:0}
 .recharge-hero-copy{top:26px;left:26px}
 .recharge-kicker{display:none}.recharge-desktop-copy{display:block;font-size:13px;line-height:20px;margin-top:8px}
 .recharge-hero-art{left:-4px;top:174px;width:310px;height:340px;right:auto}
 .recharge-balance{left:26px;top:auto;bottom:26px;width:258px;height:68px;padding:8px 10px;border-radius:8px;align-items:flex-start;flex-direction:column;gap:0}
 .recharge-balance strong{font-family:"Recharge Serif","Noto Serif SC","KaiTi",serif;font-size:24px;line-height:34px}
 .recharge-halo,.recharge-sparkle{display:none}
 .recharge-main{padding:24px;gap:18px;background:var(--recharge-deep)}
 .recharge-catalog{padding:0;flex:1}
 .recharge-section-title{height:34px;margin-bottom:18px}
 .recharge-section-title h2{font-family:"Recharge Serif","Noto Serif SC","KaiTi",serif;font-size:24px;line-height:34px}
 .recharge-section-title>span{display:none}
 .recharge-packs{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
 .recharge-pack{height:132px}
 .recharge-use{margin-top:16px;text-align:left}
 .recharge-footer{background:#063e4a;border:1px solid var(--brass);border-radius:10px;padding:14px 16px 0;display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;column-gap:16px;box-shadow:none}
 .recharge-summary{margin-bottom:0;padding:4px 0}
 .recharge-selected-label{display:block;color:var(--gold);font-size:14px;line-height:20px;margin-bottom:4px}
 .recharge-summary p>span{display:block}
 .recharge-closed{grid-column:1/-1;text-align:left;margin-top:10px}
 .recharge-links{grid-column:1/-1;justify-content:flex-end;height:36px}
}
