:root{font-family:Inter,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}*{margin:0;padding:0;box-sizing:border-box}body,html{width:100%;height:100%;overflow:hidden}#app{width:100%;height:100%;display:block}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;color:#fff;font-size:1.2rem}.loading-bar{width:50%;height:20px;background-color:#333;border-radius:10px;margin-top:20px;overflow:hidden}.loading-progress{height:100%;background-color:#4285f4;width:0%;transition:width .3s ease}.welcome-screen-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000d9;display:flex;align-items:center;justify-content:center;z-index:2000;opacity:0;transition:opacity .5s ease}.welcome-screen-overlay.visible{opacity:1}.welcome-screen-content{background-color:#222;border-radius:10px;box-shadow:0 5px 25px #00000080;padding:25px;width:90%;max-width:450px;text-align:center;color:#fff}.welcome-screen-content h1{color:#4285f4;margin-bottom:15px;font-size:28px}.welcome-screen-content p{margin-bottom:20px;font-size:16px;line-height:1.5}.welcome-form{display:flex;flex-direction:column;gap:20px}.welcome-form input{padding:12px;border-radius:6px;border:1px solid #444;background-color:#333;color:#fff;font-size:16px}.welcome-form input:focus{outline:none;border-color:#4285f4;box-shadow:0 0 0 2px #4285f433}.welcome-start-button{padding:12px;background-color:#4285f4;color:#fff;border:none;border-radius:6px;font-size:16px;cursor:pointer;transition:background-color .2s}.welcome-start-button:hover{background-color:#356ac3}.color-selection{text-align:left}.color-options{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;justify-content:center}.color-option{width:30px;height:30px;border-radius:50%;cursor:pointer;transition:transform .2s,box-shadow .2s;border:2px solid #444}.color-option:hover{transform:scale(1.1)}.color-option.selected{border:2px solid #fff;box-shadow:0 0 0 2px #4285f4}.ui-controls{position:absolute;top:20px;right:20px;background-color:#000000b3;padding:15px;border-radius:8px;color:#fff;z-index:100;min-width:200px;max-height:calc(100vh - 40px);overflow-y:auto;transition:transform .3s ease;min-height:50px}.ui-controls.collapsed{transform:translate(calc(100% - 30px))}.ui-controls.collapsed>*:not(#hamburger-menu){display:none}.hamburger-menu{position:absolute;top:10px;left:10px;width:30px;height:30px;background-color:#00000080;border-radius:4px;display:flex;flex-direction:column;justify-content:space-around;align-items:center;padding:5px;cursor:pointer;z-index:101}.hamburger-line{width:20px;height:2px;background-color:#fff;transition:transform .3s ease}.hamburger-menu .hamburger-line:nth-child(1){transform:translateY(6px) rotate(45deg)}.hamburger-menu .hamburger-line:nth-child(2){opacity:0}.hamburger-menu .hamburger-line:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.ui-controls.collapsed .hamburger-menu .hamburger-line:nth-child(1){transform:translateY(0) rotate(0)}.ui-controls.collapsed .hamburger-menu .hamburger-line:nth-child(2){opacity:1}.ui-controls.collapsed .hamburger-menu .hamburger-line:nth-child(3){transform:translateY(0) rotate(0)}.ui-controls h3{margin-bottom:10px;color:#4285f4}.ui-controls h4{margin:10px 0 5px;color:#4285f4}.collapsible-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.2);margin-bottom:8px}.collapsible-header:hover{background-color:#ffffff1a}.collapsible-header h4{margin:0}.collapse-icon{transition:transform .3s ease}.collapsed .collapse-icon{transform:rotate(-90deg)}.collapsible-content{overflow:hidden;max-height:1000px;transition:max-height .3s ease-in-out}.collapsed .collapsible-content{max-height:0}#score{font-size:1.2rem;font-weight:700;margin-bottom:10px}.controls-info{border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2);padding:10px 0;margin:10px 0}.controls-info p{margin:3px 0;font-size:.9rem}.location-selector{margin-top:10px}.ui-controls input,.ui-controls button{margin:5px 0;padding:8px;width:100%}.ui-controls button{background-color:#4285f4;border:none;color:#fff;cursor:pointer;border-radius:4px;margin-top:10px}.ui-controls button:hover{background-color:#2b5797}.harbor-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}.harbor-btn{margin:2px 0!important;padding:6px 4px!important;font-size:.85rem;background-color:#3a7bd5}.harbor-btn:hover{background-color:#2a5ca3}.quick-harbors{border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:10px}.minimap{position:absolute;bottom:20px;left:20px;width:250px;height:250px;border-radius:8px;overflow:hidden;z-index:100;border:3px solid rgba(255,255,255,.3);box-shadow:0 4px 6px #0000004d;transition:transform .3s ease,width .3s ease,height .3s ease}.minimap.minimized{// transform: translateY(calc(100% - 40px));height:40px;width:40px}.minimap.minimized .leaflet-control-zoom{display:none}.minimap-toggle{position:absolute;top:0;right:0;background-color:#00000080;color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1000;font-weight:700;font-size:14px;-webkit-user-select:none;user-select:none}.joystick-container{position:fixed;bottom:50px;left:50%;transform:translate(-50%);width:160px;height:160px;z-index:500;pointer-events:none}.joystick-base{position:relative;width:100%;height:100%;background-color:#0000004d;border-radius:50%;border:2px solid rgba(255,255,255,.3);pointer-events:auto}.joystick-knob{position:absolute;width:50%;height:50%;background-color:#ffffff80;border-radius:50%;border:2px solid rgba(255,255,255,.8);top:25%;left:25%;transform:translate(0);transition:transform .1s ease;pointer-events:none}.joystick-container.debug-mode{border:2px dashed rgba(255,255,0,.5)}.joystick-container[data-mode]:before{content:attr(data-mode);position:absolute;top:-25px;left:0;width:100%;text-align:center;color:#ff0;font-size:12px}.radar-container{position:absolute;bottom:290px;left:20px;width:120px;height:120px;z-index:100;border-radius:50%;background-color:#00000080;border:2px solid rgba(0,204,102,.7);overflow:hidden;box-shadow:0 0 10px #0c66;box-sizing:content-box}.debug-controls{margin-top:15px;border-top:1px solid rgba(255,255,255,.2);padding-top:10px}#debug-features{margin:8px 0;padding:8px;background-color:#4285f44d;border-radius:4px;font-size:.85rem}#debug-features p{margin:2px 0;color:#fff}#debug-info{margin:8px 0;padding:8px;background-color:#00000080;border-radius:4px;font-family:monospace;font-size:.85rem}.debug-controls input[type=checkbox]{margin-right:5px;width:auto}.game-message{position:fixed;bottom:30px;left:50%;transform:translate(-50%);background-color:#000000b3;color:#fff;padding:10px 20px;border-radius:8px;font-size:1.2rem;text-align:center;z-index:100;transition:opacity .3s ease;animation:fadeInOut .5s ease-in-out}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.position-menu{position:absolute;top:20px;left:20px;background-color:#000000b3;color:#fff;padding:8px;border-radius:8px;z-index:100;display:flex;flex-direction:column;gap:5px;box-shadow:0 2px 5px #0000004d;max-width:110px}.position-menu h4{margin:0 0 5px;text-align:center;color:#4285f4;font-size:14px}.position-button-container{display:flex;gap:5px;justify-content:space-between}.position-menu button{background-color:#4285f4;border:none;color:#fff;border-radius:4px;cursor:pointer;font-size:12px;width:auto;padding:6px 8px;display:flex;align-items:center;justify-content:center}.position-menu button i{font-size:16px}.position-menu button:hover{background-color:#2b5797}#load-position-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.player-info{position:absolute;top:20px;left:140px;background-color:#000000b3;color:#fff;padding:8px 12px;border-radius:8px;z-index:100;box-shadow:0 2px 5px #0000004d;display:flex;align-items:center;gap:10px}.player-avatar{width:24px;height:24px;border-radius:50%;background-color:#3a7bd5;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff}.player-name{font-size:14px;font-weight:500}@media (max-width: 768px){.minimap{width:180px;height:180px}.ui-controls{min-width:160px}.position-menu{max-width:100px}.joystick-container{bottom:30px;width:140px;height:140px}}@media (max-width: 480px){.minimap{width:150px;height:150px}.position-menu{padding:5px;gap:3px}.position-menu button{padding:4px 6px}.joystick-container{width:120px;height:120px}}