.card.has-art{display:grid;grid-template-columns:minmax(0,1fr) 15rem;column-gap:2rem;align-items:center}
.demo-art svg{display:block;width:100%;height:auto;overflow:visible}
@media (max-width:700px){.card.has-art{grid-template-columns:minmax(0,1fr)}
.card.has-art .demo-art{order:-1;width:100%;max-width:17rem;justify-self:center;margin-bottom:.9rem}}
.demo-art .ln{fill:none;stroke:#6b6b6b;stroke-width:1.4}.demo-art .ln.faint{stroke:#3a3a3a}
.demo-art .bd{fill:#0f0f0f}.demo-art .cab{fill:#1b1611}.demo-art .sc{fill:#080808}
.demo-art .br,.demo-art .acc{fill:var(--accent)}.demo-art .bs{fill:none;stroke:var(--accent);stroke-width:1.3;stroke-linecap:round}
.demo-art .mu{fill:#3d3d3d}.demo-art .tile{fill:#151515;stroke:#2e2e2e;stroke-width:.8}.demo-art .fig{fill:#4a4a4a}
.demo-art .rec{fill:#d0503c}.demo-art .hint{fill:#141210;stroke:#3a3024;stroke-width:1}
.demo-art .lbl{font:600 6.4px var(--font);letter-spacing:.06em;fill:#b9b2aa}.demo-art .lbl.dk{fill:#140d06}.demo-art .mu-tx{fill:#6d6d6d}
.demo-art .clock{font:600 20px ui-monospace,Menlo,Consolas,monospace;fill:var(--bright)}.demo-art .clock.sm{font-size:11px}
.demo-art .flow{stroke-dasharray:3 4;animation:art-flow .9s linear infinite}@keyframes art-flow{to{stroke-dashoffset:-14}}
.demo-art .packet{opacity:0;animation:art-packet 3.2s ease-in-out infinite}
@keyframes art-packet{0%{transform:translateX(0);opacity:0}8%{opacity:1}42%{transform:translateX(24px);opacity:1}50%,100%{transform:translateX(24px);opacity:0}}
.demo-art .hint{animation:art-hint 3.2s ease-in-out infinite}
@keyframes art-hint{0%,44%{stroke:#3a3024}50%,82%{stroke:var(--accent)}100%{stroke:#3a3024}}
.demo-art .send{animation:art-send 3.2s ease-in-out infinite}@keyframes art-send{0%,12%{opacity:.55}20%,100%{opacity:1}}
.demo-art .blink{animation:blink 1.2s steps(1) infinite}
.prop-scene .ln{fill:none;stroke:#6b6b6b;stroke-width:1.4}.prop-scene .bd{fill:#0f0f0f}.prop-scene .sc{fill:#080808}
.prop-scene .br{fill:var(--accent)}.prop-scene .live{fill:#d0503c}.prop-scene .knob-ln{display:none}
.prop-scene .blink{animation:blink 1.2s steps(1) infinite}@keyframes blink{50%{opacity:.15}}
.prop-scene .feed{fill:#1d1d1d}.prop-scene .feed-side{fill:#6c6c6c}.prop-scene .feed-prop{fill:#a9a9a9}
.prop-scene .feed-knob{fill:#d4d4d4}.prop-scene .feed-mark{fill:none;stroke:#7c7c7c;stroke-width:.6}
.prop-scene .feed-open{fill:#f4f4f4;opacity:0}
.prop-scene .rim{fill:#141414;stroke:#3a3a3a;stroke-width:1}.prop-scene .tickm{fill:var(--accent)}
.prop-scene .needle2{stroke:#d8d2c8;stroke-width:1.5;stroke-linecap:round}.prop-scene .hub2{fill:#d8d2c8}
.prop-scene .pr-side{fill:#8d6f4f}.prop-scene .pr-face{fill:#c2a27b}
.prop-scene .pr-pencil{fill:none;stroke:rgba(74,52,30,.42);stroke-width:.5}.prop-scene .pr-screw{fill:#54453a}
.prop-scene .pr-frame{fill:#a9895f}.prop-scene .pr-in{fill:url(#pa-red)}
.prop-scene .pr-floor-lit{fill:rgba(255,150,120,.12)}.prop-scene .pr-wall-dim{fill:rgba(25,0,0,.38)}
.prop-scene .pr-lock{fill:#262626}.prop-scene .pr-lock-side{fill:#121212}.prop-scene .pr-lamp{fill:#ffe0d4}
.prop-scene .pr-glow{fill:url(#pa-glow)}.prop-scene .pr-spill{fill:url(#pa-spill);opacity:0}
.prop-scene .pr-cable{stroke:#2b1d16;stroke-width:.8;stroke-linecap:round}
.prop-scene .pr-door-out{fill:#c2a27b;stroke:rgba(70,48,28,.45);stroke-width:.5}.prop-scene .pr-door-in{fill:url(#pa-inner)}
.prop-scene .pr-door-top{fill:#b8966b}.prop-scene .pr-door-end{fill:#8d6f4f}.prop-scene .pr-plate{fill:#8c8a86}
.prop-scene .pr-hole{fill:#1a110b}.prop-scene .pr-glint{fill:#fff;opacity:.7}
.prop-scene .pr-kshade{fill:rgba(40,24,10,.34)}.prop-scene .pr-kside{fill:#a7835b}
.prop-scene .pr-kface{fill:#d1b38b;stroke:rgba(90,62,35,.35);stroke-width:.4}