.oct-draw{--oct-card-width:300px;--oct-ink:#252c2d;--oct-gold:#b58343;box-sizing:border-box;max-width:100%;padding:0 12px;text-align:center;color:var(--oct-ink);isolation:isolate}
.oct-draw *{box-sizing:border-box}
.oct-draw-stage{position:relative;perspective:1400px;width:min(var(--oct-card-width),78vw,100%);margin:40px auto;aspect-ratio:355/538}
.oct-draw-card{display:block!important;position:relative;width:100%;height:100%;padding:0!important;border:0!important;background:transparent!important;cursor:pointer;transform-style:preserve-3d;border-radius:10px;touch-action:manipulation;-webkit-tap-highlight-color:transparent;overflow:visible!important;box-shadow:none!important}
.oct-draw-card:focus-visible{outline:3px solid var(--oct-gold)!important;outline-offset:9px}
.oct-draw-rotor{position:absolute;inset:0;display:block;transform-style:preserve-3d;will-change:transform}
.oct-draw-face{position:absolute;inset:0;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:10px;overflow:hidden;box-shadow:0 14px 26px #17202130,0 3px 5px #17202125;background:#252c2d}
.oct-draw-front{transform:rotateY(180deg)}
.oct-draw-face img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:contain;margin:0!important;padding:0!important;border:0!important;border-radius:0!important}
.oct-draw-halo{position:absolute;inset:8% -25%;z-index:-1;background:radial-gradient(ellipse,#d4ad6e55 0,transparent 67%);opacity:0;pointer-events:none}
.oct-draw-sparks{position:absolute;inset:0;pointer-events:none;z-index:2}
.oct-draw-spark{position:absolute;left:50%;top:50%;width:7px;height:7px;background:#c4934b;transform:rotate(45deg);border-radius:1px}
.oct-draw-status{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
@media(prefers-reduced-motion:reduce){.oct-draw-rotor{will-change:auto}}
