/* 00-local-fonts.css */
/* QianX local Latin font subset.
   Chinese glyphs intentionally use native platform fonts to avoid multi-megabyte
   webfont payloads and unreliable Google Fonts access on mainland networks. */
@font-face {
  font-family: "DM Serif Display";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("DM Serif Display"), url("../assets/fonts/dm-serif-display-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: local("Inter Variable"), local("Inter"), url("../assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: local("JetBrains Mono Variable"), local("JetBrains Mono"), url("../assets/fonts/jetbrains-mono-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* 01-foundation.css */
:root {
  --rpx: calc(min(100vw, 430px) / 750);
  --space-graphite: #2b2d30;
  --space-graphite-deep: #111214;
  --space-graphite-mid: #55595f;
  --space-graphite-soft: #a7a39c;
  --cloud-white: #f0eee9;
  --accent-orange: #c96a2b;
  --brand-cream: var(--cloud-white);
  --brand-blue: var(--space-graphite);
  --brand-blue-deep: var(--space-graphite-deep);
  --brand-blue-mid: var(--space-graphite-mid);
  --brand-blue-soft: var(--space-graphite-soft);
  --abyss-blue: var(--space-graphite);
  --abyss-blue-deep: var(--space-graphite-deep);
  --abyss-blue-mid: var(--space-graphite-mid);
  --abyss-blue-soft: var(--space-graphite-soft);
  --milk-white: var(--cloud-white);
  --milk-warm: #f7f6f3;
  --ink: #1d1f22;
  --fog: rgba(240, 238, 233, 0.72);
  --line-blue: rgba(240, 238, 233, 0.18);
  --line-cream: rgba(43, 45, 48, 0.16);
  --glass-blue: rgba(43, 45, 48, 0.12);
  --bg: var(--abyss-blue);
  --orange: var(--accent-orange);
  --green: var(--abyss-blue-soft);
  --text: var(--milk-white);
  --muted: rgba(29, 31, 34, 0.62);
  --soft: rgba(29, 31, 34, 0.76);
  --font-cn-display: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, serif;
  --font-cn-body: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Hiragino Sans GB", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-en-display: Syne, "Avenir Next", "SF Pro Display", Inter, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, monospace;
  --tabbar-reserved-height: calc(88 * var(--rpx) + max(calc(10 * var(--rpx)), env(safe-area-inset-bottom)));
  --council-composer-reserved-height: calc(102 * var(--rpx));
}

/* 2026-05 visual preview: quiet editorial operating system.
   Intent: system fonts, paper surface, graphite text, copper actions, no decorative type. */
:root {
  --visual-paper: #f6f3ec;
  --visual-paper-strong: #fffdf8;
  --visual-paper-soft: #ede8dd;
  --visual-ink: #1c1d1f;
  --visual-ink-soft: rgba(28, 29, 31, 0.66);
  --visual-line: rgba(28, 29, 31, 0.12);
  --visual-line-strong: rgba(28, 29, 31, 0.2);
  --visual-copper: #bd6427;
  --visual-copper-deep: #9f4f1d;
  --visual-graphite: #2a2c2f;
  --cloud-white: var(--visual-paper);
  --milk-white: var(--visual-paper);
  --milk-warm: var(--visual-paper-strong);
  --ink: var(--visual-ink);
  --space-graphite: var(--visual-graphite);
  --space-graphite-deep: #121315;
  --space-graphite-mid: #5d6166;
  --accent-orange: var(--visual-copper);
  --orange: var(--visual-copper);
  --font-cn-display: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-cn-body: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-en-display: -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, Arial, sans-serif;
  --font-mono: -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, Arial, sans-serif;
}

html,
body,
button,
input,
textarea {
  font-family: var(--font-cn-body);
  letter-spacing: 0;
}

body,
.app-shell {
  color: var(--visual-ink);
  background:
    linear-gradient(rgba(28, 29, 31, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(28, 29, 31, 0.035) 1px, transparent 1px),
    var(--visual-paper);
  background-size: 42px 42px, 42px 42px, auto;
}

.page,
.page::after,
.page-scenes::before,
.page-scenes::after,
.ritual-hero::before,
.ritual-hero::after,
.ritual-entry-grid::before,
.ritual-entry-grid::after {
  background-image: none;
  backdrop-filter: none;
}

.page {
  background: transparent;
}

.desktop-intro h1,
.h1,
.h2,
.scene-title,
.daily-title,
.asset-card-title,
.retention-title,
.timeline-title,
.plan-title,
.benefit-title,
.member-title,
.ritual-entry-card b,
.mode-switch-button b,
.wow-path-step b {
  color: var(--visual-ink);
  font-family: var(--font-cn-body);
  letter-spacing: 0;
  font-weight: 760;
}

.h1 {
  font-size: clamp(34px, calc(54 * var(--rpx)), 42px);
  line-height: 1.12;
}

.h2 {
  font-size: clamp(22px, calc(34 * var(--rpx)), 28px);
  line-height: 1.18;
}

.p,
.hero-copy,
.scene-subtitle,
.daily-copy,
.retention-text,
.timeline-text,
.plan-text,
.benefit-copy,
.wow-path-step em,
.wow-path-proof,
.mode-switch-button span,
.ritual-entry-card em {
  color: var(--visual-ink-soft);
  font-family: var(--font-cn-body);
  letter-spacing: 0;
}

.eyebrow,
.daily-kicker,
.section-kicker,
.ritual-mark,
.ritual-topline,
.wow-path-step span {
  color: var(--visual-copper);
  font-family: var(--font-cn-body);
  letter-spacing: 0;
  font-weight: 760;
  text-transform: none;
}

.phone-shell {
  background: var(--visual-paper);
}

/* 桌面端已改为全宽内容站布局（去手机壳），主体样式见 12-silicon-os.css 的桌面块。 */

.hero-card,
.panel-card,
.scene-card,
.feed-card,
.benefit-card,
.metric-card,
.timeline-card,
.plan-card,
.profile-card,
.topic-card,
.ritual-hero,
.scan-intent-panel,
.wow-path-card,
.mode-switch-button,
.ritual-entry-grid,
.group-room-card,
.process-card,
.council-decision-card,
.council-verdict-actions,
.login-only-card,
.my-home-card,
.price-card,
.wecom-card,
.membership-active-card,
.membership-asset-preview-card,
.renewal-card,
.action-card-lab,
.journey-card,
.invite-growth-card,
.invite-card,
.pending-payment-card,
.delivery-progress-card,
.next-step-card,
.asset-auto-card,
.asset-module-card,
.radar-card,
.consensus-hero,
.consensus-card,
.thought-action-panel {
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.82);
  box-shadow: 0 12px 28px rgba(28, 29, 31, 0.08);
  backdrop-filter: none;
}

.page-scenes {
  display: block;
  overflow-y: auto;
  padding: calc(28 * var(--rpx)) calc(28 * var(--rpx)) calc(var(--tabbar-reserved-height) + calc(28 * var(--rpx)));
}

.ritual-stage,
.page-scenes .ritual-stage {
  width: 100%;
  max-width: 100%;
  min-height: auto;
}

.ritual-hero,
.page-scenes .ritual-hero {
  width: 100%;
  max-width: 100%;
  padding: calc(34 * var(--rpx)) calc(28 * var(--rpx));
  overflow: visible;
}

.ritual-topline {
  margin-bottom: calc(18 * var(--rpx));
  font-size: calc(18 * var(--rpx));
}

.ritual-hero .hero-copy,
.page-scenes .ritual-hero .hero-copy {
  max-width: 100%;
  font-size: calc(25 * var(--rpx));
  line-height: 1.62;
}

.hero-copy-stack {
  gap: calc(2 * var(--rpx));
}

.video-intro-button,
.primary-button,
.secondary-button,
.text-button,
.member-button,
.compact-button,
.send-button,
.hot-topic-refresh,
.moments-primary,
.moments-secondary {
  border-radius: 8px;
  box-shadow: none;
  letter-spacing: 0;
}

.primary-button,
.hero-primary-cta,
.send-button,
.moments-primary {
  background: var(--visual-copper);
  color: #fffdf8;
}

.primary-button:active,
.hero-primary-cta:active,
.send-button:active {
  background: var(--visual-copper-deep);
}

.secondary-button,
.text-button,
.moments-secondary,
.hot-topic-refresh {
  border: 1px solid var(--visual-line);
  background: rgba(255, 253, 248, 0.62);
  color: var(--visual-ink);
}

.video-intro-button {
  min-height: calc(66 * var(--rpx));
  padding: 0 calc(22 * var(--rpx));
  border-color: var(--visual-line-strong);
  background: var(--visual-graphite);
  color: var(--visual-paper-strong);
}

.video-intro-button span {
  background: rgba(255, 253, 248, 0.1);
  color: var(--visual-paper-strong);
}

.scan-intent-panel {
  margin-top: calc(26 * var(--rpx));
  padding: calc(20 * var(--rpx));
}

.scan-intent-input,
.input,
.comment-input,
.moments-textarea {
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.72);
  color: var(--visual-ink);
  box-shadow: none;
}

.scan-intent-input:focus,
.input:focus,
.comment-input:focus,
.moments-textarea:focus {
  border-color: rgba(189, 100, 39, 0.55);
  box-shadow: 0 0 0 3px rgba(189, 100, 39, 0.12);
}

.wow-path-card {
  margin-top: calc(18 * var(--rpx));
  padding: calc(20 * var(--rpx));
}

.wow-path-step {
  grid-template-columns: calc(64 * var(--rpx)) minmax(0, 1fr);
  border-bottom-color: var(--visual-line);
}

.wow-path-proof {
  border: 1px solid rgba(189, 100, 39, 0.16);
  border-radius: 8px;
  background: rgba(189, 100, 39, 0.08);
}

.experience-path-map {
  display: block;
  width: 100%;
  height: auto;
  margin-top: calc(10 * var(--rpx));
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: var(--visual-paper-strong);
}

.wow-path-mini {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: calc(8 * var(--rpx));
  margin-top: calc(12 * var(--rpx));
}

.wow-path-mini .wow-path-step {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(3 * var(--rpx));
  padding: calc(10 * var(--rpx));
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.7);
}

.wow-path-mini .wow-path-step span,
.wow-path-mini .wow-path-step b {
  text-align: center;
}

.wow-path-mini .wow-path-step b {
  font-size: calc(18 * var(--rpx));
}

.mode-switch-grid,
.ritual-entry-grid,
.page-scenes .ritual-entry-grid {
  width: 100%;
  max-width: 100%;
  gap: calc(10 * var(--rpx));
  border: 0;
  background: transparent;
  overflow: visible;
}

.mode-switch-button,
.ritual-entry-card {
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.7);
}

.ritual-entry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ritual-entry-card {
  min-height: calc(134 * var(--rpx));
  padding: calc(18 * var(--rpx));
}

.tabbar {
  left: calc(16 * var(--rpx));
  right: calc(16 * var(--rpx));
  bottom: max(calc(12 * var(--rpx)), env(safe-area-inset-bottom));
  width: auto;
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.92);
  box-shadow: 0 14px 32px rgba(28, 29, 31, 0.14);
  backdrop-filter: blur(14px);
}

.tab {
  border-radius: 6px;
  color: rgba(28, 29, 31, 0.55);
  letter-spacing: 0;
}

.tab.active {
  background: var(--visual-ink);
  color: var(--visual-paper-strong);
}

.page-feed {
  background: #f3f0e8;
}

.moments-cover,
.hot-topic-panel,
.moments-post {
  border-radius: 8px;
}

.moments-cover {
  background: var(--visual-graphite);
}

.moments-post,
.hot-topic-panel,
.moments-ai-state {
  border: 1px solid var(--visual-line);
  background: rgba(255, 253, 248, 0.9);
  box-shadow: none;
}

.perspective-button {
  border-radius: 8px;
  color: var(--visual-copper);
  letter-spacing: 0;
}

.council-page,
.page-membership,
.page-assets,
.page-plan,
.page-social {
  background: transparent;
}

.bubble {
  border-radius: 8px;
  box-shadow: none;
  letter-spacing: 0;
}

.bubble.user {
  background: var(--visual-graphite);
  color: var(--visual-paper-strong);
}

.bubble.person {
  background: rgba(255, 253, 248, 0.8);
  color: var(--visual-ink);
}

.council-decision-card,
.membership-asset-preview-card,
.price-card {
  border-color: rgba(189, 100, 39, 0.2);
  background: rgba(255, 253, 248, 0.9);
}

@media (max-width: 420px) {
  .page-scenes {
    padding-inline: 16px;
  }

  .ritual-hero,
  .page-scenes .ritual-hero {
    padding: 22px 18px;
  }

  .mode-switch-grid,
  .ritual-entry-grid {
    grid-template-columns: 1fr;
  }

  .h1 {
    font-size: 36px;
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
  margin: 0;
  touch-action: pan-y;
}

body {
  background:
    radial-gradient(circle at 50% 18%, rgba(240, 238, 233, 0.14), transparent 14%),
    radial-gradient(circle at 86% 10%, rgba(240, 238, 233, 0.12), transparent 28%),
    linear-gradient(rgba(240, 238, 233, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240, 238, 233, 0.035) 1px, transparent 1px),
    var(--bg);
  background-size: auto, auto, calc(92 * var(--rpx)) calc(92 * var(--rpx)), calc(92 * var(--rpx)) calc(92 * var(--rpx)), auto;
  color: var(--text);
  font-family: var(--font-cn-body);
  -webkit-font-smoothing: antialiased;
}

button,
input,
textarea {
  font: inherit;
}

button {
  padding: 0;
  margin: 0;
  border: 0;
  line-height: 1.2;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

input,
textarea {
  outline: none;
}

.site {
  min-height: 100vh;
  display: grid;
  place-items: stretch center;
}

/* 桌面端页脚：移动端隐藏（App 内会员页已有合规页脚），≥900px 由 12-silicon-os.css 显示 */
.site-footer {
  display: none;
}

.phone-shell {
  width: 100%;
  min-width: 0;
  max-width: 100vw;
  min-height: 100dvh;
}

.app-shell {
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: 100vw;
  min-height: 100dvh;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 50% 10%, rgba(240, 238, 233, 0.16), transparent 18%),
    radial-gradient(circle at 16% 80%, rgba(240, 238, 233, 0.1), transparent 26%),
    linear-gradient(rgba(240, 238, 233, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240, 238, 233, 0.035) 1px, transparent 1px),
    var(--bg);
  background-size: auto, auto, calc(72 * var(--rpx)) calc(72 * var(--rpx)), calc(72 * var(--rpx)) calc(72 * var(--rpx)), auto;
}

.page {
  position: relative;
  min-height: 100vh;
  padding: calc(28 * var(--rpx)) calc(28 * var(--rpx)) calc(160 * var(--rpx));
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(17, 18, 20, 0.08), rgba(17, 18, 20, 0.22));
}

.page.no-tab {
  padding-bottom: calc(56 * var(--rpx));
}

.page::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
}

.page::after {
  z-index: -1;
  background:
    radial-gradient(circle at 50% 18%, rgba(240, 238, 233, 0.11), transparent 34%),
    linear-gradient(180deg, rgba(17, 18, 20, 0.05) 0%, rgba(17, 18, 20, 0.2) 100%);
  backdrop-filter: blur(calc(0.4 * var(--rpx)));
}

.page > * {
  position: relative;
  z-index: 1;
}

.hero-card,
.panel-card,
.scene-card,
.feed-card,
.benefit-card,
.metric-card,
.timeline-card,
.plan-card,
.profile-card,
.topic-card {
  position: relative;
  overflow: hidden;
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.11);
  border-radius: calc(32 * var(--rpx));
  background:
    radial-gradient(circle at 88% 8%, rgba(167, 163, 156, 0.16), transparent 30%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.88), rgba(26, 26, 24, 0.82));
  box-shadow: 0 calc(24 * var(--rpx)) calc(48 * var(--rpx)) rgba(0, 0, 0, 0.26);
  backdrop-filter: blur(calc(18 * var(--rpx))) saturate(1.08);
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.hero-card {
  padding: calc(40 * var(--rpx));
}

.art-card,
.feed-art {
  background:
    radial-gradient(circle at 16% 24%, rgba(43, 45, 48, 0.18), transparent 32%),
    radial-gradient(circle at 84% 18%, rgba(167, 163, 156, 0.22), transparent 30%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.86), rgba(26, 26, 24, 0.8));
}

.feed-art {
  background:
    radial-gradient(circle at 16% 24%, rgba(43, 45, 48, 0.18), transparent 32%),
    radial-gradient(circle at 82% 18%, rgba(167, 163, 156, 0.24), transparent 30%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.96), rgba(26, 26, 24, 0.92));
}

.action-art {
  background:
    radial-gradient(circle at 84% 16%, rgba(43, 45, 48, 0.2), transparent 30%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.96), rgba(26, 26, 24, 0.92));
}

.asset-art {
  background:
    radial-gradient(circle at 84% 16%, rgba(167, 163, 156, 0.24), transparent 30%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.96), rgba(26, 26, 24, 0.92));
}

.eyebrow {
  margin-bottom: calc(16 * var(--rpx));
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  letter-spacing: calc(4 * var(--rpx));
  font-weight: 800;
  font-family: var(--font-mono);
}

.h1 {
  color: #ffffff;
  font-size: calc(54 * var(--rpx));
  line-height: 1.12;
  font-weight: 900;
  font-family: var(--font-cn-display);
  letter-spacing: 0.03em;
}

.h2 {
  color: #ffffff;
  font-size: calc(36 * var(--rpx));
  font-weight: 900;
  font-family: var(--font-cn-display);
  letter-spacing: 0.02em;
}

.p {
  color: rgba(240, 238, 233, 0.68);
  font-size: calc(26 * var(--rpx));
  line-height: 1.7;
}

.hero-copy {
  margin-top: calc(20 * var(--rpx));
}

.hero-copy-stack {
  display: grid;
  gap: calc(4 * var(--rpx));
}

.landing-lead-stack {
  display: grid;
  gap: calc(4 * var(--rpx));
}

.hero-copy-stack span,
.landing-lead-stack span {
  display: block;
}

.hero-action {
  width: 100%;
  margin-top: calc(28 * var(--rpx));
}

.scan-intent-panel {
  margin-top: calc(24 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(28, 29, 31, 0.12);
  border-radius: calc(18 * var(--rpx));
  background: rgba(255, 253, 248, 0.86);
  box-shadow: 0 calc(12 * var(--rpx)) calc(30 * var(--rpx)) rgba(87, 72, 55, 0.1);
}

.scan-intent-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(12 * var(--rpx));
  margin-bottom: calc(12 * var(--rpx));
}

.scan-intent-panel label {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  margin: 0;
  color: var(--ink);
  font-size: calc(22 * var(--rpx));
  font-weight: 950;
}

.scan-intent-header span {
  flex: 0 0 auto;
  padding: calc(5 * var(--rpx)) calc(9 * var(--rpx));
  border: 1px solid rgba(189, 100, 39, 0.2);
  border-radius: 999px;
  background: rgba(189, 100, 39, 0.08);
  color: var(--visual-copper);
  font-size: calc(16 * var(--rpx));
  font-weight: 760;
}

.scan-intent-input {
  width: 100%;
  min-height: calc(102 * var(--rpx));
  padding: calc(16 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(14 * var(--rpx));
  background: rgba(255, 255, 255, 0.72);
  color: var(--ink);
  font: inherit;
  font-size: calc(22 * var(--rpx));
  line-height: 1.5;
  resize: none;
  outline: none;
}

.scan-intent-input:focus {
  border-color: rgba(201, 106, 43, 0.48);
  box-shadow: 0 0 0 calc(4 * var(--rpx)) rgba(201, 106, 43, 0.12);
}

.hero-primary-cta {
  width: 100%;
  margin-top: calc(12 * var(--rpx));
}

.scan-intent-hint {
  margin-top: calc(10 * var(--rpx));
  color: rgba(32, 35, 38, 0.58);
  font-size: calc(18 * var(--rpx));
  line-height: 1.45;
  text-align: center;
}

.scan-prompt-row {
  display: flex;
  gap: calc(8 * var(--rpx));
  margin-top: calc(10 * var(--rpx));
  overflow-x: auto;
  padding-bottom: calc(2 * var(--rpx));
  scrollbar-width: none;
}

.scan-prompt-row::-webkit-scrollbar {
  display: none;
}

.scan-prompt-chip {
  flex: 0 0 auto;
  max-width: calc(260 * var(--rpx));
  min-height: calc(42 * var(--rpx));
  padding: 0 calc(13 * var(--rpx));
  border: 1px solid rgba(28, 29, 31, 0.1);
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.92);
  color: rgba(28, 29, 31, 0.68);
  font-size: calc(16 * var(--rpx));
  font-weight: 680;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.muted {
  color: #888;
}

.section-head {
  margin: calc(34 * var(--rpx)) 0 calc(18 * var(--rpx));
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
}

.text-button {
  min-height: calc(56 * var(--rpx));
  padding: 0 calc(20 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(20 * var(--rpx));
  background: rgba(255, 255, 255, 0.06);
  color: var(--soft);
  font-size: calc(24 * var(--rpx));
  font-weight: 800;
  white-space: nowrap;
}

.back-button {
  min-height: calc(84 * var(--rpx));
  margin-bottom: calc(18 * var(--rpx));
  padding: 0 calc(20 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(20 * var(--rpx));
  background: rgba(255, 255, 255, 0.07);
  color: var(--soft);
  font-size: calc(24 * var(--rpx));
  font-weight: 900;
}

.primary-button,
.secondary-button {
  min-height: calc(84 * var(--rpx));
  border-radius: calc(22 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(26 * var(--rpx));
  font-weight: 900;
  white-space: nowrap;
}

.primary-button {
  background: var(--orange);
  color: #fff;
  box-shadow: 0 calc(18 * var(--rpx)) calc(36 * var(--rpx)) rgba(43, 45, 48, 0.28);
}

.secondary-button {
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
}

.solid-icon,
.avatar {
  width: calc(76 * var(--rpx));
  height: calc(76 * var(--rpx));
  border-radius: 24%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: #333;
  color: #fff;
  font-size: calc(26 * var(--rpx));
  font-weight: 900;
}

.solid-icon.orange,
.avatar.orange {
  background: var(--orange);
}

.solid-icon.green,
.avatar.green {
  background: var(--green);
}

.persona-avatar {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.16);
  box-shadow:
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.18),
    0 calc(12 * var(--rpx)) calc(28 * var(--rpx)) rgba(0, 0, 0, 0.22);
  text-shadow: 0 calc(1 * var(--rpx)) calc(8 * var(--rpx)) rgba(0, 0, 0, 0.28);
}

.agent-avatar-img {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.9) contrast(1.04);
}

.avatar-glyph {
  position: relative;
  z-index: 2;
  display: block;
  max-width: 100%;
  line-height: 1;
  text-align: center;
}

.persona-avatar.has-image .avatar-glyph {
  display: none;
}

.persona-avatar.has-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    radial-gradient(circle at 50% 38%, transparent 48%, rgba(0, 0, 0, 0.08) 100%),
    linear-gradient(180deg, transparent 68%, rgba(0, 0, 0, 0.24));
  pointer-events: none;
}

.persona-avatar::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background:
    radial-gradient(circle at 28% 20%, rgba(255, 255, 255, 0.34), transparent 30%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.12), transparent 48%);
  pointer-events: none;
}

.comment-avatar {
  width: calc(44 * var(--rpx));
  height: calc(44 * var(--rpx));
  border-radius: 30%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  color: #fff;
  font-size: calc(18 * var(--rpx));
  font-weight: 950;
}

.avatar-musk {
  background: linear-gradient(135deg, var(--abyss-blue-soft) 0%, var(--abyss-blue) 52%, var(--abyss-blue-deep) 100%);
}

.avatar-buffett {
  background: linear-gradient(135deg, var(--milk-warm) 0%, var(--abyss-blue-mid) 42%, var(--abyss-blue-deep) 100%);
}

.avatar-socrates {
  background: linear-gradient(135deg, var(--abyss-blue-mid) 0%, var(--abyss-blue) 56%, var(--abyss-blue-deep) 100%);
}

.avatar-naval {
  background: linear-gradient(135deg, var(--milk-white) 0%, var(--abyss-blue-soft) 44%, var(--abyss-blue-deep) 100%);
}

.avatar-karpathy,
.avatar-ai {
  background: linear-gradient(135deg, #4f7cff 0%, #1e3d8f 52%, #101827 100%);
}

.avatar-human {
  background: linear-gradient(135deg, #f0a23b 0%, #9b4a22 54%, #2a1d18 100%);
}

.avatar-member {
  background: linear-gradient(135deg, #6fc6c2 0%, #24706d 58%, #182b2c 100%);
}

.avatar-critic {
  background: linear-gradient(135deg, #a3a3a3 0%, #56585f 56%, #1c1d21 100%);
}

.avatar-bezos,
.avatar-market {
  background: linear-gradient(135deg, #ffb347 0%, #a15b20 56%, #241910 100%);
}

.avatar-zhang {
  background: linear-gradient(135deg, #3bd6a6 0%, #1f7c70 54%, #102728 100%);
}

.avatar-leijun {
  background: linear-gradient(135deg, #ff8a3d 0%, #d44c22 55%, #2c1710 100%);
}

.avatar-jobs {
  background: linear-gradient(135deg, var(--milk-white) 0%, #8b9297 46%, var(--space-graphite) 100%);
}

.avatar-jung {
  background: linear-gradient(135deg, var(--space-graphite-soft) 0%, #5d6b73 52%, var(--abyss-blue-deep) 100%);
}

.avatar-duan {
  background: linear-gradient(135deg, #95b86b 0%, #526a34 56%, #182212 100%);
}

.avatar-huang {
  background: linear-gradient(135deg, #a6e22e 0%, #5b7f20 54%, #18220f 100%);
}

.avatar-munger,
.avatar-thiel {
  background: linear-gradient(135deg, #b8a16a 0%, #69552d 58%, #20190f 100%);
}

.avatar-sales,
.avatar-growth,
.avatar-pricing {
  background: linear-gradient(135deg, #ff6b4a 0%, #b7322c 54%, #281414 100%);
}

.avatar-builder,
.avatar-maker,
.avatar-automation,
.avatar-prompt,
.avatar-knowledge {
  background: linear-gradient(135deg, #4ba3ff 0%, #256b9c 54%, #122536 100%);
}

.avatar-altman {
  background: linear-gradient(135deg, #5ad6b2 0%, #2d806f 54%, #142a28 100%);
}

.avatar-gates {
  background: linear-gradient(135deg, #8bb8ff 0%, #315a9a 52%, #162033 100%);
}

.avatar-zuckerberg {
  background: linear-gradient(135deg, #6ca8ff 0%, #2254bf 54%, #101b38 100%);
}

.avatar-einstein {
  background: linear-gradient(135deg, #f8f3df 0%, #9c8f73 50%, #242017 100%);
}

.avatar-wittgenstein {
  background: linear-gradient(135deg, #d6dde5 0%, #697484 52%, #1d222b 100%);
}

.avatar-nietzsche {
  background: linear-gradient(135deg, #d2b16a 0%, #7f3f3a 52%, #241314 100%);
}

.avatar-operator,
.avatar-brand,
.avatar-community {
  background: linear-gradient(135deg, #c983ff 0%, #7042a4 56%, #24172e 100%);
}

.avatar-heart,
.avatar-nvc,
.avatar-boundary,
.avatar-family {
  background: linear-gradient(135deg, #f57aa7 0%, #9d3e60 56%, #2b1620 100%);
}

.avatar-default {
  background: linear-gradient(135deg, #3d4654 0%, #232936 100%);
}

.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(12 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.chip {
  padding: calc(9 * var(--rpx)) calc(16 * var(--rpx));
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--soft);
  font-size: calc(21 * var(--rpx));
  font-weight: 800;
}

.active-chip {
  background: rgba(43, 45, 48, 0.2);
  color: #fff;
}

.input,
.textarea {
  width: 100%;
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(24 * var(--rpx));
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
  padding: calc(22 * var(--rpx));
  font-size: calc(26 * var(--rpx));
}

.textarea {
  min-height: calc(150 * var(--rpx));
  resize: vertical;
}

.simulation-note {
  display: inline-flex;
  width: auto;
  margin-top: calc(18 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(16 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.055);
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(20 * var(--rpx));
}

.scene-list {
  display: grid;
  gap: calc(18 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.scene-card,
.topic-card {
  width: 100%;
  min-height: calc(148 * var(--rpx));
  padding: calc(22 * var(--rpx));
  display: flex;
  align-items: center;
  gap: calc(22 * var(--rpx));
  text-align: left;
}

.scene-title {
  color: #fff;
  font-size: calc(30 * var(--rpx));
  font-weight: 900;
}

.scene-subtitle {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(23 * var(--rpx));
  line-height: 1.5;
}

.daily-card,
.filter-card,
.process-card,
.radar-card,
.strategy-radar-card,
.diagnosis-insight-card,
.asset-module-card,
.value-anchor-grid,
.mvp-card,
.retention-card,
.asset-share-card,
.share-preview,
.next-step-card,
.action-card-lab {
  margin-top: calc(22 * var(--rpx));
  padding: calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.11);
  border-radius: calc(30 * var(--rpx));
  background:
    radial-gradient(circle at 86% 12%, rgba(43, 45, 48, 0.13), transparent 30%),
    rgba(34, 34, 31, 0.7);
  backdrop-filter: blur(calc(16 * var(--rpx))) saturate(1.08);
  box-shadow: 0 calc(18 * var(--rpx)) calc(42 * var(--rpx)) rgba(0, 0, 0, 0.16);
}

.strategy-hero-card {
  border-color: rgba(43, 45, 48, 0.24);
}

.status-scan-list {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(28 * var(--rpx));
}

.status-scan-option {
  width: 100%;
  min-height: calc(92 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(22 * var(--rpx));
  display: grid;
  gap: calc(7 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
  color: #fff;
  text-align: left;
}

.status-scan-option span {
  font-size: calc(27 * var(--rpx));
  font-weight: 900;
}

.status-scan-option small {
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(21 * var(--rpx));
  line-height: 1.45;
}

.section-kicker {
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  letter-spacing: calc(3 * var(--rpx));
  font-weight: 900;
  font-family: var(--font-mono);
}

.strategy-radar-card {
  overflow: hidden;
  border-color: rgba(167, 163, 156, 0.26);
}

.radar-orbit {
  position: relative;
  height: calc(164 * var(--rpx));
  margin-top: calc(20 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.09);
  border-radius: calc(28 * var(--rpx));
  background:
    radial-gradient(circle at 50% 50%, rgba(167, 163, 156, 0.28), transparent 10%),
    radial-gradient(circle at 22% 30%, rgba(43, 45, 48, 0.32), transparent 13%),
    radial-gradient(circle at 78% 68%, rgba(167, 163, 156, 0.22), transparent 13%),
    rgba(255, 255, 255, 0.045);
}

.radar-orbit::before,
.radar-orbit::after {
  content: "";
  position: absolute;
  inset: calc(26 * var(--rpx)) calc(96 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.16);
  border-radius: 50%;
}

.radar-orbit::after {
  inset: calc(48 * var(--rpx)) calc(146 * var(--rpx));
  border-color: rgba(43, 45, 48, 0.2);
}

.radar-orbit span {
  position: absolute;
  width: calc(14 * var(--rpx));
  height: calc(14 * var(--rpx));
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 calc(22 * var(--rpx)) rgba(43, 45, 48, 0.6);
}

.radar-orbit span:nth-child(1) {
  left: 24%;
  top: 32%;
}

.radar-orbit span:nth-child(2) {
  left: 54%;
  top: 18%;
  background: var(--green);
}

.radar-orbit span:nth-child(3) {
  right: 20%;
  bottom: 24%;
}

.radar-orbit i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(70 * var(--rpx));
  height: calc(70 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: rgba(167, 163, 156, 0.18);
}

.system-signal-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(10 * var(--rpx));
  margin-top: calc(16 * var(--rpx));
}

.system-signal-list div {
  padding: calc(14 * var(--rpx)) calc(10 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
  color: var(--soft);
  font-size: calc(20 * var(--rpx));
  font-weight: 900;
  text-align: center;
}

.mvp-card {
  border-color: rgba(43, 45, 48, 0.24);
}

.next-step-card {
  border-color: rgba(43, 45, 48, 0.24);
}

.retention-card {
  border-color: rgba(167, 163, 156, 0.2);
  background:
    radial-gradient(circle at 86% 12%, rgba(167, 163, 156, 0.16), transparent 30%),
    rgba(34, 34, 31, 0.7);
}

.retention-list {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(16 * var(--rpx));
}

.retention-step {
  padding: calc(16 * var(--rpx));
  border-radius: calc(22 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
}

.retention-day {
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  font-weight: 900;
}

.retention-title {
  margin-top: calc(6 * var(--rpx));
  color: #fff;
  font-size: calc(25 * var(--rpx));
  font-weight: 900;
}

.retention-text {
  margin-top: calc(6 * var(--rpx));
  color: #999;
  font-size: calc(22 * var(--rpx));
  line-height: 1.5;
}

.daily-kicker {
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  letter-spacing: calc(3 * var(--rpx));
  font-weight: 900;
  font-family: var(--font-mono);
}

.daily-title,
.filter-title,
.mvp-title {
  margin-top: calc(10 * var(--rpx));
  color: #fff;
  font-size: calc(30 * var(--rpx));
  line-height: 1.35;
  font-weight: 900;
}

.daily-copy,
.mvp-copy {
  margin-top: calc(10 * var(--rpx));
  color: #999;
  font-size: calc(23 * var(--rpx));
  line-height: 1.6;
}

.asset-share-card {
  border-color: rgba(43, 45, 48, 0.32);
  background:
    radial-gradient(circle at 12% 0%, rgba(43, 45, 48, 0.2), transparent 28%),
    radial-gradient(circle at 92% 12%, rgba(167, 163, 156, 0.18), transparent 32%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.98), rgba(26, 26, 24, 0.94));
  box-shadow: 0 calc(28 * var(--rpx)) calc(60 * var(--rpx)) rgba(0, 0, 0, 0.32);
}

.asset-card-title {
  margin-top: calc(12 * var(--rpx));
  color: #fff;
  font-size: calc(32 * var(--rpx));
  line-height: 1.35;
  font-weight: 900;
}

.asset-core {
  margin-top: calc(14 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border-radius: calc(22 * var(--rpx));
  background: rgba(43, 45, 48, 0.14);
  color: #fff;
  font-size: calc(28 * var(--rpx));
  line-height: 1.5;
  font-weight: 900;
}

.asset-grid {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.asset-grid div,
.share-line {
  padding: calc(16 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.09);
  border-radius: calc(20 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
}

.asset-grid span,
.share-line span {
  display: block;
  margin-bottom: calc(8 * var(--rpx));
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(20 * var(--rpx));
  font-weight: 900;
}

.asset-grid b,
.share-line {
  color: var(--soft);
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
}

.share-brand {
  margin-top: calc(18 * var(--rpx));
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  letter-spacing: calc(3 * var(--rpx));
  font-weight: 900;
}

.share-question {
  margin-top: calc(16 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border-radius: calc(22 * var(--rpx));
  background: rgba(43, 45, 48, 0.14);
  color: #fff;
  font-size: calc(27 * var(--rpx));
  line-height: 1.55;
  font-weight: 900;
}

.share-ask {
  margin-top: calc(16 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border-radius: calc(22 * var(--rpx));
  background: rgba(167, 163, 156, 0.12);
  color: #f4eee7;
  font-size: calc(24 * var(--rpx));
  line-height: 1.6;
  font-weight: 800;
}

.result-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.recommended-agent-panel,
.asset-auto-card {
  margin-top: calc(18 * var(--rpx));
  padding: calc(22 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(26 * var(--rpx));
  background:
    radial-gradient(ellipse at 86% 0%, rgba(201, 106, 43, 0.1), transparent 42%),
    rgba(247, 245, 239, 0.72);
  color: var(--ink);
  box-shadow: 0 calc(14 * var(--rpx)) calc(34 * var(--rpx)) rgba(43, 45, 48, 0.07);
}

.recommended-agent-panel .daily-title,
.asset-auto-card .daily-title {
  color: var(--ink);
}

.recommended-agent-panel .daily-copy,
.asset-auto-card .daily-copy {
  color: rgba(32, 35, 38, 0.64);
}

.recommended-agent-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(10 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.recommended-agent-button {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: calc(8 * var(--rpx));
  padding: calc(14 * var(--rpx)) calc(8 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.1);
  border-radius: calc(20 * var(--rpx));
  background: rgba(255, 255, 255, 0.44);
  color: var(--ink);
  text-align: center;
}

.recommended-agent-button span {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: calc(22 * var(--rpx));
  font-weight: 950;
}

.recommended-agent-button small {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(32, 35, 38, 0.58);
  font-size: calc(17 * var(--rpx));
  font-weight: 800;
}

.share-preview {
  margin-top: 0;
  text-align: left;
}

.share-card-image {
  display: block;
  width: min(100%, calc(360 * var(--rpx)));
  margin: 0 auto calc(18 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
  box-shadow: 0 calc(18 * var(--rpx)) calc(42 * var(--rpx)) rgba(17, 18, 20, 0.2);
}

.share-card-download {
  width: min(100%, calc(320 * var(--rpx)));
  margin: 0 auto calc(22 * var(--rpx));
  text-decoration: none;
}

.growth-conversion-card,
.invite-growth-card {
  display: grid;
  gap: calc(18 * var(--rpx));
  margin-top: calc(22 * var(--rpx));
  padding: calc(26 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(32, 35, 38, 0.12);
  border-radius: calc(32 * var(--rpx));
  background:
    radial-gradient(circle at 92% 0%, rgba(201, 106, 43, 0.16), transparent 36%),
    rgba(247, 246, 243, 0.82);
  color: var(--ink);
}

.growth-conversion-card {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.invite-code-box {
  display: grid;
  min-height: calc(76 * var(--rpx));
  place-items: center;
  border-radius: calc(20 * var(--rpx));
  background: rgba(17, 18, 20, 0.92);
  color: var(--milk-white);
  font-size: calc(30 * var(--rpx));
  font-weight: 950;
  letter-spacing: calc(2 * var(--rpx));
}

.invite-stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(10 * var(--rpx));
  color: rgba(32, 35, 38, 0.64);
  font-size: calc(20 * var(--rpx));
  font-weight: 800;
}

.daily-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.compact-button {
  min-height: calc(72 * var(--rpx));
  padding: 0 calc(26 * var(--rpx));
  font-size: calc(24 * var(--rpx));
}

.next-step-card .compact-button {
  width: min(100%, calc(220 * var(--rpx)));
  margin-top: calc(18 * var(--rpx));
}

.mini-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.mini-stat {
  padding: calc(18 * var(--rpx)) calc(10 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.1);
  border-radius: calc(24 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
  text-align: center;
}

.mini-stat-value {
  color: #fff;
  font-size: calc(34 * var(--rpx));
  font-weight: 900;
}

.mini-stat-label {
  margin-top: calc(4 * var(--rpx));
  color: #999;
  font-size: calc(20 * var(--rpx));
}

.filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
}

.feed-composer {
  margin-top: calc(22 * var(--rpx));
  padding: calc(22 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.11);
  border-radius: calc(32 * var(--rpx));
  background: rgba(34, 34, 31, 0.78);
}

.composer-actions {
  margin-top: calc(18 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(18 * var(--rpx));
}

.composer-hint {
  color: #999;
  font-size: calc(22 * var(--rpx));
}

.publish-button,
.send-button {
  min-width: calc(120 * var(--rpx));
  min-height: calc(72 * var(--rpx));
}

.feed-list {
  display: grid;
  gap: calc(22 * var(--rpx));
}

.moments-shell {
  margin: calc(-8 * var(--rpx)) calc(-18 * var(--rpx)) 0;
  overflow: hidden;
  border-radius: calc(34 * var(--rpx));
  background: #f7f7f7;
  color: #1f1f1f;
  box-shadow: 0 calc(22 * var(--rpx)) calc(50 * var(--rpx)) rgba(0, 0, 0, 0.28);
}

.moments-camera-button {
  width: calc(84 * var(--rpx));
  height: calc(88 * var(--rpx));
  border: 0;
  background: transparent;
  color: #111;
}

.moments-camera-button {
  display: grid;
  place-items: center;
}

.moments-camera-icon {
  position: relative;
  display: block;
  width: calc(38 * var(--rpx));
  height: calc(30 * var(--rpx));
  border: calc(4 * var(--rpx)) solid #111;
  border-radius: calc(5 * var(--rpx));
}

.moments-camera-icon::before {
  content: "";
  position: absolute;
  left: calc(7 * var(--rpx));
  top: calc(-11 * var(--rpx));
  width: calc(16 * var(--rpx));
  height: calc(8 * var(--rpx));
  border: calc(4 * var(--rpx)) solid #111;
  border-bottom: 0;
  border-radius: calc(4 * var(--rpx)) calc(4 * var(--rpx)) 0 0;
  background: #f8f8f8;
}

.moments-camera-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(12 * var(--rpx));
  height: calc(12 * var(--rpx));
  border: calc(3 * var(--rpx)) solid #111;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.moments-cover {
  position: relative;
  height: calc(330 * var(--rpx));
  overflow: visible;
  background:
    radial-gradient(circle at 82% 18%, rgba(240, 238, 233, 0.18), transparent 24%),
    radial-gradient(circle at 20% 76%, rgba(201, 106, 43, 0.24), transparent 26%),
    linear-gradient(120deg, rgba(240, 238, 233, 0.08) 0 1px, transparent 1px 18px),
    linear-gradient(135deg, #0f1114 0%, #24282c 48%, #121315 100%);
}

.moments-cover::before,
.moments-cover::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
}

.moments-cover::before {
  left: calc(-60 * var(--rpx));
  right: calc(-40 * var(--rpx));
  bottom: calc(-72 * var(--rpx));
  height: calc(178 * var(--rpx));
  background:
    linear-gradient(100deg, transparent 0 12%, rgba(240, 238, 233, 0.16) 12% 13%, transparent 13% 35%, rgba(240, 238, 233, 0.12) 35% 36%, transparent 36%),
    linear-gradient(180deg, rgba(240, 238, 233, 0.12), rgba(240, 238, 233, 0));
  transform: skewY(-8deg);
}

.moments-cover::after {
  right: calc(48 * var(--rpx));
  top: calc(70 * var(--rpx));
  width: calc(148 * var(--rpx));
  height: calc(148 * var(--rpx));
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(240, 238, 233, 0.82) 0 7%, rgba(240, 238, 233, 0.24) 8% 23%, rgba(240, 238, 233, 0.08) 24% 46%, transparent 47%),
    conic-gradient(from 220deg, transparent 0 19%, rgba(240, 238, 233, 0.24) 20% 22%, transparent 23% 54%, rgba(240, 238, 233, 0.18) 55% 58%, transparent 59%);
  opacity: 0.76;
}

.moments-cover-gradient {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(135deg, rgba(17, 18, 20, 0.18), rgba(43, 45, 48, 0.08)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.28));
}

.moments-cover-camera {
  position: absolute;
  top: calc(22 * var(--rpx));
  right: calc(20 * var(--rpx));
  z-index: 3;
  width: calc(72 * var(--rpx));
  height: calc(72 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  background: rgba(240, 238, 233, 0.88);
  box-shadow: 0 calc(10 * var(--rpx)) calc(22 * var(--rpx)) rgba(0, 0, 0, 0.22);
}

.moments-profile {
  position: absolute;
  right: calc(24 * var(--rpx));
  bottom: calc(-44 * var(--rpx));
  z-index: 5;
  display: flex;
  align-items: flex-end;
  gap: calc(16 * var(--rpx));
}

.moments-profile-name {
  padding-bottom: calc(10 * var(--rpx));
  color: #fff;
  font-size: calc(30 * var(--rpx));
  font-weight: 900;
  text-shadow: 0 calc(2 * var(--rpx)) calc(12 * var(--rpx)) rgba(0, 0, 0, 0.55);
}

.moments-profile .avatar {
  width: calc(88 * var(--rpx));
  height: calc(88 * var(--rpx));
  display: grid;
  place-items: center;
  border: calc(3 * var(--rpx)) solid #fff;
  border-radius: calc(10 * var(--rpx));
  box-shadow: 0 calc(6 * var(--rpx)) calc(18 * var(--rpx)) rgba(0, 0, 0, 0.22);
}

.moments-profile .avatar-glyph {
  font-size: calc(22 * var(--rpx));
  letter-spacing: 0;
}

.moments-compose-card {
  margin: calc(70 * var(--rpx)) calc(20 * var(--rpx)) calc(8 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid #e8e8e8;
  border-radius: calc(12 * var(--rpx));
  background: #fff;
}

.moments-textarea {
  width: 100%;
  min-height: calc(96 * var(--rpx));
  border: 0;
  outline: 0;
  resize: none;
  background: transparent;
  color: #1f1f1f;
  font-size: calc(28 * var(--rpx));
  line-height: 1.6;
}

.moments-compose-actions {
  display: flex;
  justify-content: flex-end;
  gap: calc(14 * var(--rpx));
}

.moments-primary,
.moments-secondary {
  min-height: calc(58 * var(--rpx));
  padding: 0 calc(24 * var(--rpx));
  border: 0;
  border-radius: calc(8 * var(--rpx));
  font-size: calc(24 * var(--rpx));
  font-weight: 900;
}

.moments-primary {
  background: #07c160;
  color: #fff;
}

.moments-primary.small {
  min-width: calc(96 * var(--rpx));
  padding: 0 calc(18 * var(--rpx));
}

.moments-secondary {
  background: #f0f0f0;
  color: #576b95;
}

.hot-topic-panel {
  margin: calc(70 * var(--rpx)) calc(20 * var(--rpx)) calc(12 * var(--rpx));
  padding: calc(22 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(87, 107, 149, 0.16);
  border-radius: calc(14 * var(--rpx));
  background:
    linear-gradient(135deg, rgba(87, 107, 149, 0.08), rgba(201, 106, 43, 0.06)),
    #fff;
  box-shadow: 0 calc(10 * var(--rpx)) calc(24 * var(--rpx)) rgba(31, 31, 31, 0.06);
}

.moments-compose-card + .hot-topic-panel {
  margin-top: calc(16 * var(--rpx));
}

.hot-topic-kicker {
  color: #c96a2b;
  font-size: calc(19 * var(--rpx));
  font-weight: 900;
  letter-spacing: 0.08em;
}

.hot-topic-title {
  margin: calc(7 * var(--rpx)) 0 0;
  color: #1f1f1f;
  font-size: calc(31 * var(--rpx));
  line-height: 1.25;
}

.hot-topic-prompt {
  margin: calc(8 * var(--rpx)) 0 0;
  color: #5f6368;
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
}

.hot-topic-meta {
  margin-top: calc(12 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
  color: #8a8a8a;
  font-size: calc(20 * var(--rpx));
}

.hot-topic-chips {
  margin-top: calc(14 * var(--rpx));
  display: flex;
  gap: calc(10 * var(--rpx));
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.hot-topic-chips::-webkit-scrollbar {
  display: none;
}

.hot-topic-chip {
  flex: 0 0 auto;
  min-height: calc(46 * var(--rpx));
  padding: 0 calc(16 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(87, 107, 149, 0.18);
  border-radius: calc(999 * var(--rpx));
  background: rgba(87, 107, 149, 0.06);
  color: #576b95;
  font-size: calc(20 * var(--rpx));
  font-weight: 800;
}

.hot-topic-chip.active {
  border-color: #576b95;
  background: #576b95;
  color: #fff;
}

.hot-topic-refresh {
  width: 100%;
  min-height: calc(48 * var(--rpx));
  margin-top: calc(14 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(87, 107, 149, 0.18);
  border-radius: calc(12 * var(--rpx));
  background: rgba(255, 255, 255, 0.72);
  color: #576b95;
  font-size: calc(21 * var(--rpx));
  font-weight: 900;
}

.moments-feed {
  padding: calc(68 * var(--rpx)) calc(20 * var(--rpx)) calc(28 * var(--rpx));
}

.moments-compose-card + .moments-feed {
  padding-top: calc(8 * var(--rpx));
}

.hot-topic-panel + .moments-feed {
  padding-top: calc(8 * var(--rpx));
}

.thought-action-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: calc(24 * var(--rpx));
  background: rgba(17, 18, 20, 0.42);
  backdrop-filter: blur(calc(10 * var(--rpx)));
}

.thought-action-panel {
  position: relative;
  width: min(100%, calc(670 * var(--rpx)));
  display: grid;
  gap: calc(14 * var(--rpx));
  padding: calc(30 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.2);
  border-radius: calc(30 * var(--rpx));
  background: rgba(247, 245, 239, 0.96);
  color: var(--ink);
  box-shadow: 0 calc(26 * var(--rpx)) calc(70 * var(--rpx)) rgba(0, 0, 0, 0.32);
}

.thought-action-close {
  position: absolute;
  top: calc(16 * var(--rpx));
  right: calc(16 * var(--rpx));
  width: calc(48 * var(--rpx));
  height: calc(48 * var(--rpx));
  border: 0;
  border-radius: 50%;
  background: rgba(43, 45, 48, 0.08);
  color: rgba(32, 35, 38, 0.68);
  font-size: calc(34 * var(--rpx));
  line-height: 1;
}

.thought-action-title {
  padding-right: calc(48 * var(--rpx));
  color: var(--ink);
  font-size: calc(32 * var(--rpx));
  font-weight: 950;
}

.thought-action-copy {
  color: rgba(32, 35, 38, 0.66);
  font-size: calc(22 * var(--rpx));
  line-height: 1.65;
}

.thought-action-panel .primary-button,
.thought-action-panel .secondary-button {
  width: 100%;
  min-height: calc(64 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  box-shadow: none;
}

.moments-ai-state {
  display: grid;
  gap: calc(10 * var(--rpx));
  padding: calc(28 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(87, 107, 149, 0.14);
  border-radius: calc(14 * var(--rpx));
  background: #fff;
  color: #1f1f1f;
}

.moments-ai-state b {
  font-size: calc(28 * var(--rpx));
  line-height: 1.35;
}

.moments-ai-state span {
  color: #6b6f76;
  font-size: calc(22 * var(--rpx));
  line-height: 1.55;
}

.moments-ai-state button {
  justify-self: start;
  min-height: calc(46 * var(--rpx));
  padding: 0 calc(18 * var(--rpx));
  border: 0;
  border-radius: calc(10 * var(--rpx));
  background: #576b95;
  color: #fff;
  font-size: calc(21 * var(--rpx));
  font-weight: 900;
}

.moments-ai-state.error {
  border-color: rgba(201, 106, 43, 0.24);
}

.moments-post {
  display: grid;
  grid-template-columns: calc(74 * var(--rpx)) 1fr;
  gap: calc(16 * var(--rpx));
  padding: calc(24 * var(--rpx)) 0;
  border-bottom: calc(1 * var(--rpx)) solid #e6e6e6;
}

.moments-post > .avatar {
  width: calc(72 * var(--rpx));
  height: calc(72 * var(--rpx));
  border-radius: calc(8 * var(--rpx));
}

.moments-post.persona-post > .avatar {
  box-shadow: inset 0 0 0 calc(3 * var(--rpx)) rgba(87, 107, 149, 0.2);
}

.moments-post.human-post > .avatar {
  box-shadow: inset 0 0 0 calc(3 * var(--rpx)) rgba(7, 193, 96, 0.22);
}

.moments-name {
  color: #576b95;
  font-size: calc(27 * var(--rpx));
  font-weight: 900;
}

.moments-role {
  margin-top: calc(2 * var(--rpx));
  color: #9b9b9b;
  font-size: calc(20 * var(--rpx));
}

.moments-content {
  margin-top: calc(10 * var(--rpx));
  color: #1f1f1f;
  font-size: calc(27 * var(--rpx));
  line-height: 1.62;
}

.perspective-button {
  width: auto;
  min-height: calc(56 * var(--rpx));
  margin-top: calc(14 * var(--rpx));
  padding: 0 calc(18 * var(--rpx));
  border-radius: calc(10 * var(--rpx));
  background: rgba(87, 107, 149, 0.09);
  color: #576b95;
  font-size: calc(22 * var(--rpx));
  font-weight: 900;
  text-align: left;
}

.moments-meta {
  margin-top: calc(12 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #8a8a8a;
  font-size: calc(21 * var(--rpx));
}

.moments-more {
  width: calc(48 * var(--rpx));
  height: calc(32 * var(--rpx));
  border: 0;
  border-radius: calc(5 * var(--rpx));
  background: #eef0f3;
  color: #576b95;
  font-weight: 900;
  line-height: 1;
}

.moments-menu-wrap {
  position: relative;
}

.moments-actions-panel {
  position: absolute;
  top: calc(-16 * var(--rpx));
  right: calc(58 * var(--rpx));
  z-index: 5;
  display: flex;
  align-items: center;
  overflow: hidden;
  min-width: calc(260 * var(--rpx));
  min-height: calc(72 * var(--rpx));
  border-radius: calc(8 * var(--rpx));
  background: rgba(45, 45, 45, 0.96);
  box-shadow: 0 calc(10 * var(--rpx)) calc(24 * var(--rpx)) rgba(0, 0, 0, 0.22);
}

.moments-actions-panel::after {
  content: "";
  position: absolute;
  top: calc(26 * var(--rpx));
  right: calc(-10 * var(--rpx));
  width: 0;
  height: 0;
  border-top: calc(10 * var(--rpx)) solid transparent;
  border-bottom: calc(10 * var(--rpx)) solid transparent;
  border-left: calc(10 * var(--rpx)) solid rgba(45, 45, 45, 0.96);
}

.moments-actions-panel button {
  flex: 1;
  min-height: calc(72 * var(--rpx));
  padding: 0 calc(18 * var(--rpx));
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  font-size: calc(25 * var(--rpx));
  font-weight: 800;
}

.moments-actions-panel button + button {
  border-left: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.22);
}

.moments-actions-panel span {
  margin-right: calc(8 * var(--rpx));
  color: #fff;
}

.moments-social {
  margin-top: calc(12 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(12 * var(--rpx));
  border-radius: calc(6 * var(--rpx));
  background: #eef0f3;
  color: #1f1f1f;
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
}

.like-row {
  color: #576b95;
  font-weight: 800;
}

.comment-row + .comment-row,
.like-row + .comment-row {
  margin-top: calc(6 * var(--rpx));
}

.comment-row .comment-name {
  color: #576b95;
  font-weight: 900;
}

.moments-comment-box {
  margin-top: calc(12 * var(--rpx));
  display: grid;
  grid-template-columns: 1fr auto;
  gap: calc(10 * var(--rpx));
}

.moments-comment-box .comment-input {
  min-height: calc(58 * var(--rpx));
  border: calc(1 * var(--rpx)) solid #dedede;
  border-radius: calc(8 * var(--rpx));
  background: #fff;
  color: #1f1f1f;
}

.feed-card {
  padding: calc(24 * var(--rpx));
}

.post-head {
  display: flex;
  align-items: center;
  gap: calc(18 * var(--rpx));
}

.post-author {
  flex: 1;
  min-width: 0;
}

.post-name {
  color: #fff;
  font-size: calc(30 * var(--rpx));
  font-weight: 900;
}

.post-role,
.post-time {
  color: #999;
  font-size: calc(21 * var(--rpx));
}

.post-content {
  margin-top: calc(22 * var(--rpx));
  color: #dfddd8;
  font-size: calc(28 * var(--rpx));
  line-height: 1.75;
}

.post-actions {
  margin-top: calc(20 * var(--rpx));
  display: flex;
  gap: calc(14 * var(--rpx));
}

.post-action {
  min-height: calc(60 * var(--rpx));
  padding: 0 calc(22 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(18 * var(--rpx));
  background: rgba(255, 255, 255, 0.07);
  color: var(--soft);
  font-size: calc(23 * var(--rpx));
  font-weight: 900;
}

.comment-box {
  margin-top: calc(18 * var(--rpx));
  display: grid;
  grid-template-columns: 1fr calc(120 * var(--rpx));
  gap: calc(14 * var(--rpx));
}

.comment-input {
  min-height: calc(72 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(20 * var(--rpx));
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
  padding: 0 calc(18 * var(--rpx));
  font-size: calc(25 * var(--rpx));
}

.comment-list {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.comment {
  padding: calc(14 * var(--rpx)) calc(16 * var(--rpx));
  display: flex;
  align-items: flex-start;
  gap: calc(12 * var(--rpx));
  border-left: calc(6 * var(--rpx)) solid rgba(167, 163, 156, 0.7);
  border-radius: 0 calc(18 * var(--rpx)) calc(18 * var(--rpx)) 0;
  background: rgba(255, 255, 255, 0.055);
  color: var(--soft);
  font-size: calc(24 * var(--rpx));
  line-height: 1.6;
}

.comment-body {
  flex: 1;
  min-width: 0;
}

.typing-comment,
.typing-bubble {
  color: #d7d0c8;
  border-color: rgba(43, 45, 48, 0.26);
  background: rgba(43, 45, 48, 0.08);
}

.typing-dots {
  display: inline-block;
  margin-left: calc(4 * var(--rpx));
  color: var(--orange);
  letter-spacing: calc(2 * var(--rpx));
  animation: pulseDots 1.1s infinite ease-in-out;
}

@keyframes pulseDots {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 1; }
}

.user-comment {
  border-left-color: var(--orange);
}

.comment-name {
  color: #fff;
  font-weight: 900;
}

.council-page {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100vw;
  height: 100dvh;
  min-height: 0;
  padding-bottom: calc(118 * var(--rpx) + env(safe-area-inset-bottom));
  overflow: hidden;
  gap: calc(14 * var(--rpx));
}

.council-page > * {
  min-width: 0;
  max-width: 100%;
}

.council-back-home {
  flex: 0 0 auto;
  align-self: flex-start;
  min-height: calc(58 * var(--rpx));
  margin-bottom: 0;
  padding: 0 calc(18 * var(--rpx));
  border-color: rgba(43, 45, 48, 0.12);
  background: rgba(247, 245, 239, 0.72);
  color: rgba(32, 35, 38, 0.72);
  box-shadow: 0 calc(12 * var(--rpx)) calc(28 * var(--rpx)) rgba(43, 45, 48, 0.06);
}

.first-head {
  margin-top: 0;
}

.council-page .section-head {
  flex: 0 0 auto;
  align-items: flex-start;
  margin-bottom: 0;
}

.council-page .section-head > div {
  min-width: 0;
}

.council-page .text-button {
  flex: 0 0 auto;
  min-height: calc(52 * var(--rpx));
  padding: 0 calc(16 * var(--rpx));
}

.group-room-card {
  flex: 0 0 auto;
  display: grid;
  gap: calc(14 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
}

.group-seat-grid {
  display: flex;
  gap: calc(10 * var(--rpx));
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.group-seat-grid::-webkit-scrollbar {
  display: none;
}

.group-seat-grid span {
  flex: 0 0 auto;
  min-width: calc(126 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(12 * var(--rpx));
  border-radius: calc(16 * var(--rpx));
  background: rgba(43, 45, 48, 0.07);
  color: rgba(29, 31, 34, 0.76);
  font-size: calc(19 * var(--rpx));
  font-weight: 850;
}

.group-seat-grid b {
  display: block;
  margin-bottom: calc(4 * var(--rpx));
  color: var(--accent-orange);
  font-family: var(--font-mono);
  font-size: calc(14 * var(--rpx));
  letter-spacing: calc(1 * var(--rpx));
}

.group-seat-grid .human-seat {
  background: rgba(201, 106, 43, 0.11);
}

.council-page .process-card {
  flex: 0 0 auto;
  margin: 0;
  padding: calc(18 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
}

.people-strip {
  white-space: nowrap;
  flex: 0 0 auto;
  margin-bottom: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.people-strip::-webkit-scrollbar {
  display: none;
}

.people-row {
  display: flex;
  gap: calc(12 * var(--rpx));
}

.person-chip {
  flex: 0 0 auto;
  padding: calc(12 * var(--rpx)) calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(18 * var(--rpx));
  background: rgba(255, 255, 255, 0.08);
  color: var(--soft);
  font-size: calc(22 * var(--rpx));
  font-weight: 900;
}

.person-chip.active {
  background: var(--orange);
  color: #fff;
}

.chat-panel {
  flex: 1;
  min-height: 0;
  padding: calc(4 * var(--rpx)) 0 calc(12 * var(--rpx));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.council-decision-card {
  flex: 0 0 auto;
  display: grid;
  gap: calc(10 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(201, 106, 43, 0.22);
  border-radius: calc(24 * var(--rpx));
  background:
    radial-gradient(ellipse at 88% 10%, rgba(201, 106, 43, 0.18), transparent 46%),
    rgba(247, 245, 239, 0.78);
  color: var(--ink);
  box-shadow: 0 calc(16 * var(--rpx)) calc(34 * var(--rpx)) rgba(43, 45, 48, 0.08);
}

.council-decision-card .daily-copy {
  margin-top: calc(4 * var(--rpx));
  color: rgba(32, 35, 38, 0.54);
  font-size: calc(18 * var(--rpx));
}

.decision-main {
  color: var(--ink);
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
  font-weight: 900;
}

.decision-next {
  padding-top: calc(10 * var(--rpx));
  border-top: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.08);
  color: rgba(32, 35, 38, 0.64);
  font-size: calc(20 * var(--rpx));
  line-height: 1.45;
}

.decision-next span {
  display: block;
  margin-bottom: calc(4 * var(--rpx));
  color: var(--accent-orange);
  font-size: calc(17 * var(--rpx));
  font-weight: 950;
}

.council-verdict-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(10 * var(--rpx));
  flex: 0 0 auto;
  margin-top: calc(10 * var(--rpx));
  padding: calc(12 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.1);
  border-radius: calc(24 * var(--rpx));
  background: rgba(22, 22, 20, 0.62);
}

.council-verdict-actions .primary-button,
.council-verdict-actions .secondary-button {
  width: 100%;
  min-height: calc(62 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  box-shadow: none;
}

.bubble {
  max-width: 88%;
  margin-bottom: calc(14 * var(--rpx));
  padding: calc(18 * var(--rpx)) calc(20 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(24 * var(--rpx));
  background: rgba(34, 34, 31, 0.86);
  color: var(--soft);
  font-size: calc(24 * var(--rpx));
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.bubble.user {
  margin-left: auto;
  background: rgba(43, 45, 48, 0.16);
  border-color: rgba(43, 45, 48, 0.35);
}

.bubble.person {
  margin-right: auto;
  background: rgba(167, 163, 156, 0.15);
  border-color: rgba(167, 163, 156, 0.34);
}

.composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(112 * var(--rpx));
  gap: calc(10 * var(--rpx));
  padding: calc(12 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.1);
  border-radius: calc(24 * var(--rpx));
  background: rgba(22, 22, 20, 0.86);
  backdrop-filter: blur(calc(18 * var(--rpx))) saturate(1.08);
  flex: 0 0 auto;
  margin-bottom: 0;
}

.council-page .composer .input,
.council-page .composer .send-button {
  min-height: calc(70 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
}

.council-page .composer .input {
  padding: 0 calc(18 * var(--rpx));
  min-width: 0;
}

.council-page .composer .send-button {
  width: 100%;
  min-width: 0;
  box-shadow: none;
}

.process-card {
  margin-bottom: calc(18 * var(--rpx));
}

.process-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: calc(10 * var(--rpx));
  margin-top: calc(14 * var(--rpx));
}

.process-steps span {
  min-width: 0;
  min-height: calc(58 * var(--rpx));
  padding: 0 calc(8 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.07);
  color: var(--soft);
  font-size: calc(21 * var(--rpx));
  font-weight: 900;
}

.diagnosis-card {
  margin-top: calc(24 * var(--rpx));
  padding: calc(28 * var(--rpx));
}

.scan-stage-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(10 * var(--rpx));
  margin-bottom: calc(20 * var(--rpx));
}

.scan-stage-row span {
  min-height: calc(54 * var(--rpx));
  padding: 0 calc(8 * var(--rpx));
  border-radius: calc(16 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(18 * var(--rpx));
  line-height: 1.25;
  text-align: center;
  font-weight: 900;
}

.scan-stage-row span.done {
  background: rgba(43, 45, 48, 0.17);
  color: #fff;
}

.progress {
  height: calc(10 * var(--rpx));
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
  margin-bottom: calc(28 * var(--rpx));
}

.progress-bar {
  height: 100%;
  border-radius: 999px;
  background: var(--orange);
}

.choice-list {
  display: grid;
  gap: calc(18 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.choice-list.multi {
  gap: calc(14 * var(--rpx));
}

.choice-select-count {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
  color: rgba(247, 245, 239, 0.72);
  font-size: calc(21 * var(--rpx));
  line-height: 1.45;
}

.choice-select-count b {
  min-width: calc(58 * var(--rpx));
  height: calc(42 * var(--rpx));
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.1);
  color: var(--accent-orange);
  font-size: calc(19 * var(--rpx));
  font-weight: 900;
}

.choice {
  min-height: calc(96 * var(--rpx));
  padding: 0 calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(24 * var(--rpx));
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  text-align: left;
  font-size: calc(28 * var(--rpx));
  font-weight: 800;
}

.scan-continue-button {
  margin-top: calc(8 * var(--rpx));
}

.scan-continue-button:disabled {
  opacity: 0.42;
  filter: grayscale(0.4);
  box-shadow: none;
}

.diagnosis-insight-card {
  border-color: rgba(167, 163, 156, 0.25);
  background:
    radial-gradient(circle at 86% 12%, rgba(167, 163, 156, 0.18), transparent 30%),
    rgba(34, 34, 31, 0.72);
}

.strategy-report-card {
  margin-top: calc(22 * var(--rpx));
}

.strategy-report-grid {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.strategy-report-grid div {
  padding: calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.1);
  border-radius: calc(22 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
}

.strategy-report-grid span {
  display: block;
  margin-bottom: calc(8 * var(--rpx));
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  letter-spacing: calc(2 * var(--rpx));
  font-weight: 900;
}

.strategy-report-grid b {
  color: var(--soft);
  font-size: calc(23 * var(--rpx));
  line-height: 1.6;
}

.result-card {
  margin-top: calc(22 * var(--rpx));
  padding: calc(26 * var(--rpx));
  display: grid;
  grid-template-columns: calc(76 * var(--rpx)) 1fr;
  gap: calc(20 * var(--rpx));
}

.result-title {
  margin-bottom: calc(10 * var(--rpx));
  color: #fff;
  font-size: calc(30 * var(--rpx));
  font-weight: 900;
}

.result-button {
  grid-column: 1 / -1;
}

.plan-list {
  display: grid;
  gap: calc(18 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.plan-card {
  width: 100%;
  padding: calc(22 * var(--rpx));
  display: grid;
  grid-template-columns: calc(58 * var(--rpx)) 1fr;
  gap: calc(18 * var(--rpx));
  text-align: left;
}

.plan-card.done {
  border-color: rgba(167, 163, 156, 0.58);
}

.plan-index {
  width: calc(58 * var(--rpx));
  height: calc(58 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--green);
  color: #fff;
  font-size: calc(28 * var(--rpx));
  font-weight: 900;
}

.plan-title {
  color: #fff;
  font-size: calc(29 * var(--rpx));
  font-weight: 900;
}

.plan-text {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
}

.action-card-lab {
  display: grid;
  gap: calc(16 * var(--rpx));
}

.action-card-lab-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(10 * var(--rpx));
}

.action-card-lab-grid div {
  min-height: calc(90 * var(--rpx));
  padding: calc(14 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.14);
  border-radius: calc(20 * var(--rpx));
  background: rgba(43, 45, 48, 0.07);
  color: var(--ink);
  font-size: calc(20 * var(--rpx));
  line-height: 1.35;
  font-weight: 900;
}

.action-card-lab-grid span {
  display: block;
  margin-bottom: calc(8 * var(--rpx));
  color: rgba(29, 31, 34, 0.62);
  font-size: calc(18 * var(--rpx));
}

.action-card-button {
  margin-top: calc(4 * var(--rpx));
}

.strategic-action-card {
  position: relative;
  aspect-ratio: 9 / 16;
  overflow: hidden;
  padding: calc(26 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.18);
  border-radius: calc(30 * var(--rpx));
  background:
    radial-gradient(circle at 84% 9%, rgba(167, 163, 156, 0.24), transparent 24%),
    radial-gradient(circle at 12% 96%, rgba(43, 45, 48, 0.13), transparent 28%),
    linear-gradient(rgba(43, 45, 48, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 45, 48, 0.04) 1px, transparent 1px),
    var(--milk-warm);
  background-size: auto, auto, calc(52 * var(--rpx)) calc(52 * var(--rpx)), calc(52 * var(--rpx)) calc(52 * var(--rpx)), auto;
  color: var(--ink);
  text-align: left;
  box-shadow: inset 0 0 0 calc(8 * var(--rpx)) rgba(43, 45, 48, 0.04);
}

.strategic-action-card::before {
  content: "";
  position: absolute;
  right: calc(22 * var(--rpx));
  top: calc(20 * var(--rpx));
  width: calc(82 * var(--rpx));
  height: calc(82 * var(--rpx));
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, var(--orange) 0 7%, var(--milk-warm) 8% 13%, rgba(43, 45, 48, 0.28) 14% 29%, rgba(43, 45, 48, 0.08) 30% 56%, transparent 57%),
    conic-gradient(from 220deg, transparent 0 22%, rgba(43, 45, 48, 0.22) 23% 26%, transparent 27% 55%, rgba(43, 45, 48, 0.18) 56% 59%, transparent 60%);
}

.action-card-topline {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(12 * var(--rpx));
  color: var(--orange);
  font-size: calc(18 * var(--rpx));
  letter-spacing: calc(3 * var(--rpx));
  font-weight: 900;
  font-family: var(--font-mono);
}

.action-card-title {
  position: relative;
  z-index: 1;
  margin-top: calc(34 * var(--rpx));
  color: var(--ink);
  font-size: calc(44 * var(--rpx));
  line-height: 1.08;
  font-weight: 950;
  font-family: var(--font-cn-display);
  letter-spacing: 0.03em;
}

.action-card-subtitle {
  position: relative;
  z-index: 1;
  margin-top: calc(12 * var(--rpx));
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(22 * var(--rpx));
  line-height: 1.45;
}

.action-card-focus {
  position: relative;
  z-index: 1;
  margin-top: calc(22 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
  background: rgba(43, 45, 48, 0.12);
}

.action-card-focus span,
.action-card-fields span {
  display: block;
  margin-bottom: calc(7 * var(--rpx));
  color: var(--abyss-blue-deep);
  font-size: calc(18 * var(--rpx));
  font-weight: 900;
}

.action-card-focus b {
  color: var(--ink);
  font-size: calc(27 * var(--rpx));
  line-height: 1.35;
}

.action-card-fields {
  position: relative;
  z-index: 1;
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(16 * var(--rpx));
}

.action-card-fields div {
  padding: calc(14 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(20 * var(--rpx));
  background: rgba(240, 238, 233, 0.62);
  color: rgba(29, 31, 34, 0.82);
  font-size: calc(21 * var(--rpx));
  line-height: 1.48;
  font-weight: 800;
}

.action-card-reminder {
  position: relative;
  z-index: 1;
  margin-top: calc(16 * var(--rpx));
  padding: calc(16 * var(--rpx));
  border-radius: calc(20 * var(--rpx));
  background: var(--orange);
  color: var(--milk-white);
  font-size: calc(22 * var(--rpx));
  line-height: 1.45;
  font-weight: 900;
}

.action-card-brand {
  position: absolute;
  left: calc(26 * var(--rpx));
  right: calc(26 * var(--rpx));
  bottom: calc(24 * var(--rpx));
  color: rgba(29, 31, 34, 0.58);
  font-size: calc(18 * var(--rpx));
  letter-spacing: calc(2 * var(--rpx));
  font-weight: 900;
  font-family: var(--font-mono);
}

.action-card-modal-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(12 * var(--rpx));
  margin-top: calc(16 * var(--rpx));
}

.action-card-archive-head {
  margin-top: calc(28 * var(--rpx));
}

.action-card-archive {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(14 * var(--rpx));
}

.action-card-archive-item,
.action-card-empty {
  width: 100%;
  padding: calc(20 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.14);
  border-radius: calc(24 * var(--rpx));
  background: rgba(240, 238, 233, 0.82);
  color: var(--ink);
  text-align: left;
}

.action-card-archive-item {
  display: grid;
  gap: calc(8 * var(--rpx));
}

.action-card-archive-item span {
  color: var(--abyss-blue-deep);
  font-size: calc(19 * var(--rpx));
  letter-spacing: calc(2 * var(--rpx));
  font-weight: 900;
}

.action-card-archive-item b {
  color: var(--ink);
  font-size: calc(25 * var(--rpx));
  line-height: 1.35;
}

.action-card-archive-item i,
.action-card-empty {
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(21 * var(--rpx));
  line-height: 1.55;
  font-style: normal;
}

.review-asset-list {
  display: grid;
  gap: calc(12 * var(--rpx));
  margin-top: calc(14 * var(--rpx));
}

.review-asset-card,
.review-report,
.renewal-report {
  display: grid;
  gap: calc(12 * var(--rpx));
  padding: calc(22 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.14);
  border-radius: calc(24 * var(--rpx));
  background: rgba(240, 238, 233, 0.88);
  color: var(--ink);
}

.review-asset-card b,
.review-title {
  color: var(--ink);
  font-size: calc(26 * var(--rpx));
  line-height: 1.35;
  font-weight: 900;
}

.review-asset-card span,
.review-report p,
.renewal-report p {
  color: rgba(29, 31, 34, 0.72);
  font-size: calc(22 * var(--rpx));
  line-height: 1.55;
}

.review-asset-card i {
  color: var(--abyss-blue-deep);
  font-size: calc(20 * var(--rpx));
  font-style: normal;
  font-weight: 900;
}

.review-score {
  width: calc(88 * var(--rpx));
  height: calc(88 * var(--rpx));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--milk-white);
  background: var(--abyss-blue-deep);
  font-size: calc(38 * var(--rpx));
  font-weight: 900;
}

.review-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(12 * var(--rpx));
}

.review-columns div,
.review-next,
.renewal-metrics {
  display: grid;
  gap: calc(8 * var(--rpx));
  padding: calc(16 * var(--rpx));
  border-radius: calc(20 * var(--rpx));
  background: rgba(43, 45, 48, 0.06);
}

.review-columns b,
.review-next b {
  color: var(--abyss-blue-deep);
  font-size: calc(20 * var(--rpx));
}

.review-columns span,
.review-next span,
.renewal-metrics span {
  color: rgba(29, 31, 34, 0.74);
  font-size: calc(20 * var(--rpx));
  line-height: 1.45;
}

.renewal-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.finish-button,
.social-button,
.save-button {
  margin-top: calc(24 * var(--rpx));
}

.finish-button,
.social-button,
.save-button,
.member-button,
.result-button {
  width: 100%;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(14 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.asset-module-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(14 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.asset-module-card {
  padding: calc(22 * var(--rpx));
}

.asset-module-card:last-child {
  grid-column: 1 / -1;
}

.asset-module-copy {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(20 * var(--rpx));
  line-height: 1.5;
}

.metric-card {
  padding: calc(24 * var(--rpx)) calc(10 * var(--rpx));
  text-align: center;
}

.metric-number {
  color: #fff;
  font-size: calc(48 * var(--rpx));
  font-weight: 900;
}

.metric-label {
  color: #999;
  font-size: calc(22 * var(--rpx));
}

.radar-card {
  display: grid;
  gap: calc(16 * var(--rpx));
}

.radar-row {
  display: grid;
  grid-template-columns: calc(140 * var(--rpx)) 1fr calc(44 * var(--rpx));
  align-items: center;
  gap: calc(14 * var(--rpx));
  color: var(--soft);
  font-size: calc(23 * var(--rpx));
  font-weight: 800;
}

.radar-row i {
  height: calc(12 * var(--rpx));
  border-radius: 999px;
  background: linear-gradient(90deg, var(--orange), var(--green));
  box-shadow: 0 calc(10 * var(--rpx)) calc(20 * var(--rpx)) rgba(167, 163, 156, 0.16);
}

.radar-row b {
  color: #fff;
  font-size: calc(24 * var(--rpx));
}

.timeline-list {
  display: grid;
  gap: calc(16 * var(--rpx));
}

.timeline-card {
  padding: calc(22 * var(--rpx));
  border-left: calc(6 * var(--rpx)) solid var(--green);
  border-radius: 0 calc(24 * var(--rpx)) calc(24 * var(--rpx)) 0;
}

.timeline-title {
  color: #fff;
  font-size: calc(28 * var(--rpx));
  font-weight: 900;
}

.timeline-text {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(23 * var(--rpx));
  line-height: 1.6;
}

.membership-asset-preview-card {
  padding: calc(28 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(201, 106, 43, 0.22);
  border-radius: calc(32 * var(--rpx));
  background:
    radial-gradient(circle at 86% 12%, rgba(201, 106, 43, 0.18), transparent 32%),
    rgba(247, 245, 239, 0.84);
  box-shadow: 0 calc(20 * var(--rpx)) calc(42 * var(--rpx)) rgba(0, 0, 0, 0.2);
}

.membership-asset-preview-card .h2 {
  margin-top: calc(8 * var(--rpx));
  color: var(--ink);
  font-size: calc(34 * var(--rpx));
}

.membership-asset-preview-card .p {
  margin-top: calc(12 * var(--rpx));
  color: rgba(32, 35, 38, 0.66);
}

.login-only-card,
.my-home-card,
.price-card,
.wecom-card,
.membership-active-card,
.renewal-card,
.action-card-lab {
  padding: calc(34 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.35);
  border-radius: calc(34 * var(--rpx));
  background:
    radial-gradient(circle at 84% 12%, rgba(43, 45, 48, 0.24), transparent 30%),
    linear-gradient(135deg, rgba(44, 44, 40, 0.88), rgba(26, 26, 24, 0.82));
  box-shadow: 0 calc(24 * var(--rpx)) calc(48 * var(--rpx)) rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(calc(18 * var(--rpx))) saturate(1.08);
}

.login-only-card {
  min-height: calc(520 * var(--rpx));
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-color: rgba(167, 163, 156, 0.36);
  background:
    radial-gradient(circle at 82% 6%, rgba(167, 163, 156, 0.24), transparent 32%),
    radial-gradient(circle at 8% 84%, rgba(43, 45, 48, 0.2), transparent 30%),
    linear-gradient(135deg, rgba(31, 38, 36, 0.92), rgba(17, 17, 15, 0.86));
}

.wechat-login-primary {
  width: 100%;
  margin-top: calc(34 * var(--rpx));
}

.dev-login-button {
  width: 100%;
  margin-top: calc(14 * var(--rpx));
}

.dev-login-note {
  opacity: 0.78;
}

.login-note {
  margin-top: calc(18 * var(--rpx));
  color: rgba(29, 31, 34, 0.68);
  font-size: calc(21 * var(--rpx));
  line-height: 1.5;
  text-align: center;
}

.journey-card {
  margin-top: calc(22 * var(--rpx));
  padding: calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.11);
  border-radius: calc(32 * var(--rpx));
  background: rgba(34, 34, 31, 0.68);
  backdrop-filter: blur(calc(16 * var(--rpx))) saturate(1.08);
}

.journey-step {
  display: flex;
  gap: calc(16 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
  padding: calc(18 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
}

.journey-step span {
  width: calc(44 * var(--rpx));
  height: calc(44 * var(--rpx));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(43, 45, 48, 0.2);
  color: var(--orange);
  font-size: calc(22 * var(--rpx));
  font-weight: 900;
}

.journey-step b {
  color: #fff;
  font-size: calc(25 * var(--rpx));
}

.journey-step p {
  margin-top: calc(6 * var(--rpx));
  color: #999;
  font-size: calc(22 * var(--rpx));
  line-height: 1.5;
}

.my-home-card {
  border-color: rgba(167, 163, 156, 0.28);
  background:
    radial-gradient(circle at 86% 12%, rgba(167, 163, 156, 0.2), transparent 30%),
    linear-gradient(135deg, rgba(35, 42, 38, 0.9), rgba(24, 24, 22, 0.82));
}

.my-home-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: calc(18 * var(--rpx));
  margin-bottom: calc(18 * var(--rpx));
}

.price {
  margin: calc(24 * var(--rpx)) 0;
  color: #fff;
  font-size: calc(86 * var(--rpx));
  line-height: 1;
  font-weight: 900;
}

.value-anchor-grid {
  display: grid;
  gap: calc(10 * var(--rpx));
  margin-top: calc(20 * var(--rpx));
  padding: calc(16 * var(--rpx));
  border-color: rgba(255, 255, 255, 0.08);
  border-radius: calc(22 * var(--rpx));
  background: rgba(255, 255, 255, 0.05);
  color: var(--soft);
  font-size: calc(22 * var(--rpx));
  line-height: 1.45;
  font-weight: 900;
}

.value-anchor-grid div {
  padding-left: calc(18 * var(--rpx));
  border-left: calc(4 * var(--rpx)) solid var(--orange);
}

.member-button {
  margin-top: calc(28 * var(--rpx));
}

.wecom-card {
  margin-top: calc(22 * var(--rpx));
  border-color: rgba(167, 163, 156, 0.35);
}

.membership-active-card {
  margin-top: calc(22 * var(--rpx));
  border-color: rgba(167, 163, 156, 0.32);
  background:
    radial-gradient(circle at 84% 12%, rgba(167, 163, 156, 0.22), transparent 30%),
    linear-gradient(135deg, rgba(25, 50, 44, 0.9), rgba(20, 24, 22, 0.84));
}

.delivery-progress-card,
.pending-payment-card {
  margin-top: calc(22 * var(--rpx));
  padding: calc(26 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(167, 163, 156, 0.28);
  border-radius: calc(30 * var(--rpx));
  background:
    radial-gradient(circle at 86% 4%, rgba(201, 106, 43, 0.14), transparent 30%),
    rgba(35, 35, 32, 0.72);
  box-shadow: 0 calc(18 * var(--rpx)) calc(38 * var(--rpx)) rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(calc(16 * var(--rpx))) saturate(1.05);
}

.delivery-step-list {
  display: grid;
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.delivery-step {
  display: grid;
  grid-template-columns: calc(46 * var(--rpx)) 1fr;
  gap: calc(14 * var(--rpx));
  align-items: flex-start;
  padding: calc(16 * var(--rpx));
  border-radius: calc(22 * var(--rpx));
  background: rgba(255, 255, 255, 0.055);
}

.delivery-step span {
  width: calc(42 * var(--rpx));
  height: calc(42 * var(--rpx));
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: var(--orange);
  font-size: calc(20 * var(--rpx));
  font-weight: 900;
}

.delivery-step.done span {
  background: var(--green);
  color: #fff;
}

.delivery-step b {
  color: #fff;
  font-size: calc(23 * var(--rpx));
  line-height: 1.35;
}

.delivery-step p {
  margin-top: calc(6 * var(--rpx));
  color: rgba(240, 238, 233, 0.68);
  font-size: calc(20 * var(--rpx));
  line-height: 1.55;
}

.pending-payment-card {
  border-color: rgba(201, 106, 43, 0.34);
}

.pending-payment-card code {
  display: block;
  margin-top: calc(12 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(14 * var(--rpx));
  border-radius: calc(16 * var(--rpx));
  background: rgba(0, 0, 0, 0.12);
  color: rgba(240, 238, 233, 0.74);
  font-family: var(--font-mono);
  font-size: calc(18 * var(--rpx));
  overflow-wrap: anywhere;
}

.renewal-card {
  margin-top: calc(22 * var(--rpx));
  border-color: rgba(201, 106, 43, 0.34);
  background:
    radial-gradient(circle at 88% 8%, rgba(201, 106, 43, 0.16), transparent 30%),
    linear-gradient(135deg, rgba(45, 42, 37, 0.9), rgba(24, 24, 22, 0.84));
}

.success-mark {
  width: calc(88 * var(--rpx));
  height: calc(88 * var(--rpx));
  margin-bottom: calc(22 * var(--rpx));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--green);
  color: #fff;
  font-size: calc(46 * var(--rpx));
  font-weight: 900;
}

.wecom-copy {
  margin-top: calc(12 * var(--rpx));
}

.qr-demo {
  width: calc(220 * var(--rpx));
  height: calc(220 * var(--rpx));
  margin: calc(28 * var(--rpx)) auto 0;
  border: calc(16 * var(--rpx)) solid #fff;
  border-radius: calc(24 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(90deg, #111 calc(16 * var(--rpx)), transparent calc(16 * var(--rpx))) 0 0 / calc(32 * var(--rpx)) calc(32 * var(--rpx)),
    linear-gradient(#111 calc(16 * var(--rpx)), transparent calc(16 * var(--rpx))) 0 0 / calc(32 * var(--rpx)) calc(32 * var(--rpx)),
    #fff;
  color: #111;
  font-size: calc(30 * var(--rpx));
  font-weight: 900;
}

.wecom-qr-image {
  display: block;
  width: min(calc(360 * var(--rpx)), 78%);
  aspect-ratio: 928 / 1380;
  margin: calc(28 * var(--rpx)) auto 0;
  border: calc(12 * var(--rpx)) solid rgba(255, 255, 255, 0.92);
  border-radius: calc(24 * var(--rpx));
  background: #fff;
  box-shadow: 0 calc(20 * var(--rpx)) calc(46 * var(--rpx)) rgba(0, 0, 0, 0.28);
  object-fit: cover;
}

.wecom-hint {
  margin-top: calc(14 * var(--rpx));
  color: rgba(240, 238, 233, 0.64);
  font-size: calc(22 * var(--rpx));
  line-height: 1.45;
  text-align: center;
  font-weight: 800;
}

.benefit-list {
  display: grid;
  gap: calc(18 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.compliance-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(12 * var(--rpx)) calc(18 * var(--rpx));
  margin: calc(28 * var(--rpx)) calc(10 * var(--rpx)) 0;
  padding-bottom: calc(10 * var(--rpx));
  color: rgba(240, 238, 233, 0.58);
  font-size: calc(21 * var(--rpx));
  line-height: 1.35;
  font-weight: 800;
}

.compliance-links a {
  color: inherit;
  text-decoration: none;
}

.compliance-links a:active {
  color: var(--orange);
}

.compliance-records {
  margin-top: calc(8 * var(--rpx));
  color: rgba(240, 238, 233, 0.48);
  font-size: calc(19 * var(--rpx));
  line-height: 1.45;
  text-align: center;
}

.invite-card {
  margin-top: calc(22 * var(--rpx));
  padding: calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.11);
  border-radius: calc(32 * var(--rpx));
  background: rgba(34, 34, 31, 0.7);
  backdrop-filter: blur(calc(16 * var(--rpx))) saturate(1.08);
}

.login-card {
  margin-top: calc(22 * var(--rpx));
  padding: calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(167, 163, 156, 0.28);
  border-radius: calc(32 * var(--rpx));
  background:
    radial-gradient(circle at 88% 12%, rgba(167, 163, 156, 0.18), transparent 32%),
    rgba(34, 34, 31, 0.7);
  backdrop-filter: blur(calc(16 * var(--rpx))) saturate(1.08);
}

.login-head {
  display: flex;
  align-items: center;
  gap: calc(18 * var(--rpx));
}

.login-copy {
  flex: 1;
  min-width: 0;
}

.invite-title {
  color: #fff;
  font-size: calc(29 * var(--rpx));
  font-weight: 900;
}

.invite-copy {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
}

.invite-form {
  display: grid;
  grid-template-columns: 1fr calc(148 * var(--rpx));
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.invite-button {
  min-height: calc(84 * var(--rpx));
}

.login-button {
  width: 100%;
  margin-top: calc(20 * var(--rpx));
}

.email-auth-card {
  margin-top: calc(22 * var(--rpx));
  padding: calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.11);
  border-radius: calc(32 * var(--rpx));
  background: rgba(34, 34, 31, 0.7);
  backdrop-filter: blur(calc(16 * var(--rpx))) saturate(1.08);
}

.auth-mode-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(12 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.mode-button {
  min-height: calc(68 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(18 * var(--rpx));
  background: rgba(255, 255, 255, 0.06);
  color: var(--soft);
  font-size: calc(24 * var(--rpx));
  font-weight: 900;
}

.mode-button.active {
  border-color: rgba(43, 45, 48, 0.45);
  background: rgba(43, 45, 48, 0.18);
  color: #fff;
}

.email-auth-form {
  display: grid;
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.email-auth-submit {
  width: 100%;
}

.benefit {
  padding: calc(24 * var(--rpx));
  display: flex;
  gap: calc(20 * var(--rpx));
}

.benefit-title {
  color: #fff;
  font-size: calc(29 * var(--rpx));
  font-weight: 900;
}

.benefit-copy {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(23 * var(--rpx));
  line-height: 1.55;
}

.profile-head,
.member-card {
  padding: calc(24 * var(--rpx));
  display: flex;
  align-items: center;
  gap: calc(20 * var(--rpx));
}

.form-list {
  display: grid;
  gap: calc(18 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
}

.label {
  margin-bottom: calc(10 * var(--rpx));
  color: var(--soft);
  font-size: calc(24 * var(--rpx));
  font-weight: 900;
}

.member-list {
  display: grid;
  gap: calc(16 * var(--rpx));
}

.member-copy {
  flex: 1;
  min-width: 0;
}

.member-title {
  color: #fff;
  font-size: calc(27 * var(--rpx));
  font-weight: 900;
}

.member-need {
  margin-top: calc(8 * var(--rpx));
  color: #999;
  font-size: calc(22 * var(--rpx));
  line-height: 1.5;
}

.member-proof-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(8 * var(--rpx));
  margin-top: calc(10 * var(--rpx));
}

.member-proof-row span {
  padding: calc(6 * var(--rpx)) calc(10 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: rgba(43, 45, 48, 0.08);
  color: rgba(29, 31, 34, 0.66);
  font-size: calc(17 * var(--rpx));
  font-weight: 850;
}

.connect-button {
  min-width: calc(92 * var(--rpx));
}

.social-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
  margin-bottom: calc(20 * var(--rpx));
  color: var(--ui-ink, var(--ink));
}

.social-topbar span {
  flex: 1;
  text-align: center;
  font-size: calc(26 * var(--rpx));
  font-weight: 900;
}

.consensus-hero {
  align-items: flex-start;
}

.consensus-hero .p {
  max-width: calc(560 * var(--rpx));
}

.consensus-rule-grid,
.match-rule-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(14 * var(--rpx));
  margin: calc(18 * var(--rpx)) 0 calc(24 * var(--rpx));
}

.consensus-rule-grid div,
.match-rule-card {
  min-width: 0;
  border: calc(1 * var(--rpx)) solid var(--ui-line, rgba(43, 45, 48, 0.14));
  border-radius: calc(24 * var(--rpx));
  background: rgba(255, 255, 255, 0.42);
  padding: calc(18 * var(--rpx));
  color: var(--ui-ink, var(--ink));
  box-shadow: 0 calc(14 * var(--rpx)) calc(34 * var(--rpx)) rgba(43, 45, 48, 0.08);
}

.consensus-rule-grid b {
  display: block;
  color: var(--accent-orange);
  font-size: calc(30 * var(--rpx));
  line-height: 1;
}

.consensus-rule-grid span,
.match-rule-card span {
  display: block;
  margin-top: calc(8 * var(--rpx));
  color: rgba(32, 35, 38, 0.66);
  font-size: calc(21 * var(--rpx));
  line-height: 1.5;
}

.compact-section-head {
  margin: 0 0 calc(14 * var(--rpx));
}

.collab-brief-card,
.collab-host-card,
.consensus-entry-card {
  margin-top: calc(24 * var(--rpx));
}

.collab-brief-card {
  display: grid;
  gap: calc(18 * var(--rpx));
  padding: calc(26 * var(--rpx));
}

.collab-action-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 * var(--rpx));
}

.collab-preview {
  display: grid;
  gap: calc(8 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(201, 106, 43, 0.22);
  border-radius: calc(22 * var(--rpx));
  background:
    radial-gradient(circle at 0% 0%, rgba(201, 106, 43, 0.1), transparent 34%),
    rgba(255, 255, 255, 0.38);
  padding: calc(20 * var(--rpx));
}

.collab-preview b,
.collab-history-card b,
.match-rule-card b {
  color: var(--ui-ink, var(--ink));
  font-size: calc(25 * var(--rpx));
  line-height: 1.45;
}

.collab-preview span,
.collab-history-card span {
  color: rgba(32, 35, 38, 0.68);
  font-size: calc(22 * var(--rpx));
  line-height: 1.55;
}

.host-note-list {
  display: grid;
  gap: calc(14 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.host-note {
  display: grid;
  grid-template-columns: calc(18 * var(--rpx)) minmax(0, 1fr);
  gap: calc(12 * var(--rpx));
  color: rgba(32, 35, 38, 0.72);
  font-size: calc(23 * var(--rpx));
  line-height: 1.6;
}

.host-note span {
  width: calc(10 * var(--rpx));
  height: calc(10 * var(--rpx));
  margin-top: calc(12 * var(--rpx));
  border-radius: 999px;
  background: var(--accent-orange);
  box-shadow: 0 0 calc(18 * var(--rpx)) rgba(201, 106, 43, 0.36);
}

.match-rule-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.collab-history-list {
  display: grid;
  gap: calc(14 * var(--rpx));
}

.collab-history-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: calc(16 * var(--rpx));
  align-items: center;
  padding: calc(22 * var(--rpx));
}

.benefit-action {
  align-items: flex-start;
}

.inline-action {
  margin-top: calc(10 * var(--rpx));
  padding-inline: 0;
}

@media (max-width: 380px) {
  .consensus-rule-grid {
    grid-template-columns: 1fr;
  }

  .match-rule-grid,
  .collab-action-row {
    grid-template-columns: 1fr;
  }
}

.tabbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: calc(10 * var(--rpx)) calc(10 * var(--rpx)) max(calc(10 * var(--rpx)), env(safe-area-inset-bottom));
  border-top: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.08);
  background: rgba(26, 26, 24, 0.96);
  backdrop-filter: blur(18px);
}

.tab-item {
  min-height: calc(78 * var(--rpx));
  display: grid;
  place-items: center;
  color: #777;
  font-size: calc(22 * var(--rpx));
  font-weight: 800;
}

.tab-item.active {
  color: var(--orange);
}

/* 02-brand-iris.css */
/* Brand identity: Iris Blue Field / High Contrast Interface */
.hero-card,
.panel-card,
.scene-card,
.feed-card,
.benefit-card,
.metric-card,
.timeline-card,
.plan-card,
.profile-card,
.topic-card,
.daily-card,
.filter-card,
.process-card,
.radar-card,
.strategy-radar-card,
.diagnosis-insight-card,
.asset-module-card,
.value-anchor-grid,
.mvp-card,
.retention-card,
.asset-share-card,
.share-preview,
.next-step-card,
.journey-card,
.invite-card,
.login-card,
.email-auth-card,
.login-only-card,
.my-home-card,
.price-card,
.wecom-card,
.membership-active-card,
.wow-path-card,
.group-room-card {
  border-color: var(--line-cream);
  background:
    radial-gradient(circle at 88% 0%, rgba(43, 45, 48, 0.12), transparent 35%),
    rgba(240, 238, 233, 0.82);
  color: var(--ink);
  box-shadow: 0 calc(22 * var(--rpx)) calc(52 * var(--rpx)) rgba(17, 18, 20, 0.14);
}

.hero-card::before,
.strategy-radar-card::before,
.asset-share-card::before,
.price-card::before {
  content: "";
  position: absolute;
  right: calc(26 * var(--rpx));
  top: calc(24 * var(--rpx));
  width: calc(86 * var(--rpx));
  height: calc(86 * var(--rpx));
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, var(--milk-warm) 0 9%, rgba(43, 45, 48, 0.36) 10% 25%, rgba(43, 45, 48, 0.09) 26% 52%, transparent 53%),
    conic-gradient(from 220deg, transparent 0 22%, rgba(43, 45, 48, 0.2) 23% 26%, transparent 27% 55%, rgba(43, 45, 48, 0.18) 56% 59%, transparent 60%);
  box-shadow: 0 0 calc(44 * var(--rpx)) rgba(240, 238, 233, 0.36);
  pointer-events: none;
}

.hero-card::after,
.strategy-radar-card::after,
.asset-share-card::after,
.price-card::after {
  content: "";
  position: absolute;
  right: calc(8 * var(--rpx));
  top: calc(66 * var(--rpx));
  width: calc(132 * var(--rpx));
  height: calc(1 * var(--rpx));
  background: linear-gradient(90deg, transparent, rgba(43, 45, 48, 0.46), transparent);
  transform: rotate(-18deg);
  pointer-events: none;
}

.h1,
.h2,
.scene-title,
.daily-title,
.filter-title,
.mvp-title,
.asset-card-title,
.retention-title,
.timeline-title,
.plan-title,
.benefit-title,
.invite-title,
.member-title,
.post-name,
.profile-card .h1,
.login-only-card .h1,
.my-home-card .h1,
.price-card .h1,
.membership-active-card .h2 {
  color: var(--ink);
}

.p,
.hero-copy,
.scene-subtitle,
.daily-copy,
.mvp-copy,
.retention-text,
.metric-label,
.timeline-text,
.plan-text,
.asset-module-copy,
.journey-step p,
.invite-copy,
.login-note,
.benefit-copy,
.member-need,
.post-role,
.post-time,
.composer-hint {
  color: rgba(29, 31, 34, 0.74);
}

.page > .section-head .h2,
.page > .section-head .p,
.page > .section-head .muted,
.council-page .first-head .h2,
.council-page .first-head .p {
  color: var(--milk-white);
  text-shadow: 0 calc(1 * var(--rpx)) calc(18 * var(--rpx)) rgba(29, 31, 34, 0.16);
}

.eyebrow,
.daily-kicker,
.section-kicker,
.retention-day,
.share-brand,
.strategy-report-grid span,
.tab-item.active {
  color: var(--orange);
}

.primary-button {
  background: var(--orange);
  color: var(--milk-white);
  box-shadow: 0 calc(18 * var(--rpx)) calc(36 * var(--rpx)) rgba(201, 106, 43, 0.28);
}

.secondary-button,
.text-button,
.back-button,
.mode-button,
.choice,
.input,
.textarea,
.status-scan-option {
  border-color: rgba(43, 45, 48, 0.18);
  background: rgba(43, 45, 48, 0.08);
  color: var(--ink);
}

.input::placeholder,
.textarea::placeholder {
  color: rgba(29, 31, 34, 0.56);
}

.solid-icon,
.avatar,
.solid-icon.orange,
.solid-icon.green,
.avatar.orange,
.avatar.green,
.plan-index,
.success-mark {
  background:
    radial-gradient(circle at 50% 50%, var(--milk-warm) 0 10%, rgba(240, 238, 233, 0.48) 11% 28%, rgba(240, 238, 233, 0.08) 29% 55%, transparent 56%),
    var(--abyss-blue-deep);
  color: var(--milk-white);
}

.chip,
.mini-stat,
.retention-step,
.system-signal-list div,
.action-card-lab-grid div,
.asset-grid div,
.share-line,
.strategy-report-grid div,
.scan-stage-row span,
.value-anchor-grid,
.moments-social {
  border-color: rgba(43, 45, 48, 0.12);
  background: rgba(43, 45, 48, 0.08);
  color: var(--soft);
}

.status-scan-option small,
.asset-grid span,
.share-line span,
.mini-stat-label,
.metric-label,
.scan-stage-row span,
.asset-module-copy {
  color: rgba(29, 31, 34, 0.68);
}

.metric-number,
.mini-stat-value,
.price {
  color: var(--abyss-blue-deep);
}

.active-chip,
.scan-stage-row span.done,
.mode-button.active,
.asset-core,
.share-question {
  border-color: rgba(43, 45, 48, 0.24);
  background: rgba(43, 45, 48, 0.14);
  color: var(--ink);
}

.asset-share-card,
.strategy-report-card {
  background:
    radial-gradient(circle at 12% 0%, rgba(43, 45, 48, 0.14), transparent 28%),
    radial-gradient(circle at 92% 12%, rgba(167, 163, 156, 0.16), transparent 32%),
    rgba(240, 238, 233, 0.88);
}

.radar-orbit {
  border-color: rgba(43, 45, 48, 0.18);
  background:
    radial-gradient(circle at 50% 50%, rgba(43, 45, 48, 0.28), transparent 10%),
    radial-gradient(circle at 22% 30%, rgba(240, 238, 233, 0.74), transparent 13%),
    radial-gradient(circle at 78% 68%, rgba(167, 163, 156, 0.24), transparent 13%),
    rgba(43, 45, 48, 0.07);
}

.radar-orbit span {
  background: var(--milk-warm);
  box-shadow: 0 0 calc(24 * var(--rpx)) rgba(240, 238, 233, 0.8);
}

.radar-orbit span:nth-child(2),
.radar-row i {
  background: linear-gradient(90deg, var(--milk-white), var(--abyss-blue-soft));
}

.radar-orbit i {
  border-color: rgba(43, 45, 48, 0.22);
  background: rgba(43, 45, 48, 0.12);
}

.tabbar {
  border-top-color: rgba(240, 238, 233, 0.16);
  background: rgba(17, 18, 20, 0.9);
}

.tab-item {
  color: rgba(240, 238, 233, 0.58);
}

.tab-item.active {
  color: var(--orange);
}

.council-page .section-head.first-head {
  padding: calc(20 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(240, 238, 233, 0.14);
  border-radius: calc(28 * var(--rpx));
  background: rgba(17, 18, 20, 0.28);
}

.council-page .text-button {
  border-color: rgba(240, 238, 233, 0.22);
  background: rgba(240, 238, 233, 0.12);
  color: var(--milk-white);
}

.person-chip {
  border-color: rgba(240, 238, 233, 0.24);
  background: rgba(240, 238, 233, 0.14);
  color: rgba(240, 238, 233, 0.82);
}

.person-chip.active {
  background: var(--milk-white);
  color: var(--abyss-blue-deep);
}

.process-steps span {
  color: rgba(29, 31, 34, 0.78);
}

.bubble {
  border-color: rgba(43, 45, 48, 0.16);
  color: var(--ink);
}

.bubble.user {
  background: var(--abyss-blue-deep);
  border-color: rgba(240, 238, 233, 0.2);
  color: var(--milk-white);
}

.bubble.person {
  background: rgba(240, 238, 233, 0.88);
  border-color: rgba(43, 45, 48, 0.16);
  color: var(--ink);
}

.bubble.person b {
  color: var(--abyss-blue-deep);
}

.composer {
  border-color: rgba(240, 238, 233, 0.18);
  background: rgba(17, 18, 20, 0.92);
}

.council-page .composer .input {
  border-color: rgba(240, 238, 233, 0.3);
  background: rgba(240, 238, 233, 0.92);
  color: var(--ink);
}

.council-page .composer .input::placeholder {
  color: rgba(29, 31, 34, 0.56);
}

.council-page .composer .send-button {
  background: var(--milk-white);
  color: var(--abyss-blue-deep);
}

.modal {
  border-color: rgba(43, 45, 48, 0.16);
  background: var(--milk-white);
}

.modal-title {
  color: var(--ink);
}

.modal-content {
  color: rgba(29, 31, 34, 0.66);
}

.toast {
  background: rgba(17, 18, 20, 0.92);
  color: var(--milk-white);
}

.desktop-intro h1,
.landing-section-title,
.landing-proof b {
  color: var(--milk-white);
}

.landing-status {
  border-color: rgba(240, 238, 233, 0.18);
  background: rgba(240, 238, 233, 0.12);
  color: rgba(240, 238, 233, 0.86);
}

.landing-lead,
.desktop-intro p,
.landing-proof span {
  color: rgba(240, 238, 233, 0.8);
}

.landing-primary {
  background: var(--milk-white);
  color: var(--abyss-blue-deep);
  box-shadow: 0 18px 34px rgba(240, 238, 233, 0.16);
}

.landing-secondary,
.landing-proof div,
.landing-tags span,
.landing-flow span {
  border-color: rgba(240, 238, 233, 0.14);
  background: rgba(240, 238, 233, 0.08);
  color: var(--milk-white);
}

.landing-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 24px;
  color: rgba(240, 238, 233, 0.62);
  font-size: 12px;
  font-weight: 800;
}

.landing-legal a {
  color: inherit;
  text-decoration: none;
}

.landing-legal a:hover {
  color: var(--milk-white);
}

.landing-records {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin-top: 10px;
  color: rgba(240, 238, 233, 0.48);
  font-size: 11px;
  line-height: 1.4;
}

@media (hover: hover) and (pointer: fine) {
  .hero-card:hover,
  .scene-card:hover,
  .feed-card:hover,
  .plan-card:hover,
  .action-card-archive-item:hover,
  .profile-card:hover,
  .benefit-card:hover,
  .timeline-card:hover,
  .topic-card:hover {
    transform: translateY(calc(-3 * var(--rpx)));
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: 0 calc(30 * var(--rpx)) calc(60 * var(--rpx)) rgba(0, 0, 0, 0.28);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-card,
  .scene-card,
  .feed-card,
  .plan-card,
  .profile-card,
  .benefit-card,
  .timeline-card,
  .topic-card {
    transition: none;
  }
}

.toast {
  position: fixed;
  left: 50%;
  bottom: calc(132 * var(--rpx));
  z-index: 40;
  transform: translateX(-50%);
  max-width: calc(600 * var(--rpx));
  padding: calc(18 * var(--rpx)) calc(24 * var(--rpx));
  border-radius: calc(20 * var(--rpx));
  background: rgba(0, 0, 0, 0.78);
  color: #fff;
  font-size: calc(24 * var(--rpx));
  font-weight: 800;
}

.modal-mask {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: calc(40 * var(--rpx));
  background: rgba(0, 0, 0, 0.55);
}

.modal {
  width: 100%;
  max-width: 360px;
  max-height: calc(100dvh - calc(80 * var(--rpx)));
  overflow: auto;
  padding: calc(32 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(255, 255, 255, 0.12);
  border-radius: calc(28 * var(--rpx));
  background: #22221f;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.36);
}

.modal-title {
  color: #fff;
  font-size: calc(32 * var(--rpx));
  font-weight: 900;
}

.modal-content {
  margin-top: calc(18 * var(--rpx));
  color: rgba(240, 238, 233, 0.68);
  font-size: calc(25 * var(--rpx));
  line-height: 1.7;
}

.modal-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 * var(--rpx));
  margin-top: calc(28 * var(--rpx));
}

.intro-video-overlay {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  background:
    radial-gradient(ellipse at 50% 8%, rgba(158, 182, 196, 0.18), transparent 36%),
    rgba(8, 10, 12, 0.96);
  backdrop-filter: blur(18px);
}

.intro-video-panel {
  position: relative;
  width: min(100%, 430px);
  height: min(100%, 820px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(240, 238, 233, 0.14);
  border-radius: 28px;
  background: #080a0c;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.55);
}

.intro-video-topbar {
  min-height: 62px;
  padding: 12px 14px 12px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid rgba(240, 238, 233, 0.1);
  background: rgba(8, 10, 12, 0.82);
  color: var(--milk-white);
}

.intro-video-topbar div {
  display: grid;
  gap: 2px;
}

.intro-video-topbar span {
  color: var(--accent-orange);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 2px;
}

.intro-video-topbar b {
  font-size: 18px;
  font-weight: 950;
}

.intro-video-close {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(240, 238, 233, 0.1);
  color: var(--milk-white);
  font-size: 26px;
  line-height: 1;
}

.intro-video-player {
  width: 100%;
  height: 100%;
  background: #000;
  object-fit: contain;
}

@media (max-width: 899px) {
  input,
  textarea,
  select,
  .input,
  .textarea,
  .moments-textarea,
  .comment-input,
  .moments-comment-box .comment-input,
  .council-page .composer .input {
    font-size: 16px;
  }

  .council-page {
    height: 100vh;
    height: 100svh;
    min-height: 100svh;
    padding-bottom: calc(var(--tabbar-reserved-height) + var(--council-composer-reserved-height) + calc(14 * var(--rpx)));
  }

  .council-page .chat-panel {
    padding-bottom: calc(var(--council-composer-reserved-height) + calc(10 * var(--rpx)));
  }

  .council-page > .composer {
    position: fixed;
    z-index: 30;
    left: calc(22 * var(--rpx));
    right: calc(22 * var(--rpx));
    bottom: calc(var(--tabbar-reserved-height) + calc(10 * var(--rpx)));
    max-width: calc(430px - calc(44 * var(--rpx)));
    margin: 0 auto;
  }
}



@media (max-width: 430px) {
  .page {
    padding-top: calc(22 * var(--rpx));
    padding-left: calc(22 * var(--rpx));
    padding-right: calc(22 * var(--rpx));
    padding-bottom: calc(166 * var(--rpx));
  }

  .tabbar {
    padding-bottom: max(calc(12 * var(--rpx)), env(safe-area-inset-bottom));
  }

  .council-page {
    padding-bottom: calc(var(--tabbar-reserved-height) + var(--council-composer-reserved-height) + calc(20 * var(--rpx)));
  }

  .council-page .h2 {
    font-size: calc(34 * var(--rpx));
  }

  .council-page .p {
    font-size: calc(23 * var(--rpx));
    line-height: 1.45;
  }
}

@media (max-width: 380px) {
  .result-actions,
  .daily-actions,
  .modal-actions,
  .invite-form,
  .composer,
  .comment-box {
    grid-template-columns: 1fr;
  }

  .publish-button,
  .send-button,
  .invite-button {
    width: 100%;
    min-width: 0;
  }

  .metric-grid,
  .mini-stat-grid,
  .process-steps {
    grid-template-columns: 1fr;
  }

  .council-page .process-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: calc(8 * var(--rpx));
  }

  .council-page .process-steps span {
    min-height: calc(48 * var(--rpx));
    padding: 0 calc(6 * var(--rpx));
    font-size: calc(16 * var(--rpx));
  }

  .council-page .composer {
    grid-template-columns: minmax(0, 1fr) calc(104 * var(--rpx));
  }

  .post-actions {
    flex-wrap: wrap;
  }

  .bubble {
    max-width: 100%;
  }

  .qr-demo {
    width: calc(200 * var(--rpx));
    height: calc(200 * var(--rpx));
  }
}

@media (max-width: 340px) {
  .h1 {
    font-size: calc(50 * var(--rpx));
  }

  .scene-card,
  .topic-card {
    min-height: calc(138 * var(--rpx));
    gap: calc(16 * var(--rpx));
  }

  .benefit,
  .profile-head,
  .member-card,
  .post-head {
    gap: calc(14 * var(--rpx));
  }

  .council-page .text-button {
    min-height: calc(48 * var(--rpx));
    padding: 0 calc(12 * var(--rpx));
    font-size: calc(21 * var(--rpx));
  }

  .council-page .composer {
    grid-template-columns: minmax(0, 1fr) calc(96 * var(--rpx));
  }
}

@media (min-width: 900px) {
  /* 关键：全站 UI 按 750 设计稿宽映射 ~430px 缩放（--rpx 有上千处引用）。
     桌面端即便内容列变宽，也必须把 --rpx 锚定在 430 基准，否则所有组件会等比放大。 */
  :root {
    --rpx: calc(430px / 750);
  }

  /* 桌面端 = 正经内容站：单列全宽，App 即页面主体；顶部导航/内容列宽度见 12-silicon-os.css。 */
  .site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding: 0;
  }

  .phone-shell {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
  }

  .app-shell {
    width: 100%;
    min-height: 0;
    overflow-y: auto;
  }

  .council-page {
    height: 100%;
    min-height: 100%;
  }
}

/* 03-ritual-board.css */
/* 2026-05 ritual board refresh: future strategy console */
:root {
  --cloud-white: #f0eee9;
  --milk-white: #f0eee9;
  --milk-warm: #f7f5ef;
  --ink: #202326;
  --space-graphite: #2b2d30;
  --space-graphite-deep: #101214;
  --space-graphite-mid: #55595f;
  --accent-orange: #c96a2b;
  --signal-blue: #9eb6c4;
  --signal-blue-soft: rgba(158, 182, 196, 0.3);
  --console-line: rgba(43, 45, 48, 0.12);
  --console-card: rgba(240, 238, 233, 0.86);
  --console-card-strong: rgba(247, 245, 239, 0.96);
  --font-cn-display: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, serif;
  --font-cn-body: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Hiragino Sans GB", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-en-display: Syne, "Avenir Next", "SF Pro Display", Inter, sans-serif;
}

body {
  background:
    radial-gradient(circle at 72% 16%, rgba(240, 238, 233, 0.14), transparent 25%),
    linear-gradient(rgba(240, 238, 233, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240, 238, 233, 0.035) 1px, transparent 1px),
    linear-gradient(135deg, #202225 0%, #2b2d30 58%, #191b1e 100%);
  background-size: auto, 72px 72px, 72px 72px, auto;
}

.app-shell {
  color: var(--ink);
  background:
    linear-gradient(rgba(43, 45, 48, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 45, 48, 0.045) 1px, transparent 1px),
    radial-gradient(ellipse at 82% 4%, rgba(201, 106, 43, 0.1), transparent 34%),
    radial-gradient(ellipse at 14% 36%, rgba(158, 182, 196, 0.26), transparent 36%),
    linear-gradient(180deg, #f7f5ef 0%, #ebe7dd 100%);
  background-size: calc(72 * var(--rpx)) calc(72 * var(--rpx)), calc(72 * var(--rpx)) calc(72 * var(--rpx)), auto, auto, auto;
}

.page {
  background: transparent;
}

.page::after {
  background: linear-gradient(180deg, rgba(240, 238, 233, 0.16), rgba(240, 238, 233, 0));
  backdrop-filter: none;
}

.h1,
.h2,
.scene-title,
.daily-title,
.asset-card-title,
.retention-title,
.timeline-title,
.plan-title,
.benefit-title,
.member-title {
  color: var(--ink);
  font-family: var(--font-cn-display);
  letter-spacing: 0.03em;
}

.h1 {
  font-size: calc(56 * var(--rpx));
  line-height: 1.08;
}

.p,
.hero-copy,
.scene-subtitle,
.daily-copy,
.retention-text,
.timeline-text,
.plan-text,
.benefit-copy {
  color: rgba(32, 35, 38, 0.68);
}

.eyebrow,
.daily-kicker,
.section-kicker,
.ritual-mark,
.retention-day {
  color: var(--accent-orange);
  letter-spacing: calc(3 * var(--rpx));
}

.hero-card,
.panel-card,
.scene-card,
.feed-card,
.benefit-card,
.metric-card,
.timeline-card,
.plan-card,
.profile-card,
.topic-card,
.daily-card,
.filter-card,
.process-card,
.radar-card,
.strategy-radar-card,
.diagnosis-insight-card,
.asset-module-card,
.value-anchor-grid,
.mvp-card,
.retention-card,
.asset-share-card,
.share-preview,
.next-step-card,
.journey-card,
.invite-card,
.login-card,
.email-auth-card,
.login-only-card,
.my-home-card,
.price-card,
.wecom-card,
.membership-active-card {
  border-color: var(--console-line);
  background:
    radial-gradient(ellipse at 84% 0%, rgba(158, 182, 196, 0.18), transparent 44%),
    linear-gradient(135deg, rgba(247, 245, 239, 0.96), rgba(235, 231, 221, 0.86));
  color: var(--ink);
  box-shadow: 0 calc(20 * var(--rpx)) calc(54 * var(--rpx)) rgba(43, 45, 48, 0.13);
}

.page-scenes {
  padding-top: calc(18 * var(--rpx));
}

.ritual-stage {
  display: grid;
  gap: calc(22 * var(--rpx));
}

.ritual-hero {
  position: relative;
  overflow: hidden;
  padding: calc(40 * var(--rpx)) calc(34 * var(--rpx)) calc(34 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.14);
  border-radius: calc(38 * var(--rpx));
  background:
    linear-gradient(rgba(43, 45, 48, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 45, 48, 0.035) 1px, transparent 1px),
    radial-gradient(ellipse at 78% 8%, rgba(201, 106, 43, 0.12), transparent 32%),
    linear-gradient(135deg, rgba(247, 245, 239, 0.98), rgba(231, 238, 237, 0.9));
  background-size: calc(62 * var(--rpx)) calc(62 * var(--rpx)), calc(62 * var(--rpx)) calc(62 * var(--rpx)), auto, auto;
  box-shadow: 0 calc(24 * var(--rpx)) calc(70 * var(--rpx)) rgba(43, 45, 48, 0.16);
}

.ritual-hero::before {
  content: "";
  position: absolute;
  top: calc(28 * var(--rpx));
  right: calc(28 * var(--rpx));
  width: calc(84 * var(--rpx));
  height: calc(84 * var(--rpx));
  border-radius: 50%;
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.14);
  background:
    radial-gradient(circle, rgba(43, 45, 48, 0.28) 0 8%, transparent 9%),
    repeating-radial-gradient(circle, rgba(43, 45, 48, 0.1) 0 calc(1 * var(--rpx)), transparent calc(2 * var(--rpx)) calc(18 * var(--rpx)));
}

.ritual-hero::after {
  content: "";
  position: absolute;
  top: calc(68 * var(--rpx));
  right: calc(16 * var(--rpx));
  width: calc(120 * var(--rpx));
  height: calc(1 * var(--rpx));
  background: linear-gradient(90deg, transparent, rgba(43, 45, 48, 0.28), transparent);
  transform: rotate(-18deg);
}

.ritual-topline {
  display: flex;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
  margin-bottom: calc(18 * var(--rpx));
  color: var(--accent-orange);
  font-family: var(--font-mono);
  font-size: calc(18 * var(--rpx));
  font-weight: 900;
  letter-spacing: calc(4 * var(--rpx));
}

.ritual-hero .hero-copy {
  max-width: calc(560 * var(--rpx));
  margin-top: calc(20 * var(--rpx));
  font-size: calc(28 * var(--rpx));
  line-height: 1.72;
}

.video-intro-button {
  position: relative;
  z-index: 1;
  min-height: calc(84 * var(--rpx));
  margin-top: calc(24 * var(--rpx));
  padding: 0 calc(28 * var(--rpx));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(12 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.14);
  border-radius: calc(999 * var(--rpx));
  background:
    radial-gradient(circle at 22% 20%, rgba(255, 255, 255, 0.76), transparent 42%),
    rgba(43, 45, 48, 0.92);
  color: var(--milk-white);
  box-shadow: 0 calc(18 * var(--rpx)) calc(44 * var(--rpx)) rgba(43, 45, 48, 0.22);
}

.video-intro-button span {
  width: calc(34 * var(--rpx));
  height: calc(34 * var(--rpx));
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(240, 238, 233, 0.16);
  color: var(--accent-orange);
  font-size: calc(16 * var(--rpx));
}

.video-intro-button b {
  font-size: calc(24 * var(--rpx));
  font-weight: 950;
}

.wow-path-card {
  position: relative;
  z-index: 1;
  margin-top: calc(24 * var(--rpx));
  padding: calc(22 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
}

.wow-path-list {
  display: grid;
  gap: calc(10 * var(--rpx));
  margin-top: calc(12 * var(--rpx));
}

.wow-path-step {
  display: grid;
  grid-template-columns: calc(76 * var(--rpx)) minmax(0, 1fr);
  gap: calc(12 * var(--rpx));
  align-items: start;
  padding: calc(12 * var(--rpx)) 0;
  border-bottom: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.08);
}

.wow-path-step span {
  color: var(--accent-orange);
  font-family: var(--font-mono);
  font-size: calc(18 * var(--rpx));
  font-weight: 950;
}

.wow-path-step b {
  color: var(--ink);
  font-size: calc(22 * var(--rpx));
  font-weight: 950;
}

.wow-path-step em,
.wow-path-proof {
  color: rgba(29, 31, 34, 0.7);
  font-size: calc(20 * var(--rpx));
  line-height: 1.55;
  font-style: normal;
}

.wow-path-step em {
  grid-column: 2;
}

.wow-path-proof {
  margin-top: calc(14 * var(--rpx));
  padding: calc(14 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
  background: rgba(201, 106, 43, 0.1);
  color: rgba(29, 31, 34, 0.78);
  font-weight: 800;
}

.mode-switch-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(12 * var(--rpx));
  margin-top: calc(18 * var(--rpx));
}

.mode-switch-button {
  min-height: calc(118 * var(--rpx));
  padding: calc(18 * var(--rpx));
  display: grid;
  gap: calc(8 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(22 * var(--rpx));
  background: rgba(255, 255, 255, 0.48);
  color: var(--ink);
  text-align: left;
}

.mode-switch-button b {
  font-size: calc(24 * var(--rpx));
  font-weight: 950;
}

.mode-switch-button span {
  color: rgba(29, 31, 34, 0.66);
  font-size: calc(19 * var(--rpx));
  line-height: 1.45;
}

.ritual-entry-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: calc(30 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(28 * var(--rpx));
  overflow: hidden;
  background: rgba(255, 255, 255, 0.34);
}

.ritual-entry-grid::before,
.ritual-entry-grid::after {
  content: "";
  position: absolute;
  background: rgba(43, 45, 48, 0.1);
  pointer-events: none;
}

.ritual-entry-grid::before {
  top: 0;
  bottom: 0;
  left: 50%;
  width: calc(1 * var(--rpx));
}

.ritual-entry-grid::after {
  left: 0;
  right: 0;
  top: 50%;
  height: calc(1 * var(--rpx));
}

.ritual-entry-card {
  min-height: calc(184 * var(--rpx));
  padding: calc(22 * var(--rpx));
  display: grid;
  align-content: start;
  gap: calc(8 * var(--rpx));
  text-align: left;
  color: var(--ink);
  background: rgba(240, 238, 233, 0.16);
}

.ritual-entry-card b {
  font-size: calc(32 * var(--rpx));
  font-weight: 950;
}

.ritual-entry-card small,
.ritual-entry-card em {
  display: block;
  font-style: normal;
}

.ritual-entry-card small {
  color: rgba(32, 35, 38, 0.76);
  font-size: calc(22 * var(--rpx));
  font-weight: 850;
}

.ritual-entry-card em {
  color: rgba(32, 35, 38, 0.62);
  font-size: calc(20 * var(--rpx));
  line-height: 1.45;
}

.ritual-mark {
  font-family: var(--font-mono);
  font-size: calc(16 * var(--rpx));
  font-weight: 900;
}

.ritual-primary {
  width: 100%;
  min-height: calc(96 * var(--rpx));
  margin-top: calc(28 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
}

.ritual-member-anchor {
  width: 100%;
  padding: calc(26 * var(--rpx));
  display: grid;
  gap: calc(8 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(201, 106, 43, 0.18);
  border-radius: calc(30 * var(--rpx));
  background:
    radial-gradient(ellipse at 92% 0%, rgba(201, 106, 43, 0.14), transparent 40%),
    rgba(240, 238, 233, 0.8);
  text-align: left;
  color: var(--ink);
}

.ritual-member-anchor span {
  color: var(--accent-orange);
  font-family: var(--font-mono);
  font-size: calc(20 * var(--rpx));
  font-weight: 900;
  letter-spacing: calc(2 * var(--rpx));
}

.ritual-member-anchor b {
  font-size: calc(30 * var(--rpx));
  font-weight: 950;
}

.ritual-member-anchor small {
  color: rgba(32, 35, 38, 0.64);
  font-size: calc(22 * var(--rpx));
  line-height: 1.5;
}

.strategy-radar-card,
.retention-card,
.daily-card,
.scene-list,
.mini-stat-grid,
.section-head,
.topic-card {
  margin-top: calc(22 * var(--rpx));
}

.strategy-radar-card {
  border-style: solid;
}

.radar-orbit {
  border-color: rgba(43, 45, 48, 0.12);
  background:
    radial-gradient(circle at 50% 50%, rgba(158, 182, 196, 0.38), transparent 10%),
    radial-gradient(circle at 22% 30%, rgba(240, 238, 233, 0.96), transparent 13%),
    radial-gradient(circle at 78% 68%, rgba(240, 238, 233, 0.92), transparent 13%),
    rgba(255, 255, 255, 0.22);
}

.radar-orbit::before,
.radar-orbit::after {
  border-color: rgba(43, 45, 48, 0.14);
}

.system-signal-list div,
.mini-stat,
.process-steps span {
  border-color: rgba(43, 45, 48, 0.11);
  background: rgba(255, 255, 255, 0.3);
  color: rgba(32, 35, 38, 0.74);
}

.scene-card,
.topic-card {
  border-radius: calc(26 * var(--rpx));
}

.solid-icon,
.avatar,
.solid-icon.orange,
.solid-icon.green,
.avatar.orange,
.avatar.green {
  background: var(--space-graphite);
  color: var(--milk-white);
}

.page-scenes .section-head .h2,
.page-scenes .section-head .text-button {
  color: var(--ink);
  text-shadow: none;
}

.primary-button {
  background: var(--accent-orange);
  color: var(--milk-white);
  box-shadow: 0 calc(18 * var(--rpx)) calc(38 * var(--rpx)) rgba(201, 106, 43, 0.26);
}

.secondary-button,
.text-button,
.back-button,
.choice,
.input,
.textarea,
.status-scan-option {
  border-color: rgba(43, 45, 48, 0.14);
  background: rgba(255, 255, 255, 0.38);
  color: var(--ink);
}

.tabbar {
  border-top-color: rgba(240, 238, 233, 0.1);
  background: rgba(43, 45, 48, 0.94);
}

.tab-item {
  color: rgba(240, 238, 233, 0.56);
}

.tab-item.active {
  color: var(--accent-orange);
}

.desktop-intro {
  color: var(--milk-white);
}

.landing-video-button {
  height: 48px;
  margin-top: 26px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid rgba(240, 238, 233, 0.16);
  border-radius: 999px;
  background:
    radial-gradient(circle at 22% 18%, rgba(255, 255, 255, 0.3), transparent 42%),
    rgba(240, 238, 233, 0.09);
  color: var(--milk-white);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
}

.landing-video-button span {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(240, 238, 233, 0.12);
  color: var(--accent-orange);
  font-size: 12px;
}

.landing-video-button b {
  font-size: 15px;
  font-weight: 900;
}

.landing-module-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 28px;
  border: 1px solid rgba(240, 238, 233, 0.13);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(240, 238, 233, 0.055);
}

.landing-module-grid button {
  min-height: 112px;
  padding: 18px;
  display: grid;
  align-content: center;
  gap: 6px;
  border-right: 1px solid rgba(240, 238, 233, 0.1);
  border-bottom: 1px solid rgba(240, 238, 233, 0.1);
  text-align: left;
  color: var(--milk-white);
}

.landing-module-grid button:nth-child(2n) {
  border-right: 0;
}

.landing-module-grid button:nth-child(n + 3) {
  border-bottom: 0;
}

.landing-module-grid span {
  color: var(--accent-orange);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 2px;
}

.landing-module-grid b {
  font-size: 22px;
  line-height: 1.1;
}

.landing-module-grid small {
  color: rgba(240, 238, 233, 0.68);
  font-size: 13px;
  font-weight: 800;
}

@media (hover: hover) and (pointer: fine) {
  .ritual-entry-card:hover,
  .ritual-member-anchor:hover,
  .landing-module-grid button:hover {
    background: rgba(255, 255, 255, 0.46);
  }
}

@media (max-width: 380px) {
  .ritual-entry-card {
    min-height: calc(170 * var(--rpx));
    padding: calc(18 * var(--rpx));
  }

  .ritual-entry-card b {
    font-size: calc(29 * var(--rpx));
  }

  .ritual-entry-card em {
    font-size: calc(18 * var(--rpx));
  }
}

/* 桌面端旧两栏落地页样式已移除——全宽内容站布局见 12-silicon-os.css。 */

/* 04-minimal-home.css */
/* Minimal field home: four choices, fewer words */
.page-scenes {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding-top: calc(78 * var(--rpx));
  padding-bottom: calc(var(--tabbar-reserved-height) + calc(24 * var(--rpx)));
}

.page-scenes::before {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(64 * var(--rpx));
  z-index: 0;
  width: calc(660 * var(--rpx));
  height: calc(660 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.08);
  border-radius: 50%;
  transform: translateX(-50%);
  background:
    radial-gradient(circle at 50% 50%, rgba(201, 106, 43, 0.16), transparent 9%),
    radial-gradient(circle at 46% 54%, rgba(43, 45, 48, 0.08), transparent 24%),
    conic-gradient(from 220deg, transparent 0 18%, rgba(201, 106, 43, 0.16) 21%, transparent 27% 48%, rgba(43, 45, 48, 0.1) 52%, transparent 58% 100%);
  opacity: 0.72;
  mask-image: radial-gradient(circle, transparent 0 14%, #000 15% 67%, transparent 68%);
  pointer-events: none;
}

.page-scenes::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse at 50% 39%, rgba(240, 238, 233, 0.72), transparent 30%),
    linear-gradient(180deg, rgba(247, 246, 243, 0), rgba(247, 246, 243, 0.32) 74%, rgba(247, 246, 243, 0.72));
  pointer-events: none;
}

.decision-field {
  position: absolute;
  left: 50%;
  top: calc(120 * var(--rpx));
  z-index: 0;
  width: min(calc(620 * var(--rpx)), 84vw);
  height: calc(430 * var(--rpx));
  transform: translateX(-50%);
  pointer-events: none;
  opacity: 0.86;
}

.decision-field::before,
.decision-field::after,
.decision-field i {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.decision-field::before {
  left: 50%;
  top: 50%;
  width: 84%;
  height: 54%;
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.08);
  transform: translate(-50%, -50%) rotate(-10deg);
}

.decision-field::after {
  left: 50%;
  top: 50%;
  width: calc(84 * var(--rpx));
  height: calc(84 * var(--rpx));
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle, rgba(240, 238, 233, 0.95) 0 18%, rgba(201, 106, 43, 0.32) 19% 32%, rgba(43, 45, 48, 0.08) 33% 100%);
  box-shadow: 0 0 calc(48 * var(--rpx)) rgba(201, 106, 43, 0.16);
}

.decision-field i {
  left: 50%;
  top: 50%;
  width: calc(430 * var(--rpx));
  height: calc(1 * var(--rpx));
  transform: translate(-50%, -50%) rotate(-10deg);
  background: linear-gradient(90deg, transparent, rgba(43, 45, 48, 0.12), rgba(201, 106, 43, 0.32), transparent);
}

.decision-field span {
  position: absolute;
  width: calc(15 * var(--rpx));
  height: calc(15 * var(--rpx));
  border-radius: 50%;
  background: rgba(201, 106, 43, 0.62);
  box-shadow: 0 0 calc(24 * var(--rpx)) rgba(201, 106, 43, 0.2);
}

.decision-field span:nth-child(1) {
  left: 19%;
  top: 42%;
}

.decision-field span:nth-child(2) {
  right: 22%;
  top: 31%;
  width: calc(11 * var(--rpx));
  height: calc(11 * var(--rpx));
  background: rgba(43, 45, 48, 0.34);
}

.decision-field span:nth-child(3) {
  right: 34%;
  bottom: 24%;
  width: calc(10 * var(--rpx));
  height: calc(10 * var(--rpx));
  background: rgba(240, 238, 233, 0.9);
}

.page-scenes .ritual-stage {
  position: relative;
  z-index: 1;
  display: grid;
  place-content: center;
  width: 100%;
  min-height: calc(100dvh - var(--tabbar-reserved-height) - calc(126 * var(--rpx)));
  margin: 0;
}

.page-scenes .ritual-hero {
  padding: calc(34 * var(--rpx)) 0 calc(24 * var(--rpx));
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

.page-scenes .ritual-hero::before,
.page-scenes .ritual-hero::after {
  display: none;
}

.page-scenes .ritual-topline {
  justify-content: center;
  margin-bottom: calc(14 * var(--rpx));
  color: rgba(201, 106, 43, 0.92);
  font-size: calc(17 * var(--rpx));
}

.page-scenes .h1 {
  max-width: calc(560 * var(--rpx));
  margin: 0 auto;
  font-size: calc(50 * var(--rpx));
}

.page-scenes .ritual-hero .hero-copy {
  max-width: calc(560 * var(--rpx));
  margin: calc(14 * var(--rpx)) auto 0;
  font-size: calc(22 * var(--rpx));
  line-height: 1.55;
  text-align: center;
}

.page-scenes .ritual-entry-grid {
  max-width: calc(560 * var(--rpx));
  margin: calc(38 * var(--rpx)) auto 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-color: rgba(43, 45, 48, 0.16);
  border-radius: calc(18 * var(--rpx));
  background: rgba(247, 245, 239, 0.48);
}

.page-scenes .ritual-entry-card {
  min-height: calc(132 * var(--rpx));
  place-items: center;
  align-content: center;
  padding: calc(18 * var(--rpx));
  text-align: center;
  background: rgba(255, 255, 255, 0.12);
}

.page-scenes .ritual-entry-card b {
  font-size: calc(34 * var(--rpx));
  line-height: 1.08;
}

.page-scenes .ritual-entry-card small {
  margin-top: calc(2 * var(--rpx));
  color: rgba(32, 35, 38, 0.58);
  font-size: calc(19 * var(--rpx));
}

.page-scenes .ritual-entry-card em {
  display: none;
}

.page-scenes .ritual-mark {
  font-size: calc(15 * var(--rpx));
  letter-spacing: calc(2 * var(--rpx));
}

.tabbar {
  grid-template-columns: repeat(3, 1fr);
  padding: calc(12 * var(--rpx)) calc(26 * var(--rpx)) max(calc(18 * var(--rpx)), env(safe-area-inset-bottom));
  border-top-color: rgba(43, 45, 48, 0.08);
  background:
    linear-gradient(180deg, rgba(247, 245, 239, 0.72), rgba(240, 238, 233, 0.94));
  backdrop-filter: blur(calc(18 * var(--rpx))) saturate(1.05);
  box-shadow: 0 calc(-18 * var(--rpx)) calc(42 * var(--rpx)) rgba(43, 45, 48, 0.06);
}

.tab-item {
  min-height: calc(70 * var(--rpx));
  color: rgba(43, 45, 48, 0.5);
  font-size: calc(23 * var(--rpx));
  font-weight: 700;
}

.tab-item.active {
  color: var(--accent-orange);
}

.page-dialogue {
  height: 100dvh;
  min-height: 100dvh;
  padding-bottom: calc(var(--tabbar-reserved-height) + calc(18 * var(--rpx)));
  display: flex;
  flex-direction: column;
  gap: calc(16 * var(--rpx));
  overflow: hidden;
}

.dialogue-hero {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: calc(16 * var(--rpx));
  align-items: start;
  padding: calc(24 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(28 * var(--rpx));
  background:
    radial-gradient(ellipse at 88% 0%, rgba(201, 106, 43, 0.12), transparent 42%),
    rgba(247, 245, 239, 0.72);
  box-shadow: 0 calc(18 * var(--rpx)) calc(42 * var(--rpx)) rgba(43, 45, 48, 0.08);
}

.dialogue-hero .h2 {
  margin-top: calc(6 * var(--rpx));
}

.dialogue-recommend-panel {
  flex: 0 0 auto;
  margin-top: 0;
}

.directory-section-title {
  flex: 0 0 auto;
  color: rgba(32, 35, 38, 0.58);
  font-size: calc(20 * var(--rpx));
  font-weight: 950;
  letter-spacing: calc(2 * var(--rpx));
}

.agent-directory {
  flex: 0 0 min(34dvh, calc(330 * var(--rpx)));
  display: grid;
  gap: calc(12 * var(--rpx));
  min-height: calc(210 * var(--rpx));
  padding-right: calc(2 * var(--rpx));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.agent-directory::-webkit-scrollbar,
.dialogue-thread::-webkit-scrollbar {
  display: none;
}

.agent-directory-card {
  min-height: calc(156 * var(--rpx));
  display: grid;
  grid-template-columns: calc(78 * var(--rpx)) minmax(0, 1fr) auto;
  gap: calc(16 * var(--rpx));
  align-items: center;
  padding: calc(16 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.1);
  border-radius: calc(24 * var(--rpx));
  background: rgba(247, 245, 239, 0.62);
  color: var(--ink);
  text-align: left;
}

.agent-directory-card.active {
  border-color: rgba(201, 106, 43, 0.36);
  background:
    linear-gradient(135deg, rgba(247, 245, 239, 0.95), rgba(240, 238, 233, 0.72)),
    rgba(201, 106, 43, 0.08);
  box-shadow: inset calc(5 * var(--rpx)) 0 0 var(--accent-orange);
}

.agent-directory-card .avatar {
  width: calc(76 * var(--rpx));
  height: calc(76 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
}

.agent-directory-main {
  min-width: 0;
}

.agent-name {
  color: var(--ink);
  font-size: calc(28 * var(--rpx));
  font-weight: 950;
  line-height: 1.15;
}

.agent-role {
  margin-top: calc(4 * var(--rpx));
  color: rgba(32, 35, 38, 0.62);
  font-size: calc(21 * var(--rpx));
  line-height: 1.35;
}

.agent-specialties {
  display: flex;
  flex-wrap: wrap;
  gap: calc(8 * var(--rpx));
  margin-top: calc(10 * var(--rpx));
}

.agent-specialties span {
  padding: calc(6 * var(--rpx)) calc(10 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: rgba(43, 45, 48, 0.08);
  color: rgba(32, 35, 38, 0.66);
  font-size: calc(18 * var(--rpx));
  font-weight: 800;
}

.agent-enter {
  padding: calc(8 * var(--rpx)) calc(12 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: rgba(201, 106, 43, 0.12);
  color: var(--accent-orange);
  font-size: calc(18 * var(--rpx));
  font-weight: 950;
}

.dialogue-panel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.12);
  border-radius: calc(28 * var(--rpx));
  background:
    linear-gradient(rgba(43, 45, 48, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 45, 48, 0.035) 1px, transparent 1px),
    rgba(247, 245, 239, 0.74);
  background-size: calc(52 * var(--rpx)) calc(52 * var(--rpx)), calc(52 * var(--rpx)) calc(52 * var(--rpx)), auto;
}

.dialogue-persona {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: calc(82 * var(--rpx)) minmax(0, 1fr);
  gap: calc(16 * var(--rpx));
  align-items: center;
  padding-bottom: calc(14 * var(--rpx));
  border-bottom: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.1);
}

.dialogue-persona .avatar {
  width: calc(82 * var(--rpx));
  height: calc(82 * var(--rpx));
  border-radius: calc(20 * var(--rpx));
}

.agent-skill-path {
  margin-top: calc(4 * var(--rpx));
  color: rgba(201, 106, 43, 0.76);
  font-family: var(--font-mono);
  font-size: calc(16 * var(--rpx));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dialogue-thread {
  flex: 1;
  min-height: 0;
  padding: calc(16 * var(--rpx)) 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.page-dialogue .bubble {
  border-color: rgba(43, 45, 48, 0.12);
  background: rgba(255, 255, 255, 0.52);
  color: rgba(32, 35, 38, 0.86);
}

.page-dialogue .bubble.user {
  background: rgba(201, 106, 43, 0.14);
  border-color: rgba(201, 106, 43, 0.24);
}

.dialogue-composer {
  flex: 0 0 auto;
  border-color: rgba(43, 45, 48, 0.1);
  background: rgba(240, 238, 233, 0.88);
  box-shadow: none;
}

.dialogue-composer .input,
.dialogue-composer .send-button {
  min-height: calc(68 * var(--rpx));
  border-radius: calc(18 * var(--rpx));
}

.dialogue-composer .input {
  min-width: 0;
  padding: 0 calc(18 * var(--rpx));
}

.dialogue-composer .send-button {
  width: 100%;
  min-width: 0;
  box-shadow: none;
}

.page-dialogue-directory .agent-directory {
  flex: 0 0 auto;
  max-height: none;
  min-height: 0;
  overflow: visible;
}

.page-dialogue-directory {
  height: auto;
  min-height: 100dvh;
  overflow: visible;
}

.page-dialogue-chat {
  position: relative;
  min-height: 100dvh;
  height: 100dvh;
  padding: calc(20 * var(--rpx)) calc(28 * var(--rpx)) calc(128 * var(--rpx));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 84% 10%, rgba(201, 106, 43, 0.08), transparent 28%),
    radial-gradient(ellipse at 14% 32%, rgba(158, 182, 196, 0.18), transparent 30%),
    linear-gradient(rgba(43, 45, 48, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 45, 48, 0.026) 1px, transparent 1px);
  background-size: auto, auto, calc(72 * var(--rpx)) calc(72 * var(--rpx)), calc(72 * var(--rpx)) calc(72 * var(--rpx));
}

.dialogue-chat-topbar {
  position: relative;
  z-index: 2;
  min-height: calc(76 * var(--rpx));
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}

.dialogue-top-actions {
  display: flex;
  gap: calc(12 * var(--rpx));
}

.dialogue-icon-button {
  width: calc(64 * var(--rpx));
  height: calc(64 * var(--rpx));
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(247, 245, 239, 0.58);
  color: rgba(32, 35, 38, 0.54);
  font-size: calc(34 * var(--rpx));
  font-weight: 300;
  box-shadow: 0 calc(18 * var(--rpx)) calc(42 * var(--rpx)) rgba(43, 45, 48, 0.08);
}

.dialogue-chat-title {
  color: rgba(32, 35, 38, 0.42);
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
  letter-spacing: calc(2 * var(--rpx));
  white-space: nowrap;
}

.dialogue-chat-stage {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: calc(18 * var(--rpx));
}

.dialogue-chat-intro {
  width: min(100%, calc(560 * var(--rpx)));
  margin: auto auto calc(24 * var(--rpx));
  display: grid;
  justify-items: center;
  gap: calc(16 * var(--rpx));
  text-align: center;
  color: rgba(32, 35, 38, 0.62);
}

.dialogue-divider {
  width: min(calc(300 * var(--rpx)), 70%);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: calc(18 * var(--rpx));
  color: rgba(32, 35, 38, 0.36);
  font-size: calc(20 * var(--rpx));
  letter-spacing: calc(4 * var(--rpx));
}

.dialogue-divider span {
  height: calc(1 * var(--rpx));
  background: rgba(32, 35, 38, 0.14);
}

.dialogue-divider em {
  font-style: normal;
}

.dialogue-chat-avatar .avatar {
  width: calc(92 * var(--rpx));
  height: calc(92 * var(--rpx));
  border-radius: calc(24 * var(--rpx));
  box-shadow: 0 calc(18 * var(--rpx)) calc(38 * var(--rpx)) rgba(43, 45, 48, 0.12);
}

.dialogue-chat-intro h2 {
  color: rgba(32, 35, 38, 0.7);
  font-size: calc(42 * var(--rpx));
  font-weight: 500;
  line-height: 1.1;
}

.dialogue-chat-intro p {
  max-width: calc(520 * var(--rpx));
  color: rgba(32, 35, 38, 0.58);
  font-size: calc(24 * var(--rpx));
  line-height: 1.9;
}

.dialogue-chat-thread {
  max-height: 42dvh;
  flex: 0 1 auto;
  display: flex;
  flex-direction: column;
  gap: calc(14 * var(--rpx));
  padding: calc(8 * var(--rpx)) 0;
}

.page-dialogue-chat .bubble {
  max-width: 88%;
  border-color: rgba(43, 45, 48, 0.1);
  background: rgba(247, 245, 239, 0.58);
  color: rgba(32, 35, 38, 0.72);
  box-shadow: 0 calc(12 * var(--rpx)) calc(28 * var(--rpx)) rgba(43, 45, 48, 0.06);
}

.page-dialogue-chat .bubble.user {
  align-self: flex-end;
  background: rgba(201, 106, 43, 0.12);
  border-color: rgba(201, 106, 43, 0.18);
}

.dialogue-chat-composer {
  position: absolute;
  left: calc(28 * var(--rpx));
  right: calc(28 * var(--rpx));
  bottom: max(calc(28 * var(--rpx)), env(safe-area-inset-bottom));
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(72 * var(--rpx));
  gap: calc(10 * var(--rpx));
  padding: calc(12 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: rgba(247, 245, 239, 0.72);
  box-shadow: 0 calc(20 * var(--rpx)) calc(56 * var(--rpx)) rgba(43, 45, 48, 0.12);
  backdrop-filter: blur(calc(18 * var(--rpx)));
}

.dialogue-chat-composer .input {
  height: calc(70 * var(--rpx));
  border: 0;
  background: transparent;
  color: rgba(32, 35, 38, 0.72);
  font-size: calc(24 * var(--rpx));
}

.dialogue-chat-composer .send-button {
  width: calc(72 * var(--rpx));
  height: calc(72 * var(--rpx));
  min-height: calc(72 * var(--rpx));
  border-radius: 50%;
  background: rgba(240, 238, 233, 0.78);
  color: rgba(32, 35, 38, 0.36);
  font-size: calc(28 * var(--rpx));
  box-shadow: none;
}

@media (max-width: 380px) {
  .page-scenes .ritual-entry-card {
    min-height: calc(120 * var(--rpx));
  }

  .page-scenes .h1 {
    font-size: calc(46 * var(--rpx));
  }
}

/* 桌面端旧落地页居中样式已移除——全宽内容站布局见 12-silicon-os.css。 */

/* 05-interaction.css */
/* Interaction layer: tactile, quiet, and fast enough to feel native. */
.app-shell.is-transitioning .page {
  animation: pageReveal 480ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.app-shell.is-transitioning .tabbar {
  animation: tabbarSettle 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.app-shell.micro-feedback::before {
  content: attr(data-feedback);
  position: fixed;
  left: 50%;
  top: max(calc(24 * var(--rpx)), env(safe-area-inset-top));
  z-index: 80;
  transform: translateX(-50%);
  padding: calc(10 * var(--rpx)) calc(18 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(240, 238, 233, 0.34);
  border-radius: calc(999 * var(--rpx));
  background: rgba(29, 31, 34, 0.72);
  color: var(--milk-white);
  font-size: calc(18 * var(--rpx));
  font-weight: 900;
  letter-spacing: calc(2 * var(--rpx));
  box-shadow: 0 calc(18 * var(--rpx)) calc(42 * var(--rpx)) rgba(17, 18, 20, 0.22);
  backdrop-filter: blur(calc(18 * var(--rpx))) saturate(1.12);
  pointer-events: none;
  animation: feedbackLift 720ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.primary-button,
.secondary-button,
.text-button,
.back-button,
.choice,
.ritual-entry-card,
.agent-directory-card,
.recommended-agent-button,
.tab-item,
.dialogue-icon-button,
.moments-camera-button,
.moments-cover-camera,
.moments-more {
  transition:
    transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 220ms ease,
    background 220ms ease,
    box-shadow 220ms ease,
    opacity 180ms ease;
  -webkit-tap-highlight-color: transparent;
}

.tap-feedback {
  transform: scale(0.975);
}

.choice.is-selected {
  transform: scale(0.985);
  border-color: rgba(201, 106, 43, 0.7);
  background:
    radial-gradient(circle at 88% 50%, rgba(201, 106, 43, 0.18), transparent 32%),
    rgba(247, 245, 239, 0.88);
  box-shadow:
    inset calc(4 * var(--rpx)) 0 0 var(--accent-orange),
    0 calc(14 * var(--rpx)) calc(36 * var(--rpx)) rgba(43, 45, 48, 0.1);
}

.scan-stage-row span.current {
  position: relative;
  border-color: rgba(201, 106, 43, 0.38);
  background: rgba(201, 106, 43, 0.1);
  color: var(--accent-orange);
  animation: scanCurrentPulse 1.8s ease-in-out infinite;
}

.scan-stage-row span.current::after {
  content: "";
  position: absolute;
  right: calc(10 * var(--rpx));
  top: 50%;
  width: calc(7 * var(--rpx));
  height: calc(7 * var(--rpx));
  border-radius: 50%;
  background: var(--accent-orange);
  transform: translateY(-50%);
  box-shadow: 0 0 calc(16 * var(--rpx)) rgba(201, 106, 43, 0.56);
}

.ritual-entry-card,
.agent-directory-card {
  position: relative;
  overflow: hidden;
}

.ritual-entry-card::before,
.agent-directory-card::before {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: calc(15 * var(--rpx));
  height: calc(1 * var(--rpx));
  background: linear-gradient(90deg, transparent, rgba(201, 106, 43, 0.56), transparent);
  opacity: 0;
  transform: scaleX(0.34);
  transform-origin: center;
  transition:
    opacity 240ms ease,
    transform 300ms cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
}

.ritual-entry-card.tap-feedback::before,
.agent-directory-card.tap-feedback::before {
  opacity: 1;
  transform: scaleX(1);
}

.recommended-agent-button.tap-feedback,
.agent-directory-card.tap-feedback,
.ritual-entry-card.tap-feedback {
  border-color: rgba(201, 106, 43, 0.36);
  box-shadow: 0 calc(18 * var(--rpx)) calc(46 * var(--rpx)) rgba(43, 45, 48, 0.12);
}

.dialogue-chat-avatar .avatar {
  animation: avatarArrival 620ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.bubble:not(.typing-bubble) {
  animation: messageRise 300ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.typing-bubble {
  animation: thinkingBreath 1.5s ease-in-out infinite;
}

@media (hover: hover) and (pointer: fine) {
  .ritual-entry-card:hover::before,
  .agent-directory-card:hover::before {
    opacity: 1;
    transform: scaleX(1);
  }

  .primary-button:hover,
  .recommended-agent-button:hover,
  .agent-directory-card:hover,
  .dialogue-icon-button:hover {
    transform: translateY(calc(-2 * var(--rpx)));
  }
}

@keyframes pageReveal {
  from {
    opacity: 0;
    transform: translateY(calc(16 * var(--rpx))) scale(0.992);
    filter: blur(calc(4 * var(--rpx)));
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes tabbarSettle {
  from {
    opacity: 0.72;
    transform: translateY(calc(12 * var(--rpx)));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes feedbackLift {
  0% {
    opacity: 0;
    transform: translate(-50%, calc(-8 * var(--rpx))) scale(0.96);
  }
  22%, 74% {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, calc(-6 * var(--rpx))) scale(0.985);
  }
}

@keyframes scanCurrentPulse {
  0%, 100% {
    box-shadow: 0 0 0 rgba(201, 106, 43, 0);
  }
  50% {
    box-shadow: 0 0 calc(28 * var(--rpx)) rgba(201, 106, 43, 0.18);
  }
}

@keyframes avatarArrival {
  from {
    opacity: 0;
    transform: translateY(calc(12 * var(--rpx))) scale(0.92);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes messageRise {
  from {
    opacity: 0;
    transform: translateY(calc(8 * var(--rpx)));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes thinkingBreath {
  0%, 100% {
    opacity: 0.72;
  }
  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-shell.is-transitioning .page,
  .app-shell.is-transitioning .tabbar,
  .app-shell.micro-feedback::before,
  .choice.is-selected,
  .scan-stage-row span.current,
  .dialogue-chat-avatar .avatar,
  .bubble:not(.typing-bubble),
  .typing-bubble {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    filter: none !important;
  }

  @keyframes pageReveal {
    from { opacity: 1; }
    to { opacity: 1; }
  }
}

/* 06-app-refinement.css */
/* Original app UI refinement. Keep the existing product flow and upgrade only the visual/interaction layer. */
:root {
  --font-cn-display: "PingFang SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans GB", sans-serif;
  --font-cn-body: "PingFang SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans GB", sans-serif;
  --font-en-display: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --font-mono: "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
  --ui-paper: #f0eee9;
  --ui-paper-soft: #f8f7f3;
  --ui-paper-warm: #ebe7dd;
  --ui-ink: #1d1f22;
  --ui-muted: rgba(29, 31, 34, 0.62);
  --ui-line: rgba(43, 45, 48, 0.12);
  --ui-panel: rgba(248, 247, 243, 0.76);
  --ui-panel-strong: rgba(248, 247, 243, 0.94);
  --ui-shadow: rgba(43, 45, 48, 0.12);
  --ui-action: var(--accent-orange);
}

html,
body {
  width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,
button,
input,
textarea {
  font-family: var(--font-cn-body);
}

.app-shell {
  color: var(--ui-ink);
  background:
    radial-gradient(circle at 50% 16%, rgba(255, 255, 255, 0.54), transparent 25%),
    radial-gradient(circle at 82% 20%, rgba(201, 106, 43, 0.1), transparent 24%),
    radial-gradient(circle at 14% 72%, rgba(43, 45, 48, 0.08), transparent 28%),
    linear-gradient(rgba(43, 45, 48, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 45, 48, 0.035) 1px, transparent 1px),
    linear-gradient(180deg, var(--ui-paper-soft), var(--ui-paper));
  background-size:
    auto,
    auto,
    auto,
    calc(74 * var(--rpx)) calc(74 * var(--rpx)),
    calc(74 * var(--rpx)) calc(74 * var(--rpx)),
    auto;
}

.page {
  color: var(--ui-ink);
  padding-top: max(calc(26 * var(--rpx)), env(safe-area-inset-top));
}

.page::after {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.24), transparent 32%);
}

.h1,
.h2,
.scene-title,
.daily-title,
.asset-card-title,
.member-title,
.plan-title,
.benefit-title,
.timeline-title,
.retention-title {
  font-family: var(--font-cn-display);
  letter-spacing: 0;
  color: var(--ui-ink);
}

.h1 {
  font-size: clamp(28px, calc(50 * var(--rpx)), 40px);
  line-height: 1.12;
  font-weight: 650;
}

.h2,
.daily-title {
  font-size: clamp(20px, calc(34 * var(--rpx)), 28px);
  line-height: 1.25;
  font-weight: 650;
}

.p,
.hero-copy,
.daily-copy,
.scene-subtitle,
.timeline-text,
.plan-text,
.benefit-copy,
.retention-text {
  color: var(--ui-muted);
  line-height: 1.72;
}

.eyebrow,
.daily-kicker,
.section-kicker,
.ritual-mark,
.retention-day {
  color: var(--ui-action);
  font-family: var(--font-en-display);
  letter-spacing: calc(2.4 * var(--rpx));
}

.hero-card,
.panel-card,
.scene-card,
.feed-card,
.benefit-card,
.metric-card,
.timeline-card,
.plan-card,
.profile-card,
.topic-card,
.daily-card,
.filter-card,
.process-card,
.radar-card,
.strategy-radar-card,
.diagnosis-insight-card,
.asset-module-card,
.value-anchor-grid,
.mvp-card,
.retention-card,
.asset-share-card,
.share-preview,
.next-step-card,
.journey-card,
.invite-card,
.login-card,
.email-auth-card,
.login-only-card,
.my-home-card,
.price-card,
.wecom-card,
.membership-active-card,
.ritual-member-anchor,
.dialogue-hero,
.dialogue-panel,
.recommended-agent-panel,
.agent-directory-card,
.council-decision-card {
  border-color: var(--ui-line);
  background:
    radial-gradient(circle at 84% 0%, rgba(255, 255, 255, 0.68), transparent 34%),
    linear-gradient(135deg, var(--ui-panel-strong), rgba(240, 238, 233, 0.72));
  color: var(--ui-ink);
  box-shadow:
    0 calc(22 * var(--rpx)) calc(58 * var(--rpx)) rgba(43, 45, 48, 0.1),
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(calc(18 * var(--rpx))) saturate(1.05);
}

.primary-button {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.14), transparent 42%),
    var(--ui-action);
  color: var(--ui-paper-soft);
  box-shadow:
    0 calc(16 * var(--rpx)) calc(34 * var(--rpx)) rgba(201, 106, 43, 0.24),
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.22);
}

.secondary-button,
.text-button,
.back-button,
.choice,
.input,
.textarea,
.status-scan-option {
  border-color: var(--ui-line);
  background: rgba(255, 255, 255, 0.46);
  color: var(--ui-ink);
}

.page-scenes {
  padding-inline: calc(34 * var(--rpx));
}

.page-scenes .ritual-stage {
  place-content: center;
}

.page-scenes .ritual-hero {
  width: min(100%, calc(600 * var(--rpx)));
  margin: 0 auto;
}

.page-scenes .h1 {
  font-size: clamp(34px, calc(58 * var(--rpx)), 46px);
  font-weight: 680;
}

.page-scenes .ritual-hero .hero-copy {
  max-width: calc(520 * var(--rpx));
  color: rgba(29, 31, 34, 0.66);
  font-size: clamp(15px, calc(24 * var(--rpx)), 18px);
}

.page-scenes .ritual-entry-grid {
  width: min(100%, calc(572 * var(--rpx)));
  border-radius: calc(22 * var(--rpx));
  background:
    linear-gradient(rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0.2)),
    rgba(240, 238, 233, 0.6);
  box-shadow:
    0 calc(24 * var(--rpx)) calc(60 * var(--rpx)) rgba(43, 45, 48, 0.08),
    inset 0 0 0 calc(1 * var(--rpx)) rgba(255, 255, 255, 0.44);
}

.page-scenes .ritual-entry-card {
  min-height: calc(142 * var(--rpx));
  transition:
    transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
    background 220ms ease,
    box-shadow 220ms ease;
}

.page-scenes .ritual-entry-card b {
  font-size: clamp(22px, calc(35 * var(--rpx)), 28px);
  font-weight: 650;
}

.page-scenes .ritual-entry-card small {
  color: rgba(29, 31, 34, 0.54);
  font-size: clamp(12px, calc(19 * var(--rpx)), 15px);
}

.page-scenes .ritual-entry-card:active,
.page-scenes .ritual-entry-card.tap-feedback {
  transform: scale(0.975);
  background: rgba(255, 255, 255, 0.46);
}

.decision-field {
  filter: blur(0);
  opacity: 0.66;
}

.tabbar {
  left: 0;
  right: 0;
  border-top-color: rgba(43, 45, 48, 0.08);
  background:
    linear-gradient(180deg, rgba(248, 247, 243, 0.66), rgba(240, 238, 233, 0.96));
  color: var(--ui-ink);
  box-shadow:
    0 calc(-18 * var(--rpx)) calc(44 * var(--rpx)) rgba(43, 45, 48, 0.06),
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.7);
}

.tab-item {
  border-radius: calc(18 * var(--rpx));
  color: rgba(29, 31, 34, 0.46);
  letter-spacing: 0;
  transition:
    transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
    color 180ms ease,
    background 180ms ease;
}

.tab-item.active {
  color: var(--ui-action);
  background: rgba(255, 255, 255, 0.38);
}

.tab-item:active {
  transform: scale(0.95);
}

.page-feed {
  padding: 0 0 calc(var(--tabbar-reserved-height) + calc(22 * var(--rpx)));
  background: #f6f6f2;
}

.moments-shell {
  background: #f6f6f2;
}

.moments-cover {
  height: calc(320 * var(--rpx));
  background:
    radial-gradient(circle at 70% 18%, rgba(255, 255, 255, 0.2), transparent 24%),
    radial-gradient(circle at 18% 78%, rgba(201, 106, 43, 0.22), transparent 28%),
    linear-gradient(120deg, rgba(240, 238, 233, 0.08) 0 calc(1 * var(--rpx)), transparent calc(1 * var(--rpx)) calc(22 * var(--rpx))),
    linear-gradient(135deg, #151719 0%, #2b2d30 54%, #191b1e 100%);
}

.moments-post {
  transition:
    transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
    background 180ms ease;
}

.moments-post:active {
  transform: scale(0.992);
  background: rgba(255, 255, 255, 0.64);
}

.moments-content {
  color: rgba(29, 31, 34, 0.9);
  font-size: clamp(16px, calc(27 * var(--rpx)), 20px);
}

.perspective-button {
  border-radius: calc(12 * var(--rpx));
  background: rgba(87, 107, 149, 0.08);
}

.page-dialogue,
.page-dialogue-chat,
.council-page,
.page-assets,
.page-membership {
  background:
    radial-gradient(circle at 78% 8%, rgba(201, 106, 43, 0.08), transparent 25%),
    linear-gradient(rgba(43, 45, 48, 0.028) calc(1 * var(--rpx)), transparent calc(1 * var(--rpx))),
    linear-gradient(90deg, rgba(43, 45, 48, 0.028) calc(1 * var(--rpx)), transparent calc(1 * var(--rpx))),
    linear-gradient(180deg, var(--ui-paper-soft), var(--ui-paper));
  background-size:
    auto,
    calc(72 * var(--rpx)) calc(72 * var(--rpx)),
    calc(72 * var(--rpx)) calc(72 * var(--rpx)),
    auto;
}

.agent-directory-card,
.recommended-agent-button {
  transition:
    transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.agent-directory-card:active,
.recommended-agent-button:active {
  transform: scale(0.985);
}

.dialogue-chat-topbar {
  padding-top: max(0px, env(safe-area-inset-top));
}

.dialogue-chat-composer {
  background: rgba(248, 247, 243, 0.84);
  box-shadow:
    0 calc(20 * var(--rpx)) calc(56 * var(--rpx)) rgba(43, 45, 48, 0.12),
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.7);
}

.dialogue-chat-composer .send-button,
.council-page .composer .send-button {
  color: var(--ui-paper-soft);
  background: var(--ui-action);
}

.council-page {
  padding-top: max(calc(22 * var(--rpx)), env(safe-area-inset-top));
}

.council-page .section-head.first-head {
  padding: calc(24 * var(--rpx)) calc(26 * var(--rpx));
  border: calc(1 * var(--rpx)) solid rgba(43, 45, 48, 0.1);
  border-radius: calc(28 * var(--rpx));
  background:
    radial-gradient(circle at 88% 10%, rgba(201, 106, 43, 0.12), transparent 34%),
    linear-gradient(135deg, rgba(248, 247, 243, 0.96), rgba(240, 238, 233, 0.78));
  box-shadow:
    0 calc(18 * var(--rpx)) calc(44 * var(--rpx)) rgba(43, 45, 48, 0.09),
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.72);
}

.council-page .first-head .h2 {
  color: var(--ui-ink);
  text-shadow: none;
}

.council-page .first-head .p {
  color: rgba(29, 31, 34, 0.62);
  text-shadow: none;
}

.council-page .first-head .text-button {
  border-color: rgba(43, 45, 48, 0.12);
  background: rgba(255, 255, 255, 0.44);
  color: var(--ui-action);
}

.council-back-home {
  border-radius: calc(999 * var(--rpx));
}

.council-page .process-card {
  background:
    radial-gradient(circle at 88% 0%, rgba(201, 106, 43, 0.12), transparent 36%),
    rgba(248, 247, 243, 0.78);
}

.person-chip {
  border-color: rgba(43, 45, 48, 0.12);
  background: rgba(255, 255, 255, 0.46);
  color: rgba(29, 31, 34, 0.62);
}

.person-chip.active {
  background: var(--ui-ink);
  color: var(--ui-paper-soft);
}

.bubble {
  border-color: rgba(43, 45, 48, 0.1);
  background: rgba(255, 255, 255, 0.5);
  color: rgba(29, 31, 34, 0.78);
  box-shadow: 0 calc(10 * var(--rpx)) calc(26 * var(--rpx)) rgba(43, 45, 48, 0.06);
}

.bubble.user {
  background: rgba(201, 106, 43, 0.12);
  border-color: rgba(201, 106, 43, 0.18);
}

.bubble.person {
  background: rgba(255, 255, 255, 0.58);
  border-color: rgba(43, 45, 48, 0.1);
}

.chat-panel,
.dialogue-thread,
.dialogue-chat-thread,
.agent-directory {
  scrollbar-width: none;
}

.chat-panel::-webkit-scrollbar,
.dialogue-thread::-webkit-scrollbar,
.dialogue-chat-thread::-webkit-scrollbar,
.agent-directory::-webkit-scrollbar {
  display: none;
}

.composer {
  border-color: rgba(43, 45, 48, 0.1);
  background: rgba(248, 247, 243, 0.86);
  box-shadow: 0 calc(14 * var(--rpx)) calc(34 * var(--rpx)) rgba(43, 45, 48, 0.08);
}

.app-shell.is-transitioning .page {
  animation-duration: 360ms;
}

.primary-button:active,
.secondary-button:active,
.text-button:active,
.back-button:active,
.moments-camera-button:active,
.moments-more:active,
.perspective-button:active,
.plan-card:active,
.asset-module-card:active {
  transform: scale(0.97);
}

@media (max-width: 380px) {
  .page-scenes {
    padding-inline: calc(24 * var(--rpx));
  }

  .page-scenes .h1 {
    font-size: calc(50 * var(--rpx));
  }

  .page-scenes .ritual-hero .hero-copy {
    font-size: calc(22 * var(--rpx));
  }

  .page-scenes .ritual-entry-card {
    min-height: calc(130 * var(--rpx));
  }

  .tab-item {
    font-size: calc(22 * var(--rpx));
  }
}

/* 07-mobile-audit.css */
/* PM audit pass: keep mobile H5 pages inside the viewport and make navigation states clearer. */
.site,
.phone-shell,
.app-shell,
.page {
  max-width: 100vw;
  overflow-x: hidden;
}

.page-scenes,
.page-scenes .ritual-stage,
.page-scenes .ritual-hero,
.page-scenes .ritual-entry-grid {
  min-width: 0;
}

.page-scenes .ritual-stage {
  width: 100%;
  max-width: 100%;
}

.page-scenes .ritual-hero,
.page-scenes .ritual-entry-grid {
  width: 100%;
  max-width: min(100%, calc(560 * var(--rpx)));
}

.hero-copy-stack,
.hero-copy-stack span,
.landing-lead-stack,
.landing-lead-stack span {
  max-width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.page-scenes .ritual-hero .hero-copy {
  width: 100%;
  max-width: min(100%, calc(520 * var(--rpx)));
}

.page-scenes .ritual-entry-card {
  min-width: 0;
}

.moments-profile {
  right: max(calc(16 * var(--rpx)), 10px);
  max-width: calc(100% - max(calc(32 * var(--rpx)), 20px));
}

.moments-profile-name {
  max-width: calc(100vw - calc(170 * var(--rpx)));
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.moments-profile .avatar {
  width: clamp(52px, calc(88 * var(--rpx)), 62px);
  height: clamp(52px, calc(88 * var(--rpx)), 62px);
}

.moments-profile .agent-avatar-img {
  object-fit: cover;
  object-position: center;
}

.dialogue-top-actions {
  min-width: 0;
}

.dialogue-icon-button {
  font-family: var(--font-cn-body);
}

.delivery-progress-card,
.pending-payment-card {
  border-color: var(--ui-line);
  background:
    radial-gradient(circle at 84% 0%, rgba(255, 255, 255, 0.68), transparent 34%),
    linear-gradient(135deg, var(--ui-panel-strong), rgba(240, 238, 233, 0.72));
  color: var(--ui-ink);
  box-shadow:
    0 calc(18 * var(--rpx)) calc(44 * var(--rpx)) rgba(43, 45, 48, 0.09),
    inset 0 calc(1 * var(--rpx)) 0 rgba(255, 255, 255, 0.7);
}

.delivery-step {
  background: rgba(43, 45, 48, 0.055);
}

.delivery-step b {
  color: var(--ui-ink);
}

.delivery-step p {
  color: var(--ui-muted);
}

.pending-payment-card code {
  background: rgba(43, 45, 48, 0.06);
  color: var(--ui-muted);
}

@media (max-width: 430px) {
  html,
  body {
    min-height: 100dvh;
    overflow-x: hidden;
    background:
      linear-gradient(rgba(43, 45, 48, 0.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(43, 45, 48, 0.045) 1px, transparent 1px),
      radial-gradient(ellipse at 82% 4%, rgba(201, 106, 43, 0.1), transparent 34%),
      radial-gradient(ellipse at 14% 36%, rgba(158, 182, 196, 0.26), transparent 36%),
      linear-gradient(180deg, #f7f5ef 0%, #ebe7dd 100%);
    background-size:
      calc(72 * var(--rpx)) calc(72 * var(--rpx)),
      calc(72 * var(--rpx)) calc(72 * var(--rpx)),
      auto,
      auto,
      auto;
  }

  .site {
    display: block;
    width: 100vw;
    max-width: 100vw;
    min-height: 100dvh;
    overflow-x: hidden;
  }

  .phone-shell,
  .app-shell {
    width: 100vw !important;
    max-width: 100vw !important;
    min-height: 100dvh;
  }

  .tabbar {
    position: fixed;
    bottom: 0;
    transform: translateZ(0);
  }

  .page-membership {
    padding-inline: 16px;
  }

  .page-membership > .login-only-card,
  .page-membership > .journey-card,
  .page-membership > .my-home-card,
  .page-membership > .invite-card,
  .page-membership > .pending-payment-card,
  .page-membership > .membership-active-card,
  .page-membership > .delivery-progress-card,
  .page-membership > .renewal-card,
  .page-membership > .price-card,
  .page-membership > .wecom-card {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    min-width: 0;
    margin-inline: auto;
    overflow: hidden;
  }

  .page-membership .primary-button,
  .page-membership .secondary-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .login-only-card .wechat-login-primary,
  .login-only-card .dev-login-button,
  .login-only-card .login-note {
    width: calc(100% - 32px);
    max-width: calc(100% - 32px);
    margin-left: auto;
    margin-right: auto;
  }

  .login-only-card .login-note {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .page-scenes {
    padding-inline: clamp(18px, calc(34 * var(--rpx)), 22px);
  }

  .page-scenes .h1 {
    font-size: clamp(32px, calc(54 * var(--rpx)), 38px);
  }

  .page-scenes .ritual-hero .hero-copy {
    font-size: clamp(14px, calc(23 * var(--rpx)), 17px);
    line-height: 1.7;
  }

  .page-scenes .ritual-entry-grid {
    margin-top: calc(30 * var(--rpx));
  }
}

/* 08-editorial-final.css */
/* Final preview override: keep the full H5 on one restrained editorial system. */
:root {
  --visual-paper: #f6f3ec;
  --visual-paper-strong: #fffdf8;
  --visual-ink: #1c1d1f;
  --visual-ink-soft: rgba(28, 29, 31, 0.66);
  --visual-line: rgba(28, 29, 31, 0.12);
  --visual-copper: #bd6427;
  --visual-copper-deep: #9f4f1d;
  --visual-graphite: #2a2c2f;
  --cloud-white: var(--visual-paper);
  --milk-white: var(--visual-paper);
  --milk-warm: var(--visual-paper-strong);
  --ink: var(--visual-ink);
  --accent-orange: var(--visual-copper);
  --orange: var(--visual-copper);
  --font-cn-display: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-cn-body: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-en-display: -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, Arial, sans-serif;
  --font-mono: -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, Arial, sans-serif;
}

html,
body,
button,
input,
textarea,
.h1,
.h2,
.eyebrow,
.daily-kicker,
.ritual-topline,
.ritual-mark,
.scene-title,
.daily-title,
.asset-card-title,
.retention-title,
.timeline-title,
.plan-title,
.benefit-title {
  font-family: var(--font-cn-body) !important;
  letter-spacing: 0 !important;
}

body,
.app-shell {
  color: var(--visual-ink);
  background:
    linear-gradient(rgba(28, 29, 31, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(28, 29, 31, 0.035) 1px, transparent 1px),
    var(--visual-paper) !important;
  background-size: 42px 42px, 42px 42px, auto !important;
}

.page,
.page::after,
.page-scenes::before,
.page-scenes::after,
.ritual-hero::before,
.ritual-hero::after,
.ritual-entry-grid::before,
.ritual-entry-grid::after {
  background-image: none !important;
  backdrop-filter: none !important;
}

.page-scenes {
  display: block !important;
  overflow-y: auto !important;
  padding: calc(28 * var(--rpx)) calc(28 * var(--rpx)) calc(var(--tabbar-reserved-height) + calc(28 * var(--rpx))) !important;
}

.ritual-stage,
.page-scenes .ritual-stage,
.ritual-hero,
.page-scenes .ritual-hero,
.ritual-entry-grid,
.page-scenes .ritual-entry-grid {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.hero-card,
.panel-card,
.scene-card,
.feed-card,
.benefit-card,
.metric-card,
.timeline-card,
.plan-card,
.profile-card,
.topic-card,
.ritual-hero,
.scan-intent-panel,
.wow-path-card,
.mode-switch-button,
.ritual-entry-card,
.group-room-card,
.process-card,
.council-decision-card,
.council-verdict-actions,
.login-only-card,
.my-home-card,
.price-card,
.wecom-card,
.membership-active-card,
.membership-asset-preview-card,
.renewal-card,
.action-card-lab,
.journey-card,
.invite-growth-card,
.invite-card,
.pending-payment-card,
.delivery-progress-card,
.next-step-card,
.asset-auto-card,
.asset-module-card,
.radar-card,
.consensus-hero,
.thought-action-panel,
.moments-post,
.hot-topic-panel {
  border: 1px solid var(--visual-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 253, 248, 0.86) !important;
  box-shadow: 0 12px 28px rgba(28, 29, 31, 0.08) !important;
  backdrop-filter: none !important;
}

.ritual-hero,
.page-scenes .ritual-hero {
  padding: calc(34 * var(--rpx)) calc(28 * var(--rpx)) !important;
  overflow: visible !important;
}

.h1 {
  color: var(--visual-ink) !important;
  font-size: clamp(34px, calc(54 * var(--rpx)), 42px) !important;
  line-height: 1.12 !important;
  font-weight: 760 !important;
}

.h2,
.daily-title,
.asset-card-title {
  color: var(--visual-ink) !important;
  font-weight: 760 !important;
}

.p,
.hero-copy,
.daily-copy,
.wow-path-step em,
.wow-path-proof,
.mode-switch-button span,
.ritual-entry-card em {
  color: var(--visual-ink-soft) !important;
}

.eyebrow,
.daily-kicker,
.ritual-topline,
.ritual-mark,
.wow-path-step span {
  color: var(--visual-copper) !important;
  font-weight: 760 !important;
}

.primary-button,
.hero-primary-cta,
.send-button,
.moments-primary {
  border-radius: 8px !important;
  background: var(--visual-copper) !important;
  color: var(--visual-paper-strong) !important;
  box-shadow: none !important;
}

.secondary-button,
.text-button,
.moments-secondary,
.hot-topic-refresh {
  border: 1px solid var(--visual-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 253, 248, 0.68) !important;
  color: var(--visual-ink) !important;
  box-shadow: none !important;
}

.video-intro-button {
  border-radius: 8px !important;
  background: var(--visual-graphite) !important;
  color: var(--visual-paper-strong) !important;
  box-shadow: none !important;
}

.scan-intent-input,
.input,
.comment-input,
.moments-textarea {
  border: 1px solid var(--visual-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 253, 248, 0.72) !important;
  color: var(--visual-ink) !important;
  box-shadow: none !important;
}

.mode-switch-grid,
.ritual-entry-grid {
  gap: calc(10 * var(--rpx)) !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

.mode-switch-button,
.ritual-entry-card {
  min-width: 0 !important;
  background: rgba(255, 253, 248, 0.74) !important;
}

.tabbar {
  left: calc(16 * var(--rpx)) !important;
  right: calc(16 * var(--rpx)) !important;
  bottom: max(calc(12 * var(--rpx)), env(safe-area-inset-bottom)) !important;
  width: auto !important;
  border: 1px solid var(--visual-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 253, 248, 0.94) !important;
  box-shadow: 0 14px 32px rgba(28, 29, 31, 0.14) !important;
}

.tab {
  border-radius: 6px !important;
  letter-spacing: 0 !important;
}

.tab.active {
  background: var(--visual-ink) !important;
  color: var(--visual-paper-strong) !important;
}

.bubble {
  border-radius: 8px !important;
  box-shadow: none !important;
}

.bubble.user {
  background: var(--visual-graphite) !important;
  color: var(--visual-paper-strong) !important;
}

.bubble.person {
  background: rgba(255, 253, 248, 0.82) !important;
  color: var(--visual-ink) !important;
}

#app,
.site,
.phone-shell,
.app-shell,
.page,
.page > *,
.ritual-stage,
.ritual-hero,
.scan-intent-panel,
.wow-path-card,
.mode-switch-grid,
.ritual-entry-grid,
.group-room-card,
.process-card,
.council-decision-card,
.council-verdict-actions,
.membership-asset-preview-card,
.login-only-card,
.price-card,
.journey-card,
.moments-shell,
.moments-feed,
.hot-topic-panel,
.moments-post {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.page-feed,
.page-feed .moments-shell,
.page-feed .moments-feed,
.page-feed .moments-post,
.page-feed .moments-post-main,
.page-feed .moments-social,
.page-feed .moments-comment-box,
.page-feed .hot-topic-panel {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.page-feed {
  padding-inline: 0 !important;
  overflow-x: clip !important;
}

.page-feed .moments-shell {
  margin-inline: 0 !important;
  overflow-x: clip !important;
}

.page-feed .moments-feed {
  padding-inline: clamp(12px, calc(20 * var(--rpx)), 16px) !important;
  overflow-x: hidden !important;
}

.page-feed .moments-post {
  grid-template-columns: clamp(52px, calc(74 * var(--rpx)), 58px) minmax(0, 1fr) !important;
  gap: clamp(10px, calc(16 * var(--rpx)), 14px) !important;
  overflow: hidden !important;
}

.page-feed .moments-content,
.page-feed .comment-row,
.page-feed .like-row {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.app-shell,
.page {
  overflow-x: hidden !important;
}

.scan-intent-input,
.input,
.comment-input,
.moments-textarea,
.primary-button,
.secondary-button,
.text-button,
.video-intro-button {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.scan-intent-input,
.input,
.comment-input,
.moments-textarea,
.hero-copy-stack span,
.daily-copy,
.p {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.council-page .section-head.first-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  align-items: start !important;
  column-gap: calc(18 * var(--rpx)) !important;
}

.council-page .section-head.first-head > div {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.council-page .first-head .h2,
.council-page .first-head .p {
  writing-mode: horizontal-tb !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-break: auto !important;
}

.council-page .first-head .text-button {
  width: auto !important;
  min-width: max-content !important;
  max-width: max-content !important;
  justify-self: end !important;
}

@media (max-width: 420px) {
  .page-scenes {
    padding-inline: 16px !important;
  }

  .ritual-hero,
  .page-scenes .ritual-hero {
    padding: 22px 18px !important;
  }

  .mode-switch-grid,
  .ritual-entry-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 09-landing-contrast.css */
/* 桌面端页脚（原两栏落地页已移除，合规信息移入 .site-footer，仅 ≥900px 显示）。 */
.site-footer .site-footer-inner {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 24px;
  padding: 12px 24px;
}

.site-footer-brand {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.site-footer-brand b {
  color: var(--visual-ink);
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.site-footer-brand span {
  color: rgba(28, 29, 31, 0.55);
  font-size: 12px;
  line-height: 1.5;
}

.site-footer .landing-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}

.site-footer .landing-legal a {
  color: rgba(28, 29, 31, 0.6);
  font-size: 12px;
  text-decoration: none;
}

.site-footer .landing-legal a:hover {
  color: var(--visual-copper);
}

.site-footer .landing-records {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  color: rgba(28, 29, 31, 0.45);
  font-size: 11px;
}

.experience-section-head {
  display: grid;
  gap: calc(5 * var(--rpx));
  margin: calc(22 * var(--rpx)) 0 calc(10 * var(--rpx));
}

.experience-section-head span {
  color: var(--visual-copper);
  font-size: calc(20 * var(--rpx));
  font-weight: 760;
}

.experience-section-head b {
  color: var(--visual-ink);
  font-size: calc(28 * var(--rpx));
  line-height: 1.25;
  font-weight: 760;
}

.experience-entry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(10 * var(--rpx)) !important;
  margin-top: 0 !important;
}

.experience-entry-button {
  position: relative;
  isolation: isolate;
  min-height: calc(160 * var(--rpx)) !important;
  padding: calc(18 * var(--rpx)) !important;
  display: grid !important;
  grid-template-rows: auto auto 1fr;
  gap: calc(8 * var(--rpx)) !important;
  overflow: hidden;
  border-color: rgba(189, 100, 39, 0.22) !important;
  background:
    radial-gradient(circle at 100% 100%, rgba(189, 100, 39, 0.16), transparent 44%),
    linear-gradient(135deg, rgba(255, 254, 250, 0.98), rgba(247, 243, 235, 0.84)) !important;
  box-shadow:
    0 calc(1 * var(--rpx)) calc(1 * var(--rpx)) rgba(28, 29, 31, 0.08),
    0 calc(14 * var(--rpx)) calc(26 * var(--rpx)) rgba(87, 72, 55, 0.08) !important;
  text-align: left !important;
}

.experience-button-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(8 * var(--rpx));
}

.experience-button-glow {
  position: absolute;
  inset: auto calc(-36 * var(--rpx)) calc(-44 * var(--rpx)) auto;
  z-index: -1;
  width: calc(132 * var(--rpx));
  height: calc(132 * var(--rpx));
  border-radius: 50%;
  background: rgba(189, 100, 39, 0.12);
}

.experience-button-mark {
  width: calc(42 * var(--rpx));
  height: calc(42 * var(--rpx));
  display: grid;
  place-items: center;
  border: 1px solid rgba(189, 100, 39, 0.28);
  border-radius: 8px;
  background: rgba(189, 100, 39, 0.08);
  color: var(--visual-copper) !important;
  font-size: calc(21 * var(--rpx));
  font-weight: 760;
}

.experience-button-arrow {
  width: calc(36 * var(--rpx));
  height: calc(36 * var(--rpx));
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(28, 29, 31, 0.9);
  color: #fffaf2;
  font-size: calc(18 * var(--rpx));
  font-weight: 760;
  line-height: 1;
  box-shadow: 0 calc(8 * var(--rpx)) calc(18 * var(--rpx)) rgba(28, 29, 31, 0.18);
}

.experience-entry-button b {
  color: var(--visual-ink) !important;
  font-size: calc(28 * var(--rpx)) !important;
  line-height: 1.08 !important;
  font-weight: 760 !important;
}

.experience-entry-button em {
  color: rgba(28, 29, 31, 0.62) !important;
  font-size: calc(18 * var(--rpx)) !important;
  line-height: 1.42 !important;
  font-style: normal;
}

.experience-entry-button:active {
  transform: translateY(calc(1 * var(--rpx))) scale(0.99);
}

@media (max-width: 420px) {
  .experience-entry-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .experience-entry-button {
    min-height: 126px !important;
    padding: 13px !important;
  }

  .experience-entry-button b {
    font-size: 21px !important;
  }

  .experience-entry-button em {
    font-size: 13px !important;
  }

  .experience-button-arrow {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
}

/* 10-journey.css */
/* Journey layer: global problem-journey bar, resume card, sideline grid. */

.journey-bar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  gap: calc(12 * var(--rpx));
  margin: 0 0 calc(24 * var(--rpx));
  padding: calc(14 * var(--rpx)) calc(16 * var(--rpx));
  background: var(--visual-paper-strong, #fffdf8);
  border: 1px solid var(--visual-line, rgba(28, 29, 31, 0.12));
  border-radius: calc(20 * var(--rpx));
  box-shadow: 0 calc(6 * var(--rpx)) calc(18 * var(--rpx)) rgba(28, 29, 31, 0.05);
}

.journey-home {
  flex: 0 0 auto;
  width: calc(56 * var(--rpx));
  height: calc(56 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(30 * var(--rpx));
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
  background: transparent;
  border: 1px solid var(--visual-line, rgba(28, 29, 31, 0.12));
  border-radius: calc(16 * var(--rpx));
}

.journey-track {
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: calc(4 * var(--rpx));
  min-width: 0;
}

.journey-node {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(8 * var(--rpx));
  padding: calc(4 * var(--rpx)) 0;
  background: transparent;
  border: none;
  min-width: 0;
}

.journey-node i {
  width: calc(40 * var(--rpx));
  height: calc(40 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  font-style: normal;
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
  background: var(--visual-paper-soft, #ede8dd);
  border: 1px solid var(--visual-line, rgba(28, 29, 31, 0.12));
  border-radius: 50%;
  transition: transform 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.journey-node span {
  font-size: calc(20 * var(--rpx));
  line-height: 1.2;
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
  white-space: nowrap;
  transform-origin: center top;
}

.journey-node.done i {
  color: var(--visual-paper-strong, #fffdf8);
  background: var(--visual-graphite, #2a2c2f);
  border-color: var(--visual-graphite, #2a2c2f);
}

.journey-node.current i {
  color: #fff;
  background: var(--visual-copper, #bd6427);
  border-color: var(--visual-copper, #bd6427);
  transform: scale(1.08);
}

.journey-node.current span,
.journey-node.here span {
  color: var(--visual-ink, #1c1d1f);
  font-weight: 700;
}

.journey-node.here i {
  box-shadow: 0 0 0 calc(6 * var(--rpx)) rgba(189, 100, 39, 0.16);
}

.journey-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
  margin: calc(-8 * var(--rpx)) 0 calc(24 * var(--rpx));
  padding: calc(14 * var(--rpx)) calc(20 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
  background: rgba(189, 100, 39, 0.08);
  border: 1px solid rgba(189, 100, 39, 0.22);
  border-radius: calc(16 * var(--rpx));
}

.journey-hint-link {
  flex: 0 0 auto;
  padding: calc(8 * var(--rpx)) calc(18 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
  color: var(--visual-copper, #bd6427);
  background: transparent;
  border: 1px solid var(--visual-copper, #bd6427);
  border-radius: calc(999 * var(--rpx));
}

.journey-resume-card {
  display: flex;
  flex-direction: column;
  gap: calc(16 * var(--rpx));
  margin: 0 0 calc(28 * var(--rpx));
  padding: calc(24 * var(--rpx));
  background: var(--visual-paper-strong, #fffdf8);
  border: 1px solid rgba(189, 100, 39, 0.35);
  border-radius: calc(22 * var(--rpx));
  box-shadow: 0 calc(10 * var(--rpx)) calc(26 * var(--rpx)) rgba(28, 29, 31, 0.07);
}

.journey-resume-kicker {
  font-size: calc(20 * var(--rpx));
  font-weight: 700;
  color: var(--visual-copper, #bd6427);
}

.journey-resume-question {
  font-size: calc(28 * var(--rpx));
  line-height: 1.4;
  font-weight: 700;
  color: var(--visual-ink, #1c1d1f);
  overflow-wrap: anywhere;
}

.journey-resume-track {
  display: flex;
  gap: calc(8 * var(--rpx));
}

.journey-resume-track i {
  flex: 1;
  height: calc(8 * var(--rpx));
  background: var(--visual-paper-soft, #ede8dd);
  border-radius: calc(4 * var(--rpx));
}

.journey-resume-track i.done {
  background: var(--visual-graphite, #2a2c2f);
}

.journey-resume-track i.current {
  background: var(--visual-copper, #bd6427);
}

.journey-resume-button {
  align-self: stretch;
}

.sideline-head b {
  display: block;
}

.thought-council-button {
  display: inline-flex;
  align-items: center;
  gap: calc(6 * var(--rpx));
  margin-top: calc(12 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(18 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
  color: var(--visual-copper, #bd6427);
  background: rgba(189, 100, 39, 0.08);
  border: 1px solid rgba(189, 100, 39, 0.28);
  border-radius: calc(999 * var(--rpx));
}

@media (max-width: 380px) {
  .journey-node span {
    font-size: calc(18 * var(--rpx));
  }
}

/* 11-realm.css */
/* Realm layer: light study vs. dark ritual hall.
   仪式区（议事厅 / 报告揭幕 / 对谈进行中）切换到深夜铜光；其余保持暖纸书房。 */

:root {
  --realm-night: #14151a;
  --realm-night-soft: #1c1e24;
  --realm-fog: #f0eee9;
  --realm-fog-soft: rgba(240, 238, 233, 0.62);
  --realm-copper: #e08b4a;
  --realm-copper-deep: #bd6427;
  --realm-line: rgba(240, 238, 233, 0.14);
  --realm-card: rgba(34, 36, 44, 0.88);
  --serif-display: "Noto Serif SC", "Songti SC", STSong, "SimSun", serif;
}

/* ---- 场域过渡 ---- */

.app-shell {
  transition: background-color 0.4s ease;
}

.app-shell::after {
  content: "";
  position: fixed;
  inset: 0;
  background: var(--realm-night);
  opacity: 0;
  pointer-events: none;
  z-index: 80;
}

@media (prefers-reduced-motion: no-preference) {
  .app-shell.realm-shift::after {
    animation: realm-curtain 0.42s ease;
  }
}

@keyframes realm-curtain {
  0% { opacity: 0; }
  45% { opacity: 0.92; }
  100% { opacity: 0; }
}

/* ---- 暗场基础 ---- */

.app-shell[data-realm="dark"] {
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(224, 139, 74, 0.08), transparent 52%),
    linear-gradient(var(--realm-night) 0%, var(--realm-night-soft) 100%) !important;
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .page {
  background: transparent !important;
}

.app-shell[data-realm="dark"] .h1,
.app-shell[data-realm="dark"] .h2,
.app-shell[data-realm="dark"] .daily-title,
.app-shell[data-realm="dark"] .scene-title,
.app-shell[data-realm="dark"] .dialogue-chat-title,
.app-shell[data-realm="dark"] .agent-name {
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .p,
.app-shell[data-realm="dark"] .hero-copy,
.app-shell[data-realm="dark"] .daily-copy,
.app-shell[data-realm="dark"] .scene-subtitle,
.app-shell[data-realm="dark"] .agent-role,
.app-shell[data-realm="dark"] .dialogue-chat-intro {
  color: var(--realm-fog-soft) !important;
}

.app-shell[data-realm="dark"] .daily-kicker,
.app-shell[data-realm="dark"] .eyebrow,
.app-shell[data-realm="dark"] .section-kicker {
  color: var(--realm-copper) !important;
}

/* 暗场卡片：石墨玻璃 + 铜光内描边 */
.app-shell[data-realm="dark"] .hero-card,
.app-shell[data-realm="dark"] .panel-card,
.app-shell[data-realm="dark"] .group-room-card,
.app-shell[data-realm="dark"] .process-card,
.app-shell[data-realm="dark"] .next-step-card,
.app-shell[data-realm="dark"] .council-decision-card,
.app-shell[data-realm="dark"] .diagnosis-insight-card,
.app-shell[data-realm="dark"] .recommended-agent-panel,
.app-shell[data-realm="dark"] .growth-conversion-card,
.app-shell[data-realm="dark"] .asset-auto-card,
.app-shell[data-realm="dark"] .dialogue-chat-stage,
.app-shell[data-realm="dark"] .agent-directory-card {
  background: var(--realm-card) !important;
  border: 1px solid var(--realm-line) !important;
  box-shadow:
    inset 0 0 0 1px rgba(224, 139, 74, 0.06),
    0 18px 40px rgba(0, 0, 0, 0.35) !important;
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .journey-bar {
  background: rgba(28, 30, 36, 0.92) !important;
  border-color: var(--realm-line) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.4) !important;
}

.app-shell[data-realm="dark"] .journey-home {
  color: var(--realm-fog-soft) !important;
  border-color: var(--realm-line) !important;
}

.app-shell[data-realm="dark"] .journey-node i {
  background: rgba(240, 238, 233, 0.08) !important;
  border-color: var(--realm-line) !important;
  color: var(--realm-fog-soft) !important;
}

.app-shell[data-realm="dark"] .journey-node span {
  color: var(--realm-fog-soft) !important;
}

.app-shell[data-realm="dark"] .journey-node.done i {
  background: var(--realm-fog) !important;
  border-color: var(--realm-fog) !important;
  color: var(--realm-night) !important;
}

.app-shell[data-realm="dark"] .journey-node.current i {
  background: var(--realm-copper-deep) !important;
  border-color: var(--realm-copper) !important;
  color: #fff !important;
}

.app-shell[data-realm="dark"] .journey-node.current span,
.app-shell[data-realm="dark"] .journey-node.here span {
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .journey-hint {
  background: rgba(224, 139, 74, 0.12) !important;
  border-color: rgba(224, 139, 74, 0.32) !important;
  color: var(--realm-fog-soft) !important;
}

/* 气泡与输入区 */
.app-shell[data-realm="dark"] .bubble {
  background: var(--realm-card) !important;
  border: 1px solid var(--realm-line) !important;
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .bubble.user {
  background: rgba(224, 139, 74, 0.16) !important;
  border-color: rgba(224, 139, 74, 0.36) !important;
}

.app-shell[data-realm="dark"] .bubble b {
  color: var(--realm-copper) !important;
}

.app-shell[data-realm="dark"] .composer {
  background: rgba(28, 30, 36, 0.94) !important;
  border-top: 1px solid var(--realm-line) !important;
}

.app-shell[data-realm="dark"] .composer .input,
.app-shell[data-realm="dark"] .input {
  background: rgba(240, 238, 233, 0.06) !important;
  border: 1px solid var(--realm-line) !important;
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .input::placeholder {
  color: rgba(240, 238, 233, 0.4) !important;
}

.app-shell[data-realm="dark"] .secondary-button,
.app-shell[data-realm="dark"] .text-button {
  color: var(--realm-fog) !important;
  border-color: var(--realm-line) !important;
  background: rgba(240, 238, 233, 0.05) !important;
}

.app-shell[data-realm="dark"] .primary-button {
  background: var(--realm-copper-deep) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 24px rgba(189, 100, 39, 0.35) !important;
}

.app-shell[data-realm="dark"] .person-chip {
  background: rgba(240, 238, 233, 0.07) !important;
  border: 1px solid var(--realm-line) !important;
  color: var(--realm-fog-soft) !important;
}

.app-shell[data-realm="dark"] .person-chip.active {
  background: rgba(224, 139, 74, 0.18) !important;
  border-color: rgba(224, 139, 74, 0.4) !important;
  color: var(--realm-fog) !important;
}

.app-shell[data-realm="dark"] .group-seat-grid span {
  background: rgba(240, 238, 233, 0.06) !important;
  border: 1px solid var(--realm-line) !important;
  color: var(--realm-fog-soft) !important;
}

.app-shell[data-realm="dark"] .process-steps span {
  background: rgba(240, 238, 233, 0.06) !important;
  color: var(--realm-fog-soft) !important;
}

.app-shell[data-realm="dark"] .tab-bar,
.app-shell[data-realm="dark"] .tabbar {
  background: rgba(20, 21, 26, 0.96) !important;
  border-top: 1px solid var(--realm-line) !important;
}

.app-shell[data-realm="dark"] .tab-item {
  color: rgba(240, 238, 233, 0.5) !important;
}

.app-shell[data-realm="dark"] .tab-item.active {
  color: var(--realm-copper) !important;
}

/* ---- 微交互词典 ---- */

@media (prefers-reduced-motion: no-preference) {
  /* 墨水洇开：选项选中从点击处铜色洇开 */
  .choice {
    position: relative;
    overflow: hidden;
  }

  .choice::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at var(--ink-x, 50%) var(--ink-y, 50%), rgba(189, 100, 39, 0.24) 0%, rgba(189, 100, 39, 0.1) 38%, transparent 62%);
    opacity: 0;
    transform: scale(0.35);
    transition: opacity 0.25s ease, transform 0.3s ease;
    pointer-events: none;
  }

  .choice.is-selected::after {
    opacity: 1;
    transform: scale(2.4);
  }

  /* 盖章落定 */
  .stamp-in {
    animation: stamp-in 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.15);
  }

  @keyframes stamp-in {
    0% { transform: scale(1.16); opacity: 0.2; }
    62% { transform: scale(0.975); opacity: 1; }
    100% { transform: scale(1); }
  }

  .stamp-ripple {
    position: relative;
  }

  .stamp-ripple::before {
    content: "";
    position: absolute;
    inset: calc(-4 * var(--rpx));
    border: 2px solid rgba(189, 100, 39, 0.55);
    border-radius: inherit;
    animation: stamp-ripple 0.65s ease-out forwards;
    pointer-events: none;
  }

  @keyframes stamp-ripple {
    0% { opacity: 0.9; transform: scale(0.97); }
    100% { opacity: 0; transform: scale(1.1); }
  }

  /* 逐句浮现：只给新增气泡 */
  .bubble.bubble-enter {
    animation: bubble-rise 0.32s ease both;
  }

  @keyframes bubble-rise {
    from { opacity: 0; transform: translateY(calc(12 * var(--rpx))); }
    to { opacity: 1; transform: none; }
  }
}

/* ---- 报告三幕：压缩舞台 ---- */

.compressing-stage {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
}

.compressing-core {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(22 * var(--rpx));
  padding: calc(48 * var(--rpx));
  text-align: center;
}

.compressing-sigil {
  width: calc(72 * var(--rpx));
  height: calc(72 * var(--rpx));
  border-radius: 50%;
  border: 2px solid rgba(224, 139, 74, 0.5);
  border-top-color: var(--realm-copper);
  animation: sigil-spin 1.1s linear infinite;
}

@keyframes sigil-spin {
  to { transform: rotate(360deg); }
}

.compressing-title {
  font-size: calc(22 * var(--rpx));
  letter-spacing: 0.18em;
  color: var(--realm-copper);
}

.compressing-line {
  font-size: calc(26 * var(--rpx));
  color: var(--realm-fog-soft);
  animation: compress-line-in 0.5s ease both;
}

@keyframes compress-line-in {
  from { opacity: 0; transform: translateY(calc(10 * var(--rpx))); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .compressing-sigil { animation: none; }
  .compressing-line { animation: none; }
}

/* ---- 战略文件造型 ---- */

.strategy-document .document-masthead {
  display: flex;
  flex-direction: column;
  gap: calc(8 * var(--rpx));
  margin-bottom: calc(20 * var(--rpx));
}

.strategy-document .document-masthead-row {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-mono, monospace);
  font-size: calc(20 * var(--rpx));
  letter-spacing: 0.08em;
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
}

.strategy-document .document-no {
  color: var(--visual-copper, #bd6427);
  font-weight: 700;
}

.strategy-document .document-title {
  font-family: var(--serif-display);
  font-size: calc(44 * var(--rpx));
  font-weight: 700;
  line-height: 1.2;
  color: var(--visual-ink, #1c1d1f);
}

.strategy-document .document-subtitle {
  font-size: calc(20 * var(--rpx));
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
}

.strategy-document .document-seal-line {
  height: calc(6 * var(--rpx));
  margin-top: calc(10 * var(--rpx));
  background: linear-gradient(90deg, var(--visual-copper, #bd6427) 0%, rgba(189, 100, 39, 0.25) 60%, transparent 100%);
  border-radius: calc(3 * var(--rpx));
}

.strategy-document .document-blocker b {
  color: var(--visual-copper, #bd6427);
  font-weight: 760;
}

.strategy-document .document-blocker span {
  color: var(--visual-copper, #bd6427);
}

@media (prefers-reduced-motion: no-preference) {
  .strategy-document.document-reveal .document-block {
    animation: document-block-in 0.5s ease both;
    animation-delay: calc(var(--reveal-order, 0) * 130ms + 150ms);
  }

  @keyframes document-block-in {
    from { opacity: 0; transform: translateY(calc(14 * var(--rpx))); }
    to { opacity: 1; transform: none; }
  }
}

/* 暗场下的战略文件：发光的纸 */
.app-shell[data-realm="dark"] .strategy-document {
  background: var(--visual-paper-strong, #fffdf8) !important;
  box-shadow:
    0 0 0 1px rgba(224, 139, 74, 0.35),
    0 0 calc(52 * var(--rpx)) rgba(224, 139, 74, 0.18),
    0 24px 60px rgba(0, 0, 0, 0.5) !important;
}

/* ---- 议事厅四幕 ---- */

.act-divider {
  display: flex;
  align-items: center;
  gap: calc(14 * var(--rpx));
  margin: calc(20 * var(--rpx)) 0 calc(10 * var(--rpx));
}

.act-divider::before,
.act-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--realm-line) !important;
}

.act-divider span {
  font-size: calc(20 * var(--rpx));
  letter-spacing: 0.12em;
  color: var(--realm-copper) !important;
  white-space: nowrap;
}

.bubble.stage-rebuttal {
  position: relative;
  border-left: 3px solid #c4503a !important;
}

.rebuttal-badge {
  position: absolute;
  top: calc(-12 * var(--rpx));
  right: calc(14 * var(--rpx));
  padding: calc(2 * var(--rpx)) calc(12 * var(--rpx));
  font-style: normal;
  font-size: calc(18 * var(--rpx));
  font-weight: 700;
  color: #fff;
  background: #c4503a;
  border-radius: calc(999 * var(--rpx));
}

.app-shell[data-realm="dark"] .bubble.stage-consensus {
  background: rgba(224, 139, 74, 0.14) !important;
  border: 1px solid rgba(224, 139, 74, 0.42) !important;
  box-shadow: 0 0 calc(28 * var(--rpx)) rgba(224, 139, 74, 0.12) !important;
}

.app-shell[data-realm="dark"] .bubble.stage-verdict {
  background: var(--visual-paper-strong, #fffdf8) !important;
  color: var(--visual-ink, #1c1d1f) !important;
  border: 1px solid rgba(189, 100, 39, 0.45) !important;
  box-shadow: 0 0 calc(36 * var(--rpx)) rgba(224, 139, 74, 0.16) !important;
}

.app-shell[data-realm="dark"] .bubble.stage-verdict b {
  color: var(--visual-copper, #bd6427) !important;
}

/* 开庭落座：进入议事厅时席位错峰浮现 */
@media (prefers-reduced-motion: no-preference) {
  .page-ready .council-page .person-chip {
    animation: seat-in 0.4s ease both;
    animation-delay: calc(var(--seat-order, 0) * 130ms + 120ms);
  }

  @keyframes seat-in {
    from { opacity: 0; transform: translateY(calc(10 * var(--rpx))) scale(0.92); }
    to { opacity: 1; transform: none; }
  }
}

/* 四幕即流程：隐藏冗余流程卡，给庭审让出舞台 */
.council-page .process-card {
  display: none !important;
}

.council-page .group-room-card .daily-copy {
  display: none !important;
}

.council-page .chat-panel {
  min-height: 36dvh !important;
  flex: 1 1 auto !important;
}

/* ---- 对谈金句长按收藏 ---- */

.dialogue-thread .bubble {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

.quote-hint {
  text-align: center;
  font-size: calc(20 * var(--rpx));
  color: var(--realm-fog-soft) !important;
  opacity: 0.7;
  padding: calc(8 * var(--rpx)) 0 calc(4 * var(--rpx));
}

@media (prefers-reduced-motion: no-preference) {
  .bubble.quote-flash {
    animation: quote-flash 0.6s ease;
  }

  @keyframes quote-flash {
    0% { box-shadow: 0 0 0 0 rgba(189, 100, 39, 0.0); }
    35% { box-shadow: 0 0 0 calc(6 * var(--rpx)) rgba(189, 100, 39, 0.35); background-color: rgba(189, 100, 39, 0.18); }
    100% { box-shadow: 0 0 0 0 rgba(189, 100, 39, 0); }
  }
}

/* ---- 双档付费卡 ---- */

.plan-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(14 * var(--rpx));
  margin: calc(18 * var(--rpx)) 0;
}

.plan-card-option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(6 * var(--rpx));
  padding: calc(20 * var(--rpx)) calc(18 * var(--rpx));
  text-align: left;
  background: var(--visual-paper-strong, #fffdf8) !important;
  border: 1px solid var(--visual-line, rgba(28, 29, 31, 0.12)) !important;
  border-radius: calc(16 * var(--rpx)) !important;
  color: var(--visual-ink, #1c1d1f) !important;
  box-shadow: none !important;
}

.plan-card-option.plan-featured {
  border: 2px solid var(--visual-copper, #bd6427) !important;
  box-shadow: 0 calc(10 * var(--rpx)) calc(26 * var(--rpx)) rgba(189, 100, 39, 0.16) !important;
}

.plan-badge {
  font-size: calc(18 * var(--rpx));
  font-weight: 700;
  color: var(--visual-copper, #bd6427);
  padding: calc(2 * var(--rpx)) calc(10 * var(--rpx));
  background: rgba(189, 100, 39, 0.1);
  border-radius: calc(999 * var(--rpx));
}

.plan-price {
  font-family: var(--serif-display);
  font-size: calc(44 * var(--rpx));
  line-height: 1.1;
  font-weight: 700;
}

.plan-name {
  font-size: calc(22 * var(--rpx));
  font-weight: 700;
}

.plan-copy {
  font-style: normal;
  font-size: calc(20 * var(--rpx));
  line-height: 1.45;
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
}

.plan-conversion-card {
  margin-top: calc(24 * var(--rpx));
  padding: calc(24 * var(--rpx));
  background: var(--visual-paper-strong, #fffdf8);
  border: 1px solid rgba(189, 100, 39, 0.3);
  border-radius: calc(20 * var(--rpx));
}

/* ---- 交付仪式：会员证 ---- */

.delivery-stage {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  gap: calc(22 * var(--rpx));
  padding: calc(56 * var(--rpx)) calc(28 * var(--rpx)) calc(40 * var(--rpx));
}

.member-cert {
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--rpx));
  padding: calc(30 * var(--rpx)) calc(26 * var(--rpx));
  background: var(--visual-paper-strong, #fffdf8) !important;
  border-radius: calc(18 * var(--rpx));
  color: var(--visual-ink, #1c1d1f) !important;
  box-shadow:
    0 0 0 1px rgba(224, 139, 74, 0.4),
    0 0 calc(56 * var(--rpx)) rgba(224, 139, 74, 0.2),
    0 26px 64px rgba(0, 0, 0, 0.5) !important;
}

.cert-topline {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-mono, monospace);
  font-size: calc(20 * var(--rpx));
  letter-spacing: 0.1em;
  color: var(--visual-copper, #bd6427);
  font-weight: 700;
}

.cert-title {
  font-family: var(--serif-display);
  font-size: calc(40 * var(--rpx));
  font-weight: 700;
}

.cert-name {
  font-family: var(--serif-display);
  font-size: calc(30 * var(--rpx));
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
}

.cert-meta {
  display: flex;
  gap: calc(10 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
}

.cert-meta b {
  color: var(--visual-ink, #1c1d1f);
}

.cert-benefits {
  display: flex;
  flex-direction: column;
  gap: calc(12 * var(--rpx));
}

.cert-benefit {
  display: flex;
  align-items: center;
  gap: calc(12 * var(--rpx));
  font-size: calc(24 * var(--rpx));
  color: var(--realm-fog) !important;
}

.cert-benefit i {
  font-style: normal;
  width: calc(34 * var(--rpx));
  height: calc(34 * var(--rpx));
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(224, 139, 74, 0.18);
  color: var(--realm-copper);
  font-weight: 700;
}

@media (prefers-reduced-motion: no-preference) {
  .cert-benefit {
    animation: benefit-light 0.4s ease both;
    animation-delay: calc(var(--light-order, 0) * 120ms + 500ms);
  }

  @keyframes benefit-light {
    from { opacity: 0; transform: translateX(calc(-10 * var(--rpx))); }
    to { opacity: 1; transform: none; }
  }
}

.cert-next-card {
  padding: calc(22 * var(--rpx));
  background: var(--realm-card) !important;
  border: 1px solid var(--realm-line) !important;
  border-radius: calc(16 * var(--rpx));
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--rpx));
}

.cert-step {
  font-size: calc(23 * var(--rpx));
  color: var(--realm-fog) !important;
  padding-left: calc(8 * var(--rpx));
  border-left: 2px solid rgba(224, 139, 74, 0.4);
}

.cert-enter-button {
  margin-top: auto;
}

/* ---- 体验期升级条 ---- */

.upgrade-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--rpx));
  margin: 0 0 calc(20 * var(--rpx));
  padding: calc(18 * var(--rpx)) calc(20 * var(--rpx));
  background: linear-gradient(100deg, rgba(189, 100, 39, 0.12), rgba(189, 100, 39, 0.04));
  border: 1px solid rgba(189, 100, 39, 0.35);
  border-radius: calc(16 * var(--rpx));
}

.upgrade-banner-text {
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--rpx));
  min-width: 0;
}

.upgrade-banner-text b {
  font-size: calc(24 * var(--rpx));
  color: var(--visual-copper, #bd6427);
}

.upgrade-banner-text span {
  font-size: calc(20 * var(--rpx));
  line-height: 1.45;
  color: var(--visual-ink-soft, rgba(28, 29, 31, 0.66));
}

.upgrade-banner .compact-button {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* 12-silicon-os.css */
/* =====================================================================
   硅基物语 · Silicon Story OS — 落地工程包设计基座
   Halo(光晕·亮，默认) / Obsidian(黑曜石·暗) 双主题
   字体：Space Grotesk(拉丁/数字) + Noto Sans SC / PingFang SC(中文)
   该文件最后加载，以 ID 选择器覆盖既有 .app-shell 整页滚动布局。
   ===================================================================== */

/* ---------- 主题令牌 ---------- */
#app.app-shell {
  --cn: -apple-system, "PingFang SC", "Noto Sans SC", sans-serif;
  --mono: "Space Grotesk", "PingFang SC", "Noto Sans SC", sans-serif;
}

#app.app-shell[data-theme="halo"] {
  --bg: #EEF2F7;
  --panel: #FFFFFF;
  --panel2: #F3F7FC;
  --panelHi: #FFFFFF;
  --line: rgba(18, 30, 52, 0.085);
  --line2: rgba(18, 30, 52, 0.15);
  --ink: #0F1722;
  --ink2: rgba(15, 23, 34, 0.60);
  --ink3: rgba(15, 23, 34, 0.40);
  --copper: #C2552A;
  --cyan: #2C63F4;
  --grid: rgba(18, 30, 52, 0.045);
  --glow: rgba(44, 99, 244, 0.14);
  --cardshadow: 0 2px 4px rgba(20, 32, 54, 0.04), 0 18px 38px rgba(20, 32, 54, 0.07);
  --core-bg: #0E1626;
  --core-line: rgba(255, 255, 255, 0.18);
  --core-grid: rgba(255, 255, 255, 0.08);
  --core-scan: rgba(255, 255, 255, 0.12);
}

#app.app-shell[data-theme="obsidian"] {
  --bg: #0A0D11;
  --panel: #10141A;
  --panel2: #171D26;
  --panelHi: #1C232C;
  --line: rgba(255, 255, 255, 0.08);
  --line2: rgba(255, 255, 255, 0.15);
  --ink: #EDF0F4;
  --ink2: rgba(237, 240, 244, 0.62);
  --ink3: rgba(237, 240, 244, 0.40);
  --copper: #EC9C57;
  --cyan: #5FD6E4;
  --grid: rgba(255, 255, 255, 0.045);
  --glow: rgba(236, 156, 86, 0.16);
  --cardshadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  --core-bg: #10141A;
  --core-line: rgba(255, 255, 255, 0.14);
  --core-grid: rgba(255, 255, 255, 0.06);
  --core-scan: rgba(255, 255, 255, 0.10);
}

/* ---------- 设备外壳：头部固定 / 内容滚动 / Tab 固定 ---------- */
#app.app-shell {
  position: relative;
  width: 100%;
  max-width: 100vw;
  height: 100dvh;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: var(--bg) !important;
  background-image: none !important;
  color: var(--ink) !important;
  font-family: var(--cn);
  -webkit-font-smoothing: antialiased;
  isolation: isolate;
}

/* ---------- 桌面端（≥900px）：正经内容站布局 ----------
   去手机壳，App 撑满视口减页脚高度；底部 Tab 通过 flex order 重排为顶部导航；
   内容列约束 760px 居中（--rpx 仍锚定 430 基准，组件尺寸不变）。 */
@media (min-width: 900px) {
  #app.app-shell {
    height: calc(100vh - 44px); /* 44px = 页脚高度 */
  }

  .site-footer {
    display: block;
    flex: 0 0 auto;
    height: 44px;
    overflow: hidden;
    border-top: 1px solid rgba(28, 29, 31, 0.1);
    background: rgba(255, 253, 248, 0.92);
  }

  /* 头部：内容居中到站宽 */
  #app.app-shell .ss-header {
    padding-left: max(24px, calc((100% - 1080px) / 2));
    padding-right: max(24px, calc((100% - 1080px) / 2));
  }

  /* 底部 Tab → 顶部导航：DOM 顺序是 header/scroll/tabbar，用 order 重排视觉顺序 */
  #app.app-shell .ss-tabbar {
    order: -1; /* 先于 .ss-scroll；header 不参与（见下） */
    border-top: 0;
    border-bottom: 1px solid var(--line);
    padding: 0 max(24px, calc((100% - 1080px) / 2));
    grid-auto-columns: max-content;
    justify-content: start;
    gap: 6px;
    background: var(--panel);
  }

  /* header 用更小的 order 保持在最上 */
  #app.app-shell .ss-header { order: -2; }
  #app.app-shell .ss-scroll { order: 0; }

  /* 导航项：图标+文字横排，像正常网站导航 */
  #app.app-shell .ss-tab {
    flex-direction: row;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 13px 14px;
    border-radius: 0;
  }

  #app.app-shell .ss-tab .ss-tab-label {
    font-size: 13px;
    margin-top: 0;
  }

  #app.app-shell .ss-tab .ss-tab-bar {
    top: auto;
    bottom: 0;
    left: 14px;
    right: 14px;
    width: auto;
    transform: none;
  }

  /* 内容列：居中约束（专栏内部 720px 阅读宽度刚好放得下）。
     约束打在 .ss-scroll 的直接子元素上——朋友圈等视图的根容器不是 .ss-screen。 */
  #app.app-shell .ss-scroll > * {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

/* 背景：发丝网格 + 顶部光晕（固定背板，不随内容滚动） */
#app.app-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 30px 30px;
  opacity: 0.9;
  animation: none;
}

#app.app-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% -8%, var(--glow), transparent 44%);
  opacity: 1;
  transform: none;
  filter: none;
}

/* 关掉既有 realm/micro-feedback 浮层，避免与新主题打架 */
#app.app-shell.realm-shift::after { animation: none; }
#app.app-shell.micro-feedback::before,
#app.app-shell[data-feedback]::before { display: none !important; content: none !important; }
#app.app-shell.is-transitioning { opacity: 1 !important; }

/* 所有交互元素：触感缩放 + hover 微透明 */
#app.app-shell button { transition: transform .13s ease, opacity .13s ease, box-shadow .2s ease; }
#app.app-shell button:active { transform: scale(0.975); }
@media (hover: hover) {
  #app.app-shell button:hover { opacity: 0.92; }
}

/* ---------- 状态栏 + 头部 ---------- */
.ss-status,
.ss-header,
.ss-scroll,
.ss-tabbar { position: relative; z-index: 2; }

.ss-status {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 24px 6px;
  color: var(--ink);
}
.ss-status .ss-clock {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.ss-status .ss-sysright {
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--ink2);
}
.ss-bars { display: inline-flex; gap: 1.5px; align-items: flex-end; height: 11px; }
.ss-bars i { width: 2.5px; border-radius: 1px; display: block; background: var(--ink); }
.ss-bars i:nth-child(1) { height: 4px; }
.ss-bars i:nth-child(2) { height: 6px; }
.ss-bars i:nth-child(3) { height: 8px; }
.ss-bars i:nth-child(4) { height: 11px; background: var(--ink2); }
.ss-battery {
  width: 22px; height: 11px; border: 1.4px solid var(--ink2);
  border-radius: 3px; position: relative; display: inline-block;
}
.ss-battery i { position: absolute; left: 1px; top: 1px; bottom: 1px; width: 72%; background: var(--ink); border-radius: 1px; display: block; }

.ss-header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 20px 12px;
  border-bottom: 1px solid var(--line);
}
.ss-brand { display: flex; align-items: center; gap: 11px; }
.ss-brand-name { color: var(--ink); font-size: 16px; font-weight: 800; letter-spacing: 0.02em; line-height: 1; }
.ss-brand-os { font-family: var(--mono); font-size: 9px; letter-spacing: 0.24em; color: var(--copper); margin-top: 4px; white-space: nowrap; }
.ss-header-actions { display: flex; align-items: center; gap: 8px; }
.ss-login-btn {
  height: 34px;
  padding: 0 12px;
  border-radius: 11px;
  border: 1px solid var(--line2);
  background: transparent;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}
.ss-login-btn.is-signed-in { color: var(--copper); }
.ss-mode-btn {
  width: 34px; height: 34px; border-radius: 11px; border: 1px solid var(--line2);
  display: flex; align-items: center; justify-content: center; color: var(--ink); background: transparent;
}
.ss-upgrade-pill {
  display: flex; align-items: center; gap: 7px; height: 34px; padding: 0 5px 0 4px;
  border-radius: 999px; border: 1px solid var(--line2); background: transparent;
}
.ss-upgrade-pill span { font-size: 11px; font-weight: 700; color: var(--ink); padding-right: 4px; }

/* ---------- 滚动内容区 ---------- */
.ss-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.ss-scroll::-webkit-scrollbar { width: 0; height: 0; }
.ss-scroll { scrollbar-width: none; }
.ss-x { overflow-x: auto; scrollbar-width: none; }
.ss-x::-webkit-scrollbar { width: 0; height: 0; }

.ss-screen { padding: 18px 18px 28px; }

/* ---------- 底部 Tab ---------- */
.ss-tabbar {
  flex: 0 0 auto;
  display: grid;
  /* 按实际 Tab 数量均分：加/减 Tab 不再需要改 CSS */
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  padding: 9px 8px;
  padding-bottom: max(9px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  background: var(--panel);
}
.ss-tab {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 9px 0 5px;
  background: transparent;
  border: 0;
}
.ss-tab-bar {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 22px; height: 2.5px; border-radius: 0 0 3px 3px;
  background: transparent;
}
.ss-tab.active .ss-tab-bar { background: var(--copper); box-shadow: 0 0 10px var(--glow); }
.ss-tab-ico { display: flex; }
.ss-tab.active .ss-tab-ico { filter: drop-shadow(0 0 8px var(--glow)); }
.ss-tab-label { font-size: 10px; font-weight: 500; color: var(--ink3); }
.ss-tab.active .ss-tab-label { font-weight: 700; color: var(--ink); }

/* ---------- SiliconCore 头像 ---------- */
.ss-core { position: relative; flex: 0 0 auto; overflow: hidden; }

/* ---------- 返回按钮（浮层顶部） ---------- */
.ss-back {
  display: flex; align-items: center; gap: 8px;
  color: var(--ink2); font-size: 13px; font-weight: 600;
  margin-bottom: 14px; background: transparent; border: 0;
}
.ss-back-ico {
  width: 30px; height: 30px; border-radius: 10px; border: 1px solid var(--line2);
  display: flex; align-items: center; justify-content: center; font-family: var(--mono);
}

/* ---------- 命题飞跃浮层（ssComet 共享元素过渡） ---------- */
.ss-flying {
  position: absolute; left: 50%; top: 104px; z-index: 20;
  width: 344px; max-width: 86%; pointer-events: none;
  animation: ssComet .72s cubic-bezier(.4, 0, .2, 1) both;
}
.ss-flying-card {
  display: flex; align-items: center; gap: 12px;
  border: 1px solid var(--copper); border-radius: 15px; background: var(--panel); padding: 13px 14px;
  animation: ssCometGlow .72s ease both;
}

/* ---------- 共享小工具 ---------- */
.ss-eyebrow { font-family: var(--mono); font-weight: 600; color: var(--copper); }
.ss-card { border: 1px solid var(--line); border-radius: 14px; background: var(--panel); box-shadow: var(--cardshadow); }
.ss-screen-enter { animation: ssFadeUp .32s ease both; }

/* ---------- 复用组件 ---------- */
.ss-btn-copper {
  background: var(--copper); color: #fff; font-weight: 700; border: 0;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.ss-btn-ghost {
  background: transparent; color: var(--ink); font-weight: 700;
  border: 1px solid var(--line2);
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.ss-btn-ink {
  background: var(--ink); color: var(--panel); font-weight: 600; border: 0;
  display: flex; align-items: center; justify-content: center; gap: 6px;
}

.ss-scan-input {
  width: 100%; margin-top: 14px; min-height: 84px; resize: none;
  border: 1px solid var(--line); border-radius: 14px; background: var(--panel2);
  padding: 15px; color: var(--ink); font-size: 15px; line-height: 1.6; font-family: inherit;
}
.ss-scan-input::placeholder { color: var(--ink3); }

.ss-scan-chip {
  flex: 0 0 auto; font-family: var(--mono); font-size: 11px; color: var(--ink2);
  border: 1px solid var(--line2); border-radius: 999px; padding: 7px 12px;
  background: var(--panel2); white-space: nowrap;
}

.ss-chat-input {
  flex: 1; min-width: 0; height: 44px; border: 1px solid var(--line2); border-radius: 13px;
  background: var(--panel2); padding: 0 14px; color: var(--ink); font-size: 13px;
  font-family: inherit; outline: none;
}
.ss-chat-input::placeholder { color: var(--ink3); }

.ss-ghost-video {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-top: 14px; width: 100%; background: transparent; border: 0;
  color: var(--ink3); font-size: 12px;
}
.ss-ghost-play {
  width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--line2);
  display: flex; align-items: center; justify-content: center; color: var(--copper); font-size: 7px;
}

.ss-explore-card {
  text-align: left; border: 1px solid var(--line); border-radius: 15px;
  background: var(--panel); box-shadow: var(--cardshadow); padding: 15px;
  display: flex; flex-direction: column; gap: 7px; min-height: 130px;
}
.ss-explore-mark {
  width: 30px; height: 30px; border-radius: 9px; border: 1px solid var(--line2);
  background: var(--panel2); color: var(--copper); display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 800;
}
.ss-explore-arrow {
  width: 26px; height: 26px; border-radius: 50%; background: var(--ink); color: var(--panel);
  display: flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: 12px;
}

/* ---------- 关键帧 ---------- */
@keyframes ssBlink { 0%, 100% { opacity: 0.25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-2px); } }
@keyframes ssFly { 0% { opacity: 0; transform: translateY(6px) scale(0.8); } 25% { opacity: 1; transform: translateY(-4px) scale(1.1); } 100% { opacity: 0; transform: translateY(-30px) scale(0.9); } }
@keyframes ssSeal { 0% { opacity: 0; transform: scale(0.6) rotate(-12deg); } 60% { opacity: 1; transform: scale(1.12) rotate(4deg); } 100% { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes ssComet { 0% { opacity: 0; transform: translateX(-50%) translateY(190px) scale(0.78); } 16% { opacity: 1; } 64% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); } 100% { opacity: 0; transform: translateX(-50%) translateY(-8px) scale(1.01); } }
@keyframes ssCometGlow { 0%, 100% { box-shadow: 0 0 0 0 rgba(194, 85, 42, 0); } 50% { box-shadow: 0 14px 40px rgba(20, 32, 54, 0.28), 0 0 26px 2px rgba(194, 85, 42, 0.35); } }
@keyframes ssPropIn { 0% { opacity: 0; transform: translateY(-10px) scale(0.97); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes ssMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes ssPulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
@keyframes ssGlow { 0%, 100% { box-shadow: 0 0 0 0 var(--glow, rgba(236, 156, 86, 0.18)); } 50% { box-shadow: 0 0 18px 3px var(--glow, rgba(236, 156, 86, 0.18)); } }
@keyframes ssFadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes ssPop { from { opacity: 0; transform: translateY(8px) scale(0.99); } to { opacity: 1; transform: none; } }
@keyframes ssFlash { 0% { box-shadow: 0 0 0 0 rgba(236, 156, 86, 0); } 18% { box-shadow: 0 0 0 3px rgba(236, 156, 86, 0.55); } 100% { box-shadow: 0 0 0 0 rgba(236, 156, 86, 0); } }
.ss-flash { animation: ssFlash 1.6s ease-out; }

@media (prefers-reduced-motion: reduce) {
  #app.app-shell *,
  #app.app-shell *::before,
  #app.app-shell *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

/* 13-desktop-premium.css */
/* ============================================================
   13-desktop-premium.css — 桌面端高级质感层（加载顺序最后，赢得级联）
   设计语言：高端编辑部（editorial premium）——
   衬线展示字大标题 / 大量留白 / 发丝细线 / 克制铜色点缀 / 悬停微动效。
   只作用于 ≥900px；移动端唯一影响是隐藏 .ss-home-sub（桌面专属副标题）。
   ============================================================ */

/* 移动端：隐藏桌面专属元素 */
.ss-home-sub {
  display: none;
}

/* 导航双标签：移动端显示"扫描台"，桌面端显示"首页"（内容门户语义） */
.ss-tab-label-d {
  display: none;
}

@media (min-width: 900px) {
  :root {
    --serif: "Noto Serif SC", "Songti SC", serif;
    --nav-h: 60px;
  }

  /* ---------- 画布：更安静的底 ---------- */
  #app.app-shell::before {
    opacity: 0.45; /* 弱化发丝网格，桌面上大面积网格显得廉价 */
  }

  /* ---------- 顶部品牌条：毛玻璃 ---------- */
  #app.app-shell .ss-header {
    height: 64px;
    align-items: center;
    background: color-mix(in srgb, var(--panel) 78%, transparent);
    backdrop-filter: blur(16px) saturate(1.4);
    -webkit-backdrop-filter: blur(16px) saturate(1.4);
    border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  }

  #app.app-shell .ss-brand-name {
    font-size: 17px;
    letter-spacing: 0.08em;
  }

  #app.app-shell .ss-brand-os {
    letter-spacing: 0.3em;
  }

  /* ---------- 导航：纯文字编辑部风格 ---------- */
  #app.app-shell .ss-tabbar {
    height: var(--nav-h);
    align-items: stretch;
    gap: 8px;
    background: color-mix(in srgb, var(--panel) 88%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  #app.app-shell .ss-tab {
    padding: 0 18px;
    gap: 0;
  }

  #app.app-shell .ss-tab .ss-tab-ico {
    display: none; /* 桌面导航去图标：纯文字更高级 */
  }

  #app.app-shell .ss-tab .ss-tab-label {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--ink2);
    transition: color 0.18s ease;
  }

  #app.app-shell .ss-tab:hover .ss-tab-label {
    color: var(--ink);
  }

  #app.app-shell .ss-tab.active .ss-tab-label {
    color: var(--ink);
    font-weight: 800;
  }

  #app.app-shell .ss-tab .ss-tab-bar {
    top: auto;
    bottom: 0;
    left: 18px;
    right: 18px;
    width: auto;
    height: 2px;
    border-radius: 2px 2px 0 0;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.22s ease;
    background: var(--copper);
  }

  #app.app-shell .ss-tab.active .ss-tab-bar {
    transform: scaleX(1);
    box-shadow: 0 0 12px var(--glow);
  }

  /* ---------- 滚动条：细雅 ---------- */
  #app.app-shell .ss-scroll::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  #app.app-shell .ss-scroll::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background: color-mix(in srgb, var(--ink3) 36%, transparent);
  }

  #app.app-shell .ss-scroll::-webkit-scrollbar-track {
    background: transparent;
  }

  /* ---------- 通用卡片悬停语言 ---------- */
  #app.app-shell .ss-explore-card,
  #app.app-shell [data-action="premium-open"],
  #app.app-shell .ss-plan-grid > [data-action="open-member"]:not(.ss-plan-trial) {
    transition: transform 0.2s ease, box-shadow 0.25s ease, border-color 0.2s ease;
  }

  /* 阴影固定用深色：暗色主题下 var(--ink) 是近白，会把"阴影"变成白光晕 */
  #app.app-shell .ss-explore-card:hover,
  #app.app-shell [data-action="premium-open"]:hover,
  #app.app-shell .ss-plan-grid > [data-action="open-member"]:not(.ss-plan-trial):hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--copper) 55%, var(--line2)) !important;
    box-shadow: 0 18px 44px rgba(12, 14, 18, 0.16);
  }

  #app.app-shell .ss-btn-copper:hover {
    filter: brightness(1.06);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--copper) 35%, transparent);
  }

  /* ---------- 首页（扫描台）：着陆级排版 ---------- */
  #app[data-page="scenes"] .ss-scroll > * {
    max-width: 980px;
  }

  .ss-home-brand {
    padding: 54px 0 6px !important;
  }

  .ss-home-brand .ss-eyebrow {
    font-size: 12px !important;
    letter-spacing: 0.5em !important;
  }

  .ss-home-title {
    font-family: var(--serif) !important;
    font-size: 60px !important;
    font-weight: 900 !important;
    letter-spacing: 0.1em !important;
    margin-top: 16px !important;
  }

  .ss-home-sub {
    display: block;
    margin-top: 16px;
    color: var(--ink2);
    font-size: 15px;
    letter-spacing: 0.04em;
  }

  .ss-home-hero {
    max-width: 680px;
    margin: 36px auto 0 !important;
    padding: 30px 32px !important;
    border-radius: 22px !important;
  }

  .ss-home-hero-title {
    font-size: 24px !important;
    line-height: 1.45 !important;
  }

  .ss-home-hero-sub {
    font-size: 14px !important;
    margin-top: 10px !important;
  }

  .ss-home-hero .ss-scan-input {
    font-size: 16px;
    min-height: 76px;
  }

  #app.app-shell .ss-ghost-video {
    margin: 20px auto 0;
  }

  .ss-home-explore {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
  }

  #app.app-shell .ss-explore-card {
    padding: 20px 18px !important;
    border-radius: 18px !important;
  }

  /* 判断闭环条：收窄居中，弱化为脚注 */
  #app[data-page="scenes"] .ss-home-loop {
    max-width: 680px;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 34px !important;
  }

  /* ---------- 会员页：三卡横排 ---------- */
  #app[data-page="membership"] .ss-scroll > * {
    max-width: 920px;
  }

  #app[data-page="membership"] .ss-plan-grid {
    grid-template-columns: repeat(3, 1fr);
    align-items: stretch;
    gap: 14px !important;
  }

  /* 体验链接横跨三列（类名钩子：trial 计划 id 是运行时可配的，不能写死） */
  #app[data-page="membership"] .ss-plan-grid > .ss-plan-trial {
    grid-column: 1 / -1;
  }

  .ss-member-hero {
    padding: 34px 36px !important;
    border-radius: 24px !important;
  }

  /* ---------- 专栏：杂志排版 ---------- */
  .ss-prem-head {
    padding: 26px 0 4px;
    text-align: center;
  }

  .ss-prem-title {
    font-family: var(--serif) !important;
    font-size: 38px !important;
    letter-spacing: 0.06em !important;
  }

  .ss-prem-sub {
    font-size: 13.5px !important;
    margin-top: 10px !important;
  }

  .ss-prem-list {
    gap: 14px !important;
    margin-top: 26px !important;
  }

  #app.app-shell [data-action="premium-open"] {
    padding: 24px 26px !important;
    border-radius: 18px !important;
  }

  #app.app-shell .ss-prem-card-title {
    font-size: 20px !important;
    line-height: 1.5 !important;
  }

  #app.app-shell .ss-prem-card-sub {
    font-size: 14px !important;
    line-height: 1.75 !important;
    margin-top: 10px !important;
  }

  /* 文章阅读页：正经的长文排版 */
  .ss-prem-article h1 {
    font-family: var(--serif) !important;
    font-size: 36px !important;
    line-height: 1.5 !important;
    letter-spacing: 0.01em !important;
    margin-top: 18px !important;
  }

  .ss-prem-article .ss-premium-body {
    font-size: 17px !important;
    line-height: 2.05 !important;
    letter-spacing: 0.01em;
    margin-top: 30px !important;
  }

  .ss-premium-body h2,
  .ss-premium-body h3 {
    font-family: var(--serif);
    color: var(--ink);
    line-height: 1.5;
    margin: 40px 0 14px;
  }

  .ss-premium-body h2 { font-size: 26px; }
  .ss-premium-body h3 { font-size: 21px; }

  .ss-premium-body p { margin: 0 0 18px; }

  .ss-premium-body ul,
  .ss-premium-body ol {
    margin: 0 0 18px;
    padding-left: 26px;
  }

  .ss-premium-body li { margin: 6px 0; }

  .ss-premium-body blockquote {
    margin: 26px 0;
    padding: 4px 0 4px 22px;
    border-left: 2.5px solid var(--copper);
    color: var(--ink2);
    font-family: var(--serif);
    font-size: 17.5px;
  }

  .ss-premium-body a {
    color: var(--copper);
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
  }

  /* ---------- 朋友圈：白卡装裱 ---------- */
  #app[data-page="moments"] .ss-scroll > * {
    max-width: 620px;
    margin-top: 26px;
    margin-bottom: 34px;
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 22px 60px rgba(12, 14, 18, 0.12);
  }

  /* ---------- 思想场/议事厅/档案库：稍宽的工作列 ---------- */
  #app[data-page="feed"] .ss-scroll > *,
  #app[data-page="council"] .ss-scroll > *,
  #app[data-page="assets"] .ss-scroll > * {
    max-width: 840px;
  }

  /* ---------- 页脚：精修 ---------- */
  /* 页脚在 #app 之外拿不到主题变量（变量作用域在 #app.app-shell 上），固定浅纸色与既有实现一致 */
  .site-footer {
    background: rgba(255, 253, 248, 0.92);
  }

  .site-footer .site-footer-inner {
    padding: 13px 24px;
  }

  .site-footer-brand b {
    letter-spacing: 0.12em;
  }

  /* ================= 桌面原生页面滚动 =================
     去掉"内嵌应用"的内部滚动容器：整页由浏览器原生滚动，
     品牌条+导航 sticky 吸顶，页脚回到文档流末尾——这是"网页感"的关键。 */
  /* 07-mobile-audit 与 08-editorial-final(!important) 给 .site/.phone-shell/.app-shell 设的
     overflow-x:hidden 会把它们变成 sticky 的"滚动容器"，导致吸顶失效。
     改用 overflow-x:clip（同样防横向溢出但不建滚动容器）；须带 !important 反制 08。 */
  /* 06 给 html,body 设的 overflow-x:hidden 会把 body 变成滚动容器（单轴 hidden 令另一轴 computed 为 auto），
     sticky 会相对 body 的内部滚动口而永不吸附——body 改 clip 即可；html 保持原样（它就是页面滚动器）。 */
  body {
    overflow: visible !important;
    overflow-x: clip !important;
  }

  .site,
  .phone-shell {
    overflow: visible !important;
    overflow-x: clip !important;
  }

  #app.app-shell {
    height: auto;
    min-height: calc(100vh - 44px);
    overflow: visible !important;
    overflow-x: clip !important;
  }

  #app.app-shell .ss-scroll {
    overflow: visible;
  }

  #app.app-shell .ss-header {
    position: sticky;
    top: 0;
    z-index: 40;
  }

  #app.app-shell .ss-tabbar {
    position: sticky;
    top: 64px;
    z-index: 39;
  }

  /* 原生滚动下页面滚动条由浏览器接管；细雅滚动条挪到全局 */
  body::-webkit-scrollbar { width: 10px; }
  body::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(120, 120, 118, 0.4); }
  body::-webkit-scrollbar-track { background: transparent; }

  /* ================= 门户首页（桌面专属视图） ================= */
  .ss-tab-label-m { display: none; }
  .ss-tab-label-d { display: inline; }

  #app[data-page="scenes"] .ss-scroll > .ss-portal {
    max-width: 1080px;
  }

  /* 头条区 */
  .ss-portal-headline {
    display: block;
    width: 100%;
    padding: 44px 8px 34px;
    text-align: center;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--line);
  }

  .ss-portal-headline-link { cursor: pointer; }

  .ss-portal-headline-title {
    font-family: var(--serif);
    color: var(--ink);
    font-size: 42px;
    font-weight: 900;
    line-height: 1.45;
    letter-spacing: 0.02em;
    margin: 18px auto 0;
    max-width: 860px;
    transition: color 0.18s ease;
  }

  .ss-portal-headline-link:hover .ss-portal-headline-title {
    color: var(--copper);
  }

  .ss-portal-headline-sub {
    color: var(--ink2);
    font-size: 15px;
    line-height: 1.8;
    margin: 14px auto 0;
    max-width: 640px;
  }

  .ss-portal-headline-meta {
    margin-top: 16px;
    color: var(--copper);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.06em;
  }

  /* 主体两栏 */
  .ss-portal-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 36px;
    margin-top: 30px;
    align-items: start;
  }

  .ss-portal-section { margin-bottom: 34px; }

  .ss-portal-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 4px;
  }

  .ss-portal-section-title {
    color: var(--ink);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.03em;
  }

  .ss-portal-more {
    background: transparent;
    border: 0;
    color: var(--ink3);
    font-size: 12.5px;
    transition: color 0.15s ease;
  }

  .ss-portal-more:hover { color: var(--copper); }

  /* 情报行（朋友圈精选） */
  .ss-portal-moment {
    display: flex;
    gap: 13px;
    width: 100%;
    text-align: left;
    padding: 15px 6px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
    transition: background 0.15s ease;
  }

  .ss-portal-moment:hover { background: color-mix(in srgb, var(--panel2) 60%, transparent); }

  .ss-portal-avatar {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    object-fit: cover;
    flex: 0 0 auto;
    border: 1px solid var(--line);
  }

  .ss-portal-avatar-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--panel2);
    color: var(--ink2);
    font-size: 16px;
    font-weight: 800;
  }

  .ss-portal-moment-body { min-width: 0; flex: 1; }

  .ss-portal-moment-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
  }

  .ss-portal-moment-name {
    color: var(--ink);
    font-size: 14px;
    font-weight: 800;
  }

  .ss-portal-moment-time {
    color: var(--ink3);
    font-size: 11.5px;
    font-family: var(--mono);
    white-space: nowrap;
  }

  .ss-portal-moment-text {
    color: var(--ink2);
    font-size: 14px;
    line-height: 1.7;
    margin-top: 5px;
  }

  /* 专栏卡列 */
  .ss-portal-prem-list { display: grid; gap: 2px; }

  .ss-portal-prem {
    width: 100%;
    text-align: left;
    padding: 16px 6px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
    transition: background 0.15s ease;
  }

  .ss-portal-prem:hover { background: color-mix(in srgb, var(--panel2) 60%, transparent); }

  .ss-portal-prem-title {
    color: var(--ink);
    font-size: 16.5px;
    font-weight: 800;
    line-height: 1.55;
    transition: color 0.15s ease;
  }

  .ss-portal-prem:hover .ss-portal-prem-title { color: var(--copper); }

  .ss-portal-prem-sub {
    color: var(--ink2);
    font-size: 13px;
    line-height: 1.7;
    margin-top: 5px;
  }

  .ss-portal-prem-meta {
    color: var(--ink3);
    font-size: 11.5px;
    font-family: var(--mono);
    margin-top: 8px;
  }

  .ss-portal-empty {
    color: var(--ink3);
    font-size: 13px;
    padding: 22px 6px;
  }

  /* 侧边栏：吸附在 sticky 品牌条(64)+导航(60) 之下 */
  .ss-portal-side {
    display: grid;
    gap: 14px;
    position: sticky;
    top: 140px;
  }

  .ss-portal-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--panel);
    padding: 18px;
  }

  .ss-portal-member { border-color: color-mix(in srgb, var(--copper) 45%, var(--line)); }

  .ss-portal-card-title {
    color: var(--ink);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.02em;
  }

  .ss-portal-card-sub {
    color: var(--ink2);
    font-size: 12.5px;
    line-height: 1.65;
    margin-top: 7px;
  }

  .ss-portal-tiers { margin-top: 12px; display: grid; gap: 8px; }

  .ss-portal-tier {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    color: var(--ink2);
    font-size: 13px;
  }

  .ss-portal-tier b {
    color: var(--ink);
    font-family: var(--mono);
    font-size: 15px;
    font-weight: 800;
  }

  .ss-portal-tier b i {
    font-style: normal;
    color: var(--ink3);
    font-size: 11px;
    font-weight: 400;
  }

  .ss-portal-seats {
    margin-top: 10px;
    color: var(--copper);
    font-size: 12px;
    font-weight: 700;
  }

  .ss-portal-member-cta {
    width: 100%;
    height: 42px;
    border-radius: 11px;
    font-size: 13px;
    margin-top: 14px;
  }

  .ss-portal-topics { margin-top: 10px; display: grid; }

  .ss-portal-topic {
    display: flex;
    align-items: baseline;
    gap: 10px;
    width: 100%;
    text-align: left;
    padding: 8px 2px;
    background: transparent;
    border: 0;
    color: var(--ink2);
    font-size: 13px;
    line-height: 1.5;
    transition: color 0.15s ease;
  }

  .ss-portal-topic:hover { color: var(--copper); }

  .ss-portal-topic i {
    font-style: normal;
    font-family: var(--mono);
    color: var(--ink3);
    font-size: 12px;
    flex: 0 0 auto;
  }

  .ss-portal-tool-cta {
    margin-top: 12px;
    padding: 9px 16px;
    border: 1px solid var(--line2);
    border-radius: 10px;
    background: var(--panel2);
    color: var(--ink);
    font-size: 13px;
    font-weight: 700;
    transition: border-color 0.15s ease, color 0.15s ease;
  }

  .ss-portal-tool-cta:hover {
    border-color: var(--copper);
    color: var(--copper);
  }

  .ss-portal-video {
    background: transparent;
    border: 0;
    color: var(--ink3);
    font-size: 12.5px;
    text-align: center;
    padding: 4px;
    transition: color 0.15s ease;
  }

  .ss-portal-video:hover { color: var(--ink); }
}

/* 14-techbridge-bridge.css */
/* Tech Bridge design language: graphite field, sharp editorial type, orange/green signal. */
:root {
  --visual-paper: #080a0b;
  --visual-paper-strong: #0d1112;
  --visual-paper-soft: #101516;
  --visual-ink: #f2f1ed;
  --visual-ink-soft: rgba(242, 241, 237, .68);
  --visual-line: rgba(242, 241, 237, .16);
  --visual-copper: #e95d21;
  --visual-graphite: #080a0b;
/* Techbridge has five brand fonts, but the Silicon Story H5 source uses only
   Noto Sans SC for Chinese UI and Syne for English/brand marks. The serif is
   reserved for long-form editorial treatment, never for H5 interface titles. */
  --font-en-display: "Syne", sans-serif;
  --font-en-serif: "DM Serif Display", Georgia, serif;
  --font-cn-display: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, serif;
  --font-cn-body: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Hiragino Sans GB", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, monospace;
  --tb-black: #080a0b;
  --tb-ink: #f2f1ed;
  --tb-muted: rgba(242, 241, 237, .61);
  --tb-orange: #e95d21;
  --tb-green: #20b2aa;
  --tb-line: rgba(242, 241, 237, .16);
}
.site,.phone-shell,.site-footer { background: var(--tb-black); color: var(--tb-ink); }
.site-footer { border-color: var(--tb-line); }
.site-footer a,.site-footer span { color: var(--tb-muted); }

/* The shell keeps the product on the same graphite field on every route. */
#app.app-shell { --cn: var(--font-cn-body); --mono: var(--font-mono); }
#app.app-shell[data-theme="halo"],#app.app-shell[data-theme="obsidian"] {
  --bg: #080a0b;
  --panel: #0d1112;
  --panel2: #121718;
  --panelHi: #171e1f;
  --line: rgba(242, 241, 237, .14);
  --line2: rgba(242, 241, 237, .23);
  --ink: #f2f1ed;
  --ink2: rgba(242, 241, 237, .68);
  --ink3: rgba(242, 241, 237, .46);
  --copper: #e95d21;
  --cyan: #20b2aa;
  --grid: rgba(242, 241, 237, .045);
  --glow: rgba(32, 178, 170, .18);
  --cardshadow: 0 16px 42px rgba(0, 0, 0, .30);
  --core-bg: #0d1112;
  --core-line: rgba(242, 241, 237, .16);
  --core-grid: rgba(242, 241, 237, .08);
  --core-scan: rgba(242, 241, 237, .12);
}
#app.app-shell .ss-header,#app.app-shell .ss-tabbar {
  background: #0b0e0f!important;
  border-color: var(--tb-line)!important;
  box-shadow: none!important;
  backdrop-filter: none!important;
  -webkit-backdrop-filter: none!important;
}
#app.app-shell .ss-brand-name { color: var(--tb-ink); font-family: var(--font-cn-body); font-weight:900; letter-spacing: .1em; }
#app.app-shell .ss-brand-os { color: var(--tb-orange); font-family: var(--font-mono); }
#app.app-shell .ss-mode-btn,#app.app-shell .ss-upgrade-pill { border-color: var(--tb-line); background: transparent; color: var(--tb-ink); }
#app.app-shell .ss-tab .ss-tab-label { color: var(--tb-muted); font-family: var(--font-cn-body); font-weight:500; letter-spacing:.03em; }
#app.app-shell .ss-tab.active .ss-tab-label,#app.app-shell .ss-tab:hover .ss-tab-label { color: var(--tb-ink); }
#app.app-shell .ss-tab .ss-tab-bar { background: var(--tb-orange)!important; box-shadow: none!important; }
.app-shell[data-page="feed"] { background: var(--tb-black); color: var(--tb-ink); }
.app-shell[data-page="feed"] .page { background: var(--tb-black); }
.tb-case-library { padding: 0 0 calc(112 * var(--rpx)); background: var(--tb-black); color: var(--tb-ink); }
.tb-library-hero { position: relative; min-height: 390px; padding: 42px 22px 30px; overflow: hidden; border-bottom: 1px solid var(--tb-line); background-image: linear-gradient(rgba(255,255,255,.042) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.042) 1px, transparent 1px); background-size: 28px 28px; }
.tb-library-hero::after { content:""; position:absolute; width:330px; height:330px; right:-170px; top:60px; border:1px solid var(--tb-green); border-radius:50%; box-shadow:0 0 0 38px #20b2aa0d,0 0 0 76px #e95d2109; }
.tb-library-mark { display:flex; gap:5px; align-items:center; margin-bottom:32px; }
.tb-library-mark span { display:block; width:22px; height:7px; background:var(--tb-orange); transform:skewX(-28deg); }
.tb-library-mark span:last-child { width:12px; background:var(--tb-green); }
.tb-library-kicker,.tb-case-meta,.tb-case-list-heading small,.tb-member-bridge span,.tb-channel-lock { font-family: var(--font-mono); letter-spacing:.12em; font-size:10px; text-transform:uppercase; }
.tb-library-kicker { color:var(--tb-orange); }
.tb-library-hero h1 { position:relative; z-index:1; margin:18px 0 14px; max-width:680px; color:var(--tb-ink); font-family:var(--font-cn-body); font-size:clamp(39px,10vw,76px); font-weight:900; letter-spacing:-.025em; line-height:1.12; }
.tb-library-hero h1 em { color:var(--tb-orange); font-family:var(--font-en-display); font-style:normal; font-weight:800; letter-spacing:-.045em; }
.tb-library-hero p { position:relative; z-index:1; max-width:570px; color:var(--tb-muted); font-size:15px; line-height:1.8; }
.tb-library-cta { position:relative; z-index:1; display:flex; align-items:center; gap:16px; margin-top:24px; }
.tb-library-cta button,.tb-member-bridge button { border:1px solid var(--tb-orange); background:var(--tb-orange); color:#fff; padding:13px 16px; font:700 13px var(--font-cn-body); cursor:pointer; }
.tb-library-cta span { color:var(--tb-green); font:11px var(--font-mono); }
.tb-case-feature { margin:24px 16px 8px; padding:22px 18px; border:1px solid var(--tb-green); background:linear-gradient(145deg,rgba(32,178,170,.10),rgba(8,13,14,.96) 58%); }
.tb-case-feature-top { display:flex; align-items:baseline; justify-content:space-between; gap:12px; color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.11em; }
.tb-case-feature-top small { color:var(--tb-muted); font:10px var(--font-cn-body); letter-spacing:0; }
.tb-case-feature h2 { max-width:760px; margin:18px 0 9px; color:var(--tb-ink); font:900 clamp(24px,6vw,42px)/1.24 var(--font-cn-body); letter-spacing:-.025em; }
.tb-case-feature > p { max-width:710px; margin:0; color:var(--tb-muted); font:14px/1.75 var(--font-cn-body); }
.tb-case-feature-command { margin-top:20px; }
.tb-case-feature-command > span { display:block; margin-bottom:7px; color:var(--tb-orange); font:10px var(--font-mono); letter-spacing:.1em; }
.tb-case-feature-command pre { overflow:auto; margin:0; padding:13px; border:1px solid rgba(32,178,170,.42); background:#070a0b; color:#c7f4ef; font:11px/1.7 var(--font-mono); white-space:pre-wrap; }
.tb-case-feature-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:15px; }
.tb-case-feature-actions .tb-case-source { margin-top:0; }
.tb-case-list { padding:25px 16px 8px; }
.tb-case-list-heading { display:flex; justify-content:space-between; align-items:baseline; padding:0 6px 12px; border-bottom:1px solid var(--tb-line); color:var(--tb-ink); font-size:17px; font-weight:800; }
.tb-case-list-heading small { color:var(--tb-muted); font-size:9px; }
.tb-case { display:grid; grid-template-columns:38px minmax(0,1fr) auto; gap:11px; padding:19px 6px; border-bottom:1px solid var(--tb-line); }
.tb-case-index { color:var(--tb-orange); font:20px/1 var(--font-mono); }
.tb-case-meta { color:var(--tb-green); font-size:9px; letter-spacing:.08em; }
.tb-case h2 { margin:7px 0; color:var(--tb-ink); font-family:var(--font-cn-body); font-size:18px; font-weight:900; letter-spacing:0; line-height:1.42; }
.tb-case p { margin:0; color:var(--tb-muted); font-size:12px; line-height:1.65; }
.tb-case-command { overflow:auto; margin:14px 0 0; padding:12px; border:1px solid rgba(32,178,170,.55); color:#c7f4ef; background:#0a0d0e; font:11px/1.65 var(--font-mono); white-space:pre-wrap; }
.tb-case-source { display:inline-flex; margin-top:12px; color:var(--tb-muted); font:10px var(--font-mono); letter-spacing:.07em; text-decoration:none; }
.tb-case-source:hover { color:var(--tb-green); }
.tb-case-action { display:flex; flex-direction:column; align-items:center; gap:8px; }
.tb-case-copy { border:1px solid var(--tb-green); background:transparent; color:var(--tb-green); padding:8px 9px; white-space:nowrap; font:11px var(--font-cn-body); cursor:pointer; }
.tb-case-copy.is-copied { background:var(--tb-green); color:#07110f; }
.tb-case-copy.is-locked { border-color:var(--tb-orange); color:var(--tb-orange); }
.tb-case-save { padding:0; border:0; background:transparent; color:var(--tb-muted); font:10px var(--font-cn-body); cursor:pointer; white-space:nowrap; }
.tb-template-library { padding:28px 16px 8px; }
.tb-template-grid { display:grid; gap:1px; margin-top:14px; background:var(--tb-line); border:1px solid var(--tb-line); }
.tb-template-card { display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; position:relative; min-height:160px; padding:18px 18px 54px; background:#0b0f10; }
.tb-template-index { color:var(--tb-orange); font:12px var(--font-mono); letter-spacing:.08em; }
.tb-template-copy span { color:var(--tb-green); font:9px var(--font-mono); letter-spacing:.1em; }
.tb-template-copy h3 { margin:8px 0 7px; color:var(--tb-ink); font:900 17px/1.4 var(--font-cn-body); }
.tb-template-copy p { margin:0; color:var(--tb-muted); font:12px/1.65 var(--font-cn-body); }
.tb-template-copy small { display:block; margin-top:11px; color:rgba(242,241,237,.42); font:9px/1.55 var(--font-mono); }
.tb-template-card > button { position:absolute; left:72px; bottom:17px; padding:0; border:0; background:transparent; color:var(--tb-orange); font:800 11px var(--font-cn-body); cursor:pointer; }
.tb-template-card > button::after { content:" →"; }
.tb-member-bridge { display:flex; gap:18px; align-items:flex-end; justify-content:space-between; margin:26px 16px; padding:21px 18px; border:1px solid var(--tb-line); border-left:2px solid var(--tb-green); background:#0d1112; }
.tb-member-bridge span { color:var(--tb-green); font-size:9px; }
.tb-member-bridge h2 { margin:8px 0; color:var(--tb-ink); font-family:var(--font-cn-body); font-size:20px; font-weight:900; letter-spacing:0; line-height:1.42; }
.tb-member-bridge p { max-width:460px; margin:0; color:var(--tb-muted); font-size:12px; line-height:1.65; }
.tb-member-bridge button { flex:0 0 auto; background:transparent; color:var(--tb-orange); }
.tb-member-bridge-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:flex-end; }
.tb-member-bridge-actions button:last-child { border-color:var(--tb-line); color:var(--tb-muted); }

/* 专栏：保持阅读像阅读，不把每篇文章做成营销卡片。 */
.ss-prem-reading { padding-bottom:44px; }
.ss-prem-reading-kicker { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ss-prem-reading h1 { margin:14px 0 0; color:var(--ink); font:900 clamp(30px,7vw,54px)/1.24 var(--font-cn-display); letter-spacing:-.035em; }
.ss-prem-reading-meta,.ss-prem-list-item-meta { display:flex; flex-wrap:wrap; gap:9px; margin-top:13px; color:var(--ink3); font:10px var(--font-mono); letter-spacing:.035em; }
.ss-prem-reading-meta span + span::before,.ss-prem-list-item-meta span + span::before { content:"/"; margin-right:9px; color:var(--line2); }
.ss-prem-reading-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.ss-prem-save { border:1px solid var(--line2); border-radius:999px; background:transparent; color:var(--ink2); padding:7px 13px; font:600 12px var(--font-cn-body); cursor:pointer; }
.ss-prem-save:hover { color:var(--copper); border-color:var(--copper); }
.ss-prem-reading-summary { max-width:620px; color:var(--ink2); font-size:17px; line-height:1.8; }
.ss-prem-sources { margin-top:34px; padding-top:20px; border-top:1px solid var(--line); }
.ss-prem-sources > div { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }
.ss-prem-sources h2 { margin:0; color:var(--ink); font:800 15px var(--font-cn-body); }
.ss-prem-sources > div p { max-width:440px; margin:0; color:var(--ink3); font-size:11px; line-height:1.55; text-align:right; }
.ss-prem-sources ol { display:grid; gap:0; margin:12px 0 0; padding:0; list-style:none; }
.ss-prem-sources li { border-top:1px solid var(--line); }
.ss-prem-sources a { display:grid; grid-template-columns:34px minmax(0,1fr) 16px; gap:10px; align-items:center; padding:13px 0; color:inherit; text-decoration:none; }
.ss-prem-sources a i { color:var(--copper); font:10px var(--font-mono); font-style:normal; }
.ss-prem-sources a span { display:grid; gap:3px; min-width:0; }
.ss-prem-sources a b { overflow:hidden; color:var(--ink2); font:700 12px/1.45 var(--font-cn-body); text-overflow:ellipsis; white-space:nowrap; }
.ss-prem-sources a small { color:var(--ink3); font:9px/1.4 var(--font-mono); }
.ss-prem-sources a strong { color:var(--copper); font-weight:500; }
.ss-prem-reading-end { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:42px; padding-top:18px; border-top:1px solid var(--line); color:var(--ink3); font-size:12px; }
.ss-prem-reading-end .is-end { flex:0 0 auto; }
.ss-prem-list-item { width:100%; padding:18px 0; border:0; border-bottom:1px solid var(--line); background:transparent; color:inherit; text-align:left; cursor:pointer; }
.ss-prem-list-item:first-child { border-top:1px solid var(--line); }
.ss-prem-list-item-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.ss-prem-card-title { color:var(--ink); font:800 19px/1.44 var(--font-cn-display); letter-spacing:-.012em; }
.ss-prem-card-sub { display:-webkit-box; overflow:hidden; margin-top:8px; color:var(--ink2); font-size:13px; line-height:1.68; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.ss-prem-list-item-meta { align-items:center; }
.ss-prem-list-item-meta b { margin-left:auto; color:var(--copper); font:600 11px var(--font-cn-body); }
.ss-prem-list-item:hover .ss-prem-card-title,.ss-prem-list-item:hover .ss-prem-list-item-meta b { color:var(--copper); }
.ss-prem-current-label { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:0 0 3px; color:var(--ink); font:800 13px var(--font-cn-body); }
.ss-prem-current-label span { color:var(--ink3); font:10px var(--font-mono); letter-spacing:.02em; }
.ss-prem-archive { margin-top:13px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.ss-prem-archive summary { display:flex; align-items:baseline; gap:9px; padding:17px 0; color:var(--ink2); cursor:pointer; list-style:none; }
.ss-prem-archive summary::-webkit-details-marker { display:none; }
.ss-prem-archive summary span { color:var(--ink); font:800 14px var(--font-cn-body); }
.ss-prem-archive summary b { color:var(--ink3); font:400 11px var(--font-cn-body); }
.ss-prem-archive summary i { margin-left:auto; color:var(--copper); font:11px var(--font-cn-body); font-style:normal; }
.ss-prem-archive[open] summary i { font-size:0; }
.ss-prem-archive[open] summary i::after { content:"收起"; font-size:11px; }
.ss-prem-archive-list { padding-bottom:2px; }
.tb-library-divider { margin:34px 16px 10px; color:var(--tb-muted); text-align:center; font:10px var(--font-mono); letter-spacing:.12em; }
.tb-daily-column { margin:0 16px 28px; border:1px solid var(--tb-line); background:#0d1112; color:var(--tb-ink); }
.tb-daily-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:22px 20px 16px; border-bottom:1px solid var(--tb-line); }
.tb-daily-top span,.tb-daily-item span,.tb-daily-footer span { color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.1em; text-transform:uppercase; }
.tb-daily-top h2 { margin:6px 0 0; font:900 25px/1 var(--font-cn-body); letter-spacing:0; }
.tb-daily-top i { display:block; width:12px; height:12px; margin-top:4px; border-radius:50%; background:var(--tb-orange); box-shadow:0 0 0 5px #e95d2121; }
.tb-daily-intro { margin:0; padding:16px 20px; color:var(--tb-muted); border-bottom:1px solid var(--tb-line); font-size:12px; line-height:1.65; }
.tb-daily-item { display:grid; grid-template-columns:52px minmax(0,1fr); gap:12px; padding:17px 20px; border-bottom:1px solid var(--tb-line); }
.tb-daily-time { color:var(--tb-orange); font:12px var(--font-mono); }
.tb-daily-item h3 { margin:7px 0 5px; color:var(--tb-ink); font:900 16px/1.43 var(--font-cn-body); letter-spacing:0; }
.tb-daily-item p { display:-webkit-box; overflow:hidden; margin:0; color:var(--tb-muted); -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:11px; line-height:1.55; }
.tb-daily-item button { margin-top:10px; padding:0; border:0; color:var(--tb-green); background:transparent; font:11px var(--font-cn-body); cursor:pointer; }
.tb-daily-item.is-pending h3 { color:rgba(242,241,237,.62); }
.tb-daily-item.is-pending p { color:rgba(242,241,237,.42); }
.tb-daily-footer { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 20px; }
.tb-daily-footer button { padding:0; border:0; background:transparent; color:var(--tb-ink); font:600 12px var(--font-cn-body); cursor:pointer; }
.tb-wecom-card { border-left:2px solid var(--tb-orange)!important; }
.tb-channel-lock { display:flex; justify-content:space-between; gap:8px; margin-top:13px; padding:9px 10px; border:1px solid var(--line2); color:var(--tb-orange); font-size:9px; letter-spacing:.05em; }
.tb-channel-lock span { color:var(--tb-green); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* H5 hierarchy follows its source prototype: Chinese UI in sans, signals in mono. */
#app .h1,#app .h2,#app .scene-title,#app .daily-title,#app .asset-card-title,#app .retention-title,#app .timeline-title,#app .plan-title,#app .benefit-title,#app .member-title,#app .ritual-entry-card b,#app .mode-switch-button b,#app .wow-path-step b {
  font-family:var(--font-cn-body); font-weight:900; letter-spacing:0;
}
#app .eyebrow,#app .daily-kicker,#app .section-kicker,#app .ritual-mark,#app .ritual-topline,#app .wow-path-step span {
  font-family:var(--font-mono); font-weight:400; letter-spacing:.12em; text-transform:uppercase;
}
@media (min-width:900px) {
  .app-shell[data-page="feed"] .page { max-width:none; margin:0; }
  .app-shell[data-page="feed"] .tb-case-library.ss-screen { width:100%; max-width:none!important; margin:0; padding:0 40px 100px; }
  .tb-case-library { max-width:1480px; margin:0 auto; }
  .tb-library-workbench { display:block; border-left:1px solid var(--tb-line); border-right:1px solid var(--tb-line); }
  .tb-library-main { min-width:0; }
  .tb-library-hero { min-height:478px; padding:66px 64px 54px; }
  .tb-library-hero h1 { max-width:690px; font-size:clamp(54px,5vw,82px); }
  .tb-library-hero p { max-width:620px; font-size:15px; }
  .tb-case-feature { margin:34px 64px 10px; padding:31px 32px; }
  .tb-case-list { padding:38px 64px 8px; }
  .tb-template-library { padding:42px 64px 8px; }
  .tb-template-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tb-template-card { min-height:176px; padding:22px 22px 58px; }
  .tb-template-card > button { left:76px; bottom:20px; }
  .tb-case-list-heading { padding:0 0 14px; }
  .tb-case { grid-template-columns:58px minmax(0,1fr) 108px; gap:16px; padding:24px 0; }
  .tb-case h2 { font-size:24px; }
  .tb-case p { max-width:720px; font-size:13px; }
  .tb-case-copy { min-width:92px; }
  .tb-member-bridge { margin:38px 64px; padding:30px; }
  .ss-prem-reading h1 { font-size:46px; }
  .ss-prem-card-title { font-size:22px; }
  .tb-daily-column { position:sticky; top:74px; align-self:start; margin:0; border:0; background:#0b0e0f; min-height:478px; }
  .tb-daily-top { padding:29px 24px 20px; }
  .tb-daily-intro { padding:18px 24px; }
  .tb-daily-item { grid-template-columns:48px minmax(0,1fr); gap:10px; padding:20px 24px; }
  .tb-daily-item h3 { font-size:17px; }
  .tb-daily-footer { padding:19px 24px; }
  .tb-library-divider { margin:54px 64px 18px; }
}
@media (min-width:1180px) {
  .tb-library-hero { padding-left:76px; padding-right:76px; }
  .tb-case-feature { margin-left:76px; margin-right:76px; }
  .tb-case-list { padding-left:76px; padding-right:76px; }
  .tb-template-library { padding-left:76px; padding-right:76px; }
  .tb-member-bridge { margin-left:76px; margin-right:76px; }
}
@media (max-width:640px) {
  .ss-prem-sources > div { align-items:flex-start; flex-direction:column; gap:5px; }
  .ss-prem-sources > div p { text-align:left; }
}

/* Product reset: the home is now a daily intelligence desk; tools stay contextual. */
.app-shell[data-page="scenes"] .ss-scroll { background:var(--tb-black); }
.ss-today { width:100%; max-width:1480px; margin:0 auto; padding:0 16px 104px; color:var(--tb-ink); }
.ss-today-top { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; padding-top:16px; }
.ss-today-hero,.ss-today-signals,.ss-today-tool,.ss-today-article,.ss-today-moment,.ss-list-row { border:1px solid var(--tb-line); background:#0d1112; }
.ss-today-hero { min-height:330px; padding:28px 24px; }
.ss-today-hero { position:relative; overflow:hidden; }
.ss-today-hero::after { content:""; position:absolute; right:8%; bottom:-124px; width:270px; height:270px; border:1px solid rgba(32,178,170,.32); border-radius:50%; box-shadow:0 0 0 34px rgba(32,178,170,.035),0 0 0 68px #e95d2106; pointer-events:none; }
.ss-today-hero > * { position:relative; z-index:1; }
.ss-today-hero > p { margin:0; color:var(--tb-orange); font:10px var(--font-mono); letter-spacing:.13em; }
.ss-today-hero h1 { margin:24px 0 15px; color:var(--tb-ink); font:900 clamp(40px,9vw,76px)/1.08 var(--font-cn-body); letter-spacing:-.03em; }
.ss-today-hero > div { max-width:520px; color:var(--tb-muted); font-size:14px; line-height:1.7; }
.ss-today-primary { margin-top:28px; padding:14px 18px; border:1px solid var(--tb-orange); background:var(--tb-orange); color:#fff; font:700 14px var(--font-cn-body); cursor:pointer; }
.ss-today-signals { min-width:0; }
.ss-today-section-head { display:flex; align-items:baseline; justify-content:space-between; gap:14px; border-bottom:1px solid var(--tb-line); padding:16px 18px; }
.ss-today-section-head h2 { margin:0; color:var(--tb-ink); font:900 20px var(--font-cn-body); letter-spacing:0; }
.ss-today-section-head button { padding:0; border:0; background:transparent; color:var(--tb-green); font:11px var(--font-cn-body); cursor:pointer; }
.ss-today-signal { display:grid; grid-template-columns:38px minmax(0,1fr) 18px; gap:10px; width:100%; padding:15px 18px; border:0; border-bottom:1px solid var(--tb-line); background:transparent; color:inherit; text-align:left; cursor:pointer; }
.ss-today-signal > span { color:var(--tb-orange); font:12px var(--font-mono); }
.ss-today-signal em,.ss-today-signal b,.ss-today-signal i { display:block; }
.ss-today-signal em,.ss-today-section-head > div > span { color:var(--tb-green); font:9px var(--font-mono); font-style:normal; letter-spacing:.08em; }
.ss-today-signal b { margin-top:4px; color:var(--tb-ink); font:800 14px/1.45 var(--font-cn-body); }
.ss-today-signal i { overflow:hidden; margin-top:3px; color:var(--tb-muted); font:11px/1.55 var(--font-cn-body); font-style:normal; white-space:nowrap; text-overflow:ellipsis; }
.ss-today-signal strong { align-self:center; color:var(--tb-green); font:18px/1 var(--font-mono); font-weight:400; }
.ss-today-signal.is-pending { cursor:default; }
.ss-today-signal.is-pending > div { grid-column:2 / 4; }
.ss-today-editor-note { display:flex; gap:10px; align-items:baseline; padding:15px 18px; color:var(--tb-muted); background:#0b0e0f; font-size:11px; line-height:1.5; }
.ss-today-editor-note b { color:var(--tb-ink); font:800 12px var(--font-cn-body); }
.ss-today-band { margin-top:14px; border:1px solid var(--tb-line); background:#0b0e0f; }
.ss-today-tools { display:grid; gap:1px; background:var(--tb-line); }
.ss-agent-book .ss-today-section-head { align-items:flex-end; }
.ss-agent-book-intro { max-width:720px; margin:0; padding:16px 18px; border-bottom:1px solid var(--tb-line); color:var(--tb-muted); font-size:12px; line-height:1.65; }
.ss-today-tool { min-width:0; padding:19px 18px; border:0; }
.ss-today-tool > span,.ss-today-article > div > span,.ss-list-open > span { color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.08em; }
.ss-today-tool h3 { margin:9px 0 7px; color:var(--tb-ink); font:900 18px var(--font-cn-body); }
.ss-today-tool p { min-height:38px; margin:0; color:var(--tb-muted); font-size:12px; line-height:1.6; }
.ss-today-tool code { display:block; overflow:hidden; margin-top:15px; padding:10px; border:1px solid rgba(32,178,170,.42); color:#c7f4ef; background:#080a0b; font:10px/1.55 var(--font-mono); white-space:nowrap; text-overflow:ellipsis; }
.ss-today-tool > div,.ss-today-article-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.ss-today-tool > div button,.ss-today-article-actions button,.ss-today-save { padding:0; border:0; background:transparent; color:var(--tb-orange); font:700 12px var(--font-cn-body); cursor:pointer; }
.ss-today-save { color:var(--tb-muted)!important; font-weight:500!important; }
.ss-today-save.is-saved { color:var(--tb-green)!important; }
.ss-today-article { display:flex; flex-direction:column; gap:16px; padding:20px 18px; }
.ss-today-article h3 { margin:8px 0; color:var(--tb-ink); font:900 21px/1.38 var(--font-cn-body); }
.ss-today-article p { margin:0; color:var(--tb-muted); font-size:13px; line-height:1.7; }
.ss-today-moments > div { display:grid; gap:1px; background:var(--tb-line); }
.ss-today-moment { display:block; width:100%; padding:16px 18px; border:0; color:var(--tb-ink); text-align:left; cursor:pointer; }
.ss-today-moment b { display:block; color:var(--tb-orange); font-size:12px; }
.ss-today-moment span { display:block; margin-top:5px; color:var(--tb-muted); font-size:12px; line-height:1.55; }
.ss-today-empty { margin:0; padding:28px 18px; color:var(--tb-muted); font-size:12px; }
.ss-today-column-empty { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; }
.ss-today-column-empty > button,.ss-member-band button { border:1px solid var(--tb-orange); background:var(--tb-orange); color:#fff; padding:12px 14px; font:700 12px var(--font-cn-body); cursor:pointer; white-space:nowrap; }
.ss-member-band { display:flex; flex-direction:column; gap:20px; margin-top:14px; padding:24px 20px; border:1px dashed rgba(32,178,170,.55); background:#0d1112; }
.ss-member-band span { color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.1em; }
.ss-member-band h2 { margin:8px 0; color:var(--tb-ink); font:900 24px/1.35 var(--font-cn-body); }
.ss-member-band p { max-width:700px; margin:0; color:var(--tb-muted); font-size:12px; line-height:1.65; }
.ss-member-band > div:last-child { display:flex; flex-wrap:wrap; gap:10px; }
.ss-member-band > div:last-child button:last-child { border-color:var(--tb-line); background:transparent; color:var(--tb-muted); }

.ss-member-fab { position:fixed; right:16px; bottom:calc(var(--tabbar-reserved-height) + 16px); z-index:20; display:flex; align-items:center; gap:10px; min-height:44px; padding:0 13px 0 15px; border:1px solid var(--tb-orange); border-radius:999px; background:var(--tb-orange); box-shadow:0 12px 30px rgba(0,0,0,.34); color:#fff; font:800 12px var(--font-cn-body); cursor:pointer; }
.ss-member-fab b { font:700 16px/1 var(--font-mono); }
.ss-member-fab.is-active { border-color:rgba(32,178,170,.8); background:#0d1112; color:var(--tb-green); }
.ss-my-list { max-width:960px; margin:0 auto; padding:20px 16px 116px; }
.ss-my-list-head { max-width:620px; margin:15px 0 28px; }
.ss-my-list-label { color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.12em; }
.ss-my-list-head h1 { margin:0; color:var(--tb-ink); font:900 clamp(34px,6vw,58px)/1.1 var(--font-cn-body); }
.ss-my-list-head p { margin:12px 0 0; color:var(--tb-muted); font-size:13px; line-height:1.7; }
.ss-my-member-card { position:relative; overflow:hidden; margin:0 0 14px; padding:22px 20px; border:1px solid rgba(32,178,170,.55); background:linear-gradient(145deg,#0f1718,#090b0c); }
.ss-my-member-card::after { position:absolute; right:-50px; bottom:-58px; width:170px; height:170px; border:1px solid rgba(32,178,170,.25); border-radius:50%; content:""; }
.ss-my-member-top { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.ss-my-member-top span,.ss-my-utility-grid span { color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.1em; }
.ss-my-member-top b { color:var(--tb-orange); font:700 11px var(--font-cn-body); }
.ss-my-member-card h2 { position:relative; z-index:1; max-width:620px; margin:15px 0 9px; color:var(--tb-ink); font:900 25px/1.35 var(--font-cn-body); }
.ss-my-member-card p { position:relative; z-index:1; max-width:550px; margin:0; color:var(--tb-muted); font-size:12px; line-height:1.65; }
.ss-my-primary { position:relative; z-index:1; margin-top:18px; padding:12px 15px; border:1px solid var(--tb-orange); background:var(--tb-orange); color:#fff; font:800 12px var(--font-cn-body); cursor:pointer; }
.ss-trade-profile { margin:0 0 14px; padding:20px; border:1px solid var(--tb-line); border-left:2px solid var(--tb-orange); background:linear-gradient(145deg,#151311,#0b0f10 66%); }
.ss-trade-profile.is-locked { border-left-color:var(--tb-green); }
.ss-trade-profile-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.ss-trade-profile-head span { color:var(--tb-green); font:10px var(--font-mono); letter-spacing:.1em; }
.ss-trade-profile-head h2 { max-width:650px; margin:10px 0 0; color:var(--tb-ink); font:900 23px/1.35 var(--font-cn-body); letter-spacing:-.03em; }
.ss-trade-profile-head > b { flex:0 0 auto; color:var(--tb-orange); font:700 10px/1.4 var(--font-mono); }
.ss-trade-profile > p { max-width:720px; margin:12px 0 0; color:var(--tb-muted); font:12px/1.7 var(--font-cn-body); }
.ss-trade-profile-form { display:grid; gap:14px; margin-top:22px; }
.ss-trade-profile-form label { display:grid; gap:7px; min-width:0; }
.ss-trade-profile-form label > span { color:var(--tb-muted); font:10px var(--font-mono); letter-spacing:.05em; }
.ss-trade-profile-form input,.ss-trade-profile-form select,.ss-trade-profile-form textarea { width:100%; min-width:0; min-height:44px; padding:0 12px; border:1px solid var(--tb-line); border-radius:0; outline:0; background:#090d0e; color:var(--tb-ink); font:13px var(--font-cn-body); transition:border-color .16s ease,box-shadow .16s ease; }
.ss-trade-profile-form textarea { min-height:92px; padding:12px; line-height:1.6; resize:vertical; }
.ss-trade-profile-form input:focus,.ss-trade-profile-form select:focus,.ss-trade-profile-form textarea:focus { border-color:var(--tb-green); box-shadow:0 0 0 2px rgba(32,178,170,.1); }
.ss-trade-profile-actions { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:17px; }
.ss-trade-profile-actions small { color:var(--tb-muted); font:10px/1.5 var(--font-cn-body); }
.ss-trade-profile-actions button { flex:0 0 auto; min-height:42px; padding:0 15px; border:1px solid var(--tb-orange); background:var(--tb-orange); color:#fff; font:800 12px var(--font-cn-body); cursor:pointer; }
.ss-trade-profile-actions button:disabled { opacity:.55; cursor:wait; }
.ss-trade-profile-error { margin-top:12px; color:var(--tb-orange); font:11px/1.5 var(--font-cn-body); }
.ss-my-utility-grid { display:grid; gap:1px; margin:0 0 30px; background:var(--tb-line); }
.ss-my-utility-grid article { min-height:182px; padding:18px; background:var(--tb-panel); }
.ss-my-utility-grid b { display:block; margin-top:9px; color:var(--tb-ink); font:900 18px var(--font-cn-body); }
.ss-my-utility-grid p { max-width:340px; margin:7px 0 0; color:var(--tb-muted); font-size:12px; line-height:1.6; }
.ss-my-text-button,.ss-my-secondary { margin-top:14px; padding:0; border:0; background:transparent; color:var(--tb-orange); font:800 12px var(--font-cn-body); cursor:pointer; }
.ss-my-service-card { position:relative; padding-right:132px!important; }
.ss-my-service-card img { position:absolute; right:18px; bottom:18px; width:94px; height:94px; border:1px solid var(--tb-line); object-fit:cover; }
.ss-my-service-card .ss-my-secondary { display:block; }
.ss-my-list-section { margin-top:4px; }
.ss-list-section-head { display:flex; align-items:baseline; justify-content:space-between; padding:0 0 11px; border-bottom:1px solid var(--tb-line); }
.ss-list-section-head h2 { margin:0; font:900 20px var(--font-cn-body); }
.ss-list-section-head span { color:var(--tb-orange); font:13px var(--font-mono); }
.ss-list-rows { display:grid; }
.ss-list-row { display:grid; grid-template-columns:28px minmax(0,1fr) 26px; gap:10px; align-items:start; padding:15px 12px; border-top:0; }
.ss-list-check,.ss-list-remove { width:24px; height:24px; padding:0; border:1px solid var(--tb-line); background:transparent; color:var(--tb-green); cursor:pointer; }
.ss-list-remove { color:var(--tb-muted); border-color:transparent; font-size:18px; }
.ss-list-open { min-width:0; padding:0; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.ss-list-open > span,.ss-list-open b,.ss-list-open i { display:block; }
.ss-list-open b { margin-top:5px; color:var(--tb-ink); font:800 15px/1.45 var(--font-cn-body); }
.ss-list-open i { margin-top:5px; overflow:hidden; color:var(--tb-muted); font:11px/1.5 var(--font-cn-body); font-style:normal; white-space:nowrap; text-overflow:ellipsis; }
.ss-list-row.is-done b,.ss-list-row.is-done i { opacity:.48; text-decoration:line-through; }
.ss-list-done { margin-top:28px; }
.ss-list-empty { padding:36px 0; border-top:1px solid var(--tb-line); border-bottom:1px solid var(--tb-line); }
.ss-list-empty h2 { margin:0; color:var(--tb-ink); font:900 22px var(--font-cn-body); }
.ss-list-empty p { color:var(--tb-muted); font-size:13px; }
.ss-list-empty div { display:flex; gap:12px; margin-top:18px; }
.ss-list-empty button { padding:10px 13px; border:1px solid var(--tb-line); background:transparent; color:var(--tb-ink); font:700 12px var(--font-cn-body); cursor:pointer; }

@media (min-width:900px) {
  .app-shell[data-page="scenes"] .ss-screen { max-width:none!important; }
  .ss-today { padding:12px 40px 100px; }
  .ss-today-top { grid-template-columns:minmax(0,1.58fr) minmax(330px,.92fr); gap:14px; }
  .ss-today-hero { min-height:408px; padding:45px 48px; }
  .ss-today-hero h1 { font-size:clamp(52px,5vw,80px); }
  .ss-today-signals { min-height:408px; }
  .ss-today-tools { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ss-today-article { flex-direction:row; align-items:flex-start; justify-content:space-between; gap:36px; padding:26px 28px; }
  .ss-today-article > div:first-child { max-width:760px; }
  .ss-today-article-actions { flex:0 0 126px; flex-direction:column; align-items:flex-end; margin-top:2px; }
  .ss-today-moments > div { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ss-member-band { flex-direction:row; align-items:flex-end; justify-content:space-between; padding:30px 32px; }
  .ss-member-band > div:last-child { flex:0 0 auto; justify-content:flex-end; }
  .ss-my-list { padding-top:32px; }
  .ss-member-fab { right:28px; bottom:28px; }
  .ss-my-member-card { padding:30px 32px; }
  .ss-trade-profile { padding:28px 32px; }
  .ss-trade-profile-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ss-trade-profile-form .is-wide { grid-column:1/-1; }
  .ss-my-utility-grid { grid-template-columns:1fr 1fr; }
}

/* Apple-design refactor: one calm material system, open rails, immediate feedback. */
#app.app-shell {
  --apple-surface: rgba(18, 21, 22, .76);
  --apple-surface-solid: #121516;
  --apple-surface-raised: #181c1e;
  --apple-hairline: rgba(255, 255, 255, .115);
  --apple-shadow: 0 18px 42px rgba(0, 0, 0, .26);
  --apple-radius: 22px;
  --apple-ui: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
  --apple-mono: "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace;
  font-family: var(--apple-ui);
  background:
    radial-gradient(ellipse 90% 44% at 50% -8%, #e95d2113, transparent 64%),
    #080a0b;
}

/* The older technical grid competed with the editorial reading hierarchy. */
#app.app-shell::before { opacity: 0; background: none; }
#app.app-shell::after {
  background: radial-gradient(ellipse 90% 42% at 50% -12%, #e95d2111, transparent 66%);
  opacity: 1;
}

#app.app-shell .ss-header,
#app.app-shell .ss-tabbar {
  background: rgba(11, 13, 14, .72) !important;
  border-color: var(--apple-hairline) !important;
  backdrop-filter: blur(24px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.25) !important;
}

#app.app-shell .ss-header {
  min-height: 62px;
  padding: 10px 18px;
}

#app.app-shell .ss-brand { gap: 10px; }
#app.app-shell .ss-brand-name {
  font-family: var(--apple-ui);
  font-size: 17px;
  font-weight: 760;
  letter-spacing: -.015em;
}
#app.app-shell .ss-brand-os {
  margin-top: 3px;
  color: rgba(242, 241, 237, .54);
  font-family: var(--apple-ui);
  font-size: 9px;
  font-weight: 560;
  letter-spacing: .14em;
}
#app.app-shell .ss-mode-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border-color: var(--apple-hairline);
  background: rgba(255, 255, 255, .045);
}

#app.app-shell :is(button, a, [role="button"]) {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
#app.app-shell button {
  transition: transform 150ms cubic-bezier(.2, .7, .2, 1), background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}
#app.app-shell button:active { transform: scale(.975); }
#app.app-shell button:focus-visible {
  outline: 2px solid #e95d21f5;
  outline-offset: 3px;
}

#app.app-shell .ss-tabbar {
  margin: 0 8px 8px;
  border: 1px solid var(--apple-hairline) !important;
  border-radius: 24px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .28) !important;
}

/* 备案属于站点基础信息，不能只藏在桌面页脚。移动端在应用底栏上方恒可见。 */
#app.app-shell .ss-compliance-bar {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  background: #090c0d;
  border-top: 1px solid rgba(242, 241, 237, .08);
  padding: 7px 12px 3px;
  color: rgba(242, 241, 237, .68);
  font: 9.5px/1.4 var(--apple-ui);
  letter-spacing: .01em;
}
#app.app-shell .ss-compliance-bar a { color: inherit; text-decoration: none; }
#app.app-shell .ss-compliance-bar a:active { color: var(--tb-orange); }
#app.app-shell .ss-tab {
  min-height: 54px;
  gap: 5px;
  border-radius: 16px;
}
#app.app-shell .ss-tab:hover { background: rgba(255, 255, 255, .045); }
#app.app-shell .ss-tab .ss-tab-ico { opacity: .75; }
#app.app-shell .ss-tab.active .ss-tab-ico { opacity: 1; filter: none; }
#app.app-shell .ss-tab .ss-tab-label {
  font-family: var(--apple-ui);
  font-size: 10px;
  font-weight: 520;
  letter-spacing: -.01em;
}
#app.app-shell .ss-tab.active .ss-tab-label { font-weight: 700; }
#app.app-shell .ss-tab .ss-tab-bar {
  top: 4px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
}

.app-shell[data-page="scenes"] .ss-scroll { background: transparent; }
.ss-today {
  max-width: 1140px;
  padding: 8px 18px 122px;
}
.ss-today-top {
  gap: 20px;
  padding-top: 18px;
}
.ss-today-hero,
.ss-today-signals,
.ss-today-band,
.ss-today-tool,
.ss-today-article,
.ss-today-moment,
.ss-list-row {
  border: 0;
  background: transparent;
}
.ss-today-hero {
  min-height: 0;
  padding: 24px 4px 12px;
  overflow: visible;
}
.ss-today-hero::after { display: none; }
.ss-today-hero h1 {
  max-width: 720px;
  margin: 0;
  color: #f6f5f1;
  font-family: var(--apple-ui);
  font-size: clamp(42px, 10vw, 76px);
  font-weight: 760;
  letter-spacing: -.065em;
  line-height: 1.05;
}
.ss-today-hero h1 span { color: var(--tb-orange); }
.ss-today-hero > div {
  max-width: 500px;
  margin-top: 17px;
  color: rgba(242, 241, 237, .62);
  font-family: var(--apple-ui);
  font-size: 14px;
  line-height: 1.72;
}
.ss-today-signals {
  overflow: hidden;
  border: 1px solid var(--apple-hairline);
  border-radius: var(--apple-radius);
  background: var(--apple-surface);
  box-shadow: var(--apple-shadow);
}
.ss-today-section-head {
  min-height: 60px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--apple-hairline);
}
.ss-today-section-head h2 {
  font-family: var(--apple-ui);
  font-size: 20px;
  font-weight: 720;
  letter-spacing: -.035em;
}
.ss-today-section-head button,
.ss-today-tool > div button,
.ss-today-article-actions button,
.ss-today-save {
  color: var(--tb-orange);
  font-family: var(--apple-ui);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: -.01em;
}
.ss-today-signal {
  grid-template-columns: 10px minmax(0, 1fr) 20px;
  gap: 12px;
  padding: 16px 18px;
  border-bottom-color: var(--apple-hairline);
}
.ss-today-signal > span {
  width: 8px;
  height: 8px;
  align-self: start;
  margin-top: 7px;
  border-radius: 50%;
  background: var(--tb-orange);
  color: transparent;
  font-size: 0;
}
.ss-today-signal em,
.ss-today-section-head > div > span,
.ss-today-tool > span,
.ss-today-article > div > span,
.ss-list-open > span,
.ss-member-band span {
  color: rgba(242, 241, 237, .48);
  font-family: var(--apple-mono);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .07em;
}
.ss-today-signal b {
  margin-top: 5px;
  font-family: var(--apple-ui);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.42;
}
.ss-today-signal i {
  margin-top: 5px;
  color: rgba(242, 241, 237, .53);
  font-family: var(--apple-ui);
  font-size: 12px;
  line-height: 1.45;
}
.ss-today-signal strong {
  color: rgba(242, 241, 237, .64);
  font-family: var(--apple-ui);
  font-size: 24px;
  font-weight: 340;
}
.ss-today-editor-note {
  padding: 13px 18px;
  background: rgba(255, 255, 255, .025);
  color: rgba(242, 241, 237, .5);
  font-family: var(--apple-ui);
}
.ss-today-editor-note b { font-family: var(--apple-ui); font-weight: 650; }

.ss-today-band {
  margin-top: 26px;
  overflow: hidden;
  border-top: 1px solid var(--apple-hairline);
  border-bottom: 1px solid var(--apple-hairline);
}
.ss-agent-book .ss-today-section-head,
.ss-today-moments .ss-today-section-head { padding-left: 2px; padding-right: 2px; }
.ss-agent-book-intro {
  max-width: 670px;
  padding: 0 2px 18px;
  border-bottom: 0;
  color: rgba(242, 241, 237, .57);
  font-family: var(--apple-ui);
  font-size: 13px;
  line-height: 1.65;
}
.ss-today-tools {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 0 0 18px;
  background: transparent;
  scrollbar-width: none;
}
.ss-today-tools::-webkit-scrollbar { display: none; }
.ss-today-tool {
  display: flex;
  flex: 0 0 min(80vw, 294px);
  flex-direction: column;
  min-height: 218px;
  padding: 19px;
  border: 1px solid var(--apple-hairline);
  border-radius: 18px;
  background: var(--apple-surface);
  box-shadow: 0 10px 25px rgba(0, 0, 0, .16);
}
.ss-today-tool h3 {
  margin: 9px 0 8px;
  font-family: var(--apple-ui);
  font-size: 17px;
  font-weight: 690;
  letter-spacing: -.03em;
}
.ss-today-tool p {
  min-height: 0;
  font-family: var(--apple-ui);
  font-size: 12px;
  line-height: 1.58;
}
.ss-today-tool code {
  margin-top: auto;
  padding: 9px 0 0;
  border: 0;
  border-top: 1px solid var(--apple-hairline);
  background: transparent;
  color: rgba(242, 241, 237, .53);
  font-family: var(--apple-mono);
  font-size: 10px;
}
.ss-today-tool > div { margin-top: 13px; }
.ss-today-tool-featured {
  min-height: 0;
  margin: 0 0 18px;
  padding: 19px;
}
.ss-today-tool-featured p { max-width: 620px; }
.ss-today-tool-featured code { margin-top: 16px; }

.ss-today-explore {
  display: grid;
  gap: 1px;
  margin-top: 26px;
  overflow: hidden;
  border: 1px solid var(--apple-hairline);
  border-radius: 18px;
  background: var(--apple-hairline);
}
.ss-today-explore button {
  display: grid;
  grid-template-columns: minmax(72px, .36fr) minmax(0, 1fr) 20px;
  gap: 8px;
  align-items: center;
  min-height: 66px;
  padding: 14px 17px;
  border: 0;
  background: var(--apple-surface-solid);
  color: var(--tb-ink);
  text-align: left;
  cursor: pointer;
}
.ss-today-explore span {
  color: rgba(242, 241, 237, .52);
  font-family: var(--apple-ui);
  font-size: 13px;
  font-weight: 620;
}
.ss-today-explore b {
  overflow: hidden;
  color: #f2f1ed;
  font-family: var(--apple-ui);
  font-size: 14px;
  font-weight: 620;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ss-today-explore i {
  color: rgba(242, 241, 237, .6);
  font-family: var(--apple-ui);
  font-size: 21px;
  font-style: normal;
  font-weight: 350;
}

.ss-today-article { padding: 22px 2px 20px; }
.ss-today-article h3 {
  margin: 5px 0 9px;
  font-family: var(--apple-ui);
  font-size: 22px;
  font-weight: 720;
  letter-spacing: -.045em;
  line-height: 1.32;
}
.ss-today-article p {
  color: rgba(242, 241, 237, .58);
  font-family: var(--apple-ui);
  font-size: 13px;
  line-height: 1.7;
}
.ss-today-moments > div {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 0 0 18px;
  background: transparent;
  scrollbar-width: none;
}
.ss-today-moments > div::-webkit-scrollbar { display: none; }
.ss-today-moment {
  flex: 0 0 min(60vw, 210px);
  min-height: 110px;
  padding: 17px;
  border: 1px solid var(--apple-hairline);
  border-radius: 18px;
  background: var(--apple-surface);
}
.ss-today-moment b {
  color: #f2f1ed;
  font-family: var(--apple-ui);
  font-size: 13px;
  font-weight: 680;
}
.ss-today-moment span {
  color: rgba(242, 241, 237, .56);
  font-family: var(--apple-ui);
  font-size: 12px;
}

.ss-member-band {
  margin-top: 26px;
  padding: 22px;
  border: 1px solid #e95d215e;
  border-radius: var(--apple-radius);
  background: linear-gradient(135deg, #e95d2124, #141718e6 54%);
  box-shadow: var(--apple-shadow);
}
.ss-member-band h2 {
  margin: 8px 0;
  font-family: var(--apple-ui);
  font-size: 24px;
  font-weight: 720;
  letter-spacing: -.045em;
}
.ss-member-band p { font-family: var(--apple-ui); font-size: 13px; }
.ss-member-band button,
.ss-today-column-empty > button {
  min-height: 42px;
  border: 0;
  border-radius: 999px;
  background: var(--tb-orange);
  box-shadow: 0 10px 22px #e95d2138;
  font-family: var(--apple-ui);
  font-weight: 700;
}
.ss-member-band > div:last-child button:last-child {
  border: 1px solid var(--apple-hairline);
  background: rgba(255, 255, 255, .05);
  box-shadow: none;
  color: #f2f1ed;
}

.ss-member-fab {
  right: 18px;
  /* 不遮挡底部备案行；行动按钮上移，备案信息始终完整可见。 */
  bottom: calc(var(--tabbar-reserved-height) + 62px);
  min-height: 46px;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  background: linear-gradient(135deg, #f47338, #df4d16);
  box-shadow: 0 14px 30px rgba(0, 0, 0, .34), 0 6px 18px #e95d213d;
  font-family: var(--apple-ui);
  font-weight: 700;
  letter-spacing: -.01em;
}
.ss-member-fab.is-active {
  border-color: var(--apple-hairline);
  background: rgba(19, 22, 23, .84);
  color: #f2f1ed;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.ss-member-fab b { font-family: var(--apple-ui); font-size: 16px; font-weight: 500; }

/* Shared page chrome: avoid visual drift after navigating away from Today. */
#app.app-shell .h1,#app.app-shell .h2,#app.app-shell .scene-title,#app.app-shell .daily-title,
#app.app-shell .asset-card-title,#app.app-shell .retention-title,#app.app-shell .timeline-title,
#app.app-shell .plan-title,#app.app-shell .benefit-title,#app.app-shell .member-title {
  font-family: var(--apple-ui);
  letter-spacing: -.035em;
}
#app.app-shell .eyebrow,#app.app-shell .daily-kicker,#app.app-shell .section-kicker,
#app.app-shell .ritual-mark,#app.app-shell .ritual-topline,#app.app-shell .wow-path-step span {
  font-family: var(--apple-mono);
}

@media (min-width: 900px) {
  #app.app-shell .ss-compliance-bar { display: none; }
  #app.app-shell .ss-header { padding-left: 34px; padding-right: 34px; }
  #app.app-shell .ss-tabbar {
    margin: 0;
    border: 0 !important;
    border-top: 1px solid var(--apple-hairline) !important;
    border-radius: 0;
    box-shadow: none !important;
  }
  .ss-today { max-width: 1240px; padding: 26px 40px 112px; }
  .ss-today-top { grid-template-columns: minmax(0, 1.22fr) minmax(390px, .78fr); gap: 48px; align-items: center; }
  .ss-today-hero { padding: 28px 8px; }
  .ss-today-hero h1 { font-size: clamp(56px, 5.8vw, 84px); }
  .ss-today-signals { min-height: 410px; }
  .ss-today-tools { gap: 16px; }
  .ss-today-tool { flex: 1 1 0; min-width: 0; }
  .ss-today-tool-featured { max-width: 720px; }
  .ss-today-explore { grid-template-columns: 1fr 1fr; }
  .ss-today-moments > div { gap: 14px; }
  .ss-today-moment { flex: 1 1 0; }
  .ss-member-fab { right: 28px; bottom: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  #app.app-shell *,#app.app-shell *::before,#app.app-shell *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  #app.app-shell .ss-header,#app.app-shell .ss-tabbar,#app.app-shell .ss-member-fab.is-active {
    background: #101314 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

@media (prefers-contrast: more) {
  #app.app-shell { --apple-hairline: rgba(255, 255, 255, .34); }
  .ss-today-hero > div,.ss-today-signal i,.ss-today-article p,.ss-today-moment span { color: rgba(255, 255, 255, .8); }
}

/* One: 首页不是内容目录，只留一篇每天值得读的内容。 */
.ss-one {
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-in-out: cubic-bezier(.77, 0, .175, 1);
  width: min(100%, 780px);
  min-height: calc(100dvh - var(--tabbar-reserved-height));
  margin: 0 auto;
  padding: clamp(38px, 7vh, 88px) 22px calc(var(--tabbar-reserved-height) + 32px);
  color: var(--tb-ink);
}
.ss-one-intro { max-width: 520px; }
.ss-one-intro > p {
  margin: 0 0 17px;
  color: rgba(242, 241, 237, .46);
  font: 500 10px/1 var(--apple-mono);
  letter-spacing: .1em;
}
.ss-one-intro h1 {
  margin: 0;
  color: #f2f1ed;
  font: 720 clamp(34px, 10vw, 58px)/1.06 var(--apple-ui);
  letter-spacing: -.06em;
}
.ss-one-intro > div {
  max-width: 360px;
  margin-top: 15px;
  color: rgba(242, 241, 237, .56);
  font: 400 15px/1.65 var(--apple-ui);
}
.ss-one-stage { position: relative; margin-top: clamp(42px, 7vh, 76px); }
.ss-one-card {
  display: flex;
  width: 100%;
  min-height: min(48vh, 470px);
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(28px, 7vw, 54px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--apple-hairline) 84%, var(--tb-orange) 16%);
  border-radius: 28px;
  background:
    radial-gradient(circle at 4% 8%, color-mix(in srgb, var(--tb-orange) 18%, transparent), transparent 33%),
    linear-gradient(128deg, rgba(28, 23, 21, .98), rgba(18, 22, 23, .99) 56%, rgba(16, 19, 20, 1));
  box-shadow: 0 22px 48px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .025);
  color: #f2f1ed;
  cursor: grab;
  text-align: left;
  touch-action: pan-y;
  transition: border-color 280ms var(--ease-out, cubic-bezier(.23, 1, .32, 1)), box-shadow 280ms var(--ease-out, cubic-bezier(.23, 1, .32, 1));
  will-change: transform, box-shadow;
}
.ss-one-card[data-swiping] { transition: none; }
.ss-one-card:active { cursor: grabbing; }
.ss-one-card:focus-visible { outline: 3px solid var(--tb-orange); outline-offset: 4px; }
.ss-one-card::before {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, .025);
  border-radius: inherit;
  content: "";
  pointer-events: none;
}
.ss-one-card::after {
  position: absolute;
  right: -58px;
  bottom: -72px;
  width: 210px;
  height: 210px;
  border: 1px solid color-mix(in srgb, var(--tb-orange) 22%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 0 28px color-mix(in srgb, var(--tb-orange) 4%, transparent), 0 0 0 56px color-mix(in srgb, var(--tb-green) 2.5%, transparent);
  content: "";
  pointer-events: none;
}
.ss-one-card > * { position: relative; z-index: 1; }
.ss-one-card > span {
  color: rgba(242, 241, 237, .58);
  font: 500 10px/1.2 var(--apple-mono);
  letter-spacing: .09em;
}
.ss-one-card h2 {
  max-width: 570px;
  margin: 18px 0 16px;
  font: 720 clamp(27px, 7.2vw, 44px)/1.13 var(--apple-ui);
  letter-spacing: -.052em;
}
.ss-one-card > p {
  max-width: 520px;
  margin: 0;
  color: rgba(242, 241, 237, .7);
  font: 400 clamp(15px, 3.8vw, 18px)/1.72 var(--apple-ui);
}
.ss-one-card footer { display: flex; align-items: center; gap: 9px; width: 100%; margin-top: auto; padding-top: 25px; border-top: 1px solid rgba(242, 241, 237, .1); }
.ss-one-card footer b { font: 650 14px/1 var(--apple-ui); letter-spacing: -.01em; }
.ss-one-card footer i { color: var(--tb-orange); font: 400 21px/1 var(--apple-ui); font-style: normal; transition: transform 240ms var(--ease-out, cubic-bezier(.23, 1, .32, 1)); }
.ss-one-card-pending { cursor: default; background: var(--apple-surface-solid); }
.ss-one-swipe-hint { margin: 16px 0 0; color: rgba(242, 241, 237, .42); font: 400 12px/1.5 var(--apple-ui); text-align: center; }
@media (hover: hover) and (pointer: fine) {
  .ss-one-card:hover { border-color: color-mix(in srgb, var(--tb-orange) 38%, var(--apple-hairline)); box-shadow: 0 28px 58px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .04); }
  .ss-one-card:hover footer i { transform: translate3d(4px, -4px, 0); }
}
@media (min-width: 900px) {
  .ss-one { padding-left: 40px; padding-right: 40px; }
  .ss-one-card { min-height: 450px; }
}
@media (prefers-reduced-motion: reduce) {
  .ss-one-card, .ss-one-card footer i { transition: none; transform: none !important; }
}

/* 朋友圈：不是微信复刻，而是身份透明的人机混合动态。 */
.app-shell[data-page="moments"] { background: var(--tb-black); }
.ss-circle-page { width: min(100%, 820px); margin: 0 auto; padding: 26px 16px calc(var(--tabbar-reserved-height) + 30px); color: var(--tb-ink); }
.ss-circle-hero { position: relative; overflow: hidden; padding: 28px 20px 22px; border: 1px solid var(--tb-line); border-radius: 20px; background: radial-gradient(circle at 90% 4%, rgba(32,178,170,.17), transparent 28%), linear-gradient(145deg, #141b1c, #0b0e0f 64%); }
.ss-circle-hero::after { position: absolute; top: -86px; right: -82px; width: 210px; height: 210px; border: 1px solid color-mix(in srgb,var(--tb-orange) 44%,transparent); border-radius: 50%; box-shadow: 0 0 0 24px color-mix(in srgb,var(--tb-orange) 3.5%,transparent), 0 0 0 50px color-mix(in srgb,var(--tb-green) 2.5%,transparent); content: ""; pointer-events: none; }
.ss-circle-hero > * { position: relative; z-index: 1; }
.ss-circle-kicker { color: var(--tb-orange); font: 10px/1 var(--font-mono); letter-spacing: .14em; }
.ss-circle-hero h1 { max-width: 610px; margin: 16px 0 10px; color: var(--tb-ink); font: 900 clamp(29px, 7.6vw, 48px)/1.14 var(--font-cn-body); letter-spacing: -.05em; }
.ss-circle-hero h1 em { color: var(--tb-green); font-family: var(--font-en-display); font-style: normal; letter-spacing: -.055em; }
.ss-circle-hero p { max-width: 520px; margin: 0; color: var(--tb-muted); font: 14px/1.75 var(--font-cn-body); }
.ss-circle-legend { display: flex; flex-wrap: wrap; gap: 8px 13px; margin-top: 19px; color: var(--tb-muted); font: 11px/1.4 var(--font-cn-body); }
.ss-circle-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.ss-circle-metrics { position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; margin:12px 0 14px; border:1px solid var(--tb-line); background:var(--tb-line); }
.ss-circle-metrics > div { display:grid; gap:4px; min-width:0; padding:12px 8px; background:#0d1112; }
.ss-circle-metrics b { color:var(--tb-ink); font:700 20px/1 var(--font-mono); }
.ss-circle-metrics span { overflow:hidden; color:var(--tb-muted); font:9px/1.35 var(--font-cn-body); text-overflow:ellipsis; white-space:nowrap; }
.ss-circle-metrics > small { position:absolute; right:5px; bottom:-13px; color:rgba(242,241,237,.28); font:8px var(--font-mono); }
.ss-circle-identity { display: inline-flex; align-items: center; min-height: 17px; padding: 0 5px; border: 1px solid; border-radius: 999px; font: 9px/15px var(--font-mono); letter-spacing: .01em; vertical-align: 1px; white-space: nowrap; }
.ss-circle-identity.is-human { border-color: rgba(32,178,170,.56); color: #7fe6db; background: rgba(32,178,170,.08); }
.ss-circle-identity.is-ai { border-color: color-mix(in srgb,var(--tb-orange) 64%,transparent); color: #ffad7c; background: color-mix(in srgb,var(--tb-orange) 8%,transparent); }
.ss-circle-compose,.ss-circle-compose-open { width: 100%; margin: 14px 0; border: 1px solid var(--tb-line); border-radius: 15px; background: #101516; color: var(--tb-ink); }
.ss-circle-compose { display: flex; align-items: center; gap: 12px; padding: 15px; cursor: pointer; text-align: left; transition: transform 160ms cubic-bezier(.23,1,.32,1), border-color 180ms ease-out, background 180ms ease; }
.ss-circle-compose:active,.ss-circle-post button:active,.ss-circle-tabs button:active,.ss-circle-load:active { transform: scale(.975); }
.ss-circle-compose > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 10px; background: var(--tb-orange); color: #fff; font: 24px/1 var(--font-cn-body); }
.ss-circle-compose div { display: grid; gap: 3px; flex: 1; }
.ss-circle-compose b { font: 700 14px/1.2 var(--font-cn-body); }
.ss-circle-compose small { color: var(--tb-muted); font: 11px/1.3 var(--font-cn-body); }
.ss-circle-compose i { color: var(--tb-green); font: 24px/1 var(--font-cn-body); font-style: normal; transition: transform 180ms cubic-bezier(.23,1,.32,1); }
.ss-circle-compose-open { padding: 15px; }
.ss-circle-compose-open > div { display: grid; gap: 4px; }
.ss-circle-compose-open b { font: 800 15px var(--font-cn-body); }
.ss-circle-compose-open span,.ss-circle-compose-open p { color: var(--tb-muted); font: 11px/1.55 var(--font-cn-body); }
.ss-circle-compose-open textarea { box-sizing: border-box; display: block; width: 100%; min-height: 108px; margin-top: 12px; padding: 12px; resize: vertical; border: 1px solid var(--tb-line); border-radius: 11px; outline: 0; background: #080b0c; color: var(--tb-ink); font: 13px/1.7 var(--font-cn-body); }
.ss-circle-compose-open textarea:focus,.ss-circle-reply-box input:focus { border-color: var(--tb-green); box-shadow: 0 0 0 3px rgba(32,178,170,.13); }
.ss-circle-compose-open p { margin: 9px 0 0; }
.ss-circle-compose-open footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.ss-circle-compose-open button { min-height: 38px; padding: 0 13px; border: 1px solid var(--tb-line); border-radius: 9px; background: transparent; color: var(--tb-muted); font: 700 12px var(--font-cn-body); cursor: pointer; }
.ss-circle-compose-open footer > button:last-child { border-color: var(--tb-orange); background: var(--tb-orange); color: #fff; }
.ss-circle-business-tags { margin-top:12px; padding:11px; border:1px solid var(--tb-line); border-radius:11px; background:#0a0d0e; }
.ss-circle-business-tags > b { font-size:12px; }
.ss-circle-business-tags > span { margin-top:2px; }
.ss-circle-business-tags > div { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.ss-circle-business-tags button { min-height:30px; padding:0 9px; border-radius:999px; font-size:10px; }
.ss-circle-business-tags button.is-active { border-color:rgba(32,178,170,.62); background:rgba(32,178,170,.12); color:#aef1ea; }
.ss-circle-topic-zone { display: grid; gap: 11px; margin: 14px 0; padding: 13px; border: 1px solid var(--tb-line); border-radius: 15px; background: linear-gradient(135deg, rgba(32,178,170,.055), transparent 52%), #0d1112; }
.ss-circle-topic-zone > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ss-circle-topic-zone > header > div { display: grid; min-width: 0; gap: 4px; }
.ss-circle-topic-zone > header span { color: var(--tb-green); font: 10px/1 var(--font-mono); letter-spacing: .12em; }
.ss-circle-topic-zone > header b { color: var(--tb-ink); font: 750 13px/1.25 var(--font-cn-body); }
.ss-circle-topic-zone > header button { min-height: 31px; flex: 0 0 auto; padding: 0 10px; border: 1px solid rgba(32,178,170,.45); border-radius: 9px; background: rgba(32,178,170,.08); color: #8be9df; font: 700 10px/1 var(--font-cn-body); cursor: pointer; transition: transform 150ms cubic-bezier(.23,1,.32,1), border-color 180ms ease-out, background 180ms ease-out; }
.ss-circle-topic-zone > header button.is-subscribed { border-color: color-mix(in srgb,var(--tb-orange) 58%,transparent); background: color-mix(in srgb,var(--tb-orange) 9%,transparent); color: #ffb084; }
.ss-circle-topic-tabs { display: flex; gap: 7px; margin: 0 -13px; padding: 0 13px 2px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.ss-circle-topic-tabs::-webkit-scrollbar { display: none; }
.ss-circle-topic-tabs button { min-height: 34px; max-width: min(72vw, 310px); flex: 0 0 auto; padding: 0 11px; overflow: hidden; border: 1px solid rgba(242,241,237,.1); border-radius: 9px; background: #141a1b; color: var(--tb-muted); font: 650 11px/1 var(--font-cn-body); text-overflow: ellipsis; white-space: nowrap; cursor: pointer; scroll-snap-align: start; transition: transform 150ms cubic-bezier(.23,1,.32,1), border-color 180ms ease-out, color 180ms ease-out, background 180ms ease-out; }
.ss-circle-topic-tabs button.is-active { border-color: rgba(32,178,170,.52); background: rgba(32,178,170,.1); color: #b5f3ed; }
.ss-circle-topic-zone button:active { transform: scale(.975); }
.ss-circle-tabs { display: flex; gap: 4px; padding: 3px; overflow-x: auto; border: 1px solid var(--tb-line); border-radius: 12px; background: #0e1213; }
.ss-circle-tabs button { min-height: 33px; flex: 1 0 auto; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: var(--tb-muted); font: 700 11px var(--font-cn-body); cursor: pointer; transition: transform 150ms cubic-bezier(.23,1,.32,1), background 180ms ease-out, color 180ms ease-out; }
.ss-circle-tabs button.is-active { background: #242d2f; color: var(--tb-ink); }
.ss-circle-live { display: flex; gap: 8px; align-items: flex-start; margin: 13px 2px; color: var(--tb-muted); }
.ss-circle-live > span { margin-top: 2px; color: var(--tb-orange); font: 10px/1 var(--font-mono); letter-spacing: .08em; }
.ss-circle-live p { margin: 0; font: 11px/1.5 var(--font-cn-body); }
.ss-circle-featured { display: grid; gap: 8px; margin: 14px 0; padding: 11px; border: 1px solid color-mix(in srgb,var(--tb-orange) 42%,transparent); border-radius: 17px; background: linear-gradient(135deg, color-mix(in srgb,var(--tb-orange) 9%,transparent), transparent 54%), #0d1213; }
.ss-circle-featured > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 1px 3px 2px; }
.ss-circle-featured > header > div { display: grid; gap: 3px; }
.ss-circle-featured > header span { color: var(--tb-orange); font: 10px/1 var(--font-mono); letter-spacing: .1em; }
.ss-circle-featured > header b { color: var(--tb-ink); font: 750 13px/1.2 var(--font-cn-body); }
.ss-circle-featured > header button,.ss-circle-new-notice button { flex: 0 0 auto; min-height: 29px; padding: 0 8px; border: 1px solid rgba(32,178,170,.38); border-radius: 8px; background: rgba(32,178,170,.07); color: var(--tb-green); font: 700 10px var(--font-cn-body); cursor: pointer; }
.ss-circle-featured .ss-circle-post { box-shadow: none; }
.ss-circle-featured-status { margin: 0 3px 2px; color: var(--tb-muted); font: 11px/1.45 var(--font-cn-body); }
.ss-circle-new-notice { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 11px 1px 0; padding: 9px 10px; border: 1px solid rgba(32,178,170,.38); border-radius: 11px; background: rgba(32,178,170,.08); color: #b4f3ed; font: 700 11px/1.35 var(--font-cn-body); }
.ss-circle-stream { display: grid; gap: 11px; }
.ss-circle-post { padding: 15px; border: 1px solid var(--tb-line); border-radius: 16px; background: #0f1415; box-shadow: 0 12px 26px rgba(0,0,0,.13); }
.ss-circle-post.is-ai { border-left: 2px solid var(--tb-orange); background: linear-gradient(122deg, color-mix(in srgb,var(--tb-orange) 7.5%,transparent), transparent 34%), #101415; }
.ss-circle-post.is-human { border-left: 2px solid var(--tb-green); }
.ss-circle-post.is-new { border-color: rgba(32,178,170,.82); box-shadow: 0 0 0 3px rgba(32,178,170,.1), 0 14px 30px rgba(0,0,0,.2); }
.ss-circle-post-head { display: flex; gap: 10px; align-items: center; }
.ss-circle-avatar { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; overflow: hidden; border: 1px solid var(--tb-line); border-radius: 50%; background: #242c2e; color: var(--tb-ink); font: 800 14px var(--font-cn-body); object-fit: cover; }
.ss-circle-avatar.is-ai { border-color: color-mix(in srgb,var(--tb-orange) 50%,transparent); background: linear-gradient(145deg, #472616, #1b2726); color: #ffc6a4; }
.ss-circle-post-head > div { display: grid; min-width: 0; gap: 3px; flex: 1; }
.ss-circle-author { color: var(--tb-ink); font: 750 13px/1.2 var(--font-cn-body); }
.ss-circle-post time { color: rgba(242,241,237,.42); font: 10px/1.3 var(--font-cn-body); }
.ss-circle-source { flex: 0 0 auto; color: var(--tb-muted); font: 9px/1 var(--font-mono); letter-spacing: .05em; }
.ss-circle-copy { margin: 13px 0 0; color: var(--tb-ink); font: 15px/1.72 var(--font-cn-body); white-space: pre-wrap; word-break: break-word; }
.ss-circle-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ss-circle-tags span,.ss-circle-reference { color: var(--tb-green); font: 10px/1.35 var(--font-mono); }
.ss-circle-reference { margin-top: 10px; padding: 8px 9px; border: 1px solid rgba(32,178,170,.25); border-radius: 8px; background: rgba(32,178,170,.04); }
.ss-circle-persona-boundary { display: grid; gap: 3px; margin-top: 11px; padding: 9px 10px; border-left: 2px solid color-mix(in srgb,var(--tb-orange) 62%,transparent); border-radius: 0 8px 8px 0; background: color-mix(in srgb,var(--tb-orange) 5.5%,transparent); }
.ss-circle-persona-boundary span { color: #ffad7c; font: 9px/1.3 var(--font-mono); }
.ss-circle-persona-boundary b { color: rgba(242,241,237,.82); font: 650 11px/1.45 var(--font-cn-body); }
.ss-circle-persona-boundary small { color: var(--tb-muted); font: 10px/1.45 var(--font-cn-body); }
.ss-circle-reference-card { position: relative; display: grid; gap: 4px; margin-top: 11px; padding: 11px 34px 11px 12px; overflow: hidden; border: 1px solid rgba(32,178,170,.28); border-radius: 10px; background: rgba(32,178,170,.045); color: inherit; text-decoration: none; }
.ss-circle-reference-card > span { color: var(--tb-green); font: 9px/1.2 var(--font-mono); letter-spacing: .04em; }
.ss-circle-reference-card > b { overflow: hidden; color: var(--tb-ink); font: 700 12px/1.45 var(--font-cn-body); text-overflow: ellipsis; white-space: nowrap; }
.ss-circle-reference-card > i { position: absolute; top: 50%; right: 12px; color: var(--tb-green); font: 17px/1 var(--font-cn-body); font-style: normal; transform: translateY(-50%); }
.ss-circle-reference-card.has-image { grid-template-columns: 76px minmax(0,1fr); align-items: center; min-height: 76px; padding-left: 88px; }
.ss-circle-reference-card.has-image img { position: absolute; top: 0; bottom: 0; left: 0; width: 76px; height: 100%; border-right: 1px solid rgba(32,178,170,.18); object-fit: cover; }
.ss-circle-reference-fields { display: grid; gap: 7px; margin-top: 9px; }
.ss-circle-reference-fields input { min-width: 0; height: 36px; padding: 0 10px; border: 1px solid var(--tb-line); border-radius: 9px; outline: 0; background: #0a0d0e; color: var(--tb-ink); font: 11px var(--font-cn-body); }
.ss-circle-reference-fields input:focus { border-color: var(--tb-green); box-shadow: 0 0 0 3px rgba(32,178,170,.13); }
.ss-circle-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 13px; padding-top: 10px; border-top: 1px solid rgba(242,241,237,.09); }
.ss-circle-actions button { min-height: 29px; padding: 0 8px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: var(--tb-muted); font: 11px var(--font-cn-body); cursor: pointer; transition: transform 150ms cubic-bezier(.23,1,.32,1), border-color 160ms ease-out, color 160ms ease-out, background 160ms ease-out; }
.ss-circle-actions button:hover,.ss-circle-actions button.is-active { border-color: color-mix(in srgb,var(--tb-orange) 34%,transparent); background: color-mix(in srgb,var(--tb-orange) 8%,transparent); color: #ffaf80; }
.ss-circle-actions span { margin-left: auto; color: rgba(242,241,237,.42); font: 10px var(--font-cn-body); }
.ss-circle-comments { display: grid; gap: 2px; margin-top: 9px; padding: 8px; border-radius: 9px; background: rgba(242,241,237,.045); }

@media (max-width:560px) {
  .ss-circle-metrics { grid-template-columns:repeat(5,72px); overflow-x:auto; }
  .ss-circle-metrics > div { min-width:72px; }
  .ss-circle-metrics > small { display:none; }
}
.ss-circle-comment { display: inline; padding: 4px 2px; border: 0; background: transparent; color: var(--tb-muted); font: 11px/1.55 var(--font-cn-body); cursor: pointer; text-align: left; }
.ss-circle-comment strong { margin-right: 4px; color: var(--tb-ink); font-weight: 750; }
.ss-circle-comment .ss-circle-identity { margin-right: 5px; transform: scale(.86); transform-origin: left center; }
.ss-circle-more { padding: 4px 2px; color: var(--tb-green); font: 10px var(--font-cn-body); }
.ss-circle-reply-box { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; margin-top: 10px; }
.ss-circle-replying { display: flex; width: 100%; align-items: center; justify-content: space-between; color: var(--tb-muted); font: 10px var(--font-cn-body); }
.ss-circle-replying button { border: 0; background: transparent; color: var(--tb-muted); font-size: 16px; cursor: pointer; }
.ss-circle-reply-box input { min-width: 0; height: 35px; flex: 1; padding: 0 10px; border: 1px solid var(--tb-line); border-radius: 9px; outline: 0; background: #0a0d0e; color: var(--tb-ink); font: 12px var(--font-cn-body); }
.ss-circle-reply-box > button { height: 35px; padding: 0 12px; border: 1px solid var(--tb-green); border-radius: 9px; background: transparent; color: var(--tb-green); font: 700 11px var(--font-cn-body); cursor: pointer; }
.ss-circle-empty { padding: 42px 22px; border: 1px dashed var(--tb-line); border-radius: 16px; color: var(--tb-muted); font: 13px/1.8 var(--font-cn-body); text-align: center; }
.ss-circle-load { justify-self: center; min-height: 38px; padding: 0 15px; border: 1px solid var(--tb-line); border-radius: 9px; background: transparent; color: var(--tb-muted); font: 11px var(--font-cn-body); cursor: pointer; transition: transform 150ms cubic-bezier(.23,1,.32,1), border-color 180ms ease-out; }
@media (hover: hover) and (pointer: fine) { .ss-circle-compose:hover { border-color: color-mix(in srgb,var(--tb-orange) 58%,transparent); background: #151a1b; } .ss-circle-compose:hover i { transform: translateX(4px); } .ss-circle-load:hover { border-color: color-mix(in srgb,var(--tb-green) 55%,transparent); color: var(--tb-green); } }
@media (min-width: 800px) { .ss-circle-page { padding-left: 30px; padding-right: 30px; } .ss-circle-hero { padding: 38px 34px 30px; } .ss-circle-post { padding: 19px; } }
@media (max-width: 430px) { .ss-circle-featured > header button { padding: 0 7px; } .ss-circle-new-notice { align-items: flex-start; flex-direction: column; } .ss-circle-new-notice button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .ss-circle-compose,.ss-circle-compose i,.ss-circle-tabs button,.ss-circle-actions button,.ss-circle-load { transition: none; transform: none !important; } }

/* 专栏索引：移动端是阅读前的单列入口；桌面端用栏目侧栏承接屏幕宽度。
   正文页仍维持适合长读的窄行宽，避免把可读性和目录页的布局混为一谈。 */
.ss-premium-index { padding-top:16px; }
.ss-premium-index-layout { max-width:720px; margin:0 auto; }
.ss-prem-head { padding:0; text-align:left; }
.ss-prem-label { font-size:10px; letter-spacing:.2em; }
.ss-prem-title { color:var(--ink); font-size:24px; font-weight:900; margin:6px 0 0; }
.ss-prem-sub { color:var(--ink2); font-size:12.5px; line-height:1.65; margin-top:6px; }
.ss-prem-content-lines { margin-top:12px; color:var(--copper); font:9px var(--font-mono); letter-spacing:.04em; }
.ss-prem-category-nav { display:flex; gap:7px; overflow:auto; padding:16px 0 2px; margin:0 -2px; scrollbar-width:none; }
.ss-prem-category-nav::-webkit-scrollbar { display:none; }
.ss-prem-category-link { flex:0 0 auto; height:32px; padding:0 12px; border:1px solid var(--line2); border-radius:10px; background:transparent; color:var(--ink2); font:600 12px var(--font-cn-body); cursor:pointer; transition:border-color .16s ease,color .16s ease,background .16s ease; }
.ss-prem-category-link.is-active { border-color:var(--copper); background:var(--copper); color:#fff; font-weight:800; }
.ss-premium-index-content { margin-top:16px; }
.ss-prem-current-label { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:0 0 3px; color:var(--ink); font:800 13px var(--font-cn-body); }
.ss-prem-current-label em { color:var(--ink3); font:10px var(--font-mono); letter-spacing:.02em; font-style:normal; text-align:right; }
.ss-prem-trade-context { display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; }
.ss-prem-trade-context span { padding:3px 7px; border:1px solid var(--line2); color:var(--copper); font:9px/1.4 var(--font-mono); letter-spacing:.03em; }
.ss-prem-list { display:grid; gap:11px; margin-top:16px; }

@media (min-width:900px) {
  #app[data-page="premium"] .ss-screen.ss-premium-index { width:100%; max-width:none; padding:54px 48px 96px; }
  #app[data-page="premium"] .ss-premium-index-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:64px; max-width:1180px; margin:0 auto; align-items:start; }
  #app[data-page="premium"] .ss-premium-index-rail { position:sticky; top:156px; align-self:start; padding:6px 0 10px; }
  #app[data-page="premium"] .ss-prem-head { text-align:left; }
  #app[data-page="premium"] .ss-prem-title { font-family:var(--serif); font-size:42px !important; line-height:1.2; letter-spacing:.07em; margin-top:14px; }
  #app[data-page="premium"] .ss-prem-sub { max-width:230px; font-size:14px !important; line-height:1.85; margin-top:18px; }
  #app[data-page="premium"] .ss-prem-content-lines { margin-top:28px; padding-bottom:22px; border-bottom:1px solid var(--line); font-size:10px; line-height:1.8; }
  #app[data-page="premium"] .ss-prem-category-nav { display:grid; gap:2px; overflow:visible; padding:22px 0 0; margin:0; }
  #app[data-page="premium"] .ss-prem-category-link { width:100%; height:auto; min-height:44px; padding:0 0 0 14px; border:0; border-left:2px solid transparent; border-radius:0; background:transparent; color:var(--ink2); font-family:var(--serif); font-size:17px; font-weight:500; text-align:left; }
  #app[data-page="premium"] .ss-prem-category-link:hover { color:var(--ink); }
  #app[data-page="premium"] .ss-prem-category-link.is-active { border-color:var(--copper); background:transparent; color:var(--copper); font-weight:800; }
  #app[data-page="premium"] .ss-premium-index-content { margin-top:0; min-width:0; }
  #app[data-page="premium"] .ss-prem-current-label { padding:12px 0 18px; border-bottom:1px solid var(--line); font-family:var(--serif); font-size:26px; font-weight:800; }
  #app[data-page="premium"] .ss-prem-current-label em { color:var(--ink3); font-size:11px; font-family:var(--font-mono); letter-spacing:.03em; }
  #app[data-page="premium"] .ss-prem-list { gap:0 !important; margin-top:0 !important; }
  #app[data-page="premium"] .ss-prem-list-item { display:block; min-height:176px; padding:31px 74px 28px 0 !important; border:0; border-bottom:1px solid var(--line); border-radius:0 !important; box-shadow:none !important; position:relative; transform:none !important; }
  #app[data-page="premium"] .ss-prem-list-item:first-child { border-top:0; }
  #app[data-page="premium"] .ss-prem-list-item::after { content:"→"; position:absolute; right:14px; top:50%; color:var(--copper); font:300 31px/1 var(--serif); transform:translateY(-50%); transition:transform .18s ease; }
  #app[data-page="premium"] .ss-prem-list-item:hover { background:transparent !important; }
  #app[data-page="premium"] .ss-prem-list-item:hover::after { transform:translate(5px,-50%); }
  #app[data-page="premium"] .ss-prem-list-item-top { display:block; }
  #app[data-page="premium"] .ss-prem-list-item-top > span { display:inline-block; margin-top:12px; }
  #app[data-page="premium"] .ss-prem-card-title { max-width:760px; font-family:var(--serif); font-size:25px !important; font-weight:800; line-height:1.5 !important; letter-spacing:.01em; }
  #app[data-page="premium"] .ss-prem-card-sub { max-width:700px; font-size:14px !important; line-height:1.8 !important; margin-top:12px !important; }
  #app[data-page="premium"] .ss-prem-list-item-meta { margin-top:16px; font-size:11px; }
  #app[data-page="premium"] .ss-prem-list-item-meta b { display:none; }
  #app[data-page="premium"] .ss-prem-archive { margin-top:0; border-top:0; }
  #app[data-page="premium"] .ss-prem-archive summary { min-height:78px; padding:0; }
}

/* A+B 2026 产品改版：编辑部的可读性 + Agent 系统的可验证感。 */
.app-shell[data-page="scenes"] .ss-scroll,.app-shell[data-page="membership"] .ss-scroll { background:#090c0d; }
#app.app-shell .ss-header-positioning { display:none; }
.ss-home { width:min(100%,1280px); margin:0 auto; padding:0 18px calc(var(--tabbar-reserved-height) + 34px); color:var(--tb-ink); }
.ss-home-hero { display:grid; gap:20px; padding:34px 4px 24px; border-bottom:1px solid var(--tb-line); }
.ss-home-hero-copy > p,.ss-home-section-head > div > span,.ss-home-feature-head > span,.ss-home-membership-copy > span,.ss-membership-intro p,.ss-membership-run > span,.ss-membership-offer-note > span { margin:0; color:var(--tb-green); font:10px/1 var(--font-mono); letter-spacing:.14em; }
.ss-home-hero h1 { max-width:700px; margin:18px 0 14px; color:var(--tb-ink); font:900 clamp(43px,11vw,76px)/1.05 var(--font-cn-body); letter-spacing:-.065em; }
.ss-home-hero h1 span,.ss-membership-intro h1 span { color:var(--tb-orange); }
.ss-membership-intro h1 span { display:inline-block; white-space:nowrap; }
.ss-home-hero-copy > div { max-width:570px; color:var(--tb-muted); font:15px/1.75 var(--font-cn-body); }
.ss-home-hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.ss-home-hero-actions button,.ss-home-membership-side button { min-height:44px; padding:0 16px; border:1px solid var(--tb-orange); border-radius:999px; background:var(--tb-orange); color:#fff; font:750 13px var(--font-cn-body); cursor:pointer; transition:transform 150ms cubic-bezier(.2,.7,.2,1),box-shadow 180ms ease,background 180ms ease; }
.ss-home-hero-actions button:active,.ss-home-membership-side button:active { transform:scale(.975); }
.ss-home-hero-actions .is-quiet { border-color:var(--tb-line); background:transparent; color:var(--tb-ink); }
.ss-home-trust { display:flex; flex-wrap:wrap; gap:7px 14px; margin-top:22px; color:var(--tb-muted); font:11px/1.4 var(--font-cn-body); }
.ss-home-trust span::before { content:"✓"; margin-right:5px; color:var(--tb-green); }
.ss-home-hero-side { display:grid; gap:10px; }
.ss-home-stats { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--tb-line); background:var(--tb-line); }
.ss-home-stats > div { min-width:0; padding:14px 12px; background:#101516; }
.ss-home-stats span,.ss-signal-run-head span { display:block; color:var(--tb-muted); font:9px var(--font-mono); letter-spacing:.1em; }
.ss-home-stats b { display:block; margin:11px 0 5px; color:var(--tb-ink); font:800 25px/1 var(--font-mono); letter-spacing:-.08em; }
.ss-home-stats small { display:block; min-height:30px; color:var(--tb-muted); font:10px/1.45 var(--font-cn-body); }
.ss-signal-run { border:1px solid rgba(32,178,170,.34); background:linear-gradient(135deg,rgba(32,178,170,.11),#0d1213 68%); padding:15px; }
.ss-signal-run-head { display:flex; justify-content:space-between; align-items:center; }
.ss-signal-run-head i { color:var(--tb-green); font-size:10px; font-style:normal; }
.ss-signal-run ol { display:grid; gap:10px; margin:15px 0 0; padding:0; list-style:none; }
.ss-signal-run li { display:grid; grid-template-columns:28px 1fr; gap:8px; color:var(--tb-muted); font:11px/1.45 var(--font-cn-body); }
.ss-signal-run li b { color:var(--tb-green); font:10px/1.45 var(--font-mono); }
.ss-signal-run li small { display:block; margin-top:3px; color:var(--tb-orange); font:9px/1.4 var(--font-mono); letter-spacing:.05em; }
.ss-home-feature { margin-top:26px; }
.ss-home-feature-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:0 3px 12px; }
.ss-home-feature-head p { margin:0; color:var(--tb-muted); font:11px var(--font-cn-body); }
.ss-home .ss-one-card { min-height:390px; border-radius:0; background:radial-gradient(circle at 12% 8%,color-mix(in srgb,var(--tb-orange) 17%,transparent),transparent 28%),linear-gradient(130deg,#221813,#101617 56%,#0b0e0f); }
.ss-home .ss-one-card h2 { max-width:680px; font-family:var(--font-cn-body); font-weight:900; }
.ss-home-signals { margin-top:50px; border-top:1px solid var(--tb-line); }
.ss-home-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; padding:20px 0 17px; }
.ss-home-section-head h2 { max-width:560px; margin:10px 0 0; color:var(--tb-ink); font:900 27px/1.2 var(--font-cn-body); letter-spacing:-.045em; }
.ss-home-section-head button { flex:0 0 auto; padding:0; border:0; background:transparent; color:var(--tb-orange); font:700 12px var(--font-cn-body); cursor:pointer; }
.ss-home-signal-list { border-top:1px solid var(--tb-line); }
.ss-home-signal { display:grid; grid-template-columns:35px minmax(0,1fr) 18px; gap:11px; width:100%; padding:17px 0; border:0; border-bottom:1px solid var(--tb-line); background:transparent; color:inherit; text-align:left; cursor:pointer; }
.ss-home-signal-index { color:var(--tb-orange); font:14px/1.5 var(--font-mono); }
.ss-home-signal-body { min-width:0; }
.ss-home-signal-body em,.ss-home-signal-body b,.ss-home-signal-body i { display:block; }
.ss-home-signal-body em { color:var(--tb-green); font:9px/1.2 var(--font-mono); letter-spacing:.08em; font-style:normal; }
.ss-home-signal-body b { margin-top:5px; color:var(--tb-ink); font:800 16px/1.43 var(--font-cn-body); letter-spacing:-.02em; }
.ss-home-signal-body i { overflow:hidden; margin-top:5px; color:var(--tb-muted); font:11px/1.6 var(--font-cn-body); font-style:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; display:-webkit-box; }
.ss-home-signal-state { display:none; color:var(--tb-muted); font:10px var(--font-cn-body); }
.ss-home-signal strong { align-self:center; color:var(--tb-green); font:18px/1 var(--font-mono); font-weight:400; }
.ss-home-membership { display:grid; gap:22px; margin:48px 0 4px; padding:23px 19px; border:1px solid var(--tb-line); border-left:2px solid var(--tb-orange); background:linear-gradient(125deg,#161312,#0d1213 62%); }
.ss-home-membership-copy h2 { margin:11px 0; color:var(--tb-ink); font:900 28px/1.23 var(--font-cn-body); letter-spacing:-.055em; }
.ss-home-membership-copy p { max-width:660px; margin:0; color:var(--tb-muted); font:13px/1.7 var(--font-cn-body); }
.ss-home-membership-side { display:grid; align-content:start; gap:8px; }
.ss-home-membership-side > b { color:var(--tb-ink); font:900 41px/1 var(--font-mono); letter-spacing:-.08em; }
.ss-home-membership-side > b small { color:var(--tb-muted); font:11px var(--font-cn-body); letter-spacing:0; }
.ss-home-membership-side p { margin:0; color:var(--tb-muted); font:11px/1.55 var(--font-cn-body); }
.ss-home-membership-side button { width:max-content; margin-top:7px; }

/* 今日情报详情：把 Agent 产出变成可读、可执行、可反馈的生意情报。 */
.ss-intel-mask { position:fixed; inset:0; z-index:1000!important; display:flex; align-items:flex-end; justify-content:center; padding:0; background:rgba(0,0,0,.72); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
#app.app-shell[data-overlay="editorial"] .ss-header,
#app.app-shell[data-overlay="editorial"] .ss-tabbar,
#app.app-shell[data-overlay="editorial"] .ss-member-fab,
#app.app-shell[data-overlay="editorial"] .ss-compliance-bar { z-index:0!important; }
.ss-intel-sheet { box-sizing:border-box; width:min(100%,920px); max-height:94dvh; overflow:auto; padding:20px 18px calc(28px + env(safe-area-inset-bottom)); border:1px solid var(--tb-line); border-bottom:0; background:#0b0f10; color:var(--tb-ink); box-shadow:0 -24px 70px rgba(0,0,0,.5); }
.ss-intel-sheet-head { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-bottom:14px; border-bottom:1px solid var(--tb-line); }
.ss-intel-sheet-head > div { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.ss-intel-sheet-head span { color:var(--tb-green); font:10px/1 var(--font-mono); letter-spacing:.12em; }
.ss-intel-sheet-head b { padding:4px 7px; border:1px solid rgba(32,178,170,.4); color:#8be6dd; font:9px/1 var(--font-cn-body); }
.ss-intel-sheet-head > button { flex:0 0 auto; width:36px; height:36px; border:1px solid var(--tb-line); border-radius:50%; background:transparent; color:var(--tb-ink); font:24px/1 var(--font-cn-body); cursor:pointer; }
.ss-intel-meta { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:18px; color:var(--tb-muted); font:10px/1.45 var(--font-mono); }
.ss-intel-meta span + span::before { content:"/"; margin-right:16px; color:var(--tb-line); }
.ss-intel-sheet > h1 { max-width:760px; margin:18px 0 0; color:var(--tb-ink); font:900 clamp(30px,8vw,52px)/1.12 var(--font-cn-body); letter-spacing:-.055em; }
.ss-intel-context { display:flex; flex-wrap:wrap; gap:6px; margin-top:15px; }
.ss-intel-context span { padding:5px 8px; border:1px solid var(--tb-line); color:var(--tb-muted); font:10px/1 var(--font-cn-body); }
.ss-intel-relevance { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:12px; align-items:start; max-width:730px; margin-top:18px; padding:12px 0; border-top:1px solid var(--tb-line); border-bottom:1px solid var(--tb-line); }
.ss-intel-relevance span { color:var(--tb-green); font:10px/1.55 var(--font-mono); letter-spacing:.08em; }
.ss-intel-relevance p { margin:0; color:var(--tb-muted); font:12px/1.55 var(--font-cn-body); }
.ss-intel-summary { max-width:730px; margin:20px 0 0; color:var(--tb-ink); font:700 17px/1.75 var(--font-cn-body); }
.ss-intel-body { max-width:730px; margin-top:24px; color:var(--tb-muted); font:14px/1.85 var(--font-cn-body); }
.ss-intel-body h2,.ss-intel-body h3,.ss-intel-body h4,.ss-intel-body h5 { margin:28px 0 10px; color:var(--tb-ink); font-family:var(--font-cn-body); letter-spacing:-.025em; }
.ss-intel-body p { margin:12px 0; }
.ss-intel-body ul,.ss-intel-body ol { padding-left:20px; }
.ss-intel-body a { color:var(--tb-green); }
.ss-intel-action { display:grid; gap:10px; margin-top:28px; padding:18px; border-left:2px solid var(--tb-orange); background:linear-gradient(120deg,color-mix(in srgb,var(--tb-orange) 12%,transparent),transparent 70%),#111516; }
.ss-intel-action > span,.ss-intel-sources > div > span,.ss-intel-feedback > span { color:var(--tb-orange); font:10px/1 var(--font-mono); letter-spacing:.1em; }
.ss-intel-action p { margin:0; color:var(--tb-ink); font:700 14px/1.7 var(--font-cn-body); }
.ss-intel-action button { width:max-content; min-height:38px; padding:0 13px; border:1px solid var(--tb-orange); background:var(--tb-orange); color:#fff; font:700 12px var(--font-cn-body); cursor:pointer; }
.ss-intel-sources { margin-top:30px; padding-top:20px; border-top:1px solid var(--tb-line); }
.ss-intel-sources > div { display:grid; gap:6px; }
.ss-intel-sources > div > span { color:var(--tb-green); }
.ss-intel-sources > div > small,.ss-intel-sources > p { color:var(--tb-muted); font:10px/1.55 var(--font-cn-body); }
.ss-intel-sources ol { margin:13px 0 0; padding:0; list-style:none; border-top:1px solid var(--tb-line); }
.ss-intel-sources li { border-bottom:1px solid var(--tb-line); }
.ss-intel-sources li button { display:grid; grid-template-columns:30px minmax(0,1fr) 18px; gap:9px; align-items:center; width:100%; padding:13px 0; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.ss-intel-sources li i { color:var(--tb-orange); font:10px var(--font-mono); font-style:normal; }
.ss-intel-sources li span { display:grid; gap:4px; min-width:0; }
.ss-intel-sources li b { overflow:hidden; color:var(--tb-ink); font:700 12px/1.45 var(--font-cn-body); text-overflow:ellipsis; white-space:nowrap; }
.ss-intel-sources li small { color:var(--tb-muted); font:9px/1.35 var(--font-cn-body); }
.ss-intel-sources li strong { color:var(--tb-green); font:18px/1 var(--font-mono); font-weight:400; }
.ss-intel-footer { display:grid; gap:18px; margin-top:30px; padding-top:20px; border-top:1px solid var(--tb-line); }
.ss-intel-feedback { display:grid; gap:9px; }
.ss-intel-feedback > div { display:flex; flex-wrap:wrap; gap:7px; }
.ss-intel-feedback button,.ss-intel-save { min-height:38px; padding:0 12px; border:1px solid var(--tb-line); background:transparent; color:var(--tb-muted); font:700 11px var(--font-cn-body); cursor:pointer; }
.ss-intel-feedback button.is-selected { border-color:var(--tb-green); background:rgba(32,178,170,.12); color:#a7eee7; }
.ss-intel-feedback button:disabled { opacity:.5; cursor:wait; }
.ss-intel-feedback small { color:var(--tb-muted); font:9px/1.5 var(--font-cn-body); }
.ss-intel-save { width:100%; min-height:46px; border-color:var(--tb-orange); color:var(--tb-ink); }

/* 会员页：一次只做一个决定，其他权益向下解释。 */
.ss-membership { width:min(100%,1120px); margin:0 auto; padding:16px 18px calc(var(--tabbar-reserved-height) + 34px); color:var(--tb-ink); }
.ss-membership .ss-back { margin-bottom:26px; }
.ss-membership-intro { padding:7px 2px 28px; border-bottom:1px solid var(--tb-line); }
.ss-membership-intro-grid { display:grid; gap:22px; }
.ss-membership-intro h1 { max-width:700px; margin:17px 0 14px; color:var(--tb-ink); font:900 clamp(37px,9vw,64px)/1.08 var(--font-cn-body); letter-spacing:-.067em; }
.ss-membership-intro-grid > div:first-child > div { max-width:650px; color:var(--tb-muted); font:14px/1.75 var(--font-cn-body); }
.ss-membership-proof { display:flex; flex-wrap:wrap; gap:8px 14px; margin-top:19px; color:var(--tb-muted); font:10px var(--font-cn-body); }
.ss-membership-proof span::before { content:"✓"; margin-right:5px; color:var(--tb-green); }
.ss-membership-run { display:grid; grid-template-columns:32px 1fr; gap:8px 12px; align-content:start; padding:17px; border:1px solid rgba(32,178,170,.35); background:#0e1514; }
.ss-membership-run > span { grid-column:1/-1; margin-bottom:5px; }
.ss-membership-run b { color:var(--tb-green); font:11px/1.5 var(--font-mono); }
.ss-membership-run em { color:var(--tb-muted); font:12px/1.5 var(--font-cn-body); font-style:normal; }
.ss-membership-offer { display:grid; gap:1px; margin-top:23px; border:1px solid var(--tb-line); background:var(--tb-line); }
.ss-membership-offer-main,.ss-membership-offer-note { min-width:0; padding:16px; background:#0c1011; }
.ss-membership-offer-main .ss-member-hero { height:100%; margin:0!important; border:0!important; border-radius:0!important; box-shadow:none!important; background:transparent!important; padding:0!important; }
.ss-membership-offer-main .ss-member-hero > div:last-child { max-width:620px; }
.ss-membership-offer-note { position:relative; overflow:hidden; background:linear-gradient(140deg,#19211f,#101414); }
.ss-membership-offer-note::after { position:absolute; right:-66px; bottom:-72px; width:190px; height:190px; border:1px solid rgba(32,178,170,.45); border-radius:50%; box-shadow:0 0 0 34px rgba(32,178,170,.035); content:""; }
.ss-membership-offer-note > * { position:relative; z-index:1; }
.ss-membership-offer-note h2 { margin:17px 0 12px; color:var(--tb-ink); font:900 29px/1.17 var(--font-cn-body); letter-spacing:-.05em; }
.ss-membership-offer-note p { max-width:370px; margin:0; color:var(--tb-muted); font:13px/1.7 var(--font-cn-body); }
.ss-membership-offer-note > div { display:flex; flex-wrap:wrap; gap:7px; margin-top:22px; }
.ss-membership-offer-note > div b { padding:5px 7px; border:1px solid var(--tb-line); border-radius:999px; color:var(--tb-green); font:9px var(--font-mono); letter-spacing:.04em; }

@media (max-width:620px) {
  .ss-onboarding-choice-grid { grid-template-columns:1fr!important; }
  .ss-membership-onboarding article { grid-template-columns:26px minmax(0,1fr)!important; }
  .ss-membership-onboarding article > button { grid-column:2; justify-self:start; }
}
.ss-membership-choice { margin-top:13px; }
.ss-membership-choice .ss-plan-grid { margin-top:0!important; }
.ss-membership-value,.ss-membership-included { margin-top:34px; }
.ss-membership-value > div { margin-top:0!important; border-radius:0!important; border-left:2px solid var(--tb-green)!important; }
.ss-membership-included > .ss-eyebrow { color:var(--tb-green)!important; }
.ss-membership-included > div > div { border-radius:0!important; box-shadow:none!important; }

.ss-member-weekly { margin-top:26px; padding:22px; border:1px solid var(--tb-line); border-left:2px solid var(--tb-green); background:linear-gradient(120deg,rgba(32,178,170,.06),transparent 48%),#0c1011; }
.ss-member-weekly.is-loading { min-height:150px; opacity:.78; }
.ss-member-weekly-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; }
.ss-member-weekly h2 { margin:9px 0 0; color:var(--tb-ink); font:900 24px/1.18 var(--font-cn-body); letter-spacing:-.035em; }
.ss-member-weekly-head > span { padding-top:3px; color:var(--tb-green); font:10px/1.4 var(--font-mono); white-space:nowrap; }
.ss-member-weekly > p { max-width:820px; margin:13px 0 0; color:var(--tb-muted); font:13px/1.72 var(--font-cn-body); }
.ss-member-weekly-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin-top:18px; background:var(--tb-line); border:1px solid var(--tb-line); }
.ss-member-weekly-metrics span { display:flex; min-height:72px; flex-direction:column; justify-content:center; gap:3px; padding:12px; background:#0a0e0f; color:var(--tb-muted); font:10px var(--font-cn-body); }
.ss-member-weekly-metrics b { color:var(--tb-ink); font:700 24px/1 var(--font-mono); }
.ss-member-weekly ol { display:grid; gap:8px; margin:18px 0 0; padding:0; list-style:none; counter-reset:weekly-action; }
.ss-member-weekly li { display:grid; grid-template-columns:22px minmax(0,1fr); gap:9px; color:var(--tb-muted); font:12px/1.6 var(--font-cn-body); counter-increment:weekly-action; }
.ss-member-weekly li::before { content:counter(weekly-action,decimal-leading-zero); color:var(--tb-orange); font:10px/1.9 var(--font-mono); }
.ss-member-weekly-playbook { display:grid; gap:5px; margin-top:17px; padding:13px 0; border-top:1px solid var(--tb-line); border-bottom:1px solid var(--tb-line); }
.ss-member-weekly-playbook small { color:var(--tb-green); font:9px/1.4 var(--font-mono); letter-spacing:.08em; }
.ss-member-weekly-playbook b { color:var(--tb-ink); font:700 13px/1.5 var(--font-cn-body); }
.ss-member-weekly > button { width:100%; height:46px; margin-top:16px; border-radius:0; font-size:12px; }
.ss-member-weekly-note { display:block; margin-top:9px; color:var(--tb-faint); font:9px/1.5 var(--font-mono); text-align:center; }

.ss-weekly-report { display:grid; gap:15px; }
.ss-weekly-summary { margin:0; color:var(--ink2); font:13px/1.7 var(--font-cn-body); }
.ss-weekly-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; border:1px solid var(--line); background:var(--line); }
.ss-weekly-metrics span { display:grid; gap:4px; justify-items:center; padding:12px 5px; background:var(--panel); color:var(--ink2); font:10px var(--font-cn-body); }
.ss-weekly-metrics b { color:var(--ink); font:700 20px/1 var(--font-mono); }
.ss-weekly-block { display:grid; gap:7px; padding-top:13px; border-top:1px solid var(--line); }
.ss-weekly-block > b { color:var(--ink); font:800 12px var(--font-cn-body); }
.ss-weekly-block > span { color:var(--ink2); font:12px/1.55 var(--font-cn-body); }
.ss-weekly-recommend { display:grid; gap:6px; padding:13px; border:1px solid color-mix(in srgb,var(--teal) 45%,var(--line)); background:color-mix(in srgb,var(--teal) 7%,var(--panel)); }
.ss-weekly-recommend small { color:var(--teal); font:9px var(--font-mono); letter-spacing:.06em; }
.ss-weekly-recommend b { color:var(--ink); font:800 13px/1.45 var(--font-cn-body); }
.ss-weekly-recommend span { color:var(--ink2); font:11px/1.55 var(--font-cn-body); }
.ss-weekly-history { padding-top:12px; border-top:1px solid var(--line); }
.ss-weekly-history summary { color:var(--ink2); font:11px var(--font-cn-body); cursor:pointer; }
.ss-weekly-history div { display:grid; gap:4px; margin-top:10px; }
.ss-weekly-history div b { color:var(--ink); font:10px var(--font-mono); }
.ss-weekly-history div span { color:var(--ink3); font:10px/1.5 var(--font-cn-body); }

@media (max-width:520px) {
  .ss-member-weekly { padding:17px 15px; }
  .ss-member-weekly h2 { font-size:20px; }
  .ss-member-weekly-metrics span { min-height:64px; padding:10px 7px; }
  .ss-member-weekly-metrics b { font-size:20px; }
}

@media (hover:hover) and (pointer:fine) {
  .ss-home-hero-actions button:hover,.ss-home-membership-side button:hover { box-shadow:0 12px 25px color-mix(in srgb,var(--tb-orange) 20%,transparent); transform:translateY(-1px); }
  .ss-home-signal:hover .ss-home-signal-body b { color:var(--tb-orange); }
  .ss-home-signal:hover strong { transform:translate(3px,-3px); }
}
@media (min-width:900px) {
  #app.app-shell .ss-header { justify-content:flex-start; gap:24px; }
  #app.app-shell .ss-header-positioning { display:block; color:var(--tb-muted); font:11px var(--font-cn-body); letter-spacing:.04em; }
  #app.app-shell .ss-header-actions { margin-left:auto; }
  .ss-home { width:min(100%,1280px); padding:38px 48px 108px; }
  .ss-home-hero { max-width:none!important; margin:0!important; padding:54px 12px 46px!important; border-radius:0!important; grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr); gap:60px; }
  .ss-home-hero h1 { font-size:clamp(58px,5.6vw,84px); }
  .ss-home-hero-side { align-self:end; }
  .ss-home-stats > div { padding:18px; }
  .ss-home-stats b { font-size:34px; }
  .ss-signal-run { padding:20px; }
  .ss-home .ss-one-card { min-height:410px; padding:46px; }
  .ss-home-section-head { padding:24px 0; }
  .ss-home-section-head h2 { font-size:34px; }
  .ss-home-signal { grid-template-columns:64px minmax(0,1fr) 100px 24px; gap:18px; padding:22px 4px; }
  .ss-home-signal-index { font-size:18px; }
  .ss-home-signal-body b { font-size:20px; }
  .ss-home-signal-body i { font-size:13px; }
  .ss-home-signal-state { display:block; align-self:center; }
  .ss-home-membership { grid-template-columns:minmax(0,1.28fr) minmax(260px,.72fr); align-items:end; padding:32px; }
  .ss-home-membership-copy h2 { font-size:38px; }
  .ss-intel-mask { align-items:center; padding:32px; }
  .ss-intel-sheet { max-height:calc(100dvh - 64px); padding:30px 38px 38px; border-bottom:1px solid var(--tb-line); }
  .ss-intel-footer { grid-template-columns:minmax(0,1fr) 260px; align-items:end; }
  /* Override the older 920px membership cap from the desktop-premium layer. */
  #app[data-page="membership"] .ss-scroll > .ss-membership { width:min(100%,1180px); max-width:1180px; padding:38px 48px 108px; }
  .ss-membership-intro { padding:9px 6px 42px; }
  .ss-membership-intro-grid { grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr); gap:64px; align-items:end; }
  .ss-membership-intro h1 { font-size:clamp(54px,5.2vw,76px); }
  .ss-membership-run { padding:22px; }
  .ss-membership-offer { grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); margin-top:34px; }
  .ss-membership-offer-main,.ss-membership-offer-note { padding:32px; }
  .ss-membership-offer-note h2 { font-size:37px; }
  .ss-membership-choice .ss-plan-grid button { padding:23px!important; }
}
@media (max-width:380px) {
  .ss-home-stats > div { padding:12px 9px; }
  .ss-home-stats b { font-size:21px; }
  .ss-home-stats small { font-size:9px; }
  .ss-home-hero h1 { font-size:39px; }
  .ss-membership-intro h1 { font-size:35px; }
}

/* 15-qianx-brand.css */
:root {
  --qx-marrs: #008c8c;
  --qx-deep: #005f5f;
  --qx-ink: #002f2f;
  --qx-night: #001414;
  --qx-orange: #f37021;
  --qx-cloud: #f0eee9;
  --qx-high: #f7f6f3;
  --qx-soft: #d8e9e6;
  --qx-muted: #5f706d;
  --qx-line: rgba(0, 95, 95, .22);
}

html, body, .site, .phone-shell { background: var(--qx-cloud); color: var(--qx-ink); }
body, button, input, textarea { font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif; }
.site-footer { border-color: var(--qx-line); background: var(--qx-cloud); color: var(--qx-muted); }
.site-footer a, .site-footer span { color: var(--qx-muted); }
.site-footer-brand b { color: var(--qx-deep); font-family: Inter, "Noto Sans SC", sans-serif; }

#app.app-shell[data-theme="halo"],
#app.app-shell[data-theme="obsidian"] {
  --bg: var(--qx-cloud);
  --panel: var(--qx-high);
  --panel2: #e6efec;
  --panelHi: #fffefa;
  --line: rgba(0, 95, 95, .14);
  --line2: rgba(0, 95, 95, .28);
  --ink: var(--qx-ink);
  --ink2: rgba(0, 47, 47, .69);
  --ink3: rgba(0, 47, 47, .46);
  --copper: var(--qx-orange);
  --cyan: var(--qx-marrs);
  --teal: var(--qx-marrs);
  --grid: rgba(0, 95, 95, .042);
  --glow: rgba(0, 140, 140, .10);
  --cardshadow: 0 16px 38px rgba(0, 47, 47, .07);
  --core-bg: var(--qx-ink);
  --core-line: rgba(247, 246, 243, .22);
  --core-grid: rgba(247, 246, 243, .08);
  --core-scan: rgba(247, 246, 243, .14);
  background: var(--qx-cloud) !important;
  color: var(--qx-ink) !important;
  font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
}

#app.app-shell::before {
  background-image: linear-gradient(rgba(0,95,95,.03) 1px,transparent 1px), linear-gradient(90deg,rgba(0,95,95,.03) 1px,transparent 1px);
  background-size: 48px 48px;
  opacity: .75;
}
#app.app-shell::after { display: none; }
#app.app-shell[data-page="scenes"] .ss-scroll { background: var(--qx-cloud) !important; }
#app.app-shell .ss-header,
#app.app-shell .ss-tabbar,
#app.app-shell .ss-compliance-bar {
  border-color: var(--qx-line) !important;
  background: rgba(240,238,233,.96) !important;
  color: var(--qx-ink) !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px);
}
#app.app-shell .ss-header { min-height: 70px; padding-top: 10px; padding-bottom: 10px; }
#app.app-shell .ss-brand { gap: 0; }
#app.app-shell .ss-brand-name {
  color: var(--qx-deep) !important;
  font: 800 25px/1 Inter, "Noto Sans SC", sans-serif !important;
  letter-spacing: -.045em !important;
}
#app.app-shell .ss-brand-os {
  margin-top: 5px;
  color: var(--qx-muted) !important;
  font: 600 8px/1.2 "JetBrains Mono", monospace !important;
  letter-spacing: .095em !important;
}
#app.app-shell .ss-header-positioning { color: var(--qx-muted); font-size: 11px; }
#app.app-shell .ss-header-actions { gap: 9px; }
#app.app-shell .ss-login-btn {
  height: 38px;
  padding: 0 13px;
  border: 0 !important;
  border-radius: 2px !important;
  background: transparent !important;
  color: var(--qx-deep) !important;
}
#app.app-shell .ss-header-join {
  height: 38px;
  padding: 0 16px;
  border: 1px solid var(--qx-orange);
  border-radius: 2px;
  background: var(--qx-orange);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
#app.app-shell .ss-tab { border-radius: 0; }
#app.app-shell .ss-tab .ss-tab-label { color: var(--qx-muted) !important; font-weight: 600; }
#app.app-shell .ss-tab.active .ss-tab-label { color: var(--qx-deep) !important; }
#app.app-shell .ss-tab .ss-tab-bar { background: transparent !important; box-shadow: none !important; }
#app.app-shell .ss-tab.active .ss-tab-bar { background: var(--qx-marrs) !important; }
#app.app-shell .ss-member-fab { border-color: var(--qx-orange); border-radius: 2px; background: var(--qx-orange); color: #fff; }
#app.app-shell .ss-compliance-bar a { color: var(--qx-muted) !important; }

/* Membership is part of the QianX conversion path, so it shares the same
   open editorial system instead of falling back to the legacy dark campaign. */
#app.app-shell[data-page="membership"] {
  --tb-black: var(--qx-cloud);
  --tb-ink: var(--qx-ink);
  --tb-muted: var(--qx-muted);
  --tb-orange: var(--qx-orange);
  --tb-green: var(--qx-marrs);
  --tb-line: var(--qx-line);
}
#app.app-shell[data-page="membership"] .ss-scroll { background: var(--qx-cloud) !important; }
#app.app-shell[data-page="membership"] .ss-membership { color: var(--qx-ink) !important; }
#app.app-shell[data-page="membership"] .ss-membership-intro { border-color: var(--qx-line); }
#app.app-shell[data-page="membership"] .ss-membership-intro h1 { color: var(--qx-ink); }
#app.app-shell[data-page="membership"] .ss-membership-intro h1 span { color: var(--qx-deep); }
#app.app-shell[data-page="membership"] .ss-membership-intro-grid > div:first-child > div { color: var(--qx-muted); }
#app.app-shell[data-page="membership"] .ss-membership-proof { color: var(--qx-muted); }
#app.app-shell[data-page="membership"] .ss-membership-run {
  border-color: var(--qx-line);
  background: var(--qx-soft);
}
#app.app-shell[data-page="membership"] .ss-membership-run b { color: var(--qx-orange); }
#app.app-shell[data-page="membership"] .ss-membership-run em { color: var(--qx-deep); }
#app.app-shell[data-page="membership"] .ss-membership-offer { border-color: var(--qx-line); background: var(--qx-line); }
#app.app-shell[data-page="membership"] .ss-membership-offer-main,
#app.app-shell[data-page="membership"] .ss-membership-offer-note { background: var(--qx-high); }
#app.app-shell[data-page="membership"] .ss-membership-offer-note { background: var(--qx-soft); }
#app.app-shell[data-page="membership"] .ss-membership-offer-note::after { display: none; }
#app.app-shell[data-page="membership"] .ss-membership-offer-note h2 { color: var(--qx-ink); }
#app.app-shell[data-page="membership"] .ss-membership-offer-note p { color: var(--qx-muted); }
#app.app-shell[data-page="membership"] .ss-membership-offer-note > div b {
  border-color: var(--qx-line);
  border-radius: 2px;
  color: var(--qx-deep);
}
#app.app-shell[data-page="membership"] .ss-membership-boundary {
  display: block;
  margin-top: 18px;
  padding-top: 13px;
  border-top: 1px solid var(--qx-line);
  color: var(--qx-muted);
  font-size: 10px;
  line-height: 1.65;
}
#app.app-shell[data-page="membership"] .ss-membership-value > div { border-left-color: var(--qx-marrs) !important; }
#app.app-shell[data-page="membership"] .ss-membership-included > .ss-eyebrow { color: var(--qx-marrs) !important; }

.qianx-home {
  box-sizing: border-box;
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  margin: 0 auto;
  padding: 0 28px 110px;
  color: var(--qx-ink);
}
.qianx-home button, .qianx-home a { -webkit-tap-highlight-color: transparent; }
.qianx-hero {
  display: grid;
  min-height: 610px;
  grid-template-columns: minmax(0, .95fr) minmax(440px, 1.05fr);
  align-items: center;
  gap: clamp(38px, 6vw, 84px);
  padding: 64px 0 58px;
  border-bottom: 1px solid var(--qx-line);
}
.qianx-hero h1 {
  max-width: 700px;
  margin: 0;
  color: var(--qx-ink);
  font: 900 clamp(50px, 4.5vw, 68px)/1.05 "Noto Sans SC", sans-serif;
  letter-spacing: -.065em;
}
.qianx-hero h1 span, .qianx-hero h1 em { display: block; white-space: nowrap; }
.qianx-hero h1 em { color: var(--qx-deep); font-style: normal; }
.qianx-lead { max-width: 590px; margin: 26px 0 0; color: var(--qx-muted); font-size: 17px; line-height: 1.78; }
.qianx-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.qianx-button {
  display: inline-flex;
  box-sizing: border-box;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border: 1px solid var(--qx-deep);
  border-radius: 2px;
  background: transparent;
  color: var(--qx-deep);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}
.qianx-button-primary { border-color: var(--qx-orange); background: var(--qx-orange); color: #fff; }
.qianx-brand-line { display: grid; gap: 5px; margin-top: 34px; padding-left: 14px; border-left: 3px solid var(--qx-marrs); }
.qianx-brand-line b { color: var(--qx-deep); font-size: 14px; }
.qianx-brand-line span { color: var(--qx-muted); font: 10px "JetBrains Mono", monospace; letter-spacing: .025em; }

.qianx-network-board { border: 1px solid var(--qx-line); background: rgba(247,246,243,.74); }
.qianx-network-board > header, .qianx-network-board > footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 17px; border-bottom: 1px solid var(--qx-line); }
.qianx-network-board > footer { border-top: 1px solid var(--qx-line); border-bottom: 0; }
.qianx-network-board > header span, .qianx-network-board > footer span { color: var(--qx-marrs); font: 9px "JetBrains Mono", monospace; letter-spacing: .09em; }
.qianx-network-board > header b { color: var(--qx-muted); font: 500 9px "JetBrains Mono", monospace; }
.qianx-network-board > footer b { color: var(--qx-ink); font-size: 11px; }
.qianx-network { position: relative; min-height: 390px; overflow: hidden; }
.qianx-network-ring { position: absolute; left: 50%; top: 50%; width: 270px; height: 270px; border: 1px dashed rgba(0,140,140,.54); border-radius: 50%; transform: translate(-50%,-50%); }
.qianx-network-ring::before, .qianx-network-ring::after { position: absolute; left: 50%; top: 50%; z-index: 0; content: ""; background: var(--qx-marrs); opacity: .55; transform-origin: left center; }
.qianx-network-ring::before { width: 260px; height: 1px; transform: rotate(25deg) translateX(-50%); }
.qianx-network-ring::after { width: 260px; height: 1px; transform: rotate(155deg) translateX(-50%); }
.qianx-network-center { position: absolute; left: 50%; top: 50%; z-index: 2; display: flex; width: 118px; height: 118px; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: var(--qx-deep); color: #fff; transform: translate(-50%,-50%); box-shadow: 0 0 0 12px rgba(0,140,140,.08); }
.qianx-network-center b { font: 800 19px Inter, sans-serif; letter-spacing: -.04em; }
.qianx-network-center span { margin-top: 8px; color: rgba(255,255,255,.65); font: 8px "JetBrains Mono", monospace; letter-spacing: .13em; }
.qianx-network-role { position: absolute; z-index: 3; display: grid; min-width: 130px; gap: 2px; padding: 11px 13px; border: 1px solid var(--qx-marrs); border-radius: 2px; background: var(--qx-high); color: var(--qx-ink); text-align: left; cursor: pointer; }
.qianx-network-role i { color: var(--qx-orange); font: 9px "JetBrains Mono", monospace; font-style: normal; }
.qianx-network-role b { font-size: 13px; }
.qianx-network-role span { color: var(--qx-muted); font-size: 10px; }
.qianx-network-role.is-builder { left: 50%; top: 23px; transform: translateX(-50%); }
.qianx-network-role.is-supplier { left: 24px; bottom: 32px; }
.qianx-network-role.is-partner { right: 24px; bottom: 32px; }
.qianx-network-role.is-builder i { color: var(--qx-orange); }
.qianx-network-role.is-builder::after { position: absolute; right: 8px; top: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--qx-orange); content: ""; }

.qianx-positioning, .qianx-identities, .qianx-membership, .qianx-system, .qianx-loop, .qianx-closing { padding: 88px 0; border-bottom: 1px solid var(--qx-line); }
.qianx-positioning { display: grid; grid-template-columns: minmax(150px,.34fr) minmax(0,1fr); gap: 42px; }
.qianx-positioning > p, .qianx-section-head > span, .qianx-membership-copy > span, .qianx-closing > div > span { margin: 0; color: var(--qx-marrs); font: 9px/1.5 "JetBrains Mono", monospace; letter-spacing: .12em; }
.qianx-positioning h2, .qianx-section-head h2, .qianx-membership h2, .qianx-closing h2 { margin: 0; color: var(--qx-ink); font: 900 clamp(32px,4.3vw,58px)/1.12 "Noto Sans SC", sans-serif; letter-spacing: -.055em; }
.qianx-positioning > div { grid-column: 2; display: grid; grid-template-columns: auto 1fr; gap: 9px 16px; margin-top: -12px; padding-top: 22px; border-top: 1px solid var(--qx-line); }
.qianx-positioning > div span { color: var(--qx-muted); font-size: 11px; }
.qianx-positioning > div b { color: var(--qx-deep); font-size: 12px; }

.qianx-section-head { display: grid; grid-template-columns: 170px minmax(0,1fr) minmax(220px,.44fr); align-items: end; gap: 28px; }
.qianx-section-head > p { margin: 0; color: var(--qx-muted); font-size: 13px; line-height: 1.7; }
.qianx-identity-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 42px; border: 1px solid var(--qx-line); background: var(--qx-line); }
.qianx-identity-card { display: grid; grid-template-rows: auto 1fr auto; min-height: 360px; padding: 26px; background: var(--qx-high); }
.qianx-identity-index { color: var(--qx-marrs); font: 700 28px Inter, sans-serif; }
.qianx-identity-card small { color: var(--qx-orange); font: 9px "JetBrains Mono", monospace; letter-spacing: .1em; }
.qianx-identity-card h3 { margin: 12px 0 10px; color: var(--qx-ink); font-size: 26px; letter-spacing: -.035em; }
.qianx-identity-card p { margin: 0; color: var(--qx-muted); font-size: 13px; line-height: 1.7; }
.qianx-identity-card button { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 13px 0 0; border: 0; border-top: 1px solid var(--qx-line); background: transparent; color: var(--qx-deep); font-size: 12px; font-weight: 800; text-align: left; cursor: pointer; }
.qianx-identity-card button b { color: var(--qx-orange); }

.qianx-membership { display: grid; grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr); gap: 1px; padding: 0; border: 1px solid var(--qx-orange); background: var(--qx-orange); }
.qianx-membership-copy, .qianx-membership-benefits { padding: 38px; background: var(--qx-high); }
.qianx-membership h2 { margin-top: 18px; font-size: clamp(30px,3.3vw,46px); }
.qianx-membership-copy > p { max-width: 500px; margin: 18px 0 0; color: var(--qx-muted); font-size: 13px; line-height: 1.75; }
.qianx-membership-price { display: flex; align-items: baseline; gap: 8px; margin: 25px 0 20px; color: var(--qx-orange); }
.qianx-membership-price b { font: 800 56px/1 Inter, sans-serif; letter-spacing: -.055em; }
.qianx-membership-price span { color: var(--qx-deep); font-size: 13px; }
.qianx-membership-benefits ul { display: grid; gap: 0; margin: 0; padding: 0; border-top: 1px solid var(--qx-line); list-style: none; }
.qianx-membership-benefits li { display: grid; grid-template-columns: 34px minmax(130px,.42fr) minmax(0,1fr); gap: 12px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--qx-line); }
.qianx-membership-benefits li span { color: var(--qx-marrs); font: 9px "JetBrains Mono", monospace; }
.qianx-membership-benefits li b { color: var(--qx-ink); font-size: 13px; }
.qianx-membership-benefits li small { color: var(--qx-muted); font-size: 11px; line-height: 1.55; }
.qianx-boundary { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 14px 20px; background: var(--qx-soft); color: var(--qx-muted); font-size: 11px; }
.qianx-boundary b { color: var(--qx-deep); }

.qianx-section-head.is-compact { grid-template-columns: 170px minmax(0,1fr); }
.qianx-system-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 42px; border: 1px solid var(--qx-line); background: var(--qx-line); }
.qianx-system-grid button { min-height: 280px; padding: 28px; border: 0; background: var(--qx-high); color: inherit; text-align: left; cursor: pointer; }
.qianx-system-grid button > span { color: var(--qx-marrs); font: 9px "JetBrains Mono", monospace; letter-spacing: .09em; }
.qianx-system-grid h3 { margin: 48px 0 10px; color: var(--qx-ink); font-size: 26px; }
.qianx-system-grid p { min-height: 68px; margin: 0; color: var(--qx-muted); font-size: 12px; line-height: 1.65; }
.qianx-system-grid button > b { display: block; margin-top: 22px; color: var(--qx-orange); font-size: 11px; }

.qianx-loop { display: grid; grid-template-columns: minmax(0,1fr) minmax(330px,.76fr); gap: 54px; }
.qianx-loop .qianx-section-head { grid-template-columns: 1fr; align-content: start; }
.qianx-loop ol { margin: 0; padding: 0; border-top: 1px solid var(--qx-deep); list-style: none; }
.qianx-loop li { display: grid; grid-template-columns: 32px minmax(100px,.45fr) 1fr; gap: 12px; align-items: baseline; padding: 17px 0; border-bottom: 1px solid var(--qx-line); }
.qianx-loop li span { color: var(--qx-orange); font: 9px "JetBrains Mono", monospace; }
.qianx-loop li b { color: var(--qx-ink); font-size: 13px; }
.qianx-loop li small { color: var(--qx-muted); font-size: 11px; line-height: 1.55; }
.qianx-loop li:last-child { margin: 0 -12px; padding: 17px 12px; background: var(--qx-deep); }
.qianx-loop li:last-child b { color: #fff; }
.qianx-loop li:last-child small { color: rgba(255,255,255,.68); }
.qianx-closing { display: flex; align-items: end; justify-content: space-between; gap: 40px; border-bottom: 0; }
.qianx-closing h2 { margin-top: 16px; }

@media (hover:hover) and (pointer:fine) {
  .qianx-button:hover, #app .ss-header-join:hover { transform: translate(-2px,-2px); box-shadow: 4px 4px 0 var(--qx-ink); opacity: 1 !important; }
  .qianx-identity-card:hover, .qianx-system-grid button:hover { background: #fffefa; }
  .qianx-network-role:hover { border-color: var(--qx-orange); }
}

@media (min-width: 900px) {
  #app.app-shell .ss-header, #app.app-shell .ss-tabbar { padding-left: max(28px,calc((100% - 1240px)/2)); padding-right: max(28px,calc((100% - 1240px)/2)); }
  #app.app-shell .ss-scroll > .qianx-home { max-width: 1280px !important; width: min(100%,1280px) !important; }
  #app.app-shell[data-page="scenes"] .ss-scroll { background: var(--qx-cloud); }
}

@media (max-width: 899px) {
  #app.app-shell .ss-header { min-height: 64px; padding: 9px 16px; }
  #app.app-shell .ss-header-positioning, #app.app-shell .ss-header-join { display: none; }
  #app.app-shell .ss-brand-name { font-size: 22px !important; }
  #app.app-shell .ss-login-btn { height: 34px; padding-right: 0; }
  #app.app-shell .ss-tabbar { padding-top: 7px; }
  #app.app-shell .ss-tab { gap: 5px; padding-top: 7px; }
  .qianx-home { padding: 0 16px 94px; }
  .qianx-hero { min-height: 0; grid-template-columns: 1fr; gap: 36px; padding: 52px 0 48px; }
  .qianx-hero h1 { font-size: clamp(42px,11.5vw,58px); line-height: 1.08; }
  .qianx-hero h1 span, .qianx-hero h1 em { white-space: normal; }
  .qianx-lead { margin-top: 21px; font-size: 15px; }
  .qianx-actions { display: grid; grid-template-columns: 1fr; margin-top: 26px; }
  .qianx-button { width: 100%; }
  .qianx-brand-line { margin-top: 27px; }
  .qianx-network { min-height: 305px; }
  .qianx-network-ring { width: 208px; height: 208px; }
  .qianx-network-ring::before, .qianx-network-ring::after { width: 205px; }
  .qianx-network-center { width: 92px; height: 92px; }
  .qianx-network-center b { font-size: 15px; }
  .qianx-network-role { min-width: 108px; padding: 9px; }
  .qianx-network-role b { font-size: 11px; }
  .qianx-network-role.is-builder { top: 17px; }
  .qianx-network-role.is-supplier { left: 11px; bottom: 21px; }
  .qianx-network-role.is-partner { right: 11px; bottom: 21px; }
  .qianx-network-board > header b { display: none; }
  .qianx-network-board > footer { align-items: flex-start; flex-direction: column; gap: 5px; }
  .qianx-positioning, .qianx-identities, .qianx-system, .qianx-loop, .qianx-closing { padding: 62px 0; }
  .qianx-positioning, .qianx-section-head, .qianx-section-head.is-compact, .qianx-loop { grid-template-columns: 1fr; gap: 20px; }
  .qianx-positioning h2, .qianx-section-head h2, .qianx-closing h2 { font-size: clamp(30px,8.8vw,42px); }
  .qianx-positioning > div { grid-column: 1; grid-template-columns: 1fr; margin-top: 5px; }
  .qianx-positioning > div b + span { margin-top: 8px; }
  .qianx-identity-grid, .qianx-system-grid { grid-template-columns: 1fr; margin-top: 30px; }
  .qianx-identity-card { grid-template-columns: 44px minmax(0,1fr) 24px; grid-template-rows: 1fr; min-height: 0; gap: 13px; align-items: center; padding: 18px 15px; }
  .qianx-identity-index { align-self: stretch; display: flex; align-items: center; justify-content: center; margin: -18px 0 -18px -15px; background: var(--qx-deep); color: #fff; font-size: 17px; }
  .qianx-identity-card h3 { margin: 6px 0 4px; font-size: 18px; }
  .qianx-identity-card p { font-size: 11px; }
  .qianx-identity-card button { align-self: stretch; width: 24px; padding: 0; border-top: 0; font-size: 0; }
  .qianx-identity-card button b { font-size: 18px; }
  .qianx-membership { grid-template-columns: 1fr; }
  .qianx-membership-copy, .qianx-membership-benefits { padding: 27px 22px; }
  .qianx-membership-price b { font-size: 50px; }
  .qianx-membership-benefits { padding-top: 5px; }
  .qianx-membership-benefits li { grid-template-columns: 27px minmax(0,1fr); }
  .qianx-membership-benefits li small { grid-column: 2; }
  .qianx-boundary { grid-column: 1; }
  .qianx-system-grid button { min-height: 0; padding: 22px; }
  .qianx-system-grid h3 { margin-top: 24px; }
  .qianx-system-grid p { min-height: 0; }
  .qianx-loop ol { margin-top: 12px; }
  .qianx-loop li { grid-template-columns: 28px minmax(88px,.42fr) 1fr; }
  .qianx-closing { align-items: stretch; flex-direction: column; }
}

/* --------------------------------------------------------------------------
   QianX product surfaces

   The six primary routes are one product, not six microsites.  Legacy
   TechBridge screens used graphite as their page canvas and hard-coded dark
   cards.  Keep dark only as a deliberate code/command surface; navigation,
   reading, community and account management all live on the QianX paper
   system below.
   -------------------------------------------------------------------------- */

#app.app-shell:is(
  [data-page="scenes"],
  [data-page="premium"],
  [data-page="feed"],
  [data-page="circle"],
  [data-page="moments"],
  [data-page="assets"]
) {
  --tb-black: var(--qx-cloud);
  --tb-panel: var(--qx-high);
  --tb-ink: var(--qx-ink);
  --tb-muted: var(--qx-muted);
  --tb-orange: var(--qx-orange);
  --tb-green: var(--qx-marrs);
  --tb-line: var(--qx-line);
  --apple-surface: rgba(247, 246, 243, .82);
  --apple-surface-solid: var(--qx-high);
  --apple-surface-raised: #fffefa;
  --apple-hairline: var(--qx-line);
  --apple-shadow: 0 14px 34px rgba(0, 47, 47, .07);
  background: var(--qx-cloud) !important;
  color: var(--qx-ink) !important;
}

#app.app-shell:is(
  [data-page="scenes"],
  [data-page="premium"],
  [data-page="feed"],
  [data-page="circle"],
  [data-page="moments"],
  [data-page="assets"]
) .ss-scroll {
  background: var(--qx-cloud) !important;
}

#app.app-shell:is(
  [data-page="premium"],
  [data-page="feed"],
  [data-page="circle"],
  [data-page="moments"],
  [data-page="assets"]
) :is(h1, h2, h3, h4) {
  color: var(--qx-ink);
}

/* Agent Book: QianX editorial library. */
#app.app-shell[data-page="feed"] .tb-case-library,
#app.app-shell[data-page="feed"] .page {
  background: var(--qx-cloud) !important;
  color: var(--qx-ink);
}

#app.app-shell[data-page="feed"] .tb-library-workbench {
  border-color: var(--qx-line);
  background: var(--qx-cloud);
}

#app.app-shell[data-page="feed"] .tb-library-hero {
  border-color: var(--qx-line);
  background-color: var(--qx-cloud);
  background-image:
    linear-gradient(rgba(0, 95, 95, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 95, 95, .045) 1px, transparent 1px);
}

#app.app-shell[data-page="feed"] .tb-library-hero::after {
  border-color: var(--qx-marrs);
  box-shadow: 0 0 0 38px rgba(0, 140, 140, .045), 0 0 0 76px rgba(243, 112, 33, .035);
}

#app.app-shell[data-page="feed"] .tb-library-hero h1 em { color: var(--qx-deep); }

#app.app-shell[data-page="feed"] .tb-case-feature {
  border-color: var(--qx-marrs);
  background: linear-gradient(145deg, rgba(216, 233, 230, .96), rgba(247, 246, 243, .98) 62%);
  box-shadow: var(--cardshadow);
}

#app.app-shell[data-page="feed"] .tb-case-feature-command pre {
  border-color: var(--qx-deep);
  background: var(--qx-ink);
  color: #d9f1ed;
}

#app.app-shell[data-page="feed"] :is(.tb-case-list, .tb-template-library) {
  color: var(--qx-ink);
}

#app.app-shell[data-page="feed"] .tb-template-grid {
  border-color: var(--qx-line);
  background: var(--qx-line);
}

#app.app-shell[data-page="feed"] .tb-template-card,
#app.app-shell[data-page="feed"] .tb-member-bridge,
#app.app-shell[data-page="feed"] .tb-daily-column {
  background: var(--qx-high);
}

#app.app-shell[data-page="feed"] .tb-template-copy small,
#app.app-shell[data-page="feed"] .tb-daily-item.is-pending p { color: rgba(0, 47, 47, .46); }
#app.app-shell[data-page="feed"] .tb-daily-item.is-pending h3 { color: rgba(0, 47, 47, .66); }
#app.app-shell[data-page="feed"] .tb-case-copy.is-copied { color: #fff; }

/* Friends: an open, readable collaboration feed. */
#app.app-shell[data-page="moments"] .ss-circle-page {
  width: min(100%, 920px);
  max-width: 920px;
  margin-top: 0;
  margin-bottom: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: var(--qx-ink);
  box-shadow: none;
}

#app.app-shell[data-page="moments"] .ss-circle-hero {
  border-color: var(--qx-line);
  border-radius: 2px;
  background:
    linear-gradient(rgba(0, 95, 95, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 95, 95, .035) 1px, transparent 1px),
    var(--qx-high);
  background-size: 32px 32px;
}

#app.app-shell[data-page="moments"] .ss-circle-hero::after {
  border-color: rgba(243, 112, 33, .42);
  box-shadow: 0 0 0 24px rgba(243, 112, 33, .035), 0 0 0 50px rgba(0, 140, 140, .025);
}

#app.app-shell[data-page="moments"] .ss-circle-hero h1 em { color: var(--qx-deep); }

#app.app-shell[data-page="moments"] .ss-circle-metrics > div,
#app.app-shell[data-page="moments"] :is(.ss-circle-compose, .ss-circle-compose-open, .ss-circle-post) {
  background: var(--qx-high);
}

#app.app-shell[data-page="moments"] .ss-circle-metrics > small,
#app.app-shell[data-page="moments"] .ss-circle-post time,
#app.app-shell[data-page="moments"] .ss-circle-actions span { color: rgba(0, 47, 47, .44); }

#app.app-shell[data-page="moments"] :is(.ss-circle-compose, .ss-circle-compose-open, .ss-circle-post, .ss-circle-empty) {
  border-radius: 2px;
  box-shadow: none;
}

#app.app-shell[data-page="moments"] :is(.ss-circle-compose-open textarea, .ss-circle-reference-fields input, .ss-circle-reply-box input) {
  border-color: var(--qx-line);
  border-radius: 2px;
  background: #fffefa;
  color: var(--qx-ink);
}

#app.app-shell[data-page="moments"] :is(.ss-circle-business-tags, .ss-circle-topic-zone, .ss-circle-tabs) {
  border-color: var(--qx-line);
  border-radius: 2px;
  background: var(--qx-soft);
}

#app.app-shell[data-page="moments"] .ss-circle-topic-tabs button {
  border-color: var(--qx-line);
  border-radius: 2px;
  background: var(--qx-high);
  color: var(--qx-muted);
}

#app.app-shell[data-page="moments"] :is(.ss-circle-topic-tabs button.is-active, .ss-circle-tabs button.is-active) {
  border-color: var(--qx-marrs);
  background: var(--qx-marrs);
  color: #fff;
}

#app.app-shell[data-page="moments"] .ss-circle-featured {
  border-color: rgba(243, 112, 33, .42);
  border-radius: 2px;
  background: linear-gradient(135deg, rgba(243, 112, 33, .075), transparent 58%), var(--qx-high);
}

#app.app-shell[data-page="moments"] .ss-circle-new-notice {
  border-color: var(--qx-line);
  border-radius: 2px;
  background: var(--qx-soft);
  color: var(--qx-deep);
}

#app.app-shell[data-page="moments"] .ss-circle-post.is-ai {
  border-left-color: var(--qx-orange);
  background: linear-gradient(122deg, rgba(243, 112, 33, .055), transparent 38%), var(--qx-high);
}

#app.app-shell[data-page="moments"] .ss-circle-post.is-human { border-left-color: var(--qx-marrs); }
#app.app-shell[data-page="moments"] .ss-circle-post.is-new { box-shadow: 0 0 0 3px rgba(0, 140, 140, .08); }
#app.app-shell[data-page="moments"] .ss-circle-avatar { background: var(--qx-soft); }
#app.app-shell[data-page="moments"] .ss-circle-avatar.is-ai {
  border-color: rgba(243, 112, 33, .42);
  background: #f4dfd2;
  color: #78330f;
}

#app.app-shell[data-page="moments"] .ss-circle-identity.is-human {
  border-color: rgba(0, 140, 140, .42);
  background: rgba(0, 140, 140, .07);
  color: var(--qx-deep);
}

#app.app-shell[data-page="moments"] .ss-circle-identity.is-ai,
#app.app-shell[data-page="moments"] .ss-circle-persona-boundary span {
  color: #a84512;
}

#app.app-shell[data-page="moments"] .ss-circle-persona-boundary b { color: rgba(0, 47, 47, .82); }
#app.app-shell[data-page="moments"] .ss-circle-comments { border-radius: 2px; background: var(--qx-soft); }
#app.app-shell[data-page="moments"] .ss-circle-actions { border-color: var(--qx-line); }
#app.app-shell[data-page="moments"] .ss-circle-actions button:hover,
#app.app-shell[data-page="moments"] .ss-circle-actions button.is-active { color: #a84512; }

/* My space: account, business context and delivery in the same paper system. */
#app.app-shell[data-page="assets"] .ss-my-list {
  width: min(100%, 1120px);
  max-width: 1120px;
  color: var(--qx-ink);
}

#app.app-shell[data-page="assets"] .ss-my-list > .ss-back { display: none; }

#app.app-shell[data-page="assets"] :is(.ss-my-member-card, .ss-trade-profile, .ss-my-utility-grid article) {
  border-color: var(--qx-line);
  background: var(--qx-high);
}

#app.app-shell[data-page="assets"] .ss-my-member-card {
  border-left: 2px solid var(--qx-marrs);
  border-radius: 0;
}

#app.app-shell[data-page="assets"] .ss-my-member-card::after {
  border-color: rgba(0, 140, 140, .20);
  box-shadow: 0 0 0 28px rgba(0, 140, 140, .025), 0 0 0 56px rgba(243, 112, 33, .02);
}

#app.app-shell[data-page="assets"] .ss-trade-profile {
  border-left-color: var(--qx-orange);
  background: linear-gradient(145deg, rgba(243, 112, 33, .035), transparent 62%), var(--qx-high);
}

#app.app-shell[data-page="assets"] .ss-trade-profile.is-locked { border-left-color: var(--qx-marrs); }

#app.app-shell[data-page="assets"] :is(.ss-trade-profile-form input, .ss-trade-profile-form select, .ss-trade-profile-form textarea) {
  border-color: var(--qx-line);
  background: #fffefa;
  color: var(--qx-ink);
}

#app.app-shell[data-page="assets"] .ss-my-utility-grid {
  border: 1px solid var(--qx-line);
  background: var(--qx-line);
}

#app.app-shell[data-page="assets"] .ss-list-row {
  border-bottom: 1px solid var(--qx-line);
  background: transparent;
}

#app.app-shell[data-page="assets"] :is(.ss-list-check, .ss-list-remove, .ss-list-empty button) { border-color: var(--qx-line); }

/* Desktop pages share the same generous QianX canvas; mobile keeps one-column
   reading and the fixed five-tab workflow. */
@media (min-width: 900px) {
  #app.app-shell[data-page="moments"] .ss-circle-page { padding-top: 52px; padding-bottom: 112px; }
  #app.app-shell[data-page="assets"] .ss-my-list { padding: 52px 48px 112px; }
}

@media (max-width: 899px) {
  #app.app-shell[data-page="feed"] .tb-library-hero { min-height: 0; padding-top: 46px; }
  #app.app-shell[data-page="feed"] .tb-case-feature { margin-top: 18px; }
  #app.app-shell[data-page="moments"] .ss-circle-page { padding-top: 18px; }
  #app.app-shell[data-page="assets"] .ss-my-list { padding-top: 30px; }
}

/* --------------------------------------------------------------------------
   QianX recruitment funnel: information -> guide -> recruitment -> account.
   These routes deliberately share one editorial grid and one conversion
   language.  AI/persona presentation remains backstage, not in the product UI.
   -------------------------------------------------------------------------- */

.qx-hero-kicker {
  margin: 0 0 18px;
  color: var(--qx-marrs);
  font: 700 10px/1.4 "JetBrains Mono", monospace;
  letter-spacing: .14em;
}

.qx-home-boundary {
  display: grid;
  grid-template-columns: 170px minmax(0, .9fr) minmax(260px, .55fr);
  gap: 28px;
  align-items: start;
  padding: 68px 0;
  border-bottom: 1px solid var(--qx-line);
  background: linear-gradient(90deg, rgba(243,112,33,.06), transparent 42%);
}
.qx-home-boundary > span,
.qx-content-page :is(.qx-page-hero, .qx-editorial-note, .qx-content-bridge, .qx-recruit-status, .qx-recruit-process, .qx-recruit-boundary, .qx-account-card, .qx-account-hero) > :is(span, div > span),
.qx-content-page article > header > span {
  color: var(--qx-marrs);
  font: 700 9px/1.45 "JetBrains Mono", monospace;
  letter-spacing: .12em;
}
.qx-home-boundary h2 { margin: 0; color: var(--qx-ink); font-size: 27px; line-height: 1.3; letter-spacing: -.04em; }
.qx-home-boundary p { margin: 0; color: var(--qx-muted); font-size: 13px; line-height: 1.75; }

.qx-content-page {
  box-sizing: border-box;
  width: min(100%, 1240px) !important;
  max-width: 1240px !important;
  margin: 0 auto;
  padding: 56px 28px 132px;
  color: var(--qx-ink);
}
#app.app-shell[data-page="moments"] .ss-scroll > .qx-recruit-page {
  margin-top: 0;
  margin-bottom: 0;
  border: 0;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
}
.qx-content-page button { font-family: inherit; cursor: pointer; }
.qx-page-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .52fr);
  gap: clamp(40px, 8vw, 118px);
  align-items: end;
  padding: 26px 0 54px;
  border-bottom: 1px solid var(--qx-line);
}
.qx-page-hero h1 {
  max-width: 820px;
  margin: 15px 0 0;
  color: var(--qx-ink);
  font: 900 clamp(44px, 5.4vw, 72px)/1.07 "Noto Sans SC", sans-serif;
  letter-spacing: -.065em;
}
.qx-page-hero > p { margin: 0; color: var(--qx-muted); font-size: 14px; line-height: 1.8; }

.qx-editorial-note {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 24px;
  margin: 26px 0 44px;
  padding: 17px 19px;
  border-left: 3px solid var(--qx-orange);
  background: rgba(247,246,243,.76);
}
.qx-editorial-note b { color: var(--qx-orange); font-size: 11px; }
.qx-editorial-note span { color: var(--qx-muted); font-size: 11px; line-height: 1.7; }

.qx-insight-feature { margin-bottom: 1px; }
.qx-insight-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: var(--qx-line); border: 1px solid var(--qx-line); }
.qx-insight-card { padding: 30px; background: var(--qx-high); }
.qx-insight-card.is-featured {
  display: grid;
  grid-template-columns: minmax(0,.52fr) minmax(0,1fr);
  gap: 24px 50px;
  padding: clamp(30px,4.5vw,56px);
  border: 1px solid var(--qx-deep);
  background: linear-gradient(135deg, rgba(216,233,230,.78), rgba(247,246,243,.98) 58%);
}
.qx-insight-card header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.qx-insight-card header b { color: var(--qx-orange); font-size: 10px; }
.qx-insight-card h2 { margin: 40px 0 14px; font-size: 27px; line-height: 1.28; letter-spacing: -.04em; }
.qx-insight-card > p { margin: 0; color: var(--qx-muted); font-size: 13px; line-height: 1.75; }
.qx-insight-card.is-featured header { grid-column: 1 / -1; }
.qx-insight-card.is-featured h2 { margin: 0; font-size: clamp(36px,4.2vw,55px); line-height: 1.1; }
.qx-insight-card.is-featured > p { font-size: 15px; }
.qx-insight-card details { grid-column: 1 / -1; margin-top: 24px; border-top: 1px solid var(--qx-line); }
.qx-insight-card summary,
.qx-guide-card summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0 0;
  color: var(--qx-deep);
  font-size: 11px;
  font-weight: 800;
  list-style: none;
  cursor: pointer;
}
.qx-insight-card summary::-webkit-details-marker,
.qx-guide-card summary::-webkit-details-marker { display: none; }
.qx-insight-card details[open] summary i,
.qx-guide-card details[open] summary i { transform: rotate(45deg); }
.qx-insight-card summary i,
.qx-guide-card summary i { color: var(--qx-orange); font-size: 18px; font-style: normal; transition: transform .2s ease; }
.qx-insight-card ul { margin: 16px 0 0; padding: 0; list-style: none; }
.qx-insight-card li { padding: 10px 0 10px 18px; border-top: 1px solid var(--qx-line); color: var(--qx-ink); font-size: 12px; line-height: 1.55; }
.qx-insight-card li::before { margin-left: -18px; margin-right: 9px; color: var(--qx-orange); content: "—"; }

.qx-content-bridge {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  margin-top: 64px;
  padding: 42px;
  background: var(--qx-deep);
  color: #fff;
}
.qx-content-bridge h2 { margin: 12px 0 0; color: #fff !important; font-size: clamp(28px,3.5vw,45px); line-height: 1.14; letter-spacing: -.05em; }
.qx-content-bridge button { flex: 0 0 auto; min-height: 46px; padding: 0 18px; border: 1px solid #fff; border-radius: 2px; background: transparent; color: #fff; font-size: 12px; font-weight: 800; }
.qx-content-bridge.is-orange { background: var(--qx-orange); }

.qx-guide-principle { display: grid; grid-template-columns: 180px 1fr; gap: 24px; padding: 27px 0; border-bottom: 1px solid var(--qx-line); }
.qx-guide-principle > span { color: var(--qx-orange); font: 700 9px "JetBrains Mono", monospace; letter-spacing: .11em; }
.qx-guide-principle ol { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin: 0; padding: 0; background: var(--qx-line); list-style: none; }
.qx-guide-principle li { padding: 13px; background: var(--qx-high); color: var(--qx-deep); font-size: 11px; font-weight: 800; }
.qx-guide-list { border-top: 1px solid var(--qx-deep); }
.qx-guide-card { display: grid; grid-template-columns: 180px minmax(0,1fr) minmax(300px,.66fr); gap: 30px; padding: 34px 0; border-bottom: 1px solid var(--qx-line); }
.qx-guide-card > header { display: grid; align-content: space-between; gap: 40px; }
.qx-guide-card > header > div { display: flex; flex-wrap: wrap; gap: 6px; }
.qx-guide-card > header b { padding: 5px 7px; border: 1px solid var(--qx-line); color: var(--qx-muted); font-size: 9px; font-weight: 600; }
.qx-guide-main h2 { margin: 0; font-size: 30px; line-height: 1.25; letter-spacing: -.045em; }
.qx-guide-main p { margin: 13px 0 0; color: var(--qx-muted); font-size: 12px; line-height: 1.7; }
.qx-guide-card details { border-left: 1px solid var(--qx-line); padding-left: 28px; }
.qx-guide-card summary { padding-top: 0; }
.qx-guide-card ol { margin: 17px 0 0; padding: 0; list-style: none; }
.qx-guide-card li { display: grid; grid-template-columns: 28px 1fr; gap: 8px; padding: 9px 0; border-top: 1px solid var(--qx-line); color: var(--qx-muted); font-size: 11px; line-height: 1.5; }
.qx-guide-card li b { color: var(--qx-orange); font: 700 9px "JetBrains Mono", monospace; }

.qx-recruit-hero { padding-bottom: 64px; }
.qx-recruit-status { display: grid; grid-template-columns: 160px 230px 1fr; gap: 24px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--qx-line); }
.qx-recruit-status b { color: var(--qx-orange); font-size: 13px; }
.qx-recruit-status p { margin: 0; color: var(--qx-muted); font-size: 11px; line-height: 1.65; }
.qx-recruit-role-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 46px; border: 1px solid var(--qx-line); background: var(--qx-line); }
.qx-recruit-role { display: grid; grid-template-rows: auto auto auto 1fr auto; min-height: 520px; padding: 28px; background: var(--qx-high); }
.qx-recruit-role header { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.qx-recruit-role header span { color: var(--qx-marrs); font: 800 32px Inter, sans-serif; }
.qx-recruit-role header small { color: var(--qx-orange); font: 700 8px "JetBrains Mono", monospace; letter-spacing: .1em; }
.qx-recruit-role h2 { margin: 44px 0 10px; font-size: 29px; letter-spacing: -.04em; }
.qx-recruit-role > p { margin: 0; min-height: 76px; color: var(--qx-muted); font-size: 12px; line-height: 1.7; }
.qx-recruit-role > div { margin-top: 28px; }
.qx-recruit-role > div b { color: var(--qx-deep); font-size: 11px; }
.qx-recruit-role ul { margin: 10px 0 0; padding: 0; list-style: none; }
.qx-recruit-role li { padding: 9px 0; border-top: 1px solid var(--qx-line); color: var(--qx-muted); font-size: 11px; }
.qx-recruit-role li::before { margin-right: 8px; color: var(--qx-orange); content: "↳"; }
.qx-recruit-role footer { align-self: end; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--qx-deep); color: var(--qx-ink); font-size: 11px; line-height: 1.65; }

.qx-recruit-process { display: grid; grid-template-columns: minmax(260px,.6fr) minmax(0,1fr); gap: 60px; padding: 84px 0; border-bottom: 1px solid var(--qx-line); }
.qx-recruit-process h2 { margin: 15px 0 0; font-size: 38px; line-height: 1.17; letter-spacing: -.045em; }
.qx-recruit-process ol { margin: 0; padding: 0; border-top: 1px solid var(--qx-deep); list-style: none; }
.qx-recruit-process li { display: grid; grid-template-columns: 38px minmax(130px,.45fr) 1fr; gap: 14px; padding: 17px 0; border-bottom: 1px solid var(--qx-line); }
.qx-recruit-process li b { color: var(--qx-orange); font: 700 9px "JetBrains Mono", monospace; }
.qx-recruit-process li span { font-size: 12px; font-weight: 800; }
.qx-recruit-process li small { color: var(--qx-muted); font-size: 11px; line-height: 1.55; }

.qx-application-shell { padding: 84px 0; border-bottom: 1px solid var(--qx-line); }
.qx-application-locked,
.qx-application-form { padding: clamp(28px,5vw,54px); border: 1px solid var(--qx-deep); background: linear-gradient(135deg, rgba(216,233,230,.72), rgba(247,246,243,.96) 58%); }
.qx-application-locked h2,
.qx-application-form h2 { margin: 16px 0 0; font-size: clamp(32px,4vw,50px); line-height: 1.12; letter-spacing: -.05em; }
.qx-application-locked p,
.qx-application-form > p { max-width: 720px; margin: 17px 0 0; color: var(--qx-muted); font-size: 12px; line-height: 1.75; }
.qx-application-locked button,
.qx-application-form footer button,
.qx-account-page button { min-height: 44px; margin-top: 24px; padding: 0 17px; border: 1px solid var(--qx-orange); border-radius: 2px; background: var(--qx-orange); color: #fff; font-size: 12px; font-weight: 800; }
.qx-application-form > header { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.qx-application-form > header > b { padding: 6px 9px; background: var(--qx-marrs); color: #fff; font-size: 10px; }
.qx-application-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 32px; }
.qx-application-fields label { display: grid; gap: 8px; }
.qx-application-fields label.is-wide { grid-column: 1 / -1; }
.qx-application-fields label > span { color: var(--qx-deep); font-size: 10px; font-weight: 800; }
.qx-application-fields :is(input, select, textarea) { box-sizing: border-box; width: 100%; min-height: 46px; padding: 12px 13px; border: 1px solid var(--qx-line); border-radius: 2px; background: #fffefa; color: var(--qx-ink); font: 12px/1.55 inherit; outline: none; }
.qx-application-fields textarea { min-height: 92px; resize: vertical; }
.qx-application-fields :is(input, select, textarea):focus { border-color: var(--qx-marrs); box-shadow: 0 0 0 3px rgba(0,140,140,.08); }
.qx-application-error { margin-top: 16px; padding: 10px 12px; border-left: 3px solid var(--qx-orange); background: rgba(243,112,33,.07); color: #9f3e0d; font-size: 11px; }
.qx-application-form footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 4px; }
.qx-application-form footer small { color: var(--qx-muted); font-size: 10px; line-height: 1.6; }
.qx-application-form footer button:disabled { opacity: .55; cursor: wait; }

.qx-recruit-boundary { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.7fr); gap: 60px; padding: 84px 0 0; }
.qx-recruit-boundary h2 { margin: 15px 0 0; font-size: 38px; line-height: 1.18; letter-spacing: -.045em; }
.qx-recruit-boundary ul { margin: 0; padding: 0; border-top: 1px solid var(--qx-deep); list-style: none; }
.qx-recruit-boundary li { padding: 15px 0; border-bottom: 1px solid var(--qx-line); color: var(--qx-muted); font-size: 11px; }
.qx-recruit-boundary li::before { margin-right: 8px; color: var(--qx-orange); content: "×"; }

.qx-account-page { width: min(100%, 1040px) !important; max-width: 1040px !important; }
.qx-account-hero { position: relative; padding: 40px 0 54px; border-bottom: 1px solid var(--qx-line); }
.qx-account-hero h1 { margin: 16px 0 0; font-size: clamp(38px,5vw,60px); line-height: 1.12; letter-spacing: -.055em; overflow-wrap: anywhere; }
.qx-account-hero p { margin: 15px 0 0; color: var(--qx-muted); font-size: 12px; line-height: 1.7; }
.qx-account-hero > button { position: absolute; right: 0; top: 34px; margin: 0; border-color: var(--qx-line); background: transparent; color: var(--qx-deep); }
.qx-account-hero.is-logged-out > button { position: static; }
.qx-account-card { margin-top: 22px; padding: 30px; border: 1px solid var(--qx-line); background: var(--qx-high); }
.qx-account-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-top: 22px; border: 1px solid var(--qx-line); background: var(--qx-line); }
.qx-account-grid .qx-account-card { min-width: 0; margin-top: 0; border: 0; }
.qx-account-grid .qx-account-card h2 { font-size: 22px; }
.qx-account-card > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.qx-account-card > header b { padding: 5px 8px; background: var(--qx-marrs); color: #fff; font-size: 9px; }
.qx-account-card h2 { margin: 26px 0 0; font-size: 26px; line-height: 1.3; letter-spacing: -.035em; }
.qx-account-card > p { margin: 10px 0 0; color: var(--qx-muted); font-size: 12px; line-height: 1.7; }
.qx-account-card > button { margin-top: 20px; }
.qx-account-card dl { display: flex; flex-wrap: wrap; gap: 26px; margin: 24px 0 0; padding-top: 15px; border-top: 1px solid var(--qx-line); }
.qx-account-card dl div { display: grid; gap: 4px; }
.qx-account-card dt { color: var(--qx-muted); font-size: 9px; }
.qx-account-card dd { margin: 0; color: var(--qx-deep); font-size: 11px; font-weight: 800; }
.qx-account-card.is-application { border-left: 3px solid var(--qx-marrs); }
.qx-account-card.is-membership { border-left: 3px solid var(--qx-orange); }
.qx-account-card.is-delivery { border-top: 3px solid var(--qx-marrs); }
.qx-account-card.is-library { border-top: 3px solid var(--qx-orange); }
.qx-account-card.is-collaboration { border-left: 3px solid var(--qx-marrs); }
.qx-account-utilities { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-top: 22px; border: 1px solid var(--qx-line); background: var(--qx-line); }
.qx-account-utilities article { padding: 27px; background: var(--qx-high); }
.qx-account-utilities article > span { color: var(--qx-marrs); font: 700 9px "JetBrains Mono", monospace; letter-spacing: .12em; }
.qx-account-utilities h3 { margin: 22px 0 0; font-size: 24px; letter-spacing: .04em; }
.qx-account-utilities p { min-height: 40px; margin: 10px 0 0; color: var(--qx-muted); font-size: 11px; line-height: 1.6; }
.qx-account-utilities button { margin-top: 16px; border-color: var(--qx-line); background: transparent; color: var(--qx-deep); }

@media (hover:hover) and (pointer:fine) {
  .qx-insight-card:hover,
  .qx-guide-card:hover,
  .qx-recruit-role:hover,
  .qx-account-card:hover { background-color: #fffefa; }
  .qx-content-bridge button:hover,
  .qx-account-page button:hover,
  .qx-application-shell button:hover { transform: translate(-2px,-2px); box-shadow: 4px 4px 0 var(--qx-ink); }
}

@media (max-width: 899px) {
  .qx-home-boundary { grid-template-columns: 1fr; gap: 14px; padding: 52px 0; }
  .qx-content-page { padding: 34px 16px 110px; }
  .qx-page-hero { grid-template-columns: 1fr; gap: 20px; padding: 20px 0 40px; }
  .qx-page-hero h1 { font-size: clamp(38px,11vw,52px); }
  .qx-editorial-note { grid-template-columns: 1fr; gap: 6px; margin: 20px 0 30px; }
  .qx-insight-grid { grid-template-columns: 1fr; }
  .qx-insight-card { padding: 24px 20px; }
  .qx-insight-card.is-featured { grid-template-columns: 1fr; gap: 17px; padding: 28px 22px; }
  .qx-insight-card h2 { margin-top: 30px; font-size: 24px; }
  .qx-insight-card.is-featured h2 { font-size: 36px; }
  .qx-content-bridge { align-items: stretch; flex-direction: column; margin-top: 46px; padding: 28px 22px; }
  .qx-content-bridge button { width: 100%; }
  .qx-guide-principle { grid-template-columns: 1fr; }
  .qx-guide-principle ol { grid-template-columns: repeat(2,1fr); }
  .qx-guide-card { grid-template-columns: 1fr; gap: 19px; padding: 28px 0; }
  .qx-guide-card > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
  .qx-guide-main h2 { font-size: 25px; }
  .qx-guide-card details { border-left: 0; border-top: 1px solid var(--qx-line); padding: 0; }
  .qx-guide-card summary { padding-top: 15px; }
  .qx-recruit-status { grid-template-columns: 1fr; gap: 7px; }
  .qx-recruit-role-grid { grid-template-columns: 1fr; margin-top: 30px; }
  .qx-recruit-role { min-height: 0; padding: 24px 20px; }
  .qx-recruit-role h2 { margin-top: 30px; }
  .qx-recruit-role > p { min-height: 0; }
  .qx-recruit-process,
  .qx-recruit-boundary { grid-template-columns: 1fr; gap: 30px; padding: 58px 0; }
  .qx-recruit-process li { grid-template-columns: 28px 1fr; }
  .qx-recruit-process li small { grid-column: 2; }
  .qx-application-shell { padding: 58px 0; }
  .qx-application-fields { grid-template-columns: 1fr; }
  .qx-application-fields label.is-wide { grid-column: 1; }
  .qx-application-form > header,
  .qx-application-form footer { align-items: stretch; flex-direction: column; }
  .qx-application-form footer button { width: 100%; margin-top: 0; }
  .qx-account-hero > button { position: static; }
  .qx-account-utilities { grid-template-columns: 1fr; }
  .qx-account-grid { grid-template-columns: 1fr; }
}

/* 16-qianx-intelligence.css */
/* QianX Intelligence Channel — editorial product layer */
:root {
  --qxi-paper: #f8f5ed;
  --qxi-paper-2: #fffdf7;
  --qxi-ink: #142826;
  --qxi-muted: #64726f;
  --qxi-teal: #075b55;
  --qxi-teal-bright: #008c82;
  --qxi-orange: #e76327;
  --qxi-line: rgba(20, 40, 38, .18);
  --qxi-serif: "Noto Serif SC", "Songti SC", STSong, SimSun, serif;
  --qxi-sans: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --qxi-mono: "JetBrains Mono", monospace;
}

/* 情报详情沿用深色阅读层，但不能继承浅色页面的深色文字变量。 */
#app.app-shell .ss-intel-sheet {
  --tb-ink: #f1f5f2;
  --tb-muted: #a8b4b0;
  --tb-line: rgba(218, 231, 226, .18);
  --tb-green: #55d5c9;
  --tb-orange: #ff7433;
  background: #091110;
  color: var(--tb-ink);
  color-scheme: dark;
}

#app.app-shell {
  --qx-cloud: var(--qxi-paper);
  --qx-high: var(--qxi-paper-2);
  --qx-ink: var(--qxi-ink);
  --qx-deep: var(--qxi-teal);
  --qx-marrs: var(--qxi-teal-bright);
  --qx-orange: var(--qxi-orange);
  --qx-muted: var(--qxi-muted);
  --qx-line: var(--qxi-line);
}
#app.app-shell .ss-header,
#app.app-shell .ss-tabbar,
#app.app-shell .ss-compliance-bar { background: rgba(248,245,237,.97) !important; }
#app.app-shell .ss-brand-name { font-family: "DM Serif Display", var(--qxi-serif) !important; font-size: 28px !important; font-weight: 400 !important; }
#app.app-shell .ss-brand-os { font-family: var(--qxi-serif) !important; letter-spacing: .04em !important; }
#app.app-shell .ss-header-join { border-color: var(--qxi-teal); background: var(--qxi-teal); }
#app.app-shell .ss-member-fab { border-color: var(--qxi-teal); background: var(--qxi-teal); }

.qx-intelligence-home,
.qx-intel-page {
  box-sizing: border-box;
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  margin: 0 auto;
  padding: 0 28px 118px;
  color: var(--qxi-ink);
}
.qx-intelligence-home button,
.qx-intel-page button { font-family: var(--qxi-sans); }

.qx-intelligence-hero {
  display: grid;
  min-height: 590px;
  grid-template-columns: minmax(0,.82fr) minmax(470px,1.18fr);
  align-items: center;
  gap: clamp(34px,6vw,88px);
  border-bottom: 1px solid var(--qxi-line);
}
.qx-intelligence-hero h1 {
  margin: 0;
  color: var(--qxi-ink);
  font: 900 clamp(52px,5vw,76px)/1.12 var(--qxi-serif);
  letter-spacing: -.055em;
}
.qx-intelligence-hero p { max-width: 580px; margin: 27px 0 0; color: var(--qxi-muted); font-size: 16px; line-height: 1.9; }
.qx-intel-primary { min-height: 48px; margin-top: 30px; padding: 0 24px; border: 1px solid var(--qxi-teal); border-radius: 0; background: var(--qxi-teal); color: #fff; font-weight: 800; }

.qx-trade-globe {
  position: relative;
  width: min(100%,550px);
  aspect-ratio: 1;
  justify-self: center;
  border: 1px solid rgba(7,91,85,.35);
  border-radius: 50%;
  background: repeating-radial-gradient(circle at 50% 50%, transparent 0 52px, rgba(7,91,85,.085) 53px 54px), radial-gradient(circle at 58% 53%, rgba(0,140,130,.11),transparent 54%);
}
.qx-trade-globe::before,
.qx-trade-globe::after { position: absolute; inset: 10% 0; border: 1px solid rgba(7,91,85,.22); border-radius: 50%; content: ""; transform: rotate(62deg); }
.qx-trade-globe::after { transform: rotate(-62deg); }
.qx-globe-lat { position: absolute; left: 4%; right: 4%; top: 49%; height: 22%; border-top: 1px solid rgba(7,91,85,.22); border-bottom: 1px solid rgba(7,91,85,.22); border-radius: 50%; }
.qx-globe-lon { position: absolute; left: 49%; top: 4%; bottom: 4%; width: 22%; border-left: 1px solid rgba(7,91,85,.22); border-right: 1px solid rgba(7,91,85,.22); border-radius: 50%; }
.qx-trade-globe span { position: absolute; z-index: 2; display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid var(--qxi-teal); border-radius: 50%; background: var(--qxi-paper-2); color: var(--qxi-teal); font: 700 10px var(--qxi-mono); }
.qx-trade-globe .is-cn { left: 63%; top: 52%; background: var(--qxi-teal); color: #fff; }
.qx-trade-globe .is-eu { left: 41%; top: 30%; }
.qx-trade-globe .is-us { left: 16%; top: 39%; }
.qx-trade-globe .is-me { left: 49%; top: 53%; }
.qx-trade-globe i { position: absolute; z-index: 1; height: 1px; background: repeating-linear-gradient(90deg,var(--qxi-teal) 0 5px,transparent 5px 9px); transform-origin: right center; }
.qx-trade-globe .route-a { left: 22%; top: 43%; width: 46%; transform: rotate(10deg); }
.qx-trade-globe .route-b { left: 44%; top: 35%; width: 26%; transform: rotate(48deg); }
.qx-trade-globe .route-c { left: 52%; top: 58%; width: 17%; transform: rotate(-10deg); }
.qx-trade-globe small { position: absolute; right: 3%; bottom: 14%; color: var(--qxi-teal); font: 9px var(--qxi-mono); letter-spacing: .12em; }

.qx-home-topline,
.qx-pillar-section,
.qx-depth-podcast,
.qx-guide-hot { padding: 58px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-home-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.qx-home-section-head h2 { margin: 0; color: var(--qxi-ink); font: 700 24px/1.2 var(--qxi-serif); }
.qx-home-section-head > span { color: var(--qxi-muted); font-size: 11px; }
.qx-home-section-head > button { padding: 0; border: 0; background: transparent; color: var(--qxi-teal); font-size: 11px; font-weight: 700; }
.qx-home-top-grid { display: grid; grid-template-columns: minmax(0,1.28fr) minmax(370px,.72fr); gap: 40px; }
.qx-home-feature { display: grid; grid-template-columns: minmax(210px,.42fr) minmax(0,.58fr); gap: 26px; }
.qx-feature-visual { position: relative; display: flex; min-height: 365px; align-items: flex-end; padding: 24px; overflow: hidden; background: linear-gradient(160deg,#f0a45d 0,#d26d35 33%,#0a5a58 34%,#083f3d 100%); color: #fff; font: 400 41px/1 "DM Serif Display",serif; }
.qx-feature-visual::before { position: absolute; inset: 30% -20% -34% 30%; border: 1px solid rgba(255,255,255,.6); border-radius: 50%; content: ""; box-shadow: 0 0 0 25px rgba(255,255,255,.07),0 0 0 56px rgba(255,255,255,.05); }
.qx-feature-visual i { position: absolute; right: 17px; top: 17px; font: 8px var(--qxi-mono); letter-spacing: .12em; }
.qx-feature-copy { display: flex; flex-direction: column; justify-content: center; }
.qx-feature-copy > span,
.qx-library-row small,
.qx-depth-block article > span { color: var(--qxi-teal-bright); font: 9px var(--qxi-mono); letter-spacing: .08em; }
.qx-feature-copy h3 { margin: 16px 0 13px; color: var(--qxi-ink); font: 700 clamp(25px,2.4vw,37px)/1.38 var(--qxi-serif); letter-spacing: -.035em; }
.qx-feature-copy p { margin: 0; color: var(--qxi-muted); font-size: 13px; line-height: 1.75; }
.qx-feature-copy > div { display: grid; gap: 6px; margin-top: 28px; color: var(--qxi-muted); font: 9px var(--qxi-mono); }
.qx-feature-copy > button { align-self: flex-start; margin-top: 22px; padding: 8px 0; border: 0; border-bottom: 1px solid var(--qxi-teal); background: transparent; color: var(--qxi-teal); font-size: 11px; font-weight: 800; }

.qx-signal-feed { border-top: 1px solid var(--qxi-line); }
.qx-signal-feed header { display: flex; align-items: center; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-signal-feed h2 { margin: 0; font: 700 21px var(--qxi-serif); }
.qx-signal-feed header button { border: 0; background: transparent; color: var(--qxi-teal); font-size: 10px; }
.qx-signal-feed ol { margin: 0; padding: 0; list-style: none; }
.qx-signal-feed li { position: relative; display: grid; grid-template-columns: 48px 68px 1fr; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-signal-feed li > span { align-self: start; padding: 2px 5px; border: 1px solid rgba(0,140,130,.35); color: var(--qxi-teal); font-size: 9px; text-align: center; }
.qx-signal-feed time { color: var(--qxi-muted); font: 9px var(--qxi-mono); }
.qx-signal-feed .qx-signal-open { display: grid; gap: 5px; min-width: 0; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.qx-signal-feed .qx-signal-open:hover b { color: var(--qxi-teal); }
.qx-signal-feed li b { color: var(--qxi-ink); font-size: 11px; font-weight: 600; line-height: 1.55; }
.qx-signal-feed li small { color: var(--qxi-muted); font-size: 9px; }
.qx-signal-feed li > i { position: absolute; right: 0; top: 11px; color: var(--qxi-orange); font-size: 9px; font-style: normal; }

.qx-pillar-grid { display: grid; grid-template-columns: repeat(5,1fr); border-top: 1px solid var(--qxi-line); border-bottom: 1px solid var(--qxi-line); }
.qx-pillar-grid button { min-width: 0; padding: 25px 20px; border: 0; border-right: 1px solid var(--qxi-line); background: transparent; color: inherit; text-align: left; }
.qx-pillar-grid button:last-child { border-right: 0; }
.qx-pillar-grid i { color: var(--qxi-teal); font: 400 28px var(--qxi-serif); font-style: normal; }
.qx-pillar-grid h3 { margin: 35px 0 10px; font: 700 17px var(--qxi-serif); }
.qx-pillar-grid p { min-height: 70px; margin: 0; color: var(--qxi-muted); font-size: 11px; line-height: 1.7; }
.qx-pillar-grid b { display: block; margin-top: 18px; color: var(--qxi-teal); font-size: 10px; }

.qx-depth-podcast { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.qx-depth-block article { display: grid; grid-template-columns: 150px 1fr; gap: 5px 20px; padding: 19px 0; border-top: 1px solid var(--qxi-line); }
.qx-depth-block article > span { grid-row: 1 / 5; }
.qx-depth-block h3 { margin: 0; font: 700 19px/1.5 var(--qxi-serif); }
.qx-depth-block p { margin: 7px 0; color: var(--qxi-muted); font-size: 11px; line-height: 1.65; }
.qx-depth-block article > div { display: flex; align-items: center; justify-content: space-between; }
.qx-depth-block small { color: var(--qxi-muted); font: 9px var(--qxi-mono); }
.qx-depth-block article button { border: 0; background: transparent; color: var(--qxi-teal); font-size: 10px; }
.qx-home-podcast > article { display: grid; grid-template-columns: 150px 1fr; gap: 25px; }
.qx-mini-cover { display: flex; aspect-ratio: 1; flex-direction: column; justify-content: center; padding: 20px; background: var(--qxi-teal); color: #fff; }
.qx-mini-cover b { font: 400 31px "DM Serif Display",serif; }
.qx-mini-cover span { margin-top: 5px; font: 9px var(--qxi-mono); letter-spacing: .12em; }
.qx-home-podcast article > div:last-child > span { color: var(--qxi-orange); font: 10px var(--qxi-mono); }
.qx-home-podcast h3 { margin: 9px 0; font: 700 20px/1.45 var(--qxi-serif); }
.qx-home-podcast p { margin: 0; color: var(--qxi-muted); font-size: 11px; line-height: 1.65; }
.qx-audio-player { display: block; width: 100%; height: 38px; margin-top: 17px; accent-color: var(--qxi-teal); color-scheme: light; }
.qx-transcript-link { display: inline-block; margin-top: 15px; color: var(--qxi-teal); font-size: 10px; font-weight: 700; text-decoration: none; }

.qx-guide-hot ol { display: grid; grid-template-columns: 1fr 1fr; gap: 0 50px; margin: 0; padding: 0; list-style: none; }
.qx-guide-hot li { display: grid; grid-template-columns: 28px 1fr; align-items: center; border-top: 1px solid var(--qxi-line); }
.qx-guide-hot li > span { color: var(--qxi-orange); font: 10px var(--qxi-mono); }
.qx-guide-hot li button { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 0; border: 0; background: transparent; color: inherit; text-align: left; }
.qx-guide-hot li b { font-size: 11px; }
.qx-guide-hot li small { color: var(--qxi-muted); font-size: 9px; }
.qx-subscribe-strip { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin: 0 -28px; padding: 30px 42px; background: var(--qxi-teal); color: #fff; }
.qx-subscribe-strip span { color: rgba(255,255,255,.7); font-size: 10px; }
.qx-subscribe-strip h2 { margin: 8px 0 0; font: 700 23px var(--qxi-serif); }
.qx-subscribe-strip button { min-height: 44px; padding: 0 22px; border: 1px solid rgba(255,255,255,.7); background: var(--qxi-paper); color: var(--qxi-teal); font-weight: 800; }
.qx-home-footer { display: flex; align-items: end; justify-content: space-between; gap: 30px; padding: 44px 0 0; }
.qx-home-footer > div b { color: var(--qxi-teal); font: 400 34px "DM Serif Display",serif; }
.qx-home-footer p { margin: 7px 0 0; color: var(--qxi-muted); font-size: 11px; }
.qx-home-footer nav { display: flex; flex-wrap: wrap; gap: 18px; }
.qx-home-footer nav button,.qx-home-footer nav a { padding: 0; border: 0; background: transparent; color: var(--qxi-muted); font-size: 10px; text-decoration: none; }

/* Channel pages */
.qx-intel-hero { display: grid; grid-template-columns: 1fr minmax(280px,.42fr); align-items: end; gap: 50px; padding: 72px 0 46px; border-bottom: 1px solid var(--qxi-line); }
.qx-intel-hero span { color: var(--qxi-teal-bright); font: 9px var(--qxi-mono); letter-spacing: .12em; }
.qx-intel-hero h1 { margin: 15px 0 0; font: 900 clamp(38px,4.5vw,62px)/1.18 var(--qxi-serif); letter-spacing: -.05em; }
.qx-intel-hero p { margin: 0; color: var(--qxi-muted); font-size: 13px; line-height: 1.8; }
.qx-intel-status { display: grid; grid-template-columns: repeat(3,1fr) auto; border-bottom: 1px solid var(--qxi-line); }
.qx-intel-status > div { display: grid; gap: 5px; padding: 18px; border-right: 1px solid var(--qxi-line); }
.qx-intel-status b { font-size: 11px; }
.qx-intel-status span { color: var(--qxi-muted); font-size: 9px; }
.qx-intel-status a { align-self: center; padding: 18px; color: var(--qxi-teal); font-size: 10px; text-decoration: none; }
.qx-library-tabs { display: flex; overflow-x: auto; gap: 26px; padding: 22px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-library-tabs button { flex: 0 0 auto; padding: 0; border: 0; background: transparent; color: var(--qxi-muted); font-size: 11px; }
.qx-library-tabs button:first-child { color: var(--qxi-teal); font-weight: 800; }
.qx-breaking-signals { padding: 44px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-breaking-signals header,.qx-library-list > header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 19px; }
.qx-breaking-signals h2,.qx-library-list > header h2 { margin: 0; font: 700 24px var(--qxi-serif); }
.qx-breaking-signals header span,.qx-library-list > header span { color: var(--qxi-muted); font-size: 10px; }
.qx-breaking-signals ol { margin: 0; padding: 0; border-top: 1px solid var(--qxi-line); list-style: none; }
.qx-breaking-signals li { display: grid; grid-template-columns: 55px 70px 1fr; gap: 15px; padding: 13px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-breaking-signals time,.qx-breaking-signals small { color: var(--qxi-muted); font: 9px var(--qxi-mono); }
.qx-breaking-signals li span { color: var(--qxi-teal); font-size: 10px; }
.qx-breaking-signals li b { font-size: 11px; font-weight: 600; }
.qx-breaking-signals li > button { display: grid; grid-template-columns: minmax(0,1fr) 90px; gap: 15px; min-width: 0; padding: 0; border: 0; background: transparent; color: var(--qxi-ink); text-align: left; cursor: pointer; }
.qx-breaking-signals li > button:hover b { color: var(--qxi-teal); }
.qx-library-list { padding: 48px 0; }
.qx-library-row { display: grid; grid-template-columns: 64px 1fr 62px; gap: 24px; padding: 27px 0; border-top: 1px solid var(--qxi-line); }
.qx-library-row > span { color: var(--qxi-orange); font: 700 20px var(--qxi-mono); }
.qx-library-row h2 { margin: 10px 0 8px; font: 700 24px/1.45 var(--qxi-serif); }
.qx-library-row p { max-width: 780px; margin: 0; color: var(--qxi-muted); font-size: 12px; line-height: 1.7; }
.qx-library-row > button { align-self: center; height: 62px; border: 1px solid var(--qxi-teal); border-radius: 50%; background: transparent; color: var(--qxi-teal); font-size: 10px; }

.qx-guide-method { display: grid; grid-template-columns: 220px 1fr; gap: 30px; padding: 27px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-guide-method > span { color: var(--qxi-teal); font-size: 11px; font-weight: 800; }
.qx-guide-method ol { display: grid; grid-template-columns: repeat(4,1fr); margin: 0; padding: 0; list-style: none; counter-reset: method; }
.qx-guide-method li { padding: 0 15px; border-left: 1px solid var(--qxi-line); color: var(--qxi-muted); font-size: 11px; }
.qx-action-guide-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; margin: 48px 0; border: 1px solid var(--qxi-line); background: var(--qxi-line); }
.qx-action-guide { padding: 28px; background: var(--qxi-paper); }
.qx-action-guide:nth-child(5) { grid-column: 1 / -1; }
.qx-action-guide header { display: flex; align-items: center; justify-content: space-between; }
.qx-action-guide header span { color: var(--qxi-orange); font: 700 23px var(--qxi-mono); }
.qx-action-guide header small { color: var(--qxi-muted); font-size: 9px; }
.qx-action-guide h2 { margin: 34px 0 10px; font: 700 23px var(--qxi-serif); }
.qx-action-guide > p { margin: 0; color: var(--qxi-muted); font-size: 12px; line-height: 1.7; }
.qx-action-guide details { margin-top: 26px; border-top: 1px solid var(--qxi-line); }
.qx-action-guide summary { display: flex; justify-content: space-between; padding: 15px 0 0; color: var(--qxi-teal); font-size: 11px; font-weight: 800; cursor: pointer; list-style: none; }
.qx-action-guide details ol { margin: 17px 0 0; padding: 0; list-style: none; }
.qx-action-guide details li { display: grid; grid-template-columns: 30px 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--qxi-line); }
.qx-action-guide details li b { color: var(--qxi-orange); font: 9px var(--qxi-mono); }
.qx-action-guide details li span { color: var(--qxi-muted); font-size: 11px; }
.qx-guide-cta,.qx-rss-strip { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 30px; background: var(--qxi-teal); color: #fff; }
.qx-guide-cta span,.qx-rss-strip span { color: rgba(255,255,255,.65); font: 9px var(--qxi-mono); letter-spacing: .1em; }
.qx-guide-cta h2,.qx-rss-strip h2 { margin: 8px 0 0; font: 700 21px var(--qxi-serif); }
.qx-guide-cta button,.qx-rss-strip a { padding: 12px 18px; border: 1px solid rgba(255,255,255,.65); background: transparent; color: #fff; font-size: 10px; font-weight: 800; text-decoration: none; }

.qx-podcast-feature { padding: 48px 0; border-bottom: 1px solid var(--qxi-line); }
.qx-podcast-card { display: grid; grid-template-columns: 170px 1fr; gap: 30px; padding: 28px 0; border-top: 1px solid var(--qxi-line); }
.qx-podcast-card.is-featured { grid-template-columns: 290px 1fr; border-top: 0; }
.qx-podcast-cover { display: flex; aspect-ratio: 1; flex-direction: column; justify-content: center; padding: 25px; background: var(--qxi-teal); color: #fff; }
.qx-podcast-cover span { font: 400 42px "DM Serif Display",serif; }
.qx-podcast-cover b { margin-top: 8px; font: 9px var(--qxi-mono); letter-spacing: .12em; }
.qx-podcast-cover i { margin-top: auto; color: #e9a77e; font: 700 24px var(--qxi-mono); font-style: normal; }
.qx-podcast-copy { align-self: center; }
.qx-podcast-copy > span { color: var(--qxi-orange); font: 9px var(--qxi-mono); }
.qx-podcast-copy h2 { margin: 13px 0 12px; font: 700 clamp(23px,2.8vw,38px)/1.42 var(--qxi-serif); }
.qx-podcast-copy p { max-width: 680px; margin: 0; color: var(--qxi-muted); font-size: 12px; line-height: 1.75; }
.qx-podcast-links { display: flex; justify-content: space-between; margin-top: 19px; }
.qx-podcast-links a { color: var(--qxi-teal); font-size: 10px; font-weight: 700; text-decoration: none; }
.qx-podcast-links span { color: var(--qxi-muted); font-size: 9px; }
.qx-podcast-list { padding-bottom: 48px; }

/* Paid-member handoff: enlarge the QR itself instead of shrinking the full portrait card. */
.qx-wecom-delivery { display: grid; justify-items: center; gap: 10px; text-align: center; }
.qx-wecom-delivery-copy { max-width: 280px; color: rgba(255,255,255,.72); font-size: 13px; line-height: 1.6; }
.qx-wecom-contact { display: grid; gap: 2px; }
.qx-wecom-contact b { color: #fff; font: 700 17px var(--qxi-serif); }
.qx-wecom-contact span,.qx-wecom-scan-hint { color: rgba(255,255,255,.58); font-size: 11px; }
.qx-wecom-qr-frame { width: min(224px,calc(100vw - 116px)); aspect-ratio: 1; padding: 8px; border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(0,0,0,.16); line-height: 0; }
.qx-wecom-qr-crop { position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: 11px; background: #fff; }
.qx-wecom-qr { position: absolute; left: -195%; top: -372.5%; display: block; width: 318%; max-width: none; height: auto; }
.qx-wecom-channel { color: #35aaa2; font: 9px var(--qxi-mono); letter-spacing: .06em; }

@media (hover:hover) and (pointer:fine) {
  .qx-intel-primary:hover,.qx-subscribe-strip button:hover { transform: translate(-2px,-2px); box-shadow: 4px 4px 0 var(--qxi-ink); }
  .qx-pillar-grid button:hover,.qx-action-guide:hover { background: var(--qxi-paper-2); }
  .qx-library-row:hover h2,.qx-guide-hot li:hover b { color: var(--qxi-teal); }
}

@media (max-width: 899px) {
  .qx-intelligence-home,.qx-intel-page { padding: 0 16px 96px; }
  .qx-intelligence-hero { min-height: 0; grid-template-columns: 1fr; gap: 38px; padding: 48px 0; }
  .qx-intelligence-hero h1 { font-size: clamp(43px,12vw,59px); }
  .qx-intelligence-hero p { font-size: 14px; }
  .qx-trade-globe { width: min(86vw,430px); }
  .qx-home-top-grid,.qx-depth-podcast { grid-template-columns: 1fr; }
  .qx-home-feature { grid-template-columns: 1fr; }
  .qx-feature-visual { min-height: 290px; }
  .qx-signal-feed { margin-top: 12px; }
  .qx-pillar-grid { grid-template-columns: 1fr; }
  .qx-pillar-grid button { display: grid; grid-template-columns: 42px 1fr; gap: 5px 12px; padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--qxi-line); }
  .qx-pillar-grid h3 { margin: 0; }
  .qx-pillar-grid p,.qx-pillar-grid b { grid-column: 2; min-height: 0; margin-top: 5px; }
  .qx-depth-block article { grid-template-columns: 1fr; }
  .qx-depth-block article > span { grid-row: auto; }
  .qx-home-podcast > article { grid-template-columns: 115px 1fr; }
  .qx-guide-hot ol { grid-template-columns: 1fr; }
  .qx-subscribe-strip { align-items: stretch; flex-direction: column; margin: 0 -16px; padding: 27px 20px; }
  .qx-home-footer { align-items: flex-start; flex-direction: column; }
  .qx-intel-hero { grid-template-columns: 1fr; gap: 22px; padding-top: 48px; }
  .qx-intel-status { grid-template-columns: 1fr 1fr; }
  .qx-intel-status a { border-top: 1px solid var(--qxi-line); }
  .qx-breaking-signals li { grid-template-columns: 46px 62px 1fr; }
  .qx-breaking-signals li > button { grid-template-columns: 1fr; }
  .qx-breaking-signals small { display: none; }
  .qx-library-row { grid-template-columns: 38px 1fr; gap: 12px; }
  .qx-library-row > button { grid-column: 2; width: 100%; height: 38px; border-radius: 0; }
  .qx-guide-method { grid-template-columns: 1fr; }
  .qx-guide-method ol { grid-template-columns: 1fr 1fr; gap: 15px 0; }
  .qx-action-guide-grid { grid-template-columns: 1fr; }
  .qx-action-guide:nth-child(5) { grid-column: 1; }
  .qx-guide-cta,.qx-rss-strip { align-items: stretch; flex-direction: column; }
  .qx-podcast-card,.qx-podcast-card.is-featured { grid-template-columns: 105px 1fr; gap: 18px; }
  .qx-podcast-card.is-featured { grid-template-columns: 1fr; }
  .qx-podcast-card.is-featured .qx-podcast-cover { width: min(70vw,280px); }
  .qx-podcast-cover { padding: 14px; }
  .qx-podcast-cover span { font-size: 26px; }
  .qx-podcast-copy h2 { font-size: 20px; }
  .qx-podcast-links span { display: none; }
}

/* 17-qianx-visual-system.css */
/**
 * QianX.ai product visual system
 * Implementation layer aligned with docs/design/qianx-design-tokens.css.
 * Product content and information architecture remain independent from the
 * strategic-canvas prototype; this file owns the live visual language only.
 */
:root {
  --qx-color-marrs: #008c8c;
  --qx-color-orange: #f37021;
  --qx-color-cloud: #f0efeb;
  --qx-color-marrs-deep: #005f5f;
  --qx-color-ink: #002f2f;
  --qx-color-night: #001414;
  --qx-color-marrs-mid: #4ba9a5;
  --qx-color-marrs-soft: #d8e9e6;
  --qx-color-orange-soft: #f8d8c6;
  --qx-color-cloud-high: #f7f6f3;
  --qx-color-cloud-low: #dedbd4;
  --qx-color-text-muted: #5f706d;
  --qx-color-line: rgb(0 95 95 / 22%);

  /* Semantic roles from the QianX VIS source of truth. */
  --qx-surface-page: var(--qx-color-cloud);
  --qx-surface-raised: var(--qx-color-cloud-high);
  --qx-surface-brand: var(--qx-color-marrs);
  --qx-surface-confirmed: var(--qx-color-marrs-deep);
  --qx-text-primary: var(--qx-color-ink);
  --qx-text-secondary: var(--qx-color-text-muted);
  --qx-text-on-brand: var(--qx-color-cloud);
  --qx-action-primary: var(--qx-color-orange);
  --qx-action-secondary: var(--qx-color-marrs);
  --qx-focus-ring: var(--qx-color-orange);
  --qx-state-idle: var(--qx-color-cloud-high);
  --qx-state-progress: var(--qx-color-marrs);
  --qx-state-confirmed: var(--qx-color-marrs-deep);
  --qx-state-action: var(--qx-color-orange);

  --qx-font-sans: "Inter", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  --qx-font-mono: "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, monospace;
  --qx-type-display: clamp(3.5rem, 7vw, 7.25rem);
  --qx-type-h1: clamp(2.75rem, 5vw, 4.5rem);
  --qx-type-h2: clamp(2rem, 3.2vw, 3rem);
  --qx-type-lead: 1.125rem;
  --qx-type-body: .875rem;
  --qx-type-label: .625rem;
  --qx-leading-display: .95;
  --qx-leading-body: 1.7;
  --qx-tracking-display: -.065em;
  --qx-tracking-label: .1em;

  --qx-space-1: .5rem;
  --qx-space-2: 1rem;
  --qx-space-3: 1.5rem;
  --qx-space-4: 2rem;
  --qx-space-6: 3rem;
  --qx-space-8: 4rem;
  --qx-space-12: 6rem;

  --qx-radius-control: .5rem;
  --qx-radius-container: .875rem;
  --qx-border-structure: 1px solid var(--qx-color-line);
  --qx-shadow-raised: 0 20px 55px rgb(0 47 47 / 9%);
  --qx-touch-target: 2.75rem;
  --qx-page-max: 92.5rem;
  --qx-motion-control: 160ms;
  --qx-motion-state: 240ms;
  --qx-motion-route: 480ms;
  --qx-ease-standard: cubic-bezier(.2,.8,.2,1);

  /* Compatibility aliases for the existing view layer. */
  --qx-marrs: var(--qx-color-marrs);
  --qx-deep: var(--qx-color-marrs-deep);
  --qx-ink: var(--qx-color-ink);
  --qx-night: var(--qx-color-night);
  --qx-orange: var(--qx-color-orange);
  --qx-cloud: var(--qx-color-cloud);
  --qx-high: var(--qx-color-cloud-high);
  --qx-soft: var(--qx-color-marrs-soft);
  --qx-muted: var(--qx-color-text-muted);
  --qx-line: var(--qx-color-line);
  --qxi-paper: var(--qx-color-cloud);
  --qxi-paper-2: var(--qx-color-cloud-high);
  --qxi-ink: var(--qx-color-ink);
  --qxi-muted: var(--qx-color-text-muted);
  --qxi-teal: var(--qx-color-marrs-deep);
  --qxi-teal-bright: var(--qx-color-marrs);
  --qxi-orange: var(--qx-color-orange);
  --qxi-line: var(--qx-color-line);
  --qxi-serif: var(--qx-font-sans);
  --qxi-sans: var(--qx-font-sans);
  --qxi-mono: var(--qx-font-mono);
}

html,
body,
.site,
.phone-shell,
#app.app-shell { background: var(--qx-color-cloud) !important; color: var(--qx-color-ink) !important; }

body,
button,
input,
textarea,
select { font-family: var(--qx-font-sans) !important; }

#app.app-shell {
  --bg: var(--qx-color-cloud);
  --panel: var(--qx-color-cloud-high);
  --panel2: var(--qx-color-marrs-soft);
  --panelHi: #fffefa;
  --line: rgb(0 95 95 / 14%);
  --line2: var(--qx-color-line);
  --ink: var(--qx-color-ink);
  --ink2: rgb(0 47 47 / 69%);
  --ink3: rgb(0 47 47 / 46%);
  --copper: var(--qx-color-orange);
  --cyan: var(--qx-color-marrs);
  --teal: var(--qx-color-marrs);
  --cardshadow: 0 20px 55px rgb(0 47 47 / 9%);
  font-family: var(--qx-font-sans) !important;
}

#app.app-shell::before {
  background-image: linear-gradient(rgb(0 95 95 / 3%) 1px,transparent 1px),linear-gradient(90deg,rgb(0 95 95 / 3%) 1px,transparent 1px) !important;
  background-size: 64px 64px !important;
  opacity: .64 !important;
}

#app.app-shell::after { display: none !important; }

/* One compact product header on desktop. */
#app.app-shell .ss-header {
  min-height: 70px;
  height: 70px;
  padding: 0 max(28px,calc((100% - var(--qx-page-max))/2));
  border-bottom: 1px solid var(--qx-color-line) !important;
  background: rgb(240 239 235 / 94%) !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
  box-shadow: none !important;
}

#app.app-shell .ss-brand {
  display: inline-flex;
  width: 116px;
  min-width: 116px;
  height: 52px;
  align-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
}

#app.app-shell .ss-brand-lockup { display: block; width: 116px; height: auto; }
#app.app-shell .ss-desktop-nav { display: flex; height: 100%; align-items: stretch; justify-content: center; gap: 4px; margin-left: clamp(24px,5vw,82px); }
#app.app-shell .ss-desktop-nav-item {
  position: relative;
  min-width: 64px;
  min-height: var(--qx-touch-target);
  padding: 0 16px;
  border: 0;
  background: transparent;
  color: var(--qx-color-text-muted);
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
}
#app.app-shell .ss-desktop-nav-item::after {
  position: absolute;
  right: 16px;
  bottom: 0;
  left: 16px;
  height: 2px;
  background: transparent;
  content: "";
}
#app.app-shell .ss-desktop-nav-item.active { color: var(--qx-color-marrs-deep); }
#app.app-shell .ss-desktop-nav-item.active::after { background: var(--qx-color-marrs); }
#app.app-shell .ss-header-actions { margin-left: auto; gap: 8px; }
#app.app-shell .ss-site-switch {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 0 10px;
  color: var(--qx-color-text-muted);
  font: 700 10px/1 var(--qx-font-mono);
  letter-spacing: .06em;
  text-decoration: none;
}
#app.app-shell .ss-site-switch:hover { color: var(--qx-color-marrs-deep); }
#app.app-shell .ss-login-btn,
#app.app-shell .ss-header-join {
  min-height: var(--qx-touch-target);
  height: var(--qx-touch-target);
  border-radius: var(--qx-radius-control) !important;
  font-size: 12px;
  font-weight: 750;
}
#app.app-shell .ss-login-btn { padding: 0 14px; color: var(--qx-color-marrs-deep) !important; }
#app.app-shell .ss-header-join {
  padding: 0 18px;
  border: 1px solid var(--qx-color-orange) !important;
  background: var(--qx-color-orange) !important;
  color: var(--qx-color-ink) !important;
}
#app.app-shell > .ss-tabbar { display: none; }
#app.app-shell .ss-member-fab {
  min-height: var(--qx-touch-target);
  border-color: var(--qx-color-orange) !important;
  border-radius: var(--qx-radius-control) !important;
  background: var(--qx-color-orange) !important;
  color: var(--qx-color-ink) !important;
}

/* Editorial information channel: open grids, evidence rails, no decorative serif. */
.qx-intelligence-home,
.qx-intel-page,
.qx-content-page {
  width: min(100%,var(--qx-page-max)) !important;
  max-width: var(--qx-page-max) !important;
  color: var(--qx-color-ink) !important;
}

.qx-intelligence-home :is(h1,h2,h3),
.qx-intel-page :is(h1,h2,h3),
.qx-content-page :is(h1,h2,h3),
#app.app-shell[data-page="membership"] .ss-membership :is(h1,h2,h3) {
  font-family: var(--qx-font-sans) !important;
  text-wrap: balance;
}

.qx-intelligence-hero {
  min-height: 620px;
  grid-template-columns: minmax(0,.9fr) minmax(430px,1.1fr);
  gap: clamp(48px,7vw,112px);
  border-color: var(--qx-color-line);
}

.qx-intelligence-hero h1 {
  max-width: 760px;
  font-family: var(--qx-font-sans) !important;
  font-size: clamp(56px,5.45vw,86px) !important;
  font-weight: 850 !important;
  line-height: .99 !important;
  letter-spacing: -.068em !important;
}
.qx-intelligence-hero p { max-width: 590px; font-size: 16px; line-height: 1.82; }
.qx-intel-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.qx-intel-actions .qx-intel-primary { margin-top: 0; }
.qx-intel-primary {
  min-height: 48px;
  border-color: var(--qx-color-orange) !important;
  border-radius: var(--qx-radius-control) !important;
  background: var(--qx-color-orange) !important;
  color: var(--qx-color-ink) !important;
}
.qx-intel-secondary {
  min-height: 48px;
  padding: 0 18px;
  border: 1px solid var(--qx-color-marrs-deep);
  border-radius: var(--qx-radius-control);
  background: transparent;
  color: var(--qx-color-marrs-deep);
  font-size: 13px;
  font-weight: 760;
}
.qx-hero-delivery {
  display: grid;
  grid-template-columns: 1.18fr repeat(3,minmax(0,1fr));
  max-width: 660px;
  margin-top: 28px;
  border-top: 1px solid var(--qx-color-line);
  border-bottom: 1px solid var(--qx-color-line);
}
.qx-hero-delivery :is(small,span) { min-width: 0; padding: 12px 10px; border-right: 1px solid var(--qx-color-line); }
.qx-hero-delivery :is(small,span):last-child { border-right: 0; }
.qx-hero-delivery small { padding-left: 0; color: var(--qx-color-marrs-deep); font: 700 10px/1.4 var(--qx-font-mono); letter-spacing: .05em; }
.qx-hero-delivery span { color: var(--qx-color-text-muted); font-size: 11px; font-weight: 650; line-height: 1.4; }
.qx-hero-delivery span b { display: block; margin-bottom: 3px; color: var(--qx-color-orange); font: 700 9px/1 var(--qx-font-mono); }

.qx-trade-globe {
  position: relative;
  width: min(100%,590px);
  aspect-ratio: 1;
  justify-self: center;
  overflow: hidden;
  border: 0;
  background: transparent;
  isolation: isolate;
}
.qx-trade-globe::before,
.qx-trade-globe::after { display: none; }
.qx-earth-canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  filter: drop-shadow(0 24px 28px rgb(0 47 47 / 18%));
}
.qx-earth-fallback {
  position: absolute;
  inset: 13%;
  z-index: 1;
  border-radius: 50%;
  background-color: #073d47;
  background-image: linear-gradient(105deg,transparent 0 43%,rgb(0 20 25 / 20%) 58%,rgb(0 13 18 / 72%) 100%),url("../assets/visuals/nasa-blue-marble-2048.png");
  background-position: 54% center;
  background-size: auto 100%;
  box-shadow: inset 18px 10px 36px rgb(197 244 239 / 16%),inset -52px -22px 64px rgb(0 13 18 / 52%),0 28px 65px rgb(0 47 47 / 20%);
  opacity: 1;
  transition: opacity 420ms ease;
  pointer-events: none;
}
.qx-earth-stage[data-earth-ready="true"] .qx-earth-fallback { opacity: 0; }
.qx-trade-globe > small {
  position: absolute;
  right: 4%;
  bottom: 7%;
  z-index: 3;
  padding: 6px 8px;
  border-left: 2px solid var(--qx-color-orange);
  background: rgb(240 239 235 / 88%);
  backdrop-filter: blur(8px);
  color: var(--qx-color-marrs-deep);
  font: 700 8px/1.3 var(--qx-font-mono);
  letter-spacing: .12em;
}

.qx-home-section-head h2,
.qx-signal-feed h2,
.qx-breaking-signals h2,
.qx-library-list > header h2 { font-weight: 800 !important; letter-spacing: -.035em; }

.qx-feature-visual {
  isolation: isolate;
  border-radius: var(--qx-radius-container);
  background: var(--qx-color-marrs-deep) !important;
  font-family: var(--qx-font-sans) !important;
  font-weight: 800 !important;
  letter-spacing: -.06em;
}
.qx-feature-visual::before {
  inset: auto -10% -34% 24%;
  width: 90%;
  aspect-ratio: 1;
  border-color: rgb(240 239 235 / 54%);
  box-shadow: 0 0 0 32px rgb(240 239 235 / 6%),0 0 0 68px rgb(240 239 235 / 4%);
}
.qx-feature-visual::after {
  position: absolute;
  right: 19%;
  bottom: 26%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--qx-color-orange);
  box-shadow: 0 0 0 8px rgb(243 112 33 / 16%);
  content: "";
}
.qx-feature-copy h3,
.qx-depth-block h3,
.qx-library-row h2,
.qx-action-guide h2,
.qx-podcast-copy h2,
.qx-guide-cta h2,
.qx-rss-strip h2,
.qx-subscribe-strip h2 { font-family: var(--qx-font-sans) !important; font-weight: 780 !important; }

.qx-pillar-grid,
.qx-action-guide-grid { border-color: var(--qx-color-line); background: var(--qx-color-line); }
.qx-pillar-grid button,
.qx-action-guide { background: var(--qx-color-cloud); }
.qx-pillar-grid i,
.qx-podcast-cover span { font-family: var(--qx-font-sans) !important; font-weight: 780 !important; }

.qx-subscribe-strip,
.qx-guide-cta,
.qx-rss-strip,
.qx-podcast-cover,
.qx-mini-cover {
  border-radius: var(--qx-radius-container);
  background: var(--qx-color-marrs-deep) !important;
}
.qx-subscribe-strip button {
  min-height: var(--qx-touch-target);
  border-color: var(--qx-color-orange) !important;
  border-radius: var(--qx-radius-control);
  background: var(--qx-color-orange) !important;
  color: var(--qx-color-ink) !important;
}
.qx-guide-cta button,
.qx-rss-strip a { min-height: var(--qx-touch-target); border-radius: var(--qx-radius-control); }
.qx-home-footer > div b { color: var(--qx-color-marrs-deep); font-family: var(--qx-font-sans) !important; font-weight: 820 !important; letter-spacing: -.05em; }

.qx-intel-hero h1 {
  font-family: var(--qx-font-sans) !important;
  font-size: var(--qx-type-h1) !important;
  font-weight: 840 !important;
  line-height: 1.02 !important;
  letter-spacing: -.062em !important;
}
.qx-intel-hero > span,
.qx-feature-copy > span,
.qx-library-row small,
.qx-depth-block article > span { font-family: var(--qx-font-mono) !important; }
.qx-library-row > button { border-radius: var(--qx-radius-control); }
.qx-action-guide-grid { border-radius: var(--qx-radius-container); overflow: hidden; }

/* QianX Circle — restored Agent friends feed in the same editorial system. */
#app.app-shell[data-page="circle"] {
  --tb-black: var(--qx-color-cloud);
  --tb-panel: var(--qx-color-cloud-high);
  --tb-ink: var(--qx-color-ink);
  --tb-muted: var(--qx-color-text-muted);
  --tb-orange: var(--qx-color-orange);
  --tb-green: var(--qx-color-marrs);
  --tb-line: var(--qx-color-line);
}
#app.app-shell[data-page="circle"] .ss-scroll { background: var(--qx-color-cloud) !important; }
#app.app-shell[data-page="circle"] .ss-circle-page {
  box-sizing: border-box;
  width: min(100%,1020px);
  max-width: 1020px;
  padding: 56px 38px 120px;
  color: var(--qx-color-ink);
}
#app.app-shell[data-page="circle"] .ss-circle-hero {
  padding: 0 0 42px;
  overflow: visible;
  border: 0;
  border-bottom: 1px solid var(--qx-color-line);
  border-radius: 0;
  background: transparent;
}
#app.app-shell[data-page="circle"] .ss-circle-hero::after {
  top: -28px;
  right: 12px;
  width: 180px;
  height: 180px;
  border-color: rgb(0 140 140 / 22%);
  box-shadow: 0 0 0 30px rgb(0 140 140 / 4%),0 0 0 62px rgb(0 140 140 / 2%);
}
#app.app-shell[data-page="circle"] .ss-circle-kicker { color: var(--qx-color-marrs); font-family: var(--qx-font-mono); }
#app.app-shell[data-page="circle"] .ss-circle-hero h1 {
  max-width: 760px;
  margin: 18px 0 14px;
  color: var(--qx-color-ink);
  font-family: var(--qx-font-sans);
  font-size: clamp(38px,4.4vw,62px);
  font-weight: 840;
  line-height: 1.05;
  letter-spacing: -.062em;
}
#app.app-shell[data-page="circle"] .ss-circle-hero h1 em { color: var(--qx-color-marrs-deep); font-family: var(--qx-font-sans); }
#app.app-shell[data-page="circle"] .ss-circle-hero p,
#app.app-shell[data-page="circle"] .ss-circle-legend { color: var(--qx-color-text-muted); }

#app.app-shell[data-page="circle"] .ss-circle-metrics {
  margin: 18px 0 22px;
  border-color: var(--qx-color-line);
  border-radius: var(--qx-radius-container);
  overflow: hidden;
  background: var(--qx-color-line);
}
#app.app-shell[data-page="circle"] .ss-circle-metrics > div { background: var(--qx-color-cloud-high); }
#app.app-shell[data-page="circle"] .ss-circle-metrics > small,
#app.app-shell[data-page="circle"] .ss-circle-post time,
#app.app-shell[data-page="circle"] .ss-circle-actions span { color: rgb(0 47 47 / 44%); }

#app.app-shell[data-page="circle"] :is(.ss-circle-compose,.ss-circle-compose-open,.ss-circle-post,.ss-circle-empty) {
  border-color: var(--qx-color-line);
  border-radius: var(--qx-radius-container);
  background: var(--qx-color-cloud-high);
  color: var(--qx-color-ink);
  box-shadow: none;
}
#app.app-shell[data-page="circle"] :is(.ss-circle-compose-open textarea,.ss-circle-reference-fields input,.ss-circle-reply-box input) {
  border-color: var(--qx-color-line);
  border-radius: var(--qx-radius-control);
  background: #fffefa;
  color: var(--qx-color-ink);
}
#app.app-shell[data-page="circle"] :is(.ss-circle-business-tags,.ss-circle-topic-zone,.ss-circle-tabs) {
  border-color: var(--qx-color-line);
  border-radius: var(--qx-radius-container);
  background: var(--qx-color-marrs-soft);
}
#app.app-shell[data-page="circle"] .ss-circle-topic-zone { background: rgb(216 233 230 / 58%); }
#app.app-shell[data-page="circle"] .ss-circle-topic-zone > header button {
  border-color: rgb(0 140 140 / 38%);
  background: rgb(0 140 140 / 7%);
  color: var(--qx-color-marrs-deep);
}
#app.app-shell[data-page="circle"] .ss-circle-topic-tabs button {
  border-color: var(--qx-color-line);
  border-radius: var(--qx-radius-control);
  background: var(--qx-color-cloud-high);
  color: var(--qx-color-text-muted);
}
#app.app-shell[data-page="circle"] :is(.ss-circle-topic-tabs button.is-active,.ss-circle-tabs button.is-active) {
  border-color: var(--qx-color-marrs);
  background: var(--qx-color-marrs);
  color: #fff;
}
#app.app-shell[data-page="circle"] .ss-circle-featured {
  border-color: rgb(243 112 33 / 42%);
  border-radius: var(--qx-radius-container);
  background: linear-gradient(135deg,rgb(243 112 33 / 7%),transparent 58%),var(--qx-color-cloud-high);
}
#app.app-shell[data-page="circle"] .ss-circle-featured > header button,
#app.app-shell[data-page="circle"] .ss-circle-new-notice button {
  color: var(--qx-color-marrs-deep);
}
#app.app-shell[data-page="circle"] .ss-circle-new-notice {
  border-color: var(--qx-color-line);
  border-radius: var(--qx-radius-control);
  background: var(--qx-color-marrs-soft);
  color: var(--qx-color-marrs-deep);
}
#app.app-shell[data-page="circle"] .ss-circle-post.is-ai {
  border-left: 2px solid var(--qx-color-orange);
  background: linear-gradient(122deg,rgb(243 112 33 / 5.5%),transparent 38%),var(--qx-color-cloud-high);
}
#app.app-shell[data-page="circle"] .ss-circle-post.is-human { border-left: 2px solid var(--qx-color-marrs); }
#app.app-shell[data-page="circle"] .ss-circle-avatar { background: var(--qx-color-marrs-soft); color: var(--qx-color-ink); }
#app.app-shell[data-page="circle"] .ss-circle-avatar.is-ai { border-color: rgb(243 112 33 / 42%); background: var(--qx-color-orange-soft); color: #78330f; }
#app.app-shell[data-page="circle"] .ss-circle-identity.is-human { border-color: rgb(0 140 140 / 42%); background: rgb(0 140 140 / 7%); color: var(--qx-color-marrs-deep); }
#app.app-shell[data-page="circle"] .ss-circle-identity.is-ai,
#app.app-shell[data-page="circle"] .ss-circle-persona-boundary span { color: #a84512; }
#app.app-shell[data-page="circle"] .ss-circle-persona-boundary b { color: rgb(0 47 47 / 82%); }
#app.app-shell[data-page="circle"] .ss-circle-reference-card,
#app.app-shell[data-page="circle"] .ss-circle-reference { background: rgb(0 140 140 / 4%); }
#app.app-shell[data-page="circle"] .ss-circle-comments { background: var(--qx-color-marrs-soft); }
#app.app-shell[data-page="circle"] .ss-circle-actions { border-color: var(--qx-color-line); }
#app.app-shell[data-page="circle"] .ss-circle-actions button:hover,
#app.app-shell[data-page="circle"] .ss-circle-actions button.is-active { color: #a84512; }
#app.app-shell[data-page="circle"] .ss-circle-live { padding: 0 2px; }

/* Account and membership share the same product surfaces. */
.qx-account-card,
.qx-account-utilities article,
#app.app-shell[data-page="membership"] :is(.ss-membership-run,.ss-membership-offer,.ss-membership-choice > *, .ss-membership-value > div,.ss-membership-included > *) {
  border-radius: var(--qx-radius-container) !important;
}
#app.app-shell[data-page="membership"] .ss-membership-offer { overflow: hidden; }
#app.app-shell[data-page="membership"] button { border-radius: var(--qx-radius-control) !important; }
#app.app-shell[data-page="membership"] .ss-membership-preview {
  scroll-margin-top: 88px;
  margin-top: 24px;
  padding: clamp(22px,3vw,36px);
  border: 1px solid var(--qx-color-line);
  border-radius: var(--qx-radius-container);
  background: var(--qx-color-cloud-high);
}
#app.app-shell[data-page="membership"] .ss-membership-preview > header { display: flex; justify-content: space-between; gap: 28px; align-items: end; padding-bottom: 20px; border-bottom: 1px solid var(--qx-color-line); }
#app.app-shell[data-page="membership"] .ss-membership-preview > header h2 { max-width: 720px; margin: 10px 0 0; color: var(--qx-color-ink); font-size: clamp(26px,3vw,42px); line-height: 1.08; letter-spacing: -.052em; }
#app.app-shell[data-page="membership"] .ss-membership-preview > header p { max-width: 250px; margin: 0; color: var(--qx-color-text-muted); font-size: 12px; line-height: 1.65; }
#app.app-shell[data-page="membership"] .ss-preview-builder { display: grid; grid-template-columns: minmax(0,.9fr) minmax(360px,1.1fr); gap: clamp(28px,4vw,58px); padding: 28px 0; }
#app.app-shell[data-page="membership"] .ss-preview-choices { display: grid; gap: 20px; }
#app.app-shell[data-page="membership"] .ss-preview-choices > div > b { display: block; margin-bottom: 9px; color: var(--qx-color-ink); font-size: 12px; }
#app.app-shell[data-page="membership"] .ss-preview-choices > div > div { display: flex; flex-wrap: wrap; gap: 7px; }
#app.app-shell[data-page="membership"] .ss-preview-choices button { flex: 1 1 118px; }
#app.app-shell[data-page="membership"] .ss-preview-result { padding-left: clamp(22px,3vw,42px); border-left: 1px solid var(--qx-color-line); }
#app.app-shell[data-page="membership"] .ss-preview-result > small { color: var(--qx-color-marrs-deep); font: 700 10px/1.5 var(--qx-font-mono); letter-spacing: .04em; }
#app.app-shell[data-page="membership"] .ss-preview-result h3 { margin: 10px 0 18px; color: var(--qx-color-ink); font-size: clamp(23px,2.4vw,34px); line-height: 1.1; letter-spacing: -.045em; }
#app.app-shell[data-page="membership"] .ss-preview-result ol { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--qx-color-line); }
#app.app-shell[data-page="membership"] .ss-preview-result li { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; min-height: 48px; padding: 8px 12px; background: var(--qx-color-cloud); }
#app.app-shell[data-page="membership"] .ss-preview-result li b { color: var(--qx-color-orange); font: 700 10px/1 var(--qx-font-mono); }
#app.app-shell[data-page="membership"] .ss-preview-result li span { color: var(--qx-color-ink); font-size: 12px; font-weight: 680; }
#app.app-shell[data-page="membership"] .ss-preview-action { margin: 16px 0; padding: 14px 0; border-top: 1px solid var(--qx-color-line); border-bottom: 1px solid var(--qx-color-line); }
#app.app-shell[data-page="membership"] .ss-preview-action span { color: var(--qx-color-orange); font: 700 9px/1 var(--qx-font-mono); letter-spacing: .08em; }
#app.app-shell[data-page="membership"] .ss-preview-action p { margin: 6px 0 0; color: var(--qx-color-ink); font-size: 13px; line-height: 1.6; }
#app.app-shell[data-page="membership"] .ss-preview-result > button { width: 100%; min-height: 48px; }
#app.app-shell[data-page="membership"] .ss-preview-delivery { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--qx-color-line); border-bottom: 1px solid var(--qx-color-line); }
#app.app-shell[data-page="membership"] .ss-preview-delivery span { padding: 13px 16px; border-right: 1px solid var(--qx-color-line); color: var(--qx-color-text-muted); font-size: 11px; }
#app.app-shell[data-page="membership"] .ss-preview-delivery span:last-child { border-right: 0; }
#app.app-shell[data-page="membership"] .ss-preview-delivery b { margin-right: 8px; color: var(--qx-color-marrs-deep); font: 700 10px/1 var(--qx-font-mono); }
#app.app-shell[data-page="membership"] .ss-preview-fit { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 22px; background: var(--qx-color-line); }
#app.app-shell[data-page="membership"] .ss-preview-fit > div { padding: 17px; background: var(--qx-color-cloud); }
#app.app-shell[data-page="membership"] .ss-preview-fit b { color: var(--qx-color-ink); font-size: 12px; }
#app.app-shell[data-page="membership"] .ss-preview-fit p { margin: 7px 0 0; color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.65; }
#app.app-shell[data-page="membership"] .ss-membership-cta,
#app.app-shell[data-page="membership"] .ss-member-pay-btn,
#app.app-shell[data-page="membership"] [data-action="membership-buy"] {
  border-color: var(--qx-color-orange) !important;
  background: var(--qx-color-orange) !important;
  color: var(--qx-color-ink) !important;
}

#app.app-shell :is(button,a,input,textarea,select):focus-visible {
  outline: 2px solid var(--qx-focus-ring) !important;
  outline-offset: 3px;
}

.site-footer { border-color: var(--qx-color-line); background: var(--qx-color-cloud); }
.site-footer-brand img { display: block; width: 112px; height: auto; margin-bottom: 5px; }

@media (hover:hover) and (pointer:fine) {
  #app.app-shell .ss-desktop-nav-item:hover,
  #app.app-shell .ss-login-btn:hover { color: var(--qx-color-ink) !important; }
  #app.app-shell :is(.ss-header-join,.qx-intel-primary,.qx-subscribe-strip button):hover {
    box-shadow: 0 8px 20px rgb(243 112 33 / 20%) !important;
    transform: translateY(-1px) !important;
  }
}

@media (max-width: 899px) {
  #app.app-shell .ss-header {
    min-height: 62px;
    height: 62px;
    padding: 0 16px;
  }
  #app.app-shell .ss-brand { width: 112px; min-width: 112px; height: 48px; }
  #app.app-shell .ss-brand-lockup { width: 112px; }
  #app.app-shell .ss-desktop-nav { display: none; }
  #app.app-shell .ss-header-join { display: none; }
  #app.app-shell .ss-login-btn { padding-right: 0; }
  #app.app-shell > .ss-tabbar {
    display: flex;
    margin: 0;
    padding: 7px max(7px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));
    border: 0 !important;
    border-top: 1px solid var(--qx-color-line) !important;
    border-radius: 0;
    background: rgb(240 239 235 / 96%) !important;
    box-shadow: none !important;
  }
  #app.app-shell .ss-tab { min-height: var(--qx-touch-target); border-radius: var(--qx-radius-control); }
  #app.app-shell .ss-tab-label { font-size: 10px; }
  #app.app-shell .ss-tab.active { background: rgb(216 233 230 / 55%); }
  #app.app-shell .ss-tab.active .ss-tab-bar { display: none; }
  .qx-intelligence-home,
  .qx-intel-page,
  .qx-content-page { padding-right: 18px !important; padding-left: 18px !important; }
  .qx-intelligence-hero {
    min-height: 0;
    grid-template-columns: minmax(0,1fr);
    gap: 38px;
    padding: 52px 0 48px;
  }
  .qx-intelligence-hero h1 { font-size: clamp(42px,12vw,58px) !important; line-height: 1.03 !important; }
  .qx-intelligence-hero p { font-size: 14px; }
  .qx-intel-actions { display: grid; }
  .qx-intel-primary,
  .qx-intel-secondary { width: 100%; }
  .qx-hero-delivery { grid-template-columns: 1fr; }
  .qx-hero-delivery :is(small,span) { padding: 10px 0; border-right: 0; border-bottom: 1px solid var(--qx-color-line); }
  .qx-hero-delivery :is(small,span):last-child { border-bottom: 0; }
  .qx-feature-visual { border-radius: var(--qx-radius-container); }
  .qx-subscribe-strip,
  .qx-guide-cta,
  .qx-rss-strip { margin-right: 0; margin-left: 0; }
  .qx-library-row > button { min-height: var(--qx-touch-target); border-radius: var(--qx-radius-control); }
  #app.app-shell[data-page="circle"] .ss-circle-page { padding: 28px 16px 104px; }
  #app.app-shell[data-page="circle"] .ss-circle-hero { padding-bottom: 30px; }
  #app.app-shell[data-page="circle"] .ss-circle-hero::after { right: -72px; opacity: .62; }
  #app.app-shell[data-page="circle"] .ss-circle-hero h1 { font-size: clamp(34px,10vw,48px); }
  #app.app-shell[data-page="circle"] .ss-circle-metrics { border-radius: var(--qx-radius-control); }
  #app.app-shell[data-page="membership"] .ss-membership-preview { padding: 20px 16px; }
  #app.app-shell[data-page="membership"] .ss-membership-preview > header { display: block; }
  #app.app-shell[data-page="membership"] .ss-membership-preview > header p { margin-top: 10px; }
  #app.app-shell[data-page="membership"] .ss-preview-builder { grid-template-columns: 1fr; gap: 26px; }
  #app.app-shell[data-page="membership"] .ss-preview-result { padding: 24px 0 0; border-top: 1px solid var(--qx-color-line); border-left: 0; }
  #app.app-shell[data-page="membership"] .ss-preview-delivery,
  #app.app-shell[data-page="membership"] .ss-preview-fit { grid-template-columns: 1fr; }
  #app.app-shell[data-page="membership"] .ss-preview-delivery span { border-right: 0; border-bottom: 1px solid var(--qx-color-line); }
  #app.app-shell[data-page="membership"] .ss-preview-delivery span:last-child { border-bottom: 0; }
  .site-footer-brand img { width: 104px; }
}

@media (prefers-reduced-motion: reduce) {
  :root { --qx-motion-control: 0ms; --qx-motion-state: 0ms; --qx-motion-route: 0ms; }
  .qx-earth-fallback { transition: none; }
}

/* 18-qianx-business-plan.css */
* { box-sizing: border-box; }

html,
body { margin: 0; min-height: 100%; }

button,
a { -webkit-tap-highlight-color: transparent; }

.bp-page {
  overflow: hidden;
  background: var(--qx-color-cloud, #f0efeb);
  color: var(--qx-color-ink, #002f2f);
  font-family: var(--qx-font-sans, "Inter", "Noto Sans SC", sans-serif);
}

.bp-skip {
  position: fixed;
  z-index: 30;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  background: #fff;
  color: var(--qx-color-ink, #002f2f);
  transform: translateY(-160%);
}

.bp-skip:focus { transform: translateY(0); }

.bp-app {
  display: grid;
  grid-template: 64px minmax(0, 1fr) 76px / 252px minmax(0, 1fr);
  height: 100dvh;
  min-height: 680px;
  background: var(--qx-color-cloud, #f0efeb);
}

.bp-header {
  z-index: 10;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 252px auto 1fr;
  align-items: center;
  border-bottom: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%));
  background: rgb(247 246 243 / 96%);
}

.bp-brand {
  display: flex;
  height: 100%;
  align-items: center;
  padding: 0 30px;
  border-right: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%));
}

.bp-brand img { display: block; width: 126px; }

.bp-header-title {
  padding: 0 30px;
  font-size: 17px;
  font-weight: 720;
}

.bp-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 30px;
  padding-right: 30px;
}

.bp-header-actions a {
  color: var(--qx-color-marrs-deep, #005f5f);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.bp-header-actions a span { margin-left: 5px; color: var(--qx-color-marrs, #008c8c); }

.bp-page-count {
  display: flex;
  min-width: 80px;
  align-items: center;
  gap: 10px;
  border-left: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%));
  padding-left: 24px;
  font: 650 15px/1 var(--qx-font-mono, monospace);
}

.bp-page-count b { color: var(--qx-color-marrs, #008c8c); font-size: 18px; }
.bp-page-count i { color: var(--qx-color-cloud-low, #dedbd4); font-style: normal; }

.bp-rail {
  grid-row: 2;
  grid-column: 1;
  overflow-y: auto;
  padding: 22px 20px 26px;
  border-right: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%));
  scrollbar-width: thin;
}

.bp-rail-item {
  display: grid;
  grid-template-columns: 116px 28px 1fr;
  align-items: center;
  width: 100%;
  min-height: 72px;
  gap: 9px;
  padding: 6px 0;
  border: 0;
  background: transparent;
  color: var(--qx-color-ink, #002f2f);
  text-align: left;
  cursor: pointer;
}

.bp-rail-item b { color: var(--qx-color-marrs-deep, #005f5f); font: 720 14px/1 var(--qx-font-mono, monospace); }
.bp-rail-item em { font-size: 14px; font-style: normal; font-weight: 650; }

.bp-thumb {
  position: relative;
  display: block;
  width: 116px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 5px;
  background: var(--qx-color-cloud-high, #f7f6f3);
  box-shadow: inset 0 0 0 1px rgb(0 95 95 / 7%);
}

.bp-rail-item.is-active .bp-thumb {
  border-color: var(--qx-color-marrs, #008c8c);
  box-shadow: 0 0 0 1px var(--qx-color-marrs, #008c8c);
}

.bp-rail-item.is-active em,
.bp-rail-item.is-active b { color: var(--qx-color-marrs, #008c8c); }

.bp-thumb::before,
.bp-thumb::after,
.bp-thumb i { position: absolute; display: block; content: ""; }
.bp-thumb::before { top: 10px; left: 9px; width: 34px; height: 4px; background: var(--qx-color-marrs-deep, #005f5f); }
.bp-thumb::after { bottom: 10px; left: 9px; width: 52px; height: 2px; background: rgb(0 95 95 / 25%); }
.bp-thumb i { border: 1px solid var(--qx-color-marrs, #008c8c); border-radius: 50%; }
.bp-thumb i:nth-child(1) { top: 19px; right: 14px; width: 25px; height: 25px; }
.bp-thumb i:nth-child(2) { top: 27px; right: 45px; width: 10px; height: 10px; }
.bp-thumb i:nth-child(3) { right: 35px; bottom: 11px; width: 6px; height: 6px; background: var(--qx-color-orange, #f37021); border-color: var(--qx-color-orange, #f37021); }
.bp-thumb-problem i { border-radius: 2px; }
.bp-thumb-opportunity i:nth-child(1) { width: 36px; height: 36px; background: rgb(0 140 140 / 12%); }
.bp-thumb-product i { right: auto !important; left: 58px; width: 42px !important; height: 8px !important; border-radius: 2px; }
.bp-thumb-product i:nth-child(1) { top: 18px; }.bp-thumb-product i:nth-child(2) { top: 31px; }.bp-thumb-product i:nth-child(3) { top: 44px; background: var(--qx-color-orange, #f37021); }
.bp-thumb-network i { top: 27px !important; width: 14px !important; height: 14px !important; }
.bp-thumb-network i:nth-child(1) { right: 14px; }.bp-thumb-network i:nth-child(2) { right: 38px; }.bp-thumb-network i:nth-child(3) { right: 62px; }
.bp-thumb-value i:nth-child(1) { right: 18px; width: 46px; height: 28px; border-radius: 4px; }
.bp-thumb-model i { border-radius: 0; border-width: 0 0 2px 2px; }
.bp-thumb-roadmap i { top: 33px !important; width: 19px !important; height: 4px !important; border-radius: 0; border-width: 0 0 2px; }
.bp-thumb-moat i { inset: 50% auto auto 73px !important; transform: translate(-50%, -50%); }
.bp-thumb-moat i:nth-child(1) { width: 34px !important; height: 34px !important; }.bp-thumb-moat i:nth-child(2) { width: 22px !important; height: 22px !important; }.bp-thumb-moat i:nth-child(3) { width: 10px !important; height: 10px !important; background: var(--qx-color-orange, #f37021); }

.bp-stage {
  position: relative;
  grid-row: 2;
  grid-column: 2;
  overflow: hidden;
  padding: 28px;
  outline: none;
}

.bp-slide {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  padding: clamp(38px, 4.6vw, 76px);
  border: 1px solid rgb(0 95 95 / 8%);
  border-radius: 12px;
  background: var(--qx-color-cloud-high, #f7f6f3);
  box-shadow: var(--qx-shadow-raised, 0 20px 55px rgb(0 47 47 / 9%));
  animation: bp-slide-in 420ms var(--qx-ease-standard, cubic-bezier(.2,.8,.2,1));
}

.bp-slide[hidden] { display: none !important; }

.bp-slide::after {
  position: absolute;
  z-index: 0;
  right: -14%;
  bottom: -40%;
  width: 54%;
  aspect-ratio: 1;
  border: 1px solid rgb(0 140 140 / 10%);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.bp-slide > * { position: relative; z-index: 1; }

@keyframes bp-slide-in {
  from { opacity: 0; transform: translateX(16px); }
  to { opacity: 1; transform: translateX(0); }
}

.bp-slide-cover { display: grid; grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); align-items: center; gap: 4%; }
.bp-cover-copy { align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
.bp-cover-copy > img { width: clamp(160px, 14vw, 238px); margin-bottom: clamp(28px, 4vh, 56px); }
.bp-cover-copy h1 { margin: 0; max-width: 620px; color: var(--qx-color-ink, #002f2f); font-size: clamp(52px, 5.2vw, 90px); font-weight: 850; line-height: .94; letter-spacing: -.07em; }
.bp-title-rule { width: 62px; height: 4px; margin: 30px 0 24px; background: var(--qx-color-marrs, #008c8c); }
.bp-cover-copy > p { max-width: 570px; margin: 0; color: var(--qx-color-text-muted, #5f706d); font-size: clamp(17px, 1.4vw, 23px); line-height: 1.65; }
.bp-cover-copy footer { display: grid; gap: 18px; margin-top: auto; padding-top: 36px; }
.bp-cover-copy footer b { color: var(--qx-color-marrs-deep, #005f5f); font-size: 17px; letter-spacing: .04em; }
.bp-cover-copy footer em { color: var(--qx-color-orange, #f37021); font: 650 12px/1 var(--qx-font-mono, monospace); letter-spacing: .24em; }

.bp-cover-network { position: relative; width: min(100%, 680px); aspect-ratio: 1; justify-self: center; }
.bp-cover-network svg { width: 100%; height: 100%; overflow: visible; }
.bp-orbit { fill: none; stroke: rgb(0 140 140 / 42%); stroke-width: 1; }
.orbit-two { stroke: rgb(0 140 140 / 24%); }.orbit-three { stroke-dasharray: 3 5; }
.bp-continent { fill: rgb(0 140 140 / 5%); stroke: rgb(0 140 140 / 12%); stroke-width: 1; }
.bp-network-line { fill: none; stroke: var(--qx-color-marrs, #008c8c); stroke-width: 2; }.bp-network-line.dotted { opacity: .55; stroke-dasharray: 4 6; }
.bp-node-dots circle { fill: var(--qx-color-marrs, #008c8c); }.bp-node-dots .is-orange { fill: var(--qx-color-orange, #f37021); }
.bp-agent-label { position: absolute; display: flex; align-items: center; gap: 10px; color: var(--qx-color-marrs-deep, #005f5f); }
.bp-agent-label i { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid var(--qx-color-marrs, #008c8c); border-radius: 50%; background: var(--qx-color-cloud-high, #f7f6f3); font: 700 11px/1 var(--qx-font-mono, monospace); font-style: normal; }
.bp-agent-label span { display: grid; gap: 2px; font-size: 12px; }.bp-agent-label b { font: 700 10px/1 var(--qx-font-mono, monospace); }
.bp-agent-buyer { top: 22%; right: 2%; }.bp-agent-project { top: 52%; left: 0; }.bp-agent-supplier { right: 4%; bottom: 17%; }

.bp-slide-heading span,
.bp-invite-copy > span {
  display: block;
  margin-bottom: 20px;
  color: var(--qx-color-marrs, #008c8c);
  font: 700 11px/1 var(--qx-font-mono, monospace);
  letter-spacing: .17em;
}

.bp-slide-heading h2,
.bp-invite-copy h2 {
  max-width: 1080px;
  margin: 0;
  font-size: clamp(40px, 4vw, 70px);
  font-weight: 820;
  line-height: 1.02;
  letter-spacing: -.06em;
}

.bp-slide-heading > p { max-width: 950px; margin: 22px 0 0; color: var(--qx-color-text-muted, #5f706d); font-size: 19px; line-height: 1.7; }
.bp-slide-heading.is-compact h2 { font-size: clamp(36px, 3.45vw, 58px); }
.bp-slide blockquote { margin: 32px 0 0; padding: 22px 26px; border-left: 4px solid var(--qx-color-orange, #f37021); background: rgb(243 112 33 / 7%); font-size: clamp(17px, 1.5vw, 23px); font-weight: 650; line-height: 1.55; }

.bp-problem-map { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 24px; margin-top: clamp(38px, 6vh, 70px); }
.bp-problem-map > span { color: var(--qx-color-marrs-mid, #4ba9a5); font-size: 26px; }
.bp-problem-map section { min-height: 190px; padding: 28px; border-top: 3px solid var(--qx-color-marrs, #008c8c); background: rgb(216 233 230 / 30%); }
.bp-problem-map section.is-problem { border-top-color: var(--qx-color-orange, #f37021); background: rgb(243 112 33 / 8%); }
.bp-problem-map i { display: block; margin-bottom: 36px; color: var(--qx-color-marrs, #008c8c); font: 700 12px/1 var(--qx-font-mono, monospace); font-style: normal; }
.bp-problem-map b { display: block; font-size: 24px; }.bp-problem-map p { margin: 13px 0 0; color: var(--qx-color-text-muted, #5f706d); font-size: 14px; line-height: 1.75; }

.bp-opportunity { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(0, 1.4fr); align-items: center; gap: 7%; margin-top: 42px; }
.bp-opportunity-core { display: grid; width: min(100%, 390px); aspect-ratio: 1; place-content: center; justify-items: center; border: 1px solid var(--qx-color-marrs, #008c8c); border-radius: 50%; background: radial-gradient(circle, rgb(0 140 140 / 12%), transparent 70%); text-align: center; }
.bp-opportunity-core::before { position: absolute; inset: 10%; border: 1px dashed rgb(0 140 140 / 35%); border-radius: 50%; content: ""; }
.bp-opportunity-core span { color: var(--qx-color-orange, #f37021); font: 760 13px/1 var(--qx-font-mono, monospace); letter-spacing: .18em; }
.bp-opportunity-core b { margin-top: 18px; font-size: clamp(28px, 2.3vw, 40px); line-height: 1.2; }
.bp-opportunity ol { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--qx-color-line, rgb(0 95 95 / 22%)); }
.bp-opportunity li { min-height: 136px; padding: 24px; background: var(--qx-color-cloud-high, #f7f6f3); }
.bp-opportunity li i { color: var(--qx-color-orange, #f37021); font: 700 11px/1 var(--qx-font-mono, monospace); font-style: normal; }.bp-opportunity li b { display: block; margin-top: 28px; font-size: 20px; }.bp-opportunity li span { display: block; margin-top: 8px; color: var(--qx-color-text-muted, #5f706d); font-size: 13px; }

.bp-product-stack { display: grid; margin-top: 38px; border-top: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); }
.bp-product-stack section { display: grid; grid-template-columns: 94px 1fr 80px; align-items: center; min-height: 84px; border-bottom: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); }
.bp-product-stack section > i { color: var(--qx-color-orange, #f37021); font: 700 10px/1 var(--qx-font-mono, monospace); font-style: normal; letter-spacing: .08em; }
.bp-product-stack section > div { display: grid; grid-template-columns: 220px 1fr; align-items: center; gap: 24px; }.bp-product-stack b { font-size: 21px; }.bp-product-stack p { margin: 0; color: var(--qx-color-text-muted, #5f706d); font-size: 14px; line-height: 1.6; }.bp-product-stack strong { color: var(--qx-color-marrs, #008c8c); font-size: 13px; text-align: right; }
.bp-governance-line { display: flex; justify-content: space-between; gap: 24px; margin-top: 28px; padding: 18px 0; color: var(--qx-color-marrs-deep, #005f5f); font-size: 13px; }.bp-governance-line span { color: var(--qx-color-text-muted, #5f706d); }

.bp-network-flow { display: grid; grid-template-columns: repeat(9, auto); align-items: center; justify-content: space-between; gap: 14px; margin-top: clamp(36px, 6vh, 74px); }
.bp-network-flow > span { color: var(--qx-color-marrs, #008c8c); font-size: 25px; }
.bp-network-flow section { display: grid; justify-items: center; min-width: 126px; text-align: center; }
.bp-network-flow section > i { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: var(--qx-color-marrs, #008c8c); color: white; font: 700 11px/1 var(--qx-font-mono, monospace); font-style: normal; }
.bp-flow-icon { display: grid; width: 96px; height: 96px; place-items: center; margin: 10px 0 16px; border: 1px solid var(--qx-color-marrs, #008c8c); border-radius: 50%; color: var(--qx-color-marrs-deep, #005f5f); font: 750 22px/1 var(--qx-font-mono, monospace); }.bp-flow-icon.is-orange { border-color: var(--qx-color-orange, #f37021); color: var(--qx-color-orange, #f37021); }
.bp-network-flow b { font-size: 18px; }.bp-network-flow p { margin: 8px 0 0; color: var(--qx-color-text-muted, #5f706d); font-size: 12px; line-height: 1.55; }
.bp-boundary { display: flex; justify-content: space-between; gap: 28px; margin-top: clamp(38px, 7vh, 82px); padding-top: 24px; border-top: 1px dashed var(--qx-color-marrs-mid, #4ba9a5); }.bp-boundary b { font-size: 15px; }.bp-boundary span { color: var(--qx-color-marrs-deep, #005f5f); font: 650 13px/1 var(--qx-font-mono, monospace); }

.bp-value-exchange { display: grid; grid-template-columns: 1fr 145px 1fr; align-items: stretch; gap: 30px; margin-top: 38px; }
.bp-value-exchange section { min-height: 300px; padding: 30px 34px; border-top: 3px solid var(--qx-color-marrs, #008c8c); background: rgb(216 233 230 / 27%); }
.bp-value-exchange section > span { color: var(--qx-color-marrs, #008c8c); font: 700 10px/1 var(--qx-font-mono, monospace); letter-spacing: .15em; }.bp-value-exchange h3 { margin: 22px 0 24px; font-size: 26px; }.bp-value-exchange ul { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }.bp-value-exchange li { padding-bottom: 12px; border-bottom: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); font-size: 15px; }
.bp-value-get { border-top-color: var(--qx-color-orange, #f37021) !important; }.bp-value-get > span { color: var(--qx-color-orange, #f37021) !important; }
.bp-value-center { align-self: center; display: grid; justify-items: center; gap: 16px; text-align: center; }.bp-value-center b { display: grid; width: 82px; height: 82px; place-items: center; border-radius: 50%; background: var(--qx-color-marrs, #008c8c); color: var(--qx-color-cloud-high, #f7f6f3); font-size: 26px; }.bp-value-center span { color: var(--qx-color-text-muted, #5f706d); font: 650 11px/1.8 var(--qx-font-mono, monospace); }

.bp-model { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.6fr); gap: 32px; margin-top: 36px; }
.bp-model-now { display: flex; flex-direction: column; min-height: 350px; padding: 30px; background: var(--qx-color-marrs-deep, #005f5f); color: var(--qx-color-cloud-high, #f7f6f3); }.bp-model-now > span { font: 700 10px/1 var(--qx-font-mono, monospace); letter-spacing: .14em; }.bp-model-now strong { margin-top: auto; color: var(--qx-color-orange, #f37021); font-size: clamp(52px, 5vw, 82px); letter-spacing: -.06em; }.bp-model-now strong small { font-size: 15px; letter-spacing: 0; }.bp-model-now h3 { margin: 6px 0 12px; font-size: 24px; }.bp-model-now p { margin: 0; color: rgb(240 239 235 / 72%); font-size: 13px; line-height: 1.7; }
.bp-model-ladder { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--qx-color-line, rgb(0 95 95 / 22%)); }.bp-model-ladder section { min-height: 174px; padding: 24px; background: var(--qx-color-cloud-high, #f7f6f3); }.bp-model-ladder i { color: var(--qx-color-orange, #f37021); font: 700 11px/1 var(--qx-font-mono, monospace); font-style: normal; }.bp-model-ladder b { display: block; margin-top: 34px; font-size: 19px; }.bp-model-ladder p { margin: 8px 0 0; color: var(--qx-color-text-muted, #5f706d); font-size: 12px; line-height: 1.65; }

.bp-roadmap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 40px; background: var(--qx-color-line, rgb(0 95 95 / 22%)); }.bp-roadmap section { position: relative; min-height: 280px; padding: 28px 24px; background: var(--qx-color-cloud-high, #f7f6f3); }.bp-roadmap section::before { position: absolute; top: 0; right: 0; left: 0; height: 4px; background: var(--qx-color-marrs-mid, #4ba9a5); content: ""; }.bp-roadmap section.is-now::before { background: var(--qx-color-orange, #f37021); }.bp-roadmap span { color: var(--qx-color-marrs, #008c8c); font: 700 10px/1 var(--qx-font-mono, monospace); letter-spacing: .1em; }.bp-roadmap b { display: block; margin-top: 72px; font-size: 21px; }.bp-roadmap p { margin: 12px 0 0; color: var(--qx-color-text-muted, #5f706d); font-size: 13px; line-height: 1.65; }.bp-roadmap small { position: absolute; right: 24px; bottom: 24px; left: 24px; padding-top: 12px; border-top: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); color: var(--qx-color-marrs-deep, #005f5f); font-size: 11px; line-height: 1.5; }
.bp-roadmap-gate { display: flex; justify-content: space-between; gap: 24px; margin-top: 25px; font-size: 13px; }.bp-roadmap-gate span { color: var(--qx-color-text-muted, #5f706d); }

.bp-moat { display: grid; grid-template-columns: minmax(360px, .86fr) minmax(0, 1.14fr); align-items: center; gap: 6%; margin-top: 26px; }
.bp-moat-rings { position: relative; width: min(100%, 410px); aspect-ratio: 1; justify-self: center; }.bp-moat-rings .ring { position: absolute; inset: 50% auto auto 50%; display: grid; place-items: start center; border: 1px solid var(--qx-color-marrs-mid, #4ba9a5); border-radius: 50%; transform: translate(-50%, -50%); }.bp-moat-rings .ring b { margin-top: 14px; padding: 2px 8px; background: var(--qx-color-cloud-high, #f7f6f3); color: var(--qx-color-text-muted, #5f706d); font: 650 10px/1 var(--qx-font-mono, monospace); }.bp-moat-rings .ring-four { width: 100%; height: 100%; }.bp-moat-rings .ring-three { width: 78%; height: 78%; }.bp-moat-rings .ring-two { width: 56%; height: 56%; }.bp-moat-rings .ring-one { width: 34%; height: 34%; border-color: var(--qx-color-orange, #f37021); }.bp-moat-rings > i { position: absolute; inset: 50% auto auto 50%; display: grid; width: 62px; height: 62px; place-items: center; border-radius: 50%; background: var(--qx-color-marrs-deep, #005f5f); color: white; font: 760 18px/1 var(--qx-font-mono, monospace); font-style: normal; transform: translate(-50%, -50%); }
.bp-moat-copy { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--qx-color-line, rgb(0 95 95 / 22%)); }.bp-moat-copy section { min-height: 136px; padding: 22px; background: var(--qx-color-cloud-high, #f7f6f3); }.bp-moat-copy b { font-size: 17px; }.bp-moat-copy p { margin: 9px 0 0; color: var(--qx-color-text-muted, #5f706d); font-size: 12px; line-height: 1.65; }
.bp-risk-line { display: grid; grid-template-columns: 90px 1fr 1.35fr; gap: 20px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); font-size: 12px; }.bp-risk-line b { color: var(--qx-color-orange, #f37021); }.bp-risk-line span { color: var(--qx-color-ink, #002f2f); }.bp-risk-line em { color: var(--qx-color-text-muted, #5f706d); font-style: normal; text-align: right; }

.bp-slide-invite { display: grid; grid-template: 1fr auto / minmax(0, 1fr) minmax(360px, .9fr); gap: 34px 7%; background: var(--qx-color-marrs-deep, #005f5f); color: var(--qx-color-cloud-high, #f7f6f3); }.bp-slide-invite::after { border-color: rgb(240 239 235 / 10%); }.bp-invite-copy { display: flex; flex-direction: column; justify-content: center; }.bp-invite-copy > span { color: var(--qx-color-orange, #f37021); }.bp-invite-copy h2 { font-size: clamp(48px, 5vw, 82px); }.bp-invite-copy > p { max-width: 660px; margin: 28px 0 0; color: rgb(240 239 235 / 70%); font-size: 17px; line-height: 1.75; }.bp-invite-actions { display: flex; align-items: center; gap: 22px; margin-top: 32px; }.bp-invite-actions a { display: inline-flex; min-height: 48px; align-items: center; padding: 0 22px; border-radius: var(--qx-radius-control, 8px); background: var(--qx-color-orange, #f37021); color: var(--qx-color-ink, #002f2f); font-size: 13px; font-weight: 780; text-decoration: none; }.bp-invite-actions b { color: var(--qx-color-cloud, #f0efeb); font: 650 12px/1 var(--qx-font-mono, monospace); }
.bp-invite-roles { align-self: center; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: rgb(240 239 235 / 18%); }.bp-invite-roles section { min-height: 178px; padding: 24px; background: var(--qx-color-marrs-deep, #005f5f); }.bp-invite-roles i { color: var(--qx-color-orange, #f37021); font: 700 11px/1 var(--qx-font-mono, monospace); font-style: normal; }.bp-invite-roles b { display: block; margin-top: 38px; font-size: 17px; }.bp-invite-roles p { margin: 8px 0 0; color: rgb(240 239 235 / 62%); font-size: 12px; line-height: 1.6; }.bp-slide-invite > footer { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 20px; border-top: 1px solid rgb(240 239 235 / 18%); }.bp-slide-invite > footer img { width: 110px; filter: brightness(0) invert(1); opacity: .9; }.bp-slide-invite > footer span { color: rgb(240 239 235 / 55%); font: 650 10px/1 var(--qx-font-mono, monospace); letter-spacing: .06em; }

.bp-slide-note { margin-top: 24px; color: var(--qx-color-text-muted, #5f706d); font-size: 12px; line-height: 1.6; }

.bp-controls {
  z-index: 10;
  grid-row: 3;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 252px 1fr auto auto;
  align-items: center;
  border-top: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%));
  background: rgb(247 246 243 / 96%);
}

.bp-progress { display: flex; align-items: center; gap: 14px; height: 100%; padding: 0 28px; border-right: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); font-size: 12px; }.bp-progress > i { display: block; flex: 1; height: 4px; overflow: hidden; background: var(--qx-color-cloud-low, #dedbd4); }.bp-progress > i b { display: block; width: 10%; height: 100%; background: var(--qx-color-marrs, #008c8c); transition: width 280ms var(--qx-ease-standard, ease); }
.bp-key-hint { padding-left: 30px; color: var(--qx-color-text-muted, #5f706d); font-size: 11px; }.bp-key-hint kbd { display: inline-grid; min-width: 24px; height: 24px; place-items: center; margin-right: 4px; border: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); border-radius: 4px; background: transparent; font-family: var(--qx-font-mono, monospace); }
.bp-nav-buttons { display: flex; gap: 10px; padding: 0 28px; }.bp-nav-buttons button { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid var(--qx-color-marrs-mid, #4ba9a5); border-radius: var(--qx-radius-control, 8px); background: transparent; color: var(--qx-color-marrs-deep, #005f5f); cursor: pointer; }.bp-nav-buttons button.is-primary { border-color: var(--qx-color-orange, #f37021); background: var(--qx-color-orange, #f37021); color: var(--qx-color-ink, #002f2f); }.bp-nav-buttons button:disabled { opacity: .32; cursor: default; }.bp-nav-buttons svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.bp-view-actions { display: flex; height: 100%; align-items: center; border-left: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); }.bp-view-actions button { height: 100%; padding: 0 24px; border: 0; background: transparent; color: var(--qx-color-marrs-deep, #005f5f); font: 650 12px/1 var(--qx-font-sans, sans-serif); cursor: pointer; }.bp-view-actions button span { margin-right: 8px; }

.bp-page.is-presenting .bp-app { grid-template: 56px minmax(0, 1fr) 64px / minmax(0, 1fr); }.bp-page.is-presenting .bp-header { grid-template-columns: auto 1fr; }.bp-page.is-presenting .bp-brand,.bp-page.is-presenting .bp-rail,.bp-page.is-presenting .bp-header-title,.bp-page.is-presenting .bp-key-hint,.bp-page.is-presenting .bp-progress { display: none; }.bp-page.is-presenting .bp-header-actions { grid-column: 2; }.bp-page.is-presenting .bp-stage { grid-column: 1; }.bp-page.is-presenting .bp-controls { grid-template-columns: 1fr auto auto; }.bp-page.is-presenting .bp-nav-buttons { grid-column: 2; }

.qx-intel-plan-link {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  padding: 0 18px;
  border: 0;
  border-bottom: 1px solid var(--qx-color-marrs, #008c8c);
  color: var(--qx-color-marrs-deep, #005f5f);
  font-size: 13px;
  font-weight: 760;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .bp-rail-item:hover .bp-thumb { border-color: var(--qx-color-marrs-mid, #4ba9a5); }
  .bp-header-actions a:hover,.bp-view-actions button:hover { color: var(--qx-color-orange, #f37021); }
  .bp-nav-buttons button:not(:disabled):hover,.bp-invite-actions a:hover { transform: translateY(-1px); box-shadow: 0 9px 20px rgb(0 47 47 / 10%); }
  .qx-intel-plan-link:hover { border-bottom-color: var(--qx-color-orange, #f37021); color: var(--qx-color-orange, #f37021); }
}

@media (max-width: 1100px) {
  .bp-app { grid-template-columns: 188px minmax(0, 1fr); }
  .bp-header { grid-template-columns: 188px auto 1fr; }
  .bp-brand { padding: 0 20px; }.bp-brand img { width: 116px; }
  .bp-rail { padding-right: 14px; padding-left: 14px; }
  .bp-rail-item { grid-template-columns: 80px 23px 1fr; gap: 6px; }.bp-thumb { width: 80px; }.bp-rail-item em { font-size: 12px; }
  .bp-controls { grid-template-columns: 188px 1fr auto auto; }.bp-progress { padding: 0 18px; }.bp-key-hint { display: none; }
  .bp-slide { padding: 38px; }.bp-slide-cover { grid-template-columns: .9fr 1fr; }.bp-cover-copy h1 { font-size: clamp(48px, 5.4vw, 70px); }
  .bp-network-flow { gap: 7px; }.bp-network-flow section { min-width: 92px; }.bp-flow-icon { width: 72px; height: 72px; }.bp-network-flow > span { font-size: 19px; }
}

@media (min-width: 821px) and (max-height: 780px) {
  .bp-app { grid-template-rows: 58px minmax(0, 1fr) 64px; }
  .bp-rail { padding-top: 10px; padding-bottom: 10px; }
  .bp-rail-item { grid-template-columns: 76px 24px 1fr; min-height: 53px; gap: 6px; padding: 3px 0; }
  .bp-thumb { width: 76px; }
  .bp-thumb::before { top: 7px; left: 7px; width: 28px; height: 3px; }
  .bp-thumb::after { bottom: 7px; left: 7px; width: 36px; }
  .bp-thumb i:nth-child(1) { top: 12px; right: 9px; width: 20px; height: 20px; }
  .bp-thumb i:nth-child(2) { top: 18px; right: 34px; width: 8px; height: 8px; }
  .bp-thumb i:nth-child(3) { right: 28px; bottom: 7px; }
  .bp-slide { padding: 34px 48px; }
  .bp-cover-copy > img { width: 150px; margin-bottom: 28px; }
  .bp-cover-copy h1 { font-size: clamp(48px, 4.7vw, 66px); }
  .bp-cover-copy > p { font-size: 15px; }
  .bp-cover-copy footer { padding-top: 24px; }
}

@media (max-width: 820px) {
  .bp-page { overflow: auto; }
  .bp-app { display: grid; grid-template: 58px auto minmax(0, 1fr) 64px / 1fr; min-height: 100dvh; height: auto; }
  .bp-header { position: sticky; top: 0; grid-row: 1; grid-column: 1; grid-template-columns: auto 1fr auto; min-width: 0; }.bp-brand { width: auto; padding: 0 16px; border-right: 0; }.bp-brand img { width: 104px; }.bp-header-title { display: none; }.bp-header-actions { gap: 12px; padding-right: 15px; }.bp-header-actions a { display: none; }.bp-page-count { min-width: 68px; gap: 6px; padding-left: 12px; }
  .bp-rail { grid-row: 2; grid-column: 1; display: flex; gap: 6px; overflow-x: auto; overflow-y: hidden; padding: 10px 12px; border-right: 0; border-bottom: 1px solid var(--qx-color-line, rgb(0 95 95 / 22%)); scroll-snap-type: x proximity; }
  .bp-rail-item { flex: 0 0 auto; grid-template-columns: auto 1fr; min-height: 42px; width: auto; gap: 5px; padding: 0 10px; border: 1px solid transparent; border-radius: 6px; scroll-snap-align: center; }.bp-rail-item.is-active { border-color: var(--qx-color-marrs, #008c8c); background: rgb(216 233 230 / 45%); }.bp-thumb { display: none; }.bp-rail-item b { font-size: 11px; }.bp-rail-item em { font-size: 11px; }
  .bp-stage { grid-row: 3; grid-column: 1; min-height: calc(100dvh - 174px); overflow: visible; padding: 12px; }
  .bp-slide { min-height: calc(100dvh - 198px); height: auto; overflow: visible; padding: 28px 22px 34px; border-radius: 9px; }
  .bp-slide-cover { grid-template-columns: 1fr; gap: 14px; }.bp-cover-copy { min-height: 420px; }.bp-cover-copy > img { width: 140px; margin-bottom: 34px; }.bp-cover-copy h1 { font-size: clamp(50px, 15vw, 66px); }.bp-cover-copy > p { font-size: 16px; }.bp-cover-copy footer { margin-top: 54px; }.bp-cover-network { width: 100%; max-width: 440px; }.bp-agent-label { transform: scale(.82); }
  .bp-slide-heading h2,.bp-invite-copy h2 { font-size: clamp(36px, 11vw, 52px); }.bp-slide-heading.is-compact h2 { font-size: clamp(34px, 10vw, 48px); }.bp-slide-heading > p { font-size: 15px; }.bp-slide blockquote { font-size: 15px; }
  .bp-problem-map { grid-template-columns: 1fr; gap: 12px; }.bp-problem-map > span { display: none; }.bp-problem-map section { min-height: 0; }.bp-problem-map i { margin-bottom: 18px; }
  .bp-opportunity { grid-template-columns: 1fr; }.bp-opportunity-core { width: 260px; justify-self: center; }.bp-opportunity ol { grid-template-columns: 1fr; }
  .bp-product-stack section { grid-template-columns: 62px 1fr; padding: 18px 0; }.bp-product-stack section > div { grid-template-columns: 1fr; gap: 8px; }.bp-product-stack strong { grid-column: 2; text-align: left; }.bp-governance-line { display: grid; }
  .bp-network-flow { grid-template-columns: 1fr; justify-items: center; }.bp-network-flow > span { transform: rotate(90deg); }.bp-network-flow section { min-width: 210px; }.bp-boundary { display: grid; }
  .bp-value-exchange { grid-template-columns: 1fr; }.bp-value-center { grid-template-columns: auto 1fr; }.bp-value-center span { text-align: left; }
  .bp-model { grid-template-columns: 1fr; }.bp-model-now { min-height: 310px; }.bp-model-ladder { grid-template-columns: 1fr; }
  .bp-roadmap { grid-template-columns: 1fr; }.bp-roadmap section { min-height: 230px; }.bp-roadmap-gate { display: grid; }
  .bp-moat { grid-template-columns: 1fr; }.bp-moat-rings { width: 300px; }.bp-moat-copy { grid-template-columns: 1fr; }.bp-risk-line { grid-template-columns: 1fr; }.bp-risk-line em { text-align: left; }
  .bp-slide-invite { grid-template: auto auto auto / 1fr; }.bp-invite-copy h2 { font-size: clamp(46px, 14vw, 64px); }.bp-invite-roles { grid-template-columns: 1fr; }.bp-slide-invite > footer { grid-column: 1; display: grid; }
  .bp-controls { position: sticky; z-index: 15; bottom: 0; grid-row: 4; grid-column: 1; grid-template-columns: 1fr auto; min-height: 64px; }.bp-progress,.bp-key-hint,.bp-view-actions { display: none; }.bp-nav-buttons { grid-column: 2; padding: 0 14px; }.bp-nav-buttons button { width: 44px; height: 44px; }
  .qx-intel-plan-link { width: 100%; justify-content: center; border: 1px solid var(--qx-color-marrs, #008c8c); border-radius: var(--qx-radius-control, 8px); }
}

@media (prefers-reduced-motion: reduce) {
  .bp-slide { animation: none; }
  .bp-progress > i b { transition: none; }
}

@media print {
  @page { size: 16in 9in landscape; margin: 0; }
  .bp-page { overflow: visible; background: #fff; }
  .bp-app { display: block; height: auto; min-height: 0; }
  .bp-header,.bp-rail,.bp-controls,.bp-skip { display: none !important; }
  .bp-stage { display: block; overflow: visible; padding: 0; }
  .bp-slide,.bp-slide[hidden] { display: block !important; width: 16in; height: 9in; padding: .7in; border: 0; border-radius: 0; box-shadow: none; break-after: page; page-break-after: always; }
}

/* 19-qianx-agent-network.css */
/* QianX member Agent network: paid identity, safe access and contribution loop. */
.qx-member-network-page {
  --qx-agent-dark: #002f2f;
  --qx-agent-night: #001d1d;
  --qx-agent-lime: #b9d65c;
  width: min(100%, 1180px) !important;
  max-width: 1180px !important;
}

.qx-agent-loading,
.qx-agent-device,
.qx-agent-identity,
.qx-agent-card,
.qx-agent-composer,
.qx-agent-security {
  margin-top: 22px;
  border: 1px solid var(--qx-color-line);
  border-radius: var(--qx-radius-container);
  background: var(--qx-color-cloud-high);
  color: var(--qx-color-ink);
}

.qx-agent-loading { padding: clamp(26px, 4vw, 48px); }
.qx-agent-loading > span,
.qx-agent-device span,
.qx-agent-identity span,
.qx-agent-card header span,
.qx-agent-composer header span,
.qx-agent-secret > span,
.qx-agent-security > div > span {
  color: var(--qx-color-marrs-deep);
  font: 800 10px/1.4 var(--qx-font-mono);
  letter-spacing: .11em;
}
.qx-agent-loading h2 { margin: 16px 0 0; font-size: clamp(25px, 3vw, 38px); letter-spacing: -.045em; }
.qx-agent-loading p { margin: 10px 0 0; color: var(--qx-color-text-muted); font-size: 12px; }
.qx-agent-loading button { margin-top: 20px; }
.qx-agent-loading.is-error { border-color: rgb(243 112 33 / 55%); }

.qx-agent-device {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 22px 24px;
  border-color: rgb(243 112 33 / 55%);
  background: linear-gradient(100deg, rgb(243 112 33 / 11%), transparent 58%), var(--qx-color-cloud-high);
}
.qx-agent-device h2 { margin: 7px 0 0; font-size: 19px; letter-spacing: -.025em; }
.qx-agent-device p { margin: 5px 0 0; color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.6; }
.qx-agent-device button { flex: 0 0 auto; margin: 0; }
.qx-agent-device.is-approved { border-color: rgb(0 140 140 / 55%); background: var(--qx-color-marrs-soft); }
.qx-agent-check { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: var(--qx-color-marrs); color: #fff !important; font-size: 19px !important; }

.qx-agent-identity {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  padding: clamp(25px, 3vw, 38px);
  overflow: hidden;
  background:
    linear-gradient(110deg, rgb(0 140 140 / 11%), transparent 46%),
    radial-gradient(circle at 90% 0%, rgb(243 112 33 / 13%), transparent 34%),
    var(--qx-color-cloud-high);
}
.qx-agent-orbit { position: relative; display: grid; width: 72px; height: 72px; place-items: center; border: 1px solid rgb(0 140 140 / 50%); border-radius: 50%; }
.qx-agent-orbit::before { content: ""; position: absolute; inset: 8px -8px; border: 1px solid rgb(0 140 140 / 24%); border-radius: 50%; transform: rotate(28deg); }
.qx-agent-orbit i { width: 42px; height: 42px; border-radius: 50%; background: radial-gradient(circle at 64% 32%, #d7e58b, var(--qx-color-marrs) 42%, var(--qx-color-marrs-deep)); box-shadow: 0 9px 25px rgb(0 95 95 / 26%); }
.qx-agent-orbit b { position: absolute; color: #fff; font: 800 11px var(--qx-font-mono); }
.qx-agent-identity h2 { margin: 9px 0 0; font-size: clamp(27px, 3.2vw, 42px); line-height: 1; letter-spacing: -.05em; }
.qx-agent-identity p { margin: 8px 0 0; color: var(--qx-color-text-muted); font: 10px/1.5 var(--qx-font-mono); }
.qx-agent-identity dl { display: grid; grid-template-columns: repeat(3, minmax(68px, 1fr)); gap: 1px; margin: 0; padding: 0; background: var(--qx-color-line); }
.qx-agent-identity dl > div { min-width: 76px; padding: 14px; background: var(--qx-color-cloud); }
.qx-agent-identity dt { color: var(--qx-color-text-muted); font-size: 9px; }
.qx-agent-identity dd { margin: 8px 0 0; font: 800 22px/1 var(--qx-font-mono); }

.qx-agent-card { padding: clamp(24px, 3.2vw, 38px); }
.qx-agent-card > header,
.qx-agent-composer > header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--qx-color-line);
}
.qx-agent-card header h2,
.qx-agent-composer header h2 { max-width: 760px; margin: 10px 0 0; font-size: clamp(23px, 2.8vw, 36px); line-height: 1.08; letter-spacing: -.045em; }
.qx-agent-card header > b { color: var(--qx-color-orange); font: 700 10px var(--qx-font-mono); white-space: nowrap; }
.qx-agent-card header a { color: var(--qx-color-marrs-deep); font-size: 11px; font-weight: 800; white-space: nowrap; }
.qx-agent-card > p { max-width: 780px; margin: 16px 0 0; color: var(--qx-color-text-muted); font-size: 12px; line-height: 1.7; }

.qx-agent-command { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px; margin-top: 22px; border: 1px solid var(--qx-color-line); background: var(--qx-color-line); }
.qx-agent-command code { min-width: 0; padding: 16px; overflow: auto; background: var(--qx-agent-night); color: #dbebe7; font: 11px/1.6 var(--qx-font-mono); white-space: nowrap; }
.qx-agent-command button { min-width: 150px; min-height: 100%; margin: 0; border: 0; border-radius: 0; }
.qx-agent-keys { display: grid; gap: 1px; margin-top: 14px; background: var(--qx-color-line); }
.qx-agent-keys article { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 16px; background: var(--qx-color-cloud); }
.qx-agent-keys article > div { display: grid; grid-template-columns: minmax(130px, .75fr) minmax(150px, 1fr) minmax(160px, .8fr); gap: 18px; align-items: center; min-width: 0; }
.qx-agent-keys b { font-size: 11px; }
.qx-agent-keys code { overflow: hidden; color: var(--qx-color-marrs-deep); font: 10px var(--qx-font-mono); text-overflow: ellipsis; }
.qx-agent-keys small { color: var(--qx-color-text-muted); font-size: 9px; }
.qx-agent-keys button { min-height: 34px; margin: 0; padding: 0 11px; border-color: var(--qx-color-line); background: transparent; color: var(--qx-color-ink); }
.qx-agent-keys article.is-revoked { opacity: .48; }
.qx-agent-empty { padding: 18px; background: var(--qx-color-cloud); color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.6; }
.qx-agent-secondary { margin-top: 14px !important; border-color: var(--qx-color-line) !important; background: transparent !important; color: var(--qx-color-ink) !important; }
.qx-agent-secret { margin-top: 18px; padding: 20px; border: 1px solid rgb(243 112 33 / 52%); border-radius: var(--qx-radius-control); background: var(--qx-color-orange-soft); }
.qx-agent-secret > span { color: #9a3e0e; }
.qx-agent-secret h3 { margin: 8px 0 14px; font-size: 16px; }
.qx-agent-secret code { display: block; padding: 14px; overflow-wrap: anywhere; background: var(--qx-agent-night); color: #fff; font: 11px/1.6 var(--qx-font-mono); }
.qx-agent-secret > div { display: flex; gap: 8px; }
.qx-agent-secret button { margin-top: 12px; }
.qx-agent-secret button + button { border-color: rgb(0 47 47 / 20%); background: transparent; color: var(--qx-color-ink); }

.qx-agent-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; margin-top: 26px; background: var(--qx-color-line); }
.qx-agent-steps article { position: relative; min-height: 190px; padding: 20px 17px; background: var(--qx-color-cloud); }
.qx-agent-steps i { color: var(--qx-color-orange); font: normal 800 10px var(--qx-font-mono); }
.qx-agent-steps b { display: block; margin-top: 42px; font-size: 17px; }
.qx-agent-steps p { margin: 8px 0 0; color: var(--qx-color-text-muted); font-size: 10px; line-height: 1.6; }
.qx-agent-steps article:not(:last-child)::after { content: "→"; position: absolute; right: -8px; top: 22px; z-index: 2; color: var(--qx-color-marrs); font: 12px var(--qx-font-mono); }

.qx-agent-composer { padding: clamp(24px, 3.2vw, 38px); border-color: rgb(243 112 33 / 55%); box-shadow: var(--qx-shadow-raised); }
.qx-agent-composer header button { margin: 0; border-color: var(--qx-color-line); background: transparent; color: var(--qx-color-ink); }
.qx-agent-composer label { display: grid; gap: 8px; margin-top: 20px; color: var(--qx-color-ink); font-size: 11px; font-weight: 800; }
.qx-agent-composer input,
.qx-agent-composer textarea { width: 100%; min-height: 46px; padding: 13px 14px; border: 1px solid var(--qx-color-line); border-radius: var(--qx-radius-control); outline: 0; background: var(--qx-color-cloud); color: var(--qx-color-ink); font: 12px/1.6 var(--qx-font-sans); }
.qx-agent-composer textarea { min-height: 170px; resize: vertical; }
.qx-agent-composer input:focus,
.qx-agent-composer textarea:focus { border-color: var(--qx-focus-ring); box-shadow: 0 0 0 3px rgb(243 112 33 / 12%); }
.qx-agent-composer-footer { display: flex; align-items: center; justify-content: space-between; gap: 26px; margin-top: 18px; }
.qx-agent-composer-footer p { max-width: 650px; margin: 0; color: var(--qx-color-text-muted); font-size: 10px; line-height: 1.6; }
.qx-agent-composer-footer button { flex: 0 0 auto; margin: 0; }
.qx-agent-form-error { margin: 18px 0 0; padding: 12px 14px; border: 1px solid rgb(182 61 33 / 34%); background: rgb(182 61 33 / 8%); color: #b63d21; font-size: 12px; }
.qx-agent-composer label > small { display: block; color: var(--qx-color-text-muted); font-size: 10px; }
.qx-agent-composer label > small.is-valid { color: var(--qx-color-marrs); }

.qx-agent-topic-list { display: grid; gap: 1px; margin-top: 26px; background: var(--qx-color-line); }
.qx-agent-topic-list article { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 20px; background: var(--qx-color-cloud); }
.qx-agent-topic-list i { color: var(--qx-color-orange); font: normal 800 11px var(--qx-font-mono); }
.qx-agent-topic-list article span { color: var(--qx-color-marrs-deep); font: 700 9px var(--qx-font-mono); letter-spacing: .07em; text-transform: uppercase; }
.qx-agent-topic-list h3 { margin: 6px 0 0; font-size: 17px; letter-spacing: -.025em; }
.qx-agent-topic-list p { margin: 7px 0 0; color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.55; }
.qx-agent-topic-list small { display: block; margin-top: 8px; color: var(--qx-color-marrs-deep); font-size: 9px; }
.qx-agent-topic-list button { margin: 0; border-color: var(--qx-color-line); background: transparent; color: var(--qx-color-ink); }

.qx-agent-activity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.qx-agent-activity { display: grid; gap: 1px; margin-top: 20px; background: var(--qx-color-line); }
.qx-agent-activity > div:not(.qx-agent-empty) { display: grid; grid-template-columns: 78px minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 48px; padding: 10px 12px; background: var(--qx-color-cloud); }
.qx-agent-activity span { color: var(--qx-color-marrs-deep); font: 700 9px var(--qx-font-mono); }
.qx-agent-activity span.is-pending_review { color: #a84512; }
.qx-agent-activity b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.qx-agent-activity small { color: var(--qx-color-text-muted); font-size: 8px; white-space: nowrap; }

.qx-agent-security { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; padding: 1px; overflow: hidden; background: var(--qx-color-line); }
.qx-agent-security > div { padding: clamp(24px, 3vw, 34px); background: var(--qx-color-marrs-soft); }
.qx-agent-security > div.is-denied { background: var(--qx-agent-night); color: #eef4f1; }
.qx-agent-security h2 { margin: 12px 0 18px; font-size: clamp(18px, 2vw, 26px); line-height: 1.2; letter-spacing: -.035em; }
.qx-agent-security > div > div { display: flex; flex-wrap: wrap; gap: 6px; }
.qx-agent-security code { padding: 5px 7px; border: 1px solid rgb(0 95 95 / 24%); border-radius: 4px; font: 9px var(--qx-font-mono); }
.qx-agent-security .is-denied > span { color: #f39a64; }
.qx-agent-security .is-denied code { border-color: rgb(240 239 235 / 20%); color: #b8cac5; }

@media (hover: hover) and (pointer: fine) {
  .qx-agent-topic-list article:hover,
  .qx-agent-keys article:hover { background: #fffefa; }
}

@media (max-width: 760px) {
  .qx-member-network-page { padding-right: 14px !important; padding-left: 14px !important; }
  .qx-agent-device { align-items: flex-start; flex-direction: column; gap: 15px; }
  .qx-agent-device button { width: 100%; }
  .qx-agent-identity { grid-template-columns: auto 1fr; padding: 24px 18px; }
  .qx-agent-orbit { width: 56px; height: 56px; }
  .qx-agent-orbit i { width: 34px; height: 34px; }
  .qx-agent-identity dl { grid-column: 1 / -1; width: 100%; }
  .qx-agent-card > header,
  .qx-agent-composer > header { align-items: flex-start; flex-direction: column; gap: 10px; }
  .qx-agent-command { grid-template-columns: 1fr; }
  .qx-agent-command button { min-height: 44px; }
  .qx-agent-keys article { align-items: stretch; flex-direction: column; }
  .qx-agent-keys article > div { grid-template-columns: 1fr; gap: 5px; }
  .qx-agent-keys article button { width: 100%; }
  .qx-agent-secret > div { flex-direction: column; gap: 0; }
  .qx-agent-steps { grid-template-columns: 1fr; }
  .qx-agent-steps article { min-height: 0; padding: 16px 17px; }
  .qx-agent-steps b { margin-top: 16px; }
  .qx-agent-steps article:not(:last-child)::after { content: "↓"; top: auto; right: 16px; bottom: -8px; }
  .qx-agent-composer-footer { align-items: stretch; flex-direction: column; }
  .qx-agent-topic-list article { grid-template-columns: 32px minmax(0, 1fr); }
  .qx-agent-topic-list button { grid-column: 1 / -1; width: 100%; }
  .qx-agent-activity-grid,
  .qx-agent-security { grid-template-columns: 1fr; gap: 1px; }
  .qx-agent-activity > div:not(.qx-agent-empty) { grid-template-columns: 72px minmax(0, 1fr); }
  .qx-agent-activity small { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .qx-agent-orbit::before { transform: none; }
}

/* 20-qianx-content-phase.css */
/* QianX phase one: content intelligence first, collaboration network later. */

.qx-content-workbench {
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  padding-bottom: 128px !important;
}

.qx-content-workbench .qx-account-hero {
  min-height: 270px;
  padding: 58px 0 54px;
}

.qx-content-workbench .qx-account-hero h1 {
  max-width: 980px;
  font-size: clamp(48px, 5.2vw, 76px);
  line-height: 1.02;
  letter-spacing: -.068em;
}

.qx-content-workbench .qx-account-hero p {
  max-width: 820px;
  font-size: 14px;
}

.qx-workbench-feature {
  padding: 42px 0 46px;
  border-bottom: 1px solid var(--qx-color-line);
}

.qx-workbench-feature > header,
.qx-workbench-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.qx-workbench-feature > header span,
.qx-workbench-panel > header span,
.qx-workbench-membership span,
.qx-workbench-service span,
.qx-opinion-section > header span,
.qx-opinion-signal > div > span {
  color: var(--qx-color-marrs-deep);
  font: 800 10px/1.4 var(--qx-font-mono);
  letter-spacing: .1em;
}

.qx-workbench-feature > header small {
  color: var(--qx-color-text-muted);
  font-size: 11px;
}

.qx-workbench-feature > div {
  display: grid;
  grid-template-columns: minmax(220px, .56fr) minmax(0, 1.44fr);
  gap: clamp(32px, 5vw, 68px);
  margin-top: 22px;
}

.qx-workbench-feature-mark {
  display: flex;
  min-height: 254px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 26px;
  background:
    linear-gradient(155deg, transparent 0 48%, rgb(247 246 243 / 82%) 48.2% 50%, transparent 50.2%),
    linear-gradient(30deg, rgb(0 140 140 / 8%), transparent 66%),
    var(--qx-color-marrs-deep);
  color: var(--qx-color-cloud-high);
}

.qx-workbench-feature-mark b { font-size: clamp(54px, 6vw, 82px); line-height: .85; letter-spacing: -.08em; }
.qx-workbench-feature-mark span { margin-top: 10px; color: rgb(247 246 243 / 66%); font: 700 9px var(--qx-font-mono); letter-spacing: .14em; }
.qx-workbench-feature article { align-self: end; }
.qx-workbench-feature h2 { max-width: 760px; margin: 0; font-size: clamp(30px, 3.2vw, 48px); line-height: 1.15; letter-spacing: -.05em; }
.qx-workbench-feature p { max-width: 760px; margin: 18px 0 0; color: var(--qx-color-text-muted); font-size: 13px; line-height: 1.75; }
.qx-workbench-feature footer { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-top: 30px; padding-top: 17px; border-top: 1px solid var(--qx-color-line); }
.qx-workbench-feature footer span { color: var(--qx-color-text-muted); font-size: 10px; }
.qx-workbench-feature footer button { min-height: 42px; margin: 0; border: 0; background: transparent; color: var(--qx-color-orange); font-weight: 800; }

.qx-workbench-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  border-bottom: 1px solid var(--qx-color-line);
}

.qx-workbench-panel {
  min-width: 0;
  padding: 36px 38px 38px 0;
  border-right: 1px solid var(--qx-color-line);
  border-bottom: 1px solid var(--qx-color-line);
}

.qx-workbench-panel:nth-child(even) { padding-right: 0; padding-left: 38px; border-right: 0; }
.qx-workbench-panel.is-weekly { grid-column: 1 / -1; padding-right: 0; border-right: 0; border-bottom: 0; }
.qx-workbench-panel > header b { color: var(--qx-color-marrs-deep); font: 750 10px var(--qx-font-mono); }
.qx-workbench-panel h2 { max-width: 720px; margin: 28px 0 0; font-size: clamp(22px, 2.2vw, 31px); line-height: 1.22; letter-spacing: -.04em; }
.qx-workbench-panel p { max-width: 720px; margin: 12px 0 0; color: var(--qx-color-text-muted); font-size: 12px; line-height: 1.7; }
.qx-workbench-panel > button { margin-top: 24px; border: 0; background: transparent; color: var(--qx-color-marrs-deep); font-weight: 800; }
.qx-workbench-panel ol { margin: 24px 0 0; padding: 0; border-top: 1px solid var(--qx-color-line); list-style: none; }
.qx-workbench-panel li { border-bottom: 1px solid var(--qx-color-line); }
.qx-workbench-panel li button { display: flex; width: 100%; min-height: 56px; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 0; border: 0; background: transparent; color: var(--qx-color-ink); text-align: left; }
.qx-workbench-panel li span { font-size: 12px; font-weight: 700; }
.qx-workbench-panel li small { color: var(--qx-color-text-muted); font-size: 9px; white-space: nowrap; }
.qx-workbench-empty { min-height: 128px; }

.qx-workbench-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 26px;
  border-top: 1px solid var(--qx-color-line);
  border-bottom: 1px solid var(--qx-color-line);
}

.qx-workbench-metrics span {
  display: flex;
  min-height: 72px;
  align-items: baseline;
  gap: 7px;
  padding: 18px 14px;
  border-right: 1px solid var(--qx-color-line);
  color: var(--qx-color-text-muted);
  font-size: 10px;
}
.qx-workbench-metrics span:first-child { padding-left: 0; }
.qx-workbench-metrics span:last-child { border-right: 0; }
.qx-workbench-metrics b { color: var(--qx-color-ink); font-size: 25px; letter-spacing: -.04em; }
.qx-workbench-actions { margin-top: 18px !important; }
.qx-workbench-actions li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; min-height: 52px; }
.qx-workbench-actions i { color: var(--qx-color-orange); font: 800 10px var(--qx-font-mono); }
.qx-workbench-actions span { font-size: 12px; line-height: 1.6; }

.qx-locked-delivery {
  margin: 28px 0 8px;
  padding: 22px 0;
  border-top: 1px solid var(--qx-color-line);
  border-bottom: 1px solid var(--qx-color-line);
}
.qx-locked-delivery > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.qx-locked-delivery > header span { color: var(--qx-color-marrs-deep); font: 800 9px var(--qx-font-mono); letter-spacing: .12em; }
.qx-locked-delivery > header b { color: var(--qx-color-text-muted); font-size: 9px; }
.qx-locked-delivery > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 20px; }
.qx-locked-delivery article { min-width: 0; padding: 0 18px; border-right: 1px solid var(--qx-color-line); }
.qx-locked-delivery article:first-child { padding-left: 0; }
.qx-locked-delivery article:last-child { padding-right: 0; border-right: 0; }
.qx-locked-delivery i { color: var(--qx-color-orange); font: 800 9px var(--qx-font-mono); }
.qx-locked-delivery h2 { margin: 8px 0 0; font-size: 15px; }
.qx-locked-delivery p { margin: 6px 0 0; color: var(--qx-color-text-muted); font-size: 10px; line-height: 1.55; }

.qx-reading-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, .46fr);
  gap: 32px;
  align-items: end;
  margin: 34px 0 10px;
  padding: 26px 0;
  border-top: 1px solid var(--qx-color-line);
  border-bottom: 1px solid var(--qx-color-line);
}
.qx-reading-action span { color: var(--qx-color-marrs-deep); font: 800 9px var(--qx-font-mono); letter-spacing: .12em; }
.qx-reading-action h2 { margin: 10px 0 0; font-size: 24px; letter-spacing: -.04em; }
.qx-reading-action p { margin: 8px 0 0; color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.65; }
.qx-reading-action aside { display: grid; gap: 8px; }
.qx-reading-action aside b { color: var(--qx-color-text-muted); font-size: 10px; }
.qx-reading-action aside button { min-height: 40px; border: 1px solid var(--qx-color-line); background: transparent; color: var(--qx-color-marrs-deep); font-size: 11px; font-weight: 800; }
.qx-reading-action aside button:first-of-type { border-color: var(--qx-color-orange); background: var(--qx-color-orange); color: #fff; }

.qx-workbench-membership,
.qx-workbench-service {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 42px;
  padding: 34px 0;
  border-bottom: 1px solid var(--qx-color-line);
}

.qx-workbench-membership h2,
.qx-workbench-service h3 { margin: 10px 0 0; font-size: clamp(22px, 2.2vw, 32px); letter-spacing: -.04em; }
.qx-workbench-membership p,
.qx-workbench-service p { max-width: 760px; margin: 8px 0 0; color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.65; }
.qx-workbench-membership > button,
.qx-workbench-service > button { flex: 0 0 auto; min-height: 44px; margin: 0; }
.qx-workbench-membership > button { border-color: var(--qx-color-orange); background: var(--qx-color-orange); color: #fff; }
.qx-workbench-service > button { border-color: var(--qx-color-line); background: transparent; color: var(--qx-color-marrs-deep); }

/* Editorial Circle: a read-only opinion field during phase one. */
#app.app-shell[data-page="circle"] .ss-circle-page {
  width: min(100%, 1320px);
  max-width: 1320px;
  padding: 56px 38px 122px;
}

.qx-opinion-topics {
  display: flex;
  gap: 0;
  margin: 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--qx-color-line);
}

.qx-opinion-topics :is(button, span) {
  flex: 0 0 auto;
  min-width: 118px;
  min-height: 52px;
  padding: 0 18px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--qx-color-text-muted);
  font-size: 12px;
  font-weight: 700;
}
.qx-opinion-topics span { display: inline-flex; align-items: center; justify-content: center; }
.qx-opinion-topics .is-active { border-bottom-color: var(--qx-color-marrs-deep); color: var(--qx-color-ink); }

.qx-opinion-signal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: clamp(34px, 5vw, 76px);
  padding: 40px 0;
  border-bottom: 1px solid var(--qx-color-line);
}
.qx-opinion-signal h2 { max-width: 900px; margin: 14px 0 0; font-size: clamp(30px, 3.5vw, 52px); line-height: 1.12; letter-spacing: -.052em; }
.qx-opinion-signal p { max-width: 820px; margin: 15px 0 0; color: var(--qx-color-text-muted); font-size: 13px; line-height: 1.7; }
.qx-opinion-signal aside { display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding-left: 24px; border-left: 1px solid var(--qx-color-line); }
.qx-opinion-signal aside :is(small, time) { color: var(--qx-color-text-muted); font-size: 10px; }
.qx-opinion-signal aside button { align-self: flex-start; margin: 8px 0 0; border: 0; background: transparent; color: var(--qx-color-marrs-deep); font-weight: 800; }

.qx-opinion-section { padding-top: 42px; }
.qx-opinion-section > header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr); gap: 42px; align-items: end; padding-bottom: 24px; border-bottom: 1px solid var(--qx-color-line); }
.qx-opinion-section > header h2 { max-width: 800px; margin: 10px 0 0; font-size: clamp(26px, 3vw, 42px); line-height: 1.14; letter-spacing: -.048em; }
.qx-opinion-section > header p { margin: 0; color: var(--qx-color-text-muted); font-size: 11px; line-height: 1.7; }
.qx-opinion-view { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; padding: 28px 0; border-bottom: 1px solid var(--qx-color-line); }
.qx-opinion-index { display: flex; flex-direction: column; gap: 9px; padding-top: 3px; }
.qx-opinion-index b { color: var(--qx-color-orange); font: 800 11px var(--qx-font-mono); }
.qx-opinion-index span { color: var(--qx-color-marrs-deep); font-size: 11px; font-weight: 800; }
.qx-opinion-copy > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.qx-opinion-copy > header > div { display: flex; align-items: center; gap: 12px; }
.qx-opinion-copy > header p { display: grid; gap: 3px; margin: 0; }
.qx-opinion-copy > header p b { font-size: 12px; }
.qx-opinion-copy > header time { color: var(--qx-color-text-muted); font-size: 9px; }
.qx-opinion-copy > small { display: block; margin-top: 20px; color: var(--qx-color-marrs-deep); font: 700 10px var(--qx-font-mono); }
.qx-opinion-copy h2 { max-width: 980px; margin: 10px 0 0; font-size: clamp(20px, 2.05vw, 29px); line-height: 1.5; letter-spacing: -.025em; }
.qx-opinion-copy footer { display: flex; justify-content: space-between; gap: 24px; margin-top: 18px; padding-top: 12px; border-top: 1px solid rgb(0 95 95 / 12%); }
.qx-opinion-copy footer :is(span, b, a) { color: var(--qx-color-text-muted); font-size: 9px; line-height: 1.55; }
.qx-opinion-copy footer b { max-width: 520px; color: var(--qx-color-marrs-deep); font-weight: 650; text-align: right; }
.qx-opinion-copy footer a { color: var(--qx-color-marrs-deep); font-weight: 800; text-decoration: none; }
.qx-opinion-view.is-ai .qx-opinion-index span { color: #a84512; }
.qx-opinion-section > .ss-circle-load { display: block; width: min(100%, 420px); min-height: 46px; margin: 30px auto 0; }

@media (hover: hover) and (pointer: fine) {
  .qx-workbench-panel li button:hover,
  .qx-opinion-topics button:hover { color: var(--qx-color-orange); }
}

@media (max-width: 760px) {
  .qx-content-workbench { padding-right: 16px !important; padding-left: 16px !important; }
  .qx-content-workbench .qx-account-hero { min-height: 0; padding: 30px 0 38px; }
  .qx-content-workbench .qx-account-hero h1 { font-size: clamp(39px, 12vw, 54px); }
  .qx-content-workbench .qx-account-hero > button { width: 100%; margin-top: 22px; }
  .qx-workbench-feature > div { grid-template-columns: 1fr; gap: 24px; }
  .qx-workbench-feature-mark { min-height: 170px; }
  .qx-workbench-feature footer { align-items: flex-start; flex-direction: column; gap: 6px; }
  .qx-workbench-grid { grid-template-columns: 1fr; }
  .qx-workbench-panel,
  .qx-workbench-panel:nth-child(even),
  .qx-workbench-panel.is-weekly { grid-column: auto; padding: 30px 0; border-right: 0; border-bottom: 1px solid var(--qx-color-line); }
  .qx-workbench-membership,
  .qx-workbench-service { align-items: stretch; flex-direction: column; gap: 20px; padding: 30px 0; }
  .qx-workbench-membership > button,
  .qx-workbench-service > button { width: 100%; }
  .qx-workbench-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qx-workbench-metrics span:nth-child(2) { border-right: 0; }
  .qx-workbench-metrics span:nth-child(-n + 2) { border-bottom: 1px solid var(--qx-color-line); }
  .qx-workbench-metrics span:nth-child(3) { padding-left: 0; }
  .qx-locked-delivery > header { align-items: flex-start; flex-direction: column; gap: 6px; }
  .qx-locked-delivery > div { grid-template-columns: 1fr; }
  .qx-locked-delivery article,
  .qx-locked-delivery article:first-child,
  .qx-locked-delivery article:last-child { padding: 14px 0; border-right: 0; border-bottom: 1px solid var(--qx-color-line); }
  .qx-locked-delivery article:last-child { border-bottom: 0; }
  .qx-reading-action { grid-template-columns: 1fr; gap: 20px; }

  #app.app-shell[data-page="circle"] .ss-circle-page { padding: 30px 16px 106px; }
  .qx-opinion-topics { margin-right: -16px; margin-left: -16px; padding-right: 12px; padding-left: 12px; }
  .qx-opinion-topics :is(button, span) { min-width: auto; padding: 0 13px; }
  .qx-opinion-signal { grid-template-columns: 1fr; gap: 24px; padding: 32px 0; }
  .qx-opinion-signal h2 { font-size: clamp(29px, 9vw, 40px); }
  .qx-opinion-signal aside { padding: 18px 0 0; border-top: 1px solid var(--qx-color-line); border-left: 0; }
  .qx-opinion-section > header { grid-template-columns: 1fr; gap: 12px; }
  .qx-opinion-view { grid-template-columns: 1fr; gap: 12px; padding: 26px 0; }
  .qx-opinion-index { flex-direction: row; align-items: center; }
  .qx-opinion-copy > header { align-items: flex-start; }
  .qx-opinion-copy h2 { font-size: 20px; }
  .qx-opinion-copy footer { align-items: flex-start; flex-direction: column; gap: 6px; }
  .qx-opinion-copy footer b { text-align: left; }
}