/* edu-cards.css — EduU 批改/出题/教学图富卡片样式(单一真源,与 edu-cards.js 成对消费)
 *
 * 消费契约:
 * 1) 随 edu-cards.js 的卡片 HTML 一同注入宿主环境(<link> 引入或内联注入均可);
 * 2) 令牌自带默认回落:本文件 :root 内置全套 --s-* 令牌默认值(与 EduU requiz.html
 *    取值同步),宿主零配置注入即得标准视觉;宿主要自定义令牌,须在本文件之后注入
 *    或后定义(级联同 specificity 后者胜);卡片实际引用以下令牌:
 *    --s-panel(卡面) --s-panel-2(浅底) --s-line(描线) --s-ink(主文) --s-ink-2(次文)
 *    --s-gold(强调/题型) --s-bad(错误红) --s-good(正确绿) --s-green(主题绿)
 *    --s-green-soft(选项选中浅绿) --s-gold-soft/--s-good-soft/--s-bad-soft(判定染色底)
 *    --s-nm-lt/--s-nm-dk(新拟态双向阴影亮/暗部,2026-09-25 新增:卡面靠双向阴影分层,
 *    宿主换深色底时须同步覆盖这两个,否则暖色阴影在深底上发灰);
 * 3) .gs-bubble .card 为气泡宿主下的紧凑适配(气泡已凸起,卡取凹槽内嵌形态);
 *    无 .gs-bubble 上下文时卡片取凸起形态——Genshu 沙箱宿主即后者;
 * 4) keyframes grow/pulse 在本文件自带副本(宿主已定义同名时内容一致,无副作用)。
 *
 * 2026-09-25 新拟态 v2(原型 prototype/eduu-neumorphism-session.html 确认方向):
 * 卡面去描边改双向阴影(凸=承载/凹=内嵌);语义判定色由左边框改「染色底+色字」。
 * 2026-09-26:essay 内联标记改手写红笔画圈(.w-circ,替代划线族);solution/answer
 * 正解卡加 <details> 折叠(.fold-card,kicker 行即开关,默认展开)。
 */

/* ============ 令牌默认回落(单一真源内置;值同步 EduU requiz.html :root) ============
 * EduU 自身:requiz.html 的 :root 在内联 <style> 中、晚于本 <link>,级联覆盖本块,视觉不变。
 * 外部宿主(Genshu 等):零配置注入即得标准视觉;自定义令牌须后注入/后定义覆盖本块。 */
:root{
  --s-panel:#E9E5D8;
  --s-panel-2:#E3DED0;
  --s-ink:#232922;
  --s-ink-2:#6E7569;
  --s-line:rgba(157,150,124,.32);
  --s-green:#1E4A37;
  --s-green-soft:#D9E4D8;
  --s-gold:#A9761B;
  --s-gold-soft:#EFE3C8;
  --s-good:#22744A;
  --s-good-soft:#DDEBDF;
  --s-bad:#A8402F;
  --s-bad-soft:#F1E0DA;
  --s-nm-lt:rgba(255,255,255,.95);
  --s-nm-dk:rgba(157,150,124,.55);
}

/* 卡面基底:凸起(承载面)。气泡内由 .gs-bubble .card 改凹槽 */
.card{
  background:var(--s-panel);
  border-radius:12px;padding:15px 17px;
  box-shadow:4px 4px 9px var(--s-nm-dk),-4px -4px 9px var(--s-nm-lt);
  font-size:13.5px;line-height:1.6;color:var(--s-ink);
  max-width:100%;
}
.card .card-kicker{
  display:flex;align-items:center;gap:8px;
  font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--s-gold);margin-bottom:9px;
}
.card .card-kicker::after{content:"";flex:1;height:1px;background:var(--s-line)}
.card h4{font-size:14.5px;font-weight:600;margin-bottom:6px;color:var(--s-ink);line-height:1.75}
.card .hint{font-size:12px;color:var(--s-ink-2);margin-top:8px}
.card .hint b{color:var(--s-gold)}

/* 掌握度进度条(score 卡 s-row 内;宿主左栏等场景可复用基础 .bar 再自行适配尺寸) */
.bar{height:7px;border-radius:4px;background:var(--s-panel-2);overflow:hidden;
  box-shadow:inset 1.5px 1.5px 3px var(--s-nm-dk),inset -1.5px -1.5px 3px var(--s-nm-lt)}
.bar i{display:block;height:100%;border-radius:4px;background:var(--s-green);width:var(--w,0%);animation:grow .9s ease-out}
@keyframes grow{from{width:0}}

