:root{--ink: #0b0710;--panel: rgba(24, 15, 36, .94);--panel-2: rgba(38, 24, 56, .96);--line: #4a3568;--line-soft: rgba(122, 90, 168, .35);--gold: #ffd166;--gold-dark: #c98a1e;--blood: #ff4d6d;--xp: #4cc9f0;--text: #efe7f7;--muted: #a08cbb;--font: "Trebuchet MS", "Segoe UI", system-ui, sans-serif;--btn-h: 44px}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--ink);color:var(--text);font-family:var(--font);overflow:hidden;-webkit-font-smoothing:antialiased;touch-action:none;user-select:none}#app{position:fixed;inset:0}canvas#stage{position:absolute;inset:0;width:100%;height:100%;display:block;image-rendering:auto}.layer{position:absolute;inset:0;pointer-events:none}.layer>*{pointer-events:auto}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--btn-h);font-family:var(--font);font-size:15px;font-weight:700;line-height:1.2;letter-spacing:.02em;color:var(--text);background:linear-gradient(180deg,#3a2652,#241635);border:2px solid var(--line);border-radius:10px;padding:0 22px;cursor:pointer;transition:transform .08s ease,border-color .15s ease,background .15s ease;box-shadow:0 4px #00000073}.btn:hover:not(:disabled){border-color:var(--gold);background:linear-gradient(180deg,#4a2f68,#2c1b42)}.btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px #00000073}.btn:disabled{opacity:.42;cursor:default}.btn.primary{background:linear-gradient(180deg,#8a2233,#59121f);border-color:#c1425a;padding:0 34px}.btn.primary:hover{border-color:var(--gold)}.btn.ghost{background:#140c1eb3;color:var(--muted);font-size:13.5px;padding:0 16px}.btn.ghost:hover:not(:disabled){color:var(--text)}.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:radial-gradient(circle at 50% 40%,#28163cd1,#06030bf5);backdrop-filter:blur(2px);overflow-y:auto;padding:24px}.title{font-size:clamp(34px,7vw,68px);font-weight:700;letter-spacing:.06em;color:var(--gold);text-shadow:0 0 24px rgba(255,160,60,.45),0 5px 0 #5a1220,0 8px 18px rgba(0,0,0,.8);margin:0;text-align:center}.subtitle{color:var(--muted);font-size:14px;letter-spacing:.16em;text-transform:uppercase;margin:-8px 0 6px}.panel{background:var(--panel);border:2px solid var(--line);border-radius:14px;padding:18px;box-shadow:0 14px 40px #0009}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center}.gold-tag{display:inline-flex;align-items:center;gap:7px;font-weight:700;color:var(--gold);font-size:17px}.gold-tag img{width:20px;height:20px;image-rendering:auto}#hud{position:absolute;inset:0;pointer-events:none;font-size:13px}.xp-track{position:absolute;top:0;left:0;right:0;height:14px;background:#0a0610d9;border-bottom:2px solid #241635}.xp-fill{height:100%;width:0%;background:linear-gradient(180deg,#7ae0ff,#2f9fd6);box-shadow:0 0 12px #4cc9f0b3;transition:width .12s linear}.xp-label{position:absolute;top:0;left:50%;transform:translate(-50%);font-size:11px;font-weight:700;line-height:14px;text-shadow:0 1px 2px #000;letter-spacing:.08em}.hud-top{position:absolute;top:20px;left:0;right:0;display:flex;justify-content:center;flex-direction:column;align-items:center;gap:4px}.hud-timer{font-size:30px;font-weight:700;letter-spacing:.06em;text-shadow:0 3px 0 rgba(0,0,0,.7),0 0 18px rgba(0,0,0,.9)}.hud-stats{display:flex;gap:16px;font-weight:700;text-shadow:0 2px 3px rgba(0,0,0,.9)}.hud-stats span{display:inline-flex;align-items:center;gap:5px}.hud-left{position:absolute;top:22px;left:14px;display:flex;flex-direction:column;gap:7px;width:190px}.hp-track{position:relative;height:17px;background:#0a0610d9;border:2px solid #4a3568;border-radius:4px;overflow:hidden}.hp-fill{height:100%;width:100%;background:linear-gradient(180deg,#ff5c72,#a5122a);transition:width .14s ease}.hp-text{position:absolute;inset:0;text-align:center;font-size:11px;font-weight:700;line-height:13px;text-shadow:0 1px 2px #000}.level-badge{align-self:flex-start;background:#0a0610cc;border:2px solid var(--gold-dark);border-radius:6px;padding:2px 9px;font-weight:700;color:var(--gold);font-size:12px}.hud-items{position:absolute;left:14px;bottom:14px;display:flex;flex-direction:column;gap:6px}.item-row{display:flex;gap:5px}.item-slot{position:relative;width:34px;height:34px;border-radius:8px;background:#0a0610b3;border:2px solid rgba(122,90,168,.45)}.item-slot img{width:100%;height:100%;display:block;border-radius:6px}.item-slot .pips{position:absolute;left:2px;right:2px;bottom:2px;display:flex;gap:1px}.item-slot .pips i{flex:1;height:3px;background:#ffffff38;border-radius:1px}.item-slot .pips i.on{background:var(--gold)}.item-slot.maxed{border-color:var(--gold);box-shadow:0 0 10px #ffd16673}.boss-bar{position:absolute;top:74px;left:50%;transform:translate(-50%);width:min(460px,74vw);display:none;flex-direction:column;align-items:center;gap:3px}.boss-bar.on{display:flex}.boss-name{font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blood);text-shadow:0 2px 4px #000;font-size:13px}.boss-track{width:100%;height:11px;background:#0a0610d9;border:2px solid #7a2233;border-radius:4px;overflow:hidden}.boss-fill{height:100%;width:100%;background:linear-gradient(180deg,#ff4d6d,#8a1226)}.hud-hint{position:absolute;right:14px;bottom:14px;color:var(--muted);font-size:11px;text-align:right;line-height:1.5}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#06030bc7;padding:20px;overflow-y:auto}.overlay h2{margin:0;font-size:26px;color:var(--gold);letter-spacing:.08em;text-shadow:0 3px 0 #5a1220}.cards{display:flex;flex-direction:column;gap:9px;width:min(560px,94vw)}.card{display:flex;align-items:center;gap:13px;padding:11px 13px;border-radius:12px;background:linear-gradient(180deg,#34214af2,#1c112af2);border:2px solid var(--line);cursor:pointer;text-align:left;color:var(--text);font-family:var(--font);transition:transform .08s ease,border-color .12s ease}.card:hover{border-color:var(--gold);transform:translate(4px)}.card img{width:42px;height:42px;flex:none;border-radius:9px}.card .body{flex:1;min-width:0}.card .name{font-weight:700;font-size:16px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.card .lvl{font-size:11px;color:var(--gold);border:1px solid var(--gold-dark);border-radius:4px;padding:0 5px}.card .lvl.new{color:#8ce99a;border-color:#3d8f52}.card .desc{color:var(--muted);font-size:13px;margin-top:2px}.card.banish-mode{border-color:#b5453f}.card.banish-mode:hover{border-color:#ff6b6b}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));grid-auto-rows:1fr;gap:9px;width:min(900px,94vw);max-height:56vh;overflow-y:auto;padding-right:4px}.shop-item{display:flex;gap:10px;align-items:center;padding:9px;border-radius:10px;background:#1e132de6;border:2px solid var(--line-soft);cursor:pointer;color:var(--text);font-family:var(--font);text-align:left}.shop-item:hover:not(:disabled){border-color:var(--gold)}.shop-item:disabled{opacity:.5;cursor:default}.shop-item img{width:34px;height:34px;flex:none;border-radius:7px}.shop-item .n{font-weight:700;font-size:14px}.shop-item .d{font-size:11.5px;color:var(--muted)}.shop-item .c{font-size:12px;color:var(--gold);font-weight:700;margin-top:2px}.hero-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-auto-rows:1fr;gap:10px;width:min(820px,94vw);max-height:58vh;overflow-y:auto}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:12px 10px;border-radius:12px;background:#1e132de6;border:2px solid var(--line-soft);cursor:pointer;color:var(--text);font-family:var(--font)}.hero:hover{border-color:var(--gold)}.hero.selected{border-color:var(--gold);box-shadow:0 0 18px #ffd1664d;background:#34214af2}.hero.locked{opacity:.68}.hero canvas{image-rendering:pixelated;height:76px;width:auto}.hero .hn{font-weight:700;font-size:16px}.hero .ht{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.hero .hb{font-size:12px;color:#8ce99a;text-align:center;min-height:2.8em;display:flex;align-items:center;justify-content:center}.hero-foot{min-height:24px;display:flex;align-items:center;justify-content:center}.hero .hw{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.hero .hw img{width:22px;height:22px}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(140px,1fr));gap:8px 22px;width:min(460px,92vw)}.stat{display:flex;justify-content:space-between;border-bottom:1px dashed rgba(122,90,168,.3);padding:4px 0;font-size:14px}.stat b{color:var(--gold)}.build-strip{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;max-width:min(520px,92vw)}.build-strip img{width:34px;height:34px;border-radius:7px;border:2px solid var(--line-soft)}.evo-banner{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:700;color:var(--gold)}.evo-banner img{width:52px;height:52px;border-radius:10px}.dim{color:var(--muted);font-size:13px;text-align:center;max-width:520px;line-height:1.55}@media (max-width: 620px){.hud-left{width:150px}.hud-timer{font-size:24px}.item-slot{width:29px;height:29px}}.title.small{font-size:clamp(26px,4.4vw,42px)}.purse{display:flex;gap:14px;align-items:center}.gold-tag.gems{color:var(--xp)}.shop-head{display:flex;flex-direction:column;align-items:center;gap:6px}.tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.tab{display:inline-flex;align-items:center;justify-content:center;min-height:36px;font-family:var(--font);font-size:13px;font-weight:700;line-height:1.2;color:var(--muted);background:#140c1ebf;border:2px solid var(--line-soft);border-radius:999px;padding:0 16px;cursor:pointer}.tab:hover{color:var(--text);border-color:var(--line)}.tab.on{color:var(--ink);background:linear-gradient(180deg,#ffd97a,#e0a828);border-color:var(--gold)}.shop-grid.wide{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));max-height:52vh}.si-body{flex:1;min-width:0}.shop-item .n{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.badge{font-size:9.5px;font-weight:700;letter-spacing:.06em;padding:2px 6px;border-radius:4px;background:#8a2233;color:#ffe3e8}.badge.bonus{background:#2f6b52;color:#d9ffe8}.shop-item .have{font-size:11px;color:#8ce99a;margin-top:3px}.shop-item .c.owned{color:var(--muted)}.boost-strip{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.boost-chip{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--gold);background:#1e132de6;border:2px solid var(--line-soft);border-radius:999px;padding:4px 12px 4px 5px}.boost-chip img{width:22px;height:22px;border-radius:5px}.btn.daily{border-color:var(--gold);color:var(--gold);animation:pulse 2.2s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 #ffd16600}50%{box-shadow:0 0 16px #ffd16673}}.loadout{width:min(820px,94vw);background:#140c1eb3;border:2px solid var(--line-soft);border-radius:12px;padding:10px 12px}.loadout-head{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:8px;flex-wrap:wrap}.loadout-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.loadout .slot{position:relative;display:flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border-radius:10px;background:#0a0610b3;border:2px solid var(--line-soft);cursor:pointer;color:var(--muted);font-family:var(--font);font-size:12px}.loadout .slot img{width:26px;height:26px;border-radius:6px}.loadout .slot.on{border-color:var(--gold);color:var(--text);background:#34214af2}.supplies{display:flex;gap:5px;flex-wrap:wrap}.supply{display:flex;align-items:center;gap:4px;padding:2px 6px 2px 2px;border-radius:7px;background:#0a0610bf;border:2px solid rgba(122,90,168,.45);font-size:11px;font-weight:700;text-shadow:0 1px 2px #000}.supply img{width:20px;height:20px;border-radius:4px}.supply i{font-style:normal;font-size:9.5px;color:var(--ink);background:var(--gold);border-radius:3px;padding:0 4px}.overlay.pay{background:#040208db}.pay-card{width:min(420px,92vw);background:var(--panel-2);border:2px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:12px;box-shadow:0 20px 60px #000000b3}.pay-warn{text-align:center;font-size:11px;font-weight:700;letter-spacing:.08em;color:#ffd07a;background:#8c501459;border:1px dashed #c98a1e;border-radius:8px;padding:6px}.pay-head{display:flex;gap:12px;align-items:center}.pay-head img{width:48px;height:48px;border-radius:10px;flex:none}.pay-name{font-weight:700;font-size:17px}.pay-desc{font-size:13px;color:var(--muted)}.pay-price{text-align:center;font-size:26px;font-weight:700;color:var(--gold)}.toasts{position:absolute;left:50%;bottom:22px;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none;z-index:20}.toast{background:#180f24f5;border:2px solid var(--line);border-radius:10px;padding:8px 16px;font-size:13px;font-weight:700;box-shadow:0 8px 24px #0009;transition:opacity .28s ease,transform .28s ease}.toast.good{border-color:#3d8f52;color:#b6f2c4}.toast.bad{border-color:#b5453f;color:#ffc4c0}.toast.out{opacity:0;transform:translateY(8px)}.rarity{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:4px;border:1px solid currentColor}.rarity.common{color:#b9c3d0}.rarity.rare{color:#5ec2f0}.rarity.epic{color:#a06be0}.rarity.legendary{color:#ffd166}.card.r-rare{border-color:#5ec2f0b3}.card.r-epic{border-color:#a06be0cc;box-shadow:0 0 14px #a06be040}.card.r-legendary{border-color:var(--gold);box-shadow:0 0 20px #ffd16659}