/* 《人类复古博物馆:2026 展区》
   外层:未来博物馆冷色 UI;内层:2026 复古设备暖光 */

:root {
  --bg: #060a12;
  --bg2: #0a1120;
  --panel: #0b1424;
  --panel2: #0e1a30;
  --line: #1d2c45;
  --line-hi: #2e4568;
  --ink: #dce8f2;
  --dim: #7e93ac;
  --cyan: #7de8ff;
  --warm: #ffd98a;
  --warm2: #ffb64d;
  --green: #7dd87d;
  --screen-green: #9ef0a0;
  --red: #ff5252;
  --paper: #f5ecc9;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body { height: 100%; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: -apple-system, "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  font-size: 15px;
  line-height: 1.7;
  overflow-x: hidden;
}

/* CRT 扫描线 + 暗角 */
body::after {
  content: '';
  position: fixed; inset: 0;
  pointer-events: none; z-index: 999;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.14) 0 1px, transparent 1px 3px),
    radial-gradient(ellipse at center, transparent 55%, rgba(0,0,0,.5) 100%);
}

#app { min-height: 100vh; display: flex; flex-direction: column; }

button { font: inherit; color: inherit; cursor: pointer; }

.dim { color: var(--dim); }
.hl { color: var(--warm); }
.ok-text { color: var(--green); font-style: normal; }

.corrupt {
  color: var(--red);
  font-family: var(--mono);
  animation: corrupt-flicker 1.6s steps(2) infinite;
}
@keyframes corrupt-flicker { 0%, 92% { opacity: 1; } 96% { opacity: .35; } 100% { opacity: 1; } }

/* ---------- 通用按钮 ---------- */

.btn {
  background: var(--panel2);
  border: 2px solid var(--line-hi);
  color: var(--ink);
  padding: 8px 18px;
  letter-spacing: .08em;
  box-shadow: 0 2px 0 #000;
  transition: transform .05s;
  image-rendering: pixelated;
}
.btn:hover:not(:disabled) { border-color: var(--cyan); color: var(--cyan); }
.btn:active:not(:disabled) { transform: translateY(2px); box-shadow: none; }
.btn:disabled { opacity: .4; cursor: not-allowed; }
.btn.primary { border-color: var(--warm); color: var(--warm); }
.btn.primary:hover:not(:disabled) { background: rgba(255, 217, 138, .08); border-color: var(--warm2); color: var(--warm2); }
.btn.danger { border-color: var(--red); color: var(--red); }
.btn.small { padding: 4px 12px; font-size: 13px; }
.btn.ghost { background: transparent; box-shadow: none; border-width: 1px; }

/* ---------- 开场 ---------- */