/* 批改卡片(协议:```verdict/mistakes/answer/score 围栏,样式对齐 demo) */
/* 气泡宿主:气泡已凸起,卡改凹槽内嵌(紧凑) */
.gs-bubble .card{padding:11px 13px;border-radius:10px;font-size:13.5px;margin:2px 0;
  box-shadow:inset 3px 3px 7px var(--s-nm-dk),inset -3px -3px 7px var(--s-nm-lt)}
/* 判定卡:左边框方案 → 染色底+色字(新拟态下描边不可见) */
.verdict-card.bad{background:var(--s-bad-soft)}
.verdict-card.warn{background:var(--s-gold-soft)}
.verdict-card.ok{background:var(--s-good-soft)}
.v-title{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px}
.v-ic{width:20px;height:20px;border-radius:50%;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none}
.verdict-card.bad .v-ic{background:var(--s-bad)}
.verdict-card.warn .v-ic{background:var(--s-gold)}
.verdict-card.ok .v-ic{background:var(--s-good)}
.verdict-card.bad .v-title{color:var(--s-bad)}
.verdict-card.warn .v-title{color:var(--s-gold)}
.verdict-card.ok .v-title{color:var(--s-good)}
.v-compare{margin-top:8px;font-size:13px;line-height:1.6;color:var(--s-ink-2)}
.v-compare b{color:var(--s-ink)}
/* 逐点修正条:左边框 → 染色凹槽 */
.fix-item{border-radius:9px;padding:8px 11px;margin:8px 0;
  box-shadow:inset 1.5px 1.5px 3.5px var(--s-nm-dk),inset -1.5px -1.5px 3.5px var(--s-nm-lt)}
.fix-item.g{background:var(--s-bad-soft)}
.fix-item.w{background:var(--s-gold-soft)}
.fix-item.s{background:var(--s-good-soft)}
.fix-tag{font-size:10.5px;font-weight:700;letter-spacing:.12em;color:var(--s-ink-2)}
.fix-item.g .fix-tag{color:var(--s-bad)}
.fix-item.w .fix-tag{color:var(--s-gold)}
.fix-item.s .fix-tag{color:var(--s-good)}
.fix-line{margin:4px 0;font-size:13.5px;line-height:1.6}
.fix-line .bad-t{text-decoration:line-through;text-decoration-color:var(--s-bad);color:var(--s-bad)}
.fix-line .arr{color:var(--s-ink-2);margin:0 6px}
.fix-line .good-t{color:var(--s-good);font-weight:600}
.fix-why{font-size:12.5px;color:var(--s-ink-2);line-height:1.65}
.fix-why b{color:var(--s-ink)}
.score-rows{display:grid;gap:7px;margin:2px 0 4px}
.s-row{display:grid;grid-template-columns:52px 1fr 30px;align-items:center;gap:9px;font-size:12.5px}
.s-row .lb{color:var(--s-ink-2)}
.s-row .num{font-weight:700;text-align:right;font-variant-numeric:tabular-nums;color:var(--s-green)}
.answer-body{font-size:13.5px;line-height:1.7}
/* 正解卡折叠(solution/answer,2026-09-26):<details> 原生交互零 JS,kicker 行即 summary——
 * 点行收起/展开,长解答不再占屏;默认展开(到达即读,折起由学生定),chevron 随 [open] 旋向 */
.card.fold-card>.card-kicker{cursor:pointer;list-style:none;user-select:none;-webkit-user-select:none}
.card.fold-card>.card-kicker::-webkit-details-marker{display:none}
.card.fold-card>.card-kicker::after{order:1}
.card.fold-card>.card-kicker .fold-ic{order:2;flex:none;width:7px;height:7px;margin:2px 1px 0;
  border-top:1.6px solid var(--s-gold);border-right:1.6px solid var(--s-gold);
  transform:rotate(45deg);transition:transform .18s ease}
.card.fold-card[open]>.card-kicker .fold-ic{transform:rotate(135deg)}
.card.fold-card>.card-kicker:hover .fold-ic{border-color:var(--s-ink)}
/* 出题卡(协议:```quiz 围栏):待作答取中性色,不预支判定色;选择/判断题选项可点代发作答 */
.quiz-meta{display:flex;flex-wrap:wrap;gap:6px;margin:1px 0 8px}
.quiz-meta span{font-size:11px;padding:2px 9px;border-radius:999px;background:var(--s-panel-2);color:var(--s-ink-2);
  box-shadow:inset 1.5px 1.5px 3px var(--s-nm-dk),inset -1.5px -1.5px 3px var(--s-nm-lt)}
