.exam-client{
  --exam-nav-w:232px;
  --exam-nav-btn-font:16px;
  /* --exam-side-w:260px; */
  --exam-side-w:220px;
  --exam-judgment-icon-size:21px;
  --exam-judgment-icon-stroke:2;
  --exam-ui-text-size:16px;
  --exam-text-size-medium:20px;
  --exam-text-size-large:24px;
  --exam-text-size-xlarge:28px;
  --exam-text-size:var(--exam-text-size-medium);
  /* 主图（材料图 / 题干图）高度预算：随屏幕高度自适应，是「一屏内看到」的关键。
     宽度由各上下文容器上限约束，图片本身等比 contain、绝不裁切。 */
  --exam-image-max-h:min(44vh,440px);
  position:fixed;inset:0;z-index:12000;display:flex;flex-direction:column;
  /* 硬地板 = paper-exam-viewport.js 的 MIN_WIDTH，也 = paper-list-page.js 的
     准入门槛。三者必须相等，改一处要三处一起改（有单测锁死）。
     980 → 1037：原来的 980 比准入门槛 1025 还小，等于地板永远够不着，
     真正在兜底的是那道门槛，而那道门槛本身就定错了（见 viewport 模块注释）。
     注意这个 min-width 是布局单位，会被 style.zoom 一起缩放 —— 缩放后
     .exam-client 的布局宽是 视口 ÷ 系数，恒 ≥ 1440，所以正常路径下永不触发；
     它只兜「窗口被拖到极窄」这类 zoom 已撞下限的场景。 */
  min-width:1037px;background:var(--surface-3,#f3f4f6);color:var(--ink);font-family:var(--font,var(--sans));
}
/* 两档字号变量分工：--exam-text-size 是题面（题干 / 选项 / 材料 / 作答框），随「字号调整」变；
   --exam-ui-text-size 是界面框架（顶栏、答题卡、快捷功能、上一题/下一题），恒定 16px。
   题面三档：标准 20px / 较大 24px / 大 28px。
   考生调大字号是为了看清题目，框架跟着放大只会挤掉题面本就有限的宽度。 */
.exam-client.font-large{--exam-text-size:var(--exam-text-size-large);}
.exam-client.font-xlarge{--exam-text-size:var(--exam-text-size-xlarge);}
.exam-client[hidden]{display:none!important;}
.exam-client *{box-sizing:border-box;}
.exam-client button,.exam-client input,.exam-client textarea{font:inherit;}
/* 顶栏与左中右三块一样是浮在灰底上的白面板，所以给圆角、去掉底部描边 */
.exam-client-header{
  /* height:86px;flex:0 0 86px; */
  height:58px;flex:0 0 58px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  margin:10px 10px 0;padding:0 24px;border:0;border-radius:6px;background:#fff;
}
/* 顶栏卷名与列表卡同一条规则：最多两行（56px）。宽吃掉标题与右侧状态之间的剩余空间，
   不再人为卡 640px —— 泰语等长卷名在宽屏上仍有大量余量时不该提前截断。
   两行仍放不下时由 fitExamPaperTitle() 保留末尾 4 字；不要用 text-overflow:ellipsis。 */
.exam-client-brand{display:flex;align-items:center;gap:13px;flex:1 1 0;min-width:0;max-width:100%;}
.exam-client-brand img{
   /* width:44px;height:44px; */
   width:38px;height:38px;
   flex:0 0 44px;object-fit:contain;}
.exam-client-brand strong{
  display:block;min-width:0;flex:1 1 auto;max-width:100%;max-height:56px;overflow:hidden;
  font-family:inherit;font-size:20px;font-weight:700;line-height:28px;color:var(--ink);
  white-space:normal;overflow-wrap:anywhere;
}
.exam-client-status{flex:0 0 auto;min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:24px;}
/* 「结束听力预览」改红描边：它是一个可选的提前跳出，不是主线动作。
   实心红会让人以为这是「下一步」，而真正的下一步是继续听。 */
.exam-stage-action{min-width:124px;min-height:48px;padding:0 14px;border:1px solid rgba(229,41,74,.5);border-radius:6px;background:transparent;color:var(--red);font-size:var(--exam-ui-text-size);font-weight:700;line-height:1.4;white-space:nowrap;cursor:pointer;}
.exam-stage-action:hover:not(:disabled){border-color:var(--red);background:var(--red-light);color:var(--red);}
.exam-stage-action:focus-visible{outline:2px solid color-mix(in srgb,var(--red) 32%,transparent);outline-offset:2px;}
.exam-stage-action:disabled{border-color:#d7dadd;background:#eef0f2;color:#9299a2;cursor:not-allowed;}
.exam-stage-action[hidden]{display:none;}
.exam-client-time{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap;color:#0a1a38;}
.exam-client-time-phase{display:inline-flex;align-items:center;gap:4px;}
.exam-client-time-icon{width:28px;height:28px;flex:0 0 28px;display:block;object-fit:contain;}
.exam-client-time span{color:#0a1a38;font-size:20px;font-weight:700;line-height:26px;letter-spacing:0;}
.exam-client-time-label:empty{display:none;}
.exam-client-time strong{display:inline-flex;align-items:center;font-family:inherit;font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;}
.exam-time-cell{display:inline-flex;align-items:center;justify-content:center;width:35px;min-width:35px;height:34px;padding:0;border-radius:3px;background:#0a1a38;color:#fff;font-size:20px;font-weight:700;line-height:26px;}
.exam-time-sep{padding:0;color:var(--ink,#111827);font-size:20px;font-style:normal;font-weight:700;line-height:20px;}
.exam-client-body{flex:1;min-height:0;display:grid;grid-template-columns:var(--exam-nav-w) minmax(0,1fr) var(--exam-side-w);gap:10px;padding:10px;}
.exam-nav,.exam-stage,.exam-candidate{min-height:0;border:0;border-radius:6px;background:#fff;}
.exam-nav{display:flex;flex-direction:column;background:#fff;overflow:hidden;}
/* 答题卡图例：每个色块与 .exam-nav-button 的对应状态同源，改一处要同时改另一处 */
.exam-nav-legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 -12px 6px;padding:10px 12px;border-bottom:0;color:var(--ink-2);font-size:12px;line-height:1.5;}
.exam-nav-legend span{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;white-space:nowrap;}
.exam-nav-legend i{position:relative;width:14px;height:14px;flex:0 0 14px;border:1px solid var(--red);border-radius:2px;background:#fff;}
.exam-nav-legend .answered i{border-color:#FAD4DB;background:rgba(229,41,74,.2);}
.exam-nav-legend .partial i{border-color:var(--red);background:linear-gradient(90deg,#fad4db 0 50%,#fff 50% 100%);}
.exam-nav-legend .empty i{border-color:#f1f2f4;background:#fff;}
.exam-nav-legend .current i{border-color:var(--red);background:#fff;box-shadow:0 0 0 1px var(--red);}
.exam-nav-scroll{flex:1;min-height:0;overflow:auto;padding:13px 12px 22px;scrollbar-width:thin;}
/* Tab 条本身是灰底，选中那格用白色「浮」出来接上下方的白面板 —— 卡片式分页的
   常规做法：选中项与内容区连成一体，未选中项退到底色里。 */
.exam-nav-tabs{
  position:sticky;top:-13px;z-index:2;display:flex;align-items:stretch;
  margin:-13px -12px 12px;border-bottom:0;background:#f3f4f6;
}
.exam-nav-tab{
  flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;
  padding:10px 4px;border:0;background:#f3f4f6;color:var(--ink-2);
  text-align:center;font-family:inherit;font-size:var(--exam-ui-text-size);font-weight:500;line-height:1.25;cursor:pointer;
  overflow:visible;white-space:nowrap;
}
.exam-nav-tab:disabled{cursor:not-allowed;opacity:.55;}
.exam-nav-tab.active{background:#fff;border-radius:6px 6px 0 0;color:#0a1a38;font-weight:700;}
.exam-nav-tab.complete{background:#f3f4f6;color:var(--ink-3);}
.exam-nav-tab.active.complete{background:#fff;color:#0a1a38;}
.exam-nav-module{padding-bottom:0;margin-bottom:0;border-bottom:0;}
.exam-nav-module:last-child{border-bottom:0;margin-bottom:0;}
.exam-nav-module-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;color:var(--seal);font-size:var(--exam-nav-btn-font);font-weight:750;}
.exam-nav-module.locked .exam-nav-module-title{color:var(--ink-3);}
.exam-nav-section{margin-top:10px;}
.exam-nav-section:first-child{margin-top:0;}
.exam-nav-section-title{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:12px 0;color:var(--ink-2);font-size:var(--exam-nav-btn-font);line-height:1.5;text-align:center;}
.exam-nav-section-title::before,.exam-nav-section-title::after{content:'';flex:1;height:1px;background:var(--border);}
.exam-nav-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
/* 题号方块：36 高、圆角 3。作答状态全部落在边框与底色上，
   不动文字颜色 —— 一格才 41px 宽，靠字色区分四种状态是看不出来的。 */
.exam-nav-button{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;height:36px;padding:0 4px;border:1px solid #f1f2f4;border-radius:3px;overflow:hidden;
  background:#fff;color:#0a1a38;font-size:var(--exam-nav-btn-font);font-weight:400;line-height:1.5;white-space:nowrap;
}
/* 部分作答：左侧按作答比例铺一条浅粉，剩下留白，一眼看出「答了一半」 */
.exam-nav-button.partial{border-color:var(--red);background:linear-gradient(90deg,#fad4db 0 var(--answer-progress,50%),#fff var(--answer-progress,50%) 100%);}
.exam-nav-button:hover:not(:disabled){border-color:var(--red);}
.exam-nav-button.answered{border-color:#FAD4DB;background:rgba(229,41,74,.2);}
.exam-nav-button.current{border-color:var(--red);box-shadow:0 0 0 1px var(--red);}
.exam-nav-button.marked::after{content:'';position:absolute;right:2px;top:-4px;width:11px;height:16px;background:#ffbf65;clip-path:polygon(0 0,100% 0,100% 100%,50% 76%,0 100%);}
.exam-nav-button.example{color:#0a1a38;background:#f3f4f6;border-color:#f3f4f6;}
.exam-nav-button.range{grid-column:span 2;}
.exam-nav-label{display:block;line-height:24px;}
.exam-nav-audio-wave{position:absolute;right:0;bottom:1px;left:0;display:flex;align-items:flex-end;justify-content:center;gap:2px;height:10px;color:var(--red);pointer-events:none;}
.exam-nav-audio-wave i{display:block;width:3px;height:4px;border-radius:20px 20px 0 0;background:currentColor;
  /* 锚在底边：scaleY 默认绕中心缩放，音柱会连底一起往上跑，看着像整条在飘。
     钉住 bottom 后只有顶端起伏，才是均衡器那种「站在地面上跳」的感觉。 */
  transform-origin:center bottom;animation:exam-nav-audio-wave .72s ease-in-out infinite alternate;}
.exam-nav-audio-wave i:nth-child(2),.exam-nav-audio-wave i:nth-child(4){height:9px;animation-delay:.16s;}
.exam-nav-audio-wave i:nth-child(3){height:7px;animation-delay:.32s;}
@keyframes exam-nav-audio-wave{to{transform:scaleY(.38);}}
@media (prefers-reduced-motion:reduce){.exam-nav-audio-wave i{animation:none;}}
.exam-nav-button:disabled{opacity:.42;cursor:not-allowed;}
.exam-stage{position:relative;display:flex;flex-direction:column;overflow:hidden;}
/* 题头右上角常驻工具位：倒计时兜底 + 标记 + 反馈。
   放这里而不是浮在题面上，是因为题头位置固定、不与音频条抢空间。 */
.exam-question-head-tools{display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:0 13px;}
.exam-stage-countdown{display:flex;align-items:center;min-width:max-content;color:#f07818;font-size:13px;font-weight:750;white-space:nowrap;}
.exam-stage-countdown:empty{display:none;}
.exam-stage-countdown:not(:empty){margin-right:8px;}
/* 反馈与标记：常驻但不喧哗。默认灰（#C7CBD3），只在悬停与「已标记」时才上色。 */
.exam-head-tool{width:32px;height:32px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;color:#c7cbd3;cursor:pointer;transition:color .15s;}
.exam-head-tool:hover:not(:disabled){background:transparent;box-shadow:none;color:var(--ink-3);}
.exam-head-tool:focus-visible{outline:1px solid var(--border-2);outline-offset:1px;background:transparent;box-shadow:none;color:var(--ink-3);}
.exam-head-tool:disabled{opacity:.32;cursor:not-allowed;}
.exam-mark-icon{width:var(--exam-mark-icon-size,24px);height:var(--exam-mark-icon-size,24px);fill:transparent;stroke:currentColor;stroke-width:1.96;stroke-linecap:round;stroke-linejoin:round;transition:fill .15s,color .15s;}
.exam-mark-button.marked{color:#ffbf65;}
.exam-mark-button.marked .exam-mark-icon{fill:currentColor;stroke:currentColor;stroke-width:1.4;}
.exam-feedback-icon{width:var(--exam-feedback-icon-size,23px);height:var(--exam-feedback-icon-size,23px);stroke-width:1.96;}
/* 题面区的字号基准落在容器上，里面的东西靠继承拿到它。
   必须这样而不是逐个选择器写：.exam-client button{font:inherit} 的特指度高于 .exam-option，
   选项、作答框这些表单控件永远只认继承来的值，单独给它们写 font-size 是无效声明。 */
.exam-question-scroll{
   flex:1;min-height:0;overflow:auto;
   /* padding:18px 20px 28px; */
   padding:16px;
   background:#fff;font-size:var(--exam-text-size);}
.exam-question-scroll.is-load-failed{display:grid;place-items:center;overflow:hidden;}
.exam-question-shell{position:relative;min-height:100%;border:1px solid var(--line);padding:72px 26px 22px;background:#fff;}
.exam-question-heading{position:absolute;top:-1px;left:-1px;right:-1px;
   /* min-height:58px; */
   min-height:48px;
   display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;border-bottom:1px solid var(--line);background:#fff;}
/* 题号标签改灰底深字：它是定位信息不是操作，红色实心块在题面正上方太抢，
   会跟真正需要点的反馈/标记争注意力。 */
/* 宽度按内容撑开、单题号仍是 52 的方块：大题带小题的题号是「41-45」这样的区间，
   钉死 52px 会把它折成两行。 */
.exam-question-tab{position:static;
   min-width:42px;width:auto;height:42px;
   margin:3px 0;padding:0 12px;white-space:nowrap;display:flex;align-items:center;justify-content:center;border-radius:6.5px;background:#f3f4f6;color:#0a1a38;font-size:var(--exam-ui-text-size);font-weight:600;line-height:1.5;}
.exam-question-guide{display:flex;align-items:center;min-width:0;padding:8px 15px;color:var(--ink);font-size:var(--exam-ui-text-size);font-weight:400;line-height:1.5;}
.exam-question-guide strong{white-space:nowrap;}
.exam-question-instruction{margin-bottom:18px;font-family:inherit;font-size:var(--exam-text-size);font-weight:650;line-height:1.55;}
.exam-question-note{margin:-8px 0 18px;color:var(--ink-3);font-size:var(--exam-text-size);}
.exam-group-item{position:relative;padding:17px 0;border-top:1px solid var(--line-soft);}
.exam-group-item:first-of-type{padding-top:0;border-top:0;}
.exam-client.preview-readonly .exam-option:disabled:not(.example-option){opacity:1;cursor:not-allowed;}
.exam-item-prompt{font-size:var(--exam-text-size);line-height:2;color:var(--ink);}
.exam-item-prompt.listening-number{margin-bottom:4px;line-height:1;}
/* 题号占位用 em 不用 px：字号调到 21px 时「42.」比 32px 宽，定宽会把它和题干挤在一起 */
.exam-item-serial{display:inline-flex;min-width:2em;color:var(--seal);font-weight:750;}
/* 选项横向自适应排列：内容驱动的 flex 换行，不再靠 JS 量宽度算列数与跨列。
   JS 测量只在渲染那一帧成立 —— 浏览器缩放（100%→110%）、「字号调整」工具、窗口宽度变化
   都会改变容器宽与文字宽的比例，而算好的 --choice-cols / opt-span-* 不会重算，
   nowrap 的选项文字就被外层裁掉（.exam-stage overflow:hidden、分栏 .exam-answer-pane 可滚即会裁）。
   flex-basis:auto 让每个选项先按自身内容占位，一行装不下就整项换到下一行；
   min-width:0 + 内容 span 可折行是最后的兜底：单个选项比容器还宽时它自己折行，绝不切字。 */
.exam-options.exam-inline-choice,
.exam-options.exam-image-options.exam-inline-choice{display:flex;flex-wrap:wrap;align-items:stretch;gap:8px;}
.exam-options.exam-inline-choice .exam-option{flex:1 1 auto;width:auto;min-width:0;min-height:44px;padding:8px 10px;white-space:nowrap;}
/* 内容 span 允许折行；不写 text-align，图片选项的字母标仍继承卡片自身的居中 */
.exam-options.exam-inline-choice .exam-option>span:last-child{min-width:0;white-space:normal;overflow-wrap:anywhere;}
/* 图片选项是缩略图卡，内容宽该由缩略图决定：基准取 170px（与 .exam-image-option .exam-scene-visual 同源），
   否则 flex-basis:auto 会按原图固有宽度算，整卡被撑宽、一行只放得下一两张 */
.exam-options.exam-image-options.exam-inline-choice .exam-option{flex:1 1 170px;min-width:150px;}
.exam-options{display:grid;gap:9px;width:100%;margin-top:14px;}
.exam-option{
  width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid transparent;border-radius:3px;
  background:#fff;color:var(--ink);text-align:left;font-size:var(--exam-text-size);transition:border-color .15s,background .15s;
}
.exam-option:hover:not(:disabled){border-color:color-mix(in srgb,var(--seal) 45%,var(--line));background:var(--seal-tint);}
.exam-option.selected{border-color:var(--seal);background:var(--seal-tint);color:var(--seal);}
.exam-option-dot{width:15px;height:15px;flex:0 0 15px;border:1px solid #a6adb5;border-radius:50%;background:#fff;}
.exam-option.selected .exam-option-dot{border:4px solid var(--seal);}
.exam-judgment-icon{display:block;width:var(--exam-judgment-icon-size);height:var(--exam-judgment-icon-size);flex:0 0 var(--exam-judgment-icon-size);stroke-width:var(--exam-judgment-icon-stroke);}
.exam-option.example-option{cursor:default;}
.exam-option.example-option:disabled{opacity:1;color:var(--ink);}
.exam-image-options{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;}
.exam-image-option{min-height:0;flex-direction:column;justify-content:center;padding:8px;border-color:var(--line);background:#fafbfb;text-align:center;}
.exam-image-symbol{display:block;width:42px;height:42px;color:var(--ink-2);}
.exam-scene-visual{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;}
/* 主图统一口径：等比、不裁切、不锁比例、无外框，在（容器宽 × --exam-image-max-h）内取最大。
   object-fit:contain 即「按图片比例 + 可用宽 + 可用高来算」——浏览器自动取 min(宽比,高比)，
   且缩放 / 改字号 / 改窗宽时自动重算，比 JS 量算稳健。scene 与 picture 两条路径共用此口径，消除忽大忽小。 */
.exam-scene-image{display:block;width:100%;height:auto;max-width:100%;max-height:var(--exam-image-max-h);object-fit:contain;border:0;background:transparent;}
/* 富文本内嵌图片：后台编辑器把图片以 <img src> 粘进题干/材料富文本里（如书写题「看图写句子」）。
   保持原图比例、自适应容器宽度并限制上限，避免大图撑破版面；真实图片不加占位图的边框与裁剪。 */
.exam-richtext-image{display:block;max-width:min(100%,480px);height:auto;margin:10px 0;}
/* 普通单选题与大题子题复用同一缩略图规格；列宽不足 170px 时随列宽缩小。 */
.exam-image-option .exam-scene-visual{width:100%;max-width:170px;margin:0 auto;}
/* 选项缩略图沿用原有内框：本次统一口径只针对材料图 / 题干图，缩略图保持现状。
   基类 .exam-scene-image 已改为无框透明，这里把缩略图的边框与底色补回来。 */
.exam-image-option .exam-scene-image{border:1px solid var(--line);background:#f7f4ed;}
.exam-image-option-label{font-weight:760;color:var(--ink);}
.exam-scene-material{display:flex;align-items:center;justify-content:center;min-height:118px;margin:10px 0 16px;color:var(--ink-2);}
.exam-scene-material .exam-scene-visual{width:min(100%,520px);max-width:100%;}
.exam-scene-material .exam-image-symbol{width:72px;height:72px;}
/* 材料文本按正文排版：不加底色、不加左侧色条 */
.exam-item-material{margin:10px 0 16px;padding:0;border:0;background:transparent;color:var(--ink);font-size:var(--exam-text-size);line-height:2;}
.exam-material-first>.exam-item-material{margin:0 0 18px;padding:0 72px 0 0;border-left:0;background:transparent;color:var(--ink);font-size:var(--exam-text-size);line-height:2;text-indent:0;}
.exam-material-first>.exam-item-prompt{margin:0;font-size:var(--exam-text-size);font-weight:400;line-height:2;text-indent:0;}
.exam-question-prefix{display:inline-block;margin-right:4px;color:var(--seal);font-size:var(--exam-text-size);font-weight:650;line-height:inherit;}
.exam-image-option .exam-option-dot{position:absolute;opacity:0;}
.exam-container-question{display:grid;gap:16px;}
/* 材料文本按正文排版：不加底色、不加左侧色条（大题的共享材料同此口径） */
.exam-container-material{padding:0;border:0;background:transparent;color:var(--ink);font-size:var(--exam-text-size);line-height:2.5;}
/* 导航栏标记按钮：已标记时用金色，与答题卡/导航格的标记态同源 */
.exam-container-children{display:grid;gap:14px;}
.exam-container-child{position:relative;padding:14px 0;border-top:1px solid var(--line);}
.exam-container-child:first-child{border-top:0;}
/* 容器子题「正在播报」态：听力题号播报 / 题干音频跟到的那一小题。
   整组子题同屏渲染、导航格一组只有一个按钮，考生只能靠这个标记看出播到了第几小题。
   强调色与导航格 current 同源（--red），淡底不抢答题区；
   负边距抵掉水平内边距，让底色块不与兄弟子题的文字错开。 */
.exam-container-child.is-listening-focus{margin:0 -10px;padding:14px 10px;
   /* border-top-color:transparent; */
   /* border-radius:var(--radius-sm); */
   /* background:var(--surface-2); */
   box-shadow:inset 1px 0 0 var(--red);}
.exam-option.shared-ref{min-height:38px;justify-content:center;padding:7px;}
.exam-option.shared-ref .exam-option-dot{display:none;}
.exam-sentence-order{display:grid;gap:16px;width:100%;margin-top:18px;}
.exam-sentence-order-head{display:flex;align-items:flex-start;justify-content:center;gap:18px;position:relative;min-height:48px;}
.exam-sentence-order-slots{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;}
.exam-sentence-order-slot{width:48px;height:48px;padding:0;border:1px solid var(--seal);border-radius:4px;background:#fff;color:var(--ink);font-size:var(--exam-text-size);font-weight:650;text-align:center;}
.exam-sentence-order-slot:hover:not(:disabled),.exam-sentence-order-slot:focus-visible{background:var(--seal-tint);outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--seal) 14%,transparent);}
.exam-sentence-order-slot.empty{border-color:var(--line-strong);background:#fff;}
.exam-sentence-order-clear{position:absolute;right:0;min-height:34px;padding:6px 10px;border:1px solid var(--line-strong);border-radius:3px;background:#fff;color:var(--ink-2);font-size:14px;}
.exam-sentence-order-clear:hover:not(:disabled),.exam-sentence-order-clear:focus-visible{border-color:var(--seal);color:var(--seal);outline:none;}
.exam-sentence-order-clear:disabled{color:var(--ink-4);cursor:not-allowed;}
.exam-sentence-order-list{display:grid;gap:10px;padding-top:16px;border-top:1px solid var(--line);}
.exam-sentence-order-item{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;padding:11px 14px;border:1px solid color-mix(in srgb,var(--seal) 24%,var(--line));border-radius:4px;background:var(--paper);color:var(--ink);font-size:var(--exam-text-size);line-height:1.55;text-align:left;}
.exam-sentence-order-item:hover:not(:disabled),.exam-sentence-order-item:focus-visible{border-color:var(--seal);background:var(--seal-tint);outline:none;}
.exam-sentence-order-item.is-selected{border-color:var(--seal);background:var(--seal-tint);box-shadow:inset 3px 0 0 var(--seal);}
.exam-sentence-order-label{flex:0 0 auto;color:var(--seal);font-weight:700;}
.exam-sentence-order-text{min-width:0;}
.exam-sentence-order-item:disabled{opacity:1;cursor:default;}
.exam-order-area{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding:13px;border:1px dashed var(--line-strong);background:#fafafa;}
.exam-token{padding:8px 12px;border:1px solid #c5ccd3;border-radius:3px;background:#fff;color:var(--ink);font-size:var(--exam-text-size);}
.exam-token.active{border-color:var(--seal);background:var(--seal-tint);}
.exam-word-composer{display:grid;gap:16px;width:100%;min-width:0;max-width:100%;margin-top:18px;touch-action:none;}
.exam-word-bank{display:flex;flex-wrap:wrap;gap:10px;width:100%;min-width:0;max-width:100%;min-height:44px;align-items:flex-start;}
.exam-word-chip,.exam-sentence-chip{flex:0 0 auto;min-width:0;max-width:100%;min-height:38px;padding:8px 16px;border:1px solid #c9ced3;border-radius:4px;background:#fff;color:var(--ink);font-size:var(--exam-text-size);line-height:1.3;text-align:left;white-space:normal;overflow-wrap:anywhere;cursor:grab;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease,opacity .15s ease;}
.exam-word-chip:hover,.exam-word-chip:focus-visible,.exam-sentence-chip:hover,.exam-sentence-chip:focus-visible{border-color:var(--seal);box-shadow:0 3px 10px rgba(27,36,48,.08);outline:none;}
.exam-word-chip{border-color:color-mix(in srgb,var(--seal) 38%,var(--line));background:var(--paper);}
.exam-sentence-chip{border-color:color-mix(in srgb,var(--seal) 50%,var(--line));background:var(--seal-tint);}
.exam-word-chip.dragging,.exam-sentence-chip.dragging{opacity:.42;transform:scale(.97);cursor:grabbing;}
.exam-word-chip:disabled,.exam-sentence-chip:disabled{opacity:1;cursor:default;}
/* 插入位高亮：左侧色条 = 插到这个词块前面，右侧色条 = 插到它后面（拖到末尾时落在最后一个词块右侧）。
   两个渲染路径的已排词块类名不同（本地样本是 exam-sentence-chip，后台题是 exam-word-chip 带
   data-sort-zone="answer"），两边都要给，否则后台题拖动时看不到任何插入位反馈。 */
.exam-sentence-chip.drag-over,
.exam-word-chip[data-sort-zone="answer"].drag-over{border-color:var(--seal);box-shadow:-3px 0 0 var(--seal);}
.exam-sentence-chip.drag-over-after,
.exam-word-chip[data-sort-zone="answer"].drag-over-after{box-shadow:3px 0 0 var(--seal);}
.exam-sentence-dropzone{display:flex;align-items:center;flex-wrap:wrap;gap:10px;width:100%;min-height:58px;padding:9px 12px;border:1px dashed color-mix(in srgb,var(--seal) 58%,var(--line));border-radius:3px;background:#fff;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;}
.exam-sentence-dropzone.empty{background:linear-gradient(90deg,#fff,#fbfbfa);}
.exam-sentence-dropzone.drag-over{border-color:var(--seal);background:var(--seal-tint);box-shadow:0 0 0 2px color-mix(in srgb,var(--seal) 12%,transparent);}
.exam-text-input{width:100%;min-height:46px;margin-top:13px;padding:10px 12px;border:1px solid #bbc5ce;border-radius:3px;background:#fff;color:var(--ink);font-size:var(--exam-text-size);outline:none;}
textarea.exam-text-input{min-height:112px;resize:vertical;line-height:1.7;}
.exam-text-input:focus{border-color:var(--seal);box-shadow:0 0 0 2px rgba(201,44,78,.1);}
.exam-fill-sentence{display:inline-flex;align-items:flex-end;flex-wrap:wrap;gap:5px;font-size:var(--exam-text-size);line-height:2.4;}
/* 填空题：题干里的空位显示「序号 + 空提示」，输入框统一列在题干下方（对齐录入端形态）。
   序号按 {{空id}} 在题干中的出现次序实时排，不等同于 blanks[].id。
   R107：空提示与序号同在空位内，空位上方的注音位留空——hint 是自由文本、不保证是
   拼音，放进注音位既会被读成「这个空的读音」，也装不下。槽内没有东西与它相争：
   考生的输入框在题干下方一空一行。hint 可到 20 字符，所以这一格必须能折行
   （flex-wrap + overflow-wrap）；max-width 限住它，免得一个空占满整行。 */
.exam-blank-slot{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:4px;min-width:56px;max-width:16em;margin:0 4px;padding:0 6px 1px;border-bottom:1.5px solid var(--seal);vertical-align:baseline;overflow-wrap:anywhere;}
.exam-blank-index{color:var(--seal);font-weight:750;}
.exam-blank-hint{color:var(--ink-3);font-size:.82em;}
.exam-blank-fields{display:grid;gap:10px;margin-top:16px;}
.exam-blank-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;}
.exam-blank-row-index{color:var(--seal);font-size:var(--exam-text-size);font-weight:750;}
/* 填空输入框与书写题的输入框同一形态：完整边框、左对齐、宽度自适应。
   原来是 56px 的单字方格——那只适配「看格写字」，一旦某个空要填词或短句就写不下。
   长度约束仍由 maxlength（blanks[].length）负责，不靠框宽去暗示。 */
.exam-blank-input{width:100%;max-width:420px;min-height:46px;padding:10px 12px;border:1px solid #bbc5ce;border-radius:3px;background:#fff;color:var(--ink);font-family:inherit;font-size:var(--exam-text-size);line-height:1.6;text-align:left;outline:none;}
.exam-blank-input:focus{border-color:var(--seal);box-shadow:0 0 0 2px rgba(201,44,78,.1);}
.exam-picture-prompt{display:grid;grid-template-columns:minmax(240px,340px) minmax(170px,1fr);align-items:center;gap:28px;margin-top:14px;padding:20px;border:1px solid var(--line);background:#fafafa;}
.exam-picture-frame{width:clamp(240px,30vw,340px);max-width:100%;margin:0;border:1px solid var(--line-strong);background:#fff;overflow:hidden;}
.exam-picture-image{display:block;width:100%;height:auto;max-width:100%;max-height:var(--exam-image-max-h);object-fit:contain;border:0;background:transparent;}
.exam-picture-word{display:flex;flex-direction:column;gap:10px;}
.exam-picture-word strong{color:var(--seal);font-family:inherit;font-size:var(--exam-text-size);font-weight:700;line-height:1.3;}
/* 例题的参考答案：占正式题输入框的位置，用边框 + 底色明确区分于题干，且不可编辑。 */
.exam-example-answer{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:4px;background:#fafafa;}
.exam-example-answer strong{display:block;margin-bottom:6px;color:var(--ink-3);font-size:13px;font-weight:650;}
.exam-example-answer p{margin:0;font-size:var(--exam-text-size);line-height:1.7;}
.exam-question-presentation{width:100%;min-width:0;}
/* 左右结构：复用题目 shell 的唯一外框，只以中间竖线分区；presentation 自身不再套框。
   容器取确定高度，两列各自独立纵向滚动，互不影响；min-height:0 必须显式给，
   否则 grid item 默认 min-height:auto，overflow 不生效。 */
.exam-question-presentation[data-media-layout="split"]{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);align-items:stretch;gap:0;min-height:0;border:0;border-radius:0;background:#fff;overflow:hidden;}
/* 左右结构时外层滚动交给两列自己：外层保持不滚，题卡按可视高度定高。
   高度必须一路传下去：shell → .exam-group-item → presentation，中间任一环
   漏掉 flex:1/min-height:0，两列就撑不到上限、滚动条会长回最外层。 */
.exam-question-scroll.has-split{overflow:hidden;}
.exam-question-scroll.has-split>.exam-question-shell{height:100%;min-height:0;display:flex;flex-direction:column;padding:54px 0 0;}
.exam-question-scroll.has-split>.exam-question-shell>.exam-group-item{flex:1;min-height:0;display:flex;flex-direction:column;padding:0;}
.exam-question-scroll.has-split .exam-question-presentation[data-media-layout="split"]{flex:1;min-height:0;}
.exam-question-presentation[data-media-layout="split"]>.exam-material-pane,
.exam-question-presentation[data-media-layout="split"]>.exam-answer-pane{min-height:0;overflow-y:auto;overscroll-behavior:contain;}
.exam-material-pane,.exam-answer-pane{min-width:0;}
/* 上下结构里的单一视觉媒体：材料整体位于题干之前 */
.exam-stacked-material{margin:0 0 16px;}
.exam-stacked-material .exam-material-image{width:min(100%,520px);margin-inline:auto;}
.exam-stacked-material .exam-material-video{width:min(100%,720px);margin-inline:auto;}
.exam-material-pane{display:grid;align-content:start;gap:14px;padding:16px;border:0;background:transparent;}
.exam-question-presentation[data-media-layout="split"]>.exam-material-pane{border-right:1px solid var(--line);}
/* 分栏时材料栏独立纵向滚动，图片高度预算可比整页更宽裕 */
.exam-question-presentation[data-media-layout="split"] .exam-material-pane{--exam-image-max-h:min(52vh,520px);}
.exam-question-presentation[data-media-layout="split"]>.exam-answer-pane{padding:16px;}
.exam-presentation-stem{margin:14px 0 14px;color:var(--ink);font-size:var(--exam-text-size);line-height:2;}
.exam-presentation-stem:empty{display:none;}
.exam-presentation-stem .exam-item-prompt{margin:0;}
.exam-question-presentation[data-media-layout="stacked-text"]>.exam-material-text,
.exam-question-presentation[data-media-layout="audio-only"]>.exam-material-audio{margin:0 0 18px;}
.exam-question-presentation[data-media-layout="stacked-text"]>.exam-material-text{padding:0;border:0;background:transparent;color:var(--ink);}
.exam-material-first .exam-question-presentation[data-media-layout="stacked-text"]>.exam-material-text{padding:0 72px 0 0;border:0;background:transparent;color:var(--ink);}
.exam-material-first .exam-presentation-stem{margin-bottom:0;}
.exam-material-audio{display:grid;grid-template-columns:auto minmax(80px,1fr) auto;align-items:center;gap:12px;min-height:46px;padding:0;border:0;border-radius:0;background:transparent;color:var(--ink-2);font-size:12px;}
.exam-material-audio-state{display:inline-flex;align-items:center;color:var(--seal);font-weight:700;white-space:nowrap;}
.exam-material-audio-state.is-icon-only{width:18px;justify-content:center;}
.exam-material-audio-state.is-icon-only svg{display:block;width:18px;height:18px;}
.exam-material-audio-track{height:4px;border-radius:999px;background:#e4e7e9;overflow:hidden;}
/* 进度条默认样式（无进度信息时） */
.exam-material-audio-track i{display:block;width:42%;height:100%;background:var(--seal);}
/* 进度条状态：正在播放（跟随音频进度）、已完成（100%）、未播放（0%） */
.exam-material-audio-track.is-playing i{width:var(--audio-progress,0%);background:var(--red);}
.exam-material-audio-track.is-complete i{width:100%;background:var(--red);}
.exam-material-audio-track.is-pending i{width:0%;}
.exam-material-audio-time{font-variant-numeric:tabular-nums;white-space:nowrap;}
.exam-material-audio.is-failed .exam-material-audio-track,
.exam-material-audio.is-retrying .exam-material-audio-track{background:#d9dde1;}
.exam-material-audio.is-failed .exam-material-audio-track i,
.exam-material-audio.is-retrying .exam-material-audio-track i{width:0;background:#aeb5bc;}
.exam-material-audio-retry{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;background:transparent;color:var(--seal);cursor:pointer;}
.exam-material-audio-retry:hover{background:transparent;color:var(--red-dark);}
.exam-material-audio-retry:focus-visible{outline:2px solid var(--seal);outline-offset:2px;}
.exam-material-audio-retry svg{width:18px;height:18px;}
.exam-material-audio-retrying{display:grid;place-items:center;width:30px;height:30px;}
.exam-material-audio-retrying i{width:17px;height:17px;border:2px solid #c9ced4;border-top-color:var(--seal);border-radius:50%;animation:exam-audio-retry-spin .8s linear infinite;}
@keyframes exam-audio-retry-spin{to{transform:rotate(360deg);}}
.exam-material-audio-source{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;}
.exam-material-text{margin:0;padding:0;border:0;background:transparent;color:var(--ink-2);font-size:var(--exam-text-size);line-height:2;}
/* 图片与视频纵向依次排列，不同行：同行会把视频压到半列宽而无法当页播放 */
.exam-material-media-row{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:12px;}
.exam-material-image.exam-scene-material{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;max-width:min(100%,520px);margin:0 auto;border:0;background:transparent;overflow:hidden;}
.exam-material-image .exam-scene-visual{width:min(100%,520px);max-width:100%;margin:0 auto;}
.exam-material-image .exam-scene-image{border:0;background:transparent;}
.exam-material-image .exam-picture-image{border:0;background:transparent;}
.exam-material-video{position:relative;margin:0;border:1px solid var(--line);background:#111;overflow:hidden;}
.exam-material-video video{display:block;width:100%;max-height:360px;aspect-ratio:16/9;background:#111;}
.exam-material-video figcaption{position:absolute;right:8px;bottom:8px;padding:3px 7px;border-radius:2px;background:rgba(17,24,39,.72);color:#fff;font-size:12px;font-variant-numeric:tabular-nums;}
.exam-stem-image{width:min(100%,400px);margin:12px auto 16px;border:0;background:transparent;}
.exam-stem-image .exam-picture-image{width:100%;max-height:var(--exam-image-max-h);object-fit:contain;}
.exam-annotated-text{display:inline;}
.exam-pinyin-line{display:block;margin-top:5px;color:var(--ink-3);font-size:.78em;letter-spacing:.02em;}
.exam-question-presentation ruby{ruby-align:center;ruby-position:over;margin-right: 4px;}
.exam-question-presentation rt{color:var(--ink-3);font-size:.58em;font-weight:400;}
.exam-question-error{display:grid;gap:7px;padding:20px;border:1px solid #efb5c1;border-left:4px solid var(--seal);background:var(--seal-tint);color:var(--ink-2);}
.exam-question-error strong{color:var(--seal);font-size:17px;}
.exam-question-load-failure{display:grid;justify-items:center;gap:12px;color:var(--ink-3);font-size:14px;font-weight:400;line-height:1.5;text-align:center;}
.exam-question-load-failure.is-loading{display:inline-flex;align-items:center;gap:6px;color:var(--seal);font-size:var(--exam-ui-text-size);font-weight:700;}
.exam-question-load-message{margin:0;color:var(--ink-3);font-weight:400;}
.exam-question-retry{display:inline-flex;align-items:center;gap:6px;width:auto;height:auto;padding:2px 0;border:0;border-radius:0;background:transparent;color:var(--seal);font:inherit;font-weight:600;cursor:pointer;}
.exam-question-retry:hover{background:transparent;text-decoration:underline;text-underline-offset:3px;}
.exam-question-retry:focus-visible{outline:2px solid var(--seal);outline-offset:2px;}
.exam-question-retry svg{width:17px;height:17px;}
.exam-question-loading-spinner{width:18px;height:18px;border:2px solid transparent;border-top-color:var(--seal);border-right-color:var(--seal);border-radius:50%;animation:exam-question-loading-spin .72s linear infinite;}
@keyframes exam-question-loading-spin{to{transform:rotate(360deg);}}
.exam-given-words{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:14px 0;}
.exam-given-words span{padding:6px 10px;border:1px solid var(--line);border-radius:3px;background:#fafafa;}
.exam-writing-response,.exam-essay-response{display:grid;gap:10px;margin-top:16px;}
.exam-writing-response label,.exam-essay-response label{display:grid;gap:7px;color:var(--ink-2);font-weight:650;}
.exam-writing-response footer,.exam-essay-response footer{color:var(--ink-3);font-size:12px;text-align:right;}
.exam-essay-response input{width:100%;min-height:42px;padding:8px 11px;border:1px solid var(--line-strong);border-radius:3px;}
.exam-essay-response textarea{min-height:220px;}
.exam-reading-phase{padding:10px 12px;border-left:3px solid var(--gold);background:#fff9ea;color:#8a6519;font-size:12px;font-weight:650;}
.exam-word-composer section h4{margin:0 0 8px;color:var(--ink-2);font-size:12px;}
.exam-stage-foot{
   /* height:66px;flex:0 0 66px; */
   height:64px;flex:0 0 64px;
   display:flex;align-items:flex-start;justify-content:center;gap:10px;
   /* padding:8px 0 0; */
   border-top:0;background:transparent;}
.exam-btn{min-width:86px;height:36px;padding:0 16px;border:1px solid var(--line-strong);border-radius:3px;background:#fff;color:var(--ink);font-size:13px;font-weight:650;}
.exam-btn:hover:not(:disabled){border-color:var(--seal);color:var(--seal);}
.exam-btn.primary{border-color:var(--seal);background:var(--seal);color:#fff;}
.exam-btn.primary:hover:not(:disabled){border-color:color-mix(in srgb,var(--seal) 82%,#000);background:color-mix(in srgb,var(--seal) 82%,#000);color:#fff;}
.exam-btn.seal{border-color:var(--seal);background:var(--seal);color:#fff;}
.exam-btn.danger{border-color:var(--seal);background:var(--seal);color:#fff;}
.exam-btn.danger:hover:not(:disabled){border-color:color-mix(in srgb,var(--seal) 82%,#000);background:color-mix(in srgb,var(--seal) 82%,#000);color:#fff;}
.exam-btn.ghost{border:1px solid #6b7280;background:#fff;color:#0c1320;}
.exam-btn.ghost:hover:not(:disabled){border-color:var(--ink);color:var(--ink);background:#fff;}
.exam-btn.ink{border-color:var(--ink);background:var(--ink);color:#fff;}
.exam-btn.ink:hover:not(:disabled){border-color:var(--ink-2);background:var(--ink-2);color:#fff;}
.exam-btn:disabled{opacity:.42;cursor:not-allowed;}
/* 上一题 / 下一题（Figma 855:619 / 855:625 / 855:631）：
   默认两枚 300×48 白底灰描边，文案统一 600；悬停或按下任意一枚改为品红描边+品红字；
   不可点保持同壳、透明度 40%。窄屏时两枚等分可用宽度，不挤出容器。 */
.exam-stage-foot .exam-btn{width:300px;max-width:calc((100% - 10px) / 2);height:48px;min-width:0;padding:0 17px;border-color:var(--ink-3,#6b7280);border-radius:6px;background:#fff;color:var(--ink-2,#374151);font-size:var(--exam-ui-text-size);font-weight:600;line-height:24px;white-space:nowrap;cursor:pointer;}
.exam-stage-foot .exam-btn.primary{border-color:var(--ink-3,#6b7280);background:#fff;color:var(--ink,#111827);font-weight:600;}
.exam-stage-foot .exam-btn:hover:not(:disabled),.exam-stage-foot .exam-btn:active:not(:disabled){border-color:var(--red,#e5294a);background:#fff;color:var(--red,#e5294a);font-weight:600;}
.exam-stage-foot .exam-btn.primary:hover:not(:disabled),.exam-stage-foot .exam-btn.primary:active:not(:disabled){border-color:var(--red,#e5294a);background:#fff;color:var(--red,#e5294a);font-weight:600;}
.exam-stage-foot .exam-btn:disabled{opacity:.4;cursor:not-allowed;background:#fff;}
.exam-candidate{display:flex;flex-direction:column;gap:30px;overflow:auto;padding:24px 12px;background:#fff;}
.exam-candidate-card{padding:0 2px;background:#fff;color:var(--ink);}
.exam-candidate-avatar{width:70px;height:70px;margin:0 auto 16px;padding:2px;display:flex;align-items:flex-end;justify-content:center;border:2px solid rgba(255,255,255,.65);border-radius:0;overflow:hidden;background:#f3f4f6;}
.exam-candidate-avatar img{width:59px;height:59px;flex:0 0 59px;object-fit:contain;}
/* 标签定宽、值左对齐：两行的值起点对齐，扫一眼就能读到「是谁、考号多少」 */
.exam-candidate-info{display:grid;justify-content:center;gap:4px;font-size:var(--exam-ui-text-size);line-height:1.45;}
.exam-candidate-info div{display:flex;justify-content:flex-start;gap:16px;align-items:baseline;padding:0;}
.exam-candidate-info span{width:90px;color:var(--ink-2);font-weight:400;}
.exam-candidate-info strong{color:var(--ink);font-weight:400;word-break:break-word;}
.exam-candidate-actions{display:grid;grid-template-columns:1fr;gap:16px;padding:0;background:#fff;}
.exam-candidate-actions h2{display:flex;align-items:center;gap:10px;margin:0;color:var(--ink-2);font-size:var(--exam-ui-text-size);font-weight:400;line-height:1.45;letter-spacing:-.48px;text-align:center;white-space:nowrap;}
.exam-candidate-actions h2::before,.exam-candidate-actions h2::after{content:'';flex:1;height:1px;background:var(--border);}
.exam-candidate-tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
   /* gap:16px 34px;
   padding:0 24px; */
   gap:8px 12px;
   padding:0 10px;
   justify-content:center;}
.exam-side-btn{min-height:38px;padding:7px;border:1px solid var(--line);border-radius:3px;background:#fff;color:var(--ink);font-size:var(--exam-ui-text-size);font-weight:650;}
.exam-side-btn:hover:not(:disabled){border-color:var(--seal);color:var(--seal);background:var(--seal-tint);}
.exam-side-btn.exam-candidate-tool{min-height:60px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;padding:0;border-color:transparent;background:transparent;color:var(--ink-2);font-size:14px;font-weight:400;line-height:20px;}
.exam-side-btn.exam-candidate-tool:hover:not(:disabled){border-color:transparent;background:transparent;color:var(--ink);}
.exam-candidate-tool-ring{box-sizing:border-box;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:.75px solid var(--border);border-radius:18px;transition:border-color .15s;}
.exam-side-btn.exam-candidate-tool:hover:not(:disabled) .exam-candidate-tool-ring{border-color:var(--ink-3);}
.exam-candidate-tool-icon{width:20px;height:20px;}
.exam-side-btn.wide{grid-column:1/-1;}
/* 提交用深墨实心：这一屏里红色已经被「结束听力预览」「当前题」等占着做提示色，
   交卷是终局动作，用最重的中性色反而更稳，也不会跟提示混成一片红。 */
.exam-side-btn.submit{min-height:56px;margin-top:3px;border:0;border-radius:3px;background:var(--ink);color:#fff;font-size:16px;font-weight:600;line-height:24px;}
.exam-side-btn.submit:hover:not(:disabled){background:var(--ink-2);color:#fff;}
.exam-side-btn.exit{min-height:50px;border-color:transparent;border-radius:3px;background:#fff;color:var(--ink);font-size:16px;font-weight:400;line-height:24px;}
.exam-side-btn.exit:hover:not(:disabled){border-color:transparent;background:var(--surface-2);color:var(--ink);}
.exam-side-btn:disabled{border-color:#d7dadd;background:#eef0f2;color:#9299a2;cursor:not-allowed;}
.exam-screen-keyboard{position:absolute;left:0;top:0;z-index:8;width:760px;min-width:0;padding:.714em .857em .857em;transform:none;border:1px solid var(--line-strong);border-radius:4px;background:#fff;box-shadow:0 14px 34px rgba(17,24,39,.12);font-size:14px;overflow:hidden;will-change:left,top,width,font-size;}
.exam-screen-keyboard[hidden]{display:none;}
.exam-screen-keyboard.is-dragging,.exam-screen-keyboard.is-resizing{user-select:none;}
.exam-screen-keyboard-close{position:absolute;top:.24em;right:.96em;z-index:2;width:1.2em;height:1.2em;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:3px;background:transparent;color:var(--ink-3);font-family:Arial,sans-serif;font-size:1.786em;font-weight:300;line-height:1;cursor:pointer;}
.exam-screen-keyboard-close:hover{background:#f0f1f2;color:var(--ink);}
.exam-screen-keyboard-close:focus-visible{outline:2px solid color-mix(in srgb,var(--seal) 28%,transparent);outline-offset:1px;}
.exam-screen-keyboard-composition{min-height:1.8em;padding:.133em 3.2em .333em .267em;color:var(--ink);font-size:1.071em;font-weight:600;line-height:1.333em;letter-spacing:.03em;word-break:break-all;cursor:grab;touch-action:none;}
.exam-screen-keyboard.is-dragging .exam-screen-keyboard-composition{cursor:grabbing;}
.exam-screen-keyboard-composition:empty::before{content:"\00a0";}
.exam-screen-keyboard-candidates{height:3em;display:flex;align-items:center;gap:.143em;margin-bottom:.714em;padding:.286em .5em;border:1px solid var(--line-strong);border-radius:3px;background:#fff;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:thin;}
.exam-screen-keyboard-candidate{flex:0 0 auto;min-width:2.625em;height:2em;padding:.188em .625em;border:0;border-radius:2px;background:#fff;color:var(--ink);font-size:1.143em;font-weight:500;cursor:pointer;}
.exam-screen-keyboard-candidate:hover{background:var(--seal-tint);color:var(--seal);}
.exam-screen-keyboard-rows{display:grid;gap:.429em;padding:0;background:#fff;}
.exam-screen-keyboard-row{display:flex;justify-content:center;gap:.429em;min-width:0;}
.exam-screen-keyboard-key,.exam-screen-keyboard-controls button{min-width:0;height:2.857em;padding:.214em .571em;border:1px solid #cfd4d9;border-radius:3px;background:#fff;color:var(--ink);font-size:1em;font-weight:600;box-shadow:0 1px 1px rgba(17,24,39,.04);cursor:pointer;}
.exam-screen-keyboard-key{flex:0 1 3.286em;width:3.286em;white-space:nowrap;}
.exam-screen-keyboard-key-wide{flex:0 0 5.571em;flex-basis:5.571em;width:5.571em;min-width:5.571em;}
.exam-screen-keyboard-key-backspace{flex:0 0 8.2em;flex-basis:8.2em;width:8.2em;min-width:8.2em;padding-inline:.45em;}
.exam-screen-keyboard-key-modifier{flex:0 0 4.615em;flex-basis:4.615em;width:4.615em;min-width:4.615em;font-size:.929em;}
.exam-screen-keyboard-key.is-active{border-color:var(--seal);background:var(--seal-tint);color:var(--seal);}
.exam-screen-keyboard-key:hover,.exam-screen-keyboard-controls button:hover{border-color:var(--seal);background:var(--seal-tint);color:var(--seal);}
.exam-screen-keyboard-key:focus-visible,.exam-screen-keyboard-controls button:focus-visible,.exam-screen-keyboard-candidate:focus-visible{outline:2px solid color-mix(in srgb,var(--seal) 28%,transparent);outline-offset:1px;}
.exam-screen-keyboard-controls{display:grid;grid-template-columns:minmax(15.714em,24.286em) repeat(4,3em);justify-content:center;gap:.429em;padding:.429em 0 0;background:#fff;}
.exam-screen-keyboard-resize{position:absolute;z-index:3;width:1.286em;height:1.286em;border:0;background:none;touch-action:none;}
.exam-screen-keyboard-resize.is-nw{left:0;top:0;cursor:nwse-resize;}
.exam-screen-keyboard-resize.is-ne{right:0;top:0;cursor:nesw-resize;}
.exam-screen-keyboard-resize.is-sw{left:0;bottom:0;cursor:nesw-resize;}
.exam-screen-keyboard-resize.is-se{right:0;bottom:0;cursor:nwse-resize;}
.exam-modal-layer{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:28px;background:rgba(28,36,52,.56);}
.exam-modal-layer[hidden]{display:none;}
/* 弹窗组件（Figma 833:836）：阴影统一 #000 / 5%；Small 宽 430。 */
.exam-modal{position:relative;overflow:hidden;width:min(760px,calc(100vw - 70px));max-height:min(720px,calc(100vh - 70px));display:flex;flex-direction:column;border:1px solid var(--border,#e5e7eb);border-radius:8px;background:#fff;box-shadow:0 24px 70px rgba(0,0,0,.05);}
.exam-modal.small{width:min(430px,calc(100vw - 70px));}
/* 稿口径（Figma 272:5800 / 588:10527 / 594:11605）：标题 22px、四周留白 16、
   关闭按钮 40×40 描边方块。原来是 58px 固定高 + 17px 标题。 */
.exam-modal-head{min-height:72px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;background:#fff;}
.exam-modal-head strong{font-family:inherit;font-size:22px;font-weight:700;line-height:26px;}
.exam-modal-close{width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:none;color:var(--ink-2);cursor:pointer;-webkit-tap-highlight-color:transparent;}
.exam-modal-close[hidden]{display:none;}
.exam-modal-close:hover,.exam-modal-close:active{border-color:var(--line-strong);background:#fff;box-shadow:none;color:var(--ink);}
.exam-modal-close:focus{outline:none;background:#fff;box-shadow:none;}
.exam-modal-close:focus-visible{outline:2px solid var(--seal);outline-offset:2px;border-radius:6px;background:#fff;box-shadow:none;color:var(--ink);}
.exam-modal-close-icon{width:24px;height:24px;flex:0 0 auto;}
.exam-modal-body{flex:1;min-height:0;overflow:auto;padding:8px 24px 12px;}
.exam-modal-foot{display:flex;justify-content:flex-end;gap:9px;padding:16px;background:#fff;}
/* 四个稿的主按钮统一：深墨底、200 宽、48 高 */
.exam-btn.primary.exam-btn-wide{width:200px;max-width:100%;height:48px;border-color:var(--ink);background:var(--ink);color:#fff;font-size:16px;font-weight:600;}
.exam-btn.primary.exam-btn-wide:hover:not(:disabled){border-color:var(--ink-2);background:var(--ink-2);color:#fff;}
.exam-modal-foot[hidden]{display:none;}
/* 交卷未成功走插画弹窗壳（Figma 594:11868）：90 插画、双钮 184×48 */
.exam-submission-failure-actions{display:flex;justify-content:center;align-items:stretch;flex-wrap:wrap;gap:12px;width:100%;}
.exam-submission-failure-actions .exam-btn{display:inline-flex;align-items:center;justify-content:center;width:184px;max-width:calc((100% - 12px) / 2);min-height:48px;height:auto;padding:8px 12px;border-radius:3px;font-size:16px;font-weight:600;line-height:24px;white-space:normal;text-align:center;overflow:visible;overflow-wrap:anywhere;}
/* 两个 tab 就是稿里的标题行本身（Figma 588:10839 / 594:11605）：22px 文字并排，
   激活项加一条 60px 的品红下划线；整行没有贯通的分隔线。
   须知与试卷结构共用 750：结构页改成三列模块卡后，缩到 560 会把图标挤扁。
   关闭钮与加载失败弹窗同一套：32×32、无描边。 */
.exam-modal.notice-tabs{width:min(750px,calc(100vw - 70px));padding:24px;gap:24px;}
.exam-modal.notice-tabs:has(.exam-modal-tip-content) .exam-modal-body{padding:0;}
.exam-modal.notice-tabs:has(.exam-modal-tip-content) .exam-modal-foot{padding:0;justify-content:flex-end;align-items:center;gap:16px;}
.exam-modal.notice-tabs .exam-modal-head{position:absolute;z-index:2;right:24px;top:24px;width:32px;height:32px;min-height:0;padding:0;background:transparent;}
.exam-modal.notice-tabs .exam-modal-head strong{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.exam-modal.notice-tabs .exam-modal-close{width:32px;height:32px;border:0;border-radius:4.8px;background:transparent;}
.exam-modal.notice-tabs .exam-modal-close:hover,.exam-modal.notice-tabs .exam-modal-close:active,.exam-modal.notice-tabs .exam-modal-close:focus{border:0;background:var(--surface-2,#f9fafb);color:var(--ink);}
.exam-modal.notice-tabs .exam-modal-close:focus-visible{border-radius:4.8px;}
.exam-modal.notice-tabs .exam-modal-close-icon{width:32px;height:32px;}
.exam-modal.notice-tabs .exam-modal-body{padding:0;overflow:auto;flex:1 1 auto;min-height:0;}
.exam-modal.notice-tabs .exam-modal-foot{padding:0;justify-content:flex-end;align-items:center;gap:16px;flex:0 0 auto;}
.exam-modal-tabs{display:flex;align-items:center;gap:24px;padding-right:48px;}
.exam-modal-tab{position:relative;min-height:40px;padding:0 0 8px;border:0;background:#fff;color:var(--ink-2);font-size:22px;font-weight:400;line-height:26px;cursor:pointer;white-space:nowrap;}
.exam-modal-tab:hover,.exam-modal-tab:focus-visible{color:var(--ink);outline:none;}
.exam-modal-tab:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb,var(--seal) 28%,transparent);border-radius:3px;}
.exam-modal-tab.is-active{color:var(--ink);font-weight:600;}
.exam-modal-tab.is-active::after{content:'';position:absolute;left:0;bottom:0;width:60px;max-width:100%;height:2px;border-radius:24px;background:var(--seal);}
.exam-notice-tab-panel{padding-top:24px;}
.exam-modal.notice-tabs:has(.exam-modal-tip-content) .exam-notice-tab-panel{padding-top:24px;}
.exam-feedback-dialog{display:grid;gap:24px;width:100%;}
.exam-feedback-helper{margin:0;color:var(--ink-2);font-size:15px;line-height:21px;}
.exam-feedback-tags{display:flex;flex-wrap:wrap;align-items:center;gap:4px;width:100%;}
.exam-feedback-tag{min-height:38px;padding:8px 13px;border:1px solid var(--border,#e5e7eb);border-radius:3px;background:#fff;color:var(--ink-2);font-size:16px;line-height:26px;}
.exam-feedback-tag:hover,.exam-feedback-tag:focus-visible{border-color:var(--seal);color:var(--seal);outline:none;}
.exam-feedback-tag.selected{border-color:var(--seal);background:var(--seal-tint);color:var(--seal);}
/* 问题反馈弹窗外壳（Figma 702:18804）：只改壳，听力/阅读/书写的标签集仍按模块走。 */
.exam-modal.feedback{width:min(430px,calc(100vw - 70px));padding:24px;gap:24px;}
.exam-modal.feedback .exam-modal-head{min-height:0;padding:0;gap:16px;width:100%;}
.exam-modal.feedback .exam-modal-head strong{color:var(--ink);}
.exam-modal.feedback .exam-modal-close{width:32px;height:32px;border:0;border-radius:4.8px;background:transparent;}
.exam-modal.feedback .exam-modal-close:hover,.exam-modal.feedback .exam-modal-close:active,.exam-modal.feedback .exam-modal-close:focus{border:0;background:var(--surface-2,#f9fafb);color:var(--ink);}
.exam-modal.feedback .exam-modal-close:focus-visible{border-radius:4.8px;}
.exam-modal.feedback .exam-modal-close-icon{width:32px;height:32px;}
.exam-modal.feedback .exam-modal-body{padding:0;overflow:visible;flex:0 0 auto;}
.exam-modal.feedback .exam-modal-foot{padding:0;justify-content:stretch;flex:0 0 auto;width:100%;}
.exam-modal.feedback .exam-modal-foot .exam-btn.primary.exam-btn-wide{width:100%;max-width:none;border-radius:3px;}
/* 字号调整（Figma 833:762）：Small 壳、完成钮 184 右对齐 */
.exam-modal.tools{width:min(430px,calc(100vw - 70px));padding:24px;gap:24px;}
.exam-modal.tools .exam-modal-head{min-height:0;padding:0;gap:16px;width:100%;}
.exam-modal.tools .exam-modal-head strong{color:var(--ink);}
.exam-modal.tools .exam-modal-close{width:32px;height:32px;border:0;border-radius:4.8px;background:transparent;}
.exam-modal.tools .exam-modal-close:hover,.exam-modal.tools .exam-modal-close:active,.exam-modal.tools .exam-modal-close:focus{border:0;background:var(--surface-2,#f9fafb);color:var(--ink);}
.exam-modal.tools .exam-modal-close:focus-visible{border-radius:4.8px;}
.exam-modal.tools .exam-modal-close-icon{width:32px;height:32px;}
.exam-modal.tools .exam-modal-body{padding:0;overflow:visible;flex:0 0 auto;}
.exam-modal.tools .exam-modal-foot{padding:0;justify-content:flex-end;flex:0 0 auto;width:100%;}
.exam-modal.tools .exam-modal-foot .exam-btn{width:184px;max-width:100%;height:48px;border-radius:3px;font-size:16px;font-weight:600;line-height:24px;}
/* 状态插画弹窗共用壳（Figma 833:836 Small）：430、24 留白、32 无描边关闭、双钮 184×48 */
.exam-modal.illustrated{width:min(430px,calc(100vw - 70px));padding:24px;gap:24px;}
.exam-modal.illustrated .exam-modal-head{min-height:0;padding:0;gap:16px;width:100%;}
.exam-modal.illustrated .exam-modal-head strong{color:var(--ink);}
.exam-modal.illustrated .exam-modal-close{width:32px;height:32px;border:0;border-radius:4.8px;background:transparent;}
.exam-modal.illustrated .exam-modal-close:hover,.exam-modal.illustrated .exam-modal-close:active,.exam-modal.illustrated .exam-modal-close:focus{border:0;background:var(--surface-2,#f9fafb);color:var(--ink);}
.exam-modal.illustrated .exam-modal-close:focus-visible{border-radius:4.8px;}
.exam-modal.illustrated .exam-modal-close-icon{width:32px;height:32px;}
.exam-modal.illustrated .exam-modal-body{padding:0;overflow:visible;flex:0 0 auto;}
.exam-modal.illustrated .exam-modal-foot{padding:0;justify-content:center;align-items:stretch;flex:0 0 auto;width:100%;gap:12px;}
.exam-modal.illustrated .exam-modal-foot .exam-btn{display:inline-flex;align-items:center;justify-content:center;width:184px;max-width:calc((100% - 12px) / 2);min-height:48px;height:auto;padding:8px 12px;border-radius:3px;font-size:16px;font-weight:600;line-height:24px;white-space:normal;text-align:center;overflow:visible;overflow-wrap:anywhere;}
.exam-modal.illustrated .exam-modal-foot .exam-btn:only-child{width:100%;max-width:none;}
.exam-modal.illustrated .exam-modal-foot .exam-btn.ghost{border:1px solid #6b7280;background:#fff;color:#0c1320;}
.exam-modal.illustrated .exam-modal-foot .exam-btn.ghost:hover:not(:disabled){border-color:var(--ink);color:var(--ink);background:#fff;}
.exam-modal.illustrated .exam-modal-foot .exam-btn.ink{border-color:var(--ink,#111827);background:var(--ink,#111827);color:#fff;}
.exam-modal.illustrated .exam-modal-foot .exam-btn.ink:hover:not(:disabled){border-color:var(--ink-2);background:var(--ink-2);color:#fff;}
.exam-dialog-figure{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;text-align:center;}
.exam-dialog-art{display:block;width:90px;height:90px;flex:0 0 90px;overflow:hidden;}
.exam-dialog-art img{display:block;width:90px;height:90px;object-fit:contain;}
.exam-dialog-figure p{margin:0;color:var(--ink-2,#374151);font-size:15px;line-height:21px;}
.exam-modal.illustrated .exam-dialog-copy{margin:0;width:100%;color:var(--ink-2,#374151);font-size:16px;line-height:24px;text-align:left;}
.exam-modal.confirm-submit .exam-dialog-figure p{font-size:16px;line-height:24px;text-align:left;}
.exam-feedback-error{margin:0;color:var(--seal);font-size:12px;}
.exam-feedback-toast{position:absolute;z-index:30;left:50%;bottom:24px;transform:translateX(-50%);max-width:min(520px,calc(100vw - 48px));padding:11px 18px;border:1px solid var(--line-strong);border-radius:3px;background:var(--ink);box-shadow:0 8px 28px rgba(0,0,0,.18);color:#fff;font-size:13px;text-align:center;}
.exam-feedback-toast[hidden]{display:none;}
/* 须知：小节标题前置 24px 圆形图标，条目改圆点列表（Figma 588:10839） */
.exam-notice-content{display:grid;gap:0;color:var(--ink-2);}
.exam-notice-sections{display:grid;}
.exam-notice-section{padding:8px 0;}
.exam-notice-section h3{margin:0 0 8px;display:flex;align-items:center;gap:8px;font-family:inherit;font-size:16px;font-weight:600;line-height:24px;color:var(--ink);}
.exam-notice-icon{width:24px;height:24px;flex:0 0 auto;}
.exam-notice-section p,.exam-notice-list{margin:0;font-size:13px;line-height:21px;color:var(--ink-2);}
.exam-notice-list{list-style:none;padding-left:21px;}
.exam-notice-list li{position:relative;}
.exam-notice-list li::before{content:'';position:absolute;left:-15px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--ink-2);}
.exam-notice-list li+li{margin-top:5px;}
/* 试卷结构（Figma 594:11605）：模块横排成卡，灰底、竖线分隔；
   总时长与确认钮同一行靠右，时钟 +「总时长{n}分钟」，不要「约」。 */
.exam-modal-tip-content{display:flex;flex-direction:column;gap:24px;width:100%;color:var(--ink);}
.exam-modal-tip-heading{margin:0;font-family:inherit;font-size:18px;font-weight:700;line-height:24px;}
.exam-modal-tip-rows{display:flex;align-items:stretch;width:100%;background:var(--surface-2,#f9fafb);border-radius:6px;overflow:hidden;}
.exam-modal-tip-row{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px 12px;}
.exam-modal-tip-row + .exam-modal-tip-row::before{content:'';position:absolute;left:0;top:50%;width:0;height:120px;border-left:1px solid #d1d5db;transform:translateY(-50%);}
.exam-modal-tip-figure{display:flex;flex-direction:column;align-items:center;gap:4px;}
.exam-modal-tip-identity{display:flex;flex-direction:column;align-items:center;gap:8px;}
.exam-modal-tip-index{display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:var(--ink);font-size:13px;font-weight:600;line-height:19px;}
.exam-modal-tip-icon{display:block;width:48px;height:48px;flex:0 0 48px;overflow:hidden;border-radius:24px;}
.exam-modal-tip-icon img{display:block;width:48px;height:48px;}
.exam-modal-tip-module-name{font-family:inherit;font-size:16px;font-weight:600;line-height:24px;color:var(--ink);}
.exam-modal-tip-meta{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:0;color:var(--ink-2,#374151);font-size:14px;line-height:20px;text-align:center;}
.exam-modal-tip-count,.exam-modal-tip-value{color:var(--ink-2,#374151);font-size:14px;line-height:20px;white-space:nowrap;}
.exam-modal-tip-total{display:flex;align-items:center;gap:4px;flex:0 0 auto;}
.exam-modal-tip-total-icon{display:block;width:28px;height:28px;flex:0 0 28px;object-fit:contain;}
.exam-modal-tip-total .exam-modal-tip-value{color:var(--ink,#111827);font-size:16px;font-weight:600;line-height:24px;}
/* 答题卡：分组标题居中并左右带细线，格子放大到 40px（Figma 588:10527） */
.exam-answer-sections{display:grid;gap:24px;}
.exam-answer-section h3{display:flex;align-items:center;gap:12px;margin:0 0 12px;color:var(--ink-2);font-family:inherit;font-size:14px;font-weight:400;line-height:20px;}
.exam-answer-section h3::before,.exam-answer-section h3::after{content:'';flex:1;height:1px;background:var(--line);}
.exam-answer-section h3>span{flex:0 0 auto;}
.exam-answer-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;}
.exam-answer-cell{position:relative;height:40px;border:1px solid var(--line);border-radius:6px;background:#fff;font-size:14px;cursor:pointer;}
.exam-answer-cell:hover{border-color:var(--seal);}
.exam-answer-cell.answered{border-color:color-mix(in srgb,var(--seal) 48%,var(--line));background:var(--seal-tint);color:var(--seal);}
/* 部分作答：半填色，与导航图例的 partial 同一视觉语言 */
.exam-answer-cell.partial{border-color:color-mix(in srgb,var(--seal) 48%,var(--line));color:var(--seal);background:linear-gradient(90deg,var(--seal-tint) 0 50%,#fff 50% 100%);}
.exam-answer-cell.marked::after{content:"";position:absolute;right:2px;top:2px;width:8px;height:8px;background:var(--gold);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 56%,79% 94%,50% 72%,21% 94%,32% 56%,2% 35%,39% 35%);}
.exam-tools{display:grid;gap:24px;}
.exam-tools-section{display:grid;gap:8px;}
.exam-tools-label{color:var(--ink);font-size:var(--exam-ui-text-size);font-weight:600;line-height:24px;}
.exam-tools-fonts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;}
.exam-tools-font{min-width:0;height:62px;min-height:42px;padding:8px 11px;border:1px solid var(--line);border-radius:3px;background:#fff;color:var(--ink);font-size:var(--exam-ui-text-size);font-weight:500;display:flex;align-items:center;justify-content:center;line-height:1;}
/* 三个按钮各自用它代表的字号渲染（标准 20 / 较大 24 / 大 28，与点击后生效的
   --exam-text-size 同值），按钮本身就是预览，点之前就知道会变多大。
   R103：可见内容统一为 A，档位名称只保留为 aria-label。 */
.exam-tools-font[data-tool-font="medium"]{font-size:var(--exam-text-size-medium);}
.exam-tools-font[data-tool-font="large"]{font-size:var(--exam-text-size-large);}
.exam-tools-font[data-tool-font="xlarge"]{font-size:var(--exam-text-size-xlarge);}
.exam-tools-font:hover{border-color:var(--seal);background:var(--seal-tint);color:var(--ink);}
.exam-tools-font.is-active{border-color:var(--seal);background:var(--seal-tint);color:var(--ink);}
/* 稿把喇叭图标、滑条、数值排成一行；滑条用深墨，白椭圆滑块 */
.exam-tools-volume-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:10px;}
.exam-tools-volume-icon{width:24px;height:24px;display:block;object-fit:contain;}
.exam-tools-volume-value{min-width:32px;color:var(--ink);font-size:var(--exam-ui-text-size);font-weight:650;font-variant-numeric:tabular-nums;line-height:24px;text-align:right;}
.exam-tools-volume{--exam-volume-pct:50%;display:block;width:100%;height:22px;margin:0;padding:0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none;}
.exam-tools-volume:focus{outline:none;}
.exam-tools-volume:focus-visible{outline:2px solid var(--seal);outline-offset:3px;}
.exam-tools-volume::-webkit-slider-runnable-track{height:8px;border:0;border-radius:4px;background:linear-gradient(to right,var(--ink) var(--exam-volume-pct),var(--line) var(--exam-volume-pct));}
.exam-tools-volume::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:22px;margin-top:-7px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(17,24,39,.12);}
.exam-tools-volume::-moz-range-track{height:8px;border:0;border-radius:4px;background:var(--line);}
.exam-tools-volume::-moz-range-progress{height:8px;border:0;border-radius:4px;background:var(--ink);}
.exam-tools-volume::-moz-range-thumb{width:12px;height:22px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(17,24,39,.12);}
.exam-submit-summary{padding:0;border:0;background:transparent;color:var(--ink-2);font-size:14px;line-height:1.75;}
/* 交卷中 / 保存中：Figma 833:835 Submitting Small，430×245、内容居中。
   确认/失败仍 Hug，不跟这一扇锁同一高度。 */
.exam-modal.processing,.exam-modal.small.processing{width:min(430px,calc(100vw - 32px));height:245px;min-height:245px;padding:24px;justify-content:center;box-sizing:border-box;}
.exam-modal.processing .exam-modal-head{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;flex:none;min-height:0;}
.exam-modal.processing .exam-modal-body{display:flex;align-items:center;justify-content:center;flex:1 1 auto;padding:0;overflow:visible;text-align:center;}
.exam-submit-processing{display:grid;justify-items:center;align-content:center;gap:24px;padding:0;text-align:center;}
.exam-submit-summary.exam-submit-processing .exam-submit-processing-title{margin:0;font-family:inherit;font-size:22px;font-weight:700;line-height:1.4;color:var(--ink);}
.exam-submit-spinner{width:48px;height:48px;border:3px solid color-mix(in srgb,var(--seal) 22%,transparent);border-top-color:var(--seal);border-radius:50%;animation:exam-submit-spin .8s linear infinite;}
@keyframes exam-submit-spin{to{transform:rotate(360deg);}}
.exam-finish{height:100%;display:flex;align-items:center;justify-content:center;padding:32px;background:#f5f6f7;}
.exam-finish-card{width:min(620px,100%);padding:48px;border:1px solid var(--line);background:#fff;text-align:center;}
.exam-finish-mark{width:70px;height:70px;margin:0 auto 20px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--seal-tint);color:var(--seal);font-size:32px;}
.exam-finish-icon{width:36px;height:36px;}
.exam-finish-card h2{font-family:inherit;font-size:27px;}
.exam-finish-card p{margin:12px auto 24px;max-width:430px;color:var(--ink-3);}
.exam-finish-card .exam-dialog-figure p{margin:0;max-width:none;color:var(--ink-2,#374151);font-size:15px;line-height:21px;}
.exam-finish-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;}
.exam-finish-actions.exam-submission-failure-actions{gap:12px;margin-top:24px;}
.exam-preview{min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
.exam-preview-icon{width:72px;height:72px;margin-bottom:18px;border:1px solid color-mix(in srgb,var(--seal) 40%,var(--line));border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--seal-tint);color:var(--seal);font-size:28px;}
.exam-preview h2{font-family:inherit;font-size:24px;}
.exam-preview p{margin-top:10px;color:var(--ink-3);}
.exam-preview-progress{width:min(520px,80%);height:7px;margin-top:24px;background:#dfe8d8;overflow:hidden;}
.exam-preview-progress span{display:block;height:100%;background:var(--seal);transition:width .3s linear;}
@media(max-width:1180px){
  .exam-client{--exam-nav-w:208px;--exam-side-w:220px;}
  .exam-client-status{gap:12px;}
  .exam-nav-groups{grid-template-columns:repeat(4,minmax(0,1fr));}
  .exam-question-shell{padding:72px 19px 19px;}
  .exam-picture-prompt{grid-template-columns:1fr;gap:16px;}
}
/* 短屏收紧主图高度预算，保证「图 + 题干 + 选项」尽量一屏内 */
@media(max-height:760px){
  .exam-client{--exam-image-max-h:min(38vh,320px);}
}
@media(max-width:1023px){
  .exam-client{--exam-image-max-h:min(34vh,300px);}
  .exam-question-presentation[data-media-layout="split"]{grid-template-columns:minmax(0,1fr);}
  .exam-question-scroll.has-split{overflow:auto;}
  .exam-question-scroll.has-split>.exam-question-shell{height:auto;min-height:100%;display:block;}
  .exam-question-scroll.has-split>.exam-question-shell>.exam-group-item{flex:none;display:block;}
  .exam-question-presentation[data-media-layout="split"]>.exam-material-pane,
  .exam-question-presentation[data-media-layout="split"]>.exam-answer-pane{overflow-y:visible;}
  .exam-question-presentation[data-media-layout="split"]>.exam-material-pane{padding:14px;border-right:0;border-bottom:1px solid var(--line);}
  .exam-question-presentation[data-media-layout="split"]>.exam-answer-pane{padding:14px;}
}
@media(max-width:720px){
  .exam-material-audio{grid-template-columns:minmax(0,1fr) auto;}
  .exam-material-audio-track{grid-column:1/-1;grid-row:2;}
  .exam-question-guide{align-items:flex-start;flex-direction:column;}
  .exam-modal.notice-tabs{width:calc(100vw - 28px);padding:14px;gap:16px;}
  .exam-modal.notice-tabs .exam-modal-head{right:14px;top:14px;}
  .exam-modal.notice-tabs .exam-modal-body{padding:0;}
  .exam-modal.notice-tabs:has(.exam-modal-tip-content) .exam-modal-body{padding:0;}
  .exam-modal.notice-tabs:has(.exam-modal-tip-content) .exam-modal-foot{padding:0;}
  .exam-modal.notice-tabs .exam-modal-foot{padding:0;}
  .exam-modal-tab{min-height:52px;padding:0 11px;font-size:15px;}
  .exam-modal-tab.is-active::after{right:11px;left:11px;}
  .exam-modal-tip-row{padding:16px 8px;}
  .exam-modal-tip-row + .exam-modal-tip-row::before{height:96px;}
  .exam-modal-tip-total{flex-wrap:wrap;}
}