.maze-map-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;max-height:100vh;padding:2vh 10px;background-color:#0d1117;color:#c9d1d9;overflow:auto;box-sizing:border-box;-webkit-overflow-scrolling:touch}.maze-map-container h2{font-size:min(2rem,6vw);margin:0 0 1vh;color:#58a6ff}.maze-map-container p{margin:0 0 1vh;font-size:min(1rem,4vw);color:#8b949e;text-align:center}.canvas-container{background-color:#161b22;border:1px solid #30363D;border-radius:6px;box-shadow:0 5px 15px #0000004d;padding:15px;margin-bottom:1vh;width:auto;height:70vh;overflow:auto;display:flex;justify-content:center;align-items:center}.maze-map-canvas{max-height:100%;max-width:100%;display:block;touch-action:pan-x pan-y}.start-game-btn-container{margin-top:1vh;width:100%;display:flex;justify-content:center}.start-game-btn{padding:10px 25px;font-size:min(1.2rem,5vw);background-color:#238636;color:#fff;border:none;border-radius:6px;cursor:pointer;transition:all .3s ease;box-shadow:0 3px 10px #0000004d}.start-game-btn:hover{background-color:#2ea043;transform:translateY(-2px);box-shadow:0 5px 15px #0006}.start-game-btn:active{transform:translateY(0);box-shadow:0 2px 5px #0000004d}.loading-message{font-size:min(1.2rem,5vw);color:#8b949e;padding:2rem;text-align:center}.maze-header{display:flex;flex-direction:column;align-items:center;position:relative;width:100%;margin-bottom:1vh;padding-top:1vh}.maze-header h3{font-size:min(1.2rem,4vw);margin:.5vh 0 1vh;color:#8b949e;text-align:center;padding:0 20px}.back-to-difficulty{position:absolute;left:20px;top:5px;padding:8px 12px;font-size:min(1rem,4vw);background-color:#1f6feb;color:#fff;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:5px}.back-to-difficulty:hover{background-color:#388bfd;transform:translateY(-2px);box-shadow:0 3px 8px #0003}.back-to-difficulty:active{transform:translateY(0);box-shadow:0 1px 3px #0003}@media (max-width: 768px){.maze-header{margin-top:40px}.back-to-difficulty{top:-30px;left:50%;transform:translate(-50%);padding:5px 10px;font-size:.9rem;width:80%;max-width:250px;z-index:10}.back-to-difficulty:hover{transform:translate(-50%) translateY(-2px)}.back-to-difficulty:active{transform:translate(-50%) translateY(0)}.maze-map-container h2{font-size:1.5rem;margin-top:5px}.maze-header h3{font-size:1rem;margin:0 0 10px}.canvas-container{height:60vh;padding:10px}.start-game-btn{padding:8px 20px;font-size:1.1rem;width:80%;max-width:250px}.credit-tag{position:relative;margin-top:15px;bottom:auto;right:auto}}@media (max-width: 320px){.maze-map-container h2{font-size:1.2rem}.maze-header h3{font-size:.9rem}.back-to-difficulty{font-size:.8rem;padding:4px 8px}.canvas-container{height:50vh;padding:8px}.start-game-btn{font-size:.9rem;padding:6px 15px}}@media (max-height: 500px) and (orientation: landscape){.maze-header{margin-top:0}.maze-map-container h2{font-size:1.2rem;margin:25px 0 0}.maze-header h3{font-size:.9rem;margin:0 0 5px}.back-to-difficulty{top:5px;left:5px;transform:none;padding:3px 6px;font-size:.8rem;max-width:150px}.back-to-difficulty:hover{transform:translateY(-2px)}.canvas-container{height:65vh;padding:5px}.start-game-btn-container{margin-top:5px}.start-game-btn{font-size:.9rem;padding:5px 15px}.canvas-container{margin-bottom:5px}}.difficulty-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;max-height:100vh;padding:2vh 20px;background-color:#0d1117;color:#c9d1d9;text-align:center;overflow-y:auto;box-sizing:border-box;-webkit-overflow-scrolling:touch}.github-logo{display:flex;flex-direction:column;align-items:center;margin-bottom:2vh}.logo-text{margin-top:.5vh;font-size:min(2.5rem,6vw);font-weight:700;color:#58a6ff;text-shadow:0 1px 3px rgba(0,0,0,.3)}.difficulty-container h1{font-size:2.5rem;margin-bottom:10px;color:#58a6ff}.difficulty-container h2{font-size:min(1.8rem,5vw);margin:1vh 0 2vh;color:#8b949e}.difficulty-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2vh 20px;margin-bottom:2vh;max-width:600px;width:90%}.difficulty-card{display:flex;flex-direction:column;align-items:center;padding:min(20px,3vh);background-color:#161b22;border:1px solid #30363D;border-radius:6px;box-shadow:0 4px 10px #0003;transition:all .3s ease;cursor:pointer;text-align:center}.difficulty-card:hover{transform:translateY(-5px);box-shadow:0 6px 15px #0000004d;border-color:#58a6ff}.difficulty-label{font-size:min(1.5rem,4vw);font-weight:700;margin-bottom:1vh;color:#c9d1d9}.difficulty-description{display:flex;flex-direction:column;font-size:min(1rem,3.5vw);color:#8b949e}.maze-size{font-weight:700;font-size:min(1.2rem,3.5vw);margin-bottom:.5vh}.maze-cells{font-size:min(.9rem,3vw)}.game-description{max-width:600px;line-height:1.6;margin:2vh 0;padding:0 10px;color:#8b949e;font-size:min(1rem,3.5vw)}.difficulty-card:nth-child(1){border-top:5px solid #3FB950}.difficulty-card:nth-child(2){border-top:5px solid #58A6FF}.difficulty-card:nth-child(3){border-top:5px solid #F0883E}.difficulty-card:nth-child(4){border-top:5px solid #F85149}.credit-tag{position:fixed;bottom:10px;right:10px;font-size:min(.8rem,3vw);color:#8b949e;text-decoration:none;padding:5px 8px;background-color:#161b22;border:1px solid #30363D;border-radius:6px;transition:all .2s ease;z-index:10}.credit-tag:hover{background-color:#1f2937;color:#58a6ff;transform:translateY(-2px);box-shadow:0 2px 5px #0000001a;border-color:#58a6ff}@media (max-width: 600px){.difficulty-grid{grid-template-columns:1fr;gap:15px;width:100%;max-width:320px}.difficulty-container{padding:2vh 15px;justify-content:flex-start}.github-logo svg{width:50px;height:50px}.logo-text{font-size:1.8rem;margin-top:.2vh}.difficulty-container h2{font-size:1.5rem;margin:.5vh 0 1.5vh}.difficulty-card{padding:15px}.difficulty-label{font-size:1.3rem;margin-bottom:5px}.maze-size{font-size:1.1rem}.maze-cells{font-size:.9rem}.game-description{font-size:.9rem;padding:0 5px;margin:15px 0}.credit-tag{position:relative;margin-top:15px;bottom:auto;right:auto}}@media (max-width: 320px){.difficulty-card{padding:10px}.difficulty-label{font-size:1.1rem}.maze-size{font-size:.9rem}.maze-cells{font-size:.8rem}}@media (max-height: 500px) and (orientation: landscape){.difficulty-container{padding:1vh 10px}.difficulty-grid{grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:1vh}.github-logo svg{width:40px;height:40px}.logo-text{font-size:1.5rem;margin-top:0}.difficulty-container h2{font-size:1.2rem;margin:.5vh 0 1vh}.difficulty-card{padding:8px}.difficulty-label{font-size:1rem;margin-bottom:2px}.maze-size{font-size:.9rem}.maze-cells{font-size:.8rem}.game-description{font-size:.8rem;margin:5px 0}}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;padding:0;overflow:hidden;width:100vw;height:100vh}h1{font-size:3.2em;line-height:1.1}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.vanilla:hover{filter:drop-shadow(0 0 2em #f7df1eaa)}.card{padding:2em}.read-the-docs{color:#888}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.hidden{display:none!important}#win-popup{z-index:1000;position:fixed;top:0;left:0;right:0;bottom:0;display:none}#win-popup.flex{display:flex!important}.win-popup{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.popup-content{background-color:#000;color:#58a6ff;padding:2rem;border-radius:10px;text-align:center}.popup-content h2{margin-bottom:1rem}.popup-content button{margin:.5rem;padding:.5rem 1rem;font-size:1rem;cursor:pointer;border:none;border-radius:5px;color:#fff;transition:all .2s ease}.popup-content button:hover{transform:translateY(-2px);box-shadow:0 3px 8px #0003}.popup-content button:active{transform:translateY(0)}.popup-content button:nth-child(2){background-color:#f44336}.popup-content button:nth-child(2):hover{background-color:#d32f2f}.popup-content button:nth-child(3){background-color:#2196f3}.popup-content button:nth-child(3):hover{background-color:#1976d2}.popup-content button:nth-child(4){background-color:#4caf50}.popup-content button:nth-child(4):hover{background-color:#388e3c}.game-container{width:100%;height:100%;position:relative;overflow:hidden}#canvas{position:absolute;top:0;left:0;width:100%;height:100%}.virtual-controls{position:fixed;bottom:20px;right:20px;display:grid;grid-template-areas:".    up   ." "left down right";grid-gap:10px;z-index:100;opacity:.7;transition:opacity .3s}.virtual-controls:hover{opacity:1}.control-btn{width:60px;height:60px;background-color:#fff3;border:2px solid rgba(255,255,255,.5);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;position:relative}.key-label{position:absolute;bottom:-18px;font-size:12px;font-weight:700;color:#fff;background-color:#00000080;padding:2px 5px;border-radius:4px;pointer-events:none}.control-btn:hover{background-color:#ffffff4d}.control-btn.active{background-color:#ffffff80;box-shadow:0 0 15px #ffffffb3;transform:scale(1.1)}.up-btn{grid-area:up}.down-btn{grid-area:down}.left-btn{grid-area:left}.right-btn{grid-area:right}.arrow{width:0;height:0;border-style:solid}.arrow-up{border-width:0 15px 20px 15px;border-color:transparent transparent white transparent}.arrow-down{border-width:20px 15px 0 15px;border-color:white transparent transparent transparent}.arrow-left{border-width:15px 20px 15px 0;border-color:transparent white transparent transparent}.arrow-right{border-width:15px 0 15px 20px;border-color:transparent transparent transparent white}.back-button{position:fixed;top:20px;left:20px;z-index:100}.start-position-button{position:fixed;top:90px;left:20px;z-index:100}.start-icon{width:20px;height:20px;border-radius:50%;background-color:#4040ff;position:relative}.start-icon:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%;background-color:#fff}.map-button{position:fixed;top:160px;left:20px;z-index:100}.map-icon{width:20px;height:20px;position:relative;border:2px solid white;border-radius:2px}.map-icon:before,.map-icon:after{content:"";position:absolute;background-color:#fff}.map-icon:before{height:2px;width:14px;top:9px;left:3px}.map-icon:after{height:14px;width:2px;left:9px;top:3px}.minimap-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.minimap-container{background-color:#0d1117;border:1px solid #30363D;border-radius:8px;padding:20px;max-width:90vw;max-height:90vh;position:relative;overflow:auto;display:flex;flex-direction:column;align-items:center}.minimap-close-btn{position:absolute;top:10px;right:10px;background:none;border:none;color:#8b949e;font-size:24px;cursor:pointer;padding:0;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center}.minimap-close-btn:hover{background-color:#ffffff1a;color:#fff}.minimap-title{color:#58a6ff;margin-top:0;margin-bottom:15px}.minimap-canvas{display:block;max-width:100%;max-height:70vh;margin-bottom:15px}.minimap-legend{display:flex;justify-content:center;gap:20px;margin-top:10px}.legend-item{display:flex;align-items:center;gap:5px;color:#c9d1d9}.legend-color{width:15px;height:15px;border-radius:50%;display:inline-block}.start-color{background-color:#4040ff}.player-color{background-color:#f0883e}.exit-color{background-color:#ff4040}.confirmation-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.confirmation-container{background-color:#0d1117;border:10px solid #30363D;border-radius:8px;padding:20px;max-width:90%;width:400px;text-align:center}.confirmation-title{color:#68a7f0;margin-top:0;margin-bottom:15px;font-size:1.4rem}.confirmation-message{color:#c9d1d9;margin-bottom:20px;line-height:1.5}.confirmation-buttons{display:flex;justify-content:center;gap:15px}.confirmation-button{padding:10px 15px;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:all .2s ease}.confirmation-button.confirm{background-color:#238636;color:#fff}.confirmation-button.confirm:hover{background-color:#2ea043;transform:translateY(-2px)}.confirmation-button.cancel{background-color:#21262d;color:#c9d1d9;border:1px solid #30363D}.confirmation-button.cancel:hover{background-color:#30363d;transform:translateY(-2px)}.instruction-popup{position:fixed;top:10%;left:50%;transform:translate(-50%);background-color:#0d1117d9;border:1px solid #30363D;border-radius:8px;padding:15px 20px;color:#fff;text-align:center;z-index:1000;box-shadow:0 5px 15px #0000004d;max-width:300px;pointer-events:none;opacity:0;transition:opacity .5s ease}.instruction-popup.visible{opacity:1}.instruction-popup .icon{font-size:24px;margin-bottom:10px;color:#58a6ff}.instruction-popup .title{font-weight:700;font-size:18px;margin-bottom:8px;color:#58a6ff}.instruction-popup .message{font-size:14px;line-height:1.4}@media (max-width: 768px){.virtual-controls{opacity:.9;bottom:30px;right:auto;display:block;width:100%}.vertical-controls{position:fixed;bottom:30px;right:30px;display:flex;flex-direction:column;gap:15px;z-index:101}.horizontal-controls{position:fixed;bottom:30px;left:30px;display:flex;flex-direction:row;gap:15px;z-index:101}.control-btn{width:70px;height:70px;margin:0}.up-btn,.down-btn,.left-btn,.right-btn{position:static;grid-area:unset;pointer-events:auto}.start-position-button{top:100px}.map-button{top:170px}.control-btn{background-color:#ffffff4d;box-shadow:0 4px 8px #0000004d}.control-btn.active{background-color:#fff9;box-shadow:0 4px 12px #ffffff80}.arrow{transform:scale(1.2)}.instruction-popup{max-width:260px;padding:12px 15px;top:20px}}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
