*{box-sizing:border-box}html,body{margin:0;height:100%}
body{font-family:system-ui,-apple-system,"PingFang HK","Noto Sans TC",sans-serif;color:#f3f6f7;background:#11272d url(../assets/backgrounds/bg_home.webp) center/cover fixed;-webkit-tap-highlight-color:transparent}
#story{min-height:100dvh;max-width:820px;margin:0 auto;padding:max(8px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom));background:rgba(8,22,28,.72)}
.btn{min-height:44px;min-width:44px;padding:8px 14px;border-radius:12px;border:1px solid #6fb3c2;background:#1d4652;color:#fff;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.btn.primary{background:#e2802c;border-color:#ffb36b}.btn.quiet{background:transparent;border-color:#5b7e87}.btn.big{min-height:52px;font-size:17px;padding:10px 22px}.btn:disabled{opacity:.45}
.topbar,.bbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0 8px}.topbar b{font-size:17px}
.prof{display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.07);border-radius:14px;padding:8px}.prof img{width:64px;height:96px;object-fit:cover;object-position:top;border-radius:10px;background:#dfe5e8}
.prof div{display:flex;flex-direction:column;gap:3px}.prof small{color:#bfd6dc}.prof .unl{color:#ffd28a}
.chtabs{display:flex;gap:6px;overflow-x:auto;margin:10px 0}.chtab{flex:1 0 auto}.chtab.sel{background:#e2802c}
.chtitle{font-size:18px;margin:6px 2px 10px}
.levels{display:grid;grid-template-columns:1fr;gap:8px}@media(min-width:700px){.levels{grid-template-columns:1fr 1fr}}
.lvl{display:grid;grid-template-columns:52px 1fr 48px;grid-template-rows:auto auto;align-items:center;text-align:left;min-height:64px;border-radius:14px;border:1px solid #47707a;background:#183c46;color:#fff;padding:8px 10px;cursor:pointer}
.lvl .lid{grid-row:span 2;font-size:20px;font-weight:800;color:#ffd28a}.lvl .lname{font-weight:700}.lvl small{color:#b6cfd5;grid-column:2}.lvl .st{grid-row:1/3;grid-column:3;text-align:right;color:#ffd84d}
.lvl.cur{border-color:#ffb36b;box-shadow:0 0 0 2px rgba(226,128,44,.4)}.lvl.lock{opacity:.5}.lvl.done{background:#1c4a3c}
.heroes{display:flex;gap:12px;justify-content:center;margin:10px 0}.hero{flex:1;max-width:260px;border-radius:16px;border:3px solid transparent;background:#e9eef0;padding:6px;color:#123;cursor:pointer}
.hero img{width:100%;aspect-ratio:426/720;object-fit:cover;display:block}.hero.sel{border-color:#e2802c;box-shadow:0 0 18px rgba(226,128,44,.7)}.hero b{font-size:17px}
.heroSel{display:flex;flex-direction:column;align-items:stretch;gap:10px}.nm{display:flex;gap:8px;align-items:center;justify-content:center;font-size:16px}.nm input{min-height:44px;font-size:16px;border-radius:10px;border:1px solid #6fb3c2;padding:0 10px;width:12em}
.en{color:#9fe3ff;font-size:.88em;margin-left:2px;white-space:normal}
/* dialogue */
.dlg{position:fixed;inset:0;z-index:50;background:linear-gradient(transparent 40%,rgba(0,0,0,.6)),url(../assets/backgrounds/bg_battle_my_turn.webp) center/cover;display:flex;flex-direction:column;cursor:pointer}
.dtitle{display:flex;justify-content:space-between;align-items:center;padding:max(10px,env(safe-area-inset-top)) 12px 6px;font-weight:700;background:rgba(0,0,0,.45)}
.stage{flex:1;position:relative;overflow:hidden}.por{position:absolute;bottom:0;height:min(62vh,640px);max-width:62%;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))}.por.l{left:2%}.por.r{right:2%}
.box{margin:0 10px max(14px,env(safe-area-inset-bottom));background:rgba(10,24,32,.92);border:2px solid #6fb3c2;border-radius:16px;padding:12px 14px;min-height:120px;max-width:800px;align-self:center;width:calc(100% - 20px)}
.box p{font-size:18px;line-height:1.55;margin:6px 0}.box.narr{border-color:#c9b67a}.stg{color:#e8dcb0;font-style:italic}
.who{font-weight:800;color:#ffd28a}.who.r{text-align:right}.who small{color:#9cb;font-weight:400}.tap{display:block;text-align:right;color:#8fb;opacity:.8}
.cardpop{margin:auto 14px max(18px,env(safe-area-inset-bottom));align-self:center;max-width:620px;background:#fff8e6;color:#3a2a10;border:3px solid #e2802c;border-radius:18px;padding:16px;font-size:18px;line-height:1.6;text-align:center}
.cardpop .en{color:#1a6f99}.cardpop.tip{background:#eaf8ff;border-color:#2c9de2}
/* battle */
.bt{display:flex;flex-direction:column;gap:6px;min-height:calc(100dvh - 20px)}.bbar span{font-size:14px}.lvb{background:#e2802c;border-radius:8px;padding:2px 8px}
.envline{font-size:12px;color:#bfd6dc;text-align:center}
.side{display:flex;flex-direction:column;align-items:center;gap:6px}.bench{display:flex;gap:6px;justify-content:center;min-height:10px}
.unit{position:relative;width:76px;height:104px;border-radius:10px;border:2px solid #6fb3c2;background:#24505c;overflow:hidden;padding:0;color:#fff;cursor:pointer}
.unit.big{width:132px;height:178px}.unit.empty{border-style:dashed;background:transparent;display:flex;align-items:center;justify-content:center;font-size:13px;color:#9bb}
.unit img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}.unit.rusted img{filter:sepia(.9) hue-rotate(-20deg) saturate(1.6)}
.unit .noart{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;background:radial-gradient(#3a8fb0,#123)}
.unit .nm{position:absolute;left:0;right:0;top:0;background:rgba(0,0,0,.6);font-size:12px;padding:1px 3px}
.unit .hpbar{position:absolute;left:4px;right:4px;bottom:20px;height:6px;background:#400;border-radius:3px}.unit .hpbar span{display:block;height:100%;background:#4ee07a;border-radius:3px}
.unit .hp{position:absolute;left:3px;bottom:3px;font-size:12px;font-weight:800;text-shadow:0 0 3px #000}.unit .en{position:absolute;right:3px;bottom:3px;font-size:11px;color:#ffe066;margin:0}
.unit .sts{position:absolute;top:18px;left:2px;display:flex;flex-direction:column;gap:2px;align-items:flex-start}.b{font-style:normal;font-size:11px;padding:1px 4px;border-radius:6px;background:#333}.b.rust{background:#9b3d12}.b.tool{background:#1f7a4d}.b.sand{background:#8a6d1a}
.logline{font-size:12px;text-align:center;color:#d8e6ea;min-height:2.4em}
.hand{display:flex;gap:6px;overflow-x:auto;padding:4px 2px}.hc{flex:0 0 64px;height:92px;border-radius:9px;border:2px solid #456;background:#1b3a44;padding:0;position:relative;overflow:hidden;color:#fff;cursor:pointer;opacity:.6}
.hc.can{opacity:1;border-color:#ffb36b}.hc img{width:100%;height:100%;object-fit:cover;object-position:top}.hc .noart{height:100%;display:flex;align-items:center;justify-content:center;font-weight:800}.hc span{position:absolute;left:0;right:0;bottom:0;font-size:11px;background:rgba(0,0,0,.65)}
.acts{display:flex;gap:8px;justify-content:center;position:sticky;bottom:0;padding:6px 0;background:rgba(8,22,28,.85)}.acts .btn{flex:1;max-width:200px}
.sheet{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.5);display:flex;align-items:flex-end;justify-content:center}
.sh{background:#132f38;border-radius:18px 18px 0 0;padding:14px 14px max(14px,env(safe-area-inset-bottom));width:100%;max-width:560px;display:flex;flex-direction:column;gap:8px}.sh small{color:#bcd;font-weight:400}
/* puzzle */
.puz{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:10px}
.pz{background:#fdfaf2;color:#1d2a30;border-radius:20px;padding:16px;width:100%;max-width:620px;text-align:center}.pz h3{margin:4px 0}.pz .en{color:#1a6f99}.lead{margin:4px 0 10px;font-size:14px}
.eq{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:nowrap}.op{font-size:24px;font-weight:800}
.term{display:flex;flex-direction:column;align-items:center;gap:4px}.cf{font-size:26px;font-weight:800;min-width:70px}.cf b{color:#d0571b}
.pm{width:52px;height:52px;min-width:44px;min-height:44px;border-radius:14px;border:2px solid #2c7a92;background:#e2f4f9;font-size:26px;font-weight:800;color:#124;cursor:pointer;touch-action:manipulation}
@media(min-width:900px){.pm{width:60px;height:60px}.cf{font-size:32px}}
.cnt{margin:12px auto;border-collapse:collapse;font-size:18px}.cnt td,.cnt th{border:1px solid #bbb;padding:6px 18px}.cnt .ok{background:#d6f5dc}.cnt .no{background:#ffe0dc}
.light{display:flex;align-items:center;gap:10px;justify-content:center;margin:10px 0;font-weight:700}.light i{width:30px;height:30px;border-radius:50%;background:#c33;box-shadow:0 0 10px #c33}
.light.yellow i{background:#f5c400;box-shadow:0 0 14px #f5c400}.light.green i{background:#1fbf4f;box-shadow:0 0 16px #1fbf4f}
.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:8px}.row.col{flex-direction:column}.warn{color:#b3401a;font-weight:700}
.rescue{height:200px;object-fit:contain}.rescue.saved{filter:drop-shadow(0 0 12px #6ef)}
.result{text-align:center;padding-top:20vh}.result p{font-size:18px}.unlock{color:#ffd84d;font-weight:800}
#toast{position:fixed;left:50%;top:70px;transform:translateX(-50%);max-width:92vw;background:rgba(255,248,230,.97);color:#3a2a10;border-radius:12px;padding:10px 14px;z-index:80;opacity:0;pointer-events:none;transition:opacity .3s;font-size:15px}#toast.on{opacity:1}#toast .en{color:#1a6f99}
.pz .btn.quiet,.sh .btn.quiet{color:#1d2a30;border-color:#7a9aa3}.sh .btn.quiet{color:#dfe}
@media(min-width:700px){.unit.big{width:210px;height:284px}.unit{width:120px;height:164px}.unit .nm,.unit .hp{font-size:15px}.hc{flex-basis:100px;height:140px}.hc span{font-size:13px}.logline,.envline{font-size:15px}
 .pz{max-width:760px;padding:24px}.pz h3{font-size:26px}.cnt{font-size:22px}.light{font-size:20px}.box p{font-size:22px}}
#app[hidden],#story[hidden]{display:none!important}
body.ptcg-battle #story{display:none!important}
.pz .btn.quiet,.sh .btn.quiet{color:#1d2a30;border-color:#7a9aa3}

/* ===== mobile UI fixes (story_v1 art QA) ===== */
.chtabs-wrap{position:relative;margin:10px 0 4px}
.chtabs{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;margin:0;padding:4px 36px 10px 2px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#7ec8d6 rgba(255,255,255,.12)}
.chtabs::-webkit-scrollbar{height:7px;display:block}
.chtabs::-webkit-scrollbar-thumb{background:#7ec8d6;border-radius:999px}
.chtabs::-webkit-scrollbar-track{background:rgba(255,255,255,.12);border-radius:999px}
.chtab{flex:0 0 auto;min-width:76px;scroll-snap-align:start}
.chtabs-hint{position:absolute;right:0;top:4px;bottom:10px;display:flex;align-items:center;padding:0 8px 0 20px;font-size:11px;font-weight:700;color:#dff6ff;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(8,22,28,.92) 35%)}
.hub{display:flex;flex-direction:column;min-height:calc(100dvh - 24px)}
.hub .levels{flex:1 1 auto}
.topbar{gap:6px;flex-wrap:wrap}
.topbar b{font-size:15px;line-height:1.2;text-shadow:0 1px 2px rgba(0,0,0,.55)}
.dtitle{background:rgba(0,0,0,.78)!important;color:#fff!important;text-shadow:0 1px 2px #000;border-bottom:1px solid rgba(255,255,255,.18)}
.box p,.cardpop p{word-break:keep-all;overflow-wrap:break-word;line-break:strict}
.en{display:inline;white-space:nowrap;color:#9fe3ff;font-size:.88em;margin-left:2px}
.dlg .box .en{background:rgba(0,40,60,.35);border-radius:6px;padding:0 4px}
@media(min-width:900px){
  .dlg .por.l{left:12%;max-width:48%}
  .dlg .por.r{right:12%;max-width:48%}
  .dlg .stage{display:flex;justify-content:center}
}
/* v1b: half-body (半身) frameless bust in dialogue — no card face; emotion marks */
.dlg .stage{display:block}
.dlg .porw{position:absolute;bottom:0;width:min(86vw,440px);aspect-ratio:1.25;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5));will-change:transform}
.dlg .porw.l{left:-3%}.dlg .porw.r{right:-3%}
.dlg .porw .crop{position:absolute;inset:0;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent 100%),linear-gradient(to right,transparent 0,#000 16%,#000 84%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,#000 70%,transparent 100%),linear-gradient(to right,transparent 0,#000 16%,#000 84%,transparent 100%);mask-composite:intersect}
.dlg .porw .por{position:absolute;left:0;top:0;width:100%;height:auto;max-width:none;object-fit:initial;filter:none}
.dlg .emo{position:absolute;left:58%;top:4%;width:30%;height:26%;pointer-events:none}
.dlg .porw.l .emo{left:auto;right:4%}
.emo>*{position:absolute}
.em-txt{font:900 54px/1 sans-serif;color:#ffe14d;-webkit-text-stroke:3px #2a1a00;left:20%;top:0;animation:emPop .35s ease-out}
.em-txt.q{color:#8fe0ff;animation:emBob 1.4s ease-in-out infinite}
.em-lines{inset:-10% -20%;background:repeating-conic-gradient(from 0deg,transparent 0 8deg,rgba(255,255,255,.85) 8deg 10deg);-webkit-mask-image:radial-gradient(circle,transparent 35%,#000 40%,transparent 70%);mask-image:radial-gradient(circle,transparent 35%,#000 40%,transparent 70%)}
.em-vein{width:46px;height:46px;left:30%;top:10%;animation:emPulse .5s ease-in-out infinite alternate}
.em-sweat{width:26px;height:40px;left:10%;top:30%;animation:emDrip 1.6s ease-in infinite}
.em-spark{font-size:34px;color:#fff6a8;text-shadow:0 0 8px #ffd84d;left:20%;top:10%;animation:emTw 1s ease-in-out infinite}.em-spark.s2{font-size:22px;left:60%;top:50%;animation-delay:.5s}
.em-gloom{left:0;top:0;width:90%;height:100%;background:repeating-linear-gradient(90deg,rgba(120,130,200,.9) 0 3px,transparent 3px 11px);-webkit-mask-image:linear-gradient(#000,transparent);mask-image:linear-gradient(#000,transparent)}
.porw.emo-happy,.porw.emo-proud{animation:emHop .5s ease-out 2}
.porw.emo-surprise,.porw.emo-angry{animation:emShake .35s linear 2}
.porw.emo-sad{filter:drop-shadow(0 6px 14px rgba(0,0,0,.5)) brightness(.72) saturate(.7)}
.porw.emo-worry{filter:drop-shadow(0 6px 14px rgba(0,0,0,.5)) brightness(.9)}
@keyframes emHop{0%,100%{transform:translateY(0)}40%{transform:translateY(-14px)}}
@keyframes emShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes emPop{0%{transform:scale(.2)}70%{transform:scale(1.2)}100%{transform:scale(1)}}
@keyframes emBob{50%{transform:translateY(-6px)}}
@keyframes emPulse{to{transform:scale(1.15)}}
@keyframes emDrip{0%{transform:translateY(0);opacity:1}100%{transform:translateY(16px);opacity:.3}}
@keyframes emTw{50%{opacity:.3;transform:scale(.7)}}
@media(prefers-reduced-motion:reduce){.porw,.emo>*{animation:none!important}}
@media(min-width:700px){.dlg .porw{width:min(60vw,620px)}.dlg .porw.l{left:6%}.dlg .porw.r{right:6%}.em-txt{font-size:72px}.em-vein{width:64px;height:64px}}
.dlg .cardpop{background:rgba(255,248,230,.96);font-size:16px;padding:10px 16px;border-radius:999px;max-width:min(92vw,560px)}
/* hero half-body art (already waist-up, white bg for now) */
.dlg .porw.hb .crop{background:none}.dlg .porw.hb .crop{-webkit-mask-image:linear-gradient(to bottom,#000 85%,transparent 100%);mask-image:linear-gradient(to bottom,#000 85%,transparent 100%)}
.dlg .porw.hb{aspect-ratio:.95;width:min(70vw,400px)}@media(min-width:700px){.dlg .porw.hb{width:min(46vw,520px)}}
/* per-location dialogue background with crossfade */
.dbg{position:fixed;inset:0;z-index:49;pointer-events:none;contain:strict}.dbg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s ease;will-change:opacity}.dbg img.on{opacity:1}.dbg img:not([src]){visibility:hidden}
.dlg{background:linear-gradient(transparent 40%,rgba(0,0,0,.6))!important}
/* 延伸 Extension pill for beyond-F1–F3 content */
.ext{display:inline-block;font-size:.72em;font-weight:800;line-height:1.3;padding:0 6px;margin:0 3px;border-radius:999px;background:#7a3cff;color:#fff;vertical-align:.12em;white-space:nowrap}
@media(orientation:landscape) and (min-width:700px){.dlg .porw{width:min(56vw,calc(58vh*1.25))}.dlg .porw.hb{width:min(46vw,calc(60vh*.95))}}

.dlg [hidden]{display:none!important}
/* fix12 */
.story-goal{background:rgba(240,193,75,.18)!important;border-color:rgba(240,193,75,.6)!important;white-space:nowrap}
.story-tip-banner.coach{border:1px solid rgba(240,193,75,.7);background:rgba(20,30,40,.88)}
.coach-step{display:inline-block;min-width:28px;padding:0 5px;border-radius:8px;background:#f0c14b;color:#222;font-size:11px;margin-right:4px}
.coach-idle{display:block;color:#ffd36b;animation:coachPulse 1s ease-in-out infinite alternate}
@keyframes coachPulse{from{opacity:.55}to{opacity:1}}
.tut-target{animation:tutGlow 1s ease-in-out infinite alternate;outline:3px solid #ffd36b;outline-offset:2px;border-radius:10px}
@keyframes tutGlow{from{box-shadow:0 0 0 0 rgba(255,211,107,.2)}to{box-shadow:0 0 18px 6px rgba(255,211,107,.85)}}
.hand-wrap{position:relative;display:inline-block;flex:none}
.fz-badge{position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);white-space:nowrap;font-size:10px;line-height:1.3;padding:1px 5px;border-radius:8px;background:rgba(30,30,40,.92);color:#ddd;border:1px solid #777;pointer-events:none;z-index:3;max-width:110px;overflow:hidden;text-overflow:ellipsis}
.fz-badge.ok{background:#f0c14b;color:#2a1d00;border-color:#fff3c4;font-weight:700}
.glow-fuse{box-shadow:0 0 0 2px #f0c14b,0 0 16px 4px rgba(240,193,75,.85)!important;border-radius:8px}
.ptcg-recyclebtn{background:linear-gradient(#2d4a5a,#1d3140)!important}
.pick-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:6px 0 10px}
.pick-card{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:4px;min-width:72px;min-height:44px;color:inherit}
.pick-card small{font-size:11px}
.recycle-fly{position:fixed;z-index:9999;perspective:600px;pointer-events:none;transition:transform .7s cubic-bezier(.5,0,.6,1),opacity .7s}
.recycle-fly .rf-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .35s}
.recycle-fly .rf-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:8px;overflow:hidden}
.recycle-fly .rf-front img,.recycle-fly .rf-front .ptcg-card{width:100%;height:100%;object-fit:cover}
.recycle-fly .rf-back{transform:rotateY(180deg);background:repeating-linear-gradient(45deg,#2b3f8f 0 6px,#1d2c66 6px 12px);border:2px solid #f0c14b}
.recycle-fly.go{transform:translate(var(--tx),var(--ty)) scale(.45);opacity:.2}
.recycle-fly.go .rf-in{transform:rotateY(180deg)}
.learned{list-style:none;padding:0;font-size:15px;line-height:1.9}
.dlg .choice{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.dlg .choice button{min-height:44px;font-size:15px;text-align:left;padding:8px 12px;border-radius:10px}
.dlg .choice .fb{font-size:14px;margin:6px 0 0;color:#ffe9a8}
.flashfx{position:fixed;inset:0;z-index:60;pointer-events:none;background:#fff;opacity:0;animation:wflash 1.6s ease-out forwards}
@keyframes wflash{0%{opacity:0}10%{opacity:1}40%{opacity:.85}100%{opacity:0}}
.powderfx{position:fixed;left:0;right:0;top:0;height:60%;z-index:61;pointer-events:none}
.powderfx i{position:absolute;top:-10px;width:6px;height:6px;border-radius:50%;background:#f4f4f4;box-shadow:0 0 4px #fff;animation:pfall 2.2s ease-in forwards}
@keyframes pfall{to{transform:translateY(55vh);opacity:.2}}
.star-list{text-align:left;max-width:460px;margin:8px auto;padding:0;list-style:none;font-size:14px;line-height:1.6}
.star-list li{padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.06);margin:4px 0}
.star-list li.miss{opacity:.85;border-left:3px solid #e8a33b}
.star-list li.got{border-left:3px solid #6fd36b}
.star-list small{display:block;color:#cbd3dc}
.hp-buff{font-style:normal;color:#f0c14b;font-size:.8em;margin-left:2px}
.dlg .choice button.right{background:#1f7a3a!important;color:#fff;border:2px solid #9ff0b4;animation:okFlash .6s}
.dlg .choice button.right::after{content:' ✔'}
.dlg .choice button.wrong{border:2px dashed #ff6b6b!important;background:rgba(120,20,20,.5)!important;color:#fff}
.dlg .choice button.wrong::after{content:' ✘'}
@keyframes okFlash{0%{box-shadow:0 0 0 0 #9ff0b4}50%{box-shadow:0 0 18px 6px #9ff0b4}100%{box-shadow:none}}
.loan-wrap{position:relative;display:inline-block;flex:none}
.loan-tag{position:absolute;top:2px;left:2px;z-index:3;font-size:10px;font-weight:800;padding:0 4px;border-radius:4px;background:#fff;color:#333;border:1px dashed #555;pointer-events:none}
.loan-wrap .ptcg-card{outline:2px dashed rgba(255,255,255,.55);outline-offset:-2px}

/* fix12 ⚡ energy (shared CC_ENERGY) */
.pip.bolt,.e-shape.bolt{display:inline-grid;place-items:center;width:1.35em;height:1.35em;border-radius:50%;background:#ffd23f;color:#3a2a00;font-style:normal;font-size:.85em;box-shadow:0 0 0 1.5px #a07800 inset}
.energy-notice{border:2px solid #ffd23f;border-radius:10px;padding:8px 10px}
/* ===== STORY LANE F12 (2026-10-23): dialogue backlog 回看 ===== */
.dtitle .blog{margin-left:auto;margin-right:6px}
.blog-pane{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;background:rgba(8,12,20,.94);color:#fff;padding:max(10px,env(safe-area-inset-top)) 12px 12px}
.blog-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.2)}
.blog-pane ol{list-style:none;margin:0;padding:8px 0;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
.blog-pane li{padding:7px 4px;border-bottom:1px solid rgba(255,255,255,.08);line-height:1.5;font-size:15px}
.blog-pane li b{display:block;color:#f0c14b;font-size:13px}
.blog-pane li.narr span{color:#cfd8e3;font-style:italic}
.blog-pane li.card span{color:#bfe6ff}
.blog-pane .en{opacity:.7;font-size:.85em}
/* ===== STORY LANE F12 END ===== */

/* ===== DISPLAY lane F07: reward NEW / duplicate labels ===== */
.cc-rewards{list-style:none;padding:0;margin:8px auto;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.cc-rewards li{background:rgba(255,255,255,.08);border-radius:8px;padding:4px 10px}.cc-tag{font-size:12px;border-radius:6px;padding:1px 6px}.cc-tag.new{background:#ffd54a;color:#222}.cc-tag.dup{background:#888;color:#fff}
/* ===== v1g (2026-10-23) ===== */
.heroSel .nm,html.anime .heroSel label.nm{color:#fff!important;font-weight:800;text-shadow:0 1px 3px #000;background:rgba(6,20,26,.78);padding:6px 12px;border-radius:12px;width:max-content;margin:8px auto}
.heroSel .nm input{background:#fff;color:#111}
/* 360px: swipe hint sits under the tabs instead of covering them */
.chtabs-hint{position:static!important;background:none!important;padding:0 4px!important;justify-content:flex-end;margin-top:-2px;color:#bfe6f2!important}
.prof small.lvxp{font-size:14px;font-weight:700}
.lose-tips{background:rgba(255,248,230,.95);color:#3a2a10;border-radius:12px;padding:8px 12px;margin:8px 0;text-align:left}.lose-tips ul{margin:4px 0 0;padding-left:18px}
.dlg .inter{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);width:min(560px,94vw);max-height:78vh;overflow:auto;background:rgba(14,30,40,.96);color:#eef8ff;border:2px solid #7fd3e8;border-radius:16px;padding:12px 14px;z-index:5;text-align:center}
.inter h3{margin:0 0 4px;font-size:17px}.inter .lead{font-size:13px;margin:0 0 8px;opacity:.9}.inter .fb{font-size:14px;margin:8px 0}
.inter .tubes{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.inter .tube{width:56px;min-height:110px;border-radius:0 0 26px 26px;border:2px solid #cfe9f2;background:linear-gradient(180deg,rgba(255,255,255,.08) 40%,rgba(150,210,230,.45) 40%);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:8px;position:relative}
.inter .tube.on{outline:3px solid #ffd34d;background:linear-gradient(180deg,rgba(255,255,255,.08) 40%,rgba(255,211,77,.4) 40%)}
.inter .tube small{font-size:11px;opacity:.85}
.inter .tube.fizz i{position:absolute;left:50%;top:48%;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:-10px 14px 0 #fff,8px 26px 0 #fff,-4px 36px 0 #fff;animation:fz 1s infinite linear}
@keyframes fz{from{transform:translateY(20px);opacity:.3}to{transform:translateY(-18px);opacity:1}}
.inter .ag2o{height:70px;display:grid;place-items:center}.inter .ag2o .powder{width:90px;height:26px;border-radius:50%;background:#3a2c22;transition:background .8s,box-shadow .8s}
.inter .ag2o.s2 .powder{background:#5a3a22;box-shadow:0 0 18px #ff8a3a}.inter .ag2o.s3 .powder{background:linear-gradient(135deg,#e8eef2,#a9b6bf);box-shadow:0 0 14px #fff}
.inter .agbtns{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.inter .agbtns .btn.done{opacity:.6}
.inter [data-inext],.inter [data-tcheck]{margin-top:8px}
.loan-tag{left:auto!important;right:2px;top:auto!important;bottom:22px}
/* ch10e F04 quiz state badges */
.qstate{display:inline-block;font-size:11px;padding:0 6px;margin-left:4px;border-radius:9px;background:rgba(255,255,255,.12);white-space:nowrap}
.qs-first,.qs-done{background:rgba(80,200,120,.25)}.qs-corrected{background:rgba(232,163,59,.25)}.qs-skipped,.qs-unanswered{background:rgba(160,160,180,.22)}
/* ch10e Ch7 cheat sheet button */
.cc-cheat-btn{position:fixed;right:8px;top:calc(env(safe-area-inset-top,0px) + 96px);z-index:30;font-size:12px;padding:4px 8px;border-radius:14px;border:1px solid rgba(255,255,255,.35);background:rgba(20,40,60,.8);color:#fff}