/* mori theme layer — real skeleton / navigation / interaction / typography ports
   of cibo's hud / youshen / atelier (plus the santiz product theme), rebuilt on the
   pandabrokerage replica DOM. Value sets come from loom.schema.token.css_variables
   as --mori-* variables; every rule below is scoped to a theme body class and only
   uses mori-owned component classes built at runtime by theme/theme.js.

   The replica's own class prefixes (hp-/ap-/fp-/sp-/qp-/dp-) appear only as
   structural anchors (which block, which hero); no cibo class, variable or asset is
   referenced. */

/* ── runtime switcher (shared) ───────────────────────────────────────────── */
.mori-theme-switch {
  position: fixed;
  left: 16px;
  bottom: 16px;
  z-index: 9999;
  display: flex;
  gap: 2px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(0, 0, 0, .8);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .3);
  font: 12px/1 -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
  letter-spacing: .04em;
}
.mori-theme-switch button {
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #f5f5f5;
  padding: 8px 12px;
  cursor: pointer;
}
.mori-theme-switch button[aria-pressed="true"] {
  background: #f5f5f5;
  color: #111;
}
/* the toggle is a mobile-only "THEME" capsule that opens the pills upward;
   hidden on desktop where the eight pills sit inline in the bar */
.mori-theme-switch__toggle { display: none; }
body.mori-shell-youshen .mori-theme-switch {
  bottom: 18px;
  left: 18px;
}
body.mori-shell-hud .mori-theme-switch {
  left: auto;
  right: 28px;
  bottom: 96px;
}
body.mori-shell-hud .support-launcher {
  bottom: 48px;
  right: 28px;
}
body.mori-shell-youshen .support-launcher {
  bottom: 24px;
  right: 24px;
}
body.mori-shell-atelier .support-launcher {
  bottom: 24px;
  right: 24px;
}
body.theme-hud .hp-section-heading,
body.theme-hud .hp-section-heading h2,
body.theme-youshen .hp-section-heading,
body.theme-youshen .hp-section-heading h2,
body.theme-atelier .hp-section-heading,
body.theme-atelier .hp-section-heading h2 {
  text-align: left;
}
body.mori-shell-atelier .mori-theme-switch {
  left: 24px;
  bottom: 24px;
}

/* ── runtime-controlled slots and shared chrome ──────────────────────────── */
[data-mori-hidden="1"] { display: none !important; }

body.mori [data-mori-built] > * { max-width: 100%; }

body.mori .mori-slot__body > *,
body.mori .mori-readout__main > *,
body.mori .mori-band__body > *,
body.mori .mori-ys-sheet__inner > *,
body.mori .mori-ys-report__text > *,
body.mori .mori-ys-row__body > *,
body.mori .mori-ys-register__body > *,
body.mori .mori-at-cover__body > *,
body.mori .mori-at-list__text > *,
body.mori .mori-at-sand__body > *,
body.mori .mori-at-line__body > *,
body.mori .mori-at-essay__col > *,
body.mori .mori-sz-panel__body > *,
body.mori .mori-sz-strip__body > * {
  max-width: 100%;
}

/* the host hero is an absolutely positioned composition; every ported shell
   replaces it with its own flowing cover, so neutralise the host stage */
body.theme-hud .hp-hero,
body.theme-youshen .hp-hero,
body.theme-atelier .hp-hero {
  height: auto;
  min-height: 0;
  overflow: visible;
}
body.theme-hud .hp-hero-grid,
body.theme-hud .hp-hero-panda,
body.theme-youshen .hp-hero-grid,
body.theme-youshen .hp-hero-panda,
body.theme-atelier .hp-hero-grid,
body.theme-atelier .hp-hero-panda {
  display: none;
}
body.theme-hud .hp-hero-copy,
body.theme-youshen .hp-hero-copy,
body.theme-atelier .hp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}

/* the host nav / directory widgets belong to the host header, which each shell
   replaces; keep the support launcher but clear the shell's own chrome */
body.mori-shell-hud .floating-directory,
body.mori-shell-youshen .floating-directory,
body.mori-shell-atelier .floating-directory {
  display: none !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   HUD — fixed cockpit. Topbar + sector rail + flyout + armor + coordinate
   strip; the page itself scrolls inside one deck. Cut corners, double-line
   data frames, mono readouts. No rounded surface anywhere.
   ══════════════════════════════════════════════════════════════════════ */
body.theme-hud {
  height: 100vh;
  overflow: hidden;
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  -webkit-font-smoothing: antialiased;
}
body.theme-hud * { border-radius: 0 !important; }

body.theme-hud .hp-page,
body.theme-hud .ap-page,
body.theme-hud .fp-page,
body.theme-hud .qp-page,
body.theme-hud .dp-page {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
}

/* topbar */
.mori-hud-topbar {
  position: fixed;
  top: 16px;
  left: 16px;
  right: 24px;
  z-index: 80;
  display: flex;
  align-items: center;
  gap: 14px;
  height: 44px;
  padding: 0 14px;
  background: linear-gradient(180deg, #0b2940, #071d2e);
  border: 1px solid rgba(18, 168, 255, .34);
  box-shadow: inset 0 0 0 1px rgba(18, 168, 255, .06), 0 10px 30px rgba(0, 0, 0, .35);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  font-family: var(--mori-type-mono);
}
.mori-hud-menu {
  display: none;
  width: 26px;
  height: 26px;
  border: 1px solid rgba(18, 168, 255, .42);
  background: transparent;
  cursor: pointer;
  place-items: center;
}
.mori-hud-menu__bar,
.mori-hud-menu__bar::before,
.mori-hud-menu__bar::after {
  display: block;
  width: 12px;
  height: 1px;
  background: #5cc4ff;
}
.mori-hud-menu__bar { position: relative; }
.mori-hud-menu__bar::before,
.mori-hud-menu__bar::after { content: ""; position: absolute; left: 0; }
.mori-hud-menu__bar::before { top: -4px; }
.mori-hud-menu__bar::after { top: 4px; }

.mori-hud-sigil {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  background: rgba(18, 168, 255, .12);
  border: 1px solid rgba(18, 168, 255, .55);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%);
}
.mori-hud-sigil__mark {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #eaf8ff;
}
.mori-hud-ship {
  display: grid;
  gap: 1px;
  line-height: 1.15;
  min-width: 0;
}
.mori-hud-ship__name {
  font-size: 10.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #eaf8ff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 34ch;
}
.mori-hud-ship__code {
  font-size: 8.5px;
  letter-spacing: .24em;
  color: #5cc4ff;
}
.mori-hud-sector-name {
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding-left: 14px;
  border-left: 1px solid rgba(18, 168, 255, .26);
  font-size: 9px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #8fb2c7;
  white-space: nowrap;
}
.mori-hud-sector-name b {
  font-size: 12px;
  color: #12a8ff;
  font-weight: 600;
}
.mori-hud-status {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-left: auto;
}
.mori-hud-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 9px;
  letter-spacing: .22em;
  color: #5cc4ff;
}
.mori-hud-live i {
  width: 6px;
  height: 6px;
  background: #12a8ff;
  box-shadow: 0 0 8px #12a8ff;
  animation: mori-hud-pulse 2.4s ease-in-out infinite;
}
@keyframes mori-hud-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .25; }
}
.mori-hud-clock {
  font-size: 10px;
  letter-spacing: .1em;
  font-variant-numeric: tabular-nums;
  color: #cfefff;
}
.mori-hud-tools {
  display: flex;
  align-items: center;
  gap: 2px;
  padding-left: 12px;
  border-left: 1px solid rgba(18, 168, 255, .26);
}
.mori-hud-tool {
  padding: 4px 7px;
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8fb2c7;
  text-decoration: none;
}
.mori-hud-tool:hover { color: #eaf8ff; background: rgba(18, 168, 255, .12); }
.mori-hud-tool.is-here { color: #03101b; background: #12a8ff; }

/* sector rail */
.mori-hud-rail {
  position: fixed;
  left: 16px;
  top: 80px;
  bottom: 68px;
  z-index: 70;
  width: 196px;
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #061826, #03101b);
  border: 1px solid rgba(18, 168, 255, .28);
  box-shadow: inset 0 0 0 1px rgba(18, 168, 255, .05);
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%);
}
.mori-hud-rail__head {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(18, 168, 255, .2);
  font-family: var(--mori-type-mono);
  font-size: 8px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: #5cc4ff;
}
.mori-hud-rail__scroll {
  flex: 1;
  overflow-y: auto;
  padding: 6px 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(18, 168, 255, .4) transparent;
}
.mori-hud-rail__scroll::-webkit-scrollbar { width: 3px; }
.mori-hud-rail__scroll::-webkit-scrollbar-thumb { background: rgba(18, 168, 255, .4); }
.mori-hud-sector {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 12px 12px 12px 10px;
  border: 0;
  border-bottom: 1px solid rgba(18, 168, 255, .08);
  background: transparent;
  color: #8fb2c7;
  font-family: var(--mori-type-mono);
  text-align: left;
  cursor: pointer;
}
.mori-hud-sector::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: transparent;
}
.mori-hud-sector:hover { background: rgba(18, 168, 255, .08); color: #eaf8ff; }
.mori-hud-sector.is-here,
.mori-hud-sector.is-open {
  background: linear-gradient(90deg, rgba(18, 168, 255, .22), rgba(18, 168, 255, .02) 80%);
  color: #eaf8ff;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
.mori-hud-sector.is-here::before,
.mori-hud-sector.is-open::before { background: #12a8ff; box-shadow: 0 0 10px #12a8ff; }
.mori-hud-sector__no {
  font-size: 9px;
  letter-spacing: .12em;
  color: #5cc4ff;
  text-align: center;
}
.mori-hud-sector.is-here .mori-hud-sector__no { color: #eaf8ff; }
.mori-hud-sector__label {
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mori-hud-rail__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 12px;
  border-top: 1px solid rgba(18, 168, 255, .2);
  font-family: var(--mori-type-mono);
  font-size: 8px;
  letter-spacing: .18em;
  color: #6d8fa3;
}
.mori-hud-rail__foot-value { color: #cfefff; font-variant-numeric: tabular-nums; }

/* flyout */
.mori-hud-flyout {
  position: fixed;
  left: 220px;
  top: 80px;
  z-index: 75;
  width: 210px;
  max-height: 62vh;
  overflow-y: auto;
  padding: 0 0 6px;
  background: #071d2e;
  border: 1px solid rgba(18, 168, 255, .42);
  box-shadow: 12px 16px 40px rgba(0, 0, 0, .5);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
  opacity: 0;
  visibility: hidden;
  transform: translateX(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.mori-hud-flyout.is-open {
  opacity: 1;
  visibility: visible;
  transform: none;
}
.mori-hud-flyout__head {
  padding: 9px 12px;
  border-bottom: 1px solid rgba(18, 168, 255, .26);
  background: rgba(18, 168, 255, .1);
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #5cc4ff;
}
.mori-hud-flyout__sep {
  display: block;
  height: 1px;
  margin: 5px 10px;
  background: rgba(18, 168, 255, .18);
}
.mori-hud-flyout__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .08em;
  color: #cfefff;
  text-decoration: none;
}
.mori-hud-flyout__item:hover { background: rgba(18, 168, 255, .16); color: #ffffff; }
.mori-hud-flyout__item.is-here {
  background: rgba(18, 168, 255, .2);
  color: #ffffff;
}
.mori-hud-flyout__mk {
  padding: 1px 4px;
  border: 1px solid rgba(18, 168, 255, .6);
  font-size: 7.5px;
  letter-spacing: .16em;
  color: #12a8ff;
}
.mori-hud-flyout__label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mori-hud-flyout__empty { display: block; padding: 12px; color: #6d8fa3; font-size: 10px; }

/* armor: edge rules + corner brackets */
.mori-hud-armor {
  position: fixed;
  inset: 0;
  z-index: 65;
  pointer-events: none;
}
.mori-hud-armor__edge {
  position: absolute;
  background: rgba(18, 168, 255, .3);
}
.mori-hud-armor__edge--t { top: 8px; left: 16px; right: 24px; height: 1px; }
.mori-hud-armor__edge--b { bottom: 8px; left: 16px; right: 24px; height: 1px; }
.mori-hud-armor__edge--l { left: 8px; top: 16px; bottom: 16px; width: 1px; }
.mori-hud-armor__edge--r { right: 8px; top: 16px; bottom: 16px; width: 1px; }
.mori-hud-armor__corner {
  position: absolute;
  width: 50px;
  height: 50px;
  border: 0 solid rgba(18, 168, 255, .62);
}
.mori-hud-armor__corner--tl { top: 8px; left: 8px; border-top-width: 2px; border-left-width: 2px; }
.mori-hud-armor__corner--tr { top: 8px; right: 8px; border-top-width: 2px; border-right-width: 2px; }
.mori-hud-armor__corner--bl { bottom: 8px; left: 8px; border-bottom-width: 2px; border-left-width: 2px; }
.mori-hud-armor__corner--br { bottom: 8px; right: 8px; border-bottom-width: 2px; border-right-width: 2px; }

/* coordinate strip */
.mori-hud-coord {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 78;
  display: flex;
  align-items: center;
  gap: 18px;
  height: 34px;
  padding: 0 24px 0 16px;
  background: linear-gradient(180deg, #061826, #03101b);
  border-top: 1px solid rgba(18, 168, 255, .34);
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #6d8fa3;
}
.mori-hud-coord__path { color: #5cc4ff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mori-hud-coord__led { display: flex; gap: 3px; margin-left: auto; }
.mori-hud-coord__led i {
  display: block;
  width: 14px;
  height: 4px;
  background: rgba(18, 168, 255, .18);
}
.mori-hud-coord__led i.on { background: #12a8ff; box-shadow: 0 0 7px rgba(18, 168, 255, .8); }
.mori-hud-coord__sync { color: #cfefff; font-variant-numeric: tabular-nums; }

/* deck */
body.theme-hud .mori-deck {
  position: fixed;
  left: 220px;
  right: 24px;
  top: 80px;
  bottom: 68px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 22px 22px 40px;
  background-color: var(--mori-surface-page);
  background-image:
    radial-gradient(circle, rgba(18, 168, 255, .1) 1px, transparent 1.2px),
    linear-gradient(180deg, rgba(18, 168, 255, .03), transparent 220px);
  background-size: 22px 22px, 100% 100%;
  scrollbar-width: thin;
  scrollbar-color: rgba(18, 168, 255, .4) transparent;
}
body.theme-hud .mori-deck::-webkit-scrollbar { width: 6px; }
body.theme-hud .mori-deck::-webkit-scrollbar-thumb { background: rgba(18, 168, 255, .4); }
body.theme-hud .mori-deck > * { max-width: 1360px; margin-left: auto; margin-right: auto; }
body.theme-hud .mori-deck .hp-footer { margin-top: 26px; }

/* deck slots */
body.theme-hud .mori-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  margin: 0 0 14px;
  background:
    linear-gradient(180deg, rgba(18, 168, 255, .07), rgba(18, 168, 255, .015) 34%, transparent 100%),
    var(--mori-surface-content);
  border: 1px solid rgba(18, 168, 255, .28);
  box-shadow: inset 0 0 0 1px rgba(18, 168, 255, .04);
  clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
}
body.theme-hud .mori-slot::before,
body.theme-hud .mori-slot::after {
  content: "";
  position: absolute;
  top: 10px;
  height: 2px;
  background: rgba(18, 168, 255, .55);
  pointer-events: none;
}
body.theme-hud .mori-slot::before { right: 26px; width: 26px; }
body.theme-hud .mori-slot::after { right: 58px; width: 12px; opacity: .45; }
body.theme-hud .mori-slot.is-key {
  border-color: rgba(18, 168, 255, .62);
  box-shadow: inset 0 0 0 1px rgba(18, 168, 255, .12), 0 0 0 1px rgba(18, 168, 255, .14), 0 0 40px rgba(18, 168, 255, .08);
  animation: mori-hud-in .24s ease-out both;
}
@keyframes mori-hud-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: none; }
}
body.theme-hud .mori-slot__cap {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 14px;
  border-bottom: 1px solid rgba(18, 168, 255, .22);
  background: rgba(18, 168, 255, .07);
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #5cc4ff;
}
body.theme-hud .mori-slot__cap b {
  font-weight: 600;
  color: #eaf8ff;
}
body.theme-hud .mori-slot__title {
  color: #8fb2c7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.theme-hud .mori-slot__cap h2,
body.theme-hud .mori-slot__cap h3 {
  margin: 0;
  font: inherit;
  color: #cfefff;
  letter-spacing: .14em;
}
body.theme-hud .mori-slot__dots {
  flex: 1;
  height: 3px;
  background: repeating-linear-gradient(90deg, rgba(18, 168, 255, .45) 0 1px, transparent 1px 7px);
  opacity: .6;
}
body.theme-hud .mori-slot__body { padding: 20px 20px 18px; }
body.theme-hud .mori-slot__body > *:last-child { margin-bottom: 0; }
body.theme-hud .mori-slot__foot {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
  padding: 7px 14px;
  border-top: 1px solid rgba(18, 168, 255, .18);
  font-family: var(--mori-type-mono);
  font-size: 8px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #6d8fa3;
}
body.theme-hud .mori-slot__rule { flex: 1; height: 1px; background: rgba(18, 168, 255, .22); }

body.theme-hud .hp-latency-body { display: block; }
body.theme-hud .hp-latency-copy { width: 100%; max-width: none; padding: 0; }
body.theme-hud .hp-latency-chart { display: none; }
body.theme-hud .ap-hero,
body.theme-hud .fp-hero,
body.theme-hud .sp-hero,
body.theme-hud .qp-hero {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 0;
  background: transparent;
}
body.theme-hud .fp-hero-copy,
body.theme-hud .sp-hero-copy,
body.theme-hud .qp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}
body.theme-hud .fp-hero-panda { display: none !important; }
body.theme-hud .qp-hero-panda { display: none !important; }
body.theme-hud .qp-capability-grid article { border-color: rgba(18, 168, 255, .2); }
body.theme-hud .ap-focus-art {
  display: block;
  width: 72px;
  height: 72px;
  margin-top: 10px;
}
body.theme-hud .ap-focus-art img { display: block; width: 100%; height: 100%; }
body.theme-hud .ap-focus .mori-slot__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
body.theme-hud .fp-feature-controls { display: none; }
body.theme-hud .fp-feature-track {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  overflow: visible;
  padding: 0;
}
body.theme-hud .fp-feature { width: 100%; }
body.theme-hud .fp-feature-art {
  display: block;
  width: 88px;
  height: 88px;
  flex: 0 0 auto;
}
body.theme-hud .fp-feature-art img { display: block; width: 100%; height: 100%; object-fit: contain; }
body.theme-hud .fp-feature .mori-slot__body {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

body.theme-hud .mori-readout {
  display: grid;
  grid-template-columns: 34px 120px minmax(0, 1fr) 110px;
  grid-template-areas: "idx measure main meter";
  align-items: center;
  gap: 14px;
  padding: 14px 4px;
  border-bottom: 1px solid rgba(18, 168, 255, .14);
}
body.theme-hud .mori-readout__idx {
  grid-area: idx;
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .14em;
  color: #5cc4ff;
}
body.theme-hud .mori-readout__main { grid-area: main; display: grid; gap: 4px; min-width: 0; }
body.theme-hud .mori-readout__measure {
  grid-area: measure;
  display: flex;
  align-items: baseline;
  gap: 5px;
  padding-right: 14px;
  border-right: 1px solid rgba(18, 168, 255, .18);
}
body.theme-hud .mori-readout__value {
  font-family: var(--mori-type-mono);
  font-size: 26px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.02em;
  color: #eaf8ff;
  font-variant-numeric: tabular-nums;
}
body.theme-hud .mori-readout__unit {
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .18em;
  color: #12a8ff;
}
body.theme-hud .mori-readout__main h3,
body.theme-hud .mori-readout__main strong {
  margin: 0;
  font-family: var(--mori-type-mono);
  font-size: 10.5px;
  letter-spacing: .1em;
  color: #cfefff;
}
body.theme-hud .mori-readout__main p {
  margin: 0;
  font-size: 12px;
  line-height: 1.65;
  color: #8fb2c7;
}
body.theme-hud .mori-readout__meter { grid-area: meter; height: 3px; background: rgba(18, 168, 255, .14); }
body.theme-hud .mori-readout__meter i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #12a8ff, #5cc4ff);
}

body.theme-hud .mori-pair {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid rgba(18, 168, 255, .16);
}
body.theme-hud .mori-pair__idx {
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .12em;
  color: #12a8ff;
}
body.theme-hud .mori-pair dt,
body.theme-hud .mori-pair > span:not(.mori-pair__idx):not(.mori-pair__rule) {
  margin: 0;
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #8fb2c7;
}
body.theme-hud .mori-pair dd,
body.theme-hud .mori-pair > a,
body.theme-hud .mori-pair > address {
  margin: 0;
  justify-self: end;
  max-width: 62ch;
  font-family: var(--mori-type-mono);
  font-size: 11.5px;
  font-style: normal;
  text-align: right;
  color: #eaf8ff;
}
body.theme-hud .mori-pair__rule { display: none; }

body.theme-hud .mori-band {
  margin: 0 0 14px;
  border: 1px solid rgba(18, 168, 255, .26);
  background: linear-gradient(180deg, rgba(18, 168, 255, .06), transparent 60%), var(--mori-surface-content);
  grid-template-columns: minmax(0, 1fr);
}
body.theme-hud .ap-intro.mori-band .mori-band__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
body.theme-hud .mori-band__bar {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(18, 168, 255, .24);
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #5cc4ff;
}
body.theme-hud .mori-band__label { color: #8fb2c7; }
body.theme-hud .mori-band__ticks {
  flex: 1;
  height: 6px;
  background: repeating-linear-gradient(90deg, rgba(18, 168, 255, .55) 0 1px, transparent 1px 9px);
  opacity: .5;
}
body.theme-hud .mori-band__body { padding: 20px; }

body.theme-hud .mori-section { margin: 22px 0 10px; }
body.theme-hud .mori-section:first-child { margin-top: 0; }
body.theme-hud .mori-section__bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  font-family: var(--mori-type-mono);
}
body.theme-hud .mori-section__idx {
  font-size: 9px;
  letter-spacing: .2em;
  color: #12a8ff;
}
body.theme-hud .mori-section__rule {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(18, 168, 255, .45), transparent);
}

/* hud type + replica surfaces */
body.theme-hud h1,
body.theme-hud h2,
body.theme-hud h3,
body.theme-hud h4 {
  font-family: var(--mori-type-display);
  color: var(--mori-ink-strong);
  letter-spacing: -.01em;
}
body.theme-hud h1 { font-size: var(--mori-type-hero); line-height: 1.08; font-weight: 700; }
body.theme-hud h2 { font-size: var(--mori-type-section); line-height: 1.15; font-weight: 600; }
body.theme-hud p,
body.theme-hud li { color: var(--mori-ink-muted); line-height: 1.72; }
body.theme-hud .hp-hero,
body.theme-hud .hp-retail,
body.theme-hud .hp-latency,
body.theme-hud .hp-company,
body.theme-hud .hp-licence,
body.theme-hud .hp-office,
body.theme-hud .ap-hero,
body.theme-hud .ap-products-section,
body.theme-hud .ap-technical-section,
body.theme-hud .ap-office-section,
body.theme-hud .fp-hero,
body.theme-hud .fp-feature,
body.theme-hud .fp-licensing,
body.theme-hud .fp-download,
body.theme-hud .qp-hero,
body.theme-hud .qp-services,
body.theme-hud .qp-service,
body.theme-hud .qp-agent,
body.theme-hud .qp-manifesto,
body.theme-hud .qp-download,
body.theme-hud .dp-top,
body.theme-hud .dp-main,
body.theme-hud .hp-footer {
  background-color: transparent;
  background-image: none;
}
body.theme-hud .hp-hero { padding: 8px 0 0; border-bottom: 0; }
body.theme-hud .hp-hero-copy,
body.theme-hud .ap-title,
body.theme-hud .fp-hero-copy,
body.theme-hud .qp-hero-copy,
body.theme-hud .dp-brand-copy { max-width: 100%; }
body.theme-hud .hp-hero-description,
body.theme-hud .fp-desktop-description,
body.theme-hud .ap-intro p {
  max-width: 68ch;
  font-size: 13px;
  line-height: 1.75;
  color: var(--mori-ink-muted);
}
body.theme-hud .ap-products {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}
body.theme-hud .ap-product { width: 100%; }
body.theme-hud .ap-product .mori-slot__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 32px;
}
body.theme-hud .hp-cta,
body.theme-hud .fp-cta,
body.theme-hud .qp-hero-copy a,
body.theme-hud .dp-download-link a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: static;
  margin-top: 18px;
  padding: 11px 20px;
  border: 1px solid #12a8ff;
  background: #12a8ff;
  color: #03101b;
  font-family: var(--mori-type-mono);
  font-size: 10.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
}
body.theme-hud .hp-cta:hover,
body.theme-hud .fp-cta:hover { background: #5cc4ff; border-color: #5cc4ff; }
body.theme-hud .hp-service-grid .hp-service {
  border: 1px solid rgba(18, 168, 255, .34);
  background: rgba(18, 168, 255, .05);
}
body.theme-hud .hp-service h3 {
  font-family: var(--mori-type-mono);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.theme-hud .hp-company-mark img,
body.theme-hud .hp-office-map img,
body.theme-hud .hp-hero-panda {
  filter: grayscale(1) brightness(1.6) sepia(.4) hue-rotate(160deg) saturate(1.6);
  opacity: .6;
}
body.theme-hud .hp-footer {
  margin-top: 24px;
  padding: 22px 20px;
  border: 1px solid rgba(18, 168, 255, .22);
  color: var(--mori-ink-muted);
  font-size: 11px;
}
body.theme-hud .hp-footer h2 {
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #5cc4ff;
}
body.theme-hud .hp-footer a { color: var(--mori-ink-muted); }
body.theme-hud .hp-footer a:hover { color: #eaf8ff; }

/* ══════════════════════════════════════════════════════════════════════════
   YOUSHEN — scroll document with a floating compass dock and a full-screen
   directional overlay. No side chrome, no progress line, no header row.
   ══════════════════════════════════════════════════════════════════════ */
body.theme-youshen {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-serif);
}
body.theme-youshen .hp-page,
body.theme-youshen .ap-page,
body.theme-youshen .fp-page,
body.theme-youshen .qp-page,
body.theme-youshen .dp-page {
  background:
    radial-gradient(1200px 520px at 50% -10%, rgba(201, 163, 90, .08), transparent 70%),
    var(--mori-surface-page);
  color: var(--mori-ink-base);
}
body.theme-youshen .mori-ys-page {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1);
}
body.theme-youshen .mori-ys-page.is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  body.theme-youshen .mori-ys-page { opacity: 1; transform: none; transition: none; }
}

/* compass dock */
.mori-ys-dock {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 90;
  transform: translateX(-50%);
  transition: transform .34s cubic-bezier(.2, .7, .2, 1), opacity .24s ease;
}
.mori-ys-dock.is-hidden {
  transform: translateX(-50%) translateY(120%);
  opacity: 0;
  pointer-events: none;
}
.mori-ys-button {
  position: relative;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  gap: 0;
  padding: 0;
  border: 1px solid var(--mori-accent-primary);
  border-radius: 50%;
  background: var(--mori-surface-content);
  box-shadow:
    inset 0 0 0 4px var(--mori-surface-page),
    inset 0 0 0 5px rgba(201, 163, 90, .45),
    0 10px 30px rgba(0, 0, 0, .55);
  cursor: pointer;
}
.mori-ys-button__seal {
  font-family: var(--mori-type-serif);
  font-size: 20px;
  line-height: 1;
  color: var(--mori-accent-highlight);
}
.mori-ys-button__label {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  font-family: var(--mori-type-serif);
  font-size: 9px;
  letter-spacing: .34em;
  color: var(--mori-accent-primary);
  white-space: nowrap;
}
.mori-ys-button:hover { border-color: var(--mori-accent-highlight); }

/* overlay */
.mori-ys-overlay {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: grid;
  place-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity .24s ease, visibility .24s;
}
.mori-ys-overlay.is-open { opacity: 1; visibility: visible; }
.mori-ys-scrim {
  position: absolute;
  inset: 0;
  background: rgba(10, 8, 6, .78);
  backdrop-filter: blur(4px);
}
.mori-ys-overlay .mori-ys-sheet {
  position: relative;
  width: min(980px, 94vw);
  max-height: 88vh;
  overflow-y: auto;
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr);
  grid-template-areas: "disk panel";
  gap: 46px;
  padding: 44px 46px;
  background:
    linear-gradient(180deg, rgba(201, 163, 90, .05), transparent 40%),
    var(--mori-surface-content);
  border: 1px solid var(--mori-accent-card-border);
  box-shadow:
    inset 0 0 0 6px var(--mori-surface-content),
    inset 0 0 0 7px rgba(201, 163, 90, .3),
    0 40px 100px rgba(0, 0, 0, .6);
  color: var(--mori-ink-base);
}
.mori-ys-close {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 3;
  width: 34px;
  height: 34px;
  border: 1px solid var(--mori-accent-card-border);
  background: transparent;
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-serif);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.mori-ys-close:hover { color: var(--mori-accent-highlight); border-color: var(--mori-accent-primary); }
.mori-ys-disk {
  grid-area: 1 / 1;
  position: relative;
  width: 340px;
  height: 340px;
  align-self: center;
}
.mori-ys-disk svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  fill: none;
}
.mori-ys-ring { stroke: rgba(201, 163, 90, .34); stroke-width: 1; }
.mori-ys-ring--mid { stroke: rgba(201, 163, 90, .22); stroke-dasharray: 2 6; }
.mori-ys-ring--inner { stroke: rgba(201, 163, 90, .5); }
.mori-ys-ridge-line { stroke: rgba(201, 163, 90, .18); stroke-width: 1; }

.mori-ys-dirs {
  grid-area: 1 / 1;
  position: relative;
  z-index: 2;
  width: 340px;
  height: 340px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  place-items: center;
}
.mori-ys-dir {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease;
}
.mori-ys-dir:hover { border-color: rgba(201, 163, 90, .45); background: rgba(201, 163, 90, .06); }
.mori-ys-dir.is-on {
  border-color: var(--mori-accent-primary);
  background: rgba(201, 163, 90, .1);
}
.mori-ys-dir__glyph {
  font-family: var(--mori-type-serif);
  font-size: 24px;
  line-height: 1;
  color: var(--mori-accent-highlight);
}
.mori-ys-dir__label {
  font-family: var(--mori-type-serif);
  font-size: 8.5px;
  letter-spacing: .16em;
  color: var(--mori-ink-muted);
}
.mori-ys-dir.is-wood .mori-ys-dir__glyph { color: #4f8a78; }
.mori-ys-dir.is-fire .mori-ys-dir__glyph { color: #d4382c; }
.mori-ys-dir.is-earth .mori-ys-dir__glyph { color: #c9a35a; }
.mori-ys-dir.is-metal .mori-ys-dir__glyph { color: #aeb4b8; }
.mori-ys-dir.is-water .mori-ys-dir__glyph { color: #4f7fc0; }
.mori-ys-dir--center { grid-area: 2 / 2; width: 90px; height: 90px; border-color: rgba(201, 163, 90, .28); }
.mori-ys-dir--north { grid-area: 1 / 2; }
.mori-ys-dir--south { grid-area: 3 / 2; }
.mori-ys-dir--west { grid-area: 2 / 1; }
.mori-ys-dir--east { grid-area: 2 / 3; }

.mori-ys-sheet-panel {
  grid-area: 1 / 2;
  align-self: center;
  min-height: 200px;
  padding-left: 34px;
  border-left: 1px solid rgba(201, 163, 90, .24);
}
.mori-ys-sheet-panel__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(201, 163, 90, .28);
}
.mori-ys-sheet-panel__glyph {
  font-family: var(--mori-type-serif);
  font-size: 34px;
  line-height: 1;
  color: var(--mori-accent-primary);
}
.mori-ys-sheet-panel__label {
  font-family: var(--mori-type-serif);
  font-size: 13px;
  letter-spacing: .26em;
  color: var(--mori-ink-muted);
}
.mori-ys-sheet-panel__list { display: grid; }
.mori-ys-link {
  display: block;
  padding: 11px 0;
  border-bottom: 1px dotted rgba(201, 163, 90, .24);
  font-family: var(--mori-type-serif);
  font-size: 16px;
  letter-spacing: .03em;
  color: var(--mori-ink-base);
  text-decoration: none;
}
.mori-ys-link:hover { color: var(--mori-accent-highlight); padding-left: 6px; }
.mori-ys-link.is-here { color: var(--mori-accent-primary); }

/* ridge dividers */
.mori-ys-ridge {
  position: relative;
  z-index: 1;
  margin: 6px 0;
  opacity: .5;
  pointer-events: none;
}
.mori-ys-ridge svg { display: block; width: 100%; height: 110px; fill: none; }
.mori-ys-ridge path { stroke: var(--mori-accent-primary); stroke-width: 1; }
.mori-ys-ridge path.far { opacity: .25; }
.mori-ys-ridge path.mid { opacity: .45; }
.mori-ys-ridge path.near { opacity: .7; }
.mori-ys-ridge circle { fill: var(--mori-accent-primary); opacity: .16; }

/* youshen components */
body.theme-youshen .mori-ys-plaque {
  position: relative;
  display: block;
  padding: 8px 0 12px;
  border-top: 1px solid rgba(201, 163, 90, .5);
  border-bottom: 1px solid rgba(201, 163, 90, .5);
  box-shadow: 0 3px 0 -2px rgba(201, 163, 90, .3);
}
body.theme-youshen .mori-ys-plaque h1,
body.theme-youshen .mori-ys-plaque h2,
body.theme-youshen .mori-ys-plaque .ap-title {
  display: inline;
  margin: 0;
  font-family: var(--mori-type-serif);
  font-size: var(--mori-type-hero);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .02em;
  color: var(--mori-ink-strong);
}
body.theme-youshen .mori-ys-plaque__stamp {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-right: 18px;
  vertical-align: middle;
  background: #bf2b20;
  border: 1px solid #d4382c;
  color: #f5ecd8;
  font-family: var(--mori-type-serif);
  font-size: 22px;
  line-height: 1;
  transform: rotate(-3deg);
  box-shadow: inset 0 0 0 2px rgba(245, 236, 216, .18);
}
body.theme-youshen .mori-ys-plaque__rule { display: none; }

body.theme-youshen .mori-ys-sheet {
  position: relative;
  margin: 0 0 18px;
  padding: 26px 26px 24px;
  background: var(--mori-surface-content);
  border: 1px solid rgba(201, 163, 90, .34);
  box-shadow: inset 0 0 0 5px var(--mori-surface-content), inset 0 0 0 6px rgba(201, 163, 90, .18);
}
body.theme-youshen .mori-ys-sheet__no {
  position: absolute;
  top: 10px;
  right: 14px;
  font-family: var(--mori-type-serif);
  font-size: 20px;
  line-height: 1;
  color: rgba(201, 163, 90, .55);
}
body.theme-youshen .mori-ys-sheet__seal {
  position: absolute;
  right: 16px;
  bottom: 14px;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  background: #bf2b20;
  color: #f5ecd8;
  font-family: var(--mori-type-serif);
  font-size: 14px;
  line-height: 1;
  transform: rotate(-4deg);
  opacity: .95;
}
body.theme-youshen .mori-ys-sheet__inner { display: grid; gap: 10px; }
body.theme-youshen .mori-ys-sheet__inner h3,
body.theme-youshen .mori-ys-sheet__inner h2 {
  font-family: var(--mori-type-serif);
  font-size: 20px;
  font-weight: 600;
  color: var(--mori-ink-strong);
}
body.theme-youshen .mori-ys-sheet__inner p,
body.theme-youshen .mori-ys-sheet__inner li {
  font-family: var(--mori-type-sans);
  font-size: 14px;
  line-height: 1.85;
  color: var(--mori-ink-muted);
}

body.theme-youshen .mori-ys-report {
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 14px;
  padding: 18px 34px 18px 0;
  border-top: 1px solid rgba(201, 163, 90, .22);
}
body.theme-youshen .mori-ys-report:last-child { border-bottom: 1px solid rgba(201, 163, 90, .22); }
body.theme-youshen .mori-ys-report__mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  background: #bf2b20;
  color: #f5ecd8;
  font-family: var(--mori-type-serif);
  font-size: 15px;
  transform: rotate(-4deg);
}
body.theme-youshen .mori-ys-report__body { display: grid; gap: 5px; }
body.theme-youshen .mori-ys-report__body h3 {
  margin: 0;
  font-family: var(--mori-type-serif);
  font-size: 17px;
  letter-spacing: .04em;
  color: var(--mori-ink-strong);
}
body.theme-youshen .mori-ys-report__text p,
body.theme-youshen .mori-ys-report__text li {
  margin: 0;
  font-family: var(--mori-type-sans);
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--mori-ink-muted);
}
body.theme-youshen .mori-ys-report__no {
  position: absolute;
  top: 18px;
  right: 0;
  font-family: var(--mori-type-serif);
  font-size: 10px;
  letter-spacing: .18em;
  color: rgba(201, 163, 90, .6);
}

body.theme-youshen .mori-ys-plate {
  position: relative;
  padding: 26px;
  border: 1px solid rgba(201, 163, 90, .36);
  box-shadow: inset 0 0 0 5px var(--mori-surface-page), inset 0 0 0 6px rgba(201, 163, 90, .2);
  background: rgba(201, 163, 90, .03);
}
body.theme-youshen .mori-ys-plate__seal {
  position: absolute;
  right: 16px;
  bottom: 16px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  background: #bf2b20;
  color: #f5ecd8;
  font-family: var(--mori-type-serif);
  font-size: 15px;
  line-height: 1;
  transform: rotate(4deg);
  opacity: .95;
}
body.theme-youshen .mori-ys-plate p,
body.theme-youshen .mori-ys-plate li {
  font-family: var(--mori-type-sans);
  font-size: 14.5px;
  line-height: 1.9;
  color: var(--mori-ink-muted);
}
body.theme-youshen .mori-ys-plate h2,
body.theme-youshen .mori-ys-plate h3 { font-family: var(--mori-type-serif); color: var(--mori-ink-strong); }

body.theme-youshen .mori-ys-chapter { margin: 30px 0 12px; }
body.theme-youshen .mori-ys-chapter__kicker {
  display: block;
  margin-bottom: 6px;
  font-family: var(--mori-type-serif);
  font-size: 10px;
  letter-spacing: .34em;
  color: var(--mori-accent-primary);
}
body.theme-youshen .mori-ys-chapter h2,
body.theme-youshen .mori-ys-chapter__title {
  font-family: var(--mori-type-serif);
  font-size: var(--mori-type-section);
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--mori-ink-strong);
}
body.theme-youshen .mori-ys-chapter__rule {
  display: block;
  height: 1px;
  margin-top: 10px;
  background: linear-gradient(90deg, rgba(201, 163, 90, .6), transparent);
}

body.theme-youshen .mori-ys-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px dotted rgba(201, 163, 90, .22);
}
body.theme-youshen .mori-ys-row__no {
  font-family: var(--mori-type-serif);
  font-size: 18px;
  line-height: 1.3;
  color: var(--mori-accent-primary);
  text-align: center;
}
body.theme-youshen .mori-ys-row__body h3 {
  margin: 0 0 4px;
  font-family: var(--mori-type-serif);
  font-size: 16px;
  letter-spacing: .03em;
  color: var(--mori-ink-strong);
}
body.theme-youshen .mori-ys-row__body p,
body.theme-youshen .mori-ys-row__body li {
  margin: 0;
  font-family: var(--mori-type-sans);
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--mori-ink-muted);
}

body.theme-youshen .mori-ys-register {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(201, 163, 90, .2);
}
body.theme-youshen .mori-ys-register__no {
  font-family: var(--mori-type-serif);
  font-size: 11px;
  letter-spacing: .1em;
  color: var(--mori-accent-primary);
}
body.theme-youshen .mori-ys-register__body {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  font-family: var(--mori-type-sans);
  font-size: 14px;
  color: var(--mori-ink-base);
}
body.theme-youshen .mori-ys-register__body dt { color: var(--mori-ink-muted); }
body.theme-youshen .mori-ys-register__body dd { margin: 0; color: var(--mori-ink-strong); }

/* youshen type + surfaces */
body.theme-youshen h1,
body.theme-youshen h2,
body.theme-youshen h3,
body.theme-youshen h4 {
  font-family: var(--mori-type-serif);
  color: var(--mori-ink-strong);
  letter-spacing: .03em;
}
body.theme-youshen h1 { font-size: var(--mori-type-hero); line-height: 1.2; font-weight: 700; }
body.theme-youshen h2 { font-size: var(--mori-type-section); line-height: 1.25; font-weight: 600; }
body.theme-youshen p,
body.theme-youshen li { font-family: var(--mori-type-sans); color: var(--mori-ink-muted); line-height: 1.9; }
body.theme-youshen .hp-hero,
body.theme-youshen .hp-retail,
body.theme-youshen .hp-latency,
body.theme-youshen .hp-company,
body.theme-youshen .hp-licence,
body.theme-youshen .hp-office,
body.theme-youshen .ap-hero,
body.theme-youshen .ap-products-section,
body.theme-youshen .ap-technical-section,
body.theme-youshen .ap-office-section,
body.theme-youshen .fp-hero,
body.theme-youshen .fp-feature,
body.theme-youshen .fp-licensing,
body.theme-youshen .fp-download,
body.theme-youshen .qp-hero,
body.theme-youshen .qp-services,
body.theme-youshen .qp-service,
body.theme-youshen .qp-agent,
body.theme-youshen .qp-manifesto,
body.theme-youshen .qp-download,
body.theme-youshen .dp-top,
body.theme-youshen .dp-main,
body.theme-youshen .hp-footer {
  background-color: transparent;
  background-image: none;
  border-color: rgba(201, 163, 90, .22);
}
body.theme-youshen .hp-hero { padding: 40px clamp(20px, 8.33vw, 120px) 22px; }
body.theme-youshen .ap-hero,
body.theme-youshen .fp-hero,
body.theme-youshen .sp-hero,
body.theme-youshen .qp-hero {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 40px 0 22px;
  background: transparent;
}
body.theme-youshen .fp-hero { padding: 40px clamp(20px, 8.33vw, 120px) 22px; }
body.theme-youshen .fp-hero-copy,
body.theme-youshen .sp-hero-copy,
body.theme-youshen .qp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}
body.theme-youshen .fp-hero-panda { display: none !important; }
body.theme-youshen .qp-hero-panda { display: none !important; }
body.theme-youshen .qp-capability-grid article { border-color: rgba(201, 163, 90, .24); }
body.theme-youshen .ap-focus-art {
  display: block;
  width: 100%;
  max-width: 200px;
  aspect-ratio: 1;
  margin-top: 14px;
}
body.theme-youshen .ap-focus-art img { width: 100%; height: 100%; }
body.theme-youshen .fp-feature-controls { display: none; }
body.theme-youshen .fp-feature-track {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  overflow: visible;
  padding: 0;
}
body.theme-youshen .fp-feature { width: 100%; }
body.theme-youshen .fp-feature-art {
  width: 200px;
  height: 200px;
  justify-self: center;
}
body.theme-youshen .fp-feature-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body.theme-youshen .hp-hero-copy > p:first-child {
  font-family: var(--mori-type-sans);
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mori-accent-primary);
}
body.theme-youshen .hp-hero-copy .hp-cta {
  position: static;
  display: inline-block;
  margin-top: 20px;
}
body.theme-youshen .hp-retail,
body.theme-youshen .hp-latency,
body.theme-youshen .hp-company,
body.theme-youshen .hp-licence,
body.theme-youshen .hp-office,
body.theme-youshen .ap-hero,
body.theme-youshen .ap-products-section,
body.theme-youshen .ap-technical-section,
body.theme-youshen .ap-office-section,
body.theme-youshen .fp-hero,
body.theme-youshen .fp-feature,
body.theme-youshen .fp-licensing,
body.theme-youshen .fp-download,
body.theme-youshen .qp-hero,
body.theme-youshen .qp-services,
body.theme-youshen .qp-service,
body.theme-youshen .qp-agent,
body.theme-youshen .qp-manifesto,
body.theme-youshen .qp-download,
body.theme-youshen .dp-top,
body.theme-youshen .dp-main {
  min-height: 0;
}
body.theme-youshen .hp-office-map,
body.theme-youshen .hp-licence > img { display: none; }
body.theme-youshen .hp-hero-description,
body.theme-youshen .fp-desktop-description,
body.theme-youshen .ap-intro p {
  width: auto;
  max-width: 66ch;
  font-family: var(--mori-type-sans);
  font-size: 15px;
  line-height: 1.95;
}
body.theme-youshen .hp-cta,
body.theme-youshen .fp-cta,
body.theme-youshen .qp-hero-copy a {
  display: inline-block;
  position: static;
  margin-top: 20px;
  padding: 10px 22px;
  border: 1px solid var(--mori-accent-primary);
  background: transparent;
  color: var(--mori-accent-primary);
  font-family: var(--mori-type-serif);
  font-size: 13px;
  letter-spacing: .14em;
  text-decoration: none;
}
body.theme-youshen .hp-cta:hover,
body.theme-youshen .fp-cta:hover { background: rgba(201, 163, 90, .1); color: var(--mori-accent-highlight); }
body.theme-youshen .hp-service-grid .hp-service {
  background: rgba(201, 163, 90, .03);
  border: 1px solid rgba(201, 163, 90, .24);
}
body.theme-youshen .hp-company-mark img,
body.theme-youshen .hp-office-map img,
body.theme-youshen .hp-hero-panda {
  filter: grayscale(1) sepia(.55) brightness(.85);
  opacity: .45;
}
body.theme-youshen .hp-latency-chart img {
  filter: invert(1) sepia(.4) saturate(1.6);
  opacity: .8;
}
body.theme-youshen .hp-footer {
  margin-top: 30px;
  padding: 26px 20px;
  border-top: 1px solid rgba(201, 163, 90, .3);
  font-family: var(--mori-type-sans);
  font-size: 12.5px;
  color: var(--mori-ink-muted);
}
body.theme-youshen .hp-footer h2 {
  font-family: var(--mori-type-serif);
  font-size: 11px;
  letter-spacing: .26em;
  color: var(--mori-accent-primary);
}
body.theme-youshen .hp-footer a { color: var(--mori-ink-muted); }

/* ══════════════════════════════════════════════════════════════════════════
   ATELIER — fixed editorial bar with centred sectors and mega panels, mobile
   drawer, hairline system, full-bleed sand bands, Barlow type scale.
   No serif, no folio, no section index, no keyframes.
   ══════════════════════════════════════════════════════════════════════ */
body.theme-atelier {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  padding-top: 64px;
}
body.theme-atelier .hp-page,
body.theme-atelier .ap-page,
body.theme-atelier .fp-page,
body.theme-atelier .qp-page,
body.theme-atelier .dp-page {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
}

/* bar */
.mori-at-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: 64px;
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid var(--mori-accent-divider);
  backdrop-filter: blur(12px);
  transition: border-color .18s cubic-bezier(.2, .7, .2, 1), box-shadow .18s cubic-bezier(.2, .7, .2, 1);
}
.mori-at-bar.is-stuck { border-bottom-color: #d8d4cd; box-shadow: 0 4px 18px rgba(0, 0, 0, .05); }
.mori-at-inner {
  position: relative;
  max-width: 1440px;
  height: 100%;
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.mori-at-brand {
  display: grid;
  gap: 1px;
  color: var(--mori-ink-strong);
  text-decoration: none;
  line-height: 1.1;
}
.mori-at-brand__mark {
  font-family: var(--mori-type-display);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .14em;
}
.mori-at-brand__sub {
  font-size: 10px;
  letter-spacing: .1em;
  color: var(--mori-ink-faint);
}

.mori-at-sectors {
  position: absolute;
  left: 50%;
  top: 0;
  height: 100%;
  transform: translateX(-50%);
  display: flex;
  align-items: stretch;
  gap: 2px;
}
.mori-at-sector { position: relative; display: flex; align-items: stretch; }
.mori-at-sector-btn {
  position: relative;
  padding: 0 16px;
  border: 0;
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .02em;
  cursor: pointer;
}
.mori-at-sector-btn::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 14px;
  height: 2px;
  background: transparent;
}
.mori-at-sector-btn:hover { color: var(--mori-ink-strong); }
.mori-at-sector.is-current .mori-at-sector-btn::after,
.mori-at-sector.is-open .mori-at-sector-btn::after { background: var(--mori-ink-strong); }
.mori-at-sector.is-open .mori-at-sector-btn { background: #faf8f5; }

.mori-at-panel {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  display: grid;
  grid-auto-flow: column;
  gap: 34px;
  min-width: 240px;
  padding: 22px 26px 26px;
  background: #ffffff;
  border: 1px solid var(--mori-accent-divider);
  box-shadow: 0 22px 50px rgba(0, 0, 0, .09);
  opacity: 0;
  visibility: hidden;
  transition: opacity .18s cubic-bezier(.2, .7, .2, 1), transform .18s cubic-bezier(.2, .7, .2, 1), visibility .18s;
}
.mori-at-sector.is-open .mori-at-panel {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%);
}
.mori-at-panel__group { display: grid; align-content: start; gap: 2px; }
.mori-at-panel__heading {
  margin-bottom: 6px;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-faint);
}
.mori-at-panel__link {
  padding: 7px 0;
  font-size: 15px;
  color: var(--mori-ink-base);
  text-decoration: none;
  white-space: nowrap;
}
.mori-at-panel__link:hover { color: var(--mori-ink-strong); text-decoration: underline; text-underline-offset: 3px; }
.mori-at-panel__link[aria-current="page"] { font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.mori-at-panel__sep {
  display: block;
  width: 1px;
  background: var(--mori-accent-divider);
}

.mori-at-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 18px;
}
.mori-at-action {
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-faint);
  text-decoration: none;
}
.mori-at-action:hover,
.mori-at-action.is-current { color: var(--mori-ink-strong); }
.mori-at-menu {
  display: none;
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  place-items: center;
  cursor: pointer;
}
.mori-at-menu__bar,
.mori-at-menu__bar::before,
.mori-at-menu__bar::after { display: block; width: 18px; height: 1px; background: var(--mori-ink-strong); }
.mori-at-menu__bar { position: relative; }
.mori-at-menu__bar::before,
.mori-at-menu__bar::after { content: ""; position: absolute; left: 0; }
.mori-at-menu__bar::before { top: -5px; }
.mori-at-menu__bar::after { top: 5px; }

/* drawer */
.mori-at-drawer {
  position: fixed;
  inset: 0;
  z-index: 200;
  visibility: hidden;
  pointer-events: none;
  overflow: hidden;
}
body.mori-shell-atelier { overflow-x: hidden; }
.mori-at-drawer.is-open { visibility: visible; pointer-events: auto; }
.mori-at-scrim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .32);
  opacity: 0;
  transition: opacity .2s cubic-bezier(.2, .7, .2, 1);
}
.mori-at-drawer.is-open .mori-at-scrim { opacity: 1; }
.mori-at-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(420px, 88vw);
  overflow-y: auto;
  background: #ffffff;
  border-left: 1px solid var(--mori-accent-divider);
  transform: translateX(100%);
  transition: transform .24s cubic-bezier(.2, .7, .2, 1);
}
.mori-at-drawer.is-open .mori-at-drawer__panel { transform: none; }
.mori-at-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 24px;
  border-bottom: 1px solid var(--mori-accent-divider);
}
.mori-at-drawer__brand {
  font-family: var(--mori-type-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .14em;
}
.mori-at-drawer__close {
  width: 32px;
  height: 32px;
  border: 1px solid var(--mori-accent-divider);
  background: transparent;
  color: var(--mori-ink-base);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.mori-at-drawer__body { padding: 8px 24px 34px; }
.mori-at-drawer__sector { border-bottom: 1px solid var(--mori-accent-divider); }
.mori-at-drawer__btn {
  width: 100%;
  padding: 18px 0;
  border: 0;
  background: transparent;
  text-align: left;
  font-family: var(--mori-type-sans);
  font-size: 18px;
  font-weight: 500;
  color: var(--mori-ink-strong);
  cursor: pointer;
}
.mori-at-drawer__items { display: none; padding-bottom: 14px; }
.mori-at-drawer__sector.is-open .mori-at-drawer__items { display: grid; gap: 2px; }
.mori-at-drawer__heading {
  margin: 10px 0 2px;
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-faint);
}
.mori-at-drawer__link {
  padding: 7px 0;
  font-size: 15px;
  color: var(--mori-ink-base);
  text-decoration: none;
}
.mori-at-drawer__link[aria-current="page"] { font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }

/* atelier components */
body.theme-atelier .mori-at-cover {
  margin: 34px 0 44px;
  padding-top: 26px;
  border-top: 1px solid var(--mori-ink-strong);
}
body.theme-atelier .mori-at-eyebrow {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 22px;
}
body.theme-atelier .mori-at-eyebrow__label {
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-eyebrow__rule { flex: 1; height: 1px; background: var(--mori-accent-divider); }
body.theme-atelier .mori-at-cover__body h1,
body.theme-atelier .mori-at-cover__body .ap-title {
  max-width: 18ch;
  margin: 0 0 20px;
  font-family: var(--mori-type-display);
  font-size: 48px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.025em;
  color: var(--mori-ink-strong);
}
body.theme-atelier .mori-at-cover__body p {
  max-width: 62ch;
  font-size: 18px;
  line-height: 1.6;
  color: var(--mori-ink-muted);
}
body.theme-atelier .mori-at-cover__body .hp-cta,
body.theme-atelier .mori-at-cover__body .fp-cta,
body.theme-atelier .mori-at-cover__body .qp-hero-copy > a {
  display: inline-flex;
  position: static;
  margin-top: 20px;
  padding: 14px 24px;
  border: 0;
  background: var(--mori-ink-strong);
  color: #ffffff;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
}
body.theme-atelier .mori-at-cover__body .hp-cta:hover,
body.theme-atelier .mori-at-cover__body .fp-cta:hover { background: #262626; }

body.theme-atelier .mori-at-list {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 22px;
  padding: 26px 0;
  margin: 0;
  border-top: 1px solid var(--mori-accent-divider);
}
body.theme-atelier .mori-at-list:last-child { border-bottom: 1px solid var(--mori-accent-divider); }
body.theme-atelier .mori-at-list__no {
  font-family: var(--mori-type-display);
  font-size: 48px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.03em;
  color: #debb81;
}
body.theme-atelier .mori-at-list__body { display: grid; gap: 8px; }
body.theme-atelier .mori-at-list__body h3,
body.theme-atelier .mori-at-list__body h2 {
  margin: 0;
  font-family: var(--mori-type-display);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -.01em;
  color: var(--mori-ink-strong);
}
body.theme-atelier .mori-at-list__text p,
body.theme-atelier .mori-at-list__text li {
  margin: 0;
  max-width: 68ch;
  font-size: 15px;
  line-height: 1.7;
  color: var(--mori-ink-muted);
}

body.theme-atelier .mori-at-figure {
  margin: 26px 0;
  padding: 0;
}
body.theme-atelier .mori-at-figure__frame {
  padding: 32px;
  background: #f1ece4;
  box-shadow: 0 0 0 100vmax #f1ece4;
  clip-path: inset(0 -100vmax);
}
body.theme-atelier .mori-at-figure__content { margin: 0; }
body.theme-atelier .mori-at-figure__caption {
  display: flex;
  gap: 20px;
  padding-top: 12px;
  font-size: 12px;
  color: var(--mori-ink-muted);
}
body.theme-atelier .mori-at-figure__no {
  flex: 0 0 auto;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-figure__caption h3 {
  margin: 0;
  font-family: var(--mori-type-sans);
  font-size: 12px;
  font-weight: 400;
  color: var(--mori-ink-muted);
}

body.theme-atelier .mori-at-sand {
  margin: 40px 0;
  padding: 44px 0;
  background: #f1ece4;
  box-shadow: 0 0 0 100vmax #f1ece4;
  clip-path: inset(0 -100vmax);
}
body.theme-atelier .mori-at-sand__bar {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 22px;
  padding-bottom: 12px;
  border-bottom: 1px solid #debb81;
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-sand__no { font-weight: 500; }
body.theme-atelier .mori-at-sand__label { color: var(--mori-ink-muted); }
body.theme-atelier .mori-at-sand__body p,
body.theme-atelier .mori-at-sand__body li {
  max-width: 72ch;
  font-size: 16px;
  line-height: 1.75;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-sand__body h2,
body.theme-atelier .mori-at-sand__body h3 {
  font-family: var(--mori-type-display);
  font-size: 34px;
  font-weight: 500;
  letter-spacing: -.02em;
}

body.theme-atelier .mori-at-line {
  position: relative;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 120px;
  align-items: baseline;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--mori-accent-divider);
}
body.theme-atelier .mori-at-line__no {
  font-family: var(--mori-type-display);
  font-size: 14px;
  color: var(--mori-ink-faint);
}
body.theme-atelier .mori-at-line__body {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  font-size: 14px;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-line__body dt { color: var(--mori-ink-faint); }
body.theme-atelier .mori-at-line__body dd { margin: 0; }
body.theme-atelier .mori-at-line__leader {
  display: block;
  border-bottom: 1px dotted #cfc8bc;
  transform: translateY(-4px);
}

body.theme-atelier .mori-at-essay {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 18px;
  padding: 26px 0;
  border-top: 1px solid var(--mori-accent-divider);
}
body.theme-atelier .mori-at-essay__mark {
  font-family: var(--mori-type-display);
  font-size: 30px;
  line-height: 1;
  color: #debb81;
}
body.theme-atelier .mori-at-essay__col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 56px;
  align-items: start;
}
body.theme-atelier .mori-at-essay__col p,
body.theme-atelier .mori-at-essay__col li {
  max-width: 70ch;
  font-size: 16px;
  line-height: 1.75;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-essay__col h3 {
  margin: 0 0 8px;
  font-family: var(--mori-type-display);
  font-size: 21px;
  font-weight: 500;
}

body.theme-atelier .mori-section { margin: 44px 0 16px; }
body.theme-atelier .mori-section:first-child { margin-top: 0; }
body.theme-atelier .mori-section__bar {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 14px;
}
body.theme-atelier .mori-section__idx { display: none; }
body.theme-atelier .mori-section__rule { flex: 1; height: 1px; background: var(--mori-ink-strong); }
body.theme-atelier .mori-section h2,
body.theme-atelier .mori-section h3 {
  font-family: var(--mori-type-display);
  font-size: 40px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--mori-ink-strong);
}

/* atelier type + surfaces */
body.theme-atelier h1,
body.theme-atelier h2,
body.theme-atelier h3,
body.theme-atelier h4 {
  font-family: var(--mori-type-display);
  color: var(--mori-ink-strong);
  letter-spacing: -.01em;
}
body.theme-atelier h1 { font-size: 48px; line-height: 1.2; font-weight: 500; }
body.theme-atelier h2 { font-size: 40px; line-height: 1.16; font-weight: 500; }
body.theme-atelier p,
body.theme-atelier li { color: var(--mori-ink-muted); line-height: 1.7; }
body.theme-atelier .hp-hero,
body.theme-atelier .hp-retail,
body.theme-atelier .hp-latency,
body.theme-atelier .hp-company,
body.theme-atelier .hp-licence,
body.theme-atelier .hp-office,
body.theme-atelier .ap-hero,
body.theme-atelier .ap-products-section,
body.theme-atelier .ap-technical-section,
body.theme-atelier .ap-office-section,
body.theme-atelier .fp-hero,
body.theme-atelier .fp-feature,
body.theme-atelier .fp-licensing,
body.theme-atelier .fp-download,
body.theme-atelier .qp-hero,
body.theme-atelier .qp-services,
body.theme-atelier .qp-service,
body.theme-atelier .qp-agent,
body.theme-atelier .qp-manifesto,
body.theme-atelier .qp-download,
body.theme-atelier .dp-top,
body.theme-atelier .dp-main,
body.theme-atelier .hp-footer {
  background-color: transparent;
  background-image: none;
}
body.theme-atelier .hp-hero { padding: 10px clamp(20px, 8.33vw, 120px) 0; border: 0; }
body.theme-atelier .hp-hero-copy > p:first-child {
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
}
body.theme-atelier .mori-at-cover__body .hp-cta { position: static; }
body.theme-atelier .hp-retail,
body.theme-atelier .hp-latency,
body.theme-atelier .hp-company,
body.theme-atelier .hp-licence,
body.theme-atelier .hp-office,
body.theme-atelier .ap-hero,
body.theme-atelier .ap-products-section,
body.theme-atelier .ap-technical-section,
body.theme-atelier .ap-office-section,
body.theme-atelier .fp-hero,
body.theme-atelier .fp-feature,
body.theme-atelier .fp-licensing,
body.theme-atelier .fp-download,
body.theme-atelier .qp-hero,
body.theme-atelier .qp-services,
body.theme-atelier .qp-service,
body.theme-atelier .qp-agent,
body.theme-atelier .qp-manifesto,
body.theme-atelier .qp-download,
body.theme-atelier .dp-top,
body.theme-atelier .dp-main {
  min-height: 0;
}
body.theme-atelier .hp-office-map { display: none; }
body.theme-atelier .hp-office { padding: 64px clamp(20px, 8.33vw, 120px); text-align: left; }
body.theme-atelier .hp-office h2 { margin: 0 0 24px; }
body.theme-atelier .hp-contact { width: 100%; max-width: none; margin: 32px 0 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; padding: 0; }
body.theme-atelier .hp-contact > div { padding-top: 14px; border-top: 1px solid var(--mori-accent-divider); }
body.theme-atelier .hp-contact span { color: var(--mori-ink-muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
body.theme-atelier .hp-contact a,
body.theme-atelier .hp-contact address { color: var(--mori-ink-base); font-size: 14px; }
body.theme-atelier .mori-at-sand {
  display: block;
  padding: 44px clamp(20px, 8.33vw, 120px);
  background-color: #f1ece4;
  text-align: left;
}
body.theme-atelier .mori-at-sand__bar { width: 100%; }
body.theme-atelier .mori-at-sand .fp-licensing-inner {
  width: 100%;
  max-width: none;
  grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
  gap: 72px;
}
body.theme-atelier .mori-at-sand .fp-licensing-heading h2 { font-size: 38px; }
body.theme-atelier .mori-at-sand .hp-section-heading,
body.theme-atelier .mori-at-sand .hp-company-copy { text-align: left; }
body.theme-atelier .hp-company.mori-at-sand .mori-at-sand__body {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) 220px;
  grid-template-areas:
    "head head"
    "copy mark";
  gap: 26px 64px;
  align-items: center;
}
body.theme-atelier .hp-company.mori-at-sand .hp-company-copy {
  grid-area: copy;
  order: 1;
  max-width: 640px;
  margin: 0;
}
body.theme-atelier .hp-company.mori-at-sand .hp-company-mark {
  grid-area: mark;
  order: 2;
  justify-self: end;
  width: 180px;
  height: 180px;
  margin: 0;
}
body.theme-atelier .mori-at-sand__body .hp-section-heading { grid-area: head; margin: 0; }
body.theme-atelier .mori-at-sand__body .hp-section-heading h2 { font-size: 40px; }
body.theme-atelier .mori-at-list { text-align: left; justify-items: start; }
body.theme-atelier .mori-at-list__body img { margin: 0 0 8px; }
/* fafa: the host builds a horizontal snap carousel; the editorial reading is
   a stacked plate list with the illustration as a right-hand figure column. */
body.theme-atelier .fp-hero {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 14px clamp(20px, 8.33vw, 120px) 0;
  display: flex;
  align-items: flex-end;
  gap: 56px;
}
body.theme-atelier .fp-hero .mori-at-cover { flex: 1 1 auto; min-width: 0; }
body.theme-atelier .fp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}
body.theme-atelier .fp-hero-panda {
  position: static;
  inset: auto;
  width: 300px;
  max-width: 30vw;
  height: auto;
  margin: 0 0 18px;
}
body.theme-atelier .fp-feature-controls { display: none; }
body.theme-atelier .fp-feature-track {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  overflow: visible;
  padding: 0;
}
body.theme-atelier .fp-feature {
  width: auto;
  flex: 0 0 auto;
  scroll-snap-align: none;
}
body.theme-atelier .fp-feature.mori-at-list { grid-template-columns: 64px minmax(0, 1fr); }
body.theme-atelier .fp-feature .mori-at-list__text {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 48px;
  align-items: center;
}
body.theme-atelier .fp-feature .fp-feature-art { order: 2; margin: 0; height: auto; }
body.theme-atelier .qp-hero {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 14px clamp(20px, 8.33vw, 120px) 0;
  display: flex;
  align-items: flex-end;
  gap: 56px;
}
body.theme-atelier .qp-hero .mori-at-cover { flex: 1 1 auto; min-width: 0; }
body.theme-atelier .qp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}
body.theme-atelier .qp-hero-panda {
  position: static;
  inset: auto;
  width: 300px;
  max-width: 30vw;
  height: auto;
  margin: 0 0 18px;
}
body.theme-atelier .fp-feature .fp-feature-copy { order: 1; }
body.theme-atelier .ap-focus { grid-template-columns: minmax(0, 1fr); gap: 0; }
body.theme-atelier .ap-focus > li.mori-at-list {
  grid-template-columns: 64px minmax(0, 1fr);
  justify-items: stretch;
  align-items: center;
}
body.theme-atelier .ap-focus .mori-at-list__text {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px;
  gap: 32px;
  align-items: center;
}
body.theme-atelier .ap-focus .ap-focus-art {
  order: 2;
  grid-column: 2;
  justify-self: end;
  max-width: 120px;
}
body.theme-atelier .fp-feature .fp-feature-art img {
  max-height: 320px;
  object-fit: contain;
}
body.theme-atelier .ap-focus-art {
  display: block;
  width: 100%;
  max-width: 180px;
}
body.theme-atelier .ap-focus-image { display: block; width: 100%; height: 100%; }
body.theme-atelier .ap-focus-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body.theme-atelier .ap-product {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  border-top: 1px solid var(--mori-accent-divider);
}
body.theme-atelier .hp-hero-description,
body.theme-atelier .fp-desktop-description,
body.theme-atelier .ap-intro p {
  width: auto;
  max-width: 64ch;
  font-size: 17px;
  line-height: 1.65;
}
body.theme-atelier .mori-at-cover__host-kicker { display: none; }
body.theme-atelier .hp-service-grid .hp-service {
  border-top: 1px solid var(--mori-accent-divider);
  border-radius: 0;
  background: transparent;
}
body.theme-atelier .hp-company-mark img,
body.theme-atelier .hp-office-map img,
body.theme-atelier .hp-hero-panda {
  filter: grayscale(1) contrast(1.05);
  opacity: .8;
}
body.theme-atelier .hp-footer {
  margin-top: 44px;
  padding: 30px 20px;
  border-top: 1px solid var(--mori-ink-strong);
  font-size: 12px;
  color: var(--mori-ink-muted);
}
body.theme-atelier .hp-footer h2 {
  font-family: var(--mori-type-sans);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
}
body.theme-atelier .hp-footer a { color: var(--mori-ink-muted); }

/* ══════════════════════════════════════════════════════════════════════════
   SANTIZ — institutional cockpit: status bar, section rail, corner frame,
   data panels and strips with tabular readouts. Mori's own product theme.
   ══════════════════════════════════════════════════════════════════════ */
body.theme-santiz {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  padding-top: 28px;
}
body.theme-santiz main,
body.theme-santiz section,
body.theme-santiz footer { background-color: transparent; }
body.theme-santiz .hp-page,
body.theme-santiz .ap-page,
body.theme-santiz .fp-page,
body.theme-santiz .qp-page,
body.theme-santiz .dp-page {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
}
.mori-sz-status {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 120;
  display: flex;
  align-items: center;
  gap: 22px;
  height: 28px;
  padding: 0 18px;
  background: #0a1415;
  border-bottom: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mori-ink-muted);
}
.mori-sz-status__brand { color: var(--mori-accent-primary); }
.mori-sz-status__clock { margin-left: auto; font-variant-numeric: tabular-nums; }
.mori-sz-status__meta { color: var(--mori-ink-faint); }
.mori-sz-rail {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 110;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px;
  border-left: 1px solid var(--mori-accent-divider);
  background: rgba(16, 28, 29, .9);
}
.mori-sz-rail__item {
  display: grid;
  grid-template-columns: 22px 0;
  align-items: center;
  padding: 6px 3px;
  overflow: hidden;
  color: var(--mori-ink-muted);
  text-decoration: none;
  transition: grid-template-columns .25s ease, color .2s ease;
}
.mori-sz-rail__item:hover,
.mori-sz-rail__item.is-active { grid-template-columns: 22px 118px; color: var(--mori-accent-primary); }
.mori-sz-rail__idx { font-family: var(--mori-type-mono); font-size: 9px; text-align: center; }
.mori-sz-rail__label {
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .08em;
  white-space: nowrap;
}
.mori-sz-frame { position: fixed; inset: 8px; z-index: 105; pointer-events: none; }
.mori-sz-frame__corner {
  position: absolute;
  width: 20px;
  height: 20px;
  border: 0 solid var(--mori-accent-primary);
}
.mori-sz-frame__corner--tl { top: 0; left: 0; border-top-width: 1px; border-left-width: 1px; }
.mori-sz-frame__corner--tr { top: 0; right: 0; border-top-width: 1px; border-right-width: 1px; }
.mori-sz-frame__corner--bl { bottom: 0; left: 0; border-bottom-width: 1px; border-left-width: 1px; }
.mori-sz-frame__corner--br { bottom: 0; right: 0; border-bottom-width: 1px; border-right-width: 1px; }

body.theme-santiz .hp-desktop-header {
  height: auto;
  min-height: 64px;
  gap: 24px;
  padding: 0 30px;
  background: rgba(16, 28, 29, .96);
  border-bottom: 1px solid var(--mori-accent-divider);
}
body.theme-santiz .hp-desktop-header.mori-nav-ready .hp-desktop-nav { display: none; }
body.theme-santiz .hp-mobile-header { background: rgba(16, 28, 29, .96); border-bottom: 1px solid var(--mori-accent-divider); }
body.theme-santiz .hp-header-brand img { filter: invert(1) brightness(1.3) sepia(.3) hue-rotate(60deg); }
body.theme-santiz .mori-nav--santiz { display: flex; align-items: flex-end; gap: 24px; margin-left: auto; }
body.theme-santiz .mori-nav__sector { display: grid; gap: 3px; }
body.theme-santiz .mori-nav__sector-label {
  font-family: var(--mori-type-mono);
  font-size: 8px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mori-ink-faint);
}
body.theme-santiz .mori-nav__row { display: flex; gap: 2px; }
body.theme-santiz .mori-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid transparent;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .08em;
  text-decoration: none;
  transition: border-color .2s ease, background-color .2s ease;
}
body.theme-santiz .mori-nav__link:hover { border-color: var(--mori-accent-divider); background: rgba(181, 223, 160, .08); }
body.theme-santiz .mori-nav__link.is-active { background: var(--mori-accent-primary); color: #0b1a1a; }
body.theme-santiz .mori-nav__idx { font-size: 8px; opacity: .7; }
body.theme-santiz .mori-nav__link--locale { border-color: var(--mori-accent-divider); font-size: 9px; }

body.theme-santiz .mori-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0;
  border: 1px solid var(--mori-accent-card-border);
  border-left: 3px solid var(--mori-accent-primary);
  background: var(--mori-surface-content);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%);
}
body.theme-santiz .mori-slot__cap {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mori-accent-primary);
}
body.theme-santiz .mori-slot__cap h2,
body.theme-santiz .mori-slot__cap h3 { margin: 0; font: inherit; color: var(--mori-ink-base); }
body.theme-santiz .mori-slot__title { color: var(--mori-ink-base); }
body.theme-santiz .mori-slot__dots { flex: 1; height: 6px; background: repeating-linear-gradient(90deg, var(--mori-accent-primary) 0 1px, transparent 1px 9px); opacity: .35; }
body.theme-santiz .mori-slot__body { padding: 26px 28px 22px; }
body.theme-santiz .mori-slot__foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  border-top: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mori-ink-faint);
}
body.theme-santiz .mori-slot__rule { flex: 1; height: 1px; background: var(--mori-accent-divider); }
body.theme-santiz .hp-hero { padding: 24px 0 40px; border-bottom: 1px solid var(--mori-accent-divider); }
body.theme-santiz .hp-hero h1,
body.theme-santiz .ap-title,
body.theme-santiz .fp-hero-copy h1,
body.theme-santiz .qp-hero-copy h1,
body.theme-santiz .sp-hero-copy h1,
body.theme-santiz .dp-brand-copy h1 {
  font-family: var(--mori-type-display);
  font-size: var(--mori-type-hero);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.01em;
  color: var(--mori-ink-strong);
}
body.theme-santiz .hp-hero-description,
body.theme-santiz .fp-desktop-description {
  max-width: 54ch;
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--mori-ink-muted);
}
body.theme-santiz .hp-cta,
body.theme-santiz .fp-cta,
body.theme-santiz .qp-hero-copy > a {
  padding: 12px 22px;
  border: 1px solid var(--mori-accent-primary);
  border-radius: 0;
  background: var(--mori-accent-primary);
  color: #0b1a1a;
  font-family: var(--mori-type-mono);
  font-size: 11px;
  letter-spacing: .06em;
}
body.theme-santiz .hp-hero-panda { filter: grayscale(1) sepia(.3) hue-rotate(120deg) brightness(.8); opacity: .5; }
body.theme-santiz h2 {
  font-family: var(--mori-type-display);
  font-size: var(--mori-type-section);
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--mori-ink-strong);
}
body.theme-santiz .mori-section { margin: 26px 0 10px; }
body.theme-santiz .mori-section__bar { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
body.theme-santiz .mori-section__idx {
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .16em;
  color: var(--mori-accent-primary);
}
body.theme-santiz .mori-section__rule { flex: 1; height: 1px; background: var(--mori-accent-divider); }

.mori-sz-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0;
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 3px;
  background: var(--mori-surface-card);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
}
.mori-sz-panel__bar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .1em;
  color: var(--mori-accent-primary);
}
.mori-sz-panel__bar h2,
.mori-sz-panel__bar h3 {
  margin: 0;
  font: inherit;
  text-transform: uppercase;
  color: var(--mori-ink-base);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mori-sz-panel__body { display: grid; gap: 10px; padding: 16px 14px; flex: 1; }
.mori-sz-panel__body img { width: auto; height: 48px; object-fit: contain; filter: grayscale(1) brightness(1.5); }
.mori-sz-panel__body p,
.mori-sz-panel__body li {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--mori-ink-muted);
}
.mori-sz-panel__foot {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  border-top: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
  font-size: 8.5px;
  letter-spacing: .1em;
  color: var(--mori-ink-faint);
}
.mori-sz-panel__state { color: var(--mori-accent-primary); }
.mori-sz-panel__code { margin-left: auto; }

.mori-sz-strip {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 120px;
  gap: 14px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--mori-accent-divider);
}
.mori-sz-strip__idx { font-family: var(--mori-type-mono); font-size: 9px; color: var(--mori-accent-primary); }
.mori-sz-strip__body h3 { margin: 0 0 4px; font-family: var(--mori-type-mono); font-size: 11.5px; color: var(--mori-ink-strong); }
.mori-sz-strip__body p,
.mori-sz-strip__body li {
  margin: 0;
  font-size: 12px;
  line-height: 1.7;
  color: var(--mori-ink-muted);
}
.mori-sz-strip__gauge { height: 4px; background: var(--mori-accent-grid); }
.mori-sz-strip__gauge i { display: block; height: 100%; background: var(--mori-accent-primary); }

body.theme-santiz .mori-pair {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--mori-accent-divider);
}
body.theme-santiz .mori-pair__idx { font-family: var(--mori-type-mono); font-size: 8.5px; color: var(--mori-accent-primary); }
body.theme-santiz .mori-pair dt,
body.theme-santiz .mori-pair > span:not(.mori-pair__idx):not(.mori-pair__rule) {
  margin: 0;
  font-family: var(--mori-type-mono);
  font-size: 9.5px;
  letter-spacing: .06em;
  color: var(--mori-ink-muted);
}
body.theme-santiz .mori-pair dd,
body.theme-santiz .mori-pair > a,
body.theme-santiz .mori-pair > address {
  margin: 0;
  max-width: 62ch;
  justify-self: end;
  font-family: var(--mori-type-mono);
  font-size: 11.5px;
  text-align: right;
  font-style: normal;
  color: var(--mori-ink-strong);
}
body.theme-santiz .mori-pair__rule { display: none; }
body.theme-santiz .mori-band {
  padding: 28px 0;
  border-top: 1px solid var(--mori-accent-divider);
  background: linear-gradient(180deg, rgba(181, 223, 160, .05), transparent 70%);
}
body.theme-santiz .mori-band__bar {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mori-accent-primary);
}
body.theme-santiz .mori-band__ticks {
  flex: 1;
  height: 6px;
  background: repeating-linear-gradient(90deg, var(--mori-accent-primary) 0 1px, transparent 1px 9px);
  opacity: .35;
}
body.theme-santiz .mori-band__body { padding-top: 20px; }
body.theme-santiz .mori-band__body p,
body.theme-santiz .mori-band__body li {
  font-size: 12.5px;
  line-height: 1.75;
  color: var(--mori-ink-muted);
}
body.theme-santiz .hp-office-map img,
body.theme-santiz .hp-company-mark img { filter: grayscale(1) brightness(1.2) sepia(.3) hue-rotate(60deg); }
body.theme-santiz .hp-footer {
  border-top: 1px solid var(--mori-accent-divider);
  background: var(--mori-surface-footer);
  color: var(--mori-ink-muted);
}
body.theme-santiz .hp-footer h2 {
  font-family: var(--mori-type-mono);
  font-size: 9.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
}
body.theme-santiz .hp-footer a { color: var(--mori-ink-muted); }

/* ══════════════════════════════════════════════════════════════════════════
   cross-theme surfaces and the Santiz landing page art direction
   ══════════════════════════════════════════════════════════════════════ */
body.theme-hud .sp-page,
body.theme-youshen .sp-page,
body.theme-atelier .sp-page {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
}
body.theme-hud .sp-page [class*="sp-"],
body.theme-youshen .sp-page [class*="sp-"],
body.theme-atelier .sp-page [class*="sp-"] { background-color: transparent; }
body.theme-hud .sp-page h1,
body.theme-hud .sp-page h2,
body.theme-hud .sp-page h3,
body.theme-hud .sp-page p,
body.theme-hud .sp-page li,
body.theme-youshen .sp-page h1,
body.theme-youshen .sp-page h2,
body.theme-youshen .sp-page h3,
body.theme-youshen .sp-page p,
body.theme-youshen .sp-page li,
body.theme-atelier .sp-page h1,
body.theme-atelier .sp-page h2,
body.theme-atelier .sp-page h3,
body.theme-atelier .sp-page p,
body.theme-atelier .sp-page li { color: inherit; }

/* host caps the capability grid at 402px and pins cards to fixed cells; the
   themed lists are single-column and grow with their component shells */
body.theme-hud .sp-page .sp-capabilities,
body.theme-youshen .sp-page .sp-capabilities,
body.theme-atelier .sp-page .sp-capabilities { height: auto; padding: 0; }
body.theme-atelier .sp-page .sp-capabilities.mori-at-sand {
  padding: 44px clamp(20px, 8.33vw, 120px);
  background-color: #f1ece4;
}
body.theme-hud .sp-page .sp-capability-grid,
body.theme-youshen .sp-page .sp-capability-grid,
body.theme-atelier .sp-page .sp-capability-grid {
  display: grid;
  width: auto;
  height: auto;
  margin: 0;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
}
body.theme-hud .sp-page .sp-capability-grid { gap: 14px; }
body.theme-youshen .sp-page .sp-capability-grid { gap: 18px; }
body.theme-atelier .sp-page .sp-capability-grid { gap: 0; }
body.theme-hud .sp-page .sp-capability,
body.theme-youshen .sp-page .sp-capability,
body.theme-atelier .sp-page .sp-capability {
  grid-column: auto;
  grid-row: auto;
  order: 0;
  min-height: 0;
  padding: 0;
  color: inherit;
}
body.theme-hud .sp-page .sp-capability img,
body.theme-youshen .sp-page .sp-capability img,
body.theme-atelier .sp-page .sp-capability img {
  width: 54px;
  height: 54px;
}
body.theme-hud .sp-page .sp-capability img { filter: brightness(0) invert(1); opacity: .82; }
body.theme-youshen .sp-page .sp-capability img { filter: brightness(0) invert(.72) sepia(1) saturate(2.4) hue-rotate(357deg); }
body.theme-atelier .sp-page .sp-capability img { display: none; }
body.theme-hud .sp-page .sp-capability-pattern,
body.theme-hud .sp-page .sp-capability-ampersand,
body.theme-youshen .sp-page .sp-capability-pattern,
body.theme-youshen .sp-page .sp-capability-ampersand,
body.theme-atelier .sp-page .sp-capability-pattern,
body.theme-atelier .sp-page .sp-capability-ampersand { display: none; }
body.theme-hud .sp-page .sp-content,
body.theme-youshen .sp-page .sp-content,
body.theme-atelier .sp-page .sp-content { min-height: 0; }
body.theme-hud .sp-page .sp-content,
body.theme-youshen .sp-page .sp-content { padding: 0 0 30px; }
body.theme-hud .sp-page .sp-hero-panda,
body.theme-youshen .sp-page .sp-hero-panda { display: none !important; }
/* the hosting block is a dark server-room photograph with a mint mark; the
   shells render it as a text module instead */
body.theme-hud .sp-page .sp-hosting-media,
body.theme-youshen .sp-page .sp-hosting-media,
body.theme-atelier .sp-page .sp-hosting-media { display: none; }
body.theme-hud .sp-page .sp-hosting-section,
body.theme-youshen .sp-page .sp-hosting-section,
body.theme-atelier .sp-page .sp-hosting-section { min-height: 0; padding: 48px 0; }
body.theme-hud .sp-page .sp-hosting-copy,
body.theme-youshen .sp-page .sp-hosting-copy,
body.theme-atelier .sp-page .sp-hosting-copy {
  position: static;
  display: grid;
  width: min(1200px, calc(100% - 64px));
  max-width: none;
  margin: 0 auto;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 40px;
  align-items: center;
}
body.theme-hud .sp-page .sp-capability .mori-slot__body {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.theme-hud .sp-page .sp-hosting-copy > img { filter: brightness(0) invert(1); opacity: .7; }
body.theme-youshen .sp-page .sp-hosting-copy > img { filter: brightness(0) invert(.75) sepia(1) saturate(2.2) hue-rotate(357deg); }
body.theme-atelier .sp-page .sp-hosting-copy > img { filter: brightness(0) invert(1); opacity: .85; }
body.theme-hud .sp-page .sp-hero-copy,
body.theme-youshen .sp-page .sp-hero-copy,
body.theme-atelier .sp-page .sp-hero-copy { color: inherit; }
body.theme-hud .sp-page .sp-local-section,
body.theme-hud .sp-page .sp-hosting-section,
body.theme-hud .sp-page .sp-contact,
body.theme-youshen .sp-page .sp-local-section,
body.theme-youshen .sp-page .sp-hosting-section,
body.theme-youshen .sp-page .sp-contact { color: inherit; }
body.theme-hud .sp-page .sp-hosting-section p,
body.theme-youshen .sp-page .sp-hosting-section p { color: var(--mori-ink-muted); }
body.theme-hud .sp-page .sp-section-heading p,
body.theme-hud .sp-page .sp-market-copy > div > p,
body.theme-hud .sp-page .sp-local-capabilities ul,
body.theme-youshen .sp-page .sp-section-heading p,
body.theme-youshen .sp-page .sp-market-copy > div > p,
body.theme-youshen .sp-page .sp-local-capabilities ul { color: var(--mori-ink-muted); }
body.theme-hud .sp-page .sp-technical-picture,
body.theme-youshen .sp-page .sp-technical-picture { display: block; width: 100%; }
body.theme-hud .sp-page .sp-market-copy .sp-technical-picture,
body.theme-youshen .sp-page .sp-market-copy .sp-technical-picture { max-width: 349px; margin-inline: auto; }
body.theme-hud .sp-page .sp-technical-picture { border: 1px solid rgba(18, 168, 255, .16); }
body.theme-youshen .sp-page .sp-technical-picture { border: 1px solid rgba(201, 163, 90, .2); }
body.theme-atelier .sp-page section[class*="sp-"] .sp-technical-picture { border: 1px solid rgba(241, 236, 228, .14); }
body.theme-hud .sp-page .sp-highlight-list li,
body.theme-youshen .sp-page .sp-highlight-list li { color: var(--mori-ink-base); }
body.theme-hud .sp-page .sp-highlight-list,
body.theme-youshen .sp-page .sp-highlight-list { border-left-color: var(--mori-accent-primary); }
body.theme-hud .sp-page .sp-contact,
body.theme-youshen .sp-page .sp-contact { background-image: none; }
body.theme-hud .sp-page .sp-technical-picture img,
body.theme-youshen .sp-page .sp-technical-picture img { display: block; width: 100%; max-width: 100%; height: auto; }
body.theme-hud .sp-page .sp-pill,
body.theme-youshen .sp-page .sp-pill,
body.theme-atelier .sp-page .sp-pill {
  position: static;
  display: inline-grid;
  width: max-content;
  height: auto;
  min-width: 0;
  margin: 18px 0 0;
  padding: 12px 22px;
  place-items: center;
}
body.theme-atelier .sp-page .sp-hero {
  display: flex;
  height: auto;
  min-height: 0;
  align-items: flex-end;
  gap: 56px;
  overflow: visible;
  padding: 14px clamp(20px, 8.33vw, 120px) 0;
}
body.theme-atelier .sp-page .sp-hero .mori-at-cover { flex: 1 1 auto; min-width: 0; }
body.theme-atelier .sp-page .sp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}
body.theme-atelier .sp-page .sp-hero-panda {
  position: static;
  inset: auto;
  display: block !important;
  flex: 0 0 auto;
  width: 300px;
  max-width: 30vw;
  height: auto;
  margin: 0 0 18px;
}
body.theme-atelier .sp-page section.sp-market-section,
body.theme-atelier .sp-page section.sp-local-section,
body.theme-atelier .sp-page section.sp-trading-section,
body.theme-atelier .sp-page section.sp-hosting-section {
  min-height: 0;
  overflow: visible;
  background: #141414;
  color: #f1ece4;
}
body.theme-atelier .sp-page section.sp-market-section h2,
body.theme-atelier .sp-page section.sp-local-section h2,
body.theme-atelier .sp-page section.sp-trading-section h2,
body.theme-atelier .sp-page section.sp-hosting-section h2 { color: #f1ece4; }
body.theme-atelier .sp-page section.sp-market-section p,
body.theme-atelier .sp-page section.sp-local-section p,
body.theme-atelier .sp-page section.sp-trading-section p,
body.theme-atelier .sp-page section.sp-hosting-section p,
body.theme-atelier .sp-page section.sp-market-section li,
body.theme-atelier .sp-page section.sp-local-section li,
body.theme-atelier .sp-page section.sp-trading-section li,
body.theme-atelier .sp-page section.sp-hosting-section li { color: rgba(241, 236, 228, .64); }
body.theme-atelier .sp-page .sp-local-capabilities article { border-top-color: rgba(241, 236, 228, .22); }
body.theme-atelier .sp-page section.sp-contact {
  display: block;
  min-height: 0;
  padding: 56px clamp(20px, 8.33vw, 120px);
  background: var(--mori-ink-strong);
  background-image: none;
  color: #f1ece4;
  text-align: left;
}
body.theme-atelier .sp-page section.sp-contact h2 { color: #f1ece4; }
body.theme-atelier .sp-page section.sp-contact .sp-pill {
  margin: 24px 0 0;
  background: #f1ece4;
  color: #111111 !important;
}

body.theme-hud .sp-page .sp-pill {
  border: 0;
  border-radius: 0;
  background: var(--mori-accent-primary);
  color: #03101b !important;
  font-family: var(--mori-type-mono);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-youshen .sp-page .sp-pill {
  border: 1px solid var(--mori-accent-primary);
  background: transparent;
  color: var(--mori-accent-primary) !important;
  font-family: var(--mori-type-serif);
}
body.theme-atelier .sp-page .sp-pill {
  border: 0;
  border-radius: 0;
  background: var(--mori-ink-strong);
  color: #ffffff !important;
  font-family: var(--mori-type-sans);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

body.theme-santiz .dp-top { background-color: var(--mori-surface-page); }
body.theme-santiz .sp-page { background: #000; color: #f5f5f5; }
body.theme-santiz .sp-page .sp-hero { background: #153034; }
body.theme-santiz .sp-page .sp-capabilities { background: #0c1c07; }
body.theme-santiz .sp-page .sp-trading-section { background: #000; }
body.theme-santiz .sp-page .sp-local-section { color: #bdecf2; background: #153034; }
body.theme-santiz .sp-page .sp-hosting-section { color: #b5dfa0; background: #081500; }
body.theme-santiz .sp-page .sp-contact { color: #bdecf2; background-color: #153034; }
body.theme-santiz .sp-page .sp-capability-hosting { color: #ffffff; background: #354630; }
body.theme-santiz .sp-page .sp-capability-trading { color: #c5f2ae; background: #17360d; }
body.theme-santiz .sp-page .sp-capability-market { color: #0b1a1a; background: #b5dfa0; }
body.theme-santiz .sp-page h1,
body.theme-santiz .sp-page h2,
body.theme-santiz .sp-page h3,
body.theme-santiz .sp-page p,
body.theme-santiz .sp-page li,
body.theme-santiz .sp-page span { color: inherit; }
body.theme-santiz .sp-page .hp-desktop-header {
  background: transparent;
  border-color: rgba(255, 255, 255, .16);
  backdrop-filter: none;
}
body.theme-santiz .sp-page .mori-nav__link { color: #eef7f7; }
body.theme-santiz .sp-page .sp-pill { border: 0; border-radius: 0; background: var(--mori-accent-primary); color: #0b1010 !important; }

/* ══════════════════════════════════════════════════════════════════════════
   responsive
   ══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .mori-hud-rail { width: 176px; }
  body.theme-hud .mori-deck { left: 200px; }
  .mori-ys-overlay .mori-ys-sheet { grid-template-columns: 300px minmax(0, 1fr); gap: 30px; padding: 36px; }
  .mori-ys-disk,
  .mori-ys-dirs { width: 300px; height: 300px; }
  .mori-at-inner { padding: 0 22px; }
  .mori-at-sector-btn { padding: 0 12px; font-size: 12.5px; }
}

@media (max-width: 900px) {
  .mori-hud-status { display: none; }
  .mori-hud-sector-name { display: none; }
  body.theme-hud .mori-deck {
    left: 12px;
    right: 12px;
    top: 72px;
    bottom: 46px;
    padding: 14px 14px 30px;
  }
  .mori-hud-topbar { left: 12px; right: 12px; top: 12px; height: 46px; gap: 10px; }
  .mori-hud-menu { display: grid; }
  .mori-hud-rail {
    left: 12px;
    right: 12px;
    top: 68px;
    bottom: auto;
    width: auto;
    max-height: 66vh;
    display: none;
    z-index: 90;
  }
  body.mori-rail-open .mori-hud-rail { display: flex; }
  .mori-hud-flyout { left: 24px; right: 24px; width: auto; top: 130px !important; }
  .mori-hud-coord { height: 30px; font-size: 8px; padding: 0 14px; }
  .mori-hud-coord__led { display: none; }
  .mori-hud-armor__corner { width: 30px; height: 30px; }

  .mori-ys-overlay .mori-ys-sheet {
    grid-template-columns: 1fr;
    grid-template-areas: "disk" "panel";
    gap: 26px;
    padding: 30px 22px 34px;
    width: min(520px, 94vw);
  }
  .mori-ys-disk,
  .mori-ys-dirs { width: 280px; height: 280px; margin: 0 auto; }
  .mori-ys-sheet-panel { padding-left: 0; border-left: 0; border-top: 1px solid rgba(201, 163, 90, .24); padding-top: 20px; }

  .mori-at-sectors { display: none; }
  .mori-at-menu { display: grid; }
  .mori-at-actions .mori-at-action { display: none; }
  .mori-at-inner { padding: 0 20px; }
  body.theme-atelier { padding-top: 58px; }
  .mori-at-bar { height: 58px; }
  body.theme-atelier .mori-at-cover__body h1 { font-size: 38px; }
  body.theme-atelier .mori-at-list { grid-template-columns: 48px minmax(0, 1fr); gap: 16px; }
  body.theme-atelier .mori-at-list__no { font-size: 38px; }
  body.theme-atelier .mori-at-cover__body p { font-size: 16px; }

  .mori-sz-rail { display: none; }
}

@media (max-width: 760px) {
  .mori-hud-clock { display: none; }
  .mori-hud-tools { padding-left: 8px; }
  .mori-hud-ship__name { max-width: 16ch; }
  body.theme-hud .mori-readout {
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-areas: "idx measure" "idx main";
    align-items: start;
    row-gap: 6px;
  }
  body.theme-hud .mori-readout__measure { padding-right: 0; border-right: 0; }
  body.theme-hud .mori-readout__meter { display: none; }
  body.theme-hud .mori-pair { grid-template-columns: 28px minmax(0, 1fr); }
  body.theme-hud .mori-pair dd,
  body.theme-hud .mori-pair > a,
  body.theme-hud .mori-pair > address { grid-column: 2; justify-self: start; text-align: left; }

  .mori-ys-overlay .mori-ys-sheet { padding: 26px 18px 30px; }
  .mori-ys-disk,
  .mori-ys-dirs { width: 250px; height: 250px; }
  .mori-ys-dir { width: 62px; height: 62px; }
  .mori-ys-dir--center { width: 78px; height: 78px; }
  .mori-ys-dir__glyph { font-size: 20px; }
  .mori-ys-close { top: 10px; right: 10px; }

  body.theme-atelier .mori-at-figure__frame { padding: 18px; }
  body.theme-atelier .mori-at-sand { padding: 32px clamp(20px, 8.33vw, 120px); }
  body.theme-atelier .mori-at-sand .fp-licensing-inner { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  body.theme-atelier .fp-feature .mori-at-list__text { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body.theme-atelier .fp-feature .fp-feature-art {
    order: 0;
    width: 100%;
    max-width: 260px;
    justify-self: start;
  }
  body.theme-atelier .fp-feature .fp-feature-art img { max-height: 220px; }
  body.theme-atelier .mori-at-sand__body h2,
  body.theme-atelier .mori-at-sand__body h3 { font-size: 26px; }
  body.theme-atelier .mori-at-essay { grid-template-columns: 24px minmax(0, 1fr); gap: 12px; }
  body.theme-atelier .mori-at-line { grid-template-columns: 30px minmax(0, 1fr); }
  body.theme-atelier .mori-at-line__leader { display: none; }

  body.theme-hud .sp-page .sp-hosting-copy,
  body.theme-youshen .sp-page .sp-hosting-copy,
  body.theme-atelier .sp-page .sp-hosting-copy {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  body.theme-hud .sp-page .sp-hosting-copy > img,
  body.theme-youshen .sp-page .sp-hosting-copy > img,
  body.theme-atelier .sp-page .sp-hosting-copy > img { width: 72px; height: auto; }
  body.theme-atelier .sp-page .sp-local-capabilities { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}

@media (max-width: 719px) {
  /* The eight-pill switcher is too wide for a phone: collapse it into one
     "THEME" capsule that opens the pills upward on tap, so the fixed bar
     stops covering legal/copy text (audit P1-1). */
  .mori-theme-switch__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 64px;
    padding: 0 16px;
    font-size: 11px;
    letter-spacing: .1em;
  }
  .mori-theme-switch:not(.is-open) > button:not(.mori-theme-switch__toggle) {
    display: none;
  }
  .mori-theme-switch.is-open {
    flex-wrap: wrap;
    max-width: calc(100vw - 32px);
  }
}

@media (max-width: 560px) {
  /* eight theme pills overflow a phone width: wrap them and keep the
     support launcher icon-sized so the two never collide in the corner. */
  .mori-theme-switch {
    left: 10px;
    bottom: 10px;
    max-width: calc(100vw - 86px);
    flex-wrap: wrap;
    padding: 3px;
  }
  .mori-theme-switch button:not(.mori-theme-switch__toggle) { padding: 6px 7px; font-size: 9px; letter-spacing: .02em; }
  .support-launcher { width: 46px; min-width: 46px; height: 46px; padding: 0; }
  .support-launcher > span { display: none; }
  body.mori-shell-hud .mori-theme-switch { right: 28px; bottom: 100px; }
  body.mori-shell-youshen .mori-theme-switch { bottom: 82px; }

  .mori-ys-dock { bottom: 18px; }
  .mori-ys-button { width: 52px; height: 52px; }
  .mori-ys-disk,
  .mori-ys-dirs { width: 220px; height: 220px; }
  .mori-ys-dir { width: 56px; height: 56px; }
  .mori-ys-dir--center { width: 70px; height: 70px; }
  .mori-ys-dir__label { font-size: 8px; }
  .mori-ys-sheet-panel__glyph { font-size: 28px; }
  .mori-ys-link { font-size: 15px; }

  body.theme-atelier .mori-at-cover__body h1 { font-size: 32px; }
  body.theme-atelier .mori-at-list { grid-template-columns: 38px minmax(0, 1fr); gap: 12px; padding: 20px 0; }
  body.theme-atelier .mori-at-list__no { font-size: 30px; }
  body.theme-atelier .mori-at-list__body h3 { font-size: 20px; }
  body.theme-atelier .mori-at-sand__body p,
  body.theme-atelier .mori-at-essay__col p { font-size: 15px; }
  body.theme-atelier .mori-section h2 { font-size: 30px; }

  body.theme-hud .mori-slot__body { padding: 14px; }
  body.theme-hud .mori-hud-tools .mori-hud-tool { padding: 4px 5px; font-size: 8px; }
  body.theme-hud .mori-hud-sigil { display: none; }
  body.theme-hud .mori-hud-ship__name { max-width: 11ch; font-size: 10px; }
}

/* replica mobile header rules for the santiz header nav */
body.mori .hp-mobile-header .mori-nav-mobile {
  order: 3;
  display: flex;
  gap: 14px;
  width: 100%;
  overflow-x: auto;
  padding: 8px 0 6px;
  border-top: 1px solid var(--mori-accent-divider);
}
body.mori .mori-nav-mobile__link {
  flex: 0 0 auto;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
  text-decoration: none;
}
body.mori .mori-nav-mobile__link .mori-nav__idx { margin-right: 5px; color: var(--mori-accent-primary); }

/* ══════════════════════════════════════════════════════════════════════════
   CLARITY — app shell. Fixed 80px masthead, floating frosted icon rail with a
   flyout, the page body inside a 1200px round white panel with a sticky panel
   head and legal strip, hairline data tables, borderless summary dividers.
   ══════════════════════════════════════════════════════════════════════ */
body.theme-clarity {
  --cl-hair: var(--mori-accent-divider);
  --cl-soft: var(--mori-accent-card-border);
  --cl-fill: var(--mori-accent-grid);
  --cl-accent: var(--mori-accent-primary);
  --cl-accent-strong: var(--mori-accent-highlight);
  --cl-accent-soft: #f2eefc;
  --cl-accent-border: #ddd4f4;
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  font-size: 14px;
  line-height: 1.43;
  -webkit-font-smoothing: antialiased;
}
body.theme-clarity .hp-page,
body.theme-clarity .ap-page,
body.theme-clarity .fp-page,
body.theme-clarity .sp-page,
body.theme-clarity .qp-page,
body.theme-clarity .dp-page {
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
}
body.theme-clarity main {
  background: transparent;
  overflow: visible;
}
body.theme-clarity .support-launcher { bottom: 24px; right: 24px; }
body.theme-clarity .mori-theme-switch { left: auto; right: 24px; bottom: 48px; }

/* masthead */
.mori-cl-masthead {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 70;
  height: 80px;
  background: rgba(255, 255, 255, .88);
  border-bottom: 1px solid var(--cl-hair);
  backdrop-filter: blur(20px);
}
.mori-cl-masthead__inner {
  display: flex;
  align-items: center;
  gap: 18px;
  width: min(1200px, calc(100% - 48px));
  height: 100%;
  margin: 0 auto;
}
.mori-cl-brand {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  color: var(--mori-ink-strong);
  text-decoration: none;
}
.mori-cl-brand__mark { font: 600 18px/1 var(--mori-type-sans); letter-spacing: .12em; }
.mori-cl-brand__sub { font: 500 10px/1 var(--mori-type-sans); letter-spacing: .2em; color: var(--mori-ink-muted); }
.mori-cl-crumb { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--mori-ink-muted); }
.mori-cl-crumb__sep { color: var(--mori-ink-faint); }
.mori-cl-crumb__scene { color: var(--mori-ink-base); font-weight: 500; }
.mori-cl-actions { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.mori-cl-locale {
  display: inline-grid;
  height: 32px;
  padding: 0 10px;
  place-items: center;
  border-radius: var(--mori-radius-sm);
  color: var(--mori-ink-muted);
  font-size: 12px;
  text-decoration: none;
}
.mori-cl-locale:hover { background: var(--cl-fill); color: var(--mori-ink-base); }
.mori-cl-locale.is-active { background: var(--cl-fill); color: var(--mori-ink-base); font-weight: 600; }
.mori-cl-dot {
  display: inline-grid;
  width: 40px;
  height: 40px;
  margin-left: 6px;
  place-items: center;
  border-radius: 999px;
  background: var(--mori-ink-strong);
  color: #ffffff;
  font: 600 15px/1 var(--mori-type-sans);
}
.mori-cl-menu {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--cl-hair);
  border-radius: var(--mori-radius-md);
  background: transparent;
  cursor: pointer;
}
.mori-cl-menu__bar,
.mori-cl-menu__bar::before,
.mori-cl-menu__bar::after {
  display: block;
  width: 16px;
  height: 1px;
  margin: 0 auto;
  background: var(--mori-ink-base);
  content: "";
}
.mori-cl-menu__bar { position: relative; }
.mori-cl-menu__bar::before { position: absolute; top: -5px; left: 0; }
.mori-cl-menu__bar::after { position: absolute; top: 5px; left: 0; }

/* rail (the left toolbar) */
.mori-cl-rail {
  position: fixed;
  top: 50%;
  left: 8px;
  z-index: 60;
  display: flex;
  width: 72px;
  max-height: calc(100vh - 140px);
  flex-direction: column;
  gap: 4px;
  padding: 8px;
  border: 1px solid rgba(219, 221, 225, .9);
  border-radius: 24px;
  background: rgba(238, 238, 238, .8);
  backdrop-filter: blur(24px);
  transform: translateY(-50%);
  overflow: hidden;
  transition: width .2s ease-out;
}
.mori-cl-rail:hover,
.mori-cl-rail:focus-within { width: 183px; }
.mori-cl-sector {
  display: flex;
  width: 56px;
  min-height: 44px;
  align-items: center;
  gap: 12px;
  padding: 0 10px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--mori-ink-muted);
  font: 500 16px/1 var(--mori-type-sans);
  text-align: left;
  cursor: pointer;
  transition: background .15s ease-out, color .15s ease-out;
}
.mori-cl-sector:hover { background: rgba(255, 255, 255, .7); color: var(--mori-ink-base); }
.mori-cl-sector.is-here { background: var(--mori-ink-strong); color: #ffffff; }
.mori-cl-sector.is-open { background: var(--mori-ink-strong); color: #ffffff; }
.mori-cl-sector__icon { display: grid; flex: 0 0 20px; width: 20px; height: 20px; place-items: center; }
.mori-icon {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.mori-cl-sector__label {
  width: 0;
  overflow: hidden;
  white-space: nowrap;
  opacity: 0;
  transition: opacity .15s ease-out;
}
.mori-cl-rail:hover .mori-cl-sector,
.mori-cl-rail:focus-within .mori-cl-sector { width: 167px; }
.mori-cl-rail:hover .mori-cl-sector__label,
.mori-cl-rail:focus-within .mori-cl-sector__label { width: auto; opacity: 1; }
.mori-cl-sector__count {
  margin-left: auto;
  color: var(--mori-ink-faint);
  font: 500 11px/1 var(--mori-type-mono);
  opacity: 0;
}
.mori-cl-rail:hover .mori-cl-sector__count,
.mori-cl-rail:focus-within .mori-cl-sector__count { opacity: 1; }
.mori-cl-sector.is-here .mori-cl-sector__count { color: rgba(255, 255, 255, .6); }

/* flyout */
.mori-cl-flyout {
  position: fixed;
  left: 92px;
  z-index: 65;
  width: 240px;
  padding: 20px 20px 20px 16px;
  border: 1px solid var(--cl-hair);
  border-radius: 30px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 12px 40px rgba(7, 10, 19, .12);
  backdrop-filter: blur(24px);
  opacity: 0;
  visibility: hidden;
  transform: translateX(-6px);
  transition: opacity .15s ease-out, transform .15s ease-out, visibility .15s;
}
.mori-cl-flyout.is-open { opacity: 1; visibility: visible; transform: none; }
.mori-cl-flyout__head { display: flex; align-items: baseline; justify-content: space-between; padding: 0 8px 12px; }
.mori-cl-flyout__label { font: 600 14px/20px var(--mori-type-sans); color: var(--mori-ink-strong); }
.mori-cl-flyout__count { font: 500 11px/1 var(--mori-type-mono); color: var(--mori-ink-faint); }
.mori-cl-flyout__group { display: grid; gap: 6px; }
.mori-cl-flyout__heading {
  padding: 6px 8px 0;
  color: var(--mori-ink-faint);
  font-size: 11px;
  letter-spacing: .06em;
}
.mori-cl-flyout__link {
  display: flex;
  min-height: 40px;
  align-items: center;
  padding: 0 10px;
  border-radius: 10px;
  color: var(--mori-ink-base);
  font-size: 14px;
  text-decoration: none;
}
.mori-cl-flyout__link:hover { background: var(--cl-fill); }
.mori-cl-flyout__link.is-active { background: var(--cl-fill); font-weight: 600; }

/* panel */
body.theme-clarity main.mori-cl-panel {
  position: relative;
  width: min(1200px, calc(100% - 208px));
  min-height: calc(100vh - 128px);
  margin: 104px auto 24px;
  padding: 0;
  border: 1px solid var(--cl-hair);
  border-radius: var(--mori-radius-2xl);
  background: var(--mori-surface-content);
  overflow: visible;
}
body.theme-clarity .mori-cl-head {
  position: sticky;
  top: 80px;
  z-index: 30;
  padding: 24px 20px 18px;
  border-bottom: 1px solid var(--cl-hair);
  border-radius: var(--mori-radius-2xl) var(--mori-radius-2xl) 0 0;
  background: var(--mori-surface-content);
}
.mori-cl-head__top { display: flex; align-items: center; gap: 12px; font-size: 11px; letter-spacing: .08em; color: var(--mori-ink-faint); }
.mori-cl-head__rule { flex: 1; height: 1px; background: var(--cl-hair); }
.mori-cl-head__body h1,
.mori-cl-head__body h2 {
  margin: 16px 0 0;
  font: 700 24px/32px var(--mori-type-sans);
  letter-spacing: 0;
  color: var(--mori-ink-strong);
}
.mori-cl-head__body > p:first-of-type,
.mori-cl-head__body p { margin-top: 8px; max-width: 62ch; color: var(--mori-ink-muted); font-size: 14px; line-height: 20px; }
.mori-cl-head__body img { max-width: 100%; height: auto; }
.mori-cl-head__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.mori-cl-head__tag {
  display: inline-grid;
  min-height: 22px;
  padding: 0 10px;
  place-items: center;
  border: 1px solid var(--cl-hair);
  border-radius: var(--mori-radius-sm);
  color: var(--mori-ink-muted);
  font-size: 11px;
  letter-spacing: .04em;
}
body.theme-clarity .mori-cl-legal {
  position: sticky;
  bottom: 0;
  z-index: 30;
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-top: 1px solid var(--cl-hair);
  border-radius: 0 0 var(--mori-radius-2xl) var(--mori-radius-2xl);
  background: var(--mori-surface-content);
  color: var(--mori-ink-faint);
  font-size: 11px;
  letter-spacing: .04em;
}
.mori-cl-legal__meta { font-family: var(--mori-type-mono); }

body.theme-clarity .hp-cta {
  position: static;
  display: inline-grid;
  min-width: 0;
  height: 36px;
  margin-top: 16px;
  padding: 0 16px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: var(--mori-radius-sm);
  background: var(--cl-accent);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
body.theme-clarity .hp-cta:hover { background: var(--cl-accent-strong); color: #fff; }
body.theme-clarity .floating-directory,
body.theme-xiuxian .floating-directory { display: none; }
body.theme-clarity .hp-hero { display: none; }
body.theme-clarity .hp-licence > img,
body.theme-clarity .hp-office-map { display: none; }
body.theme-clarity .hp-licence { overflow: visible; }
body.theme-clarity .hp-company {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  place-content: initial;
  justify-items: initial;
}
body.theme-clarity .hp-company-mark { display: block; width: 56px; height: 56px; }
body.theme-clarity .hp-company-mark img { position: static; width: 56px; height: 56px; object-fit: contain; }
body.theme-clarity .hp-latency .hp-desktop-only { display: block !important; }
body.theme-clarity .hp-latency .hp-mobile-only { display: none !important; }
body.theme-clarity .hp-company-copy { width: auto; margin-top: 0; }
body.theme-clarity .hp-company-copy > p:first-child { color: var(--mori-ink-faint); font-size: 11px; letter-spacing: .06em; }
body.theme-clarity .hp-office h2 { margin: 0; font-size: 20px; line-height: 25px; }
body.theme-clarity .hp-section-heading { padding: 0; }
body.theme-clarity .hp-section-heading > p { margin: 0 0 6px; color: var(--mori-ink-faint); font-size: 11px; letter-spacing: .06em; text-align: left; }
body.theme-clarity .hp-section-description { margin-top: 8px; color: var(--mori-ink-muted); font-size: 12px; line-height: 18px; text-align: left; }
body.theme-clarity .mori-cl-head__body h1 { margin-top: 4px; }
body.theme-clarity .mori-cl-head__body > p:first-child { margin-top: 0; color: var(--mori-ink-faint); font-size: 11px; letter-spacing: .06em; }
body.theme-clarity .dp-page { min-width: 0; }
body.theme-clarity .dp-top { display: block; background: none; animation: none; }
body.theme-clarity .dp-app-icon { display: none; }
body.theme-clarity .dp-brand-copy { display: block; }
body.theme-clarity .dp-panel { display: block; min-height: 0; }
body.theme-clarity .dp-download { display: block; width: auto; margin: 0; padding: 0; }
body.theme-clarity .dp-download-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; }
body.theme-clarity .dp-download-column.mori-cl-card { display: block; padding: 0; overflow: hidden; }
body.theme-clarity .mori-cl-row--link .mori-cl-row__body > span { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
body.theme-clarity .mori-cl-row--link img { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
body.theme-clarity .hp-address { grid-column: 1 / -1; }
body.theme-clarity .hp-contact > .mori-cl-card { display: grid; gap: 4px; align-content: start; }
body.theme-clarity .hp-contact > .mori-cl-card > .mori-cl-card__body { display: grid; gap: 4px; }
body.theme-clarity .ap-brand-line { display: block; color: var(--mori-ink-faint); font-size: 11px; font-weight: 400; letter-spacing: .06em; }
body.theme-clarity .ap-headline { display: block; margin-top: 4px; }
body.theme-clarity .ap-intro { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; font-size: 13px; line-height: 20px; }
body.theme-clarity .ap-intro p { font-weight: 400; line-height: 20px; }
body.theme-clarity .ap-intro ul { margin-top: 12px; font-size: 12px; line-height: 18px; color: var(--mori-ink-muted); }
body.theme-clarity .ap-focus { gap: 12px; margin: 0; }
body.theme-clarity .ap-focus-label { color: var(--mori-ink-strong); font-size: 14px; line-height: 20px; font-weight: 600; }
body.theme-clarity .ap-focus-art { width: 100%; height: auto; aspect-ratio: auto; overflow: visible; }
body.theme-clarity .ap-product-title { gap: 8px; }
body.theme-clarity .ap-product-brand { gap: 6px; font-size: 13px; line-height: 18px; font-weight: 500; }
body.theme-clarity .ap-product-icon img { width: 20px; height: 20px; }
body.theme-clarity .ap-product-headline { color: var(--mori-ink-strong); font-size: 16px; line-height: 24px; font-weight: 600; }
body.theme-clarity .ap-blocks { color: var(--mori-ink-muted); font-size: 12px; line-height: 18px; }
body.theme-clarity .ap-blocks h3,
body.theme-clarity .ap-blocks h4 { margin-top: 16px; color: var(--mori-ink-base); font-size: 13px; line-height: 20px; }
body.theme-clarity .ap-blocks ul { font-size: 12px; line-height: 18px; }
body.theme-clarity .ap-products { gap: 12px; }
body.theme-clarity .ap-office { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
body.theme-clarity .ap-contact-field { display: grid; gap: 4px; }
body.theme-clarity .ap-contact-field span { color: var(--mori-ink-muted); font-size: 11px; }
body.theme-clarity .ap-contact-field a,
body.theme-clarity .ap-contact-field address { color: var(--mori-ink-base); font-size: 13px; line-height: 20px; }
body.theme-clarity .hp-licence-copy > p:first-child { margin: 0 0 6px; color: var(--mori-ink-faint); font-size: 11px; letter-spacing: .06em; }
body.theme-clarity .hp-licence-copy { margin: 0; }

/* host page normalisation */
body.theme-clarity .hp-hero,
body.theme-clarity .ap-hero,
body.theme-clarity .fp-hero,
body.theme-clarity .sp-hero,
body.theme-clarity .qp-hero {
  height: auto;
  min-height: 0;
  padding: 0;
  overflow: visible;
  background: transparent;
}
body.theme-clarity .hp-hero-grid,
body.theme-clarity .hp-hero-panda,
body.theme-clarity .fp-hero-panda,
body.theme-clarity .sp-hero-panda,
body.theme-clarity .qp-hero-panda,
body.theme-clarity .sp-hero-pill { display: none !important; }
body.theme-clarity .hp-hero-copy,
body.theme-clarity .fp-hero-copy,
body.theme-clarity .sp-hero-copy,
body.theme-clarity .qp-hero-copy {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  max-width: none;
}
body.theme-clarity .hp-retail,
body.theme-clarity .hp-latency,
body.theme-clarity .hp-company,
body.theme-clarity .hp-licence,
body.theme-clarity .hp-office,
body.theme-clarity .ap-products-section,
body.theme-clarity .ap-technical-section,
body.theme-clarity .ap-office-section,
body.theme-clarity .fp-features-section,
body.theme-clarity .fp-licensing,
body.theme-clarity .sp-local-section,
body.theme-clarity .sp-trading-section,
body.theme-clarity .sp-hosting-section,
body.theme-clarity .sp-contact,
body.theme-clarity .qp-manifesto {
  min-height: 0;
  height: auto;
  margin: 0 0 48px;
  padding: 0;
  overflow: visible;
  background: transparent;
  color: var(--mori-ink-base);
}
body.theme-clarity .hp-company {
  text-align: left;
}
body.theme-clarity .hp-licence {
  display: block;
}
body.theme-clarity .hp-office {
  padding: 0 0 24px;
  background: transparent;
}
body.theme-clarity .fp-licensing { border: 0; }
body.theme-clarity .fp-features-section { background: transparent; }
body.theme-clarity .fp-hero,
body.theme-clarity .qp-hero { background: transparent !important; }
body.theme-clarity .qp-manifesto { color: var(--mori-ink-base); background: var(--cl-fill); padding: 24px 20px; }
body.theme-clarity .qp-manifesto img { display: none; }
body.theme-clarity .qp-manifesto h2 { font-size: 16px; line-height: 24px; font-weight: 600; }

/* section head */
body.theme-clarity .mori-cl-section {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 20px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--cl-soft);
}
body.theme-clarity .mori-cl-section h2 {
  margin: 0;
  font: 600 20px/25px var(--mori-type-sans);
  color: var(--mori-ink-strong);
  position: static;
  left: auto;
  width: auto;
  transform: none;
  white-space: normal;
}
body.theme-clarity .mori-cl-section__rule { width: 32px; height: 1px; background: var(--cl-hair); }
body.theme-clarity .hp-section-heading { text-align: left; }
body.theme-clarity .hp-section-heading h2 { margin: 0; font: 600 20px/25px var(--mori-type-sans); }

/* card grid */
body.theme-clarity .hp-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
}
body.theme-clarity .mori-cl-card {
  min-width: 0;
  min-height: 0;
  padding: 16px;
  border: 1px solid var(--cl-soft);
  border-radius: var(--mori-radius-card);
  background: var(--mori-surface-content);
  text-align: left;
}
body.theme-clarity .mori-cl-card h2,
body.theme-clarity .mori-cl-card h3 {
  margin: 0;
  font: 600 16px/24px var(--mori-type-sans);
  color: var(--mori-ink-strong);
}
body.theme-clarity .mori-cl-card p,
body.theme-clarity .mori-cl-card li {
  margin-top: 6px;
  color: var(--mori-ink-muted);
  font-size: 12px;
  line-height: 16px;
}
body.theme-clarity .mori-cl-card img { width: 28px; height: 28px; object-fit: contain; margin: 0; }
body.theme-clarity .hp-service img { width: 28px; height: 28px; margin: 0; }
body.theme-clarity .hp-service h3 { margin-top: 12px; font-size: 16px; font-weight: 600; }
body.theme-clarity .hp-service p { margin-top: 6px; color: var(--mori-ink-muted); font-size: 12px; line-height: 16px; }
body.theme-clarity .ap-focus { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; }
body.theme-clarity .ap-focus li { display: block; padding: 16px; border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); background: var(--mori-surface-content); }
body.theme-clarity .ap-focus li::before { display: none; }
body.theme-clarity .ap-focus-image { position: static; display: block; width: 40px; height: 40px; margin-bottom: 12px; }
body.theme-clarity .ap-product { min-height: 0; padding: 16px; border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); background: var(--mori-surface-content); }
body.theme-clarity .fp-feature { width: auto; padding: 16px; border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); background: var(--mori-surface-content); }
body.theme-clarity .qp-service { padding: 16px; border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); background: var(--mori-surface-content); }
body.theme-clarity .qp-manifesto { border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); }

/* summary divider grid */
body.theme-clarity .hp-latency-body { display: block; margin: 0; }
body.theme-clarity .hp-latency-copy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
}
body.theme-clarity .mori-cl-stat {
  min-width: 0;
  padding: 16px 20px;
  border-left: 1px solid var(--cl-soft);
}
body.theme-clarity .mori-cl-stat:first-child { border-left: 0; padding-left: 0; }
body.theme-clarity .mori-cl-stat h3 { margin: 0; color: var(--mori-ink-muted); font-size: 12px; line-height: 16px; font-weight: 500; }
body.theme-clarity .mori-cl-stat p { margin-top: 4px; color: var(--mori-ink-muted); font-size: 12px; line-height: 16px; }
body.theme-clarity .mori-cl-stat .hp-mobile-only { display: none; }
body.theme-clarity .hp-latency-chart { display: none; }

/* data table */
body.theme-clarity .hp-licence dl {
  display: block;
  margin: 0;
  border: 1px solid var(--cl-soft);
  border-radius: var(--mori-radius-card);
  background: var(--mori-surface-content);
  overflow: hidden;
}
body.theme-clarity .mori-cl-row {
  display: flex;
  min-height: 50px;
  align-items: center;
  gap: 16px;
  padding: 0 12px;
  border-bottom: 1px solid var(--cl-soft);
  background: transparent;
}
body.theme-clarity .mori-cl-row:last-child { border-bottom: 0; }
body.theme-clarity .mori-cl-row__body { display: flex; width: 100%; min-width: 0; align-items: center; gap: 16px; }
body.theme-clarity .hp-licence .mori-cl-row__body { display: grid; grid-template-columns: minmax(0, 42%) minmax(0, 1fr); }
body.theme-clarity .mori-cl-row dt { flex: 0 0 40%; color: var(--mori-ink-muted); font-size: 12px; line-height: 16px; font-weight: 500; }
body.theme-clarity .mori-cl-row dd {
  justify-content: flex-end;
  margin: 0;
  color: var(--mori-ink-base);
  font-size: 14px;
  line-height: 20px;
  font-variant-numeric: tabular-nums;
}
body.theme-clarity .hp-licence .mori-cl-row dd { justify-self: end; text-align: right; }
body.theme-clarity .mori-cl-row--link {
  display: flex;
  min-height: 48px;
  padding: 0 12px;
  color: var(--mori-ink-base);
  text-decoration: none;
}
body.theme-clarity .mori-cl-row--link .mori-cl-row__body { align-items: center; gap: 10px; }
body.theme-clarity .mori-cl-row--link strong { font-size: 14px; font-weight: 500; }
body.theme-clarity .mori-cl-row--link small { margin-left: auto; color: var(--mori-ink-muted); font-size: 11px; }
body.theme-clarity .dp-download-column { display: grid; gap: 0; padding: 0; border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); background: var(--mori-surface-content); overflow: hidden; }
body.theme-clarity .dp-download-column .mori-cl-row--link { border-bottom: 1px solid var(--cl-soft); border-radius: 0; }
body.theme-clarity .dp-download-column .mori-cl-row--link:last-child { border-bottom: 0; }
body.theme-clarity .hp-contact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: auto; margin: 24px 0 0; padding: 0; }
body.theme-clarity .hp-contact span { color: var(--mori-ink-muted); font-size: 12px; }
body.theme-clarity .hp-contact a,
body.theme-clarity .hp-contact address { color: var(--mori-ink-base); font-size: 14px; line-height: 20px; font-style: normal; }

/* typography */
body.theme-clarity h1,
body.theme-clarity h2,
body.theme-clarity h3,
body.theme-clarity h4 {
  font-family: var(--mori-type-sans);
  letter-spacing: 0;
  text-transform: none;
  color: var(--mori-ink-strong);
}
body.theme-clarity h1 { font-size: 24px; line-height: 32px; font-weight: 700; }
body.theme-clarity h2 { font-size: 20px; line-height: 25px; font-weight: 600; }
body.theme-clarity h3 { font-size: 16px; line-height: 24px; font-weight: 600; }
body.theme-clarity p,
body.theme-clarity li,
body.theme-clarity dd,
body.theme-clarity dt { font-family: var(--mori-type-sans); }
body.theme-clarity a:focus-visible,
body.theme-clarity button:focus-visible { outline: 2px solid var(--cl-accent); outline-offset: 3px; }
body.theme-clarity .hp-footer {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
  padding: 32px 0 40px;
  border-top: 1px solid var(--cl-hair);
  background: transparent;
  color: var(--mori-ink-muted);
  font-size: 11px;
}
body.theme-clarity .hp-footer .hp-footer-column h2 { margin-bottom: 16px; color: var(--mori-ink-base); font-size: 14px; font-weight: 600; }

/* santiz page */
body.theme-clarity .sp-page [class*="sp-"] { background-color: transparent; }
body.theme-clarity .sp-page h1,
body.theme-clarity .sp-page h2,
body.theme-clarity .sp-page h3,
body.theme-clarity .sp-page p,
body.theme-clarity .sp-page li,
body.theme-clarity .sp-page span { color: inherit; }
body.theme-clarity .sp-page .sp-capabilities { height: auto; padding: 0; }
body.theme-clarity .sp-page .sp-capability-grid {
  display: grid;
  width: auto;
  height: auto;
  margin: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
  gap: 12px;
}
body.theme-clarity .sp-page .sp-capability {
  grid-column: auto;
  grid-row: auto;
  order: 0;
  min-height: 0;
  padding: 0;
  color: inherit;
  text-align: left;
}
body.theme-clarity .sp-page .sp-capability img { width: 28px; height: 28px; }
body.theme-clarity .sp-page .sp-capability-pattern,
body.theme-clarity .sp-page .sp-capability-ampersand { display: none; }
body.theme-clarity .sp-page .sp-capability.mori-cl-card { background: var(--mori-surface-content); }
body.theme-clarity .sp-page .sp-local-capabilities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.theme-clarity .sp-page .sp-local-capabilities article { border: 1px solid var(--cl-soft); border-radius: var(--mori-radius-card); padding: 16px; }
body.theme-clarity .sp-page .sp-local-capabilities h3 { font-size: 16px; font-weight: 600; }
body.theme-clarity .sp-page .sp-local-capabilities ul { color: var(--mori-ink-muted); font-size: 12px; }
body.theme-clarity .sp-page .sp-content { min-height: 0; padding: 0; }
body.theme-clarity .sp-page .sp-market-copy,
body.theme-clarity .sp-page .sp-section-heading { width: auto; min-height: 0; padding: 0; }
body.theme-clarity .sp-page .sp-technical-picture { display: none; }
body.theme-clarity .sp-page .sp-hosting-media { display: none; }
body.theme-clarity .sp-page .sp-hosting-copy { position: static; display: block; width: auto; max-width: none; margin: 0; }
body.theme-clarity .sp-page .sp-hosting-copy > img { display: none; }
body.theme-clarity .sp-page .sp-highlight-list { border-left-color: var(--cl-accent); }
body.theme-clarity .sp-page .sp-highlight-list li { color: var(--mori-ink-base); }
body.theme-clarity .sp-page .sp-pill {
  position: static;
  display: inline-grid;
  width: max-content;
  height: auto;
  min-width: 0;
  margin-top: 16px;
  padding: 10px 18px;
  place-items: center;
  border: 0;
  border-radius: var(--mori-radius-sm);
  background: var(--cl-accent);
  color: #ffffff !important;
  font: 500 13px/1 var(--mori-type-sans);
}
body.theme-clarity .sp-page .sp-contact { color: inherit; background-image: none; }
body.theme-clarity .sp-page .sp-contact .sp-pill { background: var(--cl-accent); }
body.theme-clarity .sp-page .sp-hero-copy { color: inherit; }

/* clarity drawer */
.mori-cl-drawer {
  position: fixed;
  inset: 0;
  z-index: 90;
  visibility: hidden;
  opacity: 0;
  transition: opacity .16s ease-out, visibility .16s;
}
.mori-cl-drawer.is-open { visibility: visible; opacity: 1; }
.mori-cl-drawer__scrim { position: absolute; inset: 0; background: rgba(7, 10, 19, .4); }
.mori-cl-drawer__panel {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  display: flex;
  width: min(380px, 88vw);
  flex-direction: column;
  background: var(--mori-surface-content);
  border-right: 1px solid var(--cl-hair);
  transform: translateX(-12px);
  transition: transform .18s ease-out;
}
.mori-cl-drawer.is-open .mori-cl-drawer__panel { transform: none; }
.mori-cl-drawer__head { display: flex; height: 64px; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--cl-hair); }
.mori-cl-drawer__brand { font-size: 11px; letter-spacing: .16em; color: var(--mori-ink-muted); }
.mori-cl-drawer__close { width: 32px; height: 32px; border: 1px solid var(--cl-hair); border-radius: var(--mori-radius-md); background: transparent; color: var(--mori-ink-base); font-size: 18px; line-height: 1; cursor: pointer; }
.mori-cl-drawer__body { flex: 1; overflow-y: auto; padding: 16px; }
.mori-cl-drawer__sector { margin-bottom: 20px; }
.mori-cl-drawer__heading { display: block; padding: 0 10px 8px; color: var(--mori-ink-faint); font-size: 11px; letter-spacing: .06em; }
.mori-cl-drawer__link { display: flex; min-height: 40px; align-items: center; padding: 0 10px; border-radius: 10px; color: var(--mori-ink-base); font-size: 14px; text-decoration: none; }
.mori-cl-drawer__link:hover { background: var(--cl-fill); }
.mori-cl-drawer__link.is-active { background: var(--cl-fill); font-weight: 600; }

/* ══════════════════════════════════════════════════════════════════════════
   XIUXIAN — cloud gate, ascent ladder, terrace, stele. Warm paper, gold
   incisions, cinnabar seals, cut corners, Songti display type.
   ══════════════════════════════════════════════════════════════════════ */
body.theme-xiuxian {
  --x-gold: #c9a24a;
  --x-gold-pale: #e8d6a8;
  --x-gold-line: rgba(201, 162, 74, .45);
  --x-gold-soft: rgba(201, 162, 74, .22);
  --x-cinnabar: #b4492f;
  --x-ridge: #8a8175;
  --x-serif: "Songti SC", "SimSun", "Noto Serif SC", "STSong", serif;
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  font-size: 13px;
  line-height: 1.54;
  -webkit-font-smoothing: antialiased;
}
body.theme-xiuxian .hp-page,
body.theme-xiuxian .ap-page,
body.theme-xiuxian .fp-page,
body.theme-xiuxian .sp-page,
body.theme-xiuxian .qp-page,
body.theme-xiuxian .dp-page {
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
}
body.theme-xiuxian .support-launcher { bottom: 24px; right: 24px; }
body.theme-xiuxian .mori-theme-switch { left: auto; right: 24px; bottom: 24px; }

/* cloud gate */
.mori-x-gate {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 70;
  height: 64px;
  border-bottom: 1px solid var(--x-gold-line);
  background: rgba(247, 243, 234, .94);
  backdrop-filter: blur(16px);
}
.mori-x-gate__inner {
  display: flex;
  align-items: center;
  gap: 22px;
  width: min(1240px, calc(100% - 48px));
  height: 100%;
  margin: 0 auto;
}
.mori-x-brand { display: inline-flex; align-items: baseline; gap: 8px; color: var(--mori-ink-strong); text-decoration: none; font-family: var(--x-serif); }
.mori-x-brand__mark { font: 600 18px/1 var(--x-serif); letter-spacing: .18em; }
.mori-x-brand__sub { font: 400 10px/1 var(--x-serif); letter-spacing: .24em; color: var(--mori-ink-muted); }
.mori-x-crumb { display: flex; align-items: center; gap: 8px; color: var(--mori-ink-muted); font-family: var(--x-serif); font-size: 12px; }
.mori-x-crumb__home { color: var(--x-cinnabar); text-decoration: none; }
.mori-x-crumb__sep { color: var(--x-gold); }
.mori-x-crumb__scene { color: var(--mori-ink-base); }
.mori-x-actions { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.mori-x-locale { display: inline-grid; min-width: 40px; height: 28px; padding: 0 8px; place-items: center; border: 1px solid transparent; color: var(--mori-ink-muted); font-size: 11px; letter-spacing: .08em; text-decoration: none; }
.mori-x-locale:hover { border-color: var(--x-gold-line); color: var(--mori-ink-base); }
.mori-x-locale.is-active { border-color: var(--x-cinnabar); color: var(--x-cinnabar); }
.mori-x-menu { display: none; width: 36px; height: 36px; padding: 0; border: 1px solid var(--x-gold-line); background: transparent; cursor: pointer; }
.mori-x-menu__bar,
.mori-x-menu__bar::before,
.mori-x-menu__bar::after { display: block; width: 15px; height: 1px; margin: 0 auto; background: var(--mori-ink-base); content: ""; }
.mori-x-menu__bar { position: relative; }
.mori-x-menu__bar::before { position: absolute; top: -5px; left: 0; }
.mori-x-menu__bar::after { position: absolute; top: 5px; left: 0; }

/* ascent ladder */
.mori-x-ladder {
  position: fixed;
  top: 64px;
  bottom: 0;
  left: 0;
  z-index: 60;
  display: flex;
  width: 92px;
  flex-direction: column;
  padding: 36px 0 20px;
  border-right: 1px solid var(--x-gold-soft);
  background: linear-gradient(90deg, var(--mori-surface-page) 0%, color-mix(in srgb, var(--mori-surface-page) 60%, transparent) 72%, transparent 100%);
}
.mori-x-ladder::before {
  position: absolute;
  top: 56px;
  bottom: 56px;
  left: 26px;
  width: 1px;
  background: linear-gradient(180deg, transparent, var(--x-gold-line) 10%, var(--x-gold-line) 90%, transparent);
  content: "";
}
.mori-x-peak {
  position: relative;
  display: flex;
  height: 68px;
  align-items: center;
  gap: 8px;
  padding: 0 2px 0 30px;
  border: 0;
  background: transparent;
  color: var(--mori-ink-muted);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.mori-x-peak:hover { color: var(--mori-ink-strong); background: color-mix(in srgb, var(--x-gold-pale) 22%, transparent); }
.mori-x-peak:nth-child(1) { height: 68px; }
.mori-x-peak:nth-child(2) { height: 78px; }
.mori-x-peak:nth-child(3) { height: 88px; }
.mori-x-peak:nth-child(4) { height: 80px; }
.mori-x-peak:nth-child(5) { height: 70px; }
.mori-x-peak:nth-child(2) { padding-left: 33px; }
.mori-x-peak:nth-child(3) { padding-left: 36px; }
.mori-x-peak:nth-child(4) { padding-left: 39px; }
.mori-x-peak:nth-child(5) { padding-left: 42px; }
.mori-x-peak__node {
  position: absolute;
  top: 50%;
  left: 22px;
  width: 7px;
  height: 7px;
  border: 1px solid var(--x-gold);
  background: var(--mori-surface-page);
  transform: translateY(-50%) rotate(45deg);
}
.mori-x-peak__icon { display: grid; width: 14px; height: 14px; flex: 0 0 14px; place-items: center; color: var(--x-gold); }
.mori-x-peak__icon .mori-icon { width: 14px; height: 14px; stroke-width: 1.4; }
.mori-x-peak__label {
  align-self: center;
  color: var(--mori-ink-base);
  font: 500 13px/18px var(--x-serif);
  letter-spacing: .14em;
  writing-mode: vertical-rl;
  text-orientation: mixed;
}
.mori-x-peak.is-here .mori-x-peak__node { border-color: var(--x-cinnabar); background: var(--x-cinnabar); }
.mori-x-peak.is-here .mori-x-peak__label { color: var(--x-cinnabar); }
.mori-x-peak.is-open .mori-x-peak__node { border-color: var(--x-gold); background: var(--x-gold); }
.mori-x-peak.is-open .mori-x-peak__label { color: var(--mori-ink-strong); }
.mori-x-peak:hover .mori-x-peak__label { color: var(--x-cinnabar); }
.mori-x-peak--gate.is-here .mori-x-peak__node { border-color: var(--x-cinnabar); background: var(--x-cinnabar); }

/* terrace */
.mori-x-terrace {
  position: fixed;
  top: 140px;
  left: 104px;
  z-index: 65;
  width: 300px;
  max-height: calc(100vh - 200px);
  padding: 24px 22px;
  border: 1px solid var(--x-gold-line);
  background: var(--mori-surface-content);
  box-shadow: 0 18px 48px rgba(29, 26, 22, .12);
  clip-path: polygon(0 10px, 10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px));
  opacity: 0;
  visibility: hidden;
  overflow-y: auto;
  transform: translateX(-8px);
  transition: opacity .16s ease-out, transform .16s ease-out, visibility .16s;
}
.mori-x-terrace.is-open { opacity: 1; visibility: visible; transform: none; }
.mori-x-terrace__head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid var(--x-gold-line); }
.mori-x-terrace__title { color: var(--mori-ink-strong); font: 600 20px/1.3 var(--x-serif); letter-spacing: .08em; }
.mori-x-terrace__meta { color: var(--x-gold); font-size: 11px; letter-spacing: .18em; }
.mori-x-terrace__list { display: grid; padding-top: 6px; }
.mori-x-terrace__group { padding: 12px 4px 4px; color: var(--x-gold); font-family: var(--x-serif); font-size: 11px; letter-spacing: .16em; }
.mori-x-terrace__link { display: flex; min-height: 40px; align-items: center; gap: 10px; padding: 0 4px; border-bottom: 1px dashed var(--x-gold-soft); color: var(--mori-ink-base); font-family: var(--x-serif); font-size: 14px; text-decoration: none; }
.mori-x-terrace__link:hover { color: var(--x-cinnabar); }
.mori-x-terrace__link.is-active { color: var(--x-cinnabar); }
.mori-x-terrace__bullet { width: 5px; height: 5px; flex: 0 0 5px; background: var(--x-gold); transform: rotate(45deg); }
.mori-x-terrace__link.is-active .mori-x-terrace__bullet { background: var(--x-cinnabar); }

/* stele */
body.theme-xiuxian main.mori-x-stele {
  width: min(1240px, calc(100% - 240px));
  min-height: calc(100vh - 160px);
  margin: 96px auto 32px;
  padding: 0 0 8px;
  border: 1px solid var(--x-gold-line);
  background: var(--mori-surface-content);
  clip-path: polygon(0 12px, 12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px));
  overflow: visible;
}
body.theme-xiuxian .mori-x-cover {
  padding: 40px 40px 0;
}
.mori-x-cover__head { display: flex; align-items: center; gap: 12px; }
.mori-x-cover__seal {
  display: inline-grid;
  width: 26px;
  height: 26px;
  place-items: center;
  background: var(--x-cinnabar);
  color: #fffdf9;
  font: 600 15px/1 var(--x-serif);
}
.mori-x-cover__realm {
  display: inline-grid;
  min-height: 22px;
  padding: 0 10px;
  place-items: center;
  border: 1px solid var(--x-gold-line);
  color: var(--mori-ink-muted);
  font-family: var(--x-serif);
  font-size: 11px;
  letter-spacing: .14em;
}
.mori-x-cover__body h1,
.mori-x-cover__body h2 {
  margin: 18px 0 0;
  color: var(--mori-ink-strong);
  font: 600 34px/46px var(--x-serif);
  letter-spacing: .02em;
}
.mori-x-cover__body > p:first-of-type,
.mori-x-cover__body p { margin-top: 10px; max-width: 62ch; color: var(--mori-ink-muted); font-size: 13px; line-height: 20px; }
.mori-x-cover__rule { display: block; width: 40px; height: 1px; margin-top: 24px; background: var(--x-gold); }
body.theme-xiuxian .mori-x-stage {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 48px 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--x-gold-line);
}
.mori-x-stage__ordinal {
  display: inline-grid;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  place-items: center;
  border: 1px solid var(--x-gold-line);
  color: var(--x-cinnabar);
  font: 500 16px/1 var(--x-serif);
}
body.theme-xiuxian .mori-x-stage h2 {
  margin: 0;
  color: var(--mori-ink-strong);
  font: 600 20px/26px var(--x-serif);
  letter-spacing: .06em;
  position: static;
  left: auto;
  width: auto;
  transform: none;
  white-space: normal;
}
.mori-x-stage__rule { width: 40px; height: 1px; margin-left: auto; background: var(--x-gold); }

/* blade grid */
body.theme-xiuxian .hp-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body.theme-xiuxian .mori-x-blade {
  position: relative;
  min-width: 0;
  padding: 20px 20px 22px;
  border: 1px solid var(--x-gold-line);
  background: var(--mori-surface-card);
  clip-path: polygon(0 8px, 8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
}
.mori-x-blade__cord {
  position: absolute;
  top: 0;
  left: 20px;
  width: 40px;
  height: 2px;
  background: linear-gradient(90deg, var(--x-gold), var(--x-gold-pale));
}
.mori-x-blade__body h3 { margin: 0; color: var(--mori-ink-strong); font: 600 18px/26px var(--x-serif); letter-spacing: .04em; }
.mori-x-blade__body p { margin-top: 8px; color: var(--mori-ink-muted); font-size: 13px; line-height: 20px; }
.mori-x-blade__body img { width: 26px; height: 26px; object-fit: contain; margin-bottom: 10px; filter: grayscale(1) sepia(.4); }
body.theme-xiuxian .ap-product,
body.theme-xiuxian .fp-feature,
body.theme-xiuxian .sp-page .sp-capability.mori-x-blade,
body.theme-xiuxian .qp-service {
  background: var(--mori-surface-card);
  color: var(--mori-ink-base);
}

/* vein stage */
body.theme-xiuxian .hp-latency-body { display: block; }
body.theme-xiuxian .hp-latency-copy { display: grid; gap: 0; margin: 0; }
body.theme-xiuxian .mori-x-vein {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 16px;
  padding: 20px 0;
  border-top: 1px solid var(--x-gold-line);
}
body.theme-xiuxian .mori-x-vein:first-child { border-top: 0; }
.mori-x-vein__rail { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.mori-x-vein__rail::before { position: absolute; top: 14px; bottom: 0; left: 50%; width: 1px; background: var(--x-gold-soft); content: ""; }
.mori-x-vein__node { width: 9px; height: 9px; margin-top: 4px; background: var(--x-gold); transform: rotate(45deg); }
.mori-x-vein__no { color: var(--x-gold); font: 500 11px/1 var(--x-serif); letter-spacing: .1em; }
.mori-x-vein__body h3 { margin: 0; color: var(--mori-ink-strong); font: 600 18px/26px var(--x-serif); letter-spacing: .04em; }
.mori-x-vein__body p { margin-top: 8px; color: var(--mori-ink-muted); font-size: 13px; line-height: 20px; }
.mori-x-vein__read { display: flex; align-items: baseline; gap: 6px; margin-top: 12px; }
.mori-x-vein__value { color: var(--x-cinnabar); font: 600 28px/34px var(--x-serif); font-variant-numeric: tabular-nums; }
.mori-x-vein__unit { color: var(--mori-ink-muted); font-size: 11px; letter-spacing: .08em; }
body.theme-xiuxian .hp-latency-chart { display: none; }

/* star table */
body.theme-xiuxian .hp-licence dl { display: block; margin: 0; border-top: 2px solid var(--x-gold-line); }
body.theme-xiuxian .mori-x-row {
  display: flex;
  min-height: 52px;
  align-items: center;
  gap: 12px;
  padding: 0 10px;
  border-bottom: 1px dashed var(--x-gold-line);
}
.mori-x-row__bullet { width: 6px; height: 6px; flex: 0 0 6px; background: var(--x-cinnabar); transform: rotate(45deg); }
body.theme-xiuxian .mori-x-row dt { color: var(--mori-ink-muted); font-family: var(--x-serif); font-size: 13px; }
body.theme-xiuxian .mori-x-row dd { margin: 0 0 0 auto; color: var(--mori-ink-base); font-size: 13px; text-align: right; }
body.theme-xiuxian .mori-x-row--link { color: var(--mori-ink-base); font-family: var(--x-serif); font-size: 14px; text-decoration: none; }
body.theme-xiuxian .mori-x-row--link small { margin-left: auto; color: var(--mori-ink-muted); font-size: 11px; }
body.theme-xiuxian .dp-download-column { display: grid; gap: 8px; }
body.theme-xiuxian .dp-download-column .mori-x-row--link { border: 1px solid var(--x-gold-line); background: var(--mori-surface-card); padding: 0 14px; }

/* archive gate */
body.theme-xiuxian .hp-contact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; width: auto; margin: 0; padding: 0; }
body.theme-xiuxian .mori-x-gateway { padding: 8px 0 24px; }
.mori-x-gateway__frame { position: relative; padding: 32px 36px; }
.mori-x-gateway__pillar { position: absolute; top: 0; bottom: 0; background: linear-gradient(180deg, var(--x-gold), var(--x-gold-pale)); }
.mori-x-gateway__pillar--left { left: 0; width: 3px; }
.mori-x-gateway__pillar--right { right: 0; width: 2px; }
.mori-x-gateway__lintel { position: absolute; top: 0; left: 0; right: 0; height: 8px; border-top: 3px solid var(--x-gold); border-bottom: 1px solid var(--x-gold-line); }
.mori-x-gateway__sill { position: absolute; bottom: 0; left: 0; right: 0; height: 4px; background: var(--x-gold-soft); }
.mori-x-gateway__body h2 { margin: 0 0 16px; color: var(--mori-ink-strong); font: 600 20px/26px var(--x-serif); letter-spacing: .06em; }
body.theme-xiuxian .hp-contact span { color: var(--mori-ink-muted); font-size: 11px; letter-spacing: .08em; }
body.theme-xiuxian .hp-contact a,
body.theme-xiuxian .hp-contact address { color: var(--mori-ink-base); font-family: var(--x-serif); font-size: 13px; line-height: 20px; font-style: normal; }

/* typography and footer */
body.theme-xiuxian h1,
body.theme-xiuxian h2,
body.theme-xiuxian h3 { font-family: var(--x-serif); letter-spacing: .04em; color: var(--mori-ink-strong); }
body.theme-xiuxian h1 { font-size: 34px; line-height: 46px; font-weight: 600; }
body.theme-xiuxian h2 { font-size: 20px; line-height: 26px; font-weight: 600; }
body.theme-xiuxian h3 { font-size: 18px; line-height: 26px; font-weight: 600; }
body.theme-xiuxian p,
body.theme-xiuxian li,
body.theme-xiuxian dd,
body.theme-xiuxian dt { font-size: 13px; line-height: 20px; }
body.theme-xiuxian a:focus-visible,
body.theme-xiuxian button:focus-visible { outline: 1px solid var(--x-cinnabar); outline-offset: 3px; }
body.theme-xiuxian .hp-footer,
body.theme-xiuxian .ap-footer,
body.theme-xiuxian .fp-footer,
body.theme-xiuxian .sp-footer,
body.theme-xiuxian .qp-footer,
body.theme-xiuxian .dp-footer {
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  padding: 0 0 40px;
  border-top: 1px solid var(--x-gold-line);
  background: transparent;
  color: var(--mori-ink-muted);
  font-size: 11px;
}
.mori-x-ridge { display: grid; gap: 6px; padding: 8px 0 14px; }
.mori-x-ridge__art { display: block; width: 100%; height: 48px; }
.mori-x-ridge__art .fill { fill: var(--x-gold-pale); stroke: none; opacity: .45; }
.mori-x-ridge__art .far { fill: none; stroke: var(--x-ridge); stroke-width: .8; opacity: .45; }
.mori-x-ridge__art .mid { fill: none; stroke: var(--x-ridge); stroke-width: 1; opacity: .65; }
.mori-x-ridge__art .near { fill: none; stroke: var(--x-gold); stroke-width: 1.2; opacity: .8; }
.mori-x-ridge__colophon { display: flex; align-items: center; gap: 10px; }
.mori-x-ridge__seal { display: inline-grid; width: 24px; height: 24px; place-items: center; background: var(--x-cinnabar); color: #fffdf9; font: 600 13px/1 var(--x-serif); }
.mori-x-ridge__text { color: var(--x-ridge); font-family: var(--x-serif); font-size: 11px; letter-spacing: .16em; }

body.theme-xiuxian .hp-cta {
  position: static;
  display: inline-grid;
  min-width: 0;
  height: 38px;
  margin-top: 18px;
  padding: 0 20px;
  place-items: center;
  border: 1px solid var(--x-gold);
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--x-serif);
  font-size: 13px;
  letter-spacing: .12em;
  white-space: nowrap;
}
body.theme-xiuxian .mori-x-blade { text-align: left; }
body.theme-xiuxian .mori-x-blade img { margin-left: 0; }
body.theme-xiuxian .hp-licence-copy > p:first-child { margin: 0 0 6px; color: var(--x-gold); font-family: var(--x-serif); font-size: 11px; letter-spacing: .16em; }
body.theme-xiuxian .floating-directory { display: none; }
body.theme-xiuxian .hp-licence-copy { margin: 0; }
body.theme-xiuxian .mori-x-cover__body h1,
body.theme-xiuxian .mori-x-cover__body h2 { position: static; left: auto; width: auto; transform: none; white-space: normal; }

/* host page normalisation */
body.theme-xiuxian .hp-licence > img,
body.theme-xiuxian .hp-office-map { display: none; }
body.theme-xiuxian .hp-licence { overflow: visible; }
body.theme-xiuxian .hp-company { place-content: initial; justify-items: initial; }
body.theme-xiuxian .hp-company-copy { width: auto; margin-top: 0; }
body.theme-xiuxian .hp-company-copy > p:first-child { color: var(--x-gold); font-family: var(--x-serif); font-size: 11px; letter-spacing: .16em; }
body.theme-xiuxian .hp-office h2 { margin: 0 0 8px; font-size: 20px; line-height: 26px; }
body.theme-xiuxian .hp-section-heading { padding: 0; text-align: left; }
body.theme-xiuxian .hp-section-heading > p { margin: 0 0 8px; color: var(--x-gold); font-family: var(--x-serif); font-size: 11px; letter-spacing: .16em; text-align: left; }
body.theme-xiuxian .hp-section-description { margin-top: 8px; color: var(--mori-ink-muted); font-size: 12px; line-height: 18px; text-align: left; }
body.theme-xiuxian .mori-x-cover__body > p:first-child { color: var(--x-gold); font-family: var(--x-serif); font-size: 11px; letter-spacing: .16em; }
body.theme-xiuxian .dp-page { min-width: 0; }
body.theme-xiuxian .dp-top { display: block; background: none; animation: none; }
body.theme-xiuxian .dp-app-icon,
body.theme-xiuxian .dp-phone,
body.theme-xiuxian .dp-hero-media { display: none; }
body.theme-xiuxian .dp-brand-copy { display: block; }
body.theme-xiuxian .dp-panel { display: block; min-height: 0; }
body.theme-xiuxian .dp-download { display: block; width: auto; margin: 0; padding: 0; }
body.theme-xiuxian .dp-download-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; }
body.theme-xiuxian .dp-download-column.mori-x-blade { display: block; padding: 16px; }
body.theme-xiuxian .mori-x-row--link { gap: 10px; }
body.theme-xiuxian .mori-x-row--link span { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
body.theme-xiuxian .mori-x-row--link img { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; filter: grayscale(1) sepia(.45); }
body.theme-xiuxian .hp-address { grid-column: 1 / -1; }
body.theme-xiuxian .ap-brand-line { display: block; color: var(--x-gold); font-family: var(--x-serif); font-size: 11px; font-weight: 400; letter-spacing: .16em; }
body.theme-xiuxian .ap-headline { display: block; margin-top: 6px; }
body.theme-xiuxian .ap-intro { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; font-size: 13px; line-height: 20px; }
body.theme-xiuxian .ap-intro p { font-weight: 400; line-height: 20px; }
body.theme-xiuxian .ap-intro ul { margin-top: 12px; color: var(--mori-ink-muted); font-size: 12px; line-height: 18px; }
body.theme-xiuxian .ap-focus { gap: 16px; margin: 0; }
body.theme-xiuxian .ap-focus-label { color: var(--mori-ink-strong); font-family: var(--x-serif); font-size: 15px; line-height: 22px; }
body.theme-xiuxian .ap-focus-art { width: 100%; height: auto; aspect-ratio: auto; overflow: visible; }
body.theme-xiuxian .ap-products { gap: 16px; }
body.theme-xiuxian .ap-product-title { gap: 8px; }
body.theme-xiuxian .ap-product-brand { gap: 6px; font-family: var(--x-serif); font-size: 13px; line-height: 18px; }
body.theme-xiuxian .ap-product-icon img { width: 20px; height: 20px; filter: grayscale(1) sepia(.45); }
body.theme-xiuxian .ap-product-headline { color: var(--mori-ink-strong); font-family: var(--x-serif); font-size: 18px; line-height: 26px; font-weight: 600; }
body.theme-xiuxian .ap-blocks { color: var(--mori-ink-muted); font-size: 12px; line-height: 18px; }
body.theme-xiuxian .ap-blocks h3,
body.theme-xiuxian .ap-blocks h4 { margin-top: 16px; color: var(--mori-ink-base); font-family: var(--x-serif); font-size: 14px; line-height: 20px; }
body.theme-xiuxian .ap-blocks ul { font-size: 12px; line-height: 18px; }
body.theme-xiuxian .ap-office { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
body.theme-xiuxian .ap-contact-field { display: grid; gap: 4px; }
body.theme-xiuxian .ap-contact-field span { color: var(--x-gold); font-size: 11px; letter-spacing: .08em; }
body.theme-xiuxian .ap-contact-field a,
body.theme-xiuxian .ap-contact-field address { color: var(--mori-ink-base); font-family: var(--x-serif); font-size: 13px; line-height: 20px; }

/* host page normalisation */
body.theme-xiuxian .hp-hero,
body.theme-xiuxian .ap-hero,
body.theme-xiuxian .fp-hero,
body.theme-xiuxian .sp-hero,
body.theme-xiuxian .qp-hero {
  height: auto;
  min-height: 0;
  padding: 0;
  overflow: visible;
  background: transparent !important;
}
body.theme-xiuxian .hp-hero-grid,
body.theme-xiuxian .hp-hero-panda,
body.theme-xiuxian .fp-hero-panda,
body.theme-xiuxian .sp-hero-panda,
body.theme-xiuxian .qp-hero-panda,
body.theme-xiuxian .sp-hero-pill { display: none !important; }
body.theme-xiuxian .hp-company {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
}
body.theme-xiuxian .hp-company-mark { display: block; width: 64px; height: 64px; }
body.theme-xiuxian .hp-company-mark img { position: static; width: 64px; height: 64px; object-fit: contain; filter: grayscale(1) sepia(.45); }
body.theme-xiuxian .hp-latency .hp-desktop-only { display: block !important; }
body.theme-xiuxian .hp-latency .hp-mobile-only { display: none !important; }
body.theme-xiuxian .hp-hero-copy,
body.theme-xiuxian .fp-hero-copy,
body.theme-xiuxian .sp-hero-copy,
body.theme-xiuxian .qp-hero-copy { position: static; top: auto; left: auto; width: auto; max-width: none; }
body.theme-xiuxian .hp-retail,
body.theme-xiuxian .hp-latency,
body.theme-xiuxian .hp-company,
body.theme-xiuxian .hp-licence,
body.theme-xiuxian .hp-office,
body.theme-xiuxian .ap-products-section,
body.theme-xiuxian .ap-technical-section,
body.theme-xiuxian .ap-office-section,
body.theme-xiuxian .fp-features-section,
body.theme-xiuxian .fp-licensing,
body.theme-xiuxian .sp-local-section,
body.theme-xiuxian .sp-trading-section,
body.theme-xiuxian .sp-hosting-section,
body.theme-xiuxian .sp-contact,
body.theme-xiuxian .qp-manifesto {
  min-height: 0;
  height: auto;
  margin: 0 0 40px;
  padding: 0 40px;
  overflow: visible;
  background: transparent;
  color: var(--mori-ink-base);
}
body.theme-xiuxian .hp-company { text-align: left; }
body.theme-xiuxian .hp-licence { display: block; }
body.theme-xiuxian .hp-office { background: transparent; }
body.theme-xiuxian .hp-office h2 { color: var(--mori-ink-strong); }
body.theme-xiuxian .qp-manifesto { color: var(--mori-ink-base); }
body.theme-xiuxian .qp-manifesto img { display: none; }
body.theme-xiuxian .fp-licensing { border: 0; }
body.theme-xiuxian .ap-product { min-height: 0; padding: 20px; border: 1px solid var(--x-gold-line); }
body.theme-xiuxian .ap-focus { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; }
body.theme-xiuxian .ap-focus li { display: block; padding: 18px; border: 1px solid var(--x-gold-line); background: var(--mori-surface-card); }
body.theme-xiuxian .ap-focus li::before { display: none; }
body.theme-xiuxian .ap-focus-image { position: static; display: block; width: 36px; height: 36px; margin-bottom: 10px; }
body.theme-xiuxian .fp-features-section { background: transparent; }

/* santiz page */
body.theme-xiuxian .sp-page [class*="sp-"] { background-color: transparent; }
body.theme-xiuxian .sp-page h1,
body.theme-xiuxian .sp-page h2,
body.theme-xiuxian .sp-page h3,
body.theme-xiuxian .sp-page p,
body.theme-xiuxian .sp-page li,
body.theme-xiuxian .sp-page span { color: inherit; }
body.theme-xiuxian .sp-page .sp-capabilities { height: auto; padding: 0; }
body.theme-xiuxian .sp-page .sp-capability-grid {
  display: grid;
  width: auto;
  height: auto;
  margin: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
  gap: 16px;
}
body.theme-xiuxian .sp-page .sp-capability { grid-column: auto; grid-row: auto; order: 0; min-height: 0; padding: 0; color: inherit; text-align: left; }
body.theme-xiuxian .sp-page .sp-capability-pattern,
body.theme-xiuxian .sp-page .sp-capability-ampersand { display: none; }
body.theme-xiuxian .sp-page .sp-local-capabilities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body.theme-xiuxian .sp-page .sp-local-capabilities article { border: 1px solid var(--x-gold-line); padding: 18px; background: var(--mori-surface-card); }
body.theme-xiuxian .sp-page .sp-content { min-height: 0; padding: 0; }
body.theme-xiuxian .sp-page .sp-market-copy,
body.theme-xiuxian .sp-page .sp-section-heading { width: auto; min-height: 0; padding: 0; }
body.theme-xiuxian .sp-page .sp-technical-picture { display: none; }
body.theme-xiuxian .sp-page .sp-hosting-media { display: none; }
body.theme-xiuxian .sp-page .sp-hosting-copy { position: static; display: block; width: auto; max-width: none; margin: 0; }
body.theme-xiuxian .sp-page .sp-hosting-copy > img { display: none; }
body.theme-xiuxian .sp-page .sp-highlight-list { border-left-color: var(--x-cinnabar); }
body.theme-xiuxian .sp-page .sp-highlight-list li { color: var(--mori-ink-base); }
body.theme-xiuxian .sp-page .sp-pill {
  position: static;
  display: inline-grid;
  width: max-content;
  height: auto;
  min-width: 0;
  margin-top: 16px;
  padding: 10px 18px;
  place-items: center;
  border: 1px solid var(--x-gold);
  background: transparent;
  color: var(--mori-ink-base) !important;
  font: 500 12px/1 var(--x-serif);
  letter-spacing: .12em;
}
body.theme-xiuxian .sp-page .sp-contact { background-image: none; }

/* xiuxian drawer */
.mori-x-drawer {
  position: fixed;
  inset: 0;
  z-index: 90;
  visibility: hidden;
  opacity: 0;
  transition: opacity .16s ease-out, visibility .16s;
}
.mori-x-drawer.is-open { visibility: visible; opacity: 1; }
.mori-x-drawer__scrim { position: absolute; inset: 0; background: rgba(29, 26, 22, .42); }
.mori-x-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  width: min(340px, 88vw);
  flex-direction: column;
  border-left: 1px solid var(--x-gold-line);
  background: var(--mori-surface-content);
  transform: translateX(12px);
  transition: transform .18s ease-out;
}
.mori-x-drawer.is-open .mori-x-drawer__panel { transform: none; }
.mori-x-drawer__head { display: flex; height: 56px; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--x-gold-line); }
.mori-x-drawer__brand { color: var(--mori-ink-muted); font-family: var(--x-serif); font-size: 11px; letter-spacing: .18em; }
.mori-x-drawer__close { width: 30px; height: 30px; border: 1px solid var(--x-gold-line); background: transparent; color: var(--mori-ink-base); font-size: 17px; line-height: 1; cursor: pointer; }
.mori-x-drawer__body { flex: 1; overflow-y: auto; padding: 12px 16px 32px; }
.mori-x-drawer__gate { display: flex; min-height: 48px; align-items: center; border-bottom: 1px solid var(--x-gold-line); color: var(--x-cinnabar); font-family: var(--x-serif); font-size: 16px; letter-spacing: .12em; text-decoration: none; }
.mori-x-drawer__peak { border-bottom: 1px dashed var(--x-gold-soft); }
.mori-x-drawer__btn { display: flex; width: 100%; min-height: 48px; align-items: center; gap: 10px; padding: 0; border: 0; background: transparent; color: var(--mori-ink-base); font-family: var(--x-serif); font-size: 15px; letter-spacing: .1em; text-align: left; cursor: pointer; }
.mori-x-drawer__icon { display: grid; width: 18px; height: 18px; place-items: center; color: var(--x-gold); }
.mori-x-drawer__icon .mori-icon { width: 17px; height: 17px; }
.mori-x-drawer__items { max-height: 0; overflow: hidden; transition: max-height .2s ease-out; }
.mori-x-drawer__peak.is-open .mori-x-drawer__items { max-height: 480px; }
.mori-x-drawer__link { display: flex; min-height: 36px; align-items: center; padding: 0 0 0 28px; color: var(--mori-ink-muted); font-size: 13px; text-decoration: none; }
.mori-x-drawer__link.is-active { color: var(--x-cinnabar); }
body.mori-cl-drawer-open,
body.mori-x-drawer-open { overflow: hidden; }

/* ══════════════════════════════════════════════════════════════════════════
   Host normalisation — second pass (clarity / xiuxian)
   ══════════════════════════════════════════════════════════════════════ */

/* Sticky min-heights sized for the original dark section chrome read as large
   voids once the sections became quiet paper. */
body.theme-clarity .sp-market-section,
body.theme-clarity .sp-local-section .sp-content,
body.theme-clarity .sp-trading-section .sp-content,
body.theme-clarity .sp-hosting-section,
body.theme-clarity .qp-agent,
body.theme-clarity .qp-download,
body.theme-clarity .fp-features,
body.theme-clarity .fp-download,
body.theme-xiuxian .sp-market-section,
body.theme-xiuxian .sp-local-section .sp-content,
body.theme-xiuxian .sp-trading-section .sp-content,
body.theme-xiuxian .sp-hosting-section,
body.theme-xiuxian .qp-agent,
body.theme-xiuxian .qp-download,
body.theme-xiuxian .fp-features,
body.theme-xiuxian .fp-download { min-height: 0; }

body.theme-clarity .fp-features,
body.theme-xiuxian .fp-features { padding: 8px 0 24px; }
body.theme-clarity .fp-download,
body.theme-xiuxian .fp-download { padding: 48px 0 32px; background: transparent; }
body.theme-clarity .qp-download,
body.theme-xiuxian .qp-download { padding: 24px 32px 32px; background: transparent; }
body.theme-clarity .qp-agent,
body.theme-xiuxian .qp-agent { background: transparent; }
body.theme-clarity .qp-agent-inner,
body.theme-xiuxian .qp-agent-inner { padding: 8px 0 0; }
body.theme-clarity .qp-manifesto { background: var(--cl-accent-soft); border-color: var(--cl-accent-border); }

/* feature artwork: the 28px card-icon clamp must not shrink the illustration */
body.theme-clarity .fp-feature-art,
body.theme-xiuxian .fp-feature-art {
  display: block;
  width: 100%;
  height: 220px;
  aspect-ratio: auto;
  border-radius: 12px;
  overflow: hidden;
  background: var(--mori-accent-grid);
}
body.theme-clarity .mori-cl-card .fp-feature-art img,
body.theme-xiuxian .mori-x-blade__body .fp-feature-art img {
  width: 100%;
  height: 220px;
  object-fit: contain;
}
body.theme-xiuxian .mori-x-blade__body .fp-feature-art img { filter: grayscale(1) sepia(.35); }

/* page-level call to action: the host floats these over the hero */
body.theme-clarity .fp-cta,
body.theme-clarity .qp-hero-copy > a {
  position: static;
  display: inline-grid;
  height: 36px;
  min-width: 0;
  padding: 0 18px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: var(--mori-radius-sm);
  background: var(--cl-accent);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
body.theme-clarity .fp-cta:hover,
body.theme-clarity .qp-hero-copy > a:hover { background: var(--cl-accent-strong); color: #fff; }
body.theme-xiuxian .fp-cta,
body.theme-xiuxian .qp-hero-copy > a {
  position: static;
  display: inline-grid;
  height: 38px;
  min-width: 0;
  padding: 0 20px;
  place-items: center;
  border: 1px solid var(--x-gold);
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--x-serif);
  font-size: 13px;
  letter-spacing: .12em;
  white-space: nowrap;
}
body.theme-xiuxian .fp-cta:hover,
body.theme-xiuxian .qp-hero-copy > a:hover { border-color: var(--x-cinnabar); color: var(--x-cinnabar); }

/* steles rebuild the hero copy inside the paper shell; the santiz host colour
   (#ccf8ff ice blue) would otherwise win on every inherited text node */
body.theme-xiuxian .sp-page .mori-x-cover__body h1,
body.theme-xiuxian .sp-page .mori-x-cover__body h2 { color: var(--mori-ink-strong); }
body.theme-xiuxian .sp-page .mori-x-cover__body p { color: var(--mori-ink-muted); }
body.theme-xiuxian .sp-page .mori-x-cover__body > p:first-of-type { color: var(--x-gold); }
body.theme-xiuxian .sp-page .mori-x-cover__body .hp-cta { color: var(--mori-ink-base); }

/* download sections: eyebrow + title above three equal groups, artwork right */
body.theme-clarity .fp-download,
body.theme-clarity .qp-download,
body.theme-xiuxian .fp-download,
body.theme-xiuxian .qp-download {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 40px;
  align-items: start;
}
body.theme-clarity .fp-download-copy,
body.theme-clarity .qp-download-copy,
body.theme-xiuxian .fp-download-copy,
body.theme-xiuxian .qp-download-copy { display: block; min-width: 0; }
body.theme-clarity .fp-download-groups,
body.theme-clarity .qp-download-groups,
body.theme-xiuxian .fp-download-groups,
body.theme-xiuxian .qp-download-groups {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}
body.theme-clarity .fp-download-group,
body.theme-clarity .qp-download-group,
body.theme-xiuxian .fp-download-group,
body.theme-xiuxian .qp-download-group { width: auto; min-width: 0; grid-column: auto; grid-row: auto; }
body.theme-xiuxian .fp-download .fp-download-group,
body.theme-xiuxian .qp-download-group {
  display: block;
  padding: 16px 0;
  border-top: 1px dashed var(--x-gold-soft);
}
body.theme-xiuxian .fp-download-group .mori-x-row__bullet { display: none; }
body.theme-xiuxian .fp-download-group > h3,
body.theme-xiuxian .qp-download-group > h3 {
  margin: 0 0 12px;
  color: var(--x-gold);
  font: 600 12px/18px var(--x-serif);
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.theme-clarity .fp-download-list,
body.theme-clarity .qp-download-list,
body.theme-xiuxian .fp-download-list,
body.theme-xiuxian .qp-download-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }

/* download rows: the host ships black pills with white glyphs on every page */
body.theme-clarity .fp-download-link,
body.theme-clarity .qp-download-list a,
body.theme-clarity .dp-download-link {
  height: 48px;
  min-height: 48px;
  padding: 0 12px;
  border: 1px solid var(--cl-soft);
  border-radius: 10px;
  background: var(--mori-surface-content);
  color: var(--mori-ink-strong) !important;
}
body.theme-clarity .fp-download-link img,
body.theme-clarity .qp-download-list img,
body.theme-clarity .dp-download-link img { width: 20px; height: 20px; filter: invert(1) opacity(.62); }
body.theme-clarity .fp-download-link strong,
body.theme-clarity .qp-download-list strong,
body.theme-clarity .dp-download-link strong { color: var(--mori-ink-strong); font-size: 13px; font-weight: 500; }
body.theme-clarity .fp-download-link small,
body.theme-clarity .qp-download-list small,
body.theme-clarity .dp-download-link small { color: var(--mori-ink-muted); font-size: 11px; }
body.theme-clarity .fp-download-link:hover,
body.theme-clarity .qp-download-list a:hover,
body.theme-clarity .dp-download-link:hover { border-color: var(--cl-accent-border); background: var(--cl-accent-soft); opacity: 1; }

body.theme-xiuxian .fp-download-link,
body.theme-xiuxian .qp-download-list a,
body.theme-xiuxian .dp-download-link {
  height: 48px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--x-gold-line);
  background: var(--mori-surface-content);
  color: var(--mori-ink-strong) !important;
  clip-path: polygon(0 6px, 6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
}
body.theme-xiuxian .fp-download-link img,
body.theme-xiuxian .qp-download-list img,
body.theme-xiuxian .dp-download-link img { width: 20px; height: 20px; filter: invert(1) sepia(.45) saturate(1.1); }
body.theme-xiuxian .fp-download-link strong,
body.theme-xiuxian .qp-download-list strong,
body.theme-xiuxian .dp-download-link strong {
  color: var(--mori-ink-strong);
  font: 600 14px/20px var(--x-serif);
  letter-spacing: .04em;
}
body.theme-xiuxian .fp-download-link small,
body.theme-xiuxian .qp-download-list small,
body.theme-xiuxian .dp-download-link small { color: var(--mori-ink-muted); font-size: 11px; }
body.theme-xiuxian .fp-download-link:hover,
body.theme-xiuxian .qp-download-list a:hover,
body.theme-xiuxian .dp-download-link:hover { border-color: var(--x-gold); background: color-mix(in srgb, var(--x-gold-pale) 26%, var(--mori-surface-content)); opacity: 1; }

/* santiz / qizai body copy kept the host ice-blue accent */
body.theme-xiuxian .sp-page .sp-capability p,
body.theme-xiuxian .sp-page .sp-capability li,
body.theme-xiuxian .sp-page .sp-local-capabilities p,
body.theme-xiuxian .sp-page .sp-local-capabilities li { color: var(--mori-ink-muted); }
body.theme-xiuxian .sp-page .sp-capability ul,
body.theme-xiuxian .sp-page .sp-local-capabilities ul { padding-left: 0; margin: 10px 0 0; list-style: none; }
body.theme-xiuxian .sp-page .sp-capability li,
body.theme-xiuxian .sp-page .sp-local-capabilities li { position: relative; padding-left: 14px; }
body.theme-xiuxian .sp-page .sp-capability li::before,
body.theme-xiuxian .sp-page .sp-local-capabilities li::before {
  position: absolute;
  top: 7px;
  left: 0;
  width: 4px;
  height: 4px;
  background: var(--x-gold);
  content: "";
  transform: rotate(45deg);
}

/* about: the technical columns are blocks, not archive rows */
body.theme-xiuxian .ap-technical > section {
  display: block;
  padding: 0;
  border: 0;
  background: none;
}
body.theme-xiuxian .ap-technical > section .mori-x-row__bullet { display: none; }
body.theme-xiuxian .ap-technical .ap-blocks { margin-top: 14px; }
body.theme-xiuxian .ap-products-section { margin-top: 32px; }
body.theme-clarity .ap-products-section { margin-top: 32px; }

/* home archive gate: three even fields (email / hotline / address) */
body.theme-xiuxian .mori-x-gateway .hp-contact { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
body.theme-xiuxian .mori-x-gateway .hp-address { grid-column: auto; }

/* ══════════════════════════════════════════════════════════════════════════
   Host normalisation — third pass (feature row, download headings, santiz
   capability / market / hosting, qizai services and agent band)
   ══════════════════════════════════════════════════════════════════════ */

/* fafa: the host carousel gives each card its own width and pushes the third
   card past the shell edge; three even columns read as one row of features */
body.theme-clarity .fp-feature-track,
body.theme-xiuxian .fp-feature-track {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  overflow: visible;
}
body.theme-clarity .fp-feature,
body.theme-xiuxian .fp-feature { width: auto; min-width: 0; flex: none; }
body.theme-clarity .fp-feature-controls,
body.theme-xiuxian .fp-feature-controls { display: none; }

/* download headings: the host sets a 24px lead-in above a 20px title */
body.theme-clarity .fp-download-copy > p,
body.theme-clarity .qp-download-copy > p {
  margin: 0;
  color: var(--mori-ink-faint);
  font-size: 11px;
  line-height: 16px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body.theme-clarity .fp-download-copy > h2,
body.theme-clarity .qp-download-copy > h2 {
  margin: 6px 0 24px;
  font-size: 22px;
  line-height: 30px;
  font-weight: 600;
}
body.theme-clarity .fp-download-group > h3,
body.theme-clarity .qp-download-group > h3 {
  margin: 0 0 12px;
  color: var(--mori-ink-faint);
  font-size: 11px;
  line-height: 16px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.theme-xiuxian .fp-download-copy > p,
body.theme-xiuxian .qp-download-copy > p {
  margin: 0;
  color: var(--x-gold);
  font: 500 12px/18px var(--x-serif);
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.theme-xiuxian .fp-download-copy > h2,
body.theme-xiuxian .qp-download-copy > h2 {
  margin: 6px 0 20px;
  color: var(--mori-ink-strong);
  font: 600 24px/32px var(--x-serif);
  letter-spacing: .04em;
}

/* santiz: capability blades keep the host's 54px track and clip their title */
body.theme-clarity .sp-page .sp-capability.mori-cl-card,
body.theme-xiuxian .sp-page .sp-capability.mori-x-blade {
  display: flex;
  height: auto;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
}
body.theme-clarity .sp-page .sp-capability .mori-cl-card__body,
body.theme-xiuxian .sp-page .sp-capability .mori-x-blade__body {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
  padding: 0;
}
body.theme-clarity .sp-page .sp-capability img,
body.theme-xiuxian .sp-page .sp-capability img { display: block; flex: 0 0 20px; width: 20px; height: 20px; margin: 0; }
body.theme-clarity .sp-page .sp-capability.mori-cl-card { justify-content: flex-start; }
body.theme-clarity .sp-page .sp-capability .mori-cl-card__body { width: 100%; justify-content: flex-start; }
body.theme-clarity .sp-page .sp-capability h2 { text-align: left; }
body.theme-xiuxian .sp-page .sp-capability .mori-x-blade__cord { display: none; }
body.theme-xiuxian .sp-page .sp-capability .mori-x-blade__body { width: 100%; justify-content: flex-start; text-align: left; }
body.theme-xiuxian .sp-page .sp-capability h2 { text-align: left; }
body.theme-clarity .sp-page .sp-capability h2 {
  margin: 0;
  color: var(--mori-ink-strong);
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
}
body.theme-xiuxian .sp-page .sp-capability h2 {
  margin: 0;
  color: var(--mori-ink-strong);
  font: 600 17px/24px var(--x-serif);
  letter-spacing: .04em;
}

/* santiz: the highlight list is a 24px quote rail and sits before the copy */
body.theme-clarity .sp-page .sp-market-copy,
body.theme-xiuxian .sp-page .sp-market-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 48px;
  align-items: start;
}
body.theme-clarity .sp-page .sp-market-copy > div,
body.theme-xiuxian .sp-page .sp-market-copy > div { grid-column: 1; grid-row: 1; }
body.theme-clarity .sp-page .sp-market-copy .sp-highlight-list,
body.theme-xiuxian .sp-page .sp-market-copy .sp-highlight-list {
  grid-column: 2;
  grid-row: 1;
  gap: 16px;
  margin: 0;
}
body.theme-clarity .sp-page .sp-highlight-list li { font-size: 14px; line-height: 22px; font-weight: 500; border-left-color: var(--cl-accent); }
body.theme-xiuxian .sp-page .sp-highlight-list li {
  color: var(--mori-ink-base);
  font: 500 14px/22px var(--x-serif);
  letter-spacing: .02em;
  border-left-color: var(--x-cinnabar);
}
body.theme-clarity .sp-page .sp-market-copy > div > h2,
body.theme-xiuxian .sp-page .sp-market-copy > div > h2 { margin-top: 0; }
body.theme-clarity .sp-page .sp-hosting-copy,
body.theme-xiuxian .sp-page .sp-hosting-copy { padding: 0; }
body.theme-clarity .sp-page .sp-market-section,
body.theme-xiuxian .sp-page .sp-market-section { margin-top: 48px; }
body.theme-clarity .sp-page .sp-local-section,
body.theme-xiuxian .sp-page .sp-local-section { margin-top: 48px; }
body.theme-clarity .sp-page .sp-local-section .sp-content,
body.theme-xiuxian .sp-page .sp-local-section .sp-content { gap: 24px; }
body.theme-clarity .sp-page .sp-hosting-section,
body.theme-clarity .sp-page .sp-contact {
  padding-top: 24px;
  border-top: 1px solid var(--cl-soft);
}
body.theme-xiuxian .sp-page .sp-hosting-section,
body.theme-xiuxian .sp-page .sp-contact {
  padding-top: 24px;
  border-top: 1px solid var(--x-gold-soft);
}
body.theme-clarity .sp-page .sp-trading-capabilities li {
  padding-top: 12px;
  border-top: 1px solid var(--cl-soft);
  color: var(--mori-ink-muted);
  font-size: 13px;
  line-height: 20px;
}
body.theme-xiuxian .sp-page .sp-trading-capabilities li {
  padding-top: 12px;
  border-top: 1px solid var(--x-gold-soft);
  color: var(--mori-ink-muted);
  font: 400 13px/21px var(--x-serif);
}

/* qizai: primary card plus a 112px-gapped stack leaves a stranded column */
body.theme-clarity .qp-services,
body.theme-xiuxian .qp-services {
  display: grid;
  min-height: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding: 24px 0 8px;
  align-items: stretch;
}
body.theme-clarity .qp-service,
body.theme-xiuxian .qp-service {
  display: block;
  width: auto;
  min-width: 0;
  min-height: 0;
  height: auto;
  grid-column: auto;
  grid-row: auto;
}
body.theme-clarity .qp-service-stack,
body.theme-xiuxian .qp-service-stack { display: contents; }

body.theme-clarity .qp-agent-inner > h2 { margin: 0 0 16px; font-size: 18px; line-height: 26px; }
body.theme-xiuxian .qp-agent-inner > h2 { margin: 0 0 16px; font: 600 22px/30px var(--x-serif); }
body.theme-clarity .qp-agent-panel,
body.theme-xiuxian .qp-agent-panel { display: block; margin: 0 0 28px; }
body.theme-clarity .qp-agent-panel img,
body.theme-xiuxian .qp-agent-panel img {
  width: 100%;
  height: 96px;
  border-radius: 12px;
  object-fit: cover;
  opacity: .3;
  filter: grayscale(1);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
body.theme-xiuxian .qp-agent-panel img { filter: grayscale(1) sepia(.5); }

body.theme-clarity .qp-capability-grid .mori-cl-stat img,
body.theme-xiuxian .qp-capability-grid .mori-x-vein__body img { width: 44px; height: 44px; margin: 8px 0 14px; }
/* xiuxian stamps its own stage number on the rail, the host prefix would repeat it */
body.theme-xiuxian .qp-capability-grid .mori-x-vein__body > span { display: none; }
body.theme-clarity .qp-capability-grid .mori-cl-stat p {
  margin: 0;
  color: var(--mori-ink-strong);
  font-size: 14px;
  line-height: 21px;
  font-weight: 500;
}
body.theme-xiuxian .qp-capability-grid .mori-x-vein__body p {
  margin: 0;
  color: var(--mori-ink-strong);
  font: 500 15px/22px var(--x-serif);
}
body.theme-clarity .qp-capability-grid .mori-cl-stat h3 {
  margin: 4px 0 0;
  color: var(--mori-ink-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}
body.theme-xiuxian .qp-capability-grid .mori-x-vein__body h3 {
  margin: 4px 0 0;
  color: var(--mori-ink-muted);
  font: 400 12px/18px var(--x-serif);
}

/* footer column heads read as quiet labels, not page headings */
body.theme-clarity .hp-footer .hp-footer-column h2 {
  margin: 0 0 14px;
  color: var(--mori-ink-faint);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.theme-xiuxian .hp-footer .hp-footer-column h2 {
  margin: 0 0 14px;
  color: var(--x-gold);
  font: 600 12px/18px var(--x-serif);
  letter-spacing: .16em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  body.theme-clarity .fp-feature-track,
  body.theme-xiuxian .fp-feature-track,
  body.theme-clarity .fp-download-groups,
  body.theme-clarity .qp-download-groups,
  body.theme-xiuxian .fp-download-groups,
  body.theme-xiuxian .qp-download-groups,
  body.theme-clarity .qp-services,
  body.theme-xiuxian .qp-services,
  body.theme-clarity .sp-page .sp-market-copy,
  body.theme-xiuxian .sp-page .sp-market-copy { grid-template-columns: minmax(0, 1fr); }
  body.theme-clarity .sp-page .sp-market-copy > div,
  body.theme-xiuxian .sp-page .sp-market-copy > div,
  body.theme-clarity .sp-page .sp-market-copy .sp-highlight-list,
  body.theme-xiuxian .sp-page .sp-market-copy .sp-highlight-list { grid-column: 1; grid-row: auto; }
  body.theme-clarity .fp-download,
  body.theme-clarity .qp-download,
  body.theme-xiuxian .fp-download,
  body.theme-xiuxian .qp-download { grid-template-columns: minmax(0, 1fr); }
  body.theme-clarity .fp-download-art,
  body.theme-xiuxian .fp-download-art,
  body.theme-clarity .qp-download-art,
  body.theme-xiuxian .qp-download-art { display: none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   Responsive shell
   ══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1279px) {
  body.theme-clarity main.mori-cl-panel { width: min(1200px, calc(100% - 176px)); }
}
@media (max-width: 900px) {
  body.theme-clarity .hp-service-grid { grid-template-columns: 1fr; }
  body.theme-clarity .hp-latency-copy { grid-template-columns: 1fr; }
  body.theme-clarity .mori-cl-stat { border-left: 0; border-top: 1px solid var(--cl-soft); padding: 16px 0; }
  body.theme-clarity .mori-cl-stat:first-child { border-top: 0; padding-top: 0; }
  body.theme-clarity .hp-contact { grid-template-columns: 1fr; }
  body.theme-clarity .sp-page .sp-capability-grid,
  body.theme-clarity .sp-page .sp-local-capabilities { grid-template-columns: 1fr; }
  body.theme-xiuxian .hp-service-grid,
  body.theme-xiuxian .ap-focus,
  body.theme-xiuxian .mori-x-gateway .hp-contact,
  body.theme-xiuxian .sp-page .sp-capability-grid,
  body.theme-xiuxian .sp-page .sp-local-capabilities { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  body.theme-clarity .dp-download-columns,
  body.theme-xiuxian .dp-download-columns { grid-template-columns: minmax(0, 1fr); }
  body.theme-clarity .dp-download-link,
  body.theme-xiuxian .dp-download-link { height: auto; min-height: 48px; padding: 8px 10px; }
  body.theme-clarity .dp-download-link > span,
  body.theme-xiuxian .dp-download-link > span { white-space: normal; }
  body.theme-clarity .mori-cl-masthead { height: 64px; }
  body.theme-clarity .mori-cl-masthead__inner { width: calc(100% - 24px); gap: 10px; }
  body.theme-clarity .mori-cl-menu { display: grid; place-items: center; }
  body.theme-clarity .mori-cl-brand__sub { display: none; }
  body.theme-clarity .mori-cl-crumb { display: none; }
  body.theme-clarity .mori-cl-locale { height: 28px; padding: 0 6px; }
  body.theme-clarity .mori-cl-dot { width: 32px; height: 32px; font-size: 13px; }
  body.theme-clarity .mori-cl-rail { display: none; }
  body.theme-clarity .mori-cl-flyout { display: none; }
  body.theme-clarity main.mori-cl-panel {
    width: calc(100% - 24px);
    min-height: calc(100vh - 96px);
    margin: 80px auto 12px;
    border-radius: var(--mori-radius-xl);
  }
  body.theme-clarity .mori-cl-head { top: 64px; padding: 18px 16px 14px; border-radius: var(--mori-radius-xl) var(--mori-radius-xl) 0 0; }
  body.theme-clarity .mori-cl-head__body h1 { font-size: 20px; line-height: 27px; }
  body.theme-clarity .mori-cl-legal { height: 30px; padding: 0 16px; font-size: 10px; border-radius: 0 0 var(--mori-radius-xl) var(--mori-radius-xl); }
  body.theme-clarity .hp-retail,
  body.theme-clarity .hp-latency,
  body.theme-clarity .hp-company,
  body.theme-clarity .hp-licence,
  body.theme-clarity .hp-office,
  body.theme-clarity .ap-products-section,
  body.theme-clarity .ap-technical-section,
  body.theme-clarity .ap-office-section,
  body.theme-clarity .sp-local-section,
  body.theme-clarity .sp-trading-section,
  body.theme-clarity .sp-hosting-section,
  body.theme-clarity .sp-contact { padding: 0 16px; margin-bottom: 36px; }
  body.theme-clarity .hp-footer { width: calc(100% - 32px); }
  body.theme-clarity .mori-cl-row dt { flex-basis: 45%; }
  body.theme-xiuxian .mori-x-gate { height: 56px; }
  body.theme-xiuxian .mori-x-gate__inner { width: calc(100% - 24px); gap: 10px; }
  body.theme-xiuxian .mori-x-menu { display: grid; place-items: center; }
  body.theme-xiuxian .mori-x-brand__sub { display: none; }
  body.theme-xiuxian .mori-x-crumb { display: none; }
  body.theme-xiuxian .mori-x-ladder { display: none; }
  body.theme-xiuxian .mori-x-terrace { display: none; }
  body.theme-xiuxian main.mori-x-stele {
    width: calc(100% - 24px);
    min-height: calc(100vh - 96px);
    margin: 80px auto 20px;
    clip-path: polygon(0 8px, 8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px));
  }
  body.theme-xiuxian .mori-x-cover { padding: 24px 16px 0; }
  body.theme-xiuxian .mori-x-cover__body h1 { font-size: 26px; line-height: 36px; }
  body.theme-xiuxian .hp-retail,
  body.theme-xiuxian .hp-latency,
  body.theme-xiuxian .hp-company,
  body.theme-xiuxian .hp-licence,
  body.theme-xiuxian .hp-office,
  body.theme-xiuxian .ap-products-section,
  body.theme-xiuxian .ap-technical-section,
  body.theme-xiuxian .ap-office-section,
  body.theme-xiuxian .sp-local-section,
  body.theme-xiuxian .sp-trading-section,
  body.theme-xiuxian .sp-hosting-section,
  body.theme-xiuxian .sp-contact { padding: 0 16px; margin-bottom: 32px; }
  body.theme-xiuxian .mori-x-stage { margin-top: 36px; }
  body.theme-xiuxian .mori-x-stage h2 { font-size: 18px; line-height: 24px; }
  body.theme-xiuxian .mori-x-gateway__frame { padding: 24px 20px; }
  body.theme-xiuxian .hp-footer,
  body.theme-xiuxian .ap-footer,
  body.theme-xiuxian .fp-footer,
  body.theme-xiuxian .sp-footer,
  body.theme-xiuxian .qp-footer,
  body.theme-xiuxian .dp-footer { width: calc(100% - 32px); }
}
@media (prefers-reduced-motion: reduce) {
  .mori-cl-rail,
  .mori-cl-flyout,
  .mori-cl-drawer,
  .mori-cl-drawer__panel,
  .mori-x-peak__label,
  .mori-x-terrace,
  .mori-x-drawer,
  .mori-x-drawer__panel,
  .mori-x-drawer__items { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   clarity / qizai pilot — page body rebuilt from spec/clarity (48ca32f) and
   spec/qizai/composition.md. No host class carries layout here; the host
   sections are hidden wholesale and the manifest components are rebuilt from
   extracted text, hrefs and asset URLs.
   ═══════════════════════════════════════════════════════════════════════════ */
body.mori-cl-qz-page .qp-grid,
body.mori-cl-qz-page .mori-cl-qz-hidden { display: none !important; }
body.mori-cl-qz-page .qp-hero {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

body.theme-clarity .mori-cl-qz {
  padding: 40px 48px 56px;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
  font-variant-numeric: tabular-nums;
}

/* page head */
.mori-cl-qz .mori-cl-ph {
  padding-bottom: 32px;
  border-bottom: 1px solid var(--cl-hair);
}
.mori-cl-qz .mori-cl-ph__title {
  margin: 0;
  color: var(--mori-ink-strong);
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  letter-spacing: 0;
}
.mori-cl-qz .mori-cl-ph__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}
.mori-cl-qz .mori-cl-tag {
  display: inline-grid;
  min-height: 24px;
  padding: 0 8px;
  place-items: center;
  border-radius: 6px;
  background: var(--cl-fill);
  color: var(--mori-ink-muted);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0;
}
.mori-cl-qz .mori-cl-action {
  display: inline-grid;
  min-height: 36px;
  padding: 0 20px;
  place-items: center;
  border-radius: 18px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
}
.mori-cl-qz .mori-cl-action--primary {
  background: var(--mori-ink-strong);
  color: #ffffff;
}
.mori-cl-qz .mori-cl-action--primary:hover {
  background: #000000;
  color: #ffffff;
}
.mori-cl-qz .mori-cl-action:focus-visible {
  outline: 2px solid var(--cl-accent);
  outline-offset: 3px;
}

/* sections */
.mori-cl-qz .mori-cl-sec { margin-top: 40px; }
.mori-cl-qz .mori-cl-sec + .mori-cl-sec { margin-top: 48px; }
.mori-cl-qz .mori-cl-sec__eyebrow {
  display: block;
  margin: 0 0 6px;
  color: var(--mori-ink-faint);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: .04em;
}
.mori-cl-qz .mori-cl-sec__title {
  margin: 0 0 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--cl-hair);
  color: var(--mori-ink-strong);
  font-size: 20px;
  line-height: 25px;
  font-weight: 600;
  letter-spacing: 0;
}
.mori-cl-qz .mori-cl-sec__body {
  margin: 0;
  max-width: 68ch;
  color: var(--mori-ink-base);
  font-size: 14px;
  line-height: 22px;
}

/* definition table */
.mori-cl-qz .mori-cl-dl { margin: 24px 0 0; }
.mori-cl-qz .mori-cl-dl__row {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  align-items: center;
  min-height: 44px;
  border-bottom: 1px solid var(--cl-hair);
}
.mori-cl-qz .mori-cl-dl__row:first-child { border-top: 1px solid var(--cl-hair); }
.mori-cl-qz .mori-cl-dl__key {
  margin: 0;
  color: var(--mori-ink-muted);
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
}
.mori-cl-qz .mori-cl-dl__value {
  margin: 0;
  color: var(--mori-ink-strong);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* two-card grid */
.mori-cl-qz .mori-cl-grid2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.mori-cl-qz .mori-cl-gridcard {
  padding: 16px 20px;
  border: 1px solid var(--cl-hair);
  border-radius: 8px;
  background: var(--mori-surface-card);
}
.mori-cl-qz .mori-cl-gridcard__title {
  margin: 0;
  color: var(--mori-ink-strong);
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
}
.mori-cl-qz .mori-cl-gridcard__body {
  margin: 8px 0 0;
  color: var(--mori-ink-muted);
  font-size: 14px;
  line-height: 22px;
}

/* catalogue list */
.mori-cl-qz .mori-cl-list { margin-top: 8px; }
.mori-cl-qz .mori-cl-list__group {
  margin: 32px 0 0;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--cl-hair);
  color: var(--mori-ink-strong);
  font-size: 20px;
  line-height: 25px;
  font-weight: 600;
  letter-spacing: 0;
}
.mori-cl-qz .mori-cl-list__row {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 4px;
  border-bottom: 1px solid var(--cl-hair);
  color: var(--mori-ink-base);
  text-decoration: none;
  transition: background-color .15s ease-out;
}
.mori-cl-qz .mori-cl-list__row:hover { background: var(--cl-fill); }
.mori-cl-qz .mori-cl-list__row:focus-visible {
  outline: 2px solid var(--cl-accent);
  outline-offset: 3px;
}
.mori-cl-qz .mori-cl-list__title {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.mori-cl-qz .mori-cl-list__trailing {
  color: var(--cl-accent);
  font-size: 12px;
  line-height: 20px;
}

@media (max-width: 760px) {
  body.theme-clarity .mori-cl-qz { padding: 24px 20px 40px; }
  .mori-cl-qz .mori-cl-ph__title { font-size: 22px; line-height: 30px; }
  .mori-cl-qz .mori-cl-sec__title,
  .mori-cl-qz .mori-cl-list__group { font-size: 18px; line-height: 24px; }
  .mori-cl-qz .mori-cl-grid2 { grid-template-columns: minmax(0, 1fr); }
  .mori-cl-qz .mori-cl-dl__row {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    padding: 10px 0;
  }
  .mori-cl-qz .mori-cl-dl__row:first-child { border-top: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   xiuxian / qizai pilot — page body rebuilt from spec/xiuxian (66e28a3) and
   spec/qizai/composition-xiuxian.md. Soul-only seed: values are declared, not
   measured. The host carries no layout inside the rebuilt root.
   ═══════════════════════════════════════════════════════════════════════════ */
body.mori-x-qz-page .qp-grid,
body.mori-x-qz-page .mori-x-qz-hidden { display: none !important; }
body.mori-x-qz-page .qp-hero {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

body.theme-xiuxian .mori-x-qz {
  padding: 48px 56px 64px;
  color: var(--mori-ink-strong);
  font-family: var(--x-serif);
  font-variant-numeric: tabular-nums;
}
.mori-x-qz .mori-x-qz-gate,
.mori-x-qz .mori-x-qz-body { max-width: 920px; }

/* gate */
.mori-x-qz .mori-x-qz-gate {
  display: flex;
  background: transparent;
  backdrop-filter: none;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 72px;
}
.mori-x-qz .mori-x-qz-seal {
  display: inline-grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
  background: var(--x-cinnabar);
  color: var(--mori-surface-content);
  font: 600 18px/1 var(--x-serif);
}
.mori-x-qz .mori-x-qz-gate__body { min-width: 0; padding-top: 2px; }
.mori-x-qz .mori-x-qz-gate__title {
  margin: 0;
  color: var(--mori-ink-strong);
  font-size: 34px;
  line-height: 46px;
  font-weight: 600;
  letter-spacing: .02em;
}
.mori-x-qz .mori-x-qz-gate__meta {
  margin: 10px 0 0;
  color: var(--mori-ink-muted);
  font-size: 12px;
  line-height: 20px;
  letter-spacing: .08em;
}
.mori-x-qz .mori-x-qz-action {
  display: inline-grid;
  min-height: 40px;
  margin-top: 18px;
  padding: 0 20px;
  place-items: center;
  border: 1px solid var(--x-cinnabar);
  background: transparent;
  color: var(--x-cinnabar);
  font-size: 13px;
  line-height: 20px;
  text-decoration: none;
  transition: color .15s ease-out, border-color .15s ease-out;
}
.mori-x-qz .mori-x-qz-action:hover {
  border-color: var(--mori-ink-strong);
  background: transparent;
  color: var(--mori-ink-strong);
}
.mori-x-qz .mori-x-qz-action:focus-visible {
  outline: 1px solid var(--x-cinnabar);
  outline-offset: 2px;
}

/* spine and sections */
.mori-x-qz .mori-x-qz-body { position: relative; padding-left: 40px; }
.mori-x-qz .mori-x-qz-spine {
  position: absolute;
  top: 13px;
  bottom: 0;
  left: 0;
  width: 1px;
  background: var(--x-gold-line);
}
.mori-x-qz .mori-x-qz-passage { position: relative; }
.mori-x-qz .mori-x-qz-passage + .mori-x-qz-passage { margin-top: 72px; }
.mori-x-qz .mori-x-qz-node {
  position: absolute;
  top: 13px;
  left: -43px;
  width: 6px;
  height: 6px;
  background: var(--x-cinnabar);
  transform: rotate(45deg);
}

/* scripture */
.mori-x-qz .mori-x-qz-h2 {
  margin: 0 0 16px;
  color: var(--mori-ink-strong);
  font-size: 22px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: 0;
}
.mori-x-qz .mori-x-qz-p {
  margin: 0;
  max-width: 62ch;
  color: var(--mori-ink-base);
  font-size: 15px;
  line-height: 28px;
}
.mori-x-qz .mori-x-qz-entries { margin-top: 32px; }
.mori-x-qz .mori-x-qz-entry + .mori-x-qz-entry { margin-top: 32px; }
.mori-x-qz .mori-x-qz-h3 {
  margin: 0 0 8px;
  color: var(--mori-ink-strong);
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
}

/* ledger */
.mori-x-qz .mori-x-qz-ledger {
  display: flex;
  margin: 32px 0 0;
  padding-top: 24px;
  border-top: 1px solid var(--x-gold-soft);
}
.mori-x-qz .mori-x-qz-unit {
  flex: 1 1 0;
  min-width: 0;
  padding: 0 24px;
}
.mori-x-qz .mori-x-qz-unit:first-child { padding-left: 0; }
.mori-x-qz .mori-x-qz-unit + .mori-x-qz-unit { border-left: 1px solid var(--x-gold-line); }
.mori-x-qz .mori-x-qz-label {
  margin: 0;
  color: var(--mori-ink-muted);
  font-size: 12px;
  line-height: 20px;
  letter-spacing: .08em;
}
.mori-x-qz .mori-x-qz-value {
  margin: 8px 0 0;
  color: var(--mori-ink-strong);
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
}

/* stairs */
.mori-x-qz .mori-x-qz-eyebrow {
  margin: 0 0 8px;
  color: var(--mori-ink-muted);
  font-size: 12px;
  line-height: 20px;
  letter-spacing: .08em;
}
.mori-x-qz .mori-x-qz-group { margin-top: 32px; }
.mori-x-qz .mori-x-qz-group__label {
  margin: 0 0 4px;
  color: var(--mori-ink-strong);
  font-size: 14px;
  line-height: 24px;
  font-weight: 600;
}
.mori-x-qz .mori-x-qz-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 56px;
  border-bottom: 1px solid var(--x-gold-soft);
  color: var(--mori-ink-strong);
  text-decoration: none;
  transition: border-color .15s ease-out;
}
.mori-x-qz .mori-x-qz-row:hover { border-bottom-color: var(--x-gold-line); }
.mori-x-qz .mori-x-qz-row__title { font-size: 16px; line-height: 24px; }
.mori-x-qz .mori-x-qz-row__mark {
  color: var(--x-cinnabar);
  font-size: 12px;
  line-height: 20px;
  transition: transform .15s ease-out;
}
.mori-x-qz .mori-x-qz-row:hover .mori-x-qz-row__mark { transform: translateY(2px); }
.mori-x-qz .mori-x-qz-row:focus-visible {
  outline: 1px solid var(--x-cinnabar);
  outline-offset: 2px;
}

@media (max-width: 760px) {
  body.theme-xiuxian .mori-x-qz { padding: 28px 20px 48px; }
  .mori-x-qz .mori-x-qz-gate { gap: 16px; margin-bottom: 48px; }
  .mori-x-qz .mori-x-qz-gate__title { font-size: 26px; line-height: 36px; }
  .mori-x-qz .mori-x-qz-body { padding-left: 28px; }
  .mori-x-qz .mori-x-qz-node { left: -31px; }
  .mori-x-qz .mori-x-qz-passage + .mori-x-qz-passage { margin-top: 56px; }
  .mori-x-qz .mori-x-qz-h2 { font-size: 20px; line-height: 30px; }
  .mori-x-qz .mori-x-qz-ledger {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
  .mori-x-qz .mori-x-qz-unit { padding: 0; }
  .mori-x-qz .mori-x-qz-unit + .mori-x-qz-unit { border-left: 0; }
  .mori-x-qz .mori-x-qz-row { min-height: 52px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   grove-telemetry — 林场遥测 (Grove Telemetry)
   Same cyber seed as cibo's signal-desk, re-skinned for the pandabrokerage
   DOM: moss sheet under a contour survey grid, cut-corner telemetry sheets,
   leaf-glow readouts, sap-amber survey band. The host header/nav stays (this
   theme is a value + shape pass, not a replacement shell); recompose rebuilds
   the page modules as mori-band / mori-readout / mori-pair / mori-section.
   ══════════════════════════════════════════════════════════════════════════ */
body.theme-grove-telemetry {
  background-color: var(--mori-surface-page);
  background-image: linear-gradient(180deg, #0a1712 0%, #12261d 100%);
  background-attachment: fixed;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-mono);
  font-size: 14px;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
  color-scheme: dark;
  -webkit-font-smoothing: antialiased;
}
body.theme-grove-telemetry::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(183, 211, 168, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(183, 211, 168, .055) 1px, transparent 1px);
  background-size: 20px 20px;
}
body.theme-grove-telemetry::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg width='160' height='160' viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%234f7d5f' stroke-width='1' opacity='.5'%3E%3Cellipse cx='80' cy='80' rx='52' ry='34'/%3E%3Cellipse cx='80' cy='80' rx='38' ry='24'/%3E%3Cellipse cx='80' cy='80' rx='24' ry='15'/%3E%3C/g%3E%3Cpath d='M14 126 L44 108 L68 118 L96 82 L124 92 L146 60' fill='none' stroke='%23d7a94a' stroke-width='2' opacity='.55'/%3E%3Ccircle cx='96' cy='82' r='3' fill='%23d7a94a' opacity='.7'/%3E%3C/svg%3E");
  opacity: .16;
  animation: mori-grove-breathe 4s ease-in-out infinite alternate;
}
@keyframes mori-grove-breathe {
  from { opacity: .10; }
  to   { opacity: .26; }
}
@keyframes mori-grove-pulse {
  from { box-shadow: 0 0 0 .35em rgba(183, 211, 168, .35); }
  to   { box-shadow: 0 0 0 1em rgba(183, 211, 168, .08); }
}
body.theme-grove-telemetry main,
body.theme-grove-telemetry section,
body.theme-grove-telemetry footer { background-color: transparent; }
body.theme-grove-telemetry .hp-page,
body.theme-grove-telemetry .ap-page,
body.theme-grove-telemetry .fp-page,
body.theme-grove-telemetry .sp-page,
body.theme-grove-telemetry .qp-page,
body.theme-grove-telemetry .dp-page {
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-mono);
}
body.theme-grove-telemetry a { color: var(--mori-accent-highlight); text-underline-offset: 2px; }
body.theme-grove-telemetry a:hover { color: #dff0d2; }
body.theme-grove-telemetry :is(h1, h2, h3, h4) {
  color: var(--mori-ink-strong);
  font-family: var(--mori-type-serif);
  font-weight: 700;
  letter-spacing: .02em;
}
body.theme-grove-telemetry ::selection { background: rgba(183, 211, 168, .25); color: var(--mori-ink-strong); }
body.theme-grove-telemetry :is(button, a, input, select):focus-visible {
  outline: 2px solid var(--mori-accent-highlight);
  outline-offset: 2px;
}

/* ── host header: the seed's canopy band ─────────────────────────────────── */
/* The seed bar is a solid moss plate with a hazard profile cut from its
   bottom edge, not a dark box with a hairline: the plate is the identity. */
body.theme-grove-telemetry :is(.hp-desktop-header, .hp-mobile-header) {
  background: linear-gradient(180deg, #5a8a6a, var(--mori-accent-primary));
  border-bottom: 0;
  box-shadow: inset 0 0 0 1px rgba(183, 211, 168, .25), 0 10px 30px rgba(0, 0, 0, .4);
  clip-path: polygon(0 80%, 2% 100%, 35% 100%, 40% 75%, 60% 75%, 65% 100%, 98% 100%, 100% 80%, 100% 0, 0 0);
}
body.theme-grove-telemetry :is(.hp-desktop-header, .hp-mobile-header)::after {
  content: "";
  position: absolute;
  left: 10px;
  right: auto;
  top: 0;
  bottom: auto;
  width: 88px;
  height: 11px;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, #d7a94a 0 7px, transparent 7px 14px);
  transform: skewX(25deg);
  transform-origin: top left;
  opacity: .9;
}
/* a phone header is too short for the bar's centre notch — it would cut the
   hamburger. Keep the plate and the hatch, drop the profile. */
@media (max-width: 1023px) {
  body.theme-grove-telemetry .hp-mobile-header {
    clip-path: none;
    border-bottom: 2px solid rgba(215, 169, 74, .55);
  }
}
body.theme-grove-telemetry .hp-header-brand img,
body.theme-grove-telemetry .hp-mobile-header img,
body.theme-grove-telemetry .hp-footer-brand img {
  filter: brightness(0) invert(1) sepia(.35) saturate(1.4) hue-rotate(55deg);
  opacity: .92;
}
body.theme-grove-telemetry .hp-desktop-nav a {
  color: #0e1f18;
  font-family: var(--mori-type-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .hp-desktop-nav a:hover {
  color: #142a20;
  text-shadow: 0 0 8px rgba(207, 224, 189, .85);
}
body.theme-grove-telemetry .hp-desktop-nav a[aria-current],
body.theme-grove-telemetry .hp-desktop-nav a.is-active {
  background: transparent;
  border-color: #142a20;
  color: #142a20;
  box-shadow: inset 0 -2px 0 #142a20;
}
body.theme-grove-telemetry .hp-language-switch a {
  border: 1px solid rgba(14, 31, 24, .45);
  color: #0e1f18;
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .hp-language-switch a:hover { border-color: #142a20; color: #142a20; }
body.theme-grove-telemetry .hp-language-switch a.is-active {
  background: #142a20;
  border-color: var(--mori-accent-highlight);
  color: #cfe0bd;
}

/* ── hero: a survey sheet, serif display over a mono standfirst ──────────── */
body.theme-grove-telemetry :is(.hp-hero, .ap-hero, .fp-hero, .sp-hero, .qp-hero) {
  background:
    linear-gradient(180deg, rgba(79, 125, 95, .16), transparent 65%),
    var(--mori-surface-content);
  border: 1px solid var(--mori-accent-card-border);
  border-left: 3px solid var(--mori-accent-highlight);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%);
}
body.theme-grove-telemetry :is(.hp-hero h1, .ap-title, .fp-hero-copy h1, .sp-hero-copy h1, .qp-hero-copy h1) {
  font-family: var(--mori-type-display);
  font-size: clamp(30px, 3.6vw, 46px);
  line-height: 1.12;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--mori-ink-strong);
  text-shadow: 0 0 18px rgba(183, 211, 168, .18);
}
body.theme-grove-telemetry :is(.hp-hero-description, .ap-standfirst, .fp-hero-copy p, .sp-hero-copy p) {
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-mono);
  font-size: 13px;
  letter-spacing: .02em;
}
body.theme-grove-telemetry .hp-hero-copy::after {
  content: "";
  display: block;
  width: 64px;
  height: 3px;
  margin-top: 18px;
  background: linear-gradient(90deg, var(--mori-accent-highlight), transparent);
}
body.theme-grove-telemetry .hp-hero-panda img,
body.theme-grove-telemetry .hp-company-mark img {
  filter: brightness(0) invert(1) sepia(.3) saturate(1.2) hue-rotate(50deg);
  opacity: .28;
}

/* ── section survey bars (recompose: section-bar) ────────────────────────── */
body.theme-grove-telemetry .mori-section { border-top: 1px solid var(--mori-accent-divider); padding-top: 10px; }
body.theme-grove-telemetry .mori-section__bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mori-accent-highlight);
}
body.theme-grove-telemetry .mori-section__idx {
  display: inline-grid;
  min-width: 26px;
  height: 18px;
  place-items: center;
  border: 1px solid var(--mori-accent-card-border);
  background: rgba(79, 125, 95, .22);
  color: var(--mori-accent-highlight);
  font-size: 9px;
}
body.theme-grove-telemetry .mori-section__rule {
  flex: 1;
  height: 1px;
  background-image: repeating-linear-gradient(90deg,
    var(--mori-accent-divider) 0 6px, transparent 6px 12px);
}
body.theme-grove-telemetry .hp-section-heading h2,
body.theme-grove-telemetry .hp-section-heading h3 {
  font-family: var(--mori-type-serif);
  letter-spacing: .03em;
}
body.theme-grove-telemetry .hp-section-description { color: var(--mori-ink-muted); font-family: var(--mori-type-mono); }

/* ── module band (recompose: module-band) ────────────────────────────────── */
body.theme-grove-telemetry .mori-band {
  border: 1px solid var(--mori-accent-card-border);
  background: linear-gradient(180deg, rgba(26, 51, 40, .92), rgba(14, 31, 24, .92));
  clip-path: polygon(0 14px, 14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%);
}
body.theme-grove-telemetry .mori-band__bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--mori-accent-divider);
  background: rgba(183, 211, 168, .06);
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .mori-band__idx { color: var(--mori-accent-highlight); }
body.theme-grove-telemetry .mori-band__ticks {
  flex: 1;
  height: 6px;
  background-image: repeating-linear-gradient(90deg,
    var(--mori-accent-divider) 0 1px, transparent 1px 8px);
  opacity: .8;
}
body.theme-grove-telemetry .mori-band__body { padding: 22px 20px; }

/* ── telemetry rows (recompose: telemetry-row) ───────────────────────────── */
body.theme-grove-telemetry .mori-readout {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(76px, auto) 1fr;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid var(--mori-accent-divider);
  border-left: 2px solid var(--mori-accent-primary);
  background: rgba(20, 42, 32, .85);
  transition: border-color .18s ease, background-color .18s ease;
}
body.theme-grove-telemetry .mori-readout:hover {
  border-left-color: var(--mori-accent-highlight);
  background: rgba(26, 51, 40, .95);
}
body.theme-grove-telemetry .mori-readout__idx {
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .1em;
}
body.theme-grove-telemetry .mori-readout__measure {
  display: flex;
  align-items: baseline;
  gap: 4px;
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-size: 22px;
  font-weight: 700;
  text-shadow: 0 0 10px rgba(183, 211, 168, .32);
}
body.theme-grove-telemetry .mori-readout__unit { color: var(--mori-ink-muted); font-size: 11px; }
body.theme-grove-telemetry .mori-readout__main { color: var(--mori-ink-base); font-family: var(--mori-type-mono); }
body.theme-grove-telemetry .mori-readout__meter {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: rgba(183, 211, 168, .08);
}
body.theme-grove-telemetry .mori-readout__meter i { display: block; height: 100%; background: var(--mori-accent-highlight); opacity: .55; }

/* ── certificate pairs (recompose: data-pair) ────────────────────────────── */
body.theme-grove-telemetry .mori-pair {
  display: flex;
  gap: 14px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--mori-accent-divider);
  font-family: var(--mori-type-mono);
}
body.theme-grove-telemetry .mori-pair__idx {
  flex: none;
  color: var(--mori-accent-highlight);
  font-size: 10px;
  letter-spacing: .1em;
}
body.theme-grove-telemetry .mori-pair > :not(.mori-pair__idx) { color: var(--mori-ink-base); }

/* ── cards, services, lists ──────────────────────────────────────────────── */
body.theme-grove-telemetry .hp-service {
  border: 1px solid var(--mori-accent-divider);
  background: var(--mori-surface-card);
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  transition: border-color .18s ease, box-shadow .18s ease;
}
body.theme-grove-telemetry .hp-service:hover {
  border-color: var(--mori-accent-highlight);
  box-shadow: 0 0 22px rgba(183, 211, 168, .14);
}
body.theme-grove-telemetry .hp-service h3 {
  font-family: var(--mori-type-mono);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mori-accent-highlight);
}
body.theme-grove-telemetry .hp-latency-chart,
body.theme-grove-telemetry .ap-figure {
  border: 1px solid var(--mori-accent-divider);
  background: var(--mori-surface-page);
  filter: saturate(1.1) hue-rotate(55deg);
}
/* the office map is a cool-toned satellite crop with a cyan highlight */
body.theme-grove-telemetry .hp-office-map img {
  filter: hue-rotate(-70deg) saturate(.7) brightness(.9);
}
body.theme-grove-telemetry :is(.hp-cta, .ap-cta, .fp-cta, .qp-cta, .qp-hero-copy > a, .mori-theme-switch button) {
  border: 1px solid var(--mori-accent-highlight);
  border-radius: 0;
  background: var(--mori-accent-primary);
  color: #0b1712;
  font-family: var(--mori-type-mono);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
}
body.theme-grove-telemetry :is(.hp-cta, .ap-cta, .fp-cta, .qp-cta, .qp-hero-copy > a):hover {
  background: var(--mori-accent-highlight);
  color: #0b1712;
  box-shadow: 0 0 18px rgba(183, 211, 168, .35);
}
body.theme-grove-telemetry :is(.hp-icon-link, .hp-back-to-top) {
  border: 1px solid var(--mori-accent-divider);
  color: var(--mori-accent-highlight);
}
body.theme-grove-telemetry :is(.hp-icon-link, .hp-back-to-top):hover {
  border-color: var(--mori-accent-highlight);
  background: rgba(183, 211, 168, .12);
}

/* ── footer ──────────────────────────────────────────────────────────────── */
body.theme-grove-telemetry .hp-footer {
  border-top: 1px solid var(--mori-accent-card-border);
  background: rgba(10, 23, 18, .92);
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-mono);
}
body.theme-grove-telemetry .hp-footer h3,
body.theme-grove-telemetry .hp-footer-column h3,
body.theme-grove-telemetry .hp-footer h2 {
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .hp-footer a { color: var(--mori-ink-muted); }
body.theme-grove-telemetry .hp-footer a:hover { color: var(--mori-accent-highlight); }
body.theme-grove-telemetry .hp-copyright { border-top: 1px solid var(--mori-accent-divider); color: var(--mori-ink-faint); }

/* ── theme switcher + support chrome stay legible on the dark sheet ──────── */
body.theme-grove-telemetry .mori-theme-switch {
  border: 1px solid var(--mori-accent-card-border);
  background: rgba(14, 31, 24, .94);
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .mori-theme-switch button { color: var(--mori-ink-muted); }
body.theme-grove-telemetry .mori-theme-switch button.is-active { color: var(--mori-accent-highlight); }

/* ── page canvas: the document itself stays dark past the first viewport ──── */
/* body's fixed gradient only covers the viewport; the html underneath is the
   host's #f5f5f5, which shows on overscroll and full-height captures. */
html:has(body.theme-grove-telemetry) {
  background: #0a1712;
  color-scheme: dark;
}

/* host hero grid is authored light: black rules + a white block mask. */
body.theme-grove-telemetry .hp-hero-grid {
  opacity: .55;
  background-image:
    linear-gradient(rgba(183, 211, 168, .10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(183, 211, 168, .10) 1px, transparent 1px);
  background-size: 40px 40px;
}
body.theme-grove-telemetry .hp-hero-grid::after {
  background-image:
    linear-gradient(90deg, transparent 19px, rgba(10, 23, 18, .92) 19px 39px, transparent 39px),
    linear-gradient(transparent 19px, rgba(10, 23, 18, .78) 19px 39px, transparent 39px);
  background-size: 160px 120px, 120px 160px;
  opacity: .9;
}

/* the host marks are a white rounded plate with black line art: inverting the
   plate to black and screening it drops the plate into the sheet, leaving the
   panda as a leaf-tinted glyph. */
body.theme-grove-telemetry .hp-hero-panda img,
body.theme-grove-telemetry .hp-company-mark img {
  filter: invert(1) sepia(.45) saturate(1.6) hue-rotate(52deg);
  mix-blend-mode: screen;
  opacity: .5;
}

/* "Cool" is a decorative wordmark band in the host; re-cut it as a survey strip */
body.theme-grove-telemetry .hp-cool {
  background: rgba(10, 23, 18, .55);
  border-top: 1px solid var(--mori-accent-divider);
  border-bottom: 1px solid var(--mori-accent-divider);
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-style: normal;
}
body.theme-grove-telemetry .hp-cool span {
  color: var(--mori-ink-muted);
  font-size: 11px;
  letter-spacing: .3em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .hp-cool img {
  filter: invert(1) sepia(.5) saturate(1.6) hue-rotate(52deg);
  opacity: .55;
}

/* the host's own greys (#666 / #999) collapse on the dark sheet */
body.theme-grove-telemetry :is(
  .hp-company-description, .hp-licence dd, .hp-licence dt,
  .hp-office p, .hp-retail p, .hp-latency p, .hp-company p
) { color: var(--mori-ink-muted); }
body.theme-grove-telemetry .hp-licence dd { color: var(--mori-ink-muted); }

/* ── host floating chrome (directory + support) on the dark sheet ────────── */
body.theme-grove-telemetry .floating-directory {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 2px;
  background: rgba(14, 31, 24, .96);
  color: var(--mori-ink-base);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
  font-family: var(--mori-type-mono);
}
body.theme-grove-telemetry .floating-directory summary {
  border-radius: 2px;
  color: var(--mori-accent-highlight);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body.theme-grove-telemetry .floating-directory a { border-radius: 2px; color: var(--mori-ink-muted); }
body.theme-grove-telemetry .floating-directory a:hover {
  background: rgba(183, 211, 168, .10);
  color: var(--mori-accent-highlight);
}
body.theme-grove-telemetry .floating-directory a[aria-current="page"] {
  background: rgba(183, 211, 168, .16);
  color: var(--mori-accent-highlight);
  font-weight: 400;
}
body.theme-grove-telemetry .support-chat {
  --chat-bg: #0e1f18;
  --chat-ink: #e3ecd2;
  --chat-muted: #a9bda2;
  --chat-surface: #142a20;
  --chat-line: rgba(79, 125, 95, .6);
  --chat-accent: rgba(20, 42, 32, .96);
}
body.theme-grove-telemetry .support-launcher {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 0;
  background: rgba(20, 42, 32, .96);
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-size: 10px !important;
  letter-spacing: .1em;
  text-transform: uppercase;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}
body.theme-grove-telemetry .support-launcher:hover {
  border-color: var(--mori-accent-highlight);
  background: rgba(26, 51, 40, 1);
}
body.theme-grove-telemetry .mori-theme-switch button[aria-pressed="true"] {
  background: var(--mori-accent-highlight);
  color: #0b1712;
}

/* ── sub-pages: about / fafa / santiz / qizai / download ─────────────────── */
/* Each sub-page ships its own light bands, cards and art plates. Re-cut them
   to the grove sheet; artwork keeps its line work by inverting the baked white
   plate to black and screening it away. */
body.theme-grove-telemetry :is(.ap-page, .qp-services, .qp-agent, .qp-download, .fp-download) {
  background: transparent;
}
body.theme-grove-telemetry .ap-header,
body.theme-grove-telemetry .ap-technical-section { background: transparent; }
body.theme-grove-telemetry :is(.ap-products-section, .ap-technical-section) {
  border-top: 1px solid var(--mori-accent-divider);
}

/* about — product cards */
body.theme-grove-telemetry .ap-product {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 0;
  background: rgba(20, 42, 32, .88);
  color: var(--mori-ink-base);
  clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
}
body.theme-grove-telemetry .ap-product-value::before { background: var(--mori-accent-divider); }
body.theme-grove-telemetry .ap-product-icon {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 2px;
  background: rgba(183, 211, 168, .10);
}
body.theme-grove-telemetry .ap-product-icon img {
  filter: invert(1) sepia(.4) saturate(1.3) hue-rotate(52deg);
}
body.theme-grove-telemetry .ap-product .ap-blocks h4 { color: var(--mori-accent-highlight); }
body.theme-grove-telemetry .ap-focus-label { color: var(--mori-ink-strong); }
body.theme-grove-telemetry :is(.ap-intro, .ap-blocks, .ap-contact-field dd) { color: var(--mori-ink-base); }
body.theme-grove-telemetry .ap-intro ul { color: var(--mori-ink-muted); }
body.theme-grove-telemetry .ap-contact-field dt { color: var(--mori-ink-muted); }
body.theme-grove-telemetry :is(.ap-focus li::before, .ap-intro > div + div::before) {
  background: var(--mori-accent-divider);
}
body.theme-grove-telemetry .ap-content a { text-decoration-color: var(--mori-accent-divider); }

/* fafa — feature carousel + licensing band */
body.theme-grove-telemetry .fp-feature-art {
  position: relative;
  border: 1px solid var(--mori-accent-divider);
  border-radius: 0;
  background: var(--mori-surface-card);
  clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
}
body.theme-grove-telemetry .fp-feature-art img {
  filter: invert(1) sepia(.35) saturate(1.3) hue-rotate(52deg);
  mix-blend-mode: screen;
  opacity: .85;
}
body.theme-grove-telemetry .fp-feature-controls button {
  border: 1px solid var(--mori-accent-divider);
  border-radius: 0;
  background: rgba(20, 42, 32, .95);
  color: var(--mori-accent-highlight);
}
body.theme-grove-telemetry .fp-feature-controls button:hover:not(:disabled) {
  background: rgba(183, 211, 168, .14);
}
body.theme-grove-telemetry .fp-feature-copy p,
body.theme-grove-telemetry .fp-download-copy > p,
body.theme-grove-telemetry .fp-download-group h3 { color: var(--mori-ink-muted); }
body.theme-grove-telemetry .fp-licensing {
  border-block-color: var(--mori-accent-divider);
  background: rgba(20, 42, 32, .55);
}
body.theme-grove-telemetry :is(.fp-licensing-heading > p, .fp-licensing-reference) {
  color: var(--mori-ink-muted);
}
body.theme-grove-telemetry .fp-licensing-description { color: var(--mori-ink-base); }

/* santiz — pills, capability tiles, technical diagram */
body.theme-grove-telemetry .sp-pill {
  border: 1px solid var(--mori-accent-highlight);
  border-radius: 0;
  background: var(--mori-accent-primary);
  color: #0b1712 !important;
  font-family: var(--mori-type-mono);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
}
body.theme-grove-telemetry .sp-pill:hover { background: var(--mori-accent-highlight); }
body.theme-grove-telemetry .sp-capability h2 { font-family: var(--mori-type-serif); }
body.theme-grove-telemetry .sp-capability-hosting { background: rgba(53, 70, 48, .9); color: var(--mori-ink-base); }
body.theme-grove-telemetry .sp-capability-trading { background: rgba(23, 54, 13, .9); color: var(--mori-accent-highlight); }
body.theme-grove-telemetry .sp-capability-market { background: var(--mori-accent-primary); color: var(--mori-ink-strong); }
body.theme-grove-telemetry .sp-technical-picture img {
  filter: hue-rotate(-70deg) saturate(.85);
}
body.theme-grove-telemetry .sp-capability-pattern { opacity: .7; }

/* qizai — manifesto, capability icons, agent backdrop */
body.theme-grove-telemetry .qp-manifesto {
  border-block: 1px solid rgba(215, 169, 74, .45);
  background: rgba(58, 42, 18, .72);
  color: var(--mori-ink-base);
}
body.theme-grove-telemetry .qp-service p,
body.theme-grove-telemetry .qp-capability-grid p,
body.theme-grove-telemetry .qp-download-group h3 { color: var(--mori-ink-muted); }
body.theme-grove-telemetry .qp-service img,
body.theme-grove-telemetry .qp-capability-grid img {
  filter: invert(1) sepia(.35) saturate(1.3) hue-rotate(52deg);
  mix-blend-mode: screen;
  opacity: .85;
}
body.theme-grove-telemetry .qp-agent-panel img {
  filter: invert(1) sepia(.4) saturate(1.3) hue-rotate(52deg);
  opacity: .26;
}
body.theme-grove-telemetry .qp-capability-grid article { border-color: var(--mori-accent-divider); }
body.theme-grove-telemetry .qp-capability-grid article > span {
  background: var(--mori-accent-primary);
  color: var(--mori-ink-strong);
  font-family: var(--mori-type-mono);
}

/* download — striped top band + app icon plate */
body.theme-grove-telemetry .dp-top {
  background-color: var(--mori-surface-page);
  background-image: repeating-linear-gradient(90deg, rgba(183, 211, 168, .06) 0 1px, transparent 1px 78px);
}
body.theme-grove-telemetry .dp-app-icon {
  border: 1px solid var(--mori-accent-card-border);
  background: var(--mori-surface-card);
  box-shadow: 0 12px 24px rgba(0, 0, 0, .45);
}
body.theme-grove-telemetry .dp-app-icon img {
  filter: invert(1) sepia(.4) saturate(1.4) hue-rotate(52deg);
}
body.theme-grove-telemetry .dp-brand-copy p { color: var(--mori-ink-muted); }

/* the mobile directory opens an absolutely-positioned nav outside the details
   box; it carries its own light surface in the host stylesheet. */
@media (max-width: 1023px) {
  body.theme-grove-telemetry .floating-directory nav,
  body.theme-grove-telemetry .floating-directory[data-theme="santiz"] nav {
    border-color: var(--mori-accent-card-border);
    border-radius: 2px;
    background: #0e1f18;
  }
}

/* the desktop directory and the switcher share the bottom-left corner */
@media (min-width: 1024px) {
  body.theme-grove-telemetry .floating-directory { bottom: 82px; }
}
/* the mascot art collides with the headline on a phone width */
@media (max-width: 760px) {
  body.theme-grove-telemetry :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body.theme-grove-telemetry :is(.hp-hero, .ap-hero, .fp-hero, .sp-hero, .qp-hero) {
    border-left-width: 2px;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%);
  }
  body.theme-grove-telemetry .mori-readout {
    grid-template-columns: 26px 1fr;
    gap: 8px 12px;
  }
  body.theme-grove-telemetry .mori-readout__main { grid-column: 1 / -1; }
  body.theme-grove-telemetry .hp-section-heading h2 { font-size: 24px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   seed surface language — the shapes that make the seed recognisable.

   The palette pass alone left the grove sheet looking like a dark retint of
   the host. What the eye reads as "the seed" is its cut surface: a plate with
   two tabs bitten out of the bottom edge, a hazard hatch flag hanging off the
   top-right, a corner tick, and a status plate whose left edge is stepped.
   These are fixed-pixel profiles, so they hold on a 130px service card and a
   560px feature plate alike (the seed's own percentages assume its 140px
   cards and turn into 85px bites on a taller host card).
   ══════════════════════════════════════════════════════════════════════════ */

@keyframes mori-grove-flicker {
  0%   { opacity: .7; }
  25%  { opacity: 1; }
  50%  { opacity: .45; }
  75%  { opacity: .9; }
  100% { opacity: .8; }
}

/* ── telemetry sheets: a plate carrying an inset, cut face ───────────────── */
/* The seed's card is two layers, not one outline: a glowing plate with a
   hazard hatch on it, and a dark face inset 5px whose clip-path bites two
   tabs out of the bottom and a wedge out of the top-right. The bite is what
   exposes the hatch. Painting the stripe inside a single clipped card (the
   first pass) put it exactly where the clip removes paint, so it never showed. */
body.theme-grove-telemetry :is(
  .hp-service, .ap-product, .fp-feature-art,
  .qp-capability-grid article
) {
  position: relative;
  z-index: 0;                 /* a stacking context, so ::before can sit above the plate */
  background-color: var(--mori-accent-primary);
  background-image:
    repeating-linear-gradient(90deg, #d7a94a 0 6px, transparent 6px 12px),
    radial-gradient(circle at 50% 40%, rgba(20, 42, 32, .15) 60%, rgba(79, 125, 95, .95) 100%);
  background-size: 30% 19px, auto;
  background-position: right top, center;
  background-repeat: no-repeat, no-repeat;
  box-shadow: 0 0 0 1px rgba(183, 211, 168, .18);
}
/* the face: inset 5px, seed profile, painted above the plate but below content */
body.theme-grove-telemetry :is(
  .hp-service, .ap-product, .fp-feature-art,
  .qp-capability-grid article
)::before {
  content: "";
  position: absolute;
  inset: 5px;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 40%, rgba(79, 125, 95, 0) 70%, rgba(79, 125, 95, .55) 100%),
    #142a20;
  clip-path: polygon(
    0 0,
    0 100%,
    25% 100%,
    30% calc(100% - 14px),
    50% calc(100% - 14px),
    55% 100%,
    100% 100%,
    100% 14px,
    70% 14px,
    65% 0
  );
  box-shadow: inset 0 0 15px rgba(183, 211, 168, .18);
}
body.theme-grove-telemetry :is(
  .hp-service, .ap-product, .fp-feature-art,
  .qp-capability-grid article
)::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 14px;
  height: 14px;
  pointer-events: none;
  background: rgba(183, 211, 168, .55);
  clip-path: polygon(0 0, 0 100%, 100% 0);
  z-index: 2;
}
/* santiz's capability tiles keep their own accent fills, so they stay single
   layer: the seed cut and the corner tick, no plate and no hatch. */
body.theme-grove-telemetry .sp-capability {
  position: relative;
  clip-path: polygon(
    0 0,
    0 100%,
    25% 100%,
    30% calc(100% - 14px),
    50% calc(100% - 14px),
    55% 100%,
    100% 100%,
    100% 14px,
    70% 14px,
    65% 0
  );
  box-shadow: inset 0 0 15px rgba(183, 211, 168, .18);
}
body.theme-grove-telemetry .sp-capability::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 14px;
  height: 14px;
  pointer-events: none;
  background: rgba(183, 211, 168, .55);
  clip-path: polygon(0 0, 0 100%, 100% 0);
  z-index: 2;
}
/* the host service card carries no padding of its own; the tabs need room */
body.theme-grove-telemetry .hp-service { padding: 18px 16px 22px; }
body.theme-grove-telemetry .ap-product { padding: 24px 20px 28px; }
body.theme-grove-telemetry .qp-capability-grid article { padding: 16px 20px 22px; }
body.theme-grove-telemetry .sp-capability { padding: 24px 16px 28px; }
/* the art plate's own image is content: it sits above the face, as intended */
body.theme-grove-telemetry .fp-feature-art { overflow: hidden; }
/* Keep the card's complete frame and hatch above the full-bleed SVG. */
body.theme-grove-telemetry .fp-page .fp-feature-art::after {
  inset: 0;
  z-index: 3;
  width: auto;
  height: auto;
  border: 1px solid var(--mori-accent-divider);
  clip-path: inherit;
  background:
    linear-gradient(135deg, rgba(183, 211, 168, .55) 0 7px, transparent 7.5px) left top / 14px 14px no-repeat,
    repeating-linear-gradient(90deg, #d7a94a 0 6px, transparent 6px 12px) right top / 30% 19px no-repeat;
}

/* ── section kicker: a short hazard rule beside the eyebrow ──────────────── */
body.theme-grove-telemetry .hp-section-heading > p::after,
body.theme-grove-telemetry .ap-section-heading > p::after {
  content: "";
  display: inline-block;
  width: 56px;
  height: 3px;
  margin-left: 10px;
  vertical-align: middle;
  background-image: repeating-linear-gradient(90deg, #d7a94a 0 6px, transparent 6px 12px);
  opacity: .85;
}

/* ── status plate: the seed rail in miniature ────────────────────────────── */
/* The host's floating directory is the one persistent piece of chrome, so it
   wears the seed's rail: an outer moss plate whose left edge steps in, an
   inset dark card, and the clay flag on the stepped edge. */
body.theme-grove-telemetry .floating-directory {
  border: 0;
  border-radius: 0;
  background: var(--mori-accent-primary);
  clip-path: polygon(20% 0, 10% 5%, 10% 35%, 0 40%, 0 95%, 10% 100%, 100% 100%, 100% 0);
  box-shadow: 0 0 14px rgba(79, 125, 95, .55);
}
body.theme-grove-telemetry .floating-directory > summary {
  position: relative;
  margin: 5px 5px 5px 7px;
  background: #142a20;
  color: var(--mori-accent-highlight);
  clip-path: polygon(18% 0, 8% 6%, 8% 34%, 0 40%, 0 95%, 8% 100%, 100% 100%, 100% 0);
  box-shadow: inset 0 0 15px rgba(79, 125, 95, .6);
}
body.theme-grove-telemetry .floating-directory > summary::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 14%;
  bottom: 12%;
  width: 5px;
  pointer-events: none;
  background-image: repeating-linear-gradient(180deg, #c96a4a 0 4px, transparent 4px 9px);
  transform: skewY(-40deg);
}
/* its dropdown is a sheet too, not a rounded white popover */
body.theme-grove-telemetry .floating-directory > nav {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 0;
  background: #142a20;
  clip-path: polygon(14px 0, 100% 0, 100% 100%, 0 100%, 0 14px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .5);
}

@media (prefers-reduced-motion: reduce) {
  body.theme-grove-telemetry :is(
    .hp-service, .ap-product, .fp-feature-art,
    .qp-capability-grid article, .sp-capability
  )::after {
    animation: none;
    opacity: .8;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   signal-desk — 信号台 (Signal Desk)
   Built from the cyberpunk dashboard seed in its own colours, not from the
   host brand and not from grove-telemetry: a black→#0a202b console canvas
   under a 20px cyan grid and a pulsing blue PCB field, a solid #1482cf nav
   plate with the seed's notch and cyan inner glow, a pink hazard ribbon,
   cut-corner glass readout cards on a #1482cf glow plate, terminal-green
   values, pink ">" markers, and 4px cyan meters. Every colour below is a
   seed :root value (#1482cf, #113f59, #e562c0, #00f0ff, #fff35c, #b967ff,
   #0a0b10, #0cfa77). Recompose builds mori-slot / mori-readout / mori-pair /
   mori-section / mori-band shells on the real host DOM.
   ══════════════════════════════════════════════════════════════════════════ */
body.theme-signal-desk {
  background: transparent;
  color: #ffffff;
  font-family: var(--mori-type-sans);
  font-size: 14px;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
  color-scheme: dark;
  -webkit-font-smoothing: antialiased;
}
/* The Cool wordmark band belongs to another theme's language; it has no place in a
   console. Real content, so it is dropped deliberately rather than restyled. */
body.theme-signal-desk .hp-cool { display: none; }
/* the base field lives on html, not body: the two textures below are negative
   stacking layers, so body has to stay transparent or it would paint over them */
html:has(body.theme-signal-desk) {
  background-color: var(--mori-surface-page);
  background-image: linear-gradient(0deg, #000000 0%, #0a202b 100%);
  background-attachment: fixed;
}

/* the seed's two background fields: cyan graph paper over a blue PCB plate.
   Negative z-index keeps them under every header, photo and illustration
   instead of painting across the page as a fixed overlay. */
body.theme-signal-desk::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .7;
  background-image:
    linear-gradient(rgba(0, 240, 255, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 240, 255, .08) 1px, transparent 1px);
  background-size: 20px 20px;
}
body.theme-signal-desk::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 10h80v80H10z' fill='none' stroke='%231482cf44' stroke-width='1'/%3E%3Cpath d='M30 10v30h30' fill='none' stroke='%231482cf44' stroke-width='1'/%3E%3Cpath d='M70 30v40h-40' fill='none' stroke='%231482cf44' stroke-width='1'/%3E%3Ccircle cx='30' cy='30' r='3' fill='%231482cf33'/%3E%3Ccircle cx='70' cy='70' r='3' fill='%231482cf33'/%3E%3Ccircle cx='70' cy='30' r='3' fill='%231482cf33'/%3E%3Ccircle cx='30' cy='70' r='3' fill='%231482cf33'/%3E%3C/svg%3E");
  opacity: .2;
  animation: mori-signal-pcb 3s infinite alternate;
}
@keyframes mori-signal-pcb {
  from { opacity: .2; }
  to   { opacity: .8; }
}
/* qizai: the PCB matrix is the cross field the capability glyphs sit in. Give
   it a crawl — one whole 100px tile per lap, so the repeat never jumps — and
   replace the 0.2→0.8 breathe with a four-state step that tops out well under
   the glyph traces. Oversize the fixed layer by one tile so no edge shows
   while it travels. */
body.theme-signal-desk[data-mori-scene="qizai"]::after {
  inset: -100px;
  animation:
    mori-signal-pcb-crawl 48s linear infinite,
    mori-signal-pcb-step 5.2s linear infinite;
}
@keyframes mori-signal-pcb-crawl {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(100px, 100px, 0); }
}
@keyframes mori-signal-pcb-step {
  0%, 24.9%   { opacity: .14; }
  25%, 49.9%  { opacity: .19; }
  50%, 74.9%  { opacity: .24; }
  75%, 100%   { opacity: .3; }
}
@keyframes mori-signal-plate {
  from { filter: brightness(.8); }
  to   { filter: brightness(1.25); }
}
@keyframes mori-signal-pulse {
  from { box-shadow: 0 0 4px rgba(0, 240, 255, .45); }
  to   { box-shadow: 0 0 14px rgba(0, 240, 255, .95); }
}
@keyframes mori-signal-flicker {
  0%, 19.999%, 22%, 62.999%, 64%, 64.999%, 70%, 100% { opacity: .99; }
  20%, 21.999%, 63%, 63.999%, 65%, 69.999% { opacity: .4; }
}
@keyframes mori-signal-ribbon {
  0%   { transform: skewX(-18deg) translateX(0); }
  100% { transform: skewX(-18deg) translateX(8px); }
}
@keyframes mori-signal-tick {
  0%, 100% { background: rgba(229, 98, 192, .55); }
  50%      { background: rgba(0, 240, 255, .55); }
}
@keyframes mori-signal-dots {
  from { background-position: 0 0, 0 calc(100% - 9px), 0 0, 0 0; }
  to   { background-position: 0 0, 100px calc(100% - 9px), 0 0, 0 0; }
}
@keyframes mori-signal-rail {
  from { box-shadow: 0 0 4px rgba(20, 130, 207, .5); }
  to   { box-shadow: 0 0 22px rgba(20, 130, 207, .9); }
}

body.theme-signal-desk main,
body.theme-signal-desk section,
body.theme-signal-desk footer { background-color: transparent; }
body.theme-signal-desk .hp-page,
body.theme-signal-desk .ap-page,
body.theme-signal-desk .fp-page,
body.theme-signal-desk .sp-page,
body.theme-signal-desk .qp-page,
body.theme-signal-desk .dp-page {
  background: transparent;
  color: var(--mori-ink-base);
  font-family: var(--mori-type-mono);
}
body.theme-signal-desk a { color: var(--mori-accent-highlight); text-underline-offset: 2px; }
body.theme-signal-desk a:hover { color: #e6f9ff; text-shadow: 0 0 8px rgba(0, 240, 255, .6); }
body.theme-signal-desk :is(h1, h2, h3, h4) {
  color: var(--mori-ink-strong);
  font-family: var(--mori-type-display);
  font-weight: 700;
  letter-spacing: .04em;
}
body.theme-signal-desk ::selection { background: rgba(0, 240, 255, .28); color: #ffffff; }
body.theme-signal-desk :is(button, a, input, select):focus-visible {
  outline: 2px solid var(--mori-accent-highlight);
  outline-offset: 2px;
}

/* ── nav plate: the seed toolbar — a full-bleed #1482cf slab, cyan inner
   glow, notched bottom edge and the pink striped belt underneath ──────────
   The plate is a silhouette, so it lives on ::before at a negative stack order
   instead of on the header box; the belt sits one layer further down on
   ::after, exactly as the seed stacks .nav over .nav-bottom. Both paint below
   the in-flow nav, so the belt is only ever seen through the bottom notch. */
body.theme-signal-desk :is(.hp-desktop-header, .hp-mobile-header) {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  transform: none;
  z-index: 40;
  background: transparent;
  border-bottom: 0;
  clip-path: none;
  box-shadow: none;
  /* the language drop overflows the header when open; keep the header
     paint-visible so the menu isn't clipped shut */
  overflow: visible;
  /* smart header: sliding off/on is the only motion the plate needs */
  transition: transform .3s ease;
}
/* ── smart header: scrolling down hides it, scrolling up reveals it (the same
   interaction the pcell app's nav uses). The class lands on the body so both
   headers (mobile / desktop) translate away in one rule; pointer-events drop
   so the off-screen plate can't swallow taps. */
body.theme-signal-desk.signal-nav-hidden :is(.hp-desktop-header, .hp-mobile-header) {
  transform: translateY(-100%);
  pointer-events: none;
}
body.theme-signal-desk :is(.hp-desktop-header, .hp-mobile-header)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-color: var(--mori-accent-primary);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(10, 32, 43, .18));
  clip-path: polygon(0 80%, 2% 100%, 14% 100%, 18% 75%, 24% 75%, 28% 100%, 98% 100%, 100% 80%, 100% 0, 0 0);
  box-shadow:
    inset 0 1em 2em rgba(0, 240, 255, .7),
    inset 0 -1em 2em rgba(10, 32, 43, .4);
}
/* the seed's nav-bottom: a left-biased pink 1:1 striped belt that fills the
   plate's bottom notch (75–100% tall, 14–28% wide) so no dark background leaks
   through. It sits at 11–29% — a hair wider than the notch on both sides — and
   skews a gentle −18° (not the old −75°, whose ~30px shear on a 40px mobile bar
   slid the belt clear out of the unskewed notch and left a black wedge) while it
   drifts 8px. It stays left of the nav/controls on the right at every width. */
body.theme-signal-desk :is(.hp-desktop-header, .hp-mobile-header)::after {
  content: "";
  position: absolute;
  left: 11%;
  top: 75%;
  width: 18%;
  height: 25%;
  z-index: -2;
  pointer-events: none;
  background-image: repeating-linear-gradient(
    90deg,
    rgba(229, 98, 192, 1) 0 5%,
    rgba(255, 255, 255, 0) 5% 10%
  );
  transform: skewX(-18deg);
  transform-origin: center;
  animation: mori-signal-ribbon 6s infinite alternate;
}
/* 920px (not 1024px): the full desktop nav (≈612px, right-anchored) clears the
   plate's notched left edge (28%) with ~21px of margin down to 920px — below
   that it slides under the notch/belt. At 920–1023 the window is near-square, so
   keeping the nav on the bar instead of folding it into the burger is right. */
@media (min-width: 920px) {
  /* the seed bar is flush with the window, not a floating 1200px card */
  body.theme-signal-desk .hp-desktop-header {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 0 clamp(20px, 3.2vw, 48px);
    transform: none;
    align-items: center;
  }
  body.theme-signal-desk .hp-desktop-nav { height: 64px; }
  /* the download page keeps its header in flow, but full-bleed like every
     other page — the host pins it to the 1200px content column, which reads as
     a floating card and breaks the nav silhouette */
  body.theme-signal-desk .dp-page .dp-top { padding-top: 0; }
  body.theme-signal-desk .dp-page .hp-desktop-header {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 0 clamp(20px, 3.2vw, 48px);
  }

}
@media (min-width: 720px) and (max-width: 919px) {
  /* the five relabelled tabs plus the terminal download CTA crowd the bar
     below 920px — the labels run into the bar's bottom edge, and the full nav
     slides under the notched plate's left edge. Lift the mobile header (burger +
     download + locale/theme/support) up to 920px so the tablet band collapses
     the nav into the burger exactly like mobile. The host flips to the desktop
     header at 720px, so this has to out-rank that `!important` rule. */
  body.theme-signal-desk .hp-desktop-header { display: none !important; }
  body.theme-signal-desk .hp-mobile-header { display: block !important; }
}
/* the seed's nav title is dark ink on the blue plate, not white */
body.theme-signal-desk .hp-header-brand img,
body.theme-signal-desk .hp-mobile-header img {
  filter: brightness(0);
  opacity: .92;
}
/* the mobile logo link is 70x20 (WCAG 2.5.8 target is 44px): extend its hit
   area with an invisible ::after instead of padding-block, which the host's
   border-box box-sizing would fold into the content box and shrink the mark.
   the host anchors it with position:absolute, so the ::after already resolves
   against that box — don't re-set position here or the anchor pops into flow */
body.theme-signal-desk .hp-mobile-header > a[aria-label]::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -12px;
  bottom: -12px;
}
body.theme-signal-desk .hp-footer-brand img {
  filter: brightness(0) invert(1) sepia(1) saturate(3) hue-rotate(150deg);
  opacity: .85;
}

/* ── mobile header compression ──────────────────────────────────────────────
   The host mobile bar is a 104px block whose logo (top:40) and language switch
   (top:28) are absolutely pinned, wasting 28px above the switch and a whole
   second row for nav. Collapse it to one 40px row: logo left, the scrollable
   nav strip filling the middle, the language switch as a 24px icon on the
   right (same footprint as the download tab). */
body.theme-signal-desk .hp-mobile-header {
  height: 40px;
}
/* the host pins these with top+bottom pairs sized for a 104px bar; re-pin with
   an explicit height and bottom:auto so the mark/switch keep their size and
   only move up, instead of squashing when the bar gets shorter */
body.theme-signal-desk .hp-mobile-header > a[aria-label] {
  top: 10px;
  bottom: auto;
  height: 20px;
}
body.theme-signal-desk .hp-mobile-header .hp-language-switch {
  top: 8px;
  bottom: auto;
  left: auto;
  right: 12px;
  width: 24px;
  height: 24px;
}
/* ── mobile header: download CTA + burger → full-screen menu ─────────────── */
/* A 40px console header has room for one action plus the brand. signal-desk
   keeps the download CTA visible (it is the whole site's call to action) and
   folds nav + locale into a full-screen menu behind a burger. The scroll strip
   is gone — five relabelled tabs never fit it once the labels grew. */

/* download: a clone of the desktop icon-tab, pinned tight against the burger's
   left edge. The clone keeps its aria-label, so it also matches the logo's
   `> a[aria-label]` rule — pin with `a.mori-download` (higher specificity) and
   explicitly clear `left`/`bottom` so the host's logo offsets don't drag it
   back to the left edge. */
body.theme-signal-desk .hp-mobile-header a.mori-download {
  position: absolute;
  top: 8px;
  right: 44px;
  left: auto;
  bottom: auto;
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--mori-accent-highlight);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
  box-shadow: 0 0 10px rgba(0, 240, 255, .5), inset 0 0 6px rgba(10, 11, 16, .28);
}
body.theme-signal-desk .hp-mobile-header .mori-download img {
  width: 14px;
  height: 14px;
  filter: brightness(0);
}

/* burger: three white bars inside the same corner-cut cyan-glow plate as the
   download tab, pinned to the top-right, above the menu (the menu is fixed to
   the viewport, so the toggle must be too). Open morphs bars → ✕. */
body.theme-signal-desk .hp-mobile-header .mori-burger {
  position: fixed;
  top: 8px;
  right: 12px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
  box-shadow: inset 0 0 8px rgba(0, 240, 255, .45);
  cursor: pointer;
  z-index: 10001;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
body.theme-signal-desk .hp-mobile-header .mori-burger__bar {
  display: block;
  width: 16px;
  height: 2px;
  background: #fff;
  box-shadow: 0 0 4px rgba(0, 240, 255, .8);
  transition: transform .2s cubic-bezier(.16, 1, .3, 1), opacity .2s;
}
body.mori-menu-open .mori-burger__bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.mori-menu-open .mori-burger__bar:nth-child(2) { opacity: 0; }
body.mori-menu-open .mori-burger__bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* the menu: a full-screen opaque terminal plate that drops in, with the four
   links printing in one by one. Hidden with visibility (not display) so the
   enter/exit transitions run both ways. */
body.theme-signal-desk .hp-mobile-header .mori-menu {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  padding: 76px 28px 32px;
  background: rgba(10, 36, 48, .98);
  border: 1px solid rgba(20, 130, 207, .55);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-16px);
  transition: opacity .22s cubic-bezier(.16, 1, .3, 1),
              transform .22s cubic-bezier(.16, 1, .3, 1),
              visibility 0s linear .22s;
}
body.mori-menu-open .hp-mobile-header .mori-menu {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity .22s cubic-bezier(.16, 1, .3, 1),
              transform .22s cubic-bezier(.16, 1, .3, 1),
              visibility 0s;
}
/* the menu is a child of the header, which the host pins as its own stacking
   context at z:40 — so a bare z-index on the menu is trapped under the preview
   theme switcher (z:9999) and the support panel (z:10000). Lifting the whole
   header stack above them when the menu is open lets the overlay clear every
   chrome layer; the menu still covers the header bar's own content because it
   carries a higher z-index inside the same context. */
body.mori-menu-open .hp-mobile-header { z-index: 10001; }

/* links: full-width rows with a terminal prompt, staggered in on open */
body.theme-signal-desk .hp-mobile-header .mori-menu__link {
  font-family: var(--mori-type-mono);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mori-ink-base);
  text-decoration: none;
  padding: 16px 4px;
  border-bottom: 1px solid rgba(20, 130, 207, .35);
  opacity: 0;
  transform: translateX(-10px);
  transition: opacity .12s ease, transform .12s ease;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__link::before {
  content: ">";
  margin-right: 12px;
  color: var(--mori-accent-highlight);
}
body.theme-signal-desk .hp-mobile-header .mori-menu__link:hover,
body.theme-signal-desk .hp-mobile-header .mori-menu__link:focus-visible {
  color: #7df9ff;
  background: rgba(20, 130, 207, .12);
}
body.theme-signal-desk .hp-mobile-header .mori-menu__link[aria-current],
body.theme-signal-desk .hp-mobile-header .mori-menu__link.is-active {
  color: var(--mori-accent-highlight);
}
body.mori-menu-open .hp-mobile-header .mori-menu__link {
  opacity: 1;
  transform: none;
  transition: opacity .22s cubic-bezier(.16, 1, .3, 1),
              transform .22s cubic-bezier(.16, 1, .3, 1);
}
body.mori-menu-open .hp-mobile-header .mori-menu__link:nth-child(1) { transition-delay: .02s; }
body.mori-menu-open .hp-mobile-header .mori-menu__link:nth-child(2) { transition-delay: .06s; }
body.mori-menu-open .hp-mobile-header .mori-menu__link:nth-child(3) { transition-delay: .10s; }
body.mori-menu-open .hp-mobile-header .mori-menu__link:nth-child(4) { transition-delay: .14s; }

/* locale, folded into the menu's footer as a full-width row */
body.theme-signal-desk .hp-mobile-header .mori-menu__locale {
  margin-top: 24px;
  border-top: 1px solid rgba(20, 130, 207, .35);
  padding-top: 18px;
  opacity: 0;
  transform: translateX(-10px);
  transition: opacity .12s ease, transform .12s ease;
}
body.mori-menu-open .hp-mobile-header .mori-menu__locale {
  opacity: 1;
  transform: none;
  transition: opacity .22s cubic-bezier(.16, 1, .3, 1) .18s,
              transform .22s cubic-bezier(.16, 1, .3, 1) .18s;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__locale .mori-locale { position: static; }
body.theme-signal-desk .hp-mobile-header .mori-menu__locale .mori-locale > summary {
  width: 100%;
  height: 40px;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(20, 130, 207, .45);
  background: rgba(10, 11, 16, .5);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
  color: var(--mori-ink-base);
  font-size: 11px;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__locale .mori-locale__caret {
  display: inline-block;
  margin-left: auto;
}
/* the menu locale keeps its text label but shows the globe glyph too, so it
   reads as one control with the theme accordion below */
body.theme-signal-desk .hp-mobile-header .mori-menu__locale .mori-locale > summary .mori-icon {
  width: 14px;
  height: 14px;
  color: var(--mori-accent-highlight);
}
body.theme-signal-desk .hp-mobile-header .mori-menu__locale .mori-locale > nav {
  position: static;
  display: grid;
  gap: 2px;
  min-width: 0;
  margin-top: 8px;
  border: 0;
  background: transparent;
  clip-path: none;
  box-shadow: none;
}
/* theme switcher folded into the burger menu as an accordion row matching the
   locale switch — one <details> whose summary shows glyph + current value and
   whose nav lists every theme in a 2-column grid */
body.theme-signal-desk .hp-mobile-header .mori-menu__theme {
  margin-top: 24px;
  border-top: 1px solid rgba(20, 130, 207, .35);
  padding-top: 18px;
  opacity: 0;
  transform: translateX(-10px);
  transition: opacity .12s ease, transform .12s ease;
}
body.mori-menu-open .hp-mobile-header .mori-menu__theme {
  opacity: 1;
  transform: none;
  transition: opacity .22s cubic-bezier(.16, 1, .3, 1) .16s,
              transform .22s cubic-bezier(.16, 1, .3, 1) .16s;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme { position: static; }
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > summary {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 40px;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 12px;
  cursor: pointer;
  list-style: none;
  border: 1px solid rgba(20, 130, 207, .45);
  background: rgba(10, 11, 16, .5);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
  box-shadow: inset 0 0 8px rgba(0, 240, 255, .45);
  color: var(--mori-ink-base);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > summary::-webkit-details-marker,
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > summary::marker {
  display: none;
  content: "";
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > summary .mori-icon {
  width: 14px;
  height: 14px;
  color: var(--mori-accent-highlight);
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme__caret {
  display: inline-block;
  margin-left: auto;
  margin-top: 2px;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > nav {
  position: static;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  min-width: 0;
  margin-top: 8px;
  border: 0;
  background: transparent;
  clip-path: none;
  box-shadow: none;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > nav button {
  height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(20, 130, 207, .45);
  border-radius: 0;
  background: rgba(10, 11, 16, .5);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%);
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
}
body.theme-signal-desk .hp-mobile-header .mori-menu__theme .mori-theme > nav button[aria-pressed="true"] {
  border-color: #00f0ff;
  background: var(--mori-surface-page);
  color: #00f0ff;
  box-shadow: inset 0 0 8px rgba(0, 240, 255, .45);
}
/* nav links: uniform corner-cut dark tabs with strong cyan text. Auto width +
   nowrap keeps every relabel ("Low Latency" / 低延遲客戶) on one line instead of
   wrapping inside the host's fixed 94px pill, and the equal gaps stay uniform. */
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link) {
  position: relative;
  height: 34px;
  min-width: 0;
  width: auto;
  flex: 0 0 auto;
  padding: 0 16px;
  white-space: nowrap;
  border: 1px solid rgba(20, 130, 207, .5);
  border-radius: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
  box-shadow: inset 0 0 10px rgba(0, 240, 255, .35);
  color: #cfefff;
  font-family: var(--mori-type-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link):hover,
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link):focus-visible {
  border-color: var(--mori-accent-highlight);
  color: #00f0ff;
  text-shadow: 0 0 8px rgba(0, 240, 255, .7);
}
/* the current page keeps the dark plate, turns cyan, and carries the belt stripe */
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link)[aria-current],
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link).is-active {
  border-color: var(--mori-accent-highlight);
  color: #00f0ff;
  text-shadow: 0 0 8px rgba(0, 240, 255, .7);
}
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link)[aria-current]::after,
body.theme-signal-desk .hp-desktop-nav > a:not(.hp-icon-link).is-active::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 1px;
  height: 3px;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 8px);
}
/* header controls are corner-cut tabs, not pills. The download tab is the one
   primary action in the row, so it alone gets the cyan fill (the host's black
   glyph stays black on top via brightness(0)) and a strong outer glow. */
body.theme-signal-desk .hp-desktop-nav .hp-icon-link {
  width: 34px;
  min-width: 34px;
  height: 34px;
  border: 0;
  border-radius: 0;
  background: var(--mori-accent-highlight);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
  box-shadow: 0 0 14px rgba(0, 240, 255, .55), inset 0 0 10px rgba(10, 11, 16, .25);
}
body.theme-signal-desk .hp-desktop-nav .hp-icon-link img,
body.theme-signal-desk .hp-desktop-nav .hp-icon-link:hover img {
  filter: brightness(0);
}
/* the download CTA is the current page on /download/, where the host marks it
   .is-active and its `.dp-page … .hp-icon-link.is-active` rule paints the tile
   black — black glyph on a black tile = invisible. Re-assert the cyan fill. */
body.theme-signal-desk .hp-desktop-nav .hp-icon-link.is-active {
  background: var(--mori-accent-highlight);
  box-shadow: 0 0 14px rgba(0, 240, 255, .55), inset 0 0 10px rgba(10, 11, 16, .25);
}
body.theme-signal-desk .hp-language-switch { gap: 4px; }
body.theme-signal-desk .hp-language-switch a {
  border: 1px solid rgba(10, 11, 16, .55);
  border-radius: 0;
  background: rgba(255, 255, 255, .14);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
  color: var(--mori-surface-page);
  opacity: 1;
  min-width: 44px;
  font-family: var(--mori-type-mono);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-signal-desk .hp-language-switch a + a::before { content: none; }
body.theme-signal-desk .hp-language-switch a:hover {
  border-color: var(--mori-surface-page);
  background: rgba(10, 11, 16, .16);
  color: var(--mori-surface-footer);
}
body.theme-signal-desk .hp-language-switch a.is-active,
body.theme-signal-desk .hp-language-switch a[aria-current] {
  background: var(--mori-surface-page);
  border-color: var(--mori-surface-page);
  color: #7df9ff;
}
/* language switch folded into one console control: a single notched button whose
   menu lists the three locales. The button keeps the header's corner-cut tab and
   the menu reuses the floating directory's notched panel so both controls share
   one vocabulary. */
body.theme-signal-desk .mori-locale { position: relative; }
body.theme-signal-desk .mori-locale > summary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  min-width: 44px;
  padding: 0 12px;
  cursor: pointer;
  list-style: none;
  border: 1px solid rgba(10, 11, 16, .55);
  border-radius: 0;
  background: rgba(255, 255, 255, .14);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
  color: var(--mori-surface-page);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.theme-signal-desk .mori-locale > summary::-webkit-details-marker,
body.theme-signal-desk .mori-locale > summary::marker { display: none; content: ""; }
body.theme-signal-desk .mori-locale > summary:hover {
  border-color: var(--mori-surface-page);
  background: rgba(10, 11, 16, .16);
  color: var(--mori-surface-footer);
}
body.theme-signal-desk .mori-locale__value { white-space: nowrap; }
body.theme-signal-desk .mori-locale__caret {
  width: 0;
  height: 0;
  margin-top: 2px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
}
/* desktop: the language switch drops its text and becomes a glyph tab like the
   download icon — a globe in a dark corner-cut plate, no text, no caret */
body.theme-signal-desk .hp-desktop-nav .mori-locale > summary {
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  justify-content: center;
  gap: 0;
  border: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
  box-shadow: inset 0 0 12px rgba(0, 240, 255, .45);
  color: #ffffff;
}
body.theme-signal-desk .hp-desktop-nav .mori-locale > summary:hover {
  background: var(--mori-surface-page);
  color: #7df9ff;
}
body.theme-signal-desk .hp-desktop-nav .mori-locale > summary .mori-icon {
  width: 16px;
  height: 16px;
}
body.theme-signal-desk .hp-desktop-nav .mori-locale > summary .mori-locale__value,
body.theme-signal-desk .hp-desktop-nav .mori-locale > summary .mori-locale__caret {
  display: none;
}
/* mobile: the language switch shrinks to a 24px corner-cut icon matching the
   download tab, so it can share the nav's row instead of owning one */
body.theme-signal-desk .hp-mobile-header .mori-locale > summary {
  width: 24px;
  min-width: 24px;
  height: 24px;
  padding: 0;
  justify-content: center;
  gap: 0;
  border: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
  box-shadow: inset 0 0 8px rgba(0, 240, 255, .45);
  color: #ffffff;
}
body.theme-signal-desk .hp-mobile-header .mori-locale > summary:hover {
  background: var(--mori-surface-page);
  color: #7df9ff;
}
body.theme-signal-desk .hp-mobile-header .mori-locale__caret { display: none; }
body.theme-signal-desk .mori-locale > nav {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  gap: 2px;
  min-width: 108px;
  padding: 6px;
  border: 1px solid rgba(20, 130, 207, .55);
  border-radius: 0;
  background: var(--mori-surface-footer);
  clip-path: polygon(12px 0, 100% 0, 100% 100%, 0 100%, 0 12px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .55);
}
body.theme-signal-desk .mori-locale > nav a {
  display: flex;
  align-items: center;
  min-width: 0;
  height: 32px;
  padding: 0 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  clip-path: none;
  color: var(--mori-ink-muted);
  opacity: 1;
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-signal-desk .mori-locale > nav a:hover {
  background: rgba(20, 130, 207, .16);
  color: #00f0ff;
}
body.theme-signal-desk .mori-locale > nav a.is-active,
body.theme-signal-desk .mori-locale > nav a[aria-current="page"] {
  background: rgba(0, 240, 255, .1);
  color: #00f0ff;
  box-shadow: inset 2px 0 0 var(--mori-accent-signal);
}

/* theme switcher relocated into the header as a glyph tab like the download and
   language tabs — the contrast-circle icon in a dark corner-cut plate, no text,
   no caret. The current theme label stays on the node as its accessible name. */
body.theme-signal-desk .hp-desktop-nav .mori-theme { position: relative; }
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  cursor: pointer;
  list-style: none;
  border: 0;
  border-radius: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
  box-shadow: inset 0 0 12px rgba(0, 240, 255, .45);
  color: #ffffff;
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary::-webkit-details-marker,
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary::marker { display: none; content: ""; }
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary:hover {
  background: var(--mori-surface-page);
  color: #00f0ff;
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary .mori-icon {
  width: 16px;
  height: 16px;
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary .mori-theme__value,
body.theme-signal-desk .hp-desktop-nav .mori-theme > summary .mori-theme__caret {
  display: none;
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > nav {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  grid-template-columns: repeat(2, max-content);
  gap: 2px;
  padding: 6px;
  border: 1px solid rgba(20, 130, 207, .55);
  border-radius: 0;
  background: var(--mori-surface-footer);
  clip-path: polygon(12px 0, 100% 0, 100% 100%, 0 100%, 0 12px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .55);
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > nav button {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  clip-path: none;
  color: var(--mori-ink-muted);
  white-space: nowrap;
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > nav button:hover {
  background: rgba(20, 130, 207, .16);
  color: #00f0ff;
}
body.theme-signal-desk .hp-desktop-nav .mori-theme > nav button[aria-pressed="true"] {
  background: rgba(0, 240, 255, .1);
  color: #00f0ff;
  box-shadow: inset 2px 0 0 var(--mori-accent-signal);
}

/* customer-service tab relocated into the header as a glyph tab like the
   language and theme tabs — a chat glyph in a dark corner-cut plate, no text */
body.theme-signal-desk .hp-desktop-nav .mori-support {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  cursor: pointer;
  border: 0;
  border-radius: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
  box-shadow: inset 0 0 12px rgba(0, 240, 255, .45);
  color: #ffffff;
}
body.theme-signal-desk .hp-desktop-nav .mori-support:hover,
body.theme-signal-desk .hp-desktop-nav .mori-support:focus-visible {
  background: var(--mori-surface-page);
  color: #00f0ff;
}
body.theme-signal-desk .hp-desktop-nav .mori-support .mori-icon {
  width: 16px;
  height: 16px;
}
body.theme-signal-desk .hp-desktop-nav .mori-support .mori-support__label {
  display: none;
}
/* mobile: the support action is a standalone header icon like the download CTA,
   pinned left of it (right:76px) so it stays visible instead of folding into
   the burger menu. It shares the download/burger corner-cut plate in the dark
   surface colour, so the cyan-filled download stays the row's one primary. */
body.theme-signal-desk .hp-mobile-header > .mori-support {
  position: absolute;
  top: 8px;
  right: 76px;
  width: 24px;
  height: 24px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
  box-shadow: inset 0 0 8px rgba(0, 240, 255, .45);
  color: #ffffff;
}
body.theme-signal-desk .hp-mobile-header > .mori-support:hover,
body.theme-signal-desk .hp-mobile-header > .mori-support:focus-visible {
  color: #00f0ff;
}
body.theme-signal-desk .hp-mobile-header > .mori-support .mori-icon {
  width: 14px;
  height: 14px;
}

/* ── hero: a console deck, cyan display over a mono standfirst ───────────── */
body.theme-signal-desk :is(.hp-hero, .ap-hero, .fp-hero, .sp-hero, .qp-hero) {
  background:
    radial-gradient(circle at 72% 28%, rgba(20, 130, 207, .22), transparent 62%),
    var(--mori-surface-content);
  border: 1px solid rgba(20, 130, 207, .5);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%);
  box-shadow: inset 0 0 24px rgba(0, 240, 255, .12);
}
/* the first screen is a deck that fills the window, not a fixed 671px band */
body.theme-signal-desk :is(.hp-hero, .fp-hero, .sp-hero, .qp-hero) {
  box-sizing: border-box;
  height: 100vh;
  height: 100svh;
  min-height: 404px;
}
body.theme-signal-desk .hp-hero { min-height: 464px; }
@media (min-width: 720px) {
  body.theme-signal-desk :is(.hp-hero, .fp-hero, .sp-hero, .qp-hero) { min-height: 671px; }
}
body.theme-signal-desk :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) {
  top: 50%;
  translate: 0 -50%;
}
/* the host gives .hp-hero-copy/.fp-hero-copy a fixed 335px width, which overflows
   viewports narrower than ~355px (320px phones). Clamp it to the same 20px-margin
   fluid width the host already uses for .sp-hero-copy, leaving it untouched where
   it fits. */
@media (max-width: 719px) {
  body.theme-signal-desk :is(.hp-hero-copy, .fp-hero-copy) {
    width: min(335px, calc(100% - 40px));
  }
}
body.theme-signal-desk :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
  top: 50%;
  translate: 0 -50%;
}
/* the qizai CTA sits at a fixed offset in the host; bring it into the copy flow
   so the whole block can be centred as one */
body.theme-signal-desk .qp-hero-copy > a {
  position: static;
  display: inline-grid;
  margin-top: 30px;
}
@media (min-width: 720px) {
  body.theme-signal-desk .qp-hero-copy > a { margin-top: 64px; }
}
/* the host pins .hp-cta/.fp-cta at a fixed absolute offset tuned for a ~68px
   one-line headline; once the wordmark grows to poster scale and wraps to two
   lines, that fixed offset lands on top of the h1/standfirst. Flow them after
   the copy like the qizai CTA so the stack is h1 -> standfirst -> CTA. */
body.theme-signal-desk :is(.hp-cta, .fp-cta) {
  position: static;
  display: inline-grid;
  margin-top: 30px;
}
/* expression A — the campaign slogan wordmark (home + fafa/santiz/qizai) */
body.theme-signal-desk :is(.hp-hero h1, .fp-hero-copy h1, .sp-hero-copy h1, .qp-hero-copy h1) {
  /* the wordmark is a console call-sign, not an editorial slogan — the 读数/监看
     soul wants the mono register (Share Tech Mono → SF Mono), not the serif voice
     that the about plate (.ap-headline) keeps for its editorial headline */
  font-family: var(--mori-type-mono);
  font-size: clamp(40px, 5.5vw, 68px);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #eaf6ff;
  text-shadow:
    0 2px 0 rgba(9, 13, 20, .85),
    0 4px 8px rgba(9, 13, 20, .55),
    0 0 16px rgba(0, 240, 255, .28);
}
/* expression B — the about plate: the brand name is a telemetry label and the
   descriptive headline is the serif voice at an editorial scale, not the 68px
   slogan wordmark */
body.theme-signal-desk .ap-brand-line {
  display: block;
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.theme-signal-desk .ap-brand-line::before { content: "> "; }
body.theme-signal-desk .ap-headline {
  display: block;
  margin-top: 10px;
  font-family: var(--mori-type-serif);
  font-size: clamp(26px, 3.4vw, 44px);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: .01em;
  color: #eaf6ff;
  text-shadow:
    0 2px 0 rgba(9, 13, 20, .85),
    0 4px 8px rgba(9, 13, 20, .55),
    0 0 16px rgba(0, 240, 255, .28);
}
/* expression C — the download plate: the same slogan wordmark as the home
   poster at a compact panel scale beside the app mark */
body.theme-signal-desk .dp-brand-copy h1 {
  font-family: var(--mori-type-serif);
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #eaf6ff;
  text-shadow:
    0 2px 0 rgba(9, 13, 20, .85),
    0 4px 8px rgba(9, 13, 20, .55),
    0 0 16px rgba(0, 240, 255, .28);
}
body.theme-signal-desk .dp-brand-copy p {
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.theme-signal-desk .dp-brand-copy p::before { content: "> "; }
body.theme-signal-desk :is(.hp-hero-description, .ap-standfirst, .fp-hero-copy p, .sp-hero-copy p) {
  color: var(--mori-ink-muted);
  font-family: var(--mori-type-mono);
  font-size: 13px;
  letter-spacing: .02em;
}
body.theme-signal-desk .hp-hero-copy > p:first-child,
body.theme-signal-desk .ap-standfirst { color: var(--mori-accent-signal); text-transform: uppercase; letter-spacing: .16em; font-size: 11px; }
body.theme-signal-desk .hp-hero-copy > p:first-child::before { content: "> "; }
body.theme-signal-desk .hp-hero-copy::after {
  content: "";
  display: block;
  width: 64px;
  height: 4px;
  margin-top: 18px;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 8px);
  opacity: .9;
}
/* the mascot is the only flat object on the deck; render it as a hologram —
   keep its native colour (the neon mecha / flame accents are part of the
   signal-desk palette) and halo it with cyan light, so it reads as a projected
   figure rather than a pasted sticker */
body.theme-signal-desk :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
  filter:
    saturate(1.12)
    contrast(1.06)
    brightness(1.06)
    drop-shadow(0 0 8px rgba(0, 240, 255, .55))
    drop-shadow(0 0 26px rgba(20, 130, 207, .5));
  opacity: .9;
}
/* phones: the mascot is a hologram ghost behind the centred copy, not a
   foreground sticker. The host already parks it at z-index:1 behind the copy
   panel (copy is z-index:2); keep that stacking so the wordmark and standfirst
   always stay readable, and render the panda larger and faint so it reads as a
   projection on the deck glass. */
@media (max-width: 719px) {
  body.theme-signal-desk :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
    display: block !important;
    position: absolute;
    top: 118px;
    right: 10px;
    left: auto;
    bottom: auto;
    width: min(60vw, 224px);
    height: auto;
    translate: none;
    z-index: 1;
    opacity: .34;
  }
}
body.theme-signal-desk .hp-company-mark img {
  filter: drop-shadow(0 0 20px rgba(20, 130, 207, .5));
  opacity: .95;
}

/* ── command deck (recompose: command-hero) ──────────────────────────────── */
body.theme-signal-desk .mori-slot {
  position: relative;
  border: 1px solid rgba(20, 130, 207, .45);
  background:
    linear-gradient(180deg, rgba(20, 130, 207, .14), rgba(20, 130, 207, 0) 55%),
    #0a2430;
  padding: 16px 18px;
}
body.theme-signal-desk .mori-slot__cap,
body.theme-signal-desk .mori-slot__foot {
  display: flex;
  align-items: center;
  gap: 10px;
}
body.theme-signal-desk .mori-slot__cap { border-bottom: 1px solid rgba(0, 240, 255, .28); padding-bottom: 7px; margin-bottom: 12px; }
body.theme-signal-desk .mori-slot__cap b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 18px;
  padding: 0 4px;
  background: #00f0ff;
  color: var(--mori-surface-page);
  font-family: var(--mori-type-mono);
  font-size: 11px;
  font-weight: 700;
  box-shadow: 0 0 10px rgba(0, 240, 255, .55);
}
body.theme-signal-desk .mori-slot__title {
  color: #00f0ff;
  font-family: var(--mori-type-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-shadow: 0 0 6px rgba(0, 240, 255, .6);
}
body.theme-signal-desk .mori-slot__dots {
  margin-left: auto;
  width: 96px;
  height: 8px;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 8px);
  opacity: .85;
}
body.theme-signal-desk .mori-slot__body { display: block; }
body.theme-signal-desk .mori-slot__foot { margin-top: 14px; color: #8FA9B7; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
body.theme-signal-desk .mori-slot__rule {
  flex: 1;
  height: 1px;
  background-image: repeating-linear-gradient(90deg, rgba(0, 240, 255, .45) 0 6px, transparent 6px 12px);
}
/* the service-panel shell lives inside a card, so its inner plate is the face */
body.theme-signal-desk .hp-service.mori-slot {
  /* the recomposed card keeps the seed's striped corner tab even though the
     generic slot plate is dropped here */
  background-color: #0a2430;
  background-image: repeating-linear-gradient(-45deg, var(--mori-accent-signal) 0 5px, rgba(10, 36, 48, 0) 5px 11px);
  background-size: 84px 28px;
  background-position: right top;
  background-repeat: no-repeat;
  border: 0;
  padding: 14px 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
body.theme-signal-desk .hp-service .mori-slot__cap { gap: 8px; padding-bottom: 6px; margin-bottom: 8px; }
body.theme-signal-desk .hp-service .mori-slot__cap h3 {
  font-family: var(--mori-type-display);
  font-size: 13px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #ffffff;
}
body.theme-signal-desk .hp-service .mori-slot__body p { color: var(--mori-ink-muted); font-size: 12px; }
body.theme-signal-desk .hp-service .mori-slot__dots { display: none; }
body.theme-signal-desk .hp-service .mori-slot__foot { margin-top: 10px; }
/* The host jumps to four across at 720px with 72px gutters; our card
   furniture has a wider min-content than that leaves, and the grid pushes
   the page sideways from 720 to ~900. Two rows of two keep every card
   legible across the tablet band. */
@media (min-width: 720px) and (max-width: 1023px) {
  body.theme-signal-desk .hp-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
}

/* ── section survey bars (recompose: section-bar) ────────────────────────── */
body.theme-signal-desk .mori-section { border-top: 1px solid rgba(20, 130, 207, .45); padding-top: 10px; }
body.theme-signal-desk .mori-section__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
body.theme-signal-desk .mori-section__idx {
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
}
body.theme-signal-desk .mori-section__idx::before { content: ">"; margin-right: 5px; }
body.theme-signal-desk .mori-section__rule {
  flex: 1;
  height: 2px;
  background-image: repeating-linear-gradient(90deg, rgba(0, 240, 255, .55) 0 9px, transparent 9px 15px);
  opacity: .8;
}
body.theme-signal-desk .hp-section-heading > p,
body.theme-signal-desk .ap-section-heading > p {
  color: var(--mori-accent-signal);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
body.theme-signal-desk .hp-section-heading > p::before,
body.theme-signal-desk .ap-section-heading > p::before { content: "> "; }
body.theme-signal-desk .hp-section-heading h2,
body.theme-signal-desk .hp-section-heading h3,
body.theme-signal-desk .ap-section-heading h2 {
  color: #00f0ff;
  font-family: var(--mori-type-display);
  font-size: clamp(20px, 2.4vw, 28px);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 0 6px rgba(0, 240, 255, .55);
}
body.theme-signal-desk .hp-section-description { color: var(--mori-ink-muted); font-family: var(--mori-type-mono); }
/* every section masthead is a cyan status title, not default ink */
body.theme-signal-desk :is(.hp-page, .ap-page, .fp-page, .sp-page, .qp-page, .dp-page) section > h2,
body.theme-signal-desk :is(h2, h3).ap-section-title,
body.theme-signal-desk .mori-section :is(h2, h3) {
  color: #00f0ff;
  font-family: var(--mori-type-display);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 0 6px rgba(0, 240, 255, .55);
}

/* ── about / inner-page shells ───────────────────────────────────────────── */
/* the about masthead and the technical band paint their own light plate in
   the host CSS; on this theme the console canvas is the only plate */
body.theme-signal-desk .ap-header {
  background: transparent;
  border-bottom: 1px solid rgba(20, 130, 207, .35);
}
/* mobile only: the host sizes this wrapper for its in-flow 104px header; the
   theme makes the header a fixed 40px bar, so collapse the wrapper to 40px so
   the deck + copy sit flush under the bar (the 80px hero padding below already
   clears the status chip). ≥720px the host's 128px wrapper is kept — the deck
   overlays fill it, so collapsing it would drop the title onto the ticker. */
@media (max-width: 719px) {
  body.theme-signal-desk .ap-header { height: 40px; }
}
body.theme-signal-desk .ap-band { background: transparent; }
body.theme-signal-desk .dp-top { background: transparent; }
body.theme-signal-desk .dp-page { min-width: 0; }
body.theme-signal-desk .dp-page .hp-mobile-header { width: 100%; height: 40px; }
/* the download hero band is flush; on mobile the fixed 40px bar would cover its
   brand copy, so offset the page body by the header height */
@media (max-width: 719px) {
  body.theme-signal-desk .dp-page { padding-top: 40px; }
}
body.theme-signal-desk .lp-document :is(p, li, td, th) { color: var(--mori-ink-base); }
body.theme-signal-desk .lp-document > :is(p, ul, ol, blockquote, table) { max-width: 68ch; }
/* legal prose: the host collapses paragraph margins, leaving a cramped ~8-10px
   rhythm; give the document real breathing room between paragraphs and items */
body.theme-signal-desk .lp-document p { margin: 15px 0; }
body.theme-signal-desk .lp-document li { margin: 6px 0; }
body.theme-signal-desk .lp-document :is(h2, h3) {
  color: #00f0ff;
  font-family: var(--mori-type-display);
  font-size: 20px;
  line-height: 1.35;
  margin: 30px 0 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 0 6px rgba(0, 240, 255, .55);
}
body.theme-signal-desk :is(.ap-intro, .ap-product, .ap-technical, .ap-section-title) {
  color: var(--mori-ink-base);
}
body.theme-signal-desk .ap-intro :is(p, li, dd, dt, span) { color: var(--mori-ink-base); }
body.theme-signal-desk .ap-hero .ap-focus li { color: var(--mori-brand-ink); }
body.theme-signal-desk .ap-focus-label {
  color: var(--mori-brand-ink);
  text-shadow: 0 0 8px rgba(0, 240, 255, .35);
}
/* service/capability artwork is line art; invert it for the dark face */
body.theme-signal-desk :is(.hp-service, .ap-product, .qp-capability-grid article) .mori-slot__body img {
  width: 30px;
  height: 30px;
  margin-bottom: 8px;
  filter: brightness(0) invert(1);
  opacity: .7;
}

/* ── status readouts (recompose: telemetry-row) ──────────────────────────── */
body.theme-signal-desk .mori-readout {
  position: relative;
  display: grid;
  grid-template-columns: 46px 110px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 2px 12px;
  padding: 8px 12px 10px 20px;
  background: linear-gradient(90deg, rgba(20, 130, 207, .16), rgba(20, 130, 207, 0) 62%);
  border-bottom: 1px solid rgba(20, 130, 207, .35);
}
body.theme-signal-desk .mori-readout::before {
  content: ">";
  position: absolute;
  left: 6px;
  top: 8px;
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-weight: 700;
}
body.theme-signal-desk .mori-readout:hover {
  background: linear-gradient(90deg, rgba(0, 240, 255, .16), rgba(20, 130, 207, 0) 72%);
}
body.theme-signal-desk .mori-readout__idx {
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
}
body.theme-signal-desk .mori-readout__measure {
  color: var(--mori-accent-readout);
  font-family: var(--mori-type-mono);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
}
body.theme-signal-desk .mori-readout__unit { color: #a9c2cf; font-size: 10px; letter-spacing: .1em; }
body.theme-signal-desk .mori-readout__main { grid-column: 3; color: var(--mori-ink-base); font-family: var(--mori-type-mono); }
body.theme-signal-desk .mori-readout__main :is(h3, h4) {
  color: #ffffff;
  font-family: var(--mori-type-mono);
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-signal-desk .mori-readout__meter {
  grid-column: 2 / -1;
  grid-row: 2;
  height: 4px;
  margin-top: 5px;
  background: rgba(255, 255, 255, .1);
  overflow: hidden;
}
body.theme-signal-desk .mori-readout__meter i {
  display: block;
  height: 100%;
  background: #00f0ff;
  animation: mori-signal-pulse 2s infinite alternate;
}

/* ── data pairs (recompose: data-pair) ───────────────────────────────────── */
body.theme-signal-desk .mori-pair {
  position: relative;
  padding: 7px 0 7px 18px;
  border-bottom: 1px dashed rgba(20, 130, 207, .4);
}
body.theme-signal-desk .mori-pair::before {
  content: ">";
  position: absolute;
  left: 2px;
  top: 7px;
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-weight: 700;
}
body.theme-signal-desk .mori-pair__idx {
  display: inline-block;
  min-width: 34px;
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
}
body.theme-signal-desk .mori-pair > :not(.mori-pair__idx) { color: var(--mori-ink-base); }
body.theme-signal-desk .mori-pair dd { color: var(--mori-accent-readout); font-family: var(--mori-type-mono); }

/* ── module band (recompose: module-band) ────────────────────────────────── */
body.theme-signal-desk .mori-band {
  border: 1px solid rgba(20, 130, 207, .5);
  background: var(--mori-surface-footer);
  box-shadow: inset 0 0 22px rgba(0, 240, 255, .1);
}
body.theme-signal-desk .mori-band__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px;
  background: var(--mori-accent-primary);
  color: var(--mori-surface-page);
  clip-path: polygon(0 0, 100% 0, 100% 70%, 97% 100%, 3% 100%, 0 70%);
  box-shadow: inset 0 .3em .7em rgba(0, 240, 255, .6);
}
body.theme-signal-desk .mori-band__idx { font-family: var(--mori-type-mono); font-size: 11px; font-weight: 700; letter-spacing: .12em; }
body.theme-signal-desk .mori-band__label { font-family: var(--mori-type-display); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
body.theme-signal-desk .mori-band__ticks {
  margin-left: auto;
  width: 84px;
  height: 7px;
  background-image: repeating-linear-gradient(90deg, var(--mori-surface-page) 0 4px, transparent 4px 8px);
  opacity: .7;
}
body.theme-signal-desk .mori-band__body { padding: 20px; }

/* ── cut-corner readout cards: glow plate + glass face ───────────────────── */
/* The seed's card is two layers plus a pink hazard wedge: a #1482cf radial
   plate clipped to the seed profile, a glass face inset 5px with the bottom
   tabs and top-right wedge bitten out, terminal dots along the bottom, a pink
   corner tick, and the hatch showing through the top-right cut-out. */
body.theme-signal-desk :is(
  .hp-service, .ap-product, .fp-feature-art,
  .qp-capability-grid article
) {
  position: relative;
  z-index: 0;
  border-radius: 0;
  background-color: #0a2430;
  background-image: repeating-linear-gradient(-45deg, var(--mori-accent-signal) 0 5px, rgba(10, 36, 48, 0) 5px 11px);
  background-size: 84px 28px;
  background-position: right top;
  background-repeat: no-repeat;
  box-shadow: 0 0 0 1px rgba(20, 130, 207, .35);
  transition: transform .3s ease;
}
body.theme-signal-desk :is(
  .hp-service, .ap-product, .fp-feature-art,
  .qp-capability-grid article
)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background: radial-gradient(circle, rgba(20, 130, 207, 0) 72%, rgba(20, 130, 207, 1) 100%);
  clip-path: polygon(
    0 0,
    0 100%,
    25% 100%,
    calc(25% + 10px) calc(100% - 10px),
    calc(38% - 10px) calc(100% - 10px),
    38% 100%,
    62% 100%,
    calc(62% + 10px) calc(100% - 10px),
    calc(75% - 10px) calc(100% - 10px),
    75% 100%,
    100% 100%,
    100% 28px,
    calc(100% - 84px) 28px,
    calc(100% - 90px) 0
  );
  animation: mori-signal-plate 1.6s infinite alternate;
}
body.theme-signal-desk :is(
  .hp-service, .ap-product, .fp-feature-art,
  .qp-capability-grid article
)::after {
  content: "";
  position: absolute;
  inset: 5px;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 40%, rgba(10, 36, 48, 0) 70%, rgba(0, 240, 255, .12) 100%),
    radial-gradient(circle, var(--mori-accent-signal) 0 1.4px, transparent 1.8px) 0 calc(100% - 9px) / 10px 10px repeat-x,
    linear-gradient(135deg, rgba(229, 98, 192, .6) 0 12px, transparent 12px) 0 0 / 12px 12px no-repeat;
  clip-path: polygon(
    0 0,
    0 100%,
    25% 100%,
    calc(25% + 10px) calc(100% - 10px),
    calc(38% - 10px) calc(100% - 10px),
    38% 100%,
    62% 100%,
    calc(62% + 10px) calc(100% - 10px),
    calc(75% - 10px) calc(100% - 10px),
    75% 100%,
    100% 100%,
    100% 28px,
    calc(100% - 84px) 28px,
    calc(100% - 90px) 0
  );
  border: 1px solid rgba(0, 240, 255, .22);
  box-shadow: inset 0 0 15px rgba(0, 240, 255, .3);
  animation: mori-signal-dots 10s linear infinite;
}
body.theme-signal-desk :is(.hp-service, .ap-product, .qp-capability-grid article):hover {
  transform: translateY(-5px);
  z-index: 10;
}
/* host cards carry no padding; the inset face needs room for the tabs */
body.theme-signal-desk .hp-service { padding: 14px 14px 16px; }
body.theme-signal-desk .ap-product { padding: 20px 18px 24px; }
body.theme-signal-desk .qp-capability-grid article { padding: 16px 18px 22px; }
body.theme-signal-desk .fp-feature-art { padding: 8px; overflow: hidden; }
/* the host carousel hard-clips the third card at the viewport edge, slicing its
   caption mid-word; fade the right edge so the peek reads as "more" not as a
   broken caption */
body.theme-signal-desk .fp-feature-track {
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 80px), transparent 100%);
  mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 80px), transparent 100%);
}
/* feature plates are white-background line art; invert the plate and screen the
   black away so the drawing reads as neon line work on the cut face */
body.theme-signal-desk .fp-feature-art img {
  filter: invert(1) hue-rotate(160deg) saturate(1.3) contrast(1.05);
  mix-blend-mode: screen;
  opacity: .9;
}
body.theme-signal-desk .sp-capability {
  position: relative;
  padding: 20px 16px 24px;
  clip-path: polygon(
    0 0,
    0 100%,
    25% 100%,
    calc(25% + 10px) calc(100% - 10px),
    calc(38% - 10px) calc(100% - 10px),
    38% 100%,
    62% 100%,
    calc(62% + 10px) calc(100% - 10px),
    calc(75% - 10px) calc(100% - 10px),
    75% 100%,
    100% 100%,
    100% 28px,
    calc(100% - 84px) 28px,
    calc(100% - 90px) 0
  );
  box-shadow: inset 0 0 15px rgba(0, 240, 255, .28);
}
/* the three santiz modules are cards like every other: a 45-degree pink tab in
   the cut corner and the seed's dotted telemetry baseline along the bottom */
body.theme-signal-desk .sp-capability::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 84px;
  height: 28px;
  z-index: 2;
  pointer-events: none;
  background-image: repeating-linear-gradient(-45deg, var(--mori-accent-signal) 0 5px, rgba(10, 36, 48, 0) 5px 11px);
}
body.theme-signal-desk .sp-capability::before {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 12px;
  height: 3px;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 9px);
  opacity: .75;
}
/* the santiz page ships its own green capability palette; replace the painted
   faces with the desk glass so the three modules read as one console */
body.theme-signal-desk :is(.sp-capability-trading, .sp-capability-hosting, .sp-capability-market) {
  color: var(--mori-ink-base);
  background: linear-gradient(160deg, rgba(10, 36, 48, .94), rgba(7, 27, 36, .94));
}
body.theme-signal-desk .sp-capability-market {
  color: var(--mori-ink-strong);
  background: linear-gradient(160deg, rgba(20, 130, 207, .34), rgba(10, 36, 48, .94));
}
body.theme-signal-desk .sp-capability img {
  filter: brightness(0) invert(1);
  opacity: .85;
}
body.theme-signal-desk .sp-capability-ampersand { filter: brightness(0) invert(1); opacity: .1; }
body.theme-signal-desk .sp-capability-pattern > img { filter: brightness(0) invert(1); opacity: .22; }
/* the empty console panel beside the capability modules gets the deck mascot:
   qizai's scooter drawing, recoloured to a black-and-white panda with a cyan
   deck. Motion reads as speed, the monochrome face as the desk's own model.
   The host mirrors this panel (scaleX(-1)) for its border motif, so the panel
   must un-flip the drawing back and place it in mirrored coordinates. */
body.theme-signal-desk .sp-capability-pattern {
  filter: drop-shadow(0 0 14px rgba(0, 240, 255, .28));
}
body.theme-signal-desk .sp-capability-pattern::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  width: 181px;
  height: 181px;
  transform: translateY(-50%) scaleX(-1);
  background-image:
    url("../santiz-assets/capability-panda.svg"),
    repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 5px, transparent 5px 10px);
  background-size: auto 100%, 150px 3px;
  background-position: 50% 50%, 50% 100%;
  background-repeat: no-repeat;
}
body.theme-signal-desk .sp-capability-pattern::after {
  content: "";
  position: absolute;
  left: 6%;
  top: 50%;
  width: 46%;
  height: 40px;
  translate: 0 -50%;
  pointer-events: none;
  background-image: repeating-linear-gradient(0deg, rgba(0, 240, 255, .45) 0 2px, transparent 2px 13px);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%, #000);
  mask-image: linear-gradient(90deg, transparent, #000 55%, #000);
  opacity: .55;
}
/* on narrow panels there is no room behind the mascot for a trail */
@media (max-width: 900px) {
  body.theme-signal-desk .sp-capability-pattern::after { display: none; }
}
body.theme-signal-desk .sp-highlight-list,
body.theme-signal-desk .sp-highlight-list li { color: var(--mori-accent-readout); }
body.theme-signal-desk .sp-highlight-list li::marker { color: var(--mori-accent-signal); }
body.theme-signal-desk .sp-hosting-section { color: var(--mori-ink-base); background: var(--mori-surface-footer); }
/* the colocation photo is a green-lit world map; recolour it into the desk's
   blue field and lay the console gradient back over it */
body.theme-signal-desk .sp-hosting-media img {
  filter: grayscale(1) sepia(1) saturate(3.2) hue-rotate(165deg) brightness(.62) contrast(1.15);
}
body.theme-signal-desk .sp-hosting-media::after {
  background:
    linear-gradient(90deg, rgba(7, 27, 36, .96), rgba(7, 27, 36, .28)),
    linear-gradient(rgba(7, 27, 36, .5), rgba(7, 27, 36, .62));
}
body.theme-signal-desk .sp-hosting-copy > img { filter: brightness(0) invert(1); opacity: .8; }

/* santiz ships three engineering drawings as flat images. Inlined, each runs
   as a live diagram: a lit segment travels the arcs and links while lanes,
   lamps and nodes step through four opacity states. The panda plates inside
   the drawings stay still. */
body.theme-signal-desk .sp-technical-picture[data-mori-fx="signal"] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(20, 130, 207, .28);
  background: var(--mori-surface-footer);
  box-shadow: inset 0 0 24px rgba(0, 240, 255, .08);
}
body.theme-signal-desk .sp-technical-picture[data-mori-fx="signal"] svg {
  display: block;
  width: 100%;
  height: auto;
}
body.theme-signal-desk .mori-fx-svg .mori-fx-bg { fill: var(--mori-surface-footer); }
body.theme-signal-desk .mori-fx-svg .mori-fx-panel {
  fill: #0a2430;
  stroke: rgba(0, 240, 255, .32);
  stroke-width: 1;
  animation: mori-fx-glow 4.2s ease-in-out infinite;
}
body.theme-signal-desk .mori-fx-svg :is(path, rect)[fill="#6EB05A"],
body.theme-signal-desk .mori-fx-svg :is(path, rect)[fill="#52B578"] {
  fill: var(--mori-accent-readout);
}
body.theme-signal-desk .mori-fx-svg .mori-fx-trace {
  fill: none;
  stroke: #7df9ff;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-dasharray: 6 94;
  animation: mori-fx-run var(--d, 2.6s) linear infinite;
  animation-delay: var(--p, 0s);
}
body.theme-signal-desk .mori-fx-svg :is(.mori-fx-arrow, .mori-fx-lane) {
  animation: mori-fx-led var(--d, 3s) linear infinite;
  animation-delay: var(--p, 0s);
}
body.theme-signal-desk .mori-fx-svg :is(.mori-fx-link, .mori-fx-node) {
  animation: mori-fx-pulse var(--d, 3.4s) linear infinite;
  animation-delay: var(--p, 0s);
}
body.theme-signal-desk .mori-fx-svg .mori-fx-dot {
  transform-box: fill-box;
  transform-origin: center;
  animation: mori-fx-dot var(--d, 3.2s) linear infinite;
  animation-delay: var(--p, 0s);
}
body.theme-signal-desk .mori-fx-svg .mori-fx-scan { animation: mori-fx-scan 2.6s linear infinite; }
@keyframes mori-fx-run { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -100; } }
@keyframes mori-fx-led {
  0%, 24.9% { opacity: .28; }
  25%, 49.9% { opacity: .52; }
  50%, 74.9% { opacity: .76; }
  75%, 100% { opacity: 1; }
}
@keyframes mori-fx-pulse {
  0%, 24.9% { opacity: .45; }
  25%, 49.9% { opacity: .62; }
  50%, 74.9% { opacity: .8; }
  75%, 100% { opacity: 1; }
}
@keyframes mori-fx-dot {
  0%, 24.9% { opacity: .25; transform: scale(.7); }
  25%, 49.9% { opacity: .5; transform: scale(.9); }
  50%, 74.9% { opacity: .78; transform: scale(1.05); }
  75%, 100% { opacity: 1; transform: scale(1.3); }
}
@keyframes mori-fx-glow { 0%, 100% { stroke-opacity: .5; } 50% { stroke-opacity: 1; } }
@keyframes mori-fx-scan { to { stroke-dashoffset: -8; } }

/* fafa feature plates are white-background line illustrations. Inlined, the
   white plate is dropped into the desk glass, the black line work turns pale
   cyan and a light rides the outlines. Stroked outlines animate; the panda
   mark is a filled shape, so it keeps still. */
body.theme-signal-desk .fp-feature-art[data-mori-fx="plate"] svg {
  display: block;
  width: 100%;
  height: auto;
  clip-path: polygon(
    0 0,
    0 100%,
    25% 100%,
    calc(25% + 10px) calc(100% - 10px),
    calc(38% - 10px) calc(100% - 10px),
    38% 100%,
    62% 100%,
    calc(62% + 10px) calc(100% - 10px),
    calc(75% - 10px) calc(100% - 10px),
    75% 100%,
    100% 100%,
    100% 28px,
    calc(100% - 84px) 28px,
    calc(100% - 90px) 0
  );
}
body.theme-signal-desk .mori-fx-plate .mori-fx-plate-bg { fill: transparent; }
body.theme-signal-desk .mori-fx-plate :is(path, line, ellipse, rect, circle)[stroke="black"] {
  stroke: rgba(206, 248, 255, .84);
}
body.theme-signal-desk .mori-fx-plate :is(path, ellipse, rect, circle)[fill="white"]:not(.mori-fx-plate-bg),
body.theme-signal-desk .mori-fx-plate :is(path, ellipse, rect, circle)[fill="#F5F5F5"],
body.theme-signal-desk .mori-fx-plate :is(path, ellipse, rect, circle)[fill="#F4F5F5"] {
  fill: rgba(12, 44, 58, .95);
}
body.theme-signal-desk .mori-fx-plate :is(path, circle, rect, ellipse)[fill="black"] {
  fill: rgba(224, 250, 255, .92);
}
body.theme-signal-desk .mori-fx-plate .mori-fx-trace {
  stroke: #7df9ff;
  stroke-width: 1.5;
  stroke-dasharray: 9 91;
}

/* qizai capability glyphs: white plate and knockouts dropped, black geometry
   lifted to pale cyan, a travelling light on every path and node ring. The
   svg replaces an img, so the base stylesheet's 100px box and its 720px margin
   step are restated here. */
body.theme-signal-desk .qp-capability-grid article > svg.mori-fx-glyph {
  display: block;
  width: 100px;
  height: 100px;
  margin-top: 32px;
}
@media (min-width: 720px) {
  body.theme-signal-desk .qp-capability-grid article > svg.mori-fx-glyph { margin-top: 16px; }
}
body.theme-signal-desk .mori-fx-glyph [stroke="black"] { stroke: rgba(206, 248, 255, .9); }
body.theme-signal-desk .mori-fx-glyph [fill="black"] { fill: rgba(216, 246, 255, .95); }
body.theme-signal-desk .mori-fx-glyph .mori-fx-trace {
  stroke: #7df9ff;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-dasharray: 12 88;
  animation: mori-fx-run var(--d, 3.6s) linear infinite;
  animation-delay: var(--p, 0s);
}

/* download tiles ship as flat black chips; give them the desk face instead */
body.theme-signal-desk :is(.fp-download-link, .dp-download-link, .qp-download-list a) {
  color: var(--mori-ink-base);
  background: linear-gradient(160deg, rgba(10, 36, 48, .94), rgba(7, 27, 36, .94));
  border: 1px solid rgba(20, 130, 207, .38);
  box-shadow: inset 0 0 12px rgba(0, 240, 255, .12);
}
body.theme-signal-desk :is(.fp-download-link, .dp-download-link, .qp-download-list a):hover {
  border-color: rgba(0, 240, 255, .68);
  box-shadow: inset 0 0 16px rgba(0, 240, 255, .22);
}
/* the qizai backdrop grid is drawn in black; redraw it in cyan */
body.theme-signal-desk .qp-grid {
  opacity: .55;
  background-image:
    linear-gradient(rgba(0, 240, 255, .16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 240, 255, .16) 1px, transparent 1px);
}
/* qizai accordion icon plates are white-background line art */
body.theme-signal-desk .qp-page article > img {
  filter: invert(1) hue-rotate(160deg) saturate(1.3) contrast(1.05);
  mix-blend-mode: screen;
  opacity: .92;
}
/* the two stacked services ship without art; draw them in the same line
   language as the multilingual globe, one step quieter than the copy */
body.theme-signal-desk[data-mori-scene="qizai"] .qp-service-stack .qp-service {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  column-gap: 16px;
  align-items: center;
}
body.theme-signal-desk[data-mori-scene="qizai"] .qp-service-stack .qp-service::before {
  content: "";
  grid-column: 1;
  grid-row: 1 / span 2;
  display: block;
  width: 48px;
  height: 48px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 48px 48px;
  filter: invert(1) hue-rotate(160deg) saturate(1.3) contrast(1.05);
  mix-blend-mode: screen;
  opacity: .78;
}
body.theme-signal-desk[data-mori-scene="qizai"] .qp-service-stack .qp-service:nth-child(1)::before {
  background-image: url("/qizai-assets/service-fafa.svg");
}
body.theme-signal-desk[data-mori-scene="qizai"] .qp-service-stack .qp-service:nth-child(2)::before {
  background-image: url("/qizai-assets/service-markets.svg");
}
@media (min-width: 720px) {
  body.theme-signal-desk[data-mori-scene="qizai"] .qp-service-stack .qp-service {
    grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 22px;
  }
  body.theme-signal-desk[data-mori-scene="qizai"] .qp-service-stack .qp-service::before {
    width: 56px;
    height: 56px;
    background-size: 56px 56px;
  }
}
/* the agent panel texture is drawn in black; flip it to a cyan field */
body.theme-signal-desk .qp-agent-panel img {
  filter: invert(1);
  mix-blend-mode: screen;
  opacity: .16;
}
body.theme-signal-desk .hp-service h3,
body.theme-signal-desk .ap-product h3,
body.theme-signal-desk .qp-capability-grid h3 { color: #ffffff; font-family: var(--mori-type-display); letter-spacing: .06em; }
body.theme-signal-desk :is(.hp-service p, .ap-product p, .qp-capability-grid p) { color: #b9d2e0; }
body.theme-signal-desk :is(.ap-product, .ap-intro, .ap-technical, .ap-office) :is(li, dd, dt, strong) {
  color: #b9d2e0;
}
body.theme-signal-desk .hp-latency-copy p { color: #8FA9B7; }
/* the host's responsive latency copy hides the FPGA gateway readouts (上行 338ns /
   下行 922ns) below 720px and substitutes two empty mobile-only headings. The desk
   already surfaces those numbers through telemetry-row, so keep the desktop copy
   visible on every width and drop the hollow mobile-only articles — the readout
   grid reflows instead of hiding real data. */
body.theme-signal-desk .hp-latency .hp-desktop-only { display: block !important; }
body.theme-signal-desk .hp-latency .hp-mobile-only { display: none !important; }
body.theme-signal-desk .hp-latency-chart { position: relative; overflow: hidden; background: transparent; }
body.theme-signal-desk .hp-latency-chart img {
  filter: invert(1) hue-rotate(160deg) saturate(1.5) brightness(.95);
}
/* the theme runtime inlines the plot; grid dots animate as four interleaved
   phase groups and each trace dot runs its own cycle (duration and phase
   stamped as --d / --p), so the matrix reads as a pixel display */
body.theme-signal-desk .hp-latency-chart svg { display: block; width: 100%; height: 100%; }
body.theme-signal-desk .hp-latency-chart svg circle {
  fill: rgba(0, 240, 255, .55);
  stroke: none;
}
body.theme-signal-desk .hp-latency-chart svg .mori-led-layer {
  animation: mori-led-grid 4.2s linear infinite;
}
body.theme-signal-desk .hp-latency-chart svg .mori-led-layer--1 { animation-delay: -1.05s; }
body.theme-signal-desk .hp-latency-chart svg .mori-led-layer--2 { animation-delay: -2.1s; }
body.theme-signal-desk .hp-latency-chart svg .mori-led-layer--3 { animation-delay: -3.15s; }
body.theme-signal-desk .hp-latency-chart svg circle[fill="black"] {
  fill: #d8f6ff;
  animation: mori-led-dot var(--d, 2.8s) linear infinite;
  animation-delay: var(--p, 0s);
  transform-box: fill-box;
  transform-origin: center;
}
body.theme-signal-desk .hp-latency-chart svg circle[stroke="black"] {
  fill: none;
  stroke: rgba(0, 240, 255, .85);
  animation: mori-led-dot var(--d, 2.8s) linear infinite;
  animation-delay: var(--p, 0s);
  transform-box: fill-box;
  transform-origin: center;
}
@keyframes mori-led-grid {
  0%, 24.9% { opacity: .12; }
  25%, 49.9% { opacity: .2; }
  50%, 74.9% { opacity: .3; }
  75%, 100% { opacity: .42; }
}
@keyframes mori-led-dot {
  0%, 24.9% { opacity: .18; transform: scale(.55); }
  25%, 49.9% { opacity: .45; transform: scale(.8); }
  50%, 74.9% { opacity: .75; transform: scale(1.05); }
  75%, 100% { opacity: 1; transform: scale(1.45); }
}

/* ── figures, media, buttons ─────────────────────────────────────────────── */
body.theme-signal-desk .hp-latency-chart,
body.theme-signal-desk .ap-figure {
  border: 1px solid rgba(20, 130, 207, .45);
  background: var(--mori-surface-footer);
  box-shadow: inset 0 0 18px rgba(0, 240, 255, .1);
}
body.theme-signal-desk .hp-office-map img {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: none;
  object-fit: cover;
  object-position: 50% 50%;
  filter: saturate(1.06) contrast(1.04);
}
/* the survey is inlined as live SVG; the <img> rule above only covers the
   stock fallback before the fetch resolves */
body.theme-signal-desk .hp-office-map .mori-map-svg {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  filter: saturate(1.06) contrast(1.04);
}
body.theme-signal-desk .hp-office-map::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  box-shadow:
    inset 0 0 0 1px rgba(0, 240, 255, .18),
    inset 0 0 54px rgba(0, 0, 0, .55);
}
/* The stock map is a satellite crop. The deck swaps it for a 4:1 holographic
   nightline survey of Sheung Wan and Central, rendered from OpenStreetMap
   geometry. Because the panorama fills the 300px band exactly, the office
   marker keeps a fixed position at 50% / 62% of the container at every
   width — narrow viewports crop the sides, never the anchor. */
body.theme-signal-desk .mori-map-hud {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}
body.theme-signal-desk .mori-map-hud > * {
  position: absolute;
  left: 50%;
  top: 62%;
}
body.theme-signal-desk .mori-map-sweep {
  width: 400px;
  height: 400px;
  margin: -200px 0 0 -200px;
  border-radius: 50%;
  background: conic-gradient(
    from 0deg,
    rgba(0, 240, 255, 0) 0deg,
    rgba(0, 240, 255, 0) 262deg,
    rgba(0, 240, 255, .045) 296deg,
    rgba(0, 240, 255, .12) 332deg,
    rgba(125, 249, 255, .24) 357deg,
    rgba(229, 98, 192, .40) 360deg);
  -webkit-mask-image: radial-gradient(circle, #000 0 9%, rgba(0, 0, 0, .7) 36%, rgba(0, 0, 0, .28) 60%, transparent 73%);
  mask-image: radial-gradient(circle, #000 0 9%, rgba(0, 0, 0, .7) 36%, rgba(0, 0, 0, .28) 60%, transparent 73%);
  mix-blend-mode: screen;
  animation: mori-radar-spin 8s linear infinite;
}
body.theme-signal-desk .mori-map-ring {
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  border: 1px solid rgba(229, 98, 192, .9);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(229, 98, 192, .5);
  animation: mori-map-ripple 3.6s cubic-bezier(.2, .6, .35, 1) infinite;
}
body.theme-signal-desk .mori-map-ring--b { animation-delay: 1.8s; }
body.theme-signal-desk .mori-map-core {
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(229, 98, 192, .85), rgba(229, 98, 192, 0) 70%);
  animation: mori-map-core 2.8s ease-in-out infinite;
}
body.theme-signal-desk .mori-map-scan {
  left: 0;
  top: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0, 240, 255, .5), transparent);
  box-shadow: 0 0 12px rgba(0, 240, 255, .35);
  animation: mori-map-scan 7s linear infinite;
}
body.theme-signal-desk .mori-map-live {
  left: calc(50% - 84px);
  top: calc(62% + 30px);
  color: var(--mori-accent-signal);
  font: 600 8px/1 "Share Tech Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  letter-spacing: .18em;
  white-space: nowrap;
  text-shadow: 0 0 4px rgba(229, 98, 192, .5);
}
body.theme-signal-desk .mori-map-live b {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--mori-accent-signal);
  box-shadow: 0 0 7px var(--mori-accent-signal);
  vertical-align: 1px;
  animation: mori-map-blink 1.8s steps(1, end) infinite;
}
body.theme-signal-desk .mori-map-callout {
  left: calc(50% + 30px);
  top: calc(62% - 24px);
  padding: 7px 13px 7px 11px;
  border-left: 2px solid var(--mori-accent-signal);
  background: rgba(4, 7, 13, .84);
  box-shadow: 0 0 18px rgba(229, 98, 192, .14);
  font-family: "Share Tech Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  line-height: 1.4;
  text-align: left;
  white-space: nowrap;
}
body.theme-signal-desk .mori-map-callout b {
  display: block;
  color: var(--mori-accent-signal);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .2em;
}
body.theme-signal-desk .mori-map-callout i {
  display: block;
  color: rgba(125, 249, 255, .75);
  font-size: 7.5px;
  font-style: normal;
  letter-spacing: .1em;
}
body.theme-signal-desk .mori-map-callout em {
  display: block;
  color: rgba(0, 240, 255, .5);
  font-size: 6.5px;
  font-style: normal;
  letter-spacing: .08em;
}
@media (max-width: 559px) {
  body.theme-signal-desk .mori-map-callout {
    left: 50%;
    top: calc(62% + 26px);
    transform: translateX(-50%);
    padding: 6px 10px;
    border-left: 0;
    border-top: 2px solid var(--mori-accent-signal);
    text-align: center;
  }
  body.theme-signal-desk .mori-map-callout b { font-size: 9px; }
  body.theme-signal-desk .mori-map-callout i { font-size: 7px; }
  body.theme-signal-desk .mori-map-callout em { font-size: 6px; }
  body.theme-signal-desk .mori-map-sweep { width: 260px; height: 260px; margin: -130px 0 0 -130px; }
  body.theme-signal-desk .mori-map-live { display: none; }
}
@keyframes mori-radar-spin { to { transform: rotate(360deg); } }
@keyframes mori-map-ripple {
  0% { opacity: 0; transform: scale(.45); }
  12% { opacity: 1; }
  70%, 100% { opacity: 0; transform: scale(5.6); }
}
@keyframes mori-map-core {
  0%, 100% { opacity: .35; transform: scale(.75); }
  50% { opacity: 1; transform: scale(1.4); }
}
@keyframes mori-map-scan {
  0% { top: -2%; opacity: 0; }
  8%, 86% { opacity: .5; }
  100% { top: 102%; opacity: 0; }
}
@keyframes mori-map-blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: .18; }
}
/* the licence illustration is black line art on transparency, which the dark
   desk field swallows. Flatten it to white, push it cyan, bloom it, and run a
   hologram refresh: long steady, two quick dips, then steady again. */
body.theme-signal-desk .hp-licence > img {
  filter: brightness(0) invert(1) sepia(1) saturate(10) hue-rotate(140deg)
          drop-shadow(0 0 6px rgba(0, 240, 255, .55));
  mix-blend-mode: screen;
  opacity: .78;
  animation: mori-holo-flicker 9s linear infinite;
}
@keyframes mori-holo-flicker {
  0%, 63.9% { opacity: .78; }
  64%, 65.4% { opacity: .34; }
  65.5%, 70.9% { opacity: .86; }
  71%, 72.4% { opacity: .52; }
  72.5%, 100% { opacity: .8; }
}
/* phone: the host pins the licence seal with position:absolute at top:196px, which
   lands it on top of the licence pairs below 720px. Take it out of the pinned slot
   and stack it under the copy in normal flow so the readout pairs stay readable. */
@media (max-width: 719px) {
  body.theme-signal-desk .hp-licence > img {
    position: static;
    display: block;
    width: min(100%, 200px);
    height: auto;
    margin: 24px auto 0;
  }
}
body.theme-signal-desk :is(.hp-cta, .ap-cta, .fp-cta, .qp-cta, .sp-pill, .qp-hero-copy > a, .mori-theme-switch button) {
  border: 0;
  border-radius: 0;
  background-color: var(--mori-accent-primary);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(10, 32, 43, .12));
  color: var(--mori-surface-page);
  clip-path: polygon(0 70%, 7% 100%, 100% 100%, 100% 0, 0 0);
  box-shadow: inset 0 .35em .8em rgba(0, 240, 255, .55);
  font-family: var(--mori-type-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body.theme-signal-desk :is(.hp-cta, .ap-cta, .fp-cta, .qp-cta, .sp-pill, .qp-hero-copy > a):hover {
  background-color: #00f0ff;
  box-shadow: 0 0 18px rgba(0, 240, 255, .65);
  color: var(--mori-surface-page);
}
body.theme-signal-desk :is(.hp-icon-link, .hp-back-to-top) {
  background: #0a2430;
  border: 1px solid rgba(20, 130, 207, .5);
  color: #00f0ff;
  box-shadow: inset 0 0 10px rgba(0, 240, 255, .2);
}
body.theme-signal-desk :is(.hp-icon-link, .hp-back-to-top):hover {
  background: var(--mori-accent-primary);
  color: var(--mori-surface-page);
}
body.theme-signal-desk .mori-theme-switch {
  /* relocated into the header / burger menu by mountSignalTheme */
  display: none;
  border: 1px solid rgba(20, 130, 207, .5);
  background: var(--mori-surface-footer);
  border-radius: 0;
}
/* the host's floating Services directory shares the bottom-left corner; lift it
   so it sits above the desk switcher instead of under it. The host moves the
   directory to the top-right at ≤1023, where bottom:auto must win — setting
   bottom there would stretch the fixed box into a full-height rail. */
@media (min-width: 1024px) {
  body.theme-signal-desk .floating-directory { bottom: 76px; }
}
body.theme-signal-desk .mori-theme-switch button { color: var(--mori-ink-muted); clip-path: none; box-shadow: none; background: transparent; }
body.theme-signal-desk .mori-theme-switch button.is-active { color: #00f0ff; text-shadow: 0 0 6px rgba(0, 240, 255, .8); }

/* ── footer ──────────────────────────────────────────────────────────────── */
body.theme-signal-desk .hp-footer {
  background: var(--mori-surface-footer);
  border-top: 2px solid var(--mori-accent-primary);
  box-shadow: inset 0 1em 2em rgba(0, 240, 255, .06);
}
body.theme-signal-desk .hp-footer h3,
body.theme-signal-desk .hp-footer-column h3,
body.theme-signal-desk .hp-footer h2 {
  color: #00f0ff;
  font-family: var(--mori-type-display);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-shadow: 0 0 5px rgba(0, 240, 255, .45);
}
body.theme-signal-desk .hp-footer a { color: var(--mori-ink-muted); }
body.theme-signal-desk .hp-footer :is(p, span, address, .hp-footer-hours) { color: var(--mori-ink-muted); }
body.theme-signal-desk .hp-footer a:hover { color: var(--mori-accent-highlight); }
body.theme-signal-desk .hp-copyright {
  border-top: 1px solid rgba(20, 130, 207, .45);
  color: var(--mori-ink-faint);
  font-size: 11px;
  letter-spacing: .08em;
}

/* ── floating directory: the seed's stepped status rail ──────────────────── */
/* The directory duplicates the desktop header's five links and is the only nav
   on phones, but as a fixed hamburger it is ugly and hard to hit. signal-desk
   retires it and keeps its links in the header on every width (the mobile nav
   row), so this whole control — plate, animation and menu — is gone. */
body.theme-signal-desk .floating-directory { display: none; }
body.theme-signal-desk .floating-directory {
  border: 0;
  border-radius: 0;
  /* the stepped plate lives on ::before, NOT on the details box: a clip-path on
     the details would clip the absolutely-positioned <nav> (which overflows the
     button at every width, and is how the host opens the menu on hover). Keep
     the details unclipped so the menu can paint. */
  background: transparent;
}
body.theme-signal-desk .floating-directory::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--mori-accent-primary);
  clip-path: polygon(20% 0, 10% 5%, 10% 35%, 0 40%, 0 95%, 10% 100%, 100% 100%, 100% 0);
  animation: mori-signal-rail 1.2s infinite alternate;
}
body.theme-signal-desk .floating-directory > summary {
  position: relative;
  margin: 5px 5px 5px 7px;
  background: #0a2430;
  color: #00f0ff;
  border-radius: 0;
  clip-path: polygon(18% 0, 8% 6%, 8% 34%, 0 40%, 0 95%, 8% 100%, 100% 100%, 100% 0);
  box-shadow: inset 0 0 15px rgba(20, 130, 207, .6);
}
body.theme-signal-desk .floating-directory > summary::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 14%;
  bottom: 12%;
  width: 5px;
  background-image: repeating-linear-gradient(180deg, var(--mori-accent-signal) 0 4px, transparent 4px 9px);
  transform: skewY(-40deg);
  animation: mori-signal-flicker 5s infinite;
}
body.theme-signal-desk .floating-directory > nav {
  border: 1px solid rgba(20, 130, 207, .55);
  border-radius: 0;
  background: var(--mori-surface-footer);
  clip-path: polygon(14px 0, 100% 0, 100% 100%, 0 100%, 0 14px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .55);
}
body.theme-signal-desk .floating-directory a { color: var(--mori-ink-muted); border-radius: 0; }
body.theme-signal-desk .floating-directory a::before { content: ">"; margin-right: 6px; color: var(--mori-accent-signal); }
body.theme-signal-desk .floating-directory a:hover { background: rgba(20, 130, 207, .16); color: #00f0ff; }
body.theme-signal-desk .floating-directory a[aria-current="page"] {
  background: rgba(0, 240, 255, .1);
  color: #00f0ff;
  box-shadow: inset 2px 0 0 var(--mori-accent-signal);
}

/* the host ships a floating "客户服务" chat launcher (no live backend); the
   sibling themes each restyle it to their palette. signal-desk turns it into a
   console "teletype" drawer: the launcher is a status chip, the opened panel a
   square terminal plate with a node header and command-line messages. The
   `--chat-*` custom properties are the host's own contract (see .support-chat),
   so the panel recolours itself from them too. */
body.theme-signal-desk .support-chat {
  --chat-bg: var(--mori-surface-content);
  --chat-ink: var(--mori-ink-base);
  --chat-muted: var(--mori-ink-muted);
  --chat-surface: var(--mori-surface-card);
  --chat-line: var(--mori-accent-divider);
  --chat-accent: var(--mori-surface-footer);
}
body.theme-signal-desk .support-launcher {
  border: 2px solid var(--mori-accent-highlight);
  border-radius: 0;
  background: var(--mori-surface-content);
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-size: 10px !important;
  letter-spacing: .1em;
  text-transform: uppercase;
  box-shadow: inset 0 0 14px rgba(20, 130, 207, .55);
}
/* pink signal rail on the launcher's left edge, echoing the floating directory */
body.theme-signal-desk .support-launcher::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 20%;
  bottom: 20%;
  width: 4px;
  background-image: repeating-linear-gradient(180deg, var(--mori-accent-signal) 0 4px, transparent 4px 9px);
}
body.theme-signal-desk .support-launcher:hover {
  border-color: var(--mori-accent-highlight);
  background: var(--mori-surface-card);
}
/* the panel is a <section>, and the deck strips section backgrounds to expose
   the negative layers — re-assert an opaque plate so page content can't bleed
   through the chat (specificity beats `body.theme-signal-desk section`) */
body.theme-signal-desk .support-panel {
  background: var(--chat-bg);
  border-radius: 0;
  font-family: var(--mori-type-mono);
  color: var(--chat-ink);
  overflow: hidden;
  box-shadow: inset 0 0 24px rgba(20, 130, 207, .35), 0 20px 80px rgba(0, 0, 0, .6);
}
/* mount-time entrance: the host builds a fresh panel each time it opens (it is
   absent from the DOM when closed), so a keyframe plays on mount — there is no
   exit animation to write, the host unmounts it instantly. A cyan scanline
   sweeps the terminal once behind the entrance as a boot flash. */
@keyframes mori-chat-in {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}
@keyframes mori-chat-scan {
  0%   { top: -22%; opacity: 0; }
  12%  { opacity: .85; }
  88%  { opacity: .85; }
  100% { top: 118%; opacity: 0; }
}
body.theme-signal-desk .support-panel {
  animation: mori-chat-in .24s cubic-bezier(.16, 1, .3, 1) both;
}
body.theme-signal-desk .support-panel::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -22%;
  height: 22%;
  background: linear-gradient(to bottom, transparent, rgba(0, 240, 255, .13), transparent);
  pointer-events: none;
  animation: mori-chat-scan 1s linear both;
}
/* terminal node header: cyan brand + square close */
body.theme-signal-desk .support-panel .support-header { border-bottom: 1px solid var(--chat-line); }
body.theme-signal-desk .support-panel .support-brand {
  font-family: var(--mori-type-mono);
  letter-spacing: .2em;
  color: var(--mori-accent-highlight);
}
body.theme-signal-desk .support-panel .support-header h2 {
  font-family: var(--mori-type-display);
  color: var(--mori-accent-highlight);
}
/* body copy rides on --chat-muted (a dim blue-grey); lift the greeting + notice
   to the bright ink so the panel's main text doesn't read as de-emphasised */
body.theme-signal-desk .support-panel .support-preview { color: var(--chat-ink); }
body.theme-signal-desk .support-panel .support-welcome p { color: var(--chat-ink); }
body.theme-signal-desk .support-panel .support-close {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 0;
  background: var(--chat-surface);
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
}
/* square command-line surfaces: drop the host's rounded chat bubbles */
body.theme-signal-desk .support-panel .support-spark { border-radius: 0; }
body.theme-signal-desk .support-panel .support-suggestions button {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 0;
  background: var(--chat-surface);
  color: var(--mori-accent-highlight);
  font-family: var(--mori-type-mono);
  font-size: 11px;
}
body.theme-signal-desk .support-panel .support-suggestions button:hover { border-color: var(--mori-accent-highlight); }
body.theme-signal-desk .support-panel .support-reply {
  border: 1px solid var(--chat-line);
  border-radius: 0;
  background: var(--chat-surface);
  color: var(--chat-ink);
  font-family: var(--mori-type-mono);
}
body.theme-signal-desk .support-panel .support-reply::before { content: "▸ "; color: var(--mori-accent-highlight); }
body.theme-signal-desk .support-panel .support-user {
  border: 1px solid var(--chat-line);
  border-radius: 0;
  background: var(--chat-surface);
  color: var(--chat-ink);
  font-family: var(--mori-type-mono);
}
body.theme-signal-desk .support-panel .support-user::before { content: "> "; color: var(--mori-accent-signal); }
body.theme-signal-desk .support-panel .support-human { border-radius: 0; font-family: var(--mori-type-mono); }
body.theme-signal-desk .support-panel .support-input-row { border-radius: 0; }
body.theme-signal-desk .support-panel .support-input-row textarea {
  font-family: var(--mori-type-mono);
  color: var(--chat-ink);
}
body.theme-signal-desk .support-panel .support-send {
  border: 1px solid var(--mori-accent-card-border);
  border-radius: 0;
  background: var(--chat-surface);
  color: var(--mori-accent-highlight);
}
body.theme-signal-desk .support-panel .support-meta { font-family: var(--mori-type-mono); }
/* mobile: a chat wants the whole screen. The host floats the panel as a card
   (8px sides, 44px top, 80px bottom) so page content bleeds around it; collapse
   it to a full-bleed terminal. viewport meta has no viewport-fit=cover, so the
   fixed element already sits inside the safe area — no extra notch padding.
   The panel must also clear every chrome layer: the site header (z:40) and the
   preview theme switcher (z:9999) would otherwise paint over it, hiding the
   close button and overlapping the input row. */
@media (max-width: 719px) {
  body.theme-signal-desk .support-panel {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    border: 0;
    z-index: 10000;
  }
  /* a full-screen terminal can't be resized — drop the host's drag handle (its
     mobile grip glyph read as a half-formed control) and reclaim its 48px of
     header padding so the brand sits flush left */
  body.theme-signal-desk .support-panel .support-resize { display: none; }
  body.theme-signal-desk .support-panel .support-header { padding-left: 12px; }
}

/* ── pink geometry across the deck ───────────────────────────────────────── */
/* The seed spends pink in exactly three places: the toolbar belt, a 45-degree
   striped tab on every card, and a dotted telemetry baseline. The cards carry
   all three; the rest of the deck gets the same vocabulary so no module reads
   as a plain host block. */
body.theme-signal-desk :is(
  .hp-section-heading h2,
  .mori-section h2,
  .fp-licensing-heading h2,
  .fp-download-copy h2,
  .fp-feature-copy h2,
  .sp-section-heading h2,
  .sp-content h2,
  .sp-market-copy h2,
  .sp-hosting-copy h2,
  .qp-manifesto h2,
  .qp-agent h2,
  .qp-download-copy h2,
  .hp-footer h2
)::after {
  content: "";
  display: block;
  width: 64px;
  height: 3px;
  margin-top: 10px;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 9px);
  opacity: .85;
}
body.theme-signal-desk :is(.qp-manifesto, .sp-contact) h2::after { margin-left: auto; margin-right: auto; }

/* licensing bands: the host paints its fine print in near-black purple */
body.theme-signal-desk .fp-licensing {
  background:
    linear-gradient(90deg, rgba(20, 130, 207, .12), rgba(20, 130, 207, 0) 58%),
    rgba(7, 27, 36, .72);
  border-top: 1px solid rgba(20, 130, 207, .45);
  border-bottom: 1px solid rgba(20, 130, 207, .45);
}
body.theme-signal-desk .fp-licensing-heading > p {
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.theme-signal-desk .fp-licensing-reference {
  color: #00f0ff;
  font-family: var(--mori-type-mono);
  letter-spacing: .08em;
  text-shadow: 0 0 6px rgba(0, 240, 255, .45);
}
body.theme-signal-desk .fp-licensing-description { color: #b9d2e0; }

/* footer: the belt along the top edge, restated at full width */
body.theme-signal-desk .hp-footer {
  background-color: var(--mori-surface-footer);
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 8px, transparent 8px 16px);
  background-size: 100% 8px;
  background-repeat: no-repeat;
  background-position: left top;
  border-top: 2px solid var(--mori-accent-primary);
  padding-top: 8px;
}
body.theme-signal-desk .hp-footer h2::after { margin-top: 7px; width: 44px; height: 2px; }

/* download tiles: pink rail, cut corner and a tick on the right */
body.theme-signal-desk :is(.fp-download-link, .dp-download-link, .qp-download-list a) {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  flex: 1 1 auto;
  min-width: 0;
  border-left: 3px solid rgba(229, 98, 192, .85);
  padding-right: 44px;
}
body.theme-signal-desk :is(.fp-download-link, .dp-download-link, .qp-download-list a)::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 34px;
  height: 9px;
  margin-top: -4.5px;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 3px, transparent 3px 7px);
  opacity: .5;
}
body.theme-signal-desk :is(.fp-download-link, .dp-download-link, .qp-download-list a):hover {
  border-left-color: #00f0ff;
}
body.theme-signal-desk :is(.fp-download-link, .dp-download-link, .qp-download-list a):hover::after { opacity: .9; }

/* download hub: the same four-group matrix inside the desktop panel */
body.theme-signal-desk .dp-download-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 22px 18px;
}
body.theme-signal-desk .dp-download-group { min-width: 0; }
body.theme-signal-desk .dp-download-list { display: grid; gap: 8px; }
@media (max-width: 719px) {
  body.theme-signal-desk .dp-download-columns { grid-template-columns: minmax(0, 1fr); }
}

/* download matrix: four sibling groups, each a stack of cards */
body.theme-signal-desk :is(.fp-download-group, .qp-download-group, .dp-download-group) > h3 {
  margin-bottom: 10px;
  color: var(--mori-accent-signal);
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.theme-signal-desk :is(.fp-download-group, .qp-download-group, .dp-download-group) > h3::before { content: "> "; }
@media (min-width: 720px) {
  body.theme-signal-desk :is(.fp-download-groups, .qp-download-groups) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 18px;
  }
  body.theme-signal-desk :is(.fp-download-groups, .qp-download-groups) > :is(.fp-download-group, .qp-download-group) {
    grid-column: auto;
    min-width: 0;
  }
  body.theme-signal-desk :is(.fp-download-groups, .qp-download-groups) :is(.fp-download-list, .qp-download-list) {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 719px) {
  body.theme-signal-desk :is(.fp-download-groups, .qp-download-groups) {
    grid-template-columns: minmax(0, 1fr);
  }
  body.theme-signal-desk :is(.fp-download-groups, .qp-download-groups) > :is(.fp-download-group, .qp-download-group) {
    grid-column: auto;
    min-width: 0;
  }
  body.theme-signal-desk :is(.fp-download-groups, .qp-download-groups) :is(.fp-download-list, .qp-download-list) {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* buttons: keep the host's placement and paint the pink edge into the slab */
body.theme-signal-desk :is(.hp-cta, .ap-cta, .fp-cta, .qp-cta, .sp-pill, .qp-hero-copy > a) {
  background-image:
    linear-gradient(90deg, rgba(229, 98, 192, .95) 0 7px, rgba(229, 98, 192, 0) 7px),
    linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(10, 32, 43, .12));
}

/* charts and plates: cut-corner tab plus a dotted baseline */
body.theme-signal-desk :is(.hp-latency-chart, .ap-figure, .sp-technical-picture[data-mori-fx="signal"]) {
  position: relative;
}
body.theme-signal-desk :is(.hp-latency-chart, .ap-figure, .sp-technical-picture[data-mori-fx="signal"])::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 18px;
  z-index: 2;
  pointer-events: none;
  background-image: repeating-linear-gradient(-45deg, var(--mori-accent-signal) 0 4px, transparent 4px 9px);
}
body.theme-signal-desk :is(.hp-latency-chart, .ap-figure, .sp-technical-picture[data-mori-fx="signal"])::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 10px;
  width: 56px;
  height: 3px;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 9px);
  opacity: .8;
}

/* about pillars: a pink tick over each label */
body.theme-signal-desk .ap-focus > li { position: relative; padding-top: 14px; }
body.theme-signal-desk .ap-focus > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 4px;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 4px, transparent 4px 8px);
}

/* ── first screen: a console deck with marketing weight ──────────────────── */
/* The host first screen is copy + panda on one field. The deck adds a frame,
   a scene watermark, a proof rail under the CTA, a live ticker on the sill and
   a different ambient hue per scene, so every page opens with its own read. */
body.theme-signal-desk :is(.hp-hero, .fp-hero, .sp-hero, .qp-hero) {
  background:
    repeating-radial-gradient(circle at 76% 50%, rgba(0, 240, 255, .07) 0 1px, transparent 1px 44px),
    radial-gradient(circle at 76% 50%, rgba(0, 240, 255, .16), transparent 36%),
    radial-gradient(circle at 72% 28%, rgba(20, 130, 207, .22), transparent 62%),
    var(--mori-surface-content);
  overflow: hidden;
}
body.theme-signal-desk[data-mori-scene="fafa"] .fp-hero {
  background:
    repeating-radial-gradient(circle at 78% 46%, rgba(229, 98, 192, .08) 0 1px, transparent 1px 42px),
    radial-gradient(circle at 78% 46%, rgba(229, 98, 192, .17), transparent 38%),
    radial-gradient(circle at 16% 82%, rgba(185, 103, 255, .14), transparent 48%),
    radial-gradient(circle at 72% 28%, rgba(20, 130, 207, .18), transparent 62%),
    var(--mori-surface-content);
}
body.theme-signal-desk[data-mori-scene="santiz"] .sp-hero {
  background:
    repeating-radial-gradient(circle at 74% 50%, rgba(185, 103, 255, .07) 0 1px, transparent 1px 42px),
    radial-gradient(circle at 74% 50%, rgba(185, 103, 255, .16), transparent 38%),
    radial-gradient(circle at 22% 78%, rgba(0, 240, 255, .12), transparent 46%),
    radial-gradient(circle at 72% 28%, rgba(20, 130, 207, .18), transparent 62%),
    var(--mori-surface-content);
}
body.theme-signal-desk[data-mori-scene="qizai"] .qp-hero {
  background:
    repeating-radial-gradient(circle at 78% 50%, rgba(0, 240, 255, .07) 0 1px, transparent 1px 42px),
    radial-gradient(circle at 78% 50%, rgba(229, 98, 192, .14), transparent 36%),
    radial-gradient(circle at 18% 20%, rgba(185, 103, 255, .12), transparent 44%),
    radial-gradient(circle at 72% 28%, rgba(20, 130, 207, .18), transparent 62%),
    var(--mori-surface-content);
}
body.theme-signal-desk[data-mori-scene="about"] .ap-hero {
  background:
    repeating-radial-gradient(circle at 84% 30%, rgba(255, 243, 92, .05) 0 1px, transparent 1px 44px),
    radial-gradient(circle at 84% 30%, rgba(255, 243, 92, .10), transparent 36%),
    radial-gradient(circle at 8% 88%, rgba(0, 240, 255, .10), transparent 46%),
    radial-gradient(circle at 72% 28%, rgba(20, 130, 207, .18), transparent 62%),
    var(--mori-surface-content);
}
body.theme-signal-desk .ap-hero {
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100svh;
}
/* about: the title is top-aligned in a full-height deck, so the status chip +
   rail chrome (viewport-anchored) lands on the eyebrow; drop the copy below the
   chip instead of letting the two read as one cramped line */
@media (max-width: 719px) {
  body.theme-signal-desk[data-mori-scene="about"] .ap-hero { padding-top: 80px; }
}
@media (min-width: 720px) and (max-width: 1023px) {
  body.theme-signal-desk[data-mori-scene="about"] .ap-hero { padding-top: 35px; }
}

/* scene watermark set on the hero's own first pseudo-element */
body.theme-signal-desk :is(.hp-hero, .fp-hero, .sp-hero, .qp-hero, .ap-hero)::before {
  position: absolute;
  right: 3%;
  bottom: 6%;
  z-index: 0;
  pointer-events: none;
  font-family: var(--mori-type-display);
  font-size: clamp(96px, 15vw, 230px);
  font-weight: 700;
  line-height: .8;
  letter-spacing: .02em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(0, 240, 255, .14);
  white-space: nowrap;
}
body.theme-signal-desk[data-mori-scene="home"] .hp-hero::before { content: "PS—00"; }
body.theme-signal-desk[data-mori-scene="fafa"] .fp-hero::before { content: "FF—01"; }
body.theme-signal-desk[data-mori-scene="santiz"] .sp-hero::before { content: "ST—02"; }
body.theme-signal-desk[data-mori-scene="qizai"] .qp-hero::before { content: "QZ—03"; }
body.theme-signal-desk[data-mori-scene="about"] .ap-hero::before { content: "PS—04"; }

/* the injected deck */
body.theme-signal-desk .mori-hero-deco {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  font-family: var(--mori-type-mono);
}
body.theme-signal-desk .mori-hero-deco::before {
  content: "";
  position: absolute;
  inset: 100px 18px 18px;
  background:
    linear-gradient(#7df9ff, #7df9ff) left top / 22px 1px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) left top / 1px 22px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) right top / 22px 1px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) right top / 1px 22px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) left bottom / 22px 1px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) left bottom / 1px 22px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) right bottom / 22px 1px no-repeat,
    linear-gradient(#7df9ff, #7df9ff) right bottom / 1px 22px no-repeat;
  opacity: .4;
}
body.theme-signal-desk .mori-hero-deco::after {
  content: "";
  position: absolute;
  top: 100px;
  right: 18px;
  width: 84px;
  height: 28px;
  background-image: repeating-linear-gradient(-45deg, var(--mori-accent-signal) 0 5px, transparent 5px 11px);
}
body.theme-signal-desk .mori-hero-rail {
  position: absolute;
  left: 22px;
  top: 50%;
  translate: 0 -50%;
  width: 96px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
body.theme-signal-desk .mori-hero-rail__row {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-left: 11px;
  border-left: 2px solid rgba(0, 240, 255, .8);
  box-shadow: -4px 0 10px rgba(0, 240, 255, .28);
}
body.theme-signal-desk .mori-hero-rail__row span {
  color: #6f8b99;
  font-size: 8px;
  letter-spacing: .18em;
  text-transform: uppercase;
  line-height: 1;
}
body.theme-signal-desk .mori-hero-rail__row b {
  color: #00f0ff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .05em;
  line-height: 1;
  text-shadow: 0 0 8px rgba(0, 240, 255, .55);
  white-space: nowrap;
}
body.theme-signal-desk .mori-hero-status {
  position: absolute;
  left: 40px;
  top: 108px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 9px;
  background: rgba(7, 27, 36, .88);
  border: 1px solid rgba(20, 130, 207, .5);
  box-shadow: inset 0 0 10px rgba(0, 240, 255, .12);
  color: #7df9ff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body.theme-signal-desk .mori-hero-status i {
  width: 6px;
  height: 6px;
  background: var(--mori-accent-readout);
  box-shadow: 0 0 8px rgba(12, 250, 119, .9);
  animation: mori-hero-led 1.6s steps(2, jump-none) infinite;
}
body.theme-signal-desk .mori-hero-scan {
  position: absolute;
  left: 18px;
  right: 18px;
  top: 22%;
  height: 1px;
  background: linear-gradient(90deg, rgba(0, 240, 255, 0), rgba(0, 240, 255, .5) 18%, rgba(0, 240, 255, .5) 82%, rgba(0, 240, 255, 0));
  box-shadow: 0 0 12px rgba(0, 240, 255, .35);
  opacity: .7;
  animation: mori-hero-scan 9s linear infinite;
}
body.theme-signal-desk .mori-hero-ticker {
  position: absolute;
  left: 0;
  right: 0;
  top: 64px;
  height: 26px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-top: 1px solid rgba(0, 240, 255, .38);
  border-bottom: 1px solid rgba(0, 240, 255, .22);
  background: rgba(7, 27, 36, .9);
}
body.theme-signal-desk .mori-hero-ticker::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background-image: repeating-linear-gradient(90deg, var(--mori-accent-signal) 0 6px, transparent 6px 12px);
  opacity: .8;
}
body.theme-signal-desk .mori-hero-ticker span {
  display: inline-block;
  min-width: max-content;
  white-space: pre;
  color: #7df9ff;
  font-size: 10px;
  letter-spacing: .3em;
  text-transform: uppercase;
  animation: mori-hero-marquee 34s linear infinite;
}
body.theme-signal-desk .mori-hero-proof {
  display: flex;
  gap: 26px;
  margin-top: 26px;
  padding: 0;
  list-style: none;
}
body.theme-signal-desk .mori-hero-proof li {
  padding-left: 12px;
  border-left: 1px solid rgba(0, 240, 255, .35);
}
body.theme-signal-desk .mori-hero-proof b {
  display: block;
  color: #00f0ff;
  font-family: var(--mori-type-display);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .04em;
  text-shadow: 0 0 8px rgba(0, 240, 255, .55);
  white-space: nowrap;
}
body.theme-signal-desk .mori-hero-proof span {
  display: block;
  margin-top: 3px;
  color: #90a9b6;
  font-size: 9px;
  letter-spacing: .18em;
  text-transform: uppercase;
  white-space: nowrap;
}
/* evidence rows — the seed's S8, label-left / value-right telemetry in the copy
   flow between the h1 and the CTA. A dashed rule separates each reading so the
   wordmark reads as a live console readout, not a slogan card. */
body.theme-signal-desk .mori-hero-evidence {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  width: 100%;
  border-top: 1px solid rgba(0, 240, 255, .4);
}
body.theme-signal-desk .mori-hero-evidence li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 7px 0;
  border-bottom: 1px dashed rgba(20, 130, 207, .62);
}
body.theme-signal-desk .mori-hero-evidence span {
  color: #90a9b6;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  white-space: nowrap;
}
body.theme-signal-desk .mori-hero-evidence span::before { content: "> "; color: var(--mori-accent-signal); }
body.theme-signal-desk .mori-hero-evidence b {
  color: #eaf6ff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  white-space: nowrap;
  text-shadow: 0 0 10px rgba(0, 240, 255, .4);
}
body.theme-signal-desk .ap-hero .mori-hero-proof { margin-top: 18px; margin-bottom: 4px; }
@keyframes mori-hero-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes mori-hero-scan { 0% { top: 18%; opacity: 0; } 8% { opacity: .7; } 92% { opacity: .7; } 100% { top: 84%; opacity: 0; } }
@keyframes mori-hero-led { 0%, 49% { opacity: 1; } 50%, 100% { opacity: .35; } }
/* ≤1023 the host parks the floating Services button top-right (24px inset + 56px
   disc); inset the ticker's right edge so the marquee doesn't run under it. */
@media (min-width: 720px) and (max-width: 1023px) {
  body.theme-signal-desk .mori-hero-ticker { top: 86px; right: calc(max(24px, env(safe-area-inset-right)) + 64px); }
  body.theme-signal-desk .mori-hero-deco::before { inset: 122px 14px 18px; }
  body.theme-signal-desk .mori-hero-deco::after { top: 156px; right: 14px; }
  body.theme-signal-desk .mori-hero-rail { display: none; }
  body.theme-signal-desk .mori-hero-status { left: 36px; top: 130px; }
}
@media (max-width: 719px) {
  /* the header is now a 40px bar (was 104px); the hero deck was anchored to the
     old 104px offset, so shift the absolute overlays up 64px to sit flush under
     the bar instead of floating 64px down into the copy */
  body.theme-signal-desk .mori-hero-ticker { top: 40px; right: calc(max(24px, env(safe-area-inset-right)) + 64px); }
  body.theme-signal-desk .mori-hero-deco::before { inset: 76px 12px 16px; }
  body.theme-signal-desk .mori-hero-deco::after { top: 92px; right: 12px; }
  body.theme-signal-desk .mori-hero-rail { display: none; }
  body.theme-signal-desk .mori-hero-status { left: 34px; top: 84px; }
  body.theme-signal-desk :is(.hp-hero, .fp-hero, .sp-hero, .qp-hero)::before { font-size: clamp(80px, 24vw, 150px); bottom: 8%; }
  body.theme-signal-desk .mori-hero-proof { gap: 16px; margin-top: 20px; }
  body.theme-signal-desk .mori-hero-proof li { padding-left: 9px; }
  body.theme-signal-desk .mori-hero-proof b { font-size: 13px; }
  body.theme-signal-desk .mori-hero-proof span { font-size: 7.5px; letter-spacing: .12em; }
}

/* about 320px: the third proof point (AI + LOW LATENCY / TWO CORE STACKS)
   outgrows the 320px viewport; let the proof list wrap before it clips */
@media (max-width: 359px) {
  body.theme-signal-desk .mori-hero-proof { flex-wrap: wrap; row-gap: 10px; }
  /* ~320px the top-right is already packed (status chip ends at x≈242, the panda
     starts at x≈205): there's no slot for the pink warning stripe without it
     clipping the "SIGNAL // 00 · LIVE FEED" tail, so drop it — it's the one
     element that's pure decoration. */
  body.theme-signal-desk .mori-hero-deco::after { display: none; }
}

/* ══ BOLD POSTER · the wordmark leads ═══════════════════════════════════════
   The deck chrome (rail / status / ticker / watermark) reads as frame, not
   poster: the host still keeps a 335px copy column and a ~68px headline, so
   the first screen still looked like the old banner with a neon skin. This
   block flips the hierarchy — the campaign wordmark goes to display scale and
   claims the left field, the mascot grows into a bright hologram on the right,
   and the grid is drawn as the true 20px reference field. */

/* 20px reference grid — drawn as a ::after overlay so it survives the per-scene
   ambient backgrounds (which outrank a plain `background` rule) and reads as the
   seed's true desk field, not the old faint 44px dot radial */
body.theme-signal-desk :is(.hp-hero, .fp-hero, .sp-hero, .qp-hero)::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(0, 240, 255, .15) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 240, 255, .15) 1px, transparent 1px);
  background-size: 20px 20px;
}

/* expression A — the wordmark at poster scale; it stacks as three lines in its
   column ("FULL-LINK / LOW-LATENCY / SERVICES") instead of sitting as a one-line
   heading. 10vw (164px) was too hot: in a 640px column the longest word wraps
   mid-word to five lines and the block overflows the deck, clipping the caps and
   colliding with the eyebrow. 80px is the measured ceiling that keeps each word
   on its own line, so the stack reads as a deliberate poster, not a broken wrap. */
body.theme-signal-desk :is(.hp-hero h1, .fp-hero-copy h1, .sp-hero-copy h1, .qp-hero-copy h1) {
  font-size: clamp(44px, 5.6vw, 80px);
  line-height: .92;
  letter-spacing: .015em;
  text-shadow:
    0 3px 0 rgba(9, 13, 20, .92),
    0 8px 26px rgba(9, 13, 20, .6),
    0 0 30px rgba(0, 240, 255, .42);
}

/* expressions B & C follow the same poster scale in their own register */
body.theme-signal-desk .ap-headline { font-size: clamp(34px, 4.5vw, 66px); }
body.theme-signal-desk .dp-brand-copy h1 { font-size: clamp(44px, 5.5vw, 88px); }

/* eyebrow — console call-sign in cyan, not a muted pink footnote */
body.theme-signal-desk .hp-hero-copy > p:first-child {
  color: #7df9ff;
  font-size: 13px;
  letter-spacing: .26em;
  text-shadow: 0 0 10px rgba(0, 240, 255, .5);
}

/* standfirst — console-green telemetry line */
body.theme-signal-desk .hp-hero-description {
  color: var(--mori-accent-readout);
  font-size: 14px;
  line-height: 1.6;
}

/* desktop — copy claims the left field, mascot the right */
@media (min-width: 1024px) {
  /* the left status rail now occupies the 20–116px strip, so the copy column
     starts past it instead of under the old 8px dotted divider */
  body.theme-signal-desk :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) {
    left: clamp(132px, 10vw, 176px);
    width: min(640px, 48vw);
    text-align: left;
  }
  body.theme-signal-desk :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
    right: clamp(16px, 4vw, 80px);
    width: min(36vw, 540px);
    height: auto;
  }
  /* hologram base — full colour; grayscale was washing the neon accents out */
  body.theme-signal-desk :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
    filter:
      saturate(1.14)
      contrast(1.06)
      brightness(1.05)
      drop-shadow(0 0 16px rgba(0, 240, 255, .55))
      drop-shadow(0 0 52px rgba(20, 130, 207, .5));
    opacity: .88;
  }
  /* fafa (花花) — cute: warm pink halo, keep its own colour */
  body.theme-signal-desk[data-mori-scene="fafa"] .fp-hero-panda {
    filter:
      saturate(1.2) contrast(1.02) brightness(1.06)
      drop-shadow(0 0 16px rgba(229, 98, 192, .5));
    opacity: .94;
  }
  /* santiz (萌兰) — powerful black-white + neon mecha: keep the periwinkle/pink/
     mint, lift contrast so the black limbs separate from the navy deck */
  body.theme-signal-desk[data-mori-scene="santiz"] .sp-hero-panda {
    filter:
      saturate(1.25) contrast(1.12) brightness(1.1)
      drop-shadow(0 0 18px rgba(0, 240, 255, .6))
      drop-shadow(0 0 44px rgba(20, 130, 207, .5));
    opacity: .96;
  }
  /* qizai (七仔) — brown, distinctive eyes: keep natural colour, warm amber halo */
  body.theme-signal-desk[data-mori-scene="qizai"] .qp-hero-panda {
    filter:
      contrast(1.04) brightness(1.04) saturate(1.15)
      drop-shadow(0 0 16px rgba(205, 159, 106, .55));
    opacity: .94;
  }
}
/* tablet — keep the split, tighter */
@media (min-width: 720px) and (max-width: 1023px) {
  body.theme-signal-desk :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) {
    left: 44px;
    width: min(520px, 62vw);
    text-align: left;
  }
}
/* phone — the mascot is a bolder projection, not a washed-out ghost */
@media (max-width: 719px) {
  body.theme-signal-desk :is(.hp-hero-panda, .fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
    width: min(74vw, 300px);
    opacity: .52;
    filter:
      saturate(1.1)
      contrast(1.08)
      brightness(1.12)
      drop-shadow(0 0 12px rgba(0, 240, 255, .5))
      drop-shadow(0 0 34px rgba(20, 130, 207, .5));
  }
}

/* ── live subject: the mascot breathes, its flame flickers, the chest screen
   pulses — the game-character-intro idle loop read through the 监看 lens: the
   console is watching something alive, not pasting a sticker. The wrapper keeps
   the host's panda class (every layout/filter rule stays) and pins its own
   aspect ratio so the flame/badge layers stay aligned at any width. */
body.theme-signal-desk .mori-panda {
  display: block;
  aspect-ratio: 1845 / 1104;
}
/* the figure is the breathing unit: body, flame and badge all ride it, so the
   chest screen and flame track the chest/head as the torso swells — instead of
   floating as three disconnected stickers. */
body.theme-signal-desk .mori-panda__figure {
  position: absolute;
  inset: 0;
  transform-origin: 50% 100%;
  animation: mori-panda-breathe 4.6s ease-in-out infinite;
  will-change: transform;
}
body.theme-signal-desk .mori-panda__body {
  display: block;
  width: 100%;
  height: 100%;
}
/* the extracted crest PNG flickers as fire: a subtle vertical stretch/skew
   "lick" plus a brightness/opacity sputter on a mutually-prime period, and a
   cyan key-glow via drop-shadow. No white-hot core here — the flame is teal. */
body.theme-signal-desk .mori-panda__flame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform-origin: 50% 46%;
  filter: drop-shadow(0 0 6px rgba(0, 240, 255, .6));
  animation:
    mori-panda-flame 2.8s ease-in-out infinite,
    mori-panda-flame-flicker 1.15s ease-in-out infinite;
  will-change: transform, opacity, filter;
}
body.theme-signal-desk .mori-panda__badge {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  animation: mori-panda-badge 2.8s ease-in-out infinite;
  will-change: filter;
}

/* the chest readout: an opaque teal plate that covers the badge's baked static
   screen and carries five flat-ink readouts instead. The screen is a tilted
   parallelogram in the artwork, so rather than guessing a box the plate is
   masked to the exact screen shape extracted as hero-panda-fig1-screen.png
   (mask-image is set inline per slug, since qizai/santiz ship their own asset).
   It is a sibling above the badge inside the figure, so it inherits the breathe
   scaleY and never drifts from the chest. */
body.theme-signal-desk .mori-panda__readout {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgb(0, 253, 209); /* sampled teal of the badge screen */
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  overflow: hidden;
  pointer-events: none;
}
body.theme-signal-desk .mori-panda__readout .mori-readout-slide {
  position: absolute;
  left: 57.08%;
  top: 54.90%;
  width: 7.79%;
  height: 11.44%;
  transform: rotate(-13.5deg);
  transform-origin: 50% 50%;
  display: block;
  opacity: 0;
}
body.theme-signal-desk .mori-panda__readout .mori-readout-slide svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* slide 1 — energy bolt: cream fill + ink outline, scale-only flicker with an
   occasional overload double-flash mid-cycle (opacity stays 1 so it never reads
   as a hollow bolt) */
body.theme-signal-desk .mori-bolt {
  animation: mori-readout-bolt 2.4s ease-in-out infinite;
  transform-box: fill-box;
  transform-origin: 50% 50%;
}
body.theme-signal-desk .mori-bolt-shape {
  fill: #F6F0DE;
  stroke: #14100B;
  stroke-width: 2;
  stroke-linejoin: round;
}
@keyframes mori-readout-bolt {
  0%, 12%, 100% { transform: scale(1); }
  4% { transform: scale(.94); }
  7% { transform: scale(1.04); }
  10% { transform: scale(.97); }
  46% { transform: scale(1); }
  49% { transform: scale(.9); }
  52% { transform: scale(1.05); }
  54% { transform: scale(.93); }
  57% { transform: scale(1); }
}

/* slide 2 — ECG: full cream trace on a black under-stroke, static at rest;
   the only motion is the blinking dot at the heartbeat spike */
body.theme-signal-desk .mori-ecg-ink,
body.theme-signal-desk .mori-ecg-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.theme-signal-desk .mori-ecg-ink { stroke: #14100B; stroke-width: 5; }
body.theme-signal-desk .mori-ecg-line { stroke: #F6F0DE; stroke-width: 2.4; }
body.theme-signal-desk .mori-ecg-dot {
  fill: #F6F0DE;
  stroke: #14100B;
  stroke-width: 1.2;
  animation: mori-readout-dot 1.2s ease-in-out infinite;
}
@keyframes mori-readout-dot {
  0%, 100% { opacity: .15; }
  50% { opacity: 1; }
}

/* slide 3 — power: four cream cells fill bottom→top and hold; black battery
   outline + nub stay put */
body.theme-signal-desk .mori-power-body {
  fill: none;
  stroke: #14100B;
  stroke-width: 2;
  stroke-linejoin: round;
}
body.theme-signal-desk .mori-power-nub { fill: #14100B; }
body.theme-signal-desk .mori-power-seg {
  fill: #F6F0DE;
  transform-box: fill-box;
  transform-origin: 50% 100%;
  animation: mori-readout-power 2.4s ease-in-out infinite;
}
body.theme-signal-desk .mori-power-seg--1 { animation-delay: 0s; }
body.theme-signal-desk .mori-power-seg--2 { animation-delay: .16s; }
body.theme-signal-desk .mori-power-seg--3 { animation-delay: .32s; }
body.theme-signal-desk .mori-power-seg--4 { animation-delay: .48s; }
body.theme-signal-desk .mori-power-divider {
  stroke: #14100B;
  stroke-width: 1.2;
  stroke-linecap: round;
}
@keyframes mori-readout-power {
  0% { transform: scaleY(0); }
  40% { transform: scaleY(1); }
  100% { transform: scaleY(1); }
}

/* slide 4 — radar: two concentric rings, a flat cream sweep needle rotates
   from centre, and two cream/ink blips blink */
body.theme-signal-desk .mori-radar-ring {
  fill: none;
  stroke: #14100B;
  stroke-width: 2;
}
body.theme-signal-desk .mori-radar-ring-cream {
  fill: none;
  stroke: #F6F0DE;
  stroke-width: 1.2;
}
body.theme-signal-desk .mori-radar-needle {
  animation: mori-readout-radar 2.4s linear infinite;
  transform-box: view-box;
  transform-origin: 22px 25px;
}
body.theme-signal-desk .mori-radar-needle-ink {
  stroke: #14100B;
  stroke-width: 2.5;
  stroke-linecap: round;
}
body.theme-signal-desk .mori-radar-needle-line {
  stroke: #F6F0DE;
  stroke-width: 1.2;
  stroke-linecap: round;
}
body.theme-signal-desk .mori-radar-dot {
  fill: #F6F0DE;
  stroke: #14100B;
  stroke-width: 1.2;
  animation: mori-readout-dot 1.4s ease-in-out infinite;
}
body.theme-signal-desk .mori-radar-dot--b { animation-delay: .7s; }
@keyframes mori-readout-radar {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* slide 5 — equalizer: five cream/ink bars jump on staggered timing */
body.theme-signal-desk .mori-eq-bar {
  transform-box: fill-box;
  transform-origin: 50% 100%;
}
body.theme-signal-desk .mori-eq-ink { fill: #14100B; }
body.theme-signal-desk .mori-eq-cream { fill: #F6F0DE; }
body.theme-signal-desk .mori-eq-bar--1 { animation: mori-readout-eq 1s ease-in-out infinite; }
body.theme-signal-desk .mori-eq-bar--2 { animation: mori-readout-eq 1.3s ease-in-out .1s infinite; }
body.theme-signal-desk .mori-eq-bar--3 { animation: mori-readout-eq .8s ease-in-out .2s infinite; }
body.theme-signal-desk .mori-eq-bar--4 { animation: mori-readout-eq 1.2s ease-in-out .05s infinite; }
body.theme-signal-desk .mori-eq-bar--5 { animation: mori-readout-eq .95s ease-in-out .15s infinite; }
@keyframes mori-readout-eq {
  0%, 100% { transform: scaleY(.3); }
  50% { transform: scaleY(1); }
}

@keyframes mori-panda-breathe {
  0%, 100% { transform: scaleY(1) translateY(0); }
  50% { transform: scaleY(1.016) translateY(-1.5px); }
}
/* A flame reads as "alive" through its light, not its silhouette: the glow
   sputter (brightness/drop-shadow/opacity) runs on one period while the shape
   only *licks* — a subtle vertical stretch (scaleY ~1.04) and a faint tip lean
   (skewX <= ~1.5deg), both about the crown's base — on a mutually-prime period,
   so the two never lock into a mechanical loop. Big rotation/skew swings the
   whole cluster like a rigid "waving flag"; a real flame never does that. */
@keyframes mori-panda-flame {
  0%, 100% { transform: skewX(0deg) scaleY(1); }
  18% { transform: skewX(1.2deg) scaleY(1.04); }
  41% { transform: skewX(-1.4deg) scaleY(1.02); }
  63% { transform: skewX(0.8deg) scaleY(1.045); }
  82% { transform: skewX(-0.6deg) scaleY(1.01); }
}
@keyframes mori-panda-flame-flicker {
  0%, 100% { opacity: .86; filter: drop-shadow(0 0 4px rgba(0, 240, 255, .45)) brightness(1); }
  20% { opacity: 1; filter: drop-shadow(0 0 14px rgba(0, 240, 255, .9)) brightness(1.38); }
  44% { opacity: .66; filter: drop-shadow(0 0 2px rgba(0, 240, 255, .26)) brightness(.74); }
  68% { opacity: .98; filter: drop-shadow(0 0 11px rgba(0, 240, 255, .72)) brightness(1.22); }
  84% { opacity: .78; filter: drop-shadow(0 0 5px rgba(0, 240, 255, .4)) brightness(.9); }
}
@keyframes mori-panda-badge {
  0%, 100% { filter: brightness(1) saturate(1); }
  50% { filter: brightness(1.5) saturate(1.65); }
}
@media (prefers-reduced-motion: reduce) {
  body.theme-signal-desk .mori-panda__figure,
  body.theme-signal-desk .mori-panda__flame,
  body.theme-signal-desk .mori-panda__badge { animation: none; }
  body.theme-signal-desk .mori-panda__readout .mori-readout-slide,
  body.theme-signal-desk .mori-panda__readout .mori-readout-slide * { animation: none; }
}

/* ── fafa (花花): retail-service rider ─────────────────────────────────────
   The black-white panda rides a floating jet hoverboard (hero-fafa.png), nose
   up and airborne over the city in a snowboard crouch. The figure levitates and
   carves while two jet vents pulse an orange ring + cream core, cyan airflow
   streams down-and-right off each vent, the nose instrument blinks, and a cyan
   afterimage trails down-left behind the board. The wrapper carries the host
   .fp-hero-panda class so the desktop/
   phone layout, the halo and every filter rule keep applying; every motion
   layer is a span or inline SVG pinned to the figure — no raster layers. */
body.theme-signal-desk .mori-panda-fafa {
  display: block;
  aspect-ratio: 1845 / 1104;
}
body.theme-signal-desk .mori-panda-fafa__figure {
  position: absolute;
  inset: 0;
  transform-origin: 50% 100%;
  animation: mori-fafa-ride 3s ease-in-out infinite;
  will-change: transform;
}
body.theme-signal-desk .mori-panda-fafa__body {
  display: block;
  width: 100%;
  height: 100%;
}
/* jet exhaust plumes: each vent throws a proper exhaust CONE — a bright narrow
   core at the vent mouth that widens and fades into a soft translucent sheath
   as it sprays down-and-right, plus a mid cone and a hot inner streak for
   volume. The plume box's top-centre is pinned to the vent centre (transform-
   origin 50% 0) and the whole box leans ~15deg down-right. Both plumes share
   identical gradients/timing (equal intensity and length); every gradient
   reaches fully transparent by ~70% of the box height, so the spray fades out
   cleanly instead of being clipped by the hero's bottom edge. */
body.theme-signal-desk .mori-panda-fafa__plume {
  position: absolute;
  width: 26%;
  height: 20%;
  pointer-events: none;
  transform-origin: 50% 0;
  rotate: -15deg;
}
body.theme-signal-desk .mori-panda-fafa__plume--left {
  left: 25%;
  top: 83.5%;
}
body.theme-signal-desk .mori-panda-fafa__plume--right {
  left: 47.8%;
  top: 65.6%;
}
body.theme-signal-desk .mori-panda-fafa__plume-core,
body.theme-signal-desk .mori-panda-fafa__plume-wisp {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform-origin: 50% 0;
  pointer-events: none;
}
body.theme-signal-desk .mori-panda-fafa__plume-core {
  clip-path: polygon(42% 0, 58% 0, 76% 100%, 24% 100%);
  background: linear-gradient(180deg,
    #FFFFFF 0%,
    #D9FCFF 28%,
    #8FF4FF 55%,
    rgba(140, 240, 255, .4) 68%,
    transparent 78%);
  filter: blur(2px);
  animation: mori-fafa-plume-core .7s ease-in-out infinite;
}
body.theme-signal-desk .mori-panda-fafa__plume-wisp--1 {
  clip-path: polygon(34% 0, 66% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg,
    rgba(160, 245, 255, .5) 0%,
    rgba(160, 245, 255, .38) 40%,
    rgba(160, 245, 255, .22) 55%,
    transparent 74%);
  filter: blur(4px);
  animation: mori-fafa-plume-wisp .7s ease-in-out infinite;
}
body.theme-signal-desk .mori-panda-fafa__plume-wisp--2 {
  clip-path: polygon(38% 0, 62% 0, 88% 100%, 12% 100%);
  background: linear-gradient(180deg,
    rgba(180, 248, 255, .6) 0%,
    rgba(180, 248, 255, .42) 40%,
    rgba(180, 248, 255, .22) 55%,
    transparent 74%);
  filter: blur(3px);
  animation: mori-fafa-plume-wisp .7s ease-in-out infinite;
}
body.theme-signal-desk .mori-panda-fafa__plume-wisp--3 {
  clip-path: polygon(46% 0, 54% 0, 64% 100%, 36% 100%);
  background: linear-gradient(180deg,
    #EAFBFF 0%,
    rgba(180, 248, 255, .62) 45%,
    transparent 76%);
  filter: blur(1.5px);
  animation: mori-fafa-plume-wisp .7s ease-in-out infinite;
}
/* vent glow: a soft warm radial spill centred on each vent disc — reads as the
   thruster lighting up rather than a drawn ring. Pulsing scale + opacity with
   a slight phase offset between the two vents (left .7s, right 1.1s). */
body.theme-signal-desk .mori-panda-fafa__vent {
  position: absolute;
  pointer-events: none;
  width: 11%;
  aspect-ratio: 1;
  border-radius: 50%;
  /* the wheel hubs are near-round in the art; a mild ~1.25:1 stretch with its
     long axis leaning ~24deg up-right (parallel to the board axis) gives the
     glow a subtle directional cue without reading as a pill floating over a
     circle. The tilt + squash live INSIDE the transform list
     (translate(-50%,-50%) → rotate → scale) rather than as individual
     rotate/scale properties, because individual transforms compose on top of
     `transform` and re-map the centring translate — the glow then drifts ~35px
     off the hub. With translate outermost the hub stays centred. */
  background: radial-gradient(circle at 50% 45%,
    rgba(255, 244, 214, .95) 0%,
    rgba(255, 150, 40, .8) 26%,
    rgba(255, 150, 40, .3) 50%,
    transparent 74%);
  filter: blur(2px);
  will-change: transform, opacity;
}
body.theme-signal-desk .mori-panda-fafa__vent--left {
  left: 37.8%;
  top: 86.4%;
  transform: translate(-50%, -50%) rotate(-24deg) scale(1, .8);
  animation: mori-fafa-vent .7s ease-in-out infinite;
}
body.theme-signal-desk .mori-panda-fafa__vent--right {
  left: 61.8%;
  top: 68.7%;
  transform: translate(-50%, -50%) rotate(-24deg) scale(1, .8);
  animation: mori-fafa-vent 1.1s ease-in-out infinite;
  animation-delay: .15s;
}
/* instrument flicker: a green panel with four orange indicator dots that blink
   on a slow staggered period, reading as the board's nose readout. */
body.theme-signal-desk .mori-panda-fafa__instrument {
  position: absolute;
  left: 71.9%;
  top: 43.9%;
  width: 6.2%;
  height: 13.5%;
  /* the readout IS the base-art nose panel: portrait, its long axis nearly
     vertical with the top leaning ~12deg clockwise off the kicked nose (the
     panel mounts upright on the fin rather than lying flat along it). The tilt
     is folded into the transform list after the centring translate — same
     reason as the vents, so the plate stays centred on the nose panel. */
  transform: translate(-50%, -50%) rotate(12deg);
  pointer-events: none;
}
body.theme-signal-desk .mori-panda-fafa__instrument rect {
  fill: rgba(16, 190, 130, .92);
}
body.theme-signal-desk .mori-panda-fafa__instrument circle {
  fill: rgba(255, 150, 40, .95);
  animation: mori-fafa-instrument 3.5s ease-in-out infinite;
}
body.theme-signal-desk .mori-panda-fafa__instrument circle:nth-of-type(2) { animation-delay: .7s; }
body.theme-signal-desk .mori-panda-fafa__instrument circle:nth-of-type(3) { animation-delay: 1.4s; }
body.theme-signal-desk .mori-panda-fafa__instrument circle:nth-of-type(4) { animation-delay: 2.1s; }
/* motion trail: a cyan afterimage streak, brighter and softened with blur, that
   drifts down-left behind the board. */
body.theme-signal-desk .mori-panda-fafa__trail {
  position: absolute;
  top: 78%;
  left: 12%;
  width: 26%;
  height: 8px;
  pointer-events: none;
  rotate: -14deg;
  background: linear-gradient(100deg,
    transparent 0%,
    rgba(0, 240, 255, .95) 22%,
    rgba(0, 240, 255, .55) 58%,
    rgba(0, 240, 255, .18) 80%,
    transparent 96%);
  border-radius: 4px;
  filter: blur(1.5px) drop-shadow(0 0 7px rgba(0, 240, 255, .6));
  animation: mori-fafa-trail 2.9s ease-in-out infinite;
}
@keyframes mori-fafa-ride {
  0%   { transform: translateX(0) translateY(0) rotate(.6deg); }
  18%  { transform: translateX(.4%) translateY(-1.4%) rotate(-1.1deg); }
  36%  { transform: translateX(.8%) translateY(-.6%) rotate(1.8deg); }
  54%  { transform: translateX(.5%) translateY(-1.8%) rotate(-.5deg); }
  74%  { transform: translateX(.2%) translateY(-.8%) rotate(1.6deg); }
  100% { transform: translateX(0) translateY(0) rotate(.6deg); }
}
@keyframes mori-fafa-plume-core {
  0%, 100% { transform: scaleY(.72); opacity: .55; }
  50% { transform: scaleY(1.05); opacity: 1; }
}
@keyframes mori-fafa-plume-wisp {
  0%, 100% { opacity: .5; }
  50% { opacity: 1; }
}
@keyframes mori-fafa-vent {
  0%, 100% { transform: translate(-50%, -50%) rotate(-24deg) scale(.85, .68); opacity: .72; }
  50% { transform: translate(-50%, -50%) rotate(-24deg) scale(1.22, .976); opacity: 1; }
}
@keyframes mori-fafa-instrument {
  0%, 74%, 80%, 100% { opacity: .3; }
  77% { opacity: 1; }
}
@keyframes mori-fafa-trail {
  0% { transform: translateX(0) translateY(0); opacity: 0; }
  30% { opacity: .85; }
  70% { transform: translateX(-30%) translateY(120%); opacity: .4; }
  100% { transform: translateX(-34%) translateY(150%); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.theme-signal-desk .mori-panda-fafa__figure,
  body.theme-signal-desk .mori-panda-fafa__plume-core,
  body.theme-signal-desk .mori-panda-fafa__plume-wisp,
  body.theme-signal-desk .mori-panda-fafa__vent,
  body.theme-signal-desk .mori-panda-fafa__instrument circle,
  body.theme-signal-desk .mori-panda-fafa__trail { animation: none; }
  body.theme-signal-desk .mori-panda-fafa__trail { opacity: 0; }
}

/* ── qizai X-ray hero: a diagnostic boot instead of the "live subject" ─────
   The brown panda's side-cut X-ray (6.png) develops from a cyan fluoroscope
   ghost into full colour under a sweeping scan line, then the glowing heart
   double-beats (ECG lub-dub) and sonar ripples radiate while it is "monitored".
   The wrapper carries the host .qp-hero-panda class, so the desktop/phone
   layout, the hologram halo and every filter rule keep applying; the ghost/body/
   scan/heart/ripple layers are absolute siblings pinned inset:0 to stay welded
   at any width. */
body.theme-signal-desk .mori-panda-xray {
  display: block;
  aspect-ratio: 1845 / 1104;
}
body.theme-signal-desk .mori-panda-xray__ghost,
body.theme-signal-desk .mori-panda-xray__body {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
/* the developed layer is a vertical wipe: it sits clipped to nothing and the
   reveal keyframe opens it top→bottom in lockstep with the scan line, then
   closes it again at the loop end to reset for the next scan. */
body.theme-signal-desk .mori-panda-xray__body {
  clip-path: inset(0 0 100% 0);
  animation: mori-xray-reveal 7s linear infinite;
  will-change: clip-path;
}
/* the scan line is a thin cyan bar with a soft glow that tracks the wipe edge.
   The bar + glow are painted as the span's own background (two stacked gradients)
   so they are masked to the panda's own alpha (the transparent body PNG, set
   inline like the heart mask): the sweep only ever lights the body silhouette and
   never runs across empty card background or bleeds into the neighbouring
   column/plate copy, even when the hero卡 zooms the panda out of its frame.
   (A parent mask does NOT clip a ::before/child, so the bar must live on the
   masked element itself — same element-mask pattern as the heart.) */
body.theme-signal-desk .mori-panda-xray__scan {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-image:
    linear-gradient(180deg,
      rgba(0, 240, 255, 0) 0%,
      rgba(0, 240, 255, .20) 40%,
      rgba(0, 240, 255, .20) 60%,
      rgba(0, 240, 255, 0) 100%),
    linear-gradient(180deg,
      rgba(0, 240, 255, 0) 0%,
      rgba(0, 240, 255, .35) 25%,
      #eaffff 50%,
      rgba(0, 240, 255, .35) 75%,
      rgba(0, 240, 255, 0) 100%);
  background-repeat: no-repeat;
  background-size: 100% 46px, 100% 6px;
  background-position: 0 0, 0 0;
  opacity: 0;
  animation: mori-xray-scan 7s linear infinite;
  will-change: background-position, opacity;
  pointer-events: none;
}
/* the heart surge is masked to the exact heart shape extracted as
   hero-panda-xray-heart.png (the same 抠图-mask pattern as the santiz chest
   screen), so the warm light fills only the heart and never bleeds into the
   ribs behind it. */
body.theme-signal-desk .mori-panda-xray__heart {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(6.6% 11% at 55.9% 50%, #fff9de 0%, #ffd21e 45%, #ff2d1f 100%);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mix-blend-mode: screen;
  opacity: 0;
  animation: mori-xray-heartbeat 7s ease-in-out infinite;
  pointer-events: none;
}
/* the masked fill only ever lights inside the heart outline, so a soft unmasked
   bloom at the same centre swells with the beat and makes the lub-dub read as a
   pulse of light rather than a flat colour change */
body.theme-signal-desk .mori-panda-xray__bloom {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(13% 23% at 55.9% 50%, #fff6cf 0%, #ffc31e 38%, rgba(255, 60, 40, .55) 70%, rgba(255, 60, 40, 0) 100%);
  mix-blend-mode: screen;
  opacity: 0;
  animation: mori-xray-heartbeat 7s ease-in-out infinite;
  pointer-events: none;
}
/* sonar ripples radiate from the heart centre; three rings on a stagger */
body.theme-signal-desk .mori-panda-xray__ripple {
  position: absolute;
  left: 55.9%;
  top: 50%;
  width: 9%;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 3px solid #00e5ff;
  box-shadow: 0 0 4px 0 rgba(0, 229, 255, .55);
  transform: translate(-50%, -50%) scale(.2);
  opacity: 0;
  animation: mori-xray-ripple 7s ease-out infinite;
  pointer-events: none;
}
body.theme-signal-desk .mori-panda-xray__ripple--2 { animation-delay: .3s; }
body.theme-signal-desk .mori-panda-xray__ripple--3 { animation-delay: .6s; }

/* qizai X-ray hero: the brown-panda amber halo reads warm, but the X-ray scan
   is a cool cyan diagnostic — swap the amber for cyan so the projection stays
   in the scan palette (santiz's fig1 keeps its own halo). Scoped to the desktop
   split: on phone the host's own mobile projection rule (opacity .52 cyan glow)
   must win, or the near-solid halo pastes over the centred copy. */
@media (min-width: 1024px) {
  body.theme-signal-desk[data-mori-scene="qizai"] .mori-panda-xray {
    filter:
      saturate(1.12) contrast(1.06) brightness(1.05)
      drop-shadow(0 0 16px rgba(0, 240, 255, .5))
      drop-shadow(0 0 44px rgba(20, 130, 207, .4));
    opacity: .92;
  }
}

@keyframes mori-xray-reveal {
  0%   { clip-path: inset(0 0 100% 0); }
  37%  { clip-path: inset(0 0 0 0); }
  85%  { clip-path: inset(0 0 0 0); }
  100% { clip-path: inset(0 0 100% 0); }
}
@keyframes mori-xray-scan {
  0%   { background-position-y: 0%, 0%; opacity: 1; }
  37%  { background-position-y: 100%, 100%; opacity: 1; }
  40%  { background-position-y: 100%, 100%; opacity: 0; }
  85%  { background-position-y: 100%, 100%; opacity: 0; }
  100% { background-position-y: 0%, 0%; opacity: 0; }
}
@keyframes mori-xray-heartbeat {
  0%, 40%, 100% { opacity: 0; }
  43% { opacity: .5; }
  46% { opacity: .95; }
  49% { opacity: .45; }
  52% { opacity: 1; }
  57% { opacity: 0; }
}
@keyframes mori-xray-ripple {
  0%, 40% { opacity: 0; transform: translate(-50%, -50%) scale(.2); }
  45% { opacity: 1; }
  58% { opacity: .85; transform: translate(-50%, -50%) scale(4); }
  68% { opacity: 0; transform: translate(-50%, -50%) scale(8); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(8); }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-signal-desk .mori-panda-xray__body,
  body.theme-signal-desk .mori-panda-xray__scan,
  body.theme-signal-desk .mori-panda-xray__heart,
  body.theme-signal-desk .mori-panda-xray__bloom,
  body.theme-signal-desk .mori-panda-xray__ripple { animation: none; }
  body.theme-signal-desk .mori-panda-xray__body { clip-path: inset(0 0 0 0); }
  body.theme-signal-desk .mori-panda-xray__scan { display: none; }
}

/* ── home astronaut hero: zero-gravity habitation monitor ──────────────────
   The home astronaut floats face-up in a zero-g 监看 well. Unlike santiz
   ("live subject") and qizai ("machine being scanned"), home reads as
   *life-support telemetry*: the suit drifts buoyantly, a warm pulse of gas
   travels the corrugated hose, the helmet catches a slow specular glint, the
   chest port blinks a status LED and micro-bubbles drift up through the well.
   The wrapper keeps the host .hp-hero-panda class (every layout/filter rule
   applies); the body + overlays are absolute siblings welded inset:0, and the
   hose/helmet/port highlights are masked to extracted PNGs (mask-image set
   inline) so each stays welded to its part at any width. */
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro {
  display: block;
  aspect-ratio: 1845 / 1104;
}
/* the figure is the buoyancy unit: a slow zero-g rise/fall + rock plus a faint
   chest swell (breathe) so the suit reads alive, not a sticker. The body and its
   welded highlights (hose/glint/port) all live inside this figure and drift as
   one, so the gas slug and the port LED stay glued to the hose/socket while the
   suit rocks — the same "welded at any width" pattern as santiz's
   .mori-panda__figure breathe. The debris lives OUTSIDE the figure (the
   environment, not the subject). */
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__figure {
  position: relative;
  width: 100%;
  height: 100%;
  transform-origin: 50% 56%;
  animation: mori-astro-drift 13s ease-in-out infinite;
  will-change: transform;
}
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__body {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
@keyframes mori-astro-drift {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-2.4deg) scale(1); }
  14%      { transform: translate3d(1%, -1.8%, 0) rotate(-1deg) scale(1.006); }
  30%      { transform: translate3d(.6%, -3%, 0) rotate(.8deg) scale(1.013); }
  47%      { transform: translate3d(-.4%, -2.2%, 0) rotate(2.2deg) scale(1.01); }
  64%      { transform: translate3d(-1.2%, -.8%, 0) rotate(2.9deg) scale(1.003); }
  81%      { transform: translate3d(-.7%, .3%, 0) rotate(1.2deg) scale(1); }
}

/* hose life-support pulse: a cyan gas slug travels the tube from the chest
   port down to the tuck behind the pack, clipped to the extracted hose mask.
   Normal blend (not screen): screen keeps the cream tube's own bright red
   channel, so cyan washes to near-white and vanishes — the flow must be an
   opaque cyan capsule to read as gas. It is an animated overlay, not a recolor;
   the cream/amber tube is untouched everywhere the slug is not. */
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__hose {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  /* a tight cyan "gas slug" sweeps the tube port→tail. It is painted with
     normal blend (NOT screen): screen keeps the hose's own bright red channel,
     so cyan screen-blended onto cream washes to near-white and vanishes — that
     is exactly the "no contrast" the review flagged. An opaque-ish cyan capsule
     is the only way to read as gas against cream; it is an animated overlay, not
     a recolor — the cream/amber tube is untouched everywhere the slug isn't. */
  background-image: radial-gradient(ellipse 1.0% 1.7% at 50% 50%,
      rgba(0, 229, 255, .95) 0%,
      rgba(0, 229, 255, .95) 55%,
      rgba(0, 194, 232, .75) 78%,
      rgba(0, 194, 232, 0) 100%);
  background-size: 300% 300%;
  background-repeat: no-repeat;
  mix-blend-mode: normal;
  animation: mori-astro-hoseflow 3.8s cubic-bezier(.45, 0, .55, 1) infinite;
  will-change: background-position, opacity;
  pointer-events: none;
}
/* keyframes sweep the true hose centerline, extracted from the hose mask and
   converted image→span (scale 1296/1845 × 776/1104): port (671,363) drops the
   vertical to the bend bottom (679,465), turns right across the sag to the tail
   (745,490), then tucks behind the pack (715,515). Each span px is converted to
   background-position % against the 300% box (pos% = (1.5 − span_frac) × 50), so
   the slug rides ON the tube instead of clipping into empty mask around it. */
@keyframes mori-astro-hoseflow {
  0%   { background-position: 49.11% 51.61%; opacity: 0; }
  6%   { opacity: 1; }
  40%  { background-position: 48.80% 45.04%; }
  70%  { background-position: 46.26% 43.43%; }
  90%  { background-position: 47.41% 41.82%; opacity: 1; }
  96%  { opacity: 0; }
  100% { background-position: 49.11% 51.61%; opacity: 0; }
}

/* helmet glint: a thin diagonal specular streak sweeps the cyan dome every few
   seconds, masked to the helmet so it reads as light on the shell */
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__glint {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-image: linear-gradient(115deg,
      transparent 0%, transparent 30%,
      rgba(255, 255, 255, 0) 44%,
      rgba(255, 255, 255, .85) 50%,
      rgba(210, 245, 255, .9) 53%,
      rgba(255, 255, 255, 0) 60%,
      transparent 100%);
  background-size: 250% 250%;
  background-repeat: no-repeat;
  mix-blend-mode: screen;
  opacity: 0;
  animation: mori-astro-glint 6.5s ease-in-out infinite;
  will-change: background-position, opacity;
  pointer-events: none;
}
@keyframes mori-astro-glint {
  0%, 54%   { opacity: 0; background-position: 20% 0%; }
  60%       { opacity: 1; }
  72%       { opacity: 1; background-position: 80% 100%; }
  78%, 100% { opacity: 0; background-position: 80% 100%; }
}

/* chest-port status LED: a white-hot "lub-dub" blink in the hose socket. Painted
   opaque white on normal blend — screen blend of white onto the bright teal
   chest also washes out, which is why the blink read as nothing. The extracted
   port mask is a HOLLOW tube (the socket center, where the amber hose is, has
   alpha 0), so masking the LED to it clips the blink away entirely; the LED is
   instead a tight white core at the socket center, no mask, so it reads as a
   hot dot at the hose junction. The double-flash keeps it pulsing. */
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__port {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  /* NOTE: the first gradient must END on transparent, not white — a final stop
     of `#ffffff 100%` makes the gradient paint white *outside* the ending shape
     (the last stop colour extends to the whole box), which is why the blink
     previously washed out the entire panda. */
  background:
    radial-gradient(circle 12px at 51.9% 48.6%,
        #ffffff 0%,
        #ffffff 97%,
        rgba(255, 255, 255, 0) 100%),
    radial-gradient(circle 30px at 51.9% 48.6%,
        rgba(255, 255, 255, .75) 0%,
        rgba(255, 255, 255, .4) 45%,
        rgba(255, 255, 255, .15) 72%,
        rgba(255, 255, 255, 0) 100%);
  mix-blend-mode: normal;
  opacity: 0;
  animation: mori-astro-port 2.4s cubic-bezier(.22, 1, .36, 1) infinite;
  will-change: opacity;
  pointer-events: none;
}
@keyframes mori-astro-port {
  0%, 100% { opacity: 0; }
  7%  { opacity: 1; }
  18% { opacity: .9; }
  30% { opacity: 1; }
  42% { opacity: .9; }
  55% { opacity: 0; }
}

/* zero-g micro-debris: a few tiny cyan data-dots drift up through the well on
   staggered loops — the environment, not the subject */
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i {
  position: absolute;
  left: 50%;
  bottom: 6%;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 50%,
      #ffffff 0%,
      #d9fdff 30%,
      rgba(0, 229, 255, .9) 62%,
      rgba(0, 229, 255, 0) 100%);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .95), 0 0 10px rgba(0, 229, 255, .9), 0 0 20px rgba(0, 229, 255, .45);
  mix-blend-mode: screen;
  animation: mori-astro-bubble 9s linear infinite;
  opacity: 0;
}
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i:nth-child(1) { width: 3.2%; aspect-ratio: 1; animation-delay: 0s;    left: 34%; }
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i:nth-child(2) { width: 1.8%; aspect-ratio: 1; animation-delay: .6s;   left: 58%; }
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i:nth-child(3) { width: 2.4%; aspect-ratio: 1; animation-delay: 1.2s;  left: 47%; }
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i:nth-child(4) { width: 1.4%; aspect-ratio: 1; animation-delay: 1.8s;  left: 62%; }
body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i:nth-child(5) { width: 4.2%; aspect-ratio: 1; animation-delay: 2.4s;  left: 44%; filter: blur(0.8px); }
@keyframes mori-astro-bubble {
  0%   { transform: translate(-50%, 0) translateX(0); opacity: 0; }
  8%   { opacity: 1; }
  55%  { opacity: .7; }
  100% { transform: translate(-50%, -820%) translateX(18%); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__figure,
  body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__hose,
  body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__glint,
  body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__port,
  body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i {
    animation: none;
  }
  body.theme-signal-desk[data-mori-scene="home"] .mori-panda-astro__debris i { display: none; }
}

/* ── phone: the notch would cut the hamburger; keep the plate and ribbon ─── */
@media (max-width: 1023px) {
  body.theme-signal-desk :is(.hp-hero, .ap-hero, .fp-hero, .sp-hero, .qp-hero) { clip-path: none; }
  body.theme-signal-desk .mori-readout { grid-template-columns: 38px 84px minmax(0, 1fr); }
  body.theme-signal-desk .hp-section-heading h2 { font-size: 22px; }
  /* (the old locale-dropdown z-index lift is gone: the mobile locale now opens
     inside the full-screen menu, which is already above every chrome layer via
     `body.mori-menu-open .hp-mobile-header { z-index: 10001 }`) */
}

@media (prefers-reduced-motion: reduce) {
  body.theme-signal-desk::after,
  body.theme-signal-desk :is(.hp-service, .ap-product, .fp-feature-art, .qp-capability-grid article)::before,
  body.theme-signal-desk :is(.hp-service, .ap-product, .fp-feature-art, .qp-capability-grid article)::after,
  body.theme-signal-desk .mori-readout__meter i,
  body.theme-signal-desk .floating-directory,
  body.theme-signal-desk .floating-directory::before,
  body.theme-signal-desk .floating-directory > summary::before,
  body.theme-signal-desk .sp-capability::before {
    animation: none;
    opacity: .85;
  }
  body.theme-signal-desk :is(.hp-desktop-header, .hp-mobile-header)::after {
    animation: none;
  }
  body.theme-signal-desk :is(.hp-desktop-header, .hp-mobile-header) {
    transition: none;
  }
  body.theme-signal-desk .mori-hero-ticker span,
  body.theme-signal-desk .mori-hero-scan,
  body.theme-signal-desk .mori-hero-status i {
    animation: none;
  }
  body.theme-signal-desk .mori-hero-scan { opacity: .3; }
  body.theme-signal-desk .hp-latency-chart svg circle {
    animation: none;
    opacity: 1;
    transform: none;
  }
  body.theme-signal-desk .hp-latency-chart svg .mori-led-layer {
    animation: none;
    opacity: .3;
  }
  body.theme-signal-desk .hp-latency-chart svg :is(circle[fill="black"], circle[stroke="black"]) {
    animation: none;
    opacity: 1;
    transform: none;
  }
  body.theme-signal-desk .mori-fx-svg :is(.mori-fx-arrow, .mori-fx-lane, .mori-fx-link, .mori-fx-node, .mori-fx-dot, .mori-fx-panel, .mori-fx-scan) {
    animation: none;
    opacity: 1;
    transform: none;
    stroke-opacity: 1;
  }
  body.theme-signal-desk .mori-fx-svg .mori-fx-trace {
    animation: none;
    opacity: 0;
  }
  body.theme-signal-desk .mori-map-sweep {
    animation: none;
    opacity: .4;
    transform: rotate(-32deg);
  }
  body.theme-signal-desk .mori-map-ring {
    animation: none;
    opacity: .55;
    transform: scale(2.2);
  }
  body.theme-signal-desk .mori-map-ring--b { opacity: .25; transform: scale(3.4); }
  body.theme-signal-desk .mori-map-core {
    animation: none;
    opacity: .8;
    transform: scale(1);
  }
  body.theme-signal-desk .mori-map-scan {
    animation: none;
    opacity: 0;
  }
  body.theme-signal-desk .mori-map-live b { animation: none; opacity: 1; }
  body.theme-signal-desk .hp-licence > img {
    animation: none;
    opacity: .78;
  }
  body.theme-signal-desk .mori-fx-glyph .mori-fx-trace {
    animation: none;
    opacity: 0;
  }
  /* the shared reduced-motion rule parks the PCB matrix at .85; on qizai it
     must still sit below the capability glyphs */
  body.theme-signal-desk[data-mori-scene="qizai"]::after {
    opacity: .3;
    transform: none;
  }
  /* the host keeps 0.16s hover transitions on the header chrome and the plate
     group keeps 0.3s transform; both must fall silent under reduced motion */
  body.theme-signal-desk :is(.hp-desktop-nav a, .hp-icon-link img, .hp-language-switch a,
      .hp-service, .ap-product, .fp-feature-art, .qp-capability-grid article) {
    transition: none;
  }
  /* the mobile burger menu staggers/fades and the chat panel slides in with a
     scanline sweep — all fall silent here. The menu is still reachable (its
     open/close is an instant visibility toggle) and links sit at full opacity;
     the chat scanline is removed outright. */
  body.theme-signal-desk .mori-burger__bar,
  body.theme-signal-desk .mori-menu,
  body.theme-signal-desk .mori-menu__link,
  body.theme-signal-desk .mori-menu__locale,
  body.theme-signal-desk .support-panel {
    transition: none;
    animation: none;
  }
  body.theme-signal-desk .mori-menu__link,
  body.theme-signal-desk .mori-menu__locale {
    opacity: 1;
    transform: none;
  }
  body.theme-signal-desk .support-panel::after { display: none; }
}

/* ══ character card (recompose: character-card) ════════════════════════════
   Video-game character-introduction card, derived from the cyberpunk seed's
   cut-corner card + neon semantic palette (the seed has no character module,
   so this is a native component). The mascot is the character portrait; the
   info plate is the product's real facts dressed as stat bars. Full-screen on
   both breakpoints; the portrait is always large. */

body.theme-signal-desk .mori-char {
  display: flex;
  flex-direction: column;
  padding-top: 40px; /* clear the fixed 40px mobile header (64px >=1024) */
}

/* the host parks copy + panda as absolute deck layers; inside the card they are
   static children of the plate / portrait */
body.theme-signal-desk .mori-char :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) {
  display: none; /* the name/class/badges/stats carry identity; drop the host copy */
  position: static;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  translate: none;
  width: auto;
  margin: 0;
  z-index: auto;
}

/* ── top status bar: rarity · element · unit · live status ── */
body.theme-signal-desk .mori-char-topbar {
  position: relative;
  z-index: 4;
  flex: none;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px clamp(14px, 4vw, 48px);
  border-top: 1px solid rgba(0, 240, 255, .28);
  border-bottom: 1px solid rgba(20, 130, 207, .6);
  background: linear-gradient(180deg, rgba(7, 27, 36, .94), rgba(9, 33, 46, .62));
  font-family: var(--mori-type-mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #7df9ff;
  white-space: nowrap;
}
body.theme-signal-desk .mori-char-rarity {
  color: #fff35c;
  text-shadow: 0 0 10px rgba(255, 243, 92, .6);
}
body.theme-signal-desk .mori-char-element {
  color: var(--mori-char-fill);
  text-shadow: 0 0 10px var(--mori-char-fill);
}
body.theme-signal-desk .mori-char-unit { color: #6f8b99; }
body.theme-signal-desk .mori-char-status {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #a9c2cf;
}
body.theme-signal-desk .mori-char-status i {
  width: 6px;
  height: 6px;
  background: var(--mori-accent-readout);
  box-shadow: 0 0 8px rgba(12, 250, 119, .9);
  animation: mori-char-led 1.6s steps(2, jump-none) infinite;
}

/* ── stage: portrait | plate ── */
body.theme-signal-desk .mori-char-stage {
  flex: 1;
  min-height: 0;
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1.15fr);
  margin: 12px clamp(10px, 3vw, 40px);
  border: 1px solid rgba(0, 240, 255, .5);
  background:
    radial-gradient(120% 90% at 85% 0%, color-mix(in srgb, var(--mori-char-fill) 13%, transparent), transparent 60%),
    linear-gradient(180deg,
      color-mix(in srgb, var(--mori-char-bg) 15%, rgba(5, 15, 22, .86)),
      color-mix(in srgb, var(--mori-char-bg) 7%, rgba(7, 20, 29, .62)));
  box-shadow: inset 0 0 42px rgba(0, 0, 0, .35);
  overflow: hidden;
}
/* the one bounded "card": corner brackets in the character's colour */
body.theme-signal-desk .mori-char-stage::before,
body.theme-signal-desk .mori-char-stage::after {
  content: "";
  position: absolute;
  width: 26px;
  height: 26px;
  z-index: 5;
  pointer-events: none;
}
body.theme-signal-desk .mori-char-stage::before {
  top: -2px;
  left: -2px;
  border-top: 3px solid var(--mori-char-fill);
  border-left: 3px solid var(--mori-char-fill);
  filter: drop-shadow(0 0 6px var(--mori-char-fill));
}
body.theme-signal-desk .mori-char-stage::after {
  bottom: -2px;
  right: -2px;
  border-bottom: 3px solid var(--mori-char-fill);
  border-right: 3px solid var(--mori-char-fill);
  filter: drop-shadow(0 0 6px var(--mori-char-fill));
}
body.theme-signal-desk .mori-char-portrait {
  position: relative;
  overflow: visible;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* framed picture area: bg colour + decorative elements, clipped inside the frame.
   Layer order (bottom→top): bg colour → bg elements → frame → character. */
body.theme-signal-desk .mori-char-bg {
  position: absolute;
  inset: 12px;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(120% 90% at 50% 18%, color-mix(in srgb, var(--mori-char-bg) 80%, #070b12), transparent 74%),
    linear-gradient(180deg,
      color-mix(in srgb, var(--mori-char-bg) 52%, #070b12),
      color-mix(in srgb, var(--mori-char-bg) 16%, #0a0e16)),
    linear-gradient(90deg, color-mix(in srgb, var(--mori-char-fill) 12%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--mori-char-fill) 12%, transparent) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 40px 40px, 40px 40px;
}
/* background elements: decorative shapes on a transparent canvas that fill the
   portrait well. cover (not contain) so the decoration bleeds past every edge
   and never exposes a hard boundary as the well's aspect ratio shifts across
   breakpoints; .mori-char-bg's overflow:hidden clips the bleed to the frame. */
body.theme-signal-desk .mori-char-bgel {
  position: absolute;
  inset: -12px;
  z-index: 0;
  pointer-events: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  scale: var(--mori-char-zoom, 1);
}
/* split scenes (fafa / home): background elements are independent transparent
   stickers, each anchored to its own corner/edge (contain + directional
   background-position) instead of one cover-cropped canvas, so they never drift
   or get cropped as the well's aspect ratio shifts. The container drops the
   single-image cover and zoom so the items stand on their own. */
body.theme-signal-desk[data-mori-scene="fafa"] .mori-char-bgel,
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel,
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel,
body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel {
  background-image: none;
  scale: none;
}
body.theme-signal-desk .mori-char-bgel-item {
  position: absolute;
  pointer-events: none;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom center;
}
/* fafa: generic pink decorations ring the panda — sparkle + diamond + bolt down
   the left, ring + dot-cluster down the right, all kept clear of the centred
   panda (zoom 1.10). Items are inset off the bgel container (which spans 12px
   past the frame) so every shape stays fully inside the card instead of being
   clipped into a crescent by the frame at narrow sizes. */
body.theme-signal-desk[data-mori-scene="fafa"] .mori-char-bgel-item:nth-child(1) { left: 4%; top: 4%; width: 13%; height: 13%; background-position: top left; }
body.theme-signal-desk[data-mori-scene="fafa"] .mori-char-bgel-item:nth-child(2) { right: 5%; top: 5%; width: 12%; height: 12%; background-position: top right; }
body.theme-signal-desk[data-mori-scene="fafa"] .mori-char-bgel-item:nth-child(3) { left: 4%; bottom: 4%; width: 12%; height: 12%; background-position: bottom left; }
body.theme-signal-desk[data-mori-scene="fafa"] .mori-char-bgel-item:nth-child(4) { left: 6%; top: 24%; bottom: 24%; width: 6%; background-position: left center; }
body.theme-signal-desk[data-mori-scene="fafa"] .mori-char-bgel-item:nth-child(5) { right: 4%; bottom: 4%; width: 20%; height: 12%; background-position: bottom right; }
/* home: cyan nebula (top-right), steel-blue arc (bottom-left), mint ring planet
   (bottom-right), cream sun + lavender ring (top-left), plus a star-dust filler
   that covers the whole well. Corner items bleed against their edge so contain
   never exposes a hard boundary. */
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel-item:nth-child(1) { top: 0; right: 0; width: 46%; height: 54%; background-position: top right; }
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel-item:nth-child(2) { left: 0; bottom: 0; width: 25%; height: 32%; background-position: bottom left; }
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel-item:nth-child(3) { right: 0; bottom: 0; width: 14%; height: 30%; background-position: bottom right; }
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel-item:nth-child(4) { left: 13%; top: 4%; width: 13%; height: 20%; background-position: top left; }
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel-item:nth-child(5) { left: 0; top: 8%; width: 9.5%; height: 17%; background-position: top left; }
body.theme-signal-desk[data-mori-scene="home"] .mori-char-bgel-item:nth-child(6) { inset: 0; width: auto; height: auto; background-size: cover; background-position: center; }
/* santiz: tech decorations pinned to corners/edges — one gear asset cornered
   four ways, lightning (left mid, right upper to clear the glove), a sparkle,
   a dot-strip on the sill and a circuit band across the top. */
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(1) { left: 0; top: 0; width: 16%; height: 16%; background-position: top left; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(2) { right: 0; top: 0; width: 16%; height: 16%; background-position: top right; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(3) { left: 0; bottom: 0; width: 16%; height: 16%; background-position: bottom left; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(4) { right: 0; bottom: 0; width: 16%; height: 16%; background-position: bottom right; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(5) { left: 2%; top: 20%; bottom: 20%; width: 9%; background-position: left center; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(6) { right: 2%; top: 12%; width: 9%; height: 18%; transform: scaleX(-1); background-position: right center; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(7) { left: 13%; top: 13%; width: 9%; height: 9%; background-position: top left; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(8) { left: 22%; right: 22%; bottom: 1%; height: 20%; background-position: bottom center; }
body.theme-signal-desk[data-mori-scene="santiz"] .mori-char-bgel-item:nth-child(9) { left: 24%; right: 24%; top: 0; height: 12%; background-position: top center; }
/* qizai: five decoration glyphs on the mid-band and corners — cyan streamline
   column (left), light-disc cluster (right), torn-paper cloud (bottom), chevron
   band (top-left), tick-comb chain (top-right). */
body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel-item:nth-child(1) { left: 0; top: 15%; bottom: 15%; width: 20%; background-position: left center; }
body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel-item:nth-child(2) { right: 0; top: 17%; bottom: 17%; width: 22%; background-position: right center; }
body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel-item:nth-child(3) { left: 30%; right: 30%; bottom: 0; height: 24%; background-position: bottom center; }
body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel-item:nth-child(4) { left: 0; top: 0; width: 26%; height: 18%; background-position: top left; }
body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel-item:nth-child(5) { right: 0; top: 0; width: 24%; height: 16%; background-position: top right; }
/* wide desktop: the qizai panda (zoom 1.45) covers the well so far down that it
   swallows the bottom cloud, so lift the cloud band clear of the legs. */
@media (min-width: 1800px) {
  body.theme-signal-desk[data-mori-scene="qizai"] .mori-char-bgel-item:nth-child(3) { bottom: 6%; }
}
/* element frame: a cut-corner bracket in the character's colour */
body.theme-signal-desk .mori-char-portrait::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 12px;
  border: 2px solid var(--mori-char-fill);
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
  opacity: .8;
  filter: drop-shadow(0 0 8px var(--mori-char-fill));
  pointer-events: none;
}
body.theme-signal-desk .mori-char-portrait::after {
  content: "";
  position: absolute;
  top: 12px;
  right: 12px;
  width: 34px;
  height: 34px;
  background: var(--mori-char-fill);
  clip-path: polygon(0 0, 100% 0, 100% 100%);
  opacity: .85;
  pointer-events: none;
}
/* the mascot: bare imgs fill the well, animated wrappers
   (santiz/qizai/fafa) size to their own aspect ratio */
body.theme-signal-desk .mori-char-portrait :is(.hp-hero-panda, .fp-hero-panda) {
  position: static;
  top: auto;
  right: auto;
  left: auto;
  bottom: auto;
  translate: none;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 1;
  z-index: auto;
  margin: 0;
}
body.theme-signal-desk .mori-char-portrait :is(.mori-panda, .mori-panda-xray, .mori-panda-fafa, .mori-panda-astro) {
  position: relative;
  top: auto;
  right: auto;
  left: auto;
  bottom: auto;
  translate: none;
  width: 100%;
  height: auto;
  opacity: 1;
  z-index: auto;
  margin: 0;
}
/* pseudo-3D: the character sits above the frame border and pops past it */
body.theme-signal-desk .mori-char-portrait :is(.hp-hero-panda, .fp-hero-panda, .mori-panda, .mori-panda-xray, .mori-panda-fafa, .mori-panda-astro) {
  position: relative;
  z-index: 2;
  scale: var(--mori-char-zoom, 1);
}
/* scanline + corner tick overlays */
body.theme-signal-desk .mori-char-scan {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(0, 240, 255, 0), rgba(0, 240, 255, .6) 18%, rgba(0, 240, 255, .6) 82%, rgba(0, 240, 255, 0));
  box-shadow: 0 0 12px rgba(0, 240, 255, .4);
  animation: mori-char-scan 6s linear infinite;
  pointer-events: none;
}
body.theme-signal-desk .mori-char-tick {
  position: absolute;
  left: 12px;
  bottom: 12px;
  width: 20px;
  height: 20px;
  border-left: 1px solid var(--mori-char-fill);
  border-bottom: 1px solid var(--mori-char-fill);
  opacity: .7;
  pointer-events: none;
}
/* scan / corner accents float above frame + character */
body.theme-signal-desk .mori-char-portrait::after,
body.theme-signal-desk .mori-char-scan,
body.theme-signal-desk .mori-char-tick {
  z-index: 3;
}

/* ── plate: kicker · name · tagline · stats · integrity · voiceline · CTA ── */
body.theme-signal-desk .mori-char-plate {
  position: relative;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
  padding: 16px 20px 14px;
  overflow-y: auto;
}
body.theme-signal-desk .mori-char-class {
  font-family: var(--mori-type-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mori-char-fill);
  text-shadow: 0 0 12px var(--mori-char-fill);
}
body.theme-signal-desk .mori-char-name {
  font-family: var(--mori-type-mono);
  font-size: clamp(32px, 11vw, 54px);
  line-height: .95;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #eaf6ff;
  text-shadow:
    0 2px 0 rgba(9, 13, 20, .85),
    0 4px 8px rgba(9, 13, 20, .55),
    0 0 24px var(--mori-char-fill);
}
/* rarity / element / unit badges docked under the name */
body.theme-signal-desk .mori-char-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.theme-signal-desk .mori-char-badge {
  padding: 3px 10px;
  border: 1px solid rgba(0, 240, 255, .4);
  font-family: var(--mori-type-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
body.theme-signal-desk .mori-char-badge--rarity {
  color: #fff35c;
  border-color: rgba(255, 243, 92, .55);
  text-shadow: 0 0 10px rgba(255, 243, 92, .55);
}
body.theme-signal-desk .mori-char-badge--element {
  color: var(--mori-char-fill);
  border-color: var(--mori-char-fill);
  text-shadow: 0 0 10px var(--mori-char-fill);
}
body.theme-signal-desk .mori-char-badge--unit {
  color: #7df9ff;
  border-color: rgba(0, 240, 255, .4);
}
/* the host wordmark (h1) is the character's epithet/tagline, not the name */
body.theme-signal-desk .mori-char-plate :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) h1 {
  font-family: var(--mori-type-mono);
  font-size: clamp(13px, 1.5vw, 18px);
  line-height: 1.3;
  font-weight: 400;
  letter-spacing: .06em;
  text-transform: none;
  color: #a9c2cf;
  text-shadow: none;
}
/* the brand line ("Panda Securities") is the header logo's job — drop it here */
body.theme-signal-desk .mori-char-plate :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) > p:first-child {
  display: none;
}
/* description stays as flavour */
body.theme-signal-desk .mori-char-plate :is(.hp-hero-copy, .fp-hero-copy, .sp-hero-copy, .qp-hero-copy) p {
  margin-top: 2px;
}
/* stat bars */
body.theme-signal-desk .mori-char-stats {
  list-style: none;
  margin: 4px 0 0;
  padding: 10px 0 0;
  border-top: 1px solid rgba(0, 240, 255, .4);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
body.theme-signal-desk .mori-char-stats li {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "label value" "track track";
  row-gap: 4px;
  column-gap: 12px;
  align-items: baseline;
}
body.theme-signal-desk .mori-char-stat-label {
  grid-area: label;
  color: #6f8b99;
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.theme-signal-desk .mori-char-stat-label::before { content: "> "; color: var(--mori-char-fill); }
body.theme-signal-desk .mori-char-stat-value {
  grid-area: value;
  color: #eaf6ff;
  font-family: var(--mori-type-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .05em;
  text-shadow: 0 0 8px rgba(0, 240, 255, .4);
  white-space: nowrap;
}
body.theme-signal-desk .mori-char-stat-track {
  grid-area: track;
  height: 7px;
  background: rgba(6, 20, 30, .85);
  border: 1px solid rgba(0, 240, 255, .35);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .6);
  overflow: hidden;
}
body.theme-signal-desk .mori-char-stat-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, rgba(255, 255, 255, .2), var(--mori-char-fill));
  box-shadow: 0 0 10px var(--mori-char-fill);
}
/* integrity meter */
body.theme-signal-desk .mori-char-integrity {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "label value" "track track";
  row-gap: 5px;
  column-gap: 12px;
  align-items: baseline;
  margin-top: 6px;
  padding-top: 10px;
  border-top: 1px dashed rgba(0, 240, 255, .4);
}
body.theme-signal-desk .mori-char-int-label {
  grid-area: label;
  color: var(--mori-char-fill);
  font-family: var(--mori-type-mono);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-shadow: 0 0 8px var(--mori-char-fill);
}
body.theme-signal-desk .mori-char-int-label::before { content: "◇ "; color: var(--mori-char-fill); }
body.theme-signal-desk .mori-char-int-value {
  grid-area: value;
  color: var(--mori-char-fill);
  font-family: var(--mori-type-mono);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-shadow: 0 0 10px var(--mori-char-fill);
  white-space: nowrap;
}
body.theme-signal-desk .mori-char-int-track {
  grid-area: track;
  height: 9px;
  background: rgba(6, 20, 30, .85);
  border: 1px solid rgba(0, 240, 255, .4);
  overflow: hidden;
}
body.theme-signal-desk .mori-char-int-fill {
  display: block;
  height: 100%;
  background: repeating-linear-gradient(90deg, var(--mori-char-fill) 0 10px, rgba(6, 20, 30, .55) 10px 13px);
  box-shadow: 0 0 12px var(--mori-char-fill);
}
/* voiceline */
body.theme-signal-desk .mori-char-line {
  font-family: var(--mori-type-serif);
  font-style: italic;
  font-size: clamp(13px, 1.6vw, 18px);
  line-height: 1.3;
  color: #cfe9f5;
  text-shadow: 0 0 12px rgba(0, 240, 255, .25);
}
/* CTA as a neon button */
body.theme-signal-desk .mori-char-plate :is(.hp-cta, .fp-cta, .sp-pill, a) {
  align-self: flex-start;
  display: inline-grid;
  margin-top: 4px;
  padding: 11px 22px;
  border: 1px solid var(--mori-char-fill);
  background: var(--mori-char-fill);
  color: #06121a;
  font-family: var(--mori-type-mono);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: none;
  box-shadow: 0 0 18px var(--mori-char-fill);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}

/* ── live ticker sill ── */
body.theme-signal-desk .mori-char-ticker {
  position: relative;
  z-index: 3;
  flex: none;
  height: 26px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-top: 1px solid rgba(0, 240, 255, .38);
  border-bottom: 1px solid rgba(0, 240, 255, .22);
  background: rgba(7, 27, 36, .9);
  /* room for the floating Services button at <=1023px */
  padding-right: calc(max(24px, env(safe-area-inset-right)) + 64px);
}
body.theme-signal-desk .mori-char-ticker span {
  display: inline-block;
  min-width: max-content;
  white-space: pre;
  color: #7df9ff;
  font-size: 10px;
  letter-spacing: .3em;
  text-transform: uppercase;
  animation: mori-char-marquee 30s linear infinite;
}

@keyframes mori-char-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes mori-char-scan { 0% { top: 0; opacity: 0; } 8% { opacity: .7; } 92% { opacity: .7; } 100% { top: 100%; opacity: 0; } }
@keyframes mori-char-led { 0%, 49% { opacity: 1; } 50%, 100% { opacity: .35; } }

/* ── >=720px: two columns, portrait leading ── */
@media (min-width: 720px) {
  body.theme-signal-desk .mori-char-stage {
    grid-template-columns: minmax(0, 42fr) minmax(0, 58fr);
    grid-template-rows: 1fr;
  }
  /* plate leads on the left, the portrait takes the larger right column */
  body.theme-signal-desk .mori-char-plate { order: 1; }
  body.theme-signal-desk .mori-char-portrait { order: 2; }
  body.theme-signal-desk .mori-char-portrait { aspect-ratio: auto; border-left: 1px solid rgba(0, 240, 255, .26); }
  body.theme-signal-desk .mori-char-plate {
    padding: clamp(24px, 3.5vw, 48px);
    justify-content: center;
    gap: 14px;
    overflow: hidden;
  }
  body.theme-signal-desk .mori-char-name { font-size: clamp(40px, 6vw, 92px); }
  body.theme-signal-desk .mori-char-topbar { padding: 11px clamp(20px, 4vw, 48px); font-size: 10px; }
  body.theme-signal-desk .mori-char-portrait::before { inset: 18px; }
  body.theme-signal-desk .mori-char-bg { inset: 18px; }
  body.theme-signal-desk .mori-char-portrait::after { top: 18px; right: 18px; width: 46px; height: 46px; }
  body.theme-signal-desk .mori-char-tick { left: 18px; bottom: 18px; width: 22px; height: 22px; }
  body.theme-signal-desk .mori-char-stats { gap: 9px; }
}
/* ── >=1024px: the desktop header is 64px ── */
@media (min-width: 1024px) {
  body.theme-signal-desk .mori-char { padding-top: 64px; }
  body.theme-signal-desk .mori-char-ticker { padding-right: 0; }
}
/* ── reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  body.theme-signal-desk .mori-char-ticker span,
  body.theme-signal-desk .mori-char-scan,
  body.theme-signal-desk .mori-char-status i {
    animation: none;
  }
  body.theme-signal-desk .mori-char-scan { opacity: .3; }
}

/* ── <720px: the info plate is stacked under the portrait. The home scene has
   the longest name ("PANDA SECURITIES", two lines) plus the full stat set, so
   tighten the vertical rhythm here to keep the CTA above the ticker sill —
   the character well (portrait) is untouched and stays at 40% viewport height. */
@media (max-width: 719px) {
  body.theme-signal-desk .mori-char-plate { gap: 5px; padding: 12px 18px 10px; }
  body.theme-signal-desk .mori-char-name { font-size: clamp(30px, 10vw, 42px); }
  body.theme-signal-desk .mori-char-badges { gap: 6px; }
  body.theme-signal-desk .mori-char-stats { gap: 5px; padding: 7px 0 0; }
  body.theme-signal-desk .mori-char-stats li { row-gap: 3px; }
  body.theme-signal-desk .mori-char-stat-track { height: 6px; }
  body.theme-signal-desk .mori-char-integrity { padding-top: 6px; margin-top: 4px; }
  body.theme-signal-desk .mori-char-int-track { height: 8px; }
  body.theme-signal-desk .mori-char-line { margin-top: auto; }
  body.theme-signal-desk .mori-char-portrait :is(.hp-hero-panda, .fp-hero-panda, .mori-panda, .mori-panda-xray, .mori-panda-fafa, .mori-panda-astro) { scale: 1.06; }
}

/* ── nightline: engineered editorial surfaces ──────────────────────────────── */
body.theme-nightline {
  --nightline-blue: #4589ff;
  --nightline-violet: #d1c9ff;
  --nightline-gradient: #4589ff;
  color-scheme: dark;
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
}
body.theme-nightline :is(.hp-page, .ap-page, .fp-page, .sp-page, .qp-page, .dp-page) {
  overflow: clip;
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
  font-family: var(--mori-type-sans);
}
body.theme-nightline :is(.hp-desktop-header, .hp-mobile-header, .ap-header) {
  background: rgba(26, 26, 29, .92);
  border-bottom: 1px solid var(--mori-accent-divider);
  backdrop-filter: blur(16px);
}
body.theme-nightline :is(.hp-desktop-nav a, .hp-mobile-header a, .hp-header-brand, .hp-about-link) {
  color: var(--mori-ink-base);
  text-decoration-color: transparent;
  transition: color .18s ease, text-decoration-color .18s ease;
}
body.theme-nightline :is(.hp-desktop-nav a, .hp-mobile-header a):hover {
  color: var(--nightline-violet);
  text-decoration-color: currentColor;
}
body.theme-nightline :is(.hp-desktop-nav a, .hp-mobile-header a, .hp-cta, .hp-footer a, .floating-directory a):focus-visible {
  outline: 2px solid var(--nightline-violet);
  outline-offset: 4px;
}
body.theme-nightline .hp-hero {
  position: relative;
  isolation: isolate;
  height: auto;
  /* First screen fills the viewport for a full-bleed landing; 100svh keeps the
     mobile browser chrome from pushing the copy off-screen. */
  min-height: 100vh;
  min-height: 100svh;
  padding: 0;
  background: var(--mori-surface-page);
  border-bottom: 1px solid var(--mori-accent-divider);
}
body.theme-nightline .hp-hero::after { content: none; }
body.theme-nightline .hp-hero-grid { display: none; }
body.theme-nightline .hp-hero-copy {
  position: absolute;
  top: 50%;
  left: max(6vw, calc((100vw - 1200px) / 2));
  transform: translateY(-50%);
  z-index: 2;
  width: min(680px, 62%);
}
body.theme-nightline .hp-hero-copy > p:first-child,
body.theme-nightline .hp-section-heading > p,
body.theme-nightline .hp-company-copy > p:first-child,
body.theme-nightline .hp-licence-copy > p:first-child {
  color: var(--nightline-violet);
  font: 600 12px/1.4 var(--mori-type-mono);
  text-transform: uppercase;
  letter-spacing: .08em;
}
body.theme-nightline .hp-hero h1 {
  max-width: 680px;
  margin: 16px 0 20px;
  color: var(--mori-ink-strong);
  font-family: var(--mori-type-display);
  font-style: italic;
  font-size: var(--mori-type-hero);
  font-weight: var(--mori-type-hero-weight);
  line-height: 1.06;
  letter-spacing: 0;
}
body.theme-nightline .hp-hero-description { max-width: 540px; color: var(--mori-ink-muted); line-height: 1.8; }
body.theme-nightline .hp-hero-panda {
  top: 50%;
  right: max(5vw, calc((100vw - 1420px) / 2));
  transform: translateY(-50%);
  width: min(40vw, 560px);
  height: auto;
  max-height: 86%;
  object-fit: contain;
  filter: drop-shadow(0 28px 56px rgba(92, 103, 213, .22));
}
body.theme-nightline .hp-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin-top: 22px;
  padding: 0 24px;
  border: 0;
  border-radius: 3px;
  background: var(--nightline-gradient);
  color: #11131b;
  font-weight: 650;
}
body.theme-nightline :is(.hp-retail, .hp-latency, .hp-licence, .hp-office) {
  padding: 80px max(6vw, calc((100vw - 1200px) / 2));
  background: var(--mori-surface-page);
  border-bottom: 1px solid var(--mori-accent-divider);
}
body.theme-nightline :is(.hp-section-heading, .hp-licence-copy, .hp-office > h2) { max-width: 1320px; margin-inline: auto; }
body.theme-nightline :is(.hp-section-heading h2, .hp-company-copy h2, .hp-licence-copy h2, .hp-office > h2) {
  color: var(--mori-ink-strong);
  font-size: var(--mori-type-section);
  font-weight: var(--mori-type-section-weight);
  line-height: 1.18;
  letter-spacing: 0;
}
body.theme-nightline .hp-section-description { color: var(--mori-ink-muted); }
/* The reference lays every band on one left rail (x = content edge); only the opening
   hero centers. Keep that rail instead of centering each band independently. */
body.theme-nightline :is(.hp-section-heading, .hp-company-copy, .hp-licence-copy) { text-align: start; }
body.theme-nightline .hp-service { text-align: start; }
/* Four cards on the measured 3-column rail: let the last one span the row so no empty cell is left. */
@media (min-width: 720px) {
  body.theme-nightline .hp-service-grid .hp-service:nth-child(4):last-child { grid-column: 1 / -1; }
}
body.theme-nightline .hp-service-grid {
  max-width: none;
  margin: 32px 0 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
  border: 0;
  background: none;
}
body.theme-nightline .hp-service-grid .hp-service {
  min-width: 0;
  padding: 16px;
  background: var(--mori-surface-content);
  border: 0;
  border-radius: 12px;
  transition: background .2s ease;
}
body.theme-nightline .hp-service:hover { background: var(--mori-surface-content); }
body.theme-nightline .hp-service img { box-sizing: content-box; width: 52px; height: 52px; padding: 8px; object-fit: contain; border-radius: 12px; background: var(--mori-ink-base); }
/* Host artwork is authored for light grounds (black / #121F28 fills); re-ground it for the dark surfaces. */
body.theme-nightline :is(.hp-header-brand, .hp-mobile-header > a) img,
body.theme-nightline :is(.hp-icon-link img, .hp-header-brand img, .hp-mobile-header .hp-brand img) { filter: brightness(0) invert(1); }
/* Dark-ground licence artwork (light strokes on transparency) replaces the CSS
   filter inversion — same anti-aliased line art, no colour channel inversion. */
body.theme-nightline .hp-licence > img { content: url("../home-assets/licence-nightline.png"); filter: none; }
body.theme-nightline .hp-office-map img { filter: brightness(2.4) contrast(.9); }
/* Dark-ground artwork drawn for this theme (light data points, dim grid dots) replaces the filter-inverted host chart. */
body.theme-nightline .hp-latency-chart img { content: url("../home-assets/latency-chart-dark.svg"); filter: none; }
body.theme-nightline .hp-service h3 { margin-top: 25px; color: var(--mori-ink-strong); font-size: 16px; line-height: 1.35; }
body.theme-nightline .hp-service p { color: var(--mori-ink-muted); line-height: 1.7; }
body.theme-nightline .hp-latency-body {
  max-width: 1320px;
  margin: 42px auto 0;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(32px, 6vw, 88px);
  align-items: center;
}
body.theme-nightline .hp-latency-copy { display: grid; gap: 0; }
body.theme-nightline .hp-latency-copy article { padding: 22px 0; border-top: 1px solid var(--mori-accent-divider); }
body.theme-nightline .hp-latency-copy h3 { color: var(--mori-ink-strong); font-size: 16px; }
body.theme-nightline .hp-latency-copy p { color: var(--mori-ink-muted); line-height: 1.7; }
body.theme-nightline .hp-latency-chart { padding: 18px; border: 1px solid var(--mori-accent-card-border); background: var(--mori-surface-content); }
body.theme-nightline .hp-latency-chart img { display: block; width: 100%; height: auto; }
/* Runtime-authored editorial labels (slot caps, section indices, readouts). They are part
   of the shared recompose language, not debug output; give them the theme's restrained
   monospace treatment instead of leaving them at default body typography. */
body.theme-nightline .mori-slot__cap,
body.theme-nightline .mori-slot__foot,
body.theme-nightline .mori-section__bar,
body.theme-nightline .mori-band__bar {
  display: flex; align-items: center; gap: 10px;
}
body.theme-nightline .mori-slot__cap { margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--mori-accent-divider); }
body.theme-nightline .mori-slot__cap > b {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 26px; height: 19px; padding: 0 5px;
  border-radius: 3px;
  background: var(--mori-accent-primary); color: var(--mori-surface-page);
  font: 600 11px/1 var(--mori-type-mono); font-variant-numeric: tabular-nums;
}
body.theme-nightline .mori-slot__title,
body.theme-nightline .mori-slot__meta,
body.theme-nightline .mori-section__idx,
body.theme-nightline .mori-band__idx,
body.theme-nightline .mori-band__label,
body.theme-nightline .mori-readout__idx {
  color: var(--mori-ink-muted);
  font: 500 10px/1.5 var(--mori-type-mono);
  letter-spacing: .14em; text-transform: uppercase;
}
body.theme-nightline .mori-slot__foot { margin-top: 8px; }
body.theme-nightline .mori-slot__rule,
body.theme-nightline .mori-section__rule {
  flex: 1 1 auto; height: 1px; background: var(--mori-accent-divider);
}
body.theme-nightline .mori-slot__dots { display: none; }
body.theme-nightline .mori-section__bar { margin-bottom: 14px; }
body.theme-nightline .mori-section__idx { color: var(--mori-accent-highlight); }
body.theme-nightline .mori-band__bar { margin-bottom: 18px; }
body.theme-nightline .hp-cool { display: none; }
/* Company band: runtime wraps the content in .mori-band__bar + .mori-band__body, so the two-column
   layout belongs on the body, not on the band itself. */
body.theme-nightline .hp-company { display: block; }
body.theme-nightline .hp-company .mori-band__body {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(0, 1fr);
  gap: clamp(36px, 8vw, 120px);
  align-items: center;
}
body.theme-nightline .hp-company-mark img { margin: 0; }
body.theme-nightline .hp-office { text-align: start; }
body.theme-nightline .hp-office > h2 { margin: 0; text-align: start; }
body.theme-nightline .hp-contact { margin: 24px 0 0; padding: 0; width: auto; max-width: none; }
body.theme-nightline :is(.hp-contact > div, .hp-contact span, .hp-contact a, .hp-address address) { text-align: start; justify-items: start; }
body.theme-nightline .hp-service img { display: block; margin: 0 0 16px; }
@media (max-width: 719px) {
  body.theme-nightline .hp-company .mori-band__body { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}

body.theme-nightline .hp-company {
  display: block;
  padding: 80px max(6vw, calc((100vw - 1200px) / 2));
  background: var(--mori-surface-content);
  border-bottom: 1px solid var(--mori-accent-divider);
}
body.theme-nightline .hp-company-mark img { display: block; width: min(100%, 260px); margin: auto; }
body.theme-nightline .hp-company-copy { max-width: 720px; min-width: 0; }
/* The host centers this heading with position:relative; left:300px; translateX(-50%). Drop that
   offset so the heading sits on the copy column's left edge instead of overflowing it. */
body.theme-nightline .hp-company-copy h2 {
  position: static; left: auto; transform: none;
  width: auto; max-width: 100%; white-space: normal; text-align: start;
}
body.theme-nightline .hp-company { text-align: start; }
body.theme-nightline .hp-company .mori-band__bar { width: 100%; justify-content: flex-start; }
body.theme-nightline .hp-company-description { color: var(--mori-ink-muted); line-height: 1.8; }
body.theme-nightline .hp-licence { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr); gap: 48px; align-items: center; }
body.theme-nightline .hp-licence-copy { width: 100%; }
/* The host pins section H2s to one line (white-space:nowrap); the English licence
   headline is wider than its column and would cross into the illustration. */
body.theme-nightline .hp-licence-copy h2 { white-space: normal; text-align: start; }
body.theme-nightline .hp-licence dl { margin-top: 32px; border-top: 1px solid var(--mori-accent-divider); }
body.theme-nightline .hp-licence dl > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; padding: 18px 0; border-bottom: 1px solid var(--mori-accent-divider); }
body.theme-nightline .hp-licence dt { color: var(--mori-ink-base); }
body.theme-nightline .hp-licence dd { margin: 0; color: var(--nightline-violet); font-family: var(--mori-type-mono); font-variant-numeric: tabular-nums; }
body.theme-nightline .hp-licence { height: auto; min-height: 0; overflow: visible; }
/* The host pins this illustration with position:absolute (top:196px; left:8px) on mobile; in this band it is a grid item. */
body.theme-nightline .hp-licence > img { position: static; top: auto; left: auto; height: auto; object-fit: contain; width: min(100%, 420px); justify-self: center; border: 1px solid var(--mori-accent-card-border); }
body.theme-nightline .hp-latency-chart { height: auto; margin: 0; }
body.theme-nightline .hp-latency-chart img { height: auto; object-fit: contain; }
body.theme-nightline .hp-office { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 24px 64px; align-items: center; }
body.theme-nightline .hp-office-map { grid-row: span 2; overflow: hidden; border: 1px solid var(--mori-accent-card-border); height: auto; }
/* The host crops a 1210px map through a 300px window (absolute top:-297px). In this band
   the map is a framed square, so drop the host's crop rather than inherit a sliver. */
/* The themed survey is inlined as live SVG; the <img> rules below only cover the
   stock satellite fallback before the fetch resolves. */
body.theme-nightline .hp-office-map .mori-map-svg {
  position: absolute; inset: 0; z-index: 1;
  display: block; width: 100%; height: 100%;
}
body.theme-nightline .hp-office-map { position: relative; aspect-ratio: 1 / 1; }
body.theme-nightline .hp-office-map::after {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  box-shadow: inset 0 0 0 1px var(--mori-accent-card-border), inset 0 0 40px rgba(0, 0, 0, .5);
}
body.theme-nightline .hp-contact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
body.theme-nightline .hp-contact > div { padding: 16px 0; border-top: 1px solid var(--mori-accent-divider); }
body.theme-nightline .hp-contact span { display: block; margin-bottom: 7px; color: var(--mori-ink-muted); font: 11px/1.4 var(--mori-type-mono); text-transform: uppercase; }
body.theme-nightline .hp-contact a { color: var(--nightline-blue); }
body.theme-nightline .hp-address { grid-column: 1 / -1; }
body.theme-nightline .hp-address address { color: var(--mori-ink-base); font-style: normal; line-height: 1.6; }
body.theme-nightline .hp-footer { padding: 0; background: var(--mori-surface-footer); border-top: 1px solid var(--mori-accent-divider); }
body.theme-nightline .hp-footer-inner { max-width: none; margin-inline: auto; padding: 80px max(6vw, calc((100vw - 1200px) / 2)); }
body.theme-nightline .hp-footer-columns { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
body.theme-nightline .hp-footer-column { min-width: 0; }
body.theme-nightline .hp-footer-column h2 { color: var(--mori-ink-strong); font: 600 13px/1.4 var(--mori-type-sans); }
body.theme-nightline .hp-footer-column p,
body.theme-nightline .hp-footer-list a { color: var(--mori-ink-muted); font-size: 12px; line-height: 1.8; }
body.theme-nightline .hp-footer-brand { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--mori-accent-divider); }
body.theme-nightline .hp-footer-brand img { width: min(220px, 55vw); filter: brightness(0) invert(1); }
body.theme-nightline .hp-copyright { color: var(--mori-ink-faint); font-size: 11px; }
body.theme-nightline .hp-back-to-top { border: 1px solid var(--mori-accent-divider); border-radius: 2px; background: transparent; color: var(--mori-ink-base); }
body.theme-nightline .floating-directory { border-color: var(--mori-accent-card-border); background: var(--mori-surface-content); color: var(--mori-ink-base); }
body.theme-nightline .floating-directory[open] nav { background: var(--mori-surface-content); }
body.theme-nightline .floating-directory a { color: var(--mori-ink-base); }
body.theme-nightline .support-launcher { border-color: var(--mori-accent-card-border); background: var(--mori-surface-content); color: var(--mori-ink-base); }
body.theme-nightline :is(.ap-hero, .fp-hero, .sp-hero, .qp-hero, .dp-download) {
  background: var(--mori-surface-page);
  color: var(--mori-ink-base);
}
/* Download page — the base theme paints the .dp-top hero band a light #dae0e0
   with animated white stripes; re-ground it onto the dark surface and drop the
   stripes so the header/hero don't sit on a light band. */
body.theme-nightline .dp-top {
  background-color: var(--mori-surface-page);
  background-image: none;
  animation: none;
}
/* Download CTAs are black (#000) buttons in the light theme; on the dark surface
   a #000 button vanishes into the page, so lift it onto the card surface with a
   hairline border. */
body.theme-nightline .dp-page .dp-download-link {
  color: var(--mori-ink-base);
  background-color: var(--mori-surface-card);
  border: 1px solid var(--mori-accent-card-border);
}
/* Product first screens (FaFa/Santiz/QizAI) reuse the homepage hero skeleton —
   absolute copy + mascot — so they fill the viewport and centre the same way. */
body.theme-nightline :is(.fp-hero, .sp-hero, .qp-hero) {
  height: auto;
  min-height: 100vh;
  min-height: 100svh;
}
body.theme-nightline :is(.fp-hero-copy, .sp-hero-copy, .qp-hero-copy) {
  top: 50%;
  transform: translateY(-50%);
}
body.theme-nightline :is(.fp-hero-panda, .sp-hero-panda, .qp-hero-panda) {
  top: 50%;
  transform: translateY(-50%);
  height: auto;
  object-fit: contain;
}
body.theme-nightline :is(.ap-product, .ap-technical section, .fp-feature, .sp-capability, .qp-service, .dp-download-column) {
  border-color: var(--mori-accent-card-border);
  border-radius: 3px;
  background-color: var(--mori-surface-card);
  color: var(--mori-ink-base);
}
body.theme-nightline :is(.ap-page, .fp-page, .sp-page, .qp-page, .dp-page) :is(h1, h2, h3) { color: var(--mori-ink-strong); }

/* Product pages (FaFa / QizAI) — the base light theme paints several full-width
   bands and the hero CTAs white; nightline already lifts their headings and body
   copy to light ink, so those bands render light-on-light. Re-ground the bands
   onto the dark surface and lift the CTA pills off the page. */
body.theme-nightline :is(.fp-download, .fp-licensing, .qp-services, .qp-agent, .qp-download) {
  background: var(--mori-surface-content);
}
body.theme-nightline .fp-licensing { border-color: var(--mori-accent-divider); }
body.theme-nightline .fp-licensing-heading > p { color: var(--mori-ink-muted); }
body.theme-nightline .fp-licensing-reference { color: var(--mori-ink-muted); }
body.theme-nightline .fp-licensing-description { color: var(--mori-ink-base); }
body.theme-nightline :is(.fp-cta, .qp-hero-copy > a) {
  color: var(--mori-ink-base);
  background-color: var(--mori-surface-card);
  border-color: var(--mori-accent-card-border);
}

/* Secondary pages (About / legal) — the base light theme hard-codes black body text
   on these containers; nightline must re-colour them onto its dark surface. */
body.theme-nightline .ap-title { color: var(--mori-ink-strong); }
body.theme-nightline .ap-focus-label { color: var(--mori-ink-strong); }
body.theme-nightline .ap-intro { color: var(--mori-ink-base); }
body.theme-nightline .ap-intro ul { color: var(--mori-ink-muted); }
body.theme-nightline .ap-blocks { color: var(--mori-ink-muted); }
body.theme-nightline .ap-blocks h3,
body.theme-nightline .ap-blocks h4 { color: var(--mori-ink-base); }
body.theme-nightline .ap-contact-field dt { color: var(--mori-ink-muted); }
body.theme-nightline .ap-contact-field dd { color: var(--mori-ink-base); }
body.theme-nightline .ap-content a { color: var(--mori-ink-base); text-decoration-color: var(--mori-ink-muted); }

@media (min-width: 720px) and (max-width: 1023px) {
  body.theme-nightline .hp-hero { min-height: 100vh; min-height: 100svh; padding: 0 6vw; }
  body.theme-nightline .hp-hero-copy { width: min(60%, 560px); }
  body.theme-nightline .hp-hero-panda { right: 1vw; width: 46vw; }
  body.theme-nightline .hp-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.theme-nightline .hp-licence { grid-template-columns: minmax(0, 1fr) 260px; }
  body.theme-nightline .hp-footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 719px) {
  body.theme-nightline {
    color-scheme: dark;
    background: var(--mori-surface-page);
    color: var(--mori-ink-base);
  }
  body.theme-nightline :is(.hp-page, .ap-page, .fp-page, .sp-page, .qp-page, .dp-page) {
    background: var(--mori-surface-page);
    color: var(--mori-ink-base);
  }
  body.theme-nightline :is(.hp-desktop-header, .hp-mobile-header, .ap-header) {
    background: rgba(26, 26, 29, .94);
    border-color: var(--mori-accent-divider);
  }
  body.theme-nightline :is(.hp-desktop-nav a, .hp-mobile-header a, .hp-header-brand, .hp-about-link) { color: var(--mori-ink-base); }
  body.theme-nightline .hp-hero {
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
    padding: 0 16px;
    background: var(--mori-surface-page);
    border-bottom: 1px solid var(--mori-accent-divider);
  }
  body.theme-nightline .hp-hero::after {
    inset: 0 0 0 26%;
    opacity: .5;
    background-image: linear-gradient(var(--mori-accent-grid) 1px, transparent 1px), linear-gradient(90deg, var(--mori-accent-grid) 1px, transparent 1px);
    background-size: 28px 28px;
  }
  body.theme-nightline .hp-hero-copy {
    position: absolute;
    top: 50%;
    left: 16px;
    right: 16px;
    transform: translateY(-50%);
    width: auto;
  }
  body.theme-nightline .hp-hero-copy > p:first-child,
  body.theme-nightline .hp-section-heading > p,
  body.theme-nightline .hp-company-copy > p:first-child,
  body.theme-nightline .hp-licence-copy > p:first-child { color: var(--nightline-violet); }
  body.theme-nightline .hp-hero h1 { max-width: 520px; color: var(--mori-ink-strong); font-size: 36px; line-height: 1.12; }
  body.theme-nightline .hp-hero-description { max-width: 460px; color: var(--mori-ink-muted); }
  /* The source's mobile hero has no mascot: it is title block + a 330×97 product
     shot + carousel dots. The host only carries the 470×439 panda, so drop it at
     phone widths rather than let it inflate the hero 232px past the reference. */
  body.theme-nightline .hp-hero-panda { display: none; }
  body.theme-nightline .hp-cta { color: #101421; }
  body.theme-nightline :is(.hp-retail, .hp-latency, .hp-licence, .hp-office) {
    padding: 32px 16px;
    background: var(--mori-surface-page);
    border-color: var(--mori-accent-divider);
  }
  body.theme-nightline :is(.hp-section-heading, .hp-licence-copy, .hp-office > h2) { margin: 0; }
  body.theme-nightline :is(.hp-section-heading h2, .hp-company-copy h2, .hp-licence-copy h2, .hp-office > h2) { color: var(--mori-ink-strong); font-size: 28px; font-weight: 500; }
  body.theme-nightline .hp-section-description { color: var(--mori-ink-muted); }
  /* N6: the source's mobile solution module is a horizontal row of 297px cards, distinct
     from its single-column news list. Keep the row; let it scroll rather than wrapping. */
  body.theme-nightline .hp-service-grid {
    display: flex;
    flex-direction: row;
    gap: 16px;
    margin-top: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  body.theme-nightline .hp-service-grid .hp-service {
    flex: 0 0 297px;
    padding: 16px;
    background: var(--mori-surface-content);
    scroll-snap-align: start;
  }
  body.theme-nightline .hp-service:hover { background: var(--mori-surface-content); transform: none; }
  body.theme-nightline .hp-service h3 { color: var(--mori-ink-strong); margin-top: 16px; }
  body.theme-nightline .hp-service p { color: var(--mori-ink-muted); }
  body.theme-nightline .hp-latency-body { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 24px; }
  body.theme-nightline .hp-latency-copy article { border-color: var(--mori-accent-divider); }
  body.theme-nightline .hp-latency-copy h3 { color: var(--mori-ink-strong); }
  body.theme-nightline .hp-latency-copy p { color: var(--mori-ink-muted); }
  body.theme-nightline .hp-latency-chart { padding: 10px; border-color: var(--mori-accent-card-border); background: var(--mori-surface-content); }
  body.theme-nightline .hp-company {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    padding: 54px 16px;
    background: var(--mori-surface-content);
    border-color: var(--mori-accent-divider);
  }
  body.theme-nightline .hp-company-mark img { width: min(45%, 150px); }
  body.theme-nightline .hp-company-description { color: var(--mori-ink-muted); }
  body.theme-nightline .hp-licence { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  body.theme-nightline .hp-licence dl { margin-top: 22px; border-color: var(--mori-accent-divider); }
  body.theme-nightline .hp-licence dl > div { grid-template-columns: minmax(0, 1fr); gap: 5px; border-color: var(--mori-accent-divider); }
  body.theme-nightline .hp-licence dt { color: var(--mori-ink-base); }
  body.theme-nightline .hp-licence dd { color: var(--nightline-violet); }
  body.theme-nightline .hp-licence > img { width: min(100%, 280px); border-color: var(--mori-accent-card-border); }
  body.theme-nightline .hp-office { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body.theme-nightline .hp-office-map { grid-row: auto; }
  body.theme-nightline .hp-contact { grid-template-columns: minmax(0, 1fr); }
  body.theme-nightline .hp-address { grid-column: auto; }
  body.theme-nightline .hp-contact > div { border-color: var(--mori-accent-divider); }
  body.theme-nightline .hp-contact span { color: var(--mori-ink-muted); }
  body.theme-nightline .hp-contact a { color: var(--nightline-blue); }
  body.theme-nightline .hp-address address { color: var(--mori-ink-base); }
  body.theme-nightline .hp-footer { background: var(--mori-surface-footer); border-color: var(--mori-accent-divider); }
  body.theme-nightline .hp-footer-inner { padding: 32px 16px; }
  body.theme-nightline .hp-footer-columns { grid-template-columns: minmax(0, 1fr); gap: 0; }
  body.theme-nightline .hp-footer-column { padding: 16px 0; border-bottom: 1px solid var(--mori-accent-divider); }
  body.theme-nightline .hp-footer-column h2 { color: var(--mori-ink-strong); }
  body.theme-nightline .hp-footer-column p,
  body.theme-nightline .hp-footer-list a { color: var(--mori-ink-muted); }
  body.theme-nightline .hp-footer-brand { margin-top: 24px; border-color: var(--mori-accent-divider); }
  body.theme-nightline .hp-footer-brand img { filter: brightness(0) invert(1); }
  body.theme-nightline .hp-copyright { color: var(--mori-ink-faint); }
  body.theme-nightline .hp-back-to-top { border-color: var(--mori-accent-divider); color: var(--mori-ink-base); }
  body.theme-nightline .floating-directory,
  body.theme-nightline .floating-directory[open] nav,
  body.theme-nightline .support-launcher { border-color: var(--mori-accent-card-border); background: var(--mori-surface-content); color: var(--mori-ink-base); }
  body.theme-nightline .floating-directory a { color: var(--mori-ink-base); }
  body.theme-nightline :is(.ap-hero, .fp-hero, .sp-hero, .qp-hero, .dp-download) { background: var(--mori-surface-page); color: var(--mori-ink-base); }
  body.theme-nightline :is(.ap-product, .ap-technical section, .fp-feature, .sp-capability, .qp-service, .dp-download-column) {
    border-color: var(--mori-accent-card-border);
    background-color: var(--mori-surface-card);
    color: var(--mori-ink-base);
  }
  body.theme-nightline :is(.ap-page, .fp-page, .sp-page, .qp-page, .dp-page) :is(h1, h2, h3) { color: var(--mori-ink-strong); }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-nightline :is(.hp-desktop-nav a, .hp-mobile-header a, .hp-service, .hp-cta, .hp-icon-link img) {
    scroll-behavior: auto;
    transition: none;
    animation: none;
  }
}