@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Inter:wght@400;600&display=swap";:root{--bg-color: #11111a;--panel-bg: rgba(15, 23, 42, .6);--accent: #00f0ff;--accent-hover: #00c3d9;--user-color: #ff0055;--border: rgba(0, 240, 255, .2);--border-glow: 0 0 10px rgba(0, 240, 255, .1);--start-color: #22c55e;--end-color: #f59e0b}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;background:var(--bg-color);color:#f1f5f9;min-height:100vh;overflow-x:hidden;background-image:radial-gradient(circle at 15% 50%,rgba(0,240,255,.03),transparent 25%),radial-gradient(circle at 85% 30%,rgba(255,0,85,.03),transparent 25%)}#root{width:100%;height:100vh;padding:1rem;display:flex;flex-direction:column}.app-container{height:100%;display:flex;flex-direction:column}.auth-container{justify-content:center;align-items:center}.auth-card{background:var(--panel-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border);box-shadow:var(--border-glow);padding:3rem;border-radius:12px;width:100%;max-width:400px;display:flex;flex-direction:column;gap:1.5rem}.auth-title{font-family:JetBrains Mono,monospace;font-size:1.5rem;color:var(--accent);text-align:center;letter-spacing:2px}.auth-error{color:var(--user-color);font-family:JetBrains Mono,monospace;font-size:.8rem;text-align:center}.auth-form{display:flex;flex-direction:column;gap:1rem}.auth-form input{background:#0006;border:1px solid var(--border);padding:.8rem;border-radius:4px;color:#fff;font-family:JetBrains Mono,monospace;transition:all .3s ease;outline:none}.auth-form input:focus{border-color:var(--accent);box-shadow:0 0 8px #00f0ff4d}.auth-form button{background:transparent;border:1px solid var(--accent);color:var(--accent);padding:.8rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-weight:700;cursor:pointer;transition:all .3s ease;margin-top:1rem}.auth-form button:hover:not(:disabled){background:var(--accent);color:var(--bg-color);box-shadow:0 0 15px #00f0ff66}.auth-form button:disabled{opacity:.5;cursor:not-allowed}.auth-switch{text-align:center;font-family:JetBrains Mono,monospace;font-size:.8rem;cursor:pointer;color:#888;transition:color .3s ease}.auth-switch:hover{color:var(--accent)}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--panel-bg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:12px;margin-bottom:1rem;border:1px solid var(--border)}.header h1{font-family:JetBrains Mono,monospace;font-size:1.2rem;color:var(--accent);letter-spacing:1px}.user-badge{font-family:JetBrains Mono,monospace;font-size:.8rem;color:#888}.toggle-mode-btn,.logout-btn{background:transparent;color:var(--accent);border:1px solid var(--border);padding:.4rem .8rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.8rem;cursor:pointer;transition:all .2s}.toggle-mode-btn:hover,.logout-btn:hover{background:#00f0ff1a;border-color:var(--accent)}.logout-btn{color:var(--user-color);border-color:#f053}.logout-btn:hover{background:#ff00551a;border-color:var(--user-color)}.game-container{flex-grow:1;background:var(--panel-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;border:1px solid var(--border);display:flex;flex-direction:column;max-width:900px;margin:0 auto;width:100%;overflow:hidden;box-shadow:0 10px 30px #00000080}.output-area{flex-grow:1;overflow-y:auto;padding:2rem;display:flex;flex-direction:column;gap:1.5rem}.message-entry{display:flex;width:100%}.message-entry.system{justify-content:flex-start}.message-entry.user{justify-content:flex-end}.message-bubble{max-width:80%;padding:1rem 1.2rem;border-radius:8px;line-height:1.5;font-family:JetBrains Mono,monospace;font-size:.95rem;box-shadow:0 4px 15px #0003}.message-entry.system .message-bubble{background:#00f0ff0d;border-left:2px solid var(--accent);color:#e2e8f0;border-bottom-left-radius:0}.message-entry.user .message-bubble{background:#ff00550d;border-right:2px solid var(--user-color);color:var(--user-color);border-bottom-right-radius:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--accent)}.options-area{display:flex;gap:1rem;flex-wrap:wrap;justify-content:flex-end;border-top:1px solid var(--border);padding:1.5rem;background:#0003}.option-button{background:transparent;border:1px solid var(--user-color);color:var(--user-color);padding:.6rem 1.2rem;border-radius:20px;cursor:pointer;transition:all .2s;font-family:JetBrains Mono,monospace;font-size:.85rem}.option-button:hover:not(:disabled){background:#ff00551a;box-shadow:0 0 10px #ff00554d}.option-button:disabled{opacity:.4;cursor:not-allowed;border-color:#555;color:#555}.restart-btn{background:transparent;color:var(--end-color);border:1px solid var(--end-color);padding:.6rem 1.2rem;border-radius:4px;font-family:JetBrains Mono,monospace;cursor:pointer;transition:all .2s}.restart-btn:hover{background:#f59e0b1a;box-shadow:0 0 10px #f59e0b4d}.editor-layout{flex-grow:1;position:relative;display:flex;overflow:hidden;justify-content:center;background:#08080c;border-radius:16px;border:1px solid var(--border)}.map-view-wrapper{flex-grow:1;overflow:auto;display:block;cursor:grab}.map-view-wrapper:active{cursor:grabbing}.map-view{position:relative;flex-shrink:0;background-image:radial-gradient(rgba(0,240,255,.05) 1px,transparent 1px);background-size:30px 30px;min-width:1000px;min-height:1000px;margin:0 auto;z-index:1}.connector-layer{position:absolute;pointer-events:none;z-index:10;top:0;left:0}@keyframes typing-dot{0%,80%,to{transform:scale(.6);opacity:.3}40%{transform:scale(1);opacity:1}}.typing-indicator{display:flex;align-items:center;gap:6px;padding:4px 0}.typing-indicator span{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);animation:typing-dot 1.2s infinite ease-in-out}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}.response-card{position:absolute;background:#0f172a;border:1px solid var(--accent);padding:6px 12px;border-radius:4px;font-size:.65rem;color:#f1f5f9;cursor:pointer;z-index:100;box-shadow:0 4px 12px #0009;max-width:150px;text-align:center;font-family:JetBrains Mono,monospace;transform:translate(-50%,-50%);word-wrap:break-word;line-height:1.2}.connection-path{transition:all .2s ease;pointer-events:visibleStroke;cursor:pointer}.connection-path:hover,.connection-path.highlighted{stroke:var(--accent);stroke-width:4px;opacity:1}.response-card:hover,.response-card.highlighted{background:#0d2a3f;color:var(--accent);box-shadow:0 0 15px #00f0ff4d}.message-card{position:absolute;width:200px;height:120px;background:#0f172acc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--border);border-radius:8px;padding:1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 10px 25px #00000080;z-index:80}.message-card:hover,.message-card.highlighted{border-color:var(--accent);box-shadow:0 0 15px #00f0ff33;transform:translateY(-2px)}.message-card.start{border-left:3px solid var(--start-color)}.message-card.end{border-left:3px solid var(--end-color)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.badge{font-size:.6rem;text-transform:uppercase;font-weight:800;background:#00f0ff1a;color:var(--accent);padding:2px 6px;border-radius:2px}.del-btn{background:transparent;border:none;color:var(--user-color);font-size:1.2rem;cursor:pointer}.message-card p{font-size:.75rem;opacity:.6;line-height:1.4}.add-dec-btn{position:absolute;top:-15px;left:50%;transform:translate(-50%);width:30px;height:30px;border-radius:50%;background:#0f172a;color:var(--accent);border:1px solid var(--accent);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px #00f0ff33;transition:all .2s}.add-dec-btn:hover{background:var(--accent);color:#000;box-shadow:0 0 15px var(--accent)}.props-panel{position:absolute;top:1rem;right:1rem;width:300px;background:#0f172ae6;border:1px solid var(--border);border-radius:8px;padding:1.5rem;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.editor-form label{display:block;font-size:.7rem;opacity:.6;margin-bottom:.25rem;margin-top:.75rem;font-family:JetBrains Mono,monospace}.editor-form input,.editor-form textarea,.editor-form select{width:100%;background:#00000080;border:1px solid rgba(255,255,255,.1);padding:.6rem;border-radius:4px;color:#fff;outline:none;transition:.2s;font-family:Inter,sans-serif}.editor-form input:focus,.editor-form textarea:focus,.editor-form select:focus{border-color:var(--accent)}.btn-group{display:flex;gap:.5rem;margin-top:1rem}.btn-group button{flex:1;padding:.6rem;border-radius:4px;cursor:pointer;font-family:JetBrains Mono,monospace;font-size:.8rem}.btn-group button[type=submit]{background:transparent;border:1px solid var(--start-color);color:var(--start-color);transition:.2s}.btn-group button[type=submit]:hover{background:#22c55e1a;box-shadow:0 0 10px #22c55e33}.danger-btn{background:transparent;border:1px solid var(--user-color);color:var(--user-color);transition:.2s}.danger-btn:hover{background:#ff00551a;box-shadow:0 0 10px #f053}.cancel-btn{background:transparent;border:1px solid #555;color:#888;transition:.2s}.cancel-btn:hover{border-color:#888;color:#ccc}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:200}.modal-card{background:var(--panel-bg);padding:2rem;border-radius:8px;border:1px solid var(--border);width:400px;display:flex;flex-direction:column;gap:1rem;font-family:JetBrains Mono,monospace}.modal-btn{background:transparent;border:1px solid var(--accent);padding:.8rem;border-radius:4px;cursor:pointer;color:var(--accent);transition:.2s}.modal-btn:hover{background:#00f0ff1a;box-shadow:0 0 10px #00f0ff33}.divider{text-align:center;font-size:.7rem;opacity:.4}.scroll-list{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.list-item{background:#0000004d;border:1px solid rgba(255,255,255,.1);padding:.8rem;border-radius:4px;color:#fff;cursor:pointer;text-align:left;font-size:.8rem}.list-item:hover{border-color:var(--accent);color:var(--accent)}.close-btn{margin-top:1rem;background:transparent;border:none;color:#fff;opacity:.5;cursor:pointer}.close-btn:hover{opacity:1}
