
:root{--bg:#070b19;--glass:rgba(12,19,37,.9);--line:rgba(138,170,220,.18);--muted:#9eafc9;--text:#edf4ff;--gold:#ffd17b;--cyan:#80e7fa;--danger:#ff7c8c;--radius:18px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;margin:0;overflow:hidden;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}body{touch-action:pan-y}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}#world{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 20%,rgba(2,6,17,.56) 100%)}
#app{position:fixed;inset:0;pointer-events:none}#app>*{pointer-events:auto}.hidden{display:none!important}.muted{color:var(--muted)}.micro{font-size:10px;text-transform:uppercase;font-weight:850;letter-spacing:2px;color:#96accf}.small{font-size:12px}.strong{font-weight:800}.glow-text{color:var(--gold);text-shadow:0 0 22px rgba(255,202,111,.3)}
#menu{height:100dvh;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;background:linear-gradient(90deg,rgba(5,9,24,.95),rgba(5,10,25,.83) 65%,rgba(5,10,25,.73));padding:env(safe-area-inset-top) max(16px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}#menuInner{max-width:1050px;margin:auto}.masthead{padding:14px 0 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}.brand{display:flex;gap:9px;align-items:center;font-weight:1000;letter-spacing:1.1px;font-size:14px}.brand-mark{display:grid;place-items:center;width:36px;height:36px;background:linear-gradient(145deg,#213f68,#5b3c69);border:1px solid #7185b6;border-radius:11px;color:#fff0bc;box-shadow:0 0 24px rgba(94,151,250,.2);font-size:22px}.iconbtn{border:1px solid var(--line);background:rgba(17,30,51,.9);border-radius:12px;min-width:41px;min-height:40px;padding:8px 10px}.hero{padding:24px 5px 10px;max-width:650px}.hero h1{font-size:clamp(35px,7vw,68px);line-height:.96;letter-spacing:-2.5px;margin:9px 0 14px;font-weight:1000}.hero p{line-height:1.55;max-width:560px;margin:0;color:#adbed7;font-size:13px}.eyebrow{color:var(--cyan);letter-spacing:3.5px;font-size:10px;font-weight:900}
.stats{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(2,minmax(0,1fr));gap:9px;margin:18px 0}.statbox{border:1px solid var(--line);background:linear-gradient(140deg,rgba(26,42,67,.85),rgba(12,20,36,.92));border-radius:15px;padding:13px 14px;min-width:0;box-shadow:inset 0 1px rgba(255,255,255,.04)}.statvalue{font-weight:900;font-size:20px;letter-spacing:-.5px;line-height:1.4;white-space:nowrap}.xpbar{height:6px;border-radius:10px;background:#293a57;margin:8px 0 4px;overflow:hidden}.xpfill{height:100%;width:0;background:linear-gradient(90deg,#49b9ed,#8efbe8);box-shadow:0 0 12px #60dfec}.tabs{display:flex;gap:7px;overflow-x:auto;margin:9px 0 15px;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{background:rgba(20,30,49,.83);border:1px solid var(--line);border-radius:11px;padding:11px 16px;font-size:12px;font-weight:900;color:#a1b1ca;white-space:nowrap}.tab.active{background:linear-gradient(120deg,#2b4f76,#29455c);color:white;border-color:#5586a2}.section-header{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:10px 0 14px}.section-header h2{font-size:20px;letter-spacing:-.5px;margin:0}.section-header .muted{font-size:11px;text-align:right}.raids{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:10px}.raid-card{position:relative;overflow:hidden;text-align:left;border:1px solid rgba(150,175,225,.2);border-radius:17px;background:linear-gradient(125deg,rgba(25,39,66,.96),rgba(13,19,35,.95));padding:15px 15px 14px;min-height:147px;transition:border-color .15s,transform .15s}.raid-card:active{transform:scale(.98)}.raid-card.selected{border-color:#e5bd76;box-shadow:0 0 0 1px rgba(232,193,123,.2),inset 0 0 38px rgba(234,196,109,.07)}.raid-card.locked{opacity:.58;filter:saturate(.45)}.raid-glyph{height:30px;width:34px;display:grid;place-items:center;border-radius:9px;font-size:21px;background:var(--raid-bg,#4c506d);color:#fff;margin-bottom:14px}.raid-level{position:absolute;right:14px;top:16px;font-weight:850;font-size:11px;color:#a8b9d2}.raid-name{font-weight:950;font-size:15px;margin-bottom:4px}.raid-sub{font-size:11px;line-height:1.45;color:#a6b8cf}.raid-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding-top:10px;border-top:1px solid rgba(148,172,216,.12);font-size:10px;color:#b5c8e3}.tag{border:1px solid rgba(133,185,211,.3);border-radius:6px;padding:4px 6px;color:#a6e5ed;font-size:9px;letter-spacing:.4px;font-weight:850}
.panel{padding:15px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(15,25,45,.95),rgba(11,17,31,.94));border-radius:17px;margin-bottom:13px}.cta{width:100%;min-height:49px;border:1px solid #e9c77f;border-radius:13px;background:linear-gradient(125deg,#e9ba6e,#ffe0a3);color:#2d1c17;font-size:13px;letter-spacing:1px;font-weight:1000;box-shadow:0 8px 30px rgba(248,185,97,.18);padding:11px 18px}.cta:disabled{box-shadow:none}.cta2{min-height:44px;border:1px solid #437a91;background:#1b384d;border-radius:11px;padding:11px 17px;font-size:12px;font-weight:850}.outline{background:transparent;border:1px solid rgba(151,180,225,.4);border-radius:11px;min-height:42px;padding:9px 14px;font-weight:850;font-size:12px}.footer{margin-top:18px;text-align:center;font-size:10px;letter-spacing:1px;color:#647b9c}.lootrow{display:flex;justify-content:space-between;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid var(--line)}.lootrow:last-child{border:0}.items{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:10px}.item{padding:13px;text-align:left;background:#17253d;border:1px solid #344861;border-radius:14px;min-height:118px}.item.equipped{border-color:#d7ae60;background:linear-gradient(130deg,#24384a,#1e2734)}.item-rarity{font-weight:1000;font-size:9px;letter-spacing:1.4px}.item-name{margin:7px 0;font-size:13px;font-weight:900;line-height:1.35}.item-stats{font-size:11px;line-height:1.6;color:#b3c6dd}.item-top{display:flex;align-items:center;justify-content:space-between}.item-icon{font-size:24px}.eq-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.eqslot{padding:12px;background:rgba(29,47,67,.55);border-radius:12px;border:1px solid #354867;min-height:96px}.eqslot .micro{margin-bottom:9px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:10px}.shop-item{border:1px solid #34516b;border-radius:15px;padding:17px;background:linear-gradient(135deg,#203552,#111b2e)}.potion-orb{font-size:31px;filter:drop-shadow(0 0 12px currentColor);margin-bottom:10px}.shop-item h3{margin:0 0 7px;font-size:16px}.shop-item p{font-size:11px;min-height:54px;line-height:1.6;color:#aec1d7}.price{font-weight:900;color:var(--gold);margin:13px 0}.guide p,.guide li{line-height:1.6;color:#b6c7dc;font-size:12px}.guide h3{font-size:14px;margin:21px 0 5px}.dropmath{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.dropmath>div{background:#15243a;padding:11px;border-radius:10px;font-size:12px}
#combatHud{position:fixed;inset:0;pointer-events:none}#combatHud button{pointer-events:auto}.combat-top{position:absolute;top:max(11px,env(safe-area-inset-top));left:12px;right:12px;display:flex;gap:7px;align-items:flex-start}.player-box,.boss-box{border:1px solid rgba(160,186,230,.23);background:rgba(8,16,34,.83);backdrop-filter:blur(10px);border-radius:12px;padding:10px;min-width:0}.player-box{width:36%;max-width:275px}.boss-box{flex:1}.combat-label{display:flex;justify-content:space-between;gap:8px;font-size:10px;font-weight:900;white-space:nowrap;overflow:hidden}.health{height:8px;border-radius:10px;margin-top:7px;background:#283147;overflow:hidden}.health>i{display:block;height:100%;background:linear-gradient(90deg,#48d69a,#a2ffd9);width:100%;transition:width .12s}.boss-box .health>i{background:linear-gradient(90deg,#d45b74,#ffaf73)}.wave-marker{font-size:10px;color:#b7cce5;margin-top:6px;letter-spacing:.8px}.combat-pause{border-radius:10px;background:rgba(13,25,43,.88);border:1px solid rgba(160,186,230,.32);padding:10px 11px;font-size:18px}.combat-bottom{position:absolute;bottom:max(20px,env(safe-area-inset-bottom));left:14px;right:14px;display:flex;align-items:end;justify-content:space-between}.joystick-guide{width:117px;height:117px;position:relative;opacity:.55;border-radius:100%;border:2px solid rgba(151,198,244,.2);background:radial-gradient(circle,rgba(128,177,221,.07),transparent 70%);display:grid;place-items:center}.joystick-guide:before{content:"";width:54px;height:54px;border-radius:50%;border:2px solid rgba(178,219,250,.2);background:rgba(155,185,230,.13)}.bottom-tip{font-size:10px;color:#b2c7e2;text-align:right;background:rgba(8,16,34,.65);padding:9px 10px;border-radius:9px;letter-spacing:.8px;max-width:143px;line-height:1.6}.actual-joystick{position:fixed;border:2px solid #8fc8e9;background:rgba(82,154,200,.15);height:110px;width:110px;border-radius:100%;transform:translate(-50%,-50%);pointer-events:none;display:none;z-index:11}.actual-stick{position:absolute;left:50%;top:50%;width:46px;height:46px;border-radius:100%;transform:translate(-50%,-50%);background:rgba(130,218,243,.54);box-shadow:0 0 18px #50a9d0;border:2px solid #bef2f7}
#overlay{position:fixed;inset:0;background:rgba(3,7,17,.77);backdrop-filter:blur(11px);z-index:30;display:grid;place-items:center;padding:18px;overflow-y:auto}.dialog{background:linear-gradient(140deg,#1c2945,#0c1529);border:1px solid #536585;box-shadow:0 23px 90px #000a, inset 0 1px #fff1;border-radius:22px;padding:25px;max-width:460px;width:100%;text-align:center;max-height:calc(100dvh - 35px);overflow-y:auto}.dialog h2{font-size:29px;margin:9px 0 7px;line-height:1.1;letter-spacing:-1px}.dialog p{font-size:12px;line-height:1.55;color:#adc0d8}.dialog .micro{margin-top:9px}.dialog .cta{margin-top:14px}.dialog .outline{margin-top:9px;width:100%}.reward-list{display:grid;gap:8px;margin:21px 0 10px}.reward{display:flex;align-items:center;gap:13px;text-align:left;background:#121e34;border-radius:12px;border:1px solid #344d67;padding:11px}.reward .item-icon{font-size:27px;width:35px;text-align:center}.reward b{font-size:12px}.reward span{font-size:11px;color:#a8bcd4}.achievement{display:flex;justify-content:center;gap:8px;align-items:center;color:#91f3e4;background:#19474e;padding:9px;border-radius:11px;font-size:12px;font-weight:900}
#toast{position:fixed;left:50%;top:17%;transform:translate(-50%,-12px);z-index:40;padding:11px 17px;max-width:calc(100% - 36px);pointer-events:none;background:#203b53;border:1px solid #7cc5e3;border-radius:12px;font-size:12px;text-align:center;font-weight:800;box-shadow:0 10px 40px #0008;opacity:0;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%,0)}

/* PATCH 1.1 — Chest illustration and loot reveal. All artwork is local CSS, no external assets. */
.treasure-stage{width:100%;height:242px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(243,204,115,.26);background:radial-gradient(ellipse at 50% 70%,rgba(255,193,94,.16),transparent 68%),linear-gradient(180deg,#101b34,#10192a);border-radius:18px;margin:16px 0 11px;isolation:isolate;touch-action:manipulation;transition:box-shadow .25s,border-color .25s,height .48s ease 1s}
.treasure-stage:disabled{opacity:1;cursor:default}.treasure-stage:not(:disabled):active{transform:scale(.985)}.treasure-stage:focus-visible{outline:3px solid #a1f4f1;outline-offset:3px}
.chest-radiance{position:absolute;inset:-60px;background:repeating-conic-gradient(from 0deg at 50% 53%,rgba(255,218,133,.17) 0deg,transparent 11deg,transparent 23deg);opacity:.4;animation:chestSpin 25s linear infinite;pointer-events:none}
.treasure-illustration{display:block;width:190px;height:128px;position:relative;perspective:650px;filter:drop-shadow(0 12px 20px rgba(3,6,17,.8));transform:translateY(13px);z-index:2}
.chest-body{display:block;position:absolute;top:50px;left:16px;width:158px;height:78px;border-radius:8px 8px 22px 22px;border:4px solid #f0c46f;background:linear-gradient(110deg,#5b2e29,#af6139 26%,#61352b 72%,#2f2638);box-shadow:inset 0 -18px 18px rgba(27,17,30,.48),inset 0 5px 15px #e6a35877;z-index:5;overflow:visible}
.chest-body::before,.chest-body::after{content:"";position:absolute;top:0;bottom:0;width:13px;background:linear-gradient(90deg,#8b552e,#ffdb7e,#8c5328);box-shadow:0 0 6px #fdcc79}.chest-body::before{left:20px}.chest-body::after{right:20px}
.chest-stripe{position:absolute;left:0;right:0;top:23px;height:12px;background:linear-gradient(#ffdc83,#ac6f32);border-top:2px solid #ffe6a3;border-bottom:2px solid #543329}
.chest-lock{position:absolute;left:50%;top:-13px;transform:translateX(-50%);z-index:9;display:grid;place-items:center;width:36px;height:48px;background:linear-gradient(120deg,#ffe9a0,#bc7429);border:3px solid #644126;border-radius:8px;color:#613627;font-size:25px;text-shadow:0 1px #fff4}
.chest-lid{position:absolute;top:25px;left:8px;width:174px;height:55px;border-radius:40px 40px 6px 6px;background:linear-gradient(160deg,#f9c879 0%,#8b4d35 20%,#64332d 70%,#35293b);border:5px solid #e5b064;box-shadow:inset 0 8px 10px #f2c57a5a,0 7px 7px #0006;transform-origin:50% 100%;transform:rotateX(0deg);z-index:6;transition:transform 1s cubic-bezier(.22,.75,.22,1)}
.lid-highlight{position:absolute;inset:13px 25px auto;height:5px;border-radius:20px;background:linear-gradient(90deg,transparent,#ffe4a0,transparent)}
.chest-light{position:absolute;z-index:4;top:44px;left:29px;width:132px;height:20px;background:#ffda87;box-shadow:0 -6px 27px 15px rgba(255,193,74,.55);opacity:0;transition:opacity .35s .48s}
.chest-spark{position:absolute;font-size:27px;line-height:1;color:#ffe7a4;z-index:7;text-shadow:0 0 18px #ffd86b;animation:floatSpark 1.8s ease-in-out infinite}.star-a{top:40px;left:20%}.star-b{top:26px;right:20%;animation-delay:.5s}.star-c{top:78px;right:14%;animation-delay:1.1s}
.chest-instruction{position:relative;z-index:3;font-size:12px;letter-spacing:3px;font-weight:1000;color:#ffe6aa;animation:pulseInvite 1.4s ease-in-out infinite;margin-top:26px}
.treasure-stage.is-opening{height:164px;border-color:#ffe5a1;box-shadow:0 0 48px rgba(255,198,97,.32),inset 0 0 64px rgba(255,198,97,.18)}
.treasure-stage.is-opening .treasure-illustration{transform:scale(.75) translateY(6px)}.treasure-stage.is-opening .chest-lid{transform:translateY(-27px) rotateX(60deg) rotate(-5deg);z-index:3}
.treasure-stage.is-opening .chest-light{opacity:1}.treasure-stage.is-opening .chest-radiance{opacity:.9;animation:chestSpin 3.5s linear infinite}
.treasure-stage.is-opening .chest-spark{animation:burstSpark 1.2s ease-out forwards}.treasure-stage.is-opening .chest-instruction{opacity:0;animation:none}
.reward-enter{opacity:0;transform:translateY(14px) scale(.95);animation:lootReveal .5s ease-out forwards}
@keyframes chestSpin{to{transform:rotate(360deg)}}@keyframes floatSpark{50%{transform:translateY(-11px);opacity:.5}}@keyframes pulseInvite{50%{opacity:.45;letter-spacing:4px}}@keyframes burstSpark{70%{transform:translateY(-65px) scale(2);opacity:1}100%{transform:translateY(-75px) scale(.6);opacity:0}}@keyframes lootReveal{to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.chest-radiance,.chest-spark,.chest-instruction{animation:none!important}.treasure-stage.is-opening .chest-lid{transform:translateY(-27px) rotateX(60deg) rotate(-5deg)}}

@media(max-width:600px){#menu{background:linear-gradient(135deg,rgba(5,10,24,.96),rgba(8,12,26,.83))}.hero{padding:19px 1px 4px}.hero h1{font-size:45px}.hero p{font-size:12px}.statbox{padding:11px 10px}.statvalue{font-size:16px}.stats{gap:6px}.micro{font-size:9px;letter-spacing:1.2px}.raids{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.raid-card{padding:12px;min-height:160px}.raid-level{right:10px;top:13px}.raid-name{font-size:13px}.raid-sub{font-size:10px}.raid-foot{flex-wrap:wrap}.item{min-height:115px}.items{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.item-name{font-size:12px}.item-stats{font-size:10px}.player-box{width:35%;padding:8px}.boss-box{padding:8px}.combat-label{font-size:9px}.wave-marker{font-size:9px}.combat-top{left:7px;right:7px;gap:5px}.combat-pause{padding:9px}.dialog{padding:20px}}
@media(max-width:380px){.hero h1{font-size:39px}.statvalue{font-size:14px}.tab{padding:9px 11px}.raid-card{min-height:168px}.brand{font-size:12px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* PATCH 2: glass-and-metal equipment controls, gilded chest market, legendary celebration */
.item{background:radial-gradient(circle at 85% 7%,rgba(153,198,255,.075),transparent 52%),linear-gradient(142deg,#1b2b45,#111b30);box-shadow:inset 0 1px #ffffff0c,0 10px 23px #0002}
.item-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}
.item-actions button{min-width:0;padding:9px 3px;font-size:10px;font-weight:900;letter-spacing:.2px;border-radius:8px}
.equip-btn{background:linear-gradient(100deg,#28516a,#22415b);border:1px solid #527992;color:#e6f8ff}
.scrap-btn{background:#302d30;border:1px solid #67574d;color:#e9c89f}
.item-actions button:disabled{opacity:.37}
.vault-item{position:relative;overflow:hidden;border-color:color-mix(in srgb,var(--tier-color),#33435b 60%);background:radial-gradient(ellipse at 85% 4%,color-mix(in srgb,var(--tier-color),transparent 88%),transparent 70%),linear-gradient(135deg,#233854,#111b2e)}
.vault-item:before{content:'';position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--tier-color),transparent);opacity:.75}
.vault-icon{font-size:36px;width:55px;height:55px;display:grid;place-items:center;margin-bottom:14px;text-shadow:0 0 22px currentColor;border-radius:14px;background:#ffffff0d;box-shadow:inset 0 1px #ffffff21,0 8px 20px #0003}
.shop-treasure{--chest-highlight:#e7b67f}
.shop-treasure .chest-radiance{filter:hue-rotate(23deg)}
.mega-fx{position:fixed;inset:0;z-index:140;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at center,#e9b95416,transparent 67%);animation:megaBackdrop 3.8s both}
.mega-ray{position:absolute;inset:-65%;background:repeating-conic-gradient(from 0deg,#ffeebd40 0 3deg,transparent 3deg 18deg);animation:megaSpin 10s linear infinite;mix-blend-mode:screen}
.mega-halo{position:absolute;left:50%;top:47%;width:70vmin;height:70vmin;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#fff4b7cc 0,#ffce6e88 14%,#ffb84c28 35%,transparent 69%);box-shadow:0 0 170px 55px #ffd47933;animation:megaPulse 1.7s ease-out both}
.mega-announcement{position:absolute;top:40%;left:50%;width:min(96vw,610px);transform:translate(-50%,-50%);text-align:center;animation:megaText 3.7s both;filter:drop-shadow(0 6px 18px #0008)}
.mega-announcement .mega-mini{font-size:clamp(9px,2.1vw,14px);letter-spacing:3px;font-weight:900;color:#fff2cf}
.mega-announcement strong{display:block;font-size:clamp(44px,11vw,103px);font-weight:1000;letter-spacing:-3px;line-height:1.08;background:linear-gradient(180deg,#fff6da,#ffe0a1,#ffad38);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-stroke:.8px #fff7de66;text-shadow:0 0 80px #ffb64c6b}
.mega-announcement span{font-size:clamp(9px,2vw,14px);font-weight:900;letter-spacing:3px;color:#fff9e4}
.legendary-star{position:absolute;left:var(--sx);top:-6%;width:var(--sz);height:var(--sz);background:radial-gradient(circle,#fff 5%,#fff0aa 40%,#ffb340 76%,transparent 80%);border-radius:50%;box-shadow:0 0 16px #ffe9a5;animation:megaFall 2.1s ease-in var(--delay) both}
@keyframes megaBackdrop{0%{opacity:0}9%{opacity:1}79%{opacity:1}100%{opacity:0}}
@keyframes megaSpin{to{transform:rotate(90deg)}}
@keyframes megaPulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}100%{opacity:.3;transform:translate(-50%,-50%) scale(1.6)}}
@keyframes megaText{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}14%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}24%{transform:translate(-50%,-50%) scale(1)}79%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.04)}}
@keyframes megaFall{0%{opacity:0;transform:translateY(0) scale(.4)}14%{opacity:1}85%{opacity:1}100%{transform:translateY(106vh) scale(.8);opacity:0}}
@media(max-width:500px){.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.shop-item{padding:12px}.shop-item h3{font-size:13px}.shop-item p{min-height:66px;font-size:10px}.shop-item .price{font-size:12px}.vault-icon{font-size:26px;width:44px;height:44px}.item-actions button{font-size:9px}.dialog{padding:17px}}
@media(prefers-reduced-motion:reduce){.mega-ray,.mega-halo,.legendary-star{animation:none!important}.mega-announcement{animation:none!important;opacity:1}.mega-fx{animation:megaBackdrop 2.5s ease-out both}}


/* PATCH 9.0 · THE LONG ASCENT: premium responsive RPG interface */
:root{--line:rgba(168,199,245,.23);--glass:rgba(7,14,31,.86);--radius:20px}
#menu{background:linear-gradient(96deg,rgba(3,8,22,.96),rgba(5,12,29,.84) 65%,rgba(6,13,29,.80)),radial-gradient(ellipse at 80% 7%,#355f7654,transparent 58%)}
.hero{position:relative;padding-top:30px;padding-bottom:20px}
.hero::after{content:'';position:absolute;bottom:0;left:0;width:min(410px,85%);height:1px;background:linear-gradient(90deg,#f9cf8caa,transparent)}
.hero h1{font-weight:1000;letter-spacing:-2.1px;text-shadow:0 3px 20px #020a18}
.hero h1 .glow-text{background:linear-gradient(105deg,#fff2c8,#fac780 55%,#df987e);color:transparent;background-clip:text;-webkit-background-clip:text;text-shadow:none;filter:drop-shadow(0 0 15px #f6b87424)}
.brand-mark{background:radial-gradient(circle at 25% 20%,#7f8fa1,#203f60 45%,#141f37 85%);border-color:#afc2d599;box-shadow:inset 0 1px #fff6,0 0 25px #7cbaff2e}
.statbox,.panel,.player-box,.boss-box{background:linear-gradient(140deg,rgba(33,50,72,.82),rgba(10,18,33,.88));backdrop-filter:blur(14px);border-color:rgba(160,199,250,.24);box-shadow:inset 0 1px #ffffff15,0 13px 32px #00000024}
.raid-card{background:radial-gradient(circle at 100% 0%,rgba(123,191,235,.09),transparent 65%),linear-gradient(140deg,#233854ea,#101c34f3);box-shadow:inset 0 1px #ffffff12,0 12px 26px #00000024;transition:transform .18s,border-color .18s,box-shadow .18s}
.raid-card:before{content:'';position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--raid-bg,#a2cee1),transparent);opacity:.62}
.raid-card.selected{background:radial-gradient(ellipse at 94% 15%,#e4bc7830,transparent 67%),linear-gradient(140deg,#283f53,#161f33);box-shadow:inset 0 1px #ffffff18,0 0 0 1px #d8b47850,0 10px 34px #0006}
.raid-glyph{background:radial-gradient(circle at 35% 25%,#ffffff24,#142036b6),var(--raid-bg,#334a5d);box-shadow:inset 0 1px #ffffff3b,0 6px 15px #0004;border:1px solid #d2e6f536}
.shop-item{background:radial-gradient(ellipse at 100% 0%,rgba(145,184,231,.1),transparent 67%),linear-gradient(145deg,#203652,#101b2f);box-shadow:inset 0 1px #ffffff17,0 14px 22px #0003}
.tab.active{background:linear-gradient(135deg,#345d74,#294d5f);box-shadow:inset 0 1px #ffffff25,0 0 0 1px #74d5e329}
.cta{background:linear-gradient(110deg,#e5aa60,#ffdda2 55%,#f5b66c);box-shadow:inset 0 2px #fff7,0 9px 29px #e6a65b2b;text-shadow:0 1px #ffffff50}
.health{height:10px;background:#131e31;border:1px solid #91b5ce21;box-shadow:inset 0 2px 6px #0008}
.health>i{background:linear-gradient(0deg,#3ca57d,#a1f8d6 55%,#d7fff2);box-shadow:0 0 15px #64f0cb60,inset 0 1px #fff8}
.boss-box .health>i{background:linear-gradient(0deg,#ab3653,#f27980 58%,#ffd09a);box-shadow:0 0 15px #fa667580,inset 0 1px #fff8}
.combat-top{filter:drop-shadow(0 8px 16px #0005)}.combat-pause{backdrop-filter:blur(10px);box-shadow:inset 0 1px #fff2}
.joystick-guide{background:radial-gradient(circle,#b6e0ff12,transparent 75%);border:1px solid #b0ccec52;box-shadow:inset 0 0 25px #a8d8ff10,0 0 24px #83d3fb0b}
.actual-joystick{background:radial-gradient(circle,#93d2fa23,#12283d50);box-shadow:inset 0 0 23px #a2e2ff16,0 0 23px #8bcfff26}
#vignette{background:radial-gradient(ellipse at 50% 46%,transparent 34%,rgba(2,4,13,.65) 100%)}
@media(max-width:600px){.hero{padding-top:25px}.raid-card{min-height:171px}.hero h1{font-size:clamp(40px,11vw,49px)}}

/* PATCH 6 · RPG BEASTFALL */
.hero .eyebrow{color:#c3d6e6;letter-spacing:2.5px}
.brand-mark{font-size:24px;box-shadow:0 8px 30px #437e9b34,inset 0 1px #fff8}
.raid-card:hover{border-color:#c6dbeb7b}
.boss-box{border-left:3px solid rgba(241,188,127,.64)}
.player-box{border-left:3px solid rgba(138,229,203,.64)}
.combat-label{letter-spacing:.3px}
@media(max-width:600px){.combat-label{font-size:9px}.bottom-tip{background:linear-gradient(135deg,#09182ad9,#152338ca)}}

/* PATCH 8.0 — BESTIARY AND WEAPON SHOWCASE */
.p6-weapon-badge{width:47px;height:58px;vertical-align:middle;filter:drop-shadow(0 1px 5px #b0d0ff70);overflow:visible}
.item:has(.p6-mega){background:linear-gradient(135deg,#3a2d38,#1a253b 62%,#383039);border-color:#d9b66f;box-shadow:inset 0 0 28px #ffc2780b,0 0 18px #d6a65b18}
.p6-weapon-badge.p6-mega{width:60px;height:70px;filter:drop-shadow(0 0 10px #ffd17c) drop-shadow(0 0 3px #fff0c0);animation:p6LegendGlow 2.4s ease-in-out infinite alternate}
.p6-loadout-art{display:flex;justify-content:center;padding:0 0 3px}
.p6-loadout-art .p6-weapon-badge{height:70px;width:54px}
.p6-loadout-art .p6-mega{height:82px;width:65px}
@keyframes p6LegendGlow{from{filter:drop-shadow(0 0 5px #e7b768) drop-shadow(0 0 2px #fff)}to{filter:drop-shadow(0 0 16px #ffe18e) drop-shadow(0 0 7px #fff2cc)}}
@media(prefers-reduced-motion:reduce){.p6-weapon-badge.p6-mega{animation:none}}
/* PATCH 8 · switchable rendering quality */
.quality-toggle{border:1px solid #567d87;border-radius:8px;background:linear-gradient(125deg,#0f2639,#233a4c);color:#bceaff;cursor:pointer;font:800 10px/1 system-ui;white-space:nowrap;padding:10px 8px;min-height:36px;min-width:65px}
.quality-toggle[aria-pressed="true"]{border-color:#d6b475;background:#42362a;color:#ffe2a9}
.low-fidelity #vignette{display:none}
.low-fidelity .p6-weapon-badge.p6-mega{animation:none}
@media(max-width:420px){.quality-toggle{min-width:56px;padding:9px 5px;font-size:9px}}

/* PATCH 9.0 — cinematic boss death and physically animated treasure chests */
.treasure-stage{isolation:isolate;transition:height .5s ease,box-shadow .45s ease,border-color .35s ease}
.treasure-stage.is-rattling{border-color:#f4c983;box-shadow:inset 0 0 24px #fbc26d19,0 0 18px #d6a75023}
.treasure-stage.is-rattling .treasure-illustration{animation:chestQuake .80s cubic-bezier(.29,.05,.19,.95) both}
.treasure-stage.is-rattling .chest-lock{animation:lockJiggle .20s ease-in-out infinite alternate}
.treasure-stage.is-rattling .chest-spark{animation:chestCharge .28s ease-in-out infinite alternate}
.treasure-stage.is-rattling .chest-radiance{animation:chestSpin 1.7s linear infinite;opacity:.72}
.treasure-stage.is-rattling .chest-instruction{opacity:0;animation:none}
.treasure-stage.is-opening .treasure-illustration{animation:chestPop .46s ease-out both;transform:scale(.82) translateY(5px)}
.treasure-stage.is-opening .chest-lid{transition:transform .57s cubic-bezier(.12,.9,.2,1.3);transform:translateY(-42px) rotateX(76deg) rotate(-9deg)}
.treasure-stage.is-opening .chest-light{transition:opacity .15s;opacity:1;box-shadow:0 -8px 30px 20px rgba(255,205,104,.63)}
.treasure-stage.is-opening:after{content:"";position:absolute;left:50%;top:38%;width:55px;height:55px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff1c2;box-shadow:0 0 27px #ffd783;animation:chestRing .85s ease-out forwards;pointer-events:none}
#overlay[data-scene="chest"] .dialog,#overlay[data-scene="shopchest"] .dialog{animation:chestSceneEnter .60s cubic-bezier(.2,.75,.2,1) both}
#overlay[data-scene="chest"] .treasure-stage{animation:chestSceneEnter .72s .11s both}
@keyframes chestQuake{0%,100%{transform:translateY(13px) rotate(0deg) scale(1)}8%{transform:translate(-3px,14px) rotate(-2deg)}18%{transform:translate(4px,10px) rotate(2.5deg)}30%{transform:translate(-6px,13px) rotate(-3deg)}44%{transform:translate(5px,8px) rotate(3deg)}56%{transform:translate(-5px,13px) rotate(-3.5deg)}70%{transform:translate(6px,7px) rotate(3.5deg)}84%{transform:translate(-3px,11px) rotate(-2deg)}94%{transform:translate(2px,12px) rotate(1deg)}}
@keyframes lockJiggle{from{transform:translateX(-50%) rotate(-7deg)}to{transform:translateX(-50%) rotate(7deg)}}
@keyframes chestCharge{from{transform:translateY(0) scale(.7);opacity:.55}to{transform:translateY(-9px) scale(1.3);opacity:1}}
@keyframes chestPop{0%{transform:translateY(16px) scale(.78)}38%{transform:translateY(-20px) scale(.96)}80%{transform:translateY(7px) scale(.76)}100%{transform:translateY(5px) scale(.82)}}
@keyframes chestRing{0%{opacity:1;scale:.35}100%{opacity:0;scale:7}}
@keyframes chestSceneEnter{from{opacity:0;transform:translateY(28px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.treasure-stage.is-rattling .treasure-illustration,.treasure-stage.is-rattling .chest-lock,.treasure-stage.is-rattling .chest-spark,.treasure-stage.is-opening .treasure-illustration,#overlay[data-scene="chest"] .dialog,#overlay[data-scene="shopchest"] .dialog,#overlay[data-scene="chest"] .treasure-stage{animation:none!important}}

/* PATCH 9.1 — Level Up Celebration. Does not intercept taps or touch movement. */
#levelCelebration{position:fixed;inset:0;z-index:42;pointer-events:none;opacity:0;visibility:hidden;display:grid;place-items:center;transition:opacity .25s ease,visibility .25s ease;overflow:hidden}
#levelCelebration.active{opacity:1;visibility:visible}
#levelConfetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#levelAura{position:absolute;width:min(96vw,620px);height:min(96vw,620px);border-radius:50%;background:radial-gradient(circle,#ffd88021 0%,#68ccff0f 42%,transparent 67%);opacity:0;transform:scale(.35)}
#levelCelebration.active #levelAura{animation:levelAuraPulse 1.8s ease-out both}
#levelCelebration.milestone #levelAura{background:radial-gradient(circle,#f4c46251 0%,#c17fff20 39%,transparent 71%)}
#levelCard{position:relative;isolation:isolate;width:min(91vw,420px);padding:22px 22px 25px;text-align:center;border:1px solid rgba(241,211,141,.62);background:linear-gradient(142deg,rgba(17,31,57,.95),rgba(31,24,55,.97) 63%,rgba(47,31,45,.93));box-shadow:0 18px 80px #000a,0 0 42px #eebf6860,inset 0 1px #fff4;border-radius:21px;transform:translateY(40px) scale(.75);opacity:0;overflow:hidden}
#levelCelebration.active #levelCard{animation:levelCardAppear .56s cubic-bezier(.17,1.4,.24,1) .06s forwards}
#levelCard::before{content:'';position:absolute;inset:-150%;pointer-events:none;background:conic-gradient(from 0deg,transparent 0 15%,#ffe4a516 19%,transparent 23% 35%,#a0dfff18 39%,transparent 43% 65%,#ffe4a515 69%,transparent 73%);animation:levelHaloSpin 9s linear infinite;z-index:-1}
#levelCard::after{content:'';position:absolute;inset:4px;border:1px solid #ffedb82b;border-radius:16px;pointer-events:none}
#levelKicker{color:#a7e9fa;letter-spacing:4px;font-size:11px;font-weight:900;text-transform:uppercase;text-shadow:0 0 12px #8fcfff55}
#levelBig{font-weight:1000;line-height:.95;font-size:clamp(64px,19vw,92px);letter-spacing:-6px;margin:10px 0 5px;color:#ffdda2;text-shadow:0 5px 0 #966044,0 9px 25px #ffc66c70,0 0 45px #f8d07d55}
#levelTitle{font-size:18px;letter-spacing:3px;font-weight:1000;color:#fff4ce;margin:9px 0 6px}
#levelMeta{font-size:12px;font-weight:750;letter-spacing:1.4px;color:#c7d9f4;line-height:1.6}
#levelSub{font-size:12px;font-weight:850;color:#aaf8d6;line-height:1.55;margin:10px auto 0;max-width:310px}
#levelCelebration.milestone #levelCard{border-color:#ffdd84;box-shadow:0 18px 90px #000c,0 0 54px #f9be63a1,inset 0 1px #fff8}
#levelCelebration.milestone #levelBig{color:#fff0ab;text-shadow:0 5px 0 #956331,0 9px 24px #f6bf70,0 0 55px #ffe6a3}
#levelCelebration.max-level #levelBig{font-size:clamp(70px,22vw,106px)}
@keyframes levelCardAppear{0%{opacity:0;transform:translateY(38px) scale(.74) rotate(-2deg)}65%{opacity:1;transform:translateY(-7px) scale(1.045) rotate(.6deg)}100%{opacity:1;transform:translateY(0) scale(1) rotate(0)}}
@keyframes levelAuraPulse{0%{opacity:0;transform:scale(.35)}28%{opacity:1}100%{opacity:0;transform:scale(1.7)}}
@keyframes levelHaloSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#levelCelebration.active #levelCard{animation:none;opacity:1;transform:none}#levelCelebration.active #levelAura,#levelCard::before{animation:none;opacity:.15}}
@media(max-width:380px){#levelCard{padding:15px 13px 19px}#levelKicker{letter-spacing:2px}#levelTitle{font-size:16px}}


/* PATCH 12 — THE SEVEN TRIALS: PROGRESSIVE ATTACKS, HP BUFF, XP NERF */
/* PATCH 11 — UNIQUE RELIC ABILITIES + VISIBLE RARITY ARMOR */
.relic-power{margin-top:7px;padding:7px 8px;border-radius:9px;border:1px solid #c7a36b73;background:linear-gradient(120deg,#4c382d60,#24374782);font-size:10.5px;line-height:1.55;color:#ffdf9b}
.relic-power b{color:#fff1cf}
.armor-crest{width:48px;height:57px;vertical-align:middle;filter:drop-shadow(0 2px 5px #0007)}
.armor-crest.mega-crest{width:60px;height:70px;filter:drop-shadow(0 0 9px #ffe2a0a0)}
.eqslot .armor-crest{height:76px;width:70px}
.armor-preview{display:flex;align-items:center;justify-content:center;min-height:76px}
.ability-note{color:#e9d7aa;font-size:11px;margin:6px 0 0;line-height:1.55}
/* PATCH 10 — 11 raid-exclusive medieval relics. */
.relic-teaser{margin:-3px 0 12px;padding:8px 10px;border:1px solid #886b48;background:linear-gradient(105deg,#362b2b,#23354a);border-radius:10px;color:#f7ddb0;font-size:11px;line-height:1.55}
.relic-teaser b{color:#ffecbf}.relic-star{color:#ffe08e}
.relic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));gap:8px;margin:10px 0 17px}
.relic-entry{display:flex;align-items:center;gap:9px;text-align:left;border:1px solid #6c5940;border-radius:11px;padding:8px;background:linear-gradient(135deg,#2d2c3b,#202b3e)}
.relic-entry .p6-weapon-badge{width:43px;height:55px;flex:none;animation:none}
.relic-entry b{color:#ffe2a2;font-size:11px;line-height:1.3;display:block}
.relic-entry small{color:#a9bad0;font-size:9px;display:block;margin:4px 0;line-height:1.4}
.relic-entry em{font-size:9px;color:#b7dbcf;line-height:1.35;font-style:normal;display:block}
.reward .p6-weapon-badge{width:45px;height:54px;vertical-align:middle}
.reward .item-icon:has(.p6-weapon-badge){width:52px;flex:none}


/* PATCH 13.0 — themed treasure chests, visible legendary armor codex */
.treasure-stage{--chest-mid:#83513a;--chest-deep:#39212c;--chest-metal:#e7b46b;--chest-light-color:#ffe3a0;--chest-halo:#c4814b}
.treasure-stage .chest-body{border-color:var(--chest-metal);background:linear-gradient(90deg,transparent 7%,#ffffff16 8%,transparent 12%),repeating-linear-gradient(0deg,transparent 0 23px,#130b172a 24px 26px),linear-gradient(112deg,var(--chest-deep) 0%,var(--chest-mid) 27%,var(--chest-deep) 88%);box-shadow:inset 0 -18px 20px #07080f85,inset 0 6px 15px color-mix(in srgb,var(--chest-metal),transparent 62%),0 0 13px color-mix(in srgb,var(--chest-metal),transparent 86%)}
.treasure-stage .chest-lid{border-color:var(--chest-metal);background:linear-gradient(155deg,var(--chest-metal) 0%,var(--chest-mid) 20%,var(--chest-deep) 77%);box-shadow:inset 0 9px 12px color-mix(in srgb,var(--chest-metal),transparent 48%),0 9px 8px #0007}
.treasure-stage .chest-body::before,.treasure-stage .chest-body::after{background:linear-gradient(90deg,var(--chest-deep),var(--chest-metal),var(--chest-deep));box-shadow:0 0 7px color-mix(in srgb,var(--chest-metal),transparent 35%)}
.treasure-stage .chest-stripe{background:linear-gradient(var(--chest-light-color),var(--chest-metal));border-top-color:var(--chest-light-color);border-bottom-color:var(--chest-deep)}
.treasure-stage .chest-lock{background:linear-gradient(120deg,var(--chest-light-color),var(--chest-metal));border-color:var(--chest-deep);color:var(--chest-deep)}
.treasure-stage .chest-light{background:var(--chest-light-color);box-shadow:0 -7px 25px 14px color-mix(in srgb,var(--chest-halo),transparent 25%)}
.treasure-stage .chest-spark{color:var(--chest-light-color);text-shadow:0 0 15px var(--chest-halo)}
.treasure-stage .chest-instruction{color:var(--chest-light-color)}
.treasure-stage{border-color:color-mix(in srgb,var(--chest-metal),transparent 58%);background:radial-gradient(ellipse at 50% 73%,color-mix(in srgb,var(--chest-halo),transparent 67%),transparent 66%),linear-gradient(180deg,#101827,#090f1e)}
.shop-treasure[data-tier="bronze"]{--chest-mid:#965935;--chest-deep:#38231e;--chest-metal:#c88756;--chest-light-color:#edba7d;--chest-halo:#b57042}
.shop-treasure[data-tier="silver"]{--chest-mid:#838c98;--chest-deep:#383e48;--chest-metal:#c5d0d9;--chest-light-color:#f2f7ff;--chest-halo:#8cacc6}
.shop-treasure[data-tier="gold"]{--chest-mid:#c29437;--chest-deep:#63451e;--chest-metal:#ffcf61;--chest-light-color:#fff0ad;--chest-halo:#eabc57}
.shop-treasure[data-tier="platinum"]{--chest-mid:#96b3bd;--chest-deep:#3b5164;--chest-metal:#c5f4ff;--chest-light-color:#f3fcff;--chest-halo:#8fcce2}
.shop-treasure[data-tier="secret"]{--chest-mid:#141522;--chest-deep:#030407;--chest-metal:#6b627c;--chest-light-color:#d9b9ff;--chest-halo:#7858ad}
.shop-treasure[data-tier="secret"] .chest-body{background:repeating-linear-gradient(120deg,transparent 0 20px,#ffffff06 20px 22px),linear-gradient(110deg,#010207,#27283a 29%,#08070d 76%,#010106);box-shadow:inset 0 -18px 24px #000,inset 0 4px 8px #8c7a9a33,0 0 18px #7c55bf25}
.shop-treasure[data-tier="secret"] .chest-lid{background:linear-gradient(160deg,#514565,#12121d 22%,#020307 78%)}
.shop-treasure .chest-radiance{filter:none}
.raid-treasure[data-biome="embers"]{--chest-mid:#98503c;--chest-deep:#352125;--chest-metal:#f1a36d;--chest-light-color:#ffd79a;--chest-halo:#ed764c}
.raid-treasure[data-biome="forest"]{--chest-mid:#376b4b;--chest-deep:#172f25;--chest-metal:#8bd3a2;--chest-light-color:#d1ffbc;--chest-halo:#72b877}
.raid-treasure[data-biome="frost"]{--chest-mid:#648da5;--chest-deep:#243c59;--chest-metal:#a5e1fa;--chest-light-color:#e7fcff;--chest-halo:#89d8f6}
.raid-treasure[data-biome="storm"]{--chest-mid:#7966a4;--chest-deep:#272a55;--chest-metal:#c3aaff;--chest-light-color:#e9d6ff;--chest-halo:#a487e7}
.raid-treasure[data-biome="tide"]{--chest-mid:#397e78;--chest-deep:#15353d;--chest-metal:#6adbd0;--chest-light-color:#dcfff5;--chest-halo:#4ba79f}
.raid-treasure[data-biome="forge"]{--chest-mid:#6f6561;--chest-deep:#332d2e;--chest-metal:#dbad70;--chest-light-color:#ffdea7;--chest-halo:#cb7846}
.raid-treasure[data-biome="void"]{--chest-mid:#594568;--chest-deep:#15101e;--chest-metal:#b791da;--chest-light-color:#ead0ff;--chest-halo:#8762b5}
.raid-treasure[data-biome="sky"]{--chest-mid:#afa17d;--chest-deep:#484255;--chest-metal:#ffe2a0;--chest-light-color:#fff6cf;--chest-halo:#efce80}
.raid-treasure[data-biome="blood"]{--chest-mid:#87334e;--chest-deep:#310f24;--chest-metal:#e88fa9;--chest-light-color:#ffd0e1;--chest-halo:#d34369}
.raid-treasure[data-biome="chaos"]{--chest-mid:#995c3f;--chest-deep:#2e2225;--chest-metal:#f4a66e;--chest-light-color:#ffe6b2;--chest-halo:#d76544}
.raid-treasure[data-biome="eclipse"]{--chest-mid:#405075;--chest-deep:#0a102a;--chest-metal:#a1c7ef;--chest-light-color:#eef7ff;--chest-halo:#8c97d9}
.armor-relic-entry{border-color:color-mix(in srgb,var(--armor-glow),transparent 58%);background:radial-gradient(ellipse at 0% 50%,color-mix(in srgb,var(--armor-glow),transparent 89%),transparent 72%),linear-gradient(135deg,#252b42,#192335);min-height:107px}
.armor-gallery-icon{flex:none;width:66px;display:grid;place-items:center;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--armor-glow),transparent 65%))}
.armor-gallery-icon .armor-crest{height:76px;width:66px}
.armor-relic-entry .small{display:block;margin-top:5px;font-size:9px;line-height:1.4}
.vault-chest-thumb{position:relative;height:56px;width:65px;display:grid;place-items:center;border:2px solid var(--tier-color)!important;border-radius:20px 20px 11px 11px!important;background:linear-gradient(125deg,color-mix(in srgb,var(--tier-color),#26242b 48%),color-mix(in srgb,var(--tier-color),#0c1018 76%))!important;box-shadow:inset 0 4px 10px #fff2,inset 0 -12px 12px #0008,0 10px 18px #0008,0 0 15px color-mix(in srgb,var(--tier-color),transparent 80%)!important;isolation:isolate}
.vault-chest-thumb:before{content:"";position:absolute;top:0;left:0;right:0;height:20px;border-bottom:3px solid var(--tier-color);border-radius:20px 20px 5px 5px;background:linear-gradient(130deg,color-mix(in srgb,var(--tier-color),#fff 18%),color-mix(in srgb,var(--tier-color),#181520 62%));box-shadow:0 4px 7px #0006}
.vault-chest-thumb:after{content:"";position:absolute;top:21px;bottom:1px;left:47%;width:5px;background:linear-gradient(90deg,#0006,var(--tier-color),#0007);border-radius:1px}
.vault-chest-thumb span{position:relative;z-index:2;top:7px;font-size:20px;line-height:1;color:var(--tier-color);text-shadow:0 1px 7px #000,0 0 9px currentColor}
.vault-chest-thumb[data-tier="bronze"]{background:linear-gradient(135deg,#9c6344,#33251f)!important}
.vault-chest-thumb[data-tier="silver"]{background:linear-gradient(135deg,#9ca5b3,#333a46)!important}
.vault-chest-thumb[data-tier="gold"]{background:linear-gradient(135deg,#d5a54c,#614c22)!important}
.vault-chest-thumb[data-tier="platinum"]{background:linear-gradient(135deg,#b6c9d8,#3f5c71)!important}
.vault-chest-thumb[data-tier="secret"]{background:linear-gradient(135deg,#21202b,#020307)!important;border-color:#70627f!important}


/* PATCH 14 — MONSTER HUNTER EMPTY SKILL HUB */
.tab[data-tab="hunter"]{border-color:#4d7b6f;color:#a4e7ce}
.tab[data-tab="hunter"].active{background:linear-gradient(130deg,#244c47,#183d46);border-color:#74c9ad;color:#f0fffa}
.hunter-hero{position:relative;overflow:hidden;border:1px solid #477c70;border-radius:19px;padding:21px 18px;background:radial-gradient(ellipse at 91% 10%,rgba(90,203,165,.21),transparent 47%),linear-gradient(135deg,#182e37,#111b32 72%);box-shadow:inset 0 1px #b6ffe31b}
.hunter-hero-glow{position:absolute;right:10px;top:-36px;font-size:150px;line-height:1;color:#88edc5;opacity:.06;pointer-events:none;transform:rotate(-17deg)}
.hunter-hero>.micro{color:#a1ebcb}
.hunter-level-row{display:flex;align-items:center;gap:15px;margin:16px 0 14px}
.hunter-level-disc{display:flex;flex:none;width:91px;height:91px;align-items:center;justify-content:center;flex-direction:column;border-radius:50%;border:2px solid #90e8c1;background:radial-gradient(circle at 37% 26%,#385a58,#1a303e 65%,#10192c);box-shadow:inset 0 0 20px #70e9be32,0 0 25px #50dca72a}
.hunter-level-disc span{font-size:9px;font-weight:900;letter-spacing:3px;color:#bfe8d9}
.hunter-level-disc strong{font-size:37px;line-height:1.1;color:#fff7cc;font-weight:950}
.hunter-xp-block{flex:1;min-width:0}
.hunter-rank{font-size:15px;font-weight:950;letter-spacing:1px;margin-bottom:5px;color:#edfff5}
.hunter-progress{height:9px;margin:10px 0 6px;border:1px solid #396454;background:#101e29;border-radius:15px;overflow:hidden}
.hunter-progress i{display:block;height:100%;background:linear-gradient(90deg,#5ec49e,#c9f8bd);box-shadow:0 0 10px #79dbaf80;transition:width .2s}
.hunter-hero p{margin:10px 0 0;font-size:12px;line-height:1.65;color:#bbd1cd;max-width:590px}
.hunter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.hunter-tile{background:#142839b8;border:1px solid #35585e;border-radius:14px;padding:15px;min-width:0}
.hunter-tile strong{display:block;font-size:25px;font-weight:950;color:#daffe7;margin:7px 0}
.hunter-tile strong.hunter-none{font-size:19px;color:#aabec9}
.hunter-tile .small{line-height:1.4}
.hunter-empty{border:1px dashed #5b877e;border-radius:18px;padding:24px 16px;text-align:center;background:linear-gradient(145deg,rgba(21,42,49,.88),rgba(15,26,44,.89));min-height:218px}
.hunter-empty-glyph{font-size:39px;color:#89d7ad;opacity:.75;filter:drop-shadow(0 0 10px #6ce3aa4d)}
.hunter-empty h3{font-size:16px;letter-spacing:1px;margin:10px 0}
.hunter-empty p{font-size:12px;line-height:1.7;color:#b5c8d7;max-width:480px;margin:0 auto 16px}
.hunter-locked{font-size:10px;letter-spacing:1.3px;font-weight:850;color:#b5e3ca;border:1px solid #477369;border-radius:10px;padding:12px;display:inline-block;background:#28514855}
.hunter-next{margin-top:13px}
.hunter-next p{margin:10px 0 0;line-height:1.6}
/* Keep every menu accessible on a small touchscreen; avoid hiding SHOP offscreen. */
@media(max-width:680px){.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;overflow:visible}.tabs .tab{white-space:normal;min-height:43px;font-size:10px;padding:9px 6px;letter-spacing:.05px}}
@media(max-width:380px){.hunter-level-disc{width:77px;height:77px}.hunter-level-disc strong{font-size:30px}.hunter-level-row{gap:11px}.hunter-rank{font-size:12px}.hunter-tile{padding:11px}.hunter-tile .micro{font-size:9px}}


/* PATCH 15 — Goblin Knight hunt, exotic helm slot and hunt rewards */
.hunter-boss-card{border:1px solid #67976e;border-radius:18px;padding:17px;background:radial-gradient(ellipse at 96% 8%,rgba(127,211,100,.16),transparent 52%),linear-gradient(135deg,#1f3840,#142436 75%);display:grid;grid-template-columns:76px minmax(0,1fr);gap:13px;align-items:center}
.goblin-portrait{width:76px;height:88px;display:grid;place-items:center;background:radial-gradient(ellipse,#416e4b,#182b34 72%);border:1px solid #648e76;border-radius:14px;overflow:hidden}
.goblin-portrait svg{width:75px;height:85px;filter:drop-shadow(0 5px 7px #0009)}
.hunter-boss-card h3{font-size:17px;margin:0 0 6px;color:#e8ffd7}
.hunter-boss-card p{font-size:11px;line-height:1.5;color:#b5cdd0;margin:0 0 7px}
.hunter-boss-card .small{font-size:10px;line-height:1.5}
.hunter-drop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:12px 0}
.hunter-drop-grid>div{background:#15283c;border:1px solid #3d5962;border-radius:11px;padding:10px 7px;text-align:center}
.hunter-drop-grid b{display:block;color:#e6fff0;font-size:14px;margin-top:4px}
.exotic-tag{color:#ffbb82;font-weight:900;letter-spacing:1.2px}
.helm-icon{display:inline-block;width:56px;height:55px;vertical-align:middle;filter:drop-shadow(0 3px 6px #0008)}
.eqslot .helm-icon{height:80px;width:80px}
.item .helm-icon{height:58px;width:58px}
.exotic-reward{border:1px solid #ffab65!important;background:linear-gradient(130deg,#473327,#242a40)!important;box-shadow:0 0 35px #e68b4630}
@media(max-width:400px){.hunter-boss-card{grid-template-columns:60px minmax(0,1fr);gap:10px;padding:12px}.goblin-portrait{width:60px;height:75px}.goblin-portrait svg{width:59px;height:74px}.hunter-boss-card h3{font-size:15px}}
/* PATCH 17 — Sorcerer, exotic magic cape, class tags */
.hunter-boss-card.sorcerer{border-color:#a387d7;background:radial-gradient(ellipse at 98% 8%,#9671d832,transparent 53%),linear-gradient(135deg,#302342,#142438 80%)}
.hunter-boss-card.sorcerer h3{color:#ead9ff}.hunter-boss-card.locked-boss{opacity:.75}
.hunter-boss-card.locked-boss .cta{background:#4c526d;color:#c2c4d3}
.cape-icon{display:inline-block;width:62px;height:72px;vertical-align:middle;filter:drop-shadow(0 3px 8px #9f72d04b)}
.item .cape-icon{width:58px;height:62px}.eqslot .cape-icon{width:88px;height:90px}
.weapon-class-tag{display:inline-block;color:#d9caff;border:1px solid #675b89;padding:3px 7px;border-radius:7px;font-size:10px;font-weight:850;letter-spacing:.06em;margin-top:5px}
.hunter-portrait-sorcerer{width:76px;height:88px;display:grid;place-items:center;border:1px solid #765b9c;border-radius:14px;background:radial-gradient(ellipse at 50% 38%,#684d95,#1c203b 75%);font-size:45px;color:#efd7ff;text-shadow:0 0 16px #ce82ff}
@media(max-width:400px){.hunter-portrait-sorcerer{width:60px;height:75px;font-size:36px}}

/* PATCH 18 — CRAFTING FORGE */
.craft-hero{position:relative;overflow:hidden;padding:22px;border:1px solid #bfa46f66;border-radius:20px;background:radial-gradient(ellipse at 93% 16%,#c78b3a26,transparent 55%),linear-gradient(145deg,#283445,#111b30 74%);box-shadow:inset 0 1px #ffebc92a,0 16px 38px #0003}
.craft-hero:after{content:'✧';position:absolute;right:16px;top:-23px;color:#ffdb9750;font-size:135px;pointer-events:none}
.craft-title{font-size:clamp(24px,5vw,36px);line-height:1.03;margin:6px 0 9px;letter-spacing:-1px;color:#fff1cf;font-weight:950}
.craft-lvl-row{display:flex;align-items:center;gap:13px;margin-top:17px;position:relative;z-index:1}
.craft-lvl-disc{flex:none;width:66px;height:66px;display:grid;place-items:center;align-content:center;border-radius:16px;border:1px solid #e9be748e;background:radial-gradient(circle at 32% 22%,#8d6339,#302536 72%);box-shadow:0 0 20px #ffb96224}
.craft-lvl-disc span{font-size:10px;letter-spacing:1.5px;color:#f5d2a0;font-weight:850}.craft-lvl-disc strong{font-size:29px;line-height:1;color:#fff2cf}
.craft-progress-area{flex:1;min-width:0}.craft-progress{width:100%;height:9px;border:1px solid #deb2765a;background:#18243b;border-radius:30px;overflow:hidden;margin:9px 0 5px}.craft-progress > i{display:block;height:100%;background:linear-gradient(90deg,#bb7656,#f6bd6b,#ffe4a3);box-shadow:0 0 12px #ffcd76}
.material-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:15px 0 19px}.material-tile{border:1px solid #9fb4db35;background:linear-gradient(140deg,#293548,#121d31);border-radius:15px;padding:15px 11px;text-align:center;min-width:0}
.material-icon{display:grid;place-items:center;width:49px;height:49px;margin:0 auto 8px;background:radial-gradient(circle,#a9b8cf21,#15213a);border:1px solid #97adcf4a;border-radius:13px;font-size:29px}.material-icon.scrap{color:#d7b994}.material-icon.essence{color:#98e8f9}.material-icon.key{color:#ffe2a0}
.material-tile strong{display:block;font-size:clamp(17px,3vw,25px);color:#fff;font-weight:950;overflow-wrap:anywhere}.material-tile .micro{letter-spacing:.9px}.material-tile p{font-size:10px;color:#9eb0c9;margin:7px 0 0}
.recipe-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.recipe-card{background:radial-gradient(ellipse at 95% 8%,#cda76213,transparent 55%),linear-gradient(140deg,#203049,#101d32);border:1px solid #95aacc44;border-radius:19px;padding:18px;min-width:0}
.recipe-card.key-recipe{border-color:#c7a06d7d}.recipe-card.essence-recipe{border-color:#80c7e175}.recipe-header{display:flex;align-items:center;gap:11px}.recipe-header .material-icon{margin:0;flex-shrink:0;width:51px;height:51px}.recipe-card h3{margin:0;color:#fff5df;font-size:19px}.recipe-steps{margin:16px 0;padding:12px;border-radius:11px;background:#091a2bb8;display:flex;align-items:center;justify-content:center;gap:11px;font-weight:900;color:#dce5f4}.recipe-steps b{font-size:20px;color:#ffe1a0}.recipe-actions{display:grid;gap:8px}.recipe-actions button{width:100%;min-height:43px}.recipe-card input{min-width:0;width:100%;border:1px solid #7897b366;background:#0b182a;color:#fff;border-radius:10px;padding:11px 13px;font:inherit;font-weight:750;outline:none}.recipe-card input:focus{border-color:#efc27c}.craft-recipe-info{font-size:11px;line-height:1.5;color:#b0bed5;margin:8px 0 13px}
.craft-footnote{font-size:11px;color:#a8b7cb;line-height:1.6;border-top:1px solid #98acc12c;padding:13px 2px 4px;margin-top:20px}
@media(max-width:650px){.recipe-grid{grid-template-columns:1fr}.material-grid{gap:6px}.material-tile{padding:10px 5px}.material-icon{width:42px;height:42px;font-size:24px}.material-tile .micro{font-size:8px}.craft-hero{padding:17px}.recipe-card{padding:15px}}

/* PATCH 19 — THE UPGRADE MERCHANT */
.tab[data-tab="merchant"]{border-color:#9d78ab;color:#efceff}.tab[data-tab="merchant"].active{background:linear-gradient(125deg,#563d70,#26354b);border-color:#d9a6ed;color:white}
.merchant-hero{position:relative;overflow:hidden;border:1px solid #b891d577;border-radius:20px;background:radial-gradient(circle at 88% 13%,#925dd833,transparent 57%),linear-gradient(145deg,#29233e,#101d32);padding:21px;box-shadow:inset 0 1px #fff2,0 13px 38px #0003}
.merchant-hero:before{content:'◈';position:absolute;right:8px;top:-32px;color:#b783dc17;font-size:170px;line-height:1;pointer-events:none}
.merchant-portrait{display:grid;place-items:center;background:radial-gradient(circle at 50% 32%,#594574,#1c1c31 75%);border:1px solid #b997d277;border-radius:16px;min-width:81px;width:81px;height:93px;box-shadow:0 0 18px #9e61cd33}
.merchant-portrait svg{width:76px;height:86px}.merchant-heading{display:flex;gap:14px;align-items:center;position:relative}
.merchant-hero h2{font-size:clamp(23px,4.8vw,34px);margin:1px 0 5px;color:#f6e6ff}.merchant-hero p{font-size:12px;line-height:1.7;color:#c9bed9;margin:12px 0 0;max-width:640px;position:relative}
.merchant-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0}.merchant-stat{background:#141e34;border:1px solid #9d86b14d;padding:12px 8px;border-radius:12px;text-align:center}.merchant-stat strong{font-size:19px;display:block;color:#f7eaff;margin:4px 0}.merchant-stat .micro{font-size:9px;letter-spacing:.8px}
.merchant-card{background:linear-gradient(145deg,#243047,#111b2e);border:1px solid #906bad75;border-radius:17px;padding:17px;margin:13px 0}.merchant-card h3{color:#f6e7ff;margin:0 0 9px;font-size:17px}.merchant-rule{font-size:12px;color:#bdcadd;line-height:1.7}.merchant-rule b{color:#fbe3b0}.merchant-item{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid #687c9960;background:#111c32;border-radius:13px;margin:9px 0;min-width:0}.merchant-item .item-icon{flex:none;width:62px;min-width:62px}.merchant-item-body{flex:1;min-width:0}.merchant-item-body b{color:#f5f0ff}.merchant-item-body .small{line-height:1.55}.merchant-item .outline{width:auto;flex:none;max-width:110px;padding:9px 10px;font-size:10px}.merchant-item .outline:disabled{opacity:.45}
.merchant-recipe{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:7px;background:#0d192e;border-radius:12px;border:1px solid #896eaf55;padding:12px;text-align:center;color:#ffe0b1;font-size:12px;font-weight:850;margin:13px 0}.merchant-recipe span{min-width:0}.merchant-shard{font-size:29px;color:#d7bcff;filter:drop-shadow(0 0 7px #c68dff77)}
@media(max-width:530px){.merchant-hero{padding:15px}.merchant-heading{gap:10px}.merchant-portrait{min-width:66px;width:66px;height:77px}.merchant-portrait svg{width:62px;height:70px}.merchant-trio{gap:5px}.merchant-stat{padding:10px 4px}.merchant-stat strong{font-size:16px}.merchant-item{flex-wrap:wrap}.merchant-item .outline{width:100%;max-width:none}.merchant-recipe{font-size:10px}}

/* PATCH 20 · The Vanity Vault: distinct cosmetics inventory and vivid preview art. */
.armory-switch{display:flex;gap:9px;margin:8px 0 17px;flex-wrap:wrap}
.armory-switch button{flex:1;min-height:41px;font-weight:800;font-size:12px}
.armory-switch .selected{border-color:#f4d18f;background:linear-gradient(130deg,#574c40,#263449);color:#fff5da;box-shadow:0 0 0 1px #e9c98755}
.cosmetic-intro{padding:14px 16px}.cosmetic-intro p{font-size:12px;line-height:1.6;color:#c6d9e8;margin:0}
.cosmetic-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 22px}
.cosmetic-slot{min-width:0;border:1px solid #6d819f55;border-radius:16px;padding:12px 10px;text-align:center;background:radial-gradient(ellipse at top,#6586b01a,transparent 75%),#122036}
.cosmetic-slot .micro{font-size:9px;letter-spacing:.4px;color:#bcd6e9}.cosmetic-slot b{display:block;min-height:32px;font-size:11px;margin:6px 0}.cosmetic-slot .small{font-size:10px;min-height:27px}.cosmetic-slot .mini{font-size:10px;padding:7px 11px;margin-top:9px}
.cosmetic-center{height:82px;display:grid;place-items:center}.cosmetic-symbol{width:70px;max-height:75px;filter:drop-shadow(0 3px 7px #0009)}.cosmetic-empty{font-size:43px;color:#698099}
.cosmetic-inventory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.cosmetic-item{min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center;gap:7px;padding:16px 10px;border:1px solid #7993ae55;border-radius:17px;background:radial-gradient(ellipse at top,color-mix(in srgb,var(--vanity),transparent 85%),transparent 80%),linear-gradient(145deg,#1c3047,#121e30)}
.cosmetic-item b{font-size:12px;min-height:30px;line-height:1.35}.cosmetic-item .small{font-size:10px;line-height:1.4;min-height:29px}
.cosmetic-item .cta2{width:100%;font-size:10px;min-height:37px;margin-top:auto}.cosmetic-card-icon{height:76px;display:grid;place-items:center}.cosmetic-card-icon .cosmetic-symbol{width:76px}
.cosmetic-grade{font-size:9px;letter-spacing:1.4px;font-weight:900}
.cosmetic-item.cosmetic-exotic{border-color:#d9ac678c;box-shadow:inset 0 0 24px #f8c57c17,0 0 16px #ecc27316}
.cosmetic-item.cosmetic-exotic .cosmetic-symbol{filter:drop-shadow(0 0 10px var(--vanity-light))}
.cosmetic-worn{border-color:#8bebb0;box-shadow:inset 0 0 18px #88f1bd16}
.cosmetic-placeholder{text-align:center;padding:29px 20px}.cosmetic-placeholder-glyph{font-size:48px;color:#dcbaff}.cosmetic-placeholder h3{margin:7px 0}.cosmetic-placeholder .cta{margin-top:11px}
.cosmetic-reward .item-icon .cosmetic-symbol{width:45px;height:56px}
@media(max-width:700px){.cosmetic-slots{grid-template-columns:repeat(2,minmax(0,1fr))}.cosmetic-inventory{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:380px){.cosmetic-slot{padding:12px 6px}.cosmetic-item{padding:12px 6px}.armory-switch button{font-size:10px}}
@media(prefers-reduced-motion:reduce){.cosmetic-exotic .cosmetic-symbol{animation:none}}

