.mb{--mb-panel:#1a1d1d;--mb-line:#3a3e3d;--mb-yellow:#e4c12e;--mb-muted:#aaa9a1;color:#e8e5dd;padding-block:clamp(2rem,5vw,5rem)}.mb-intro{max-width:860px;margin-bottom:3rem}.mb-intro h1{font-size:clamp(2.3rem,6vw,5.4rem);line-height:.94;letter-spacing:-.06em}.mb-module{border-top:1px solid var(--mb-line);padding:2.5rem 0}.mb-head h2{font-size:clamp(1.7rem,3.6vw,3rem);line-height:1}.mb-tabs,.mb-shift-controls{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.mb-tabs button,.mb-shift-controls button{background:#272b2a;color:#eee;border:1px solid var(--mb-line);padding:.7rem 1rem;font-weight:700}.mb-tabs [aria-pressed=true],.mb-shift-controls [aria-pressed=true]{background:var(--mb-yellow);color:#111}.mb-schematic{display:grid;grid-template-columns:minmax(260px,.9fr) 1.1fr;gap:1.25rem;background:var(--mb-panel);border:1px solid var(--mb-line);padding:1rem}.mb-diagram{min-height:270px;display:grid;place-items:center;position:relative;overflow:hidden;background:#0c0e0e}.mb-diagram>*{position:absolute;font-size:.66rem;font-weight:800;letter-spacing:.08em}.mb-stator{border:34px solid #6b716e;border-radius:50%;width:220px;height:220px;display:grid;place-items:center}.mb-rotor{width:105px;height:105px;border-radius:50%;background:var(--mb-yellow);display:grid;place-items:center;color:#111;z-index:2}.mb-comm{height:32px;width:130px;background:#c77c41;display:grid;place-items:center;z-index:3;color:#111}.mb-brush{background:#e7e0ca;color:#111;padding:.45rem}.mb-brush.left{transform:translateX(-105px)}.mb-brush.right{transform:translateX(105px)}.mb-stage{bottom:1rem;color:#d8d5cd;font-style:normal;max-width:210px;text-align:center}[data-type=brushless] .mb-comm,[data-type=brushless] .mb-brush{display:none}[data-type=brushless] .mb-stator{border-style:dashed;border-color:#82a7bd}.is-playing .mb-rotor,.is-playing .mb-comm,.is-playing [data-input-gear]{animation:mb-spin 2s linear infinite}.is-playing .mb-comm{animation-direction:reverse}.is-playing [data-output-gear],.is-playing [data-output-shaft]{animation:mb-spin 4s linear infinite}@keyframes mb-spin{to{transform:rotate(360deg)}}.mb-copy{padding:.5rem}.mb-copy h3,.mb-two h3{margin-top:0}.mb-copy p,.mb-two p,.mb-intro p{color:var(--mb-muted)}.mb-status{color:#d9d7cf;font-size:.92rem}.mb-two,.mb-gear,.mb-directory-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.mb-two>div,.mb-brand-grid article{background:var(--mb-panel);border:1px solid var(--mb-line);padding:1.1rem}.mb-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;border:0;padding:0}.mb-presets label{border:1px solid var(--mb-line);padding:1rem;display:grid;gap:.4rem;background:var(--mb-panel)}.mb-presets input{accent-color:var(--mb-yellow)}.mb-presets span{font-size:.86rem;color:var(--mb-muted)}.mb-note,.mb-source,.mb-nojs{border-left:3px solid var(--mb-yellow);padding:.85rem 1rem;background:#202323;color:var(--mb-muted);font-size:.9rem}.mb-error{color:#ffb7a6;margin:0}.mb-gear form{display:grid;gap:.8rem}.mb-gear label,.mb-directory-controls label{display:grid;gap:.35rem;font-weight:700}.mb-gear input,.mb-directory-controls input,.mb-directory-controls select{width:100%;padding:.65rem;background:#0d0f0f;border:1px solid var(--mb-line);color:#eee}.mb-shift{background:#0c0e0e;padding:1rem}.mb-transmission{height:120px;display:flex;align-items:center;justify-content:center;gap:.6rem;position:relative}.mb-transmission i{width:62px;height:62px;border:10px dotted var(--mb-yellow);border-radius:50%}.mb-transmission [data-output-gear]{width:88px;height:88px;border-color:#8aa2a5}.mb-transmission b{font-size:.65rem}.mb-transmission span{position:absolute;top:.2rem;left:.4rem;color:var(--mb-muted);font-size:.7rem}.mb-gear-output{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.mb-gear-output div{background:var(--mb-yellow);color:#111;padding:1rem}.mb-gear-output b,.mb-gear-output span,.mb-gear-output small{display:block}.mb-gear-output b{font-size:2rem}.mb-brand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin:1rem 0}.mb-brand-grid h2{margin:.2rem 0}.mb-brand-grid p{color:var(--mb-muted)}.mb-brand-grid [hidden]{display:none}@media(max-width:720px){.mb-schematic,.mb-two,.mb-gear,.mb-directory-controls{grid-template-columns:1fr}.mb-presets{grid-template-columns:1fr}.mb-brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:400px){.mb-brand-grid,.mb-gear-output{grid-template-columns:1fr}.mb-tabs{flex-direction:column}}
.mb-transmission[data-gear=high] [data-output-gear]{border-color:var(--mb-yellow);transform:scale(.82)}.mb-transmission[data-gear=low] [data-output-gear]{border-color:#8aa2a5;transform:scale(1.08)}.mb-transmission.is-playing [data-output-gear],.mb-transmission.is-playing [data-output-shaft]{animation-duration:var(--output-duration,4s)}
.mb.mb{color:var(--ink);--mb-muted:var(--muted);--mb-yellow:var(--yellow)}
.mb-schematic,.mb-two>div,.mb-presets label,.mb-shift,.mb-brand-grid article{color:#e8e5dd;--mb-muted:#bec5b9}
.mb-status{color:var(--muted)}.mb-schematic .mb-status,.mb-shift .mb-status{color:#d9d7cf}
.mb-note,.mb-source,.mb-nojs{color:#d3d8ce}.mb-error{color:#8b251c}.mb-schematic>*{min-width:0}
.mb-diagram.is-playing .mb-rotor{animation:none}.mb-diagram.is-playing .mb-comm{animation:mb-spin 2s linear infinite;animation-direction:normal}.mb-transmission.is-playing [data-input-gear]{animation:mb-spin 2s linear infinite}.mb-transmission.is-playing [data-output-gear],.mb-transmission.is-playing [data-output-shaft]{animation:mb-spin var(--output-duration,4s) linear infinite}
.mb-diagram{min-height:360px}.mb-stator{display:block;text-align:center;padding-top:4px}.mb-rotor{background:transparent;align-items:start;padding-top:11px}.mb-rotor::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--mb-yellow) 0 270deg,#a8b239 270deg 360deg);z-index:-1}.mb-comm{background:transparent}.mb-comm::before{content:"";position:absolute;inset:0;background:#c77c41;border-left:6px solid #e4b375;border-right:6px solid #855426;z-index:-1}.mb-schematic.is-playing .mb-rotor,.mb-schematic.is-playing .mb-comm{animation:none}.mb-schematic.is-playing .mb-rotor::before,.mb-schematic.is-playing .mb-comm::before{animation:mb-spin 2s linear infinite}.mb-brush{font-size:9px;padding:.35rem}.mb-brush.left{transform:translateX(-90px)}.mb-brush.right{transform:translateX(90px)}.mb-stage{max-width:210px;font-size:10px}
.mb-motor-svg{width:100%;height:100%;max-width:330px;overflow:visible}.mb-can{fill:url(#motor-steel);stroke:#171a19;stroke-width:8}.mb-diagram .mb-stator{fill:#202522;stroke:#879088;stroke-width:18}.mb-coils path{fill:none;stroke:#e4c12e;stroke-width:17;stroke-linecap:round}.mb-diagram .mb-rotor{fill:#c8cfbf;stroke:#111;stroke-width:8}.mb-diagram .mb-rotor path{stroke:#333a35;stroke-width:9}.mb-diagram .mb-comm{fill:#c77c41;stroke:#603617;stroke-width:4}.mb-diagram .mb-comm path{stroke:#f2c08e;stroke-width:4}.mb-diagram .mb-brush path{stroke:#d7d1bd;stroke-width:11}.mb-diagram .mb-brush rect{fill:#e7e0ca;stroke:#171a19;stroke-width:4}.mb-hub{fill:#151817;stroke:#e4c12e;stroke-width:5}[data-type=brushless] .mb-comm,[data-type=brushless] .mb-brush{display:none}.mb-diagram.is-playing .mb-rotor{animation:mb-spin 2s linear infinite;transform-box:fill-box;transform-origin:center}.mb-diagram.is-playing .mb-comm{animation:mb-spin 2s linear infinite reverse;transform-box:fill-box;transform-origin:center}@media(max-width:400px){.mb-motor-svg{max-width:270px}}
.mb-diagram svg .mb-stator{display:block!important;width:auto!important;height:auto!important;border:0!important;border-radius:0!important;padding:0!important;text-align:initial!important;fill:#202522!important;stroke:#879088!important;stroke-width:18!important}.mb-diagram svg .mb-rotor{display:block!important;width:auto!important;height:auto!important;border-radius:0!important;background:transparent!important;padding:0!important;align-items:initial!important;fill:#c8cfbf!important;stroke:#111!important;stroke-width:8!important}.mb-diagram svg .mb-comm{display:block!important;width:auto!important;height:auto!important;background:transparent!important;z-index:auto!important}.mb-diagram svg .mb-brush{display:block!important;background:transparent!important;color:inherit!important;padding:0!important;transform:none!important}.mb-diagram.is-playing svg .mb-rotor{animation:mb-spin 2s linear infinite!important;transform-box:fill-box;transform-origin:center}.mb-diagram.is-playing svg .mb-comm{animation:mb-spin 2s linear infinite reverse!important;transform-box:fill-box;transform-origin:center}
.mb-diagram svg .mb-comm{animation:none!important;transform-box:fill-box;transform-origin:center}.mb-diagram.is-playing svg .mb-comm{animation:mb-spin 2s linear infinite!important}.mb-diagram[data-type=brushless] svg .mb-comm,.mb-diagram[data-type=brushless] svg .mb-brush{display:none!important}.mb-diagram[data-type=brushless] svg .mb-stator{stroke:#82a7bd!important}.mb-transmission{height:auto!important;min-height:150px;display:block!important}.mb-transmission svg{display:block;width:100%;height:150px}.mb-transmission svg .mb-case{fill:#1d211f;stroke:#69716a;stroke-width:5}.mb-transmission svg .mb-shift-gear{fill:#d5d9d0;stroke:#111;stroke-width:5;transform-box:fill-box;transform-origin:center}.mb-transmission svg .mb-shift-gear circle{fill:#252a27;stroke:#e4c12e;stroke-width:5}.mb-transmission svg .mb-idler{stroke:#e4c12e;stroke-width:7;stroke-dasharray:5 7}.mb-transmission svg .mb-output-shaft{stroke:#9ca69e;stroke-width:11;stroke-linecap:round;transform-box:fill-box;transform-origin:left center}.mb-transmission svg text{fill:#d9ded4;font:700 10px var(--mono,monospace);letter-spacing:1px}.mb-transmission [data-input-gear],.mb-transmission [data-output-gear],.mb-transmission [data-output-shaft]{width:auto!important;height:auto!important;border:0!important;border-radius:0!important}.mb-transmission[data-gear=high] [data-output-gear]{transform:scale(.82)}.mb-transmission[data-gear=low] [data-output-gear]{transform:scale(1.08)}.mb-transmission.is-playing [data-input-gear]{animation:mb-spin 2s linear infinite!important}.mb-transmission.is-playing [data-output-gear]{animation:mb-spin var(--output-duration,4s) linear infinite!important;transform-box:fill-box;transform-origin:center}.mb-transmission.is-playing [data-output-shaft]{animation:mb-spin var(--output-duration,4s) linear infinite!important}
.mb-schematic[data-type=brushless] .mb-diagram svg .mb-comm,.mb-schematic[data-type=brushless] .mb-diagram svg .mb-brush{display:none!important}.mb-schematic[data-type=brushless] .mb-diagram svg .mb-stator{stroke:#82a7bd!important}.mb-schematic.is-playing .mb-diagram svg .mb-rotor,.mb-schematic.is-playing .mb-diagram svg .mb-comm{animation:mb-spin 2s linear infinite!important;transform-box:fill-box;transform-origin:center}.mb-schematic.is-playing .mb-diagram svg .mb-comm{animation-direction:normal!important}.mb-part-label{fill:#f4f1e7;font:700 10px var(--mono,monospace);letter-spacing:1px;text-anchor:middle;paint-order:stroke;stroke:#121513;stroke-width:3px}.mb-transmission svg{height:180px!important}.mb-transmission .mb-output-shaft{animation:none!important}
.mb-transmission svg{overflow:visible}.mb-transmission [data-output-shaft]{animation:none!important;transform:none!important}
.mb-transmission.is-playing svg [data-output-shaft]{animation:none!important;transform:none!important}
.mb-transmission[data-gear] svg [data-output-gear]{transform:none}
.mb-transmission[data-gear=high] svg [data-output-gear]{fill:#e4f064}
@media(prefers-reduced-motion:reduce){.mb-schematic.is-playing svg .mb-rotor,.mb-schematic.is-playing svg .mb-comm,.mb-transmission.is-playing svg [data-input-gear],.mb-transmission.is-playing svg [data-output-gear]{animation:none!important}}
