/* Method scenes inherit the existing dark cards and never replace their copy. */
#method .mx-controls{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:0 0 18px;color:#bcd3c7;font-size:12px}
#method .mx-toggle{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border:1px solid #5b9477;border-radius:999px;background:#142a1f;color:#d8f5e5;font:inherit;font-size:12px;cursor:pointer}
#method .mx-toggle:hover{background:#1d3b2c}
#method .mx-toggle:focus-visible{outline:2px solid #3ddc97;outline-offset:3px}
#method .mx-toggle svg{width:12px;height:12px;fill:currentColor}
#method .mx-play,#method .mx-toggle[aria-pressed="true"] .mx-pause{display:none}
#method .mx-toggle[aria-pressed="true"] .mx-play{display:block}
#method .method-ready .ic{display:none}
#method .method-scene{margin:18px auto 20px;width:100%;max-width:420px;border:1px solid #365b47;border-radius:12px;background:#0e1b15;overflow:hidden}
#method .method-scene svg{display:block;width:100%;height:auto;aspect-ratio:240/148}
#method .method-scene text{font-family:inherit;font-size:12px;font-weight:600;fill:#d8f5e5}
#method .mx-node{fill:#1b3427;stroke:#5b9477;stroke-width:1.2}
#method .mx-line{fill:none;stroke:#8abc9f;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
#method .mx-flow{fill:none;stroke:#73d8a4;stroke-width:1.5;stroke-dasharray:3 5;animation:mx-flow 2s linear infinite}
#method .mx-check{fill:none;stroke:#73d8a4;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;animation:mx-check 7s ease-in-out infinite;animation-delay:var(--mx-delay,0s)}
#method .mx-accent{fill:#29412b;stroke:#d7b867;stroke-width:1.2}
#method .mx-accent-text{fill:#f5d890}
#method .mx-stage{animation:mx-stage 7s ease-in-out infinite;animation-delay:var(--mx-delay,0s)}
#method .mx-build{fill:#367d58;animation:mx-build 7s ease-in-out infinite;transform-box:fill-box;transform-origin:left}
#method .method-scene [class*="mx-"]{animation-play-state:paused}
#method .method-visible .method-scene [class*="mx-"]{animation-play-state:running}
#method[data-motion-paused="true"] .method-scene [class*="mx-"],#method[data-motion-hidden="true"] .method-scene [class*="mx-"]{animation-play-state:paused}
@keyframes mx-flow{to{stroke-dashoffset:-32}}
@keyframes mx-check{0%,12%,100%{stroke-dashoffset:24}35%,85%{stroke-dashoffset:0}}
@keyframes mx-stage{0%,70%,100%{stroke:#5b9477;fill:#1b3427}25%,50%{stroke:#73d8a4;fill:#254c35}}
@keyframes mx-build{0%,100%{transform:scaleX(.35)}45%,80%{transform:scaleX(1)}}
@media(max-width:680px){#method .mx-controls{justify-content:space-between}}
@media(prefers-reduced-motion:reduce){#method .method-scene [class*="mx-"]{animation:none!important}#method .mx-toggle{display:none}}