/* ===== 2. 메인 컨테이너 ===== */
.main-container{
  max-width:1600px;
  margin:0 auto;
  padding:24px;
  display:grid;
  grid-template-columns:1fr 450px;
  gap:24px;
}

/* ===== 3. 영상화면 섹션 (영상화면 + 영상 정보) ===== */
.video-section{
  display:flex;
  flex-direction:column;
  gap:20px;
}

.player-container{width:100%;position:relative}
.player{
  width:100%;
  aspect-ratio:16/9;
  background:var(--thumb-bg);
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  max-width:1200px;
  margin:0 auto
}

.video-meta{padding:0 2px}
.title{font-size:20px;font-weight:700;margin:0 0 6px 0}
.subtle{color:var(--muted);font-size:13px}

.desc{
  white-space:pre-wrap;
  background:var(--input-bg);
  border:1px solid var(--border);
  padding:12px;
  border-radius:10px;
  margin-top:8px;
  line-height:1.5;
  overflow:hidden;
  position:relative
}

.desc.collapsed{
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical
}

.desc-toggle{
  color:#666;
  cursor:pointer;
  font-weight:600;
  display:inline-block
}

.desc-toggle:hover{text-decoration:underline}
.desc-toggle.more{
  position:absolute;
  bottom:8px;
  right:12px;
  background:var(--input-bg);
  padding:2px 6px;
  border-radius:4px
}

.desc-toggle.less{
  position:absolute;
  bottom:8px;
  right:12px;
  background:var(--input-bg);
  padding:2px 6px;
  border-radius:4px
}

.chips{display:none;flex-wrap:wrap;gap:8px;margin-top:8px}
.chips.show{display:flex}
.chip{font-size:12px;border:1px solid var(--border);padding:6px 10px;border-radius:999px;background:var(--chip-bg)}
.sub-line{display:flex;justify-content:space-between;align-items:center}

.tags-toggle{
  background:#666;
  color:#fff;
  border:none;
  padding:4px 8px;
  border-radius:4px;
  font-size:12px;
  cursor:pointer;
  font-weight:600
}

.tags-toggle.active{background:var(--accent)}
.tags-toggle:hover{opacity:0.8}
.video-meta{position:relative}

/* ===== 5. 사이드바 섹션 (분류 선택, 관련 장소, 다음 재생) ===== */
.sidebar-section{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:0 0 0 24px;
  border-left:1px solid var(--border)
}

.panel{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden
}

.panel h3{
  margin:0;
  padding:12px;
  border-bottom:1px solid var(--border);
  font-size:15px
}

.panel h3:not(:first-child){margin-top:10px}

/* ===== 6. 영상 리스트 모드 (video_id 없을 때) ===== */
.list-mode .main-container{
  grid-template-columns:1fr 350px;
}

.list-mode .sidebar-section .panel h3:not(:first-child),
.list-mode .sidebar-section .panel .venues,
.list-mode .sidebar-section .panel .list{
  display:none;
}