/* ============================================================
   全屏"采样 & 鼓组管理"界面
   与鼓机主体（.app）同尺寸：占满 app-scaler，点击后整体切换
   ============================================================ */

.fullscreen-sample-manager {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg);
  padding: 16px;
  box-sizing: border-box;
  overflow: auto;
  color: var(--text);
}

.fullscreen-sample-manager[hidden] {
  display: none;
}

/* 内部壳层：与鼓机主体近似，宽度固定 1360，高度取视口与上限的较小值 */
.fullscreen-sample-manager .sm-shell {
  flex-shrink: 0;
  width: min(var(--app-width, 1360px), calc(100vw - 32px));
  height: min(calc(100vh - 32px), 900px);
  min-height: 480px;
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border-radius: 4px;
  overflow: hidden;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    inset 0 -1px 0 rgba(0, 0, 0, 0.45),
    0 2px 0 rgba(0, 0, 0, 0.15),
    0 8px 24px rgba(0, 0, 0, 0.32),
    0 24px 60px var(--shadow),
    0 48px 100px rgba(0, 0, 0, 0.35);
}

/* 鼓机主体隐藏时强制不显示（.app 自带 display:flex 会覆盖 UA 的 hidden 规则） */
.app[hidden] {
  display: none !important;
}

/* 顶部标题栏 */
.fullscreen-sample-manager .sm-header {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent);
}

.fullscreen-sample-manager .sm-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.2px;
  flex-shrink: 0;
}

.sm-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #242424;
  color: var(--text-muted);
  font-size: 13px;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, box-shadow 0.25s ease;
}

.sm-back-btn:hover {
  border-color: #555;
  color: var(--text);
  box-shadow: 0 0 14px 3px rgba(255, 255, 255, 0.1);
}

.sm-back-btn:active {
  transform: scale(0.96);
}

/* 标题栏右侧：保存 / 恢复默认 */
.sm-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

.fullscreen-sample-manager .sm-header-actions .sm-btn {
  min-height: 30px;
  padding: 6px 14px;
}

.sm-btn.primary {
  color: #e8f0ff;
  border-color: rgba(138, 180, 255, 0.5);
  background: rgba(138, 180, 255, 0.14);
}

.sm-btn.primary:hover:not(:disabled) {
  border-color: #8ab4ff;
  color: #ffffff;
  box-shadow: 0 0 12px 2px rgba(138, 180, 255, 0.2);
}

.sm-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  box-shadow: none;
}

.fullscreen-sample-manager .sm-status {
  margin: 0 0 0 auto;
  flex-shrink: 0;
}

/* 主内容：左右分栏 */
.fullscreen-sample-manager .sm-container {
  flex: 1;
  min-height: 0;
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
}

.fullscreen-sample-manager .sm-two-column-layout {
  flex: 1;
  min-height: 0;
  height: auto;
  display: flex;
  gap: 18px;
}

/* 左：采样库（固定窄栏，不参与平分，靠左） */
.fullscreen-sample-manager .sm-column-left {
  flex: 0 0 320px;
  width: 320px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}

/* 右：鼓组编辑器 */
.fullscreen-sample-manager .sm-column-right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* 左侧上传区与库标题 */
.fullscreen-sample-manager .sm-upload-zone {
  flex-shrink: 0;
}

.fullscreen-sample-manager .sm-library-header {
  flex-shrink: 0;
}

