:root {
  color-scheme: dark;

  /* Your customized dark palette */
  --md-sys-color-surface: #232425;
  --md-sys-color-surface-container: #2c2d2f;
  --md-sys-color-background: #232425;

  --md-sys-color-primary: #1976d2;
  --md-sys-color-secondary: #ff5252;

  --md-sys-color-secondary: #03dac6;
  --md-sys-color-on-secondary: #000000;

  /* Optional but recommended */
  --md-sys-color-on-surface: #e6e6e6;
  --md-sys-color-outline: #5a5b5d;
}

body {
  display: flex;
  flex-direction: column;
  gap: 1em;
  background-color: #232324;
}

#controls-section {
  display: flex;
  gap: 3em;
}

#video-section {
  display: flex;
  gap: 2em;
  justify-content: space-between;

  div {
    flex: 1 0 auto;
  }

  video {
    width: 100%;
    background: black;
    aspect-ratio: 16/9;
  }
}

#meetingIdInput {
	display: none;
}