/* 资料页的一叠文件夹和详情页的图表块。颜色全部用 style.css 的夜读变量（A.2），夹子的底色是夹子颜色和卡片底色混出来的。 */
.fs-wrap { max-width:620px;margin:0 0 30px; }
.fs-hint { margin:0 0 4px;color:var(--fg2); }
.fs-stack { position:relative;transition:height .55s cubic-bezier(.32,.72,0,1); }
.fs-folder { --fbody:color-mix(in srgb,var(--fc) 24%,var(--card));position:absolute;left:0;right:0;top:30px;height:var(--h,268px);
  transition:transform .55s cubic-bezier(.32,.72,0,1);will-change:transform; }
.fs-tab { position:absolute;top:-25px;height:30px;min-width:72px;max-width:min(168px,62%);padding:0 14px 5px;border-radius:12px 12px 0 0;display:flex;align-items:center;justify-content:center;gap:6px;
  font-size:13.5px;font-weight:650;color:var(--fg);background:var(--fbody);white-space:nowrap;cursor:pointer;transition:transform .3s cubic-bezier(.32,.72,0,1); }
.fs-tname { overflow:hidden;text-overflow:ellipsis; }
.fs-tab small { font:500 12px var(--num);color:var(--fg2);font-variant-numeric:tabular-nums; }
.fs-folder.custom .fs-tab::before { content:"";flex:none;width:6px;height:6px;border-radius:50%;border:1.5px solid currentColor; }
.fs-tab:focus-visible,.fs-sum:focus-visible { outline:2px solid var(--a2);outline-offset:2px; }
@media (hover:hover) { .fs-folder:not(.front) .fs-tab:hover { transform:translateY(-4px); } }
.fs-body { position:absolute;inset:0;border-radius:4px 18px 18px 18px;background:var(--fbody);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--fg) 7%,transparent),var(--shadow); }
.fs-lip { position:absolute;left:10px;right:10px;top:7px;height:10px;border-radius:8px 8px 0 0;background:var(--card);opacity:.55; }

/* 最前面那夹：摘要卡 */
.fs-sum { position:absolute;inset:10px;border-radius:14px;background:var(--card);padding:16px 16px 12px;display:grid;grid-template-rows:auto auto 1fr auto;gap:8px;
  opacity:0;transform:translateY(8px);transition:opacity .35s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.32,.72,0,1);pointer-events:none;cursor:pointer;overflow:hidden; }
