/* css/story-fix.css：10-29 返工（Ricky 视角评审甲组：内容与逻辑）新加的样式，颜色一律走令牌（vendor/tokens.css）。
   - 依据行分两行：方法名入口＋（提出者），下面一行小字书行「《书》 · 作者 著」；
   - 分析那一组第一行进行中逐个亮出的方法名（.fs-lit）；
   - 决策轮回复正文下的依据签（.fs-basis）；复盘卡「团团替你挡掉的」（.fs-guard）；
   - 交付物抽屉（.fs-dv，js/deliver.js）；
   - 演示层：开场「结果先行」浮卡（.fs-intro）、演示设置里的「关于这份演示」（.fs-about），这两块属于演示外壳，跟控制带同一套深色。 */

/* 依据：谁的方法、谁写的书分开 */
.fa-cite-who { font-size: var(--b-fs-12); color: var(--b-text-2); }
.fa-cite-by.fs-book { flex-basis: 100%; white-space: normal; line-height: 1.5; }
.fb-rc-basis .fa-cite-by.fs-book { display: block; }

/* 分析那一组第一行：亮出这一轮用上的方法 */
.fs-lit { margin-top: 3px; }
.fs-lit li { color: var(--b-text-1); }

/* 依据签：回复正文下面一行 */
.fs-basis { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin: -2px 0 0; font-size: var(--b-fs-13); line-height: 1.6; color: var(--b-text-2); }
.fs-basis-k { padding: 0 6px; border-radius: var(--b-radius-pill); font-size: var(--b-fs-12); line-height: 18px; color: var(--b-text-2); box-shadow: inset 0 0 0 1px var(--b-line-strong); }

/* 复盘卡：团团替你挡掉的 */
.fs-guard ul { display: grid; gap: 4px; margin: 2px 0 0; padding: 0; list-style: none; }
.fs-guard li { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 6px; }
.fs-guard .fs-was { color: var(--b-text-3); }
.fs-guard .fs-save { grid-column: 2; font-size: var(--b-fs-12); font-weight: 600; color: var(--b-text-1); }

/* 交付物抽屉 */
.fs-dv-wrap { position: fixed; inset: 0 0 var(--tt-band-h, 92px) 0; z-index: 70; background: rgb(0 0 0 / .18); }
.fs-dv { position: absolute; top: 72px; right: 24px; max-height: calc(100% - 88px); width: min(440px, calc(100vw - 48px)); display: grid; grid-template-rows: auto minmax(0, auto) auto auto; gap: 12px; padding: 16px 18px; border-radius: var(--b-radius-inner, 14px);
  background: var(--b-bg-card); color: var(--b-text-1); box-shadow: inset 0 0 0 1px var(--b-line), 0 20px 48px -16px var(--b-card-shadow-far); overflow: hidden; }
.fs-dv-head { display: flex; align-items: flex-start; gap: 10px; }
.fs-dv-head > div { display: grid; flex: 1; }
.fs-dv-head small { font-size: var(--b-fs-12); color: var(--b-text-3); }
.fs-dv-head b { font-size: var(--b-fs-15); }
.fs-dv-tag { padding: 1px 8px; border-radius: var(--b-radius-pill); font-size: var(--b-fs-12); color: var(--b-text-2); box-shadow: inset 0 0 0 1px var(--b-line-strong); white-space: nowrap; }
.fs-dv-x { width: 28px; height: 28px; border: 0; border-radius: 8px; background: none; font-size: 18px; line-height: 1; color: var(--b-text-2); cursor: pointer; }
.fs-dv-x:hover { background: var(--b-bg-inset); }
.fs-dv-paper { overflow: auto; padding: 14px 16px; border-radius: 12px; background: var(--b-bg-inset); font-size: var(--b-fs-13); line-height: 1.75; }
.fs-dv-paper p { margin: 0 0 8px; }
.fs-dv-which { font-size: var(--b-fs-12); color: var(--b-text-3); }
.fs-dv-title { margin: 0 0 8px; font-size: var(--b-fs-15); line-height: 1.5; }
.fs-dv-list { margin: 0; padding-left: 18px; }
.fs-dv-mk { padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--b-accent) 22%, transparent); color: inherit; }
.fs-dv-mk sup { margin-left: 1px; font-size: 10px; font-weight: 700; color: var(--b-text-2); }
.fs-dv-cover { position: relative; display: grid; align-content: center; gap: 8px; aspect-ratio: 3 / 4; max-height: 340px; margin: 0 auto; padding: 24px; border-radius: 10px; text-align: center;
  background: linear-gradient(160deg, color-mix(in srgb, var(--b-accent) 30%, var(--b-bg-card)), var(--b-bg-card)); box-shadow: inset 0 0 0 1px var(--b-line); }
