/* ============ 幻想乡图鉴 · 全图标记版 ============ */
/* 书法行书：禹卫书法行书简体 子集化 — 用户提供字体文件 */
@font-face {
  font-family: 'WenKaiTitle';
  src: url('../fonts/yuwei-title.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
}
/* 菜单字体：香蕉成行灵感体（千禧风手写感） */
@font-face {
  font-family: 'XiangJiaoMenu';
  src: url('../fonts/xiangjiao-menu.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
/* 标题界面：华康郭泰碑W4（用户提供，子集化 + 简体 cmap 重映射） */
@font-face {
  font-family: 'GuoBeiTitle';
  src: url('../fonts/guotai-title.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}

:root {
  --paper: #f5ecd9;
  --paper-deep: #eadfc4;
  --ink: #4a3a28;
  --ink-soft: #8a7a66;
  --accent: #8f2f21;
  --accent-light: #b3402f;
  --gold: #d4a94e;
  --cat-sky: #5b7a8f;
  --cat-mountain: #6b8f6b;
  --cat-village: #c2a15a;
  --cat-shrine: #c05a4e;
  --cat-nether: #9a7a8f;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  font-family: "Noto Serif SC", "Source Han Serif SC", "SimSun", "Songti SC", serif;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E"),
    linear-gradient(180deg, #f7f1e3 0%, #f0e6d0 60%, #e8dcc0 100%);
  color: var(--ink);
  min-height: 100vh;
}

/* ---------- 顶栏 ---------- */
.topbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 22px;
  background: rgba(143, 47, 33, 0.05);
  border-bottom: 1px solid rgba(143, 47, 33, 0.16);
}
.actions { display: flex; gap: 8px; }
.btn-plain {
  background: transparent; border: none; color: var(--ink);
  padding: 6px 6px; cursor: pointer; font-family: inherit; font-size: 13px;
  letter-spacing: 2px; position: relative;
  transition: color .2s;
}
.btn-plain::after {
  content: ''; position: absolute; left: 50%; bottom: 1px; width: 0; height: 1px;
  background: var(--accent); transition: width .25s ease, left .25s ease;
}
.btn-plain:hover { color: var(--accent); }
.btn-plain:hover::after { width: 100%; left: 0; }
/* v234：顶栏 8 个导航选项 = 常驻旧纸片，hover 时从地板上抬起 + 投影加深 */
.topbar .btn-plain {
  background: url('../assets/input-paper.webp') repeat;
  border: none;
  border-radius: 4px;
  padding: 7px 14px;
  letter-spacing: 2px;
  transition: transform .15s ease, box-shadow .15s ease;
  box-shadow:
    0 1px 0 rgba(255,250,238,.5) inset,
    0 -1px 0 rgba(120,80,40,.1) inset,
    0 1px 2px rgba(74,58,40,.14);
}
.topbar .btn-plain::after { display: none; }
.topbar .btn-plain:hover {
  color: #4a2c17;
  transform: translateY(-3px);
  box-shadow:
    0 1px 0 rgba(255,250,238,.6) inset,
    0 -1px 0 rgba(120,80,40,.1) inset,
    0 6px 12px rgba(74,58,40,.3),
    0 2px 4px rgba(74,58,40,.18);
}
.topbar .btn-plain:active {
  transform: translateY(-1px);
  box-shadow:
    0 1px 0 rgba(255,250,238,.5) inset,
    0 2px 6px rgba(74,58,40,.22);
}
/* 弹窗操作按钮保留边框按钮感 */
.modal-actions .btn-plain {
  border: 1px solid rgba(143, 47, 33, 0.35); color: var(--accent);
  padding: 6px 14px; border-radius: 8px; letter-spacing: 1px;
}
.modal-actions .btn-plain::after { display: none; }
.modal-actions .btn-plain:hover { background: var(--accent); color: #fff; }
.btn-primary {
  background: var(--accent); border: none; color: #fff; padding: 6px 16px;
  border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 13px;
}
.btn-primary:hover { background: var(--accent-light); }

/* ---------- 视图切换 ---------- */
.view { display: none; }
.view.active { display: block; animation: fadeIn .35s ease; }
/* 地图视图：浅暖米黄底（白底+轻 sepia 滤镜效果，与地图 sepia 统一） */
#view-map {
  background: #f0e0c2;
}
/* 地图界面：顶栏/筛选栏/按钮/标记牌统一为浅暖米黄底 + 深棕字 */
body.view-map { background: #f0e0c2; }
body.view-map .topbar {
  background: rgba(120, 80, 40, 0.06);
  border-bottom: 1px solid rgba(120, 80, 40, 0.18);
}
body.view-map .btn-plain { color: #5a4030; }
body.view-map .btn-plain:hover { color: #8f5020; }
body.view-map .marker .label {
  background: #e9d7b5;
  border-color: #b98a5a;
  color: #4a2c17;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}
body.view-map .marker.mini .label {
  background: #e9d7b5;
  border-color: #cdb896;
  color: #6b5a45;
}
body.view-map #map-hint {
  background: #e9d7b5;
  color: #6b5638;
  border-color: rgba(120, 80, 40, 0.25);
}
#view-chat {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: #f4ecd9;
  height: 100vh;
  overflow-y: auto;
}
#view-chat::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--chat-bg, none) no-repeat center / cover;
  filter: brightness(.68) saturate(.92);
  pointer-events: none;
  z-index: 0;
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---------- 地图 ---------- */
.map-wrap { max-width: 1280px; margin: 0 auto; padding: 16px 20px 30px; }

/* v279：幻想乡速报栏——地图主界面顶部的一条旧纸新闻，折叠态显示标题，点开展开全文 */
.world-breathe {
  background: url('../assets/input-paper.webp') repeat;
  border-radius: 3px;
  padding: 10px 14px;
  margin: 0 0 12px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(74,58,40,.14);
  font-family: 'KaiTi', 'STKaiti', '楷体', serif;
  color: #4a2c17;
  user-select: none;
}
.world-breathe.hidden { display: none; }
.wb-title {
  display: inline-block;
  font-size: 12px;
  color: #8a6f4d;
  letter-spacing: 2px;
  margin-bottom: 4px;
}
.wb-preview {
  font-size: 15px;
  line-height: 1.7;
  letter-spacing: 1px;
  color: #4a2c17;
}
.wb-full {
  font-size: 14px;
  line-height: 1.85;
  color: #4a2c17;
  letter-spacing: 1px;
  white-space: pre-wrap;
  margin-top: 6px;
  padding-top: 8px;
  border-top: 1px dashed rgba(143,47,33,.25);
}
.wb-full.hidden { display: none; }
/* 折叠态提示「点开」的小尾巴 */
.world-breathe:not(.expanded)::after {
  content: '（点击展开 · 射命丸文）';
  font-size: 11px;
  color: #9b8468;
  letter-spacing: 1px;
}
.world-breathe.expanded::after {
  content: '（点击收起）';
  font-size: 11px;
  color: #9b8468;
  letter-spacing: 1px;
}

#map-canvas {
  position: relative;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  border: none;
  background: transparent;
}
#map-img { display: block; width: 100%; height: auto; filter: sepia(0.32) saturate(0.85) brightness(0.94) contrast(0.99); }
#map-stage { position: absolute; inset: 0; }
#markers { position: absolute; inset: 0; }
.marker { position: absolute; transform: translate(-50%, -50%); cursor: pointer; z-index: 2; }
.marker .label {
  font-family: 'KaiTi', 'STKaiti', 'Kaiti SC', '楷体', 'FangSong', '仿宋', serif;
  writing-mode: vertical-rl;
  background: #f7eedd;
  color: #4a2c17;
  border-radius: 2px;
  padding: 16px 10px 16px;
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 6px;
  line-height: 1.25;
  box-shadow:
    0 2px 3px rgba(74,58,40,.3),
    0 5px 6px -4px rgba(74,58,40,.2) inset,
    0 -5px 6px -4px rgba(74,58,40,.2) inset;
  transition: transform .18s, background .18s, box-shadow .18s;
  position: relative;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}
/* 竖卷轴：上下两端横轴杆（AI 横向木轴杆图，长度只超纸面一点点） */
.marker .label::before,
.marker .label::after {
  content: '';
  position: absolute; left: 50%; transform: translateX(-50%);
  width: calc(100% + 10px); height: 12px;
  background: url('../assets/scroll-bar.webp') no-repeat center / 100% 100%;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.3));
}
.marker .label::before { top: -12px; }
.marker .label::after { bottom: -12px; transform: translateX(-50%) scaleY(-1); }
.marker.size-L .label { font-size: 40px; padding: 18px 11px 18px; letter-spacing: 7px; }
.marker.size-S .label { font-size: 22px; padding: 14px 8px 14px; letter-spacing: 4px; }
.marker:hover .label, .marker.open .label {
  transform: scale(1.14);
  background: #fbf2e0;
  box-shadow: 4px 6px 14px rgba(74,58,40,.35);
  z-index: 5;
}

.marker.mini { z-index: 1; opacity: .82; }
.marker.mini:hover { opacity: 1; }
.marker.mini .label {
  writing-mode: horizontal-tb;
  font-size: 22px;
  font-weight: 400;
  color: #6b5a45;
  background: #f7eedd;
  padding: 6px 16px;
  letter-spacing: 2px;
  border-radius: 2px;
  box-shadow:
    0 2px 3px rgba(74,58,40,.25),
    3px 0 4px -3px rgba(74,58,40,.18) inset,
    -3px 0 4px -3px rgba(74,58,40,.18) inset;
  text-shadow: none;
  position: relative;
  white-space: nowrap;
}
/* mini 横排地名：横卷轴，左右竖轴杆 */
.marker.mini .label::before,
.marker.mini .label::after {
  content: '';
  display: block;
  position: absolute; top: 50%; left: auto; transform: translateY(-50%);
  width: 12px; height: calc(100% + 6px);
  background: url('../assets/scroll-bar-v.webp') no-repeat center / 100% 100%;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.3));
  pointer-events: none;
}
.marker.mini .label::before { left: -12px; }
.marker.mini .label::after { left: auto; right: -12px; }
.marker.mini:hover .label {
  background: #fbf2e0;
  color: #4a2c17;
}

#map-hint {
  position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%);
  font-size: 12px; color: rgba(74,58,40,.8); letter-spacing: 1px;
  background: #f3ead6; padding: 4px 14px; border-radius: 6px;
  border: 1px solid rgba(74,58,40,.18);
  pointer-events: none; z-index: 30;
}
.cat-jump {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 2px; font-size: 11px; color: var(--ink-soft);
}

/* ---------- 详情面板 ---------- */
.side-panel {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 92vw);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='sp'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0.15'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23sp)' opacity='0.5'/%3E%3C/svg%3E"),
    #f0e0c2;
  box-shadow: -8px 0 24px rgba(74,58,40,.3);
  transform: translateX(105%); transition: transform .3s cubic-bezier(.22,.9,.3,1);
  z-index: 40; overflow-y: auto; padding: 26px 24px 40px;
}
.side-panel.open { transform: none; }
.btn-close {
  position: absolute; top: 14px; right: 16px; border: none; background: rgba(74,58,40,.1);
  width: 30px; height: 30px; border-radius: 6px; font-size: 15px; cursor: pointer; color: var(--ink);
}
.btn-close:hover { background: rgba(143,47,33,.15); color: var(--accent); }
.panel-cat {
  display: inline-block; font-size: 12px; color: #fff; padding: 3px 12px; border-radius: 6px; margin-bottom: 10px;
}
#panel-name { font-size: 24px; color: var(--accent); margin-bottom: 8px; letter-spacing: 1px; }
.panel-desc {
  font-size: 13.5px; line-height: 1.85; color: #5d4c38; text-align: justify;
  white-space: pre-line; margin-bottom: 18px;
  max-height: 300px; overflow-y: auto; padding-right: 6px;
}
.panel-desc .wiki-link { color: var(--accent); font-weight: 700; cursor: pointer; border-bottom: 1px dashed var(--accent); }
.panel-desc .wiki-link:hover { background: rgba(143,47,33,.08); }
.panel-section { font-size: 13px; color: var(--ink-soft); letter-spacing: 2px; margin-bottom: 10px; border-left: 3px solid var(--gold); padding-left: 8px; }

