/* 达特茅斯提案可视化（仅 E04 第2课使用）· 全部前缀 .dal- */
.dal-wrap{display:flex;flex-direction:column;gap:14px;}

/* ---- 1. 复古提案信 ---- */
.dal-letter{position:relative;border:1px solid #e8dcbd;border-radius:16px;padding:18px 20px 16px;
  background:linear-gradient(180deg,#fffdf6 0%,#fdf7e8 100%);
  box-shadow:0 4px 16px -10px rgba(140,110,40,.45), inset 0 0 0 4px #fff;}
.dal-stamp{position:absolute;top:12px;right:14px;transform:rotate(7deg);text-align:center;
  border:2px dashed #d8b978;border-radius:9px;padding:5px 9px;color:#b58e3f;font-size:10px;
  font-weight:800;background:rgba(255,255,255,.7);letter-spacing:.5px;}
.dal-stamp b{display:block;font-size:13px;}
.dal-lhead{font-family:var(--font-serif);font-size:15px;font-weight:900;color:#8a6a22;line-height:1.55;
  padding-right:96px;}
.dal-lzk{margin-top:10px;font-size:14px;line-height:1.9;color:#4a4232;background:#fff8e5;
  border-left:4px solid #e0b95f;border-radius:0 10px 10px 0;padding:10px 13px;}
.dal-lzk b{color:#a8791c;}
.dal-lzk+.dal-lzk{margin-top:8px;}
.dal-from{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px;}
.dal-person{display:grid;grid-template-columns:26px 1fr;gap:0 8px;align-items:center;
  background:#fff;border:1px solid #eee0c2;border-radius:12px;padding:8px 10px;}
.dal-person i{grid-row:span 2;width:26px;height:26px;border-radius:50%;background:#f0e3c3;color:#8a6a22;
  font-size:9.5px;font-weight:800;font-style:normal;display:flex;align-items:center;justify-content:center;}
.dal-person b{font-size:12.5px;color:#3a3222;line-height:1.35;}
.dal-person em{font-size:10.5px;color:#948b78;font-style:normal;line-height:1.4;}
.dal-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.dal-fact{display:flex;align-items:baseline;gap:4px;background:#fff;border:1px solid #e6d9b8;
  border-radius:10px;padding:5px 11px;}
.dal-fact b{font-family:var(--font-serif);font-size:16px;color:#b58e3f;}
.dal-fact em{font-size:11px;color:#8a8577;font-style:normal;}

/* ---- 2. 核心猜想 ---- */
.dal-quote{background:#f7f9ff;border:1px dashed #c9d6f2;border-radius:16px;padding:14px 16px;}
.dal-qtag{font-size:12.5px;font-weight:800;color:#4F6DF5;}
.dal-qzh{font-family:var(--font-serif);font-size:15px;line-height:2;color:#2d2d2d;margin-top:8px;}
.dal-qzh b{color:#2f57d9;background:linear-gradient(180deg,transparent 62%,#dfe6ff 62%);}
.dal-qen{margin-top:10px;}
.dal-qen>summary{cursor:pointer;font-size:12px;font-weight:800;color:#5a6b96;list-style:none;
  display:inline-flex;align-items:center;gap:5px;background:#eef2ff;border-radius:20px;padding:5px 13px;}
.dal-qen>summary::-webkit-details-marker{display:none;}
.dal-qen>summary::after{content:"\25BE";}
.dal-qen[open]>summary::after{content:"\25B4";}
.dal-qen p{font-family:Georgia,'Times New Roman',serif;font-size:12.5px;line-height:1.9;color:#41547e;
  background:#fff;border-radius:10px;padding:10px 12px;margin-top:8px;}
.dal-qen p b{color:#2f57d9;}
.dal-qen .dal-qsrc{font-family:inherit;font-size:11px;color:#93a0bd;background:none;padding:6px 2px 0;}
.dal-qnote{font-size:12.5px;color:#5a6b96;margin-top:8px;line-height:1.85;}
.dal-qnote b{color:#2d2d2d;}

/* ---- 3. 七个课题 ---- */
.dal-sec-t{font-family:var(--font-serif);font-size:15px;font-weight:900;color:#2d2d2d;}
.dal-sec-s{font-size:12.5px;color:#8a8577;margin-top:3px;}
.dal-topics{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:10px;margin-top:10px;}
.dal-topic{background:#fff;border:1px solid #ececec;border-left:5px solid var(--c,#4F6DF5);
  border-radius:12px;overflow:hidden;}
.dal-topic[open]{background:#fcfcff;box-shadow:0 8px 20px -14px rgba(0,0,0,.3);}
.dal-topic>summary{display:grid;grid-template-columns:26px 1fr auto;gap:2px 10px;align-items:center;
  padding:10px 12px;cursor:pointer;list-style:none;}
.dal-topic>summary::-webkit-details-marker{display:none;}
.dal-topic>summary:hover{background:#fafbff;}
.dal-num{grid-row:span 2;width:26px;height:26px;border-radius:50%;background:var(--c,#4F6DF5);color:#fff;
  font-size:13px;font-weight:900;display:flex;align-items:center;justify-content:center;}
.dal-tname{font-size:14px;font-weight:800;color:#2d2d2d;}
.dal-ten{font-size:10.5px;color:#9c9c9c;font-weight:400;margin-left:6px;font-family:Georgia,serif;}
.dal-tone{grid-column:2;font-size:12px;color:#6b6b6b;line-height:1.6;}
.dal-more{grid-row:span 2;font-size:11px;font-weight:800;color:var(--c,#4F6DF5);white-space:nowrap;}
.dal-more::after{content:"\5C55\5F00 \203A";}
.dal-topic[open] .dal-more::after{content:"\6536\8D77 \2303";}
.dal-tbody{border-top:1px dashed #ececec;padding:10px 14px 12px 48px;}
.dal-en{font-family:Georgia,'Times New Roman',serif;font-size:12.5px;line-height:1.8;color:#5a6b96;
  background:#f6f8fd;border-radius:10px;padding:9px 11px;}
.dal-zh{font-size:13px;line-height:1.95;color:#3a3a3a;margin-top:8px;}
.dal-zh b{color:#2d2d2d;}
.dal-later{font-size:12.5px;line-height:1.8;color:#1f7a52;background:#eefaf3;border-radius:10px;
  padding:8px 11px;margin-top:8px;}
.dal-later b{color:#12603c;}

/* ---- 4. 结尾说明 ---- */
.dal-note{margin-top:12px;font-size:12.5px;line-height:1.9;color:#5a6b96;background:#f8f8f8;
  border:1px solid #efefef;border-radius:12px;padding:10px 14px;}
.dal-note b{color:#2d2d2d;}

@media (max-width:760px){
  .dal-from{grid-template-columns:repeat(2,minmax(0,1fr));}
  .dal-topics{grid-template-columns:1fr;}
  .dal-tbody{padding-left:14px;}
  .dal-lhead{padding-right:0;}
  .dal-lhead+.dal-stamp{top:auto;bottom:12px;}
}

/* ---- 5. 老照片放映机（胶片动画） ---- */
.dal-film{display:flex;flex-direction:column;gap:10px;background:#14141a;border-radius:16px;padding:14px 16px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), 0 10px 26px -18px rgba(0,0,0,.75);}
.dal-proj{display:flex;gap:14px;align-items:stretch;}
.dal-gate{position:relative;flex:0 0 auto;width:196px;height:252px;border-radius:8px;overflow:hidden;background:#000;
  box-shadow:0 0 0 3px #2b2b37, 0 0 0 6px #0d0d12;}
.dal-gate img{width:100%;height:100%;object-fit:cover;display:block;
  filter:sepia(.18) contrast(1.06) brightness(.96) saturate(.9);}
.dal-gate img.dal-in{animation:dal-fade .55s ease-out;}
@keyframes dal-fade{
  from{opacity:.12;filter:sepia(.5) contrast(1.35) brightness(1.2) blur(1.2px);}
  to{opacity:1;}
}
.dal-grain{position:absolute;inset:0;pointer-events:none;mix-blend-mode:overlay;opacity:.12;
  background-image:radial-gradient(rgba(255,255,255,.45) .5px, transparent .6px),
                   radial-gradient(rgba(0,0,0,.45) .5px, transparent .6px);
  background-size:5px 5px, 7px 7px; background-position:0 0, 2px 3px;
  animation:dal-flick .3s steps(2,end) infinite;}
.dal-gate.doc{background:#f7f5ef;}
.dal-gate.doc img{object-fit:contain;filter:sepia(.08) contrast(1.02) brightness(.99) saturate(.85);}
.dal-gate.doc .dal-grain{opacity:.08;}
.dal-frame.doc img{object-fit:contain;background:#f6f4ee;filter:grayscale(.1) contrast(1.02) brightness(.94);}
.dal-scr{position:absolute;inset:0;pointer-events:none;opacity:.3;
  background:linear-gradient(90deg, transparent 21%, rgba(255,255,255,.32) 21.4%, transparent 22%,
                                    transparent 70%, rgba(255,255,255,.22) 70.4%, transparent 71%);
  animation:dal-scr 3.8s linear infinite;}
@keyframes dal-flick{0%,100%{opacity:.09} 50%{opacity:.17}}
@keyframes dal-scr{from{transform:translateX(-7%)} to{transform:translateX(7%)}}
.dal-plaque{flex:1 1 auto;min-width:0;background:#1c1c24;border-radius:12px;padding:14px 16px;
  display:flex;flex-direction:column;justify-content:center;gap:7px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);}
.dal-pname{font-family:var(--font-serif);font-size:18px;font-weight:900;color:#ffd88a;line-height:1.4;}
.dal-prole{font-size:12px;color:#9aa3b8;}
.dal-pdesc{font-size:13px;line-height:1.95;color:#e8ebf4;}
.dal-strip{display:flex;gap:8px;padding:11px 10px;border-radius:10px;background:#0d0d12;
  background-image:repeating-linear-gradient(90deg, rgba(255,255,255,.13) 0 6px, transparent 6px 18px),
                   repeating-linear-gradient(90deg, rgba(255,255,255,.13) 0 6px, transparent 6px 18px);
  background-size:100% 6px, 100% 6px;
  background-position:0 2px, 0 calc(100% - 2px);
  background-repeat:repeat-x, repeat-x;}
.dal-frame{flex:1 1 0;min-width:0;aspect-ratio:4/5;position:relative;padding:0;cursor:pointer;overflow:hidden;
  border:2px solid rgba(255,255,255,.14);border-radius:6px;background:#000;}
.dal-frame img{width:100%;height:100%;object-fit:cover;display:block;
  filter:grayscale(.2) contrast(1.05) brightness(.78);transition:.2s;}
.dal-frame:hover img{filter:none;transform:scale(1.05);}
.dal-frame.on{border-color:#ffcc66;box-shadow:0 0 0 2px rgba(255,204,102,.35);}
.dal-frame.on img{filter:sepia(.12) contrast(1.05) brightness(1);}
.dal-fnum{position:absolute;left:3px;top:3px;font-size:10px;font-weight:800;color:#12121a;
  background:rgba(255,204,102,.92);border-radius:4px;padding:0 4px;}
.dal-ctrl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.dal-btn{border:none;border-radius:20px;padding:6px 14px;font-size:12.5px;font-weight:800;cursor:pointer;
  background:#262633;color:#e9ecf5;font-family:inherit;transition:.15s;}
.dal-btn:hover{background:#34344a;}
.dal-btn.on{background:linear-gradient(135deg,#ffcc66,#f0a93c);color:#3a2a05;}
.dal-count{font-size:12px;color:#9aa3b8;font-weight:700;}
.dal-src{font-size:11px;color:#7b849a;margin-left:auto;line-height:1.6;}

@media (max-width:760px){
  .dal-proj{flex-direction:column;}
  .dal-gate{width:100%;height:236px;}
  .dal-src{margin-left:0;}
}
@media (prefers-reduced-motion:reduce){
  .dal-grain,.dal-scr{animation:none;}
  .dal-gate img.dal-in{animation:none;}
}

/* ---- 6. 故事页「1955」卡里的四位科学家头像 ---- */
.dal-people{display:flex;flex-wrap:wrap;gap:16px 26px;margin-top:16px;padding-top:14px;
  border-top:1px dashed #e6e6e6;}
.dal-pa{display:flex;align-items:center;gap:10px;}
.dal-pa img{width:64px;height:64px;border-radius:50%;object-fit:cover;background:#f2f2f2;
  border:3px solid #fff;filter:grayscale(.12) contrast(1.03);
  box-shadow:0 0 0 1px rgba(0,0,0,.1), 0 3px 9px rgba(0,0,0,.14);}
.dal-pa em{font-size:13.5px;font-style:normal;font-weight:700;color:#3f3f3f;white-space:nowrap;}
.dal-people-cap{margin-top:9px;font-size:11.5px;color:#9a9a9a;line-height:1.6;}

/* ---- 6b. 左栅组合（提案图 + 四位提出者）：整组跟着左栅走，卡片仍是「左图右文」 ---- */
.st-left .dal-people{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;
  margin:10px 0 0;padding-top:10px;border-top:1px dashed rgba(0,0,0,.10);}
.st-left .dal-pa{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;min-width:0;}
.st-left .dal-pa img{width:100%;height:auto;aspect-ratio:1/1;border-radius:50%;
  border:2px solid rgba(34,160,107,.45);
  box-shadow:0 0 0 1px rgba(10,19,48,.10),0 4px 12px -8px rgba(10,19,48,.7);}
.st-left .dal-pa em{font-size:10px;line-height:1.3;white-space:normal;}
.st-left .dal-people-cap{margin-top:7px;font-size:10.5px;line-height:1.5;}

/* ---- 6c. 故事页配图统一「科技感」：深色相框 + 薄荷绿描边（与本课自制示意图同一套视觉） ----
   注：story-photos.css 也调 .st-fig，所以这里放在后面并抬高一级选择器 ---- */
.st-card .st-fig img{background:#0A1330;border-color:rgba(95,227,161,.34);
  box-shadow:0 0 0 1px rgba(10,19,48,.08),0 12px 26px -18px rgba(10,19,48,.8);}
/* 提案标题是一张 620×170 的宽条：按原比例显示，别在 197px 高的框里留大片空 */
.st-card .st-fig.wide img{height:auto;aspect-ratio:620/170;}
@media (max-width:520px){
  .dal-pa img{width:52px;height:52px;}
  .dal-pa em{font-size:12px;}
}

/* ---- 7. 故事页合并后的「1956 夏」卡（两段正文 + 校园照） ---- */
.st-card p + p{margin-top:10px !important;}
.st-card .story-fig{margin:13px 0 7px;}
.st-card .story-fig.scene img{max-width:100%;max-height:240px;object-fit:cover;}
.st-card .story-fig.scene figcaption{font-size:12.5px;margin-top:7px;}
.st-card .fig-credit{margin:0;font-size:11px;}

/* ---- 8. 「1956 夏」卡里的参会者 / 合影（一行 4 张） ---- */
.dal-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:15px 0 0;}
.dal-gallery figure{margin:0;min-width:0;}
.dal-gallery img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center 24%;
  border-radius:13px;background:#f4f4f4;filter:grayscale(.06) contrast(1.02);
  box-shadow:0 1px 0 rgba(0,0,0,.05), 0 6px 18px -10px rgba(0,0,0,.45);}
.dal-gallery figure:last-child img{object-position:center center;}
.dal-gallery figcaption{margin-top:7px;font-size:11.5px;line-height:1.5;color:#6f6a5f;text-align:center;}
.dal-gallery figcaption em{display:block;margin-top:2px;font-style:normal;font-size:10.5px;line-height:1.45;color:#9a9488;}
.dal-gal-cap{margin:13px 0 6px;font-size:12.5px;line-height:1.85;color:#4c5f92;text-align:center;}
@media (max-width:520px){
  .dal-gallery{gap:9px;}
  .dal-gallery figcaption{font-size:11px;}
  .dal-gallery figcaption em{font-size:10px;}
}
