body { margin:0; font-family: Arial, sans-serif; display:flex; background:#f4f6f8; }
.sidebar {
width:220px; background:#2c3e50; color:white; height:100vh; padding:20px;
}
.sidebar h2 { margin-bottom:30px; }
.sidebar ul { list-style:none; padding:0; }
.sidebar ul li { margin:15px 0; cursor:pointer; }
.main { flex:1; padding:20px; }
.summary { display:flex; margin-bottom:20px; }
.card {
flex:1; background:white; margin-right:10px; padding:15px; border-radius:8px;
box-shadow:0 2px 4px rgba(0,0,0,0.1); text-align:center;
}
.card:last-child { margin-right:0; }
.content { display:flex; }
.left-panel { flex:2; margin-right:20px; }
.right-panel { flex:1; display:flex; flex-direction:column; }
table { width:100%; border-collapse:collapse; background:white; margin-bottom:20px; }
th, td { padding:10px; border-bottom:1px solid #ddd; text-align:left; }
th { background:#ecf0f1; }
canvas, .map { background:white; border-radius:8px; padding:10px; margin-bottom:20px; }
.bottom-panels { display:flex; margin-top:20px; }
.panel {
flex:1; background:white; margin-right:20px; padding:15px; border-radius:8px;
box-shadow:0 2px 4px rgba(0,0,0,0.1);
}
.panel:last-child { margin-right:0; }