body {
  font-family: system-ui, sans-serif;
  background: #0f1115;
  color: #e6e6e6;
  max-width: 720px;
  margin: auto;
  padding: 20px;
}
h1 { text-align: center; }
.subtitle {
  text-align: center;
  opacity: 0.7;
  margin-bottom: 25px;
}
.start-btn {
  width: 100%;
  padding: 18px;
  font-size: 18px;
  background: #28a745;
  border: none;
  border-radius: 8px;
  color: white;
  cursor: pointer;
  margin-bottom: 30px;
}
.start-btn.running { background: #dc3545; }
section {
  background: #1b1e24;
  padding: 16px;
  border-radius: 8px;
  margin-bottom: 20px;
}
video { width: 100%; background: black; border-radius: 6px; margin-top: 10px; }
.meter { width: 100%; height: 18px; background: #333; border-radius: 4px; overflow: hidden; margin-top: 10px; }
.meter-bar { height: 100%; width: 0%; background: linear-gradient(90deg,#00ff6a,#ffd000,#ff3b3b); transition: width 0.1s; }
.status { font-size: 13px; opacity: 0.7; margin-top: 6px; }
footer { text-align: center; font-size: 12px; opacity: 0.5; margin-top: 25px; }