.fullscreen-sample-manager .sm-library {
  flex: 1;
  min-height: 0;
  /* 解除 style.css 旧弹窗时代残留的 max-height:42vh 截断，让容器撑满左栏 */
  max-height: none;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* 两个分区各自独立滚动，充分利用左栏高度 */
.fullscreen-sample-manager .sm-lib-section.user {
  flex: 0 1 auto;
  max-height: 50%;
  overflow-y: auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fullscreen-sample-manager .sm-lib-section.builtin {
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* 分区是定高 flex 列：内容超高时必须走滚动，禁止子项被压缩
   （否则文件夹/采样条目会塌陷成 1px 边框线） */
.fullscreen-sample-manager .sm-lib-section > * {
  flex-shrink: 0;
}

/* 右侧编辑器头部 */
.fullscreen-sample-manager .sm-kit-editor-header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 12px;
}

.fullscreen-sample-manager .sm-kit-editor-header h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

.sm-kit-selector {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 260px;
  flex-shrink: 0;
}

.sm-kit-select-label {
  font-size: 12px;
  color: var(--text-muted);
  white-space: nowrap;
  flex-shrink: 0;
}

.sm-kit-select {
  flex: 1;
  min-width: 0;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #1e1e1e;
  color: var(--text);
  font-size: 13px;
}

.sm-kit-select:focus {
  outline: none;
  border-color: #666;
}

.fullscreen-sample-manager .sm-kit-editor {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  background: rgba(0, 0, 0, 0.12);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
}

.sm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #242424;
  color: var(--text-muted);
  font-size: 12px;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, box-shadow 0.25s ease;
  white-space: nowrap;
}

.sm-btn:hover {
  border-color: #555;
  color: var(--text);
  box-shadow: 0 0 12px 2px rgba(255, 255, 255, 0.08);
}

.sm-btn:active {
  transform: scale(0.96);
}

.sm-btn.danger:hover {
  border-color: #d32f2f;
  color: #ff6b6b;
  background: rgba(211, 47, 47, 0.08);
}

/* 采样库标题栏的"删除未分配"是文字按钮，不是圆形小叉 */
.fullscreen-sample-manager .sm-library-header .sm-btn.danger,
.fullscreen-sample-manager .sm-kit-actions .sm-btn.danger {
  width: auto;
  height: auto;
  min-height: 30px;
  padding: 5px 10px;
  font-size: 11px;
}

.fullscreen-sample-manager .sm-kit-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

/* ---------- 鼓组编辑器内容（工具条 / 通道行 / 采样槽） ---------- */
.sm-kit-editor-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  background: #1c1c1c;
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 14px;
}

.sm-kit-name-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 1;
  min-width: 0;
}

