/* /assets/machines/home-equipment/how-a-vacuum-cleaner-works-cutaway.css — 本页专属样式（en/zh 共用） */
/* ============ 特殊材质（Solid-fill internals） ============ */
.part .water{fill:#6fa8dc;fill-opacity:.6;stroke:#2563eb;stroke-width:1.2}
.part.is-active .water{fill:#2563eb;fill-opacity:.75}
.part .ceramic{fill:#f1f4f8;stroke:#9aa6b8;stroke-width:2}
.part.is-active .ceramic{fill:#ffffff;stroke:var(--accent-2)}
.part .coffee{fill:#6f4a2f;stroke:#4b3220;stroke-width:1}
.part.is-active .coffee{fill:#8a5a38;stroke:#b0703a}
.part .crema{fill:#d9a86c}
.part.is-active .crema{fill:#e8b877}
.stream{fill:none;stroke:#6f4a2f;stroke-width:6;stroke-linecap:round;stroke-dasharray:9 9;opacity:.85}
.is-running .stream{animation:flow 1.1s linear infinite}

/* ============ 零件本体/区分色（part bodies & per-part distinct fills） ============ */
.part .body{fill:var(--metal);stroke:#8ea0b5;stroke-width:1.6}
.part .body2{fill:var(--metal-2);stroke:#a9b7c9;stroke-width:1.2}
.part .body3{fill:#c6d0dd;stroke:none}
.part .accent{fill:none;stroke:#6b7b8c;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* active highlight stays blue */
.part.is-active .body{fill:#cfe3fb;stroke:var(--accent)}
.part.is-active .body2{fill:#e3eefc;stroke:#60a5fa}
.part.is-active .body3{fill:var(--accent)}
.part.is-active .accent{stroke:var(--accent-2)}
.part.is-active{filter:drop-shadow(0 0 10px rgba(37,99,235,.35))}

/* ============ 动画：叶轮 / 光环（motion） ============ */
.impeller{transform-box:view-box;animation:spin 1.4s linear infinite;animation-play-state:paused}
.is-running .impeller{animation-play-state:running}
@keyframes spin{to{transform:rotate(360deg)}}

.halo{opacity:0;transition:opacity .5s}
.is-running .halo{opacity:1;animation:halo 2.2s ease-in-out infinite}
@keyframes halo{0%,100%{opacity:.35}50%{opacity:.85}}

/* ============ 管道流动（flow） ============ */
.pipe-case{fill:none;stroke:#94a3b8;stroke-width:24;stroke-linecap:round;stroke-linejoin:round}
.pipe-flow{
  fill:none;stroke:var(--accent);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:10 16;opacity:0;transition:opacity .4s;
}
.pipe-flow.hot{stroke:#ea580c}
.pipe-flow.cold{stroke:#2563eb}
.is-running .pipe-flow{opacity:.95;animation:flow 1.15s linear infinite}
.is-running .pipe-flow.hot{animation-duration:.9s}
@keyframes flow{to{stroke-dashoffset:-26}}
/* ============ 吸尘器剖面图 · Vacuum cleaner cutaway ============ */
/* vacuum-cleaner · merged from source <style> */

body[data-topic="vacuum-cleaner"] .svg-title{fill:#16202c;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
           font-size:17px;font-weight:600;letter-spacing:.08em;text-anchor:middle;}
body[data-topic="vacuum-cleaner"] .svg-sub{fill:#64748b;font-size:12px;text-anchor:middle;}
body[data-topic="vacuum-cleaner"] .tag   {fill:#334155;font-size:17px;font-weight:600;text-anchor:middle;}
body[data-topic="vacuum-cleaner"] .tag-sm{fill:#5b6472;font-size:12px;text-anchor:middle;}
body[data-topic="vacuum-cleaner"] .leader{fill:none;stroke:#cbd5e1;stroke-width:1.2;stroke-dasharray:3 3;}
body[data-topic="vacuum-cleaner"] .legend{fill:#5b6472;font-size:11px;text-anchor:middle;}

body[data-topic="vacuum-cleaner"] .shell-layer{fill:#cbd5e1;stroke:#94a3b8;stroke-width:3;}
body[data-topic="vacuum-cleaner"] .stage[data-shell="glass"] .shell-layer{opacity:.15;}

body[data-topic="vacuum-cleaner"] .body-main{fill:#f8fafc;stroke:#1e293b;stroke-width:2.5;stroke-linejoin:round;}

body[data-topic="vacuum-cleaner"] .handle{fill:none;stroke:#1e293b;stroke-width:18;stroke-linecap:round;}
body[data-topic="vacuum-cleaner"] .handle-grip{fill:none;stroke:#64748b;stroke-width:14;stroke-linecap:round;}

body[data-topic="vacuum-cleaner"] .floor-head{fill:#334155;stroke:#1e293b;stroke-width:2.5;stroke-linejoin:round;}
body[data-topic="vacuum-cleaner"] .floor-lip {fill:#475569;stroke:#1e293b;stroke-width:1.5;}
body[data-topic="vacuum-cleaner"] .brush-roll{fill:#fbbf24;stroke:#d97706;stroke-width:2;stroke-linejoin:round;}
body[data-topic="vacuum-cleaner"] .brush-bristle{stroke:#b45309;stroke-width:2;stroke-linecap:round;}
body[data-topic="vacuum-cleaner"] .brush-rotor{transform-box:fill-box;transform-origin:center;
               animation:spin 2.5s linear infinite;}

body[data-topic="vacuum-cleaner"] .wheel{fill:#334155;stroke:#1e293b;stroke-width:2.5;}
body[data-topic="vacuum-cleaner"] .wheel-hub{fill:#94a3b8;stroke:#475569;stroke-width:1.5;}

body[data-topic="vacuum-cleaner"] .dust-bag{fill:#fef3c7;stroke:#d97706;stroke-width:2.5;stroke-linejoin:round;}
body[data-topic="vacuum-cleaner"] .dust-bag-inner{fill:#fde68a;stroke:none;opacity:.7;}
body[data-topic="vacuum-cleaner"] .dust-pile{fill:#94a3b8;opacity:.8;}
body[data-topic="vacuum-cleaner"] .dust-mote{fill:#64748b;}

body[data-topic="vacuum-cleaner"] .filter{fill:#e0f2fe;stroke:#0891b2;stroke-width:2.5;stroke-linejoin:round;}
body[data-topic="vacuum-cleaner"] .filter-line{stroke:#0891b2;stroke-width:1.2;}

body[data-topic="vacuum-cleaner"] .motor-body{fill:#64748b;stroke:#334155;stroke-width:2.5;stroke-linejoin:round;}
body[data-topic="vacuum-cleaner"] .motor-cap {fill:#94a3b8;stroke:#475569;stroke-width:1.5;}
body[data-topic="vacuum-cleaner"] .fan-blade{fill:#2563eb;stroke:#1e40af;stroke-width:1.5;stroke-linejoin:round;}
body[data-topic="vacuum-cleaner"] .fan-rotor{transform-box:fill-box;transform-origin:center;
             animation:spin .55s linear infinite;}

body[data-topic="vacuum-cleaner"] .hose-outer{fill:none;stroke:#1e293b;stroke-width:22;stroke-linecap:round;}
body[data-topic="vacuum-cleaner"] .hose-inner{fill:none;stroke:#e2e8f0;stroke-width:16;stroke-linecap:round;}
body[data-topic="vacuum-cleaner"] .hose-rib  {stroke:#64748b;stroke-width:2;stroke-linecap:round;}

body[data-topic="vacuum-cleaner"] .cord{fill:none;stroke:#334155;stroke-width:4;stroke-linecap:round;}

body[data-topic="vacuum-cleaner"] .airflow{
    fill:none;stroke:#22d3ee;stroke-width:5;stroke-linecap:round;
    stroke-dasharray:12 10;stroke-dashoffset:0;
    animation:vacuum-cleaner-af-flow 1s linear infinite;
  }
body[data-topic="vacuum-cleaner"] .airflow.fast{animation-duration:.45s;}
@keyframes vacuum-cleaner-af-flow{to{stroke-dashoffset:-44}}   /* 44 = 2 × (12+10)，无缝循环 */

body[data-topic="vacuum-cleaner"] .dust{animation:vacuum-cleaner-dust-suck 2.6s ease-in infinite;}
body[data-topic="vacuum-cleaner"] .dust.d2{animation-delay:.65s;}
body[data-topic="vacuum-cleaner"] .dust.d3{animation-delay:1.3s;}
body[data-topic="vacuum-cleaner"] .dust.d4{animation-delay:1.95s;}
@keyframes vacuum-cleaner-dust-suck{
    0%  {transform:translate(0,0) scale(1);opacity:0}
    15% {opacity:.9}
    70% {opacity:.9}
    100%{transform:translate(-30px,-120px) scale(.7);opacity:0}
  }

body[data-topic="vacuum-cleaner"] .exhaust{
    fill:none;stroke:#94a3b8;stroke-width:5;stroke-linecap:round;
    stroke-dasharray:10 8;stroke-dashoffset:0;
    animation:vacuum-cleaner-ex-flow 1.2s linear infinite;
  }
@keyframes vacuum-cleaner-ex-flow{to{stroke-dashoffset:-36}}   /* 36 = 2 × (10+8)，无缝循环 */

@media (prefers-reduced-motion:reduce){
  body[data-topic="vacuum-cleaner"] .brush-rotor,
  body[data-topic="vacuum-cleaner"] .fan-rotor,
  body[data-topic="vacuum-cleaner"] .airflow,
  body[data-topic="vacuum-cleaner"] .exhaust,
  body[data-topic="vacuum-cleaner"] .dust{animation:none;}
  body[data-topic="vacuum-cleaner"] .dust{opacity:.6;}
}