:root{
  --bg1:#070a1b;
  --cyan:#8ff;
  --mag:#c6f;
  --panel:#0b1028cc;
  --stroke:#2a345f;
  --danger:#ff4d6d;
}
*{box-sizing:border-box}
body{
  margin:0; min-height:100vh;
  color:var(--cyan);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  background: radial-gradient(circle at top, #0a0f2c, #000 55%);
  display:flex; flex-direction:column;
}
header{ padding:22px 12px 6px; text-align:center; }
h1{ margin:0; letter-spacing:1px; color:var(--mag); }
.subtitle{ margin:6px 0 0; opacity:.8; }
.wrap{
  width:min(1100px, 96vw);
  margin: 10px auto 22px;
  display:grid; grid-template-columns: 1fr;
  gap:14px; padding: 0 8px;
}
@media (min-width: 900px){
  .wrap{ grid-template-columns: 1.05fr 1fr; }
  .stats{ grid-column:1 / -1; }
}
.panel{
  border:1px solid var(--stroke);
  background: var(--panel);
  border-radius:14px;
  padding:14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.stats{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:10px;
}
@media (min-width: 700px){
  .stats{ grid-template-columns: repeat(5, 1fr); }
}
.stat, .pstat{
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:10px;
  background: rgba(0,0,0,.22);
}
.label{ font-size:12px; opacity:.85; }
.value{ font-size:22px; margin-top:4px; }
.clicker{
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:10px;
}
#atomBtn{
  width:170px; height:170px;
  border-radius:50%;
  font-size:76px;
  background:#0a0a14;
  border:3px solid var(--cyan);
  color:var(--cyan);
  cursor:pointer;
  transition: transform .08s ease, box-shadow .08s ease;
  box-shadow: 0 0 22px rgba(140,255,255,.18);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  user-select:none;
}
#atomBtn:hover{ transform: scale(1.05); }
#atomBtn:active{ transform: scale(.98); }
.hint{ opacity:.8; font-size:12px; }
.row{ display:flex; gap:10px; margin-top:6px; width:100%; justify-content:center; }
button{
  border:1px solid rgba(255,255,255,.16);
  background:#0c132e;
  color:var(--cyan);
  border-radius:10px;
  padding:10px 12px;
  cursor:pointer;
}
button:hover{ filter:brightness(1.07); }
button:disabled{ opacity:.45; cursor:not-allowed; }
.small{ padding:8px 10px; font-size:12px; }
.danger{ border-color: rgba(255,77,109,.5); color: #ffd2da; }
.shop-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
h2{ margin:0 0 10px; color: #e9f; }
.tiny{ font-size:12px; opacity:.75; }
#shop{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.shop-item{
  display:grid;
  grid-template-columns: 1.3fr 1fr auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
}
.shop-item b{ color: #cff; }
.shop-item .meta{ font-size:12px; opacity:.85; line-height:1.3; }
.shop-item .cost{ text-align:right; font-size:12px; opacity:.85; }
.shop-item .buy{
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(198,102,255,.35);
  background: rgba(198,102,255,.12);
  color: #f0d6ff;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.buy-mult{ display:flex; gap:8px; margin-bottom:8px; }
.buy-mult button{ flex:1; padding:6px 0; border-radius:8px; }
.prestige .desc{ margin: 0 0 10px; opacity:.9; }
.prestige-box{ display:flex; flex-direction:column; gap:10px; }
.prestigeBtn{
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(140,255,255,.35);
  background: rgba(140,255,255,.10);
  font-weight:700;
}
footer{ margin-top:auto; padding: 10px 12px 16px; text-align:center; opacity:.8; }

/* Mobile layout */
@media (max-width: 520px){
  .wrap{ width: 96vw; }
  #atomBtn{ width: 180px; height: 180px; font-size: 80px; }
  .shop-item{ grid-template-columns: 1fr; gap: 8px; }
  .shop-item .cost{ text-align:left; }
  .shop-item .buy{ width:100%; }
}

/* Random Event: Temporal (λ) */
#eventLambda{
  position: fixed;
  z-index: 9998;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  border: 2px solid rgba(198,102,255,.55);
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  color: #f0d6ff;
  box-shadow: 0 0 28px rgba(198,102,255,.22);
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  animation: lambdaPulse 1.2s ease-in-out infinite;
}
@keyframes lambdaPulse{
  0%{ transform: scale(1); opacity: .92; }
  50%{ transform: scale(1.08); opacity: 1; }
  100%{ transform: scale(1); opacity: .92; }
}
