:root {
  --ink: #f2ecea;
  --muted: #b1a4a6;
  --faint: #9c9296;
  --night: #151116;
  --night-soft: #1b151a;
  --line: rgba(231, 204, 201, .13);
  --rose: #d49a96;
  --rose-bright: #efbbb3;
  --lavender: #9b94c5;
  --gold: #c8a960;
  --brand-mark-a: #e4aea5;
  --brand-mark-b: #8d86bb;
  --nav-bg: rgba(21, 17, 22, .78);
  --nav-line: rgba(235, 210, 207, .1);
  --nav-muted: rgba(235, 221, 220, .55);
  --nav-active: rgba(221, 165, 157, .11);
  --button-line: rgba(221, 165, 157, .27);
  --button-hover-line: rgba(239, 187, 179, .58);
  --button-bg: rgba(216, 167, 161, .07);
  --footer-muted: #9a8f94;
  --footer-faint: #9c9296;
}

html, body { overflow-x: clip; }

body {
  background: var(--night);
  color: var(--ink);
}

body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  opacity: .07;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 170 170' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E");
}

:focus-visible {
  outline: 2px solid var(--rose-bright);
  outline-offset: 4px;
}

.hero {
  position: relative;
  min-height: min(920px, 100svh);
  isolation: isolate;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: #171217;
}

.hero-scenes,
.hero-scene,
.hero-scene img,
.hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-scene {
  margin: 0;
  opacity: 0;
  transform: scale(1.035);
  transition: opacity 1.1s ease, transform 6s ease;
}
.hero-scene.is-active { opacity: 1; transform: scale(1); }
.hero-scene img { object-fit: cover; object-position: center; filter: saturate(.72) brightness(.62) contrast(1.05); }
.hero-scene-morning img { object-position: 64% center; }
.hero-scene-night img { object-position: 68% center; }
.hero-scene-ready img { object-position: 68% center; }

.hero-shade {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(17, 13, 17, .94) 0%, rgba(17, 13, 17, .72) 42%, rgba(17, 13, 17, .18) 73%, rgba(17, 13, 17, .35) 100%),
    linear-gradient(to top, rgba(17, 13, 17, .74), transparent 38%);
}

.hero-content {
  position: relative;
  z-index: 2;
  width: min(var(--page-max), calc(100% - 48px));
  margin: 0 auto;
  padding: calc(var(--nav-height) + 150px) 0 100px;
}

