/* 新加坡中学平面几何 · 样式表
   纸面：暖白底，墨色细线，一个青灰主色（链接、按钮、进度）。
   轻拟物只用一层：卡片和图纸是从纸面上柔和浮起的一张纸；按钮是平的，只有发丝边，按下时略暗；
   步骤框、提示框只比卡片深一点点，不画内凹阴影。
   图中颜色各管一件事：橙 = 当前这一句说的东西（蓝、紫 = 第二、第三个三角形）；赭红 = 本步求出（之前求出的降为灰色小字）；
   绿色虚线 = 辅助线；紫色副本 = 变换动画；绿 / 品红粗轮廓 = 母题骨架。 */
:root{
  /* 纸面与文字 */
  --bg:#F4F2ED;--card:#FFFEFB;--sunk:#F7F5F0;--paper:#FFFEFA;
  --ink:#232220;--ink2:#3B3935;--muted:#5F5C56;
  --hair:rgba(40,36,30,.12);--hair2:rgba(40,36,30,.24);
  /* 主色（青灰）及其浅色 */
  --a:#2F5559;--a2:#3C686D;--ab:#C9D7D7;--soft:#EEF2F1;--accent:#9A3B2E;
  /* 暖色提示（先想一想、提示、进行中） */
  --warm:#8A5A1E;--warmb:#E7C79F;--warmbg:#FFF8EE;--warmhv:#FCEBD3;
  /* 唯一一层浮起 */
  --raise:0 1px 0 rgba(255,255,255,.9) inset,0 1px 2px rgba(40,36,30,.06),0 10px 24px -14px rgba(40,36,30,.26);
  --raise-hv:0 1px 0 rgba(255,255,255,.9) inset,0 2px 4px rgba(40,36,30,.07),0 16px 30px -14px rgba(40,36,30,.32);
  --r:14px;
  /* 图：已知 = 墨色；已求出 = 赭红；辅助线 = 绿色虚线；高亮 = 橙 / 蓝 / 紫 */
  --gv:#2B2822;--fd:#9A3B2E;--aux:#3C7A4E;
  /* 高亮用饱和的高对比色（亮橙 / 钴蓝 / 品紫），线宽与原图一致，只靠颜色和背景淡化突出；--hlt 是同色系的深色，用在白字底和点名上 */
  --hl:#E8590C;--hlt:#C2410C;--hlf:rgba(232,89,12,.16);
  --hl2:#1971C2;--hl2f:rgba(25,113,194,.14);--hl3:#9C36B5;--hl3f:rgba(156,54,181,.13);
  /* 连比分色：一组比一种颜色（图上用亮色，文字用同色系的深色），与高亮的橙 / 蓝 / 紫同一套，第四色是墨绿 */
  --rt0:#E8590C;--rt0t:#C2410C;--rt1:#1971C2;--rt1t:#1864AB;--rt2:#9C36B5;--rt2t:#862E9C;--rt3:#2B8A3E;--rt3t:#2B7A3B;
  --mf0:#3E8E5E;--mf1:#B0477E;--xf:#6A4C9C;--old:#A39C90;
  --font:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC","Source Han Sans CN","Microsoft YaHei","WenQuanYi Micro Hei",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --serif:"Songti SC","Noto Serif SC","Noto Serif CJK SC","Source Han Serif SC","STSong","Times New Roman",serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.8 var(--font);letter-spacing:.015em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh;position:relative}
body.noscroll{overflow:hidden}
::selection{background:var(--ab)}
a{color:var(--a);text-decoration:none;text-underline-offset:3px}
a:hover{text-decoration:underline}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--a);outline-offset:3px;border-radius:8px}
kbd{display:inline-block;min-width:1.5em;padding:0 5px;font:600 12px/1.6 var(--font);text-align:center;color:var(--ink2);background:var(--card);border:1px solid var(--hair2);border-bottom-width:2px;border-radius:5px}

/* 顶栏：半透明纸面 + 一条发丝线，不加阴影 */
.top{position:sticky;top:0;z-index:10;display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;padding:12px max(16px,calc((100% - 1100px)/2 + 16px));
  background:rgba(244,242,237,.92);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--hair)}
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:.06em;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand small{font:400 12px var(--font);letter-spacing:.04em;color:var(--muted);margin-left:2px}
#nav{display:flex;flex-wrap:wrap;gap:4px}
#nav a{position:relative;padding:6px 14px;border-radius:8px;color:var(--ink2);transition:background .15s,color .15s}
#nav a small{color:var(--muted);font-size:11px;letter-spacing:.02em}
#nav a:hover{text-decoration:none;background:rgba(70,60,40,.06)}
#nav a.on{color:var(--a);font-weight:600;background:var(--soft)}
main{max-width:1100px;margin:0 auto;padding:32px 16px 24px}
.foot{text-align:center;color:var(--muted);font-size:13px;padding:32px 12px 40px;border-top:1px solid var(--hair);max-width:1100px;margin:16px auto 0}

/* 标题与正文 */
h1,h2,h3{font-family:var(--serif);color:var(--ink);font-weight:700;letter-spacing:.03em}
h1{font-size:30px;line-height:1.35;margin:10px 0 8px}
h1 small{font:400 15px var(--font);color:var(--muted);margin-left:8px;letter-spacing:.02em}
h2{font-size:22px;line-height:1.4;margin:48px 0 6px}
h3{margin:0 0 10px;font-size:17px;line-height:1.5}
h3 small{font:400 13px var(--font);color:var(--muted);margin-left:8px}
h1+.muted,h2+.muted{max-width:34em}
p{margin:.6em 0}
.muted,.en{color:var(--muted)}
.en{font-size:13px;letter-spacing:.01em}
.more{font:400 14px var(--font);margin-left:10px;letter-spacing:.02em}
.crumb{font-size:14px;color:var(--muted)}
.crumb a{color:var(--muted);text-decoration:underline;text-decoration-color:var(--hair2)}
.crumb a:hover{color:var(--a)}
.bad{color:var(--accent)}

