/* ============================================================
   quiz-editor.css —— 组卷独立页（作业 / 试卷共用）
   ------------------------------------------------------------
   第 261101 轮：照章节编辑页（admin-editor.css 的 .rt-*）重做形态。
   整页固定成一个纵向 flex（body.qe-page，100dvh、不滚动）：
     .qe-bar     玻璃工具条        flex:0 0 auto
     .qe-main    唯一的滚动块      flex:1 1 auto; min-height:0
     .qe-status  底部状态条        flex:0 0 auto
   本文件只放 .qe-* 前缀；令牌与深浅色跟随 admin-tokens.css。
   ============================================================ */

/* ---------- 整页框 ----------
   admin-tokens.css 给 body 加了 min-height:100vh，这里必须盖掉，
   否则内容比屏幕高时整页会滚、工具条跟着跑。 */
.qe-page {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

/* ---------- 顶部工具条（玻璃底，常驻顶上） ---------- */
.qe-bar {
    position: relative;
    z-index: 30;
    flex: 0 0 auto;
    background: var(--mz-surface-comp, rgba(255, 255, 255, .86));
    border-bottom: 1px solid var(--mz-line, rgba(20, 30, 40, .10));
    backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
    -webkit-backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
}

.qe-bar__in {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 8px 16px;
}

.qe-back {
    flex: 0 0 auto;
    font-size: var(--cc-fs-sm);
    color: var(--mz-ink-2, #445065);
    text-decoration: none;
    padding: 4px 10px;
    border: 1px solid var(--mz-line, rgba(20, 30, 40, .12));
    border-radius: var(--cc-r-full);
    transition: color .16s, border-color .16s, background .16s;
}

.qe-back:hover,
.qe-back:focus-visible {
    color: var(--cc-brand);
    border-color: var(--cc-brand);
    background: var(--cc-brand-soft);
    outline: none;
}

.qe-tag {
    flex: 0 0 auto;
    padding: 2px 10px;
    border-radius: var(--cc-r-full);
    background: var(--cc-brand-soft);
    color: var(--mz-ink, #1b2430);
    font-size: var(--cc-fs-xs);
    letter-spacing: .08em;
}

.qe-title {
    flex: 0 1 auto;
    min-width: 0;
    font-size: var(--cc-fs-lg);
    font-weight: 700;
    color: var(--mz-ink, #1b2430);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.qe-spacer { flex: 1 1 auto; }

/* 面板的保存 / 发布 / 刷新按钮搬进来以后，按工具条的高度收一收 */
.qe-ops {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.qe-ops:empty { display: none; }

.qe-ops .cc-btn { min-height: 0; padding: 5px 12px; }

.qe-preview {
    flex: 0 0 auto;
    font-size: var(--cc-fs-sm);
    color: var(--mz-ink-2, #445065);
    text-decoration: none;
    padding: 4px 10px;
    border: 1px solid var(--mz-line, rgba(20, 30, 40, .12));
    border-radius: var(--cc-r-full);
    transition: color .16s, border-color .16s, background .16s;
}

.qe-preview:hover,
.qe-preview:focus-visible {
    color: var(--cc-brand);
    border-color: var(--cc-brand);
    background: var(--cc-brand-soft);
    outline: none;
}

/* ---------- 试卷区：全页唯一滚动块 ---------- */
.qe-main {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 16px 26px 34px;
    scroll-behavior: smooth;
}

.qe-pane {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

/* 面板自带的卡片在外层已经给了间距，这里不再叠 */
.qe-pane .cc-card { margin: 0; }

/* 操作组搬走后卡片头只剩标题与说明，留白收一点 */
.qe-pane .cc-card-head-ops:empty { display: none; }

/* 面板里的长表格在窄屏可以横向滚 */
.qe-pane .cc-table-wrap { overflow-x: auto; }

/* ---------- 底部状态条 ---------- */
.qe-status {
    position: relative;
    z-index: 31;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 6px 16px;
    font-size: var(--cc-fs-xs);
    line-height: 1.5;
    color: var(--mz-ink-2, #445065);
    background: var(--mz-surface-comp, rgba(255, 255, 255, .86));
    border-top: 1px solid var(--mz-line, rgba(20, 30, 40, .10));
    backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
    -webkit-backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
}

.qe-status a { color: var(--cc-brand); }

/* 未登录时的那一个动作：做成普通文字链接（不用底衬按钮，
   这套控制台样式表里的按钮依赖外壳栅格，单页里不保证字体渲染） */
.qe-cta {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 0;
    color: #2563eb;
    font-size: var(--cc-fs-sm);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.qe-cta:hover,
.qe-cta:focus-visible {
    color: #1d4ed8;
    outline: none;
}

/* ---------- 窄屏：工具条仍常驻，标题单独一行 ---------- */
@media (max-width: 960px) {
    .qe-main { padding: 12px 14px 26px; }
    .qe-bar__in { padding: 7px 12px; gap: 8px; }
    .qe-status { padding: 6px 12px; }
}

@media (max-width: 720px) {
    .qe-title { width: 100%; order: 3; white-space: normal; font-size: var(--cc-fs-md); }
    .qe-ops { flex: 1 1 auto; justify-content: flex-end; }
    .qe-ops .cc-btn { flex: 1 1 auto; text-align: center; }
}/* ============================================================
   §3 组卷页两栏（.qx-*）：左题型目录 / 右当前题目
   ------------------------------------------------------------
   形态照超星组卷页的左栏（题量·总分 → 批量操作 → 按题型分组的
   题号目录），但只取结构：颜色、圆角、字号全走 admin-tokens。
   两栏各自滚动，页面本身不滚（.qe-main--flat 去掉主轴滚动与内边距）。
   ============================================================ */

/* ---------- 第二行工具条：添加题目 ---------- */
.qe-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 16px 8px;
    /* 不能裁切：这里的「更多题型 / 选题」是绝对定位下拉，
       overflow 一旦不是 visible，菜单就会开在裁剪区里，看着像点了没反应。
       窄屏靠换行，不靠横向滚动。 */
    overflow: visible;
    flex-wrap: wrap;
}

.qe-tools:empty { display: none; }

.qe-tools .cc-btn {
    min-height: 0;
    padding: 4px 10px;
    font-size: var(--cc-fs-xs);
}

/* ---------- 标题行：试卷标题（在标题栏下面、添加题目上面） ---------- */
.qe-titlerow {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px 8px;
}

.qe-titlerow:empty { display: none; }

.qx-title-field {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 1 1 auto;
    min-width: 0;
}

.qx-title-label {
    flex: 0 0 auto;
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    color: var(--mz-ink, #14181f);
    white-space: nowrap;
}

.qx-title-field .cc-input {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 640px;
    font-weight: 600;
}

.qx-title-hint {
    flex: 0 0 auto;
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2, #4b5565);
    white-space: nowrap;
}

@media (max-width: 720px) {
    .qe-titlerow { flex-wrap: wrap; }
    .qx-title-label { font-size: var(--cc-fs-xs); }
    .qx-title-field { flex-wrap: wrap; }
    .qx-title-field .cc-input { max-width: none; }
    .qx-title-hint { display: none; }
}

/* 试卷组卷页：主轴不再整页滚，两栏自己滚。
   用 flex 撑满而不是 height:100%：主轴在整页 flex 里高度是算出来的，
   百分比高度在部分浏览器里会塌成 0，两栏就滚不动了。 */
.qe-main--flat {
    display: flex;
    overflow: hidden;
    padding: 0;
}

.qe-main--flat .qe-pane {
    flex: 1 1 auto;
    min-height: 0;
    max-width: none;
    gap: 0;
    height: auto;
}

/* ---------- 外壳 ---------- */
.qx-shell {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

.qx-split {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: 276px minmax(0, 1fr);
}

.qx-spacer { flex: 1 1 auto; }

/* ---------- 左栏：题型目录 ---------- */
/* 目录只用一条右线分界，不再自己铺一层浅底（页面底就是那张纸） */
.qx-side {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: transparent;
    border-right: 1px solid var(--mz-line);
    padding: 0 0 24px;
}

.qx-outline { display: flex; flex-direction: column; }

.qx-ol-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px 10px;
    /* 吸顶件要压住底下滚过的题号：半透明白 + 模糊，不铺第二块实底 */
    background: var(--mz-glass-2, rgba(255, 255, 255, .5));
    -webkit-backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
    backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
    border-bottom: 1px solid var(--mz-line);
}

.qx-ol-total {
    flex: 1 1 auto;
    margin: 0;
    font-size: var(--cc-fs-sm);
    color: var(--mz-ink-2);
}

.qx-ol-total i {
    font-style: normal;
    font-weight: 700;
    color: var(--cc-brand-text);
}

.qx-ol-link {
    flex: 0 0 auto;
    border: 0;
    background: none;
    padding: 2px 0;
    font-size: var(--cc-fs-xs);
    color: var(--cc-brand);
    cursor: pointer;
    text-decoration: none;
}

.qx-ol-link:hover { text-decoration: underline; }

.qx-ol-link--danger { color: #dc2626; }

.qx-ol-batch {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 8px 14px;
    background: var(--cc-brand-soft);
    border-bottom: 1px solid var(--mz-line);
}

.qx-ol-batch .cc-input { max-width: 74px; padding: 3px 8px; font-size: var(--cc-fs-xs); }

.qx-ol-tip {
    padding: 6px 14px 10px;
    font-size: var(--cc-fs-xs);
    line-height: 1.6;
    color: var(--mz-ink-2);
}

.qx-ol-empty {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 22px 14px;
    font-size: var(--cc-fs-xs);
    line-height: 1.7;
    color: var(--mz-ink-2);
}

/* 题型分组 */
.qx-group { border-bottom: 1px solid var(--mz-line); }

.qx-group-head {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px 8px;
    font-size: var(--cc-fs-xs);
}

.qx-group-check { display: inline-flex; align-items: center; margin-right: 2px; }

.qx-group-no {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border-radius: var(--cc-r-full);
    background: var(--cc-brand-soft);
    color: var(--cc-brand-text);
    font-size: 11px;
    line-height: 18px;
    text-align: center;
}

.qx-group-name { font-weight: 600; color: var(--mz-ink); }

.qx-group-meta {
    color: var(--mz-ink-3);
    font-variant-numeric: tabular-nums;
}

/* 组头右侧的「设置小题题号」下拉与「题型说明」按钮 */
.qx-group-num {
    margin-left: auto;
    height: 22px;
    padding: 0 4px;
    font-size: 11px;
    border: 1px solid var(--mz-line);
    border-radius: var(--cc-r-sm);
    background: transparent;
    color: var(--mz-ink-2);
}

.qx-group-op {
    flex: 0 0 auto;
    padding: 2px 6px;
    border: 0;
    border-radius: var(--cc-r-sm);
    background: none;
    color: var(--mz-ink-3);
    font-family: inherit;
    font-size: 11px;
    cursor: pointer;
    transition: background .14s, color .14s;
}

.qx-group-op:hover {
    background: var(--cc-brand-soft);
    color: var(--cc-brand-text);
}

/* 拖到分组标题上：整组末尾落点 */
.qx-group-head.is-drop {
    background: var(--cc-brand-soft);
    box-shadow: inset 0 0 0 1px var(--cc-brand);
}

/* 题号行 */
.qx-list { margin: 0; padding: 0 0 8px; list-style: none; }

.qx-row {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
    cursor: pointer;
    border-left: 2px solid transparent;
    transition: background .14s, border-color .14s, color .14s;
}

.qx-row:hover { background: var(--cc-hover); }

.qx-row.is-active {
    background: var(--cc-brand-soft);
    border-left-color: var(--cc-brand);
    color: var(--mz-ink);
}

.qx-row-check { display: inline-flex; align-items: center; }

.qx-row-no {
    flex: 0 0 auto;
    min-width: 18px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.qx-row.is-active .qx-row-no { color: var(--cc-brand-text); font-weight: 700; }

.qx-row-score {
    flex: 0 0 auto;
    padding: 1px 6px;
    border-radius: var(--cc-r-full);
    background: transparent;
    border: 1px solid var(--mz-line);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.qx-row-stem {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 拖动柄：只在悬停 / 当前行显形，免得目录被一排图标切碎 */
.qx-row-drag {
    flex: 0 0 auto;
    width: 10px;
    font-size: 12px;
    line-height: 1;
    color: var(--mz-ink-2);
    opacity: 0;
    cursor: grab;
    user-select: none;
    transition: opacity .14s, color .14s;
}

.qx-row:hover .qx-row-drag,
.qx-row.is-active .qx-row-drag { opacity: .7; }

.qx-row:active .qx-row-drag { cursor: grabbing; }

/* 行内操作：组内上移 / 下移 / 删除。
   浮在行右端而不是排在流里：276px 的目录里，序号 + 分值已经占掉一截，
   三个图标若再占位，题干只剩几个字的宽度。悬停时它盖住分值小标签，
   分值在右栏题目头里随时能看，不冲突。 */
.qx-row-ops {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    gap: 2px;
    padding-left: 4px;
    /* 悬停时它盖住行内的分值小标签，所以这里必须有底：半透明白 + 模糊 */
    background: var(--mz-glass-2, rgba(255, 255, 255, .5));
    -webkit-backdrop-filter: blur(var(--mz-blur, 14px));
    backdrop-filter: blur(var(--mz-blur, 14px));
    opacity: 0;
    pointer-events: none;
    transition: opacity .14s;
}

.qx-row:hover .qx-row-ops,
.qx-row.is-active .qx-row-ops,
.qx-row:focus-within .qx-row-ops { opacity: 1; pointer-events: auto; }

.qx-row-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--cc-r-sm, 6px);
    background: transparent;
    color: var(--mz-ink-2);
    cursor: pointer;
    transition: color .14s, border-color .14s, background .14s;
}

.qx-row-btn .cc-icon { width: 12px; height: 12px; }

.qx-row-btn:hover,
.qx-row-btn:focus-visible {
    color: var(--cc-brand);
    border-color: var(--mz-line);
    background: var(--cc-surface);
    outline: none;
}

/* 拖拽态：被拖的行淡出，落点行给一条品牌色虚线 */
.qx-row.is-dragging { opacity: .45; }

.qx-row.is-drop {
    background: var(--cc-brand-soft);
    box-shadow: inset 0 0 0 1px var(--cc-brand);
}

@media (hover: none) {
    .qx-row-drag,
    .qx-row-ops { opacity: 1; }
    .qx-row-ops { pointer-events: auto; }
}

/* ---------- 右栏：当前题目 ---------- */
.qx-main {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 22px 40px;
}

.qx-qbody { display: flex; flex-direction: column; gap: 14px; }

/* 顶部题号条（粘在这栏顶部，翻题不用回滚） */
.qx-qbar {
    position: sticky;
    top: -14px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: -14px -22px 0;
    padding: 10px 22px;
    background: var(--mz-surface-comp);
    border-bottom: 1px solid var(--mz-line);
    backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
    -webkit-backdrop-filter: blur(var(--mz-blur, 14px)) saturate(var(--mz-blur-sat, 160%));
    font-size: var(--cc-fs-sm);
}

.qx-qbar-no { font-weight: 600; color: var(--mz-ink); font-variant-numeric: tabular-nums; }

.qx-qbar-tag {
    padding: 1px 8px;
    border-radius: var(--cc-r-full);
    background: var(--cc-brand-soft);
    color: var(--cc-brand-text);
    font-size: var(--cc-fs-xs);
}

.qx-nav {
    border: 1px solid var(--mz-line);
    background: transparent;
    color: var(--mz-ink-2);
    border-radius: var(--cc-r-full);
    padding: 3px 12px;
    font-size: var(--cc-fs-xs);
    cursor: pointer;
}

.qx-nav:hover:not(:disabled) { border-color: var(--cc-brand); color: var(--cc-brand); }

.qx-nav:disabled { opacity: .42; cursor: default; }

/* 空卷欢迎块：只留一条虚线边界，不铺底 */
.qx-hello {
    padding: 30px 26px;
    border: 1px dashed var(--mz-line);
    border-radius: var(--cc-r-lg);
    background: transparent;
}

.qx-hello h2 { margin: 0 0 8px; font-size: var(--cc-fs-lg); color: var(--mz-ink); }

.qx-hello p { margin: 0 0 6px; font-size: var(--cc-fs-sm); line-height: 1.8; color: var(--mz-ink-2); }

.qx-hello-tip { color: var(--cc-brand-text); }

/* 试卷信息（可折叠）：从「卡」降成「一段」—— 上一条发丝线 + 一行标题 */
.qx-info {
    border: 0;
    border-bottom: 1px solid var(--mz-line);
    border-radius: 0;
    background: transparent;
    overflow: hidden;
    margin-bottom: 14px;
}

.qx-info-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 2px;
    background: transparent;
}

.qx-info-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: none;
    padding: 0;
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    color: var(--mz-ink);
    cursor: pointer;
}

.qx-info-toggle .cc-icon { transition: transform .18s; }

.qx-info-toggle[aria-expanded="true"] .cc-icon { transform: rotate(90deg); }

.qx-info-sum {
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.qx-info-body { padding: 4px 14px 12px; }

.qx-info-body[hidden] { display: none; }

/* 块（组）：一个大题 = 一段，靠上下发丝线分界，不再各包一张卡 */
.qx-block {
    border: 0;
    border-top: 1px solid var(--mz-line);
    border-radius: 0;
    background: transparent;
    overflow: hidden;
}

.qx-block-head {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 9px 0;
    background: transparent;
}

/* 块头里的类型标：只描边 */
.qx-block-tag {
    padding: 1px 7px;
    border-radius: var(--cc-r-xs);
    background: transparent;
    border: 1px solid var(--mz-line);
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
}

.qx-block-title { font-size: var(--cc-fs-sm); font-weight: 600; color: var(--mz-ink); }

.qx-block-num { font-size: var(--cc-fs-xs); color: var(--mz-ink-2); }

.qx-block-type { max-width: 190px; font-size: var(--cc-fs-xs); padding: 3px 8px; }

/* 块头右半边：小题数 · 本块分值、删块按钮 */
.qx-block-meta {
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-3);
    font-variant-numeric: tabular-nums;
}

.qx-block-del {
    flex: 0 0 auto;
    padding: 2px 8px;
    border: 1px solid var(--mz-line);
    border-radius: var(--cc-r-full);
    background: transparent;
    color: var(--mz-ink-3);
    font-family: inherit;
    font-size: 11px;
    cursor: pointer;
    transition: color .14s, border-color .14s, background .14s;
}

.qx-block-del:hover {
    border-color: var(--cc-danger);
    background: var(--cc-danger-soft);
    color: var(--cc-danger);
}

/* 语篇输入 + ##n## 空位条 */
.qx-passage {
    min-height: 132px;
    line-height: 1.9;
    font-family: var(--cc-font-serif, Georgia, 'Songti SC', serif);
}

.qx-slotbar-box { margin: -4px 0 4px; }

.qx-slotbar {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    padding: 4px 2px;
    font-size: 11px;
    color: var(--mz-ink-3);
}

.qx-slotbar-label {
    color: var(--mz-ink-2);
    font-weight: 600;
}

.qx-slot {
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: var(--cc-r-full);
    background: var(--cc-brand-soft);
    color: var(--cc-brand-text);
    font-size: 11px;
    line-height: 18px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.qx-slotbar-tip { color: var(--mz-ink-3); }

.qx-slotbar.is-bad .qx-slotbar-tip { color: var(--cc-danger); }

.qx-block-more { border-top: 1px solid var(--mz-line); }

.qx-block-more > summary {
    padding: 8px 14px;
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
    cursor: pointer;
    list-style: none;
}

.qx-block-more > summary::-webkit-details-marker { display: none; }

.qx-block-more > summary::before {
    content: '▸ ';
    color: var(--cc-brand);
}

.qx-block-more[open] > summary::before { content: '▾ '; }

.qx-block-form { padding: 0 14px 12px; }

.qx-block-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
}

/* 单题：块里的一节，用一条上发丝线分隔（别在块卡里再包一张卡） */
.qx-item {
    border: 0;
    border-top: 1px solid var(--mz-line);
    border-radius: 0;
    background: transparent;
    padding: 12px 0 14px;
}

.qx-item-head {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--mz-line);
}

.qx-item-no { font-size: var(--cc-fs-md); font-weight: 700; color: var(--mz-ink); }

.qx-item-label { font-size: var(--cc-fs-xs); color: var(--mz-ink-2); }

.qx-item-type { max-width: 180px; font-size: var(--cc-fs-xs); padding: 3px 8px; }

.qx-item .cc-field-item-head { display: none; }

/* ---------- 窄屏：目录折到上面，变成一条横向条 ---------- */
@media (max-width: 860px) {
    .qx-split { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 34%) minmax(0, 1fr); }
    .qx-side { border-right: 0; border-bottom: 1px solid var(--mz-line); }
    .qx-main { padding: 12px 14px 30px; }
    .qx-qbar { margin: -12px -14px 0; padding: 8px 14px; top: -12px; }
    .qx-info-body { padding: 4px 12px 10px; }
    .qe-tools { padding: 0 12px 8px; }
}

@media (max-width: 560px) {
    .qx-row-stem { display: none; }
    .qx-nav { padding: 3px 9px; }
    .qx-hello { padding: 20px 16px; }
}/* ---------- 「添加题目」工具条（搬进 .qe-tools 以后仍按这套排） ---------- */
.qx-toolrow {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
}

.qx-tool-title {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex: 0 0 auto;
}

.qx-tool-name {
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    color: var(--mz-ink);
    white-space: nowrap;
}

.qx-bubble {
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
    white-space: nowrap;
}

.qx-tool-types {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
}

.qx-type-btn {
    border: 1px solid var(--mz-line);
    background: transparent;
    border-radius: var(--cc-r-full);
    padding: 3px 12px;
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
    white-space: nowrap;
    cursor: pointer;
    transition: color .14s, border-color .14s, background .14s;
}

.qx-type-btn:hover,
.qx-type-btn:focus-visible {
    border-color: var(--cc-brand);
    color: var(--cc-brand);
    background: var(--cc-brand-soft);
    outline: none;
}

.qx-tool-hint {
    font-size: var(--cc-fs-xs);
    color: var(--mz-ink-2);
    white-space: nowrap;
    /* 这一格现在放的是试卷编号 / 状态 / 题量，长编号也不许把工具条撑破 */
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    flex: 0 1 auto;
}

@media (max-width: 1100px) {
    .qx-bubble { display: none; }
    .qx-tool-hint { flex: 1 1 100%; order: 9; }
}/* ---------- 窄屏：左目录收到上方的可滚块，整页回到「一个主轴滚动」 ---------- */
@media (max-width: 900px) {
    .qx-split { grid-template-columns: 216px minmax(0, 1fr); }
    .qx-main { padding: 12px 14px 32px; }
    .qx-qbar { margin: -12px -14px 0; padding: 8px 14px; top: -12px; }
    .qx-ol-head { padding: 8px 12px; }
    .qx-row { padding: 6px 12px; gap: 6px; }
}

@media (max-width: 720px) {
    /* 两栏改成上下两段，交给外层主轴统一滚 */
    .qe-main--flat { overflow-y: auto; }
    .qe-main--flat .qe-pane { height: auto; }
    .qx-shell { height: auto; }
    .qx-split { display: block; }
    .qx-side {
        max-height: 38vh;
        border-right: none;
        border-bottom: 1px solid var(--mz-line);
        padding-bottom: 4px;
    }
    .qx-main { overflow-y: visible; padding: 12px 12px 28px; }
    .qx-qbar {
        position: static;
        margin: 0 0 10px;
        flex-wrap: wrap;
        gap: 6px 8px;
    }
    .qx-row-drag,
    .qx-row-ops { opacity: 1; }
    .qx-row-ops { pointer-events: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .qx-row,
    .qx-row-drag,
    .qx-row-ops,
    .qx-row-btn { transition: none; }
}