.hero-badge { margin-bottom: 42px; --badge-text: #e9b3ab; }
.hero-kicker,
.eyebrow { margin: 0 0 18px; color: var(--rose-bright); font-size: .68rem; font-weight: 760; letter-spacing: .2em; }

.hero-statuses { min-height: clamp(150px, 18vw, 230px); display: grid; align-items: center; margin: 0; }
.hero-status {
  grid-area: 1 / 1;
  max-width: 860px;
  margin: 0;
  opacity: 0;
  transform: translateY(16px);
  font-family: var(--font-serif);
  font-size: clamp(3.5rem, 8.4vw, 8.1rem);
  font-weight: 490;
  line-height: 1.18;
  letter-spacing: 0;
  text-wrap: balance;
  transition: opacity 600ms ease, transform 600ms ease;
}
.hero-status.is-active { opacity: 1; transform: none; }

.hero-intro { max-width: 570px; margin: 32px 0 0; color: #c0b6b7; font-size: 1rem; line-height: 1.9; }
.hero-action { margin-top: 30px; background: rgba(215, 164, 157, .14); }

.hero-controls {
  position: absolute;
  z-index: 3;
  right: max(24px, calc((100vw - var(--page-max)) / 2));
  bottom: 38px;
  display: none;
  gap: 8px;
}
.hero.is-carousel-ready .hero-controls { display: flex; }
.hero-controls button {
  position: relative;
  min-width: 44px;
  min-height: 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  transition: width 240ms ease;
}
.hero-controls button::before {
  content: "";
  position: absolute;
  inset: 19px 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.25);
  transition: background 240ms ease;
}
.hero-controls button.is-active { width: 80px; }
.hero-controls button.is-active::before { background: var(--rose-bright); }
.hero-controls .carousel-toggle {
  width: 44px;
  border: 1px solid rgba(239, 187, 179, .24);
  background: rgba(21, 17, 22, .58);
}
.hero-controls .carousel-toggle::before { display: none; }
.hero-time { position: absolute; z-index: 3; left: max(24px, calc((100vw - var(--page-max)) / 2)); bottom: 35px; margin: 0; color: rgba(255,255,255,.62); font-size: .65rem; letter-spacing: .12em; }

.intro-band {
  width: min(var(--page-max), calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10%;
  padding: 90px 0;
  border-bottom: 1px solid var(--line);
}
.intro-band p { margin: 0; font-family: var(--font-serif); font-size: clamp(1.1rem, 1.8vw, 1.5rem); line-height: 1.6; }
.intro-band p:last-child { color: var(--muted); }

.section {
  width: min(var(--page-max), calc(100% - 48px));
  margin: 0 auto;
  padding: 110px 0;
  border-bottom: 1px solid var(--line);
}

.section-heading { max-width: 800px; }
.section-heading h2,
.memory-copy h2,
.creation-copy h2,
.waitlist h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(2.1rem, 3.6vw, 3.2rem);
  font-weight: 540;
  line-height: 1.25;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.section-heading > p:last-child,
.memory-copy > p,
.creation-copy > p,
.waitlist-copy > p:last-child {
  color: var(--muted);
  font-size: .98rem;
  line-height: 1.9;
}
.section-heading > p:last-child { max-width: 680px; margin: 26px 0 0; }

.cast-tabs {
  display: none;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 62px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.cast.is-carousel-ready .cast-tabs { display: grid; }
.cast-tabs button {
  min-width: 0;
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 4px 12px;
  padding: 22px;
  border: 0;
  border-right: 1px solid var(--line);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background 200ms ease;
}
.cast-tabs button:last-child { border-right: 0; }
.cast-tabs button:hover { background: rgba(255,255,255,.025); }
.cast-tabs button[aria-selected="true"] { background: rgba(222, 169, 163, .08); }
.cast-tabs span { grid-row: 1 / 3; color: var(--faint); font: .68rem/1.5 ui-monospace, monospace; }
.cast-tabs strong { font-size: .92rem; }
.cast-tabs small { color: var(--muted); font-size: .68rem; }

.cast-autoplay { display: none; justify-content: flex-end; margin-top: 14px; }
.cast.is-carousel-ready .cast-autoplay { display: flex; }
.carousel-toggle {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: rgba(255,255,255,.025);
  color: var(--muted);
  font-size: .7rem;
  font-weight: 700;
  cursor: pointer;
}
.carousel-toggle:hover { color: var(--ink); border-color: rgba(239, 187, 179, .34); }
.carousel-toggle:disabled { cursor: default; opacity: .62; }
.carousel-toggle-icon {
  width: 12px;
  height: 14px;
  flex: none;
  border-right: 3px solid currentColor;
  border-left: 3px solid currentColor;
}
.carousel-toggle[data-state="paused"] .carousel-toggle-icon {
  width: 0;
  height: 0;
  border: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 11px solid currentColor;
}

.cast-stage { margin-top: 34px; }
.cast.is-carousel-ready .cast-stage { display: grid; }
.cast.is-carousel-ready .cast-panel { grid-area: 1 / 1; }
.cast.is-carousel-ready .cast-panel[aria-hidden="true"] {
  visibility: hidden;
  pointer-events: none;
}
.cast-panel { display: grid; grid-template-columns: minmax(320px, .88fr) minmax(340px, 1.12fr); min-height: 650px; border: 1px solid var(--line); background: #191418; }
.cast-panel[hidden] { display: none; }
.cast-portrait { position: relative; height: 650px; overflow: hidden; background: #20191e; }
.cast-portrait::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20,15,19,.72), transparent 43%); }
.cast-portrait img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; filter: saturate(.88) contrast(1.03); }
.cast-portrait > span { position: absolute; z-index: 1; left: 20px; bottom: 18px; color: rgba(255,255,255,.52); font-size: .63rem; letter-spacing: .16em; }
.cast-portrait-linluo { background: #1e1719; }
.cast-portrait-liyinghua { background: #1e1c19; }
.cast-coming { display: grid; place-items: center; padding: 36px; box-sizing: border-box; background: radial-gradient(ellipse at 50% 35%, #35292d, #191619 75%); }
.cast-coming.cast-portrait-liyinghua { background: radial-gradient(ellipse at 50% 35%, #383025, #191818 75%); }
.cast-coming__note { position: relative; z-index: 1; text-align: center; border-top: 1px solid #786457; border-bottom: 1px solid #786457; padding: 44px 12px; width: 100%; color: #e9ded0; }
.cast-coming__note strong { display: block; font-family: var(--font-serif); font-size: clamp(2.4rem, 5vw, 4.2rem); font-weight: 500; margin: 20px 0; }
.cast-coming__note p { font-size: .82rem; letter-spacing: .2em; }
.cast-coming__note small { display: block; margin-top: 26px; color: #baa99b; line-height: 1.8; }

.cast-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(38px, 4.7vw, 60px); }
.badge-rose { --badge-text: #e5a29e; --badge-line: rgba(229,162,158,.27); }
.badge-gold { --badge-text: #cfb36e; --badge-line: rgba(207,179,110,.27); }
.cast-name { margin: 30px 0 0; font: 500 clamp(2rem, 4vw, 3.7rem)/1.15 var(--font-serif); }
.cast-name small { margin-left: 8px; color: var(--faint); font-family: var(--font-sans); font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cast-snippets { margin: 28px 0 16px; }
.snippet-toggles { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.snippet-toggle {
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--faint);
  font-size: .74rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 160ms var(--ease);
}
.snippet-toggle:hover { color: var(--ink); border-color: rgba(239, 187, 179, .34); }

/* 这九个是切换台词片段的按钮，实测只有 27px 高——手机上最难点的一组控件。
   触控设备下拉到 44px（和资料站同一条标准），桌面视觉保持原样。 */
@media (pointer: coarse), (max-width: 760px) {
  .snippet-toggle {
    min-height: 44px;
  }
}
.snippet-toggle.is-active {
  background: rgba(212, 154, 150, .14);
  border-color: var(--rose-bright);
  color: var(--rose-bright);
}
.cast-copy blockquote { margin: 12px 0 20px; padding: 0; border: 0; min-height: 80px; }
.cast-copy blockquote p { margin: 0 0 10px; font-family: var(--font-serif); font-size: clamp(1.15rem, 2vw, 1.65rem); line-height: 1.5; font-weight: 540; }
.cast-note { max-width: 530px; color: var(--muted); line-height: 1.85; }
.cast-keywords { margin: 22px 0 0; color: var(--rose-bright); font-size: .7rem; font-weight: 760; letter-spacing: .14em; }
.cast-keywords i { margin: 0 8px; color: var(--faint); font-style: normal; }

.relationship-line { max-width: 930px; margin: 34px auto 0; color: #9f9196; text-align: center; font-size: .72rem; line-height: 1.9; }
.relationship-line i { margin: 0 8px; color: var(--rose); font-style: normal; }
.relationship-line span { display: block; margin-top: 4px; color: var(--faint); }

.collaboration-demo,
.soul-timeline,
.presence-grid,
.spirit-grid { min-width: 0; margin-top: 62px; }

.demo-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 16px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.demo-meta p {
  min-width: 0;
  margin: 0;
  color: var(--faint);
  font-size: .68rem;
  line-height: 1.6;
  text-align: right;
}

.collaboration-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}
.collaboration-flow li {
  min-width: 0;
  min-height: 340px;
  display: flex;
  flex-direction: column;
  padding: 26px 22px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(160deg, rgba(30, 24, 28, 0.7), rgba(20, 15, 19, 0.85));
  backdrop-filter: blur(16px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  transition: all 220ms var(--ease);
}
.collaboration-flow li:hover {
  transform: translateY(-2px);
  border-color: rgba(239, 187, 179, 0.35);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45);
}
.flow-index,
.stage-index {
  color: var(--rose);
  font: .68rem/1.4 ui-monospace, "Cascadia Mono", monospace;
  letter-spacing: 0;
}
.collaboration-flow h3 {
  margin: 48px 0 16px;
  font-family: var(--font-serif);
  font-size: 1.32rem;
  font-weight: 580;
  line-height: 1.35;
}
.collaboration-flow p {
  flex: 1;
  margin: 0;
  color: var(--muted);
  font-size: .8rem;
  line-height: 1.85;
  overflow-wrap: break-word;
}
.collaboration-flow small {
  display: block;
  margin-top: 24px;
  color: var(--rose-bright);
  font-size: .67rem;
  line-height: 1.6;
}

.soul-timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 0;
  padding: 0;
  border: 0;
  list-style: none;
}
.soul-timeline li {
  position: relative;
  min-width: 0;
  padding: 24px 20px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(160deg, rgba(28, 22, 26, 0.6), rgba(18, 14, 17, 0.8));
  backdrop-filter: blur(16px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
  transition: all 220ms var(--ease);
}
.soul-timeline li:hover {
  transform: translateY(-2px);
  border-color: rgba(212, 154, 150, 0.35);
}
.soul-timeline li.is-current {
  background: linear-gradient(160deg, rgba(212, 154, 150, 0.15), rgba(28, 22, 26, 0.9));
  border-color: var(--rose-bright);
  box-shadow: 0 8px 30px rgba(212, 154, 150, 0.12), inset 0 2px 0 var(--rose-bright);
}
.stage-status {
  display: block;
  min-height: 3.2em;
  color: var(--faint);
  font-size: .66rem;
  font-weight: 720;
  line-height: 1.6;
  letter-spacing: 0;
  overflow-wrap: break-word;
}
.soul-timeline .is-current .stage-status { color: var(--rose-bright); }
.stage-index { display: block; margin-top: 32px; }
.soul-timeline h3 {
  margin: 16px 0 12px;
  font-family: var(--font-serif);
  font-size: 1.35rem;
  font-weight: 580;
  line-height: 1.35;
}
.soul-timeline p {
  margin: 0;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.82;
  overflow-wrap: break-word;
}

.presence-grid,
.spirit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  border: 0;
}
.presence-grid article,
.spirit-grid article {
  position: relative;
  min-width: 0;
  min-height: 300px;
  padding: 28px 24px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(150deg, rgba(30, 24, 28, 0.65), rgba(18, 14, 17, 0.85));
  backdrop-filter: blur(16px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  transition: all 220ms var(--ease);
}
.presence-grid article:hover,
.spirit-grid article:hover {
  transform: translateY(-2px);
  border-color: rgba(212, 154, 150, 0.35);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45);
}
.presence-grid article > span,
.spirit-grid article > span {
  color: var(--rose);
  font: .67rem/1.5 ui-monospace, "Cascadia Mono", monospace;
  letter-spacing: 0;
}
.presence-grid h3,
.spirit-grid h3 {
  margin: 22px 0 16px;
  font-family: var(--font-serif);
  font-size: 1.45rem;
  font-weight: 580;
  line-height: 1.3;
}
.presence-grid p,
.spirit-grid p {
  margin: 0;
  color: var(--muted);
  font-size: .79rem;
  line-height: 1.82;
  overflow-wrap: break-word;
}
.presence-grid article:nth-child(2) { background: rgba(155,148,197,.035); }
.presence-grid article:nth-child(3) { background: rgba(200,169,96,.025); }

.one-soul {
  display: grid;
  grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
  gap: 8%;
  align-items: center;
}
.one-soul-visual {
  position: relative;
  min-width: 0;
  aspect-ratio: 4 / 5;
  margin: 0;
  overflow: hidden;
  background: #20191e;
}
.one-soul-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
  filter: saturate(.7) contrast(1.04) brightness(.82);
}
.one-soul-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(21,17,22,.74), transparent 48%);
}
.one-soul-visual figcaption {
  position: absolute;
  z-index: 1;
  right: 20px;
  bottom: 18px;
  left: 20px;
  color: rgba(255,255,255,.62);
  font-size: .68rem;
  line-height: 1.6;
}
.one-soul-copy { min-width: 0; }
.one-soul-copy h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(2.1rem, 3.6vw, 3.2rem);
  font-weight: 540;
  line-height: 1.25;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.one-soul-copy > p:not(.eyebrow):not(.mandate-note) {
  margin: 27px 0 0;
  color: var(--muted);
  font-size: .98rem;
  line-height: 1.9;
}
.one-soul-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 34px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.one-soul-pair > div {
  min-width: 0;
  padding: 22px 22px 24px 0;
}
.one-soul-pair > div + div {
  padding-right: 0;
  padding-left: 22px;
  border-left: 1px solid var(--line);
}
.one-soul-pair span {
  color: var(--rose);
  font: .66rem/1.5 ui-monospace, "Cascadia Mono", monospace;
  letter-spacing: 0;
}
.one-soul-pair h3 {
  margin: 34px 0 11px;
  font-family: var(--font-serif);
  font-size: 1.12rem;
  font-weight: 580;
  line-height: 1.35;
}
.one-soul-pair p {
  margin: 0;
  color: var(--muted);
  font-size: .73rem;
  line-height: 1.72;
  overflow-wrap: break-word;
}
.mandate-note {
  margin: 28px 0 24px;
  padding: 17px 0 17px 20px;
  border-left: 2px solid var(--lavender);
  background: linear-gradient(90deg, rgba(155,148,197,.08), transparent 76%);
  color: #b9afb2;
  font-size: .78rem;
  line-height: 1.82;
}
.mandate-note strong { color: var(--ink); font-weight: 730; }

.spirit-grid article::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--spirit-accent);
}
.spirit-grid article > span { color: var(--spirit-accent); }
.spirit-assist {
  --spirit-accent: #aeb6dc;
  background: linear-gradient(180deg, rgba(174,182,220,.08), transparent 54%);
}
.spirit-desire {
  --spirit-accent: #db929f;
  background: linear-gradient(180deg, rgba(219,146,159,.08), transparent 54%);
}
.spirit-grace {
  --spirit-accent: #cfb56f;
  background: linear-gradient(180deg, rgba(207,181,111,.08), transparent 54%);
}

.memory,
.creation { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: center; }
.memory-copy > p, .creation-copy > p { margin: 27px 0 0; }
.memory-visual, .creation-visual { position: relative; margin: 0; min-height: 620px; overflow: hidden; }
.memory-visual img, .creation-visual img { width: 100%; height: 100%; min-height: 620px; object-fit: cover; filter: saturate(.74) contrast(1.04); }
.memory-visual img { object-position: 58% center; }
.memory-visual::after, .creation-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(21,17,22,.68), transparent 46%); }
.memory-visual figcaption, .creation-visual figcaption { position: absolute; z-index: 1; right: 20px; bottom: 18px; left: 20px; color: rgba(255,255,255,.58); font-size: .68rem; line-height: 1.6; }
.creation-visual { order: -1; }
.creation-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }

.boundary { padding-bottom: 148px; }
.boundary-intro {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(460px, 1.1fr);
  gap: 8%;
  align-items: end;
}
.boundary-intro .section-heading h2 { font-size: clamp(2.55rem, 4.2vw, 4.2rem); }
.boundary-visual {
  position: relative;
  margin: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 4px;
  background: #171217;
}
.boundary-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.78) contrast(1.04);
}
.boundary-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(21,17,22,.62), transparent 38%);
  pointer-events: none;
}
.boundary-visual figcaption {
  position: absolute;
  z-index: 1;
  right: 20px;
  bottom: 17px;
  left: 20px;
  color: rgba(255,255,255,.7);
  font-size: .68rem;
  line-height: 1.6;
}
.boundary-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 62px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.boundary-grid article { min-height: 280px; padding: 26px; border-right: 1px solid var(--line); }
.boundary-grid article:last-child { border-right: 0; }
.boundary-grid span { color: var(--rose); font: .67rem/1 ui-monospace, monospace; }
.boundary-grid h3 { margin: 74px 0 14px; font-size: 1rem; }
.boundary-grid p { margin: 0; color: var(--muted); font-size: .77rem; line-height: 1.75; }

