.practical-model{margin:2rem 0;padding:1.25rem;border:1px solid #d7e2ec;border-radius:18px;background:#f8fbfd}
.practical-model h2{margin-top:0;color:#12385a}.practical-model .pm-lead{font-size:1.04rem;color:#324b60}
.pm-grid{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(300px,1.2fr);gap:1rem;align-items:start}
.pm-controls,.pm-results{padding:1rem;border-radius:14px;background:#fff;border:1px solid #dce6ee}
.pm-field{display:grid;grid-template-columns:1fr 7rem;gap:.65rem;align-items:center;margin:.85rem 0}
.pm-field label{font-weight:700;color:#173f61}.pm-field input[type=number],.pm-field select{width:100%;padding:.55rem;border:1px solid #9db1c1;border-radius:8px;font:inherit}
.pm-field input[type=range]{grid-column:1/-1;width:100%;accent-color:#ef7b19}
.pm-check{display:flex;gap:.55rem;align-items:flex-start;margin:.65rem 0}.pm-check input{margin-top:.3rem}
.pm-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}.pm-actions button{padding:.6rem .9rem;border-radius:9px;border:1px solid #0d4168;background:#0d4168;color:#fff;font-weight:700;cursor:pointer}.pm-actions button:last-child{background:#fff;color:#0d4168}
.pm-output{font-size:1.05rem;font-weight:750;color:#0c755f;margin:.5rem 0}.pm-note{font-size:.92rem;color:#52697b}.pm-warning{padding:.7rem;border-left:4px solid #ef7b19;background:#fff6ed;color:#744014}
.pm-chart{width:100%;min-height:260px;display:block}.pm-chart text{font:13px system-ui,sans-serif;fill:#425f72}.pm-chart .axis{stroke:#8ca3b4;stroke-width:1}.pm-chart .grid{stroke:#d9e3ea;stroke-width:1}.pm-chart .series{fill:none;stroke:#07879a;stroke-width:4}.pm-chart .band{fill:#f59c50;opacity:.18}.pm-chart .marker{fill:#ef7b19}
.pm-details{margin-top:1rem}.pm-details summary{cursor:pointer;font-weight:800;color:#12385a}
@media(max-width:760px){.pm-grid{grid-template-columns:1fr}.pm-field{grid-template-columns:1fr 6.3rem}.practical-model{padding:.9rem}.pm-chart{min-height:220px}}
.pm-chart{touch-action:none}.pm-chart .pm-drag{cursor:grab;stroke:#fff;stroke-width:4;filter:drop-shadow(0 4px 6px #17365155)}.pm-chart .pm-drag:active{cursor:grabbing}.pm-chart .drag-label{font-weight:900;fill:#c45d00}
.qq-range-chart{width:100%;height:auto;margin:12px 0;border-radius:14px;background:linear-gradient(#fafdfe,#edf5f8);touch-action:none}.qq-range-track{stroke:#90a7b2;stroke-width:3}.qq-range-chart [data-range-band]{fill:#42b9b2;opacity:.22}.qq-range-chart g{cursor:ew-resize}.qq-range-chart g line{stroke:#f58220;stroke-width:4}.qq-range-chart g circle{fill:#f58220;stroke:#fff;stroke-width:5;filter:drop-shadow(0 4px 5px #082a5040)}.qq-range-chart g text{font:800 13px system-ui;fill:#173651}.qq-customer-hint{padding:8px 10px;border-radius:10px;background:#e8f7f5;color:#15544e}
.pm-has-error .pm-results{border-color:#d58b96;background:#fff7f8}.pm-has-error .pm-output{color:#9b2635}.practical-model input[aria-invalid=true]{border:2px solid #b43c48;background:#fff3f4}.pm-chart{max-width:100%;overflow:visible}.pm-results{min-width:0;overflow:hidden}@media(max-width:420px){.pm-field{grid-template-columns:1fr}.pm-field input[type=range]{grid-column:1}.pm-controls,.pm-results{padding:.75rem}.pm-chart{min-height:180px}}

/* 2026-10-15 助手N：幫浦用電比較器 390px 滑桿與數字框擠成一列、單位被截 → 標題一行、滑桿＋數字框一行（只作用於 data-pump-energy-model） */
[data-pump-energy-model] .pm-controls label{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:12px;font-weight:700}
[data-pump-energy-model] .pm-controls input[type=range]{flex:1 1 calc(100% - 6.5rem);min-width:0;margin:0;min-height:32px}
[data-pump-energy-model] .pm-controls input[type=number]{flex:0 0 5.5rem;width:5.5rem;min-width:0;box-sizing:border-box;min-height:40px;padding:6px 8px}