.quiz-meta .q-type{background:var(--s-gold);color:#fff;font-weight:600;letter-spacing:.04em;box-shadow:none}
.quiz-meta .q-wait::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--s-gold);margin-right:5px;vertical-align:1px;animation:pulse 2s infinite}
.quiz-stem{font-size:14px;font-weight:500;line-height:1.75}
.quiz-opts{display:grid;gap:7px;margin-top:9px}
.quiz-opt{display:flex;align-items:flex-start;gap:9px;width:100%;text-align:left;
  background:var(--s-panel);border-radius:9px;
  box-shadow:2.5px 2.5px 6px var(--s-nm-dk),-2.5px -2.5px 6px var(--s-nm-lt);
  padding:8px 11px;font:inherit;font-size:13.5px;line-height:1.6;color:var(--s-ink);cursor:pointer;
  transition:box-shadow .15s,background .15s,color .15s}
.quiz-opt:hover{background:var(--s-green-soft);color:var(--s-green)}
.quiz-opt i{flex:none;width:19px;height:19px;border-radius:50%;
  font-style:normal;font-size:10.5px;font-weight:700;color:var(--s-ink-2);
  display:inline-flex;align-items:center;justify-content:center;margin-top:1px;
  box-shadow:inset 1px 1px 2.5px var(--s-nm-dk),inset -1px -1px 2.5px var(--s-nm-lt)}
