/* 單元 1-2 專用樣式 */
.eqbig { font-size: 52px; margin: 10px 0 8px; font-family: "Cambria Math", "Times New Roman", var(--font); }
.eqmid { font-size: 34px; margin: 6px 0; font-family: "Cambria Math", "Times New Roman", var(--font); }
.frac { display: inline-flex; flex-direction: column; vertical-align: middle; text-align: center; font-size: .8em; line-height: 1.15; margin: 0 .15em; }
.frac > span:first-child { border-bottom: 2px solid currentColor; padding: 0 .2em; }
.analogy { margin-top: 30px; font-size: 27px; padding: 16px 22px; background: color-mix(in srgb, var(--accent-2) 9%, var(--surface)); border-left: 4px solid var(--accent-2); }

/* 系統水槽 */
.tank { width: 100%; height: 100%; max-height: 760px; overflow: visible; }
.tank__box { fill: none; stroke: var(--ink); stroke-width: 3; stroke-dasharray: 10 8; }
.tank__water { fill: #2b86e0; opacity: .3; }
.tank__wave { fill: none; stroke: #2b86e0; stroke-width: 3; }
.tank__s { text-anchor: middle; font-size: 36px; font-weight: 700; fill: var(--accent-ink); }
.tank__in, .tank__out { color: #2b86e0; }
.tank__out { color: #c26a1d; }
.tank__in path, .tank__out path { stroke: currentColor; stroke-width: 10; fill: none; }
.tank__in text, .tank__out text { fill: currentColor; font-size: 30px; font-weight: 700; }
.tank__cap { text-anchor: middle; font-size: 26px; fill: var(--muted); }
.slide.is-play .tank__water { animation: tankfill 6s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: bottom; }
@keyframes tankfill { from { transform: scaleY(.75); } to { transform: scaleY(1.15); } }

/* 控制體積圖 */
.cv { display: grid; grid-template-columns: 640px 1fr; gap: 40px; }
.cv__eq { margin-top: 26px; padding: 14px 0 10px; border-top: 1px solid var(--line); }
.cv__tag { font-size: 21px; color: var(--accent-2); margin: 0; }
.cv__def { font-size: 22px; }
.cvsvg { width: 100%; height: 820px; overflow: visible; }
.cv__ground { fill: #b89a6e; opacity: .35; }
.cv__surf { fill: none; stroke: #6b5636; stroke-width: 4; }
.cv__gwt { fill: none; stroke: #2b86e0; stroke-width: 3; stroke-dasharray: 8 6; }
.cv__small { font-size: 20px; fill: #2b86e0; }
.cv__tree rect { fill: #5a4630; } .cv__tree circle { fill: #4b7a32; }
.cv__box { fill: none; stroke-width: 3.5; stroke-dasharray: 12 8; transition: opacity .6s var(--ease), stroke .6s; }
.cv__box--up { stroke: var(--accent); fill: color-mix(in srgb, var(--accent) 6%, transparent); }
.cv__box--down { stroke: var(--accent-2); fill: color-mix(in srgb, var(--accent-2) 6%, transparent); }
.cv__box--all { stroke: var(--ink); opacity: 0; }
.cv__boxlab { font-size: 24px; font-weight: 700; fill: var(--muted); }
.arw path { stroke: currentColor; stroke-width: 9; fill: none; }
.arw text { fill: currentColor; font-size: 27px; font-weight: 700; font-family: "Cambria Math", "Times New Roman", var(--font); }
.arw--p { color: #2b86e0; } .arw--e { color: #8a8f96; } .arw--t { color: #3f8a4a; } .arw--q { color: #1c6fc0; }
.arw--inf { color: #59a8d8; } .arw--int { color: #19a38d; } .arw--g { color: #1747c9; }
.inf { transition: opacity .6s var(--ease); }
.cancel { text-decoration: line-through; text-decoration-thickness: 3px; text-decoration-color: transparent; transition: text-decoration-color .5s; font-style: italic; }
.flag-merged .cancel { text-decoration-color: #c2483d; color: var(--muted); }
.flag-merged .inf { opacity: .18; }
.flag-merged .cv__box--merge { opacity: .12; }
.flag-merged .cv__box--all { opacity: 1; }
.outlet__bar { stroke: #1c6fc0; stroke-width: 10; }
.outlet__lab { font-size: 26px; font-weight: 700; fill: #1c6fc0; }
.outlet__lab2 { font-size: 20px; fill: #1c6fc0; font-family: var(--mono); }

/* 水深示意 */
.depth { width: 100%; height: 100%; max-height: 700px; overflow: visible; }
.depth__floor { fill: #d8cfbd; stroke: #a99f8b; stroke-width: 2; }
.depth__cube .c1 { fill: #7cb7e6; } .depth__cube .c2 { fill: #3d8fd1; } .depth__cube .c3 { fill: #2a74b4; }
.depth__sheet .s1 { fill: #7cb7e6; opacity: .85; } .depth__sheet .s2 { fill: #3d8fd1; } .depth__sheet .s3 { fill: #2a74b4; }
.depth__t { text-anchor: middle; font-size: 26px; fill: var(--muted); }
.depth__sheet { opacity: 0; }
.slide.is-play .depth__cube { animation: cubeGo 5s var(--ease) infinite; }
.slide.is-play .depth__sheet { animation: sheetGo 5s var(--ease) infinite; }
@keyframes cubeGo { 0%, 30% { opacity: 1; transform: none; } 55%, 100% { opacity: 0; transform: translateY(150px) scaleY(.2); } }
@keyframes sheetGo { 0%, 40% { opacity: 0; } 60%, 92% { opacity: 1; } 100% { opacity: 0; } }

/* 例題 1.1 */
.ex { display: grid; grid-template-columns: 1fr 600px; gap: 60px; }
.ex__q { margin-top: 18px; font-size: 26px; line-height: 1.55; }
.cols2 { width: 100%; height: 820px; overflow: visible; }
.cl { stroke: #fff; stroke-width: 2; }
.cl--p { fill: #2b86e0; } .cl--qi { fill: #59b4d8; } .cl--qo { fill: #c26a1d; } .cl--ds { fill: #2c9a5b; }
.cl--e { fill: none; stroke: var(--muted); stroke-width: 3; stroke-dasharray: 10 8; } .cl--e2 { fill: #9a8f80; }
.cl__t { text-anchor: middle; fill: #fff; font-size: 28px; font-weight: 700; font-family: var(--mono); }
.cl__q { fill: var(--muted); }
.cl__h { text-anchor: middle; font-size: 26px; font-weight: 700; fill: var(--ink); }
.cl__eq { stroke: var(--accent-2); stroke-width: 3; stroke-dasharray: 8 6; }
.cl__note { text-anchor: middle; font-size: 22px; fill: var(--accent-2); font-weight: 700; }

/* 逐月帳 */
.card3d.ledger { width: 640px; }
.ledger__svg { width: 100%; height: 300px; display: block; margin-top: 4px; overflow: visible; }
.ledger__read { margin: 6px 0 0 !important; font-size: 26px; }
.ledger__svg .bar-in { fill: #2b86e0; } .ledger__svg .bar-out { fill: #c26a1d; }
.ledger__svg .bar { transition: opacity .3s; }
.ledger__svg .s-line { fill: none; stroke: #2c9a5b; stroke-width: 4; }
.ledger__svg .s-dot { fill: #2c9a5b; }
.ledger__svg text { font-size: 15px; fill: var(--muted); font-family: var(--mono); }
.ledger__svg .s-lab { fill: #2c9a5b; font-weight: 700; font-size: 17px; }

.next { align-self: center; border: 1px solid var(--line); border-left: 6px solid var(--accent); padding: 36px 40px; background: var(--surface); }
.next__t { font-size: 46px; font-weight: 700; margin: 6px 0 10px !important; }
