.cannon-card{border:1px solid var(--line);background:var(--surface);padding:22px;position:relative;min-width:0}.cannon-card::after{content:"";position:absolute;inset:10px -9px -9px 10px;border:1px solid var(--gold);z-index:-1}.cannon-card>.eyebrow{margin-bottom:18px}.cannon-paper{background:#eee8d6;background-image:radial-gradient(ellipse at 40% 30%,#fffdf280,transparent 70%);border:1px solid #c6b891;overflow:hidden}.texas-cannon-art{display:block;width:100%;height:auto;overflow:visible}.cannon-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:18px}.cannon-controls button{border:1px solid var(--line);border-radius:4px;background:var(--card);color:var(--ink);padding:9px 13px;min-height:44px;font-size:12px;cursor:pointer}.cannon-controls button:hover{border-color:var(--gold)}.cannon-controls button:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.cannon-note{font-size:11px;color:var(--muted);margin:12px 0 0}.cannon-card>.text-link{display:inline-block;margin-top:19px}.cannon-smoke,.cannon-flash{opacity:0;pointer-events:none}.cannon-carriage{transform-origin:285px 280px}.cannon-wheel{transform-box:view-box;transform-origin:304px 240px}.cannon-card.is-firing .cannon-carriage,.cannon-card.is-firing .cannon-flash-anchor{animation:cannon-recoil 3.8s ease-out both}.cannon-card.is-firing .cannon-wheel{animation:cannon-roll 3.8s ease-out both}.cannon-card.is-firing .cannon-flash{animation:cannon-flash 3.8s linear both}.cannon-card.is-firing .cannon-smoke{animation:cannon-smoke 3.8s ease-out both;transform-origin:498px 178px}.cannon-card.is-firing .cannon-smoke-far{animation-name:cannon-smoke-far}@keyframes cannon-recoil{0%,20%{transform:translateX(0)}24%{transform:translateX(-18px)}34%,100%{transform:translateX(-28px)}}@keyframes cannon-roll{0%,20%{transform:rotate(0)}24%{transform:rotate(-19.09859deg)}34%,100%{transform:rotate(-29.70892deg)}}@keyframes cannon-flash{0%,19.5%,25%,100%{opacity:0}20.5%{opacity:1}22%{opacity:.8}24%{opacity:.1}}@keyframes cannon-smoke{0%,20%{opacity:0;transform:translate(0,0) scale(.22)}25%{opacity:.9;transform:translate(0,0) scale(.85)}42%{opacity:.66;transform:translate(-6px,-10px) scale(1.25)}100%{opacity:0;transform:translate(-16px,-38px) scale(1.7)}}@keyframes cannon-smoke-far{0%,22%{opacity:0;transform:translate(0,0) scale(.3)}33%{opacity:.32}100%{opacity:0;transform:translate(8px,-62px) scale(1.35)}}@media(prefers-reduced-motion:reduce){.cannon-card *{animation:none!important;transition:none!important}.cannon-smoke,.cannon-flash{opacity:0!important}}@media(max-width:600px){.cannon-card{padding:17px}.cannon-controls{gap:8px}.cannon-controls button{font-size:12px;padding:9px 11px}}

.cannon-card.is-firing .cannon-letter-smoke{animation:cannon-letter-smoke 3.8s ease-out both;transform-origin:300px 345px}@keyframes cannon-letter-smoke{0%,25%{opacity:0;transform:translateY(0)}44%{opacity:.16}100%{opacity:0;transform:translate(18px,-26px)}}@media(prefers-reduced-motion:reduce){.cannon-letter-smoke{opacity:0!important}}

.cannon-card.has-fired .cannon-carriage,.cannon-card.has-fired .cannon-flash-anchor{transform:translateX(-28px)}.cannon-card.has-fired .cannon-wheel{transform:rotate(-29.70892deg)}.cannon-ruts,.cannon-dust{opacity:0}.cannon-card.has-fired .cannon-ruts{opacity:1}.cannon-card.is-firing .cannon-ruts{animation:cannon-ruts 3.8s linear both}.cannon-card.is-firing .cannon-dust{animation:cannon-dust 3.8s ease-out both;transform-origin:170px 294px}@keyframes cannon-ruts{0%,22%{opacity:0}34%,100%{opacity:1}}@keyframes cannon-dust{0%,22%{opacity:0;transform:translate(0,0)}29%{opacity:.3}70%,100%{opacity:0;transform:translate(-12px,-12px)}}@media(prefers-reduced-motion:reduce){.cannon-dust{opacity:0!important}}

.cannon-body-motion{transform-box:view-box;transform-origin:304px 240px}.cannon-card.has-fired .cannon-body-motion{transform:rotate(-2.2deg)}.cannon-card.is-firing .cannon-body-motion{animation:cannon-trail-pressure 3.8s ease-out both}.cannon-trail-lip{opacity:0}.cannon-card.has-fired .cannon-trail-lip{opacity:1}.cannon-card.is-firing .cannon-trail-lip{animation:cannon-ruts 3.8s linear both}@keyframes cannon-trail-pressure{0%,20%{transform:rotate(0)}24%{transform:rotate(-1.4deg)}34%,100%{transform:rotate(-2.2deg)}}
