.dpad-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background-color:#000;padding:20px;position:relative}.dpad-label{color:#fff;font-size:24px;font-weight:700;margin-bottom:20px;font-family:Courier New,monospace;letter-spacing:1px;text-shadow:1px 1px 2px rgba(255,255,255,.3)}.dpad{display:flex;flex-direction:column;align-items:center;gap:8px}.dpad-row{display:flex;align-items:center;justify-content:center;gap:8px}.dpad-button.dpad-center{width:80px;height:80px;background-color:gray;border-radius:12px;border:none;flex-shrink:0}.dpad-button.dpad-center:hover:not(:disabled){background-color:#999;transform:scale(1.05);box-shadow:0 4px 12px #ffffff4d}.dpad-button.dpad-center:active:not(:disabled){transform:scale(.95)}.dpad-button{width:80px;height:80px;border-radius:50%;border:4px solid #808080;background-color:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;position:relative;flex-shrink:0}.dpad-button:before{content:"";position:absolute;width:72px;height:72px;border-radius:50%;z-index:-1}.dpad-button.up{background-color:#4caf50}.dpad-button.left{background-color:#f44336}.dpad-button.right{background-color:#ffeb3b}.dpad-button.down{background-color:#2196f3}.dpad-button:disabled{opacity:.5;cursor:not-allowed}.dpad-button:not(:disabled):hover{transform:scale(1.05);box-shadow:0 4px 12px #ffffff4d}.dpad-button:not(:disabled):active{transform:scale(.95)}.triangle{width:32px;height:32px;background:#fff;clip-path:polygon(50% 0%,0% 100%,100% 100%)}.triangle.up{transform:rotate(0)}.triangle.down{transform:rotate(180deg)}.triangle.left{transform:rotate(270deg)}.triangle.right{transform:rotate(90deg)}.message{margin-top:30px;padding:12px 24px;border-radius:8px;font-size:16px;font-weight:500;max-width:400px;text-align:center;animation:fadeIn .3s ease}.message.success{background-color:#4caf50;color:#fff}.message.error{background-color:#f44336;color:#fff}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){.dpad-button,.dpad-button.dpad-center{width:60px;height:60px}.triangle{width:26px;height:26px}.dpad-label{font-size:20px}}.custom-command-form{position:absolute;bottom:20px;left:20px;display:flex;gap:10px;align-items:center}.custom-input{padding:10px 15px;border:2px solid #808080;border-radius:8px;background-color:#1a1a1a;color:#fff;font-size:14px;min-width:200px;outline:none;transition:border-color .2s ease}.custom-input:focus{border-color:#4caf50}.custom-input:disabled{opacity:.5;cursor:not-allowed}.custom-input::placeholder{color:#666}.custom-button{padding:10px 20px;border:2px solid #4caf50;border-radius:8px;background-color:#4caf50;color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s ease}.custom-button:hover:not(:disabled){background-color:#45a049;border-color:#45a049;transform:translateY(-2px);box-shadow:0 4px 8px #4caf504d}.custom-button:active:not(:disabled){transform:translateY(0)}.custom-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.walle-button{padding:10px 20px;border:2px solid #ff9800;border-radius:8px;background-color:#ff9800;color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s ease}.walle-button:hover:not(:disabled){background-color:#f57c00;border-color:#f57c00;transform:translateY(-2px);box-shadow:0 4px 8px #ff98004d}.walle-button:active:not(:disabled){transform:translateY(0)}.walle-button:disabled{opacity:.5;cursor:not-allowed;transform:none}@media (max-width: 600px){.custom-command-form{bottom:10px;left:10px;right:10px;flex-direction:column;gap:8px}.custom-input{width:100%;min-width:auto}.custom-button,.walle-button{width:100%}}.App{width:100%;height:100vh}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}
