/* 论文 B 在线实验的附加样式 */
html, body { background: #E8E8E8; }
.jspsych-display-element { font-family: "Helvetica Neue", Arial, sans-serif; font-size: 17px; color: #222; }
.jspsych-content { max-width: 820px; }
.consent-box { text-align: left; max-width: 760px; margin: 0 auto; max-height: 62vh; overflow-y: auto;
               background: #fff; padding: 18px 26px; border: 1px solid #ccc; line-height: 1.5; font-size: 15px; }
.instr { text-align: left; max-width: 700px; margin: 0 auto; line-height: 1.55; }
.q-prompt { margin: 4px 0 8px 0; font-size: 18px; }
.check-prompt { margin: 4px 0 8px 0; font-size: 18px; color: #7a1f1f; }
/* 评分页的纵向间距（插件默认上下各留 100 像素，笔记本屏幕放不下 600 像素的图） */
#jspsych-progressbar-container { padding: 4px 0; margin-bottom: 0.3em; }
#jspsych-image-slider-response-wrapper { margin: 4px 0 0 0 !important; }
.jspsych-image-slider-response-container { margin: 0 auto 2.1em auto !important; }
#jspsych-image-slider-response-next { margin-bottom: 8px; }
/* 滑块手柄在第一次点击之前隐藏（被试点击滑轨后手柄出现在点击处） */
input[type=range].no-thumb::-webkit-slider-thumb { opacity: 0; }
input[type=range].no-thumb::-moz-range-thumb { opacity: 0; }
input[type=range]:disabled { cursor: default; }
.demog label { display: block; margin: 12px 0 4px 0; text-align: left; }
.demog .opt { display: inline-block; margin-right: 16px; }
/* 结束页与撤回页 */
.wcode { font-family: "SFMono-Regular", Menlo, Consolas, monospace; font-weight: bold; letter-spacing: 1px;
         background: #f3f3f3; padding: 1px 6px; border-radius: 3px; }
.small { font-size: 14px; color: #555; }
.err { color: #7a1f1f; }
.withdraw-page { font-family: "Helvetica Neue", Arial, sans-serif; color: #222; }
.withdraw-box { margin-top: 48px; max-height: none; font-size: 16px; }
.withdraw-box button { font-size: 15px; padding: 7px 16px; border: 1px solid #aaa; border-radius: 4px;
                       background: #fff; cursor: pointer; }
.withdraw-box button:disabled { cursor: default; color: #888; }
.withdraw-box input[type=text] { font-size: 17px; padding: 4px 8px; letter-spacing: 1px; width: 12em; }
.done-box { margin: 80px auto; max-width: 600px; }
.end-thanks { margin-top: 18px; font-weight: bold; }
/* 同意书下方的勾选框（勾选后「Continue」才可点） */
.consent-check { max-width: 760px; margin: 12px auto 4px auto; text-align: left; font-size: 15px; line-height: 1.45; }
.consent-check input { transform: scale(1.25); margin-right: 8px; vertical-align: -1px; }
#jspsych-html-button-response-btngroup button:disabled { opacity: 0.45; cursor: default; }
/* 背景问项里的下拉框 */
.demog select { font-size: 15px; padding: 3px 4px; max-width: 100%; }
/* 评分页右下角的「Instructions」按钮与说明浮层 */
#instr-btn { display: none; position: fixed; right: 14px; bottom: 12px; z-index: 50; font-size: 13px;
             padding: 5px 10px; border: 1px solid #aaa; border-radius: 4px; background: #fff; color: #333; cursor: pointer; }
#instr-btn.show { display: block; }
#instr-overlay { display: none; position: fixed; inset: 0; z-index: 60; background: rgba(0, 0, 0, 0.35);
                 align-items: center; justify-content: center; }
#instr-overlay.open { display: flex; }
#instr-overlay .instr-panel { background: #fff; max-width: 620px; margin: 0 16px; padding: 16px 24px; text-align: left;
                              line-height: 1.5; font-size: 16px; border-radius: 4px; }
#instr-overlay button { font-size: 15px; padding: 6px 16px; border: 1px solid #aaa; border-radius: 4px; background: #fff;
                        cursor: pointer; }
/* 中文版（lang=zh，2026-10-01）：用简体中文字体（没有时退回系统的无衬线字体） */
html:lang(zh) body, html:lang(zh) .jspsych-display-element, html:lang(zh) .withdraw-page {
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif; }
/* 10-03 界面（用户要求「该醒目的地方更醒目」）。只改样式，文字不变 */
/* —— 注意检查：同一句提示以大号黄底框叠在变暗的图片中央；目标端旁有箭头；滑块上方那句加粗放大、黄底红字 */
.stim-box { position: relative; display: inline-block; vertical-align: top; line-height: 0; }
.stim-box canvas { display: block; }
.check-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
                 pointer-events: none; background: rgba(25, 25, 25, 0.5); }
.check-banner { line-height: 1.35; max-width: 90%; padding: 16px 24px 18px; color: #3b1d00; background: #ffe066;
                border: 5px solid #e8590c; border-radius: 10px; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5); text-align: center; }
.check-banner .cb-head { font-size: 38px; font-weight: 800; color: #c92a2a; margin-bottom: 6px; white-space: nowrap; }
.check-banner .cb-icon { display: inline-block; width: 1.1em; height: 1.1em; line-height: 1.1em; margin-right: 10px;
                         border-radius: 50%; background: #c92a2a; color: #fff; font-size: 0.8em; vertical-align: 0.1em; }
.check-banner .cb-body { font-size: 27px; font-weight: 700; }
html:lang(zh) .check-banner .cb-body { font-size: 32px; }
.check-banner .cb-dir { color: #c92a2a; font-size: 1.2em; text-decoration: underline; text-underline-offset: 5px; }
.check-banner .cb-keep { white-space: nowrap; }
.check-banner .cb-note { display: block; font-size: 0.8em; margin-bottom: 2px; }
#q-prompt.check-prompt { display: inline-block; margin: 2px 0 8px 0; padding: 1px 12px; font-size: 18px; font-weight: bold;
                         color: #c92a2a; background: #fff3bf; border-radius: 4px; text-wrap: balance; }
html:lang(zh) #q-prompt.check-prompt { font-size: 21px; }
.check-arrow { position: absolute; top: -6px; line-height: 0; }
.check-arrow.to-right { right: -58px; animation: nudge-r 1.1s ease-in-out infinite; }
.check-arrow.to-left { left: -58px; transform: scaleX(-1); animation: nudge-l 1.1s ease-in-out infinite; }
@keyframes nudge-r { 0%, 100% { translate: 0 0; } 50% { translate: 7px 0; } }
@keyframes nudge-l { 0%, 100% { translate: 0 0; } 50% { translate: -7px 0; } }
/* 指导语与「说明」浮层里讲注意检查的那句 */
.instr p.check-note, .instr-panel p.check-note { background: #fff3bf; border-left: 6px solid #e8590c; padding: 8px 12px;
                                                font-weight: bold; }
/* —— 自然度块：整块浅蓝底；问题在图片上方、加大加框；两端锚点加粗；说明页关键句加大加框 */
html.nat-block, html.nat-block body { background: #dfe9f5; }
#q-prompt.q-prompt.nat-prompt { display: inline-block; margin: 0 0 8px 0; padding: 4px 20px; font-size: 21px; font-weight: bold;
                                color: #12395f; background: #fff; border: 3px solid #2f6da3; border-radius: 8px; text-wrap: balance; }
html:lang(zh) #q-prompt.q-prompt.nat-prompt { font-size: 26px; }
html.nat-block .jspsych-image-slider-response-container span { font-size: 100% !important; font-weight: bold; color: #12395f; }
html.nat-block .instr h3 { font-size: 30px; color: #12395f; }
.instr p.nat-key { padding: 12px 18px; font-size: 26px; font-weight: bold; color: #12395f; background: #fff;
                   border: 3px solid #2f6da3; border-radius: 8px; }
/* 手机提示页（10-09）：网址框与「复制网址」按钮。网址框字号 16 像素，免得 iOS 点进去时自动放大页面；两侧留白。
   网址框的选择器要压过 jsPsych 自带的 .jspsych-display-element input[type="text"]（14 像素） */
.phone-page { padding: 0 16px; }
.jspsych-display-element input.share-url { display: block; width: 100%; box-sizing: border-box; margin: 2px 0 10px 0; padding: 10px 12px; font-size: 16px;
             font-family: "SFMono-Regular", Menlo, Consolas, monospace; color: #222; background: #fff; border: 1px solid #aaa;
             border-radius: 6px; }
.phone-page #copy-url { margin: 0; font-size: 16px; padding: 8px 20px; }