.sm-kit-name-field label {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.sm-kit-name-input {
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #151515;
  color: var(--text);
  font-size: 15px;
  font-weight: 600;
}

.sm-kit-name-input:focus {
  outline: none;
  border-color: #666;
}

.sm-kit-editor-rows,
.sm-kit-editor-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sm-kit-row {
  display: flex;
  align-items: stretch;
  gap: 12px;
  padding: 10px 12px;
  background: #1c1c1c;
  border: 1px solid var(--border);
  border-radius: 10px;
}

.sm-kit-row-label {
  flex: 0 0 160px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 4px;
}

.sm-kit-row-name {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sm-kit-row-en-input,
.sm-kit-row-zh-input,
.sm-kit-row-name-input {
  width: 100%;
  box-sizing: border-box;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #151515;
  color: var(--text);
  font-size: 12px;
}

.sm-kit-row-en-input:focus,
.sm-kit-row-zh-input:focus,
.sm-kit-row-name-input:focus {
  outline: none;
  border-color: #666;
}

.sm-kit-row-actions {
  display: flex;
  gap: 6px;
}

.sm-kit-row-action {
  padding: 4px 9px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: transparent;
  color: var(--text-muted);
  font-size: 11px;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.sm-kit-row-action:hover {
  border-color: #555;
  color: var(--text);
  background: #242424;
}

.sm-kit-row-action.danger:hover {
  border-color: #d32f2f;
  color: #ff6b6b;
  background: rgba(211, 47, 47, 0.1);
}

/* 采样槽（拖放目标区） */
.sm-kit-row-samples {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 6px;
  padding: 8px;
  border: 1.5px dashed rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.18);
  transition: border-color 0.15s, background 0.15s;
}

.sm-kit-row-samples.dragover {
  border-color: #8ab4ff;
  background: rgba(138, 180, 255, 0.08);
}

.sm-kit-sample {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  background: #242424;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 11px;
  color: var(--text);
  cursor: grab;
  user-select: none;
  transition: border-color 0.15s, opacity 0.15s;
}

.sm-kit-sample:active {
  cursor: grabbing;
}

/* 拖拽中的采样块与插入位置指示 */
.sm-kit-sample.dragging {
  opacity: 0.4;
}

.sm-kit-sample.drop-before {
  box-shadow: inset 3px 0 0 0 #8ab4ff;
  border-color: #8ab4ff;
}

.sm-kit-sample.drop-after {
  box-shadow: inset -3px 0 0 0 #8ab4ff;
  border-color: #8ab4ff;
}

.sm-kit-sample:hover {
  border-color: #555;
}

.sm-kit-sample-name {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sm-kit-sample-slot {
  font-size: 10px;
  color: var(--text-muted);
  white-space: nowrap;
}

.sm-kit-sample-play {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: transparent;
  color: var(--text-muted);
  font-size: 9px;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}

.sm-kit-sample-play:hover {
  border-color: #555;
  color: var(--text);
}

/* 底部添加行 */
.sm-kit-row-add {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 12px;
  background: #1c1c1c;
  border: 1px solid var(--border);
  border-radius: 10px;
}

.sm-kit-row-add select {
  flex: 1;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #151515;
  color: var(--text);
  font-size: 12px;
}

.sm-kit-row-add button {
  padding: 6px 14px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #242424;
  color: var(--text);
  font-size: 12px;
  cursor: pointer;
}

.sm-kit-row-add button:hover {
  border-color: #555;
}

/* 空状态 */
.sm-empty {
  padding: 30px 10px;
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
}

/* 状态条（位于标题栏右侧） */
.fullscreen-sample-manager .sm-header .sm-status {
  margin-left: auto;
  max-width: 40%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 采样库分区：内置采样 / 我的上传 */
.fullscreen-sample-manager .sm-lib-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fullscreen-sample-manager .sm-section-title {
  margin: 6px 0 2px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.4px;
  color: var(--text-muted);
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--panel);
  padding: 4px 2px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* 新建文件夹按钮（分区标题右侧） */
.fullscreen-sample-manager .sm-folder-add {
  margin-left: auto;
  padding: 2px 8px;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #242424;
  color: var(--text-muted);
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, box-shadow 0.25s ease;
}

.fullscreen-sample-manager .sm-folder-add:hover {
  border-color: #555;
  color: var(--text);
  box-shadow: 0 0 12px 2px rgba(255, 255, 255, 0.08);
}

.fullscreen-sample-manager .sm-folder-add:active {
  transform: scale(0.96);
}

/* 新建文件夹的行内输入框 */
.fullscreen-sample-manager .sm-folder-new-input {
  width: 100%;
  padding: 6px 8px;
  border: 1px solid #666;
  border-radius: 6px;
  background: #1c1c1c;
  color: var(--text);
  font-size: 12px;
}

/* 文件夹标题上的操作按钮（重命名 / 删除） */
.fullscreen-sample-manager .sm-folder-action {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 5px;
  background: transparent;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s, background 0.15s, color 0.15s;
}

.fullscreen-sample-manager .sm-folder-summary:hover .sm-folder-action {
  opacity: 1;
}

.fullscreen-sample-manager .sm-folder-action:hover {
  background: rgba(255, 255, 255, 0.1);
  color: var(--text);
}

.fullscreen-sample-manager .sm-folder-action.danger:hover {
  background: rgba(211, 47, 47, 0.16);
  color: #ff6b6b;
}

/* 拖放高亮 */
.fullscreen-sample-manager .sm-folder-summary.drop-target,
.fullscreen-sample-manager .sm-user-root-head.drop-target {
  border-color: #8ab4ff;
  background: rgba(138, 180, 255, 0.12);
  box-shadow: inset 0 0 0 1px rgba(138, 180, 255, 0.4);
}

/* 根目录容器 */
.fullscreen-sample-manager .sm-user-root {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 2px;
}

.fullscreen-sample-manager .sm-user-root-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px dashed var(--border);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
}

.fullscreen-sample-manager .sm-folder-empty {
  padding: 10px;
  font-size: 12px;
}

/* 内置采样条目：不可删除，弱化操作区 */
.fullscreen-sample-manager .sm-library .sm-item.builtin .sm-meta {
  color: var(--text-muted);
  opacity: 0.85;
}

/* 内置采样文件夹：可折叠，按鼓组分组 */
.fullscreen-sample-manager .sm-folder {
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.02);
  overflow: hidden;
}

.fullscreen-sample-manager .sm-folder summary {
  list-style: none;
  cursor: pointer;
}

.fullscreen-sample-manager .sm-folder summary::-webkit-details-marker {
  display: none;
}

.fullscreen-sample-manager .sm-folder-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  user-select: none;
  transition: background 0.15s;
}

.fullscreen-sample-manager .sm-folder-summary:hover {
  background: rgba(255, 255, 255, 0.05);
}

/* 文件夹图标：简化的文件夹轮廓 */
.fullscreen-sample-manager .sm-folder-icon {
  flex-shrink: 0;
  width: 16px;
  height: 13px;
  border: 1.5px solid var(--text-muted);
  border-radius: 2px 2px 3px 3px;
  position: relative;
}

.fullscreen-sample-manager .sm-folder-icon::before {
  content: "";
  position: absolute;
  top: -4px;
  left: -1.5px;
  width: 7px;
  height: 3px;
  border: 1.5px solid var(--text-muted);
  border-bottom: none;
  border-radius: 2px 2px 0 0;
  background: transparent;
}

.fullscreen-sample-manager details[open] .sm-folder-icon {
  border-color: #8ab4ff;
}

.fullscreen-sample-manager details[open] .sm-folder-icon::before {
  border-color: #8ab4ff;
}

.fullscreen-sample-manager .sm-folder-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fullscreen-sample-manager .sm-folder-count {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 500;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  padding: 1px 7px;
}

/* 展开/折叠箭头 */
.fullscreen-sample-manager .sm-folder-summary::after {
  content: "";
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--text-muted);
  border-bottom: 1.5px solid var(--text-muted);
  transform: rotate(-45deg);
  transition: transform 0.15s ease;
}

