/* 化學電池場景（外殼喺 ../_shared/apparatus-shell.css；真實儀器用真色：品牌規格 §2，2026-10-14） */
.particles { position: fixed; z-index: 1; }
.particles svg { display: block; width: 100%; height: 100%; }
.plant svg [data-item] { cursor: default; }

/* 玻璃：只畫輪廓，底色好淡 */
.glass-tint { fill: #FFFFFF; fill-opacity: .22; stroke: none; }
.bulb-glass { fill: #FFFFFF; fill-opacity: .35; stroke: none; transition: fill .2s; }
.filament { fill: none; stroke: #6B5A44; stroke-width: 1.1; stroke-linecap: round; }

/* 溶液：CuSO₄ 藍（Cu²⁺ 用咗會變淡）；稀 H₂SO₄ 無色 */
.liq-side { stroke: none; }
.liq-top { stroke: rgba(14, 31, 61, .35); stroke-width: .8; }

/* 金屬真色：每種金屬一套四級側面色（套落工具包 token） */
.mat-Mg { --anatomy-paper: #E4E6E8; --anatomy-top: #F4F5F6; --anatomy-shade-0: #B9BEC4; --anatomy-shade-1: #C8CCD1; --anatomy-shade-2: #D6D9DD; --anatomy-shade-3: #E2E4E7; }
.mat-Zn { --anatomy-paper: #B7C0C8; --anatomy-top: #CFD6DC; --anatomy-shade-0: #8E99A4; --anatomy-shade-1: #9DA7B1; --anatomy-shade-2: #AAB3BC; --anatomy-shade-3: #B7BFC7; }
.mat-Fe { --anatomy-paper: #8B8E93; --anatomy-top: #A3A6AB; --anatomy-shade-0: #66696E; --anatomy-shade-1: #72757A; --anatomy-shade-2: #7E8186; --anatomy-shade-3: #8A8D92; }
.mat-Cu { --anatomy-paper: #C77A4F; --anatomy-top: #DB9670; --anatomy-shade-0: #9C5534; --anatomy-shade-1: #AB613E; --anatomy-shade-2: #B86D48; --anatomy-shade-3: #C47952; }
.mat-Ag { --anatomy-paper: #E9ECEF; --anatomy-top: #FAFBFC; --anatomy-shade-0: #C3C9CF; --anatomy-shade-1: #D0D5DA; --anatomy-shade-2: #DCE0E4; --anatomy-shade-3: #E7EAED; }
.coat { fill: #8E4A2A; stroke: none; }
.plated { fill: #A85A33; stroke: none; }
.bubble { fill: rgba(255, 255, 255, .85); stroke: rgba(14, 31, 61, .45); stroke-width: .45; }

/* 夾、燈頭、接線柱、電線 */
.clip { --anatomy-paper: #C9CDD2; --anatomy-top: #E2E5E8; --anatomy-shade-0: #9AA1A9; --anatomy-shade-1: #A8AEB5; --anatomy-shade-2: #B6BBC1; --anatomy-shade-3: #C2C7CC; }
.brass { --anatomy-paper: #D9B86A; --anatomy-top: #EBD08E; --anatomy-shade-0: #B08F45; --anatomy-shade-1: #BE9C50; --anatomy-shade-2: #CAA85C; --anatomy-shade-3: #D4B366; }
.term-red { --anatomy-paper: #D64541; --anatomy-top: #E8706C; --anatomy-shade-0: #A8302D; --anatomy-shade-1: #B73733; --anatomy-shade-2: #C53D39; --anatomy-shade-3: #D0423E; }
.term-black { --anatomy-paper: #2E3238; --anatomy-top: #4A4F57; --anatomy-shade-0: #1C1F23; --anatomy-shade-1: #23262B; --anatomy-shade-2: #2A2D32; --anatomy-shade-3: #30343A; }
.wire-red { --anatomy-shade-2: #D64541; --anatomy-top: #EE8682; --anatomy-shade-0: #A8302D; }
.wire-black { --anatomy-shade-2: #33373E; --anatomy-top: #5C626B; --anatomy-shade-0: #1C1F23; }
.wire-blue { --anatomy-shade-2: #3E6FA8; --anatomy-top: #7FA3CF; --anatomy-shade-0: #2B4F7C; }

/* 伏特計錶盤 */
.dial-face { fill: #FFFDF6; stroke: none; }
.dial-frame { fill: none; stroke: #0E1F3D; stroke-width: .9; }
.dial-arc, .dial-tick { fill: none; stroke: #0E1F3D; stroke-width: .55; }
.dial-num { font-size: 4.2px; font-weight: 800; fill: #0E1F3D; font-family: inherit; }
.dial-unit { font-size: 6px; font-weight: 900; fill: #0E1F3D; font-family: inherit; }
.dial-pivot { fill: #0E1F3D; }
.needle { stroke: #D64541; stroke-width: 1; stroke-linecap: round; fill: none; }

/* 電子（gold，品牌粒子色） */
.electron { fill: #FFD24A; stroke: #0E1F3D; stroke-width: .5; }

/* 圖例 */
.ldot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.ldot.e { background: #FFD24A; border: 1px solid rgba(14, 31, 61, .5); }
.ldot.h2 { background: #fff; border: 1px solid rgba(14, 31, 61, .45); }
.lsw { width: 14px; height: 10px; border-radius: 2px; display: inline-block; }
.lsw.cu { background: #8E4A2A; }
.sim-legend .it[hidden] { display: none; }
.grid-presets { grid-auto-flow: row; grid-template-columns: repeat(6, 1fr); }
.grid-presets button { grid-column: span 2; padding-left: 4px !important; padding-right: 4px !important; }
.grid-presets button:nth-child(n+4) { grid-column: span 3; }
.metals button { font-size: 13.5px; }

/* 圖表 */
.gcard svg text { font-family: inherit; fill: var(--muted); font-variant-numeric: tabular-nums; }
.gcard svg path, .gcard svg circle, .gcard svg line { vector-effect: non-scaling-stroke; }
.gcard svg .ax { stroke: rgba(251, 238, 218, .35); stroke-width: 1; fill: none; }
.gcard svg .ideal { stroke: var(--cream); stroke-width: 1.6; stroke-dasharray: 5 5; fill: none; opacity: .8; }
.gcard svg .live { stroke: var(--orange); stroke-width: 2.6; fill: none; }
.gcard svg .ghost { stroke: var(--grey); stroke-width: 1.6; stroke-dasharray: 4 4; fill: none; }
.gcard svg .zero { stroke: rgba(251, 238, 218, .25); stroke-width: 1; }
.gcard svg .mark { fill: var(--orange); }
.gcard svg .key { font-weight: 800; }
.gcard svg .chip { fill: var(--navy-2); stroke: rgba(251, 238, 218, .25); stroke-width: 1; }
.gcard svg .chip.on { fill: var(--cream); stroke: none; }
.gcard svg .chip-t { font-weight: 800; fill: var(--cream); }
.gcard svg .chip-t.on { fill: var(--navy); }
.gcard svg .gap { stroke: var(--orange); stroke-width: 2.4; fill: none; }
.gcard svg .gap-t { fill: var(--orange); font-weight: 800; }

/* 粒子模式 */
.particles .p-charge { font-family: "Noto Sans HK", sans-serif; font-weight: 900; fill: #0E1F3D; }
.particles .p-tag { font-family: "Noto Sans HK", sans-serif; font-weight: 800; font-size: 22px; fill: #FBEEDA; }
.particles .p-tag.dark { fill: #0E1F3D; }
.particles .p-count { font-family: "Noto Sans HK", sans-serif; font-weight: 800; font-size: 22px; fill: #0E1F3D; font-variant-numeric: tabular-nums; }
.particles .p-count .hot { fill: #C46F00; }
.pdot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; border: 1px solid rgba(14, 31, 61, .4); }
/* 離子：細過原子、淡色、虛線邊，同原子一眼分得出 */
.particles .ion circle { stroke-dasharray: 4 3; stroke: #0E1F3D !important; stroke-width: 1.8 !important; fill-opacity: .7; }
/* 伏特計讀數係上堂指住講嘅數（有正負）：放大，後排都睇到 */
.sim-stat.hot span { font-size: 30px; line-height: 1.1; }