*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}
html,body{height:100%;overflow:hidden;background:#04060a}
body{color:#eaf2ff;font-family:"STKaiti","KaiTi","Songti SC","Noto Serif SC",serif;-webkit-font-smoothing:antialiased;user-select:none;-webkit-user-select:none}
#app{position:fixed;inset:0;max-width:520px;margin:0 auto;overflow:hidden;background:#04060a;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
:root{
  --gold:#f6dc9c; --gold2:#cfa044; --gold3:#8a5f14;
  --jade:#7ef0d4; --jade2:#1c8f7d;
  --ink:rgba(6,10,18,.72); --line:rgba(246,220,156,.28);
  --ts:44px;
}
/* ===== 视差背景层 ===== */
.bgstage{position:absolute;inset:0;overflow:hidden;z-index:0}
.bglayer{position:absolute;inset:-6%;background-position:center;background-size:cover;will-change:transform;transition:transform .35s cubic-bezier(.2,.9,.25,1)}
.bglayer::after{content:"";position:absolute;inset:0;background:
  radial-gradient(120% 80% at 50% 0%,rgba(0,0,0,.55),transparent 60%),
  radial-gradient(90% 60% at 50% 100%,rgba(0,0,0,.75),transparent 65%),
  linear-gradient(180deg,rgba(4,8,14,.55),rgba(4,8,14,.25) 45%,rgba(4,8,14,.82))}
.fog{position:absolute;left:-20%;right:-20%;height:46%;pointer-events:none;
  background:radial-gradient(60% 100% at 30% 60%,rgba(180,230,255,.16),transparent 70%),
             radial-gradient(50% 90% at 72% 40%,rgba(255,255,255,.10),transparent 72%);
  filter:blur(6px);animation:fogdrift 26s ease-in-out infinite alternate}
.fog.b{top:44%;animation-duration:34s;animation-direction:alternate-reverse;opacity:.8}
.fog.a{top:6%}
@keyframes fogdrift{from{transform:translate3d(-4%,2%,0) scale(1)}to{transform:translate3d(6%,-3%,0) scale(1.08)}}
#fx{position:absolute;inset:0;z-index:1;pointer-events:none}
.rays{position:absolute;inset:0;z-index:0;pointer-events:none;mix-blend-mode:screen;opacity:.55;
  background:conic-gradient(from 200deg at 62% -6%,transparent 0 32%,rgba(255,238,190,.16) 36%,transparent 42% 62%,rgba(200,230,255,.14) 66%,transparent 72%);
  filter:blur(3px);animation:rayshift 18s ease-in-out infinite alternate}
@keyframes rayshift{from{opacity:.35;transform:translateX(-2%)}to{opacity:.7;transform:translateX(3%)}}
/* ===== 屏幕路由 ===== */
.screen{position:absolute;inset:0;display:none;flex-direction:column;z-index:2}
.screen.on{display:flex;animation:scrIn .28s ease-out}
html,body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
#board{touch-action:none}
#board .tile{touch-action:none}
@keyframes scrIn{from{opacity:.4;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
/* ===== 顶部状态 ===== */
.topbar{display:flex;align-items:center;gap:8px;padding:10px 14px 6px;position:relative;z-index:3}
.avatar{width:40px;height:40px;border-radius:50%;flex:0 0 auto;position:relative;
  background:radial-gradient(circle at 35% 30%,#bff6ff,#3b8fd6 45%,#123055 100%);
  box-shadow:0 0 0 2px rgba(246,220,156,.55),0 6px 18px rgba(0,0,0,.6),inset 0 -6px 12px rgba(0,0,0,.4)}
.avatar span{position:absolute;inset:0;display:grid;place-items:center;font-size:18px;color:#0b1a2a;font-weight:700}
.who{flex:1;min-width:0}
.who b{display:block;font-size:15px;letter-spacing:.5px;color:#fff6df;text-shadow:0 2px 8px rgba(0,0,0,.8)}
.who em{font-size:11px;font-style:normal;color:#9fc3e0;opacity:.9}
.purse{display:flex;gap:6px}
.chip{display:flex;align-items:center;gap:4px;padding:4px 9px 4px 6px;border-radius:20px;font-size:12px;
  background:linear-gradient(180deg,rgba(20,32,48,.92),rgba(8,14,22,.92));border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 12px rgba(0,0,0,.5);color:#ffe9b8}
.chip i{width:14px;height:14px;border-radius:50%;display:block;font-style:normal;font-size:9px;display:grid;place-items:center}
.chip .ci-coin{background:radial-gradient(circle at 35% 30%,#ffe9a8,#c8882a);color:#4a2c00;font-weight:700}
.chip .ci-gem{background:linear-gradient(160deg,#a9f4ff,#2f8bd8);color:#03293f;font-weight:700}
.chip .ci-en{background:radial-gradient(circle at 35% 30%,#ffc0cf,#b62448);color:#fff;font-weight:700}
/* ===== 主页 ===== */
.home-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 14px 150px;position:relative;z-index:2}
.hero{position:relative;margin-top:6px;border-radius:22px;overflow:hidden;isolation:isolate;
  border:1px solid rgba(246,220,156,.34);
  box-shadow:0 12px 26px -10px rgba(0,0,0,.65),inset 0 0 44px rgba(0,0,0,.34);
  min-height:236px;display:flex;flex-direction:column;justify-content:flex-end;padding:16px}
.hero .him{position:absolute;inset:0;background-size:cover;background-position:center 22%;transform:scale(1.06);z-index:-2;will-change:transform;transition:transform .4s ease-out}
.hero .him::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,6,12,.15) 20%,rgba(3,6,12,.62) 62%,rgba(3,6,12,.94))}
.hero .realmTag{position:static;align-self:flex-start;margin-bottom:8px;font-size:11px;letter-spacing:3px;color:#ffe9b8;padding:3px 10px;border-radius:8px;
  background:linear-gradient(180deg,rgba(140,100,20,.55),rgba(60,40,6,.7));border:1px solid var(--line);backdrop-filter:blur(3px)}
.hero h1{font-size:44px;line-height:1;letter-spacing:6px;font-weight:400;
  background:linear-gradient(180deg,#fffdf0,#ffd977 42%,#b57c1b 78%,#ffe8b0);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.85)) drop-shadow(0 0 22px rgba(255,205,110,.35))}
.hero h1 small{font-size:14px;letter-spacing:2px;display:block;color:#ffe6b0;-webkit-text-fill-color:#ffe6b0;opacity:.85;margin-top:6px;font-weight:400}
.hero .sub{font-size:12px;color:#bcd6ea;margin-top:6px;letter-spacing:1px}
.progress{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:12px;color:#ffe9b8}
.pbar{flex:1;height:8px;border-radius:8px;background:rgba(0,0,0,.55);border:1px solid rgba(246,220,156,.3);overflow:hidden}
.pbar i{display:block;height:100%;width:0;border-radius:8px;background:linear-gradient(90deg,#ffdf9b,#ff9d3c);box-shadow:0 0 12px rgba(255,180,80,.8)}
.hero .go{margin-top:14px;display:flex;gap:10px;align-items:center}
.btn-main{flex:1;height:54px;border-radius:16px;border:1px solid #ffe8b0;font-family:inherit;font-size:19px;letter-spacing:4px;color:#4a2a00;
  background:linear-gradient(180deg,#fff3cf,#ffd469 38%,#e0a62e 72%,#a06f10);
  box-shadow:0 3px 0 rgba(107,71,8,.55),0 8px 16px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.75);cursor:pointer;position:relative;
  transition:transform .08s,box-shadow .08s}
.btn-main:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(107,71,8,.5),0 4px 10px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.65)}
.btn-side{width:56px;height:54px;border-radius:14px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(36,52,72,.95),rgba(10,18,28,.95));
  color:#ffe9b8;font-size:12px;line-height:1.25;font-family:inherit;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.3),0 6px 12px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.12)}
.btn-side:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(0,0,0,.28),0 3px 8px rgba(0,0,0,.18)}
/* 境界路线 */
.sect{margin-top:14px}
.sect h2{font-size:13px;letter-spacing:4px;color:#ffd98f;display:flex;align-items:center;gap:8px;margin-bottom:8px}
.sect h2::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(246,220,156,.5),transparent)}
.sect-sub{font-size:12px;color:#dbeede;letter-spacing:.6px;margin:-4px 0 9px;font-weight:500;line-height:1.4;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 10px rgba(0,0,0,.6)}
.realms{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.realms::-webkit-scrollbar{display:none}
.rcard{flex:0 0 auto;scroll-snap-align:start;width:104px;border-radius:16px;padding:10px;position:relative;overflow:hidden;
  border:1px solid rgba(246,220,156,.22);background:linear-gradient(180deg,rgba(18,28,42,.9),rgba(6,10,16,.94));
  box-shadow:0 10px 22px -10px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.1);cursor:pointer;text-align:left;color:inherit;font-family:inherit}
.rcard .th{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.42;filter:saturate(.9)}
.rcard .in{position:relative;z-index:1}
.rcard b{display:block;font-size:16px;letter-spacing:2px;color:#fff3d2;text-shadow:0 2px 8px #000}
.rcard small{display:block;font-size:10px;color:#9dbfd8;margin-top:3px;letter-spacing:.5px}
.rcard .lv{font-size:10px;margin-top:8px;color:#ffdf9b}
.rcard.lock{filter:grayscale(.55) brightness(.8)}
.rcard.lock::after{content:"未开启";position:absolute;right:8px;top:8px;font-size:9px;color:#9fb4c8;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:1px 3px}
.rcard.cur{border-color:#ffd98f;box-shadow:0 0 0 1px rgba(255,217,143,.5),0 0 22px rgba(255,190,90,.35)}
/* 功能区 */
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:14px}
.fn{border-radius:14px;padding:11px 8px;text-align:center;border:1px solid rgba(246,220,156,.2);
  background:linear-gradient(180deg,rgba(22,34,50,.92),rgba(8,13,22,.96));color:#ffe9b8;font-family:inherit;font-size:12px;
  box-shadow:0 8px 18px -8px #000,inset 0 1px 0 rgba(255,255,255,.1);cursor:pointer;position:relative;overflow:hidden}
.fn:active{transform:translateY(2px)}
.fn svg{width:22px;height:22px;margin:0 auto 6px;display:block;stroke:#ffd98f;fill:none;stroke-width:1.6}
.fn .badge{position:absolute;top:5px;right:6px;background:#e0393f;color:#fff;font-size:9px;border-radius:8px;padding:1px 4px;box-shadow:0 0 8px rgba(224,57,63,.8)}
/* 激励入口 */
.reward-row{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}
.rw{display:flex;align-items:center;gap:8px;padding:11px 12px;border-radius:14px;border:1px solid rgba(126,240,212,.3);
  background:linear-gradient(135deg,rgba(18,48,52,.94),rgba(8,16,26,.96));color:#d8fff5;font-family:inherit;font-size:12px;cursor:pointer;text-align:left}
.rw:active{transform:translateY(2px)}
.rw .play{width:26px;height:26px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;background:linear-gradient(180deg,#8ff6dd,#18978a);color:#04302b;font-size:11px;box-shadow:0 0 14px rgba(126,240,212,.5)}
.rw b{display:block;font-size:13px;color:#eafff9}
.rw small{color:#83c7bb;font-size:10px}
/* 排行榜 */
.tabs{display:flex;gap:8px;padding:2px 0 10px}
.tab{flex:1;padding:9px 0;text-align:center;font-size:13px;letter-spacing:2px;border-radius:12px;border:1px solid rgba(246,220,156,.2);
  background:linear-gradient(180deg,rgba(18,28,42,.9),rgba(7,12,20,.95));color:#a9c4d8;font-family:inherit;cursor:pointer}
.tab.on{color:#4a2a00;background:linear-gradient(180deg,#ffeebc,#ffce56);border-color:#fff1c9;font-weight:700;box-shadow:0 0 18px rgba(255,200,90,.5)}
.ranklist{border-radius:18px;overflow:hidden;border:1px solid rgba(246,220,156,.22);background:linear-gradient(180deg,rgba(10,16,26,.93),rgba(5,9,15,.96))}
.rrow{display:flex;align-items:center;gap:10px;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.06);position:relative}
.rrow:last-child{border-bottom:0}
.rrow.me{background:linear-gradient(90deg,rgba(255,205,110,.16),rgba(255,205,110,.03));box-shadow:inset 3px 0 0 #ffcf6e}
.rk{width:26px;text-align:center;font-size:14px;color:#a9c4d8;flex:0 0 auto}
.rk.top{color:#ffdf9b;font-size:16px}
.rav{width:34px;height:34px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;font-size:13px;font-weight:700;color:#08131f;box-shadow:0 3px 10px rgba(0,0,0,.5)}
.rinfo{flex:1;min-width:0}
.rinfo b{display:block;font-size:13px;color:#f2f8ff}
.rinfo small{font-size:10px;color:#8aa6bf}
.rval{text-align:right;font-size:12px;color:#ffdf9b}
.rval i{display:block;font-size:10px;font-style:normal;color:#8aa6bf}
/* 广告位 */
#shopGrid{border-radius:16px;border:1px solid rgba(246,220,156,.22);background:linear-gradient(180deg,rgba(8,14,22,.86),rgba(4,8,14,.9));padding:2px 10px;overflow:hidden}
.adslot{margin-top:14px;border-radius:14px;overflow:hidden;border:1px dashed rgba(126,240,212,.4);position:relative;
  background:linear-gradient(120deg,rgba(16,44,50,.9),rgba(10,18,28,.95));min-height:64px;display:flex;align-items:center;padding:10px 12px;gap:10px}
.adslot .tag{position:absolute;top:0;right:0;font-size:9px;color:#9fe6d6;background:rgba(0,0,0,.5);padding:1px 5px;border-bottom-left-radius:6px}
.adslot .box{width:44px;height:44px;border-radius:10px;background:linear-gradient(135deg,#ffd166,#ff7a45);flex:0 0 auto;display:grid;place-items:center;font-size:11px;color:#3a1a00;font-weight:700}
.adslot p{font-size:11px;color:#a9c4d8;line-height:1.5;margin:0}
.adslot strong{color:#eafff9;display:block;font-size:13px}
/* 底栏导航 */
.navbar{position:absolute;left:0;right:0;bottom:0;display:flex;padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));gap:6px;
  background:linear-gradient(180deg,rgba(8,14,22,.55),rgba(4,8,14,.96) 40%);z-index:5;
  border-top:1px solid rgba(246,220,156,.18)}
.navbar button{flex:1;background:none;border:0;color:#93adc4;font-family:inherit;font-size:11px;letter-spacing:1px;padding:6px 0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px}
.navbar button svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.5}
.navbar button.on{color:#ffd98f}
.navbar button.on svg{stroke:#ffd98f;filter:drop-shadow(0 0 8px rgba(255,200,110,.6))}
/* ===== 游戏页 ===== */
.game-top{display:flex;align-items:center;gap:10px;padding:8px 12px;position:relative;z-index:3}
.gback.closebtn{margin-left:auto;font-size:17px;color:#ffe9b8}
.gback{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:rgba(8,14,22,.8);color:#ffd98f;font-size:16px;cursor:pointer;flex:0 0 auto}
.gtitle{flex:1;min-width:0}
.gtitle b{font-size:15px;color:#fff3d2;letter-spacing:1px}
.gtitle small{display:block;font-size:10px;color:#93adc4;margin-top:1px}
.timer{width:74px;height:52px;border-radius:14px;display:grid;place-items:center;flex:0 0 auto;position:relative;
  background:radial-gradient(120% 120% at 50% 20%,rgba(30,48,68,.95),rgba(6,10,16,.95));border:1px solid rgba(246,220,156,.3);
  box-shadow:inset 0 0 18px rgba(0,0,0,.7),0 6px 16px rgba(0,0,0,.5)}
.timer b{font-size:22px;font-family:"DIN Alternate","Menlo",monospace;letter-spacing:1px;color:#ffe9b8;line-height:1}
.timer.danger{border-color:rgba(255,90,90,.7);animation:pulse .9s infinite}
.timer.danger b{color:#ff8a8a}
@keyframes pulse{0%,100%{box-shadow:0 0 0 rgba(255,60,60,0);box-shadow:inset 0 0 18px rgba(255,40,40,.2)}50%{box-shadow:0 0 22px rgba(255,60,60,.55)}}
.objrow{display:flex;gap:8px;padding:0 12px 8px;overflow-x:auto;scrollbar-width:none;position:relative;z-index:3}
.objrow::-webkit-scrollbar{display:none}
.obj{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:5px 10px 5px 5px;border-radius:12px;
  background:linear-gradient(180deg,rgba(16,26,38,.95),rgba(6,10,16,.95));border:1px solid rgba(246,220,156,.25)}
.obj .oi{width:30px;height:30px;border-radius:8px;background-size:900% 500%;flex:0 0 auto}
.obj span{font-size:11px;color:#dbe9f7;white-space:nowrap}
.objrow{gap:6px;padding:0 10px 8px}
.obj.done{border-color:rgba(126,240,212,.6);box-shadow:0 0 14px rgba(126,240,212,.3)}
.obj.done span{color:#8ff6dd}
/* 棋盘 */
.boardwrap{margin-top:auto;flex:1;display:flex;align-items:flex-end;justify-content:center;padding:32px 10px 0;position:relative;z-index:2;min-height:0;perspective:1100px}
#boardFrame{will-change:transform}
.bhint{position:absolute;left:0;right:0;top:4px;text-align:center;font-size:11px;letter-spacing:1px;color:#a8c6dc;z-index:1;pointer-events:none;text-shadow:0 1px 6px #000}
.bhint i{color:#ffd98f;font-style:normal}
.boardframe{will-change:transform;transition:transform .18s ease-out;position:relative;width:100%;aspect-ratio:1/1;max-height:100%;border-radius:20px;padding:9px;
  background:linear-gradient(180deg,rgba(30,44,60,.5),rgba(6,10,16,.75));
  border:1px solid rgba(246,220,156,.3);
  box-shadow:0 10px 22px rgba(0,0,0,.38),inset 0 0 0 1px rgba(255,255,255,.06),inset 0 0 26px rgba(0,0,0,.42);
  perspective:900px}
.boardframe::before{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;
  background:linear-gradient(140deg,rgba(255,255,255,.16),transparent 38%,transparent 62%,rgba(255,255,255,.07));
  opacity:.45}
#board{position:absolute;inset:9px;transform:translateZ(0)}
.tile{position:absolute;top:0;left:0;transition:transform .19s cubic-bezier(.3,1.4,.5,1);cursor:pointer}
.tile.lifted{position:fixed;z-index:80;margin:0;overflow:visible;pointer-events:none;will-change:transform}
.tile.lifted .cell{box-shadow:inset 0 0 0 2px rgba(255,232,170,.95),0 14px 22px rgba(0,0,0,.55)}
.tile.dragging{z-index:60;will-change:transform;pointer-events:none}
.tile.dragging .ic{pointer-events:none}
.tile.dragging .cell{box-shadow:inset 0 0 0 2px rgba(255,232,170,.95),0 6px 14px rgba(0,0,0,.45);background:linear-gradient(180deg,rgba(28,42,58,.92),rgba(8,12,20,.95))}
.tile.dragging .ic{}
.tile.aim .cell{box-shadow:inset 0 0 0 2px rgba(150,235,255,.95),0 8px 16px rgba(0,0,0,.4)}
.tile.aim .ic{transform:scale(1.05)}
/* 拖动期间降负载：关掉整框混合层与残余过渡 */
body.dgdrag .boardframe::before{display:none}
body.dgdrag .boardframe{transition:none}
body.dgdrag .tile:not(.lifted){transition:none}
body.dgdrag #boardFrame{will-change:auto}
.tile .cell{position:absolute;inset:7%;border-radius:26%;transition:transform .16s,opacity .18s;contain:layout;
  background:radial-gradient(62% 56% at 32% 24%,rgba(255,255,255,.13),transparent 68%),linear-gradient(180deg,rgba(20,31,44,.90),rgba(5,9,15,.94));
  box-shadow:inset 0 0 0 1px rgba(246,220,156,.16),0 5px 12px rgba(0,0,0,.42)}
.tile .ic{position:absolute;inset:2%;background-repeat:no-repeat;background-position:center;
  transition:transform .16s}
.tile.sel .cell{box-shadow:inset 0 0 0 2px rgba(255,225,150,.9),0 0 22px rgba(255,205,110,.65),0 10px 22px rgba(0,0,0,.5)}
.tile.press .cell{box-shadow:inset 0 0 0 2px rgba(255,235,180,.85),0 0 20px rgba(255,210,120,.55),0 10px 22px rgba(0,0,0,.5)}
.tile.press .ic{transform:scale(1.06) translateZ(16px)}
.tile.press{z-index:4}
.tile.sel .ic{transform:scale(1.08) translateZ(18px)}
.tile.dead .ic,.tile.dead .cell{transform:scale(.2) translateZ(30px);opacity:0}
.tile.sp .cell{box-shadow:inset 0 0 0 2px rgba(160,240,255,.8),0 0 26px rgba(120,220,255,.65)}
.tile .spmark{position:absolute;inset:0;pointer-events:none;border-radius:30%;opacity:.85}
.tile .spmark.row{background:linear-gradient(90deg,transparent,rgba(140,230,255,.55),transparent);animation:sp 1.6s infinite}
.tile .spmark.col{background:linear-gradient(0deg,transparent,rgba(140,230,255,.55),transparent);animation:sp 1.6s infinite}
.tile .spmark.bomb{background:radial-gradient(circle,rgba(255,170,90,.55),transparent 62%);animation:sp 1.2s infinite}
.tile .spmark.rainbow{background:conic-gradient(from 0deg,#ff8fb1,#ffe08a,#8ff6dd,#8fb9ff,#d59cff,#ff8fb1);opacity:.28;animation:spin 3s linear infinite}
@keyframes sp{0%,100%{opacity:.35}50%{opacity:.95}}
@keyframes spin{to{transform:rotate(360deg)}}
.tile.frozen .ic{filter:brightness(.82) saturate(.78) drop-shadow(0 4px 8px #000)}
.frost{position:absolute;inset:0;border-radius:26%;pointer-events:none;overflow:hidden;
  box-shadow:inset 0 0 0 1.5px rgba(205,240,255,.5),inset 0 0 10px rgba(170,225,255,.18)}
.frost::before{content:"";position:absolute;inset:0;border-radius:inherit;opacity:var(--fz,1);
  background:
    radial-gradient(circle at 20% 14%,rgba(255,255,255,.55),transparent 40%),
    radial-gradient(circle at 82% 84%,rgba(190,236,255,.5),transparent 46%),
    linear-gradient(148deg,rgba(214,246,255,.26) 0 44%,rgba(255,255,255,.05) 44% 100%)}
.frost::after{content:"";position:absolute;inset:0;border-radius:inherit;opacity:var(--fz,1);
  background:
    repeating-linear-gradient(58deg,rgba(255,255,255,.14) 0 1.5px,rgba(255,255,255,0) 1.5px 9px),
    repeating-linear-gradient(-34deg,rgba(196,238,255,.12) 0 1px,rgba(196,238,255,0) 1px 12px)}
.frost.f1{--fz:.42;box-shadow:inset 0 0 0 1px rgba(205,240,255,.34),inset 0 0 6px rgba(170,225,255,.12)}
.frost.f2{--fz:.78;box-shadow:inset 0 0 0 1.5px rgba(210,244,255,.6),inset 0 0 14px rgba(150,215,255,.3)}
.frost.f3{--fz:1;box-shadow:inset 0 0 0 2px rgba(225,250,255,.78),inset 0 0 20px rgba(140,210,255,.45),inset 0 0 0 4px rgba(255,255,255,.16)}
.tile.stone .cell{background:linear-gradient(160deg,#4a5566,#222a36);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),inset 0 -6px 12px rgba(0,0,0,.6),0 8px 16px rgba(0,0,0,.5)}
.tile.stone .ic{display:none}
.tile.stone .rune{position:absolute;inset:0;display:grid;place-items:center;font-size:calc(var(--ts)*.42);color:#9fb2c8;opacity:.85;text-shadow:0 0 8px rgba(120,180,255,.5)}
.tile.hint .cell{animation:hintpulse .9s infinite}
@keyframes hintpulse{0%,100%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}50%{box-shadow:inset 0 0 0 2px rgba(255,240,180,.9),0 0 24px rgba(255,220,140,.6)}}
/* 工具条 */
.matlegend{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 8px;padding:3px 12px 0;position:relative;z-index:3}
.matlegend .mc{display:flex;align-items:center;gap:5px;min-width:0;padding:3px 6px;border-radius:8px;
  background:rgba(8,14,22,.5);border:1px solid rgba(246,220,156,.16)}
.matlegend .mi2{width:20px;height:20px;flex:0 0 auto;border-radius:5px;background-repeat:no-repeat}
.matlegend .mn{font-size:10.5px;color:#cfdfee;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,.8)}
body.lite .matlegend .mc{background:rgba(8,14,22,.6)}
.tools{display:flex;gap:7px;padding:6px 10px 10px;margin-bottom:auto;position:relative;z-index:3}
.tool{flex:1;border-radius:14px;border:1px solid rgba(246,220,156,.24);padding:7px 2px 5px;text-align:center;position:relative;
  background:linear-gradient(180deg,rgba(28,42,58,.95),rgba(8,12,20,.95));font-family:inherit;color:#ffe9b8;font-size:10px;cursor:pointer;
  box-shadow:0 3px 9px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.12)}
.tool:active{transform:translateY(2px)}
.tool .ti{width:30px;height:30px;margin:0 auto 3px;display:grid;place-items:center;font-size:17px;border-radius:9px;
  background:radial-gradient(circle at 35% 28%,rgba(255,240,200,.28),rgba(255,200,90,.06));border:1px solid rgba(246,220,156,.25)}
.tool .cnt{position:absolute;top:3px;right:4px;font-size:9px;color:#9fe6d6;background:rgba(0,0,0,.6);border-radius:7px;padding:0 4px}
.tool.zero .cnt{color:#ffd98f;background:linear-gradient(180deg,#ffe6a8,#e2a63f);color:#2a1a04}
.tool .adfree{position:absolute;bottom:2px;right:3px;font-size:8px;color:#24160a;background:linear-gradient(180deg,#ffd77a,#f0a63c);border-radius:5px;padding:0 3px;line-height:11px;box-shadow:0 0 8px rgba(255,190,90,.5)}
.tool.zero{opacity:.72}
.combo{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%) scale(.8);opacity:0;pointer-events:none;z-index:6;
  font-size:30px;letter-spacing:3px;color:#fff;text-shadow:0 0 18px rgba(255,190,90,.9),0 4px 10px #000}
.combo.show{animation:combopop .8s ease-out}
@keyframes combopop{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}70%{opacity:1;transform:translate(-50%,-60%) scale(1)}100%{opacity:0;transform:translate(-50%,-90%) scale(.95)}}
/* ===== 弹层 ===== */
.mask{position:absolute;inset:0;z-index:20;display:none;align-items:center;justify-content:center;padding:18px;
  background:radial-gradient(120% 90% at 50% 30%,rgba(4,8,14,.55),rgba(2,4,8,.9));backdrop-filter:blur(3px)}
.mask.on{display:flex;animation:fadein .2s}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.panel{width:100%;max-width:360px;border-radius:20px;padding:18px 16px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(24,36,52,.98),rgba(8,12,20,.99));border:1px solid rgba(246,220,156,.4);
  box-shadow:0 14px 30px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.06),0 0 26px rgba(255,190,90,.1);
  animation:panelin .3s cubic-bezier(.2,1.3,.4,1)}
@keyframes panelin{from{transform:translateY(16px) scale(.94);opacity:.5}to{transform:none;opacity:1}}
.panel::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#ffe0a0,transparent)}
.panel h3{font-size:20px;letter-spacing:3px;text-align:center;color:#ffe9b8;margin-bottom:4px;font-weight:400}
.panel .psub{text-align:center;font-size:11px;color:#93adc4;margin-bottom:14px;letter-spacing:1px}
.stars{display:flex;justify-content:center;gap:10px;margin:6px 0 12px;font-size:26px;color:#3a4a5c}
.stars i{font-style:normal;transition:transform .4s,color .4s}
.stars i.on{color:#ffd56b;text-shadow:0 0 16px rgba(255,200,90,.9);transform:scale(1.15)}
.rwdgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 14px}
.rwd{border-radius:12px;padding:9px 6px;text-align:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.rwd b{display:block;font-size:15px;color:#ffdf9b}
.rwd small{font-size:10px;color:#8aa6bf}
.pbtn{width:100%;height:48px;border-radius:14px;border:1px solid #ffe8b0;font-family:inherit;font-size:16px;letter-spacing:3px;color:#402300;cursor:pointer;
  background:linear-gradient(180deg,#fff3cf,#ffd469 40%,#dd9f2a);box-shadow:0 2px 0 rgba(107,71,8,.55),0 6px 12px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.75)}
.pbtn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(107,71,8,.5)}
.pbtn.ghost{background:linear-gradient(180deg,rgba(40,58,80,.95),rgba(12,20,32,.95));color:#ffe9b8;border-color:rgba(246,220,156,.4);box-shadow:0 2px 0 rgba(0,0,0,.3),0 6px 12px rgba(0,0,0,.2)}
.pbtn.ad{background:linear-gradient(180deg,#a5ffe2,#31c9b2 45%,#138f81);color:#03302a;border-color:#b9ffe9;box-shadow:0 2px 0 rgba(10,90,80,.55),0 6px 12px rgba(0,0,0,.22),0 0 16px rgba(60,220,190,.2)}
.panel .row2{display:flex;gap:8px;margin-top:9px}
/* 广告模拟器 */
.adview{position:absolute;inset:0;z-index:30;display:none;flex-direction:column;background:#05080f}
.adview.on{display:flex}
.adview .adbody{flex:1;position:relative;overflow:hidden;background:radial-gradient(120% 90% at 50% 20%,#123,#04080f 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 24px;text-align:center}
.adview .adbrand{font-size:12px;letter-spacing:4px;color:#8fa6bb;margin-bottom:10px}
.adview .adbig{font-size:30px;letter-spacing:6px;background:linear-gradient(180deg,#fff,#ffcf6a 60%,#b07f1d);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 12px #000)}
.adview .adcopy{font-size:13px;color:#b7ccdd;margin-top:14px;line-height:1.8;max-width:280px}
.adview .adzip{position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.04) 0 12px,transparent 12px 26px);animation:zip 3s linear infinite;pointer-events:none}
@keyframes zip{to{transform:translateX(26px)}}
.adview .barwrap{height:52px;display:flex;align-items:center;gap:12px;padding:0 16px;background:#02040a}
.adview .abar{flex:1;height:6px;border-radius:6px;background:#1a2230;overflow:hidden}
.adview .abar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffd166,#ff8a3c)}
.adview .skip{font-size:12px;color:#9fb4c8;padding:8px 12px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:none;font-family:inherit}
.adview .skip.ready{color:#ffe9b8;border-color:rgba(246,220,156,.6)}
/* toast */
.toast{position:absolute;left:50%;bottom:96px;transform:translateX(-50%) translateY(12px);z-index:40;opacity:0;pointer-events:none;
  padding:9px 16px;border-radius:20px;font-size:12.5px;color:#ffe9b8;background:rgba(6,12,20,.94);border:1px solid rgba(246,220,156,.4);
  box-shadow:0 10px 26px rgba(0,0,0,.7);transition:opacity .2s,transform .2s;max-width:88%;text-align:center}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
/* 关卡列表 */
.lvgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.lvbtn{aspect-ratio:1;border-radius:12px;border:1px solid rgba(246,220,156,.22);background:linear-gradient(180deg,rgba(24,36,52,.95),rgba(8,12,20,.95));
  color:#e8f0ff;font-family:inherit;font-size:13px;display:grid;place-items:center;position:relative;cursor:pointer}
.lvbtn.done{border-color:rgba(126,240,212,.45);color:#bff8ea}
.lvbtn.lock{opacity:.42;color:#7e93a8}
.lvbtn .st{position:absolute;bottom:2px;font-size:7px;letter-spacing:-1px;color:#ffd56b}
.lvbtn.boss{border-color:rgba(255,120,120,.6);box-shadow:0 0 8px rgba(255,90,90,.18)}
.musicbtn{position:absolute;right:10px;top:10px;z-index:8;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(246,220,156,.45);background:rgba(10,16,26,.32);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  color:#ffe6b0;font-size:16px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0;
  box-shadow:0 2px 10px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.14);
  text-shadow:0 0 8px rgba(255,200,110,.55);transition:background .18s,color .18s,border-color .18s,box-shadow .18s,transform .12s}
.musicbtn:active{transform:scale(.94)}
.musicbtn.off{background:rgba(10,16,26,.18);border-color:rgba(190,210,230,.28);color:#a9bccd;
  text-shadow:none;box-shadow:0 1px 6px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.08)}
.musicbtn.off .mi{opacity:.4}
.musicbtn.off::after{content:"";position:absolute;width:19px;height:1px;border-radius:2px;
  background:rgba(178,200,222,.72);transform:rotate(-40deg)}
.hintline{font-size:10px;color:#9db4c6;text-shadow:0 1px 6px rgba(0,0,0,.85);text-align:center;padding:8px 62px 10px;letter-spacing:.5px;line-height:1.6}
/* ===== 自定义滚动条：墨玉底 + 暖金胶囊，与盘面金线同色系 ===== */
/* 注意：Chrome 一旦识别标准属性 scrollbar-color，就会忽略 ::-webkit-scrollbar 自定义样式，
   所以标准属性只留给不支持的浏览器（Firefox）作兜底，不给滚动容器本身设 */
@supports not (scrollbar-color: auto){
  .home-body,#devPanel{scrollbar-width:thin;scrollbar-color:#cfa961 rgba(6,11,18,.35)}
}
.home-body::-webkit-scrollbar,#devPanel::-webkit-scrollbar{width:10px}
.home-body::-webkit-scrollbar:vertical,#devPanel::-webkit-scrollbar:vertical{width:10px}
.home-body::-webkit-scrollbar-track,#devPanel::-webkit-scrollbar-track{
  background:linear-gradient(180deg,transparent,rgba(8,13,20,.55) 10%,rgba(8,13,20,.55) 90%,transparent);
  margin:10px 2px;
  border-radius:9px;
}
.home-body::-webkit-scrollbar-thumb,#devPanel::-webkit-scrollbar-thumb{
  border-radius:9px;
  border:2px solid rgba(5,9,14,.92);      /* 留出一圈墨色缝，像浮在画面上 */
  background:linear-gradient(180deg,#f9e7b8 0%,#dcb96f 38%,#a3823f 78%,#7a5c2a 100%);
  background-clip:padding-box;
  box-shadow:0 0 10px rgba(246,220,156,.28);
}
.home-body::-webkit-scrollbar-thumb:hover,#devPanel::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,#fff3cf 0%,#edcb84 40%,#b6924a 80%,#8a692f 100%);
  background-clip:padding-box;
  box-shadow:0 0 14px rgba(246,220,156,.45);
}
.home-body::-webkit-scrollbar-thumb:active,#devPanel::-webkit-scrollbar-thumb:active{
  background:linear-gradient(180deg,#dcb96f 0%,#a3823f 60%,#7a5c2a 100%);
  background-clip:padding-box;
}
.home-body::-webkit-scrollbar-corner,#devPanel::-webkit-scrollbar-corner{background:transparent}

@media (max-width:360px){.hero h1{font-size:36px}.chip{font-size:11px;padding:3px 7px}}

/* 关卡测试台 */
body.lite #fx{display:none}
body.noframe .tile .cell{opacity:0}
body.lite .tile .cell{box-shadow:inset 0 0 0 1px rgba(246,220,156,.16)}
body.lite .tile.lifted .cell,body.lite .tile.aim .cell{box-shadow:inset 0 0 0 2px rgba(255,232,170,.95)}
body.lite .boardwrap{perspective:none}
body.lite .bg-glow,body.lite .vign{display:none}
body.lite #boardFrame{will-change:auto}
body.lite .boardframe::before{display:none}
body.lite .tile{transform-style:flat}
body.lite .tile .ic{transition:none}
body.lite .tile .cell{transition:none}
#devBtn{position:fixed;right:8px;bottom:232px;width:42px;height:42px;opacity:.92;border-radius:50%;z-index:70;display:none;
  align-items:center;justify-content:center;font-size:12px;letter-spacing:1px;color:#ffe6a8;
  background:linear-gradient(180deg,rgba(32,44,60,.96),rgba(10,16,26,.98));
  border:1px solid rgba(255,220,140,.55);box-shadow:0 6px 16px rgba(0,0,0,.55);padding:0}
#devBtn.on{display:flex}
#devPanel{position:fixed;left:12px;right:12px;bottom:150px;max-height:70vh;overflow:auto;z-index:71;display:none;padding:14px;
  border-radius:16px;color:#e2ecf6;font-size:12px;
  background:linear-gradient(180deg,rgba(18,26,38,.98),rgba(8,12,20,.99));
  border:1px solid rgba(255,220,140,.38);box-shadow:0 20px 44px rgba(0,0,0,.62)}
#devPanel.on{display:block}
#devPanel .dp-head{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:#ffe6a8;margin-bottom:10px}
#devPanel .dp-head i{font-style:normal;font-size:20px;line-height:1;color:#9fb4c8;padding:0 4px}
#devPanel .dp-row{display:flex;align-items:center;gap:8px;margin:8px 0}
#devPanel .dp-row label{width:34px;color:#9db4c6}
#devPanel select,#devPanel input[type=range]{flex:1;min-width:0;height:28px;border-radius:8px;background:#0e1826;
  color:#e6f0fa;border:1px solid rgba(255,255,255,.16);font-size:13px;padding:0 6px;-webkit-appearance:none;appearance:none}
#devPanel input[type=range]{padding:0;background:transparent;border:0;height:22px}
#devPanel input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;
  background:linear-gradient(180deg,#ffe8b6,#e8b455);border:1px solid rgba(255,235,190,.9);box-shadow:0 2px 6px rgba(0,0,0,.5)}
#devPanel input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;
  background:linear-gradient(90deg,rgba(255,214,140,.8),rgba(120,200,255,.6))}
#devPanel .dp-row b{width:30px;text-align:right;color:#ffe6a8}
#devPanel .dp-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
#devPanel button{height:34px;border-radius:10px;font-size:13px;color:#dce9f6;
  background:linear-gradient(180deg,rgba(40,56,76,.95),rgba(18,26,38,.95));border:1px solid rgba(255,255,255,.16)}
#devPanel .dp-hide{width:100%;margin-top:8px;color:#ffd7a8;border-color:rgba(255,200,130,.45)}
#devPanel .dp-tip{color:#8ba0b4;font-size:11px;line-height:1.5;margin-top:6px}

/* ===== 修行任务列表 ===== */
.tk-list{max-height:54vh;overflow-y:auto;margin:-2px -2px 0;padding:2px}
.tk-row{display:flex;align-items:center;gap:10px;padding:9px 10px;margin-bottom:7px;border-radius:10px;
  background:linear-gradient(180deg,rgba(22,34,52,.86),rgba(14,22,36,.9));border:1px solid rgba(120,170,220,.16)}
.tk-row.ready{border-color:rgba(226,190,110,.75);box-shadow:0 0 0 1px rgba(226,190,110,.2),0 0 14px rgba(226,190,110,.12)}
.tk-row.done{opacity:.55}
.tk-main{flex:1;min-width:0}
.tk-name{font-size:12.5px;color:#e7eefb;line-height:1.5;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tk-rew{font-size:11px;color:#93a8c4;margin-top:3px}
.tk-num{color:#e2be6e}
.tk-tag{font-size:10px;padding:1px 6px;border-radius:6px;background:rgba(120,150,190,.25);color:#b9cbe2}
.tk-tag.ready{background:rgba(226,190,110,.24);color:#f1d08f}
.tk-tag.done{background:rgba(120,150,190,.16);color:#8fa2ba}
.tk-btn{flex:0 0 auto;min-width:62px;min-height:32px;border-radius:9px;border:1px solid rgba(226,190,110,.6);
  background:linear-gradient(180deg,#e8c677,#c39a45);color:#2a1e0c;font-size:12px;font-weight:700}
.tk-btn.off{border-color:rgba(120,150,190,.3);background:rgba(120,150,190,.12);color:#8fa2ba;font-weight:400}

/* ===== 排行榜大弹窗 ===== */
.panel.big{max-width:460px;width:94vw;padding:18px 16px 16px}
.rkclose{position:absolute;right:10px;top:8px;width:34px;height:34px;border:0;border-radius:50%;
  background:rgba(255,255,255,.08);color:#cfe2f5;font-size:20px;line-height:1}
.rktabs{margin:10px 0 10px}
.rkscroll{max-height:64vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
.rankfoot{font-size:10px;color:#7d93ab;text-align:center;margin-top:10px}

/* ===== 全屏弹窗（排行榜 / 修行任务）：内容撑满，按钮压底部 ===== */
.panel.full{width:96vw;max-width:none;height:88vh;max-height:88vh;display:flex;flex-direction:column;padding:18px 14px 14px}
.panel.full > h3, .panel.full > .psub, .panel.full > .tabs, .panel.full > .rankfoot, .panel.full > .row2{flex:0 0 auto}
.panel.full .rkscroll, .panel.full #infoBody{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;-webkit-overflow-scrolling:touch}
.panel.full .row2{margin-top:12px}

/* 坊市购买按钮：薄亮片，不留厚底投影 */
.buybtn{flex:0 0 auto;width:52px;height:32px;margin-left:8px;border:0;border-radius:9px;font-size:12.5px;font-weight:700;color:#3a2405;
  background:linear-gradient(180deg,#ffe6ad,#e5b458 60%,#cf9a3c);box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 1px 3px rgba(0,0,0,.35)}
.buybtn:active{transform:translateY(1px);background:linear-gradient(180deg,#f2d79b,#d5a44b)}

/* 任务列表在“全屏弹窗”里要撑满可滚区，别被旧的 54vh 卡住留一大片空白 */
.panel.full #infoBody .tk-list{max-height:none;overflow:visible;margin:0;padding:0}

/* ===== 天机轮盘 ===== */
.wheelbox{position:relative;flex:0 0 auto;margin:14px auto 10px;width:min(78vw,300px);aspect-ratio:1/1}
.wheel{position:absolute;inset:0;border-radius:50%;transition:transform 3.4s cubic-bezier(.15,.75,.1,1);
  background:conic-gradient(#223447 0deg 45deg,#1a2735 45deg 90deg,#223447 90deg 135deg,#1a2735 135deg 180deg,#223447 180deg 225deg,#1a2735 225deg 270deg,#223447 270deg 315deg,#1a2735 315deg 360deg);
  box-shadow:0 0 0 2px rgba(246,220,156,.5),inset 0 0 30px rgba(0,0,0,.55),0 10px 24px rgba(0,0,0,.45)}
.wsec{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-start;pointer-events:none}
.wsec span{margin-top:16px;font-size:11px;color:#f2e3bb;line-height:1.35;text-align:center;width:56px;letter-spacing:.5px}
.wpin{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:0;height:0;
  border-left:9px solid transparent;border-right:9px solid transparent;border-top:16px solid #ffd77a;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.wheelmsg{flex:0 0 auto;text-align:center;font-size:12px;color:#a9c0d8;min-height:18px}
.wheelbtns{flex:0 0 auto;display:flex;gap:10px;margin-top:12px}
.wheelbtns .pbtn{flex:1}
.pbtn[disabled]{opacity:.55}

/* 轮盘内容垂直居中，别在最上面挤一堆、下面空一大片 */
#mask-wheel .panel.full{justify-content:center;gap:6px}
#mask-wheel .panel.full h3{margin-bottom:0}

/* 中奖弹窗：盖在轮盘之上 */
.mask-get{z-index:70}
.getbig{margin:14px 0 4px;text-align:center;font-size:22px;letter-spacing:2px;color:#ffe08a;font-weight:700}

/* ---------- 每日签到：全屏格子 ---------- */
.signgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;flex:1;overflow-y:auto;padding:4px 2px 8px}
.signcell{position:relative;border-radius:14px;padding:10px 12px;background:linear-gradient(180deg,rgba(28,38,42,.92),rgba(16,24,28,.92));border:1px solid rgba(255,224,138,.18);color:#dfe7e6;display:flex;flex-direction:column;gap:3px}
.signcell.done{opacity:.62;border-color:rgba(255,255,255,.12)}
.signcell.today{border-color:rgba(255,208,96,.85);box-shadow:0 0 0 1px rgba(255,208,96,.35) inset,0 0 14px rgba(255,190,60,.18)}
.signcell.wait{opacity:.9}
.scNo{font-size:12px;color:#9fb2b0;letter-spacing:1px}
.scDate{font-size:19px;font-weight:700;color:#ffe6a8}
.scDate small{font-size:12px;font-weight:400;color:#9fb2b0;margin-left:4px}
.scLunar{font-size:13px;color:#bfa76a}
.scRew{font-size:12px;color:#cfd9d7;line-height:1.5}
.scTag{position:absolute;top:8px;right:10px;font-size:11px;padding:2px 7px;border-radius:9px;background:rgba(0,0,0,.35);color:#9fb2b0}
.signcell.today .scTag{background:rgba(255,208,96,.22);color:#ffe08a}
.signcell.done .scTag{background:rgba(120,160,140,.2);color:#9ad0b0}

/* 签到按钮不再折行 */
#mask-sign .row2 .pbtn{font-size:15px;padding:12px 6px;white-space:nowrap}
#mask-sign .row2{display:flex;gap:10px}
#mask-sign .row2 .pbtn{flex:1}

/* 第七格（周日满勤）跨两列 */
.signcell.last{grid-column:span 2}
.signcell.miss{opacity:.5}

/* 转盘：看广告免费转（左），灵石转（右） */
.wheelbtns{display:flex;gap:10px;align-items:stretch}
.wheelbtns .pbtn{flex:1}
.wheelbtns .adspin{flex:0 0 38%;font-size:14px;line-height:1.35}
.wheelbtns .adspin small{display:block;font-size:11px;opacity:.72}

/* 微信安全区（刘海 / 圆角底部）：网页里这两个变量为 0，不影响布局 */
:root{ --safeTop:0px; --safeBottom:0px; }
.topbar{ padding-top: calc(8px + var(--safeTop)); }
#nav{ padding-bottom: calc(6px + var(--safeBottom)); }
.rav img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }

/* 境界条三态：当前最亮 / 已开启亮 / 未开启暗 */
.rcard.done{border-color:rgba(255,214,140,.42);box-shadow:0 10px 20px -10px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.13),0 0 14px -6px rgba(255,196,110,.5)}
.rcard.done .th{opacity:.62;filter:saturate(1.08) brightness(1.06)}
.rcard.done b{color:#ffe9bd}
.rcard.done .lv{color:#ffd98f}
.rcard.lock{filter:none}
.rcard.lock .th{opacity:.46;filter:saturate(.55) brightness(.92) contrast(1.03)}
.rcard.lock{border-color:rgba(160,180,200,.22);background:linear-gradient(180deg,rgba(16,24,36,.9),rgba(6,10,18,.94));box-shadow:0 12px 22px -10px rgba(0,0,0,.88),0 3px 8px -2px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.07)}
.rcard.lock b{color:#b3c2d1;text-shadow:0 1px 6px rgba(0,0,0,.9)}
.rcard.lock small{color:#8fa3b6}
.rcard.lock .lv{color:#a3b2c2}
.rcard.cur .th{opacity:.72;filter:saturate(1.12) brightness(1.1)}

/* 境界卡片文字清晰度修正：底部压暗层 + 字号/描边加强 + 固定高度 */
.rcard{height:122px}
.rcard .th{opacity:.5}
.rcard::before{content:"";position:absolute;left:0;right:0;bottom:0;height:78%;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,8,14,0) 0%,rgba(4,8,14,.55) 45%,rgba(3,6,11,.9) 100%)}
.rcard .in{position:absolute;left:10px;right:10px;bottom:10px;z-index:2}
.rcard b{font-size:17px;letter-spacing:1.5px;line-height:1.15}
.rcard small{font-size:11px;color:#cfe3f1;line-height:1.25;margin-top:4px;letter-spacing:.2px;
  text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 8px rgba(0,0,0,.7);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcard .lv{font-size:11px;margin-top:6px;line-height:1.2;text-shadow:0 1px 3px rgba(0,0,0,.9)}
.rcard.lock b{color:#a9b6c4}
.rcard.lock small{color:#8fa2b5}
.rcard.lock .lv{color:#95a5b6}
.rcard.lock .in{z-index:2}
.rcard.lock::after{top:auto;bottom:8px;right:8px}

/* 再加强一档：卡片底部压暗更实，小字加深描边，保证任何背景上都清楚 */
.rcard::before{height:84%;background:linear-gradient(180deg,rgba(4,8,14,0) 0%,rgba(4,8,14,.68) 40%,rgba(2,5,9,.96) 100%)}
.rcard small{font-weight:600;color:#e2eff8;text-shadow:0 1px 2px #000,0 0 6px rgba(0,0,0,.9)}
.rcard.cur small{color:#ffe6b8}
.rcard .lv{font-weight:600}

/* 关键：压暗层必须在背景图之上（原先被 .th 盖住了） */
.rcard .th{z-index:0}
.rcard::before{z-index:1}
.rcard .in{z-index:2}

/* 微调：压暗层只铺下半部，保留卡片上半的背景画面 */
.rcard::before{height:66%;background:linear-gradient(180deg,rgba(4,8,14,0) 0%,rgba(4,8,14,.5) 45%,rgba(2,5,9,.9) 100%)}

/* 卡片尺寸恢复原样：宽度仍 104px、高度随内容自适应（不再拉高） */
.rcard{height:auto}
.rcard .in{position:relative;left:auto;right:auto;bottom:auto;z-index:2}
.rcard::before{height:78%}
.rcard b{font-size:16px;line-height:1.1}
.rcard small{font-size:10.5px;margin-top:2px;line-height:1.2}
.rcard .lv{font-size:10.5px;margin-top:5px;line-height:1.2}
.rcard.lock::after{top:6px;bottom:auto;right:6px;font-size:9px}

/* 顶部游戏名（备案截图需可见，也当品牌标识） */
.brand{display:block;text-align:center;font-size:15px;letter-spacing:7px;color:#ffdc9b;font-weight:600;
  padding:2px 0 6px;text-shadow:0 2px 10px rgba(0,0,0,.9),0 0 18px rgba(255,186,92,.35);opacity:.95}

.brand{letter-spacing:4px;padding:8px 0 4px;font-size:14px}

/* 关卡界面右上角游戏名水印（备案截图需可见名称） */
.gwatermark{position:absolute;right:10px;top:8px;z-index:3;font-size:11px;letter-spacing:2px;
  color:rgba(255,220,155,.55);text-shadow:0 1px 4px rgba(0,0,0,.8);pointer-events:none}

.gwatermark{top:auto;bottom:4px;right:12px;font-size:9px;letter-spacing:.5px;opacity:.72}

/* 弹窗标题下补一行游戏名（备案截图需截图内可见小游戏名） */
.panel.full h3::after{content:"从炼气到道祖的修仙路";display:block;font-size:10px;letter-spacing:3px;font-weight:400;
  color:rgba(255,220,155,.5);margin-top:5px}

.panel h3::after{content:"从炼气到道祖的修仙路";display:block;font-size:10px;letter-spacing:3px;font-weight:400;
  color:rgba(255,220,155,.5);margin-top:5px}

/* 主页底部游戏名（备案要求截图内可见游戏名，放在导航栏上方，低调小字） */
.gname{position:fixed;left:0;right:0;bottom:calc(58px + var(--safeBottom));text-align:center;z-index:2;pointer-events:none;
  font-size:9px;letter-spacing:2.5px;color:#f3dfae;opacity:.6;text-shadow:0 1px 4px rgba(0,0,0,.95)}
#scr-home .gname{display:block}
#scr-game .gname{display:none}

/* 滚动条：统一换成暗色底 + 暗金滑块，避免浏览器默认白条 */
html{scrollbar-width:thin;scrollbar-color:rgba(240,208,140,.55) transparent}
.home-body,.tk-list,.rkscroll,.signgrid,#infoBody,.panel,.panel.full,#devPanel,.shoplist{scrollbar-width:thin;scrollbar-color:rgba(240,208,140,.55) transparent}
*::-webkit-scrollbar{width:6px;height:6px}
*::-webkit-scrollbar-button{display:none;width:0;height:0}
*::-webkit-scrollbar-track{background:rgba(6,10,18,.5);border-radius:3px}
*::-webkit-scrollbar-track-piece{background:transparent}
*::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(246,220,156,.62),rgba(150,112,44,.55));
  border-radius:3px;border:1px solid rgba(0,0,0,.25)}
*::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,rgba(255,232,176,.85),rgba(180,136,56,.8))}
*::-webkit-scrollbar-corner{background:transparent}