
*{box-sizing:border-box;font-family:Arial, Helvetica, sans-serif}
html,body{height:100%;margin:0;background:linear-gradient(#eaf6ff,#dfffe6)}
canvas{display:block;margin:0 auto;background:linear-gradient(#ffeab3,#ffd7a6);box-shadow:0 8px 30px rgba(0,0,0,0.2);border-radius:10px}
#ui{position:fixed;left:0;right:0;top:0;pointer-events:none}
#topbar{display:flex;gap:12px;align-items:center;padding:10px;justify-content:flex-end;pointer-events:auto}
#topbar > div{background:rgba(255,255,255,0.85);padding:6px 10px;border-radius:6px;box-shadow:0 2px 6px rgba(0,0,0,0.08)}
#menuBtn{pointer-events:auto;padding:6px 10px;border-radius:6px;border:none;background:#333;color:#fff}
#menu{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:850px;max-width:96%;background:rgba(255,255,255,0.98);padding:18px;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,0.25);pointer-events:auto}
.hidden{display:none}
.menu-row{display:flex;gap:10px}
#upgradesList{height:260px;overflow:auto;border:1px solid #eee;padding:8px;background:#fafafa;border-radius:8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.upgrade{background:#fff;border-radius:8px;padding:8px;box-shadow:0 2px 8px rgba(0,0,0,0.06);display:flex;flex-direction:column;gap:6px}
.upgrade button{margin-top:auto;padding:6px;border-radius:6px;border:none;background:#0a84ff;color:white}
#cosmeticsList{display:flex;gap:8px;flex-wrap:wrap}
.cosmetic{padding:6px;border-radius:8px;border:1px dashed #ddd;cursor:pointer}
#game{width:1000px;height:600px}