.quiz-opt:hover i{color:var(--s-green)}
.quiz-foot{font-size:12px;color:var(--s-ink-2);margin-top:8px}
.quiz-foot b{color:var(--s-ink)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* 教学图卡(协议:```figure 围栏,2026-09-20 增):载荷=标题行+内联 SVG+说明行;
 * SVG 经 edu-cards.js sanitizeSvg 消毒后注入,此处仅做版式——svg 随卡宽自适应(高度等比);
 * 标题/说明配色复用既有令牌(--s-ink/--s-ink-2),无新增令牌 */
.figure-card .figure-title{font-size:14px;font-weight:600;color:var(--s-ink);line-height:1.7;margin:1px 0 6px}
.figure-svg{margin:4px 0}
.figure-svg svg{width:100%;height:auto;display:block}
.figure-card .figure-note{font-size:12.5px;color:var(--s-ink-2);line-height:1.65;margin-top:8px}

/* essay 三卡组(协议:```essay 围栏,2026-09-24 第 10 tag,demo Chapter 02 基准)。
 * 字体:demo 用 Fraunces,沙箱 CSP default-src 'none' 禁外联 → 系统衬线栈;
 * EduU 宿主如需 Fraunces 可自行覆盖 .essay/.score-total .num(font-family 已令牌位化)。
 * 全部复用既有 --s-* 令牌,无新令牌 */
.essay-prompt{font-size:12.5px;color:var(--s-ink-2);line-height:1.6;margin:1px 0 8px}
.essay{font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.85;color:var(--s-ink);margin:2px 0}
/* essay 原文卡词/短语问题标记(2026-09-26):手写红笔画圈替代划线族(删除线/点线/波浪线)——
 * 学生熟悉的老师圈重点手势。2026-09-26c 装饰按类型分工(真实老师批改手势语言):
 * g 语法=红笔手绘圈(.w-circ 内联 SVG,仅 g 内嵌)、w 词汇升级=金色手绘波浪底线、
 * s 句式重构=红色手绘底线——形状与颜色冗余编码,色弱可辨;底线走 CSS 背景
 * data-URI 手绘瓦片 repeat-x 平铺:span 保持普通 inline(不要 inline-block),
 * 跨行折断每行各自有底线(s 型长碎片刚需);瓦片描边色硬编码(背景 SVG 不吃
 * --s-* 令牌),暗色块整体换瓦片同步。
 * 底线定位(20260926d 修正):inline 元素的背景定位区=字形内容盒(≈1.14em,
 * 由字体度量决定,非行盒)——首版 calc(100% - .44em) 按行盒估算,实际落到
 * 字腹成了居中划线;改 bottom 锚定 + padding-bottom 撑出线下空间:锚点=
 * 内容盒下缘(即下降部线,天然恒定),瓦片中心压在下降部线下 ~0.03em,与
 * 字体度量/行高/宿主覆盖全解耦(inline padding 不参与行高计算,零布局位移)。 */
 * 2026-09-26b 圈尺寸修正(上线反馈:圈过高/宽词圈不到首尾):
 * - 圈标记 span(w-err)inline-block 原子盒(防跨行碎片并盒→巨型椭圆):短语随整体
 *   换行,超长碎片(s 型)盒内折行,max-width:100% 不溢卡;
 * - 圈高贴字形带不贴行盒:height 按 100% 行盒扣上下半行距(≈1.2em)——旧版
 *   100%+6px 跟着 line-height 1.85 膨胀到 1.7 倍字高且渗进相邻行;min-height 兜底
 *   宿主收紧 line-height 时仍包住字形;top:50% 平移居中对齐墨迹带中心;
 * - 路径墨迹铺满 viewBox 横向(见 edu-cards.js CIRC 注释),椭圆恒 ≥ 词宽 ±4px;
 * - 圈与底线同理念:贴字形带而非行盒,圈用 50% 平移居中墨迹带、线锚内容盒
 *   下缘(下降部线),互不渗相邻行。 */
.essay .w-err{position:relative;display:inline-block;max-width:100%;color:var(--s-bad);font-weight:600}
.essay .w-adj{color:var(--s-gold);font-weight:500;padding-bottom:.14em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 16' preserveAspectRatio='none'%3E%3Cpath d='M0,8 C4,3.5 7,3.5 10,8 C13,12.5 16,12.5 20,8 C24,3.5 27,3.5 30,8 C33,12.5 36,12.5 40,8' fill='none' stroke='%23A9761B' stroke-width='5.5' stroke-linecap='round'/%3E%3C/svg%3E") left bottom/auto .34em repeat-x}
.essay .w-frag{color:var(--s-ink);padding-bottom:.1em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 10' preserveAspectRatio='none'%3E%3Cpath d='M0,5 C15,3.5 30,6.5 45,4 C52,3 56,5.5 60,4.5' fill='none' stroke='%23A8402F' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") left bottom/auto .26em repeat-x}
.essay .w-circ{position:absolute;left:-4px;top:50%;transform:translateY(-50%);width:calc(100% + 8px);height:calc(100% - .6em);min-height:1.15em;overflow:visible;pointer-events:none}
.essay .w-circ path{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.essay .w-err .w-circ path{stroke:var(--s-bad)}
.essay .s-mk{font-weight:700}
.essay .s-mk.bad-t{color:var(--s-bad)}
.essay .s-mk.good-t{color:var(--s-good)}
.sides{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0}
.side{font-size:11.5px;padding:4px 11px;border-radius:999px;font-weight:600;letter-spacing:.03em}
.side.pro{background:var(--s-green);color:#fff}
.side.fmt{background:var(--s-panel-2);color:var(--s-ink-2)}
/* essay 评分扩展(score 围栏 v2:维度 值/满分 + 总分块 + 等级行;旧载荷无 总分/等级 行时不走此结构) */
.score-wrap{display:flex;gap:18px;align-items:flex-start}
.score-left{flex:1;display:grid;gap:9px;min-width:0}
.rrow{display:grid;grid-template-columns:96px 1fr 34px;align-items:center;gap:10px;font-size:12.5px}
.rrow .lb{color:var(--s-ink-2);overflow-wrap:anywhere}
.rrow .val{font-weight:700;text-align:right;font-variant-numeric:tabular-nums;color:var(--s-green)}
.score-total{flex:none;text-align:center;background:var(--s-green);color:#fff;border-radius:10px;padding:13px 18px;min-width:104px;
  box-shadow:4px 4px 9px rgba(126,115,86,.5),-4px -4px 9px rgba(255,255,255,.8)}
.score-total .num{font-family:Georgia,'Times New Roman',serif;font-size:30px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.score-total .num small{font-size:14px;font-weight:400;opacity:.7}
.score-total .lvl{font-size:11px;letter-spacing:.08em;margin-top:5px;opacity:.85}
/* 暗色回落:仅覆盖本文件的 :root 令牌默认值;宿主(requiz 等)自带 :root 定义在其后加载者不受影响。
 * 新拟态阴影双令牌同步回落:亮部改极淡白(深底上白高光会塑料感),暗部加深 */
@media (prefers-color-scheme: dark){
  :root{
    --s-panel:#232A25;--s-panel-2:#2C342E;--s-line:#3C463E;--s-ink:#E8EDE8;--s-ink-2:#9AA69C;
    --s-green:#2E6B4F;--s-green-soft:#24352C;--s-gold:#D2A24C;--s-good:#5FA57F;--s-bad:#C97662;
    --s-gold-soft:#332B18;--s-good-soft:#1F2E26;--s-bad-soft:#33221E;
    --s-nm-lt:rgba(255,255,255,.06);--s-nm-dk:rgba(0,0,0,.45);
  }
  /* essay 底线瓦片暗色替换(瓦片描边色硬编码不随令牌,这里整图换) */
  .essay .w-adj{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 16' preserveAspectRatio='none'%3E%3Cpath d='M0,8 C4,3.5 7,3.5 10,8 C13,12.5 16,12.5 20,8 C24,3.5 27,3.5 30,8 C33,12.5 36,12.5 40,8' fill='none' stroke='%23D2A24C' stroke-width='5.5' stroke-linecap='round'/%3E%3C/svg%3E")}
  .essay .w-frag{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 10' preserveAspectRatio='none'%3E%3Cpath d='M0,5 C15,3.5 30,6.5 45,4 C52,3 56,5.5 60,4.5' fill='none' stroke='%23C97662' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E")}
}