/* ============================================================
   art.css —— v7：手绘插画（水墨 × 孔版印刷）接入、全站细节统一
   插画统一风格说明见 README「插画」
   ============================================================ */
/* 插画容器：比画框大一圈，鼠标视差时不露边 */
.art{position:absolute;inset:-4%;will-change:transform}
.art img{display:block;width:100%;height:100%;object-fit:cover}
.print__img .art,.scene-wrap .art{inset:-4%}
.print__img > .art img{transition:transform 1.4s var(--ease)}
.spread__cover:hover .print__img > .art img{transform:scale(1.035)}
.fx-cv{position:absolute;inset:0;width:100%;height:100%}
/* 首页栏目卡片 */
.room__img .frame{position:relative;overflow:hidden;aspect-ratio:16/11;background:var(--paper-2)}
.room--answers .room__img .frame,.room--tarot .room__img .frame,.room--stars .room__img .frame{aspect-ratio:16/12}
.room__img .frame img{transition:transform 1.4s var(--ease),filter .8s}
.room:hover .room__img .frame img{transform:scale(1.04)}
/* 细腻的纸面压痕：所有插画上叠一层极淡的网点 */
.room__img .frame::after,.print__img::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  background:radial-gradient(rgba(30,42,38,.16) .6px,transparent .7px) 0 0/3px 3px;mix-blend-mode:multiply;opacity:.35}
/* 键盘焦点：统一的朱砂描边 */
:where(a,button,[tabindex],select,input,textarea,summary):focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
body.m-dark :where(a,button,[tabindex],select,input,textarea,summary):focus-visible{outline-color:#F2C879}

/* ---------- 答案之书：云海上的书房 ---------- */
.ab{background:linear-gradient(180deg,#9FB0D3 0%,#D3C4D6 34%,#F2D6C0 62%,var(--paper) 100%)}
.ab__art{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.ab__art img{position:absolute;left:0;bottom:0;width:100%;height:100%;object-fit:cover;object-position:62% 70%;opacity:.95}
.ab__art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(241,235,223,.55) 0%,rgba(241,235,223,.18) 38%,rgba(241,235,223,0) 60%),linear-gradient(180deg,rgba(241,235,223,0) 70%,var(--paper) 100%)}
.ab__clouds,.ab__halo{display:none}
.ab .m-title .riso__in{color:var(--ink)}
/* 书封：布面烫金 */
.cover .front{background:#1E2440 url(assets/art/answers-cover-480.webp) center/cover;box-shadow:inset 0 0 0 1px rgba(242,200,121,.25),inset -10px 0 18px -10px rgba(0,0,0,.6),0 30px 50px -30px rgba(10,14,30,.8)}
.cover .front::before{background:linear-gradient(90deg,rgba(0,0,0,.35) 0,rgba(0,0,0,0) 7%,rgba(255,255,255,.06) 8%,rgba(255,255,255,0) 14%),radial-gradient(circle at 70% 25%,rgba(255,240,210,.12),transparent 55%)}
.cover__sun{display:none}
.cover__mid{align-items:end;padding-bottom:4%}
.cover__t{writing-mode:horizontal-tb;font-size:clamp(14px,1.5vw,24px);letter-spacing:.42em;padding-left:.42em;color:#F2C879;text-shadow:0 1px 0 rgba(0,0,0,.4);
  background:linear-gradient(180deg,#F7DE9E,#C99A45);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cover__top{color:#F2C879}
.cover__bottom{color:#E9D6A8}
.cover .back.endpaper,.cover .back{background:#F1EBDF url(assets/art/answers-endpaper.webp) center/180px;box-shadow:inset 8px 0 18px -8px rgba(0,0,0,.25)}
/* 左页插画小景 */
.pg__orn--art{right:10%;top:22%;width:44%;aspect-ratio:1;object-fit:cover;border-radius:50%;opacity:1;
  -webkit-mask:radial-gradient(circle,#000 58%,transparent 71%);mask:radial-gradient(circle,#000 58%,transparent 71%);filter:saturate(.95)}
.cover__top{visibility:hidden}
.cover__bottom > span:first-child{visibility:hidden}
.cover__bottom{justify-content:flex-end}

/* ---------- 塔罗：烛光下的丝绒牌桌 ---------- */
.tdeck__c,.tc__back{background:#1B2146 url(assets/art/tarot-back.webp) center/cover}
.sh,.fc__in{background:#1B2146 url(assets/art/tarot-back-sm.webp) center/cover}
.tdeck__c,.tc__back,.sh,.fc__in{box-shadow:inset 0 0 0 1px rgba(242,200,121,.35),0 1px 0 rgba(0,0,0,.3),0 24px 40px -24px rgba(0,0,0,.85)}
.tr{background:radial-gradient(70% 70% at 72% 45%,rgba(43,50,102,.0),rgba(17,21,43,.75) 80%),url(assets/art/tarot-cloth.webp) 70% 50%/cover,#151A30}
.tt{background:radial-gradient(120% 80% at 50% 50%,rgba(23,28,58,.15),rgba(13,16,34,.85) 90%),url(assets/art/tarot-cloth.webp) center/cover,#141831}
.tr__sky{opacity:.45}
@media (max-width:760px){.tr,.tt{background-size:auto,auto 120%,auto}}
/* 塔罗解读：一张牌一块，位置含义 / 关键词 / 牌义 分区，扫一眼就能看懂 */
.trr__lbl{display:block;font:400 10.5px/1 var(--mono);letter-spacing:.16em;color:rgba(241,235,223,.5);margin-bottom:9px}
.trr__sum{margin:28px 0 8px;padding:20px 24px;border-radius:14px;background:rgba(242,200,121,.06);border:1px solid rgba(242,200,121,.18)}
.trr__sum ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.trr__sum li{font:400 15px/1.7 var(--serif-cn);color:rgba(241,235,223,.85)}
.trr__sum b{color:#F2C879;font-weight:600;margin-right:2px}
.trr__posbox{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding-bottom:14px;margin-bottom:16px;border-bottom:1px dashed rgba(241,235,223,.18)}
.trr__posbox .trr__lbl{margin:0;color:var(--accent)}
.trr__posbox b{font:700 18px/1.2 var(--serif-cn);letter-spacing:.12em;color:#F2C879}
.trr__posbox > span:not(.trr__lbl){font:400 14px/1.4 var(--serif-cn);color:rgba(241,235,223,.7)}
.trr__meta{display:flex;align-items:center;gap:12px;margin:12px 0 18px;font:400 12px/1 var(--mono);letter-spacing:.1em;color:rgba(241,235,223,.6)}
.trr__meta .trr__ori{margin:0}
.trr__grid{display:grid;grid-template-columns:minmax(150px,.7fr) 2fr;gap:18px 34px;align-items:start}
.trr__grid .trr__kw{flex-direction:column;align-items:flex-start;margin:0}
.trr__read{margin:20px 0 0;padding:14px 18px;border-left:2px solid var(--accent);background:rgba(229,72,44,.07);font:400 15px/1.75 var(--serif-cn);color:rgba(241,235,223,.88);max-width:46em}
.trr__read .trr__lbl{color:#F2C879}
@media (max-width:760px){.trr__grid{grid-template-columns:1fr}.trr__grid .trr__kw{flex-direction:row}}

/* 页码标记：三个栏目页本身有页眉，不再叠一个浮动页码（之前会压到正文）；游戏页改成带底色的小签，不再和内容打架 */
body[data-page="answers"] .folio,body[data-page="tarot"] .folio,body[data-page="horoscope"] .folio{display:none}
body[data-page="games"] .folio{padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--paper) 88%,transparent);box-shadow:0 1px 0 var(--line),0 8px 20px -12px rgba(30,42,38,.4)}
/* 牌阵小图标：用真牌背 */
.sp-ico i{border:0;background:#1B2146 url(assets/art/tarot-back-sm.webp) center/cover;box-shadow:0 0 0 1px rgba(242,200,121,.5),0 3px 6px -2px rgba(0,0,0,.6);opacity:1}
.sp-ico--celtic i:nth-child(7){border:1px dashed rgba(242,200,121,.5);background:none;box-shadow:none}
[data-spread].on .sp-ico i{box-shadow:0 0 0 1px #F2C879,0 0 10px rgba(242,200,121,.45)}

/* ---------- 星座运势 v7 ---------- */
.hs__art{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hs__art img{width:100%;height:100%;object-fit:cover;object-position:50% 85%;opacity:.9}
.hs__art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,26,48,.82) 0%,rgba(21,26,48,.45) 46%,rgba(21,26,48,.1) 100%),linear-gradient(180deg,rgba(21,26,48,.35),transparent 30%,transparent 70%,rgba(21,26,48,.9))}
.hs__clouds{opacity:.35}
.hs__sky{opacity:.45}
.hwheel__emb{position:absolute;left:50%;top:50%;width:56%;height:56%;margin:-28% 0 0 -28%;border-radius:50%;opacity:0;transform:scale(.92) rotate(-6deg);transition:opacity .9s ease,transform 1.4s cubic-bezier(.2,.8,.2,1);filter:saturate(.9);
  -webkit-mask:radial-gradient(circle,#000 58%,transparent 71%);mask:radial-gradient(circle,#000 58%,transparent 71%)}
.hwheel__emb.on{opacity:.5;transform:none}
.zgrid button{padding:10px 2px 9px;gap:4px;background:rgba(21,26,48,.55);backdrop-filter:blur(4px)}
.zgrid .zemb{width:46px;height:46px;border-radius:50%;box-shadow:0 0 0 1px rgba(242,200,121,.35);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.zgrid button .zg{display:none}
.zgrid button:hover .zemb{transform:scale(1.08) rotate(-4deg)}
.zgrid button.on{background:linear-gradient(180deg,rgba(229,72,44,.95),rgba(190,52,30,.95))}
.zgrid button.on .zemb{box-shadow:0 0 0 2px #F2C879,0 0 18px rgba(242,200,121,.55)}
.hr{background:linear-gradient(180deg,#151A30 0%,rgba(26,31,58,.96) 40%,#151A30 100%),url(assets/art/stars-bg-768.webp) center top/cover}
.hr__glyph{position:relative;background:none;box-shadow:none;overflow:visible}
.hr__glyph img{width:100%;height:100%;border-radius:50%;box-shadow:0 0 0 1.5px rgba(242,200,121,.6),0 18px 40px -14px rgba(0,0,0,.8)}
.hr__glyph .zg--badge{position:absolute;right:-4%;bottom:-4%;width:36%;height:36%;padding:7%;border-radius:50%;background:var(--accent);stroke:#F1EBDF;stroke-width:1.6;box-shadow:0 0 0 3px #151A30}
.lk__emb{width:22px;height:22px;border-radius:50%;vertical-align:-6px;margin-right:6px;box-shadow:0 0 0 1px rgba(242,200,121,.4)}
.zg path{stroke-linecap:round;stroke-linejoin:round}
@media (max-width:760px){.zgrid .zemb{width:38px;height:38px}}
.hr__brief{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.hr__brief p{margin:0;display:flex;align-items:baseline;gap:8px;padding:9px 14px;border-radius:12px;background:rgba(242,200,121,.1);box-shadow:inset 0 0 0 1px rgba(242,200,121,.35)}
.hr__brief p.lo{background:rgba(203,191,214,.08);box-shadow:inset 0 0 0 1px rgba(203,191,214,.3)}
.hr__brief span{font:400 11px/1 var(--mono);letter-spacing:.1em;opacity:.7}
.hr__brief b{font:700 16px/1 var(--serif-cn);letter-spacing:.12em;color:#F2C879}
.hr__brief p.lo b{color:#CBBFD6}
.hr__brief em{font:italic 400 15px/1 var(--display);opacity:.8}
.hc__tag{align-self:center;margin-left:auto;margin-right:10px;padding:4px 8px;border-radius:999px;font:500 10.5px/1 var(--sans,inherit);letter-spacing:.1em;background:#F2C879;color:#151A30;white-space:nowrap}
.hc__tag--lo{background:transparent;color:#CBBFD6;box-shadow:inset 0 0 0 1px rgba(203,191,214,.5)}
.hc--hi{box-shadow:inset 0 0 0 1px rgba(242,200,121,.45)}
.hc header .hc__tag + .hc__n{margin-left:0}
@media (max-width:760px){.hr__id .m-kicker{font-size:10px;letter-spacing:.04em}}
.tr__nudge{margin:10px 0 0;padding:10px 14px;border-radius:12px;font:400 13px/1.7 var(--serif-cn);color:#F1EBDF;background:rgba(229,72,44,.14);box-shadow:inset 3px 0 0 var(--accent);animation:nudge-in .45s cubic-bezier(.2,.8,.2,1)}
.tr__nudge b{color:#F2C879;margin-right:4px}
@keyframes nudge-in{from{opacity:0;transform:translateY(-4px)}}
.is-shake{animation:q-shake .42s cubic-bezier(.36,.07,.19,.97)}
@keyframes q-shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){.is-shake,.tr__nudge{animation:none}}
.hr__brief p.wt{flex-basis:100%;background:rgba(229,72,44,.1);box-shadow:inset 3px 0 0 var(--accent)}
.hr__brief p.wt b{color:#F1EBDF;font-size:15px}
.hr__brief p.wt i{font:400 12px/1 var(--serif-cn);opacity:.6;font-style:normal}
.trr__posl{flex-basis:100%;margin:6px 0 0;font:400 13px/1.7 var(--serif-cn);opacity:.78}
.trr__pic{margin:6px 0 10px;font:400 13px/1.7 var(--serif-cn);opacity:.72;font-style:italic}
.trr__pic .trr__lbl{display:inline;font-style:normal;margin-right:8px}

/* ---------- 免责声明（低调但可读） ---------- */
.disclaim{position:relative;padding:clamp(28px,4vw,48px) var(--pad) clamp(36px,5vw,64px)}
.disclaim__in{max-width:780px;margin:0 auto;padding-top:18px;border-top:1px dashed currentColor;border-color:color-mix(in srgb,currentColor 22%,transparent);opacity:.62;transition:opacity .4s}
.disclaim__in:hover,.disclaim__in:focus-within{opacity:.85}
.disclaim p{margin:0 0 6px;font:400 11.5px/1.85 var(--serif-cn);letter-spacing:.02em;text-wrap:pretty}
.disclaim .disclaim__t{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
.disclaim__t span{font:500 11px/1 var(--mono);letter-spacing:.18em;color:var(--accent)}
.disclaim__t em{font:italic 300 12px/1 var(--display);opacity:.7}
body[data-page="tarot"] .disclaim,body[data-page="horoscope"] .disclaim{background:#151A30;color:#F1EBDF}
body[data-page="answers"] .disclaim{color:var(--ink)}
.footer__disc{display:block;max-width:none;margin:28px 0 0;padding-top:14px;border-top:1px solid rgba(241,235,223,.1);font:400 10.5px/1.7 var(--serif-cn);opacity:.5}
@media (max-width:760px){.disclaim p{font-size:11px;line-height:1.8}}