*{margin:0;padding:0;box-sizing:border-box;}
html,body{width:100%;height:100%;overflow:hidden;background:#06030e;}
#wrap{position:relative;width:100%;height:100vh;display:flex;align-items:center;justify-content:center;background:#06030e;overflow:hidden;}
#gc{display:block;max-width:100%;max-height:100%;}
#ui{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;}
#hud{position:absolute;top:0;left:0;right:0;padding:0;display:none;align-items:center;gap:0;background:linear-gradient(180deg,rgba(8,3,20,0.97),rgba(6,2,16,0.88));border-bottom:1px solid rgba(90,40,150,0.55);box-shadow:0 2px 14px rgba(60,0,120,0.35);}
.bw{display:flex;flex-direction:column;gap:1px;}
.bl{font-family:Georgia,serif;color:#8a6ab8;letter-spacing:1px;white-space:nowrap;text-shadow:0 0 8px rgba(150,80,220,0.4);}
.bar{border-radius:4px;background:#08031a;border:1px solid #2e1258;overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,0.7);}
.bf{height:100%;border-radius:4px;transition:width 0.12s;}
#hf{background:linear-gradient(90deg,#6a0e0e,#c02828,#e03838);width:100%;box-shadow:0 0 6px rgba(200,30,30,0.5);}
#xf{background:linear-gradient(90deg,#281468,#6040b8,#8858d0);width:0%;box-shadow:0 0 6px rgba(120,60,200,0.5);}
#wt{font-family:Georgia,serif;color:#b878d8;margin-left:auto;white-space:nowrap;text-shadow:0 0 10px rgba(160,80,220,0.5);}
#spells{display:flex;align-items:center;}
.si{border-radius:3px;border:1px solid #2e1450;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:all;position:relative;flex-shrink:0;}
.si.active{border-color:#e0d0ff!important;box-shadow:0 0 6px rgba(220,200,255,0.6)!important;background:#200848!important;}
.si.t1fused{border-color:#c07020;background:#1a0c04;}
.si.t2fused{border-color:#d040a0;background:#1a0414;}
.si.active.t1fused{border-color:#ffe080!important;box-shadow:0 0 7px rgba(255,220,100,0.7)!important;background:#2a1808!important;}
.si.active.t2fused{border-color:#ffb0e8!important;box-shadow:0 0 7px rgba(255,160,220,0.7)!important;background:#28081a!important;}
.si .skey{position:absolute;bottom:1px;right:1px;color:#9080b8;font-family:Georgia,serif;}
#pausebtn{font-family:Georgia,serif;color:#8060a8;background:transparent;border:1px solid #2a1450;border-radius:3px;cursor:pointer;pointer-events:all;letter-spacing:1px;white-space:nowrap;flex-shrink:0;}
#pausebtn:hover{background:#120828;border-color:#5a3890;}
#msg{position:absolute;left:50%;transform:translateX(-50%);font-family:Georgia,serif;color:#e8d4ff;text-align:center;pointer-events:none;opacity:0;transition:opacity 0.5s;text-shadow:0 0 12px #9c6cbf;white-space:nowrap;z-index:1;}
#wavecountdown{position:absolute;left:50%;transform:translateX(-50%);font-family:Georgia,serif;color:#c0a0e8;text-shadow:0 0 24px #8040c0;pointer-events:none;opacity:0;transition:opacity 0.25s;z-index:1;}
#ctrl{position:absolute;bottom:1%;left:50%;transform:translateX(-50%);font-family:Georgia,serif;color:#302050;letter-spacing:1px;pointer-events:none;white-space:nowrap;}
#petlvl-fx{position:absolute;left:50%;transform:translateX(-50%);font-family:Georgia,serif;color:#e8c840;text-shadow:0 0 12px #c09020;pointer-events:none;opacity:0;transition:opacity 0.4s;text-align:center;white-space:nowrap;z-index:1;}
#overlay,#petsel,#levelup,#pausemenu,#gameover,#tutorial,#lastrun-menu{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;}
#tutorial{background:rgba(6,3,14,0.97);display:none;flex-direction:column;align-items:center;justify-content:flex-start;overflow:hidden;}
#tutorial h2{font-family:Georgia,serif;color:#b880f8;letter-spacing:4px;}
#tut-scroll{overflow-y:auto;width:100%;flex:1;min-height:0;}
#tut-scroll::-webkit-scrollbar{width:4px;}
#tut-scroll::-webkit-scrollbar-track{background:#08031a;}
#tut-scroll::-webkit-scrollbar-thumb{background:#3a1860;border-radius:2px;}
#tut-content{font-family:Georgia,serif;color:#c0a8e8;}
.tsec{color:#5a4888;letter-spacing:1px;border-bottom:1px solid rgba(60,20,100,0.3);}
.trow{display:flex;gap:8px;}
.tk{color:#7060a0;flex-shrink:0;}
.tv{color:#c0a8e8;}
.tdesc{color:#7060a0;line-height:1.5;}
.tspell{display:flex;gap:5px;line-height:1.5;}
.tsl{text-align:center;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;}
.tsn{color:#e0ccff;flex-shrink:0;}
.tsd{color:#6a5898;flex:1;}
.t1s .tsn{color:#c08040;}
.t2s .tsn{color:#d040a0;}
#overlay{background:radial-gradient(ellipse at 50% 40%,rgba(40,10,80,0.7) 0%,rgba(6,3,14,0.98) 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2%;}
#overlay h1{font-family:Georgia,serif;color:#c890ff;letter-spacing:5px;text-shadow:0 0 28px #8030d0,0 0 6px #b060f0;}
.obtn{font-family:Georgia,serif;color:#ece0ff;background:linear-gradient(180deg,#160a2e,#0e0620);border:1px solid #5530a8;border-radius:4px;cursor:pointer;letter-spacing:2px;pointer-events:all;white-space:nowrap;box-shadow:0 2px 8px rgba(60,0,140,0.3),inset 0 1px 0 rgba(180,120,255,0.1);}
.obtn:hover{background:linear-gradient(180deg,#1e1040,#160830);border-color:#8858d8;box-shadow:0 3px 14px rgba(100,30,200,0.45),inset 0 1px 0 rgba(200,150,255,0.15);}
.obtn.danger-warn{color:#ff6060;border-color:#802020;}
.obtn.danger-warn:hover{background:#200808;border-color:#cc3030;}
#petsel{background:rgba(6,3,14,0.97);display:none;flex-direction:column;align-items:center;justify-content:center;gap:2%;}
#petsel h2{font-family:Georgia,serif;color:#b880f8;letter-spacing:3px;}
#petgrid{display:grid;grid-template-columns:1fr 1fr;pointer-events:all;}
.pc{font-family:Georgia,serif;color:#e0ccff;background:linear-gradient(180deg,#120a24,#0c0618);border:1px solid #361868;border-radius:4px;cursor:pointer;pointer-events:all;text-align:left;line-height:1.5;box-shadow:0 2px 8px rgba(40,0,100,0.2),inset 0 1px 0 rgba(160,100,255,0.05);transition:background 0.12s,border-color 0.12s,box-shadow 0.12s;}
.pc:hover{border-color:#7040cc;background:linear-gradient(180deg,#1a1038,#120c28);box-shadow:0 3px 14px rgba(80,20,180,0.35),inset 0 1px 0 rgba(180,130,255,0.1);}
.pc.locked{opacity:0.45;cursor:default;border-color:#1a0e30;filter:grayscale(0.6);}
.pc.locked:hover{background:#0e0820;border-color:#1a0e30;}
.pc strong{display:block;}
.pc .lock-label{color:#6a3888;display:block;}
#levelup{background:radial-gradient(ellipse at 50% 35%,rgba(50,25,10,0.7) 0%,rgba(6,3,14,0.97) 65%);display:none;flex-direction:column;align-items:center;justify-content:center;gap:2%;}
#levelup h2{font-family:Georgia,serif;color:#e8c030;letter-spacing:3px;text-shadow:0 0 22px #c08020,0 0 6px #e0a030;}
#levelup .lsub{font-family:Georgia,serif;color:#4a3898;letter-spacing:1px;}
#choices{display:flex;flex-direction:column;align-items:center;}
.cb{font-family:Georgia,serif;color:#e8d4ff;background:linear-gradient(180deg,#120a28,#0c0618);border:1px solid #3a1870;border-radius:4px;cursor:pointer;pointer-events:all;text-align:left;line-height:1.6;box-shadow:0 2px 8px rgba(40,0,100,0.25),inset 0 1px 0 rgba(160,100,255,0.06);transition:background 0.12s,border-color 0.12s,box-shadow 0.12s;}
.cb:hover{background:linear-gradient(180deg,#1c1040,#140830);border-color:#7040d0;box-shadow:0 3px 14px rgba(80,20,180,0.4),inset 0 1px 0 rgba(180,130,255,0.1);}
.cb.t1{border-color:#b06820;background:linear-gradient(180deg,#1a0e06,#100804);}
.cb.t1:hover{background:linear-gradient(180deg,#241206,#180c04);border-color:#e09040;box-shadow:0 3px 12px rgba(180,90,0,0.3);}
.cb.t2{border:1.5px solid #cc38a0;background:linear-gradient(180deg,#1c0614,#12040c);}
.cb.t2:hover{background:linear-gradient(180deg,#28081c,#180610);border-color:#ff58c0;box-shadow:0 3px 14px rgba(200,40,140,0.35);}
.cb .ctag{letter-spacing:1px;display:block;}
.cb strong{display:block;}
.cb .celems{color:#6a4030;}
.cb.t2 .celems{color:#8a3060;}
.panel-wrap{display:flex;align-items:flex-start;flex-wrap:wrap;justify-content:center;overflow:visible;}
.stat-board{font-family:Georgia,serif;color:#a890c8;background:linear-gradient(180deg,#100a22,#0c061a);border:1px solid #341860;border-radius:4px;box-shadow:0 2px 12px rgba(40,0,100,0.3),inset 0 1px 0 rgba(120,60,200,0.08);}
.stat-board .gr{display:flex;justify-content:space-between;gap:16px;padding:2px 0;}
.stat-board .gk{color:#7060a0;}
.stat-board .gv{color:#e8d8ff;}
.stat-board .gsec{color:#6a50a0;letter-spacing:1px;border-bottom:1px solid rgba(70,25,120,0.4);padding-bottom:3px;text-shadow:0 0 8px rgba(140,80,220,0.3);}
.upg-panel{font-family:Georgia,serif;background:linear-gradient(180deg,#100a22,#0c061a);border:1px solid #341860;border-radius:4px;overflow-y:auto;overflow-x:hidden;position:relative;scrollbar-width:thin;scrollbar-color:#3a1860 #08031a;box-shadow:0 2px 12px rgba(40,0,100,0.3);}
.upg-panel::-webkit-scrollbar{width:4px;}
.upg-panel::-webkit-scrollbar-track{background:#08031a;}
.upg-panel::-webkit-scrollbar-thumb{background:#3a1860;border-radius:2px;}
.upg-panel::-webkit-scrollbar-thumb:hover{background:#5a28a0;}
.upg-panel .gsec{color:#5a4888;letter-spacing:1px;border-bottom:1px solid rgba(60,20,100,0.3);padding-bottom:3px;}
.upg-item{font-family:Georgia,serif;color:#c0a8e8;border-radius:3px;cursor:pointer;border:1px solid transparent;line-height:1.4;position:relative;}
.upg-item:hover{background:#160c30;border-color:#3a1a60;}
.upg-item .upg-name{color:#e0ccff;}
.upg-item .upg-cat{letter-spacing:1px;margin-right:4px;}
.upg-desc{font-family:Georgia,serif;font-size:0.82em;color:#9a80b8;font-style:italic;line-height:1.4;max-height:0;overflow:hidden;opacity:0;transform:translateY(-4px);transition:max-height 0.22s ease,opacity 0.18s ease,transform 0.18s cubic-bezier(0.22,1,0.36,1),padding-top 0.15s ease;padding-top:0;padding-left:2px;}
.upg-item:hover .upg-desc{max-height:60px;opacity:1;transform:translateY(0);padding-top:2px;}
.upg-tip{display:none;}
#pausemenu{background:radial-gradient(ellipse at 50% 40%,rgba(35,12,70,0.65) 0%,rgba(6,3,14,0.96) 70%);display:none;flex-direction:column;align-items:center;justify-content:center;gap:2%;overflow:visible;padding:2% 0;}
#pausemenu h2{font-family:Georgia,serif;color:#c088ff;letter-spacing:4px;text-shadow:0 0 22px #7030c0,0 0 6px #a060e8;}
#gameover{background:radial-gradient(ellipse at 50% 40%,rgba(50,8,8,0.65) 0%,rgba(6,3,14,0.98) 70%);display:none;flex-direction:column;align-items:center;justify-content:center;gap:2%;overflow:visible;padding:2% 0;}
#gameover h2{font-family:Georgia,serif;color:#d03030;letter-spacing:4px;text-shadow:0 0 22px #a01010,0 0 6px #c02020;}
#lastrun-menu{background:radial-gradient(ellipse at 50% 40%,rgba(35,12,70,0.65) 0%,rgba(6,3,14,0.97) 70%);display:none;flex-direction:column;align-items:center;justify-content:center;gap:2%;overflow:visible;padding:2% 0;}
#lastrun-menu h2{font-family:Georgia,serif;color:#c088ff;letter-spacing:4px;text-shadow:0 0 22px #7030c0,0 0 6px #a060e8;}
*{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 16 16'%3E%3Cpolygon points='8,1 9.2,6.2 14.5,8 9.2,9.8 8,15 6.8,9.8 1.5,8 6.8,6.2' fill='%23b880f8'/%3E%3Ccircle cx='8' cy='8' r='1.6' fill='%23eed8ff'/%3E%3C/svg%3E") 12 12,auto!important;}
#vjoy{display:none;position:absolute;pointer-events:all;z-index:5;touch-action:none;}
#vjoy-ring{border-radius:50%;background:rgba(60,20,100,0.2);border:2px solid rgba(130,70,200,0.35);position:relative;box-sizing:border-box;}
#vjoy-thumb{border-radius:50%;background:rgba(150,90,230,0.5);border:1px solid rgba(200,150,255,0.6);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;}
#mbspells{display:none;position:absolute;pointer-events:all;z-index:5;flex-wrap:wrap;justify-content:flex-end;}
.msi{border-radius:3px;border:1px solid #2e1450;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:all;position:relative;flex-shrink:0;background:#0c0618;}
.msi.active{border-color:#e0d0ff!important;box-shadow:0 0 6px rgba(220,200,255,0.6)!important;background:#200848!important;}
.msi.t1fused{border-color:#c07020;background:#1a0c04;}
.msi.t2fused{border-color:#d040a0;background:#1a0414;}
.msi.active.t1fused{border-color:#ffe080!important;box-shadow:0 0 7px rgba(255,220,100,0.7)!important;background:#2a1808!important;}
.msi.active.t2fused{border-color:#ffb0e8!important;box-shadow:0 0 7px rgba(255,160,220,0.7)!important;background:#28081a!important;}

/* --- Auth & Leaderboard --- */
#auth-area{position:absolute;top:8px;right:10px;display:flex;flex-direction:column;align-items:flex-end;gap:4px;z-index:15;pointer-events:all;}
#auth-btn{font-family:Georgia,serif;font-size:11px;color:#9070c8;background:transparent;border:1px solid #2a1450;border-radius:3px;cursor:pointer;letter-spacing:1px;padding:4px 10px;}
#auth-btn:hover{background:#120828;border-color:#5a3890;}
#auth-user{font-family:Georgia,serif;font-size:10px;color:#7060a0;display:flex;align-items:center;gap:6px;}
#auth-logout{color:#5a3888;cursor:pointer;font-size:10px;border:none;background:transparent;font-family:Georgia,serif;letter-spacing:1px;}
#auth-logout:hover{color:#9060c8;}
#leaderboard-btn{position:absolute;top:8px;left:10px;font-family:Georgia,serif;font-size:10px;color:#5a4888;background:transparent;border:1px solid #1a0c38;border-radius:3px;cursor:pointer;letter-spacing:1px;padding:3px 8px;z-index:15;pointer-events:all;}
#leaderboard-btn:hover{color:#9060c8;border-color:#3a2060;}
#ingame-username{position:absolute;bottom:10px;left:10px;font-family:Georgia,serif;font-size:10px;color:#4a3878;pointer-events:none;letter-spacing:1px;display:none;}
#lb-panel{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;background:rgba(6,3,14,0.97);display:none;flex-direction:column;align-items:center;justify-content:flex-start;overflow:hidden;padding-top:2%;}
#lb-panel h2{font-family:Georgia,serif;color:#b880f8;letter-spacing:4px;}
#lb-table{font-family:Georgia,serif;color:#c0a8e8;width:90%;border-collapse:collapse;margin-top:8px;}
#lb-table th{color:#5a4888;letter-spacing:1px;border-bottom:1px solid rgba(60,20,100,0.3);text-align:left;}
#lb-table td{border-bottom:1px solid rgba(30,10,60,0.4);}
#lb-table tr.lb-me td{color:#e8d4ff;background:rgba(80,30,140,0.18);}
#lb-table td.lb-rank{color:#5a4888;}
#lb-table td.lb-score{color:#d8b030;text-align:right;}
#lb-table td.lb-wave,#lb-table td.lb-kills{color:#7060a0;text-align:right;}
.lb-avatar{border-radius:50%;vertical-align:middle;border:1px solid #2a1450;}
#submit-score-btn{display:none;}
#submit-status-go{font-family:Georgia,serif;color:#5a4888;margin-top:4px;min-height:14px;}
.pc-sel{border-color:#7040d0!important;background:#1a0c38!important;}
.pet-upg{display:flex;align-items:center;gap:8px;width:100%;background:rgba(14,8,32,0.7);border:1px solid #2a1858;border-radius:3px;padding:6px 10px;font-family:Georgia,serif;box-sizing:border-box;}
.pet-upg.owned{border-color:#3a2848;opacity:0.55;}
.pet-upg-tier{color:#6040a0;min-width:16px;font-size:10px;}
.pet-upg-info{flex:1;display:flex;flex-direction:column;gap:1px;}
.pet-upg-name{color:#d0b8ff;}
.pet-upg-desc{color:#6a5898;}
@keyframes sparkle-pulse{0%,100%{color:#c0a0ff;text-shadow:0 0 4px #8040d0;}50%{color:#ffd700;text-shadow:0 0 10px #ffc000,0 0 4px #ff8800;}}
.pet-upg-open{opacity:0.85;letter-spacing:1px;}
.pet-upg-open.has-avail{animation:sparkle-pulse 1.4s ease-in-out infinite;border-color:#8050c0!important;}
#pet-upg-overlay{display:none;position:absolute;top:0;left:0;width:100%;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:6px;}
#upg-tab-nav{display:flex;gap:6px;flex-shrink:0;}
#upg-pet-nav{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;flex-shrink:0;}
.upg-tab{background:rgba(14,8,32,0.7);border:1px solid #2a1858;border-radius:3px;color:#7060a0;font-family:Georgia,serif;letter-spacing:1px;cursor:pointer;transition:background 0.15s,color 0.15s,border-color 0.15s;}
.upg-tab:hover{background:rgba(80,30,160,0.25);border-color:#5a30a0;color:#c0a0ff;}
.upg-tab.upg-tab-active{background:rgba(60,20,120,0.45);border-color:#7040c0;color:#d0b8ff;}
.upg-subtab{font-size:11px;}
#upg-detail{display:flex;flex-direction:column;align-items:center;width:92%;max-width:440px;gap:5px;overflow-y:auto;max-height:60%;scrollbar-width:none;}
#upg-detail::-webkit-scrollbar{display:none;}
@keyframes pet-upg-in{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
#lb-status{font-family:Georgia,serif;color:#5a4888;min-height:14px;}

/* ════════════════════════════════════════════════════════════════
   VEILBORN ANIMATIONS
   ════════════════════════════════════════════════════════════════ */

/* ── Keyframes ──────────────────────────────────────────────────── */
@keyframes vb-fade-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes vb-scale-in{from{opacity:0;transform:scale(0.86)}to{opacity:1;transform:scale(1)}}
@keyframes vb-slide-down{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}
@keyframes vb-overlay-in{from{opacity:0}to{opacity:1}}
@keyframes vb-title-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes vb-glow-breathe{0%,100%{text-shadow:0 0 28px #8030d0,0 0 6px #b060f0}50%{text-shadow:0 0 55px #b050f0,0 0 20px #d080ff,0 0 5px rgba(255,255,255,0.55)}}
@keyframes vb-sub-in{from{opacity:0;letter-spacing:7px}to{opacity:1;letter-spacing:2px}}
@keyframes vb-card-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes vb-panel-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes vb-go-slam{0%{opacity:0;transform:scale(0.6) translateY(-24px)}62%{transform:scale(1.07) translateY(0)}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes vb-cd-pop{0%{opacity:0;transform:translateX(-50%) scale(0.32)}52%{transform:translateX(-50%) scale(1.32)}100%{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes vb-wt-pop{0%{opacity:0;transform:scale(0.6)}58%{transform:scale(1.15)}100%{opacity:1;transform:scale(1)}}
@keyframes vb-spell-switch{0%{filter:brightness(1);transform:scale(1)}35%{filter:brightness(3) drop-shadow(0 0 7px rgba(255,240,255,0.9));transform:scale(1.25)}100%{filter:brightness(1);transform:scale(1)}}
@keyframes vb-hp-hurt{0%,100%{filter:none}42%{filter:brightness(2.5) saturate(2) hue-rotate(-10deg)}}
@keyframes vb-xp-gain{0%,100%{box-shadow:0 0 6px rgba(120,60,200,0.5)}48%{box-shadow:0 0 26px rgba(190,110,255,1),0 0 10px rgba(230,170,255,1)}}
@keyframes vb-petcard-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes vb-btn-flash{0%,100%{box-shadow:0 2px 8px rgba(60,0,140,0.3)}50%{box-shadow:0 0 20px rgba(140,60,255,0.7),inset 0 0 8px rgba(160,80,255,0.15)}}
@keyframes ascPulse{0%,100%{border-color:#4a2880;color:#a060e0;box-shadow:0 0 4px rgba(130,50,210,0.3);}50%{border-color:#9060d0;color:#d8a0ff;box-shadow:0 0 12px rgba(160,80,255,0.75),0 0 24px rgba(100,30,200,0.45);}}
#asc-btn{z-index:5;background:transparent;border:1px solid #4a2880;color:#a060e0;font-family:Georgia,serif;letter-spacing:1px;cursor:pointer;border-radius:3px;display:none;align-items:center;gap:4px;animation:ascPulse 1.4s ease-in-out infinite;pointer-events:all;flex-shrink:0;white-space:nowrap;}

/* ── Title screen ───────────────────────────────────────────────── */
#title-txt{animation:vb-title-float 4.8s ease-in-out infinite,vb-glow-breathe 4.8s ease-in-out infinite;}
#title-sub{animation:vb-sub-in 1.4s cubic-bezier(0.22,1,0.36,1) both;}

/* ── Menu entrance (replays every time display:flex is applied) ─── */
#overlay{animation:vb-overlay-in 0.45s ease both;}
#petsel{animation:vb-fade-up 0.4s cubic-bezier(0.22,1,0.36,1) both;}
#tutorial{animation:vb-slide-down 0.35s cubic-bezier(0.22,1,0.36,1) both;}
#lastrun-menu{animation:vb-fade-up 0.38s cubic-bezier(0.22,1,0.36,1) both;}
#pausemenu{animation:vb-scale-in 0.32s cubic-bezier(0.22,1,0.36,1) both;}
#gameover{animation:vb-fade-up 0.45s cubic-bezier(0.22,1,0.36,1) both;}
#levelup{animation:vb-scale-in 0.32s cubic-bezier(0.22,1,0.36,1) both;}

/* ── Gameover title: dramatic slam ─────────────────────────────── */
#go-title{animation:vb-go-slam 0.58s cubic-bezier(0.22,1,0.36,1) both;}

/* ── Level-up card stagger ──────────────────────────────────────── */
#choices > *:nth-child(1) .cb,#choices > .cb:nth-child(1){animation:vb-card-in 0.32s 0.07s cubic-bezier(0.22,1,0.36,1) both;}
#choices > *:nth-child(2) .cb,#choices > .cb:nth-child(2){animation:vb-card-in 0.32s 0.16s cubic-bezier(0.22,1,0.36,1) both;}
#choices > *:nth-child(3) .cb,#choices > .cb:nth-child(3){animation:vb-card-in 0.32s 0.25s cubic-bezier(0.22,1,0.36,1) both;}

/* ── Stat-panel stagger (child of .panel-wrap replays with parent) */
.panel-wrap .stat-board{animation:vb-panel-in 0.34s 0.1s cubic-bezier(0.22,1,0.36,1) both;}
.panel-wrap .upg-panel:nth-child(2){animation:vb-panel-in 0.34s 0.2s cubic-bezier(0.22,1,0.36,1) both;}
.panel-wrap .upg-panel:nth-child(3){animation:vb-panel-in 0.34s 0.3s cubic-bezier(0.22,1,0.36,1) both;}

/* ── Wave counter pop ───────────────────────────────────────────── */
#wt.wt-pop{animation:vb-wt-pop 0.42s cubic-bezier(0.22,1,0.36,1) both;}

/* ── Wave countdown bounce ──────────────────────────────────────── */
#wavecountdown.cd-pop{animation:vb-cd-pop 0.38s cubic-bezier(0.22,1,0.36,1);}

/* ── Spell switch flash ─────────────────────────────────────────── */
.si.active.spell-flash,.msi.active.spell-flash{animation:vb-spell-switch 0.52s cubic-bezier(0.22,1,0.36,1);}

/* ── HP bar hurt flash ──────────────────────────────────────────── */
#hf.bar-hurt{animation:vb-hp-hurt 0.48s ease;}

/* ── XP bar gain pulse ──────────────────────────────────────────── */
#xf.bar-xp{animation:vb-xp-gain 0.6s ease;}

/* ── Button press feedback ──────────────────────────────────────── */
.obtn:active{transform:scale(0.93)!important;transition:transform 0.07s;}
.pc:active{transform:scale(0.96)!important;transition:transform 0.07s;}
.cb:active{transform:scale(0.97)!important;transition:transform 0.07s;}
.obtn{transition:background 0.15s,border-color 0.15s,box-shadow 0.15s,transform 0.07s;}

/* ── Pet card entrance animation (class set by JS) ─────────────── */
.pc-anim{animation:vb-petcard-in 0.32s cubic-bezier(0.22,1,0.36,1) both;}