/* 放置天堂 — 原創介面：手機直式單欄（桌機置中，最大寬 460px） */
:root{--r:14px;--fs:16px;--w:460px;--tab:64px}
body.th-night{--bg:#0d0c10;--bg2:#17151c;--card:#1e1b24;--card2:#26222e;--line:#3a3342;--tx:#f3eee6;--mut:#b4a99b;--pri:#d9a441;--pri2:#a97a24;--pritx:#1a1206;--acc:#ffcf6e;--bad:#e5534b;--good:#6fd08c;--hp:#d8433f;--mp:#3d84d6;--xp:#d9a441;--glow:rgba(217,164,65,.25)}
body.th-dawn{--bg:#efe7da;--bg2:#e4d9c7;--card:#fffaf2;--card2:#f6eee0;--line:#cfbfa5;--tx:#241d15;--mut:#6c5f4e;--pri:#9c3f1f;--pri2:#7a2f15;--pritx:#fff;--acc:#b5651d;--bad:#b3261e;--good:#2e7d4f;--hp:#c23b3b;--mp:#2f6fb0;--xp:#b8871b;--glow:rgba(156,63,31,.18)}
body.th-grove{--bg:#0b130e;--bg2:#122018;--card:#17291e;--card2:#1e3427;--line:#2f4a38;--tx:#eef6ef;--mut:#a5bfac;--pri:#8fd16a;--pri2:#5f9e3f;--pritx:#0d1a08;--acc:#ffd36b;--bad:#ef5350;--good:#7fdc85;--hp:#e05353;--mp:#4a90d9;--xp:#d4b13a;--glow:rgba(143,209,106,.2)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--bg);color:var(--tx);font:var(--fs)/1.55 "Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif}
body{background:var(--bg) url(../assets/background/background.png) center/cover fixed}
body::before{content:"";position:fixed;inset:0;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(3px);z-index:-1}
button{font:inherit;color:inherit;cursor:pointer}
input,select,textarea{font:inherit;font-size:16px;background:var(--bg2);color:var(--tx);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-height:44px;max-width:100%}
.hidden{display:none!important}
.muted{color:var(--mut)}.small{font-size:.95rem}.tiny{font-size:.85rem}
.btn{min-height:44px;border:1px solid var(--line);background:var(--card2);border-radius:12px;padding:8px 16px;font-weight:600;transition:filter .15s,transform .05s;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-align:center}
.btn:active{transform:scale(.97)}.btn:hover{filter:brightness(1.1)}.btn:disabled{opacity:.45;cursor:default;filter:none;transform:none}
.btn.pri{background:linear-gradient(180deg,var(--acc),var(--pri));border-color:var(--pri2);color:var(--pritx)}
.btn.warn{background:var(--bad);border-color:var(--bad);color:#fff}
.btn.ghost{background:transparent}.btn.wide{width:100%}.btn.big{min-height:52px;font-size:1.12em;padding:10px 20px}
.brand{font-weight:900;letter-spacing:3px;font-size:1.3em}.brand span{color:var(--pri)}.brand.big{font-size:2.4em;text-align:center;text-shadow:0 2px 14px var(--glow)}
/* ---------- 建立角色 ---------- */
#intro{min-height:100%;display:flex;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 12px 24px}
.intro-box{width:min(var(--w),100%);background:color-mix(in srgb,var(--card) 94%,transparent);border:1px solid var(--line);border-radius:20px;padding:20px 16px;display:flex;flex-direction:column;gap:14px;box-shadow:0 10px 40px rgba(0,0,0,.45)}
.fld{display:flex;flex-direction:column;gap:6px;font-weight:600}
.cls-pick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cls-pick .c{border:2px solid var(--line);border-radius:14px;padding:6px 4px;text-align:center;background:var(--bg2);font-size:.86em;font-weight:600;cursor:pointer;min-width:0}
.cls-pick .c div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cls-pick .c.sel{border-color:var(--pri);box-shadow:0 0 0 3px var(--glow);background:var(--card2)}
.cls-pick img{width:100%;aspect-ratio:1;object-fit:cover;object-position:top;border-radius:10px}
.cr-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.cr-stats .s{background:var(--bg2);border-radius:12px;padding:4px 6px 4px 12px;display:flex;justify-content:space-between;align-items:center;gap:4px;font-weight:600}
.cr-stats .s button{width:40px;height:40px;border:1px solid var(--line);background:var(--card2);border-radius:10px;padding:0;font-size:1.2em}
/* ---------- 主畫面：單欄 ---------- */
#game{display:flex;flex-direction:column;height:100dvh;width:min(var(--w),100%);margin:0 auto;background:var(--bg);box-shadow:0 0 60px rgba(0,0,0,.6);position:relative}
#hdr{display:flex;flex-wrap:wrap;position:relative;align-items:center;gap:10px;padding:max(8px,env(safe-area-inset-top)) 12px 8px;background:var(--bg2);border-bottom:1px solid var(--line);min-height:60px}
#hdr .brand{display:none}
#hero-chip{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
#hero-chip img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:top;border:2px solid var(--pri);background:var(--card)}
#hero-chip b{display:block;font-size:1.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#hero-chip .tiny{color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#hero-chip>div{min-width:0}
.cur{display:flex;gap:10px;align-items:center;white-space:nowrap;font-size:1.02em}
.cur b{font-variant-numeric:tabular-nums}
.net{width:12px;height:12px;border-radius:50%;display:inline-block;background:var(--mut)}.net.on{background:var(--good);box-shadow:0 0 6px var(--good)}.net.connecting{background:var(--acc)}.net.error{background:var(--bad)}
#main{flex:1;display:flex;flex-direction:column;min-height:0}
#stage{flex:none;display:flex;flex-direction:column}
#battle{position:relative;height:clamp(230px,38dvh,320px);background:linear-gradient(#22304a,#1b2638 52%,#2b2519 53%,#15110b) center/cover no-repeat;overflow:hidden}
#battle::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.35),transparent 30%,transparent 60%,rgba(0,0,0,.55));pointer-events:none}
#sc-top{position:absolute;top:8px;left:10px;right:10px;display:flex;justify-content:space-between;align-items:center;gap:8px;z-index:4;color:#fff;text-shadow:0 1px 3px #000;font-weight:700}
#bt-map{font-size:1.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sc-rate{white-space:nowrap}
#bt-field{position:absolute;inset:40px 6px 6px;display:flex;align-items:flex-end;justify-content:space-between;gap:4px;z-index:2}
#bt-allies{position:absolute;top:0;left:4px;display:flex;flex-direction:column;gap:4px;z-index:3}
.ally{background:rgba(0,0,0,.6);color:#fff;border-radius:10px;padding:4px 8px;font-size:.82em;min-width:110px}
.ally .ab{height:5px;background:#333;border-radius:3px;overflow:hidden;margin-top:2px}.ally .ab i{display:block;height:100%;background:var(--good)}
.ally.away{opacity:.5}
.unit{position:relative;text-align:center;color:#fff}
.spr{transform:scale(var(--sc,2));transform-origin:50% 100%;max-width:none;display:block}
#bt-me{position:absolute;left:24%;bottom:6px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;z-index:2}
.me-stack{position:relative;display:inline-block}
#me-sh{position:absolute;left:0;top:0;opacity:.45;pointer-events:none}#me-img{position:relative}#me-w{position:absolute;left:0;top:0;pointer-events:none;mix-blend-mode:screen;z-index:1}#me-img.broken{visibility:hidden;width:70px;height:110px}
#me-pet{font-size:.8rem;text-shadow:0 1px 2px #000;position:absolute;bottom:-4px;white-space:nowrap}
#bt-mobs{position:absolute;inset:0}
.foe{position:absolute;display:flex;flex-direction:column;align-items:center;transform:translateX(-50%)}
.foe{z-index:2}
#bt-mobs.n1 .foe:nth-child(1){left:70%;bottom:4px}
#bt-mobs.n2 .foe:nth-child(1){left:56%;bottom:4px;z-index:3}#bt-mobs.n2 .foe:nth-child(2){left:83%;bottom:40px}
#bt-mobs.n3 .foe:nth-child(1){left:54%;bottom:4px;z-index:3}#bt-mobs.n3 .foe:nth-child(2){left:83%;bottom:22px;z-index:3}#bt-mobs.n3 .foe:nth-child(3){left:69%;bottom:108px;z-index:1}
#bt-mobs.n4 .foe:nth-child(1){left:50%;bottom:4px;z-index:3}#bt-mobs.n4 .foe:nth-child(2){left:80%;bottom:4px;z-index:3}#bt-mobs.n4 .foe:nth-child(3){left:60%;bottom:110px;z-index:1}#bt-mobs.n4 .foe:nth-child(4){left:86%;bottom:116px;z-index:1}
.foe .nm{font-size:.78rem;font-weight:800;color:#fff;text-shadow:0 1px 3px #000,0 0 2px #000;white-space:nowrap;max-width:98px;overflow:hidden;text-overflow:ellipsis;background:rgba(0,0,0,.45);border-radius:6px;padding:0 4px;margin-top:2px;position:relative;z-index:2}.foe .nm .lv{color:#ffd9a0;font-weight:700}.foe.boss .nm{color:var(--acc)}
.foe .bar{height:6px;width:72px;margin:1px auto 0;background:rgba(0,0,0,.7);border-radius:3px;overflow:hidden;position:relative;z-index:2}.foe .bar i{display:block;height:100%;background:linear-gradient(90deg,#ff6b5e,var(--bad))}
.foe .ph{width:64px;height:64px;border:1px dashed #fff8;border-radius:50%;display:none;align-items:center;justify-content:center;font-size:.75rem;color:#fff}
.mob-ghost{position:absolute;pointer-events:none;object-fit:contain;transition:opacity .3s;opacity:1;z-index:3}
#bt-dead{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.65);color:#fff;font-size:1.25em;font-weight:700;z-index:5}
.fly{position:absolute;z-index:6;font-weight:900;font-size:1.15em;pointer-events:none;animation:fly .9s ease-out forwards;text-shadow:0 2px 3px #000}
.fly.mob{color:#fff}.fly.crit{color:var(--acc);font-size:1.45em}.fly.me{color:#ff8a80}.fly.heal{color:#8dffb0}.fly.drop{color:#ffd56a}
@keyframes fly{from{transform:translateY(0);opacity:1}to{transform:translateY(-50px);opacity:0}}
#vitals{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 10px 6px;background:var(--bg2)}
.vbar{position:relative;height:22px;border-radius:11px;background:#000a;overflow:hidden;border:1px solid var(--line)}.vbar.xp{grid-column:1/3;height:16px}
.vbar i{position:absolute;inset:0 auto 0 0;transition:width .25s}.vbar.hp i{background:linear-gradient(180deg,#f06a5f,var(--hp))}.vbar.mp i{background:linear-gradient(180deg,#6aa8f0,var(--mp))}.vbar.xp i{background:linear-gradient(180deg,#f2cf7a,var(--xp))}
.vbar span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.84em;font-weight:800;color:#fff;text-shadow:0 1px 2px #000;font-variant-numeric:tabular-nums;white-space:nowrap}
.vbar.xp span{font-size:.74em}
#stage-ctl{display:flex;gap:8px;align-items:center;padding:6px 10px 8px;background:var(--bg2);border-bottom:1px solid var(--line)}
#bt-toggle{flex:none;min-width:116px}
#buffs{display:flex;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none;min-width:0}
.buff{flex:none;font-size:.8em;background:var(--card2);border:1px solid var(--line);border-radius:14px;padding:3px 9px;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}.buff img{width:18px;height:18px;border-radius:4px}
#ticker{display:none}
#desk{flex:1;display:flex;flex-direction:column;min-height:0}
#view{flex:1;overflow:auto;padding:12px 12px calc(var(--tab) + 16px);min-width:0;overscroll-behavior:contain}
#rail{position:absolute;left:0;right:0;bottom:0;height:calc(var(--tab) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(6,1fr);background:color-mix(in srgb,var(--bg2) 96%,transparent);border-top:1px solid var(--line);z-index:20;backdrop-filter:blur(6px)}
.rl{position:relative;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:.78em;font-weight:700;color:var(--mut);min-width:0;padding:0}
.rl i{font-style:normal;font-size:1.55em;line-height:1.1;filter:grayscale(.6)}.rl span{white-space:nowrap}
.rl.on{color:var(--pri)}.rl.on i{filter:none}.rl.on::before{content:"";position:absolute;top:0;left:22%;right:22%;height:3px;border-radius:0 0 3px 3px;background:var(--pri)}
.rl em{position:absolute;top:6px;right:calc(50% - 22px);background:var(--bad);color:#fff;border-radius:9px;font-size:.78em;font-style:normal;padding:0 5px;min-width:18px;line-height:18px}
.seg{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -12px 12px;padding:0 12px}
.seg button{flex:none;min-height:42px;font-size:.95rem;border:1px solid var(--line);background:var(--card);border-radius:20px;padding:6px 16px;color:var(--mut);font-weight:700}
.seg button.on{background:var(--pri);border-color:var(--pri);color:var(--pritx)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin-bottom:12px}
.panel h3{margin:0 0 8px;font-size:1.08em;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;color:var(--acc)}
.panel h3::before{content:"";width:4px;height:1.05em;border-radius:2px;background:var(--pri);margin-right:-2px}
.panel h3 .tiny,.panel h3 .tag{color:var(--mut);font-weight:600}
.row{display:flex;align-items:center;gap:10px;padding:10px 2px;border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);min-height:52px;flex-wrap:wrap}.row:last-child{border-bottom:0}
.row .g{flex:1 1 120px;min-width:0;overflow-wrap:anywhere}.row.click{cursor:pointer}.row.click:active{background:var(--bg2)}.row.cur{box-shadow:inset 3px 0 0 var(--pri);padding-left:10px}
.row>.btn{flex:none}
.tag{display:inline-block;font-size:.8rem;border-radius:10px;padding:0 8px;border:1px solid var(--line);white-space:nowrap}
.tag.ok{border-color:var(--good);color:var(--good)}.tag.hard{border-color:var(--acc);color:var(--acc)}.tag.bad{border-color:var(--bad);color:var(--bad)}
.ico{width:28px;height:28px;object-fit:contain;vertical-align:middle}
.cells{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
.cell{position:relative;aspect-ratio:1;background:radial-gradient(circle,var(--card2),var(--bg2));border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden}
.cell img{max-width:78%;max-height:78%}.cell .alt{font-size:.8rem;text-align:center;padding:2px;color:var(--mut);line-height:1.2}
.cell .en{position:absolute;top:2px;left:4px;font-size:.85rem;color:var(--acc);font-weight:800;text-shadow:0 1px 2px #000}.cell .n{position:absolute;bottom:2px;right:4px;font-size:.85rem;font-weight:700;text-shadow:0 1px 2px #000}
.cell .lk{position:absolute;top:2px;right:3px;font-size:.7em}.cell.eq{border-color:var(--pri);box-shadow:inset 0 0 0 1px var(--pri)}
.doll-paper{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.doll-paper .slot{background:var(--bg2);border:1px dashed var(--line);border-radius:12px;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.82rem;color:var(--mut);cursor:pointer;position:relative;text-align:center;padding:2px;line-height:1.2;overflow:hidden;overflow-wrap:anywhere}
.doll-paper .slot img{max-width:66%;max-height:58%}.doll-paper .slot.f{border-style:solid;border-color:var(--pri);color:var(--tx)}
.kv{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:.96em}
.npcs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.npc{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;min-height:64px;min-width:0;overflow-wrap:anywhere}.npc:active{border-color:var(--pri)}
.npc b{display:block;font-size:1.02em}.npc .fn{font-size:.85rem;color:var(--pri);font-weight:700}.npc.na{opacity:.55}
.chat{height:min(52dvh,420px);overflow:auto;background:var(--bg2);border-radius:12px;padding:8px 10px;font-size:.96em}
.chat .m{padding:3px 0;overflow-wrap:anywhere}.chat .who{color:var(--pri);font-weight:700}.chat .party .who{color:var(--acc)}.chat .sys{color:var(--mut)}
.chat-in{display:flex;gap:8px;margin-top:8px}.chat-in input{flex:1;min-width:0}
.dolls{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}
.dc{background:var(--bg2);border:2px solid var(--line);border-radius:12px;padding:6px;text-align:center;font-size:.82em;cursor:pointer;min-width:0;overflow-wrap:anywhere}.dc img{width:60px;height:60px;object-fit:contain}
.dc.t2{border-color:#4caf50}.dc.t3{border-color:#42a5f5}.dc.t4{border-color:#ab47bc}.dc.t5{border-color:#ffb300}.dc.on{box-shadow:0 0 0 3px var(--acc)}
#modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center;z-index:50}
.mbox{width:min(var(--w),100%);max-height:88dvh;overflow:auto;background:var(--card);border:1px solid var(--line);border-bottom:0;border-radius:20px 20px 0 0;padding:16px 14px calc(14px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;animation:up .18s ease-out}
@keyframes up{from{transform:translateY(30px);opacity:.4}to{transform:none;opacity:1}}
.mbox h3{color:var(--acc)}
.ihead{display:flex;gap:12px;align-items:center}.ihead img{width:56px;height:56px;object-fit:contain;background:var(--bg2);border-radius:10px;padding:4px}
.ilines{white-space:pre-line;font-size:.96em;background:var(--bg2);border-radius:10px;padding:10px;overflow-wrap:anywhere}
.acts{display:flex;flex-wrap:wrap;gap:8px}.acts .btn{flex:1 1 auto}
#toast{position:fixed;left:50%;bottom:calc(var(--tab) + 20px);transform:translateX(-50%);background:var(--tx);color:var(--bg);padding:10px 18px;border-radius:22px;z-index:60;max-width:min(420px,90%);text-align:center;font-weight:700;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.text-red-300,.text-red-400{color:#f28b82}.text-blue-300,.text-blue-400{color:#8ab4f8}.text-yellow-300,.text-yellow-400,.text-amber-300{color:#fdd663}.text-purple-300,.text-purple-400,.text-fuchsia-300{color:#d7aefb}.text-green-300,.text-green-400,.text-emerald-300{color:#81c995}.text-orange-300,.text-orange-400{color:#fcad70}
@media (max-width:370px){:root{--fs:15px}.rl span{font-size:.92em}.cls-pick .c{font-size:.8em}}
@media (min-width:700px){#game{border-left:1px solid var(--line);border-right:1px solid var(--line)}}
.row .g *{overflow-wrap:anywhere}
.tiny,.small{overflow-wrap:anywhere}
.row.shop{flex-wrap:nowrap}.row.shop .g{min-width:0;flex:1 1 auto}.row.shop input{width:56px}.alt.ico{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;background:rgba(255,255,255,.08);font-size:.85rem}
.foe .ph{width:56px;height:56px}.foe .ph{font-size:0}
/* ---- 頂欄 AC/MR、EXP 條 ---- */
.cur{flex-wrap:wrap;justify-content:flex-end;row-gap:0}
.acmr{display:flex;gap:10px;font-size:.85rem;color:var(--mut);width:100%;justify-content:flex-end}.acmr b{color:var(--tx)}
#hdr-exp{position:absolute;left:0;right:0;bottom:0;height:5px;background:rgba(0,0,0,.35)}#hdr-exp i{display:block;height:100%;background:var(--xp)}#hdr-exp span{display:none}
/* ---- 狀態列 ---- */
#status-row{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.buff{padding:2px 6px 2px 2px;gap:3px;border-radius:10px}.buff img{width:26px;height:26px;border-radius:6px}.buff em{font-style:normal;width:26px;height:26px;border-radius:6px;background:var(--bg2);display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;color:var(--acc)}.buff small{font-size:.8rem;font-weight:700}.buff.low small{color:var(--bad)}
/* ---- 子分頁 ---- */
.subtabs.seg{position:sticky;top:0;z-index:5;background:var(--bg);padding-top:6px;padding-bottom:6px;margin-bottom:6px}
.subtabs.seg button{font-weight:800}
.segwrap{position:relative;padding:0 34px;margin:0 0 12px}.segwrap .seg{scroll-behavior:smooth;margin:0;padding:0}.segwrap.subtabs-w{position:sticky;top:0;z-index:5;background:var(--bg);padding-top:6px;padding-bottom:6px}
.segarr{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--card2);font-size:1.4rem;line-height:1;z-index:6;padding:0}
.segarr.l{left:0}.segarr.r{right:0}.segarr:disabled{visibility:hidden}
.subtabs.seg + * {scroll-margin-top:60px}
/* ---- 夥伴／娃娃 ---- */
#bt-pet{position:absolute;left:6%;bottom:2px;z-index:3;display:flex;flex-direction:column;align-items:center;transform:translateX(-30%)}#bt-pet .nm{font-size:.75rem;color:#fff;text-shadow:0 1px 2px #000;white-space:nowrap}
#bt-doll{position:absolute;left:38%;bottom:96px;width:40px;height:40px;object-fit:contain;z-index:2;animation:dollf 3s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(255,220,140,.6))}
@keyframes dollf{50%{transform:translateY(-8px)}}
/* ---- 喝藥／施法回饋 ---- */
.potfx{position:absolute;z-index:9;display:flex;align-items:center;gap:3px;background:rgba(0,0,0,.6);border-radius:10px;padding:2px 6px;color:#9ef0a8;font-weight:800;font-size:.85rem;animation:potup 1.1s ease-out forwards;pointer-events:none}.potfx img{width:24px;height:24px}
@keyframes potup{0%{opacity:0;transform:translateY(6px)}15%{opacity:1}100%{opacity:0;transform:translateY(-30px)}}
#bt-me.glow-h .me-stack{animation:glowh .6s}#bt-me.glow-b .me-stack{animation:glowb .8s}
@keyframes glowh{50%{filter:drop-shadow(0 0 10px #6fff8a) brightness(1.25)}}
@keyframes glowb{50%{filter:drop-shadow(0 0 14px #ffd36b) brightness(1.3)}}
.fly.buffn{color:#ffd36b;font-size:.95rem}
.row.sup{gap:8px}.row.sup .ab{font-size:.85rem;white-space:nowrap;display:flex;align-items:center;gap:4px;min-height:44px}
.dbar{height:6px;background:var(--bg2);border-radius:4px;margin-top:4px}.dbar i{display:block;height:100%;background:var(--pri);border-radius:4px}
.rk{width:28px;text-align:center;color:var(--acc)}
.row .g .tiny{white-space:normal;text-overflow:clip}

#marquee{position:absolute;left:0;right:0;top:30px;height:26px;overflow:hidden;background:linear-gradient(90deg,transparent,rgba(80,20,90,.85) 10%,rgba(80,20,90,.85) 90%,transparent);z-index:8;pointer-events:none}
#marquee span{position:absolute;white-space:nowrap;top:3px;left:100%;font-size:.85rem;font-weight:800;color:#ffe9a8;animation:mq 13s linear forwards}
@keyframes mq{to{transform:translateX(calc(-100% - 460px))}}
.foe{cursor:pointer}
/* ---------- 擴充 ---------- */
#hero-chip>div{min-width:84px;flex:1}
.cur{flex-wrap:wrap;justify-content:flex-end;row-gap:2px;column-gap:8px;min-width:0}
@media (max-width:400px){.cur{font-size:.9em;column-gap:6px}#hero-chip{gap:6px}#hero-chip img{width:38px;height:38px}#hdr{gap:6px;padding-left:8px;padding-right:8px}}
@keyframes foeIn{0%{opacity:0;filter:brightness(3) saturate(0)}60%{opacity:1;filter:brightness(1.6)}100%{opacity:1;filter:none}}
.foe{animation:foeIn .55s ease-out}
.foe.tgt .nm{outline:2px solid var(--acc);color:var(--acc)}
.foe.tgt::after{content:'▼';position:absolute;top:-14px;left:50%;transform:translateX(-50%);color:var(--acc);font-size:.8rem;text-shadow:0 1px 2px #000;animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.4}}
#bt-sum{position:absolute;left:20%;bottom:4px;display:flex;gap:2px;z-index:3;pointer-events:none}
#bt-sum .sum{position:relative;display:flex;flex-direction:column;align-items:center}#bt-sum .spr{max-height:none;max-width:none}
#bt-sum .nm{font-size:.7rem;color:#cfe;text-shadow:0 1px 2px #000;white-space:nowrap}
#bt-mates{position:absolute;right:6px;bottom:6px;display:flex;gap:4px;z-index:4;max-width:60%;flex-wrap:wrap;justify-content:flex-end;pointer-events:none}
.mate{display:flex;align-items:center;gap:3px;background:rgba(0,0,0,.55);border-radius:12px;padding:1px 6px 1px 1px;font-size:.7rem;color:#dfe}
.mate img{width:20px;height:20px;border-radius:50%;object-fit:cover;object-position:top}.mate.more{padding:1px 6px}
.mv-btn{position:absolute;right:6px;top:30px;z-index:6;width:40px;height:40px;border-radius:8px;border:1px solid var(--line);background:rgba(0,0,0,.5);padding:0;font-size:1rem;color:#fff}
#mapview{position:absolute;inset:0;z-index:5;background:rgba(10,14,22,.92);display:flex;flex-direction:column;padding:28px 10px 8px}
#mapview .mv-h{font-size:.8rem;color:var(--mut);margin-bottom:4px}
#mapview .mv-a{position:relative;flex:1;border:1px solid var(--line);border-radius:10px;background:repeating-linear-gradient(0deg,transparent 0 23px,rgba(255,255,255,.04) 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,rgba(255,255,255,.04) 23px 24px)}
.md{position:absolute;width:8px;height:8px;border-radius:50%;transform:translate(-50%,-50%)}.md.mob{background:#e05555}.md.pl{background:#4fc3f7}.md.me{background:var(--acc);width:11px;height:11px;box-shadow:0 0 8px var(--acc)}
.md b{position:absolute;left:10px;top:-5px;font-size:.65rem;color:#fff;white-space:nowrap;font-weight:600}
#mapview .mv-l{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:.7rem;color:var(--mut);margin-top:4px}
.buff[data-buff=poison]{border-color:#6c3;background:rgba(80,160,40,.25)}
#rotate-warn{display:none}
@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){#rotate-warn{display:flex;position:fixed;inset:0;z-index:999;background:#0b0f18;color:#fff;align-items:center;justify-content:center;font-size:1.2rem}}
.wide{display:none}
@media (min-width:1024px){
  body{display:grid;grid-template-columns:minmax(240px,1fr) min(var(--w),46vw) minmax(240px,1fr);gap:14px;align-items:start;justify-content:center;max-width:1500px;margin:0 auto}
  #game{grid-column:2;grid-row:1;width:100%}
  #intro{grid-column:2;grid-row:1}
  .wide{display:block;height:100dvh;overflow:auto;padding:10px 0;grid-row:1}
  #wide-l{grid-column:1}#wide-r{grid-column:3}
  body:has(#game.hidden) .wide{display:none}
}
/* 按鈕 .btn.wide 與桌面側欄 .wide 同名：側欄規則（display:none / height:100dvh）不得套到按鈕上 */
.btn.wide,body:has(#game.hidden) .btn.wide{display:inline-flex;height:auto;min-height:40px;overflow:visible;padding:8px 16px;grid-row:auto}
/* 物品／裝備詳情動作鈕：緊湊格狀，高度一致約 40px */
.mbox .acts{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:6px}
.mbox .acts .btn{min-height:40px;height:40px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:6px 8px;font-size:.88rem;line-height:1.2;border-radius:10px;flex:none}
.mbox .acts .btn[data-a="enh"]{grid-column:1/-1}
#mclose{flex:none;align-self:stretch}
/* 傭兵：站在玩家右後方（玩家與怪物之間、略靠後），360px 也不與玩家／寵物／怪物重疊 */
#bt-merc{position:absolute;left:38%;bottom:30px;z-index:1;display:flex;flex-direction:column;align-items:center;transform:translateX(-50%);pointer-events:none}
#bt-merc .nm{font-size:.7rem;color:#cfe;text-shadow:0 1px 2px #000;white-space:nowrap}
#bt-doll{bottom:150px}
/* 變形卷軸選單 */
.pm{display:flex;flex-direction:column;gap:8px;min-height:0}
.pm-list{display:flex;flex-direction:column;gap:6px;max-height:56dvh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-right:2px}
.pm-row{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;padding:6px 10px;border:1px solid var(--line);border-radius:12px;background:var(--card2);color:inherit;text-align:left;font:inherit;cursor:pointer}
.pm-row.on{border-color:var(--pri);box-shadow:0 0 0 1px var(--pri) inset}
.pm-row .g{flex:1;min-width:0;display:flex;flex-direction:column}.pm-row .g b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pm-ico{width:48px;height:48px;flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden}.pm-ico img{max-width:48px;max-height:48px;object-fit:contain}.pm-rnd{font-size:1.6rem}
/* 商品詳情底部視窗：疊在 NPC 視窗之上 */
.isheet{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center;z-index:60}
.isheet .mbox{max-height:80dvh}
.isheet .qty{grid-column:1/-1;display:flex;gap:6px;align-items:center}.isheet .qty input{flex:1;min-width:0;height:40px;text-align:center;font-size:1rem}.isheet .qty .btn{min-width:44px}
[data-info]{cursor:pointer}
.isheet [data-isb]{grid-column:1/-1;min-height:44px;height:44px;font-size:1rem}

.seg{cursor:grab;user-select:none;-webkit-user-select:none}.seg img{-webkit-user-drag:none}
/* 狀態列：圖示＋倒數，最多兩列，放不下收成 +N；30 秒內到期閃爍 */
#status-row{align-items:flex-start}
#buffs,.stbar{display:flex;flex-wrap:wrap;gap:4px;overflow:visible;min-width:0;flex:1;align-content:flex-start}
.st{position:relative;flex:none;display:inline-flex;align-items:center;gap:2px;height:28px;padding:0 5px 0 2px;border-radius:8px;background:var(--card2);border:1px solid var(--line);cursor:pointer;font-size:.72rem;line-height:1}
.st img{width:22px;height:22px;object-fit:contain;border-radius:5px}.st i{font-style:normal;font-size:16px;width:22px;text-align:center}
.st small{font-size:.72rem;font-weight:700;color:var(--tx);font-variant-numeric:tabular-nums}
.st.bad{border-color:#7c3;background:rgba(90,150,40,.28)}.st.more{padding:0 8px;font-weight:800;color:var(--acc)}
.st.low{animation:stblink .8s steps(2) infinite}@keyframes stblink{50%{opacity:.35}}
.st-tip{position:fixed;z-index:80;max-width:260px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:0 8px 24px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:4px}.st-tip .btn{min-height:36px;margin-top:4px}
#stage-ctl{flex-wrap:wrap;row-gap:6px}#status-row{flex:1 1 100%;order:3}#status-row>.tiny{display:none}
/* 物品作用 */
.uses{display:flex;flex-direction:column;gap:4px}.uchips{display:flex;flex-wrap:wrap;gap:6px}
.uchip{min-height:34px;padding:4px 10px;border-radius:17px;border:1px solid var(--line);background:var(--card2);color:var(--tx);font:inherit;font-size:.82rem;cursor:pointer;text-align:left;max-width:100%}
.uchip:active{transform:scale(.97)}.panel.hl{outline:2px solid var(--pri);outline-offset:2px}
/* 隊伍站位 v-r：前排 寵物｜傭兵｜玩家(最前)，召喚物在後排上方；互不重疊 */
#bt-me{left:35%;z-index:6}
#bt-merc{left:21%;bottom:4px;z-index:4}
#bt-pet{left:1%;bottom:4px;z-index:5;transform:none}
#bt-sum{left:0;bottom:126px;z-index:2;gap:0}#bt-sum .sum+.sum .nm{visibility:hidden}
.unit.pal.noimg::before{content:attr(data-emo);font-size:34px;line-height:1;filter:drop-shadow(0 2px 3px #000)}
.unit.pal.noimg img{display:none}
.st .lb{display:none;font-weight:600;color:var(--mut,#aab);margin-right:2px}.st.lbon .lb{display:inline}
/* v-r：狩獵開關改為舞台右上角圖示鈕（地圖鈕左側），未狩獵時脈動提示；壓縮舞台下方空白 */
#bt-toggle.hunt-fab{min-width:0;max-width:44px;min-height:0;margin:0;flex:none}
.hunt-fab{position:absolute;right:52px;top:30px;z-index:7;width:44px;height:44px;border-radius:10px;border:1px solid #f3c96b;background:linear-gradient(#f6d27a,#c9932f);color:#2a1a00;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;cursor:pointer;box-shadow:0 0 0 0 rgba(246,210,122,.7);animation:huntpulse 1.4s ease-out infinite}
.hunt-fab b{font-size:17px}.hunt-fab small{font-size:10px;font-weight:800;margin-top:2px}
.hunt-fab.on{animation:none;background:rgba(0,0,0,.55);border-color:var(--line);color:#fff}
@keyframes huntpulse{0%{box-shadow:0 0 0 0 rgba(246,210,122,.75)}70%{box-shadow:0 0 0 10px rgba(246,210,122,0)}100%{box-shadow:0 0 0 0 rgba(246,210,122,0)}}
#battle{height:clamp(220px,32dvh,300px)}
#vitals{gap:4px 6px;padding:5px 8px 3px}.vbar{height:18px}.vbar.xp{height:12px}.vbar span{font-size:.72rem;line-height:16px}.vbar.xp span{font-size:.62rem;line-height:10px}
#stage-ctl{padding:3px 8px 4px}
.pbox{border:1px solid var(--line);border-radius:10px;padding:6px 10px;display:flex;flex-direction:column;gap:3px;background:rgba(246,210,122,.06)}.pbox .prow{display:flex;justify-content:space-between;gap:8px}.pbox .prow b{color:var(--acc);font-variant-numeric:tabular-nums}
/* 詳情視窗：價格與購買鈕固定可見，屬性與作用區可捲動 */
.isheet .mbox{display:flex;flex-direction:column;max-height:88dvh;overflow:auto}
.isheet .mbox>*{flex:none}
#bt-sum .nm{white-space:nowrap;overflow:visible}#bt-pet .nm,#bt-merc .nm{font-size:.68rem}
#bt-sum .nm{display:none}#bt-merc .nm{transform:translateX(8px)}
#bt-merc .spr,#bt-pet .spr,#bt-sum .spr{transform:translateX(var(--dx,0px)) scale(var(--sc,1))}
/* v-t：所有舞台精靈依可見外框對齊（水平置中、腳底貼地），同一基準縮放 */
#battle .spr,#bt-merc .spr,#bt-pet .spr,#bt-sum .spr{transform:translate(var(--dx,0px),var(--dy,0px)) scale(var(--sc,1.25));transform-origin:50% 100%}
#bt-pet{left:2%;bottom:2px}
#bt-merc{left:21%;bottom:18px}
#bt-me{left:35%}
.foe .bar{order:1;margin-top:1px}.foe .nm{order:2}.foe .spr{order:0}
#bt-merc{bottom:24px}
#bt-pet{transform:translateX(-50%)}

/* 怪物名牌圖層（全部顯示、不重疊、在所有精靈之上） */
#bt-mobs .foe .nm{visibility:hidden;height:0;margin:0;padding:0;overflow:hidden}
#bt-labels{position:absolute;inset:0;pointer-events:none;z-index:5}
.mob-lb{position:absolute;left:0;top:0;font-size:.74rem;font-weight:800;color:#fff;white-space:nowrap;background:rgba(0,0,0,.62);border-radius:7px;padding:1px 6px;line-height:1.35;text-shadow:0 1px 2px #000;max-width:46%;overflow:hidden;text-overflow:ellipsis}
.mob-lb .lv{color:var(--acc)}.mob-lb.tgt{outline:2px solid var(--acc);color:var(--acc)}.mob-lb.boss{border:1px solid #e0b04a}

#toast.tap{cursor:pointer;pointer-events:auto;text-decoration:underline dotted}
.maillink{cursor:pointer;text-decoration:underline dotted}
#fx-layer{position:absolute;inset:0;pointer-events:none;z-index:30;overflow:visible}
#fx-layer img.fx{position:absolute;pointer-events:none;image-rendering:auto}

.mintro{font-size:13px;line-height:1.5}
.mgroup h3{margin:10px 2px 6px;font-size:14px}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.mcard{background:var(--panel,#1c1f26);border:1px solid #333a46;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px}
.mcard.on{border-color:#d4a64a;box-shadow:0 0 0 1px #d4a64a55 inset}
.mcard.dim{opacity:.6}
.mhead{display:flex;align-items:center;gap:8px}.mhead .ico{width:32px;height:32px}.mfist{display:inline-flex;align-items:center;justify-content:center;font-size:20px}
.mbar{position:relative;height:16px;background:#0e1014;border-radius:8px;overflow:hidden}.mbar i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#b8862f,#e8c060)}.mbar span{position:relative;display:block;text-align:center;font-size:11px;line-height:16px;color:#fff;text-shadow:0 1px 2px #000}
.mfx{display:flex;flex-direction:column;gap:2px;font-size:13px}
.mact{display:flex;flex-direction:column;gap:4px;align-items:flex-start}

.zd-btn{font-size:11px;padding:2px 8px;border-radius:10px;border:1px solid #6b5a2e;background:#2a2416;color:#e8c060;margin-left:6px;cursor:pointer;white-space:nowrap}
#bt-drops{pointer-events:auto}
.zd .zd-mob .row{padding:3px 2px}.zd .zd-item{padding-left:14px}

#hero-chip{min-width:0}#hero-chip .hc-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:400px){#hero-chip .hc-sub{font-size:11px}}
@media (max-width:420px){#hero-chip .hc-sub{white-space:normal;overflow:visible;line-height:1.25}#hero-chip .hc-sub span{display:inline-block}}
#hero-chip .hc-sub{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25}#hero-chip .hc-sub span{display:inline-block}

#loot-pops{position:absolute;right:8px;top:62px;display:flex;flex-direction:column;align-items:flex-end;gap:3px;z-index:40;pointer-events:none;max-width:60%}
.lootpop{display:flex;align-items:center;gap:4px;background:rgba(10,12,16,.78);border:1px solid #444;border-radius:12px;padding:2px 8px 2px 3px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;pointer-events:auto;cursor:pointer;animation:lootIn .25s ease-out;transition:opacity .4s,transform .4s}
.lootpop .ico{width:20px;height:20px;flex:none}.lootpop span{overflow:hidden;text-overflow:ellipsis}.lootpop small{color:#9aa}
.lootpop.out{opacity:0;transform:translateY(-8px)}
@keyframes lootIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.r-com .ln,.lootpop.r-com{color:#e6e6e6}.r-unc .ln,.lootpop.r-unc{color:#7ddc6a;border-color:#3d6b34}.r-rare .ln,.lootpop.r-rare{color:#63b3ff;border-color:#2f5f8f}.r-epic .ln,.lootpop.r-epic{color:#ffae3d;border-color:#9a6420}
.lootlog .lt{min-width:56px}

.bchips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px}.bchip{font-size:12px;padding:3px 10px;border-radius:12px;border:1px solid #444;background:#1a1d24;color:#888}.bchip.on{background:#3a3220;border-color:#d4a64a;color:#f0d68a}
#blog-list{max-height:55vh;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.brow{display:flex;align-items:center;gap:6px;font-size:12px;padding:3px 2px;border-bottom:1px solid #ffffff0d;min-width:0}.brow .bt{flex:1;min-width:0;overflow-wrap:anywhere}.brow .ico{width:20px;height:20px;flex:none}
.brow.c-exp .bt{color:#c9b6ff}.brow.c-gold .bt{color:#f0c850}.brow.c-supply .bt{color:#8fd3c0}.brow.c-sys .bt{color:#ddd}
.fly.xp{color:#c9b6ff;font-size:11px}.fly.goldf{color:#f0c850;font-size:11px}

#loot-pops{left:8px;right:auto;top:58px;align-items:flex-start}
.brow .alt.ico,.lootpop .alt.ico{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;font-size:9px;line-height:1;white-space:nowrap;overflow:hidden;flex:none;border-radius:4px}
/* 取得方式 */
.srcs{margin:8px 0;display:flex;flex-direction:column;gap:4px}
.src-head{background:none;border:0;padding:4px 0;text-align:left;cursor:pointer;color:inherit;font:inherit;display:flex;gap:4px;align-items:center;width:100%}.src-head:hover{color:#fff}.src-body{display:flex;flex-direction:column;gap:4px}.src-body[hidden]{display:none}.uchips.src-body{flex-direction:row;flex-wrap:wrap;gap:6px}.uchips.src-body[hidden]{display:none}
.src-row{border-top:1px solid rgba(255,255,255,.08);padding:4px 0;min-width:0}
.src-mob{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px;min-width:0}
.src-mob b{overflow-wrap:anywhere}
.src-pc{margin-left:auto;padding-left:8px;font-weight:700;color:#ffd77a;white-space:nowrap}
.src-maps{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.src-map{font-size:12px;max-width:100%;overflow-wrap:anywhere;text-align:left}

/* 詳情視窗：內部區塊不再各自捲動，只有整個視窗在超出畫面時捲動；動作按鈕固定在底部、可換行不裁切 */
.mbox>*{flex-shrink:0}.mbox .ilines,.mbox .uses,.mbox .srcs,.mbox .uchips{max-height:none;overflow:visible}
.mbox .acts{position:sticky;bottom:calc(-14px - env(safe-area-inset-bottom));z-index:2;background:var(--card);padding:8px 0 6px;margin-bottom:-6px;box-shadow:0 -6px 10px -6px rgba(0,0,0,.5)}
.mbox .acts .btn{white-space:normal;height:auto;min-height:40px;overflow:visible;text-overflow:clip}
.mbox .uchip{white-space:normal;text-align:left}
.ilines.src-body{display:block}.ilines.src-body[hidden]{display:none}
.cx-filter{display:flex;flex-direction:column;gap:8px}.cx-row{display:flex;flex-wrap:wrap;gap:6px;min-width:0}.cx-row input{flex:1 1 140px;min-width:0}.cx-row select{flex:0 1 auto;min-width:0;max-width:100%}.cx-filter .uchips{display:flex;flex-wrap:wrap;gap:6px}.uchip.on{background:var(--pri);color:#111;border-color:var(--pri)}
.mats{display:flex;flex-direction:column;gap:4px;margin-top:6px}.row.mat{display:flex;align-items:center;gap:8px;padding:4px 6px;border-radius:8px;background:var(--bg2);min-width:0;cursor:pointer}.row.mat .ico{flex:none}.mat-n{flex:1;min-width:0;overflow-wrap:anywhere}.mat-c{flex:none}.row.mat.short{outline:1px solid rgba(255,90,90,.35)}
.attr-fx{display:flex;flex-wrap:wrap;gap:2px 10px;padding:0 4px 6px;color:#b9c3d0;line-height:1.35}.attr-fx span{white-space:normal}.attr-fx .nx{white-space:normal;flex-basis:100%}
/* 同伴顯示（v=20261018ab）：擁擠時由 UIX.layoutComp 排列；縮放只套在同伴外層，玩家不受影響 */
#bt-mx{position:absolute;inset:0;pointer-events:none}
#bt-mx .mx{position:absolute;bottom:4px;display:flex;flex-direction:column;align-items:center}
#bt-mx .mx .nm{font-size:.68rem;color:#cfe;text-shadow:0 1px 2px #000;white-space:nowrap}
#bt-field .chp{display:none;width:34px;height:3px;background:#0008;border-radius:2px;overflow:hidden;margin-top:1px}#bt-field .chp b{display:block;height:100%;background:#4ade80}
#bt-field:not(.comp-cl) #bt-mx .mx{display:none}
#bt-field.comp-cl #bt-sum{left:0;right:0;top:0;bottom:0;display:block;gap:0}
#bt-field.comp-cl #bt-sum .sum,#bt-field.comp-cl #bt-merc,#bt-field.comp-cl #bt-pet,#bt-field.comp-cl #bt-mx .mx{position:absolute;transform:translateX(-50%) scale(var(--ck,1));transform-origin:50% 100%}
#bt-field.comp-lite .unit.pal .nm,#bt-field.comp-lite #bt-sum .nm,#bt-field.comp-lite #bt-mx .nm{display:none!important}
#bt-field.comp-lite .chp{display:block}
#bt-field .c-off,#bt-field.comp-role #bt-merc,#bt-field.comp-role #bt-pet,#bt-field.comp-role #bt-sum,#bt-field.comp-role #bt-mx{visibility:hidden!important}
#bt-cmore{position:absolute;left:2px;bottom:0;font-size:.7rem;color:#fff;background:#0008;border-radius:8px;padding:0 5px;z-index:7;pointer-events:none}
/* v=ab iOS Safari：舊版不支援 dvh 時以 100vh／-webkit-fill-available 撐滿可見區（底部選單不被工具列蓋住）；#view 可觸控捲動 */
html{height:-webkit-fill-available}
#game{height:100vh;height:var(--app-h,100vh);height:100dvh;max-height:var(--app-h,100vh);max-height:100dvh}
@supports not (height:100dvh){#game{height:var(--app-h,100vh);max-height:var(--app-h,100vh)}.wide{height:var(--app-h,100vh)}}
#view{-webkit-overflow-scrolling:touch;touch-action:pan-y pinch-zoom;min-height:0}
#toast{pointer-events:none}#toast.tap{pointer-events:auto}
/* v=ab 分頁固定標頭：子分頁列（村莊／野外…）＋其下的篩選列合成一個 sticky 區塊，貼齊頂端無縫、不透明 */
#view > .vhead{position:sticky;top:-12px;z-index:8;background:var(--bg);margin:-12px -12px 10px;padding:10px 12px 6px;box-shadow:0 6px 8px -6px rgba(0,0,0,.55)}
#view > .vhead > .segwrap,#view > .vhead > .seg{position:static;margin:0 0 6px;padding-top:0;padding-bottom:0;background:transparent}
#view > .vhead > :last-child{margin-bottom:0}
.panel > .phead{position:sticky;top:calc(var(--vhead,0px) - 12px);z-index:7;background:var(--card);margin:0 -14px 8px;padding:6px 14px;box-shadow:0 6px 8px -6px rgba(0,0,0,.5)}
.panel > .phead > *{margin-bottom:6px}.panel > .phead > :last-child{margin-bottom:0}
#view > .panel.psticky{position:sticky;top:calc(var(--vhead,12px) - 12px);z-index:7;box-shadow:0 6px 10px -6px rgba(0,0,0,.6)}
#view{overflow-anchor:none}   /* 捲動位置由 softDraw 自行保持；避免瀏覽器 scroll anchoring 因 sticky 標頭微調 8px */

/* v=ac 圖鑑篩選：sticky 只留一列（搜尋＋篩選▾摘要＋✕）；完整面板可收合、不 sticky；子類 chips 單列橫向捲動 */
.cx-bar{display:flex;align-items:center;gap:6px;padding:6px 8px;flex-direction:row}.cx-bar input{flex:1 1 auto;min-width:0}
.cx-ftog{flex:0 1 auto;min-width:0;max-width:62%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cx-x{flex:0 0 auto;padding-left:10px;padding-right:10px}
.cx-more{display:flex;flex-direction:column;gap:8px}.cx-more[hidden]{display:none}.cx-more .uchips{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.cx-more .cx-sub{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding-bottom:2px}.cx-more .cx-sub .uchip{flex:0 0 auto;white-space:nowrap}
.cx-more #cx-cls{margin-left:auto;min-width:0;max-width:100%}
.cx-bar.panel{padding:4px 6px;margin-bottom:8px}.cx-bar input,.cx-bar .btn{padding-top:5px;padding-bottom:5px;min-height:0;line-height:1.25}

.fly.combo{color:#7fe3ff}.fly.dot{color:#ff6b6b;font-size:.95em}.fly.st{color:#d6a8ff;font-size:.9em}.fly.me.blk{color:#9ecbff}
/* audit-ae Phase 4：詳情視窗瀏覽列（返回／麵包屑／關閉）、配方材料、觸控目標 ≥44px */
.isheet .snav{position:sticky;top:-12px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:-4px 0 4px;padding:4px 0;background:var(--card,#1a1a22)}
.isheet .snav-back{min-height:44px;max-width:78%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:.92rem}
.isheet .snav-x{min-width:44px;min-height:44px;font-size:1.1rem}
.isheet .snav-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin-bottom:6px;color:var(--muted,#9aa)}
.isheet .crumb{background:none;border:0;color:var(--pri,#d9b36c);font:inherit;padding:6px 2px;min-height:32px;cursor:pointer;text-decoration:underline}
.src-mats{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:4px 0 2px 22px}
.isheet .mapico{font-size:2rem;width:56px;text-align:center}
.isheet .row.hl{outline:2px solid var(--pri,#d9b36c);outline-offset:-2px;border-radius:8px}
.isheet .row.click{min-height:44px}
@media (pointer:coarse){.uchip{min-height:44px}.src-head{min-height:44px}.isheet .btn{min-height:44px}.crumb{min-height:44px}}
/* audit-ae P4：觸控目標 ≥44px。外觀不變的小按鈕以透明 ::after 擴大可點範圍（戰鬥舞台與精簡圖鑑列外觀不變） */
@media (pointer:coarse){
  .subtabs button,.seg button{min-height:44px}
  .zd-btn,.cx-ftog{position:relative}
  .zd-btn::after,.cx-ftog::after,.segarr::after,.mv-btn::after{content:'';position:absolute;top:min(0px,calc((100% - 44px)/2));bottom:min(0px,calc((100% - 44px)/2));left:min(0px,calc((100% - 44px)/2));right:min(0px,calc((100% - 44px)/2))}
}