/* 标签：平的，只有发丝边 */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.chip{display:inline-block;font-size:12px;line-height:1.7;padding:1px 10px;border-radius:99px;background:transparent;color:var(--muted);border:1px solid var(--hair)}
.chip.star{letter-spacing:1px}
.chip.done{color:var(--a);border-color:var(--ab);background:var(--soft);font-weight:600}
.chip.doing{color:var(--warm);border-color:var(--warmb);background:var(--warmbg)}
.chip.key{color:var(--aux);border-color:rgba(60,122,78,.35);background:#EEF5EF;font-weight:600}

/* 卡片：全站唯一一层浮起 */
.card{position:relative;background:var(--card);border:1px solid rgba(40,36,30,.1);border-radius:var(--r);padding:20px 24px;margin:18px 0;box-shadow:var(--raise)}
.hero{position:relative;overflow:hidden;background:var(--card);border:1px solid rgba(40,36,30,.1);border-radius:16px;padding:32px 36px;margin-bottom:8px;box-shadow:var(--raise)}
.hero>*{position:relative}
.hero h1{margin-top:0;font-size:32px;max-width:20em}
.hero p{max-width:38em}

/* 文中链接与胶囊 */
.ref{display:inline;padding:0 1px;margin:0 2px;color:var(--a);font-weight:600;text-decoration:underline;text-decoration-color:var(--ab);text-decoration-thickness:2px;text-underline-offset:3px;border-radius:3px;transition:background .15s}
.ref:hover{background:var(--soft);text-decoration-color:var(--a)}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pills .ref{margin:0;padding:3px 12px;border:1px solid var(--hair);border-radius:99px;background:var(--card);text-decoration:none;font-weight:500}
.pills .ref:hover{border-color:var(--a)}

/* 按钮：平涂，无渐变、无投影；悬停略亮，按下略暗 */
.btn{font:inherit;font-size:15px;cursor:pointer;color:var(--a);font-weight:600;padding:8px 18px;border-radius:9px;min-height:42px;background:var(--card);border:1px solid var(--hair2);transition:background .15s,border-color .15s}
.btn.ghost{color:var(--ink2);font-weight:500}
.btn:hover:not(:disabled){background:var(--soft);border-color:rgba(47,85,89,.35)}
.btn:active:not(:disabled){background:#E6EBEA;box-shadow:inset 0 1px 2px rgba(40,36,30,.08)}
.btn:disabled{color:var(--muted);opacity:.6;cursor:default}
.btn.primary{color:#fff;background:var(--a);border-color:var(--a)}
.btn.primary:hover:not(:disabled){background:var(--a2);border-color:var(--a2)}
.btn.primary:active:not(:disabled){background:#284A4D}
.btn.primary:disabled{color:#E4ECEC;background:#9DB3B4;border-color:#9DB3B4;opacity:1}
.btn.big{font-size:17px;padding:12px 28px;min-height:52px;border-radius:11px}
a.btn{display:inline-flex;align-items:center}
a.btn:hover{text-decoration:none}

/* 卡片网格 */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:20px}
.item{display:flex;flex-direction:column;margin:0;color:var(--ink);padding:14px;overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}
.item:hover{text-decoration:none;transform:translateY(-2px);box-shadow:var(--raise-hv);border-color:var(--hair2)}
.item.done .thumb{opacity:.85}
.meta{padding:14px 4px 2px}
.meta h3{margin:0}
.meta p{margin:6px 0 0;font-size:14px;line-height:1.75;color:var(--ink2)}
.mini{margin-top:8px;font-size:12px;color:var(--muted)}

/* 图纸：干净的暖白纸面，不画方格（图不是按格点画的，方格会让人去数格子） */
.thumb{background:var(--paper);border:1px solid var(--hair);border-radius:10px;padding:6px}
.thumb svg{display:block;width:100%;height:170px}
.figbox{background:var(--paper);border:1px solid rgba(40,36,30,.1);border-radius:var(--r);padding:12px;box-shadow:var(--raise)}

/* 详情页：左图右文，约 1 : 1；图在左侧跟着滚动 */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start;margin-top:14px}
.left{position:sticky;top:84px}
.right .card:first-child{margin-top:0}
.q{font-size:17px;line-height:1.85;margin:4px 0;max-width:36em}
.given{margin:6px 0 14px;color:var(--muted);font-size:14px;max-width:40em}
.facts ul{margin:0;padding-left:20px;max-width:40em}
.facts li{margin:6px 0}
.rel-inline{margin-top:10px;line-height:2}
.rel-inline b{margin-right:4px}
.rel{list-style:none;margin:0;padding-left:0}
.rel li{margin:6px 0}
.rel .cmpbtn,.prel .cmpbtn{margin-left:10px;vertical-align:1px}
.via{font-size:13px;color:var(--muted)}
.ck{display:inline-block;width:1.3em;font-style:normal;font-weight:700;color:#A9A49A;text-align:center}
.ck.yes{color:var(--a)}
.pn{display:flex;justify-content:space-between;margin:32px 0;gap:12px}
.pn a{padding:8px 16px;border-radius:9px;background:var(--card);border:1px solid var(--hair2);transition:background .15s}
.pn a:hover{text-decoration:none;background:var(--soft)}

/* 解答：控制条、步骤、答案。步骤框只比卡片深一点，不画内凹 */
.ctl{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.keys{margin-left:auto;font-size:12.5px;color:var(--muted);white-space:nowrap}
.keys kbd{margin:0 2px}
.steps{list-style:none;counter-reset:s;padding:0;margin:12px 0}
.step{counter-increment:s;position:relative;padding:12px 14px 12px 54px;margin:10px 0;border-radius:10px;background:var(--sunk);border:1px solid var(--hair);max-width:42em}
.step::before{content:counter(s);position:absolute;left:14px;top:13px;width:28px;height:28px;border-radius:50%;background:var(--card);border:1px solid var(--ab);color:var(--a);text-align:center;line-height:26px;font-size:13px;font-weight:600;font-family:var(--serif)}
.step[hidden]{display:none}
.step.cur{background:var(--warmbg);border-color:var(--warmb);box-shadow:0 0 0 2px var(--hlf)}
.step.cur::before{border-color:var(--hl);color:var(--hl)}
.step.new{animation:pop .6s ease}
@keyframes pop{from{transform:translateY(4px);opacity:.5}to{transform:none;opacity:1}}
.usedby{margin-top:6px}
.hint{margin-top:14px;padding:12px 16px;background:var(--sunk);border:1px solid var(--hair);border-left:3px solid var(--ab);border-radius:10px;max-width:40em}
.answer{margin-top:14px;padding:14px 18px;border-radius:10px;background:var(--soft);border:1px solid rgba(47,85,89,.14);border-left:3px solid var(--a);font-size:18px;line-height:1.7}

/* 三级提示：① 看图 ② 名字 ③ 辅助线；按钮一级一级解锁，已解锁的级别可以点回去在图上再看 */
.hintbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.hlv{display:inline-flex;gap:4px}
.hlv[hidden]{display:none}
.hlv button{font:inherit;font-size:12.5px;line-height:1.8;padding:0 10px;border-radius:99px;cursor:pointer;color:var(--warm);background:var(--warmbg);border:1px solid var(--warmb)}
.hlv button:hover:not(:disabled){background:var(--warmhv)}
.hlv button.on{color:#fff;background:var(--hl);border-color:var(--hl)}
.hlv button:disabled{color:#B5AFA5;background:none;border-color:var(--hair);border-style:dashed;cursor:default}
.hlist{margin:0;padding:0;list-style:none}
.hlist>li{padding:6px 0}
.hlist>li+li{border-top:1px dashed rgba(40,36,30,.14)}
.hlist>li>b{display:inline-block;margin-right:10px;color:var(--warm);font-weight:600}
.hsee{font:inherit;font-size:12px;margin-left:10px;padding:0 9px;line-height:1.7;border-radius:99px;cursor:pointer;color:var(--a);background:var(--card);border:1px solid var(--ab);vertical-align:1px}
.hsee:hover{background:var(--soft)}
.hmake{margin:4px 0 0;padding-left:20px}
.hmake li{margin:2px 0}
.hmake li>span{font-weight:600}
.hmake small{display:block;font-size:13px;color:var(--muted);line-height:1.6}
.hxf{margin:4px 0 0;font-size:13.5px;color:var(--xf)}
.hfull{margin:8px 0 0;font-size:14px;color:var(--ink2)}

/* “先想一想”开关 */
.think{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--ink2);cursor:pointer;user-select:none;padding:4px 10px;border-radius:99px;border:1px solid var(--hair)}
.think:has(input:checked){color:var(--warm);background:var(--warmbg);border-color:var(--warmb)}
.think input{accent-color:var(--hl);margin:0}

/* 解答按“句”与图联动；“先想一想”时正在问的一句换成问题，还没走到的句子先藏起来 */
.beat.geo{cursor:pointer;border-radius:4px;transition:background .25s,box-shadow .25s;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.beat.geo:hover{background:rgba(217,130,43,.08)}
.beat.geo:focus-visible{outline:2px solid var(--hl);outline-offset:1px}
.beat.on{background:rgba(232,89,12,.12);box-shadow:inset 0 -2px 0 var(--hl)}
.cond{cursor:pointer;border-radius:4px;border-bottom:1px dotted var(--hair2);transition:background .25s,box-shadow .25s;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.cond:hover{background:rgba(217,130,43,.08)}
.cond:focus-visible{outline:2px solid var(--hl);outline-offset:1px}
.goal{cursor:pointer;border-radius:4px;border-bottom:1px dashed var(--hl);transition:background .25s,box-shadow .25s;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.goal:hover{background:rgba(217,130,43,.08)}
.goal:focus-visible{outline:2px solid var(--hl);outline-offset:1px}
.goal.on{background:rgba(232,89,12,.12);border-bottom-color:transparent;box-shadow:inset 0 -2px 0 var(--hl)}
.cond.on{background:rgba(232,89,12,.12);border-bottom-color:transparent;box-shadow:inset 0 -2px 0 var(--hl)}
.beat.later{display:none}
.beat.ask{font-size:0;cursor:pointer;border-radius:4px}
.beat.ask::before{content:attr(data-q);font-size:15px;font-weight:600;color:var(--warm);background:#FFF1DC;border:1px dashed #E0A55C;border-radius:6px;padding:1px 8px}

/* 图注：第几句、‹ 圆点 ›、当前句、重播 */
.figcap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 10px;min-height:28px;margin-top:8px;font-size:14px;color:var(--ink2);text-align:center}
.figcap:empty{min-height:0}
.fc-step{font-size:12px;color:var(--muted)}
.fc-txt{font-weight:600}
.fc-txt.fc-ask{color:var(--warm)}
.fc-calc{font-weight:400;color:var(--muted)}
.fc-xf{flex-basis:100%;font-size:12.5px;color:var(--xf)}
.fc-corr,.fc-fzc{flex-basis:100%;font-size:13px;color:#A85A10;font-weight:600}
/* 这一步的作图句 + 为什么这样作 */
.fc-make{flex-basis:100%;display:block;margin-top:2px;padding:6px 12px;text-align:left;font-size:13.5px;line-height:1.6;background:#F1F6F1;border:1px solid rgba(60,122,78,.22);border-left:3px solid var(--aux);border-radius:8px}
.fc-mk{font-weight:600;color:#2E5E3C}
.fc-make small{display:block;font-size:12.5px;color:var(--ink2)}
.fc-key{display:inline-block;margin-right:8px;padding:0 8px;font-size:12px;line-height:1.7;color:#fff;background:var(--aux);border-radius:99px;vertical-align:1px}
.fc-replay,.fc-exit{font:inherit;font-size:12.5px;background:none;border-radius:99px;padding:0 10px;cursor:pointer;line-height:1.8}
.fc-replay{color:var(--a);border:1px solid var(--ab)}
.fc-exit{color:var(--ink2);border:1px solid var(--hair2)}
.fc-replay:hover,.fc-exit:hover{background:var(--soft)}
.fc-hint{font-size:12px;font-weight:600;color:#fff;background:var(--hlt);border-radius:99px;padding:0 9px;line-height:1.8}
.fc-reveal{font:inherit;font-size:13px;font-weight:600;color:#fff;background:var(--hlt);border:0;border-radius:99px;padding:0 14px;cursor:pointer;line-height:2}
.fc-reveal:hover{filter:brightness(1.08)}
.fc-nav{display:inline-flex;align-items:center;gap:6px}
.fc-prev,.fc-next{font:inherit;font-size:15px;line-height:1;width:24px;height:24px;padding:0;border-radius:50%;cursor:pointer;color:var(--a);background:var(--card);border:1px solid var(--ab)}
.fc-prev:hover:not(:disabled),.fc-next:hover:not(:disabled){background:var(--soft)}
.fc-prev:disabled,.fc-next:disabled{opacity:.35;cursor:default}
.fc-dots{display:inline-flex;gap:4px}
.fc-dots button{width:11px;height:11px;padding:0;margin:0;border:2px solid transparent;background-clip:padding-box;border-radius:50%;cursor:pointer;background-color:rgba(40,36,30,.16)}
.fc-dots button:hover{background-color:var(--warmb);transform:scale(1.25)}
.fc-dots button.past{background-color:var(--warmb)}
.fc-dots button.on{background-color:var(--hl)}
.fc-dots button.later{background-color:transparent;border-color:rgba(40,36,30,.22)}

/* 图例 */
.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin-top:8px;font-size:12.5px;color:var(--muted)}
.lg{display:inline-block;width:14px;height:8px;border-radius:4px;margin-right:5px;vertical-align:0}
.lg.hl{background:var(--hl)}.lg.hl2{background:var(--hl2)}.lg.gv{background:var(--gv)}.lg.fd{background:var(--fd)}.lg.fdo{background:var(--old)}
.lg.corr{height:8px;width:14px;border-radius:8px 8px 0 0;background:none;border:1.5px solid #A85A10;border-bottom:0}
/* 图例 + “全部标注 / 只看本步” 开关 */
.figtools{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 14px;margin-top:8px}
.figtools .legend{margin-top:0}
.lmode{display:inline-flex;border:1px solid var(--hair2);border-radius:99px;overflow:hidden}
.lmode[hidden]{display:none}
.lmode button{font:inherit;font-size:12px;line-height:1.8;padding:0 10px;border:0;background:var(--card);color:var(--muted);cursor:pointer}
.lmode button+button{border-left:1px solid var(--hair2)}
.lmode button.on{background:var(--soft);color:var(--a);font-weight:600}
.lmode button:hover:not(.on){background:rgba(70,60,40,.05)}
.lg.aux{height:3px;border-radius:0;vertical-align:2px;background:repeating-linear-gradient(90deg,var(--aux) 0 5px,transparent 5px 8px)}
.lg.ask{height:3px;border-radius:0;vertical-align:2px;background:repeating-linear-gradient(90deg,var(--hl) 0 4px,transparent 4px 6px)}
.lg.mf{background:var(--mf0);opacity:.5}
.lg.xf{background:var(--xf);opacity:.6}

/* SVG 图形：墨色细线，不加阴影 / 模糊。所有尺寸由 figure-style.js 按屏幕补偿，字号、线宽不随取景缩放 */
.fig-svg{display:block;width:100%;height:auto;max-height:520px;overflow:visible;font-family:"Times New Roman","Songti SC",serif}
.fig-svg .circ{fill:none;stroke:#3F3A31;}
.fig-svg .seg{stroke:var(--gv);stroke-linecap:round}
.fig-svg .seg.d{stroke-dasharray:5 4;stroke:#7D7468;}
.fig-svg .seg.h{stroke:var(--gv);}
.fig-svg .mark{stroke:var(--gv);fill:none}
.fig-svg .arc{fill:none;stroke:var(--gv);}
.fig-svg .dot{fill:var(--gv)}
.fig-svg .pl,.fig-svg .atxt,.fig-svg .ltxt{text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:var(--paper);}
.fig-svg .pl{font-style:italic;font-weight:600;fill:#26241F}
.fig-svg .atxt{fill:var(--gv)}
.fig-svg .ltxt{fill:var(--gv);font-weight:600}
/* 尺寸线：线段上夹着别的点时，标出整段的长 */
.fig-svg .meas line{stroke:var(--gv);}
.fig-svg .meas .ext line{opacity:.6}
.fig-svg .meas path{fill:var(--gv);stroke:none}
.fig-svg .meas.found line{stroke:var(--fd)}
.fig-svg .meas.found path{fill:var(--fd)}
/* 引导：高亮时其余线条调暗；新作的线淡入；已求出的量用赭红 */
.fig-svg .base.dim .circ:not(.new),.fig-svg .base.dim .seg:not(.new),.fig-svg .base.dim .mark:not(.found):not(.key){opacity:.42}
/* 当前句的判定依据（等长记号、直角符号、题目给的角弧）不调暗，改用高亮色 */
.fig-svg .mark.key:not(.found){stroke:var(--hl);}
.fig-svg .arc.key:not(.found):not(.ask){stroke:var(--hl);}
.fig-svg .atxt.key:not(.found):not(.ask){fill:#A85A10;font-weight:700}
.fig-svg .seg.aux,.fig-svg .circ.aux{stroke:var(--aux);stroke-dasharray:6 4;}
.fig-svg .seg.ghost{stroke:var(--fd);stroke-dasharray:2 4;}
.fig-svg .mark.found{stroke:var(--fd);}
.fig-svg .arc.faded{opacity:.38}
.fig-svg .arc.found{stroke:var(--fd);}
.fig-svg .wedge.found{fill:rgba(154,59,46,.13);animation:figin .6s ease both}
.fig-svg .atxt.found,.fig-svg .ltxt.found{fill:var(--fd);font-weight:700}
.fig-svg .lead{stroke:var(--gv);opacity:.7}
.fig-svg .label-lead{stroke:var(--gv);opacity:.55}
.fig-svg .lead.found{stroke:var(--fd)}
/* 更早步骤求出的值：灰色小字、浅灰弧（是当前句的判定依据时恢复赭红） */
.fig-svg .atxt.found.old,.fig-svg .ltxt.found.old{fill:#8C857A;font-weight:600}
.fig-svg .arc.found.old,.fig-svg .mark.found.old,.fig-svg .lead.found.old,.fig-svg .meas.found.old line{stroke:var(--old);}
.fig-svg .meas.found.old path{fill:var(--old)}
.fig-svg .arc.found.old.key,.fig-svg .mark.found.old.key{stroke:var(--fd);}
.fig-svg .atxt.found.old.key{fill:var(--fd);font-weight:700}
.fig-svg .seg.new,.fig-svg .circ.new,.fig-svg .mark.new,.fig-svg .arc.new,.fig-svg .ltxt.new,.fig-svg .meas.new,.fig-svg .meas.fresh{animation:figin .9s ease both}
.fig-svg .dot.new{fill:var(--aux);animation:figin .9s ease both}
.fig-svg .atxt.fresh,.fig-svg .ltxt.fresh{transform-box:fill-box;transform-origin:center;animation:figpop .7s ease both}
.fig-svg.still .new{animation:none}
/* 一次走过几步（全部显示等）不播画线动画，但新加的点线照样淡入 */
.fig-svg.still.jump .new{animation:figborn .4s ease backwards}
/* 只写起点：淡入到元素自己的透明度（如淡显的 .fm0），不被拉成全不透明 */
.fig-svg .born{animation:figborn .4s ease backwards}
@keyframes figborn{from{opacity:0}}
/* 新作的辅助线从起点画到终点、新作的圆用圆规转一圈画出（遮罩里的实线逐渐露出虚线）；关键一笔略粗 */
.fig-svg .seg.new.drawn,.fig-svg .circ.new.drawn{animation:none}
.fig-svg .drawm{fill:none;stroke:#fff;animation:draw linear both}
.fig-svg .compass{animation:compass linear both}
.fig-svg .compass line{stroke:var(--aux);}
.fig-svg .compass circle{fill:var(--aux)}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes compass{0%{opacity:0;transform:rotate(0)}6%{opacity:.85}90%{opacity:.85;transform:rotate(360deg)}100%{opacity:0;transform:rotate(360deg)}}
/* 当前句的高亮：橙；第二、第三个三角形与橙色同样粗，只在公共边上用更宽、更淡的蓝 / 紫描边垫在下面（“橙芯蓝边”） */
.fig-svg .hl-seg,.fig-svg .hl-ray{stroke:var(--hl);stroke-linecap:round;fill:none;animation:figin .45s ease both}
.fig-svg .hl-fill{fill:var(--hlf);stroke:none;animation:figin .45s ease both}
.fig-svg .hl-arc{fill:none;stroke:var(--hl);animation:figin .45s ease both}
.fig-svg .hl-seg.c1{stroke:var(--hl2)}
.fig-svg .hl-seg.c2{stroke:var(--hl3)}
/* 同一三角形的三个内角：细边勾出三角形 */
.fig-svg .hl-outline{fill:none;stroke:var(--hl);stroke-linejoin:round;animation:figin .45s ease both}
.fig-svg .hl-outline.c1{stroke:var(--hl2)}.fig-svg .hl-outline.c2{stroke:var(--hl3)}
/* 平行线的两个角：沿两条平行线和截线描出的 F / Z / C 形 */
.fig-svg .fzc{fill:none;stroke:var(--hl);stroke-opacity:.55;stroke-linejoin:round;stroke-linecap:round;animation:figin .45s ease both}
/* 相似 / 全等的对应角：同色、同弧数 */
.fig-svg .corr{fill:none;stroke:#A85A10;animation:figin .45s ease both}
/* 相似“提出来”：小三角形的副本旋转、缩放后叠到另一个上，停一下再退回 */
.fig-svg .lift-copy{fill:rgba(217,130,43,.16);stroke:var(--hl);stroke-dasharray:5 3;stroke-linejoin:round}
.fig-svg .hl-ray.c1,.fig-svg .hl-arc.c1{stroke:var(--hl2)}
.fig-svg .hl-ray.c2,.fig-svg .hl-arc.c2{stroke:var(--hl3)}
.fig-svg .hl-fill.c1{fill:var(--hl2f)}
.fig-svg .hl-fill.c2{fill:var(--hl3f)}
.fig-svg .dot.hot{fill:var(--hl)}.fig-svg .pl.hot{fill:var(--hlt)}
.fig-svg .dot.hot.c1{fill:var(--hl2)}.fig-svg .pl.hot.c1{fill:#1864AB}
.fig-svg .dot.hot.c2{fill:var(--hl3)}.fig-svg .pl.hot.c2{fill:#862E9C}
/* “先想一想”：正在问的量用橙色虚线弧 */
.fig-svg .arc.ask{stroke:var(--hl);stroke-dasharray:3 2.5}
.fig-svg .atxt.ask,.fig-svg .ltxt.ask{fill:#A85A10;font-weight:700}
.fig-svg .lead.ask{stroke:var(--hl)}
/* 变换动画（xf）：半透明紫色副本，落到目标三角形上停住；不播放 / 减少动态时为终点虚影 */
.fig-svg .xf-copy{fill:rgba(106,76,156,.2);stroke:var(--xf);stroke-linejoin:round}
.fig-svg .xf-copy.end{fill:rgba(106,76,156,.1);stroke-dasharray:6 4}
@keyframes figin{from{opacity:0}to{opacity:1}}
@keyframes figpop{0%{opacity:0;transform:scale(.6)}60%{transform:scale(1.18)}100%{opacity:1;transform:scale(1)}}

/* 母题骨架（组合题里藏着的母题）：半透明粗轮廓 + 标准朝向缩略图；缩略图排在图下方，不挤占图的宽度；并排对比时两边同色 */
.figbox.hasmt{display:flex;flex-direction:column;gap:8px}
.figbox.hasmt .fig-svg{min-width:0}
.fig-svg .mskel{fill:none;stroke-opacity:.24;stroke-linejoin:round;stroke-linecap:round;animation:figin .45s ease both}
.fig-svg .mskel.mc0,.mthumb.mc0 polyline{stroke:var(--mf0)}
.fig-svg .mskel.mc1,.mthumb.mc1 polyline{stroke:var(--mf1)}
.fig-svg .mtag{font-style:italic;font-weight:700;font-family:"Times New Roman",serif}
.fig-svg .mtag.mc0,.mthumb.mc0 text,.mthumb.mc0 b{fill:var(--mf0);color:var(--mf0)}
.fig-svg .mtag.mc1,.mthumb.mc1 text,.mthumb.mc1 b{fill:var(--mf1);color:var(--mf1)}
.mthumbs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding-top:8px;border-top:1px solid var(--hair)}
.mthumb{max-width:220px;background:var(--card);border:1px solid var(--hair);border-radius:8px;padding:4px 8px;font-size:12px;line-height:1.35}
.mthumb b{display:block;font-weight:600}
.mthumb small{display:block;color:var(--muted)}
.mthumb svg{display:block;max-width:100%;height:auto}
.mthumb polyline{fill:none;stroke-linejoin:round;stroke-opacity:.85}
.mthumb text{font-style:italic;font-family:"Times New Roman",serif;text-anchor:middle}

/* 首页：一个主按钮 + 按依赖顺序排好的学习路径 */
.start{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:22px}
.pill{display:inline-block;padding:3px 12px;font-size:14px;line-height:1.7;font-weight:500;color:var(--a);border:1px solid var(--hair);border-radius:99px;background:var(--card);text-decoration:none}
.pill.pk-m,.pills .ref.pill.pk-m{background:#E6EFEE;border-color:var(--ab)}
.pill.pk-h,.pills .ref.pill.pk-h{background:var(--a);border-color:var(--a);color:#fff}
.pill small{font-size:10px;letter-spacing:0;opacity:.8}
.pills .ref.pill:hover{border-color:var(--a);text-decoration:none}
.pills .ref.pill.pk-h:hover{background:var(--a2)}
.pill i,.pathkey i{font-style:normal;font-weight:700;margin-right:4px;color:var(--a)}
.pill.pk-h i{color:#fff}
.pill.done:not(.pk-h){color:var(--muted)}
.pills .ref.pill.cur{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--hl)}
.pathkey{display:flex;align-items:center;gap:10px;margin:12px 0 4px;font-size:13px;color:var(--muted)}
.pathkey .pill{font-size:12.5px;padding:0 10px}
.path{list-style:none;padding:0;margin:8px 0 0}
.stage{display:flex;align-items:flex-start;gap:14px;padding:12px 4px;border-top:1px solid var(--hair)}
.stage .sn{flex:none;width:30px;height:30px;margin-top:2px;border-radius:50%;border:1px solid var(--ab);color:var(--a);background:var(--card);text-align:center;line-height:28px;font:600 13px var(--serif)}
.stage.done .sn{background:var(--a);border-color:var(--a);color:#fff}
.stage.cur{background:rgba(217,130,43,.06);border-radius:10px}
.stage .pills{margin:0;align-items:center;gap:6px}
.to{color:var(--muted);font-size:13px;margin:0 1px}

/* 组合题：用到的知识 = 先修清单，默认收起 */
.pre summary{cursor:pointer;display:flex;align-items:baseline;gap:6px;font-family:var(--serif);font-size:17px;list-style:none}
.pre summary::-webkit-details-marker{display:none}
.pre summary::before{content:'▸';align-self:center;color:var(--a);font-size:14px;transition:transform .15s}
.pre[open] summary::before{transform:rotate(90deg)}
.pre summary .muted{font:400 14px var(--font)}
.pre-sum{margin-left:auto;font:500 12.5px var(--font);color:var(--warm);border:1px solid var(--warmb);background:var(--warmbg);border-radius:99px;padding:0 10px}
.pre-sum.ok{color:var(--a);border-color:var(--ab);background:var(--soft)}
.pre-body{margin-top:10px}
.pre-body h4{margin:12px 0 4px;font:600 13px var(--font);color:var(--muted)}
.prel{list-style:none;margin:0;padding:0}
.prel li{padding:3px 0}
.prel .prego{margin-left:10px;font-size:12.5px;font-weight:500;text-decoration:none;border:1px solid var(--warmb);background:var(--warmbg);color:var(--warm);border-radius:99px;padding:0 9px}
.prel .prego:hover{background:var(--warmhv)}
.fold summary{cursor:pointer;font-weight:600;color:var(--a)}
.fold ul{margin:8px 0 0;padding-left:20px}

/* 首次使用的就地小提示 */
.tip{position:relative;display:flex;align-items:flex-start;gap:12px;margin:0 0 12px;padding:8px 10px 8px 14px;border-radius:10px;background:var(--warmbg);border:1px solid var(--warmb);font-size:14px;line-height:1.7;max-width:42em}
.tip::before{content:'';position:absolute;top:-6px;left:34px;width:10px;height:10px;background:var(--warmbg);border-left:1px solid var(--warmb);border-top:1px solid var(--warmb);transform:rotate(45deg)}
.tip[data-t="ref"]::before{display:none}
.tip[hidden]{display:none}
/* v21：提示气泡浮在解答上方（出现、关掉都不推动步骤列表） */
.sol{position:relative}
.sol>.tip{position:absolute;z-index:4;left:20px;right:20px;margin:0;box-shadow:0 4px 14px rgba(40,36,30,.14)}
.tipx{flex:none;font:inherit;font-size:12.5px;color:var(--warm);background:none;border:1px solid var(--warmb);border-radius:99px;padding:0 10px;cursor:pointer;line-height:1.8}
.tipx:hover{background:var(--warmhv)}

/* 并排对比：入口按钮、头部、左右两栏 */
.cmpbtn{display:inline-block;margin-left:8px;padding:1px 10px;font-size:12.5px;line-height:1.7;border-radius:99px;color:var(--a);font-weight:600;background:var(--card);border:1px solid var(--ab)}
.cmpbtn:hover{text-decoration:none;background:var(--soft)}
body.cmpmode main{max-width:none;padding:10px 12px 0}
body.cmpmode .foot{display:none}
.cmp-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding:8px 14px;margin-bottom:10px;border-radius:12px;background:var(--card);border:1px solid rgba(40,36,30,.1);box-shadow:var(--raise)}
.cmp-head .vs{margin:0 8px;color:var(--a);font-weight:700}
.cmp-act{display:flex;gap:8px}
.cmp-act .btn{min-height:34px;padding:4px 14px;font-size:14px}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;height:calc(100vh - 150px);min-height:420px}
.pane{overflow:auto;border-radius:14px;padding:0 14px 14px;background:var(--sunk);border:1px solid var(--hair)}
body.cmpmode .pane.kbd{box-shadow:0 0 0 2px rgba(217,130,43,.35)}
.pane-in h1{font-size:22px;margin-top:12px}
/* 图、图例、图注都在 sticky 区域里，实色底，下边一条分隔线，不压到下面的解答卡 */
.pane-in .figwrap{position:sticky;top:0;z-index:3;margin:0 -14px 6px;padding:8px 14px;background:var(--sunk);border-bottom:1px solid var(--hair)}
.pane-in .figwrap .legend,.pane-in .figwrap .figcap{margin-top:4px}
.pane-in .figbox{box-shadow:none}
.pane-in .fig-svg{max-height:250px}
.pane-in .card{margin:12px 0;padding:14px 18px}

/* 知识点抽屉：从右侧滑出 */
.drawer{position:fixed;inset:0;z-index:50;visibility:hidden}
.drawer.open{visibility:visible}
.dscrim{position:absolute;inset:0;background:rgba(35,34,32,.28);opacity:0;transition:opacity .2s}
.drawer.open .dscrim{opacity:1}
.dpanel{position:absolute;top:0;right:0;bottom:0;width:min(480px,100%);display:flex;flex-direction:column;background:var(--card);box-shadow:-8px 0 30px rgba(35,34,32,.14);transform:translateX(100%);transition:transform .22s ease}
.drawer.open .dpanel{transform:none}
.dpanel header{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--hair)}
.dpanel .dtitle{margin:0;flex:1;font-size:18px}
.dtitle small{font:400 13px var(--font);color:var(--muted)}
.dkind{font:600 12px var(--font);color:var(--a);border:1px solid var(--ab);border-radius:99px;padding:1px 9px;margin-right:6px;vertical-align:2px}
.dclose{font-size:26px;line-height:1;width:40px;height:40px;border:0;border-radius:9px;background:none;color:var(--ink2);cursor:pointer}
.dclose:hover{background:var(--soft)}
.dback{min-height:36px;padding:4px 12px;font-size:14px}
.dbody{flex:1;overflow:auto;padding:16px 20px 24px}
.dbody h4{margin:18px 0 6px;font-family:var(--serif);font-size:16px}
.dbody .figbox{box-shadow:none}
.dbody .fig-svg{max-height:240px}
.dfacts,.dsteps{padding-left:20px;margin:0}
.dfacts li,.dsteps li{margin:6px 0}
.dex{margin-top:16px;border-top:1px solid var(--hair);padding-top:10px}
.dex summary{cursor:pointer;font-weight:600;color:var(--a)}
.dpanel footer{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--hair);font-size:13px}

/* 窄屏兜底（主要面向桌面横屏） */
@media (max-width:820px){
  body{font-size:15.5px}
  .top{padding:8px 12px}
  h1,.hero h1{font-size:24px}
  h2{font-size:20px;margin-top:36px}
  .hero{padding:22px 20px}
  .card{padding:16px 18px}
  .grid{grid-template-columns:1fr}
  .two{grid-template-columns:1fr;gap:18px}
  .left{position:static}
  .figbox{padding:8px}
  .btn{flex:1 1 auto}
  .cmp{grid-template-columns:1fr;height:auto}
  .pane{overflow:visible}
  .pane-in .figwrap{position:static;background:none}
  .dpanel{top:auto;width:100%;height:82vh;border-radius:16px 16px 0 0;transform:translateY(100%)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}.fig-svg .drawm{stroke-dashoffset:0!important}.fig-svg .compass{display:none}}

/* 焦点模型（h13、h14 等写了 focus 的句子）：主焦点 = 高亮色、原线宽；上下文 = 原样式再描一遍、淡化；其余退到背景 */
.fig-svg .base.dim.fm-rest :is(.circ,.seg,.mark,.arc):not(.key){opacity:.16}
.fig-svg .fm-ctx{opacity:.62}
.fig-svg .fm-ctx .seg,.fig-svg .fm-ctx .circ{animation:none}
.fig-svg .fm0{opacity:.28}
.fig-svg .hl-circ{fill:none;stroke:var(--hl);animation:figin .45s ease both}
.fig-svg .hl-circ.aux{stroke-dasharray:6 4}
.fig-svg .hl-circ.c1{stroke:var(--hl2)}.fig-svg .hl-circ.c2{stroke:var(--hl3)}
/* 新标注（设 BH = x）：高亮色斜体，贴在所指的线段旁 */
.fig-svg .ltxt.tag{fill:var(--hlt);font-style:italic;font-weight:700;animation:figin .45s ease both}
.fig-svg .ltxt.tag.c1{fill:#1864AB}.fig-svg .ltxt.tag.c2{fill:#862E9C}
.fig-svg .meas.tag line{stroke:var(--hl)}.fig-svg .meas.tag path{fill:var(--hl)}
.fig-svg .meas.tag.c1 line{stroke:var(--hl2)}.fig-svg .meas.tag.c1 path{fill:var(--hl2)}

/* 首页知识地图（立体）：左侧一张浮起的说明栏（约 30%），右侧极浅的画布（约 70%），底部悬浮一条胶囊控制条 */
body.home main{max-width:1400px;padding-top:14px}
.kg3{display:grid;grid-template-columns:minmax(330px,30%) 1fr;gap:16px;height:calc(100vh - 96px);min-height:640px;margin-bottom:28px}
.kg3-side{margin:0;padding:20px 22px;display:flex;flex-direction:column;gap:10px;overflow:auto}
.kg3-side .eyebrow{font-size:12.5px;letter-spacing:.2em;color:var(--muted)}
.kg3-side h1{margin:-6px 0 0;font-size:26px}
.kg3-side p{margin:0;font-size:13.5px;line-height:1.7}
.kg3-side h4{margin:4px 0 -4px;font-size:13px;color:var(--ink2)}
.kg3-side h4 small{font-weight:400;color:var(--muted);margin-left:6px}
.kg3-stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--hair);border-radius:12px;background:var(--sunk)}
.kg3-stats div{display:flex;flex-direction:column;align-items:center;padding:8px 0 6px}
.kg3-stats div+div{border-left:1px solid var(--hair)}
.kg3-stats b{font:600 22px/1.2 var(--serif);color:var(--a)}
.kg3-stats span{font-size:12px;color:var(--muted)}
.kg3-q{width:100%;font:14px var(--font);padding:8px 12px;border:1px solid var(--hair2);border-radius:10px;background:var(--paper);color:var(--ink)}
.kg3-q:focus{outline:2px solid var(--ab);border-color:var(--a)}
.kg3-lg{list-style:none;margin:0;padding:0}
.kg3-lg li{display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--hair)}
.kg3-lg button{flex:1;display:flex;align-items:center;gap:10px;padding:7px 4px;border:0;background:none;font:14px var(--font);color:var(--ink);cursor:pointer;text-align:left;border-radius:6px}
.kg3-lg button:hover{background:var(--sunk)}
.kg3-lg button i{width:12px;height:12px;border-radius:50%;box-shadow:inset -2px -2px 3px rgba(0,0,0,.15),0 1px 1px rgba(40,36,30,.15)}
.kg3-lg button small{color:var(--muted);font-size:12px}
.kg3-lg button span{margin-left:auto;font-size:13px;color:var(--muted)}
.kg3-lg button.off{opacity:.4}
.kg3-lg a{font-size:12.5px;padding:0 4px}
.kg3-key{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12px;color:var(--muted)}
.kg3-key span{display:inline-flex;align-items:center;gap:6px}
.kg3-key .kcur{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px solid var(--hl)}
.kg3-side .start{margin-top:auto;display:flex;flex-direction:column;gap:4px;font-size:13px}
.kg3-side .start .btn{text-align:center}
.kg3-stage{position:relative;border-radius:var(--r);background:radial-gradient(ellipse at 50% 40%,#FBFAF7,#F1EFEA);border:1px solid var(--hair);overflow:hidden}
.kg3-stage canvas{display:block;cursor:grab;touch-action:none}
.kg3-stage canvas:active{cursor:grabbing}
.kg3-ctl{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;align-items:center;gap:2px;padding:4px 8px;border-radius:999px;background:var(--card);border:1px solid var(--hair);box-shadow:var(--raise)}
.kg3-ctl button{width:32px;height:30px;border:0;border-radius:999px;background:none;font:16px var(--font);color:var(--ink2);cursor:pointer}
.kg3-ctl button:hover{background:var(--sunk)}
.kg3-ctl i{width:1px;height:16px;background:var(--hair2);margin:0 4px}
.kg3-ctl .zv{min-width:44px;text-align:center;font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
/* 探究模式：卡片在图下方；点卡片进入探究，控件在图注下 */
.left>.facts{margin-top:14px}
.facts h3 small,.prob h3 small{font-weight:400;color:var(--muted,#888);font-size:.8em;margin-left:6px}
.facts .kc{cursor:pointer;border-radius:6px;padding:3px 6px;margin-left:-6px;transition:background .15s}
.facts .kc:hover{background:var(--sunk)}
.facts .kc.on{background:var(--sunk);box-shadow:inset 3px 0 0 var(--hl,#c2410c)}
.excl{margin-top:10px;padding:12px 14px;display:grid;gap:8px}
.ex-tip{font-size:.92em}
.ex-row{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.ex-sl{display:flex;align-items:center;gap:6px;font-size:.9em}
.ex-sl input{width:120px}
.ex-sl output{min-width:3em;font-variant-numeric:tabular-nums}
.ex-pre{font:inherit;font-size:.88em;padding:3px 10px;border:1px solid var(--hair);border-radius:6px;background:transparent;cursor:pointer}
.ex-pre.on{background:var(--sunk)}
.ex-g{font-size:.9em}
.ex-read{display:flex;flex-wrap:wrap;gap:6px 16px;font-variant-numeric:tabular-nums;min-height:1.6em}
.ex-rv i{font-style:normal;margin-right:4px;color:var(--muted,#777)}
.ex-bad{color:#b45309}
.ex-zone{flex-basis:100%;color:var(--ink,#333);font-weight:600}
.ex-drag{fill:currentColor;fill-opacity:.08;stroke:currentColor;stroke-opacity:.45;stroke-dasharray:3 2;cursor:grab}
.excl[hidden]{display:none}

/* 连比分色：文字里每组比一色、细下划线标出一组的范围；图上同色、原线宽，两组共用的线段两色相间 */
.ratio{font-weight:600;white-space:nowrap;border-bottom:1.5px solid currentColor;padding-bottom:0}
.ratio.r0{color:var(--rt0t)}.ratio.r1{color:var(--rt1t)}.ratio.r2{color:var(--rt2t)}.ratio.r3{color:var(--rt3t)}
.fig-svg .hl-seg.rt-seg.r0{stroke:var(--rt0)}.fig-svg .hl-seg.rt-seg.r1{stroke:var(--rt1)}.fig-svg .hl-seg.rt-seg.r2{stroke:var(--rt2)}.fig-svg .hl-seg.rt-seg.r3{stroke:var(--rt3)}
.fig-svg .hl-seg.rt-dash{stroke-dasharray:7 7;stroke-linecap:butt}
.lg.rt{background:linear-gradient(90deg,var(--rt0) 0 33%,var(--rt1) 33% 66%,var(--rt2) 66%)}
.lg.rt2{height:3px;border-radius:0;vertical-align:2px;background:repeating-linear-gradient(90deg,var(--rt0) 0 5px,var(--rt1) 5px 10px)}
.ex-sl[hidden],.ex-g[hidden]{display:none}

/* 详情页同框布局（桌面 1440×900）：图一列 sticky、限高；右列（题目 → 卡片 → 解答）在自己的框里滚动，
   探究面板紧贴在图下；整页不再滚动，图、题、当前卡片、探究控件同时可见 */
main:has(.two){max-width:1400px;padding-top:18px;padding-bottom:12px}
main:has(.two) h1{margin:0 0 4px;font-size:24px}
.two{margin-top:8px;gap:24px;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.two>.left,.two>.right{position:sticky;top:72px;max-height:calc(100vh - 84px);overflow-y:auto;overscroll-behavior:contain}
.two>.right{padding-right:6px}
/* 探究模式：图在左、控件在右并排，两者都不用滚动 */
.two>.left .figwrap:has(.excl:not([hidden])){display:grid;grid-template-columns:minmax(0,1fr) 270px;column-gap:12px;align-items:start}
.two>.left .figwrap:has(.excl:not([hidden]))>:not(.excl){grid-column:1}
.two>.left .excl{grid-column:2;grid-row:1 / span 3;margin-top:0;padding:10px 12px;gap:8px;max-height:calc(100vh - 200px);overflow-y:auto;font-size:14px}
.two>.left .excl .ex-row{gap:6px 10px}
.two>.left .excl .ex-sl{display:grid;grid-template-columns:6.5em minmax(0,1fr) 3em;width:100%}
.two>.left .excl .ex-sl input{width:100%}
.two>.left .excl .ex-read{gap:4px 12px}
main:has(.two) h1{display:inline-block;margin-right:12px;vertical-align:middle}
main:has(.two) h1+.chips{display:inline-flex;vertical-align:middle}
/* 知识抽屉固定覆盖在右侧；开关只锁滚动，背景保持原有布局。 */
.drawer{left:auto;width:min(440px,100%)}
.dscrim{display:none}
.dpanel{width:100%}

/* 详情页整页定高：页头 + 标题 + 两栏 + 上下页链接正好占满一屏，整页不滚动；两栏各自在框内滚动 */
html.fixed{height:100%;overflow-y:auto}
html.fixed body{height:100%;overflow:hidden}
html.fixed body{display:flex;flex-direction:column}
html.fixed body>main{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column}
main>.two{flex:1 1 auto;min-height:0;grid-template-rows:minmax(0,1fr);align-items:stretch}
main>.two>.left,main>.two>.right{position:relative;top:0;max-height:none;min-height:0}
main:has(>.two)>.crumb,main:has(>.two)>.pn{flex:none}
/* 合并卡：核心知识 / 母题特征与探究控件同卡。条目下挂自己的引导小开关，卡底是滑块、预设、开关；读数在图下 */
.facts.merged .ex-ctl{display:grid;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid var(--hair);font-size:14px}
.facts.merged .ex-ctl[hidden]{display:none}
.facts.merged .ex-ctl .ex-row{gap:6px 10px}
.facts.merged .ex-ctl .ex-sl{display:grid;grid-template-columns:minmax(4em,max-content) minmax(80px,1fr) 3em;column-gap:8px;flex:1 1 220px}
.facts.merged .ex-ctl .ex-sl input{width:100%}
.facts.merged .kg{display:flex;flex-wrap:wrap;gap:4px 14px;margin:4px 0 2px;font-size:14px}
.facts.merged .kg .ex-g{color:var(--muted,#666)}
.ex-lb{font-size:.85em;color:var(--muted,#888)}
.exr{justify-content:center;font-size:14px;margin-top:4px}
.exr[hidden]{display:none}
.exr .ex-zone{text-align:center}
/* v21 合并卡探究：进出探究不改右栏任何条目的排布（点到的字不离开鼠标）；
   卡底的控件贴在右栏可见区底部（sticky，不占额外位置、不滚动右栏），本条的引导小开关也放在控件里；
   预设按钮与“去掉条件”开关同一行；上下页链接贴近两栏 */
main:has(>.two)>.pn{margin:12px 0 4px}
.facts.merged .ex-ctl{position:sticky;bottom:-14px;z-index:2;background:var(--card);margin-left:-8px;margin-right:-8px;padding-left:8px;padding-right:8px;padding-bottom:6px;box-shadow:0 -6px 8px -8px rgba(0,0,0,.25)}
.facts.merged .ex-ctl .kg{flex-basis:100%;margin:0}
.facts.merged .ex-ctl .kg:empty{display:none}
.facts.merged .ex-ctl.idle{position:relative;bottom:auto;box-shadow:none;opacity:.55}
/* v22：贴底时多垫 14px，按钮整个落在右栏可见区里（bottom:-14px 那一截在可见区外） */
.facts.merged .ex-ctl:not(.idle){padding-bottom:20px}
.exback{visibility:hidden}
.exback.on{visibility:visible}
.two>.right{overflow-anchor:none}
.facts.merged .ex-ctl{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;padding-top:8px}
.facts.merged .ex-ctl>.ex-row{flex:0 1 auto}
.facts.merged .ex-ctl>.ex-row:first-child,.facts.merged .ex-ctl>.ex-more{flex-basis:100%}
.facts.merged .ex-ctl .ex-row:empty{display:none}

/* 切换页面不抖：根元素始终留出滚动条的位置（有无滚动条宽度都一样）；详情页由脚本在换页前给 html 加 fixed，整页从第一帧起就不滚动 */
html{scrollbar-gutter:stable}
/* 左栏图形按可用区域等比放大、居中：左栏 → 图框 → 图层层撑满，图下只留图例、图注和读数的高度；
   图形尺寸全由布局决定，不靠脚本量尺寸，首帧即是最终大小，窗口变化时连续跟随 */
.two>.left{display:flex;flex-direction:column;overflow:clip}
.two>.left>.figwrap{flex:1 1 0;min-height:0;display:flex;flex-direction:column;overflow:clip;position:relative}
.two>.left>.figwrap>*{flex:none}
.two>.left>.figwrap>.figbox{flex:1 1 0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);overflow:clip}
.two>.left .figbox>svg.fig-svg{width:100%;height:100%;max-height:none;min-height:0}
.two>.right{scrollbar-gutter:stable}
/* 固定 v15 首帧的图例 / 图注格子；pbfix 的 26px / 92px 在下方单独保留。 */
.two>.left .figtools{height:24px;min-height:24px;overflow-y:auto;scrollbar-gutter:stable}
.two>.left .figcap,.two>.left .figcap:empty{height:28px;min-height:0;align-content:flex-start;align-items:flex-start;overflow-y:auto;scrollbar-gutter:stable;box-sizing:border-box}
/* 只有合并卡生成 exr；读数与探究图注共用原有的 92px，不额外扣减图框高度。
   普通：92px 图注；探究：28px 图注 + 原有 4px 读数间距 + 60px 读数 = 92px。 */
.two>.left .exr{height:60px;overflow-y:auto;scrollbar-gutter:stable}
/* 新题目录（solve.html #/x）：左边题目箱，右边使用说明 */
.cx{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.cx-list{margin:8px 0 0;padding-left:20px;line-height:1.9}
.cx .card>h2{margin-top:0}
.doubt{margin:-8px 0 12px;padding:0 10px;border-top:4px solid #fbf2e2;border-bottom:4px solid #fbf2e2;max-width:40em;font-size:12.5px;line-height:1.5;color:#8a5a1c;background:#fbf2e2;border-radius:8px;box-shadow:inset 0 1px 2px rgba(120,80,20,.12);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* 图下性质条：本步用到的性质，当前这句用到的点亮（与图上高亮同色） */
.propbar{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding-top:6px;border-top:1px solid var(--hair)}
.pb-item{display:flex;flex-direction:column;align-items:flex-start;text-align:left;max-width:300px;font:inherit;font-size:12px;line-height:1.4;padding:4px 10px;background:var(--card);border:1px solid var(--hair);border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.05);cursor:pointer;color:var(--ink,inherit);opacity:.62}
.pb-item b{font-weight:600}
.pb-item i{font-style:normal;font-size:11px;color:var(--muted);align-self:flex-end}
.pb-item.on{opacity:1;border-color:var(--warmb);background:var(--warmbg)}
.pb-item.on b{color:var(--warm)}
.pb-item.nolink{cursor:default}
.pb-item:hover{opacity:1}
.chip.key,.fc-key{cursor:pointer}
.fc-key.fc-here{cursor:default}
.dprops{margin:0 0 12px;padding:8px 10px;border:1px solid var(--hair);border-radius:8px;background:var(--soft)}
.dprops h4{margin:0 0 6px;font-size:13px;color:var(--muted);font-weight:600}
.dprop{display:flex;flex-direction:column;font-size:13px;line-height:1.45;padding:4px 6px;border-radius:6px;opacity:.7}
.dprop.on{opacity:1;background:var(--warmbg);border:1px solid var(--warmb)}
.dprop.on b{color:var(--warm)}
/* 三层分工：原型的认法 / 为什么成立，母题的识别信号 / 结论 / 变式 */
.layer h3{margin:0 0 8px}
.layer h3:not(:first-child){margin-top:14px}
.layer ul{margin:0;padding-left:20px}
.layer li{margin:5px 0}
.layer .why{margin:0;line-height:1.7}
.layer .sig{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;margin:6px 0}
.layer .sig>span{padding:7px 11px;border-radius:10px;background:var(--sunk,#f1eee8);box-shadow:inset 0 1px 2px rgba(0,0,0,.08);line-height:1.5}
.layer .sig .sg-think{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.1),0 2px 6px rgba(0,0,0,.05);border-left:3px solid var(--hl,#c2410c)}
.layer .sig>i{font-style:normal;color:var(--muted,#888);font-size:18px}
.layer .vars{display:grid;gap:8px}
.layer .var{padding:8px 12px;border-radius:10px;background:var(--sunk,#f1eee8);box-shadow:inset 0 1px 2px rgba(0,0,0,.07);line-height:1.6}
.layer .var b{margin-right:8px}
/* v15 图下性质条 / 母题缩略图放进固定高度的格子，内容多了在格子里滚动：图注和 ‹ ● › 步进条的位置不随步骤变 */
.two>.left>.figwrap>.figbox.pbfix{grid-template-rows:minmax(0,1fr) 112px}
.figbox.pbfix .pbslot{height:112px;box-sizing:border-box;overflow-y:auto;scrollbar-gutter:stable;display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--hair);padding-top:6px}
.pbslot .propbar,.pbslot .mthumbs{border-top:0;padding-top:0}
.pb-item{flex-direction:row;align-items:center;gap:8px}
.pb-t{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.pb-thumb{flex:none;background:#fffdf8;border:1px solid var(--hair);border-radius:6px}
.pb-thumb .pt-base line,.pb-thumb .pt-base circle{stroke:#9a9184;fill:none}
.pb-proto{flex:none;width:72px;height:52px;display:flex;align-items:center;justify-content:center;background:#fffdf8;border:1px solid var(--hair);border-radius:6px;overflow:hidden}
.pb-proto svg{width:100%;height:100%}
/* 形状高亮（主图叠加层与缩略图共用） */
.hx-seg{stroke:#c8642a;stroke-linecap:round;fill:none}
.hx-ang{fill:rgba(200,100,42,.32);stroke:#c8642a;}
.hx-tri{fill:rgba(200,100,42,.14);stroke:none}
.hlx{pointer-events:none}
[data-hl]{cursor:pointer;border-radius:6px;transition:background .15s}
[data-hl]:hover,[data-hl]:focus,[data-hl].pin{background:rgba(200,100,42,.10);outline:none}
li[data-hl]::marker{color:#c8642a}
[data-hl].pin{box-shadow:inset 3px 0 0 #c8642a}
/* 右栏解答：上方控制条（下一步 / 全部显示 / 重置）粘在右栏顶部 */
.two>.right .sol>.ctl{position:sticky;top:-1px;z-index:3;background:var(--card);margin:0 -4px 12px;padding:6px 4px;box-shadow:0 6px 8px -8px rgba(0,0,0,.25)}
.two>.right .step{scroll-margin-top:64px}
/* v15 图例一行、图注固定高度（多了在格子里滚动）：‹ ● › 步进条的 y 坐标在整道题里不变 */
.two>.left>.figwrap:has(.figbox.pbfix)>.figtools{height:26px;min-height:26px;overflow:hidden}
.two>.left>.figwrap:has(.figbox.pbfix)>.figcap{height:92px}
.two>.left>.figwrap:has(.figbox.pbfix):has(>.exr:not([hidden]))>.figcap{height:28px}
.figbox.pbfix .pbslot{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:flex-start;align-content:flex-start}
.pbslot .mthumbs{flex-wrap:nowrap}
.pbslot .mthumb svg{max-height:62px;width:auto}
/* v17 能点的直觉（只用已有颜色、不改字号线宽）：
   进探究的条目圆点用主色 --a，纯文字条目圆点淡灰、没有手型和悬停；描形状的条目（data-hl）圆点橙色，见上。
   键盘聚焦与悬停同样铺浅底。变式卡可点时不再继承列表条目的左移，悬停时左沿出现主色细条 */
.facts li.kc::marker{color:var(--a)}
.facts ul.how li:not(.kc)::marker,.facts ul.concl li:not(.kc)::marker{color:var(--hair2)}
.facts .kc:focus-visible{background:var(--sunk);outline:none}
.layer .var.kc{margin-left:0;border-radius:10px;transition:box-shadow .15s}
.layer .var.kc:hover,.layer .var.kc:focus-visible{box-shadow:inset 0 1px 2px rgba(0,0,0,.07),inset 3px 0 0 var(--a);outline:none}
.layer .var.kc.on{box-shadow:inset 0 1px 2px rgba(0,0,0,.07),inset 3px 0 0 var(--hl,#c2410c)}
/* v19 自由作图：开关浮在图框右上角，工具条盖在图例 / 图注格子上（都是绝对定位，不改左栏任何格子的尺寸）；
   用户作图单独一层，主色细线，与题目给的墨线、解答的辅助线分得开 */
.fd-tog{position:absolute;top:7px;right:8px;z-index:4;font:inherit;font-size:12px;line-height:1.9;padding:0 11px;border:1px solid var(--hair2);border-radius:99px;background:var(--card);color:var(--muted);cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 1px 2px rgba(40,36,30,.06)}
.fd-smode{position:absolute;top:7px;right:8px;z-index:4;background:var(--card);box-shadow:0 1px 2px rgba(40,36,30,.06)}
.fd-smode button{width:4.6em;padding:0}
.figwrap:has(>.fd-smode)>.fd-tog{right:calc(8px + 9.2em + 8px)}
.fd-peek{position:absolute;top:7px;left:10px;z-index:4;font:inherit;font-size:12px;line-height:1.9;padding:0 11px;border:1px solid var(--hair2);border-radius:99px;background:var(--card);color:var(--muted);cursor:pointer}
.fd-peek[hidden]{display:none}
.fd-peek.on{background:var(--soft);color:var(--a);font-weight:600;border-color:rgba(47,85,89,.35)}
.fd-svg.peek{pointer-events:none;opacity:.55}
.fd-tog:hover{background:var(--soft);color:var(--a)}
.fd-tog.warn{color:var(--accent)}
.fd-tog.on{background:var(--soft);color:var(--a);font-weight:600;border-color:rgba(47,85,89,.35)}
.fd-svg{position:absolute;z-index:3;overflow:hidden;cursor:crosshair;touch-action:none}
.fd-svg[hidden],.fd-bar[hidden],.fd-hint[hidden],.fd-sub[hidden]{display:none}
.fd-svg .fd-cover{fill:transparent}
.fd-svg{border-radius:calc(var(--r) - 1px)}
.fd-svg.pan{cursor:grabbing}
.two>.left>.figwrap.fd-on .pbslot{border-top-color:transparent}
.fd-svg .fd-edge{fill:var(--a2);opacity:.85}
.figwrap.fd-zoom>.figbox>svg.fig-svg{transform:translate(var(--fdx,0),var(--fdy,0)) scale(var(--fdk,1));transform-origin:0 0}
.fd-zm{position:absolute;z-index:4;display:inline-flex;border:1px solid var(--hair2);border-radius:8px;overflow:hidden;background:var(--card);box-shadow:0 1px 2px rgba(40,36,30,.06)}
.fd-zm[hidden]{display:none}
.fd-zm button{font:inherit;font-size:12px;line-height:1.85;padding:0 9px;border:0;background:var(--card);color:var(--ink2);cursor:pointer;white-space:nowrap}
.fd-zm button+button{border-left:1px solid var(--hair2)}
.fd-zm button:hover{background:rgba(70,60,40,.05)}
.fd-svg :is(line,path,polyline,circle,text){vector-effect:non-scaling-stroke}
.fd-svg .fd-l{stroke:var(--a);fill:none;stroke-width:calc(1.5px * var(--fd-w,1));stroke-linecap:round}
.fd-svg .fd-l.trace{stroke-width:calc(var(--fd-tw,.9) * 1px * var(--fd-w,1));stroke-opacity:.55}
.fd-svg .fd-l.dash{stroke-dasharray:4 3;stroke-width:calc(1.1px * var(--fd-w,1))}
.fd-svg .fd-m{stroke:var(--a);fill:none;stroke-width:calc(1.4px * var(--fd-w,1))}
.fd-svg .fd-d{fill:var(--a);stroke:none}
.fd-svg .fd-n{fill:var(--a);font-family:var(--serif);font-style:italic;text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:var(--paper);stroke-width:3px;stroke-linejoin:round}
.fd-svg .fd-xy{font-family:var(--font);font-style:normal;fill:var(--muted)}
.fd-svg .fd-v{fill:var(--a);font-family:var(--font);text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:var(--paper);stroke-width:3px;stroke-linejoin:round}
.fd-svg .fd-pick{fill:none;stroke:var(--hl);stroke-width:1.6px}
.fd-svg .fd-snap{fill:rgba(47,85,89,.12);stroke:var(--a2);stroke-width:1px}
.fd-svg .fd-snap.named{fill:rgba(232,89,12,.12);stroke:var(--hl)}
.fd-svg .fd-snap.x{fill:none;stroke:var(--hl);stroke-width:1.4px}
.fd-svg .fd-snap.free{fill:none;stroke:var(--muted);stroke-width:1px}
.fd-svg .fd-tip{fill:var(--muted);font-family:var(--font);dominant-baseline:central;paint-order:stroke;stroke:var(--paper);stroke-width:3px;stroke-linejoin:round}
.fd-svg .fd-ghost{fill:none;stroke:var(--a2);stroke-width:1px;stroke-dasharray:3 3;opacity:.8}
.fd-svg .fd-prev{fill:none;stroke:var(--a);stroke-width:calc(1.2px * var(--fd-w,1));opacity:.75;stroke-linecap:round}
.fd-bar .fd-r{display:inline-block;min-width:6.6em;padding:0 9px;font-size:12px;line-height:1.85;color:var(--a);font-variant-numeric:tabular-nums;white-space:nowrap}
.fd-svg .fd-hov{stroke:var(--hl);stroke-width:3px;opacity:.35;stroke-linecap:round}
.fd-svg .fd-user,.fd-svg .fd-ui{pointer-events:none}
.fd-hint{position:absolute;z-index:4;max-width:62%;font-size:12px;line-height:1.6;padding:1px 9px;border-radius:7px;background:rgba(255,254,251,.92);color:var(--muted);box-shadow:0 1px 2px rgba(40,36,30,.08);pointer-events:none}
.fd-hint.warn{color:var(--accent)}
.fd-bar{position:absolute;left:0;right:0;bottom:0;z-index:4;min-height:66px;box-sizing:border-box;padding:5px 8px;display:flex;flex-direction:column;justify-content:center;gap:5px;background:var(--card);border:1px solid var(--hair);border-radius:12px;box-shadow:var(--raise)}
.fd-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px;min-width:0}
.fd-bar button{font:inherit;font-size:12px;line-height:1.85;padding:0 9px;border:1px solid var(--hair2);border-radius:8px;background:var(--card);color:var(--ink2);cursor:pointer;white-space:nowrap;flex:none}
.fd-bar button:hover:not(:disabled):not(.on){background:rgba(70,60,40,.05)}
.fd-bar button.on{background:var(--soft);color:var(--a);font-weight:600;border-color:rgba(47,85,89,.35);box-shadow:inset 0 1px 2px rgba(40,36,30,.08)}
.fd-bar button:disabled{opacity:.45;cursor:default}
.fd-sub{display:inline-flex;flex-wrap:wrap;max-width:100%;gap:0;border:1px solid var(--hair2);border-radius:8px;overflow:hidden}
.fd-sub button{border:0;border-radius:0}
.fd-sub button+button{border-left:1px solid var(--hair2)}
.fd-gap{flex:0 0 10px}
.fd-bar .fd-done{color:var(--a);font-weight:600}
.fd-bar [data-a=undo]{min-width:6.4em}
.fd-in{position:absolute;z-index:5;width:130px;font:inherit;font-size:13px;padding:3px 8px;border:1px solid rgba(47,85,89,.45);border-radius:7px;background:var(--card);color:var(--ink);box-shadow:var(--raise);outline:none}
/* 窗口很窄（如分屏）时：图在上、题和解答在下，整页滚动；图区定高，作图工具条换行后按钮都在 */
@media (max-width:640px){
  html.fixed body{height:auto;overflow:visible}
  main>.two{grid-template-columns:minmax(0,1fr);grid-template-rows:auto}
  main>.two>.left{height:min(80vh,640px)}
  main>.two>.right{overflow:visible}
}
/* v19 直角坐标系（网格淡、轴线细、刻度小字）与作图题（直线、圆规弧：本步新作的用高亮色） */
.fig-svg .ax-grid{stroke:rgba(40,36,30,.09);fill:none}
.fig-svg .ax{stroke:#8C877E;fill:none}
.fig-svg .ax-h{fill:#8C877E;stroke:none}
.fig-svg .ax-n{fill:#8C877E;font-family:var(--font);text-anchor:middle;dominant-baseline:central}
.fig-svg .ax-n.ax-name,.fig-svg .ax-n.ax-o{font-family:var(--serif);font-style:italic}
.fig-svg .ltxt.xy{fill:var(--muted)}
.fig-svg .carc{fill:none;stroke:var(--aux);stroke-opacity:.6}
.fig-svg .carc.new,.fig-svg .xline.new{stroke:var(--hl);stroke-dasharray:none}
.fig-svg .ax-n.ay{text-anchor:end}
/* v19「自己想」：只留图、条件和小问，解答 / 提示 / 答案先藏起来；图下卡片槽保留高度，切换时图不动 */
.prob h3 .smode{float:right;margin-top:2px;font-weight:400}
.two.self-on .right .sol,.two.self-on .prob .hintbar,.two.self-on .prob .hint{display:none}
.two.self-on .figbox .pbslot>*{visibility:hidden}
.selfnote{margin:12px 0 0;padding:10px 14px;border-radius:10px;background:var(--soft);color:var(--muted);font-size:14px;line-height:1.75}
.selfnote[hidden]{display:none}
.r-fill .r-up{position:sticky;top:18px;display:block;margin:18px auto 0;font:inherit;font-size:13px;line-height:2;padding:0 14px;border:1px solid var(--hair2);border-radius:99px;background:var(--card);color:var(--a);cursor:pointer;box-shadow:0 1px 2px rgba(40,36,30,.06)}
.r-fill .r-up:hover{background:var(--soft)}
.r-fill .r-up[hidden]{display:none}

/* v19 传递链：解答卡顶部一行小节点，条件 → 原型 → 推出的量 … → 答案；按已揭晓的步点亮，节点一开始就占好位置（未揭晓的量是 ？），点亮不改高度 */
.chain{flex:1 0 100%;display:flex;flex-wrap:wrap;align-items:center;gap:5px 4px;margin:6px 0 2px;padding:6px 8px;background:var(--sunk);border:1px solid var(--hair);border-radius:10px}
.ch-n{font:inherit;display:inline-flex;flex-direction:column;align-items:flex-start;gap:0;padding:2px 8px;border-radius:8px;border:1px solid var(--hair);background:var(--card);color:var(--muted);cursor:pointer;text-align:left;line-height:1.35}
.ch-n small{font-size:11px;color:var(--muted)}
.ch-n b{position:relative;font-size:12.5px;font-weight:600;color:var(--old)}
.ch-n .ch-q{position:absolute;left:0;top:0}
.ch-n:not(.on):not(.ch-c) .ch-v{visibility:hidden}
.ch-n.on .ch-q,.ch-c .ch-q{display:none}
.ch-n:disabled{cursor:default}
.ch-c{cursor:default}
.ch-c b,.ch-n.on b{color:var(--ink2)}
.ch-n.on{border-color:var(--ab)}
.ch-n.on:hover{background:var(--soft)}
.ch-n.cur{background:var(--soft);border-color:var(--a2)}
.ch-n.cur b{color:var(--a)}
.ch-n.key.on small{color:var(--aux)}
.ch-n.ch-goal.on b{color:var(--fd)}
.ch-g{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.ch-a{font-style:normal;font-size:13px;color:var(--old)}
.ch-a.back{color:var(--warm)}
.chip.recog{color:var(--a);border-color:var(--ab);background:var(--soft)}
/* v22 自由度账本：固定四个角色词——给定（橙）/ 推出（蓝）/ 自由（灰虚线）/ 冲突（红）；同一时刻只有一个焦点 */
:root{--free:#868E96;--bad:#E03131;--badf:rgba(224,49,49,.10)}
.fig-svg .led{fill:none;stroke-linecap:round;stroke-linejoin:round}
.fig-svg .led.f{stroke:var(--free);stroke-dasharray:5 4}
.fig-svg .led.k{stroke:#ced4da;stroke-dasharray:3 4}.fig-svg .led.n{stroke:var(--hl);opacity:.22}.fig-svg .led-fill.n{fill:var(--hl);opacity:.2}.fig-svg .led.x{stroke:var(--bad)}.fig-svg .led.d{stroke:var(--hl2)}.fig-svg .led.g{stroke:var(--hl)}
.fig-svg .led-fill{stroke:none}.fig-svg .led-fill.x{fill:var(--badf)}.fig-svg .led-fill.d{fill:var(--hl2f)}.fig-svg .led-fill.f{fill:rgba(134,142,150,.08)}
.lg.led-f{height:3px;border-radius:0;vertical-align:2px;background:repeating-linear-gradient(90deg,var(--free) 0 5px,transparent 5px 8px)}
.lg.led-x{background:var(--bad)}
.exr.ldg{display:block;text-align:left;font-size:13px;line-height:19px}
.ldg .lg-row{display:flex;gap:4px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ldg .lg-row>b{font-weight:600;flex:none}
.ldg .lg-g{color:var(--hlt)}.ldg .lg-f{color:#5c636a}.ldg .lg-d{color:#1864AB}.ldg .lg-x{color:var(--bad)}
.ldg .lg-row span{overflow:hidden;text-overflow:ellipsis}
.ldg .lchain{display:inline-flex;gap:2px;margin-left:auto;flex:none}
.ldg .lchain i{font-style:normal;padding:0 6px;border-radius:9px;background:#f1f3f5;color:#868e96}
.ldg .lchain i.on{background:var(--hl2);color:#fff}.ldg .lchain i.on.bad{background:var(--bad)}
.ldg .note{color:#868e96}
.ex-step{display:inline-flex;gap:6px}
/* 三拍过渡：因（新给定先亮）→ 变（400ms 形变）→ 果（推出的量再亮） */
.fig-svg.tb-cause :is(.c1){opacity:0}
.fig-svg.tb-effect :is(.c1){animation:tbfx .3s ease-out both}
@keyframes tbfx{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.fig-svg.tb-effect :is(.c1){animation:none}}
.two>.left .exr.ldg{height:60px;overflow:hidden}
.exr.ldg[hidden]{display:none}
/* 窄窗口：账本三行允许换行、状态链独立一行，不把“给了什么 / 推出什么”截成省略号 */
@media (max-width:1180px){.two>.left .exr.ldg{height:auto;min-height:60px}.ldg .lg-row{white-space:normal;flex-wrap:wrap}.ldg .lchain{margin-left:0;flex-basis:100%}}
.facts.merged .ex-ctl .ex-sl[hidden],.ex-step[hidden]{display:none}
/* v22.3 函数图：同一数学模型的曲线、命中区和标签。 */
.fig-svg .fn-curve{fill:none;stroke:var(--ink2);stroke-linecap:round;stroke-linejoin:round}
.fig-svg .fn-curve.role-g,.fig-svg .fn-end.role-g{stroke:var(--hl)}
.fig-svg .fn-curve.role-d,.fig-svg .fn-end.role-d{stroke:var(--hl2)}
.fig-svg .fn-curve.role-f{stroke:var(--free);stroke-dasharray:5 5}
.fig-svg .fn-curve.role-x{stroke:var(--bad)}
.fig-svg .fn-curve.dashed{stroke-dasharray:6 5}
.fig-svg .fn-hit{fill:none;stroke:transparent;stroke-width:14;pointer-events:stroke;cursor:pointer}
.fig-svg .fn-faint{opacity:.16}
.fig-svg .fn-end{fill:var(--ink2);stroke:var(--ink2);stroke-width:1.5}
.fig-svg .fn-end.open{fill:var(--paper)}
.fig-svg .fn-selected .fn-curve{filter:drop-shadow(0 0 2px color-mix(in srgb,var(--hl) 25%,transparent))}
.fig-svg .fn-object:focus{outline:none}
.fig-svg .fn-object:focus-visible .fn-curve{stroke-width:3}
.function-ledger{height:80px;min-height:80px;box-sizing:border-box;overflow-y:auto;margin-top:4px;font-size:12px;line-height:1.5}
.function-ledger .lg-row{min-height:23px}
.function-graph{height:210px;min-height:210px;position:relative;border-top:1px solid var(--hair);padding-top:6px;box-sizing:border-box}
.function-graph>svg{width:100%;height:100%;display:block}
.function-placeholder{height:100%;margin:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px}
@media(max-width:760px){.function-graph{height:230px;min-height:230px}}
/* 图例换行仍在原来 134px 的图注总区域内，不挤小主图。 */
.two>.left>.figwrap:has(.figbox.pbfix)>.figtools{height:var(--tools-height,26px);min-height:var(--tools-height,26px)}
.two>.left>.figwrap:has(.figbox.pbfix)>.figcap{height:calc(118px - var(--tools-height,26px))}
.figbox.pbfix .pbslot.fit-props{display:grid;grid-template-columns:repeat(var(--property-count),minmax(0,1fr)) auto;align-items:start}
.pbslot.fit-props .propbar{display:contents}
.pbslot.fit-props .pb-item{max-width:none;min-width:0}
.pbslot.fit-props .pb-proto{width:52px;height:42px}
/* 账本有自己的固定区域，不占用原有性质、图例、当前句格子。 */
.function-graph[hidden]{display:none}
.function-ledger{padding-inline:4px}
.function-ledger .lg-row{flex-wrap:nowrap}
.function-ledger .lg-row>span{min-width:0;flex:1;white-space:normal}
.two:has(>.function-ledger){position:relative}
/* 使用标题右侧已有的留白，既不覆盖正文，也不从两栏扣除高度。 */
.two>.function-ledger{position:absolute;right:0;bottom:calc(100% + 8px);width:calc((100% - 24px)/2.15);margin:0;height:auto;min-height:80px;background:var(--sunk)}
.two:has(>.function-ledger)>.left{grid-column:1;grid-row:1}
.two:has(>.function-ledger)>.right{grid-column:2;grid-row:1}
/* 标题留白较窄时只收窄账本；增高向上展开，不改变两栏矩形。 */
@media (min-width:820px) and (max-width:859px){
  .two>.function-ledger{width:calc((100% - 24px)/2.15 - 12px);height:auto}
  .two>.function-ledger .lg-row{flex-wrap:nowrap}
  .two>.function-ledger .lg-row>span{flex:1;white-space:normal}
}
/* 单栏账本随文档阅读，放在主图与讲解之间；图槽独立定高。 */
@media (max-width:819px){
  html.fixed:has(.two>.function-ledger) body{height:auto;overflow:visible}
  main>.two:has(>.function-ledger){grid-template-columns:minmax(0,1fr);grid-template-rows:auto}
  .two:has(>.function-ledger)>.left{grid-column:1;grid-row:1;height:min(80vh,800px)}
  .two:has(>.function-ledger)>.right{grid-column:1;grid-row:3;overflow:visible}
  .two>.function-ledger{position:static;grid-column:1;grid-row:2;width:auto;height:auto;overflow:visible}
  .two>.function-ledger .lg-row{flex-wrap:nowrap;min-height:3em}
  .two>.function-ledger .lg-row>span{flex:1;white-space:normal}
}
@media (max-width:640px){
  .two:has(>.function-ledger)>.left{height:min(80vh,640px)}
}
.lg.led-g{background:var(--hl)}.lg.led-d{background:var(--hl2)}
.fig-svg.tb-cause .fn-curve.role-d{opacity:0}
.fig-svg.tb-effect .fn-curve.role-d{animation:tbfx .3s ease-out both}
/* 只有附图真正揭示时才分栏。主图槽沿用原尺寸；整块成为一张完整白卡。 */
.two>.left>.figwrap.graph-shown{background:var(--paper);border-radius:var(--r);box-shadow:var(--raise),inset 0 0 0 1px rgba(40,36,30,.1)}
.graph-shown>.figbox{background:transparent;border-color:transparent;box-shadow:none}
.graph-shown .pbslot{width:42%;height:72px}
.two>.left>.figwrap.graph-shown:has(.figbox.pbfix)>.figtools{position:absolute;left:12px;bottom:93px;width:42%;height:82px;min-height:82px;margin:0;overflow:visible;align-content:center}
.two>.left>.figwrap.graph-shown:has(.figbox.pbfix)>.figcap{position:absolute;left:12px;bottom:1px;width:42%;height:88px;margin:0;overflow:visible;align-content:flex-start}
.has-function-graph>.function-graph{position:absolute;right:12px;bottom:1px;width:54%;height:260px;min-height:260px;background:var(--paper);border:0;padding:0}
/* 绝对定位的图注仍占用与原版相同的流布局高度。 */
.two>.left>.figwrap.graph-shown{padding-bottom:134px;box-sizing:border-box}
.graph-shown .pbslot:empty{visibility:hidden}
.fig-svg .fn-curve.c0,.fig-svg .fn-end.c0{stroke:var(--hl)}
.fig-svg .fn-curve.c1,.fig-svg .fn-curve.c2{stroke:var(--hl2)}

/* 战略短链沿用解答卡、按钮与配色，不占固定控制条。 */
.strategy { margin: 12px 0; padding: 10px 12px; background: var(--sunk); border-radius: 8px; }
.strategy.strategy-compact { margin: 0 0 6px; padding: 6px 8px; }
.strategy h4,.strategy p { margin: 5px 0; }
.strategy-bridges { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.strategy .bridge { white-space:normal; text-align:left; font-size:13px; }

.two>.left>.figwrap>.figbox.formula-notes{grid-template-rows:minmax(0,1fr) 48px}
.figbox.formula-notes .pbslot{height:48px}
.formula-notes .pb-t{display:flex;flex-direction:row;flex-wrap:wrap;gap:2px 10px;align-items:baseline}

/* 契约讲题只使用账本的四个角色色。 */
.contract-roles{--hl3:var(--free);--hl3f:rgba(134,142,150,.12)}
.contract-roles .fig-svg :is(.pl.hot,.dot.hot).c2{fill:var(--free)}
.contract-roles .fig-svg .fn-curve.c2{stroke:var(--free)}
.contract-roles .fig-svg :is(.hl-seg,.hl-ray,.hl-arc,.hl-circ,.hl-outline,.fn-curve).c3{stroke:var(--bad)}
.contract-roles .fig-svg :is(.pl.hot,.dot.hot).c3{fill:var(--bad)}
.contract-roles .fig-svg .hl-fill.c3{fill:var(--badf)}
.formula-notes .pb-item{max-width:100%}

/* v22.5：题目、题图、讲解独立分栏；步骤只滚动自身，控件不参与内容流动。 */
@media (min-width:1100px) {
 html.fixed body>main { max-width:none;padding:16px 20px 12px; }
 main>.study-layout { grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr) minmax(0,1fr);gap:16px; }
 .study-layout>.problem-col { grid-column:2;grid-row:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable; }
 .study-layout>.right,.study-layout:has(>.function-ledger)>.right { grid-column:3;grid-row:1;overflow:hidden;padding-right:0; }
 .study-layout>.right>.sol { height:100%;box-sizing:border-box;margin:0;display:flex;flex-direction:column;min-height:0;padding:12px; }
 .study-layout>.right .sol>.ctl { position:relative;top:auto;flex:none;order:-1;margin:0 0 8px;padding:0; }
 .study-layout>.right .sol>h3 { flex:none;margin:0 0 8px; }
 .study-layout>.right .steps { flex:1 1 0;min-height:0;overflow-y:auto;overflow-anchor:none;overscroll-behavior:contain;scrollbar-gutter:stable;margin:0;padding-right:8px; }
 .study-layout>.right .ans { flex:none;max-height:70px;overflow-y:auto; }
 .study-layout>.function-ledger { width:calc((100% - 32px)/3.1); }
 .study-layout>.right>.r-fill { display:none; }
}
@media (max-width:1099px) { .study-layout>.problem-col { min-height:0;overflow:auto; } .study-layout { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .study-layout>.problem-col{grid-column:2;grid-row:1}.study-layout>.right{grid-column:2;grid-row:2}.study-layout>.left{grid-row:1/3} }
.exam-badge { display:inline-block;color:var(--a);border:1px solid var(--hair);border-radius:6px;padding:1px 6px; }

@media (min-width:1100px) { .study-layout>.right .sol>.tip { position:static;flex:none;max-height:72px;overflow:auto; } .study-layout>.right .sol>.answer{flex:none;max-height:none;overflow:visible;padding:10px 12px;font-size:16px;line-height:1.5;} }
@media (min-width:1100px) {
 main>.study-layout { grid-template-columns:minmax(0,1.25fr) minmax(0,.65fr) minmax(0,1.2fr); }
 .study-layout>.function-ledger { width:calc((100% - 32px)*1.2/3.1); }
 .study-layout>.right .sol>.ctl { gap:6px; }
 .study-layout>.right .sol>.ctl .keys { font-size:11px; }
 .study-layout>.right .step { padding:10px 12px 10px 50px; }
}

@media (max-width:640px) {
 main>.study-layout { grid-template-columns:minmax(0,1fr);grid-template-rows:auto; }
 main>.study-layout>.left { grid-column:1;grid-row:1;height:min(80vh,640px); }
 main>.study-layout>.problem-col { grid-column:1;grid-row:2;overflow:visible; }
 main>.study-layout>.right { grid-column:1;grid-row:3;overflow:visible; }
 main>.study-layout:has(>.function-ledger)>.function-ledger { grid-column:1;grid-row:2; }
 main>.study-layout:has(>.function-ledger)>.problem-col { grid-row:3; }
 main>.study-layout:has(>.function-ledger)>.right { grid-row:4; }
}
@media (min-width:1100px) {
 .study-layout>.right .sol>.ctl .keys { display:none; }
 .study-layout>.right .sol>.ctl .btn { padding:7px 10px;font-size:14px; }
 .study-layout>.right .sol>.ctl .think { font-size:12px; }
 /* 独立函数结论图保留原主图和附图的可读尺寸。 */
 html.fixed body>main:has(.has-function-graph) { max-width:1400px;padding:18px 16px 12px; }
 main>.study-layout:has(.has-function-graph) { grid-template-columns:calc((100% - 24px)*1.15/2.15) minmax(0,.3fr) minmax(0,.7fr); }
 .study-layout:has(.has-function-graph)>.function-ledger { width:calc((100% - 24px)/2.15); }
}
@media (max-width:819px) {
 html.fixed body { height:auto;overflow:visible; }
 main>.study-layout { grid-template-columns:minmax(0,1fr);grid-template-rows:auto; }
 main>.study-layout>.left,main>.study-layout:has(>.function-ledger)>.left { grid-column:1;grid-row:1;height:min(80vh,800px); }
 main>.study-layout>.problem-col { grid-column:1;grid-row:2;height:min(65vh,600px);overflow:auto; }
 main>.study-layout>.right { grid-column:1;grid-row:3;overflow:visible; }
 main>.study-layout:has(>.function-ledger)>.function-ledger { grid-column:1;grid-row:2;position:static;width:auto;height:auto;overflow:visible; }
 main>.study-layout:has(>.function-ledger)>.problem-col { grid-row:3; }
 main>.study-layout:has(>.function-ledger)>.right { grid-row:4; }
}
@media (min-width:1100px) {
 .study-layout .strategy-compact { padding:4px 6px; }
 .study-layout .strategy-compact .bridge { padding:3px 5px;font-size:12px;line-height:1.4; }
}

/* v22.5 学生回归：题干最小宽度独立于图形比例；提示全文可读。 */
@media (min-width:1100px) {
 main>.study-layout, main>.study-layout:has(.has-function-graph) {grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr) minmax(0,1.1fr);}
 .study-layout>.right .sol>.tip {max-height:none;overflow:visible;}
 .study-layout .prob h3 {display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
 .study-layout .prob h3 .smode {float:none;margin-left:0;}
}
/* 控件占独立顶行，不覆盖缩放后的点。 */
.two>.left>.figwrap {padding-top:32px;}
.two>.left>.figwrap>.fd-tog {top:2px;}
/* 性质入口与辅助线按钮共用图外顶栏，空栏不占题图高度。 */
.study-layout>.left>.figwrap>.figbox.pbfix,
.study-layout>.left>.figwrap>.figbox.formula-notes {grid-template-rows:minmax(0,1fr);}
.study-layout .figwrap>.pbslot {position:absolute;top:2px;left:0;right:100px;width:auto;height:27px;display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none;}
.study-layout .figwrap>.pbslot:empty {height:0;}
.study-layout .pbslot .propbar {display:flex;flex-wrap:nowrap;gap:6px;flex:none;border:0;padding:0;margin:0;}
.study-layout .pbslot .pb-item {flex:none;max-width:none;padding:2px 8px;}
.study-layout .pbslot .pb-t {display:flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap;}
.study-layout .pbslot .pb-thumb,.study-layout .pbslot .pb-proto,.study-layout .pbslot .pb-t>span {display:none;}
.study-layout .pbslot .mthumbs {display:flex;flex-wrap:nowrap;flex:none;margin:0;padding:0;border:0;}
.study-layout .pbslot .mthumb {white-space:nowrap;padding:2px 8px;}
.study-layout .pbslot .mthumb svg {display:none;}
.study-layout.self-on .pbslot>* {visibility:hidden;}
.study-layout .pbslot>.figure-reading {display:flex;flex-direction:column;gap:3px;padding:3px 0;box-sizing:border-box;white-space:normal;font-size:13px;line-height:1.5;color:var(--ink2);}
.figure-reading small {font-size:12px;}
@media (min-width:1100px) {
 .study-layout>.left>.figwrap:not(.graph-shown):not(.has-function-graph):has(.figbox.pbfix)>.figcap {height:calc(118px - var(--tools-height,26px));}
}

/* 尺规题在基线下方留出画下半圆的空间；视图从进入题目起固定。 */
.study-layout .construction-canvas>.figbox {padding-bottom:100px;}
/* 紧凑排列图例与标注开关；按自然高度分配固定图下注区域。 */
@media (min-width:1100px) {
 .study-layout>.left>.figwrap:not(.graph-shown)>.figtools {flex-wrap:wrap;gap:4px 6px;}
 .study-layout>.left>.figwrap:not(.graph-shown)>.figtools .legend {flex-wrap:wrap;gap:4px 6px;}
 .study-layout>.left>.figwrap:not(.graph-shown):has(.figbox.pbfix)>.figcap {height:calc(82px - var(--tools-height,26px));}
}

@media (min-width:1100px) { .study-layout>.left>.figwrap.graph-shown {padding-bottom:98px;} }

/* 超长性质入口保留完整卡片与悬停标题，按钮本身不能宽过可见横栏。 */
.study-layout .figwrap>.pbslot {container-type:inline-size;}
.study-layout .pbslot .propbar {max-width:none;justify-content:flex-start;}
.study-layout .pbslot .pb-item {max-width:100cqw;}
.study-layout .pbslot .pb-t>b {min-width:0;overflow:hidden;text-overflow:ellipsis;}
.study-layout .pbslot .pb-t>i {flex:none;}
.study-layout .pbslot .mthumb {display:flex;align-items:center;gap:6px;max-width:none;}
.study-layout .pbslot .mthumb b,.study-layout .pbslot .mthumb small {display:inline;}

/* v22.5 收尾：视图按钮占图外固定槽，提示和作图工具不遮挡数学图形。 */
.two>.left>.figwrap {padding-top:64px;}
.two>.left>.figwrap>.fd-zm {top:2px!important;left:0!important;right:auto!important;}
.study-layout .figwrap>.pbslot {top:34px;right:0;scrollbar-width:thin;}
.two>.left>.figwrap>.fd-hint {top:auto!important;bottom:0;left:0!important;max-width:none!important;right:0;min-height:38px;box-sizing:border-box;}
.two>.left>.figwrap>.fd-bar {bottom:42px;}
.two>.left>.figwrap:has(.fd-bar:not([hidden]))>.figcap {visibility:hidden;}
.self-work {display:none;}
.self-on .self-work {display:block;}
.step-make {margin-top:6px;border-left:2px solid var(--hair);padding-left:8px;font-size:13px;color:var(--ink2);}
.cx {display:block;}
.cx>.card {display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;}
.cx>.card>h2 {grid-column:1/-1;}
.two>.left>.figwrap>.fd-peek {top:34px;left:auto;right:0;}
.study-layout .figwrap:has(>.fd-peek:not([hidden]))>.pbslot {right:140px;}
/* 宽图沿用原两栏版左侧宽度，右侧拆成题干与讲解两区。 */
@media (min-width:1100px) {
 html.fixed body>main {max-width:1400px;padding:18px 16px 12px;}
 main>.study-layout,main>.study-layout:has(.has-function-graph) {grid-template-columns:calc((100% - 24px)*1.15/2.15) 260px minmax(0,1fr);gap:12px;}
 .study-layout>.function-ledger {width:calc((100% - 24px)/2.15);}
 .study-layout .construction-canvas>.figbox {padding-bottom:100px;}
 /* 附图复用原性质区右侧的空间；所有步骤的主图槽完全一致。 */
 .two>.left>.figwrap.has-function-graph {padding:0;}
 .two>.left>.figwrap.has-function-graph>.figbox {grid-template-rows:minmax(0,1fr);flex:none;height:calc(100% - 134px);padding-bottom:133px;}
 .two>.left>.figwrap.has-function-graph>.pbslot {position:absolute;left:13px;right:13px;top:auto;bottom:147px;width:auto;height:112px;padding-bottom:32px;box-sizing:border-box;white-space:normal;}
 .two>.left>.figwrap.has-function-graph>.figtools {position:static;width:auto;height:26px;min-height:26px;flex:none;margin-top:8px;}
 .two>.left>.figwrap.has-function-graph>.figcap {position:static;width:auto;height:92px;flex:none;margin-top:8px;}
 .two>.left>.figwrap.has-function-graph>.fd-zm {top:auto!important;bottom:148px;left:13px!important;}
 .two>.left>.figwrap.has-function-graph>.fd-tog {top:auto;bottom:148px;}
 .two>.left>.figwrap.has-function-graph.graph-shown>.pbslot {right:58%;height:72px;bottom:187px;padding-bottom:0;}
 .two>.left>.figwrap.has-function-graph.graph-shown>.figtools {position:absolute;left:12px;bottom:93px;width:42%;height:82px;min-height:82px;margin:0;}
 .two>.left>.figwrap.has-function-graph.graph-shown>.figcap {position:absolute;left:12px;bottom:1px;width:42%;height:88px;margin:0;}
 .two>.left>.figwrap.has-function-graph.graph-shown>.fd-zm {bottom:148px;}
 .two>.left>.figwrap.has-function-graph.graph-shown>.fd-tog {bottom:117px;right:auto;left:12px;}
}
@media (min-width:1100px) {
 .study-layout .strategy-compact {font-size:12px;line-height:1.3;}
 .study-layout .strategy-compact .bridge {font-size:11px;line-height:1.2;padding:2px 4px;}
 .study-layout .strategy-compact .strategy-bridges {gap:2px;}
 .study-layout .strategy-compact .bridge small {display:none;}
 .study-layout>.right .step {padding:8px 8px 8px 36px;}
 .study-layout>.right .sol>.ctl {flex-wrap:nowrap;}
 .study-layout>.right .sol>.ctl .think {display:none;}
 .two>.left>.figwrap.has-function-graph>.figbox {padding-bottom:132px;}
 .two>.left>.figwrap.has-function-graph:not(.graph-shown):has(.figbox.pbfix)>.figcap {height:92px;}
 .two>.left>.figwrap.has-function-graph>.fd-tog {bottom:117px;right:auto;left:12px;}
}
@media (min-width:1100px) {
 .study-layout>.right .sol>.ctl .think {display:block;position:absolute;right:0;top:calc(100% + 10px);}
}
@media (min-width:1100px) {
 .two>.left:has(.has-function-graph),.two>.left>.figwrap.has-function-graph {overflow:visible;}
 .two>.left>.figwrap.has-function-graph>.fd-zm {top:-36px!important;bottom:auto!important;left:140px!important;}
 .two>.left>.figwrap.has-function-graph>.fd-tog {top:-36px!important;bottom:auto!important;left:auto!important;right:0!important;}
 .two>.left>.figwrap.has-function-graph>.fd-peek {top:-36px;right:110px;}
}
.current-question {font-size:15px;line-height:1.55;}
.question-full {font:inherit;font-size:12px;color:var(--a);background:var(--card);border:1px solid var(--hair);border-radius:6px;padding:3px 8px;margin-top:8px;cursor:pointer;}
@media (min-width:1100px) {
 .two>.left:not(:has(.has-function-graph)),.two>.left>.figwrap:not(.has-function-graph) {overflow:visible;}
 .two>.left>.figwrap:not(.has-function-graph) {padding-top:32px;}
 .study-layout .figwrap:not(.has-function-graph)>.pbslot {top:2px;right:110px;}
 .two>.left>.figwrap:not(.has-function-graph)>.fd-zm {top:-36px!important;left:300px!important;right:auto!important;}
 .two>.left>.figwrap:not(.has-function-graph)>.fd-peek {top:-36px;left:140px;right:auto;}
 .two>.left>.figwrap:not(.has-function-graph):has(.figbox.pbfix)>.figcap {height:28px;}
}
.type-tags {display:block;font-size:12px;color:var(--muted);}
.pn a small {display:block;font-size:11px;color:var(--muted);}
.pn a small {display:inline;margin-left:8px;}
/* 为圆规子选项预留同一高度，切换工具不移动工具条。 */
@media (min-width:1100px) {
 .two>.left>.figwrap>.fd-bar {height:94px;min-height:94px;justify-content:flex-start;}
}
/* 普通题顶行分给视图、性质、作图三个入口，不侵占页头标签。 */
@media (min-width:1100px) {
 .two>.left>.figwrap:not(.has-function-graph)>.fd-zm {top:2px!important;left:0!important;}
 .study-layout .figwrap:not(.has-function-graph)>.pbslot {left:184px;right:110px;}
 .two>.left>.figwrap:not(.has-function-graph)>.fd-peek {top:auto;bottom:2px;left:12px;right:auto;}
}
/* 探究账本复用图下注释区域，不再额外挤占主图高度。 */
@media (min-width:1100px) {
 .study-layout>.left>.figwrap:not(.has-function-graph)>.exr {position:absolute;left:0;right:0;bottom:0;height:60px;margin:0;}
 .study-layout>.left>.figwrap:has(>.exr:not([hidden]))>.figtools,
 .study-layout>.left>.figwrap:has(>.exr:not([hidden]))>.figcap {visibility:hidden;}
}