@charset "UTF-8";
/* 小卜形象：见 xiaobu-figure.js。分层肖像按「脸居中的正方形」放进圆框；天眼符号用在进度条、提示、列表这些小地方。 */
.xb-face { display: block; flex: none; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px #d6a76a5c; }
.xb-mark { display: inline-block; flex: none; color: #e6b873; filter: drop-shadow(0 0 3px #eeb96a66); }

.xb-figure { position: relative; display: block; flex: none; width: var(--xb-size); height: var(--xb-size); isolation: isolate; }
.xb-frame { position: absolute; inset: 0; overflow: hidden; border-radius: 50%; background: #2a1f30; box-shadow: 0 0 0 1px #d6a76a66, 0 10px 34px #00000059, 0 0 calc(18px + var(--xb-third, 0) * 34px) #e3a95a38; }
.xb-stage { position: absolute; left: -5.6%; top: -21.4%; width: 124.3%; height: 132.3%; transform-origin: 50% 62%; animation: xb-breathe 5.4s ease-in-out infinite; }
/* 选择器写重一点：页面里有 .chat-welcome img、.shop-art img 这类旧样式会压到这些图层 */
.xb-figure .xb-stage > img, .xb-figure .xb-stage > canvas, .xb-figure .xb-stage > i { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; margin: 0; border-radius: 0; box-shadow: none; pointer-events: none; }
/* 眼部透明度由进度控制，不能被 .chat-welcome img{opacity:1} 这类旧样式压住，否则一直闭着眼 */
.xb-figure .xb-stage > .xb-live { opacity: 0; }
.xb-figure .xb-stage > .xb-live.is-on { opacity: 1; }
.xb-figure .xb-stage > .xb-lids { opacity: var(--xb-lids, 0); }
/* 天眼从竖缝往两边开：宽度跟进度走，不是淡入 */
.xb-figure .xb-stage > .xb-third { opacity: calc(var(--xb-third, 0) * 6); clip-path: ellipse(calc(var(--xb-third, 0) * 9%) 11.5% at 44.9% 46.6%); }
.xb-figure .xb-stage > .xb-glow { opacity: calc(var(--xb-third, 0) * .62); background: radial-gradient(circle at 44.9% 46.6%, #ffe2a8d9 0, #ffc66e66 6%, #ffb45a1f 13%, transparent 24%); mix-blend-mode: screen; animation:none; }
/* The soft highlights are clipped inside the portrait. No eye image is moved or crossfaded by these layers. */
.xb-figure .xb-stage > .xb-blink-light { opacity:var(--xb-blink-light,0); background:radial-gradient(ellipse 11% 1.6% at 31.7% 64.2%,#ffe4b0 0,#e9bc7b66 42%,transparent 100%),radial-gradient(ellipse 11% 1.6% at 61.7% 61.2%,#ffe4b0 0,#e9bc7b66 42%,transparent 100%); mix-blend-mode:screen; animation:none; }
.xb-figure .xb-stage > .xb-eye-aura { opacity:var(--xb-eye-aura,0); background:radial-gradient(ellipse 8.5% 13% at 44.9% 46.6%,transparent 42%,#ffe1a88c 58%,#dca15a29 78%,transparent 100%); mix-blend-mode:screen; animation:none; }


/* 外圈取自设定里的法器：一道细环，一颗慢慢绕行的灵石 */
.xb-ring { position: absolute; inset: -8%; border-radius: 50%; border: 1px solid #d9ad7240; animation: xb-spin 28s linear infinite; pointer-events: none; }
.xb-ring::before { content: ""; position: absolute; inset: 5%; border-radius: 50%; border: 1px dashed #d9ad7226; }
.xb-ring::after { content: ""; position: absolute; top: 50%; left: -4px; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffeecb, #c98d48 62%, #6d4524); box-shadow: 0 0 calc(8px + var(--xb-third, 0) * 12px) #f0b96a; }
[data-xb-state="B"] .xb-ring { animation-duration: 11s; border-color: #e6bb7a66; }

.xb-dust { position: absolute; inset: -6% 0 0; pointer-events: none; }
.xb-dust i { position: absolute; bottom: 8%; width: 3px; height: 3px; border-radius: 50%; background: #ffdca3; box-shadow: 0 0 6px #f3b765; opacity: 0; animation: xb-dust 8s linear infinite; }
.xb-dust i:nth-child(1) { left: 6%; animation-delay: -1s; }
.xb-dust i:nth-child(2) { left: 22%; animation-delay: -5.4s; animation-duration: 9.5s; }
.xb-dust i:nth-child(3) { left: 41%; animation-delay: -3s; animation-duration: 7.4s; }
.xb-dust i:nth-child(4) { left: 63%; animation-delay: -6.6s; }
.xb-dust i:nth-child(5) { left: 81%; animation-delay: -2.2s; animation-duration: 10s; }
.xb-dust i:nth-child(6) { left: 95%; animation-delay: -4.4s; animation-duration: 8.6s; }

@keyframes xb-breathe { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-.8%) scale(1.012); } }
@keyframes xb-spin { to { transform: rotate(360deg); } }
@keyframes xb-dust { 0% { transform: translate(0, 0); opacity: 0; } 12% { opacity: .85; } 80% { opacity: .35; } 100% { transform: translate(6px, calc(var(--xb-size) * -.92)); opacity: 0; } }

/* 放进页面的位置 */
.orbit .orbit-core { display: none; }
.xb-orbit-core { position: absolute; left: 50%; top: 47.7%; transform: translate(-50%, -50%); z-index: 2; }
/* 登录页：和 .gate-art 的圆环同圆心；不放进 .gate-art 里，那里的 i/span 有自己的样式 */
.xb-gate { position: absolute; left: calc(48% + 170px); top: calc(24% + 170px); transform: translate(-50%, -50%); z-index: 1; pointer-events: none; }
.mini-symbol .xb-figure { display: none; }
.empty-state .xb-figure { margin: 6px auto 26px; }
.error-box .xb-face { float: left; margin: 2px 14px 6px 0; }
.chat-welcome .xb-figure { align-self: center; }
.chat-reply > span .xb-face { display: inline-block; margin-right: 7px; vertical-align: -6px; }
.loading .xb-figure { margin: 8px auto 26px; }
.mingshu-status .xb-figure, .free-reading-progress .xb-figure { float: right; margin: 0 0 12px 22px; }
/* 侧栏：从提示卡上沿探出来，不占文字的宽度 */
.side-note { position: relative; padding-top: 30px; }
.side-note > [data-xb-figure] { position: absolute; top: -20px; right: 12px; }
.shop-art img.xb-figure-art { width: auto; height: 236px; border-radius: 16px; object-fit: contain; animation: xb-float 6.5s ease-in-out infinite; }
@keyframes xb-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

/* 时辰提示前的小点、阅读进度条的端头、提示条：都换成天眼的竖菱形 */
.time-welcome-dot { width: 8px; height: 14px; border-radius: 0; background: linear-gradient(#ffe4b0, #cf9650); box-shadow: none; clip-path: polygon(50% 0, 72% 42%, 50% 100%, 28% 42%); animation: xb-twinkle 3.6s ease-in-out infinite; }
@keyframes xb-twinkle { 0%, 100% { opacity: .72; } 50% { opacity: 1; } }
.reader-document [data-reader-progress-fill] { position: relative; }
.reader-document [data-reader-progress-fill]::after { content: ""; position: absolute; right: -7px; top: -5px; width: 14px; height: 18px; pointer-events: none; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 18'%3E%3Cpath d='M7 0 9.4 7 7 18 4.6 7Z' fill='%23f2c683'/%3E%3C/svg%3E"); filter: drop-shadow(0 0 5px #f0b96a); }
.reader-document .reader-progress[aria-valuenow="0"] [data-reader-progress-fill]::after { display: none; }
.toast::before { content: ""; display: inline-block; width: 11px; height: 15px; margin-right: 9px; vertical-align: -3px; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 18'%3E%3Cpath d='M7 0 9.4 7 7 18 4.6 7Z' fill='%23f2c683'/%3E%3C/svg%3E"); }

@media (min-width: 1450px) { .xb-gate { left: calc(53% + 170px); } }
@media (max-width: 1150px) { .xb-gate { left: calc(48% + 140px); top: calc(24% + 140px); } .xb-gate .xb-figure { --xb-size: 150px !important; } }
@media (max-width: 650px) {
  .gate-art, .xb-gate { display: none; }
  .mini-symbol > img { display: none; }
  .mini-symbol .xb-figure { display: block; margin: 0 0 6px; }
  .hero .orbit { opacity: 1; right: -22px; }
  .xb-orbit-core { top: 47.7%; }
  .mingshu-status .xb-figure, .free-reading-progress .xb-figure { float: none; margin: 0 0 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .xb-stage, .xb-glow, .xb-ring, .xb-dust i, .shop-art img.xb-figure-art, .time-welcome-dot { animation: none !important; }
  .xb-dust { display: none; }
}
@media print { .xb-figure, .xb-face, .xb-mark { display: none !important; } }

/* 场景姿态：复用原画，头部与所有眼层始终整体变换。 */
.xb-pose--float { transform-origin: 50% 85%; animation: xb-presence-float 7s ease-in-out infinite; }
.xb-pose--float .xb-frame { border-radius: 42% 42% 48% 48%; }
.xb-pose--welcome .xb-frame { border-radius: 45% 45% 22% 22%; }
.xb-pose--welcome { transform: rotate(-4deg); transition: transform 700ms ease; }
.empty-state:hover .xb-pose--welcome { transform: rotate(0deg) translateY(-3px); }
.side-note > [data-xb-figure] { top: -38px; right: 10px; pointer-events: none; }
.xb-pose--peek { transform: translateY(10px) rotate(9deg); transition: transform 800ms ease; }
.side-note:hover .xb-pose--peek, .side-note:focus-within .xb-pose--peek { transform: translateY(0) rotate(-5deg); }
.xb-pose--peek .xb-frame { border-radius: 46% 46% 32% 32%; }
.xb-orbit-core .xb-figure { transition: transform 900ms ease; }
.hero:hover .xb-orbit-core .xb-figure { transform: translateY(-4px) rotate(-4deg); }
@keyframes xb-presence-float { 0%,100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-5px) rotate(2deg); } }
@media (prefers-reduced-motion:reduce) {
 .xb-figure, .hero:hover .xb-orbit-core .xb-figure, .empty-state:hover .xb-pose--welcome, .side-note:hover .xb-pose--peek { animation:none!important; transition:none!important; transform:none!important; }
}

/* 2026-11-03：只在操作区与空状态补在场形象，报告原文与下载保持纯内容。 */
.xb-reader-companion { display:flex; align-items:center; gap:14px; max-width:1080px; margin:0 auto 22px; padding:0 24px; }
.xb-reader-companion > .xb-face { flex:0 0 48px; width:48px; height:48px; pointer-events:none; }
.daily-note:has(> .xb-daily-guide) { display:grid; grid-template-columns:56px minmax(0,1fr); column-gap:18px; align-items:start; }
.daily-note > .xb-daily-guide { grid-column:1; grid-row:1 / span 3; margin-top:3px; pointer-events:none; }
.daily-note > h3, .daily-note > p, .daily-note > .memory-actions { grid-column:2; min-width:0; }
.liuyao-progress-heading:has(> .xb-figure) { display:grid; grid-template-columns:72px minmax(0,1fr); gap:8px 18px; }
.liuyao-progress-heading > .xb-figure { grid-column:1; grid-row:1 / span 2; pointer-events:none; }
.liuyao-progress-heading > .xb-figure ~ .pill { grid-column:2; justify-self:start; }
.liuyao-progress-heading > .xb-figure ~ h2 { grid-column:2; min-width:0; margin:0; }
@media (max-width:650px) {
 .xb-reader-companion { gap:12px; padding:0 18px; margin-bottom:18px; }
 .xb-reader-companion > .xb-face { flex-basis:40px; width:40px; height:40px; }
 .daily-note:has(> .xb-daily-guide) { grid-template-columns:48px minmax(0,1fr); column-gap:12px; }
 .daily-note > .xb-daily-guide { --xb-size:48px!important; }
 .daily-note > .memory-actions { grid-column:1 / -1; margin-top:12px; }
 .liuyao-progress-heading:has(> .xb-figure) { grid-template-columns:56px minmax(0,1fr); gap:6px 12px; }
 .liuyao-progress-heading > .xb-figure { --xb-size:56px!important; }
}
@media print { .xb-reader-companion { display:none!important; } }

/* Additional eye effects are purely decorative and never appear in still/printed output. */
@media (prefers-reduced-motion:reduce) {
 .xb-figure .xb-stage > .xb-glow, .xb-figure .xb-stage > .xb-blink-light, .xb-figure .xb-stage > .xb-eye-aura { display:none!important; }
}
@media print {
 .xb-figure .xb-stage > .xb-glow, .xb-figure .xb-stage > .xb-blink-light, .xb-figure .xb-stage > .xb-eye-aura { display:none!important; }
}