.fs-dv-cover b { font-size: 26px; line-height: 1.3; }
.fs-dv-cover small { font-size: var(--b-fs-13); color: var(--b-text-2); }
.fs-dv-cover i { position: absolute; left: 0; right: 0; bottom: 8px; font-style: normal; font-size: 11px; color: var(--b-text-3); }
.fs-dv-rv { display: grid; gap: 6px; font-size: var(--b-fs-13); line-height: 1.6; }
.fs-dv-rv-h { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.fs-dv-rv ol { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.fs-dv-rv li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 6px; color: var(--b-text-2); }
.fs-dv-n { justify-self: start; padding: 0 6px; white-space: nowrap; border-radius: var(--b-radius-pill); font-size: var(--b-fs-12); line-height: 20px; color: var(--b-text-2); box-shadow: inset 0 0 0 1px var(--b-line-strong); }
.fs-dv-foot { margin: 0; font-size: var(--b-fs-12); color: var(--b-text-3); }

/* 演示层：开场「结果先行」（压在控制带上方，不属于产品界面） */
.fs-intro { position: fixed; left: 50%; bottom: calc(var(--tt-band-h, 92px) + 16px); z-index: 90; width: min(560px, calc(100vw - 40px)); translate: -50% 0; display: grid; gap: 10px; padding: 16px 18px 14px;
  border-radius: 16px; background: #2a2925; color: #f3efe6; font-size: 13px; box-shadow: 0 24px 60px -16px rgb(0 0 0 / .6), inset 0 0 0 1px rgb(255 255 255 / .1); }
.fs-intro-h { display: grid; gap: 2px; margin: 0; }
.fs-intro-h b { font-size: 16px; }
.fs-intro-h small { color: rgb(243 239 230 / .55); }
.fs-intro ol { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; counter-reset: k; }
.fs-intro li button { display: flex; align-items: baseline; gap: 6px; width: 100%; padding: 8px 10px; border: 0; border-radius: 10px; background: rgb(255 255 255 / .06); color: inherit; font: inherit; text-align: left; cursor: pointer; }
.fs-intro li button:hover { background: rgb(255 255 255 / .12); }
.fs-intro li span { font-weight: 600; }
.fs-intro li .fs-pit { font-weight: 400; color: rgb(243 239 230 / .65); }
.fs-intro li small { margin-left: auto; color: #FEBA0A; }
.fs-intro-f { display: flex; align-items: center; gap: 12px; }
.fs-intro-bar { flex: 1; height: 2px; border-radius: 1px; background: rgb(255 255 255 / .16); overflow: hidden; }
.fs-intro-bar::after { content: ''; display: block; height: 100%; background: #FEBA0A; transform-origin: 0 50%; animation: fs-intro-t 5s linear forwards; }
@keyframes fs-intro-t { from { transform: scaleX(1); } to { transform: scaleX(0); } }
.fs-intro-f button { padding: 4px 10px; border: 0; border-radius: 8px; background: rgb(255 255 255 / .1); color: inherit; font: inherit; cursor: pointer; }

/* 演示设置：关于这份演示 */
.fs-about { border-top: 1px solid rgb(255 255 255 / .12); padding-top: 8px; }
.fs-about summary { cursor: pointer; font-weight: 600; }
.fs-about-b { display: grid; gap: 6px; max-height: 300px; overflow: auto; margin-top: 6px; font-size: 12px; line-height: 1.55; color: rgb(243 239 230 / .8); }
.fs-about-b p, .fs-about-b ul { margin: 0; }
.fs-about-b ul { padding-left: 16px; display: grid; gap: 2px; }
.fs-about-h { font-weight: 600; color: rgb(243 239 230 / .5); }
