@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";*{box-sizing:border-box}:root{font-family:"Press Start 2P",cursive;color-scheme:dark}html,body,#root{height:100%}body{margin:0;background-color:#222;overflow:hidden;-webkit-user-select:none;user-select:none}.app{position:relative;width:100%;height:100%}.canvas-container{width:100%;height:100%;touch-action:none}#ui{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between}#header{padding:20px;display:flex;justify-content:space-between;color:#fff;text-shadow:3px 3px 0 #000;font-size:1.2rem;z-index:10;touch-action:none}#win-msg{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);text-align:center;color:gold;font-size:3rem;display:none;text-shadow:4px 4px 0 #000;z-index:20}#menu{position:absolute;display:none;pointer-events:auto;touch-action:auto;background:#000000e6;padding:10px;border:3px solid #fff;border-radius:8px;transform:translate(-50%,-50%);z-index:100}#op-preview{color:#ffed99;text-align:center;margin-bottom:12px;text-shadow:2px 2px 0 #000}#op-preview .preview-op{opacity:.9;transition:opacity .15s}.row{display:flex;gap:10px;margin-bottom:10px}.row:last-child{margin-bottom:0}.op{width:60px;height:60px;font-size:24px;font-family:inherit;border:3px solid #000;background:#fc0;color:#000;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:3px 3px #000;touch-action:manipulation}.op:hover{background:#ffed99;transform:scale(1.05)}.op:active{background:#e6b800;transform:scale(.95)}#controls{pointer-events:auto;touch-action:auto;text-align:center;padding-bottom:30px;z-index:10;color:#888;font-size:.7rem}.btn{background:#fff;border:4px solid #000;color:#000;padding:15px 25px;font-family:inherit;cursor:pointer;margin:0 10px;box-shadow:6px 6px #00000080;touch-action:manipulation}.btn:active{transform:translate(4px,4px);box-shadow:2px 2px #00000080}@media (max-width: 768px){#header{padding:10px;font-size:.6rem;text-shadow:2px 2px 0 #000;flex-wrap:wrap;gap:5px}#win-msg{font-size:2rem;text-shadow:3px 3px 0 #000}#controls{padding-bottom:15px;font-size:.5rem}.btn{padding:10px 15px;font-size:.6rem;margin:0 5px;border:3px solid #000;box-shadow:4px 4px #00000080}.btn:active{transform:translate(2px,2px);box-shadow:2px 2px #00000080}.op{width:50px;height:50px;font-size:20px}}@media (max-width: 480px){#header{padding:8px;font-size:.5rem;text-shadow:1px 1px 0 #000}#win-msg{font-size:1.5rem}#controls{padding-bottom:10px;font-size:.45rem}.btn{padding:8px 12px;font-size:.5rem;margin:0 3px}.op{width:45px;height:45px;font-size:18px}}