:root{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:#0d1117;color:#c9d1d9}body,html,#root{margin:0;height:100%}.layout{display:flex;flex-direction:column;width:100vw;height:100vh;overflow:hidden;background:#0d1117}.layout.auth-layout{position:relative}.auth-background{position:absolute;top:0;left:0;width:100%;height:100%;background:#0d1117;z-index:0}.menu-bar{height:35px;background:#181818;border-bottom:1px solid #2b2b2b;display:flex;align-items:center;justify-content:space-between;padding:0;-webkit-user-select:none;user-select:none;z-index:1000;flex-shrink:0}.menu-bar-left{display:flex;align-items:center;height:100%}.menu-bar-center{flex:1;text-align:center}.app-title{font-size:12px;color:#9d9d9d;font-weight:400;letter-spacing:.5px}.menu-bar-right{display:flex;align-items:center;height:100%;padding-right:8px}.menu-item{position:relative;height:100%;display:flex;align-items:center}.menu-title{padding:0 12px;height:100%;display:flex;align-items:center;font-size:13px;color:#ccc;cursor:default;transition:background-color .1s ease}.menu-title:hover,.menu-title.active{background:#2a2a2a}.menu-dropdown{position:absolute;top:100%;left:0;min-width:220px;background:#252526;border:1px solid #454545;box-shadow:0 2px 8px #00000080;z-index:2000;padding:4px 0}.menu-section{padding:0}.menu-separator{height:1px;background:#454545;margin:4px 0}.menu-option{padding:5px 20px 5px 8px;font-size:13px;color:#ccc;cursor:default;transition:background-color .1s ease;display:flex;align-items:center;gap:6px;white-space:nowrap}.menu-option:hover{background:#2a2d2e;color:#fff}.menu-checkbox{width:20px;text-align:center;color:#ccc;font-size:11px;flex-shrink:0}.workspace{flex:1;display:flex;overflow:hidden;position:relative}.panel{background:#0d1117;border-right:1px solid #30363d;display:flex;flex-direction:column;transition:width .2s ease;position:relative;flex-shrink:0;z-index:100}.panel-right{border-right:none;border-left:1px solid #30363d}.panel.collapsed{width:40px!important;min-width:40px}.panel-header{height:35px;background:#161b22;border-bottom:1px solid #30363d;display:flex;align-items:center;padding:0 8px;gap:8px;flex-shrink:0}.panel-collapse-btn,.panel-close-btn{background:transparent;border:none;color:#8b949e;font-size:14px;cursor:pointer;padding:4px 6px;border-radius:4px;transition:all .15s ease;width:24px;height:24px;display:flex;align-items:center;justify-content:center;box-shadow:none}.panel-collapse-btn:hover,.panel-close-btn:hover{background:#21262d;color:#c9d1d9;transform:none;box-shadow:none}.panel-title{flex:1;font-size:13px;font-weight:600;color:#c9d1d9}.panel-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:12px;display:flex;flex-direction:column;gap:12px}.panel-content{scrollbar-width:thin;scrollbar-color:#484f58 #0d1117}.panel-content::-webkit-scrollbar{width:8px}.panel-content::-webkit-scrollbar-track{background:#0d1117}.panel-content::-webkit-scrollbar-thumb{background:#484f58;border-radius:4px}.panel-content::-webkit-scrollbar-thumb:hover{background:#6e7681}.panel-resize-handle{position:absolute;top:0;bottom:0;width:4px;cursor:col-resize;z-index:10}.panel-resize-left{right:-2px}.panel-resize-right{left:-2px}.panel-resize-handle:hover{background:#58a6ff}.map-panel{flex:1;position:relative;background:#0d1117;overflow:hidden}.sidebar{position:absolute;top:0;right:0;width:400px;max-width:90vw;height:100%;background:transparent;padding:12px;display:flex;flex-direction:column;gap:12px;overflow-y:auto;pointer-events:none;z-index:50}.sidebar>*{pointer-events:auto}.sidebar{scrollbar-width:thin;scrollbar-color:#484f58 transparent}.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:#484f58;border-radius:4px}.sidebar::-webkit-scrollbar-thumb:hover{background:#6e7681}.card{background:linear-gradient(135deg,#161b22,#0d1117);border:2px solid #30363d;border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 8px 32px #0009}.collapsible-card{padding:0;overflow:hidden}.card-header{padding:16px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s ease}.card-header:hover{background:#30363d4d}.card-header h3{margin:0}.collapse-icon{color:#8b949e;font-size:14px;transition:transform .2s ease}.card-body{padding:0 16px 16px;display:flex;flex-direction:column;gap:12px}.card h3{margin:0 0 8px;color:#58a6ff;font-size:18px;text-shadow:0 0 10px rgba(88,166,255,.3)}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0}.row strong{color:#58a6ff;font-weight:600}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}button{background:linear-gradient(135deg,#238636,#2ea043);color:#fff;border:1px solid #2ea043;border-radius:8px;padding:10px 16px;cursor:pointer;font-weight:600;box-shadow:0 4px 12px #23863666;transition:all .2s ease}button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #23863699}button.secondary{background:linear-gradient(135deg,#30363d,#21262d);border-color:#30363d;box-shadow:0 4px 12px #30363d66}button.secondary:hover:not(:disabled){box-shadow:0 6px 20px #30363d99}button:disabled{opacity:.6;cursor:not-allowed}input{background:#0d1117;border:2px solid #30363d;color:#c9d1d9;padding:12px;border-radius:8px;font-size:14px;transition:border-color .2s ease}input:focus{outline:none;border-color:#58a6ff;box-shadow:0 0 0 3px #58a6ff1a}select{background:#0d1117;border:2px solid #30363d;color:#c9d1d9;padding:12px;border-radius:8px;cursor:pointer;font-size:14px;transition:border-color .2s ease}select:focus{outline:none;border-color:#58a6ff;box-shadow:0 0 0 3px #58a6ff1a}.canvas{width:100%;height:100%;display:block;cursor:crosshair}.phaser-game{width:100%;height:100%;display:block}.phaser-game canvas{display:block;cursor:crosshair}.info-row{position:absolute;bottom:16px;left:16px;padding:12px 16px;background:linear-gradient(135deg,#161b22f2,#0d1117f2);border:2px solid #30363d;border-radius:8px;color:#8b949e;font-size:13px;box-shadow:0 4px 16px #0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.music-control-container{position:absolute;bottom:16px;right:16px;z-index:1000;display:flex;flex-direction:column;align-items:center}.music-toggle{width:48px;height:48px;background:linear-gradient(135deg,#161b22f2,#0d1117f2);border:2px solid #30363d;border-radius:50%;font-size:20px;cursor:pointer;box-shadow:0 4px 16px #0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:all .2s ease;display:flex;align-items:center;justify-content:center}.music-toggle:hover{background:linear-gradient(135deg,#1e232cf2,#161b22f2);border-color:#58a6ff;transform:scale(1.05);box-shadow:0 6px 20px #58a6ff4d}.music-toggle:active{transform:scale(.95)}.volume-slider-container{display:flex;flex-direction:column;align-items:center;margin-bottom:8px;background:linear-gradient(135deg,#161b22f2,#0d1117f2);border:2px solid #30363d;border-radius:12px;padding:12px 8px;box-shadow:0 4px 16px #0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.volume-slider{-webkit-appearance:slider-vertical;width:8px;height:120px;background:linear-gradient(to top,#30363d,#58a6ff);border-radius:4px;outline:none;cursor:pointer;margin-bottom:8px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#58a6ff;cursor:pointer;border:2px solid #1f6feb;box-shadow:0 2px 8px #58a6ff80;transition:all .2s ease}.volume-slider::-webkit-slider-thumb:hover{background:#79c0ff;transform:scale(1.1);box-shadow:0 3px 12px #58a6ffb3}.volume-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#58a6ff;cursor:pointer;border:2px solid #1f6feb;box-shadow:0 2px 8px #58a6ff80;transition:all .2s ease}.volume-slider::-moz-range-thumb:hover{background:#79c0ff;transform:scale(1.1);box-shadow:0 3px 12px #58a6ffb3}.volume-label{font-size:12px;color:#c9d1d9;font-weight:500;text-align:center;min-width:40px}.minimap-container{position:absolute;bottom:60px;left:16px;width:200px;height:200px;background:linear-gradient(135deg,#161b22f2,#0d1117f2);border:2px solid #30363d;border-radius:12px;padding:8px;box-shadow:0 8px 32px #0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:500}.minimap-container canvas{width:100%;height:100%;display:block}.minimap-close-btn{position:absolute;top:4px;right:4px;background:#161b22e6;border:1px solid #30363d;color:#8b949e;font-size:14px;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .15s ease;width:20px;height:20px;display:flex;align-items:center;justify-content:center;box-shadow:none;z-index:10}.minimap-close-btn:hover{background:#21262d;color:#c9d1d9;border-color:#58a6ff;transform:none;box-shadow:none}.status-bar{height:24px;background:#161b22;border-top:1px solid #30363d;display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-size:12px;color:#8b949e;-webkit-user-select:none;user-select:none;flex-shrink:0;z-index:1000}.status-bar-left,.status-bar-right{display:flex;gap:16px;align-items:center}.status-item{display:flex;align-items:center;gap:6px}.status-icon{font-size:10px}.status-success{color:#3fb950}.status-error{color:#f85149}.status-info{color:#58a6ff}.info-row{display:none}.error{color:#f85149;text-shadow:0 0 10px rgba(248,81,73,.5);font-weight:500}border: 2px solid #30363d; border-radius: 10px; padding: 12px; cursor: pointer; background: linear-gradient(135deg,#161b22 0%,#0d1117 100%); transition: all .2s ease; box-shadow: 0 2px 8px rgba(0,0,0,.3); } .pill:hover{border-color:#58a6ff;transform:translateY(-2px);box-shadow:0 4px 16px #58a6ff4d}.pill.selected{border-color:#2ea043;background:linear-gradient(135deg,#23863633,#2ea0431a);box-shadow:0 0 20px #2ea04366}.pill-title{font-weight:600;color:#c9d1d9;font-size:14px}.pill-body{color:#8b949e;font-size:13px;margin-top:4px}.auth-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:1000}.auth-card{background:linear-gradient(135deg,#161b22d9,#0d1117d9);border:2px solid rgba(48,54,61,.9);border-radius:12px;padding:32px;width:380px;box-shadow:0 8px 32px #0009;display:flex;flex-direction:column;gap:16px}.auth-card form{display:flex;flex-direction:column;gap:16px}.auth-card h1{margin:0 0 8px;color:#58a6ff;text-align:center;font-size:32px;text-shadow:0 0 20px rgba(88,166,255,.5)}.tagline{margin:0 0 16px;text-align:center;color:#8b949e;font-size:14px}.auth-footer{margin-top:16px;text-align:center;color:#8b949e;font-size:14px}.auth-link{color:#58a6ff;cursor:pointer;text-decoration:none}.auth-link:hover{text-decoration:underline}.verify-message{margin:0 0 16px;text-align:center;color:#c9d1d9;font-size:14px;line-height:1.5}.dialog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.dialog{background:linear-gradient(135deg,#161b22,#0d1117);border:2px solid #30363d;border-radius:12px;width:500px;max-width:90vw;max-height:80vh;overflow:auto;box-shadow:0 16px 48px #000c;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:2px solid #30363d}.dialog-header h3{margin:0;color:#58a6ff;font-size:20px;text-shadow:0 0 10px rgba(88,166,255,.3)}.close-btn{background:transparent;border:none;color:#8b949e;font-size:28px;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s ease;box-shadow:none}.close-btn:hover{background:#30363d;color:#c9d1d9;transform:none;box-shadow:none}.dialog-body{padding:20px;display:flex;flex-direction:column;gap:16px}.port-history-info{background:#30363d4d;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:8px}.port-history-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.history-item{background:#30363d4d;border:1px solid #30363d;border-radius:8px;padding:12px;transition:all .2s ease}.history-item:hover{border-color:#58a6ff;box-shadow:0 4px 12px #58a6ff33}.commodity-name{font-weight:600;color:#58a6ff;margin-bottom:8px;font-size:14px}.commodity-details{display:flex;flex-direction:column;gap:4px;font-size:13px;color:#c9d1d9}.history-note{font-size:12px;color:#8b949e;font-style:italic;margin:8px 0 0;text-align:center}.port-card{background:linear-gradient(135deg,#1a1f26,#0f1419);border:2px solid #2d333b;border-radius:16px;padding:0;display:flex;flex-direction:column;box-shadow:0 12px 40px #000c;overflow:hidden}.port-header{padding:16px;background:linear-gradient(135deg,#21262d,#161b22);border-bottom:2px solid #2d333b}.port-title{display:flex;align-items:center;gap:10px;margin-bottom:6px}.port-icon{font-size:28px;filter:drop-shadow(0 0 8px rgba(88,166,255,.3));vertical-align:middle;margin-right:8px}.port-name{font-size:19px;font-weight:700;color:#e6edf3;letter-spacing:.5px;text-shadow:0 2px 8px rgba(88,166,255,.2)}.port-subtitle{font-size:13px;color:#8b949e;margin-left:38px}.port-stats{padding:12px 16px;background:#0003;border-bottom:2px solid #2d333b;display:flex;gap:24px}.stat-row{display:flex;align-items:center;gap:6px;font-size:14px}.stat-icon{font-size:18px}.stat-label{color:#8b949e;font-weight:500}.stat-value{color:#e6edf3;font-weight:700}.commodities-header{padding:12px 16px;font-size:13px;font-weight:700;color:#6e7681;letter-spacing:1px;background:#00000026;border-bottom:1px solid #2d333b}.commodities-list{padding:10px;display:flex;flex-direction:column;gap:10px}.commodity-row{background:linear-gradient(135deg,#161b22,#0d1117);border:2px solid #2d333b;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px;transition:all .2s ease}.commodity-row:hover{border-color:#3d444d;box-shadow:0 4px 16px #0006}.commodity-header{display:flex;align-items:center;gap:10px}.commodity-icon{font-size:20px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.commodity-title{font-size:16px;font-weight:700;color:#e6edf3}.commodity-info{display:flex;flex-direction:column;gap:4px;font-size:13px;padding-left:30px}.commodity-price{color:#8b949e}.price-value{color:#58a6ff;font-weight:700;font-size:15px}.commodity-stock{color:#8b949e}.commodity-cargo{color:#6e7681;font-style:italic}.commodity-controls{display:flex;align-items:center;gap:6px;margin-top:2px}.amount-btn{background:linear-gradient(135deg,#21262d,#161b22);border:2px solid #30363d;color:#e6edf3;width:36px;height:36px;border-radius:6px;font-size:18px;font-weight:700;cursor:pointer;transition:all .2s ease;padding:0;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000004d}.amount-btn:hover:not(:disabled){background:linear-gradient(135deg,#30363d,#21262d);border-color:#58a6ff;transform:translateY(-1px);box-shadow:0 4px 12px #58a6ff4d}.amount-btn:disabled{opacity:.3;cursor:not-allowed}.amount-input{background:#0d1117;border:2px solid #30363d;color:#e6edf3;width:70px;height:36px;border-radius:6px;font-size:15px;font-weight:600;text-align:center;padding:0 6px;transition:all .2s ease}.amount-input:focus{outline:none;border-color:#58a6ff;box-shadow:0 0 0 3px #58a6ff26}.trade-btn{flex:1;height:36px;border-radius:6px;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s ease;border:2px solid transparent;padding:0 16px;box-shadow:0 2px 8px #0000004d}.buy-btn{background:linear-gradient(135deg,#1f6feb,#1a5fd1);color:#fff;border-color:#1f6feb}.buy-btn:hover:not(:disabled){background:linear-gradient(135deg,#2d7ff9,#1f6feb);transform:translateY(-2px);box-shadow:0 4px 16px #1f6feb80}.sell-btn{background:linear-gradient(135deg,#30363d,#21262d);color:#e6edf3;border-color:#30363d}.sell-btn:hover:not(:disabled){background:linear-gradient(135deg,#3d444d,#30363d);border-color:#6e7681;transform:translateY(-2px);box-shadow:0 4px 16px #30363d80}.trade-btn:disabled{opacity:.4;cursor:not-allowed}.port-footer{padding:10px 16px;background:#0003;border-top:1px solid #2d333b;display:flex;align-items:center;gap:6px;font-size:12px;color:#6e7681}.info-icon{font-size:14px;opacity:.8}.info-text{font-style:italic}.fuel-convert-section{margin-top:8px;padding-top:12px;border-top:1px solid #30363d}.fuel-convert-controls{display:flex;align-items:center;gap:8px}.fuel-convert-input{flex:1;background:#0d1117;border:1px solid #30363d;color:#c9d1d9;padding:6px 10px;border-radius:6px;font-size:14px;text-align:center}.fuel-convert-input:focus{outline:none;border-color:#58a6ff}.fuel-convert-btn{background:linear-gradient(135deg,#238636,#2ea043);color:#fff;border:1px solid #2ea043;border-radius:6px;padding:6px 12px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.fuel-convert-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #23863680}.fuel-convert-btn:disabled{opacity:.4;cursor:not-allowed}.fuel-convert-note{font-size:11px;color:#6e7681;font-style:italic;margin-top:4px}.planet-card{background:linear-gradient(135deg,#1a2618,#0d1117);border-color:#3fb950}.producer-badge{background:#238636;color:#aff5b4;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:600;margin-left:8px}.consumer-badge{background:#1f6feb;color:#a5d6ff;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:600;margin-left:8px}.ship-card{background:linear-gradient(135deg,#1a1f26,#0f1419);border:2px solid #2d333b;border-radius:16px;padding:0;display:flex;flex-direction:column;box-shadow:0 12px 40px #000c;overflow:hidden}.ship-header{padding:16px;background:linear-gradient(135deg,#21262d,#161b22);border-bottom:2px solid #2d333b}.ship-title{display:flex;align-items:center;gap:10px;margin-bottom:6px}.ship-icon{font-size:28px;filter:drop-shadow(0 0 8px rgba(88,166,255,.3))}.ship-name{font-size:19px;font-weight:700;color:#e6edf3;letter-spacing:.5px;text-shadow:0 2px 8px rgba(88,166,255,.2)}.ship-subtitle{font-size:13px;color:#8b949e;margin-left:38px}.ship-stats{padding:12px 16px;background:#0003;border-bottom:2px solid #2d333b;display:flex;gap:24px}.ship-section-header{padding:12px 16px;font-size:13px;font-weight:700;color:#6e7681;letter-spacing:1px;background:#00000026;border-bottom:1px solid #2d333b}.ship-type-selector{padding:12px 16px;background:#0003;border-bottom:2px solid #2d333b}.ship-type-select{width:100%;background:linear-gradient(135deg,#161b22,#0d1117);border:2px solid #30363d;color:#e6edf3;padding:10px 12px;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease}.ship-type-select:hover{border-color:#58a6ff;box-shadow:0 2px 8px #58a6ff33}.ship-type-select:focus{outline:none;border-color:#58a6ff;box-shadow:0 0 0 3px #58a6ff26}.ship-type-select option{background:#161b22;color:#e6edf3;padding:8px}.ship-cargo-overview{padding:12px 16px;background:#0003;border-bottom:1px solid #2d333b}.cargo-capacity-bar{width:100%;height:20px;background:#0d1117;border:2px solid #30363d;border-radius:10px;overflow:hidden;margin-bottom:8px}.cargo-capacity-fill{height:100%;background:linear-gradient(90deg,#1f6feb,#58a6ff);transition:width .3s ease;box-shadow:0 0 12px #58a6ff80}.cargo-capacity-text{text-align:center;font-size:13px;color:#8b949e;font-weight:600}.ship-cargo-list{padding:10px 16px;display:flex;flex-direction:column;gap:8px;border-bottom:2px solid #2d333b}.ship-cargo-item{display:flex;align-items:center;gap:10px;padding:8px 10px;background:linear-gradient(135deg,#161b22,#0d1117);border:2px solid #2d333b;border-radius:8px;transition:all .2s ease}.ship-cargo-item:hover{border-color:#3d444d;box-shadow:0 2px 8px #0006}.cargo-item-icon{font-size:18px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.cargo-item-name{flex:1;font-size:14px;font-weight:600;color:#e6edf3}.cargo-item-amount{font-size:15px;font-weight:700;color:#58a6ff;min-width:30px;text-align:right}.fuel-convert-panel{padding:12px 16px;background:#0003;border-bottom:2px solid #2d333b}.fuel-convert-info{display:flex;align-items:center;gap:6px;font-size:13px;color:#8b949e;margin-bottom:10px}.fuel-convert-panel .fuel-convert-controls{display:flex;align-items:center;gap:6px}.fuel-convert-panel .fuel-convert-btn{flex:1;background:linear-gradient(135deg,#238636,#2ea043);border:2px solid #2ea043;color:#fff;height:36px;border-radius:6px;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s ease;padding:0 16px;box-shadow:0 2px 8px #0000004d}.fuel-convert-panel .fuel-convert-btn:hover:not(:disabled){background:linear-gradient(135deg,#2ea043,#238636);transform:translateY(-1px);box-shadow:0 4px 12px #2ea04380}.fuel-convert-panel .fuel-convert-btn:disabled{opacity:.4;cursor:not-allowed}.ship-footer{padding:10px 16px;background:#0003;border-top:1px solid #2d333b;display:flex;align-items:center;gap:6px;font-size:12px;color:#6e7681}