:root{--bg: #0d1117;--bg-card: #161b22;--bg-hover: #1c2333;--border: #30363d;--text: #e6edf3;--text-dim: #7d8590;--text-secondary: #9aa5b4;--accent-green: #3fb950;--accent-blue: #58a6ff;--accent-yellow: #d29922;--accent-red: #f85149;--accent-orange: #db6d28;--accent-purple: #bc8cff}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,Segoe UI,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:13px;line-height:1.5;overflow:hidden;height:100vh}#app{display:flex;flex-direction:column;height:100vh;overflow-y:auto;background:var(--border);gap:1px}#app>*{background:var(--bg-card)}@media(min-width:1024px){#app{display:grid;grid-template-columns:280px 1fr 300px;grid-template-rows:48px 1fr 160px;grid-template-areas:"header header header" "sidebar map commands" "log log log";overflow:hidden}#app.viewer-mode{grid-template-columns:280px 1fr;grid-template-areas:"header header" "sidebar map" "log log"}#app.viewer-mode #commands{display:none}}#header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;min-height:48px;flex-shrink:0}@media(min-width:1024px){#header{grid-area:header}}#header h1{font-size:16px;font-weight:600;white-space:nowrap}#header .status{font-size:11px;color:var(--text-dim);display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0}.status-dot.online{background:var(--accent-green)}.status-dot.offline{background:var(--accent-red)}#sidebar{overflow-y:auto;padding:8px;min-height:120px}@media(min-width:1024px){#sidebar{grid-area:sidebar;min-height:0}}.sidebar-tabs{display:flex;gap:2px;margin-bottom:8px}.tab-btn{flex:1;padding:6px 0;background:transparent;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;font-size:11px;text-transform:uppercase;letter-spacing:.5px}.tab-btn.active{background:var(--bg-hover);color:var(--text);border-color:var(--accent-blue)}.tab-content{display:none}.tab-content.active{display:block}.node-card{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:8px 10px;margin-bottom:4px;cursor:pointer;transition:border-color .15s}.node-card:hover{border-color:var(--accent-blue)}.node-card.selected{border-color:var(--accent-green);background:var(--bg-hover)}.node-card.offline{opacity:.5}.node-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.node-label{font-weight:600;font-size:13px}.node-id{font-size:10px;color:var(--text-dim)}.node-type{font-size:9px;padding:1px 5px;border-radius:3px;text-transform:uppercase;letter-spacing:.5px}.node-type.turtle{background:var(--accent-blue);color:#000}.node-type.beacon{background:var(--accent-purple);color:#000}.node-info{font-size:11px;color:var(--text-secondary)}.node-info .pos{font-family:monospace}.fuel-bar{height:4px;background:var(--border);border-radius:2px;margin-top:4px;overflow:hidden}.fuel-bar-fill{height:100%;background:var(--accent-green);transition:width .3s}.fuel-bar-fill.low{background:var(--accent-yellow)}.fuel-bar-fill.critical{background:var(--accent-red)}.mode-badge{font-size:9px;padding:1px 5px;border-radius:3px;text-transform:uppercase;font-weight:600}.mode-badge.idle{background:var(--border);color:var(--text-dim)}.mode-badge.auto{background:var(--accent-green);color:#000}.mode-badge.manual{background:var(--accent-yellow);color:#000}.mode-badge.halted{background:var(--accent-red);color:#fff}.zone-card{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:8px 10px;margin-bottom:4px}.zone-name{font-weight:600}.zone-info{font-size:10px;color:var(--text-secondary);margin-top:2px}.zone-progress{height:4px;background:var(--border);border-radius:2px;margin-top:4px}.zone-progress-fill{height:100%;background:var(--accent-green);border-radius:2px}.turtle-chip{display:inline-flex;align-items:center;gap:2px;background:var(--bg-hover);border:1px solid var(--border);border-radius:3px;padding:1px 4px;font-size:10px}.chip-remove{background:none;border:none;color:var(--accent-red);cursor:pointer;font-size:10px;padding:0 2px}#map-area{position:relative;background:var(--bg);min-height:300px}@media(min-width:1024px){#map-area{grid-area:map;min-height:0}}#map-3d{width:100%;height:100%}#map-controls{position:absolute;bottom:8px;left:8px;display:flex;gap:4px;align-items:center;font-size:11px;background:#0d1117e6;padding:4px 8px;border-radius:4px;border:1px solid var(--border)}#map-controls input,#map-controls button{background:var(--bg-card);border:1px solid var(--border);color:var(--text);padding:2px 6px;font-size:11px;border-radius:3px}#map-controls input[type=number]{width:55px;text-align:center}#map-controls button:hover{background:var(--bg-hover)}#commands{overflow-y:auto;padding:8px}@media(min-width:1024px){#commands{grid-area:commands}}#commands h2{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);margin-bottom:8px}.cmd-group{margin-bottom:10px}.cmd-group>label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim);margin-bottom:4px}.btn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.btn-grid.two-col{grid-template-columns:repeat(2,1fr)}.cmd-btn{background:var(--bg);border:1px solid var(--border);color:var(--text);padding:5px 4px;font-size:11px;border-radius:3px;cursor:pointer;text-align:center}.cmd-btn:hover{background:var(--bg-hover);border-color:var(--accent-blue)}.cmd-btn:active{background:var(--accent-blue);color:#000}.cmd-btn.action-green{background:var(--accent-green);color:#000;border-color:var(--accent-green)}.cmd-btn.action-red{background:var(--accent-red);color:#fff;border-color:var(--accent-red)}.cmd-btn.action-blue{background:var(--accent-blue);color:#000;border-color:var(--accent-blue)}.cmd-btn.action-yellow{background:var(--accent-yellow);color:#000;border-color:var(--accent-yellow)}.cmd-btn:disabled{opacity:.4;cursor:not-allowed}#no-selection{text-align:center;color:var(--text-dim);padding:20px 8px}#cmd-result{font-family:monospace;font-size:11px;color:var(--text-secondary);padding:4px;max-height:100px;overflow-y:auto;white-space:pre-wrap;word-break:break-all}.home-input{background:var(--bg);border:1px solid var(--border);color:var(--text);padding:4px 6px;font-size:11px;border-radius:3px}.home-input:focus{border-color:var(--accent-blue);outline:none}#cmd-input{display:flex;gap:3px}#cmd-input input{flex:1}#cmd-input button{white-space:nowrap}.inv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.inv-slot{aspect-ratio:1;background:var(--bg);border:1px solid var(--border);border-radius:3px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;min-height:48px}.inv-slot.empty{opacity:.3}.inv-slot .inv-icon{width:32px;height:32px;image-rendering:pixelated}.inv-slot .inv-fallback{font-size:9px;color:var(--text-secondary);text-align:center;line-height:1.1;padding:2px;word-break:break-all;overflow:hidden;max-height:100%}.inv-slot .inv-count{position:absolute;bottom:1px;right:3px;font-size:10px;font-weight:700;color:#fff;text-shadow:1px 1px 1px #000,-1px -1px 1px #000;pointer-events:none}.inv-slot .inv-slot-num{position:absolute;top:1px;left:2px;font-size:8px;color:var(--text-dim)}.inv-slot[title]{cursor:help}#log{padding:8px;overflow-y:auto;min-height:80px}@media(min-width:1024px){#log{grid-area:log;min-height:0}}#log h2{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);margin-bottom:4px}#log-entries{font-family:monospace;font-size:11px;color:var(--text-secondary)}.log-entry{padding:1px 0}.log-entry .ts{color:var(--text-dim)}.log-entry.error{color:var(--accent-red)}.log-entry.warn{color:var(--accent-yellow)}#zone-dialog,#wp-dialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:16px;z-index:100;min-width:300px;max-width:90vw}#zone-dialog h3,#wp-dialog h3{color:var(--accent-green);margin-bottom:8px}.dialog-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}.dialog-grid label{font-size:10px;color:var(--text-dim);align-self:center}.dialog-grid input,.dialog-grid select{width:100%}.dialog-actions{display:flex;gap:4px;margin-top:8px;flex-wrap:wrap}.dialog-actions button{flex:1;min-width:60px}#zone-overlay,#wp-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:99}@media(max-width:1023px){#app.viewer-mode #commands{display:none}#map-area{flex:1;min-height:40vh}#sidebar{max-height:35vh}#log{max-height:20vh}}