@lemoncat7/dsh-theme-xiaohei 0.3.0-alpha.23 → 0.3.2

package/lib/scene.js

@@ -1,1024 +1,8 @@
-import { XIAOHEI_COMPLETE, XIAOHEI_DAWN_KEY_ART, XIAOHEI_THINKING, XIAOHEI_ERROR, XIAOHEI_HEIXIU_BLINK, XIAOHEI_HEIXIU_OPEN, XIAOHEI_IDLE_BLINK, XIAOHEI_IDLE_SHEET, XIAOHEI_NIGHT_KEY_ART, XIAOHEI_STREAMING, XIAOHEI_TOOL, XIAOHEI_WAITING, } from './generated-keyart.js';
-import { XIAOHEI_HEIXIU_FEEDBACK_CSS } from './scene/heixiu-feedback.js';
-import { XIAOHEI_HEIXIU_INTERACTION_CSS } from './scene/heixiu-interactions.js';
-import { XIAOHEI_STATE_TRANSITION_CSS } from './scene/state-transitions.js';
-/** DOM ids are exported so lifecycle and browser tests can detect leaks. */
-export const XIAOHEI_SCENE_STYLE_ID = 'dsh-theme-xiaohei/scene-style';
-export const XIAOHEI_SCENE_LAYER_ID = 'dsh-theme-xiaohei/scene-layer';
-/**
- * The generated key art is a real raster asset. CSS supplies only atmosphere
- * and motion, never a shape-built substitute for the character.
- */
-const XIAOHEI_SCENE_BASE_CSS = `
-body {
-  background: #151C1E;
-}
-
-html[data-xiaohei-appearance='light'] body {
-  background: #E5EBF1;
-}
-
-#root {
-  position: relative;
-  z-index: 1;
-}
-
-#${cssEscape(XIAOHEI_SCENE_LAYER_ID)} {
-  position: fixed;
-  inset: 0;
-  z-index: 0;
-  overflow: hidden;
-  contain: strict;
-  isolation: isolate;
-  pointer-events: none;
-  user-select: none;
-  background: #151C1E;
-}
-
-html[data-xiaohei-appearance='light'] #${cssEscape(XIAOHEI_SCENE_LAYER_ID)} {
-  background:
-    radial-gradient(80% 64% at 16% 8%, rgb(248 250 252 / 82%), transparent 72%),
-    radial-gradient(70% 58% at 86% 88%, rgb(207 220 230 / 48%), transparent 76%),
-    #E5EBF1;
-}
-
-#${cssEscape(XIAOHEI_SCENE_LAYER_ID)} > * {
-  position: absolute;
-  display: block;
-  pointer-events: none;
-}
-
-.xiaohei-scene__keyart {
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  max-width: none;
-  object-fit: cover;
-  object-position: center bottom;
-  transform: scale(1.002);
-  filter: blur(0.55px) saturate(96%) contrast(98%);
-  transition: opacity 320ms ease-out;
-}
-
-.xiaohei-scene__keyart--night {
-  opacity: 0.98;
-}
-
-.xiaohei-scene__keyart--dawn {
-  opacity: 0;
-}
-
-@media (max-aspect-ratio: 4 / 3) {
-  .xiaohei-scene__keyart {
-    object-position: 66% bottom;
-  }
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__keyart--night {
-  opacity: 0;
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__keyart--dawn {
-  opacity: 0.98;
-}
-
-.xiaohei-scene__veil {
-  inset: 0;
-  background:
-    linear-gradient(90deg, rgb(8 13 15 / 4%) 0%, transparent 48%, rgb(8 13 15 / 4%) 100%),
-    linear-gradient(180deg, rgb(8 13 15 / 2%) 0%, transparent 58%, rgb(8 13 15 / 4%) 100%);
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__veil {
-  background:
-    linear-gradient(90deg, rgb(58 74 88 / 3%) 0%, transparent 48%, rgb(58 74 88 / 4%) 100%),
-    linear-gradient(180deg, rgb(255 255 255 / 10%) 0%, transparent 54%, rgb(74 91 105 / 5%) 100%);
-}
-
-.xiaohei-scene__spirit {
-  width: 0.58rem;
-  aspect-ratio: 1;
-  border-radius: 50%;
-  background: #8BE5D5;
-  box-shadow: 0 0 0.7rem rgb(117 228 208 / 88%), 0 0 1.8rem rgb(101 209 190 / 56%);
-  mix-blend-mode: screen;
-  opacity: 0.18;
-  will-change: transform, opacity;
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__spirit {
-  background: #4D927C;
-  box-shadow: 0 0 0.45rem rgb(67 133 111 / 54%), 0 0 1.4rem rgb(106 151 132 / 28%);
-  mix-blend-mode: multiply;
-}
-
-.xiaohei-scene__spirit--one {
-  right: 22%;
-  bottom: 20%;
-  animation: xiaohei-spirit-one 6.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
-}
-
-.xiaohei-scene__spirit--two {
-  right: 34%;
-  bottom: 30%;
-  animation: xiaohei-spirit-two 8.4s cubic-bezier(0.37, 0, 0.63, 1) -2.2s infinite;
-}
-
-.xiaohei-scene__spirit--three {
-  right: 13%;
-  bottom: 45%;
-  animation: xiaohei-spirit-three 7.7s cubic-bezier(0.37, 0, 0.63, 1) -4.1s infinite;
-}
-
-.xiaohei-scene__mascot {
-  right: clamp(4.5rem, 8vw, 9rem);
-  bottom: clamp(5rem, 10vh, 7rem);
-  width: clamp(11.5rem, 19vw, 19rem);
-  aspect-ratio: 1;
-  overflow: visible;
-  isolation: isolate;
-  filter:
-    drop-shadow(0 0.6rem 1.45rem rgb(83 218 193 / 35%))
-    drop-shadow(0 1.25rem 2.6rem rgb(1 9 10 / 30%));
-}
-
-.xiaohei-scene__mascot-idle-viewport {
-  position: absolute;
-  inset: 0;
-  z-index: 1;
-  overflow: hidden;
-  pointer-events: none;
-}
-
-.xiaohei-scene__mascot::before {
-  content: '';
-  position: absolute;
-  z-index: 0;
-  inset: 4%;
-  border-radius: 50%;
-  background: radial-gradient(
-    circle at 50% 55%,
-    rgb(190 255 242 / 68%) 0%,
-    rgb(90 228 202 / 48%) 38%,
-    rgb(34 144 132 / 18%) 58%,
-    transparent 74%
-  );
-  opacity: 0.66;
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__mascot {
-  filter:
-    drop-shadow(0 0.55rem 0.9rem rgb(40 58 51 / 22%))
-    drop-shadow(0 1.15rem 2.2rem rgb(45 64 56 / 14%));
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__mascot::before {
-  background: radial-gradient(
-    circle at 50% 58%,
-    rgb(236 242 230 / 72%) 0%,
-    rgb(198 219 202 / 34%) 40%,
-    transparent 72%
-  );
-  opacity: 0.42;
-}
-
-.xiaohei-scene__heixiu-field {
-  inset: 0;
-  overflow: hidden;
-}
-
-.xiaohei-scene__heixiu {
-  position: absolute;
-  display: block;
-  aspect-ratio: 1;
-  opacity: var(--heixiu-opacity, 0.58);
-  filter:
-    drop-shadow(0 0.32rem 0.58rem rgb(109 233 211 / 18%))
-    drop-shadow(0 0.68rem 1.15rem rgb(1 9 10 / 20%));
-  will-change: transform;
-}
-
-#root [data-slot='sidebar'] > div,
-#root [data-slot='conversation.composer.bar'] > div {
-  position: relative !important;
-}
-
-.xiaohei-scene__heixiu-body > img {
-  position: absolute;
-  display: block;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  max-width: none;
-  max-height: none;
-  object-fit: contain;
-  filter: brightness(1.12) contrast(1.04) saturate(0.82);
-}
-
-.xiaohei-scene__heixiu-open {
-  opacity: 1;
-  will-change: opacity;
-  animation: xiaohei-heixiu-open var(--heixiu-blink-duration, 7.6s) step-end var(--heixiu-blink-delay, 0s) infinite;
-}
-
-.xiaohei-scene__heixiu-blink {
-  opacity: 0;
-  will-change: opacity;
-  animation: xiaohei-heixiu-blink var(--heixiu-blink-duration, 7.6s) step-end var(--heixiu-blink-delay, 0s) infinite;
-}
-
-.xiaohei-scene__heixiu--mascot {
-  right: clamp(19rem, 25vw, 30rem);
-  bottom: clamp(9.5rem, 16vh, 13rem);
-  width: clamp(4.2rem, 5.4vw, 5.5rem);
-  --heixiu-opacity: 0.72;
-  --heixiu-blink-duration: 7.2s;
-  --heixiu-blink-delay: -1.1s;
-  animation: xiaohei-heixiu-drift-one 13.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
-}
-
-.xiaohei-scene__heixiu--sidebar {
-  z-index: 6;
-  left: 7.15rem;
-  right: auto;
-  top: 8.05rem;
-  width: 2.5rem;
-  --heixiu-opacity: 0.76;
-  --heixiu-blink-duration: 8.9s;
-  --heixiu-blink-delay: -4.7s;
-  animation: xiaohei-heixiu-drift-two 16.2s cubic-bezier(0.37, 0, 0.63, 1) -5.2s infinite;
-}
-
-.xiaohei-scene__heixiu--sidebar .xiaohei-scene__heixiu-body > img {
-  filter: brightness(1.18) contrast(1.09) saturate(0.86);
-}
-
-.xiaohei-scene__heixiu--composer {
-  z-index: 3;
-  left: 54%;
-  right: auto;
-  top: -1.7rem;
-  width: 3.45rem;
-  --heixiu-opacity: 0.6;
-  --heixiu-blink-duration: 9.4s;
-  --heixiu-blink-delay: -6.2s;
-  animation: xiaohei-heixiu-drift-three 17.2s cubic-bezier(0.37, 0, 0.63, 1) -8.1s infinite;
-}
-
-.xiaohei-scene__heixiu--sidebar::before,
-.xiaohei-scene__heixiu--composer::before {
-  content: '';
-  position: absolute;
-  z-index: -1;
-  left: 50%;
-  top: -0.72rem;
-  width: 1px;
-  height: 0.85rem;
-  background: linear-gradient(180deg, transparent, var(--xiaohei-frame-line-strong));
-  box-shadow: 0 0 0.35rem var(--xiaohei-focus-shadow);
-  transform: translateX(-50%);
-}
-
-#root [data-slot='sidebar'] > div[class*='_collapsed'] .xiaohei-scene__heixiu--sidebar {
-  display: none;
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__heixiu {
-  filter:
-    drop-shadow(0 0.28rem 0.5rem rgb(52 83 71 / 13%))
-    drop-shadow(0 0.62rem 1rem rgb(45 64 56 / 10%));
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__heixiu-body > img {
-  filter: brightness(1.02) contrast(1.05) saturate(0.74);
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__heixiu--sidebar .xiaohei-scene__heixiu-body > img {
-  filter: brightness(1.03) contrast(1.1) saturate(0.78);
-}
-
-.xiaohei-scene__mascot-sheet {
-  position: absolute;
-  display: block;
-  inset: 0 auto auto 0;
-  width: 400%;
-  height: 200%;
-  max-width: none;
-  max-height: none;
-  object-fit: fill;
-  transform: translate3d(0, 0, 0);
-  opacity: 0;
-  z-index: 1;
-  filter: brightness(1.32) contrast(1.02) saturate(1.04);
-}
-
-.xiaohei-scene__mascot-sheet--open {
-  opacity: 1;
-  transition: opacity 120ms ease-out;
-}
-
-.xiaohei-scene__mascot-blink {
-  position: absolute;
-  display: block;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  max-width: none;
-  max-height: none;
-  object-fit: contain;
-  opacity: 0;
-  z-index: 3;
-  filter: brightness(1.32) contrast(1.02) saturate(1.04);
-  will-change: opacity;
-}
-
-.xiaohei-scene__mascot-state {
-  position: absolute;
-  display: block;
-  left: 50%;
-  bottom: 0;
-  width: 100%;
-  height: auto;
-  max-width: none;
-  max-height: none;
-  object-fit: contain;
-  opacity: 0;
-  z-index: 1;
-  filter: brightness(1.32) contrast(1.02) saturate(1.04);
-  transform: translateX(-50%);
-  transform-origin: 50% 100%;
-  transition: opacity 120ms ease-out;
-}
-
-.xiaohei-scene__mascot-state--thinking {
-  filter: brightness(1.34) contrast(1.02) saturate(1.03);
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__mascot-sheet,
-html[data-xiaohei-appearance='light'] .xiaohei-scene__mascot-blink,
-html[data-xiaohei-appearance='light'] .xiaohei-scene__mascot-state {
-  filter: brightness(1.02) contrast(1.07) saturate(0.9);
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__mascot-state--thinking {
-  filter: brightness(1.04) contrast(1.06) saturate(0.91);
-}
-
-html:not([data-xiaohei-state='idle']) .xiaohei-scene__mascot-sheet--open {
-  opacity: 0;
-}
-
-html:not([data-xiaohei-state='idle']) .xiaohei-scene__mascot-blink {
-  opacity: 0;
-  animation: none;
-}
-
-html[data-xiaohei-state='thinking'] .xiaohei-scene__mascot-state--thinking,
-html[data-xiaohei-state='streaming'] .xiaohei-scene__mascot-state--streaming,
-html[data-xiaohei-state='tool'] .xiaohei-scene__mascot-state--tool,
-html[data-xiaohei-state='waiting'] .xiaohei-scene__mascot-state--waiting,
-html[data-xiaohei-state='complete'] .xiaohei-scene__mascot-state--complete,
-html[data-xiaohei-state='error'] .xiaohei-scene__mascot-state--error {
-  opacity: 1;
-}
-
-.xiaohei-scene__thinking-fx,
-.xiaohei-scene__thinking-bubble,
-.xiaohei-scene__thinking-dot {
-  position: absolute;
-  display: block;
-  pointer-events: none;
-}
-
-.xiaohei-scene__thinking-fx {
-  inset: 0;
-  z-index: 3;
-  opacity: 0;
-  transition: opacity 160ms ease-out;
-}
-
-.xiaohei-scene__thinking-bubble {
-  left: 56%;
-  top: -4%;
-  width: 36%;
-  height: 18%;
-  border: 1px solid rgb(210 242 235 / 44%);
-  border-radius: 999px;
-  background: rgb(226 242 238 / 88%);
-  box-shadow:
-    0 0.45rem 1.15rem rgb(1 9 10 / 18%),
-    inset 0 1px rgb(255 255 255 / 68%);
-}
-
-.xiaohei-scene__thinking-bubble::before,
-.xiaohei-scene__thinking-bubble::after {
-  position: absolute;
-  display: block;
-  content: '';
-  aspect-ratio: 1;
-  border-radius: 50%;
-  background: inherit;
-  box-shadow: inherit;
-}
-
-.xiaohei-scene__thinking-bubble::before {
-  left: 12%;
-  bottom: -31%;
-  width: 15%;
-}
-
-.xiaohei-scene__thinking-bubble::after {
-  left: 2%;
-  bottom: -51%;
-  width: 8%;
-}
-
-.xiaohei-scene__thinking-dot {
-  top: 50%;
-  width: 9%;
-  aspect-ratio: 1;
-  border-radius: 50%;
-  background: #526B66;
-  opacity: 0.28;
-  transform: translateY(-50%);
-}
-
-.xiaohei-scene__thinking-dot--one { left: 25%; }
-.xiaohei-scene__thinking-dot--two { left: 46%; }
-.xiaohei-scene__thinking-dot--three { left: 67%; }
-
-html[data-xiaohei-state='thinking'] .xiaohei-scene__thinking-fx {
-  opacity: 1;
-}
-
-html[data-xiaohei-state='thinking'] .xiaohei-scene__thinking-dot--one {
-  animation: xiaohei-thinking-dot 1.8s ease-in-out infinite;
-}
-
-html[data-xiaohei-state='thinking'] .xiaohei-scene__thinking-dot--two {
-  animation: xiaohei-thinking-dot 1.8s ease-in-out 0.3s infinite;
-}
-
-html[data-xiaohei-state='thinking'] .xiaohei-scene__thinking-dot--three {
-  animation: xiaohei-thinking-dot 1.8s ease-in-out 0.6s infinite;
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__thinking-bubble {
-  border-color: rgb(46 94 83 / 20%);
-  background: rgb(247 250 247 / 92%);
-  box-shadow:
-    0 0.45rem 1.1rem rgb(44 73 60 / 12%),
-    inset 0 1px rgb(255 255 255 / 86%);
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__thinking-dot {
-  background: #45635C;
-}
-
-.xiaohei-scene__state-fx,
-.xiaohei-scene__state-fx > span {
-  position: absolute;
-  display: block;
-  pointer-events: none;
-}
-
-.xiaohei-scene__state-fx {
-  inset: 0;
-  z-index: 2;
-  opacity: 0;
-  transition: opacity 120ms ease-out;
-}
-
-.xiaohei-scene__state-fx > span {
-  border-radius: 50%;
-  opacity: 0;
-  will-change: transform, opacity;
-}
-
-html[data-xiaohei-state='streaming'] .xiaohei-scene__state-fx--streaming,
-html[data-xiaohei-state='tool'] .xiaohei-scene__state-fx--tool,
-html[data-xiaohei-state='waiting'] .xiaohei-scene__state-fx--waiting,
-html[data-xiaohei-state='complete'] .xiaohei-scene__state-fx--complete,
-html[data-xiaohei-state='error'] .xiaohei-scene__state-fx--error {
-  opacity: 1;
-}
-
-.xiaohei-scene__tail-write {
-  left: var(--tail-write-left);
-  top: var(--tail-write-top);
-  width: var(--tail-write-width);
-  height: 7%;
-  border-top: 2px solid #A8FFEB;
-  border-radius: 50%;
-  filter: drop-shadow(0 0 0.34rem rgb(91 255 219 / 78%));
-  transform: rotate(var(--tail-write-angle)) scaleX(0.08);
-  transform-origin: 100% 50%;
-}
-
-.xiaohei-scene__tail-write--one {
-  --tail-write-left: 67%;
-  --tail-write-top: 34%;
-  --tail-write-width: 16%;
-  --tail-write-angle: -18deg;
-}
-
-.xiaohei-scene__tail-write--two {
-  --tail-write-left: 59%;
-  --tail-write-top: 27%;
-  --tail-write-width: 19%;
-  --tail-write-angle: -12deg;
-}
-
-.xiaohei-scene__tail-write--three {
-  --tail-write-left: 50%;
-  --tail-write-top: 21%;
-  --tail-write-width: 21%;
-  --tail-write-angle: -6deg;
-}
-
-html[data-xiaohei-appearance='light'] .xiaohei-scene__tail-write {
-  border-top-color: #2F8576;
-  filter: drop-shadow(0 0 0.28rem rgb(47 133 118 / 34%));
-}
-
-html[data-xiaohei-state='streaming'] .xiaohei-scene__tail-write--one {
-  animation: xiaohei-tail-write 1.9s ease-in-out infinite;
-}
-
-html[data-xiaohei-state='streaming'] .xiaohei-scene__tail-write--two {
-  animation: xiaohei-tail-write 1.9s ease-in-out 0.3s infinite;
-}
-
-html[data-xiaohei-state='streaming'] .xiaohei-scene__tail-write--three {
-  animation: xiaohei-tail-write 1.9s ease-in-out 0.6s infinite;
-}
-
-.xiaohei-scene__tool-key {
-  top: 84%;
-  width: 0.3rem;
-  aspect-ratio: 0.7;
-  background: #70F2D9;
-  box-shadow: 0 0 0.7rem rgb(72 238 208 / 90%);
-}
-
-.xiaohei-scene__tool-key--one { left: 29%; }
-.xiaohei-scene__tool-key--two { left: 38%; }
-.xiaohei-scene__tool-key--three { left: 47%; }
-
-html[data-xiaohei-state='tool'] .xiaohei-scene__tool-key--one {
-  animation: xiaohei-tool-key 0.9s ease-in-out infinite;
-}
-
-html[data-xiaohei-state='tool'] .xiaohei-scene__tool-key--two {
-  animation: xiaohei-tool-key 0.9s ease-in-out -0.3s infinite;
-}
-
-html[data-xiaohei-state='tool'] .xiaohei-scene__tool-key--three {
-  animation: xiaohei-tool-key 0.9s ease-in-out -0.6s infinite;
-}
-
-.xiaohei-scene__waiting-ring {
-  left: 61%;
-  top: 34%;
-  width: 13%;
-  aspect-ratio: 1;
-  border: 1px solid rgb(255 207 126 / 88%);
-  box-shadow: 0 0 0.8rem rgb(255 188 93 / 42%);
-}
-
-html[data-xiaohei-state='waiting'] .xiaohei-scene__waiting-ring {
-  animation: xiaohei-waiting-ring 1.8s ease-out infinite;
-}
-
-.xiaohei-scene__complete-spark {
-  width: 0.35rem;
-  aspect-ratio: 1;
-  background: #B6FFED;
-  box-shadow: 0 0 0.8rem rgb(91 255 219 / 92%);
-}
-
-.xiaohei-scene__complete-spark--one { left: 36%; top: 70%; }
-.xiaohei-scene__complete-spark--two { left: 62%; top: 67%; }
-
-html[data-xiaohei-state='complete'] .xiaohei-scene__complete-spark--one {
-  animation: xiaohei-complete-spark-one 0.8s ease-out infinite;
-}
-
-html[data-xiaohei-state='complete'] .xiaohei-scene__complete-spark--two {
-  animation: xiaohei-complete-spark-two 0.8s ease-out -0.4s infinite;
-}
-
-.xiaohei-scene__error-glow {
-  left: 41%;
-  top: 82%;
-  width: 7%;
-  aspect-ratio: 1;
-  background: radial-gradient(circle, rgb(255 112 82 / 90%) 0%, rgb(224 58 46 / 28%) 48%, transparent 72%);
-  mix-blend-mode: screen;
-}
-
-html[data-xiaohei-state='error'] .xiaohei-scene__error-glow {
-  animation: xiaohei-error-glow 2.2s ease-in-out infinite;
-}
-
-@keyframes xiaohei-heixiu-blink {
-  0%, 87.9% { opacity: 0; }
-  88%, 90.4% { opacity: 1; }
-  90.5%, 100% { opacity: 0; }
-}
-
-@keyframes xiaohei-heixiu-open {
-  0%, 87.9% { opacity: 1; }
-  88%, 90.4% { opacity: 0; }
-  90.5%, 100% { opacity: 1; }
-}
-
-@keyframes xiaohei-heixiu-drift-one {
-  0%, 100% { transform: translate3d(0, 0.4rem, 0); }
-  28% { transform: translate3d(0.7rem, -0.2rem, 0); }
-  61% { transform: translate3d(-0.45rem, -0.9rem, 0); }
-  82% { transform: translate3d(0.28rem, -0.48rem, 0); }
-}
-
-@keyframes xiaohei-heixiu-drift-two {
-  0%, 100% { transform: translate3d(-0.35rem, 0.25rem, 0); }
-  34% { transform: translate3d(0.5rem, -0.72rem, 0); }
-  68% { transform: translate3d(-0.6rem, -1.15rem, 0); }
-}
-
-@keyframes xiaohei-heixiu-drift-three {
-  0%, 100% { transform: translate3d(0.25rem, 0.15rem, 0); }
-  37% { transform: translate3d(-0.65rem, 0.72rem, 0); }
-  72% { transform: translate3d(0.48rem, -0.55rem, 0); }
-}
-
-@keyframes xiaohei-spirit-one {
-  0%, 100% { transform: translate3d(0, 0.5rem, 0) scale(0.72); opacity: 0.12; }
-  48% { transform: translate3d(-0.7rem, -1.6rem, 0) scale(1); opacity: 0.82; }
-}
-
-@keyframes xiaohei-spirit-two {
-  0%, 100% { transform: translate3d(0.6rem, 0.4rem, 0) scale(0.68); opacity: 0.08; }
-  52% { transform: translate3d(-0.35rem, -1.35rem, 0) scale(0.92); opacity: 0.66; }
-}
-
-@keyframes xiaohei-spirit-three {
-  0%, 100% { transform: translate3d(-0.4rem, 0.8rem, 0) scale(0.7); opacity: 0.1; }
-  44% { transform: translate3d(0.45rem, -1.2rem, 0) scale(0.96); opacity: 0.7; }
-}
-
-@keyframes xiaohei-thinking-dot {
-  0%, 18%, 100% { opacity: 0.28; }
-  42%, 62% { opacity: 0.96; }
-}
-
-@keyframes xiaohei-tail-write {
-  0%, 12% { transform: rotate(var(--tail-write-angle)) scaleX(0.08); opacity: 0; }
-  38%, 68% { transform: rotate(var(--tail-write-angle)) scaleX(1); opacity: 0.94; }
-  88%, 100% { transform: rotate(var(--tail-write-angle)) scaleX(1); opacity: 0; }
-}
-
-@keyframes xiaohei-tool-key {
-  0%, 100% { transform: translate3d(0, 0, 0) scale(0.7); opacity: 0.18; }
-  45% { transform: translate3d(0, -0.15rem, 0) scale(1); opacity: 1; }
-}
-
-@keyframes xiaohei-waiting-ring {
-  from { transform: translate3d(-50%, -50%, 0) scale(0.55); opacity: 0.72; }
-  to { transform: translate3d(-50%, -50%, 0) scale(1.45); opacity: 0; }
-}
-
-@keyframes xiaohei-complete-spark-one {
-  from { transform: translate3d(-0.4rem, 0.4rem, 0) scale(0.45); opacity: 0; }
-  35% { opacity: 1; }
-  to { transform: translate3d(-2.5rem, -2rem, 0) scale(1.15); opacity: 0; }
-}
-
-@keyframes xiaohei-complete-spark-two {
-  from { transform: translate3d(0.4rem, 0.3rem, 0) scale(0.45); opacity: 0; }
-  35% { opacity: 0.95; }
-  to { transform: translate3d(2.5rem, -1.75rem, 0) scale(1.1); opacity: 0; }
-}
-
-@keyframes xiaohei-error-glow {
-  0%, 100% { transform: translate3d(-50%, -50%, 0) scale(0.78); opacity: 0.34; }
-  50% { transform: translate3d(-50%, -50%, 0) scale(1.12); opacity: 0.9; }
-}
-
-@media (max-width: 768px) {
-  .xiaohei-scene__keyart {
-    object-position: 62% bottom;
-  }
-
-  .xiaohei-scene__keyart--night { opacity: 0.9; }
-  .xiaohei-scene__keyart--dawn { opacity: 0; }
-
-  html[data-xiaohei-appearance='light'] .xiaohei-scene__keyart--night { opacity: 0; }
-
-  html[data-xiaohei-appearance='light'] .xiaohei-scene__keyart--dawn {
-    opacity: 0.94;
-  }
-
-  .xiaohei-scene__veil {
-    background: linear-gradient(180deg, rgb(8 13 15 / 3%), rgb(8 13 15 / 8%));
-  }
-
-  .xiaohei-scene__mascot {
-    right: -1.5rem;
-    bottom: 5rem;
-    width: clamp(10rem, 42vw, 14rem);
-  }
-
-  .xiaohei-scene__heixiu--mascot {
-    right: 8.5rem;
-    bottom: 7.5rem;
-    width: 3.8rem;
-  }
-
-  .xiaohei-scene__heixiu--sidebar { display: none; }
-
-  .xiaohei-scene__heixiu--composer {
-    left: 52%;
-    right: auto;
-    top: -1.45rem;
-    width: 2.8rem;
-  }
-
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .xiaohei-scene__spirit,
-  .xiaohei-scene__heixiu,
-  .xiaohei-scene__heixiu-open,
-  .xiaohei-scene__heixiu-blink,
-  .xiaohei-scene__thinking-dot,
-  .xiaohei-scene__state-fx > span {
-    animation: none;
-    will-change: auto;
-  }
-
-  .xiaohei-scene__spirit { display: none; }
-  .xiaohei-scene__state-fx { display: none; }
-
-  html[data-xiaohei-state='thinking'] .xiaohei-scene__thinking-dot {
-    animation: none;
-    will-change: auto;
-    opacity: 0.72;
-  }
-}
-
-@media (prefers-contrast: more) {
-  .xiaohei-scene__keyart--night { opacity: 0.48; }
-  .xiaohei-scene__keyart--dawn { opacity: 0; }
-  html[data-xiaohei-appearance='light'] .xiaohei-scene__keyart--night { opacity: 0; }
-  html[data-xiaohei-appearance='light'] .xiaohei-scene__keyart--dawn { opacity: 0.5; }
-  .xiaohei-scene__veil { background: rgb(5 12 15 / 48%); }
-  html[data-xiaohei-appearance='light'] .xiaohei-scene__veil { background: rgb(235 240 235 / 58%); }
-  .xiaohei-scene__spirit,
-  .xiaohei-scene__heixiu-field,
-  .xiaohei-scene__heixiu--sidebar,
-  .xiaohei-scene__heixiu--composer { display: none; }
-}
-
-@media (forced-colors: active), print {
-  #${cssEscape(XIAOHEI_SCENE_LAYER_ID)},
-  .xiaohei-scene__heixiu--sidebar,
-  .xiaohei-scene__heixiu--composer { display: none; }
-}
-`;
-export const XIAOHEI_SCENE_CSS = [
-    XIAOHEI_SCENE_BASE_CSS,
-    XIAOHEI_STATE_TRANSITION_CSS,
-    XIAOHEI_HEIXIU_FEEDBACK_CSS,
-    XIAOHEI_HEIXIU_INTERACTION_CSS,
-].join('\n');
-const PARTS = [
-    'xiaohei-scene__keyart xiaohei-scene__keyart--night',
-    'xiaohei-scene__keyart xiaohei-scene__keyart--dawn',
-    'xiaohei-scene__veil',
-    'xiaohei-scene__spirit xiaohei-scene__spirit--one',
-    'xiaohei-scene__spirit xiaohei-scene__spirit--two',
-    'xiaohei-scene__spirit xiaohei-scene__spirit--three',
-    'xiaohei-scene__mascot',
-    'xiaohei-scene__heixiu-field',
-];
-/** Number of top-level decorative parts installed into the ambient layer. */
-export const XIAOHEI_SCENE_PART_COUNT = PARTS.length;
-/** Skip host lookups while every companion remains attached to the document. */
-export function shouldRestoreXiaoheiHeixiuCompanions(creatures) {
-    return creatures.some(creature => !creature.isConnected);
-}
-/**
- * Install the generated scene after plugin boot becomes idle. The theme tokens
- * apply immediately, while image decoding never extends DSH's loading screen.
- */
-export function installXiaoheiScene(doc = typeof document === 'undefined' ? undefined : document) {
-    if (doc === undefined)
-        return () => { };
-    let disposed = false;
-    let removeMountedScene = () => { };
-    let removeHeixiuCompanions = () => { };
-    const mount = () => {
-        if (disposed)
-            return;
-        doc.getElementById(XIAOHEI_SCENE_STYLE_ID)?.remove();
-        doc.getElementById(XIAOHEI_SCENE_LAYER_ID)?.remove();
-        const style = doc.createElement('style');
-        style.id = XIAOHEI_SCENE_STYLE_ID;
-        style.textContent = XIAOHEI_SCENE_CSS;
-        doc.head.append(style);
-        const layer = doc.createElement('div');
-        layer.id = XIAOHEI_SCENE_LAYER_ID;
-        layer.setAttribute('aria-hidden', 'true');
-        layer.setAttribute('data-xiaohei-scene', '');
-        const keyArtSources = [XIAOHEI_NIGHT_KEY_ART, XIAOHEI_DAWN_KEY_ART];
-        for (const [index, source] of keyArtSources.entries()) {
-            const keyArt = doc.createElement('img');
-            keyArt.className = PARTS[index];
-            keyArt.alt = '';
-            keyArt.decoding = 'async';
-            keyArt.fetchPriority = 'low';
-            keyArt.src = source;
-            layer.append(keyArt);
-        }
-        for (const className of PARTS.slice(keyArtSources.length)) {
-            if (className === 'xiaohei-scene__mascot') {
-                const mascot = doc.createElement('div');
-                mascot.className = className;
-                const idleViewport = doc.createElement('span');
-                idleViewport.className = 'xiaohei-scene__mascot-idle-viewport';
-                idleViewport.append(createIdleSheet(doc, 7, 'xiaohei-scene__mascot-sheet--open'), createIdleBlink(doc));
-                mascot.append(idleViewport, createStateImage(doc, 'thinking', XIAOHEI_THINKING), createStateImage(doc, 'streaming', XIAOHEI_STREAMING), createStateImage(doc, 'tool', XIAOHEI_TOOL), createStateImage(doc, 'waiting', XIAOHEI_WAITING), createStateImage(doc, 'complete', XIAOHEI_COMPLETE), createStateImage(doc, 'error', XIAOHEI_ERROR), createThinkingEffects(doc), createStateEffects(doc, 'streaming', [
-                    'xiaohei-scene__tail-write xiaohei-scene__tail-write--one',
-                    'xiaohei-scene__tail-write xiaohei-scene__tail-write--two',
-                    'xiaohei-scene__tail-write xiaohei-scene__tail-write--three',
-                ]), createStateEffects(doc, 'tool', [
-                    'xiaohei-scene__tool-key xiaohei-scene__tool-key--one',
-                    'xiaohei-scene__tool-key xiaohei-scene__tool-key--two',
-                    'xiaohei-scene__tool-key xiaohei-scene__tool-key--three',
-                ]), createStateEffects(doc, 'waiting', ['xiaohei-scene__waiting-ring']), createStateEffects(doc, 'complete', [
-                    'xiaohei-scene__complete-spark xiaohei-scene__complete-spark--one',
-                    'xiaohei-scene__complete-spark xiaohei-scene__complete-spark--two',
-                ]), createStateEffects(doc, 'error', ['xiaohei-scene__error-glow']));
-                layer.append(mascot);
-                continue;
-            }
-            if (className === 'xiaohei-scene__heixiu-field') {
-                layer.append(createHeixiuField(doc));
-                continue;
-            }
-            const part = doc.createElement('span');
-            part.className = className;
-            layer.append(part);
-        }
-        doc.body.prepend(layer);
-        removeHeixiuCompanions();
-        removeHeixiuCompanions = installHeixiuCompanions(doc, layer);
-        removeMountedScene = () => {
-            removeHeixiuCompanions();
-            removeHeixiuCompanions = () => { };
-            layer.remove();
-            style.remove();
-        };
-    };
-    const win = doc.defaultView;
-    let cancelSchedule = () => { };
-    if (win !== null && typeof win.requestIdleCallback === 'function') {
-        const idleId = win.requestIdleCallback(mount, { timeout: 800 });
-        cancelSchedule = () => win.cancelIdleCallback(idleId);
-    }
-    else if (win !== null) {
-        const timeoutId = win.setTimeout(mount, 0);
-        cancelSchedule = () => win.clearTimeout(timeoutId);
-    }
-    else {
-        mount();
-    }
-    return () => {
-        disposed = true;
-        cancelSchedule();
-        removeMountedScene();
-    };
-}
-/** CSS id escaping for the slash in stable plugin-owned DOM ids. */
-function cssEscape(value) {
-    return value.replaceAll('/', '\\/');
-}
-function createIdleSheet(doc, frame, modifier) {
-    const sheet = doc.createElement('img');
-    sheet.className = `xiaohei-scene__mascot-sheet ${modifier}`;
-    sheet.alt = '';
-    sheet.decoding = 'async';
-    sheet.fetchPriority = 'low';
-    sheet.src = XIAOHEI_IDLE_SHEET;
-    setIdleFrame(sheet, frame);
-    return sheet;
-}
-function createIdleBlink(doc) {
-    const image = doc.createElement('img');
-    image.className = 'xiaohei-scene__mascot-blink';
-    image.alt = '';
-    image.decoding = 'async';
-    image.fetchPriority = 'low';
-    image.src = XIAOHEI_IDLE_BLINK;
-    return image;
-}
-function setIdleFrame(sheet, frame) {
-    const column = frame % 4;
-    const row = Math.floor(frame / 4);
-    sheet.style.transform = `translate3d(${-column * 25}%, ${-row * 50}%, 0)`;
-}
-function createStateImage(doc, state, source) {
-    const image = doc.createElement('img');
-    image.className = `xiaohei-scene__mascot-state xiaohei-scene__mascot-state--${state}`;
-    image.alt = '';
-    image.decoding = 'async';
-    image.fetchPriority = 'low';
-    image.src = source;
-    return image;
-}
-function createHeixiuField(doc) {
-    const field = doc.createElement('div');
-    field.className = 'xiaohei-scene__heixiu-field';
-    field.append(createHeixiuCreature(doc, 'mascot'));
-    return field;
-}
-function createHeixiuCreature(doc, name) {
-    const creature = doc.createElement('span');
-    creature.className = `xiaohei-scene__heixiu xiaohei-scene__heixiu--${name}`;
-    creature.setAttribute('aria-hidden', 'true');
-    const body = doc.createElement('span');
-    body.className = 'xiaohei-scene__heixiu-body';
-    body.append(createHeixiuImage(doc, XIAOHEI_HEIXIU_OPEN, 'xiaohei-scene__heixiu-open'), createHeixiuImage(doc, XIAOHEI_HEIXIU_BLINK, 'xiaohei-scene__heixiu-blink'));
-    creature.append(body);
-    return creature;
-}
-function installHeixiuCompanions(doc, layer) {
-    const companions = [
-        { slot: 'sidebar', creature: createHeixiuCreature(doc, 'sidebar') },
-        { slot: 'conversation.composer.bar', creature: createHeixiuCreature(doc, 'composer') },
-    ];
-    const companionCreatures = companions.map(({ creature }) => creature);
-    let attachQueued = false;
-    const attach = () => {
-        attachQueued = false;
-        for (const { slot, creature } of companions) {
-            const host = doc.querySelector(`[data-slot='${slot}']`)?.firstElementChild;
-            if (host !== null && host !== undefined && creature.parentElement !== host)
-                host.append(creature);
-        }
-    };
-    const queueAttach = () => {
-        if (attachQueued)
-            return;
-        attachQueued = true;
-        queueMicrotask(attach);
-    };
-    const restoreDetachedCompanions = () => {
-        if (!shouldRestoreXiaoheiHeixiuCompanions(companionCreatures))
-            return;
-        queueAttach();
-    };
-    attach();
-    const Observer = doc.defaultView?.MutationObserver;
-    const observer = Observer === undefined ? undefined : new Observer(restoreDetachedCompanions);
-    observer?.observe(doc.body, { childList: true, subtree: true });
-    return () => {
-        observer?.disconnect();
-        for (const { creature } of companions)
-            creature.remove();
-    };
-}
-function createHeixiuImage(doc, source, className) {
-    const image = doc.createElement('img');
-    image.className = className;
-    image.alt = '';
-    image.decoding = 'async';
-    image.fetchPriority = 'low';
-    image.src = source;
-    return image;
-}
-function createThinkingEffects(doc) {
-    const effects = doc.createElement('span');
-    effects.className = 'xiaohei-scene__thinking-fx';
-    const bubble = doc.createElement('span');
-    bubble.className = 'xiaohei-scene__thinking-bubble';
-    for (const suffix of ['one', 'two', 'three']) {
-        const dot = doc.createElement('span');
-        dot.className = `xiaohei-scene__thinking-dot xiaohei-scene__thinking-dot--${suffix}`;
-        bubble.append(dot);
-    }
-    effects.append(bubble);
-    return effects;
-}
-function createStateEffects(doc, state, classNames) {
-    const effects = doc.createElement('span');
-    effects.className = `xiaohei-scene__state-fx xiaohei-scene__state-fx--${state}`;
-    for (const className of classNames) {
-        const part = doc.createElement('span');
-        part.className = className;
-        effects.append(part);
-    }
-    return effects;
-}
+/** Public scene facade. Runtime structure and visual styling evolve independently. */
+export { XIAOHEI_SCENE_CSS, XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_STYLE_ID, XIAOHEI_SCENE_WORLD_CLASS, } from './scene/styles.js';
+export { configureXiaoheiWorldRenderer, installXiaoheiScene, XIAOHEI_SCENE_PART_COUNT, } from './scene/runtime.js';
+export { injectXiaoheiSylvaAvatarModel, prepareXiaoheiSylvaAvatarFrame, XIAOHEI_SYLVA_AVATAR_MARKER, } from './scene/avatar-model.js';
+export { XIAOHEI_AVATAR_MOTION_RUNTIME } from './scene/avatar-motion.js';
+export { injectXiaoheiSylvaPerformanceProfile, XIAOHEI_SYLVA_PERFORMANCE_MARKER, } from './scene/sylva-performance.js';
+export { injectXiaoheiSylvaPointerBridge, prepareXiaoheiSylvaPointerFrame, resolveXiaoheiSylvaPointer, XIAOHEI_SYLVA_POINTER_CHANNEL, XIAOHEI_SYLVA_POINTER_MARKER, } from './scene/pointer-bridge.js';
 //# sourceMappingURL=scene.js.map