body,html{margin:0;padding:0;background:#13131c}#app,body,html{width:100%;height:100%}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;touch-action:none;-ms-touch-action:none}.logo{width:100%;position:absolute;bottom:0}canvas{touch-action-delay:none;touch-action:none;-ms-touch-action:none}.loading-spinner{display:inline-block;width:50px;height:50px;border-radius:50%;border:3px solid hsla(0,0%,100%,.3);border-top-color:#fff;animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(1turn)}}.menu-container{transition:all .3s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(29,29,42,.85);box-shadow:0 4px 24px rgba(0,0,0,.2)}.menu-container.landscape{padding:20px 15px;gap:15px}.menu-container.landscape>div{width:100%;text-align:center}.menu-container.portrait{padding:12px 20px;gap:12px}.menu-button{padding:10px 16px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;border:none;outline:none}.menu-button:hover{transform:translateY(-1px);filter:brightness(1.1)}.menu-button:active{transform:translateY(1px)}.header-button{padding:10px 16px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;border:none;outline:none;background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.header-button:hover{transform:translateY(-1px);filter:brightness(1.1)}.header-button:active{transform:translateY(1px)}.connect-button{padding:10px 16px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;border:none;outline:none;background:linear-gradient(135deg,#816cf9,#816cf9);color:#fff}.connect-button:hover{transform:translateY(-1px);filter:brightness(1.1)}.connect-button:active{transform:translateY(1px)}.disconnect-button{padding:10px 16px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;border:none;outline:none;background:linear-gradient(135deg,#f44336,#e53935);color:#fff}.disconnect-button:hover{transform:translateY(-1px);filter:brightness(1.1)}.disconnect-button:active{transform:translateY(1px)}.rank-button{padding:10px 16px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;border:none;outline:none;background:linear-gradient(135deg,#9c27b0,#8e24aa);color:#fff}.rank-button:hover{transform:translateY(-1px);filter:brightness(1.1)}.rank-button:active{transform:translateY(1px)}.token-button{padding:10px 16px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;border:none;outline:none;background:#1c2035;display:flex;align-items:center;justify-content:center;gap:5px}.token-button:hover{transform:translateY(-1px);filter:brightness(1.1)}.token-button:active{transform:translateY(1px)}.token-button div{background-image:linear-gradient(245.22deg,#ff2fc8 7.97%,#ffb12b 49.17%,#d3d839 92.1%);color:transparent;-webkit-background-clip:text;background-clip:text}.wallet-info{padding:10px 16px;border-radius:8px;background:hsla(0,0%,100%,.1);color:#fff;font-size:14px;text-align:center}@media (max-width:480px){.menu-button{padding:8px 12px;font-size:13px}.menu-container.portrait{padding:10px 15px;gap:8px}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-container{animation:fadeIn .3s ease}