.waitlist {
  position: relative;
  padding: 136px max(24px, calc((100vw - var(--page-max)) / 2));
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(105deg, rgba(21,17,22,.9) 0%, rgba(30,22,27,.78) 52%, rgba(24,18,23,.9) 100%),
    url("/assets/aielim/waitlist/waitlist-letter-ready-v1.webp") center/cover;
}
.waitlist::before { content: ""; position: absolute; inset: 0; opacity: .16; background: radial-gradient(circle at 20% 30%, var(--rose), transparent 36%); }
.waitlist-inner { position: relative; display: grid; grid-template-columns: 1fr .82fr; gap: 9%; align-items: center; }
.waitlist-copy .badge { margin-bottom: 32px; }
.waitlist-copy > p:last-child { max-width: 560px; margin: 28px 0 0; }

.waitlist-form { padding: 32px; border: 1px solid rgba(232,196,192,.17); background: rgba(21,16,20,.66); backdrop-filter: blur(18px); }
.waitlist-form label { display: block; margin-bottom: 12px; color: #cabfc0; font-size: .72rem; font-weight: 700; letter-spacing: .08em; }
.waitlist-form [hidden] { display: none; }
.waitlist-field { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.waitlist-field input { min-width: 0; height: 50px; padding: 0 15px; border: 1px solid rgba(234,211,209,.18); border-radius: 3px; outline: 0; background: rgba(255,255,255,.045); color: var(--ink); }
.waitlist-field input::placeholder { color: #9a8f94; }
.waitlist-field input:focus { border-color: var(--rose-bright); box-shadow: 0 0 0 3px rgba(239,187,179,.09); }
.waitlist-field button { min-width: 112px; height: 50px; padding: 0 18px; border: 1px solid var(--rose-bright); border-radius: 3px; background: var(--rose-bright); color: #21171a; font-weight: 760; cursor: pointer; }
.waitlist-field button:disabled { cursor: wait; opacity: .58; }
.waitlist-nojs, .waitlist-note, .waitlist-message { margin: 13px 0 0; color: #a1979c; font-size: .68rem; line-height: 1.55; }
.waitlist-nojs { color: var(--faint); }
.waitlist-message { min-height: 1.2em; color: #e5b0aa; }
.waitlist-form.is-success .waitlist-message { color: #b8cda6; }

@media (max-width: 940px) {
  .cast-panel { grid-template-columns: 1fr 1fr; }
  .cast-copy { padding: 38px; }
  .collaboration-flow,
  .soul-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collaboration-flow li,
  .soul-timeline li { min-height: 310px; }
  .collaboration-flow li:nth-child(2),
  .soul-timeline li:nth-child(2) { border-right: 0; }
  .collaboration-flow li:nth-child(-n+2),
  .soul-timeline li:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .collaboration-flow h3 { margin-top: 54px; }
  .stage-index { margin-top: 24px; }
  .presence-grid,
  .spirit-grid { grid-template-columns: 1fr; }
  .presence-grid article,
  .spirit-grid article {
    min-height: 190px;
    display: grid;
    grid-template-columns: minmax(130px, .34fr) minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    gap: 12px 38px;
    padding: 27px 26px 29px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .presence-grid article:last-child,
  .spirit-grid article:last-child { border-bottom: 0; }
  .presence-grid article > span,
  .spirit-grid article > span { grid-column: 1; grid-row: 1; }
  .presence-grid h3,
  .spirit-grid h3 { grid-column: 1; grid-row: 2; align-self: end; margin: 0; }
  .presence-grid p,
  .spirit-grid p { grid-column: 2; grid-row: 1 / 3; align-self: center; }
  .one-soul { grid-template-columns: 1fr; gap: 58px; }
  .one-soul-visual,
  .one-soul-visual img {
    min-height: 0;
    aspect-ratio: 4 / 3;
  }
  .boundary-intro { grid-template-columns: 1fr; gap: 48px; }
  .boundary-grid { grid-template-columns: 1fr 1fr; }
  .boundary-grid article:nth-child(2) { border-right: 0; }
  .boundary-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .waitlist-inner { grid-template-columns: 1fr; }
  .waitlist-form { margin-top: 34px; }
}

@media (max-width: 720px) {
  .hero { min-height: min(800px, calc(100svh - 64px)); }
  .hero-content, .intro-band, .section { width: min(100% - 32px, var(--page-max)); }
  .hero-content { padding: calc(var(--nav-height) + 96px) 0 92px; }
  .hero-shade { background: linear-gradient(to top, rgba(17,13,17,.94) 0%, rgba(17,13,17,.5) 62%, rgba(17,13,17,.28) 100%); }
  .hero-scene-morning img { object-position: 70% center; }
  .hero-scene-night img { object-position: 76% center; }
  .hero-scene-ready img { object-position: 76% center; }
  .hero-statuses { height: 205px; min-height: 205px; }
  .hero-status { font-size: clamp(2.25rem, 10.5vw, 3.3rem); text-wrap: balance; }
  .hero-intro br { display: none; }
  .hero-controls { right: 16px; bottom: 20px; }
  .hero-time { left: 16px; bottom: 84px; }
  .intro-band { grid-template-columns: 1fr; gap: 22px; padding-block: 72px; }
  .intro-band { padding-top: 28px; }
  .reveal-ready .intro-band [data-reveal] { opacity: 1; transform: none; }
  .section { padding: 94px 0; }
  .section-heading h2, .memory-copy h2, .creation-copy h2, .one-soul-copy h2, .waitlist h2 { font-size: clamp(1.9rem, 8.2vw, 2.8rem); text-wrap: balance; }
  .cast-tabs button { grid-template-columns: 1fr; padding: 16px 12px; }
  .cast-tabs span { display: none; }
  .cast-tabs strong { font-size: .8rem; }
  .cast-tabs small { font-size: .61rem; }
  .cast-panel { grid-template-columns: 1fr; min-height: 0; }
  .cast-portrait { height: auto; min-height: 0; aspect-ratio: 4 / 5; }
  .cast-portrait img { min-height: 0; }
  .cast-copy { padding: 34px 24px 46px; }
  .collaboration-demo,
  .soul-timeline,
  .presence-grid,
  .spirit-grid { margin-top: 44px; }
  .demo-meta { align-items: flex-start; flex-direction: column; gap: 12px; }
  .demo-meta p { text-align: left; }
  .collaboration-flow,
  .soul-timeline { grid-template-columns: 1fr; }
  .collaboration-flow li,
  .soul-timeline li {
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .collaboration-flow li:last-child,
  .soul-timeline li:last-child { border-bottom: 0; }
  .collaboration-flow h3 { margin-top: 34px; }
  .collaboration-flow p { flex: none; }
  .collaboration-flow small { margin-top: 28px; }
  .stage-status { min-height: 0; }
  .stage-index { margin-top: 24px; }
  .presence-grid article,
  .spirit-grid article {
    min-height: 0;
    display: block;
    padding: 28px 24px 32px;
  }
  .presence-grid h3,
  .spirit-grid h3 { margin: 42px 0 14px; }
  .one-soul { gap: 44px; }
  .one-soul-visual,
  .one-soul-visual img { aspect-ratio: 4 / 3; }
  .one-soul-pair { grid-template-columns: 1fr; }
  .one-soul-pair > div { padding: 22px 0 24px; }
  .one-soul-pair > div + div {
    padding: 24px 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }
  .one-soul-pair h3 { margin-top: 26px; }
  .mandate-note { padding-left: 16px; }
  .memory, .creation { grid-template-columns: 1fr; gap: 44px; }
  .memory-visual, .memory-visual img, .creation-visual, .creation-visual img { min-height: 470px; }
  .creation-visual { order: 0; }
  .boundary-grid { grid-template-columns: 1fr; }
  .boundary-grid article { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--line); }
  .boundary-grid article:nth-child(3) { border-bottom: 1px solid var(--line); }
  .boundary-grid article:last-child { border-bottom: 0; }
  .boundary-grid h3 { margin-top: 52px; }
  .waitlist { padding: 100px 16px; }
  .waitlist-field { grid-template-columns: 1fr; }
  .waitlist-field button { width: 100%; }
}

@media (min-width: 721px) and (max-height: 760px) {
  .hero { min-height: 660px; }
  .hero-content { padding: calc(var(--nav-height) + 34px) 0 68px; }
  .hero-badge { margin-bottom: 16px; }
  .hero-statuses { min-height: 170px; }
  .hero-status { font-size: 4.6rem; }
  .hero-intro { margin-top: 14px; font-size: .9rem; line-height: 1.55; }
  .hero-action { margin-top: 16px; }
  .hero-controls { bottom: 16px; }
  .hero-time { bottom: 20px; }
  .intro-band { padding-top: 28px; }
  .reveal-ready .intro-band [data-reveal] { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-scene, .hero-status { transition: none; transform: none; }
  :focus-visible { scroll-behavior: auto; }
}

/* ============================================================
   可读性基线（2026-08-28）
   同 creor：把信息型小字（同伴状态、关系说明、图注、候补表单标签与
   回执提示）提到 12.5px 以上。候补表单尤其关键——标签与回执是读者
   必须读懂的操作反馈，不能停留在 11.5px。
   装饰性 eyebrow / hero-kicker 保持原尺寸。
   ============================================================ */
.cast-tabs small,
.cast-name small,
.relationship-line,
.memory-visual figcaption,
.creation-visual figcaption,
.waitlist-form label,
.waitlist-nojs,
.waitlist-note,
.waitlist-message {
  font-size: max(0.79rem, 12.6px);
  line-height: 1.65;
}

.memory-visual figcaption,
.creation-visual figcaption {
  color: rgba(255, 255, 255, 0.78);
}

@media (max-width: 720px) {
  .cast-tabs small { font-size: max(0.76rem, 12.2px); }
}

/* ============================================================
   形态小图形（2026-09-10）
   「存在三态」与「灵格三原色」六张卡此前上半整块空白（h3 顶距 102px），
   读起来像没填完。补一个纯 CSS 的示意图形：悬浮球=发光的点、桌宠=停在
   桌沿的小身影、完整 Hub=铺开的面板格；灵格卡=各自颜色的一团光。
   只在三列并排时显示；≤940px 卡片改成左右两栏的信息布局，图形让位。
   ============================================================ */
.presence-glyph,
.spirit-glyph {
  position: relative;
  display: block;
  width: 64px;
  height: 56px;
  margin: 26px 0 0;
}
.presence-glyph::before,
.presence-glyph::after,
.spirit-glyph::before,
.spirit-glyph::after {
  content: "";
  position: absolute;
}
/* 01 悬浮球 */
.presence-glyph--light::before {
  left: 20px;
  top: 16px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 34%, #fff 0, var(--rose-bright) 38%, rgba(212, 154, 150, .35) 72%, transparent 100%);
  box-shadow: 0 0 22px rgba(239, 187, 179, .55), 0 0 2px rgba(255, 255, 255, .6);
}
.presence-glyph--light::after {
  left: 8px;
  top: 4px;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(239, 187, 179, .28);
  border-radius: 50%;
}
/* 02 桌宠：桌沿一条线 + 停在边上的小身影 */
.presence-glyph--near::before {
  left: 0;
  right: 0;
  bottom: 12px;
  height: 1px;
  background: linear-gradient(90deg, rgba(239, 187, 179, .55), rgba(239, 187, 179, .08));
}
.presence-glyph--near::after {
  left: 10px;
  bottom: 13px;
  width: 20px;
  height: 26px;
  border-radius: 10px 10px 5px 5px;
  background: linear-gradient(180deg, var(--rose-bright), var(--rose));
  box-shadow: 0 6px 16px rgba(212, 154, 150, .25);
}
/* 03 完整 Hub：3×2 面板格 */
.presence-glyph--full::before {
  left: 6px;
  top: 12px;
  width: 14px;
  height: 12px;
  border-radius: 2px;
  background: var(--rose);
  box-shadow:
    18px 0 0 rgba(212, 154, 150, .55),
    36px 0 0 rgba(212, 154, 150, .35),
    0 18px 0 rgba(212, 154, 150, .55),
    18px 18px 0 rgba(212, 154, 150, .35),
    36px 18px 0 rgba(212, 154, 150, .22);
}
/* 灵格三原色：各自颜色的一团光 + 一圈淡环 */
.spirit-glyph::before {
  inset: 10px 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 36%, color-mix(in srgb, var(--spirit-accent) 55%, #fff) 0, var(--spirit-accent) 42%, transparent 74%);
  opacity: .92;
}
.spirit-glyph::after {
  inset: 2px 6px;
  border: 1px solid var(--spirit-accent);
  border-radius: 50%;
  opacity: .3;
}
@media (max-width: 940px) {
  .presence-glyph,
  .spirit-glyph { display: none; }
}