/* Chapter 6 (酸鹼河谷：中和之約) — additive styles only */
/* naming: big formula + state symbol on baseline, small Chinese name */
.fbig{font-weight:900;letter-spacing:-.01em;line-height:1}
.fbig .fstate{font-size:.62em;font-weight:700;vertical-align:baseline;margin-left:1px;opacity:.95}
.fzh{display:block;font-size:.58em;font-weight:600;opacity:.9;line-height:1.1;margin-top:1px}
.style-c .nm .fstate{font-size:.7em;font-weight:700}
.ptcg-top .nm.fnm{display:flex;flex-direction:column;line-height:1!important;white-space:nowrap!important}
.ptcg-top .nm.fnm .fbig{font-size:1.08em}
.ptcg-top .nm.fnm .fzh{font-size:.72em}
.cc-state-tip{margin:8px 0;padding:8px 10px;border-radius:12px;background:#fff7d6;color:#3b2f00;border:2px solid #f2c94c;font-size:13px;text-align:left}
.cc-state-tip p{margin:4px 0}.cc-state-tip small{opacity:.8}
.cc-state-tip .ext,.inter .ext{display:inline-block;font-size:.72em;font-weight:800;padding:0 6px;border-radius:999px;background:#7a3cff;color:#fff}
/* 6-5 ending smoke overlay (separate swappable image) */
.dbg img.dbg-ovl{z-index:2;mix-blend-mode:normal;transition:opacity .6s ease}
/* neutralisation reaction panel (no e⁻) */
.reaction-animation.neutral .neutral-mix{position:relative;height:46px;margin:6px auto;width:160px}
.neutral-mix i{position:absolute;top:6px;width:60px;height:8px;border-radius:8px;background:linear-gradient(90deg,rgba(220,240,255,.2),rgba(220,240,255,.95));animation:c6flow 1.2s ease-in-out infinite alternate}
.neutral-mix i:first-child{left:0}.neutral-mix i:nth-child(2){right:0;transform:scaleX(-1)}
.neutral-mix b{position:absolute;left:50%;top:18px;width:34px;height:24px;margin-left:-17px;border-radius:50%;background:radial-gradient(circle,#ffd9a0,rgba(255,160,80,0) 70%)}
@keyframes c6flow{to{opacity:.5}}
/* GHS */
.c6-ghs{display:flex;gap:10px;justify-content:center;align-items:flex-end;flex-wrap:wrap}
.c6-ghsbtn{width:84px;height:84px;padding:4px;border-radius:12px;background:#fff;border:3px solid #cfe9f2}
.c6-ghsbtn img{width:100%;height:100%;object-fit:contain}
.c6-ghsbtn.wrong{border-color:#e8202a;opacity:.6}
.c6-bottle{width:70px;height:96px;border-radius:14px 14px 8px 8px;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(200,230,255,.35));border:2px solid #cfe9f2;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;font-weight:800}
.c6-bottle img{width:44px;height:44px;margin-top:4px}
/* litmus cups */
.c6-cups{display:flex;gap:8px;justify-content:center}
.c6-cup{flex:1 1 0;min-width:0;background:rgba(255,255,255,.06);border-radius:12px;padding:6px}
.c6-water{height:26px;margin:4px 8px;border:2px solid #cfe9f2;border-top:none;border-radius:0 0 12px 12px;background:rgba(200,230,255,.25)}
.c6-papers{display:flex;gap:4px;justify-content:center}
.c6-paper{flex:1;font-size:12px;padding:6px 2px;border-radius:6px;border:0;color:#fff;font-weight:800}
.c6-paper.blue{background:#2f6fe0}.c6-paper.red{background:#d8404a}
.c6-paper i{display:block;font-style:normal;font-size:11px;margin-top:2px;border-radius:4px}
.c6-paper i.red{background:#d8404a}.c6-paper i.blue{background:#2f6fe0}
.c6-pick{display:flex;flex-direction:column;gap:3px;margin-top:6px}
.c6-pick .btn{font-size:12px;padding:4px}.c6-pick .btn.on{outline:3px solid #ffd34d}
/* pH */
.c6-samples{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:8px}
.c6-sample{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;border:2px solid #cfe9f2;background:rgba(255,255,255,.08);color:#fff;font-size:13px}
.c6-sample.on{outline:3px solid #ffd34d}.c6-sample:disabled{opacity:.35}
.c6-sample i{width:16px;height:16px;border-radius:50%;display:inline-block}
.c6-scale{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.c6-slot{min-height:64px;border-radius:8px;border:0;color:#111;font-size:12px;display:flex;flex-direction:column;justify-content:space-between;padding:4px}
.c6-slot b{font-size:13px}
.red{--c:#e5383b}.orange{--c:#f4892b}.yellow{--c:#f2d330}.green{--c:#3ccf6b}.blue{--c:#2f8fe0}.purple{--c:#8a4bd8}
.c6-slot,.c6-sample i,.c6-phbar span{background:var(--c)}
.c6-slot.purple,.c6-slot.blue,.c6-slot.red{color:#fff}
/* dropper */
.c6-drop{display:flex;gap:12px;justify-content:center;align-items:center;margin-bottom:8px}
.c6-beaker{width:90px;height:100px;border:3px solid #cfe9f2;border-top:none;border-radius:0 0 18px 18px;background:linear-gradient(180deg,transparent 25%,var(--c) 25%);display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;transition:background .3s}
.c6-beaker b{background:rgba(0,0,0,.45);color:#fff;border-radius:8px;padding:1px 6px}
.c6-phbar{display:flex;flex-direction:column-reverse;gap:2px}
.c6-phbar span{width:46px;font-size:11px;color:#fff;border-radius:4px;text-align:center;position:relative}
.c6-phbar span.cur::before{content:'▶';position:absolute;left:-14px;color:#ffd34d}
.inter .row{display:flex;gap:8px;justify-content:center;margin-top:6px}
/* safety order */
.c6-steps{display:flex;flex-direction:column;gap:6px}
.c6-step{padding:10px;border-radius:10px;border:2px solid #cfe9f2;background:rgba(255,255,255,.08);color:#fff;font-size:14px;text-align:left}
.c6-step.on{background:rgba(60,207,107,.3);border-color:#3ccf6b}
.c6-eq{text-align:left;font-size:14px;margin:6px 0 8px;padding-left:22px}.c6-eq li{margin:4px 0}
.inter .fb.ok{color:#9ff0b6}.inter .fb.no{color:#ffb4b4}
/* 23Oct fix: tip contrast inside sheets; card art must not shrink in flex sheet */
.ptcg-sheet .cc-state-tip,.ptcg-sheet .cc-state-tip p,.ptcg-sheet .cc-state-tip small,.ptcg-sheet .cc-state-tip b{color:#3b2f00!important}
.ptcg-sheet .cc-state-tip .ext{color:#fff!important}
.ptcg-detail-sheet>*{flex-shrink:0}
