/* ================= 星石讨伐 · 样式 ================= */
:root{
  --bg:#080b14; --bg2:#0d1220; --panel:#121a2c; --panel2:#182238;
  --line:#22304a; --txt:#e8eefc; --dim:#8ea0bf; --dim2:#5d6f8f;
  --gold:#f5c451; --gold2:#c9922b; --cyan:#5eead4; --red:#fb7185;
  --mono:'SF Mono',Consolas,'Cascadia Mono',monospace;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0}
body{
  background:
    radial-gradient(1200px 700px at 50% -10%, #1b2a4a 0%, transparent 60%),
    radial-gradient(900px 600px at 110% 20%, #2a1b3f 0%, transparent 55%),
    radial-gradient(700px 500px at -10% 80%, #10303a 0%, transparent 55%),
    var(--bg);
  color:var(--txt); font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  overflow:hidden; user-select:none;
}
body::before{ /* 星尘 */
  content:''; position:fixed; inset:0; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1.2px 1.2px at 20% 30%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 70% 15%, #cfe8ff 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 45% 65%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 85% 55%, #ffe9b8 50%, transparent 51%),
    radial-gradient(1px 1px at 12% 78%, #fff 50%, transparent 51%),
    radial-gradient(1.3px 1.3px at 58% 88%, #d8c9ff 50%, transparent 51%),
    radial-gradient(1px 1px at 32% 8%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 92% 32%, #fff 50%, transparent 51%);
  background-size:100% 100%;
}

/* ---------- 通用 ---------- */
#app{position:relative;height:100%;display:flex;flex-direction:column;overflow:hidden}
.screen{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden}
.scroll{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;flex:1;padding:14px 14px 96px}
.scroll::-webkit-scrollbar{width:0}
.btn{
  border:1px solid rgba(245,196,81,.45); border-radius:11px; cursor:pointer;
  background:linear-gradient(180deg, rgba(245,196,81,.22), rgba(245,196,81,.08));
  color:#ffe9b8; font-size:14px; font-weight:600; padding:11px 16px;
  transition:transform .12s, filter .12s, box-shadow .2s; font-family:inherit;
}
.btn:active{transform:scale(.96)}
.btn.primary{background:linear-gradient(180deg,#f7d27a,#d99b2c); color:#2b1c02; border-color:#ffe6a8; box-shadow:0 6px 18px rgba(245,196,81,.28)}
.btn.ghost{background:rgba(255,255,255,.04); border-color:var(--line); color:var(--dim)}
.btn.danger{background:rgba(251,113,133,.12); border-color:rgba(251,113,133,.4); color:#ffc4cd}
.btn[disabled],.btn.dis{opacity:.38; pointer-events:none}
.row{display:flex;align-items:center;gap:10px}
.grow{flex:1}
.t-xs{font-size:11px}.t-sm{font-size:12.5px}
.dim{color:var(--dim)}.dim2{color:var(--dim2)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.gold{color:var(--gold)}

/* ---------- 顶栏 ---------- */
#top{display:flex;align-items:center;gap:10px;padding:10px 14px;flex:0 0 auto;
  background:linear-gradient(180deg,rgba(10,14,24,.92),rgba(10,14,24,.55));
  border-bottom:1px solid rgba(255,255,255,.06); z-index:20}
.brand{display:flex;flex-direction:column;line-height:1.15}
.brand b{font-size:16px;letter-spacing:2px;
  background:linear-gradient(180deg,#fff,#f5c451);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand span{font-size:9px;letter-spacing:2.4px;color:var(--dim2)}
.starpill{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;
  background:linear-gradient(180deg,rgba(94,234,212,.16),rgba(94,234,212,.05));
  border:1px solid rgba(94,234,212,.35); font-size:13px; font-weight:700; color:#b7fff4}
.iconbtn{width:32px;height:32px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.04);
  color:var(--dim);display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer}

/* ---------- 大厅首页 ---------- */
.hero{position:relative;border-radius:18px;overflow:hidden;padding:18px;
  background:radial-gradient(120% 120% at 50% 0%, #24385f 0%, #131c30 60%, #0d1422 100%);
  border:1px solid rgba(245,196,81,.25); margin-bottom:14px}
.hero::after{content:'';position:absolute;inset:-40% -10% auto;height:180px;
  background:radial-gradient(50% 100% at 50% 0%, rgba(245,196,81,.25), transparent 70%);filter:blur(12px)}
.hero h1{position:relative;margin:0 0 4px;font-size:26px;letter-spacing:4px;
  background:linear-gradient(180deg,#fff9e6,#f5c451 60%,#b57d24);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{position:relative;margin:0;font-size:12px;color:var(--dim)}
.hero .prog{position:relative;margin-top:14px;height:8px;border-radius:6px;background:rgba(0,0,0,.35);overflow:hidden}
.hero .prog i{display:block;height:100%;border-radius:6px;
  background:linear-gradient(90deg,#5eead4,#f5c451);box-shadow:0 0 12px rgba(245,196,81,.6)}

.navgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px}
.navcard{position:relative;border-radius:14px;padding:14px;cursor:pointer;overflow:hidden;
  background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);
  transition:transform .15s,border-color .2s}
.navcard:active{transform:scale(.97)}
.navcard:hover{border-color:rgba(245,196,81,.5)}
.navcard .ico{font-size:22px;margin-bottom:6px}
.navcard b{display:block;font-size:14px;margin-bottom:2px}
.navcard span{font-size:11px;color:var(--dim)}

/* 关卡列表 */
.lvrow{display:flex;align-items:center;gap:12px;padding:12px;border-radius:13px;margin-bottom:8px;
  background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);cursor:pointer;
  transition:transform .12s,border-color .2s}
.lvrow:active{transform:scale(.985)}
.lvrow.boss{border-color:rgba(251,113,133,.45);background:linear-gradient(160deg,#2a1622,#1a1020)}
.lvrow.lock{opacity:.45;cursor:not-allowed}
.lvrow.done{border-color:rgba(94,234,212,.25)}
.lvno{width:42px;height:42px;flex:0 0 42px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-weight:700;font-size:14px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.lvrow.boss .lvno{background:rgba(251,113,133,.16);border-color:rgba(251,113,133,.4);color:#ffc4cd}
.lvrow.done .lvno{background:rgba(94,234,212,.14);border-color:rgba(94,234,212,.35);color:#b7fff4}

/* ---------- 卡牌 ---------- */
.card{
  position:relative;width:100%;aspect-ratio:3/4.3;border-radius:12px;overflow:hidden;cursor:pointer;
  background:linear-gradient(170deg,#1a2338,#0e1424);
  border:1px solid color-mix(in srgb,var(--qc) 55%,transparent);
  box-shadow:0 6px 16px rgba(0,0,0,.45), inset 0 0 24px color-mix(in srgb,var(--qc) 12%,transparent);
  transition:transform .14s, box-shadow .2s;
  display:flex;flex-direction:column;
}
.card:active{transform:translateY(-3px) scale(1.02)}
.card .halo{position:absolute;inset:-30% -30% auto;height:75%;pointer-events:none;
  background:radial-gradient(50% 60% at 50% 20%, color-mix(in srgb,var(--qc) 45%,transparent), transparent 70%);}
.card .art{position:relative;flex:0 0 58%;overflow:hidden}\n.card .art svg{position:absolute;inset:0}
.card .ring{position:absolute;width:74%;aspect-ratio:1;border-radius:50%;
  border:1px solid color-mix(in srgb,var(--qc) 70%,transparent);opacity:.55}
.card .ring::after{content:'';position:absolute;inset:12%;border-radius:50%;
  border:1px dashed color-mix(in srgb,var(--qc) 55%,transparent)}
.card .sig{position:relative;font-size:38px;filter:drop-shadow(0 0 12px color-mix(in srgb,var(--qc) 80%,transparent));
  transform:translateZ(0)}
.card .body{padding:0 8px 8px;display:flex;flex-direction:column;gap:3px;flex:1;position:relative;z-index:2}
.card .nm{font-size:12.5px;font-weight:700;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.4px}
.card .ft{display:flex;align-items:center;gap:4px;font-size:9.5px;color:var(--dim)}
.card .cd{display:flex;align-items:center;gap:2px;padding:1px 4px;border-radius:4px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.card .dmg{margin-left:auto;font-family:var(--mono);font-weight:700;color:#ffd9a0;font-size:10px}
.card .qb{position:absolute;top:6px;left:6px;font-size:9px;padding:2px 6px;border-radius:5px;
  background:color-mix(in srgb,var(--qc) 30%,#000 55%);color:#fff;letter-spacing:1px;
  border:1px solid color-mix(in srgb,var(--qc) 60%,transparent);z-index:3}
.card .lvbadge{position:absolute;top:6px;right:6px;font-size:9px;padding:2px 5px;border-radius:5px;
  background:rgba(0,0,0,.55);border:1px solid rgba(245,196,81,.5);color:var(--gold);z-index:3}
.card.owned{filter:none}
.card.notowned{filter:grayscale(.72) brightness(.74) contrast(1.02);opacity:.9}
.card.q5,.card.q6{box-shadow:0 6px 22px rgba(0,0,0,.5), inset 0 0 30px color-mix(in srgb,var(--qc) 20%,transparent), 0 0 0 1px color-mix(in srgb,var(--qc) 40%,transparent)}
.card.q6::before{content:'';position:absolute;inset:-50%;z-index:0;
  background:conic-gradient(from 0deg, transparent, color-mix(in srgb,var(--qc) 55%,transparent), transparent 30%, transparent 70%, color-mix(in srgb,var(--qc) 45%,transparent), transparent);
  animation:spin 6s linear infinite; opacity:.5}
@keyframes spin{to{transform:rotate(360deg)}}
.card.q6 .art{background:radial-gradient(50% 60% at 50% 40%, color-mix(in srgb,var(--qc) 30%,transparent), transparent 70%)}

.cardgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
@media (min-width:720px){.cardgrid{grid-template-columns:repeat(5,1fr);gap:12px}}

/* ---------- 战斗 ---------- */
#battle{background:radial-gradient(100% 70% at 50% 0%, #1a2038, #080b14 70%)}
.bhead{display:flex;align-items:center;gap:8px;padding:8px 12px;flex:0 0 auto}
.btitle{font-size:13px;font-weight:700}
.turnbadge{font-size:10px;padding:3px 8px;border-radius:20px;background:rgba(94,234,212,.14);
  border:1px solid rgba(94,234,212,.35);color:#b7fff4}
.enemies{flex:1;display:flex;justify-content:center;align-items:center;gap:14px;padding:10px 12px;position:relative}
.enemy{position:relative;cursor:pointer;transition:transform .15s;flex:0 0 auto;width:104px;text-align:center}
.enemy.hit{animation:hitShake .32s}
@keyframes hitShake{
  0%{transform:translateX(0) scale(1)}
  20%{transform:translateX(-7px) scale(.97);filter:brightness(1.5)}
  45%{transform:translateX(6px) scale(1.02)}
  70%{transform:translateX(-3px)}
  100%{transform:translateX(0)}
}
.enemy.hit .esig{box-shadow:0 0 0 2px #fb7185,0 0 30px rgba(251,113,133,.8)}
.dmgfloat{position:absolute;left:50%;top:8px;transform:translateX(-50%);font-weight:800;font-size:20px;color:#ffd9a0;
  text-shadow:0 2px 10px #000;pointer-events:none;animation:dmgUp .9s ease-out forwards;z-index:9}
@keyframes dmgUp{0%{opacity:0;transform:translate(-50%,6px) scale(.7)}25%{opacity:1;transform:translate(-50%,-4px) scale(1.15)}100%{opacity:0;transform:translate(-50%,-42px) scale(1)}}
.enemy.sel{transform:translateY(-4px)}
.enemy.sel .esig{box-shadow:0 0 0 2px var(--gold),0 0 22px rgba(245,196,81,.55)}
.enemy.dead{opacity:.25;filter:grayscale(1);pointer-events:none}
.esig{width:74px;height:74px;margin:0 auto;border-radius:18px;display:flex;align-items:center;justify-content:center;
  font-size:38px;background:radial-gradient(60% 60% at 50% 35%, rgba(255,255,255,.14), rgba(0,0,0,.25));
  border:1px solid rgba(255,255,255,.14);box-shadow:0 6px 18px rgba(0,0,0,.4);position:relative}
.esig.boss{width:118px;height:118px;font-size:64px;border-radius:26px;
  background:radial-gradient(60% 60% at 50% 35%, rgba(251,113,133,.28), rgba(0,0,0,.35));
  border-color:rgba(251,113,133,.5)}
.enemy .ename{font-size:10.5px;margin-top:5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hpbar{height:6px;border-radius:4px;background:rgba(0,0,0,.5);overflow:hidden;margin-top:4px;border:1px solid rgba(255,255,255,.08)}
.hpbar i{display:block;height:100%;background:linear-gradient(90deg,#f87171,#fb7185);transition:width .25s}
.hpbar.p i{background:linear-gradient(90deg,#5eead4,#34d399)}
.hpbar b{display:block;font-size:9px;color:var(--dim);margin-top:2px;font-family:var(--mono)}
.stbadges{display:flex;gap:3px;justify-content:center;margin-top:3px;min-height:14px}
.stb{font-size:9px;padding:0 4px;border-radius:4px;background:rgba(255,255,255,.08)}

.logbox{flex:0 0 auto;height:104px;overflow-y:auto;padding:8px 14px;font-size:11.5px;line-height:1.6;
  background:rgba(4,8,16,.5);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.logbox::-webkit-scrollbar{width:0}
.logbox div{color:var(--dim)}
.logbox .me{color:#ffe9b8;font-weight:600;margin-top:4px}
.logbox .en{color:#ffb3be}
.logbox .kill{color:#f5c451;font-weight:700}
.logbox .rc{color:#67e8f9;font-weight:600}
.logbox .heal{color:#86efac}
.logbox .st{color:#c4b5fd}
.logbox .ph{color:#fb7185;font-weight:700;margin-top:4px}

.pbar{flex:0 0 auto;padding:8px 14px 2px}.pbar .hpnum{font-family:var(--mono);font-size:12px;font-weight:700}
.pbar .hpbar{height:11px}
.handwrap{flex:0 0 auto;padding:6px 10px 10px}
.hand{display:flex;gap:7px;justify-content:center;align-items:flex-end}
.hand .card{width:calc((100% - 28px)/5);max-width:96px;flex:0 0 auto}
.hand .card.cd{filter:grayscale(.85) brightness(.55);pointer-events:none}
.hand .card.cd::after{content:attr(data-cd);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:26px;font-weight:800;color:#fff;text-shadow:0 2px 10px #000;background:rgba(0,0,0,.45);z-index:5}
.hand .card.cd{position:relative}
.bactions{display:flex;gap:8px;padding:0 12px 12px;flex:0 0 auto}
.bactions .btn{flex:1;padding:10px;font-size:13px}

/* ---------- 弹层 ---------- */
.mask{position:fixed;inset:0;background:rgba(4,7,14,.78);backdrop-filter:blur(6px);z-index:100;
  display:flex;align-items:center;justify-content:center;padding:16px}
.sheet{width:100%;max-width:520px;max-height:86vh;overflow-y:auto;border-radius:18px;padding:18px;
  background:linear-gradient(180deg,#16203a,#0e1526);border:1px solid rgba(245,196,81,.28);
  box-shadow:0 24px 60px rgba(0,0,0,.6)}
.sheet h3{margin:0 0 4px;font-size:17px;letter-spacing:1px}
.sheet .sub{font-size:11.5px;color:var(--dim);margin-bottom:14px}

/* 抽卡 */
.pools{display:grid;gap:12px}
.pool{position:relative;border-radius:16px;padding:16px;overflow:hidden;cursor:pointer;
  border:1px solid var(--line);background:linear-gradient(160deg,var(--panel2),var(--panel));
  transition:transform .15s,border-color .2s}
.pool:active{transform:scale(.98)}
.pool.p2{border-color:rgba(96,165,250,.4);background:linear-gradient(160deg,#16233c,#0f1728)}
.pool.p3{border-color:rgba(251,113,133,.4);background:linear-gradient(160deg,#2a1526,#150e1c)}
.pool h4{margin:0 0 3px;font-size:16px}
.pool .desc{font-size:11px;color:var(--dim);margin-bottom:10px}
.pool .price{font-size:13px;color:#b7fff4;font-family:var(--mono)}
.pool .rates{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px}
.pool .rates span{font-size:9px;padding:2px 6px;border-radius:5px;background:rgba(255,255,255,.06)}

.pullres{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:6px}
.pullres .card{animation:pop .4s backwards}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.9)}}
.dupmark{position:absolute;bottom:4px;right:5px;font-size:9px;padding:1px 5px;border-radius:5px;
  background:rgba(245,196,81,.9);color:#2b1c02;font-weight:700;z-index:4}

/* 详情 */
.detail-top{display:flex;gap:14px;margin-bottom:14px}
.detail-top .card{width:130px;flex:0 0 130px}
.detail-info{flex:1;min-width:0}
.detail-info h3{margin:0 0 4px}
.statline{display:flex;justify-content:space-between;font-size:12px;padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.07)}
.skillrow{display:flex;gap:8px;align-items:center;padding:8px;border-radius:9px;background:rgba(255,255,255,.04);
  margin-top:6px;font-size:12px}
.skillrow.on{border:1px solid rgba(94,234,212,.35);background:rgba(94,234,212,.08)}
.skillrow .k{font-weight:700;color:#b7fff4}
.skillrow .d{font-size:11px;color:var(--dim)}

/* 编队 */
.slots{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:14px}
.slot{aspect-ratio:3/4.3;border-radius:12px;border:1px dashed rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--dim2);cursor:pointer;
  background:rgba(255,255,255,.02);position:relative;overflow:hidden}
.slot.filled{border-style:solid;border-color:transparent}

/* 教程 */
.tut{position:fixed;inset:0;z-index:200;background:rgba(4,7,14,.9);display:flex;align-items:center;justify-content:center;padding:20px}
.tut .box{max-width:420px;border-radius:20px;padding:22px;background:linear-gradient(180deg,#1a2440,#0d1424);
  border:1px solid rgba(245,196,81,.35); text-align:left}
.tut h3{margin:0 0 8px;font-size:18px;color:var(--gold)}
.tut p{margin:0 0 14px;font-size:13px;line-height:1.75;color:var(--dim)}
.tut .step{font-size:10px;color:var(--dim2);letter-spacing:2px;margin-bottom:6px}

/* 结果 */
.result{text-align:center;padding:10px 0}
.result h2{margin:0 0 6px;font-size:26px;letter-spacing:3px}
.result .win{background:linear-gradient(180deg,#fff9e6,#f5c451);-webkit-background-clip:text;background-clip:text;color:transparent}
.result .lose{color:#fb7185}
.reward{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:12px;
  background:rgba(94,234,212,.12);border:1px solid rgba(94,234,212,.3);margin:10px 6px;font-size:14px;color:#b7fff4}

.toast{position:fixed;left:50%;top:64px;transform:translateX(-50%);z-index:300;
  padding:10px 18px;border-radius:12px;background:rgba(20,28,46,.96);border:1px solid rgba(245,196,81,.4);
  color:#ffe9b8;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.5);animation:tin .25s}
@keyframes tin{from{opacity:0;transform:translate(-50%,-10px)}}

/* 手机适配 */
@media (max-width:420px){
  .brand b{font-size:14px}
  .hero h1{font-size:22px}
  .hand .card{width:calc((100% - 24px)/5)}
}

/* ================= 地图 ================= */
.mapwrap{position:relative;flex:1;overflow:hidden;touch-action:none;cursor:grab;
  background:radial-gradient(120% 60% at 50% 0%, #101a2e 0%, #070a12 60%)}
.mapwrap:active{cursor:grabbing}
.mapworld{position:absolute;left:0;top:0;will-change:transform;transform:translate3d(0,0,0)}
.mapbg{position:absolute;inset:0;overflow:hidden}\n.mapbg svg{position:absolute;left:0;top:0}\n.mapbg-old{position:absolute;inset:0;
  background:
    radial-gradient(30% 22% at 22% 18%, rgba(79,209,197,.16), transparent 70%),
    radial-gradient(28% 20% at 78% 42%, rgba(245,182,76,.13), transparent 70%),
    radial-gradient(34% 24% at 30% 72%, rgba(124,110,245,.15), transparent 70%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.022) 0 1px, transparent 1px 46px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.022) 0 1px, transparent 1px 46px)}
.mapworld .trail{position:absolute;left:0;top:0;pointer-events:none}
.mnode{position:absolute;transform:translate(-50%,-50%);width:50px;height:50px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:transform .16s}
.mnode:active{transform:translate(-50%,-50%) scale(.94)}
.mnode .ring{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(60% 60% at 50% 38%, rgba(255,255,255,.16), rgba(8,12,22,.9));
  border:1.5px solid rgba(120,200,255,.45);box-shadow:0 6px 16px rgba(0,0,0,.5), inset 0 0 14px rgba(80,180,255,.18)}
.mnode .core{position:relative;font-family:var(--mono);font-weight:800;font-size:14px;color:#cfe8ff}
.mnode .cap{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);font-size:9px;
  color:rgba(255,200,120,.9);letter-spacing:2px;white-space:nowrap}
.mnode.boss{width:66px;height:66px}
.mnode.boss .ring{border-width:2px;border-color:rgba(255,170,90,.6);
  box-shadow:0 8px 22px rgba(0,0,0,.55), 0 0 26px rgba(255,150,60,.28), inset 0 0 18px rgba(255,160,70,.22)}
.mnode.boss .core{font-size:22px;color:#ffd9a0}
.mnode.s-done .ring{border-color:rgba(90,220,160,.65);
  box-shadow:0 6px 16px rgba(0,0,0,.5), inset 0 0 16px rgba(70,220,150,.25)}
.mnode.s-done .core{color:#9df5cd}
.mnode.s-lock{opacity:.42;filter:saturate(.35)}
.mnode.s-lock .ring{border-color:rgba(255,255,255,.16)}
.mnode.next{animation:nodePulse 1.8s ease-in-out infinite}
@keyframes nodePulse{
  0%,100%{box-shadow:0 0 0 0 rgba(245,196,81,.0)}
  50%{box-shadow:0 0 0 0 rgba(245,196,81,0)}
}
.mnode.next .ring{border-color:#f5c451;box-shadow:0 0 0 3px rgba(245,196,81,.18), 0 0 26px rgba(245,196,81,.55), inset 0 0 16px rgba(245,196,81,.25)}
.mnode.next .core{color:#ffe6a8}
.maptip{position:absolute;left:12px;top:64px;display:flex;flex-direction:column;gap:2px;
  padding:7px 11px;border-radius:10px;background:rgba(10,16,28,.72);border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(8px);font-size:11px;color:var(--dim);z-index:5;pointer-events:none}
.maptip b{font-size:12.5px;color:#cfe8ff}
.mapjump{position:absolute;right:12px;bottom:86px;display:flex;align-items:center;gap:6px;
  padding:8px 12px;border-radius:20px;font-size:11.5px;color:#0b1220;font-weight:700;
  background:linear-gradient(180deg,#ffe0a3,#e8b45a);box-shadow:0 6px 18px rgba(0,0,0,.45);z-index:6}
.mapjump svg{display:block}

/* ================= 底部标签 ================= */
#tabs{position:fixed;left:0;right:0;bottom:0;height:calc(58px + env(safe-area-inset-bottom,0px));
  padding-bottom:env(safe-area-inset-bottom,0px);display:flex;z-index:40;
  background:linear-gradient(180deg, rgba(10,14,24,.86), rgba(8,11,20,.98));
  border-top:1px solid rgba(255,255,255,.08);backdrop-filter:blur(12px)}
#tabs .tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  color:rgba(200,214,235,.5);font-size:10px;letter-spacing:.5px;transition:color .15s}
#tabs .tab .ti{display:block;line-height:0}
#tabs .tab.on{color:#ffd98a}
#tabs .tab.on .ti{filter:drop-shadow(0 0 8px rgba(245,196,81,.55))}
/* 图标与金币 */
.ic{display:inline-flex;align-items:center;justify-content:center;line-height:0;vertical-align:-2px}
.ic svg{display:block}
.starpill .ic,.price .ic,.reward .ic,.btn .ic{opacity:.95}
#top .iconbtn{display:flex;align-items:center;justify-content:center}
.stb{display:inline-flex;align-items:center;gap:2px}
.stb svg{vertical-align:-1px}
.cartimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.card .art .cartimg{filter:saturate(1.05) contrast(1.03)}
/* 地图暗角，聚焦视野中心 */
.mapwrap::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;
  background:radial-gradient(120% 80% at 50% 45%, transparent 45%, rgba(4,8,14,.55) 100%)}
.mapwrap .mnode{z-index:4}

/* 战斗：首领立绘（有 AI 图时） */
.esig.img{background:none;border:0;overflow:hidden;border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08)}
.esig.img img{width:100%;height:100%;object-fit:cover;display:block}

/* EX 隐藏关节点 */
.mnode.ex .core{border-color:rgba(244,114,182,.55);background:radial-gradient(circle at 40% 35%,rgba(244,114,182,.35),rgba(20,12,30,.9))}
.mnode.ex .no{font-size:11px;letter-spacing:.5px;color:#f9a8d4}
.mnode.ex.next .ring{box-shadow:0 0 0 2px rgba(244,114,182,.5),0 0 26px rgba(244,114,182,.45)}

/* 敌人徽记：程序化 SVG 填充（不再依赖 emoji 字体） */
.esig svg{width:78%;height:78%;display:block}
.esig.boss svg{width:80%;height:80%}
.esig .sigwrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
/* ---------- 每日任务悬浮窗 ---------- */
#dly{position:fixed;right:12px;bottom:calc(140px + env(safe-area-inset-bottom,0px));z-index:60;
  display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.dlybtn{position:relative;display:flex;align-items:center;gap:6px;padding:9px 13px 9px 11px;
  border-radius:999px;background:rgba(18,26,42,.92);border:1px solid rgba(120,160,220,.28);
  color:#cfe0f5;font-size:13px;font-weight:600;box-shadow:0 10px 26px rgba(0,0,0,.5);
  backdrop-filter:blur(10px);cursor:pointer;user-select:none}
.dlybtn .ic{display:flex;color:#7dd3fc}
.dlybtn.has{border-color:rgba(245,196,81,.7);color:#ffe6a8;
  box-shadow:0 10px 26px rgba(0,0,0,.5),0 0 0 1px rgba(245,196,81,.35),0 0 22px rgba(245,196,81,.25)}
.dlybtn.has .ic{color:#f5c451}
.dlybadge{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;
  background:#ef4444;color:#fff;font-size:11px;line-height:17px;text-align:center;font-weight:700}
.dlypanel{display:none;width:min(320px,calc(100vw - 24px));max-height:min(56vh,420px);overflow:auto;padding:12px;border-radius:16px;
  background:linear-gradient(180deg,rgba(22,31,50,.98),rgba(13,19,32,.99));
  border:1px solid rgba(120,160,220,.25);box-shadow:0 20px 50px rgba(0,0,0,.6)}
#dly.open .dlypanel{display:block;animation:dlyIn .18s ease-out}
@keyframes dlyIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.dlyhead{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.dlyhead b{font-size:14px;color:#eaf2ff}
.dlydate{font-size:11px;color:#7c8aa3}
.dlyhead .grow{flex:1}
.dlyrow{padding:9px 0;border-top:1px solid rgba(255,255,255,.06)}
.dlyrow:first-child{border-top:0}
.dlyt{display:flex;align-items:baseline;gap:8px;font-size:12.5px;color:#dbe7f7}
.dlyrw{margin-left:auto;color:#f5c451;font-weight:700;font-size:12px}
.dlyprog{position:relative;height:16px;margin-top:5px;border-radius:8px;background:rgba(255,255,255,.07);overflow:hidden}
.dlyprog i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#38bdf8,#7dd3fc);border-radius:8px}
.dlyprog span{position:absolute;right:7px;top:0;line-height:16px;font-size:10.5px;color:#dbe7f7;font-weight:700;
  text-shadow:0 1px 2px rgba(0,0,0,.75)}
.dlyget{margin-top:7px;width:100%;height:32px;border:0;border-radius:9px;cursor:pointer;
  background:linear-gradient(180deg,#f7d27a,#d99b2c);color:#3a2600;font-weight:800;font-size:13px}
.dlyok{margin-top:7px;font-size:12px;color:#64748b}
.dlywait{margin-top:7px;font-size:12px;color:#8b9ab3}
.dlyfoot{margin-top:8px;font-size:11px;color:#64748b;text-align:center}
.dlyrow.got{opacity:.55}
#dly.open ~ .mapjump{display:none}