* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: system-ui, sans-serif;
  color: #e8e8ff;
  background: linear-gradient(160deg, #0a1a4f, #2a0f5c);
  background-attachment: fixed;
}
main { max-width: 1100px; margin: 0 auto; padding: 16px; }
header { text-align: center; }
h1 { margin: 8px 0; text-shadow: 0 0 14px #8a7bff; }
.stats { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.stats div { background: rgba(255,255,255,.08); padding: 10px 18px; border-radius: 12px; min-width: 150px; }
.stats span { display: block; font-size: .8rem; opacity: .7; }
.stats strong { font-size: 1.5rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 16px; margin-top: 16px; }
.panel { background: rgba(10,10,40,.55); border: 1px solid rgba(160,140,255,.25); border-radius: 16px; padding: 16px; }
.center { text-align: center; }
.hint { margin: 6px 0; opacity: .8; font-size: .9rem; }

#mine {
  width: 180px; height: 180px; border-radius: 50%; border: 0; cursor: pointer;
  font-size: 5rem; background: radial-gradient(circle, #5b4bd6, #251a6b);
  box-shadow: 0 0 30px #7b6bff, inset 0 0 20px rgba(255,255,255,.2);
  transition: transform .08s;
  user-select: none;
}
#mine:active { transform: scale(.93); }

.glow, .upgrade, .reset {
  border: 0; color: #fff; cursor: pointer; border-radius: 12px;
  background: linear-gradient(135deg, #6a5cff, #b04bff);
  box-shadow: 0 0 12px #8a7bff, 0 0 26px rgba(176,75,255,.5);
  transition: transform .1s, box-shadow .2s, opacity .2s;
}
.glow { padding: 12px 26px; font-size: 1.1rem; text-decoration: none; display: inline-block; }
.glow:hover, .upgrade:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 0 20px #b9adff, 0 0 40px rgba(176,75,255,.8); }

.upgrade { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 14px; margin-bottom: 10px; text-align: left; }
.upgrade:disabled { opacity: .4; box-shadow: none; cursor: not-allowed; }
.upgrade .icon { font-size: 2rem; }
.upgrade .info { flex: 1; }
.upgrade small { display: block; opacity: .85; }
.upgrade .count { font-size: 1.3rem; font-weight: bold; }

.reset { padding: 12px 24px; font-size: 1.05rem; background: linear-gradient(135deg, #ffb347, #ff5e8a); box-shadow: none; }
.reset:disabled { opacity: .35; cursor: not-allowed; }
.reset.ready { animation: pulse 1.2s infinite; }
@keyframes pulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 12px #ffb347, 0 0 24px rgba(255,94,138,.6); }
  50% { transform: scale(1.08); box-shadow: 0 0 26px #ffd27a, 0 0 54px rgba(255,94,138,.95); }
}
.prestige { margin-top: 16px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.15); }
#bonuses { list-style: none; padding: 0; font-size: .85rem; text-align: left; }
#bonuses li, #achievements li { padding: 4px 0; opacity: .45; }
#bonuses li.on, #achievements li.on { opacity: 1; color: #ffd27a; }
#achievements { list-style: none; padding: 0; margin: 0; }
#achievements li::before { content: "🔒 "; }
#achievements li.on::before { content: "🏆 "; }

.floater { position: fixed; pointer-events: none; z-index: 20; font-weight: bold; color: #fff; text-shadow: 0 0 8px #8a7bff; animation: rise 1s ease-out forwards; }
.floater.book { font-size: 1.6rem; animation-duration: 1.3s; }
@keyframes rise { to { transform: translateY(-140px); opacity: 0; } }

#ad { margin: 20px 0; padding: 26px; text-align: center; border: 1px dashed rgba(255,255,255,.3); border-radius: 12px; opacity: .6; }
footer { text-align: center; padding: 12px 0 30px; }
.donate { background: linear-gradient(135deg, #29abe0, #6a5cff); }

#toast { position: fixed; top: 16px; right: 16px; z-index: 40; display: flex; flex-direction: column; gap: 8px; }
.toast-item { background: #1d1450; border: 1px solid #ffd27a; border-radius: 12px; padding: 10px 16px; box-shadow: 0 0 18px #ffd27a; animation: slide .3s ease-out; }
@keyframes slide { from { transform: translateX(120%); } }

#splash { position: fixed; inset: 0; z-index: 100; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background: linear-gradient(160deg, #050d2e, #1a0838); transition: opacity .6s; }
#splash h1 { font-size: 3rem; }
#splash.hide { opacity: 0; pointer-events: none; }

#mine img { width: 110px; height: 110px; pointer-events: none; filter: drop-shadow(0 0 12px #ffd166); }
.logo { width: 34px; height: 34px; vertical-align: middle; }
.upgrade .icon { width: 44px; height: 44px; }
.floater.book img { display: block; }
.golden { position: fixed; z-index: 30; width: 64px; cursor: pointer; animation: bob 1.4s ease-in-out infinite; filter: drop-shadow(0 0 14px #ffd166) drop-shadow(0 0 28px #ff9f1c); }
@keyframes bob { 50% { transform: translateY(-14px) scale(1.12); } }
.tools { margin-top: 14px; display: flex; gap: 16px; justify-content: center; }
.link { background: none; border: 0; color: #b9adff; cursor: pointer; text-decoration: underline; }