/* 曦曦的美食系统 v7 · 画面内容：头像、奇观画、图鉴、守域神、残页插画、行动图标；以及手机适配
   画框统一：圆角 10px，1px 金线 + 内侧 3px 漆色边，投影向下；人物头像用圆角方框，按身份配环色 */

/* ================= 对话头像 ================= */
.say.pts{display:grid;grid-template-columns:54px 1fr;gap:10px;align-items:start}
.say .pt{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:0;background:none}
.say .pt img{width:52px;height:52px;border-radius:12px;display:block;box-shadow:0 0 0 1.5px var(--ring,rgba(242,200,107,.6)),0 4px 10px rgba(0,0,0,.5)}
.say .pt i{font-style:normal;font-size:11px;font-weight:900;letter-spacing:.06em;color:var(--ring,var(--gold));max-width:60px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.say .pt-adai{--ring:#7fe9ff}.say .pt-me{--ring:#ff9ec4}.say .pt-god{--ring:#f2c86b}.say .pt-npc{--ring:#c8b49a}
.say .pt-adai img{box-shadow:0 0 0 1.5px #7fe9ff,0 0 14px rgba(127,233,255,.45),0 4px 10px rgba(0,0,0,.5)}
.say .pt-god img{box-shadow:0 0 0 2px #f2c86b,0 0 16px rgba(242,200,107,.45),0 4px 10px rgba(0,0,0,.5)}
.say.pts .tx{position:relative;margin-top:4px}
.say.pts .tx::before{content:"";position:absolute;left:-6px;top:12px;width:10px;height:10px;transform:rotate(45deg);background:inherit;border-left:inherit;border-bottom:inherit}
.hop{animation:hop .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes hop{30%{transform:translateY(-6px) scale(1.06)}}

/* ================= 冒险里的奇观卡 ================= */
.wonder.pic{width:100%;display:grid;grid-template-columns:118px 1fr;gap:12px;align-items:center;text-align:left;padding:8px;border-left:0;border:1px solid rgba(242,200,107,.35);background:linear-gradient(90deg,rgba(242,200,107,.12),rgba(242,200,107,.02));border-radius:12px;cursor:zoom-in}
.wonder.pic img{width:118px;height:74px;object-fit:cover;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.4),0 0 0 1px rgba(242,200,107,.5),0 6px 14px rgba(0,0,0,.45)}
.wonder.pic div{display:flex;flex-direction:column;gap:2px;min-width:0}
.wonder.pic b{font-size:11px;letter-spacing:.24em;color:var(--gold)}
.wonder.pic span{font-size:13.5px;line-height:1.6;color:#ffe9c4}
.wonder.pic small{font-size:11px;color:var(--mute)}

/* ================= 奇观大图 ================= */
.lbx{position:fixed;inset:0;z-index:130;display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:calc(20px + var(--sat)) 16px calc(24px + var(--sab));background:radial-gradient(80% 60% at 50% 40%,rgba(40,24,40,.92),rgba(4,2,6,.97));perspective:900px}
.lbx.on{display:flex;animation:tIn .3s ease both}
.lbStage{width:min(92vw,720px);perspective:900px}
.lbPic{position:relative;overflow:hidden;border-radius:14px;aspect-ratio:16/10;box-shadow:0 0 0 1px rgba(242,200,107,.6),0 0 0 6px rgba(20,8,14,.9),0 0 0 7px rgba(242,200,107,.3),0 30px 60px rgba(0,0,0,.7);transition:transform .25s ease-out;transform-style:preserve-3d;animation:popIn .45s cubic-bezier(.2,1.3,.4,1)}
.lbPic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease-out}
.lbPic::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 40%);pointer-events:none}
.lbCap{max-width:min(92vw,620px);text-align:center}
.lbCap small{font-size:12px;letter-spacing:.3em;color:#cdb8e8}
.lbCap h3{font-size:clamp(22px,5.5vw,30px);letter-spacing:.18em;margin:6px 0;background:linear-gradient(180deg,#fffaf0,var(--gold) 60%,var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.lbCap p{font-size:14.5px;line-height:1.85;color:#e8dccb}
.lbX{position:absolute;right:14px;top:calc(12px + var(--sat));width:42px;height:42px;border-radius:50%;border:1px solid var(--hair);background:rgba(20,8,14,.7);color:var(--goldL);font-size:24px;line-height:1}
.lbNav{position:absolute;top:42%;width:44px;height:64px;border-radius:10px;background:rgba(20,8,14,.6);border:1px solid var(--hair2);color:var(--goldL);font-size:30px}
.lbNav.prev{left:6px}.lbNav.next{right:6px}
.lbIdx{font-size:12px;color:var(--mute)}

/* ================= 图鉴 · 奇观 ================= */
.wblock .wbh{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.wgod{flex:none;width:58px;height:58px;padding:0;border-radius:14px;overflow:hidden;box-shadow:0 0 0 2px rgba(242,200,107,.6),0 6px 14px rgba(0,0,0,.5);background:#140a10}
.wgod img{width:100%;height:100%;display:block;opacity:0;transition:opacity .4s}
.wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:8px}
.wcell{position:relative;overflow:hidden;padding:0;border-radius:10px;aspect-ratio:16/10;background:#140a10;box-shadow:0 0 0 1px rgba(242,200,107,.35),0 6px 14px rgba(0,0,0,.4);cursor:zoom-in}
.wcell img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .45s,transform .3s}
.wcell:active img{transform:scale(1.05)}
.wcell b{position:absolute;left:0;right:0;bottom:0;padding:14px 8px 5px;font-size:12px;letter-spacing:.08em;color:#fff1d8;background:linear-gradient(transparent,rgba(8,4,6,.85));text-align:left}
.wcell.lock{cursor:default}.wcell.lock img{filter:brightness(.22) grayscale(.7) blur(1.5px)}.wcell.lock b{color:var(--mute)}
img[data-pic].in{opacity:1}

/* ================= 地图卡片：奇观画 + 守域神徽章 ================= */
.domain .dpic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.domain .dpic.in{opacity:1}
.domain.lock .dpic{filter:brightness(.3) grayscale(.8)}
.domain .godb{position:absolute;right:10px;top:10px;z-index:3;display:flex;flex-direction:column;align-items:center;gap:2px;padding:0;background:none}
.domain .godb img{width:52px;height:52px;border-radius:12px;display:block;box-shadow:0 0 0 2px rgba(242,200,107,.7),0 6px 14px rgba(0,0,0,.6);opacity:0;transition:opacity .4s;background:#140a10}
.domain .godb i{font-style:normal;font-size:10.5px;letter-spacing:.14em;padding:1px 6px;border-radius:4px;background:rgba(10,4,6,.75);color:var(--goldL)}
.domain.lock .godb{display:none}

/* ================= 守域神卡片 ================= */
.godCard{display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:start}
.gcPt{width:132px;height:132px;border-radius:16px;box-shadow:0 0 0 2px var(--gold),0 0 24px rgba(242,200,107,.35),0 10px 24px rgba(0,0,0,.6)}
.gcTx h3{font-size:22px;letter-spacing:.14em;margin-bottom:2px}
.gcSt{font-size:14px;color:var(--goldL);margin:8px 0}
.gcW{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px}
.gcW img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:7px;opacity:0;transition:opacity .4s;box-shadow:0 0 0 1px rgba(242,200,107,.35);cursor:zoom-in}
.gcW img.lock{filter:brightness(.22) grayscale(.7);cursor:default}
@media (max-width:420px){.godCard{grid-template-columns:96px 1fr}.gcPt{width:96px;height:96px}}

/* ================= 旅程手记的章节小图 ================= */
.jch{display:grid;grid-template-columns:92px 1fr;column-gap:12px;padding-left:12px}
.jch::before{display:none}
.jch .jth{grid-row:1/4;width:92px;height:58px;object-fit:cover;border-radius:8px;opacity:0;transition:opacity .4s;box-shadow:0 0 0 1px rgba(242,200,107,.4),0 4px 10px rgba(0,0,0,.45)}
.jch.lock .jth{filter:brightness(.3) grayscale(.8)}
.jch .jh,.jch p,.jch .bar{grid-column:2}

/* ================= 阿呆的半身像（羁绊页） ================= */
.adaiHero{display:grid;grid-template-columns:118px 1fr;gap:14px;align-items:center;margin-bottom:12px;padding:12px;border-radius:14px;border:1px solid rgba(127,233,255,.45);background:radial-gradient(120% 120% at 0 0,rgba(127,233,255,.16),transparent 60%),linear-gradient(180deg,rgba(10,30,40,.85),rgba(6,14,22,.92))}
.bigPt{padding:0;border-radius:16px;overflow:hidden;box-shadow:0 0 0 2px #7fe9ff,0 0 26px rgba(127,233,255,.45),0 10px 24px rgba(0,0,0,.6)}
.bigPt img{width:118px;height:118px;display:block}
.ahTx b{font-size:20px;letter-spacing:.2em;color:#e9fdff}.ahTx small{display:block;font-size:12px;color:#8fd8e8;margin:2px 0 8px}
.ahTx p{font-size:14px;line-height:1.75;color:#e6fcff;min-height:3.4em}

/* ================= 残页插画 ================= */
.page.pgv{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center}
.page.pgv .pgi{width:96px;height:77px;border-radius:6px;box-shadow:0 4px 10px rgba(0,0,0,.5);transform:rotate(-2deg)}
.page.pgv.lock .pgi{filter:brightness(.35) sepia(.6) blur(2px)}

/* ================= 和阿呆说话：他的头像 ================= */
.msg.a{display:flex;gap:8px;align-items:flex-start}
.msg.a .mpt{flex:none;width:30px;height:30px;border-radius:9px;box-shadow:0 0 0 1px #7fe9ff}

/* ================= 冒险选项：画出来的图标 ================= */
.choice::before{content:""!important;background:var(--ic,var(--ic-explore)) center/82% no-repeat,radial-gradient(circle at 50% 38%,#3a2430,#120810)!important;border:1px solid rgba(242,200,107,.4);transform:none!important;width:36px!important;height:36px!important;margin-top:-18px!important;border-radius:10px!important}
.choice.k-explore{--ic:var(--ic-explore)}.choice.k-talk{--ic:var(--ic-talk)}.choice.k-gather{--ic:var(--ic-gather)}.choice.k-cook{--ic:var(--ic-cook)}.choice.k-feed{--ic:var(--ic-feed)}.choice.k-rest{--ic:var(--ic-rest)}

/* ================= 来客登场：画像 ================= */
.ecPt{width:150px;height:150px;margin:0 auto 10px;border-radius:18px;overflow:hidden;box-shadow:0 0 0 2px #ff5a7a,0 0 40px rgba(255,60,90,.55)}
.ecPt img,.ecPt canvas{width:100%;height:100%;display:block;object-fit:cover}
.encCard.boss .ecPt{box-shadow:0 0 0 2px var(--gold),0 0 46px rgba(242,200,107,.6)}

/* ================= 旅途过场：奇观画作底，缓慢推近 ================= */
.tvPic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78;animation:kenburns 4s ease-out both}
@keyframes kenburns{from{transform:scale(1.15)}to{transform:scale(1.02)}}
@media (prefers-reduced-motion:reduce){.tvPic,.lbPic{animation:none}}

/* ================= 手机浏览器适配 ================= */
body{touch-action:manipulation}
@media (pointer:coarse){input,textarea,select{font-size:16px!important}.btn.sm{min-height:40px}.tabs button{padding:10px 14px}}
@supports (height:100dvh){.sheetIn{max-height:86dvh}.sheet.mid .sheetIn{max-height:90dvh}}
@media (max-width:380px){
  #hubTop{padding-left:10px;padding-right:10px}#hubTitle h1{font-size:18px;letter-spacing:.08em}#hubTitle small{font-size:10.5px;letter-spacing:.12em}
  .res{flex-wrap:nowrap;gap:4px}.res .chip{padding:4px 8px 4px 6px;font-size:11.5px}
  #hubJourney{gap:5px;padding:3px 8px}#hubJourney .jBar{width:46px}
  .mfoot .slogan{display:none}.mtile small{display:none}.mtile{padding:8px 2px}.mtile b{font-size:12.5px}
  .say.pts{grid-template-columns:46px 1fr}.say .pt img{width:44px;height:44px}
  .wonder.pic{grid-template-columns:96px 1fr}.wonder.pic img{width:96px;height:60px}
  .jch{grid-template-columns:76px 1fr}.jch .jth{width:76px;height:48px}
  .adaiHero{grid-template-columns:92px 1fr}.bigPt img{width:92px;height:92px}
  .scoreRow{flex-wrap:wrap}
}
@media (max-height:520px) and (orientation:landscape){
  #menu{overflow-y:auto;padding-top:calc(64px + var(--sat))}.mgrid{grid-template-columns:repeat(4,1fr)}.mtile small{display:none}.guide small{display:none}
  .tLogo{top:calc(2vh + var(--sat))}.tLogo h1{font-size:40px}.tLogo .tPre{font-size:14px}.tOrn,.tLogo .tEn{display:none}.tMenu{bottom:calc(2vh + var(--sab));width:min(60vw,420px)}.tMenu .tBtn{padding:7px 14px}.tBtn small{display:none}
  .lbx{flex-direction:row;gap:18px}.lbStage{width:min(60vw,560px)}.lbCap{text-align:left;max-width:34vw}
}