.fs-folder.front .fs-sum { opacity:1;transform:none;pointer-events:auto; }
.fs-top { display:flex;justify-content:space-between;align-items:flex-start;gap:10px;min-width:0; }
.fs-top>div:first-child { min-width:0; }
.fs-eyebrow { font-size:12px;color:var(--fg2);letter-spacing:.04em; }
.fs-name { font-size:24px;margin:2px 0 0;font-weight:750;overflow-wrap:anywhere; }
.fs-line { font-size:13.5px;line-height:1.55;color:var(--fg2);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden; }
.fs-ring { flex:none;width:64px;height:64px;position:relative;margin-bottom:18px; }
.fs-ring svg { width:100%;height:100%;transform:rotate(-90deg); }
.fs-ring-bg,.fs-ring-arc { fill:none;stroke-width:6; }
.fs-ring-bg { stroke:var(--line); }
.fs-ring-arc { stroke:var(--a2);stroke-linecap:round;transition:stroke-dashoffset .9s cubic-bezier(.32,.72,0,1),stroke .3s; }
.fs-ring.warn .fs-ring-arc { stroke:var(--accent-ink); }
.fs-ring b { position:absolute;inset:0;display:grid;place-items:center;font:650 18px var(--num);font-variant-numeric:tabular-nums; }
.fs-ring b i { font-style:normal;font-size:12px; }
.fs-ring > span { position:absolute;left:-14px;right:-14px;bottom:-17px;text-align:center;font-size:11px;color:var(--fg2);white-space:nowrap; }
.fs-ring.warn > span { color:var(--accent-ink);font-weight:650; }
.fs-big { flex:none;text-align:right; }
.fs-big b { font:700 40px/1 var(--num);font-variant-numeric:tabular-nums; }
.fs-big b i { font:400 12px var(--font);color:var(--fg2);margin-left:3px;font-style:normal; }
.fs-stats { display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.3fr);gap:8px;align-items:end;align-self:end; }
.fs-stat { min-width:0; }
.fs-stat .k { font-size:11px;color:var(--fg2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.fs-stat .v { font:650 19px var(--num);font-variant-numeric:tabular-nums;white-space:nowrap; }
.fs-stat .v i { font:400 11px var(--font);color:var(--fg2);margin-left:2px;font-style:normal; }
.fs-spark { width:100%;height:34px;overflow:visible; }
.fs-spark path.l { fill:none;stroke:var(--a2);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;transition:d .6s cubic-bezier(.32,.72,0,1); }
.fs-spark path.a { fill:var(--a2);opacity:.12;transition:d .6s cubic-bezier(.32,.72,0,1); }
.fs-spark circle { fill:var(--a2);transition:cx .6s cubic-bezier(.32,.72,0,1),cy .6s cubic-bezier(.32,.72,0,1); }
.fs-need { margin:0;font-size:11.5px;line-height:1.45;color:var(--fg2);align-self:end; }
.fs-open { font-size:12px;color:var(--fg2);text-align:right; }
@media (max-width:380px) { .fs-sum { padding:14px 13px 10px; }.fs-name { font-size:22px; }.fs-stat .v { font-size:17px; }.fs-stats { gap:6px; } }

/* 展开、收起时盖在上面的那一层 */
.fs-overlay { --fbody:color-mix(in srgb,var(--fc) 24%,var(--card));position:fixed;inset:0;z-index:90;background:var(--fbody);pointer-events:none;overflow:hidden; }
.fs-overlay-in { display:grid;gap:4px;padding:calc(84px + env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-left,0px)) 0;max-width:1180px;margin:0 auto;color:var(--fg); }
.fs-overlay-in .fs-eyebrow { font-size:12px; }
.fs-overlay-in strong { font-size:clamp(30px,8vw,44px);font-weight:800; }

/* 详情页顶上的图表块 */
.fs-panel { background:var(--surface);border-radius:24px;padding:16px 18px 18px;margin:0 0 14px;min-width:0; }
.fs-panel h3 { margin:0 0 12px;font-size:16px;font-weight:700;display:flex;justify-content:space-between;align-items:baseline;gap:8px; }
.fs-panel h3 small { font-weight:400;color:var(--fg2);font-size:12px; }
.fs-pneed { margin:0;color:var(--fg2); }
.fs-panels { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0 14px; }
.fs-donut { display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center; }
.fs-donut svg { width:120px;height:120px; }
.fs-donut path { cursor:pointer;transform-origin:60px 60px;transition:opacity .3s,transform .4s cubic-bezier(.32,.72,0,1); }
.fs-donut path.off { opacity:.35; }
.fs-donut path.on { transform:scale(1.04); }
.fs-dn { font:700 20px var(--num);fill:var(--fg); }
.fs-dl { font:11px var(--font);fill:var(--fg2); }
.fs-legend { display:grid;gap:4px;font-size:13.5px; }
.fs-legend button { display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:8px;align-items:center;min-height:36px;padding:2px 8px;border-radius:10px;text-align:left;color:var(--fg);transition:background .25s; }
.fs-legend button[aria-pressed=true] { background:var(--tint); }
.fs-legend b { font:650 13px var(--num); }
.fs-sw { width:12px;height:12px;border-radius:4px; }
.fs-picked { margin:12px 0 0;color:var(--fg2);min-height:2.6em; }
.fs-grid { display:grid;grid-template-rows:repeat(7,1fr);grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:3px; }
.fs-grid i { aspect-ratio:1;border-radius:3px;background:color-mix(in srgb,var(--a2) 10%,var(--card2));transition:background .4s; }
.fs-grid i.l1 { background:color-mix(in srgb,var(--a2) 40%,var(--card2)); }
.fs-grid i.l2 { background:color-mix(in srgb,var(--a2) 70%,var(--card2)); }
.fs-grid i.l3 { background:var(--a2); }
.fs-grid i.later { background:transparent;box-shadow:inset 0 0 0 1px var(--line); }
.fs-gnote { display:flex;justify-content:space-between;margin-top:6px;color:var(--fg2); }
.fs-chips { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px; }
.fs-chip { min-height:36px;padding:0 14px;border-radius:999px;background:var(--bg);color:var(--fg);font-size:13.5px;font-weight:600;transition:background .25s,color .25s; }
.fs-chip[aria-pressed=true] { background:var(--fg);color:var(--bg); }
.fs-chart { display:block;width:100%;height:170px;touch-action:pan-y;outline-offset:3px; }
.fs-chart text { fill:var(--fg2);font:11px var(--num); }
.fs-chart line.g { stroke:var(--line); }
.fs-chart .ln { fill:none;stroke:var(--a2);stroke-width:2.5;stroke-linejoin:round; }
.fs-chart .ar { fill:var(--a2);opacity:.1; }
.fs-chart circle { fill:var(--card);stroke:var(--a2);stroke-width:2;transition:r .2s,fill .2s; }
.fs-chart circle.last,.fs-chart circle.pick { fill:var(--a2); }
.fs-chart circle.pick { r:6px; }
.fs-tip { margin:6px 0 0;color:var(--fg2);min-height:1.6em; }
.fs-tip b { font:650 15px var(--num);color:var(--fg); }
.fs-mxwrap { overflow-x:auto; }
.fs-mx { width:100%;border-collapse:separate;border-spacing:4px;font-size:12.5px; }
.fs-mx th { font-weight:500;color:var(--fg2);text-align:center;font-size:12px;white-space:nowrap; }
.fs-mx th[scope=row] { text-align:left;padding-right:4px; }
.fs-cell { width:100%;min-height:40px;border-radius:9px;font:650 15px var(--num);color:var(--fg);transition:transform .25s cubic-bezier(.32,.72,0,1),box-shadow .25s; }
.fs-cell[aria-pressed=true] { box-shadow:inset 0 0 0 2px var(--fg);transform:scale(1.06); }
.fs-cell:disabled { cursor:default; }
.fs-bars { display:block;width:100%;height:120px; }
.fs-bars rect { fill:color-mix(in srgb,var(--a2) 35%,var(--card2));transition:y .5s cubic-bezier(.32,.72,0,1),height .5s cubic-bezier(.32,.72,0,1); }
.fs-bars rect.now { fill:var(--a2); }
.fs-hbars { display:grid;gap:8px; }
.fs-hbar { display:grid;grid-template-columns:6.5em minmax(0,1fr) 2.2em;gap:10px;align-items:center;font-size:13.5px; }
.fs-hbar i { height:10px;border-radius:5px;background:linear-gradient(var(--a2),var(--a2)) 0 0/var(--w) 100% no-repeat,var(--card2);transition:background-size .5s cubic-bezier(.32,.72,0,1); }
.fs-hbar b { font:650 13px var(--num);text-align:right; }

/* 错题行里的错因、计划前面的“做完”圆点、自建栏目页 */
.wrong-cause { min-height:36px;max-width:11em;padding:4px 30px 4px 10px;font-size:13px;border-radius:10px; }
.plan-dot { flex:none;align-self:center;width:44px;height:44px;margin:-6px 0 -6px -10px;display:grid;place-items:center;border-radius:50%; }
.plan-dot::before { content:"";width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--fg2);transition:background .3s,box-shadow .3s; }
.plan-dot[aria-pressed=true]::before { background:var(--f-green);box-shadow:inset 0 0 0 1.5px var(--f-green); }
.ilist li.plan-done .itext { color:var(--fg2);text-decoration:line-through;text-decoration-color:var(--line); }
.custom-page-list { display:grid;gap:10px; }
.custom-page-list .continue-row { width:100%; }

