body { 
    font-family: Arial, sans-serif; 
    margin: 0; 
    padding: 20px; 
    background: #f5f5f5; 
}
.container { 
    max-width: 1200px; 
    margin: 0 auto; 
    background: white; 
    border-radius: 10px; 
    padding: 20px; 
    box-shadow: 0 2px 10px rgba(0,0,0,0.1); 
}
.header { 
    text-align: center; 
    margin-bottom: 30px; 
}
.header h1 { 
    color: #333; 
    margin-bottom: 10px; 
}
.nav { 
    text-align: center; 
    margin-bottom: 30px; 
}
.nav a { 
    display: inline-block; 
    margin: 0 10px; 
    padding: 10px 20px; 
    background: #007bff; 
    color: white; 
    text-decoration: none; 
    border-radius: 5px; 
}
.nav a:hover { 
    background: #0056b3; 
}
.status { 
    display: flex; 
    justify-content: space-around; 
    margin-bottom: 30px; 
}
.status-item { 
    text-align: center; 
    padding: 15px; 
    background: #f8f9fa; 
    border-radius: 8px; 
}
.status-indicator { 
    width: 20px; 
    height: 20px; 
    border-radius: 50%; 
    margin: 0 auto 10px; 
}
.status-online { 
    background: #28a745; 
}
.status-offline { 
    background: #dc3545; 
}
.content { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: 20px; 
}
.panel { 
    background: #f8f9fa; 
    padding: 20px; 
    border-radius: 8px; 
}
.panel h3 { 
    margin-top: 0; 
    color: #333; 
}
.log-item { 
    background: white; 
    margin: 10px 0; 
    padding: 15px; 
    border-radius: 5px; 
    border-left: 4px solid #007bff; 
}
.signal-item { 
    background: white; 
    margin: 15px 0; 
    padding: 20px; 
    border-radius: 8px; 
    border-left: 5px solid #e74c3c; 
}
.signal-buy { 
    border-left-color: #27ae60; 
}
.signal-sell { 
    border-left-color: #e74c3c; 
}
.refresh-btn { 
    background: #007bff; 
    color: white; 
    border: none; 
    padding: 10px 20px; 
    border-radius: 5px; 
    cursor: pointer; 
}
.refresh-btn:hover { 
    background: #0056b3; 
}