:root{
  --bg1:#fff4d6; --bg2:#ffd9a0; --card:#fffdf7; --ink:#3a2c1a; --sub:#a08a6b;
  --gold:#f7b733; --gold2:#fc7b1e; --green:#37c26b; --green2:#1ea556;
  --line:#e9dcc2; --shadow:0 6px 0 rgba(0,0,0,.10), 0 10px 22px rgba(120,80,10,.16);
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0; height:100%}
body{font-family:"Fredoka","PingFang SC","Microsoft YaHei",system-ui,sans-serif; color:var(--ink);
  background:radial-gradient(120% 100% at 50% 0%, var(--bg1), var(--bg2)) fixed; user-select:none; overflow-x:hidden}
.wrap{max-width:640px; margin:0 auto; padding:14px 14px 40px}

.top{background:linear-gradient(180deg,#fffdf7,#fff3df); border:3px solid #fff; border-radius:20px; box-shadow:var(--shadow); padding:14px 16px; margin-bottom:12px}
.top .tier{display:flex; align-items:center; gap:8px; margin-bottom:8px}
.top .tier .badge{display:flex; align-items:center; gap:6px; background:linear-gradient(180deg,var(--gold),var(--gold2)); color:#fff; padding:6px 12px; border-radius:12px; font-weight:700; box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.cur{font-size:30px; font-weight:800; color:var(--green2); text-align:center; margin:2px 0}
.rate{text-align:center; font-size:13px; color:var(--sub); font-weight:600; margin-bottom:8px}
.ascend{display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:16px; border:2px solid #ffe1b8; background:linear-gradient(180deg,#fff7e8,#ffead0)}
.ascend.ready{animation:glow 1.4s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 4px rgba(247,183,51,.4),0 8px 22px rgba(247,150,30,.5)}}
.ascend .ic{font-size:30px}
.ascend .t{flex:1; min-width:0}
.ascend .t .l1{font-weight:700; font-size:14px}
.ascend .t .l2{font-size:11px; color:var(--sub); font-weight:600}
.ascend button{border:none; cursor:pointer; font-family:inherit; font-weight:800; color:#fff; background:linear-gradient(180deg,var(--gold),var(--gold2)); padding:10px 16px; border-radius:12px; box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.ascend button:disabled{background:#dcd0b6; color:#a99a78; box-shadow:none; cursor:not-allowed}

.clicker{text-align:center; margin:12px 0}
.bigbtn{display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; width:160px; height:160px; border-radius:50%;
  background:#fff7e6; border:4px solid #ffe2ad; box-shadow:0 6px 0 #f0cf91, inset 0 4px 10px rgba(255,255,255,.6); cursor:pointer; transition:transform .06s}
.bigbtn:active{transform:scale(.93)}
.bigbtn .e{font-size:62px; line-height:1; pointer-events:none}
.bigbtn .l{font-size:13px; font-weight:700; color:var(--sub); pointer-events:none}
.clicker .per{font-size:12px; color:var(--sub); font-weight:600; margin-top:8px}
.snd{margin-top:6px}
.snd button{background:#f3e8cf; border:none; color:#8a734f; font-family:inherit; font-weight:700; padding:5px 10px; border-radius:9px; cursor:pointer; font-size:12px}

.qty{display:flex; gap:6px; margin:0 0 10px}
.qty button{flex:1; padding:7px; border-radius:10px; border:none; font-weight:700; font-family:inherit; background:#f3e8cf; color:#a08a6b; cursor:pointer}
.qty button.on{background:#3a2c1a; color:#fff}
.tabs{display:flex; gap:8px; margin-bottom:10px}
.tab{flex:1; text-align:center; padding:9px; border-radius:12px; font-weight:700; cursor:pointer; background:#f3e8cf; color:#a08a6b}
.tab.on{background:linear-gradient(180deg,var(--gold),var(--gold2)); color:#fff; box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}

.panel{background:var(--card); border:3px solid #fff; border-radius:20px; box-shadow:var(--shadow); padding:12px}
.gen{display:flex; align-items:center; gap:12px; padding:10px; border-radius:14px; margin-bottom:9px; background:#fffaef; border:2px solid var(--line)}
.gen .e{font-size:40px; width:50px; text-align:center; flex:0 0 auto}
.gen .e .gi{width:48px; height:48px; object-fit:contain; vertical-align:middle}
.bigbtn .ci{width:112px; height:112px; object-fit:contain; pointer-events:none}
.gen .info{flex:1; min-width:0}
.gen .nm{font-weight:700; font-size:15px}
.gen .nm .own{display:inline-block; min-width:26px; padding:2px 7px; border-radius:8px; background:#ffe9b8; color:#9a6b12; font-weight:700; font-size:12px; margin-left:6px}
.gen .meta{font-size:11px; color:var(--sub); font-weight:600}
.gen .buy{flex:0 0 auto; border:none; cursor:pointer; padding:9px 12px; border-radius:12px; min-width:92px; background:linear-gradient(180deg,var(--green),var(--green2)); color:#fff; font-weight:700; font-family:inherit; box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.gen .buy:disabled{background:#d9cdb2; box-shadow:inset 0 -3px 0 rgba(0,0,0,.08); cursor:not-allowed; opacity:.85}
.gen .buy .c{display:block; font-size:11px; opacity:.95}
.gen.locked{filter:grayscale(.85) opacity(.55)}
.upg{display:flex; align-items:center; gap:10px; padding:10px; border-radius:14px; margin-bottom:9px; background:#fff5fb; border:2px solid #f3dced}
.upg .e{font-size:28px}
.upg .info{flex:1}
.upg .nm{font-weight:700}
.upg .desc{font-size:12px; color:var(--sub); font-weight:600}
.muted{color:var(--sub); text-align:center; font-size:13px; padding:18px; font-weight:600}

.float{position:fixed; pointer-events:none; font-weight:800; z-index:50; animation:fu .9s ease-out forwards; text-shadow:0 2px 0 rgba(0,0,0,.18)}
@keyframes fu{to{transform:translateY(-60px); opacity:0}}
#flash{position:fixed; inset:0; opacity:0; pointer-events:none; z-index:90; background:var(--gold)}
#flash.go{animation:fl .6s ease-out}
@keyframes fl{0%{opacity:.4}100%{opacity:0}}
.modal{position:fixed; inset:0; background:rgba(40,25,5,.55); display:none; align-items:center; justify-content:center; z-index:100; padding:20px}
.modal.show{display:flex}
.sheet{background:var(--card); border-radius:22px; border:4px solid #fff; box-shadow:var(--shadow); padding:24px; max-width:330px; text-align:center; animation:pop .25s}
@keyframes pop{from{transform:scale(.8); opacity:0}}
.sheet .xl{font-size:60px}
.sheet h2{margin:6px 0}
.sheet p{color:var(--sub); font-weight:600; font-size:13px}
.sheet button{margin-top:12px; border:none; padding:11px 26px; border-radius:13px; font-family:inherit; font-weight:700; background:linear-gradient(180deg,var(--gold),var(--gold2)); color:#fff; font-size:15px; cursor:pointer; box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.foot{text-align:center; margin-top:14px}
.foot a{color:var(--sub); font-size:12px; font-weight:700; text-decoration:none}
.foot button{background:#fffdf7; border:2px solid var(--line); color:var(--sub); font-family:inherit; font-weight:700; padding:7px 12px; border-radius:11px; cursor:pointer; font-size:12px; margin-left:8px}