@media (prefers-reduced-motion:reduce) {
  .fs-folder,.fs-sum,.fs-stack,.fs-spark path,.fs-spark circle,.fs-ring-arc,.fs-bars rect,.fs-hbar i,.fs-donut path { transition-duration:.25s; }
}

/* 资料页文件区：多了一个“按类型”下拉框，手机上搜索框占一行、两个下拉框并排在下一行；“教材与练习”滚到这里时不被顶栏挡住 */
.material-finder { scroll-margin-top:96px; }
@media (max-width:600px) { .material-finder { flex-wrap:wrap; }.material-search { flex-basis:100%; }.material-finder>select { flex:1;width:auto; } }
/* 资料标题右边的搜索和“我”：手机上顶栏去掉以后，materials.js 把顶栏那两个按钮挪进来；没挪进来时这一格不占地方 */
.page-actions { display:flex;gap:6px;align-items:center;margin-top:6px; }
.page-actions:empty { display:none; }
.materials-head:has(.page-actions:not(:empty)) { align-items:flex-start; }
.materials-head:has(.page-actions:not(:empty)) .materials-hero-folder { display:none; }
/* 手机上错因下拉框换到题目下面一行，题目不被挤成一列 */
@media (max-width:760px) {
  .ilist li:has(> .wrong-cause) { flex-wrap:wrap;row-gap:4px; }
  .ilist li:has(> .wrong-cause) > .itext { flex:1 1 calc(100% - 64px); }
  .ilist li > .wrong-cause { order:9;flex:none;width:auto;max-width:none; }
}