.fullscreen-sample-manager details[open] .sm-folder-summary::after {
  transform: rotate(45deg);
}

.fullscreen-sample-manager .sm-folder-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px 10px;
  border-top: 1px solid var(--border);
}

/* 采样库条目：窄列内两行排布（名称行 + 操作行） */
.fullscreen-sample-manager .sm-library .sm-item {
  flex-wrap: wrap;
  gap: 6px 10px;
  cursor: grab;
}

.fullscreen-sample-manager .sm-library .sm-item.dragging {
  opacity: 0.45;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-play {
  width: 34px;
  height: 34px;
  min-height: 34px;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-info {
  flex: 1 1 120px;
  min-width: 0;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-assign {
  order: 3;
  flex: 1 1 100%;
  display: flex;
  gap: 6px;
  min-width: 0;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-cat {
  flex: 1 1 120px;
  max-width: none;
  min-width: 0;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-layer {
  flex: 0 0 96px;
  min-width: 0;
}

/* 层级下拉：与通道下拉同风格 */
.sm-layer {
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #242424;
  color: var(--text);
  font-size: 12px;
  cursor: pointer;
}

.sm-layer:focus {
  outline: none;
  border-color: #666;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-input {
  order: 2;
  flex: 1 1 90px;
  width: auto;
  min-width: 0;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-btn.danger {
  order: 4;
  width: 30px;
  height: 30px;
  min-height: 30px;
}

.fullscreen-sample-manager .sm-library .sm-item .sm-cat,
.fullscreen-sample-manager .sm-library .sm-item .sm-input,
.fullscreen-sample-manager .sm-library .sm-item .sm-btn.danger {
  margin-top: 2px;
}

.sm-kit-sample.user-layer {
  border-color: rgba(138, 180, 255, 0.4);
  background: rgba(138, 180, 255, 0.08);
}

/* 行内命名表单（新建/克隆鼓组，无弹窗） */
.sm-inline-form {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  margin-bottom: 12px;
  background: rgba(138, 180, 255, 0.07);
  border: 1px solid rgba(138, 180, 255, 0.35);
  border-radius: 10px;
}

.sm-inline-input {
  flex: 1;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #151515;
  color: var(--text);
  font-size: 13px;
}

.sm-inline-input:focus {
  outline: none;
  border-color: #8ab4ff;
}

.sm-inline-select {
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #151515;
  color: var(--text);
  font-size: 13px;
}

/* 滚动条：与鼓机整体风格一致（深色细条 + 柔和高光） */
.fullscreen-sample-manager,
.fullscreen-sample-manager .sm-container,
.fullscreen-sample-manager .sm-library,
.fullscreen-sample-manager .sm-kit-editor {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.22) rgba(255, 255, 255, 0.04);
}

.fullscreen-sample-manager ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.fullscreen-sample-manager ::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.04);
  border-radius: 5px;
}

.fullscreen-sample-manager ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 5px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

.fullscreen-sample-manager ::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.34);
  background-clip: padding-box;
}

.fullscreen-sample-manager ::-webkit-scrollbar-corner {
  background: transparent;
}

/* 移动端：改为上下堆叠，仍保持整体一屏 */
@media (max-width: 900px) {
  .fullscreen-sample-manager .sm-two-column-layout {
    flex-direction: column;
  }
  .fullscreen-sample-manager .sm-column-left {
    width: auto;
    height: 40%;
  }
}