/* 昭祐殿皮肤。只写 body.col-xuyuan，不改 gx.css。 */
body.col-xuyuan {
  --ink-0: #f4ead6;
  --ink-1: #efe0c4;
  --ink-2: #e6d3ae;
  --ink-3: #c4a87a;
  --xuan: #4a3a28;
  --xuan-dim: #7a6550;
  --lamp: #e09a4a;
  --lamp-hi: #ffe2a8;
  --zhu: #b03a2e;
  --qing: #6f9488;
  --yue: #efe8dc;
  --paper: var(--ink-1);
  --paper-2: #fff6e4;
  --ink: var(--xuan);
  --line: var(--ink-3);
  --red: var(--zhu);
  --gold: var(--lamp);
  --vh: 1vh;
  background: #f4ead6;
  color: var(--xuan);
}
body.col-xuyuan.acc-qing { --lamp: #6f8f8a; --lamp-hi: #a8c4bf; }
body.col-xuyuan.acc-zhu { --lamp: #b03a2e; --lamp-hi: #e08a7a; }
body.col-xuyuan.acc-yue { --lamp: #cfd8dc; --lamp-hi: #f3f6f7; }
body.col-xuyuan.acc-xuan { --lamp: #e8e2d4; --lamp-hi: #fff8ea; }

body.col-xuyuan.hour-dawn { --xuan: #4a3a28; --lamp: #e0c48a; }
body.col-xuyuan.hour-dusk { --xuan: #4a3a28; --lamp: #e8b56a; }
body.col-xuyuan.hour-night { --xuan: #4a3a28; --lamp: #d4a05a; }

/* 说明页保留标准顶栏；沉浸首页藏顶栏与页脚，DOM 仍在给 SEO / 读屏 */
body.col-xuyuan.col-index .tool-top,
body.col-xuyuan.col-index .site-foot,
body.col-xuyuan.col-index main.tool-main > .disclaimer,
body.col-xuyuan.col-index main.tool-main > .prose,
body.col-xuyuan.col-index main.tool-main > .faq,
body.col-xuyuan.col-index main.tool-main > h1,
body.col-xuyuan.col-index main.tool-main > .sub {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
body.col-xuyuan.col-index,
body.col-xuyuan.col-index .wrap.tool-main,
body.col-xuyuan.col-index main.tool-main {
  margin: 0;
  padding: 0;
  max-width: none;
  width: 100%;
  overflow: hidden;
  height: var(--app-h, 100svh);
  max-height: var(--app-h, 100svh);
  overscroll-behavior: none;
}
body.col-xuyuan.col-index {
  position: fixed;
  inset: 0;
  top: var(--app-top, 0px);
  height: var(--app-h, 100svh);
}
html:has(body.col-xuyuan.col-index) {
  overflow: hidden;
  height: 100%;
  overscroll-behavior: none;
}
body.col-xuyuan.col-index .workbench {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  overflow: hidden;
  height: 100%;
}
body.col-xuyuan .site-head,
body.col-xuyuan .tool-top {
  background: rgba(244, 234, 214, .94);
  border-bottom-color: var(--ink-3);
}
body.col-xuyuan .brand, body.col-xuyuan .brand-emblem, body.col-xuyuan .top-mark { color: var(--lamp); }
body.col-xuyuan .card, body.col-xuyuan .workbench { background: var(--ink-2); border-color: var(--ink-3); }
body.col-xuyuan .btn { background: var(--lamp); color: var(--ink-0); }
body.col-xuyuan input, body.col-xuyuan select, body.col-xuyuan textarea {
  background: var(--ink-1); color: var(--xuan); border-color: var(--ink-3);
}
body.col-xuyuan .help-btn { color: var(--xuan-dim); }

.xy-stage {
  position: fixed;
  top: var(--app-top, 0px);
  left: 0;
  right: 0;
  width: auto;
  height: var(--app-h, 100svh);
  max-width: min(100vw, calc(var(--app-h, 100svh) * 9 / 16));
  margin: 0 auto;
  overflow: hidden;
  background: var(--ink-0);
  color: var(--xuan);
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", serif;
}
@media (min-aspect-ratio: 3/4) {
  .xy-stage { max-width: min(100vw, calc(var(--app-h, 100svh) * 9 / 16)); }
}
body.col-xuyuan.col-index { background: #f4ead6; }
body.col-xuyuan.col-index::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse at 18% 24%, rgba(255, 226, 170, .55), transparent 42%),
    radial-gradient(ellipse at 82% 78%, rgba(232, 181, 106, .22), transparent 46%),
    #f4ead6 url("/xuyuan/scene/tex-side.webp") center / cover;
  opacity: 1;
}
body.col-xuyuan.col-index .workbench { position: relative; z-index: 1; }

.xy-load, .xy-gate, .xy-open, .xy-hall, .xy-ritual, .xy-fin {
  position: absolute;
  inset: 0;
}
.xy-load {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  z-index: 8;
  background: var(--ink-0);
}
.xy-seam {
  width: 4px;
  height: 42%;
  background: var(--ink-3);
  border-radius: 2px;
  overflow: hidden;
}
.xy-seam i {
  display: block;
  width: 100%;
  height: 0;
  background: linear-gradient(to top, var(--lamp), var(--lamp-hi));
  box-shadow: 0 0 12px var(--lamp);
  transition: height .2s linear;
}
.xy-load-txt {
  margin: 0;
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  color: var(--xuan-dim);
  letter-spacing: .08em;
}
.xy-flat {
  min-width: 44px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--ink-3);
  background: transparent;
  color: var(--xuan-dim);
  font: inherit;
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  cursor: pointer;
}
.xy-gate { z-index: 4; }
.xy-scene {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: none;
}
.xy-scene svg { width: 100%; height: 100%; display: block; }
.xy-ring {
  position: absolute;
  left: 50%;
  top: 42%;
  width: min(72vw, 320px);
  height: min(72vw, 320px);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid rgba(232, 163, 92, .18);
  pointer-events: none;
}
.xy-ring i {
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: var(--lamp);
  transform: rotate(-90deg);
  transition: transform .2s linear;
}
.xy-plaque {
  position: absolute;
  left: 50%;
  top: max(18px, env(safe-area-inset-top));
  transform: translateX(-50%);
  text-align: center;
  z-index: 5;
}
.xy-plaque b {
  display: block;
  font-size: 1.5rem;
  letter-spacing: .25em;
  color: var(--lamp);
  text-shadow: 0 0 12px rgba(232, 163, 92, .45);
  font-weight: 500;
}
.xy-plaque-doc {
  display: inline-block;
  margin-top: 6px;
  min-height: 44px;
  line-height: 44px;
  color: var(--xuan-dim);
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  text-decoration: none;
}
.xy-bell, .xy-bowl {
  position: absolute;
  top: 36%;
  width: 112px;
  height: 148px;
  min-width: 88px;
  min-height: 88px;
  cursor: pointer;
  z-index: 8;
  touch-action: none;
}
.xy-bell { left: 4%; }
.xy-bowl { right: 4%; }
.xy-act-lab {
  display: none;
  position: absolute;
  left: 50%;
  bottom: -8px;
  transform: translate(-50%, 100%);
  width: max-content;
  max-width: 140px;
  margin: 0;
  padding: 4px 8px;
  font-style: normal;
  font-family: system-ui, sans-serif;
  font-size: .72rem;
  color: #4a3a28;
  background: rgba(255, 246, 228, .92);
  border: 1px solid var(--ink-3);
  pointer-events: none;
  text-align: center;
}
.xy-bell.is-now .xy-act-lab,
.xy-bowl.is-now .xy-act-lab,
.xy-lamps.is-now .xy-act-lab { display: block; }
.xy-bell.is-now,
.xy-bowl.is-now {
  outline: 2px solid var(--lamp);
  outline-offset: 4px;
  animation: xy-pulse 1.4s ease-in-out infinite;
}
@keyframes xy-pulse {
  0%, 100% { outline-color: var(--lamp); }
  50% { outline-color: var(--lamp-hi); }
}
.xy-mallet {
  position: absolute;
  right: 6px;
  top: 52px;
  width: 10px;
  height: 54px;
  border-radius: 4px;
  background: #8d6238;
  transform: rotate(-28deg);
  transform-origin: top center;
}
.xy-mallet::after {
  content: "";
  position: absolute;
  left: -8px;
  bottom: -10px;
  width: 26px;
  height: 18px;
  border-radius: 50%;
  background: #c9a06a;
}
.xy-bell-rope {
  display: block;
  width: 3px;
  height: 32px;
  margin: 0 auto;
  background: #8d6238;
  transform-origin: top center;
  transition: transform .08s linear;
}
.xy-bell-body {
  display: block;
  width: 64px;
  height: 64px;
  margin: 8px auto 0;
  border-radius: 50% 50% 42% 42%;
  background: radial-gradient(circle at 40% 30%, var(--lamp-hi), #c48432 70%);
  transform-origin: top center;
  transition: transform .08s linear;
}
.xy-bell.is-hit .xy-bell-body { filter: brightness(1.2); }
.xy-bell.is-hit .xy-mallet { transform: rotate(18deg); }
.xy-bowl-rim {
  display: block;
  width: 78px;
  height: 28px;
  margin: 18px auto 0;
  border: 3px solid #c4a87a;
  border-bottom: 0;
  border-radius: 78px 78px 0 0;
  background: transparent;
}
.xy-bowl-water {
  display: block;
  width: 72px;
  height: 48px;
  margin: -4px auto 0;
  border-radius: 0 0 40px 40px;
  border: 3px solid #c4a87a;
  border-top: 0;
  background: radial-gradient(circle at 40% 30%, #d7ebe4, #7fa89a 80%);
}
.xy-calm {
  display: block;
  width: 72px;
  height: 6px;
  margin: 8px auto 0;
  border-radius: 3px;
  background: rgba(196, 168, 122, .35);
  transform: scaleX(0);
  transform-origin: left center;
  background-image: linear-gradient(to right, #7fa89a, #e8b56a);
  background-size: 72px 6px;
}
.xy-lamps {
  position: absolute;
  left: 50%;
  bottom: 14%;
  transform: translateX(-50%);
  display: flex;
  gap: 12px;
  z-index: 8;
  padding: 10px 12px 28px;
}
.xy-lamps .xy-act-lab {
  bottom: 0;
  left: 50%;
}
.xy-lamp {
  width: 52px;
  height: 52px;
  border: 2px solid var(--ink-3);
  border-radius: 50% 50% 46% 46%;
  background: #efe0c4;
  cursor: pointer;
  padding: 0;
}
.xy-lamp[data-hue="su"] { background: #f3ead8; }
.xy-lamp[data-hue="lamp"] { background: #f0d2a0; }
.xy-lamp[data-hue="qing"] { background: #c9ddd4; }
.xy-lamp[data-hue="zhu"] { background: #e8c0b4; }
.xy-lamp[data-hue="yue"] { background: #eceff1; }
.xy-lamp[data-hue="su"].on { background: #f6edd8; box-shadow: 0 0 14px #f6edd8; }
.xy-lamp[data-hue="lamp"].on { background: var(--lamp); box-shadow: 0 0 14px var(--lamp); }
.xy-lamp[data-hue="qing"].on { background: var(--qing); box-shadow: 0 0 14px var(--qing); }
.xy-lamp[data-hue="zhu"].on { background: var(--zhu); box-shadow: 0 0 14px var(--zhu); }
.xy-lamp[data-hue="yue"].on { background: var(--yue); box-shadow: 0 0 14px #fff; }
.xy-lamps.is-now { outline: 2px dashed var(--lamp); outline-offset: 6px; }
.xy-push {
  position: absolute;
  left: 50%;
  top: 52%;
  transform: translate(-50%, -50%);
  min-width: 88px;
  min-height: 44px;
  border: 1px solid var(--lamp);
  background: rgba(255, 246, 228, .88);
  color: #8d6238;
  letter-spacing: .2em;
  font-family: "Noto Serif SC", serif;
  cursor: pointer;
}
.xy-gate[data-stage="0"] .xy-bowl,
.xy-gate[data-stage="0"] .xy-lamps { opacity: .55; pointer-events: none; }
.xy-gate[data-stage="1"] .xy-bell,
.xy-gate[data-stage="1"] .xy-lamps { opacity: .55; pointer-events: none; }
.xy-gate[data-stage="2"] .xy-bell,
.xy-gate[data-stage="2"] .xy-bowl { opacity: .55; pointer-events: none; }
.xy-gate-hint {
  position: absolute;
  left: 50%;
  bottom: 28%;
  transform: translateX(-50%);
  width: 86%;
  text-align: center;
  font-family: system-ui, sans-serif;
  font-size: .9rem;
  color: #4a3a28;
  text-shadow: 0 1px 0 rgba(255, 246, 228, .8);
  pointer-events: none;
  z-index: 6;
}
.xy-marks {
  position: absolute;
  left: 50%;
  bottom: 24%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 6;
  pointer-events: none;
}
.xy-marks i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink-3);
  box-shadow: inset 0 0 0 1px rgba(246, 237, 216, .2);
}
.xy-marks i.on {
  background: var(--lamp);
  box-shadow: 0 0 8px var(--lamp-hi);
}
.xy-bowl-water.is-calm {
  box-shadow: inset 0 0 16px rgba(122, 154, 143, .85), 0 0 12px rgba(232, 181, 106, .35);
}
.xy-open { z-index: 7; pointer-events: none; }
.xy-open.is-on { pointer-events: auto; }
.xy-open-l, .xy-open-r {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  background: #efe0c4;
  transition: transform 1.4s cubic-bezier(.25, .8, .25, 1);
}
.xy-open-l { left: 0; }
.xy-open-r { right: 0; }
.xy-open.kind-push.is-on .xy-open-l { transform: translateX(-100%); }
.xy-open.kind-push.is-on .xy-open-r { transform: translateX(100%); }
.xy-open-curtain {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, #efe0c4, #e6d3ae);
  transform: translateY(0);
  opacity: 0;
  transition: transform 1.4s cubic-bezier(.25, .8, .25, 1), opacity 1.4s cubic-bezier(.25, .8, .25, 1);
}
.xy-open.kind-curtain .xy-open-l,
.xy-open.kind-curtain .xy-open-r { opacity: 0; }
.xy-open.kind-curtain .xy-open-curtain { opacity: 1; }
.xy-open.kind-curtain.is-on .xy-open-curtain { transform: translateY(-100%); }
.xy-open-fog {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 40%, rgba(255, 246, 228, .7), #e6d3ae 70%);
  opacity: 0;
  transition: opacity 1.4s cubic-bezier(.25, .8, .25, 1);
}
.xy-open.kind-fog .xy-open-l,
.xy-open.kind-fog .xy-open-r { opacity: 0; }
.xy-open.kind-fog .xy-open-fog { opacity: 1; }
.xy-open.kind-fog.is-on .xy-open-fog { opacity: 0; }
.xy-open-veil {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(232, 163, 92, .35), transparent 60%);
  opacity: 0;
  transition: opacity 1.4s cubic-bezier(.25, .8, .25, 1);
}
.xy-open.kind-push.is-on .xy-open-veil { opacity: 1; }

.xy-hall {
  display: flex;
  flex-direction: column;
  z-index: 3;
  min-height: 0;
  padding: env(safe-area-inset-top, 0px) 12px 0;
}
#xy-hall-scene {
  z-index: 0;
  opacity: .42;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, #000 46%, transparent 76%);
  mask-image: linear-gradient(to bottom, #000 46%, transparent 76%);
}
.xy-hall > *:not(#xy-hall-scene) { position: relative; z-index: 1; }
body.col-xuyuan.hour-dawn .xy-ying {
  background: linear-gradient(to bottom, rgba(246, 237, 216, .16), transparent 42%);
}
body.col-xuyuan.hour-dusk .xy-ying {
  background: linear-gradient(to bottom, rgba(246, 237, 216, .1), rgba(232, 181, 106, .1));
}
body.col-xuyuan.hour-night .xy-ying {
  box-shadow: inset 0 0 60px rgba(42, 34, 24, .28);
}
body.col-xuyuan.hour-night .xy-xiang { filter: brightness(.9); }
.xy-ying {
  flex: 42 1 0;
  min-height: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 40px 16px 4px;
  background: linear-gradient(to bottom, rgba(246, 237, 216, .12), transparent 55%);
}
.xy-reply {
  flex: 1 1 0;
  min-height: 2.4em;
  max-height: none;
  font-size: clamp(1.05rem, 4.6vw, 1.35rem);
  line-height: 1.9;
  letter-spacing: .02em;
  color: var(--xuan);
  padding-right: 56px;
  overflow-wrap: anywhere;
  word-break: break-word;
  overflow-y: auto;
}
.xy-quote { flex: 0 0 auto; margin-top: .4em; text-align: center; }
.xy-quote[hidden] { display: none !important; }
.xy-quote-txt {
  font-size: clamp(1.15rem, 5vw, 1.5rem);
  line-height: 1.9;
  margin: 0 0 1.2em;
}
.xy-quote-src, .xy-quote-plain {
  margin: .2em 0;
  font-size: .82rem;
  color: var(--xuan-dim);
}
.xy-quote-src::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--zhu);
  vertical-align: middle;
}
.xy-xiang {
  position: absolute;
  right: 10px;
  top: 40px;
  width: 56px;
  height: 56px;
  opacity: .9;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent;
  border-radius: 50%;
  mix-blend-mode: multiply;
  filter: none;
}
.xy-notice {
  position: absolute;
  left: 16px;
  top: 8px;
  margin: 0;
  font-family: system-ui, sans-serif;
  font-size: .7rem;
  color: var(--xuan-dim);
  opacity: .7;
}
.xy-an {
  height: 48px;
  flex: none;
  display: flex;
  align-items: center;
  gap: 10px;
  border-top: 1px solid var(--ink-3);
  border-bottom: 1px solid var(--ink-3);
  padding: 0 8px;
}
.xy-incense {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 7px;
  height: 28px;
  pointer-events: none;
}
.xy-stick {
  position: relative;
  width: 3px;
  height: 20px;
  background: linear-gradient(to top, #2b333b 40%, var(--lamp));
  border-radius: 1px;
  box-shadow: 0 0 6px var(--lamp);
}
.xy-stick::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 4px;
  height: 14px;
  margin-left: -2px;
  background: linear-gradient(to top, rgba(207, 216, 220, .55), transparent);
  animation: xy-smoke 2.4s ease-in-out infinite;
}
.xy-incense[data-lv="1"] .xy-stick:nth-child(n+2) { visibility: hidden; }
.xy-incense[data-lv="2"] .xy-stick:nth-child(n+4) { visibility: hidden; }
.xy-incense[data-lv="3"] .xy-stick:nth-child(n+8) { visibility: hidden; }
.xy-incense[data-lv="3"] { gap: 5px; }
.xy-incense[data-lv="3"]::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 40%;
  height: 10px;
  bottom: 22px;
  background: linear-gradient(to top, rgba(207, 216, 220, .25), transparent);
  pointer-events: none;
}
.xy-hall.is-think .xy-stick { height: 22px; box-shadow: 0 0 8px var(--lamp); }
.xy-status {
  flex: 1;
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  color: var(--xuan-dim);
}
.xy-bell-btn {
  min-width: 44px;
  min-height: 44px;
  border: 0;
  background: transparent;
  color: var(--xuan-dim);
  cursor: pointer;
  font-family: "Noto Serif SC", serif;
}
.xy-bell-btn[aria-pressed="true"] { color: var(--lamp); }
.xy-debug {
  flex: 0 1 auto;
  margin-top: auto;
  padding: 8px 8px 4px 0;
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
  font-size: .64rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  color: #6a5846;
  background: transparent;
  border: 0;
  max-height: calc(100% - 2.4em);
  overflow-x: hidden;
  overflow-y: auto;
  opacity: .9;
}
.xy-debug[hidden] { display: none; }
body.col-xuyuan .xy-yong {
  flex: 1 1 34%;
  min-height: 120px;
  max-height: 46%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 6px;
  padding: 8px 10px 10px;
  z-index: 6;
  background: #f7edd8;
  border-top: 1px solid var(--ink-3);
}
body.col-xuyuan .xy-yong::before {
  content: "";
  flex: 1 1 0;
  min-height: 0;
}
body.col-xuyuan .xy-strip {
  flex: 0 0 auto;
  align-self: flex-end;
  max-width: 88%;
  margin: 0;
  padding: 6px 10px;
  color: #1a1208;
  text-align: right;
  line-height: 1.45;
  background: #fffdf6;
  border: 1px solid #8a6a3a;
}
body.col-xuyuan .xy-strip.is-new { animation: xy-fly .45s ease-out; }
body.col-xuyuan .xy-strip-txt {
  margin: 0;
  font-size: 1.02rem;
  font-weight: 600;
  color: #1a1208;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.xy-strip-note {
  margin: 4px 0 0;
  font-size: .7rem;
  line-height: 1.35;
  color: #6a5040;
  font-family: system-ui, sans-serif;
  text-align: right;
}
.xy-strip.out { animation: xy-fade 0.8s ease-out forwards; }
@keyframes xy-fly {
  from { transform: translateY(40px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes xy-fade { to { opacity: 0; } }
.xy-leads {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 86px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  pointer-events: none;
}
.xy-leads button {
  pointer-events: auto;
  min-height: 44px;
  border: 0;
  background: transparent;
  color: var(--xuan-dim);
  opacity: .55;
  text-align: left;
  font: inherit;
  font-size: .9rem;
  cursor: pointer;
}
.xy-desk {
  flex: none;
  z-index: 50;
  background: #efe0c4;
  border-top: 1px solid var(--ink-3);
}
.xy-draft {
  margin: 0;
  padding: 10px 12px 4px;
  color: #4a3a28;
  font-size: 1.08rem;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  max-height: 28vh;
  overflow-y: auto;
}
.xy-draft[hidden] { display: none; }
.xy-typing {
  margin: 8px 0 0;
  padding: 8px 10px;
  color: #4a3a28;
  font-size: 1.08rem;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  text-align: right;
  background: rgba(255, 246, 228, .8);
  border-radius: 8px;
  max-height: 36%;
  overflow-y: auto;
}
.xy-typing[hidden] { display: none; }
.xy-composer {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 8px 10px 10px;
}
body.col-xuyuan.xy-kb .xy-hold,
body.col-xuyuan.xy-kb .xy-curtain { display: none; }
body.col-xuyuan.xy-kb .xy-leads { flex: 0 0 0; max-height: 0; min-height: 0; overflow: hidden; opacity: 0; pointer-events: none; }
body.col-xuyuan.xy-kb .xy-yong { flex: 1 1 auto; max-height: 36%; overflow-y: auto; }
body.col-xuyuan.xy-kb .xy-ying { flex: 1 1 auto; }
body.col-xuyuan.xy-kb .xy-an { display: none; }
body.col-xuyuan.xy-kb .xy-xiang { opacity: .22; }
.xy-hold, .xy-send, .xy-curtain {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid var(--ink-3);
  background: transparent;
  color: var(--xuan);
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  cursor: pointer;
}
.xy-write { flex: 1; display: flex; gap: 6px; align-items: flex-end; min-width: 0; }
.xy-write textarea {
  flex: 1;
  min-height: 48px;
  max-height: 200px;
  height: 48px;
  resize: none;
  font-size: 17px;
  line-height: 1.5;
  overflow-y: auto;
  word-break: break-word;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  padding: 10px 12px;
  background: #fff8ea;
  color: #4a3a28;
  caret-color: #e8c98a;
}
.xy-send {
  min-width: 52px;
  background: var(--lamp);
  color: #4a3a28;
  border-color: var(--lamp);
}
.xy-inkdrop {
  position: absolute;
  left: 20%;
  top: 30%;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--ink-3), transparent 70%);
  animation: xy-ink 1.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes xy-ink {
  0% { transform: scale(.4); opacity: .2; }
  70% { transform: scale(1.6); opacity: .08; }
  100% { transform: scale(1.8); opacity: 0; }
}
.xy-halo {
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(255, 217, 160, .35);
  pointer-events: none;
  animation: xy-halo .3s ease-out forwards;
}
@keyframes xy-halo { to { opacity: 0; transform: scale(1.02); } }

.xy-ritual {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  background: var(--ink-0);
  z-index: 6;
}
.xy-seal-word { font-size: clamp(1.15rem, 5vw, 1.5rem); text-align: center; padding: 0 24px; }
.xy-seal {
  width: 88px;
  height: 88px;
  min-width: 44px;
  border: 2px solid var(--zhu);
  color: var(--zhu);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  letter-spacing: .2em;
  transform: translateY(-12px);
  transition: transform 1.5s linear;
  cursor: pointer;
  user-select: none;
}
.xy-seal.down { transform: translateY(8px); }
.xy-seal-hint { font-family: system-ui, sans-serif; font-size: .78rem; color: var(--xuan-dim); }
.xy-fin {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: var(--ink-0);
  z-index: 6;
}
.xy-fin::before {
  content: "";
  width: 3px;
  height: 28%;
  background: linear-gradient(to bottom, var(--lamp-hi), transparent);
  box-shadow: 0 0 10px var(--lamp);
}
.xy-fin-slit {
  margin: 0;
  font-size: .9rem;
  letter-spacing: .2em;
  color: var(--lamp);
}
.xy-fin-acts { display: flex; gap: 12px; }
.xy-knob {
  position: absolute;
  top: max(10px, env(safe-area-inset-top));
  right: max(10px, env(safe-area-inset-right));
  z-index: 9;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  color: var(--xuan);
  opacity: .55;
  font-family: "Noto Serif SC", serif;
  cursor: pointer;
}
.xy-knobpanel {
  position: absolute;
  top: calc(env(safe-area-inset-top) + 52px);
  right: 10px;
  z-index: 10;
  min-width: 11.5em;
  padding: 8px;
  background: var(--ink-2);
  border: 1px solid var(--ink-3);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.xy-knobpanel .xy-flat { width: 100%; text-align: left; text-decoration: none; box-sizing: border-box; }
.xy-knob-halls a {
  display: block;
  min-height: 36px;
  line-height: 36px;
  color: var(--xuan-dim);
  text-decoration: none;
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  padding: 0 8px;
}
.xy-ask {
  position: absolute;
  inset: 0;
  z-index: 12;
  background: rgba(11, 13, 15, .72);
  display: flex;
  align-items: center;
  justify-content: center;
}
.xy-ask-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 20px;
  background: var(--ink-2);
  border: 1px solid var(--ink-3);
  min-width: 220px;
}
.xy-land {
  position: absolute;
  left: 50%;
  bottom: 12%;
  transform: translateX(-50%);
  z-index: 11;
  font-family: system-ui, sans-serif;
  font-size: .78rem;
  color: var(--xuan-dim);
}
.xy-plain {
  max-width: 36rem;
  margin: 24px auto;
  padding: 16px;
  color: var(--xuan);
}
.xy-plain-log { min-height: 8em; white-space: pre-wrap; line-height: 1.8; }
.xy-plain textarea { width: 100%; min-height: 6em; margin: 8px 0; }
.xy-crisis {
  color: var(--xuan);
  line-height: 1.9;
}
.xy-crisis a { color: var(--zhu); }

@media (max-height: 719px) {
  body.col-xuyuan .xy-ying { flex: 42 1 0; }
  body.col-xuyuan .xy-an { height: 40px; }
  body.col-xuyuan .xy-yong { flex: 1 1 38%; max-height: 48%; }
}
body.col-xuyuan.xy-hard .xy-incense { opacity: .8; }
body.col-xuyuan.xy-hard .xy-xiang { display: none; }
body.col-xuyuan.xy-hard .xy-knob-share,
body.col-xuyuan.xy-hard #xy-fin-share { display: none; }
body.col-xuyuan.xy-fest .xy-lamp.on { box-shadow: 0 0 16px var(--lamp-hi); }
body.col-xuyuan.xy-hard.xy-fest .xy-lamp.on { box-shadow: none; }

body.col-xuyuan.col-index {
  background-color: #f4ead6;
  background-image: url("/xuyuan/scene/tex-side.webp");
  background-size: cover;
  background-position: center;
}
body.col-xuyuan.hour-dawn { --lamp: #e0c48a; }
body.col-xuyuan.hour-day { }
body.col-xuyuan.hour-dusk { --lamp: #e8b56a; }
body.col-xuyuan.hour-night { --lamp: #d4a05a; }
body.col-xuyuan.xy-fest-chuxi { --lamp: #e08a3a; --lamp-hi: #ffd9a0; }
body.col-xuyuan.xy-fest-yuanxiao { --lamp: #e8a35c; --zhu: #c45c4a; }
body.col-xuyuan.xy-fest-qixi { --lamp: #c4846a; }
body.col-xuyuan.xy-fest-zhongqiu { --lamp: #e8c07a; }
body.col-xuyuan.xy-fest-dongzhi { --lamp: #a8b8b4; }

.xy-atmo {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.xy-scene svg {
  width: 100%;
  height: 100%;
  display: block;
  animation: xy-fadein .6s ease-out;
}
@keyframes xy-fadein { from { opacity: 0; } to { opacity: 1; } }
.xy-mist {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 18%, rgba(255, 246, 228, .35), transparent 50%);
  animation: none;
  opacity: .55;
}
@keyframes xy-mist {
  0%, 100% { opacity: .7; transform: translateX(0); }
  50% { opacity: 1; transform: translateX(12px); }
}
.xy-scene .xy-fog { animation: none; opacity: .4; }
@keyframes xy-fogdrift {
  0%, 100% { transform: translateX(0); opacity: .7; }
  50% { transform: translateX(24px); opacity: 1; }
}
.xy-scene .xy-lantern { animation: xy-flicker 2.6s ease-in-out infinite; transform-origin: center bottom; }
@keyframes xy-flicker {
  0%, 100% { opacity: .85; }
  40% { opacity: 1; }
  70% { opacity: .7; }
}
.xy-scene .xy-leaf { animation: xy-leaf 11s linear infinite; }
@keyframes xy-leaf {
  0% { transform: translate(0, 0) rotate(0); }
  100% { transform: translate(40px, 180px) rotate(50deg); }
}
body.col-xuyuan.hour-night .xy-scene .xy-lantern:not(.keep) {
  opacity: .55;
  animation: none;
}
body.col-xuyuan.hour-night .xy-lamp:not(.on) {
  opacity: 1;
}
body.col-xuyuan.hour-dawn .xy-mist { opacity: .95; }
body.col-xuyuan.hour-dusk .xy-open-veil { background: radial-gradient(ellipse at 70% 40%, rgba(232, 163, 92, .5), transparent 60%); }
body.col-xuyuan.xy-hard .xy-mist,
body.col-xuyuan.xy-hard .xy-scene .xy-fog,
body.col-xuyuan.xy-hard .xy-scene .xy-leaf { animation: none; }
body.col-xuyuan.xy-hard.xy-fest-chuxi .xy-lamp.on,
body.col-xuyuan.xy-hard.xy-fest .xy-scene .xy-lantern { animation: none; box-shadow: none; }

.xy-gesture {
  position: absolute;
  left: 12%;
  top: 46%;
  width: 56px;
  height: 56px;
  border: 1px dashed var(--xuan-dim);
  border-radius: 8px;
  opacity: .7;
  pointer-events: none;
  z-index: 6;
}
.xy-gesture.phone::after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 2px solid var(--lamp);
  border-radius: 4px;
  animation: xy-tilt 1s ease-in-out 3;
}
.xy-gesture.drag::after {
  content: "→";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--lamp);
  animation: xy-drag 1s ease-in-out 3;
}
@keyframes xy-tilt { 50% { transform: rotate(18deg); } }
@keyframes xy-drag { 50% { transform: translateX(10px); } }

.xy-bell-body {
  box-shadow: 0 8px 18px rgba(0, 0, 0, .45), 0 0 12px rgba(232, 163, 92, .25);
}
.xy-bowl-water {
  animation: xy-ripple 4s ease-in-out infinite;
}
@keyframes xy-ripple {
  0%, 100% { box-shadow: inset 0 0 12px rgba(111, 143, 138, .4); }
  50% { box-shadow: inset 0 0 18px rgba(111, 143, 138, .7); }
}

.xy-seal {
  transition: transform .3s ease-out;
}
.xy-seal.holding {
  transition: transform 1.5s linear;
  transform: translateY(8px);
}
.xy-seal.down { transform: translateY(8px); }
.xy-seal-word.dissolve {
  animation: xy-dissolve 1.5s linear forwards;
}
@keyframes xy-dissolve {
  to { opacity: 0; filter: blur(6px); letter-spacing: .2em; }
}
.xy-close-doors {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, var(--lamp-hi), transparent);
  opacity: 0;
}
.xy-ritual.is-shut .xy-close-doors { opacity: 1; }

@keyframes xy-smoke {
  0%, 100% { transform: translateY(0) scaleX(1); opacity: .5; }
  50% { transform: translateY(-8px) scaleX(1.4); opacity: .2; }
}

.xy-xiang {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

@media (prefers-reduced-motion: reduce) {
  .xy-stage *, .xy-stage *::before, .xy-stage *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .2s !important;
  }
}
@media (orientation: landscape) and (max-height: 500px) {
  .xy-land { display: block; }
}
.xy-land[hidden], [hidden] { display: none !important; }