@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:500;src:url(./baloo-2-vietnamese-500-normal-rLqq2XPH.woff2) format("woff2"),url(./baloo-2-vietnamese-500-normal-DgJjC7NG.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(./baloo-2-vietnamese-800-normal-B2_QCtDx.woff2) format("woff2"),url(./baloo-2-vietnamese-800-normal-DCpNSe5E.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:500;src:url(./baloo-2-latin-500-normal-sFC1aiE7.woff2) format("woff2"),url(./baloo-2-latin-500-normal-DkLneO2S.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(./baloo-2-latin-800-normal-CJQCPmFU.woff2) format("woff2"),url(./baloo-2-latin-800-normal-BMumZxsR.woff) format("woff")}:root{--u: 1px;--hu: 1px;--frame-w: 100vw;--gold: #ffd76a;--gold2: #f2a73b;--ink: #1a1024;--panel: #1d1a2b;--text: #f3eadb;--muted: #b8a9c9;--green: #5ee07a;--red: #ff5b4f;--blue: #6ec9ff;--font: "Baloo 2", "Segoe UI", Tahoma, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:#0d0a14;overflow:hidden;touch-action:none;overscroll-behavior:none}body{font-family:var(--font);color:var(--text);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#app{position:fixed;inset:0}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#ui-root{position:absolute;inset:0;pointer-events:none}#ui-root>*{pointer-events:auto}#ui-root>.modal-root,#ui-root>.toast-root{pointer-events:none}img{-webkit-user-drag:none}button{font-family:inherit}.backdrop{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(14px) brightness(.45);transform:scale(1.1)}.frame{position:absolute;top:0;bottom:0;left:50%;width:var(--frame-w);transform:translate(-50%);overflow:hidden;font-size:calc(26 * var(--u))}.screen{position:absolute;inset:0;display:flex;flex-direction:column}.btn{position:relative;border:0;cursor:pointer;color:#fff;font-weight:800;font-size:calc(28 * var(--u));line-height:1;min-width:calc(200 * var(--u));height:calc(84 * var(--u));padding:0 calc(26 * var(--u));background:center / 100% 100% no-repeat;text-shadow:0 2px 0 rgba(0,0,0,.55),0 0 6px rgba(0,0,0,.5);transition:transform .08s,filter .15s;display:inline-flex;align-items:center;justify-content:center;gap:calc(8 * var(--u))}.btn:active{transform:scale(.94)}.btn.disabled{filter:grayscale(1) brightness(.75)}.btn-yellow{background-image:url(../assets/ui/main/btn_yellow.webp);color:#fff8e0}.btn-green{background-image:url(../assets/ui/main/btn_green.webp)}.btn-red{background-image:url(../assets/ui/main/btn_red.webp)}.btn-gray{background-image:url(../assets/ui/main/btn_yellow.webp);filter:grayscale(1) brightness(.85)}.btn-get{background-image:url(../assets/ui/main/btn_get.webp);min-width:calc(150 * var(--u));height:calc(70 * var(--u));font-size:calc(24 * var(--u))}.btn-goto{background-image:url(../assets/ui/main/btn_goto.webp);min-width:calc(150 * var(--u));height:calc(70 * var(--u));font-size:calc(24 * var(--u))}.btn.wide{min-width:calc(320 * var(--u))}.btn.small{min-width:calc(130 * var(--u));height:calc(62 * var(--u));font-size:calc(22 * var(--u));padding:0 calc(14 * var(--u))}.btn .cost{display:inline-flex;align-items:center;gap:2px;font-size:.85em}.btn .cost img{height:1.2em}.img-btn{position:relative;background:none;border:0;padding:0;cursor:pointer;transition:transform .08s;display:inline-flex;flex-direction:column;align-items:center}.img-btn:active{transform:scale(.92)}.img-btn img{display:block;height:100%;width:auto}.img-btn-label{position:absolute;bottom:-2px;left:50%;transform:translate(-50%);white-space:nowrap;font-size:calc(20 * var(--u));font-weight:800;color:#fff;text-shadow:0 0 4px #000,0 2px 0 #000}.red-dot{position:absolute;top:4%;right:6%;width:calc(18 * var(--u));height:calc(18 * var(--u));border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff9b8d,#e0221b);box-shadow:0 0 0 2px #2a0b0b;z-index:2}.gold{color:var(--gold);text-shadow:0 2px 0 #4a2300,0 0 8px rgba(255,190,60,.35)}.muted{color:var(--muted)}.green{color:var(--green)}.red{color:var(--red)}.title-xl{font-size:calc(46 * var(--u));font-weight:800}.title-l{font-size:calc(34 * var(--u));font-weight:800}.t-s{font-size:calc(20 * var(--u))}.t-m{font-size:calc(24 * var(--u))}.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}.center{justify-content:center}.between{justify-content:space-between}.gap{gap:calc(16 * var(--u))}.gap-s{gap:calc(8 * var(--u))}.grow{flex:1}.wrap{flex-wrap:wrap}.scroll{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#6b5a86 transparent}.scroll::-webkit-scrollbar{width:6px}.scroll::-webkit-scrollbar-thumb{background:#6b5a86;border-radius:3px}.item-cell{position:relative;width:calc(104 * var(--u));height:calc(104 * var(--u));flex:none;cursor:pointer}.item-cell.small{width:calc(76 * var(--u));height:calc(76 * var(--u))}.item-frame{position:absolute;inset:0;width:100%;height:100%}.item-icon{position:absolute;inset:12%;width:76%;height:76%;object-fit:contain}.item-n{position:absolute;right:8%;bottom:4%;font-size:calc(20 * var(--u));font-weight:800;text-shadow:0 0 3px #000,0 1px 0 #000,1px 0 0 #000,-1px 0 0 #000}.item-cell.small .item-n{font-size:calc(16 * var(--u))}.item-lv{position:absolute;left:8%;top:4%;font-size:calc(17 * var(--u));font-weight:800;color:#fff;text-shadow:0 0 3px #000}.item-cell.equipped:after{content:"Đang mặc";position:absolute;left:0;right:0;top:-2px;text-align:center;font-size:calc(14 * var(--u));color:#9ff7a8;text-shadow:0 0 3px #000}.item-cell.selected{outline:3px solid var(--gold);border-radius:12%}.item-cell .lock{position:absolute;left:4%;bottom:4%;width:26%}.bar{position:relative;height:calc(22 * var(--u));border-radius:999px;background:#0a0610cc;box-shadow:inset 0 0 0 2px #0009,0 0 0 1px #ffffff1f;overflow:hidden}.bar-fill{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;transition:width .2s}.bar-green .bar-fill{background:linear-gradient(#8bff8f,#23b343)}.bar-gold .bar-fill{background:linear-gradient(#ffe68f,#e59a23)}.bar-blue .bar-fill{background:linear-gradient(#a9e6ff,#2c8fe0)}.bar-red .bar-fill{background:linear-gradient(#ff9a8a,#d0231b)}.bar-purple .bar-fill{background:linear-gradient(#e0b8ff,#8a3fe0)}.bar-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:calc(16 * var(--u));font-weight:800;text-shadow:0 0 3px #000,0 1px 0 #000}.res-chip{position:relative;display:flex;align-items:center;height:calc(46 * var(--u));padding:0 calc(10 * var(--u)) 0 calc(46 * var(--u));min-width:calc(120 * var(--u));background:#08050eb8;border-radius:999px;box-shadow:inset 0 0 0 2px #ffd76a40;font-weight:800;font-size:calc(22 * var(--u))}.res-icon{position:absolute;left:calc(-4 * var(--u));top:50%;transform:translateY(-50%);height:calc(52 * var(--u));width:calc(52 * var(--u));object-fit:contain}.res-n{flex:1;text-align:center}.res-plus{margin-left:4px;width:calc(30 * var(--u));height:calc(30 * var(--u));border-radius:50%;border:0;background:linear-gradient(#8bff8f,#23a33c);color:#fff;font-weight:900;font-size:calc(22 * var(--u));line-height:1;padding:0;cursor:pointer}.modal-root{position:absolute;inset:0;pointer-events:none;z-index:50}.modal-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:auto;animation:fadeIn .16s ease-out}.modal-wrap.closing{animation:fadeOut .16s ease-in forwards}.modal-dim{position:absolute;inset:0;background:#05020ab8}.modal-panel{position:relative;width:min(calc(var(--frame-w) * .94),calc(680 * var(--u)));max-height:92vh;display:flex;flex-direction:column;background:linear-gradient(#2a2340,#171326);border-radius:calc(26 * var(--u));box-shadow:0 0 0 3px #6b5a86,0 0 40px #000c;padding:calc(80 * var(--u)) calc(30 * var(--u)) calc(34 * var(--u));animation:popIn .22s cubic-bezier(.2,1.4,.4,1);font-size:calc(24 * var(--u));color:var(--text)}.modal-panel.small{width:min(calc(var(--frame-w) * .9),calc(580 * var(--u)))}.modal-panel.wide{width:min(96vw,calc(700 * var(--u)))}.modal-panel.dark{background:linear-gradient(#2a2340,#171326);border-radius:calc(26 * var(--u));box-shadow:0 0 0 3px #6b5a86,0 0 40px #000c;color:var(--text);padding-top:calc(80 * var(--u))}.modal-panel.reward{background:none;color:var(--text)}.modal-bare{position:relative;animation:popIn .22s cubic-bezier(.2,1.4,.4,1)}.modal-body{overflow-y:auto;overflow-x:hidden;min-height:0;touch-action:pan-y}.modal-title{position:absolute;top:calc(-10 * var(--u));left:50%;transform:translate(-50%);width:calc(393 * var(--u));height:calc(108 * var(--u));background:url(../assets/ui/main/bg_title.webp) center / contain no-repeat;display:flex;align-items:center;justify-content:center;font-size:calc(32 * var(--u));font-weight:800;color:var(--gold);text-shadow:0 2px 0 #3a1a00,0 0 6px #000;white-space:nowrap}.modal-title-img{position:absolute;top:calc(-60 * var(--u));left:50%;transform:translate(-50%);width:calc(460 * var(--u))}.modal-title-img img{width:100%}.modal-close{position:absolute;top:calc(6 * var(--u));right:calc(2 * var(--u));width:calc(70 * var(--u));height:calc(70 * var(--u));z-index:3}.modal-panel.dark .modal-close{top:calc(10 * var(--u));right:calc(10 * var(--u))}.confirm{text-align:center;padding:calc(10 * var(--u)) 0}.confirm-msg{font-size:calc(26 * var(--u));margin:calc(10 * var(--u)) 0 calc(30 * var(--u));line-height:1.4}@keyframes popIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fadeIn{0%{opacity:0}}@keyframes fadeOut{to{opacity:0}}.reward-pop{display:flex;flex-direction:column;align-items:center;gap:calc(30 * var(--u));padding-top:calc(70 * var(--u))}.reward-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(18 * var(--u));max-width:calc(600 * var(--u))}.reward-item{display:flex;flex-direction:column;align-items:center;width:calc(116 * var(--u));animation:popIn .3s backwards}.reward-item:nth-child(2){animation-delay:.05s}.reward-item:nth-child(3){animation-delay:.1s}.reward-item:nth-child(4){animation-delay:.15s}.reward-item:nth-child(5){animation-delay:.2s}.reward-name{font-size:calc(18 * var(--u));text-align:center;margin-top:4px;text-shadow:0 1px 2px #000;line-height:1.15}.toast-root{position:absolute;left:0;right:0;top:22%;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;z-index:80}.toast{padding:calc(12 * var(--u)) calc(30 * var(--u));background:#0a0610d9;border-radius:999px;box-shadow:0 0 0 2px #ffd76a66;font-size:calc(24 * var(--u));font-weight:700;animation:popIn .2s;transition:opacity .35s,transform .35s;max-width:90vw;text-align:center}.toast.out{opacity:0;transform:translateY(-20px)}.loading-screen{background:#0d0a14 center / cover no-repeat;align-items:center;justify-content:flex-end;padding-bottom:calc(120 * var(--u))}.game-logo{position:absolute;top:9%;left:0;right:0;text-align:center}.game-logo .l1{font-size:calc(92 * var(--u));font-weight:800;line-height:.95;color:#fff3c4;letter-spacing:1px;text-shadow:0 4px 0 #7a2a00,0 8px 0 #3a1000,0 0 30px rgba(255,140,40,.6);-webkit-text-stroke:2px #5b1c00}.game-logo .l2{margin-top:calc(10 * var(--u));font-size:calc(30 * var(--u));color:#d9c7ff;text-shadow:0 2px 4px #000;letter-spacing:3px}.load-bar{width:78%;height:calc(28 * var(--u))}.load-tip{margin-top:calc(16 * var(--u));font-size:calc(22 * var(--u));color:var(--muted);text-shadow:0 1px 2px #000;text-align:center;padding:0 8%;min-height:2.6em}.start-btn{width:calc(400 * var(--u));animation:pulse 1.6s infinite}.start-btn img{width:100%;height:auto}@keyframes pulse{50%{transform:scale(1.05);filter:brightness(1.15)}}.home{background:#0d0a14 center top / cover no-repeat}.topbar{display:flex;align-items:center;gap:calc(12 * var(--u));padding:calc(14 * var(--u)) calc(16 * var(--u)) calc(6 * var(--u));padding-top:max(calc(14 * var(--u)),env(safe-area-inset-top))}.avatar{position:relative;width:calc(96 * var(--u));height:calc(96 * var(--u));flex:none;cursor:pointer}.avatar img.head{position:absolute;inset:6%;width:88%;height:88%;border-radius:50%;object-fit:cover}.avatar img.ring{position:absolute;inset:0;width:100%;height:100%}.power{display:flex;flex-direction:column;min-width:0}.power .realm{font-size:calc(20 * var(--u));color:#d7c4ff;white-space:nowrap}.power .num{font-size:calc(30 * var(--u));font-weight:800;color:var(--gold);text-shadow:0 2px 0 #3a1a00;line-height:1.05}.res-row{display:flex;gap:calc(20 * var(--u));margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.home-body{position:relative;flex:1;min-height:0}.side-btns{position:absolute;top:calc(10 * var(--u));display:flex;flex-direction:column;gap:calc(6 * var(--u));z-index:2}.side-btns.left{left:calc(8 * var(--u))}.side-btns.right{right:calc(8 * var(--u))}.side-btns .img-btn{width:calc(104 * var(--u));height:calc(104 * var(--u))}.side-btns .img-btn img{width:100%;height:100%;object-fit:contain}.hero-stage{position:absolute;inset:4% 0 34%;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}.hero-stage img{height:92%;max-width:70%;object-fit:contain;filter:drop-shadow(0 10px 20px rgba(0,0,0,.6));animation:float 3.4s ease-in-out infinite}@keyframes float{50%{transform:translateY(-12px)}}.hero-name-tag{position:absolute;bottom:33%;left:50%;transform:translate(-50%);padding:calc(4 * var(--u)) calc(30 * var(--u));background:#0a0610b3;border-radius:999px;box-shadow:0 0 0 2px #ffd76a59;font-size:calc(24 * var(--u));font-weight:800;white-space:nowrap;cursor:pointer;pointer-events:auto}.stage-card{position:absolute;left:50%;bottom:calc(14 * var(--u));transform:translate(-50%);width:calc(640 * var(--u));display:flex;flex-direction:column;align-items:center;gap:calc(12 * var(--u))}.stage-info{width:100%;display:flex;align-items:center;gap:calc(14 * var(--u));padding:calc(14 * var(--u)) calc(20 * var(--u));background:linear-gradient(90deg,#140c20eb,#28163ad9);border-radius:calc(20 * var(--u));box-shadow:0 0 0 2px #ffd76a4d,0 6px 20px #0009;cursor:pointer}.stage-info .thumb{width:calc(100 * var(--u));height:calc(120 * var(--u));border-radius:calc(12 * var(--u));object-fit:cover;box-shadow:0 0 0 2px #000}.stage-info .nm{font-size:calc(32 * var(--u));font-weight:800}.stage-info .sub{font-size:calc(20 * var(--u));color:var(--muted)}.stage-info .arrow{width:calc(44 * var(--u));margin-left:auto}.stars{display:inline-flex;gap:2px}.stars img{width:calc(28 * var(--u))}.start-row{display:flex;gap:calc(14 * var(--u));align-items:center}.btn-start{min-width:calc(330 * var(--u));height:calc(104 * var(--u));font-size:calc(38 * var(--u))}.btn-start .cost{font-size:calc(22 * var(--u));position:absolute;bottom:calc(2 * var(--u));right:calc(30 * var(--u))}.mode-btn{width:calc(110 * var(--u));height:calc(110 * var(--u))}.mode-btn img{width:100%;height:100%;object-fit:contain}.nav{position:relative;display:flex;justify-content:space-around;align-items:flex-end;height:calc(150 * var(--u));padding:0 calc(6 * var(--u)) env(safe-area-inset-bottom);background:linear-gradient(to top,rgba(8,5,14,.98),rgba(8,5,14,.8) 70%,transparent)}.nav-item{position:relative;width:calc(136 * var(--u));height:calc(136 * var(--u));background:none;border:0;padding:0;cursor:pointer;transition:transform .12s}.nav-item img{width:100%;height:100%;object-fit:contain;filter:brightness(.75) saturate(.8);transition:filter .15s}.nav-item.active{transform:translateY(calc(-12 * var(--u))) scale(1.12)}.nav-item.active img{filter:none}.nav-item.active:before{content:"";position:absolute;inset:-12%;background:url(../assets/ui/main/main_nav_select.webp) center / contain no-repeat;z-index:-1}.nav-item.locked img{filter:grayscale(1) brightness(.5)}.page{position:absolute;inset:0;display:flex;flex-direction:column;padding:calc(10 * var(--u)) calc(18 * var(--u)) 0}.page-head{display:flex;align-items:center;justify-content:center;height:calc(80 * var(--u));flex:none}.page-head .title-img{height:calc(70 * var(--u))}.page-title{font-size:calc(40 * var(--u));font-weight:800;color:var(--gold);text-shadow:0 3px 0 #3a1a00,0 0 10px rgba(0,0,0,.8)}.card{background:#0e0918d1;border-radius:calc(20 * var(--u));box-shadow:0 0 0 2px #9678c847,0 6px 16px #0006;padding:calc(16 * var(--u))}.card+.card{margin-top:calc(14 * var(--u))}.card-title{font-size:calc(26 * var(--u));font-weight:800;color:var(--gold);margin-bottom:calc(10 * var(--u));display:flex;align-items:center;gap:8px}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:calc(6 * var(--u)) calc(20 * var(--u));font-size:calc(21 * var(--u))}.stat-grid .k{color:var(--muted)}.stat-grid .v{font-weight:800;text-align:right}.stat-line{display:flex;justify-content:space-between}.equip-layout{position:relative;height:calc(520 * var(--u));flex:none}.equip-hero{position:absolute;left:50%;top:2%;height:92%;transform:translate(-50%);object-fit:contain;filter:drop-shadow(0 8px 16px #000)}.equip-slot{position:absolute;width:calc(120 * var(--u));height:calc(120 * var(--u));cursor:pointer}.equip-slot .item-cell{width:100%;height:100%}.equip-slot .empty{position:absolute;inset:0;background:#0a0610a6;border-radius:18%;box-shadow:inset 0 0 0 3px #ffffff26;display:flex;align-items:center;justify-content:center}.equip-slot .empty img{width:55%;opacity:.6}.equip-slot .slot-name{position:absolute;bottom:calc(-26 * var(--u));left:0;right:0;text-align:center;font-size:calc(18 * var(--u));color:var(--muted)}.bag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(104 * var(--u)),1fr));gap:calc(12 * var(--u));justify-items:center;padding:calc(8 * var(--u)) 0 calc(20 * var(--u))}.tabs{display:flex;gap:calc(8 * var(--u));margin-bottom:calc(10 * var(--u));flex-wrap:wrap}.tab{flex:1;min-width:0;height:calc(58 * var(--u));border:0;border-radius:calc(14 * var(--u));background:#281e3cd9;color:var(--muted);font-weight:800;font-size:calc(22 * var(--u));cursor:pointer;box-shadow:inset 0 0 0 2px #ffffff14;white-space:nowrap}.tab.active{background:linear-gradient(#ffd97a,#d58a1e);color:#3a1a00}.equip-detail{color:var(--text)}.equip-detail .head{display:flex;gap:calc(16 * var(--u));align-items:center}.equip-detail .name{font-size:calc(30 * var(--u));font-weight:800}.equip-detail .subs{margin:calc(12 * var(--u)) 0;font-size:calc(22 * var(--u));line-height:1.6}.equip-detail .subs .main-stat{color:var(--gold);font-weight:800}.cost-line{display:flex;gap:calc(18 * var(--u));justify-content:center;align-items:center;font-size:calc(22 * var(--u));margin:calc(10 * var(--u)) 0;flex-wrap:wrap}.cost-line span{display:inline-flex;align-items:center;gap:4px}.cost-line img{height:calc(36 * var(--u))}.cost-line .lack{color:var(--red)}.cult{position:relative;flex:1;display:flex;flex-direction:column;align-items:center}.cult-stage{position:relative;width:calc(560 * var(--u));height:calc(560 * var(--u));display:flex;align-items:center;justify-content:center}.cult-stage .circle{position:absolute;inset:0;width:100%;height:100%;animation:spin 24s linear infinite;opacity:.8}.cult-stage .sit{position:relative;width:62%;filter:drop-shadow(0 0 20px rgba(90,255,200,.5));animation:float 3s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.realm-title{font-size:calc(44 * var(--u));font-weight:800;color:var(--gold);text-shadow:0 3px 0 #3a1a00}.realm-exp{width:86%;margin:calc(10 * var(--u)) 0;height:calc(30 * var(--u))}.list{display:flex;flex-direction:column;gap:calc(12 * var(--u));padding-bottom:calc(20 * var(--u))}.list-item{display:flex;align-items:center;gap:calc(14 * var(--u));padding:calc(12 * var(--u)) calc(16 * var(--u));background:#1e162ee0;border-radius:calc(16 * var(--u));box-shadow:inset 0 0 0 2px #ffffff12;color:var(--text)}.list-item.done{opacity:.6}.list-item .info{flex:1;min-width:0}.list-item .nm{font-size:calc(24 * var(--u));font-weight:800}.list-item .ds{font-size:calc(19 * var(--u));color:var(--muted)}.list-item .bar{margin-top:6px;height:calc(18 * var(--u))}.talent-icon{width:calc(84 * var(--u));height:calc(84 * var(--u));border-radius:50%;flex:none}.talent-icon.locked{filter:grayscale(1) brightness(.5)}.chapter-list{display:flex;flex-direction:column;gap:calc(18 * var(--u))}.chapter{border-radius:calc(20 * var(--u));overflow:hidden;background:#0e0918e6;box-shadow:0 0 0 2px #9678c84d}.chapter-head{position:relative;display:flex;align-items:center;gap:calc(14 * var(--u));padding:calc(10 * var(--u)) calc(14 * var(--u));background:center / cover;min-height:calc(110 * var(--u))}.chapter-head:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0610eb,#0a061073)}.chapter-head>*{position:relative}.chapter-head .cn{font-size:calc(32 * var(--u));font-weight:800;color:var(--gold)}.chapter-head .ci{font-size:calc(18 * var(--u));color:var(--muted);line-height:1.25}.stage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(10 * var(--u));padding:calc(12 * var(--u))}.stage-btn{position:relative;height:calc(112 * var(--u));border:0;border-radius:calc(14 * var(--u));cursor:pointer;background:linear-gradient(#3e2e5c,#241a38);color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:inset 0 0 0 2px #ffffff1a;font-family:inherit}.stage-btn .no{font-size:calc(28 * var(--u));font-weight:800}.stage-btn .snm{font-size:calc(16 * var(--u));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:95%}.stage-btn.cur{background:linear-gradient(#ffd97a,#c97a1a);color:#2a1200}.stage-btn.cur .snm{color:#4a2200}.stage-btn.locked{filter:grayscale(1) brightness(.55)}.stage-btn.boss:after{content:"BOSS";position:absolute;top:4px;right:6px;font-size:calc(14 * var(--u));font-weight:800;color:#ff7a6a}.hud{position:absolute;inset:0;font-size:calc(24 * var(--hu));pointer-events:none}.hud .toast{pointer-events:none}.touch-layer{position:absolute;inset:0;touch-action:none}.joy-base{position:absolute;width:calc(180 * var(--hu));height:calc(180 * var(--hu));margin:calc(-90 * var(--hu)) 0 0 calc(-90 * var(--hu));background:center / contain no-repeat;opacity:.75;pointer-events:none}.joy-knob{position:absolute;left:50%;top:50%;width:calc(80 * var(--hu));height:calc(80 * var(--hu));background:center / contain no-repeat;transform:translate(-50%,-50%)}.hud-top{position:absolute;left:0;right:0;top:0;padding:max(calc(10 * var(--hu)),env(safe-area-inset-top)) calc(14 * var(--hu)) 0;pointer-events:none}.hud-top *{pointer-events:auto}.exp-wrap{position:relative;height:calc(30 * var(--hu))}.exp-wrap .bar{height:100%}.exp-lv{position:absolute;left:calc(-4 * var(--hu));top:50%;transform:translateY(-50%);width:calc(54 * var(--hu));height:calc(54 * var(--hu));border-radius:50%;background:radial-gradient(circle at 40% 35%,#8a5cd6,#2c164f);box-shadow:0 0 0 3px #ffd76a;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:calc(24 * var(--hu));z-index:2}.hud-row{display:flex;align-items:center;gap:calc(10 * var(--hu));margin-top:calc(10 * var(--hu))}.hud-chip{display:flex;align-items:center;gap:4px;padding:calc(2 * var(--hu)) calc(12 * var(--hu));background:#08050e99;border-radius:999px;font-weight:800;font-size:calc(22 * var(--hu))}.hud-chip img{height:calc(32 * var(--hu))}.hud-time{font-size:calc(36 * var(--hu));font-weight:800;text-shadow:0 2px 0 #000,0 0 6px #000;margin:0 auto}.hud-btn{width:calc(70 * var(--hu));height:calc(70 * var(--hu))}.hud-btn img{width:100%;height:100%;object-fit:contain}.hud-skills{display:flex;flex-wrap:wrap;gap:calc(4 * var(--hu));margin-top:calc(8 * var(--hu));max-width:calc(440 * var(--hu))}.hud-skill{position:relative;width:calc(46 * var(--hu));height:calc(46 * var(--hu))}.hud-skill img{width:100%;height:100%;border-radius:50%}.hud-skill span{position:absolute;right:-3px;bottom:-3px;font-size:calc(15 * var(--hu));font-weight:800;background:#1a1024;border-radius:8px;padding:0 4px;box-shadow:0 0 0 1px #ffd76a}.hud-skill.evo span{background:#b8621a}.hud-skill.passive img{border-radius:22%}.boss-bar{position:absolute;top:calc(170 * var(--hu));left:50%;transform:translate(-50%);width:min(92vw,calc(560 * var(--hu)));text-align:center;pointer-events:none}.boss-bar .bname{font-size:calc(24 * var(--hu));font-weight:800;color:#ffb3a0;text-shadow:0 0 4px #000,0 2px 0 #000}.boss-bar .bar{height:calc(24 * var(--hu))}.progress-bar{width:min(60vw,calc(320 * var(--hu)))}.progress-bar .bar{height:calc(16 * var(--hu))}.announce{position:absolute;left:0;right:0;top:34%;display:flex;justify-content:center;pointer-events:none}.announce img{width:min(86vw,calc(560 * var(--hu)));animation:warn 2.4s ease-out forwards}.announce .txt{font-size:calc(44 * var(--hu));font-weight:800;color:#ffe08a;text-shadow:0 3px 0 #5a2000,0 0 12px #000;animation:warn 2s ease-out forwards}@keyframes warn{0%{transform:scale(2);opacity:0}12%{transform:scale(1);opacity:1}80%{opacity:1}to{opacity:0;transform:scale(1.05)}}.speed-btn{width:calc(90 * var(--hu));height:calc(44 * var(--hu))}.levelup{width:min(96vw,calc(700 * var(--hu)));display:flex;flex-direction:column;align-items:center;gap:calc(14 * var(--hu));font-size:calc(24 * var(--hu))}.levelup .lu-title{font-size:calc(54 * var(--hu));font-weight:800;color:var(--gold);text-shadow:0 4px 0 #4a1a00,0 0 20px rgba(255,180,60,.6);animation:popIn .3s}.offer-list{display:flex;flex-direction:column;gap:calc(14 * var(--hu));width:100%}.offer{position:relative;display:flex;align-items:center;gap:calc(16 * var(--hu));padding:calc(14 * var(--hu)) calc(18 * var(--hu));border-radius:calc(20 * var(--hu));cursor:pointer;background:linear-gradient(100deg,#2a1e42f5,#181026f5);box-shadow:0 0 0 3px #a082dc66,0 6px 16px #0009;animation:slideIn .28s backwards;transition:transform .1s}.offer:nth-child(2){animation-delay:.06s}.offer:nth-child(3){animation-delay:.12s}.offer:nth-child(4){animation-delay:.18s}.offer:active{transform:scale(.97)}.offer.evolve{background:linear-gradient(100deg,#6e3c0af5,#321808f5);box-shadow:0 0 0 3px #ffd76a,0 0 26px #ffbe3c8c}.offer.passive{box-shadow:0 0 0 3px #6ec8ff66,0 6px 16px #0009}.offer .ic{position:relative;width:calc(104 * var(--hu));height:calc(104 * var(--hu));flex:none}.offer .ic img{width:100%;height:100%;border-radius:50%}.offer.passive .ic img{border-radius:22%}.offer .nm{font-size:calc(28 * var(--hu));font-weight:800}.offer .lvtag{font-size:calc(18 * var(--hu));padding:1px 10px;border-radius:999px;background:#4b3a70;margin-left:8px;vertical-align:middle}.offer .new{background:#2f9a4a}.offer.evolve .lvtag{background:#c46a12}.offer .ds{font-size:calc(21 * var(--hu));color:#ddd0f0;line-height:1.3;margin-top:2px}.offer .tags{font-size:calc(16 * var(--hu));color:#9fd5ff;margin-top:2px}.offer .pips{display:flex;gap:3px;margin-top:6px}.offer .pips i{width:calc(22 * var(--hu));height:calc(8 * var(--hu));border-radius:4px;background:#3a2d52}.offer .pips i.on{background:var(--gold)}.offer .pips i.nx{background:#7affb0;animation:blink .7s infinite}@keyframes blink{50%{opacity:.35}}@keyframes slideIn{0%{transform:translate(40px);opacity:0}}.result{width:min(96vw,calc(680 * var(--hu)));display:flex;flex-direction:column;align-items:center;gap:calc(16 * var(--hu));font-size:calc(24 * var(--hu))}.result .res-title{height:calc(150 * var(--hu))}.result .res-title img{height:100%}.result .res-stats{width:100%;background:#0e0918d9;border-radius:calc(20 * var(--hu));padding:calc(16 * var(--hu)) calc(24 * var(--hu));box-shadow:0 0 0 2px #9678c84d}.result .big-stars{display:flex;gap:calc(14 * var(--hu))}.result .big-stars img{width:calc(80 * var(--hu));animation:popIn .4s backwards}.result .big-stars img:nth-child(2){animation-delay:.15s}.result .big-stars img:nth-child(3){animation-delay:.3s}.dmg-row{display:flex;align-items:center;gap:10px;font-size:calc(19 * var(--hu));margin:4px 0}.dmg-row img{width:calc(40 * var(--hu));height:calc(40 * var(--hu));border-radius:50%}.dmg-row .bar{flex:1;height:calc(14 * var(--hu))}.result .item-cell{width:calc(96 * var(--hu));height:calc(96 * var(--hu))}.revive-box{display:flex;flex-direction:column;align-items:center;gap:calc(16 * var(--hu));font-size:calc(24 * var(--hu));width:min(92vw,calc(600 * var(--hu)))}.revive-box .bell{width:calc(260 * var(--hu));animation:float 2s ease-in-out infinite}.pause-box{display:flex;flex-direction:column;gap:calc(16 * var(--hu));align-items:center;width:min(92vw,calc(600 * var(--hu)))}.hud .btn{font-size:calc(28 * var(--hu));height:calc(84 * var(--hu));min-width:calc(220 * var(--hu))}.modal-panel .modal-close{top:calc(10 * var(--u));right:calc(10 * var(--u))}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(10 * var(--u)) 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:calc(24 * var(--u))}.setting-row input[type=range]{width:50%;accent-color:#d58a1e}.toggle{width:calc(96 * var(--u));height:calc(44 * var(--u));border:0;border-radius:999px;background:#8c7f99;position:relative;cursor:pointer}.toggle:after{content:"";position:absolute;top:4px;left:4px;width:calc(36 * var(--u));height:calc(36 * var(--u));border-radius:50%;background:#fff;transition:left .15s}.toggle.on{background:#2fa64a}.toggle.on:after{left:calc(100% - 4px - 36 * var(--u))}textarea.code{width:100%;height:calc(140 * var(--u));font-size:calc(16 * var(--u));border-radius:10px;border:2px solid #8a6a40;padding:8px;background:#fff8ea;color:#2a1a10;user-select:text;-webkit-user-select:text}.auth-screen{justify-content:center;padding:0}.auth-card{position:relative;width:min(94%,calc(600 * var(--u)));padding:calc(26 * var(--u)) calc(30 * var(--u)) calc(30 * var(--u));background:#0e0918e6;border-radius:calc(26 * var(--u));box-shadow:0 0 0 3px #a082dc73,0 20px 60px #000000b3;animation:popIn .3s}.auth-logo{display:block;width:92%;margin:calc(-90 * var(--u)) auto 0;filter:drop-shadow(0 6px 16px rgba(0,0,0,.7))}.auth-sub{text-align:center;font-size:calc(34 * var(--u));font-weight:800;color:#fff3c4;text-shadow:0 3px 0 #7a2a00;margin:calc(-6 * var(--u)) 0 calc(16 * var(--u))}.auth-form{display:flex;flex-direction:column;align-items:center;gap:calc(12 * var(--u))}.auth-field{width:100%;display:flex;flex-direction:column;gap:4px;font-size:calc(20 * var(--u));color:var(--muted)}.auth-input{width:100%;height:calc(66 * var(--u));padding:0 calc(18 * var(--u));border-radius:calc(14 * var(--u));border:2px solid #5b4a7a;background:#1a1428;color:#fff;font-family:inherit;font-size:calc(26 * var(--u));outline:none;user-select:text;-webkit-user-select:text;touch-action:manipulation}.auth-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px #ffd76a40}.auth-err{min-height:1.3em;color:#ff8a7a;font-size:calc(20 * var(--u));text-align:center}.rank-row{display:flex;align-items:center;gap:calc(12 * var(--u));padding:calc(10 * var(--u)) calc(16 * var(--u));border-radius:calc(12 * var(--u));background:#1e162ee0;font-size:calc(22 * var(--u))}.rank-row.me{box-shadow:0 0 0 2px var(--gold)}.rank-no{width:calc(52 * var(--u));text-align:center;font-weight:800;color:var(--muted)}.rank-row:nth-child(1) .rank-no{color:#ffd76a}.rank-row:nth-child(2) .rank-no{color:#d9e2ff}.rank-row:nth-child(3) .rank-no{color:#ffb37a}.dlg{position:absolute;inset:0;z-index:70;pointer-events:auto;animation:fadeIn .25s;cursor:pointer;--s: min(calc(var(--frame-w) / 720), 1.4px)}.dlg.closing{animation:fadeOut .2s forwards}.dlg-dim{position:absolute;inset:0;background:linear-gradient(to top,#05020af2,#05020acc 45%,#05020aa6)}.dlg-title{position:absolute;top:8%;left:0;right:0;text-align:center;font-size:calc(36 * var(--s));font-weight:800;color:var(--gold);text-shadow:0 3px 0 #3a1a00,0 0 14px #000;animation:popIn .4s}.dlg-portrait{position:absolute;bottom:calc(230 * var(--s));height:min(52vh,calc(620 * var(--s)));transition:opacity .2s,filter .2s,transform .25s}.dlg-portrait img{height:100%;width:auto;filter:drop-shadow(0 10px 20px rgba(0,0,0,.7))}.dlg-portrait.left{left:max(2%,calc(50% - 560 * var(--s)));transform:translate(-12px)}.dlg-portrait.right{right:max(2%,calc(50% - 560 * var(--s)));transform:translate(12px)}.dlg-portrait.right img{transform:scaleX(-1)}.dlg-portrait.active{transform:none;opacity:1}.dlg-portrait.dim{opacity:.35;filter:brightness(.6)}.dlg-portrait:empty{display:none}.dlg-box{position:absolute;left:50%;bottom:max(calc(30 * var(--s)),env(safe-area-inset-bottom));transform:translate(-50%);width:min(96vw,calc(980 * var(--s)));min-height:calc(220 * var(--s));padding:calc(54 * var(--s)) calc(48 * var(--s)) calc(40 * var(--s));background:center / 100% 100% no-repeat;color:#fff}.dlg-box:before{content:"";position:absolute;inset:0;z-index:-1;background:#0e0918e0;border-radius:calc(20 * var(--s));box-shadow:0 0 0 3px #a082dc73}.dlg-name{position:absolute;top:calc(-22 * var(--s));left:calc(36 * var(--s));padding:calc(4 * var(--s)) calc(26 * var(--s));border-radius:999px;background:linear-gradient(#ffd97a,#c97a1a);color:#2a1200;font-weight:800;font-size:calc(28 * var(--s));box-shadow:0 3px 8px #00000080}.dlg-text{font-size:calc(28 * var(--s));line-height:1.5;min-height:3em;text-shadow:0 1px 2px #000}.dlg.narr .dlg-text{font-style:italic;color:#e8dcff;text-align:center}.dlg-arrow{position:absolute;right:calc(30 * var(--s));bottom:calc(18 * var(--s));width:calc(34 * var(--s));animation:blink .8s infinite}.dlg-skip{position:absolute;top:max(calc(20 * var(--s)),env(safe-area-inset-top));right:calc(20 * var(--s));border:0;border-radius:999px;padding:calc(8 * var(--s)) calc(22 * var(--s));background:#0a0610b3;color:#fff;font-weight:800;font-size:calc(24 * var(--s));cursor:pointer;box-shadow:0 0 0 2px #ffd76a66}.load-logo{position:absolute;top:6%;left:0;right:0;display:flex;flex-direction:column;align-items:center}.load-logo img{width:min(92%,calc(640 * var(--u)));filter:drop-shadow(0 6px 16px rgba(0,0,0,.7));animation:popIn .6s}.load-logo .sub{margin-top:calc(-6 * var(--u));font-size:calc(46 * var(--u));font-weight:800;color:#fff3c4;text-shadow:0 3px 0 #7a2a00,0 0 18px rgba(255,140,40,.6);-webkit-text-stroke:1px #5b1c00}.fade-in{animation:fadeIn .25s}.hidden{display:none!important}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition:none!important}}
