:root{
  --bg:#0b1f1b; --bg2:#0e2a24; --panel:#f3ecd9; --panel2:#efe4c8;
  --gold:#d8b25c; --gold2:#f0d795; --ink:#3b2f1e; --ink2:#6b5b3e;
  --leaf:#d4622e; --teal:#1d4a44; --txt:#f2ecdc; --dim:#cfc7ae;
  --green:#79c9a3; --red:#c8552c;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{background:#060d0b;font-family:"Noto Serif SC","Source Han Serif SC",KaiTi,STKaiti,serif;color:var(--txt);overflow:hidden}
#app{position:relative;max-width:430px;height:100dvh;margin:0 auto;background:linear-gradient(180deg,#0b1f1b 0%,#0e2a24 55%,#0a1c18 100%);overflow:hidden;box-shadow:0 0 60px rgba(0,0,0,.8)}
.page{position:absolute;inset:0;display:none;flex-direction:column;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
.page::-webkit-scrollbar{display:none}
.page.active{display:flex;animation:fadein .45s ease}
@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- 顶部栏 ---------- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:linear-gradient(180deg,rgba(6,13,11,.9),rgba(6,13,11,.55) 70%,transparent);backdrop-filter:blur(4px)}
.iconbtn{width:34px;height:34px;border-radius:50%;border:1px solid rgba(233,226,207,.35);background:rgba(10,26,22,.55);color:var(--txt);display:flex;align-items:center;justify-content:center;font-size:17px;cursor:pointer;transition:.2s}
.iconbtn:active{transform:scale(.92)}
.capsule{display:flex;align-items:center;gap:10px;border:1px solid rgba(233,226,207,.3);border-radius:16px;padding:4px 12px;font-size:13px;color:var(--dim);background:rgba(10,26,22,.55)}
.pagetitle{position:absolute;left:50%;transform:translateX(-50%);font-size:16px;letter-spacing:2px;color:var(--txt)}

/* ---------- 通用组件 ---------- */
.btn{display:block;margin:0 auto;border:none;cursor:pointer;font-family:inherit;letter-spacing:6px;text-indent:6px;font-size:18px;padding:13px 46px;border-radius:8px;color:#fff;transition:.2s;position:relative}
.btn:active{transform:scale(.96)}
.btn-gold{background:linear-gradient(135deg,#c9963a,#e8c576 45%,#b8842e);color:#4a3208;font-weight:700;box-shadow:0 4px 18px rgba(216,178,92,.35),inset 0 0 0 1px rgba(255,244,214,.6)}
.btn-red{background:linear-gradient(135deg,#b03a20,#d4663a);color:#ffe9d8;font-weight:700;box-shadow:0 4px 16px rgba(200,85,44,.4),inset 0 0 0 1px rgba(255,220,190,.4)}
.btn-ghost{background:linear-gradient(135deg,#8a6d2f,#c5a254);color:#3d2c05;font-weight:700}
.btn:disabled{filter:grayscale(.8);opacity:.5;cursor:not-allowed}
.paper{background:linear-gradient(160deg,#f6efdd,#eadcb8);color:var(--ink);border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.45),inset 0 0 0 1px rgba(148,116,60,.25);position:relative}
.paper::before{content:"";position:absolute;inset:6px;border:1px solid rgba(148,116,60,.3);border-radius:10px;pointer-events:none}
.toast{position:fixed;left:50%;bottom:16%;transform:translateX(-50%) translateY(20px);background:rgba(12,26,22,.92);border:1px solid var(--gold);color:var(--gold2);padding:10px 22px;border-radius:24px;font-size:14px;letter-spacing:1px;opacity:0;transition:.3s;z-index:99;pointer-events:none;max-width:80%;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.goldtext{background:linear-gradient(180deg,#f6e3a8,#d8b25c 55%,#a87d2e);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- 封面 ---------- */
#page-cover{justify-content:flex-end}
.cover-bg{position:absolute;inset:0;background:url("img/cover.jpg") center/cover no-repeat}
.cover-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,14,12,.72) 0%,rgba(6,14,12,.05) 38%,rgba(6,14,12,.1) 60%,rgba(6,14,12,.88) 100%)}
.cover-top{position:relative;z-index:2;text-align:center;padding-top:9dvh;animation:fadein 1s ease}
.cover-title{font-size:30px;font-size:7.6vw;font-weight:900;letter-spacing:2px;white-space:nowrap;text-shadow:0 2px 0 #7a5416,0 6px 18px rgba(0,0,0,.6)}
.cover-sub{margin-top:10px;display:inline-flex;align-items:center;gap:10px;font-size:16px;letter-spacing:6px;color:#e8d9a8}
.cover-sub::before,.cover-sub::after{content:"";width:44px;height:1px;background:linear-gradient(90deg,transparent,#c9ab63)}
.cover-sub::after{background:linear-gradient(90deg,#c9ab63,transparent)}
.cover-tag{margin-top:8px;font-size:12px;letter-spacing:4px;color:rgba(233,226,207,.75)}
.cover-bottom{position:relative;z-index:2;text-align:center;padding:0 30px 6dvh}
.cover-info{font-size:12px;color:rgba(233,226,207,.55);letter-spacing:2px;margin-top:16px;line-height:1.9}
.cover-icp{position:relative;z-index:2;text-align:center;font-size:11px;line-height:1.8;letter-spacing:.5px;margin-top:8px;color:rgba(233,226,207,.55)}
.cover-icp a{color:inherit;text-decoration:none;display:inline-block;padding:6px 8px;min-height:24px}
.float-leaf{position:absolute;z-index:1;font-size:20px;opacity:0;animation:fall 9s linear infinite}
@keyframes fall{0%{transform:translate(0,-8dvh) rotate(0);opacity:0}8%{opacity:.85}100%{transform:translate(-40px,105dvh) rotate(320deg);opacity:0}}

/* ---------- 序章 ---------- */
.pro-wrap{flex:1;display:flex;flex-direction:column;justify-content:center;padding:70px 22px 30px}
.pro-card{padding:30px 24px;line-height:2.15;font-size:15px;text-align:justify}
.pro-card p{margin-bottom:14px;text-indent:2em}
.pro-card p:last-child{margin-bottom:0}
.pro-card .hl{color:var(--red);font-weight:700}
.pro-title{text-align:center;font-size:20px;letter-spacing:4px;color:#8a6d2f;margin-bottom:16px;font-weight:700}
.pro-actions{text-align:center;margin-top:26px}
.enter-btn{display:inline-block;background:linear-gradient(135deg,#c9963a,#e8c576 45%,#b8842e);color:#4a3208;font-weight:800;font-size:17px;letter-spacing:8px;text-indent:8px;padding:12px 44px;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);cursor:pointer;box-shadow:0 4px 18px rgba(216,178,92,.4)}
.enter-btn:active{transform:scale(.96)}
.page-dots{display:flex;justify-content:center;gap:8px;margin-top:22px}
.page-dots i{width:7px;height:7px;border-radius:50%;background:rgba(233,226,207,.3)}
.page-dots i.on{background:var(--gold)}

/* ---------- 设置（姓名/阵营） ---------- */
.setup-wrap{flex:1;display:flex;flex-direction:column;justify-content:center;padding:70px 26px 30px}
.setup-title{text-align:center;font-size:17px;letter-spacing:3px;margin-bottom:34px;color:var(--txt)}
.setup-steps{display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:38px;font-size:13px;color:var(--dim)}
.setup-steps .num{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(233,226,207,.15);margin-right:6px;font-size:12px}
.setup-steps .num.on{background:var(--gold);color:#3d2c05;font-weight:700}
.setup-steps .dash{width:46px;height:1px;background:repeating-linear-gradient(90deg,var(--dim) 0 4px,transparent 4px 8px);opacity:.5}
.name-input{display:block;width:100%;max-width:290px;margin:0 auto 36px;padding:14px 20px;border-radius:28px;border:1.5px solid rgba(233,226,207,.5);background:rgba(243,236,217,.12);color:var(--txt);font-size:17px;font-family:inherit;text-align:center;letter-spacing:2px;outline:none}
.name-input:focus{border-color:var(--gold);box-shadow:0 0 14px rgba(216,178,92,.3)}
.team-grid{display:flex;justify-content:center;gap:22px;margin-bottom:34px}
.team-card{width:132px;border-radius:12px;padding:20px 10px 14px;text-align:center;cursor:pointer;transition:.2s;border:2px solid transparent;background:linear-gradient(160deg,#a02c1a,#c8452a)}
.team-card.t2{background:linear-gradient(160deg,#155a4e,#1f7a68)}
.team-card .seal{width:76px;height:76px;margin:0 auto 10px;border-radius:50%;border:2px solid rgba(240,215,149,.9);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 14px rgba(240,215,149,.35)}
.team-card .seal span{writing-mode:vertical-rl;font-size:22px;font-weight:900;color:#f0d795;letter-spacing:4px}
.team-card .tname{color:#f0d795;font-size:15px;letter-spacing:2px}
.team-card .tdesc{color:rgba(243,236,217,.75);font-size:11px;margin-top:6px;line-height:1.7}
.team-card.sel{border-color:var(--gold2);box-shadow:0 0 20px rgba(216,178,92,.55);transform:translateY(-4px)}
.setup-nav{display:flex;justify-content:center;gap:18px}

/* ---------- 板块大厅 ---------- */
.board-wrap{flex:1;padding:6px 18px 30px}
.user-strip{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:linear-gradient(140deg,rgba(29,74,68,.8),rgba(14,42,36,.9));border:1px solid rgba(216,178,92,.35);margin-bottom:16px}
.avatar{width:52px;height:52px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:900;color:#3d2c05;background:linear-gradient(135deg,#e8c576,#c9963a);border:2px solid rgba(255,244,214,.7)}
.user-strip .uname{font-size:17px;letter-spacing:2px;font-weight:700}
.user-strip .uteam{font-size:12px;color:var(--dim);margin-top:3px;letter-spacing:1px}
.rank-line{margin-left:auto;text-align:right}
.rank-badge{display:inline-block;padding:4px 12px;border-radius:14px;font-size:13px;letter-spacing:2px;font-weight:700;color:#3d2c05;background:linear-gradient(135deg,#e8c576,#c9963a);box-shadow:0 2px 10px rgba(216,178,92,.4)}
.rank-next{font-size:11px;color:var(--dim);margin-top:5px}
.sect-head{display:flex;align-items:baseline;justify-content:space-between;margin:18px 2px 10px}
.sect-head h3{font-size:16px;letter-spacing:3px;color:var(--gold2)}
.sect-head span{font-size:11px;color:var(--dim)}
.board-card{border-radius:16px;padding:16px;margin-bottom:14px;position:relative;overflow:hidden;border:1px solid rgba(216,178,92,.3);background:linear-gradient(140deg,rgba(22,58,50,.9),rgba(12,32,27,.95));cursor:pointer;transition:.2s}
.board-card:active{transform:scale(.98)}
/* 未解锁卡片：不要用 grayscale + opacity 压暗。
   那会把标题和描述的有效对比度压到 3.6 左右（实测），在深绿底上基本糊成一片。
   改用「降低底色亮度 + 虚化边框 + 降饱和图标」来表达未解锁，文字保持全对比度可读。 */
.board-card.locked{
  cursor:default;
  background:linear-gradient(140deg,rgba(19,42,37,.92),rgba(11,26,22,.96));
  border:1px dashed rgba(216,178,92,.28);
}
.board-card.locked h4{color:#d8d0bc}
.board-card.locked .bplace{color:#bdb59c}
.board-card.locked .bdesc{color:rgba(233,226,207,.72)}
.board-card.locked:active{transform:none}
.board-card .btag{position:absolute;top:0;right:0;font-size:10px;letter-spacing:2px;padding:4px 12px;border-radius:0 14px 0 12px;background:rgba(216,178,92,.9);color:#3d2c05;font-weight:700}
.board-card.locked .btag{background:rgba(120,120,120,.8);color:#eee}
.board-card h4{font-size:19px;letter-spacing:3px;margin-bottom:6px}
.board-card .bplace{font-size:12px;color:var(--dim);letter-spacing:1px}
.board-card .bdesc{font-size:12.5px;color:rgba(233,226,207,.8);margin-top:10px;line-height:1.8}
.board-card .bprog{margin-top:12px;display:flex;align-items:center;gap:10px;font-size:11px;color:var(--dim)}
.pbar{flex:1;height:7px;border-radius:4px;background:rgba(233,226,207,.14);overflow:hidden}
.pbar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#c9963a,#f0d795);transition:width .6s ease}
.rank-table{margin-top:6px;border-radius:14px;border:1px solid rgba(216,178,92,.25);padding:14px 16px;background:rgba(10,26,22,.5)}
.rank-table h4{font-size:14px;letter-spacing:3px;color:var(--gold2);margin-bottom:10px}
.rank-row{display:flex;align-items:center;gap:10px;font-size:12.5px;color:rgba(233,226,207,.85);padding:5px 0}
.rank-row .rr-name{width:80px;letter-spacing:1px}
.rank-row .rr-need{width:80px;color:var(--dim);font-size:11.5px}
.rank-row .rr-now{color:var(--green);font-size:11px}
.reset-line{text-align:center;margin:26px 0 10px;font-size:12px;color:rgba(233,226,207,.55);letter-spacing:1px}
.reset-line span.reset-btn{display:inline-block;padding:7px 18px;margin-left:4px;border:1.5px solid rgba(240,201,135,.5);border-radius:20px;color:#f0c987;background:rgba(240,201,135,.07);cursor:pointer;letter-spacing:2px;transition:.2s}
.reset-line span.reset-btn:active{background:rgba(240,201,135,.22);transform:scale(.96)}
.confirm-btns{display:flex;gap:14px;justify-content:center;margin-top:22px}
.confirm-btns .btn{flex:1;max-width:150px;margin-top:0}
.confirm-btns .btn-ghost{background:transparent;border:1.5px solid rgba(233,226,207,.35);color:rgba(233,226,207,.8)}

/* ---------- 地图 ---------- */
.map-head{padding:2px 18px 12px}
.map-head .mh-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--dim);margin-bottom:8px}
.map-head .mh-row b{color:var(--gold2);font-size:15px;letter-spacing:2px}
.score-chip{display:inline-flex;align-items:center;gap:5px;color:var(--gold2);font-size:14px;font-weight:700}
.score-chip .coin{width:17px;height:17px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f6e3a8,#c9963a);display:inline-block;box-shadow:0 0 8px rgba(216,178,92,.6)}
.map-head .pbar{margin-top:2px}
.map-holder{margin:0 8px;border-radius:16px;overflow:hidden;border:1px solid rgba(216,178,92,.35);box-shadow:0 10px 30px rgba(0,0,0,.5)}
#campusMap{display:block;width:100%;height:auto}
.task-card{margin:14px 18px 0;padding:14px 16px;border-radius:14px;background:linear-gradient(140deg,rgba(29,74,68,.85),rgba(12,32,27,.95));border:1px solid rgba(216,178,92,.4);display:flex;align-items:center;justify-content:space-between;gap:12px}
.task-card .tk-t{font-size:14px;letter-spacing:1px}
.task-card .tk-t small{display:block;color:var(--dim);font-size:11px;margin-top:4px;letter-spacing:0}
.getbtn{flex:none;border:none;cursor:pointer;font-family:inherit;font-size:14px;letter-spacing:2px;padding:9px 18px;border-radius:20px;background:linear-gradient(135deg,#1f8a68,#43c795);color:#04241a;font-weight:800;box-shadow:0 3px 12px rgba(67,199,149,.4)}
.getbtn:active{transform:scale(.94)}
.map-foot{height:26px}

/* 地图节点 */
.mnode{cursor:pointer}
.mnode .nring{transition:.3s;transform-origin:center;transform-box:fill-box}
.mnode.cur .nring{animation:pulse 1.6s ease-out infinite}
@keyframes pulse{0%{opacity:.9;transform:scale(1)}70%{opacity:0;transform:scale(2.1)}100%{opacity:0}}
.mnode text{user-select:none}

/* ---------- 剧情 ---------- */
#page-story{background:var(--story-bg,linear-gradient(180deg,#123128,#0b1f1b))}
.story-stage{flex:1;display:flex;flex-direction:column;justify-content:flex-end;min-height:0;position:relative;overflow:hidden}
.story-deco{position:absolute;inset:0;opacity:.5;background:
 radial-gradient(circle at 80% 12%,rgba(216,178,92,.16),transparent 42%),
 radial-gradient(circle at 14% 30%,rgba(67,199,149,.1),transparent 40%)}
.story-scroll{position:absolute;top:8%;left:50%;transform:translateX(-50%);width:66px;opacity:.9;animation:floaty 4s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-8px)}}
.char-stage{position:relative;text-align:center;margin-bottom:6px}
.char-sil{width:120px;height:150px;margin:0 auto;display:block}
.dlg-box{margin:0 14px 14px;border-radius:16px;padding:16px 16px 14px;min-height:168px;display:flex;flex-direction:column;max-height:460px;max-height:min(48vh,460px);background:linear-gradient(160deg,rgba(9,24,20,.94),rgba(14,42,34,.94));border:1.5px solid rgba(216,178,92,.45);cursor:pointer;position:relative;z-index:2}
.dlg-speaker{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex:none;padding-left:48px}
/* 玩家头像：与角色立绘（林叙等）同大小的人物卡，左下与立绘右下左右对称（用户要求两张头像大小相同）；
   男生/女生玩家头像素材走同一元素同一样式，天然同步 */
.dlg-avatar{position:absolute;bottom:100%;left:16px;width:min(17.5vh,148px);height:min(23vh,195px);border-radius:14px;display:flex;align-items:center;justify-content:center;
  font-size:17px;font-weight:900;color:#0b1f1b;flex:none;overflow:hidden;border:1.5px solid rgba(216,178,92,.5);
  background:linear-gradient(135deg,#d8b25c,#fff8);box-shadow:0 10px 24px rgba(0,0,0,.4);z-index:3}
.dlg-char{flex:1 1 0;min-height:0;position:relative;z-index:1;display:flex;justify-content:center;align-items:flex-end;overflow:hidden;pointer-events:none;opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease}
.dlg-char.show{opacity:1;transform:translateY(0)}
.dlg-char img{max-height:100%;max-width:90%;width:auto;height:auto;display:block;border-radius:14px;-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%);filter:drop-shadow(0 10px 22px rgba(0,0,0,.4))}
/* 角色立绘：立在校名/楼前，靠右下（标注要求把立绘「移到空白区」，林叙那张偏右）*/
.dlg-char:not(.pic){justify-content:flex-end;padding-right:18px}
/* 用户反馈：立绘与玩家头像统一尺寸（两张头像大小相同），共用同一 max-height */
.dlg-char:not(.pic) img{max-height:min(23vh,195px)}
/* 交互行：画面即按钮（点击信封/印章推进剧情） */
.dlg-char.tap{pointer-events:auto;cursor:pointer}
.dlg-char.tap img{animation:tapPulse 1.8s ease-in-out infinite}
@keyframes tapPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
/* 「惠友拾光」账号二维码行（g3 破冰页）：对话区上方横排三张码，
   白底实心卡保证任何背景下都扫得出；第 4 元素=2 时由 story.js 填充 */
.qr-strip{display:none;justify-content:center;gap:12px;padding:2px 18px 10px;flex:none;position:relative;z-index:2}
.qr-strip.show{display:flex}
.qr-card{width:min(30vw,132px);background:linear-gradient(180deg,#fff,#f6efdd);border-radius:14px;padding:9px 8px 7px;text-align:center;box-shadow:0 10px 24px rgba(0,0,0,.4);border:1px solid rgba(216,178,92,.55)}
.qr-card img{width:100%;display:block;border-radius:8px}
.qr-lb{font-size:12px;font-weight:900;color:#3a2c10;margin-top:6px;letter-spacing:2px}
/* 行级画面插图（AI 生成）：剧中文戏转画面，居中铺开，相片卡无底部渐隐 */
.dlg-char.pic img{-webkit-mask-image:none;mask-image:none;border-radius:16px;border:1px solid rgba(216,178,92,.4);box-shadow:0 14px 34px rgba(0,0,0,.45)}
.dlg-name{font-size:15px;letter-spacing:2px;font-weight:700}
.dlg-audio{margin-left:auto;width:86px;height:22px;border-radius:11px;background:linear-gradient(135deg,#c9963a,#e8c576);display:flex;align-items:center;justify-content:center;gap:2px}
.dlg-audio i{width:3px;border-radius:2px;background:#3d2c05;animation:wv 1s ease-in-out infinite}
.dlg-audio i:nth-child(1){height:5px}.dlg-audio i:nth-child(2){height:11px;animation-delay:.15s}.dlg-audio i:nth-child(3){height:8px;animation-delay:.3s}.dlg-audio i:nth-child(4){height:13px;animation-delay:.45s}.dlg-audio i:nth-child(5){height:6px;animation-delay:.6s}
@keyframes wv{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1.3)}}
.dlg-text{font-size:15.5px;line-height:2;min-height:88px;text-align:justify;flex:1 1 auto;min-height:88px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.dlg-next{text-align:center;font-size:11px;color:var(--dim);margin-top:8px;animation:blink 1.4s infinite}
@keyframes blink{0%,100%{opacity:.35}50%{opacity:1}}
.dlg-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 18px 16px;position:relative;z-index:20;flex:none}
.tts-toggle{font-size:12px;color:var(--dim);border:1px solid rgba(233,226,207,.3);border-radius:14px;padding:8px 14px;cursor:pointer;background:rgba(10,26,22,.5);position:relative;z-index:20;pointer-events:auto;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.tts-toggle:active{transform:scale(.94)}
.tts-toggle.on{color:var(--gold2);border-color:var(--gold)}
.dlg-dots{display:flex;gap:5px;justify-content:center;padding-bottom:12px}
.dlg-dots i{width:6px;height:6px;border-radius:50%;background:rgba(233,226,207,.25)}
.dlg-dots i.on{background:var(--gold)}
.emotion-chip{position:absolute;top:66px;left:50%;transform:translateX(-50%);z-index:5;font-size:11px;color:rgba(233,226,207,.7);border:1px solid rgba(233,226,207,.25);border-radius:12px;padding:4px 10px;letter-spacing:1px;background:rgba(10,26,22,.5);max-width:min(72vw,220px);text-align:center;line-height:1.6;white-space:nowrap}

/* ---------- 答题 ---------- */
.quest-wrap{flex:1;display:flex;flex-direction:column;justify-content:center;padding:66px 20px 26px}
.quest-card{border-radius:6px;padding:28px 24px 30px;position:relative;transform:rotate(-.6deg);box-shadow:0 16px 40px rgba(0,0,0,.55)}
.quest-card::before{content:"";position:absolute;top:-14px;left:50%;transform:translateX(-50%) rotate(2deg);width:120px;height:26px;background:rgba(216,178,92,.5);border:1px dashed rgba(120,90,30,.5)}
.quest-label{display:inline-block;background:linear-gradient(135deg,#c8452a,#a02c1a);color:#ffe9d8;font-size:12px;letter-spacing:2px;padding:4px 12px;border-radius:4px;margin-bottom:14px;transform:rotate(-2deg)}
.quest-text{font-size:16px;line-height:2;text-align:justify;color:var(--ink)}
.quest-hint{margin-top:16px;font-size:13px;color:var(--red);font-weight:700;letter-spacing:1px}
.quest-tip{margin-top:20px;text-align:center;font-size:14px;color:var(--ink2)}
.quest-tip b{border-bottom:1.5px solid var(--red);padding:0 26px;color:var(--ink)}
.quest-input{display:block;width:86%;margin:26px auto 0;padding:13px 18px;border-radius:10px;border:1.5px solid rgba(148,116,60,.5);background:rgba(255,252,244,.7);font-size:17px;font-family:inherit;text-align:center;letter-spacing:2px;color:var(--ink);outline:none}
.quest-input:focus{border-color:var(--leaf);box-shadow:0 0 12px rgba(212,98,46,.25)}
.quest-actions{margin-top:26px;text-align:center}
.shake{animation:shake .4s}
@keyframes shake{0%,100%{transform:rotate(-.6deg) translateX(0)}20%,60%{transform:rotate(-.6deg) translateX(-9px)}40%,80%{transform:rotate(-.6deg) translateX(9px)}}
.reward-mask{position:fixed;inset:0;z-index:70;display:none;align-items:center;justify-content:center;background:rgba(5,12,10,.82);backdrop-filter:blur(3px)}
.reward-mask.show{display:flex;animation:fadein .4s}
.reward-sub{margin:12px 0 0;font-size:12px;line-height:1.5;color:rgba(255,255,255,.62);letter-spacing:.5px}
.reward-sub b{color:#f0c987;font-weight:600}
.reward-box{text-align:center;padding:34px 40px;border-radius:18px;background:linear-gradient(160deg,#14352c,#0b1f1b);border:1.5px solid var(--gold);box-shadow:0 0 50px rgba(216,178,92,.3)}
.reward-box .rfrag{font-size:54px;animation:pop .6s cubic-bezier(.2,1.6,.4,1)}
@keyframes pop{from{transform:scale(0) rotate(-40deg)}to{transform:scale(1) rotate(0)}}
.reward-box h3{font-size:22px;letter-spacing:4px;color:var(--gold2);margin:12px 0 8px}
.reward-box p{font-size:13px;color:var(--dim);letter-spacing:1px;line-height:1.9}
.reward-box .btn{margin-top:20px}

/* ---------- 终章 ---------- */
.finale-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px 26px;text-align:center}
.frag-stage{position:relative;width:250px;height:210px;margin-bottom:26px}
.frag{position:absolute;width:52px;height:52px;left:99px;top:80px;font-size:40px;line-height:52px;opacity:0;filter:drop-shadow(0 0 10px rgba(216,178,92,.6))}
.frag.fly{animation:flyto 1.4s ease forwards}
@keyframes flyto{0%{opacity:0;transform:translate(var(--fx),var(--fy)) scale(.7) rotate(var(--fr))}25%{opacity:1}100%{opacity:1;transform:translate(0,0) scale(1) rotate(0)}}
.four-word{font-size:64px;font-weight:900;letter-spacing:16px;opacity:0;transition:opacity 1s .2s}
.four-word.show{opacity:1;text-shadow:0 0 30px rgba(216,178,92,.55)}
.finale-sub{font-size:13.5px;color:var(--dim);line-height:2;letter-spacing:1px;opacity:0;transition:opacity .8s .6s}
.finale-sub.show{opacity:1}
.wish-input{display:block;width:100%;margin:26px auto 0;padding:14px 18px;border-radius:12px;border:1.5px solid rgba(216,178,92,.5);background:rgba(243,236,217,.1);color:var(--txt);font-size:15px;font-family:inherit;line-height:1.8;outline:none;resize:none;height:96px}
.wish-input:focus{border-color:var(--gold);box-shadow:0 0 14px rgba(216,178,92,.3)}

/* ---------- 回执 ---------- */
.receipt-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 22px 26px}
.receipt{width:100%;max-width:360px;border-radius:14px;padding:30px 26px;text-align:center;position:relative}
.receipt::after{content:"信";position:absolute;right:18px;bottom:16px;width:58px;height:58px;border-radius:50%;border:2.5px solid rgba(200,85,44,.75);color:rgba(200,85,44,.8);font-size:26px;font-weight:900;display:flex;align-items:center;justify-content:center;transform:rotate(-12deg);opacity:.85}
.receipt h2{font-size:22px;letter-spacing:5px;color:#8a6d2f;margin-bottom:4px}
.receipt .r-sub{font-size:11px;letter-spacing:3px;color:var(--ink2);margin-bottom:18px}
.receipt .r-row{display:flex;justify-content:space-between;font-size:14px;padding:8px 4px;border-bottom:1px dashed rgba(148,116,60,.4);color:var(--ink)}
.receipt .r-row b{letter-spacing:1px}
.receipt .r-msg{margin-top:16px;font-size:13px;color:var(--ink2);line-height:2;text-align:left;font-style:italic}
.receipt .r-foot{margin-top:18px;font-size:11px;color:var(--ink2);letter-spacing:2px}
/* ============ 免责声明页（浅色，仿参考样式） ============ */
#page-disclaimer{background:#eef0f2;color:#333}
.dsc-wrap{flex:1;display:flex;flex-direction:column;justify-content:center;padding:20px 16px}
.dsc-card{background:#fff;border-radius:16px;padding:30px 22px 22px;box-shadow:0 6px 24px rgba(0,0,0,.07)}
.dsc-card h2{font-size:21px;color:#222;margin-bottom:16px;letter-spacing:1px}
.dsc-card p{font-size:15px;line-height:1.9;color:#444;margin-bottom:14px;text-align:justify}
.dsc-check{display:flex;align-items:flex-start;gap:10px;margin:18px 0 16px;font-size:14px;color:#333;cursor:pointer;line-height:1.5}
.dsc-check input{width:20px;height:20px;accent-color:#c8552c;flex:none;margin-top:1px}
.dsc-btn{display:block;width:62%;margin:0 auto;padding:11px 0;border:none;border-radius:22px;font-size:16px;letter-spacing:6px;background:#c8552c;color:#fff;cursor:pointer;transition:opacity .25s}
.dsc-btn:disabled{background:#c9ccd1;cursor:not-allowed}
.dsc-tip{margin-top:14px;font-size:12px;color:#999}
/* ================= 选择题选项（2026-10 新增） ================= */
.quest-options{display:flex;flex-direction:column;gap:10px;margin:16px 0 4px}
.quest-opt{
  display:flex;align-items:flex-start;gap:11px;
  padding:13px 14px;border-radius:12px;
  background:rgba(255,255,255,.55);border:1.5px solid rgba(148,116,60,.32);
  cursor:pointer;transition:all .18s ease;text-align:left;
  font-size:14.5px;line-height:1.5;color:#3d2c05;
}
.quest-opt:active{transform:scale(.985)}
.quest-opt .qk{
  flex:0 0 24px;width:24px;height:24px;line-height:24px;text-align:center;
  border-radius:50%;background:#8b7434;color:#fff8e6;
  font-weight:700;font-size:13px;margin-top:1px;
}
.quest-opt.sel{border-color:#c9963a;background:rgba(232,197,118,.28)}
.quest-opt.sel .qk{background:#c9963a}
.quest-opt.right{border-color:#3f8f5f;background:rgba(74,154,106,.24)}
.quest-opt.right .qk{background:#3f8f5f}
.quest-opt.wrong{border-color:#b4453c;background:rgba(180,69,60,.18)}
.quest-opt.wrong .qk{background:#b4453c}
.quest-opt.locked{pointer-events:none}
.quest-explain{
  margin-top:14px;padding:13px 14px;border-radius:12px;
  background:rgba(200,150,58,.13);border-left:3px solid #c9963a;
  font-size:13.5px;line-height:1.65;color:#5c4a22;
}

/* ================= 美食图鉴（2026-10 新增） ================= */
.food-wrap{padding:18px 16px 40px}
.food-lead{text-align:center;font-size:14px;line-height:1.85;color:#6b5a3a;margin-bottom:20px}
.food-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.food-card{background:rgba(255,255,255,.62);border:1.2px solid rgba(148,116,60,.26);border-radius:14px;overflow:hidden;cursor:pointer;transition:transform .16s ease}
.food-card:active{transform:scale(.97)}
.food-card img{width:100%;height:104px;object-fit:cover;display:block}
.food-card .fn{padding:9px 10px;font-size:13px;font-weight:600;color:#3d2c05;line-height:1.4;text-align:center}
.food-foot{margin-top:22px;font-size:11.5px;color:#9c9483;line-height:1.7;text-align:center}
.food-view{position:fixed;inset:0;z-index:75;background:rgba(12,20,16,.92);display:none;flex-direction:column;align-items:center;justify-content:center;padding:22px}
.food-view.show{display:flex}
.food-view img{max-width:100%;max-height:72vh;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.food-view .fv-name{color:#f0e2c0;font-size:17px;margin-top:18px;font-weight:600;text-align:center}
.food-view .fv-hint{color:#9c9483;font-size:12px;margin-top:10px}

/* ================= 可读性精修 2026-10-04 =================
   截图反馈：大厅页部分文字/图标看不清。逐项提高对比度并加描边兜底。 */

/* 顶栏：标题加文字阴影，避免压在深绿渐变上看不清 */
.pagetitle{text-shadow:0 1px 4px rgba(0,0,0,.85),0 0 12px rgba(0,0,0,.6)}
.capsule{color:#d8d0bc;border-color:rgba(233,226,207,.45)}
.iconbtn{border-color:rgba(233,226,207,.5)}

/* 用户信息条：底色压深一档，让金色头像与文字都跳出来 */
.user-strip{background:linear-gradient(140deg,rgba(24,60,54,.92),rgba(10,30,25,.96));border:1px solid rgba(216,178,92,.45)}
.user-strip .uname{color:#f6f0e0;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.user-strip .uteam{color:#d4ccb3}
.rank-next{color:#d4ccb3}

/* 分区小标题：金色文字加深色描边 */
.sect-head h3{color:#f4d99a;text-shadow:0 1px 4px rgba(0,0,0,.7)}
.sect-head span{color:#c9c1a8}

/* 板块卡片：标题与正文强化 */
.board-card h4{color:#f2ecdc;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.board-card .bplace{color:#ddd5bc}
.board-card .bdesc{color:rgba(240,234,218,.92)}
.board-card .bprog{color:#d8d0b8}
.board-card.locked h4{color:#cfc7b4;text-shadow:0 1px 3px rgba(0,0,0,.55)}
.board-card.locked .bplace{color:#b3ab93}
.board-card.locked .bdesc{color:rgba(226,220,205,.78)}

/* 未解锁标签：深底浅字，不再是灰底灰字 */
.board-card.locked .btag{background:rgba(38,52,48,.96);color:#e6dfc9;border:1px solid rgba(216,178,92,.42);border-top:0;border-right:0;border-radius:0 14px 0 12px}

/* 进度条：底槽提亮一点，填充更醒目 */
.pbar{background:rgba(233,226,207,.22)}

/* 地点前的 pin 图标容易糊，加一层文字阴影 */
.board-card .bplace{text-shadow:0 1px 2px rgba(0,0,0,.55)}

/* ===== 多空填空（2026-10-05 新增）=====
   Word 原文里「骄傲」「匠心」是双空填空题，题面保留原句，
   空格就地渲染成小输入框，填错的空描红提示 */
.blank-inp{
  display:inline-block; width:5.2em; margin:0 4px; padding:2px 6px;
  font:inherit; font-size:15px; line-height:1.5; text-align:center;
  color:#f6f0dd; background:rgba(12,30,26,.72);
  border:0; border-bottom:2px solid rgba(216,178,92,.85);
  border-radius:4px; outline:none; vertical-align:middle;
}
.blank-inp:focus{background:rgba(18,44,38,.9);border-bottom-color:#f0cf7a}
.blank-inp.bad{border-bottom-color:#e2674f;background:rgba(60,22,16,.6)}
.quest-text{line-height:2}

/* ================= 下滑模式（2026-10-05）=================
   反馈：「有的文字漏出方框」。根因是居中容器 overflow 时顶部被裁、且无法滚动。
   修法三条：① 长文本容器内部可滚；② 居中改用 safe center（老浏览器退化成顶部对齐，
   内容仍完整可滚）；③ 页面底部给「下滑查看」提示 + 渐隐遮罩。 */
.quest-wrap,.finale-wrap,.receipt-wrap,.dsc-wrap,.pro-wrap{justify-content:flex-start;justify-content:safe center}

/* 台词框：作为对话框内的弹性子块就地滚动（max-height 由 .dlg-box 统一约束），
   不再用 min() 单声明（老内核不支持 min() 时整条失效→文字撑破框）。
   这里只补一条 px 兜底，能力强的浏览器由 .dlg-box 的 48vh 接管。 */
.dlg-text{
  padding-right:4px;scrollbar-width:thin;
}
.dlg-text::-webkit-scrollbar{width:3px}
.dlg-text::-webkit-scrollbar-thumb{background:rgba(216,178,92,.6);border-radius:3px}
.dlg-more{display:none;text-align:center;font-size:11px;color:#f0cf7a;letter-spacing:1px;margin-top:6px;animation:blink 1.4s infinite}
.dlg-more.show{display:block}

/* 页面级下滑提示：内容超过一屏才出现，滚到底自动消失 */
.scroll-fade{position:absolute;left:0;right:0;bottom:0;height:64px;z-index:55;pointer-events:none;display:none;background:linear-gradient(180deg,transparent,rgba(5,13,11,.8))}
.scroll-fade.show{display:block}
.scroll-hint{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:60;display:none;align-items:center;gap:6px;
  padding:6px 16px;border-radius:16px;background:rgba(8,20,17,.86);border:1px solid rgba(216,178,92,.55);
  color:#f4e5bd;font-size:12px;letter-spacing:1px;pointer-events:none;animation:hintbob 1.6s ease-in-out infinite;white-space:nowrap}
.scroll-hint.show{display:flex}
@keyframes hintbob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(4px)}}

/* 声波条：静音/播放失败时变灰，让「这句没声」看得见 */
.dlg-audio.mute{background:rgba(130,130,120,.45)}
.dlg-audio.mute i{animation:none;height:4px;opacity:.55}

/* ================= 2026-10-05 晚改版 =================
   ① 封面信封藏字 ② 地图角落纸条 ③ 序章改林叙对话
   ④ 性别选择 ⑤ 对话框玩家/角色头像位 ⑥ 便利贴提示页 */

/* —— 封面：信封角落的手写小字（原序章第一段末句）—— */
.env-note{
  position:absolute;left:50%;top:43.5%;z-index:3;
  transform:translateX(-50%) rotate(-4deg);
  font-family:"KaiTi","STKaiti","Noto Serif SC",serif;
  font-size:12px;line-height:1.7;letter-spacing:1px;
  color:#4e3a1f;text-align:center;max-width:56vw;
  text-shadow:0 1px 0 rgba(255,250,235,.55);
  animation:fadein 1.4s .5s ease backwards;
}
.env-note::after{content:"";display:block;width:100%;height:1.5px;margin-top:3px;
  background:linear-gradient(90deg,rgba(92,67,38,.75),transparent)}

/* —— 地图：角落的留言纸条（原序章第二段末句）——
   2026-10-06 移到右下角：该区域是画布外的空白纸边（图上无路线/地标），
   经墨迹密度分析确认 x>680,y>750 全空，纸条放这里绝不遮挡内容。 */
.map-note{
  position:absolute;right:2.5%;bottom:3.5%;left:auto;z-index:5;max-width:27%;
  background:linear-gradient(160deg,#fff6c9,#f6e8a6);
  border:1px solid rgba(148,116,60,.5);border-radius:4px;
  padding:5px 7px;transform:rotate(-2.5deg);
  box-shadow:0 5px 13px rgba(60,40,10,.3);
  font-family:"KaiTi","STKaiti",serif;font-size:10px;line-height:1.6;
  color:#5c4326;letter-spacing:.4px;pointer-events:none;
}
.map-note::before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%) rotate(2deg);
  width:40px;height:11px;background:rgba(216,178,92,.55);border:1px dashed rgba(120,90,30,.4)}
.map-note b{color:#b4453c}

/* —— 序章：林叙照片 + 对话气泡（纸面风格）—— */
.pro-char{display:flex;align-items:center;gap:14px;margin:4px 0 16px;text-indent:0}
.pro-char img{width:96px;height:116px;object-fit:cover;border-radius:10px;border:2px solid rgba(148,116,60,.5);
  box-shadow:0 4px 12px rgba(60,40,10,.2);transform:rotate(-1.5deg)}
.pro-char-name{font-size:16px;font-weight:700;color:#3d2c05;letter-spacing:2px;line-height:1.6}
.pro-char-name span{font-size:11px;font-weight:400;color:#8a7a58;display:block;margin-top:2px}
.pro-dlg{display:flex;gap:10px;margin-bottom:14px;text-indent:0;align-items:flex-start}
.pro-dlg:last-child{margin-bottom:0}
.pro-ava{width:36px;height:36px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:900;color:#0b1f1b;border:2px solid rgba(148,116,60,.45);margin-top:2px}
.pro-bubble{flex:1;background:rgba(255,252,244,.75);border:1.2px solid rgba(148,116,60,.35);
  border-radius:12px;border-top-left-radius:3px;padding:11px 14px;font-size:14px;line-height:1.95;text-align:justify;color:#4a3a20}
.pro-name{font-size:12px;font-weight:700;color:#8a6d2f;letter-spacing:1px;margin-bottom:3px}

/* —— 性别选择（复用阵营卡片壳，图章换成 2D 头像）—— */
.team-card .seal img{width:100%;height:100%;object-fit:cover;border-radius:50%}

/* —— 大厅头像：选了形象就用 2D 头像 —— */
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}

/* —— 对话框：左上玩家头像 / 右上说话角色 —— */
.dlg-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.dlg-spk{width:44px;height:44px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:900;color:#0b1f1b;border:2px solid rgba(233,226,207,.6);
  background:linear-gradient(135deg,#d8b25c,#fff8);box-shadow:0 2px 8px rgba(0,0,0,.35);overflow:hidden}
.dlg-spk img{width:100%;height:100%;object-fit:cover}
.dlg-spk.txt{font-size:16px}

/* —— 便利贴提示页（相约等纯提示关）—— */
.dlg-box.sticky{
  display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(170deg,#fff8c4,#ffefa8);
  border:1.5px solid rgba(180,140,40,.5);
  box-shadow:0 14px 34px rgba(0,0,0,.45);
  transform:rotate(-.8deg);cursor:default;min-height:auto;
}
/* 便签内容滚动层：文字长了在便签内下拉，「知道了」按钮始终可点（用户反馈：文字露出+不能下拉） */
.sticky-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.sticky-tape{position:absolute;top:-12px;left:50%;transform:translateX(-50%) rotate(-2deg);
  width:96px;height:24px;background:rgba(216,178,92,.5);border:1px dashed rgba(120,90,30,.45)}
.sticky-head{font-size:15px;font-weight:900;color:#7a5416;letter-spacing:2px;margin-bottom:10px;text-align:center}
.sticky-body{font-family:"KaiTi","STKaiti",serif;font-size:15.5px;line-height:2.1;color:#4a3a18;text-align:justify}
.sticky-tip{margin-top:12px;text-align:center;font-size:11px;color:#9c843f;letter-spacing:1px}
.sticky-actions{margin-top:12px;text-align:center}
.sticky-actions .btn{padding:9px 26px;font-size:14px}

/* 纸条定位基准：map-holder 必须是定位容器 */
.map-holder{position:relative}

/* 图例：从 SVG 左下角移到地图下方一行小字（把角落让给留言纸条） */
.map-legend{margin:8px 20px 0;font-size:11px;color:var(--dim);letter-spacing:1px}

/* 地图页的美食入口（剧本页只保留剧本板块后迁来） */
.map-food{
  margin:10px 20px 0;padding:9px 12px;border-radius:20px;text-align:center;
  font-size:12.5px;letter-spacing:1px;color:#f0dfae;cursor:pointer;
  background:linear-gradient(135deg,rgba(29,74,68,.9),rgba(12,32,27,.95));
  border:1px solid rgba(216,178,92,.45);box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.map-food:active{transform:scale(.97)}

/* ================= 下拉式布局（2026-10-06）=================
   .page 是 flex 纵向容器：屏幕高度不够时 flex 默认会「压缩」子元素
   （地图/任务卡被压扁），压完正好一屏高 → 永远不出滚动条 → 拉不动。
   禁止收缩后，内容保持自然高度，超出部分真实可下拉滚动。 */
.page > *{flex-shrink:0}

/* ================= 手绘卡通地图底图（2026-10-06 二次改版）=================
   用户要求整幅地图完整显示、不再横向裁切 → 改为「宽度撑满 + 高度按比例」：
   近方形 899x933 在手机竖屏一屏放得下，节点用百分比绝对定位跟着缩放。 */
.map-scroll{overflow:hidden;scrollbar-width:none}
.map-canvas{
  position:relative;width:100%;max-width:560px;height:auto;aspect-ratio:899/933;
  flex:none;margin:0 auto;
}
.map-img{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;-webkit-user-drag:none}
#routeGroup{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#nodeGroup{position:absolute;inset:0}

/* 关卡节点：钉在真实地标上 */
.mnode{
  position:absolute;transform:translate(-50%,-50%);cursor:pointer;
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  user-select:none;-webkit-tap-highlight-color:transparent;
}
.mnode-dot{
  position:relative;z-index:2;width:21px;height:21px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:900;line-height:1;
  border:1.6px solid #5c4a22;box-shadow:0 2px 5px rgba(0,0,0,.4);
}
.mnode.done .mnode-dot{background:#4a9a6a;color:#0d2417}
.mnode.cur  .mnode-dot{background:#e8c576;color:#3d2c05}
.mnode.lock .mnode-dot{background:#b5ad98;color:#6f6a5c}
.mnode-ring{
  position:absolute;inset:-5px;border-radius:50%;border:2px solid #e8c576;
  opacity:0;z-index:1;
}
.mnode.cur .mnode-ring{opacity:1;animation:pulse 1.6s ease-out infinite}
.mnode-lb{
  position:absolute;top:23px;left:50%;transform:translateX(-50%);
  white-space:nowrap;font-size:9.5px;font-weight:700;letter-spacing:.3px;
  color:#fff8e6;background:rgba(60,44,18,.72);border:1px solid rgba(216,178,92,.5);
  padding:1px 6px;border-radius:9px;pointer-events:none;
  text-shadow:0 1px 2px rgba(0,0,0,.6);
}
.mnode.lock .mnode-lb{color:#e3dcc4;background:rgba(70,70,60,.7)}

/* ============================================================
   质感增强 + 新增组件（2026-10-06）
   保持原有「墨绿 + 金 + 米色纸」的调性不变，只补三件事：
   ① 全局纸纹噪点（让平面不再死板）② 纸卡/按钮的层次与光泽
   ③ 线索册 / 成就 / 通关记录 / 证据拼图 / 结局 这几组新组件的样式
   ============================================================ */

/* ① 纸纹噪点：铺在最上层但穿透点击，只给画面加颗粒感 */
#app::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.085;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ② 纸卡：叠一层极淡的横向纹理 + 更柔的分层阴影 */
.paper{
  background-image:linear-gradient(160deg,#f7f0de,#eadcb8),
    repeating-linear-gradient(0deg,rgba(148,116,60,.085) 0 1px,transparent 1px 4px);
  box-shadow:0 14px 34px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.3),inset 0 0 0 1px rgba(148,116,60,.28);
}
.btn-gold,.btn-red,.btn-ghost{background-blend-mode:screen}
.btn-gold::after,.btn-red::after{
  content:"";position:absolute;left:8%;right:8%;top:2px;height:38%;border-radius:8px;
  background:linear-gradient(180deg,rgba(255,255,255,.32),transparent);pointer-events:none;
}
.mine-head .avatar{width:46px;height:46px;font-size:19px;border-width:1px}

/* ③ 线索册 */
.clue-wrap{padding:16px 14px 34px}
.clue-lead{text-align:center;color:var(--dim);font-size:12.5px;line-height:1.9;margin-bottom:14px}
.clue-lead b{color:var(--gold2);font-size:17px;padding:0 3px}
.clue-foot{text-align:center;font-size:11px;color:var(--dim);opacity:.65;line-height:1.8;margin:16px 8px 0}
.clue-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.clue-item{
  position:relative;padding:12px 11px 13px;border-radius:13px;
  border:1px solid rgba(216,178,92,.26);
  background:linear-gradient(150deg,rgba(22,58,50,.92),rgba(12,32,27,.96));
  box-shadow:0 6px 18px rgba(0,0,0,.34);transition:transform .18s,border-color .18s,box-shadow .18s;
}
.clue-item.on{cursor:pointer}
.clue-item.on:active{transform:scale(.97)}
.clue-item.off{opacity:.45;filter:saturate(.35)}
.clue-item.pick.sel{border-color:var(--gold);box-shadow:0 0 0 2px rgba(216,178,92,.45),0 10px 22px rgba(0,0,0,.42)}
.ci-icon{font-size:22px;line-height:1}
.ci-name{font-size:13.5px;font-weight:700;color:var(--gold2);letter-spacing:1px;margin:6px 0 2px}
.ci-from{font-size:10px;color:var(--dim);opacity:.75;letter-spacing:.5px}
.ci-desc{font-size:11.5px;color:#e6dcc4;line-height:1.75;margin-top:7px;opacity:.9}
.ci-check{position:absolute;top:7px;right:10px;font-size:15px;font-weight:900;color:var(--gold2)}

/* ③ 我的 · 统计条 */
.mine-wrap{padding:14px 14px 34px}
.mine-card{
  border-radius:16px;padding:16px;border:1px solid rgba(216,178,92,.3);
  background:linear-gradient(140deg,rgba(22,58,50,.92),rgba(12,32,27,.96));
  box-shadow:0 12px 28px rgba(0,0,0,.42);
}
.mine-head{display:flex;align-items:center;gap:12px}
.user-name{font-size:16px;color:var(--gold2);font-weight:700;letter-spacing:1.5px}
.muted{font-size:11.5px;color:var(--dim);opacity:.8;margin-top:2px}
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:16px 0 12px;text-align:center}
.stat-row .n{font-size:18px;font-weight:800;color:var(--gold2);letter-spacing:.5px}
.stat-row .l{font-size:10px;color:var(--dim);opacity:.85;margin-top:3px}
.rank-line{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.mine-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mine-acts .btn{letter-spacing:2px;text-indent:2px;font-size:14px;padding:11px 0;border-radius:10px}

/* ③ 成就墙 */
.badge-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.badge{
  text-align:center;padding:11px 3px 10px;border-radius:12px;
  border:1px solid rgba(216,178,92,.2);background:rgba(12,32,27,.55);transition:.25s;
}
.badge.on{
  border-color:rgba(216,178,92,.6);
  background:linear-gradient(150deg,rgba(216,178,92,.18),rgba(12,32,27,.85));
  box-shadow:0 6px 16px rgba(216,178,92,.16);
}
.badge .bi{font-size:23px;filter:grayscale(1);opacity:.35}
.badge.on .bi{filter:none;opacity:1}
.badge .bn{font-size:10.5px;color:var(--gold2);font-weight:700;margin-top:5px;letter-spacing:.5px}
.badge .bd{font-size:9px;color:var(--dim);opacity:.7;line-height:1.5;margin-top:3px}

/* ③ 通关记录 */
.rec-card{
  border-radius:12px;padding:12px 13px;margin-bottom:10px;
  border:1px solid rgba(216,178,92,.22);background:rgba(12,32,27,.55);
}
.rc-h{display:flex;justify-content:space-between;align-items:baseline}
.rc-h b{font-size:14.5px;letter-spacing:2px}
.rc-p{font-size:12px;color:var(--gold2)}
.rc-m{font-size:11px;color:var(--dim);opacity:.85;margin-top:4px;line-height:1.65}
.rec-empty{text-align:center;font-size:12.5px;color:var(--dim);opacity:.65;padding:28px 0;line-height:1.9}

/* ③ 终章 · 证据拼图 */
.asm-wrap{padding:18px 14px 34px}
.asm-card{padding:18px 16px 20px}
.asm-q{font-size:14px;line-height:1.95;color:var(--ink);white-space:pre-wrap}
.asm-tip{font-size:12px;color:#8a6d2f;margin:12px 0;text-align:center;letter-spacing:1.5px;font-weight:700}
.clue-grid.pick{gap:9px}
.asm-card .btn{margin-top:18px}
.asm-hint-mask{
  position:fixed;inset:0;z-index:95;display:none;align-items:center;justify-content:center;
  padding:20px;background:rgba(5,12,10,.78);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.asm-hint-mask.show{display:flex;animation:fadein .25s ease}
.asm-hint-card{
  width:calc(100% - 40px);max-width:340px;max-height:80vh;overflow-y:auto;
  box-sizing:border-box;padding:24px 20px 20px;border-radius:16px;
  box-shadow:0 18px 50px rgba(0,0,0,.55),inset 0 0 0 1px rgba(148,116,60,.28);
  text-align:left;-webkit-overflow-scrolling:touch;
}
.asm-hint-close{
  position:absolute;top:9px;right:11px;width:32px;height:32px;border:0;background:none;
  color:#8a6d2f;font:400 25px/1 serif;cursor:pointer;padding:0;
}
.asm-hint-head{display:flex;align-items:center;gap:12px;padding-right:24px}
.asm-hint-icon{
  flex:none;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#f8f0d9;background:linear-gradient(145deg,#c8552c,#9d351b);font:700 22px/1 serif;
  box-shadow:0 4px 12px rgba(137,52,27,.3);
}
.asm-hint-head h3{margin:0;color:#3c2c18;font-size:18px;letter-spacing:2px}
.asm-hint-head p{margin:5px 0 0;color:#8a6d2f;font-size:11.5px;letter-spacing:.5px}
.asm-hint-tag{
  display:inline-block;margin:16px 0 9px;padding:3px 10px;border-radius:12px;
  color:#8a3a20;background:rgba(200,85,44,.1);border:1px solid rgba(200,85,44,.28);
  font-size:11px;font-weight:700;letter-spacing:1px;
}
.asm-hint-body{color:#4a3820;font-size:13px;line-height:1.9;white-space:pre-wrap;word-break:break-word}
.asm-hint-primary{width:100%;margin-top:18px;letter-spacing:2px}
.asm-hint-more{
  display:block;width:100%;margin-top:10px;padding:5px 0;border:0;background:none;
  color:#9a6a25;font-family:inherit;font-size:12px;letter-spacing:.5px;cursor:pointer;
}
.asm-hint-more:active{opacity:.65}

/* ③ 结局卡（终章页 / 时光回执） */
.ending-chip{
  display:flex;gap:12px;align-items:flex-start;margin:14px 16px 0;padding:13px 15px;border-radius:14px;
  border:1px solid rgba(216,178,92,.45);
  background:linear-gradient(140deg,rgba(216,178,92,.18),rgba(12,32,27,.72));
  box-shadow:0 10px 24px rgba(0,0,0,.36);animation:fadein .6s ease;
}
.ec-icon{font-size:27px;flex:none;line-height:1.2}
.ec-name{font-size:14px;color:var(--gold2);font-weight:700;letter-spacing:1.5px}
.ec-desc{font-size:11.5px;color:#e6dcc4;line-height:1.85;margin-top:5px;opacity:.92}

/* ③ 答题解析卡：答对讲出处（绿），答错说错在哪（红） */
.quest-hint.explain{
  margin-top:14px;padding:11px 13px;border-radius:11px;
  font-size:12.5px;line-height:1.85;letter-spacing:.3px;font-weight:400;
  animation:fadein .35s ease;
}
.quest-hint.explain.ok{background:rgba(121,201,163,.14);border:1px solid rgba(121,201,163,.45);color:#2c6349}
.quest-hint.explain.bad{background:rgba(200,85,44,.12);border:1px solid rgba(200,85,44,.4);color:#8a3a20}

/* ============================================================
   ④ 线索册 / 我的成就 的入口条（地图页 + 大厅页各一条）
   2026-10-07：新模块做完了但没人看得见——入口只埋在顶栏一个 👤 图标里，
   线索册更是要先进「我的」才够得着。这里提到明面上，并带实时计数。
   ============================================================ */
.map-entries{
  display:flex;gap:10px;margin:10px 20px 0;
}
.mentry{
  flex:1;display:flex;align-items:center;gap:10px;padding:10px 11px;
  border-radius:16px;cursor:pointer;text-align:left;
  border:1px solid rgba(216,178,92,.5);
  background:linear-gradient(135deg,rgba(47,93,80,.92),rgba(16,38,32,.96));
  box-shadow:0 6px 16px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .16s ease,box-shadow .16s ease;
  -webkit-tap-highlight-color:transparent;
}
.mentry:active{transform:scale(.97);box-shadow:0 3px 9px rgba(0,0,0,.3)}
.me-icon{
  flex:none;width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-size:17px;background:rgba(216,178,92,.16);border:1px solid rgba(216,178,92,.35);
}
.me-txt{
  display:flex;flex-direction:column;gap:2px;font-size:13px;color:#f0dfae;
  font-weight:700;letter-spacing:1.2px;line-height:1.3;
}
.me-txt small{
  font-size:10.5px;font-weight:400;letter-spacing:.4px;color:rgba(240,223,174,.62);
}
/* 大厅页那条去掉左右 margin（board-wrap 自带内边距） */
.board-entries{margin:12px 0 0}

/* ============================================================
   ⑤ 登录/注册 · 底部导航 · 排行 · 交流 · 场景背景
   2026-10-07：对齐同类作品的账号与框架形式（五页签底部导航），
   配色与质感沿用本项目墨绿+金+纸，不引入对方的深紫底。
   ============================================================ */

/* ---- 登录 / 注册 ---- */
.auth-wrap{padding:26px 22px 40px;min-height:100%;display:flex;flex-direction:column}
.auth-lead{text-align:center;font-size:12.5px;color:var(--dim);margin:10px 0 18px;letter-spacing:1px}
.auth-card{padding:20px 18px 22px;border-radius:18px}
.auth-btn{width:100%;margin-top:16px}
/* 纸卡上的链接：用叶红（暖橙）+下划线，金色在浅纸上对比度不够 */
.auth-link{display:block;text-align:center;margin-top:14px;font-size:12.5px;color:var(--leaf);font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.auth-brand{margin-top:auto;text-align:center;font-size:10.5px;color:var(--dim);opacity:.6;letter-spacing:2px;padding-top:26px}
.form-item{margin-bottom:14px}
.form-item label{display:block;font-size:11.5px;color:var(--ink2);letter-spacing:1.5px;margin-bottom:6px}
/* 输入框都在浅色纸卡上：用纸白底+墨字（quest-input 同款），深绿底在纸上会发灰 */
.input,.textarea{
  width:100%;box-sizing:border-box;padding:11px 13px;border-radius:11px;
  border:1.5px solid rgba(148,116,60,.5);outline:none;
  background:rgba(255,252,244,.75);color:var(--ink);font-size:14.5px;letter-spacing:.5px;
}
.input::placeholder,.textarea::placeholder{color:rgba(107,91,62,.55)}
.input:focus,.textarea:focus{border-color:var(--leaf);box-shadow:0 0 10px rgba(212,98,46,.22)}
.textarea{min-height:88px;resize:vertical;font-family:inherit;line-height:1.7}
.gender-pick{display:flex;gap:8px}
.gender-pick .opt{
  flex:1;text-align:center;padding:9px 0;border-radius:10px;font-size:12.5px;letter-spacing:2px;
  color:var(--ink2);border:1px solid rgba(148,116,60,.45);background:rgba(255,252,244,.6);cursor:pointer;
  transition:all .16s ease;-webkit-tap-highlight-color:transparent;
}
.gender-pick .opt.on{
  color:#1c130a;font-weight:700;
  background:linear-gradient(135deg,#e8c46a,#c89a3e);border-color:#e8c46a;
  box-shadow:0 4px 12px rgba(0,0,0,.35);
}

/* ---- 底部导航（首页/剧本/排行/交流/我的） ---- */
.tabbar{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:480px;display:none;z-index:40;
  background:linear-gradient(180deg,rgba(16,38,32,.97),rgba(9,24,20,.99));
  border-top:1px solid rgba(216,178,92,.4);
  box-shadow:0 -6px 22px rgba(0,0,0,.45);
  backdrop-filter:blur(10px);
}
.tabbar .tab{
  flex:1;text-align:center;padding:8px 0 9px;cursor:pointer;position:relative;
  color:rgba(240,223,174,.5);font-size:10.5px;letter-spacing:1px;
  transition:color .18s ease;-webkit-tap-highlight-color:transparent;
}
.tabbar .tab.on{color:var(--gold2);font-weight:700}
.tabbar .tab.on::before{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:22px;height:2.5px;border-radius:0 0 3px 3px;
  background:linear-gradient(90deg,#e8c46a,#b8842e);
}
.tabbar svg{width:20px;height:20px;display:block;margin:0 auto 3px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ---- 排行 / 交流（hub） ---- */
.hub-wrap{padding:16px 16px 96px}   /* 底部留出 tabbar 高度，防止最后一条被挡 */
.hub-notice{
  display:flex;gap:10px;align-items:flex-start;margin-bottom:14px;padding:11px 13px;border-radius:12px;
  font-size:12px;line-height:1.8;color:#e6dcc4;letter-spacing:.4px;
  background:rgba(216,178,92,.1);border:1px solid rgba(216,178,92,.3);
}
.hub-notice span:first-child{font-size:17px;flex:none}
.rank-me-card{text-align:center;padding:16px 14px;border-radius:16px;margin-bottom:4px}
.rm-label{font-size:10.5px;color:var(--dim);letter-spacing:3px}
.rm-num{font-size:27px;font-weight:700;letter-spacing:3px;margin:7px 0 5px}
.rm-sub{font-size:11px;color:var(--dim);letter-spacing:.5px}
.rank-list{display:flex;flex-direction:column;gap:8px}
.rank-item{
  display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:13px;
  background:rgba(20,44,38,.72);border:1px solid rgba(148,116,60,.28);
}
.rank-item.rank-me{border-color:rgba(232,196,106,.7);background:rgba(216,178,92,.14)}
.rank-num{
  flex:none;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:var(--dim);
  background:rgba(11,31,27,.6);border:1px solid rgba(148,116,60,.35);
}
.rank-num.rn1{color:#1c130a;background:linear-gradient(135deg,#f2d385,#c89a3e);border-color:#f2d385}
.rank-num.rn2{color:#1c130a;background:linear-gradient(135deg,#d9d9d9,#9a9a9a);border-color:#d9d9d9}
.rank-num.rn3{color:#1c130a;background:linear-gradient(135deg,#e2a878,#a86a34);border-color:#e2a878}
.rank-name{flex:1;font-size:13px;letter-spacing:.5px;color:#f0e8cf}
.rank-tag{
  display:inline-block;margin-left:7px;padding:1px 7px;border-radius:8px;
  font-size:9.5px;letter-spacing:1px;color:#1c130a;
  background:linear-gradient(135deg,#e8c46a,#c89a3e);vertical-align:1px;
}
.rank-tag.demo{background:none;border:1px solid rgba(148,116,60,.5);color:var(--dim)}
.rank-score{font-size:15px;font-weight:700;color:var(--gold2);letter-spacing:1px}
.hub-foot{text-align:center;font-size:10.5px;color:var(--dim);opacity:.65;margin-top:16px;letter-spacing:1px}
.soc-card{padding:16px 15px;border-radius:16px}
.soc-tip{text-align:center;font-size:11.5px;color:var(--dim);margin-top:11px}
.soc-list{display:flex;flex-direction:column;gap:10px}
.msg{display:flex;gap:10px;padding:12px 13px;border-radius:13px;background:rgba(20,44,38,.72);border:1px solid rgba(148,116,60,.25)}
.mava{
  flex:none;width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:700;color:#1c130a;
  background:linear-gradient(135deg,#e8c46a,#c89a3e);
}
.mbody{flex:1;min-width:0}
.mname{font-size:11.5px;color:var(--gold2);letter-spacing:.5px;margin-bottom:4px}
.mtxt{font-size:13px;line-height:1.75;color:#f0e8cf;word-break:break-word}
.mtime{font-size:10px;color:var(--dim);opacity:.7;margin-top:5px}
.soc-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.soc-meta .mname{margin-bottom:0}
.soc-meta .mtime{flex:none;margin-top:0}
.soc-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:9px}
.soc-textbtn{
  border:0;background:none;padding:0;color:#e8c46a;font:inherit;font-size:11.5px;
  letter-spacing:.3px;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.soc-textbtn.danger{color:#d98a6a}
.soc-textbtn:active{opacity:.6}
.soc-thread-mask{
  position:fixed;inset:0;z-index:96;display:none;align-items:center;justify-content:center;
  padding:16px;background:rgba(5,12,10,.82);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.soc-thread-mask.show{display:flex;animation:fadein .25s ease}
.soc-thread-card{
  width:calc(100% - 32px);max-width:380px;max-height:86vh;overflow-y:auto;box-sizing:border-box;
  padding:22px 18px 20px;border-radius:17px;text-align:left;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
}
.soc-thread-close{
  position:sticky;float:right;top:0;z-index:2;width:32px;height:32px;margin:-10px -7px 0 0;
  border:0;background:none;color:#8a6d2f;font:400 26px/1 serif;cursor:pointer;padding:0;
}
.soc-thread-body{clear:both}
.soc-thread-post,.soc-reply{
  display:flex;gap:10px;padding:12px 13px;border-radius:13px;
  background:rgba(255,252,244,.62);border:1px solid rgba(148,116,60,.28);
}
.soc-thread-post{border-color:rgba(148,116,60,.45);background:rgba(255,252,244,.82)}
.soc-thread-card .mname{color:#8a6d2f}
.soc-thread-card .mtxt{color:#4a3820}
.soc-thread-card .mtime{color:#7f6b4a;opacity:.9}
.soc-thread-card .soc-textbtn{color:#9a6a25}
.soc-thread-card .soc-textbtn.danger{color:#9c3d31}
.soc-thread-title{
  margin:17px 0 9px;color:#6f5427;font-size:11px;font-weight:700;
  letter-spacing:1.5px;border-top:1px dashed rgba(148,116,60,.3);padding-top:13px;
}
.soc-replies{display:flex;flex-direction:column;gap:9px}
.soc-reply{margin-left:15px;background:rgba(255,252,244,.48)}
.soc-thread-empty{text-align:center;color:#8a795b;font-size:12px;padding:16px 0;line-height:1.8}
.soc-reply-form{margin-top:16px;padding-top:14px;border-top:1px dashed rgba(148,116,60,.3)}
.soc-reply-form label{display:block;color:#6f5427;font-size:11.5px;letter-spacing:1px;margin-bottom:7px}
.soc-reply-form .textarea{min-height:76px;background:rgba(255,252,244,.78);color:#3d2c05}
.soc-reply-form .btn{width:100%;margin-top:10px;letter-spacing:2px}
.soc-reply-form .soc-tip{color:#7f6b4a}

/* ---- 我的页账号区 ---- */
.user-box{padding:15px 16px;border-radius:15px;margin-bottom:8px}
.ub-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:12.5px;border-bottom:1px dashed rgba(148,116,60,.25)}
.ub-row:last-of-type{border-bottom:none}
.ub-row span{color:var(--dim);letter-spacing:1px;flex:none}
.ub-row b{color:#f0e8cf;font-weight:400;text-align:right;word-break:break-all}
.ub-out{width:100%;margin-top:10px;border-color:rgba(200,85,44,.5);color:#d98a6a}
.ub-guest{text-align:center;font-size:12.5px;color:var(--dim)}

/* ---- 关卡真实场景背景（水彩校园图） ----
   fixed 压底：页面滚动时背景不动（原生 App 感）；topbar z20、story-stage 在 DOM 后面，
   都压在遮罩之上；没有图的关卡不显示。 */
.scene-bg{position:fixed;inset:0;z-index:0;opacity:0;transition:opacity .5s ease;pointer-events:none;overflow:hidden}
.scene-bg.show{opacity:1}
/* 原图完整展示：contain 不裁切，不加任何遮罩/渐变/滤镜，颜色保持原样 */
.scene-bg img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;position:relative;z-index:1}
/* 无缝衔接（2026-10-11）：contain 上下留的黑边用「同图放大模糊」补齐 ——
   补底层是独立元素垫在最底下（不是叠在原图上），原图本身一字节不改、仍完整 contain 展示 */
.scene-bg .scene-fill{position:absolute;inset:-34px;background-size:cover;background-position:center;filter:blur(26px) brightness(.7) saturate(1.05);transform:scale(1.12)}

/* ---- 底部导航不挡内容：五个页签页的容器底部留出导航条高度 ---- */
.board-wrap{padding-bottom:92px}
.mine-wrap{padding-bottom:92px}
.page-cover .cover-actions,.page-cover .cover-bottom{padding-bottom:88px}

/* ============================================================
 * ⑥ 实景背景：图片原样展示（不裁切 / 不压色 / 不加滤镜）
 *    可读性靠「UI 框半透明玻璃化 + 模糊 + 改文字颜色」解决，
 *    绝不在图片本身上叠任何色层（框是半透明控件，不是压在图上的滤镜）。
 * ============================================================ */
/* 有实景时关掉全局纸纹与剧情页光晕 —— 这两层会给照片加噪点和色偏 */
body.scene-on #app::after{opacity:0}
body.scene-on .story-deco{display:none}
body.scene-on .scroll-fade{display:none}

/* 顶栏/胶囊：玻璃质感——更浅的半透明 + 更强模糊，背景建筑透出更多 */
body.scene-on .topbar{background:none;backdrop-filter:none;-webkit-backdrop-filter:none}
body.scene-on .iconbtn,
body.scene-on .capsule{
  background:rgba(11,31,27,.38);border:1px solid rgba(216,178,92,.5);color:#fdf8ec;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 2px 10px rgba(0,0,0,.28);
}
body.scene-on .pagetitle{
  background:rgba(11,31,27,.38);border:1px solid rgba(216,178,92,.45);border-radius:14px;
  padding:5px 14px;color:#fdf8ec;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 2px 10px rgba(0,0,0,.28);
}
body.scene-on .emotion-chip{
  background:rgba(11,31,27,.38);border-color:rgba(216,178,92,.45);color:#fdf8ec;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 2px 10px rgba(0,0,0,.28);
}
/* 台词框：更浅的半透明玻璃，背景建筑大片透出；文字纯白 + 重阴影保持可读 */
body.scene-on .dlg-box{
  background:linear-gradient(160deg,rgba(8,20,17,.46),rgba(12,36,29,.46));
  border:1.5px solid rgba(216,178,92,.5);
  -webkit-backdrop-filter:blur(12px) saturate(1.15);backdrop-filter:blur(12px) saturate(1.15);
  box-shadow:0 12px 30px rgba(0,0,0,.32);
}
body.scene-on .dlg-text{color:#ffffff;text-shadow:0 1px 4px rgba(0,0,0,.6)}
body.scene-on .dlg-name{color:var(--gold2);text-shadow:0 1px 3px rgba(0,0,0,.5)}
body.scene-on .tts-toggle{background:rgba(11,31,27,.38);border-color:rgba(216,178,92,.45);color:#fdf8ec;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
/* 答题卡片：纸卡略透出 + 模糊，保深色字可读的同时让边缘背景可见 */
body.scene-on .quest-card{background:rgba(243,236,217,.82);box-shadow:0 16px 40px rgba(0,0,0,.42);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* BGM 署名行（我的页） */
.ub-credit{font-size:10px;color:var(--ink2);opacity:.7;margin:8px 0 0;text-align:center;line-height:1.4}

/* ============================================================
 * ⑦ 通关抽奖（2026-10-11）：时光回执后「玩完即抽」，每人一次。
 *    结果是一张带「名字 + 专属核验码 + 时间」的电子奖票，
 *    截图转发无效 —— 核销时对码 + 对名字，且已同步云端备案。
 * ============================================================ */
.lot-wrap{padding:14px 16px 40px}
.lot-head{text-align:center;margin:6px 0 14px}
.lot-title{font-size:26px;font-weight:900;letter-spacing:6px}
.lot-sub{font-size:12px;color:var(--dim);margin-top:8px;line-height:1.7}
.lot-card{border-radius:18px;padding:18px 16px 16px;background:linear-gradient(165deg,#2b2416,#171c16);border:1.5px solid rgba(216,178,92,.55);box-shadow:0 14px 34px rgba(0,0,0,.4);text-align:center;position:relative;overflow:hidden}
.lot-card::before{content:"";position:absolute;inset:5px;border:1px dashed rgba(216,178,92,.35);border-radius:13px;pointer-events:none}
.lot-tier{display:inline-block;font-size:12px;letter-spacing:4px;color:#1b150a;background:linear-gradient(135deg,#e8c46a,#f6e3ac);border-radius:20px;padding:4px 16px;font-weight:900}
.lot-name{font-size:19px;font-weight:900;color:#fdf8ec;margin:12px 0 4px;line-height:1.45}
.lot-img{width:100%;border-radius:12px;margin:12px 0;display:block}
.lot-desc{font-size:13px;line-height:1.8;color:#f0e8cf;text-align:left}
.lot-claim{font-size:12.5px;line-height:1.8;color:#e8c46a;text-align:left;margin-top:10px;border-top:1px dashed rgba(216,178,92,.35);padding-top:10px}
.lot-note{font-size:11px;color:var(--dim);margin-top:8px}
/* 核验区：名字 + 专属码，防截图转发的核心 */
.lot-verify{margin-top:14px;border-top:1px dashed rgba(216,178,92,.35);padding-top:12px;text-align:center}
.lot-who{font-size:15px;color:#fdf8ec;font-weight:900;letter-spacing:1px}
.lot-code{display:inline-block;margin-top:8px;font-size:20px;font-weight:900;letter-spacing:3px;color:#e8c46a;background:rgba(216,178,92,.12);border:1.5px solid rgba(216,178,92,.6);border-radius:10px;padding:8px 18px}
.lot-when{font-size:10.5px;color:var(--dim);margin-top:8px;opacity:.85}
.lot-anti{font-size:10.5px;color:#d98a6a;margin-top:6px}
/* 待抽奖态：大按钮 + 滚动的奖池预览 */
.lot-pool{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:14px 0 4px}
.lot-chip{font-size:11.5px;color:#f0e8cf;background:rgba(216,178,92,.1);border:1px solid rgba(216,178,92,.35);border-radius:20px;padding:5px 12px}
.lot-draw{width:100%;margin-top:16px;font-size:17px;letter-spacing:4px;padding:13px 0;animation:lotGlow 2s ease-in-out infinite}
@keyframes lotGlow{0%,100%{box-shadow:0 0 0 0 rgba(232,196,106,.45)}50%{box-shadow:0 0 22px 4px rgba(232,196,106,.35)}}
.lot-rolling{font-size:30px;letter-spacing:8px;padding:34px 0;color:#e8c46a;font-weight:900}
.lot-lock{font-size:12px;color:var(--dim);text-align:center;margin-top:10px;line-height:1.7}
.lot-src{font-size:10px;color:var(--dim);text-align:center;margin-top:6px;opacity:.75}
.lot-rule{font-size:11px;color:var(--dim);line-height:1.8;margin-top:14px;text-align:center;opacity:.9}