*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;min-height:100vh;font-family:"Trebuchet MS",system-ui,sans-serif;background:radial-gradient(circle at 30% 20%,#ffe066,#ff6fb5 45%,#6a4cff) fixed;color:#222}
.tpf-bar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:8px;padding:8px 10px;background:#1b1240ee;color:#fff;border-bottom:3px solid #ffd23f;font-weight:bold;font-size:14px}
.tpf-bar a{color:#fff;text-decoration:none}
.tpf-bar .home{font-size:18px;background:linear-gradient(90deg,#3ef,#ff0,#f6f);-webkit-background-clip:text;background-clip:text;color:transparent}
.tpf-bar .sp{flex:1}
.pill{background:#ffffff1f;border-radius:20px;padding:3px 9px;white-space:nowrap}
.tix{color:#ffd23f}
.xpw{width:70px;height:8px;background:#ffffff33;border-radius:5px;overflow:hidden;display:inline-block;vertical-align:middle;margin-left:4px}
.xpw i{display:block;height:100%;background:linear-gradient(90deg,#3ef,#3f9);transition:width .4s}
.tpf-bar button{background:none;border:2px solid #ffd23f;color:#fff;border-radius:10px;font-size:15px;padding:2px 7px;cursor:pointer}
.bump{animation:bump .4s}
@keyframes bump{50%{transform:scale(1.35)}}
.wrap{width:min(96vw,520px);margin:12px auto 30px}
.card{background:linear-gradient(#ff3d7f,#c2185b);border-radius:22px;padding:12px;border:4px solid #ffd23f;box-shadow:0 10px 0 #7a0e3a,0 18px 34px rgba(0,0,0,.3);color:#fff}
.card h1,.card h2{margin:4px 0 8px;text-align:center}
canvas.game{width:100%;display:block;border-radius:12px;border:4px solid #ffd23f;background:#1b1240;touch-action:none}
.big{display:block;margin:10px auto 0;padding:12px 24px;font-size:18px;border-radius:30px;border:none;background:#ffd23f;color:#7a0e3a;font-weight:bold;cursor:pointer;box-shadow:0 5px 0 #b58900}
.big:active{transform:translateY(3px);box-shadow:0 2px 0 #b58900}
.big:disabled{opacity:.5}
.msg{text-align:center;font-weight:bold;min-height:24px;margin-top:8px;font-size:16px;text-shadow:0 2px 0 #7a0e3a}
.foot{text-align:center;color:#fff;font-size:12px;margin-top:12px;opacity:.9}
.ad-slot{margin:14px auto;min-height:90px;border:2px dashed #ffffff99;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#ffffffbb;font-size:12px}
.float{position:fixed;z-index:90;pointer-events:none;font-weight:900;font-size:22px;color:#ffd23f;text-shadow:0 2px 0 #7a0e3a,0 0 8px #000;animation:fl 1.1s ease-out forwards}
@keyframes fl{to{transform:translateY(-70px) scale(1.3);opacity:0}}
.toast{position:fixed;left:50%;top:60px;transform:translateX(-50%);z-index:95;background:#1b1240;color:#fff;border:3px solid #ffd23f;border-radius:16px;padding:10px 16px;font-weight:bold;box-shadow:0 8px 20px #0006;animation:tin .3s;max-width:90vw;text-align:center}
@keyframes tin{from{transform:translate(-50%,-30px);opacity:0}}
.modal{position:fixed;inset:0;z-index:99;background:#000a;display:flex;align-items:center;justify-content:center}
.modal>div{background:linear-gradient(#ffe066,#ffb347);border:4px solid #fff;border-radius:22px;padding:18px;text-align:center;width:min(90vw,360px);color:#7a0e3a;animation:pop .4s}
@keyframes pop{from{transform:scale(.4)}60%{transform:scale(1.08)}}
#confetti{position:fixed;inset:0;pointer-events:none;z-index:98}
#confetti{background:none!important;border:0!important;border-radius:0!important;width:100vw!important;height:100vh!important;display:block}
@media (max-width:460px){.tpf-bar{gap:4px;font-size:12px;padding:6px}.tpf-bar .home{font-size:15px}.pill{padding:3px 6px}.xpw{width:36px}}
@media (max-width:360px){#tpfA{display:none}}
html,body{overflow-x:hidden}