body {
  background: #1E1E1E;
  color: #CCCCCC;
  font-family: 'Segoe UI', 'Arial', sans-serif;
}
.main-container {
  max-width: 750px;
  margin: 40px auto;
  background: #23272b;
  border-radius: 10px;
  box-shadow: 0 4px 24px #0008;
  padding: 0;
  overflow: hidden;
}
.header-gradient {
  background: linear-gradient(180deg, #2D2D30 0%, #1E1E1E 100%);
  padding: 20px 15px 10px 15px;
  text-align: center;
}
.header-gradient h2 {
  color: #00BFFF;
  font-weight: bold;
  margin-bottom: 5px;
}
.header-gradient .subtitle {
  color: #AAAAAA;
  font-size: 13px;
}
.action-btn {
  min-width: 200px;
  margin-right: 15px;
  font-weight: 600;
  border-radius: 4px;
  box-shadow: 0 2px 8px #0003;
  border: none;
  padding: 10px 0;
  font-size: 14px;
  transition: background 0.2s;
}
.action-btn:last-child { margin-right: 0; }
.btn-install { background: #107C10; color: #fff; }
.btn-install:hover { background: #0E6E0E; }
.btn-deploy { background: #0078D4; color: #fff; }
.btn-deploy:hover { background: #106EBE; }
.btn-tune { background: #FF8C00; color: #fff; }
.btn-tune:hover { background: #E67E00; }
.nav-btn {
  min-width: 180px;
  margin-right: 10px;
  font-weight: 500;
  border-radius: 4px;
  border: 1px solid #3F3F46;
  padding: 8px 16px;
  font-size: 13px;
  transition: all 0.2s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.nav-btn:last-child { margin-right: 0; }
.btn-hardware { background: #6366F1; color: #fff; border-color: #6366F1; }
.btn-hardware:hover { background: #5B21B6; border-color: #5B21B6; color: #fff; }
.btn-tokens { background: #059669; color: #fff; border-color: #059669; }
.btn-tokens:hover { background: #047857; border-color: #047857; color: #fff; }
.info-panel {
  background: #2D2D30;
  border: 1px solid #3F3F46;
  border-radius: 6px;
  padding: 15px 10px;
  margin-bottom: 15px;
}
.info-label {
  color: #CCCCCC;
  font-weight: bold;
  font-size: 13px;
  margin-right: 2px;
}
.info-value {
  color: #00BFFF;
  font-weight: 500;
  font-size: 12px;
  font-family: Consolas, monospace;
}
.console-panel {
  background: #2D2D30;
  border: 1px solid #3F3F46;
  border-radius: 6px;
  margin-bottom: 0;
}
.console-header {
  background: #1E1E1E;
  border-bottom: 1px solid #3F3F46;
  padding: 10px 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.console-header .status-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #00FF00;
  display: inline-block;
}
.console-header .status-text {
  color: #00FF00;
  font-size: 11px;
  margin-left: 2px;
}
.console-output {
  background: #2D2D30;
  color: #DCDCDC;
  font-family: Consolas, 'Courier New', monospace;
  font-size: 12px;
  border: none;
  width: 100%;
  min-height: 120px;
  padding: 8px;
  resize: none;
  outline: none;
}
@media (max-width: 800px) {
  .main-container { max-width: 100vw; }
  .action-btn { min-width: 120px; font-size: 12px; }
}