.intro {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 32px 16px;
  background: radial-gradient(ellipse at 50% -10%, #12203a 0%, var(--bg) 62%);
}
.intro-frame {
  max-width: 640px; width: 100%;
  border: 2px solid var(--line-hi);
  outline: 1px solid #000;
  background: var(--panel);
  padding: 36px 40px;
  box-shadow: 0 0 60px rgba(125, 232, 255, .05), inset 0 0 40px rgba(0,0,0,.4);
}
.intro-sys {
  font-family: var(--mono); font-size: 12px; color: var(--cyan);
  letter-spacing: .18em; border-bottom: 1px dashed var(--line); padding-bottom: 10px;
}
.intro-boot { margin-top: 18px; font-family: var(--mono); color: var(--dim); font-size: 13px; }
.intro-hr { border-top: 1px dashed var(--line); margin: 18px 0; }
.intro-welcome p { font-size: 17px; letter-spacing: .05em; }
.intro-welcome p:first-child { color: var(--warm); }
.intro-notice { margin-top: 16px; font-size: 13px; color: var(--dim); }
.intro-notice p:nth-child(2) { color: var(--red); }
.intro-btns { margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; }
.intro-motto {
  margin-top: 28px; font-size: 12px; color: var(--dim);
  border-left: 3px solid var(--warm); padding-left: 10px; opacity: .8;
}

/* ---------- 顶栏 ---------- */

.topbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 20px;
  border-bottom: 2px solid var(--line);
  background: linear-gradient(180deg, #0d1830, var(--panel));
}
.tb-zone {
  font-family: var(--mono); font-size: 11px; color: var(--cyan);
  border: 1px solid var(--line-hi); padding: 2px 8px; margin-right: 12px; letter-spacing: .15em;
}
.tb-name { letter-spacing: .12em; font-weight: 700; }
.tb-right { display: flex; align-items: center; gap: 16px; }
.tb-timer { font-family: var(--mono); font-size: 13px; color: var(--warm); letter-spacing: .1em; }

/* ---------- 布局 ---------- */

.layout { flex: 1; display: flex; gap: 0; min-height: 0; }
.stage { flex: 1; padding: 24px 28px 90px; overflow-y: auto; }
.sidebar {
  width: 300px; flex-shrink: 0;
  border-left: 2px solid var(--line);
  background: var(--bg2);
  padding: 18px 16px 90px;
  overflow-y: auto;
}

/* ---------- 侧栏 ---------- */

.side-box { border: 1px solid var(--line); background: var(--panel); padding: 14px; margin-bottom: 16px; }
.side-head {
  font-size: 12px; letter-spacing: .2em; color: var(--cyan);
  border-bottom: 1px dashed var(--line); padding-bottom: 8px; margin-bottom: 10px;
}
.obj-text { color: var(--warm); font-size: 14px; }
.obj-prog { margin-top: 8px; font-family: var(--mono); font-size: 11px; color: var(--dim); }
.task-btn {
  display: block; width: 100%; margin-top: 10px;
  background: rgba(255, 217, 138, .06);
  border: 1px solid var(--warm); color: var(--warm);
  padding: 8px 10px; text-align: left; letter-spacing: .1em;
  animation: task-pulse 2.4s ease-in-out infinite;
}
@keyframes task-pulse { 50% { box-shadow: 0 0 12px rgba(255, 217, 138, .25); } }
.clue-list { list-style: none; }
.clue-list li {
  font-size: 13px; padding: 8px 0; border-bottom: 1px dashed var(--line);
  display: flex; flex-direction: column; gap: 2px;
}
.clue-tag {
  align-self: flex-start; font-size: 12px; font-family: var(--mono);
  padding: 0 6px; border: 1px solid; letter-spacing: .1em; margin-bottom: 2px;
}
.t-身份 { color: var(--cyan); border-color: var(--cyan); }
.t-时间线 { color: var(--warm); border-color: var(--warm); }
.t-关键词 { color: var(--green); border-color: var(--green); }
.clue-src { font-size: 11px; color: var(--dim); font-family: var(--mono); }
.clue-empty { font-size: 13px; }

/* ---------- 展厅 ---------- */

.hall-head h2 { letter-spacing: .15em; font-size: 20px; }
.hall-sub { color: var(--dim); font-size: 13px; margin-top: 4px; }
.hall-adj { color: var(--dim); font-family: var(--mono); font-size: 12px; margin-top: 6px; opacity: .85; }
.linklike {
  background: none; border: none; padding: 0; font: inherit;
  color: var(--warm); text-decoration: underline dotted; letter-spacing: inherit;
  animation: task-pulse 2.4s ease-in-out infinite;
}
.linklike:hover { color: var(--warm2); }
.cab-grid {
  margin-top: 22px;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 18px;
}
.cab-card {
  position: relative;
  background: linear-gradient(180deg, var(--panel2) 0%, var(--panel) 100%);
  border: 2px solid var(--line-hi);
  outline: 1px solid #000;
  padding: 26px 14px 34px;
  text-align: center;
  transition: border-color .15s, transform .1s;
  overflow: hidden;
}
.cab-card:hover { border-color: var(--cyan); transform: translateY(-2px); }
.cab-light {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 80%; height: 70px;
  background: radial-gradient(ellipse at top, rgba(255, 217, 138, .22), transparent 70%);
  pointer-events: none;
}
.cab-glass {
  position: absolute; inset: 6px; pointer-events: none;
  background: linear-gradient(115deg, transparent 42%, rgba(220, 232, 242, .05) 45%, transparent 50%);
  border: 1px solid rgba(125, 232, 255, .08);
}
.cab-icon { filter: drop-shadow(0 6px 10px rgba(255, 217, 138, .18)); }
.cab-num { margin-top: 10px; font-family: var(--mono); font-size: 11px; color: var(--cyan); letter-spacing: .2em; }
.cab-name { font-weight: 700; letter-spacing: .1em; margin-top: 2px; }
.cab-sub { font-size: 12px; color: var(--dim); margin-top: 2px; }
.cab-done {
  position: absolute; top: 10px; right: -26px;
  background: var(--green); color: #06240a;
  font-size: 11px; padding: 1px 28px; transform: rotate(38deg); letter-spacing: .1em;
}
.cab-base {
  position: absolute; bottom: 0; left: 0; right: 0; height: 14px;
  background: repeating-linear-gradient(90deg, #16233b 0 8px, #101b2e 8px 16px);
  border-top: 2px solid var(--line-hi);
}
.cab-card.locked { opacity: .68; }
.cab-card.locked .cab-icon { filter: grayscale(.9) brightness(.6); }
.cab-card.locked .cab-sub { color: var(--red); }

/* ---------- 展柜内部 ---------- */

.cab-view h2, .ex-title { letter-spacing: .12em; font-size: 18px; }
.cab-head { display: flex; gap: 14px; align-items: flex-start; margin: 18px 0 6px; }
.cab-desc { color: var(--dim); font-size: 13px; margin-top: 4px; max-width: 560px; }
.ex-grid { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.ex-card {
  display: flex; align-items: center; gap: 12px;
  background: var(--panel); border: 1px solid var(--line-hi);
  padding: 14px; text-align: left;
  transition: border-color .15s;
}
.ex-card:hover { border-color: var(--warm); }
.ex-name { flex: 1; letter-spacing: .06em; }
.ex-state { font-size: 11px; font-family: var(--mono); color: var(--dim); border: 1px solid var(--line); padding: 1px 6px; }
.ex-state.ok { color: var(--green); border-color: var(--green); }

/* ---------- 展品详情 ---------- */

.ex-view { max-width: 720px; }
.ex-title { margin-top: 16px; }
.sys-note { color: var(--red); font-size: 13px; font-family: var(--mono); margin-top: 6px; opacity: .9; }

.artifact {
  margin-top: 16px;
  border: 2px solid var(--line-hi); outline: 1px solid #000;
  background: #08101f;
  padding: 20px;
  box-shadow: inset 0 0 50px rgba(0,0,0,.55), 0 0 30px rgba(255, 217, 138, .04);
}

/* 老屏幕类容器 */
.art-list, .art-order, .art-code, .chat-thread {
  font-size: 14px;
}
.list-head {
  font-family: var(--mono); font-size: 12px; letter-spacing: .12em;
  color: var(--cyan); border-bottom: 1px dashed var(--line);
  padding-bottom: 6px; margin: 14px 0 8px;
}
.art-list .list-head:first-child, .art-code .list-head:first-child { margin-top: 0; }
.art-list ul, .task-ul { list-style: none; }
.art-list li, .task-ul li {
  padding: 7px 4px; border-bottom: 1px solid rgba(29, 44, 69, .5);
  display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline;
}
.art-list li time {
  font-family: var(--mono); font-size: 12px; color: var(--dim); min-width: 86px;
}
.search-list li { color: var(--screen-green); font-family: var(--mono); font-size: 13px; }
.search-list li.hl { color: var(--warm); }
.search-list li.dim { color: var(--dim); }
.tag-warn, .tag-err {
  font-size: 12px; font-family: var(--mono); padding: 0 6px; border: 1px solid;
}
.tag-warn { color: var(--warm); border-color: var(--warm); }
.tag-err { color: var(--red); border-color: var(--red); }
.badge {
  background: var(--red); color: #fff; font-size: 11px; font-family: var(--mono);
  padding: 0 7px; border-radius: 8px;
}
.chatlist li.pin { background: rgba(125, 232, 255, .04); }
.cal-list em { color: var(--warm); font-style: normal; }
.cal-list s { color: var(--dim); }

/* 手机 */
.art-phone { display: flex; gap: 24px; flex-wrap: wrap; align-items: flex-start; }
.phone-shell {
  width: 168px; padding: 12px 10px 20px;
  background: #1a2438; border: 2px solid var(--line-hi); border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0,0,0,.6);
}
.phone-screen {
  background: linear-gradient(200deg, #10263c, #0a1a2c);
  min-height: 240px; padding: 10px; position: relative;
  border: 1px solid #000;
}
.phone-screen::before {
  content: ''; position: absolute; top: 8px; right: 8px;
  width: 26px; height: 2px; background: var(--red); transform: rotate(-40deg);
  box-shadow: -6px 8px 0 -1px var(--red);
  opacity: .55;
}
.phone-status { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 10px; color: var(--dim); }
.phone-wall { text-align: center; font-size: 34px; margin: 12px 0 6px; opacity: .5; }
.app-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.app-cell { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.app-dot { width: 22px; height: 22px; border: 1px solid #000; image-rendering: pixelated; }
.app-cell label { font-size: 10px; color: var(--dim); }
.spec-list { list-style: none; flex: 1; min-width: 220px; }
.spec-list li { padding: 6px 0; border-bottom: 1px solid rgba(29,44,69,.5); font-size: 13px; }
.spec-dim { color: var(--warm); }

/* 外卖订单 */
.art-order { max-width: 380px; background: #101c30; border: 1px solid var(--line); padding: 16px; }
.order-shop { font-weight: 700; letter-spacing: .08em; border-bottom: 1px dashed var(--line); padding-bottom: 8px; }
.order-line { display: flex; justify-content: space-between; padding: 6px 0; }
.order-line.total { border-top: 1px dashed var(--line); color: var(--warm); font-weight: 700; }
.order-meta { margin-top: 10px; font-size: 13px; color: var(--dim); }
.order-meta p { padding: 2px 0; }
.order-meta b { color: var(--ink); font-family: var(--mono); font-weight: 400; }

/* 聊天 */
.chat-thread { display: flex; flex-direction: column; gap: 8px; max-width: 480px; }
.chat-day, .chat-sys { text-align: center; font-size: 11px; color: var(--dim); font-family: var(--mono); margin: 4px 0; }
.msg { max-width: 82%; padding: 8px 12px; position: relative; font-size: 14px; border: 1px solid; }
.msg p { display: inline; }
.msg time { display: block; font-size: 10px; font-family: var(--mono); opacity: .6; margin-top: 2px; }
.msg .who { display: block; font-size: 11px; color: var(--dim); margin-bottom: 2px; }
.msg.them, .msg.ai { align-self: flex-start; background: #14233c; border-color: var(--line-hi); }
.msg.me { align-self: flex-end; background: #1d3324; border-color: #2e5c3a; color: #cfe8cf; }
.msg.ai { background: #101c30; border-color: var(--cyan); box-shadow: 0 0 10px rgba(125, 232, 255, .06); }
.draft-box { border: 1px dashed var(--warm); padding: 10px 12px; margin-top: 8px; background: rgba(255,217,138,.04); }
.draft-tag { font-size: 11px; font-family: var(--mono); color: var(--warm); margin-bottom: 4px; }
.cursor { animation: blink 1s steps(1) infinite; color: var(--warm); }
@keyframes blink { 50% { opacity: 0; } }

/* 代码 */
.commit-log {
  font-family: var(--mono); font-size: 12.5px; color: var(--screen-green);
  background: #0a1608; border: 1px solid #1d3a1d; padding: 12px; overflow-x: auto;
  line-height: 1.9; text-shadow: 0 0 6px rgba(158, 240, 160, .25);
}

/* 备忘录 */
.memo-paper {
  max-width: 420px; background: #efe6c4; color: #4a4132;
  padding: 18px 22px; border: 1px solid #b8ad86;
  box-shadow: 4px 4px 0 rgba(0,0,0,.4);
  font-size: 14.5px;
}
.memo-paper ul { list-style: none; }
.memo-paper li { padding: 7px 0; border-bottom: 1px dashed #c9bd94; }

/* 信件 */
.folder-art { max-width: 480px; }
.folder-meta { font-family: var(--mono); font-size: 12px; color: var(--dim); margin-bottom: 14px; }
.letter {
  background: #0d1626; border: 1px solid var(--warm);
  padding: 26px 28px; text-align: center;
  box-shadow: 0 0 40px rgba(255, 217, 138, .12), inset 0 0 30px rgba(0,0,0,.4);
  animation: letter-in .9s ease-out;
}
.letter p { font-size: 17px; letter-spacing: .08em; color: var(--warm); line-height: 2.2; }
@keyframes letter-in { from { opacity: 0; transform: translateY(8px); } }

/* AI 碎片 */
.frag { border: 1px solid var(--line); padding: 14px; margin-top: 12px; background: #0a1322; }
.frag-head { font-family: var(--mono); font-size: 12px; color: var(--cyan); margin-bottom: 10px; letter-spacing: .1em; }
.frag-sort { font-size: 12px; font-family: var(--mono); }
.frag.damaged { border-color: var(--red); }
.corrupt-block {
  font-family: var(--mono); color: var(--red); opacity: .6; letter-spacing: 2px;
  margin-bottom: 12px; word-break: break-all;
  animation: corrupt-flicker 2s steps(3) infinite;
}
.ai-thread { max-width: 100%; }

/* ---------- 标签复核 ---------- */

.review-panel { margin-top: 20px; border: 1px solid var(--line); background: var(--panel); padding: 16px; }
.review-head { font-size: 12px; letter-spacing: .2em; color: var(--cyan); margin-bottom: 12px; }
.label-card { border: 1px solid; padding: 12px 14px; margin-bottom: 10px; }
.label-card.sys { border-color: var(--red); background: rgba(255, 82, 82, .05); }
.label-card.sys p { color: #f0b9b9; }
.label-card.human { border-color: var(--warm); background: rgba(255, 217, 138, .06); }
.label-card.human p { color: var(--warm); }
.label-card.dimmed { opacity: .45; }
.label-card.dimmed p { text-decoration: line-through; text-decoration-color: rgba(255,82,82,.5); }
.label-tag { font-size: 11px; font-family: var(--mono); letter-spacing: .12em; opacity: .8; margin-bottom: 4px; }
.review-btns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }

/* ---------- 弹窗 ---------- */

.modal-mask {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(4, 7, 14, .8);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.modal {
  background: var(--panel); border: 2px solid var(--cyan); outline: 1px solid #000;
  max-width: 480px; width: 100%; padding: 22px 24px;
  box-shadow: 0 0 60px rgba(125, 232, 255, .15);
  animation: modal-in .18s ease-out;
}
.modal.wide { max-width: 620px; }
@keyframes modal-in { from { transform: translateY(10px); opacity: 0; } }
.modal-head { letter-spacing: .18em; color: var(--cyan); font-size: 14px; border-bottom: 1px dashed var(--line); padding-bottom: 8px; }
.modal-prompt { margin-top: 12px; font-size: 14px; }
.modal-foot { margin-top: 16px; display: flex; gap: 10px; justify-content: flex-end; }
.opt-col { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.btn.opt { text-align: left; }

.flash { margin-top: 12px; font-size: 13px; font-family: var(--mono); padding: 8px 10px; border: 1px solid; }
.flash.err { color: var(--red); border-color: var(--red); background: rgba(255,82,82,.06); animation: shake .3s; }
.flash.ok { color: var(--green); border-color: var(--green); }
@keyframes shake { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

/* 时间线 */
.tl-slots { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.tl-slot {
  border: 1px dashed var(--line-hi); padding: 7px 12px; font-size: 13px; color: var(--dim);
  font-family: var(--mono);
}
.tl-slot.filled { border-style: solid; border-color: var(--warm); color: var(--warm); font-family: inherit; }
.tl-cards { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.tl-card { text-align: left; font-size: 13px; padding: 7px 12px; }

/* 关键词 */
.kw-row { display: flex; gap: 10px; margin-top: 14px; }
.kw-input {
  flex: 1; background: #08101f; border: 2px solid var(--line-hi); color: var(--warm);
  padding: 8px 12px; font: inherit; letter-spacing: .15em; font-family: var(--mono);
}
.kw-input:focus { outline: none; border-color: var(--warm); }
.kw-hint { margin-top: 10px; font-size: 13px; color: var(--cyan); }

/* ---------- 系统日志栏 ---------- */

.syslog-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 50;
  background: #050910; border-top: 2px solid var(--line);
  padding: 9px 20px; font-family: var(--mono); font-size: 12.5px; color: var(--screen-green);
  display: flex; align-items: center; gap: 10px;
  min-height: 38px;
  text-shadow: 0 0 8px rgba(158, 240, 160, .3);
}
.syslog-led {
  width: 8px; height: 8px; background: var(--green); flex-shrink: 0;
  animation: blink 2s steps(1) infinite;
}

/* ---------- 结局 ---------- */

.ending {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 40px 16px;
  background: radial-gradient(ellipse at 50% 0%, #101d36 0%, var(--bg) 60%);
  position: relative;
}
.ending-frame { max-width: 660px; width: 100%; }
.ending-title { letter-spacing: .18em; margin-top: 14px; }
.ending-prompt { color: var(--dim); margin-top: 10px; }
.plaque-col { display: flex; flex-direction: column; gap: 14px; margin: 24px 0; }
.plaque {
  position: relative; text-align: left;
  background: linear-gradient(180deg, #18263f, #101b2e);
  border: 2px solid var(--line-hi); outline: 1px solid #000;
  padding: 18px 20px 18px 34px; font-size: 15px; letter-spacing: .04em;
  transition: border-color .15s, transform .1s;
}
.plaque:hover { border-color: var(--warm); transform: translateX(4px); }
.plaque-pin {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  width: 8px; height: 8px; background: var(--cyan);
}
.plaque.engraved {
  border-color: var(--warm); color: var(--warm);
  text-align: center; padding: 22px; font-size: 16px;
  box-shadow: 0 0 40px rgba(255, 217, 138, .1);
}
.ending-lines { margin-top: 22px; }
.ending-lines p { padding: 4px 0; color: var(--ink); }
.ending-lines p:last-child { color: var(--dim); font-size: 13px; }
.ending-foot { margin-top: 18px; color: var(--red); font-size: 13px; font-family: var(--mono); }
.blink-slow { animation: blink 2.4s steps(1) infinite; }

/* 真结局逐行揭示 */
.ending.true .t-line { opacity: 0; transform: translateY(6px); transition: opacity .9s, transform .9s; margin-top: 18px; pointer-events: none; }
.ending.true .t-line.show { opacity: 1; transform: none; pointer-events: auto; }
.t-sys { font-family: var(--mono); font-size: 13px; color: var(--dim); }
.t-rename { text-align: center; padding: 10px 0; }
.rename-old { color: var(--dim); text-decoration: line-through; text-decoration-color: var(--red); font-size: 14px; }
.rename-new { margin-top: 12px; font-size: 22px; letter-spacing: .14em; color: var(--warm); text-shadow: 0 0 24px rgba(255, 217, 138, .35); }
.t-quote { text-align: center; margin: 10px 0; }
.t-quote p { font-size: 17px; letter-spacing: .1em; line-height: 2.1; }
.t-small { text-align: center; }
.t-small p { font-size: 12.5px; color: var(--dim); }
.t-stats { text-align: center; font-family: var(--mono); font-size: 12px; color: var(--cyan); }
.ending.true .intro-btns { justify-content: center; }

/* E-2028 尾声 */
.ending.e2028 { background: radial-gradient(ellipse at 50% 0%, #0c1526 0%, var(--bg) 60%); }
.ending.e2028 .ending-lines p { padding: 5px 0; }
.blank-plaque { min-height: 64px; box-shadow: 0 0 40px rgba(255, 217, 138, .06); }

/* 萤火 */
.fireflies { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.fireflies i {
  position: absolute; width: 4px; height: 4px; background: var(--warm);
  box-shadow: 0 0 10px 2px rgba(255, 217, 138, .5);
  animation: fly 11s linear infinite;
  opacity: 0;
}
.fireflies i:nth-child(1) { left: 12%; animation-delay: 2s; }
.fireflies i:nth-child(2) { left: 30%; animation-delay: 5.5s; animation-duration: 14s; }
.fireflies i:nth-child(3) { left: 55%; animation-delay: 3.5s; animation-duration: 12s; }
.fireflies i:nth-child(4) { left: 74%; animation-delay: 7s; }
.fireflies i:nth-child(5) { left: 88%; animation-delay: 9.5s; animation-duration: 15s; }
@keyframes fly {
  0% { top: 105%; opacity: 0; }
  12% { opacity: .9; }
  55% { opacity: .5; transform: translateX(20px); }
  85% { opacity: .8; transform: translateX(-14px); }
  100% { top: -5%; opacity: 0; }
}

/* ---------- 响应式 ---------- */

@media (max-width: 860px) {
  .topbar { flex-wrap: wrap; gap: 6px 12px; padding: 8px 12px; }
  .layout { flex-direction: column; }
  /* 窄屏时把「当前目标+任务按钮+线索」提到内容之前,否则指引沉到页面最底部 */
  .sidebar { width: 100%; order: -1; border-left: none; border-bottom: 2px solid var(--line); padding: 14px 14px 4px; }
  .clue-box { max-height: 32vh; overflow-y: auto; }
  .stage { padding: 16px 14px 70px; }
  .intro-frame { padding: 24px 20px; }
}