:root{--bg:#000806;--neon:#00ff41;--cyan:#22d3ee;--muted:#6b7280}
*{box-sizing:border-box}
html,body,#app{height:100%;margin:0;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, 'Roboto Mono', monospace;background:var(--bg);color:var(--neon)}
.app{min-height:100vh;margin:10px;padding:12px;border:2px solid var(--neon);border-radius:8px;background:linear-gradient(180deg, rgba(0,0,0,0.75), rgba(0,0,0,0.85));}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px;background:rgba(0,0,0,0.6);border:1px solid rgba(0,255,65,0.12);}
.topbar{border:1px solid rgba(0,255,65,0.15);border-radius:6px;padding:14px 16px;box-shadow:0 0 18px rgba(0,255,65,0.03) inset}
.topbar .title{font-weight:900;color:#fff;letter-spacing:1px}
.topbar .red{color:#f43f5e;margin-right:6px}
.topbar .green{color:var(--neon)}
.topbar .muted{color:var(--muted);font-size:12px;margin-left:8px}

.layout{display:grid;grid-template-columns:260px 1fr 300px;gap:12px;padding:12px;height:calc(100% - 68px)}
.layout{display:grid;grid-template-columns:280px 1fr 320px;gap:14px;padding:14px;height:calc(100% - 92px)}
.left,.center,.right{display:flex;flex-direction:column;gap:12px}
.panel{background:linear-gradient(180deg, rgba(0,0,0,0.65), rgba(0,0,0,0.55));padding:12px;border:1px solid rgba(0,255,65,0.06);border-radius:6px;box-shadow:0 0 14px rgba(0,255,65,0.02) inset}
.categories h3{color:var(--muted);margin:0 0 8px 0}
.cats{display:flex;flex-direction:column;gap:10px}
.cats button{background:transparent;border:1px solid rgba(0,255,65,0.06);color:var(--neon);padding:12px 14px;border-radius:4px;cursor:pointer;font-weight:800;font-size:13px;text-align:left;border-left:4px solid transparent}
.cats button.active{background:rgba(0,255,65,0.02);border-color:var(--neon);color:#fff;border-left-color:var(--neon);box-shadow:0 0 12px rgba(0,255,65,0.06) inset}
.map img{width:100%;opacity:0.08}

.center .search{display:flex;align-items:center;gap:10px}
.prompt{color:var(--neon);font-weight:900}
#searchInput{flex:1;background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,0.03);padding:8px;color:#fff;font-size:14px}
#searchInput:focus{outline:none;border-bottom-color:var(--neon)}

.results{overflow:auto}
.tool{display:flex;justify-content:space-between;align-items:center;padding:18px;margin-bottom:14px;border-radius:6px;border:1px solid rgba(0,255,65,0.06);background:rgba(0,0,0,0.35);position:relative}
.tool::after{content:'';position:absolute;right:16px;top:12px;width:64px;height:2px;background:linear-gradient(90deg,transparent,var(--neon));opacity:0.25}
.tool .meta h4{margin:0;color:#fff;font-size:18px;letter-spacing:0.6px}
.tool .meta p{margin:6px 0 0 0;color:#94a3b8;font-size:14px}
.exec{padding:8px 12px;border:1px solid var(--neon);color:var(--neon);background:transparent;border-radius:4px;cursor:pointer;font-weight:800}
.exec.locked{border-color:#7f1d1d;color:#d94646;cursor:not-allowed}
.exec{min-width:88px;text-align:center}

.logList{height:210px;overflow:auto;color:#f87171;font-size:13px}
.logList div{white-space:nowrap;margin-bottom:6px}
.panel.logs{border:1px solid rgba(220,20,20,0.12);box-shadow:0 0 12px rgba(220,20,20,0.02) inset}
.panel.logs .panel-title{color:#fb7185}
.logList{color:#fb7185}

.core .panel-title{color:#06b6d4;margin-bottom:8px}
.stat{display:flex;justify-content:space-between;color:#94a3b8;font-size:13px}
.bar{height:10px;background:rgba(2,6,9,0.6);border:1px solid rgba(34,211,238,0.06);border-radius:6px;margin:8px 0;overflow:hidden}
.barInner{height:100%;background:linear-gradient(90deg,var(--cyan),#00ff41)}

@media (max-width:900px){.layout{grid-template-columns:1fr;grid-auto-rows:min-content}.left{order:2}.center{order:1}.right{order:3;height:auto}}

/* tablet and small desktop tweaks */
@media (max-width:1200px){
	.layout{grid-template-columns:220px 1fr 260px}
	.layout{gap:10px;padding:10px}
	.map{display:block}
}

/* mobile: stack panels, enable horizontal category scrolling, hide map for space */
@media (max-width:900px){
	.layout{padding:8px;gap:8px}
	.panel{padding:10px}
	.cats{display:flex;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px}
	.cats button{flex:0 0 auto}
	.map{display:none}
	.topbar{flex-direction:column;align-items:flex-start;gap:8px}
	.topbar .status{font-size:13px}
	#searchInput{font-size:15px;padding:10px}
	.results{max-height:60vh}
	.logList{height:140px}
	.tool{flex-direction:column;align-items:flex-start;gap:8px}
	.tool .meta p{font-size:14px}
	.exec{width:100%}
}

/* small phones */
@media (max-width:480px){
	.topbar .title{font-size:16px}
	.cats button{padding:8px 10px;font-size:12px}
	.panel{padding:8px}
	.logList{height:120px;font-size:12px}
	.bar{height:8px}
}