.cp-stage{position:relative;border-radius:var(--radius-md);overflow:hidden}.cp-canvas{display:block;width:100%;height:auto;aspect-ratio:1;touch-action:none;background:#cfe6d3}.cp-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);min-width:9rem}.cp-play[hidden]{display:none}.cp-pad{display:grid;grid-template-columns:repeat(3,4rem);grid-template-areas:". up ." "left down right";gap:var(--space-2);justify-content:center;margin-top:var(--space-3)}.cp-pad .btn{min-height:3.25rem;font-size:1.4rem;touch-action:manipulation;user-select:none}.cp-up{grid-area:up}.cp-left{grid-area:left}.cp-down{grid-area:down}.cp-right{grid-area:right}@media (hover:hover) and (pointer:fine){.cp-pad{display:none}}