/* 响应式布局：适配 1280 ~ 2560 以及窄屏 */
:root {
  --rail-w: clamp(240px, 20vw, 300px);
  --mj-w: clamp(260px, 22vw, 330px);
}

/* 基础两栏：内容 + 作品栏 */
.media-workspace {
  grid-template-columns: minmax(0, 1fr) var(--rail-w) !important;
  gap: clamp(10px, 1.1vw, 18px) !important;
}

/* 三栏：内容 + 参数面板（视频/MJ） + 作品栏 */
.media-workspace.has-model-parameters,
.media-workspace.has-mj-parameters {
  grid-template-columns: minmax(0, 1fr) var(--mj-w) var(--rail-w) !important;
}

.media-workspace.has-model-parameters > .media-center,
.media-workspace.has-mj-parameters > .media-center {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.media-workspace.has-model-parameters > .studio-model-parameters,
.media-workspace.has-mj-parameters > .studio-mj-parameters {
  grid-column: 2 !important;
  grid-row: 1 !important;
  max-height: calc(100dvh - 200px);
  overflow: auto;
}

.media-workspace.has-model-parameters > .works-rail,
.media-workspace.has-mj-parameters > .works-rail {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

/* 工具栏与底部输入行允许换行 */
.composer-options,
.media-tabs,
.toolbar {
  flex-wrap: wrap;
  gap: 8px;
}

/* 立方体别挡住内容 */
#studioGenCube {
  max-width: min(40%, 320px);
}

/* 1440 以下：收窄右栏 */
@media (max-width: 1440px) {
  :root { --rail-w: clamp(220px, 18vw, 260px); --mj-w: clamp(240px, 20vw, 290px); }
}

/* 1180 以下：参数面板改为内容区下方整行 */
@media (max-width: 1180px) {
  .media-workspace.has-model-parameters,
  .media-workspace.has-mj-parameters {
    grid-template-columns: minmax(0, 1fr) var(--rail-w) !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
  }
  .media-workspace.has-model-parameters > .studio-model-parameters,
  .media-workspace.has-mj-parameters > .studio-mj-parameters {
    grid-column: 1 !important;
    grid-row: 2 !important;
    max-height: 34dvh;
  }
  .media-workspace.has-model-parameters > .works-rail,
  .media-workspace.has-mj-parameters > .works-rail {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
  }
}

/* 980 以下：单列 */
@media (max-width: 980px) {
  .media-workspace,
  .media-workspace.has-model-parameters,
  .media-workspace.has-mj-parameters {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) auto auto !important;
  }
  .media-workspace > .media-center { grid-column: 1 !important; grid-row: 1 !important; }
  .media-workspace > .studio-model-parameters,
  .media-workspace > .studio-mj-parameters {
    grid-column: 1 !important;
    grid-row: 2 !important;
    max-height: 30dvh;
  }
  .media-workspace > .works-rail { grid-column: 1 !important; grid-row: 3 !important; max-height: 32dvh; }
  #studioGenCube { display: none; }
  #studioGalleryNav button { width: 32px; height: 46px; }
}

/* 760 以下 */
@media (max-width: 760px) {
  .composer-options { gap: 6px; }
  #studioGalleryNav button { width: 28px; height: 42px; font-size: 16px; }
  .media-workspace > .works-rail { max-height: 26dvh; }
}