@import url(./base.css);
@import url(./video.css);
@import url(./panel.css);
@import url(./toolbar.css);

.app {
  display: grid;
  grid-template-rows: auto 1fr;
}

/* 헤더 영역 */
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  background: #2a2b2d;
}
.header__title {
  font-size: 16px;
  margin: 0;
}

/* 메인 영역 */
.meeting {
  display: grid;
  padding: 16px;
}

.video-grid {
  display: grid;
  grid-template-columns: repeat(var(--cols, 1), 1fr);
  justify-content: center;
  align-content: center;
  gap: 5px;
}

.content {
  display: grid;
  grid-template-columns: 1fr; /* 패널 닫힘 */
  min-height: calc(100vh - 64px);
}
.content > * {
  min-height: 0;
}
.app--panel-open .content {
  grid-template-columns: 1fr 320px;
}