.char-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.char-card {
  border: none; border-radius: 3px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='cc'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.6' numOctaves='3' seed='8' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0.2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23cc)' opacity='0.55'/%3E%3C/svg%3E"),
    #f2e4c8;
  overflow: hidden; cursor: pointer; text-align: center; padding-bottom: 8px;
  transition: transform .18s, box-shadow .18s;
  box-shadow:
    0 1px 0 rgba(255,250,240,.6) inset,
    0 -1px 0 rgba(120,80,40,.08) inset,
    1px 1px 0 rgba(120,80,40,.08),
    2px 3px 6px rgba(74,58,40,.16);
}
.char-card:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(74,58,40,.22); }
.char-card-img {
  width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: 50% 15%;
  display: block;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='cimg'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.6' numOctaves='3' seed='8' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0.2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23cimg)' opacity='0.55'/%3E%3C/svg%3E"),
    #e9d7b5;
  filter: sepia(0.22) saturate(0.9) brightness(0.98);
}
.char-card-name { font-size: 14px; font-weight: 700; color: var(--ink); margin-top: 6px; }
.char-card-epithet { font-size: 10.5px; color: var(--ink-soft); margin-top: 2px; padding: 0 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 聊天 ---------- */
.chat-wrap { max-width: 960px; margin: 0 auto; padding: 14px 18px 20px; display: flex; flex-direction: column; height: calc(100vh - 120px); }
.chat-header { display: flex; align-items: center; gap: 14px; padding-bottom: 12px; border-bottom: 1px solid rgba(74,58,40,.15); }
.btn-back {
  background: transparent; border: 1px solid rgba(143,47,33,.35); color: var(--accent);
  padding: 5px 12px; border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 13px;
}
.btn-back:hover { background: var(--accent); color: #fff; }
.chat-title { display: flex; align-items: baseline; gap: 10px; }
#chat-name { font-size: 20px; font-weight: 700; color: var(--accent); }
#chat-epithet { font-size: 12px; color: var(--ink-soft); }

.chat-main { display: flex; gap: 16px; flex: 1; min-height: 0; padding: 14px 0; }
.chat-info { width: 190px; flex-shrink: 0; text-align: center; }
#chat-portrait {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 0%;
  border-radius: 12px;
}
#chat-meta { margin-top: 10px; font-size: 12px; color: var(--ink-soft); text-align: left; line-height: 1.8; }
#chat-meta b { color: var(--accent); }

.chat-messages {
  flex: 1; overflow-y: auto; padding: 6px 8px 6px 2px;
  display: flex; flex-direction: column; gap: 12px;
}
/* v227：剧本台词本样式——无头像无气泡，说话人名字一行 + 台词正文一行 */
.msg { display: flex; flex-direction: column; gap: 2px; animation: fadeIn .25s; }
.msg.user { align-items: flex-end; text-align: right; }
.msg-name {
  font-family: 'KaiTi','STKaiti','楷体',serif;
  font-size: 12.5px; letter-spacing: 2px;
  color: var(--accent);
  opacity: .9;
}
.msg.user .msg-name { color: #9a4a38; }
.msg-body {
  font-size: 15px; line-height: 1.9;
  color: #3f2f1d;
  white-space: pre-wrap; word-break: break-word;
  max-width: 92%;
}
.msg.user .msg-body { color: #6b4a2b; }
/* 系统提示：居中、小字、浅色 */
.msg.is-system { align-items: center; text-align: center; }
.msg.is-system .msg-body {
  font-size: 12.5px; color: #8a6f4d; letter-spacing: 1px;
  font-style: italic; max-width: 90%;
}

.chat-inputbar { position: relative; display: flex; gap: 10px; align-items: flex-end; }
#chat-input {
  flex: 1; resize: none; border: 1px solid rgba(74,58,40,.25); border-radius: 12px;
  padding: 10px 14px; font-family: inherit; font-size: 14px; line-height: 1.6;
  background: #fff; outline: none; max-height: 120px;
}
#chat-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(143,47,33,.1); }
.btn-send {
  background: var(--accent); border: none; color: #fff; padding: 10px 22px;
  border-radius: 12px; cursor: pointer; font-family: inherit; font-size: 14px;
}
.btn-send:hover { background: var(--accent-light); }
.btn-send:disabled { opacity: .5; cursor: wait; }
.loading {
  position: absolute; top: -30px; right: 0; font-size: 12px; color: var(--ink-soft);
  background: rgba(255,255,255,.85); padding: 3px 10px; border-radius: 8px;
}
.hidden { display: none !important; }

/* ---------- 设置弹窗 ---------- */
.modal {
  position: fixed; inset: 0; background: rgba(40,28,16,.45); z-index: 60;
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.modal-box {
  background: url('../assets/modal-paper.webp') no-repeat;
  background-size: 100% 100%;
  border-radius: 4px; padding: 26px 28px; width: min(420px, 94vw);
  display: flex; flex-direction: column; gap: 8px;
  max-height: calc(100vh - 40px); overflow-y: auto;
}
.modal-box h3 { color: var(--accent); margin-bottom: 6px; }
.modal-box label { font-size: 12.5px; color: var(--ink-soft); margin-top: 6px; }
.modal-box input {
  border: 1px solid rgba(74,58,40,.25); border-radius: 8px; padding: 8px 12px;
  font-family: inherit; font-size: 13.5px; outline: none; background: #fff;
}
.modal-box input:focus { border-color: var(--accent); }
.modal-actions { display: flex; gap: 8px; margin-top: 14px; justify-content: flex-end; }
.api-test-result { font-size: 12.5px; margin-top: 4px; color: var(--ink-soft); min-height: 18px; }
.api-test-result.ok { color: #1e7d32; }
.api-test-result.err { color: #c62828; }

/* ---------- 页脚 ---------- */
.footer {
  text-align: center; font-size: 11.5px; color: rgba(74,58,40,.5);
  max-width: 100vw;
  padding: 18px 10px 22px; letter-spacing: 1px; word-break: break-all; overflow-wrap: anywhere; box-sizing: border-box;
}

/* 保底：任何情况下禁止横向滚动（手机端布局自适应） */
html, body {
  overflow-x: hidden;
}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-thumb { background: rgba(74,58,40,.25); border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
  .chat-main { flex-direction: column; }
  .chat-info { width: 100%; display: flex; gap: 12px; align-items: center; }
  #chat-portrait { width: 90px; aspect-ratio: 3/4; }
  #chat-meta { margin-top: 0; }
  .char-grid { grid-template-columns: repeat(3, 1fr); }
  /* (已移除 max-height，长卷轴地图需全高展示可滚动) */
}

/* ---------- 地点详情：地图放大 + 中央渐现弹框 ---------- */
#map-canvas { transition: none; } /* 瞬时缩放：transform 动画窗口期 docH/滚动条渐进变化，国产浏览器 fixed 弹框会重排位移放大 */
.marker-hidden { opacity: 0 !important; pointer-events: none !important; transition: opacity .35s; }

.place-modal {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(50, 32, 16, .28);
  opacity: 0; transition: opacity .45s;
}
.place-modal.show { opacity: 1; }
.place-modal::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--place-bg, none) no-repeat center / cover;
  filter: brightness(.58) saturate(.92);
  pointer-events: none;
}
.place-modal.has-bg .pm-box { z-index: 1; }

.pm-box {
  position: relative;
  width: min(860px, 92vw); max-height: 86vh;
  display: flex; flex-direction: column; gap: 10px;
  padding: 22px 30px 26px;
  border: none; border-radius: 4px;
  background: url('../assets/modal-paper.webp') no-repeat;
  background-size: 100% 100%;
  opacity: 0;
  transition: opacity .35s;
}
.place-modal.show .pm-box { opacity: 1; }
.pm-close {
  position: absolute; top: 10px; right: 14px;
  border: none; background: none;
  font-size: 24px; color: #8a6f4d; cursor: pointer;
  line-height: 1; padding: 4px 8px; border-radius: 6px;
}
.pm-close:hover { background: rgba(185, 138, 90, .18); }
.pm-cat {
  align-self: flex-start; color: #fff;
  padding: 4px 16px; border-radius: 6px;
  font-size: 15px; letter-spacing: 2px;
}
.pm-name {
  margin: 0;
  font-family: 'KaiTi', 'STKaiti', '楷体', 'Kaiti SC', serif;
  font-size: 34px; color: #4a2c17; letter-spacing: 5px;
}
.pm-desc {
  font-size: 17px; line-height: 1.85; color: #5a4433;
  max-height: 22vh; overflow-y: auto; padding-right: 6px;
}
.pm-desc::-webkit-scrollbar { width: 6px; }
.pm-desc::-webkit-scrollbar-thumb { background: rgba(185, 138, 90, .4); border-radius: 3px; }
.wiki-link { color: #a0522d; cursor: pointer; border-bottom: 1px dashed #c9a06a; }
.wiki-link:hover { background: rgba(185, 138, 90, .12); }
.pm-chars {
  display: flex; justify-content: center; align-items: flex-end;
  gap: 24px; flex-wrap: wrap;
  margin-top: 4px; padding-top: 14px;
  border-top: 1px dashed rgba(185, 138, 90, .45);
}
.pm-char { text-align: center; cursor: pointer; transition: transform .2s; }
.pm-char:hover { transform: translateY(-4px); }
.pm-char img {
  height: 170px; width: auto; object-fit: contain;
  border-radius: 3px;
  background: url('../assets/input-paper.webp') repeat;
  filter: sepia(0.22) saturate(0.9) brightness(0.98);
  box-shadow:
    0 1px 0 rgba(255,250,240,.5) inset,
    0 -1px 0 rgba(120,80,40,.08) inset,
    2px 3px 6px rgba(74,58,40,.14);
}
.pm-char .nm {
  font-family: 'KaiTi', 'STKaiti', '楷体', 'Kaiti SC', serif;
  font-size: 19px; color: #4a2c17; margin-top: 9px;
}
.pm-char .ep { font-size: 13px; color: #9b8468; margin-top: 3px; }
.pm-empty { color: #b0a48f; font-size: 14px; padding: 18px 0; }

/* ======== 顶栏：删 logo 后 8 个导航选项横排居中（v234） ======== */
.actions {
  display: grid;
  grid-template-columns: repeat(8, auto);
  gap: 8px;
  justify-content: center;
  align-items: center;
}

/* ======== 日式屏风动画层 ======== */
#folding-screens { position: fixed; inset: 0; z-index: 9999; pointer-events: none; visibility: hidden; }
#folding-screens.active { visibility: visible; }
.screen-left, .screen-right {
  position: absolute; top: 0; bottom: 0; width: 50%;
  overflow: hidden;
  background: #000;
}
.screen-left svg, .screen-right svg {
  position: absolute; inset: 12px; width: calc(100% - 24px); height: calc(100% - 24px);
  opacity: .9;
}
/* 屏风四周木格栅 */
.screen-left::before, .screen-right::before { display: none; }
.screen-left {
  left: 0;
  border-right-width: 4px;
  background-image:
    repeating-linear-gradient(0deg, rgba(120,90,50,.04) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(120,90,50,.04) 0 1px, transparent 1px 5px),
    radial-gradient(ellipse at 72% 22%, rgba(255,190,205,.35) 0 18%, transparent 55%),
    linear-gradient(180deg, #f2e6c8, #e2d0a8);
}
.screen-right {
  right: 0;
  border-left-width: 4px;
  background-image:
    repeating-linear-gradient(0deg, rgba(120,90,50,.04) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(120,90,50,.04) 0 1px, transparent 1px 5px),
    radial-gradient(ellipse at 78% 18%, rgba(255,240,205,.4) 0 20%, transparent 60%),
    linear-gradient(180deg, #f2e6c8, #e2d0a8);
}
#folding-screens.active .screen-left { animation: screenInL 2s cubic-bezier(.6,.05,.3,1) forwards; }
#folding-screens.active .screen-right { animation: screenInR 2s cubic-bezier(.6,.05,.3,1) forwards; }
/* 从哪边来，回哪边去 */
@keyframes screenInL {
  0%   { transform: translateX(-102%); opacity: 0; }
  20%  { transform: translateX(0); opacity: 1; }
  45%  { transform: translateX(0); opacity: 1; }
  70%  { transform: translateX(0); opacity: 1; }
  100% { transform: translateX(-102%); opacity: 0; }
}
@keyframes screenInR {
  0%   { transform: translateX(102%); opacity: 0; }
  20%  { transform: translateX(0); opacity: 1; }
  45%  { transform: translateX(0); opacity: 1; }
  70%  { transform: translateX(0); opacity: 1; }
  100% { transform: translateX(102%); opacity: 0; }
}

/* ======== 新聊天视图：立绘居中偏上 + 下方对话 ======== */
.chat-wrap { position: relative; z-index: 1; display: flex; flex-direction: column; height: 100vh; }
.chat-topbar {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 20px;
  background: #f4ecd9;
  border-bottom: 1px solid rgba(185,138,90,.35);
}
.chat-topbar .btn-back {
  border: 1px solid #b98a5a; background: none; color: #6b4a2b;
  padding: 6px 14px; border-radius: 6px; cursor: pointer;
  font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 14px;
}
.chat-topbar .btn-back:hover { background: rgba(185,138,90,.12); }
.chat-title { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 20px; color: #4a2c17; letter-spacing: 4px; }

.chat-stage {
  flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center;
  overflow: hidden; position: relative;
}
/* ======== v298 舞台式聊天界面（body.chat-stage-on） ======== */
/* 消息列表隐藏（舞台式只显示最新一句气泡）；输入栏保留原位不动 */
body.chat-stage-on .chat-messages { display: none !important; }
body.chat-stage-on .daily-hint { display: none; }
/* 舞台式：消息区隐藏后 chat-conv 里只剩输入栏，margin-top:auto 把它吸到底部（否则 flex 默认靠顶） */
body.chat-stage-on .chat-inputbar { margin-top: auto; }
/* 立绘容器：舞台式改绝对定位（脱离文档流）——chat-conv 占满 stage，输入栏固定在底部不被立绘挤压 */
body.chat-stage-on .portrait-zone {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 96px;            /* 半身：偏下（输入栏上方），可按需再调 */
  width: 320px;
  height: 340px;
  flex-shrink: 0;
  overflow: visible;
  margin: 0;               /* 清除流式 margin，位置全由 bottom 控制 */
}
body.chat-stage-on.portrait-full .portrait-zone {
  width: 300px;
  height: 420px;
  bottom: 56px;            /* 全身：更贴近输入栏上方 */
}
/* 角色气泡：立绘正头顶（容器内 absolute，bottom:100% 悬在立绘上方），尖尖▼指向角色；
   宽度放宽（左右延伸），避免文字多时纵向长高顶到顶部面板 */
/* 默认隐藏（列表模式不显示）；body.chat-stage-on 才显示 */
#sm-bubble {
  display: none;
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  width: max-content;
  max-width: min(58vw, 460px);   /* 放宽：左右延伸优先，纵向不顶到上面面板 */
  background: #f7eedd;
  border: 1px solid rgba(120, 90, 60, .35);
  border-radius: 10px;
  padding: 8px 14px;
  color: #3f2f1d;
  font-size: 14.5px;
  line-height: 1.7;
  box-shadow: 0 3px 12px rgba(80, 55, 30, .18);
  z-index: 5;
  white-space: pre-wrap;
  word-break: break-word;
}
body.chat-stage-on #sm-bubble { display: block; }
/* 角色气泡尖尖：标准三角朝下（指向角色） */
#sm-bubble::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -8px;
  transform: translateX(-50%);
  width: 0; height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #f7eedd;
}
/* 玩家气泡：屏幕左侧偏左，宽度翻倍，位置在输入栏上方不远处，尖尖▼指向用户/输入框方向 */
/* 默认隐藏（列表模式不显示）；body.chat-stage-on 才显示 */
#sm-player-bubble {
  display: none;
  position: absolute;
  left: 12%;             /* 稍微左移（原 16.7%） */
  bottom: 108px;          /* 输入栏上方不远处 */
  width: 33.4%;           /* 宽一倍（原 16.7%） */
  min-width: 120px;
  box-sizing: border-box;
  background: #f7eedd;
  border: 1px solid rgba(120, 90, 60, .35);
  border-radius: 10px;
  padding: 8px 14px;
  color: #5a4630;
  font-size: 14px;
  line-height: 1.6;
  box-shadow: 0 3px 12px rgba(80, 55, 30, .18);
  z-index: 5;
  white-space: pre-wrap;
  word-break: break-word;
}
body.chat-stage-on #sm-player-bubble { display: block; }
/* 玩家气泡尖尖：朝下指向用户（输入框方向） */
#sm-player-bubble::after {
  content: '';
  position: absolute;
  left: 20%;
  bottom: -8px;
  width: 0; height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #f7eedd;
}
/* 手机端：立绘/气泡缩小适配 */
@media (max-width: 768px) {
  body.chat-stage-on .portrait-zone { width: 220px; height: 240px; bottom: 84px; }
  body.chat-stage-on.portrait-full .portrait-zone { width: 210px; height: 300px; bottom: 52px; }
  #sm-bubble { max-width: 64vw; font-size: 13.5px; }
  #sm-player-bubble { left: 8%; width: 48%; bottom: 96px; font-size: 13px; }
}
.portrait-zone { margin-top: 8px; display: flex; justify-content: center; }
/* v222：去掉挂轴框——立绘透明 PNG 直接融入网页背景，无边框无底色无阴影。
   （撤销 sticky 固定：它破坏了「输入隐藏立绘」的焦点链） */
.portrait-zone {
  width: 216px; height: 226px;
  overflow: hidden;
  padding: 0;
  background: transparent;
  box-shadow: none;
  box-sizing: border-box;
  position: relative;
  margin-bottom: 6px;
}
#chat-portrait {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 0%;
  border: none; border-radius: 0; box-shadow: none; background: transparent;
  transition: object-fit .45s, object-position .45s, filter .6s ease;
  /* 立绘透明区完全透出页面背景 */
  mix-blend-mode: normal;
  /* v225：基础态轻暖 tint，让角色肤色/衣色往旧纸暖棕靠，弱化"贴纸"感 */
  filter: sepia(.18) saturate(.92);
  /* 底部柔化过渡：立绘下缘渐隐，不突兀切断 */
  -webkit-mask-image: linear-gradient(180deg, #000 72%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(180deg, #000 72%, rgba(0,0,0,0) 100%);
}
body.portrait-full .portrait-zone {
  width: 216px;
  height: 368px;
}
body.portrait-full #chat-portrait {
  object-fit: contain;
  object-position: center 55%;
}
/* ======== T-01 近正方形/宽幅立绘适配（JS 检测图比例>=0.78 后加 body.portrait-wide） ======== */
/* 半身：放大只显示原图上部（头+上半身），避免 cover 露全身 */
body.portrait-wide #chat-portrait {
  transform: scale(var(--pr-scale, 1.5));
  transform-origin: 50% 0%;
}
/* 全身：容器高度按图比例收窄（宽/ratio），contain 完整显示且无上下大空白 */
body.portrait-wide.portrait-full .portrait-zone {
  height: calc(200px / var(--pr-ratio, 1));
}
body.portrait-wide.portrait-full #chat-portrait {
  object-fit: contain;
  object-position: center 55%;
  transform: none;
}
.chat-conv {
  width: min(760px, 94vw);
  flex: 1; min-height: 0;
  display: flex; flex-direction: column;
  margin-top: 8px;
}
/* v227：剧本台词本——纸是一个固定高度的滚动窗口（传送带式卷轴）：
   纸纹理 background-attachment: local 让纸跟着内容一起向上滚动，
   滚上去的纸消失、窗口下方不断冒出新的纸段，形成"一张无限延伸的纸"。 */
.chat-messages {
  flex: 1; min-height: 0; overflow-y: auto;
  padding: 26px 52px 80px;
  display: flex; flex-direction: column; gap: 18px;
  position: relative;
  /* v307：纸图已裁掉上下透明带（1040×1399 无缝）——?v307 破缓存 */
  background-image: url("../assets/chat-paper-clean.webp?v332");
  background-repeat: repeat-y;
  background-position: center top;
  background-size: 100% auto;
  background-attachment: local;
}
.chat-inputbar { display: flex; gap: 8px; align-items: flex-end; padding: 10px 0 14px; position: relative; }
#chat-input {
  flex: 1; resize: none; border: none; border-radius: 4px;
  background: url('../assets/modal-paper.webp') no-repeat;
  background-size: 100% 100%;
  color: #4a2c17; font-size: 14px;
  padding: 10px 16px; outline: none; line-height: 1.5;
  max-height: 120px; font-family: inherit;
  box-shadow: none;
}
#chat-input:focus {
  box-shadow: 0 0 0 2px rgba(143,47,33,.14);
}
.btn-send {
  border: none; background: #8f2f21; color: #fff;
  padding: 10px 22px; border-radius: 4px; cursor: pointer; font-size: 14px;
  box-shadow: none;
}
.btn-send:hover { background: #a5382a; }
.btn-send:disabled { opacity: .55; cursor: not-allowed; }
.loading { position: absolute; right: 8px; top: -20px; font-size: 12px; color: #9b8468; }

/* AI 屏风绘 */
.screen-left img, .screen-right img {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: fill; z-index: 0;
  max-width: none; max-height: none;
}
.screen-left::before, .screen-right::before { z-index: 2; }

/* 屏风过渡遮罩：挡住动画期间透出的内容 */
#folding-veil {
  position: fixed; inset: 0; z-index: 9998;
  background: #14100b;
  opacity: 0; pointer-events: none;
  transition: opacity .35s;
}
#folding-veil.show { opacity: 1; }

/* ===== 站长 API 模式切换 ===== */
.mode-switch { margin-top: 10px; }
.mode-switch hr { border: none; border-top: 1px dashed rgba(185,138,90,.5); margin: 12px 0; }
.mode-title { font-size: 13px; color: #8a6f4d; margin: 0 0 8px; font-weight: bold; }
.mode-options { display: flex; gap: 16px; font-size: 14px; color: #4a2c17; }
.mode-options label { display: flex; align-items: center; gap: 4px; cursor: pointer; }

/* ============ 好感度/信赖度状态条 ============ */
.affinity-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 5px;
  min-height: 20px;
}
.aff-stage {
  color: #fff;
  font-size: 12px;
  padding: 2px 12px;
  border-radius: 6px;
  letter-spacing: 3px;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
  white-space: nowrap;
}
.aff-bar {
  width: 72px;
  height: 9px;
  border-radius: 5px;
  background: rgba(120,90,60,.16);
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.12);
}
.aff-fill {
  display: block;
  height: 100%;
  border-radius: 5px;
  transition: width .5s ease;
}
.aff-fill.love  { background: linear-gradient(90deg, #c94b45, #8f2f21); }
.aff-fill.trust { background: linear-gradient(90deg, #7a9bb0, #5a7a90); }
.aff-num {
  font-size: 12px;
  color: #7a5c3a;
  font-weight: bold;
  min-width: 36px;
}

/* ============ 每日情境行 ============ */
.daily-hint {
  font-size: 12px;
  color: #8a6f4d;
  text-align: center;
  margin-top: 2px;
  letter-spacing: 1px;
  line-height: 1.6;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 10px;
}
.daily-hint .dh-luck { font-weight: bold; color: #c0392b; }

/* ============ 回忆簿（里程碑） ============ */
.pm-milestones {
  margin-top: 2px;
  padding: 10px 4px 2px;
  border-top: 1px dashed rgba(185,138,90,.4);
}
.ms-title { font-size: 13px; color: #8a6f4d; margin-bottom: 6px; letter-spacing: 2px; }
.ms-list { display: flex; flex-wrap: wrap; gap: 6px; }
.ms-item {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1.5px solid #ddd;
  border-radius: 6px;
  padding: 3px 12px;
  font-size: 12px;
  color: #b0a48f;
  background: rgba(255,255,255,.5);
}
.ms-item.on { color: #5a4433; background: rgba(255,255,255,.85); }
.ms-item.off .ms-line { display: none; }
.ms-dot { width: 8px; height: 8px; border-radius: 50%; }
.ms-name { font-weight: bold; }
.ms-line { margin-left: 2px; font-size: 11px; color: #7a5c3a; max-width: 340px; }
.ms-line.dim { color: #ccc; }
.ms-item.clickable { cursor: pointer; flex-wrap: wrap; }
.ms-item .ms-who { display: none; width: 100%; font-size: 11px; color: #7a5c3a; margin-left: 14px; }
.ms-item .ms-who.show { display: block; }

/* ============ 神签弹窗 ============ */
.omikuji-box { text-align: center; }
.omikuji-box h3 { font-family: 'KaiTi','STKaiti','楷体',serif; color: #7a1f1f; letter-spacing: 4px; }
#omikuji-img {
  max-width: 280px;
  max-height: 60vh;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(60,30,10,.3);
  margin: 10px auto;
  display: block;
}
.omikuji-info { font-size: 14px; color: #5a4433; letter-spacing: 2px; }

/* ============================================================
   手机端适配（≤768px）
   ============================================================ */
@media (max-width: 768px) {
  /* 顶栏 */
  .topbar { padding: 6px 10px; gap: 6px; }
  .actions { gap: 4px; }
  .btn-plain { font-size: 11px; padding: 4px 8px; border-radius: 6px; }

  /* 地图标记：字号/轴杆缩放统一由下方「手机端细节修正」块负责，此处不再重复 */

  /* 地图提示 */
  #map-hint { font-size: 10px; bottom: 8px; }

  /* 聊天界面 */
  .chat-topbar { padding: 6px 10px; }
  .btn-back { font-size: 12px; }
  .chat-title { font-size: 16px; }
  .affinity-bar { gap: 5px; }
  .aff-bar { width: 44px; height: 6px; }
  .aff-num { font-size: 10px; min-width: 26px; }
  .aff-stage { font-size: 10px; padding: 1px 7px; }
  .daily-hint { font-size: 10.5px; line-height: 1.5; }

  /* 立绘（竖屏手机，半身框见下方修正） */

  /* 对话区 */
  .chat-conv { width: 94vw; }
  .chat-messages { padding: 18px 18px 60px; gap: 14px; background-size: 115% auto; }
  .msg-body { font-size: 14px; max-width: 96%; }
  .chat-inputbar { padding: 6px 8px 46px; gap: 6px; }
  .chat-inputbar textarea { font-size: 16px; }
  .btn-send { font-size: 13px; padding: 8px 14px; }

  /* 地点弹框 */
  .pm-box { width: 93vw; padding: 14px 14px 18px; max-height: 88vh; gap: 8px; }
  .pm-name { font-size: 24px; }
  .pm-desc { font-size: 13.5px; max-height: 24vh; }
  .pm-cat { font-size: 12px; }
  .pm-char img { height: 108px; }
  .pm-char .nm { font-size: 14px; }
  .pm-char .ep { font-size: 10px; }
  .pm-chars { gap: 12px; }
  .ms-line { max-width: 220px; }
  .ms-item { font-size: 11px; padding: 2px 8px; }

  /* 神签 */
  #omikuji-img { max-width: 72vw; max-height: 55vh; }
  .omikuji-info { font-size: 13px; }

  /* 设置弹窗 */
  .modal-box { width: 92vw; padding: 16px; }
  .modal-box input { font-size: 16px; }
  .modal-box button { font-size: 13px; }
  .mode-options { flex-direction: column; gap: 6px; }

  /* 屏风：保持 50% 各半（无需改动，尺寸由视口决定） */
}

/* 手机端细节修正 */
@media (max-width: 768px) {
  /* 标记字号+内边距+字距：手机端整体压小，大字号地名的方框也同步缩小（不能只缩字号留大 padding） */
  .marker .label { font-size: 8px; padding: 4px 2px; letter-spacing: 1px; }
  .marker.size-L .label { font-size: 9px; padding: 5px 3px; letter-spacing: 2px; }
  .marker.size-S .label { font-size: 6px; padding: 3px 2px; letter-spacing: 1px; }
  .marker.mini .label { font-size: 6px; padding: 1px 3px; }
  /* 竖卷轴：上下横轴杆等比缩小（高 12px→4px，仍横跨标签宽） */
  .marker .label::before,
  .marker .label::after { width: calc(100% + 6px); height: 4px; }
  .marker .label::before { top: -4px; }
  .marker .label::after { bottom: -4px; }
  /* 横卷轴（mini）：左右竖轴杆等比缩小（宽 12px→4px，仍纵跨标签高） */
  .marker.mini .label::before,
  .marker.mini .label::after { width: 4px; height: calc(100% + 4px); }
  .marker.mini .label::before { left: -4px; }
  .marker.mini .label::after { right: -4px; }

  /* 聊天顶部：名字横排在上，好感条下方，情境行全宽单行 */
  .chat-head { gap: 3px; padding-right: 0; }
  .chat-title { font-size: 17px; }
  .daily-hint { font-size: 10px; white-space: nowrap; }

  /* 立绘：半身显示图上部0-55%（头+上半身），全身居中完整 */
  #chat-portrait { object-position: 50% 0%; height: 100%; width: 100%; }
  .portrait-zone { width: 96px; height: 100px; margin-bottom: 4px; padding: 0; }
  body.portrait-full .portrait-zone { width: 96px; height: 168px; padding: 0; }
  body.portrait-full #chat-portrait { object-position: center; height: 100%; width: 100%; }
  /* T-01：近正方形/宽幅立绘：全身容器按图比例收窄（手机容器宽 96px） */
  body.portrait-wide.portrait-full .portrait-zone { height: calc(96px / var(--pr-ratio, 1)); }

  /* 聊天顶栏按钮 */
  .chat-actions { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
  .chat-actions .btn-plain { font-size: 10px; padding: 3px 7px; }
}

/* 屏风半扇图：cover 铺满各自窗口，拼接处=原图中心 */
.screen-left img { width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.screen-right img { width: 100%; height: 100%; object-fit: cover; object-position: left center; }

/* 手机端：禁用双击缩放（防止快速连点被识别为双击导致页面整体缩放、fixed元素位移放大），
   保留双指缩放（applyZoomFix 仍正常反向修正弹框） */
html, body { touch-action: manipulation; -webkit-touch-callout: none; }


/* ============================================================
   角色图鉴（v41）
   ============================================================ */
#view-dex {
  min-height: 100vh;
  background: url('../assets/input-paper.webp') repeat;
}
.dex-wrap { max-width: 1080px; margin: 0 auto; padding: 18px 20px 40px; }
.dex-head { display: flex; gap: 10px; align-items: center; margin-bottom: 14px; }
.dex-head .btn-back {
  border: 1px solid #b98a5a; background: none; color: #6b4a2b;
  padding: 7px 16px; border-radius: 6px; cursor: pointer;
  font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 14px; white-space: nowrap;
}
.dex-head .btn-back:hover { background: rgba(185,138,90,.12); }
#dex-search {
  flex: 1; border: 1px solid rgba(120,80,40,.25); border-radius: 4px;
  background: url('../assets/input-paper.webp') repeat; color: #4a2c17; font-family: inherit;
  font-size: 14px; padding: 8px 14px; outline: none; max-width: 320px;
  box-shadow: 0 1px 0 rgba(255,250,240,.5) inset, 2px 3px 6px rgba(74,58,40,.12);
}
#dex-search:focus { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(143,47,33,.14); }
.dex-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 12px; }
.dex-card {
  border: none; border-radius: 3px;
  background: url('../assets/input-paper.webp') repeat;
  cursor: pointer;
  overflow: hidden; text-align: center;
  transition: transform .18s, box-shadow .18s;
  box-shadow:
    0 1px 0 rgba(255,250,240,.5) inset,
    0 -1px 0 rgba(120,80,40,.08) inset,
    2px 3px 6px rgba(74,58,40,.14);
}
.dex-card:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(74,58,40,.22); }
.dex-card img {
  width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: 50% 15%;
  display: block;
  background: url('../assets/input-paper.webp') repeat;
  filter: sepia(0.22) saturate(0.9) brightness(0.98);
}
.dex-head-char { padding: 8px 6px 10px; display: flex; flex-direction: column; gap: 3px; align-items: center; }
.dex-av {
  width: 52px; height: 52px; border-radius: 50%; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; font-weight: 700; margin-bottom: 2px;
  box-shadow: 0 2px 8px rgba(74,58,40,.25);
}
.dex-cname { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 15px; color: #4a2c17; letter-spacing: 1px; }
.dex-cep {
  font-size: 11px; color: #8a6f4a; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
  max-width: 100%; padding: 0 4px;
}
.dex-empty { grid-column: 1/-1; text-align: center; color: #9b8468; padding: 40px 0; font-size: 14px; }
.dex-foot { margin-top: 22px; text-align: center; font-size: 11px; color: rgba(74,58,40,.55); letter-spacing: 1px; }

/* 图鉴详情弹框 */
.dex-detail { text-align: center; }
.dex-d-head img {
  max-height: 300px; width: auto; border-radius: 4px;
  box-shadow: 2px 4px 8px rgba(60,38,18,.22);
  background: url('../assets/input-paper.webp') repeat;
}
.dex-d-av {
  width: 110px; height: 110px; border-radius: 50%; color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 46px; font-weight: 700; box-shadow: 0 4px 14px rgba(74,58,40,.3);
}
.dex-d-ep { font-size: 15px; color: #9b8468; letter-spacing: 2px; margin-top: 2px; }
.dex-d-info { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: #5a4433; line-height: 1.7; margin-top: 4px; }
.dex-row { text-align: left; }
.dex-d-desc {
  font-size: 14.5px; color: #5a4433; line-height: 1.8; text-align: left;
  max-height: 20vh; overflow-y: auto; padding-right: 6px;
  border-top: 1px dashed rgba(185,138,90,.4); padding-top: 10px; margin-top: 6px;
}
.dex-aff { margin-top: 4px; }
.dex-chat-btn {
  border: none; background: #b3402f; color: #fff; font-family: inherit;
  padding: 10px 26px; border-radius: 6px; font-size: 15px; cursor: pointer;
  letter-spacing: 2px; margin-top: 8px; transition: background .2s;
}
.dex-chat-btn:hover { background: var(--accent); }
.dex-d-tip { font-size: 12.5px; color: #9b8468; line-height: 1.7; }

/* 约会 */
.date-modal { text-align: center; }
.date-tip { font-size: 14px; color: #7a5c3a; line-height: 1.7; }
.date-list {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px; max-height: 44vh; overflow-y: auto; padding: 6px 2px;
}
.date-item {
  border: none; background: url('../assets/input-paper.webp') repeat;
  color: #4a2c17; font-family: inherit; font-size: 14px;
  padding: 12px 10px; border-radius: 4px; cursor: pointer; transition: transform .15s;
  box-shadow: 0 1px 2px rgba(74,58,40,.14);
}
.date-item:hover { background: url('../assets/input-paper.webp') repeat; transform: translateY(-2px); box-shadow: 0 4px 10px rgba(74,58,40,.22); }
/* v490：去别处改成两级后，需要一个「返回上一级」的全宽按钮 */
.date-item.date-back { grid-column: 1 / -1; font-size: 13px; padding: 9px 10px; opacity: .85; }
.date-scene { text-align: center; }
.date-place { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 26px; color: #4a2c17; letter-spacing: 4px; }
.date-vibe { font-size: 14.5px; color: #7a5c3a; line-height: 1.9; margin-top: 6px; }
.date-react { font-size: 15.5px; color: #3f2f1d; line-height: 2; margin-top: 8px; padding-top: 10px; border-top: 1px dashed rgba(143,47,33,.3); }
.date-end { font-size: 14px; color: #8a6f4d; font-style: italic; line-height: 1.8; margin-top: 8px; }
.date-gain { font-size: 13px; color: #8f2f21; margin-top: 10px; font-weight: bold; letter-spacing: 1px; }

/* 手机端适配 */
@media (max-width: 768px) {
  .dex-wrap { padding: 12px 12px 30px; }
  .dex-head { gap: 8px; }
  #dex-search { font-size: 16px; max-width: none; }
  .dex-grid { grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 8px; }
  .dex-cname { font-size: 13px; }
  .dex-cep { font-size: 10px; }
  .dex-av { width: 44px; height: 44px; font-size: 20px; }
  .dex-d-head img { max-height: 220px; }
  .dex-d-av { width: 84px; height: 84px; font-size: 36px; }
  .dex-d-desc { font-size: 13.5px; max-height: 26vh; }
  .dex-chat-btn { font-size: 14px; padding: 9px 22px; }
  .date-list { grid-template-columns: repeat(2, 1fr); max-height: 40vh; }
  .date-item { font-size: 13px; padding: 10px 8px; }
  .date-place { font-size: 22px; }
  .date-vibe, .date-react { font-size: 14px; }
  .date-react { line-height: 1.8; }
}


/* ============ 手机端聊天优化（v43） ============ */
/* 聊天顶栏：按钮横排紧凑（约会+立绘+设置），避免纵向堆叠挤掉设置按钮 */
@media (max-width: 768px) {
  .chat-topbar { gap: 6px; padding: 6px 8px; }
  .chat-topbar .btn-back { font-size: 11px; padding: 4px 8px; }
  .chat-actions { flex-direction: row; align-items: center; gap: 3px; }
  .chat-actions .btn-plain { font-size: 10px; padding: 3px 6px; letter-spacing: 0; white-space: nowrap; }
  .chat-head { min-width: 0; flex: 1; }
  .chat-title { font-size: 15px; letter-spacing: 2px; }
  .daily-hint { font-size: 9.5px; }
}

/* 输入时隐藏立绘：键盘弹出后对话框占满剩余空间 */
body.chat-typing .portrait-zone { display: none !important; }
body.chat-typing .chat-conv { margin-top: 0; }
body.chat-typing .chat-stage { justify-content: flex-start; }
/* v300 舞台模式：屏蔽列表模式的 chat-typing 副作用（立绘不隐藏、输入栏不被顶到顶部） */
body.chat-stage-on.chat-typing .portrait-zone { display: block !important; }
body.chat-stage-on.chat-typing .chat-stage { justify-content: center; }
body.chat-stage-on.chat-typing .chat-conv { margin-top: 8px; }

/* ---------- 更小的标签档位 XS（雾雨魔法店等） ---------- */
.marker.size-XS .label { font-size: 5.5px; letter-spacing: 3px; padding: 6px 5px 6px; }
@media (min-width: 769px) {
  .marker.size-XS .label { font-size: 16px; letter-spacing: 5px; padding: 8px 7px 8px; }
}

/* ----------聊天背景图 ---------- */
/* v305 曾因「场景图干扰文字可读性」移除；后来以 ::before + brightness(.68) 压暗的方式恢复
 * （规则在本文件 151 行）。v497 起背景只按「所在地」决定，不再按「她住哪」：
 *   app.v56.js 的 applyPlaceChatBg(state.lastPlaceId) → window.PLACE_BG[placeId]
 * 原按 residence 匹配 assets/chat-bg/*.jpg 的遗留路径已删除（那 7 张图移入 _backup-chat-bg/）。 */
#view-chat { position: relative; }


/* ============ 幻想乡时间系统（v48） ============ */
/* 时间悬浮按钮（右下角，手机桌面都不挤顶栏）；v315：只在地图界面显示 */
.time-fab {
  display: none;
  position: fixed; right: 12px; bottom: 76px; z-index: 950;
  background: rgba(60, 38, 18, .9); color: #f5e9d4;
  border: 1px solid rgba(255, 235, 200, .4);
  font-family: inherit; font-size: 12.5px; letter-spacing: 1px;
  padding: 8px 14px; border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .35); cursor: pointer;
}
body.view-map .time-fab { display: block; }
@media (max-width: 768px) {
  .time-fab { right: 10px; bottom: 70px; font-size: 11px; padding: 7px 11px; }
}

/* 时间弹窗 */
.time-modal { text-align: center; }
.time-info { margin-top: 2px; }
.time-line { font-size: 15px; color: #5a4433; line-height: 1.9; }
.time-tip { font-size: 12px; color: #9b8468; margin-top: 6px; line-height: 1.6; }
.time-btns { display: flex; gap: 8px; justify-content: center; margin-top: 12px; flex-wrap: wrap; }
.time-btn {
  border: 1.5px solid rgba(185, 138, 90, .5); background: rgba(255, 253, 246, .9);
  color: #5a4433; font-family: inherit; font-size: 13px;
  padding: 8px 16px; border-radius: 6px; cursor: pointer; transition: all .18s;
}
.time-btn:hover { background: #fff; transform: translateY(-1px); }

/* ============ 幻想乡日历（月历） ============ */
.cal-box {
  text-align: center;
  /* 背景继承 .pm-box 的 modal-paper.webp（毛边纸），不在此覆盖 */
  max-width: 380px;
  padding: 20px 22px 24px;
}
.cal-now { font-size: 15px; color: #5a4433; letter-spacing: 1px; margin-top: 4px; }
.cal-status { font-size: 12.5px; color: #8a6f4d; letter-spacing: 1px; margin-top: 3px; line-height: 1.6; }
.cal-nav { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 10px 0 8px; }
.cal-month-label { font-size: 17px; color: #4a2c17; letter-spacing: 3px; width: 88px; text-align: center; }
.cal-nav-btn {
  border: 1.5px solid rgba(185, 138, 90, .5); background: rgba(255, 253, 246, .9);
  color: #5a4433; font-family: inherit; font-size: 18px; line-height: 1;
  width: 32px; height: 30px; border-radius: 6px; cursor: pointer; transition: all .18s;
}
.cal-nav-btn:hover { background: #fff; transform: translateY(-1px); }
.cal-nav-btn:disabled { opacity: .35; cursor: default; }

.cal-grid { margin: 0 auto; max-width: 320px; }
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-week-head { margin-bottom: 3px; }
.cal-wk { font-size: 12px; color: #9b8468; padding: 2px 0; letter-spacing: 1px; }
.cal-day {
  font-size: 13px; color: #5a4433; padding: 6px 0; border-radius: 4px;
  cursor: default; line-height: 1;
}
.cal-day-empty { background: transparent; }
.cal-day-today {
  background: rgba(165, 42, 42, .82); color: #fdf3e3; font-weight: bold;
  box-shadow: 0 1px 3px rgba(165, 42, 42, .4);
}
.cal-day-past { color: #7a5c3a; }
.cal-day-future { color: #b8a98f; }
.cal-day-clickable { cursor: pointer; }
.cal-day-clickable:hover { background: rgba(185, 138, 90, .28); }

.cal-legend {
  display: flex; justify-content: center; gap: 14px; margin: 10px 0 2px;
  font-size: 11px; color: #9b8468; letter-spacing: 1px;
}
.cal-legend-today::before { content: '■ '; color: #a52a2a; }
.cal-legend-past::before { content: '■ '; color: #7a5c3a; }
.cal-legend-future::before { content: '■ '; color: #c9bba1; }

.cal-btn { min-width: 78px; }
.cal-tip { margin-top: 8px; }

/* 回忆面板（点过去某天） */
.cal-recall { text-align: left; /* 背景继承 .pm-box 毛边纸 */ }
.cal-recall-list { margin-top: 8px; }
.cal-recall-row {
  font-size: 13.5px; color: #5a4433; line-height: 1.8; padding: 5px 0;
  border-bottom: 1px dashed rgba(143, 47, 33, .16);
}
.cal-recall-row:last-child { border-bottom: none; }
.cal-recall-event { color: #7a4c2e; }
.cal-recall-muted { color: #b09a7c; }
.cal-recall-tip { font-size: 11.5px; color: #9b8468; margin-top: 10px; letter-spacing: 1px; }

/* 角色状态卡：睡眠 / 不在 */
.pm-char-sleep { filter: grayscale(.75) brightness(.92); }
.pm-char-sleep .ep { color: #8a7f6f; }
.pm-char-away { opacity: .75; }
.pm-char-away .ep { color: #8a7f6f; }

/* 提示弹窗（睡觉/不在） */
.pm-tip-box { text-align: center; }
.pm-tip-icon { font-size: 40px; margin-bottom: 4px; }
.pm-tip-text { font-size: 14px; color: #7a5c3a; line-height: 1.8; margin-top: 6px; }

/* 艮之境入口（博丽神社弹框） */
.pm-kokoro {
  display: block; width: 100%; margin: 8px 0 2px;
  border: 1.5px dashed rgba(120, 90, 150, .45);
  background: rgba(245, 240, 255, .55); color: #5a4a7a;
  font-family: inherit; font-size: 13.5px; letter-spacing: 1px;
  padding: 9px 12px; border-radius: 10px; cursor: pointer;
}
.pm-kokoro:hover { background: rgba(235, 225, 255, .85); }

/* ============ 弹框内容超限内部滚动（v49） ============ */
.pm-box { overflow-y: auto; }
.pm-close { position: sticky; top: 10px; right: 14px; float: right; }
.dex-detail { max-height: 80vh; overflow-y: auto; }
@media (max-width: 768px) {
  .dex-detail { max-height: 84vh; }
}


/* ============================================================
 * 约会视图（v50 新增；v488 重构为 galgame 式「绘卷」）
 * ------------------------------------------------------------
 * 设计意图：地点插画铺满整屏不被遮挡，文字内容以「卷轴纸片」浮在上面。
 * 签名元素：对话框是一卷横卷轴 —— 和纸铺开、左右两端竖木轴杆，复用地图
 *           地点标签同一张 scroll-bar-v.webp，让地图与约会页共用卷轴语言。
 * 版式：立绘约 50vh 站在左下方；底部一条细 HUD（状态条 + 找周围 + 行动）；
 *       对话一次一句，点击/空格继续；「行动」点开后是居中的纸片选项菜单。
 * ============================================================ */
#view-date {
  position: fixed;
  inset: 0;
  z-index: 50;
  /* 取不到地点插画时的兜底：旧木桌面底色 */
  background: linear-gradient(180deg, #e0d2b0 0%, #d3c39c 100%);
  height: 100vh;
  overflow: hidden;
  box-sizing: border-box;
}
/* v486：背景 = 该地点所在大地图的插画（date.v4.js 的 applyPlaceBg() 写 --date-bg） */
#view-date.has-bg { background: #241c14; }
#view-date.has-bg::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--date-bg, none) no-repeat center / cover;
  /* v488：风景是主角，只轻微压一点；可读性交给卷轴自己的纸底 + 底部渐隐 */
  filter: brightness(.92) saturate(1);
  pointer-events: none;
  z-index: 0;
}
/* 底部渐隐：只压暗下三分之一，让卷轴与 HUD 压得住，上面留给风景 */
#view-date::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: 0; height: 42vh;
  background: linear-gradient(to bottom, rgba(22,14,7,0) 0%, rgba(22,14,7,.26) 55%, rgba(22,14,7,.46) 100%);
  pointer-events: none;
  z-index: 1;
}

/* ---------- 四角 HUD（小纸签） ---------- */
.date-hud-left,
.date-hud-right {
  position: absolute; top: 0; z-index: 6;
  display: flex; align-items: center; gap: 10px;
  padding: 7px 14px;
  background: url('../assets/input-paper.webp') repeat;
  box-shadow: 0 2px 10px rgba(30,18,8,.28);
}
.date-hud-left { left: 0; border-radius: 0 0 9px 0; }
.date-hud-right { right: 0; border-radius: 0 0 0 9px; flex-direction: column; align-items: flex-end; gap: 3px; padding: 7px 12px; }
.date-head { display: flex; align-items: baseline; gap: 10px; }
.date-title { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 19px; color: #4a2c17; letter-spacing: 1px; }
.date-clock { font-size: 12px; color: #8a6f4d; }
.date-place-name { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 16px; color: #4a2c17; }
.date-place-time { font-size: 11px; color: #8a6f4d; text-align: right; }
.date-route { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; max-width: 34vw; }
.date-route span { font-size: 10.5px; color: #7a5c3a; background: rgba(255,255,255,.4); padding: 1px 7px; border-radius: 3px; white-space: nowrap; }

/* ---------- 换地点：居中标题卡（转场） ---------- */
.date-titlecard {
  position: absolute; left: 0; right: 0; top: 33%; z-index: 5;
  display: flex; justify-content: center;
  pointer-events: none;
  opacity: 0; transition: opacity .55s ease;
}
.date-titlecard.show { opacity: 1; }
.date-titlecard span {
  font-family: 'KaiTi','STKaiti','楷体',serif;
  font-size: clamp(26px, 4.2vw, 46px);
  letter-spacing: .18em; color: #fbf2e0;
  padding: 12px 38px;
  background: rgba(28,18,9,.44);
  border-top: 1px solid rgba(251,242,224,.45);
  border-bottom: 1px solid rgba(251,242,224,.45);
  text-shadow: 0 2px 12px rgba(0,0,0,.55);
}

/* ---------- 主栏 ---------- */
.date-wrap {
  position: relative; z-index: 2;
  display: flex; flex-direction: column;
  height: 100%;
  max-width: min(1340px, 96vw);
  margin: 0 auto;
  padding: 0 4.5% 14px;
  box-sizing: border-box;
}

/* ---------- 场景层：立绘 ---------- */
.date-stage {
  flex: 1; min-height: 0;
  position: relative;
  display: flex; align-items: flex-end; justify-content: flex-start;
  padding-left: 1.5%;
}
.date-char {
  position: relative;          /* 多人切换箭头靠这个定位 */
  height: 100%;
  display: flex; align-items: flex-end; justify-content: center;
}
.date-char img {
  height: min(50vh, 100%);
  width: auto; max-width: 44vw;
  object-fit: contain; object-position: bottom center;
  filter: drop-shadow(0 10px 20px rgba(18,10,4,.5));
}

/* ---------- 对话：横卷轴 ---------- */
.date-scroll {
  flex: none;
  position: relative;
  padding: 0 20px;                 /* 给左右竖轴杆留位 */
  margin-bottom: 10px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.date-scroll-paper {
  position: relative;
  display: flex; flex-direction: column;
  min-height: 21vh; max-height: 33vh;
  padding: 9px 24px 7px;
  /* 用项目通用纸纹 input-paper（100% 不透明、平铺无缝）。
     不用 chat-paper 那张大和纸：它四边有约 6% 的透明毛边，cover 之后可见纸面比容器窄，
     左对齐的台词会有一截压在风景上（实测纸面从 x=218 才开始，文字却在 x=157）。
     上面叠一层暖白渐变，让对话纸成为画面里最亮的一层，和状态条拉开层次。 */
  background:
    linear-gradient(rgba(255,252,244,.44), rgba(255,249,238,.44)),
    url('../assets/input-paper.webp') repeat;
  border-radius: 3px;
  box-shadow: 0 12px 30px rgba(18,10,4,.5), inset 0 0 0 1px rgba(143,47,33,.16);
}
/* 左右两根竖木轴杆（与地图地点标签同一张图） */
.date-scroll::before,
.date-scroll::after {
  content: '';
  position: absolute; top: -7px; bottom: -7px; width: 15px;
  background: url('../assets/scroll-bar-v.webp') no-repeat center / 100% 100%;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,.42));
  pointer-events: none;
}
.date-scroll::before { left: 0; }
.date-scroll::after { right: 0; }
.date-scroll-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  min-height: 24px; padding-bottom: 6px; margin-bottom: 6px;
  border-bottom: 1px solid rgba(143,47,33,.18);
}
.date-speaker {
  font-family: 'KaiTi','STKaiti','楷体',serif;
  font-size: 17px; color: #8f2f21; letter-spacing: .1em;
}
.date-mini {
  border: 1px solid rgba(143,47,33,.22); background: rgba(255,255,255,.34);
  cursor: pointer;
  font-size: 11.5px; color: #8a6f4d;
  padding: 2px 8px; border-radius: 3px;
}
.date-mini:hover { color: #8f2f21; background: rgba(143,47,33,.1); }
.date-line {
  flex: 1; min-height: 0; overflow-y: auto;
  display: flex; flex-direction: column; justify-content: center;
  padding-right: 4px;
}
.date-line .dl {
  font-size: 16px; line-height: 1.95; color: #382818;
  white-space: pre-wrap; word-break: break-word;
}
/* 玩家的话：右对齐 + 暖色，不用气泡也能分清 */
.date-line .dl.me { align-self: flex-end; text-align: right; color: #7d6338; max-width: 82%; }
/* 旁白：居中 + 更淡 */
.date-line .dl.sys { align-self: center; text-align: center; font-size: 13.5px; color: #8a7050; }
.date-scroll-foot {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 4px; margin-top: 4px;
  min-height: 16px;
}
.date-cue { font-size: 12px; color: #8f2f21; opacity: 0; }
.date-cue.show { opacity: 1; animation: dateCue 1.3s ease-in-out infinite; }
@keyframes dateCue { 0%,100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
.date-hint { font-size: 10.5px; color: #b09a7c; }

/* ---------- 底部 HUD：状态条 + 找周围 + 行动 ---------- */
.date-hud { flex: none; display: flex; align-items: stretch; gap: 10px; }
.date-bars {
  flex: 1; min-width: 0;
  display: flex; gap: 14px; align-items: center;
  padding: 7px 14px;
  background: url('../assets/input-paper.webp') repeat;
  border-radius: 4px;
  box-shadow: 0 3px 12px rgba(18,10,4,.3);
}
.date-bar { flex: 1; display: flex; align-items: center; gap: 6px; font-size: 12px; color: #7a5c3a; white-space: nowrap; }
.date-bar .bar { flex: 1; height: 9px; border-radius: 2px; background: rgba(120,90,60,.18); overflow: hidden; }
.date-bar .bar i { display: block; height: 100%; border-radius: 2px; background: #6b8f6b; transition: width .35s; }
.date-bar.mood .bar i { background: #b07a1f; }
.date-bar b { font-size: 11px; color: #8a6f4d; font-weight: normal; }
.date-act-open {
  flex: none; display: flex; align-items: center; gap: 7px;
  border: none; cursor: pointer;
  padding: 0 22px;
  font-family: 'KaiTi','STKaiti','楷体',serif;
  font-size: 17px; color: #4a2c17; letter-spacing: 2px;
  background: url('../assets/modal-paper.webp') no-repeat; background-size: 100% 100%;
  box-shadow: 0 3px 12px rgba(18,10,4,.32);
  transition: transform .15s, box-shadow .15s;
}
.date-act-open:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(18,10,4,.4); }
.date-act-open i { font-style: normal; font-size: 13px; color: #8f2f21; }
/* 「找找周围」沿用 date-lookaround.v1.js 的自注入样式，这里只把它压成 HUD 里的一枚纸片。
   用 3 个 id 提高特异性，压过它自己的 #date-lookaround-btn 规则（width:100% 等）。 */
#view-date #date-lookaround-slot { padding: 0; display: flex; align-items: stretch; }
#view-date #date-lookaround-slot #date-lookaround-btn {
  display: flex; align-items: center;
  width: auto; margin: 0; padding: 0 16px;
  border: 1px solid rgba(185,138,90,.5); border-radius: 4px;
  background: url('../assets/input-paper.webp') repeat;
  color: #7a5c3a; font-size: 13px;
  box-shadow: 0 3px 12px rgba(18,10,4,.28);
}
#view-date #date-lookaround-slot #date-lookaround-btn:hover { color: #8f2f21; }

/* 兼容旧模块：真实日志容器（只当数据落点，不出现在画面上） */
.date-log-sink { display: none; }

/* ---------- 行动选项菜单（居中纸片） ---------- */
.date-actions {
  position: absolute; inset: 0; z-index: 20;
  display: none;
  grid-template-columns: repeat(3, minmax(0, 200px));
  align-content: center; justify-content: center;
  gap: 11px;
  padding: 8vh 6vw;
  background: rgba(18,12,6,.5);
  overflow-y: auto;
  box-sizing: border-box;
}
.date-actions.open { display: grid; animation: fadeIn .2s ease; }
.date-act {
  border: none; cursor: pointer;
  padding: 13px 10px; border-radius: 3px;
  font-family: 'KaiTi','STKaiti','楷体',serif;
  font-size: 15.5px; color: #4a2c17; line-height: 1.4;
  background: url('../assets/input-paper.webp') repeat;
  box-shadow: 0 5px 16px rgba(0,0,0,.34);
  transition: transform .15s, box-shadow .15s;
}
.date-act:hover { transform: translateY(-2px); box-shadow: 0 9px 22px rgba(0,0,0,.42); }
.date-act:disabled { opacity: .42; cursor: not-allowed; transform: none; box-shadow: 0 3px 10px rgba(0,0,0,.22); }
/* 「去别处」「送她回家」用墨色区分，不用 hue-rotate
   —— 原来的 hue-rotate 会把这枚米色纸片整块染成亮蓝/暗红，和纸的主题冲突 */
.date-act.move { color: #3f6b47; box-shadow: 0 5px 16px rgba(0,0,0,.34), inset 0 0 0 1px rgba(63,107,71,.45); }
.date-act.end { color: #8f2f21; box-shadow: 0 5px 16px rgba(0,0,0,.34), inset 0 0 0 1px rgba(143,47,33,.45); }

/* ---------- 回顾（backlog） ---------- */
.date-backlog {
  position: absolute; inset: 0; z-index: 24;
  display: none; align-items: center; justify-content: center;
  padding: 5vh 5vw;
  background: rgba(18,12,6,.52);
}
.date-backlog.open { display: flex; animation: fadeIn .2s ease; }
.date-backlog-box {
  width: min(760px, 94vw); max-height: 82vh;
  display: flex; flex-direction: column;
  padding: 14px 18px;
  background:
    linear-gradient(rgba(255,252,244,.44), rgba(255,249,238,.44)),
    url('../assets/input-paper.webp') repeat;
  border-radius: 3px;
  box-shadow: 0 16px 44px rgba(0,0,0,.5), inset 0 0 0 1px rgba(143,47,33,.16);
  box-sizing: border-box;
}
.date-backlog-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding-bottom: 8px; margin-bottom: 8px;
  border-bottom: 1px solid rgba(143,47,33,.18);
}
.date-backlog-title { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 17px; color: #4a2c17; }
.date-backlog-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 9px; }
.date-backlog-list .dl { font-size: 14px; line-height: 1.85; color: #3f2f1d; white-space: pre-wrap; word-break: break-word; }
.date-backlog-list .dl.me { text-align: right; color: #7d6338; }
.date-backlog-list .dl.sys { text-align: center; font-size: 12.5px; color: #8a7050; }
.date-backlog-empty { text-align: center; color: #8a7050; font-size: 13px; padding: 22px 0; }

/* ---------- 结算弹窗复用（原样保留） ---------- */
.date-confirm { display: flex; gap: 10px; justify-content: center; margin-top: 12px; }
.date-confirm .date-item { flex: 1; max-width: 180px; }
.date-confirm .date-item.home { background: url('../assets/input-paper.webp') repeat; filter: sepia(.6) saturate(.9); }
.date-scene { text-align: center; }
.date-place { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 26px; color: #4a2c17; margin-top: 4px; }
.date-vibe { font-size: 14.5px; color: #7a5c3a; line-height: 1.9; margin-top: 6px; }
.date-react { font-size: 15.5px; color: #3f2f1d; line-height: 2; margin-top: 8px; padding: 10px 12px; background: url('../assets/input-paper.webp') repeat; border-radius: 3px; }
.date-gain { font-size: 13px; color: #8f2f21; margin-top: 10px; font-weight: bold; letter-spacing: 1px; }

@media (max-width: 768px) {
  .date-hud-left, .date-hud-right { padding: 5px 9px; gap: 7px; }
  .date-title { font-size: 15px; }
  .date-clock { font-size: 10.5px; }
  .date-place-name { font-size: 13.5px; }
  .date-place-time { font-size: 10px; }
  .date-route { max-width: 40vw; }
  .date-route span { font-size: 9.5px; }
  .date-wrap { padding: 0 3% 10px; }
  .date-char img { height: min(42vh, 100%); max-width: 58vw; }
  .date-scroll { padding: 0 14px; margin-bottom: 8px; }
  .date-scroll-paper { min-height: 20vh; max-height: 40vh; padding: 7px 14px 5px; }
  .date-scroll::before, .date-scroll::after { width: 10px; top: -5px; bottom: -5px; }
  .date-speaker { font-size: 15px; }
  .date-line .dl { font-size: 14px; line-height: 1.85; }
  .date-hint { display: none; }
  .date-bars { padding: 5px 9px; gap: 9px; }
  .date-bar { font-size: 11px; gap: 4px; }
  .date-act-open { font-size: 15px; padding: 0 14px; letter-spacing: 1px; }
  #view-date #date-lookaround-slot #date-lookaround-btn { padding: 0 11px; font-size: 12px; }
  .date-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 6vh 5vw; }
  .date-act { font-size: 13.5px; padding: 11px 8px; }
  .date-titlecard span { font-size: 23px; padding: 9px 20px; }
  .date-backlog-box { padding: 11px 13px; }
  .date-backlog-list .dl { font-size: 13px; }
}

/* ---------- 闲聊对话框（v51 新增：自由对话） ---------- */
.talk-modal { z-index: 60; }
.talk-box { max-width: min(560px, 92vw); display: flex; flex-direction: column; gap: 8px; text-align: left; }
.talk-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.talk-title { font-family: 'KaiTi','STKaiti','楷体',serif; font-size: 17px; color: #4a2c17; }
.talk-close { position: static; margin-left: auto; }
.talk-tip { font-size: 12px; color: #9b8468; background: rgba(185,138,90,.1); border-radius: 8px; padding: 6px 10px; line-height: 1.6; }
.talk-msgs { height: min(38vh, 300px); overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 6px 2px; }
.tmsg { max-width: 82%; padding: 8px 11px; border-radius: 10px; font-size: 14px; line-height: 1.7; color: #5a4433; background: rgba(255,255,255,.7); white-space: pre-wrap; word-break: break-word; }
.tmsg.me { align-self: flex-end; background: rgba(224,168,79,.18); }
.tmsg.sys { align-self: center; max-width: 95%; font-size: 12px; color: #9b8468; background: transparent; }
.talk-inputbar { display: flex; gap: 8px; align-items: flex-end; }
.talk-input {
  flex: 1; resize: none; border: 1.5px solid #c9a06a; border-radius: 10px;
  background: #fffdf6; color: #4a2c17; font-size: 16px; padding: 8px 10px;
  outline: none; line-height: 1.5; max-height: 96px; font-family: inherit;
}
.talk-send { flex-shrink: 0; }
.talk-end { align-self: center; width: auto; }
@media (max-width: 768px) {
  .talk-box { max-width: 94vw; }
  .talk-msgs { height: min(36vh, 260px); }
  .tmsg { font-size: 13.5px; }
}

/* ============ 开始界面 ============ */
#view-start {
  position: fixed; inset: 0; z-index: 9999;
  overflow: hidden;
  background: #1f0d0a;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  transition: opacity .65s ease;
}
/* v238：背景鸟居用 320px 低清图 + pixelated 像素放大，实现"老东西低清糊" */
#view-start::before {
  content: '';
  position: absolute; inset: 0;
  background: url('../assets/torii-bg.webp') no-repeat center bottom / cover;
  image-rendering: pixelated;
  pointer-events: none;
}
/* 横屏（电脑端）：换横向扩展版鸟居，避免左右大片留白 */
@media (min-aspect-ratio: 4/3) {
  #view-start::before {
    background-image: url('../assets/torii-bg-wide.webp');
    background-size: cover;
    background-position: center center;
  }
}
#view-start.hide { opacity: 0; pointer-events: none; }
body.start-open { overflow: hidden; }

/* 朦胧满月（已移除，改为纯鸟居焦点） */
.start-moon {
  display: none;
}

/* v403：标题背景/装饰层一律不接点击，避免盖住菜单导致“能看不能点” */
#view-start .start-sky,
#view-start .start-mist,
#view-start .start-far-hill,
#view-start .start-petals,
#view-start::before {
  pointer-events: none !important;
}

.start-sky {
  position: absolute; inset: 0;
  background:
    radial-gradient(90% 55% at 50% 30%, rgba(255, 200, 190, .14), transparent 70%),
    radial-gradient(70% 40% at 50% 60%, rgba(120, 40, 35, .3), transparent 75%);
}
.start-sun {
  position: absolute; top: 6%; left: 50%; transform: translateX(-50%);
  width: 40vmin; height: 40vmin; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 224, 150, .9) 0%, rgba(232, 178, 90, .45) 46%, rgba(232, 178, 90, 0) 70%);
}
/* 底部雾气（景深） */
.start-mist {
  position: absolute; bottom: 0; left: -10%; right: -10%; height: 30%; z-index: 1; pointer-events: none;
  background:
    radial-gradient(50% 100% at 30% 100%, rgba(200, 170, 165, .25), transparent 70%),
    radial-gradient(55% 110% at 70% 100%, rgba(200, 170, 165, .2), transparent 70%),
    linear-gradient(180deg, rgba(40, 15, 12, 0), rgba(40, 15, 12, .5) 100%);
}
.start-far-hill {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background:
    radial-gradient(52% 130% at 12% 100%, rgba(20, 10, 8, .6), transparent 72%),
    radial-gradient(60% 150% at 88% 100%, rgba(20, 10, 8, .55), transparent 70%),
    linear-gradient(180deg, rgba(15, 8, 6, 0) 0%, rgba(15, 8, 6, .55) 78%);
}
/* 鸟居已作为整屏背景融入（见 #view-start 背景），此选择器废弃 */
/* 松树剪影（两侧平衡） */
.start-tree { position: absolute; bottom: 5%; z-index: 1; pointer-events: none; }
.start-tree.l { left: 2%; }
.start-tree.r { right: 2%; transform: scaleX(-1); }
.start-tree::before {
  content: ''; display: block; width: 36vmin; height: 30vmin;
  background:
    radial-gradient(ellipse 55% 42% at 50% 14%, rgba(20, 12, 18, .6) 0%, transparent 62%),
    radial-gradient(ellipse 62% 44% at 50% 34%, rgba(20, 12, 18, .58) 0%, transparent 64%),
    radial-gradient(ellipse 70% 46% at 50% 56%, rgba(20, 12, 18, .52) 0%, transparent 66%),
    radial-gradient(ellipse 44% 40% at 50% 76%, rgba(22, 13, 18, .5) 0%, transparent 60%);
}
.start-content { position: absolute; top: 8%; left: 6%; z-index: 3; text-align: left; }
.start-sub {
  font-family: 'GuoBeiTitle', 'WenKaiTitle', 'KaiTi', 'STKaiti', serif;
  font-size: clamp(12px, 2.2vmin, 14px); letter-spacing: .34em; text-indent: .34em;
  color: rgba(255, 245, 240, .92); text-shadow: 0 1px 3px rgba(0, 0, 0, .8), 0 0 1px #000;
  margin-bottom: 10px;
}
.start-title {
  font-family: 'GuoBeiTitle', 'WenKaiTitle', 'KaiTi', 'STKaiti', 'STSong', 'SimSun', serif;
  font-size: clamp(54px, 12vmin, 104px); line-height: 1.05;
  color: #fff;
  letter-spacing: .14em; margin: 0;
  filter: url(#pixel-text);
  text-shadow:
    -2px -2px 0 #2a0f0c, 2px -2px 0 #2a0f0c, -2px 2px 0 #2a0f0c, 2px 2px 0 #2a0f0c,
    0 3px 0 #2a0f0c, 0 6px 18px rgba(0, 0, 0, .7);
}
.start-menu { position: absolute; right: 9%; top: 50%; transform: translateY(-50%); z-index: 3; display: flex; flex-direction: column; align-items: flex-start; gap: 0.6vh; filter: url(#pixel-text); }
/* 千禧风浮空字菜单：无边框无底色，香蕉体，左对齐，整列逐项向左阶梯偏移 */
.start-btn {
  font-family: 'GuoBeiTitle', 'XiangJiaoMenu', 'KaiTi', serif;
  font-size: 7.5vh; letter-spacing: .1em;
  line-height: 1.25;
  padding: 0; border: none; background: none;
  color: #f2e6da;
  cursor: pointer; transition: color .15s ease, transform .15s ease;
  text-align: left;
  text-shadow: 0 1px 3px rgba(0,0,0,.85);
  position: relative;
  white-space: nowrap;
}
/* 奶茶为锚点(0)，上方逐项靠右，下方逐项靠左(向「幻想乡」标题方向偏移) */
.start-btn:nth-child(1) { margin-left: 4vh; }
.start-btn:nth-child(2) { margin-left: 3vh; }
.start-btn:nth-child(3) { margin-left: 1.5vh; }
.start-btn:nth-child(4) { margin-left: 0; }
.start-btn:nth-child(5) { margin-left: -2vh; }
.start-btn:nth-child(6) { margin-left: -4vh; }
.start-btn:hover { color: #fff; transform: translateX(-0.4vh); }
.start-btn.begin { color: #fff; }
.start-foot {
  position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
  padding: 6px 18px; border-radius: 6px; max-width: min(92vw, 720px); word-break: break-all; overflow-wrap: anywhere; text-align: center;
  background: rgba(20, 10, 14, .32);
  font-size: 12px; letter-spacing: .22em; color: rgba(255, 248, 234, .88);
  text-shadow: 0 1px 4px rgba(0, 0, 0, .6); z-index: 2;
}
/* 请作者喝杯奶茶（开始界面小胶囊，位于页脚上方） */
.start-links {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 54px;
  z-index: 2; display: flex; gap: 10px;
}
.donate-btn {
  border: none; cursor: pointer; font-family: inherit;
  padding: 5px 16px; border-radius: 6px;
  background: rgba(20, 10, 14, .32); color: rgba(255, 248, 234, .92);
  font-size: 12px; letter-spacing: .12em;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .6);
  transition: background .2s, transform .2s;
}
.donate-btn:hover { background: rgba(58, 30, 26, .6); transform: scale(1.05); }
.donate-box { text-align: center; }
#modal-donate { z-index: 10000; } /* 开始界面 z-index:9999，弹窗必须更高否则被盖住 */
.donate-box h3 { margin-bottom: 2px; }
.donate-tip { font-size: 13px; color: var(--ink-soft); margin: 0 0 12px; }
.donate-box img { width: min(220px, 60vw); display: block; margin: 0 auto; border-radius: 12px; }
.donate-box .modal-actions { justify-content: center; margin-top: 14px; }
#modal-green { z-index: 10000; }
#modal-tutorial { z-index: 10000; }
.green-box { text-align: center; }
.green-box h3 { margin-bottom: 2px; }
.green-tip { font-size: 13px; color: var(--ink-soft); margin: 0 0 8px; line-height: 1.7; }
.green-dl { display: inline-block; margin: 6px 0 4px; padding: 9px 20px; border-radius: 6px; background: var(--accent); color: #fff; text-decoration: none; font-size: 13.5px; letter-spacing: .1em; }
.green-dl:hover { filter: brightness(1.1); }
.green-note { font-size: 12px; color: #b3541e; background: rgba(179,84,30,.08); border-radius: 8px; padding: 8px 10px; margin-top: 6px; text-align: left; line-height: 1.6; }
/* 花瓣 */
.start-petals { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }
.petal {
  position: absolute; top: -4%;
  width: 11px; height: 11px; border-radius: 60% 0 60% 0;
  background: linear-gradient(135deg, rgba(255, 214, 222, .95), rgba(255, 190, 205, .8));
  box-shadow: 0 0 6px rgba(255, 200, 215, .5);
  animation: petalFall linear 28s infinite; opacity: 0;
}
@keyframes petalFall {
  0% { transform: translate3d(0, -4vh, 0) rotate(0deg); opacity: 0; }
  6% { opacity: .9; }
  100% { transform: translate3d(-10vw, 112vh, 0) rotate(200deg); opacity: 0; }
}
/* 移动端微调 */
@media (max-width: 768px) {
  .start-torii { bottom: -2%; width: min(110vmin, 600px); opacity: .95; }
  .start-orb { top: 5.5%; width: clamp(52px, 11vmin, 80px); }
  .start-content { margin-top: 9vmin; margin-bottom: 5vmin; }
  .start-tree::before { width: 44vmin; height: 30vmin; }
  .start-menu { gap: 0.4vh; right: 5%; top: 56%; }
  .start-btn { font-size: 4.5vh; }
  .start-links { bottom: 58px; }
  .donate-btn { font-size: 11px; padding: 4px 14px; }
  .start-foot { font-size: 10px; bottom: 26px; padding: 4px 10px; letter-spacing: .12em; }
}

/* ============ 存档/读档弹层 ============ */
.slot-modal {
  z-index: 10001;
  background: rgba(16, 10, 14, .42);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.slot-box { width: min(460px, 92vw); gap: 12px; padding-left: 34px; padding-right: 34px; }
.slot-head { display: flex; align-items: center; justify-content: space-between; }
.slot-title {
  font-family: 'KaiTi', 'STKaiti', serif; font-size: 22px; color: #4a2c17;
  letter-spacing: .35em; text-indent: .35em;
}
.slot-close { position: static; margin-left: auto; }
.slot-tip { font-size: 13px; color: #5d4a36; margin: 2px 0 6px; }
.slot-divider { border: none; border-top: 1px solid rgba(185, 138, 90, .35); margin: 0 0 4px; }
.slot-switch { display: flex; justify-content: center; margin-top: 4px; }
.slot-switch-btn {
  font-family: 'KaiTi', 'STKaiti', serif; font-size: 13px; color: #7d6850;
  background: none; border: 1px solid rgba(185, 138, 90, .5); border-radius: 6px;
  padding: 5px 18px; cursor: pointer; transition: all .2s;
}
.slot-switch-btn:hover { background: rgba(185, 138, 90, .14); color: #4a2c17; }
.btn-mini { padding: 6px 9px !important; font-size: 13px !important; }
/* 手机端顶栏适配：8 个选项排成两行、每行 4 个 */
@media (max-width: 768px) {
  .topbar { padding: 10px 12px; gap: 6px; }
  .topbar .actions { grid-template-columns: repeat(5, 1fr); gap: 6px; width: 100%; }
  .topbar .btn-plain { padding: 7px 6px; font-size: 12px; }
  .chat-topbar { gap: 8px; padding: 10px 12px; }
  .chat-topbar .chat-actions { gap: 5px; }
}
.slot-list { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.slot-item {
  display: flex; align-items: center; gap: 11px; width: 100%;
  padding: 10px 12px; border-radius: 11px; cursor: pointer; text-align: left;
  border: 1.5px solid rgba(185, 138, 90, .6); background: rgba(255, 250, 238, .82);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  transition: all .2s; font-family: inherit;
}
.slot-item:hover { border-color: #a8754a; background: rgba(255, 253, 246, .96); box-shadow: 0 4px 14px rgba(74, 58, 40, .18); transform: translateY(-1px); }
.slot-item.empty { opacity: .7; border-style: dashed; }
.slot-no {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'KaiTi', serif; font-size: 16px; color: #fff;
  background: linear-gradient(135deg, #b03a2e, #d4683a);
  box-shadow: 0 2px 8px rgba(150, 50, 35, .4);
}
.slot-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.slot-main b { font-size: 14.5px; color: #4a2c17; font-weight: 600; }
.slot-meta { font-size: 11.5px; color: #5d4a36; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.slot-empty { font-size: 14px; color: #8d7860; }
.slot-empty::before { content: '＋ '; color: #b98a5a; }
/* 确认弹窗 */
.confirm-box { width: min(340px, 88vw); padding: 24px 26px 20px; }
.confirm-msg { font-size: 15px; line-height: 1.8; color: #4a2c17; text-align: center; margin: 0 0 16px; }
.confirm-actions { display: flex; justify-content: center; gap: 14px; }

/* ============ 顶部提示 ============ */
#start-toast {
  position: fixed; top: 18px; left: 50%; transform: translateX(-50%) translateY(-8px);
  z-index: 10002; padding: 10px 22px; border-radius: 6px;
  background: rgba(74, 44, 23, .92); color: #fff6e6; font-size: 14px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .35); opacity: 0; pointer-events: none;
  transition: all .3s ease; white-space: nowrap;
}
#start-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ============ 手机端顶栏修复（v54） ============ */
@media (max-width: 768px) {
  /* 角色名禁止换行（防止被挤成竖排） */
  #chat-name { white-space: nowrap; }
  /* 状态栏允许换行并精简边距，不再省略号截断 */
  .daily-hint { white-space: normal; overflow: visible; text-overflow: clip; padding: 0 4px; text-align: left; }
  /* 顶栏两行布局：第一行 返回+角色信息（全宽），第二行 操作按钮 */
  .chat-topbar { flex-wrap: wrap; gap: 6px 8px; }
  .chat-head { flex: 1 1 200px; min-width: 0; }
  .chat-actions { flex: 1 1 100%; justify-content: flex-end; }
  /* 立绘切换按钮保留（短文字"半身/全身"由JS设置） */
  .chat-actions #btn-toggle-portrait-chat { font-size: 11px; padding: 3px 7px; letter-spacing: 0; }
}

/* ======== T-04 立绘情绪氛围差分（无素材，纯前端） v3 ======== */
/* 动画/位移作用于立绘框整体（.portrait-zone），img 不直接 transform：
   避免 object-fit img 在部分浏览器 transform 时缩小/露裁切边缘 */
body.em-talking .portrait-zone { animation: emBreathe 3s ease-in-out infinite; }
body.em-low .portrait-zone { animation: none; } /* 低落时静止 */
body.em-settle .portrait-zone { transition: transform .6s ease; }
body.em-settle #chat-portrait { transition: filter .6s ease; }
@keyframes emBreathe {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
/* 开心：节制微暖（v224 去框后改用 filter 贴合人物，透明区不染）。
   与低落「冷+压暗」正反对应：轻微提饱和 + 提亮 + 一点暖黄。 */
body.em-happy .portrait-zone {
  box-shadow: none;
}
body.em-happy #chat-portrait { filter: sepia(.18) saturate(1.08) brightness(1.06) sepia(.1) hue-rotate(4deg); }
/* 低落：轻冷调遮罩 + 降饱和 + 整体轻下压。
   v223：冷色不再用容器级 ::before（去框后会染成整块正方形），
   而是把冷色调合并进立绘 img 的 filter——filter 只作用于图片像素，
   透明区 alpha=0 不会显色，冷色仅贴着人物轮廓。 */
body.em-low #chat-portrait { filter: sepia(.18) saturate(.6) brightness(.9) hue-rotate(-6deg) sepia(.14); }
body.em-low .portrait-zone {
  transform: translateY(4px);
  box-shadow: none;
}
body.em-low-self .portrait-zone { animation: none; } /* v137 角色自身低落（AI 标签） */
body.em-low-self #chat-portrait { filter: sepia(.18) saturate(.6) brightness(.9) hue-rotate(-6deg) sepia(.14); }
body.em-low-self .portrait-zone {
  transform: translateY(4px);
  box-shadow: none;
}
/* 害羞：脸颊红晕（淡，柔和） */
.portrait-zone::after {
  content: ''; position: absolute; left: 50%; top: 24%; width: 56%; height: 15%;
  transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(255,88,88,.22), rgba(255,88,88,0) 70%);
  opacity: 0; pointer-events: none; transition: opacity .6s ease; z-index: 2;
}
body.em-shy .portrait-zone::after { opacity: 1; }
/* 全身模式：脸在立绘上部更高位置 */
body.portrait-full .portrait-zone::after { top: 13%; }


@media (max-width: 768px) {
  .footer { font-size: 10px; letter-spacing: .4px; padding: 14px 6px 18px; }
}

/* ============ 减少动态偏好（可访问性） ============ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}