.wc{border:1px solid #777;background:#222}.hud{min-height:54px;background:#efeee8;display:flex;align-items:center;justify-content:space-between;padding:8px 12px}.hud b{display:block;font:700 18px Arial}.hud small{display:block;color:#666;font-size:10px}.hud strong{display:block;text-align:right;color:#c73b2f;font:bold 18px Arial}.stage{height:520px;position:relative;background:#cfd4d8;overflow:hidden;touch-action:none}.stage canvas{width:100%;height:100%;display:block}.tip{position:absolute;left:14px;top:12px;background:#111c;color:#fff;padding:6px 8px;font:bold 10px Verdana}.mob,.touch{display:none}.controls{display:flex;gap:16px;align-items:center;padding:8px 10px;background:#2b2b2b;color:#aaa;font-size:10px}.controls button,.result button{background:#c73b2f;color:#fff;border:0;padding:9px 12px;font-weight:bold}.controls span:last-child{margin-left:auto}.result{position:absolute;inset:0;background:#111d;color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:8}.result.hidden{display:none}.result b{font:900 30px Arial}.result span{margin:8px 0 18px}.touch{position:absolute;left:0;right:0;bottom:14px;justify-content:center;gap:16px;z-index:6}.touch button{width:64px;height:64px;border-radius:50%;border:2px solid #fff8;background:#222d;color:#fff;font:bold 25px Arial;touch-action:none}.touch .pull{width:78px;height:78px;margin-top:-14px;background:#c73b2fe8;font-size:13px}@media(max-width:700px),(pointer:coarse){.stage{height:min(68vh,560px);min-height:390px}.touch{display:flex}.desk{display:none}.mob{display:inline}.controls span{display:none}}