*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--bg4:#30363d;--text:#e6edf3;--text2:#8b949e;--text3:#484f58;--accent:#58a6ff;--accent2:#388bfd;--gold:#e3b341;--gold2:#f0c14b;--hp:#3fb950;--hp-low:#d29922;--hp-crit:#f85149;--xp:#bc8cff;--xp-bg:#1c1030;--border:#30363d;--border2:#21262d;--rare:#58a6ff;--epic:#bc8cff;--legend:#e3b341;--mythic:#f85149;--uncommon:#3fb950;--shadow:0 1px 3px rgba(0,0,0,.3),0 1px 2px rgba(0,0,0,.4);--shadow-lg:0 8px 24px rgba(0,0,0,.4);--radius:8px;--radius-lg:12px;--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;--font-mono:"SF Mono","Fira Code","Cascadia Code",monospace;--transition:.2s cubic-bezier(.4,0,.2,1)}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font);font-size:13px;line-height:1.5;-webkit-font-smoothing:antialiased}#app{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;position:relative}.top-bar{background:var(--bg2);border-bottom:1px solid var(--border);padding:8px 12px;display:flex;flex-direction:column;gap:6px;flex-shrink:0;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.stat-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.hero-name{font-weight:700;font-size:14px;color:var(--gold);letter-spacing:.5px;text-shadow:0 0 12px rgba(227,179,65,.3)}.hero-level{font-size:11px;font-weight:700;color:var(--accent);background:#58a6ff1f;padding:1px 8px;border-radius:10px;border:1px solid rgba(88,166,255,.2)}.hp-bar-container{position:relative;height:18px;border-radius:9px;overflow:hidden;flex:1;min-width:100px;background:var(--bg);border:1px solid var(--border);box-shadow:inset 0 1px 3px #0000004d}.hp-bar-fill{height:100%;border-radius:9px;transition:width .4s ease;background:linear-gradient(180deg,#3fb950,#2ea043);box-shadow:0 0 8px #3fb9504d}.hp-bar-fill.low{background:linear-gradient(180deg,#d29922,#bb8009);box-shadow:0 0 8px #d299224d}.hp-bar-fill.critical{background:linear-gradient(180deg,#f85149,#da3633);box-shadow:0 0 8px #f851494d;animation:pulse-hp 1s ease infinite}.hp-bar-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:10px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.5);font-family:var(--font-mono);letter-spacing:.3px}@keyframes pulse-hp{0%,to{opacity:1}50%{opacity:.7}}.xp-bar-container{height:4px;background:var(--xp-bg);border-radius:2px;flex:1;min-width:60px}.xp-bar-fill{height:100%;background:linear-gradient(90deg,#8957e5,#bc8cff);border-radius:2px;transition:width .4s ease}.stat{display:flex;align-items:center;gap:3px;font-size:11px;font-family:var(--font-mono)}.stat-icon{font-size:13px;filter:grayscale(.2)}.stat-value{font-weight:700}.stat-atk .stat-value{color:#f85149}.stat-def .stat-value{color:#58a6ff}.stat-spd .stat-value{color:#3fb950}.stat-crit .stat-value,.stat-gold .stat-value{color:#e3b341}.stat-floor{font-size:10px;color:var(--text2)}.game-log{flex:1;overflow-y:auto;padding:8px 12px;background:var(--bg);scrollbar-width:thin;scrollbar-color:var(--bg4) var(--bg)}.game-log::-webkit-scrollbar{width:6px}.game-log::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:3px}.game-log::-webkit-scrollbar-track{background:var(--bg)}.log-entry{font-size:12px;line-height:1.6;border-bottom:1px solid transparent;animation:log-slide .3s ease;position:relative;padding:3px 0 3px 4px}.log-entry:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:2px;height:0;border-radius:1px;transition:height .2s}.log-entry:hover:before{height:60%}@keyframes log-slide{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:none}}.log-entry.combat{color:#f85149}.log-entry.combat:before{background:#f85149}.log-entry.loot{color:#e3b341}.log-entry.loot:before{background:#e3b341}.log-entry.heal{color:#3fb950}.log-entry.heal:before{background:#3fb950}.log-entry.info{color:var(--text2)}.log-entry.info:before{background:var(--text3)}.log-entry.event{color:#d29922}.log-entry.event:before{background:#d29922}.log-entry.rare{color:#bc8cff;font-weight:600}.log-entry.rare:before{background:#bc8cff}.log-entry.death{color:#f85149;font-weight:700;font-size:13px}.log-entry.death:before{background:#f85149;height:100%!important}.log-entry.levelup{color:#3fb950;font-weight:700;font-size:14px;text-shadow:0 0 12px rgba(63,185,80,.3)}.log-entry.levelup:before{background:#3fb950;height:100%!important}.log-entry.boss{color:#f85149;font-weight:700;font-size:13px;letter-spacing:.3px}.log-entry.boss:before{background:#f85149;height:100%!important}.log-entry.system{color:var(--text3);font-style:italic}.log-entry.system:before{background:var(--text3)}.log-entry.achievement{color:#e3b341;font-weight:700;text-shadow:0 0 8px rgba(227,179,65,.2)}.log-entry.achievement:before{background:#e3b341;height:100%!important}.log-entry.rebirth{color:#bc8cff;font-weight:700;font-size:14px;text-shadow:0 0 12px rgba(188,140,255,.3)}.log-entry.rebirth:before{background:#bc8cff;height:100%!important}.log-entry.story{color:#d2a8ff;font-style:italic;line-height:1.8;font-size:12.5px;letter-spacing:.2px;background:#bc8cff0a;padding:6px 10px;border-radius:6px;margin:4px 0;border-left:2px solid rgba(188,140,255,.2)}.log-entry.story:before{display:none}.bottom-bar{background:var(--bg2);border-top:1px solid var(--border);flex-shrink:0;display:flex;flex-direction:column;max-height:52%}.tab-bar{display:flex;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--border);padding:4px 6px;gap:2px;flex-shrink:0;background:var(--bg3)}.tab-bar::-webkit-scrollbar{display:none}.tab-btn{padding:6px 12px;font-size:11px;font-weight:500;background:transparent;color:var(--text2);border:1px solid transparent;border-radius:6px;cursor:pointer;white-space:nowrap;transition:all var(--transition);position:relative}.tab-btn:hover{color:var(--text);background:#ffffff0a}.tab-btn.active{color:var(--accent);background:#58a6ff14;border-color:#58a6ff33;font-weight:600}.tab-btn.active:after{content:"";position:absolute;bottom:-1px;left:20%;right:20%;height:2px;background:var(--accent);border-radius:1px}.action-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(85px,1fr));gap:6px;padding:8px 10px}.action-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 6px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;font-size:11px;transition:all var(--transition);position:relative;overflow:hidden}.action-btn:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.06) 0%,transparent 100%);opacity:0;transition:opacity var(--transition)}.action-btn:hover:before{opacity:1}.action-btn:hover{border-color:var(--accent);box-shadow:0 0 12px #58a6ff1a}.action-btn:active:not(.cooldown){transform:scale(.94);background:var(--bg4);transition-duration:.05s}.action-btn .icon{font-size:22px;line-height:1}.action-btn .label{font-size:10px;line-height:1.2;text-align:center;font-weight:500}.action-btn.cooldown{opacity:.35;cursor:not-allowed;filter:grayscale(.5)}.action-btn[data-skill]{border-color:#bc8cff33}.action-btn[data-skill]:hover{border-color:var(--epic);box-shadow:0 0 12px #bc8cff26}.action-btn[data-use-potion]{border-color:#3fb95033}.action-btn[data-use-potion]:hover{border-color:var(--uncommon);box-shadow:0 0 12px #3fb95026}.action-btn[data-revive]{background:linear-gradient(135deg,#bc8cff26,#58a6ff26);border-color:var(--epic)}.action-btn[data-rebirth]:not(.cooldown){background:linear-gradient(135deg,#bc8cff1a,#e3b3411a);border-color:var(--gold)}.inventory-grid,.shop-grid{display:flex;flex-direction:column;gap:4px;padding:6px 10px;max-height:220px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--bg4) transparent}.inv-item,.shop-item{padding:8px 10px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg3);transition:all var(--transition);cursor:pointer}.inv-item:hover,.shop-item:hover{border-color:var(--accent);background:#58a6ff0a}.inv-item.equipped{border-color:#3fb9504d;background:#3fb9500a}.inv-item.equipped:before{content:"✓";position:absolute;right:8px;top:8px;color:var(--uncommon);font-size:12px}.inv-item{position:relative}.inv-item.empty-slot{border-style:dashed;border-color:var(--bg4);opacity:.5}.inv-item.rarity-common,.shop-item.rarity-common{border-left:3px solid var(--text3)}.inv-item.rarity-uncommon,.shop-item.rarity-uncommon{border-left:3px solid var(--uncommon)}.inv-item.rarity-rare,.shop-item.rarity-rare{border-left:3px solid var(--rare)}.inv-item.rarity-epic,.shop-item.rarity-epic{border-left:3px solid var(--epic)}.inv-item.rarity-legendary,.shop-item.rarity-legendary{border-left:3px solid var(--legend)}.inv-item.rarity-mythic,.shop-item.rarity-mythic{border-left:3px solid var(--mythic);box-shadow:0 0 12px #f851491a}.item-name{font-size:12px;font-weight:600}.item-stats{font-size:10px;color:var(--text2);margin-top:2px;font-family:var(--font-mono)}.shop-item.rarity-common{border-left:3px solid var(--text3)}.shop-item.rarity-uncommon{border-left:3px solid var(--uncommon)}.shop-item.rarity-rare{border-left:3px solid var(--rare)}.shop-item.rarity-epic{border-left:3px solid var(--epic)}.shop-item.rarity-legendary{border-left:3px solid var(--legend)}.shop-item.rarity-mythic{border-left:3px solid var(--mythic)}.shop-name{font-size:12px;font-weight:600}.shop-desc{font-size:10px;color:var(--text2);margin-top:2px}.shop-price{font-size:11px;color:var(--gold);margin-top:3px;font-family:var(--font-mono)}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(95px,1fr));gap:6px;padding:8px 10px}.skill-card{position:relative;text-align:center;padding:10px 6px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);transition:all var(--transition)}.skill-card:hover{border-color:var(--epic);box-shadow:0 0 12px #bc8cff1a}.skill-card.cooldown{opacity:.35;filter:grayscale(.5)}.skill-cd{position:absolute;top:4px;right:4px;font-size:9px;font-weight:700;color:var(--accent);background:var(--bg);padding:1px 6px;border-radius:4px;font-family:var(--font-mono)}.skill-icon{font-size:26px;line-height:1}.skill-name{font-size:11px;font-weight:600;margin-top:3px}.skill-desc{font-size:9px;color:var(--text2);margin-top:2px;line-height:1.3}.dungeon-select{display:flex;flex-direction:column;gap:4px;padding:6px 10px}.dungeon-card{padding:10px 12px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg3);cursor:pointer;transition:all var(--transition)}.dungeon-card:hover:not(.locked){border-color:var(--accent);background:#58a6ff0a}.dungeon-card.current{border-color:var(--gold);background:#e3b3410f;box-shadow:0 0 12px #e3b34114}.dungeon-card.locked{opacity:.3;cursor:not-allowed;filter:grayscale(.5)}.dg-name{font-size:13px;font-weight:700}.dg-info{font-size:10px;color:var(--text2);margin-top:2px}.settings-list{display:flex;flex-direction:column;gap:4px;padding:6px 10px}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--bg3);border-radius:var(--radius);border:1px solid var(--border)}.setting-label{font-size:12px;font-weight:500}.setting-btn{padding:5px 14px;font-size:11px;font-weight:600;background:var(--bg4);border:1px solid var(--border);border-radius:6px;color:var(--text);cursor:pointer;transition:all var(--transition)}.setting-btn:hover{border-color:var(--accent);background:#58a6ff14}.setting-btn:active{transform:scale(.96)}.setting-btn.danger{border-color:#f851494d;color:#f85149}.setting-btn.danger:hover{border-color:#f85149;background:#f8514914}.modal-overlay{position:fixed;inset:0;background:#000000b3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fade-in .3s ease}.modal{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;max-width:360px;width:90%;text-align:center;box-shadow:var(--shadow-lg);animation:modal-pop .3s ease}.modal h2{margin-bottom:8px;font-size:18px;font-weight:700}.modal p{color:var(--text2);margin-bottom:16px;font-size:12px}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-pop{0%{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:none}}.reward-line{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px;font-weight:600}.reward-line .icon{font-size:18px}.reward-line.gold{color:var(--gold)}.reward-line.xp{color:var(--xp)}.reward-line.item{color:var(--rare)}.modal-btn{margin-top:20px;padding:12px 28px;font-size:14px;font-weight:700;background:linear-gradient(135deg,var(--accent2),var(--accent));border:none;border-radius:var(--radius);color:#fff;cursor:pointer;box-shadow:0 4px 12px #388bfd4d;transition:all var(--transition);animation:glow-pulse 2s ease infinite}.modal-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #388bfd66}.modal-btn:active{transform:scale(.97)}@keyframes glow-pulse{0%,to{box-shadow:0 4px 12px #388bfd4d}50%{box-shadow:0 4px 20px #388bfd80}}.stats-bar{padding:4px 10px;font-size:10px;color:var(--text3);text-align:center;border-top:1px solid var(--border2);font-family:var(--font-mono)}.monster-card{padding:12px;text-align:center;background:linear-gradient(180deg,var(--bg3),var(--bg2));border-bottom:1px solid var(--border)}.monster-name{font-size:14px;font-weight:700;letter-spacing:.5px}.monster-name.boss{color:#f85149;text-shadow:0 0 12px rgba(248,81,73,.3);font-size:16px}.monster-abilities{display:flex;justify-content:center;gap:6px;margin-top:4px;flex-wrap:wrap}.ability-tag{font-size:10px;padding:1px 8px;border-radius:10px;background:#e67e221f;color:#e67e22;border:1px solid rgba(230,126,34,.2)}.monster-hp-bar{width:80%;margin:8px auto 0;height:12px;border-radius:6px;background:var(--bg);border:1px solid var(--border);overflow:hidden;box-shadow:inset 0 1px 3px #0000004d}.monster-hp-fill{height:100%;border-radius:6px;background:linear-gradient(180deg,#f85149,#da3633);transition:width .3s ease;box-shadow:0 0 6px #f8514933}.monster-hp-text{font-size:9px;font-family:var(--font-mono);color:var(--text2);margin-top:2px}.dead-screen{padding:24px;text-align:center;background:linear-gradient(180deg,rgba(248,81,73,.06),transparent)}.dead-screen .skull{font-size:48px;animation:skull-float 2s ease infinite}.dead-screen .msg{font-size:15px;color:#f85149;font-weight:700;margin:8px 0}.dead-screen .sub{font-size:11px;color:var(--text2);margin-bottom:16px}@keyframes skull-float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.wb-title{font-size:20px;font-weight:700;margin-bottom:4px}.wb-time{color:var(--text2);font-size:12px;margin-bottom:16px}.wb-rewards{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.wb-btn{padding:12px 24px;font-size:14px;font-weight:700;background:linear-gradient(135deg,var(--accent2),var(--accent));border:none;border-radius:var(--radius);color:#fff;cursor:pointer;box-shadow:0 4px 12px #388bfd4d;animation:glow-pulse 2s ease infinite;transition:all var(--transition)}.wb-btn:hover{transform:translateY(-1px)}.ach-popup{position:fixed;top:20px;left:50%;transform:translate(-50%);background:var(--bg2);border:2px solid var(--gold);border-radius:var(--radius-lg);padding:14px 24px;z-index:200;text-align:center;box-shadow:0 8px 24px #e3b34133;animation:ach-in .4s ease}.ach-popup .ach-icon{font-size:28px}.ach-popup .ach-title{color:var(--gold);font-weight:700;font-size:13px}.ach-popup .ach-desc{color:var(--text2);font-size:10px}@keyframes ach-in{0%{opacity:0;transform:translate(-50%) translateY(-20px) scale(.9)}to{opacity:1;transform:translate(-50%) none}}.combat-scene{position:relative;width:100%;height:140px;overflow:hidden;flex-shrink:0}.scene-bg{position:absolute;inset:0;background:linear-gradient(180deg,#0d1117,#161b22 40%,#1a2332,#1e2d3d)}.scene-ground{position:absolute;bottom:0;left:0;right:0;height:40px;background:linear-gradient(180deg,transparent,rgba(88,166,255,.05));border-top:1px solid rgba(88,166,255,.1)}.scene-particles{position:absolute;inset:0;pointer-events:none}.scene-stage{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-around;padding-bottom:44px}.sprite-slot{display:flex;flex-direction:column;align-items:center;gap:4px}.hero-slot{margin-left:15%}.monster-slot{margin-right:15%}.sprite{position:relative;font-size:48px;line-height:1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}.sprite-shadow{position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:40px;height:10px;border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.4),transparent)}.sprite-label{text-align:center}.sprite-name{display:block;font-size:11px;font-weight:600;color:var(--text)}.sprite-level{font-size:9px;color:var(--text2);font-family:var(--font-mono)}.sprite-boss-badge{display:inline-block;font-size:9px;font-weight:700;color:#f85149;background:#f8514926;padding:0 6px;border-radius:4px;margin-left:4px;border:1px solid rgba(248,81,73,.3)}.sprite.idle{animation:sprite-idle 2s ease-in-out infinite}@keyframes sprite-idle{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.hero-sprite.attacking{animation:hero-attack .4s ease!important}@keyframes hero-attack{0%{transform:translate(0)}40%{transform:translate(50px) scale(1.1)}to{transform:translate(0)}}.monster-sprite.attacking{animation:monster-attack .4s ease!important}@keyframes monster-attack{0%{transform:translate(0)}40%{transform:translate(-50px) scale(1.1)}to{transform:translate(0)}}.sprite.hit{animation:sprite-hit .3s ease!important}@keyframes sprite-hit{0%{transform:translate(0);filter:brightness(1)}25%{transform:translate(-8px);filter:brightness(2) hue-rotate(-30deg)}50%{transform:translate(6px);filter:brightness(1.5)}75%{transform:translate(-4px);filter:brightness(1.2)}to{transform:translate(0);filter:brightness(1)}}.sprite.hit.crit{animation:sprite-crit .4s ease!important}@keyframes sprite-crit{0%{transform:translate(0) scale(1);filter:brightness(1)}20%{transform:translate(-12px) scale(1.2);filter:brightness(3) hue-rotate(-40deg)}40%{transform:translate(10px) scale(.9);filter:brightness(2)}60%{transform:translate(-6px) scale(1.1);filter:brightness(1.5)}to{transform:translate(0) scale(1);filter:brightness(1)}}.sprite.healing{animation:sprite-heal .6s ease!important}@keyframes sprite-heal{0%{filter:brightness(1)}50%{filter:brightness(1.3) drop-shadow(0 0 12px rgba(63,185,80,.6))}to{filter:brightness(1)}}.sprite.dying{animation:sprite-death .8s ease forwards!important}@keyframes sprite-death{0%{transform:scale(1) rotate(0);opacity:1;filter:brightness(1)}30%{transform:scale(1.2) rotate(-5deg);filter:brightness(2)}to{transform:scale(0) rotate(20deg);opacity:0;filter:brightness(0)}}.monster-sprite.boss .sprite-emoji{animation:boss-glow 2s ease-in-out infinite}@keyframes boss-glow{0%,to{filter:drop-shadow(0 0 4px rgba(248,81,73,.3))}50%{filter:drop-shadow(0 0 12px rgba(248,81,73,.6))}}.sprite-vs{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:20px;font-weight:900;color:var(--accent);text-shadow:0 0 10px rgba(88,166,255,.3);z-index:5}.victory-text{font-size:32px;animation:victory-pop .5s ease}@keyframes victory-pop{0%{transform:scale(0);opacity:0}60%{transform:scale(1.3)}to{transform:scale(1);opacity:1}}@keyframes damage-float{0%{transform:translate(-50%,-50%) scale(.5);opacity:1}50%{transform:translate(-50%,-120%) scale(1.2);opacity:.9}to{transform:translate(-50%,-180%) scale(.8);opacity:0}}@keyframes heal-float{0%{transform:translateY(0) scale(.5);opacity:0}30%{opacity:1}to{transform:translateY(-40px) scale(1);opacity:0}}@keyframes explode{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--ex),var(--ey)) scale(0);opacity:0}}@keyframes slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes slide-in-right{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:none}}@keyframes scale-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}@keyframes shake{0%,to{transform:none}25%{transform:translate(-3px)}75%{transform:translate(3px)}}@keyframes hit-flash{0%{background:#f8514926}to{background:transparent}}@keyframes glow-border{0%,to{border-color:var(--accent)}50%{border-color:var(--epic)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes spin{to{transform:rotate(360deg)}}.bottom-bar{animation:slide-up .3s ease}.tab-content-enter{animation:scale-in .2s ease}.monster-card{animation:scale-in .3s ease}.dead-screen{animation:scale-in .4s ease}.shop-item,.inv-item,.dungeon-card{transition:all var(--transition),transform .1s ease}.shop-item:active,.inv-item:active,.dungeon-card:active:not(.locked){transform:scale(.98)}.monster-card.hit{animation:hit-flash .3s ease}.hp-bar-fill,.monster-hp-fill,.xp-bar-fill{transition:width .4s cubic-bezier(.4,0,.2,1)}@keyframes level-glow{0%{box-shadow:0 0 #3fb95066}50%{box-shadow:0 0 20px 4px #3fb95033}to{box-shadow:0 0 #3fb95000}}.levelup-effect{animation:level-glow 1s ease}.hero-sprite.attacking{animation:attack-right .4s ease!important}@keyframes attack-right{0%,to{transform:translate(0)}50%{transform:translate(20px)}}.monster-sprite.attacking{animation:attack-left .4s ease!important}@keyframes attack-left{0%,to{transform:translate(0)}50%{transform:translate(-20px)}}.sprite.hit{animation:sprite-hit-v2 .35s ease!important}@keyframes sprite-hit-v2{0%{transform:translate(0) scale(1);filter:brightness(1)}15%{transform:translate(-10px) scale(1.05);filter:brightness(2.5) hue-rotate(-30deg)}30%{transform:translate(8px) scale(.95);filter:brightness(2)}45%{transform:translate(-6px) scale(1.02);filter:brightness(1.5)}60%{transform:translate(4px) scale(.98);filter:brightness(1.3)}to{transform:translate(0) scale(1);filter:brightness(1)}}.sprite.hit.crit{animation:crit-shake .4s ease!important}@keyframes crit-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.sprite.healing{animation:sprite-heal-v2 .7s ease!important}@keyframes sprite-heal-v2{0%{filter:brightness(1) drop-shadow(0 0 0 transparent)}30%{filter:brightness(1.4) drop-shadow(0 0 16px rgba(63,185,80,.7))}60%{filter:brightness(1.2) drop-shadow(0 0 10px rgba(63,185,80,.5))}to{filter:brightness(1) drop-shadow(0 0 0 transparent)}}.sprite.monster-death-anim{animation:monster-death .9s ease forwards!important}@keyframes monster-death{0%{opacity:1;filter:brightness(2)}16%{opacity:.8;filter:brightness(.5)}33%{opacity:1;filter:brightness(2)}50%{opacity:.6;filter:brightness(.5)}66%{opacity:.8;filter:brightness(2)}80%{opacity:.3;transform:scaleX(1.5) scaleY(.8);filter:brightness(1.5)}to{opacity:0;transform:scaleX(2) scaleY(.3);filter:brightness(3)}}.combat-scene.scene-shake{animation:scene-shake-anim .5s ease}@keyframes scene-shake-anim{0%,to{transform:translate(0)}10%{transform:translate(-3px,2px)}20%{transform:translate(4px,-2px)}30%{transform:translate(-2px,3px)}40%{transform:translate(3px,-1px)}50%{transform:translate(-1px,2px)}60%{transform:translate(2px,-2px)}70%{transform:translate(-2px,1px)}80%{transform:translate(1px,-1px)}}.damage-number{position:absolute;top:10%;left:50%;transform:translate(calc(-50% + var(--x-offset, 0px)));display:flex;align-items:center;gap:2px;font-weight:900;pointer-events:none;z-index:20;animation:dmg-float-v2 1s ease-out forwards;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 8px rgba(0,0,0,.3);white-space:nowrap}.damage-number .dmg-prefix{font-size:16px}.damage-number .dmg-value{font-size:20px;color:#fff;font-family:var(--font-mono)}.damage-number.crit .dmg-value{font-size:28px;color:#f85149;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 16px rgba(248,81,73,.6);animation:dmg-crit-shake .4s ease}.damage-number.crit{animation:dmg-float-v2 1.2s ease-out forwards}.damage-number.element-fire .dmg-value{color:#ff6b35}.damage-number.element-ice .dmg-value{color:#64d2ff}.damage-number.element-poison .dmg-value{color:#3fb950}.damage-number.element-lightning .dmg-value{color:gold}@keyframes dmg-float-v2{0%{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(0) scale(.3);opacity:0}15%{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(-10px) scale(1.3);opacity:1}30%{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(-20px) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(-70px) scale(.7);opacity:0}}@keyframes dmg-crit-shake{0%,to{transform:translate(calc(-50% + var(--x-offset, 0px)))}10%{transform:translate(calc(-50% + var(--x-offset, 0px) - 4px))}20%{transform:translate(calc(-50% + var(--x-offset, 0px) + 4px))}30%{transform:translate(calc(-50% + var(--x-offset, 0px) - 3px))}40%{transform:translate(calc(-50% + var(--x-offset, 0px) + 3px))}50%{transform:translate(calc(-50% + var(--x-offset, 0px) - 2px))}60%{transform:translate(calc(-50% + var(--x-offset, 0px) + 2px))}}.heal-number{position:absolute;top:10%;left:50%;transform:translate(calc(-50% + var(--x-offset, 0px)));font-size:20px;font-weight:900;color:#3fb950;pointer-events:none;z-index:20;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 10px rgba(63,185,80,.5);animation:heal-float-v2 1s ease-out forwards;font-family:var(--font-mono)}@keyframes heal-float-v2{0%{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(0) scale(.3);opacity:0}20%{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(-10px) scale(1.2);opacity:1}to{transform:translate(calc(-50% + var(--x-offset, 0px))) translateY(-60px) scale(.8);opacity:0}}.skill-effect-ring{position:absolute;top:50%;left:50%;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;pointer-events:none;z-index:1;opacity:0;transition:opacity .2s}.skill-effect-ring.active{opacity:1;animation:ring-pulse .5s ease}.skill-effect-ring.active.element-fire{border:3px solid rgba(255,107,53,.6);box-shadow:0 0 20px #ff6b3566,inset 0 0 15px #ff6b3533;background:radial-gradient(circle,rgba(255,107,53,.15),transparent)}.skill-effect-ring.active.element-ice{border:3px solid rgba(100,210,255,.6);box-shadow:0 0 20px #64d2ff66,inset 0 0 15px #64d2ff33;background:radial-gradient(circle,rgba(100,210,255,.15),transparent)}.skill-effect-ring.active.element-poison{border:3px solid rgba(63,185,80,.6);box-shadow:0 0 20px #3fb95066,inset 0 0 15px #3fb95033;background:radial-gradient(circle,rgba(63,185,80,.15),transparent)}.skill-effect-ring.active.element-lightning{border:3px solid rgba(255,215,0,.6);box-shadow:0 0 20px #ffd70066,inset 0 0 15px #ffd70033;background:radial-gradient(circle,rgba(255,215,0,.15),transparent)}@keyframes ring-pulse{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.combo-display{position:absolute;top:8px;left:50%;transform:translate(-50%);text-align:center;pointer-events:none;z-index:15;opacity:0;transition:opacity .2s}.combo-display.active{opacity:1}.combo-number{font-size:24px;font-weight:900;color:#e3b341;text-shadow:0 2px 8px rgba(227,179,65,.5),0 0 20px rgba(227,179,65,.3);line-height:1;font-family:var(--font);letter-spacing:1px;animation:combo-text .3s ease}.combo-number.super{color:#bc8cff;text-shadow:0 2px 8px rgba(188,140,255,.5),0 0 20px rgba(188,140,255,.3);font-size:28px}.combo-number.mega{color:#f85149;font-size:32px;text-shadow:0 2px 8px rgba(248,81,73,.6),0 0 24px rgba(248,81,73,.4);animation:mega-pulse .3s ease}@keyframes combo-bounce{0%{transform:translate(-50%) scale(.5)}50%{transform:translate(-50%) scale(1.2)}to{transform:translate(-50%) scale(1)}}@keyframes combo-text{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}@keyframes mega-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.boss-warning-overlay{position:absolute;inset:0;z-index:25;pointer-events:none;opacity:0;transition:opacity .15s}.boss-warning-overlay.active{opacity:1}.boss-warning-overlay.flash{animation:boss-flash .15s ease}@keyframes boss-flash{0%,to{background:transparent}50%{background:#f8514940}}.boss-warning-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px;font-weight:900;color:#f85149;text-shadow:0 0 20px rgba(248,81,73,.6),0 0 40px rgba(248,81,73,.3);letter-spacing:4px;white-space:nowrap;animation:boss-text-pulse .3s ease infinite alternate}@keyframes boss-text-pulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}to{transform:translate(-50%,-50%) scale(1.05);opacity:1}}@media (max-width:480px){.stat-group{gap:4px}.stat{font-size:10px}.action-grid{grid-template-columns:repeat(3,1fr);gap:4px;padding:6px 8px}.action-btn{padding:8px 4px}.action-btn .icon{font-size:18px}.tab-btn{padding:5px 8px;font-size:10px}.game-log{padding:6px 8px}.log-entry{font-size:11px}.top-bar{padding:6px 8px}}@media (min-width:768px){.action-grid{grid-template-columns:repeat(5,1fr)}.skills-grid{grid-template-columns:repeat(4,1fr)}}#app:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(88,166,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(88,166,255,.02) 1px,transparent 1px);background-size:50px 50px;pointer-events:none;z-index:0}.top-bar{position:sticky;top:0;z-index:100}.hero-name{background:linear-gradient(135deg,gold,#ff6b35);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hp-bar-fill{position:relative;overflow:hidden}.hp-bar-fill:after{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:hp-shine 3s ease-in-out infinite}@keyframes hp-shine{0%,to{left:-100%}50%{left:150%}}.xp-bar-fill{position:relative;overflow:hidden}.xp-bar-fill:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:xp-pulse 2s ease-in-out infinite}@keyframes xp-pulse{0%,to{opacity:.5}50%{opacity:1}}.game-log{position:relative}.log-entry{transition:all .2s ease}.log-entry:hover{background:#ffffff08;padding-left:8px}.log-entry.combat{text-shadow:0 0 8px rgba(248,81,73,.3)}.log-entry.loot{text-shadow:0 0 8px rgba(227,179,65,.3)}.action-btn{position:relative;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.action-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#ffffff1a;border-radius:50%;transform:translate(-50%,-50%);transition:width .4s,height .4s}.action-btn:hover:before{width:200%;height:200%}.action-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #58a6ff33}.action-btn:active{transform:translateY(0) scale(.98)}.tab-btn{position:relative;transition:all .3s ease}.tab-btn:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--accent);transition:all .3s ease;transform:translate(-50%)}.tab-btn.active:after{width:100%}.tab-btn:hover{background:#58a6ff1a}.monster-card{border:1px solid var(--border);border-radius:var(--radius-lg);padding:12px;background:linear-gradient(135deg,var(--bg2),var(--bg));transition:all .3s ease}.monster-card:hover{border-color:var(--hp)}.monster-name.boss{color:var(--gold)!important;text-shadow:0 0 12px rgba(227,179,65,.4)}.monster-hp-bar{position:relative;overflow:hidden}.monster-hp-fill{transition:width .3s ease;position:relative}.monster-hp-fill:after{content:"";position:absolute;top:0;left:0;width:100%;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.2),transparent)}.equip-slot.rare{border-color:var(--rare);box-shadow:0 0 12px #58a6ff33}.equip-slot.epic{border-color:var(--epic);box-shadow:0 0 12px #bc8cff33}.equip-slot.legend{border-color:var(--legend);box-shadow:0 0 12px #e3b34133}.equip-slot.mythic{border-color:var(--mythic);box-shadow:0 0 16px #f851494d;animation:mythic-pulse 2s ease-in-out infinite}@keyframes mythic-pulse{0%,to{box-shadow:0 0 12px #f851494d}50%{box-shadow:0 0 24px #f8514980}}.achievement-popup{background:linear-gradient(135deg,#161b22fa,#1e232afa);border:2px solid var(--gold);border-radius:16px;box-shadow:0 0 40px #e3b3414d}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text3)}@media (max-width: 480px){.top-bar{padding:6px 8px}.stat-group{gap:4px}.stat{font-size:10px}.game-log{padding:4px 8px}.log-entry{font-size:11px}}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#app>*{animation:fade-in .3s ease}.game-panel,.monster-card{box-shadow:0 2px 4px #0003,0 4px 8px #00000026,inset 0 1px #ffffff0d}@keyframes border-glow{0%,to{border-color:var(--border)}50%{border-color:var(--accent)}}.sprite.idle{animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}
