:root {
  --page-max-width: 1440px;
  --page-padding-desktop: 64px;
  --page-padding-tablet: 40px;
  --page-padding-mobile: 20px;
  --font-display: clamp(48px, 4.8vw, 72px);
  --font-section-title: clamp(38px, 3.4vw, 56px);
  --font-subsection-title: clamp(28px, 2.4vw, 40px);
  --font-card-title: clamp(18px, 1.5vw, 24px);
  --font-body-large: clamp(17px, 1.25vw, 20px);
  --font-body: 16px;
  --font-caption: 13px;

  /* 板块圆角：桌面 52px */
  --radius-section: 52px;
  --radius-card: 24px;
  --radius-control: 16px;
  --radius-small: 12px;
  --radius-pill: 999px;

  /* 板块间距：桌面 128px */
  --section-gap: 128px;

  /* 创坛往期真实背景样式（用于复用） */
  --archive-section-background:
    radial-gradient(circle at 9% 20%, rgba(255,139,189,.22), transparent 32%),
    radial-gradient(circle at 82% 12%, rgba(119,88,246,.25), transparent 38%),
    radial-gradient(circle at 62% 92%, rgba(91,176,255,.15), transparent 36%),
    linear-gradient(135deg, #fffafd 0%, #f6f1ff 56%, #eef6ff 100%);

  /* 创坛往期真实边框颜色 */
  --archive-section-border: rgba(116,87,246,.18);

  /* 创坛往期真实阴影 */
  --archive-section-shadow: 0 26px 78px rgba(70,51,128,.12);

  /* 网格纹理 */
  --grid-size: 48px;
  --grid-color: rgba(116,87,246,.047);

  --ui-text: #17152b;
  --ui-body: #625e70;
  --ui-muted: #918c9f;
  --ui-purple: #7457f6;
  --ui-purple-soft: #f3f0ff;
  --ui-border: #e8e3f5;
  --ui-card: rgba(255, 255, 255, .78);
  --ui-transition: 220ms;
}

/* iPad和平板端 */
@media (min-width: 768px) and (max-width: 1199px) {
  :root {
    --radius-section: 40px;
    --section-gap: 80px;
    --grid-size: 40px;
  }
}

/* 手机端 */
@media (max-width: 767px) {
  :root {
    --radius-section: 28px;
    --section-gap: 48px;
    --grid-size: 36px;
  }
}

/* ===== 公共板块表面样式 ===== */
/* 主页面容器：控制板块之间的间距 */
.home-section-stack {
  display: flex;
  flex-direction: column;
  gap: var(--section-gap);
}

/* 板块表面类：统一背景、边框、圆角、阴影、网格纹理 */
.section-surface {
  position: relative;
  width: min(calc(100% - var(--page-padding-desktop) * 2), var(--page-max-width));
  max-width: var(--page-max-width);
  margin-inline: auto;
  border: 1px solid var(--archive-section-border);
  border-radius: var(--radius-section);
  background: var(--archive-section-background);
  box-shadow: var(--archive-section-shadow);
  overflow: hidden;
}

/* 板块网格纹理（伪元素） */
.section-surface::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--grid-color) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-color) 1px, transparent 1px);
  background-size: var(--grid-size) var(--grid-size);
  mask-image: linear-gradient(90deg, #000, rgba(0,0,0,.65) 60%, transparent);
  border-radius: inherit;
}

/* 确保内容在纹理之上 */
.section-surface > * {
  position: relative;
  z-index: 1;
}

/* AI COMMUNITY PICKS：沿用原灵感流容器和三列纵向轨道 */
.creator-inspiration-feed[hidden]{display:none!important}
.creator-inspiration-feed .inspiration-panel{padding:30px 32px}
.creator-inspiration-feed .inspiration-heading{height:184px;display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.78fr);gap:30px;align-items:start}
.creator-inspiration-feed .inspiration-heading h2{font-size:clamp(38px,3.25vw,56px);letter-spacing:-.055em;margin:12px 0 10px}
.creator-inspiration-feed .inspiration-heading p{font-size:16px;line-height:1.65}
.ai-feed-tools{display:flex;flex-direction:column;align-items:stretch;gap:11px;padding-top:3px}
.ai-feed-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px}
.ai-feed-actions .publish-idea-trigger{height:44px;padding:0 18px;font-size:13px;background:#7457f6;box-shadow:none}
.ai-feed-categories{display:flex;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.ai-feed-categories button{height:34px;padding:0 13px;border:1px solid #e8e3f5;border-radius:999px;background:rgba(255,255,255,.74);color:#777486;font-size:12px;cursor:pointer}
.ai-feed-categories button.is-active{background:#17152b;border-color:#17152b;color:#fff}
.ai-feed-search{height:42px;display:flex;align-items:center;gap:9px;padding:0 14px;border:1px solid #e8e3f5;border-radius:14px;background:rgba(255,255,255,.76);color:#777486}
.ai-feed-search input{width:100%;border:0;outline:0;background:transparent;color:#17152b;font:inherit;font-size:13px}
.ai-feed-demo-note{margin:0;text-align:right;color:#9994a8;font-size:11px}
.creator-inspiration-feed .feed-columns{height:calc(100% - 184px);gap:20px}
.creator-inspiration-feed .feed-track,.creator-inspiration-feed .feed-set{gap:16px}
.creator-inspiration-feed .column-1 .feed-track{animation-duration:42s}
.creator-inspiration-feed .column-2 .feed-track{animation-duration:49s}
.creator-inspiration-feed .column-3 .feed-track{animation-duration:55s}
.feed-filtering .feed-track{animation-play-state:paused!important}
.ai-feed-card{--card-accent:#7457f6;min-height:260px;padding:24px;border:1px solid #e8e3f5;border-radius:24px;background:rgba(255,255,255,.78);box-shadow:0 14px 34px rgba(70,51,128,.07);display:flex;flex-direction:column;gap:15px;color:#17152b;transition:transform .25s,border-color .25s,box-shadow .25s}
.ai-feed-card:hover,.ai-feed-card:focus-within{transform:translateY(-3px);border-color:color-mix(in srgb,var(--card-accent) 34%,#e8e3f5);box-shadow:0 20px 42px rgba(70,51,128,.12)}
.ai-feed-card header{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:center}
.ai-feed-rank,.ai-feed-category,.ai-feed-status{display:inline-flex;align-items:center;width:max-content;padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--card-accent) 10%,white);color:color-mix(in srgb,var(--card-accent) 78%,#17152b);font-size:11px;font-weight:700}
.ai-feed-status{justify-self:end;background:#edf9f4;color:#39a979}
.ai-feed-logo{width:56px;height:56px;border-radius:17px;background:color-mix(in srgb,var(--card-accent) 12%,white);color:var(--card-accent);display:grid;place-items:center;font-size:25px;font-weight:800}
.ai-feed-card h3{margin:0;font-size:24px;letter-spacing:-.03em}
.ai-feed-card>p{margin:0;color:#615d70;font-size:14px;line-height:1.65}
.ai-feed-reason{padding:12px 14px;border-radius:14px;background:rgba(243,240,255,.78);color:#777486;font-size:13px;line-height:1.55}
.ai-feed-card footer{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:14px}
.ai-feed-count{color:#777486;font-size:12px}.ai-feed-count strong{display:block;color:#17152b;font-size:22px;line-height:1.05}
.ai-feed-recommend{min-width:118px;height:44px;padding:0 17px;border:0;border-radius:14px;background:#7457f6;color:#fff;font-size:13px;font-weight:800;cursor:pointer;transition:transform .18s,background .18s}
.ai-feed-recommend:hover{background:#6244ec;transform:translateY(-1px)}
.ai-feed-recommend:active{transform:scale(.98)}
.ai-feed-recommend:focus-visible{outline:3px solid rgba(116,87,246,.28);outline-offset:3px}
.ai-feed-recommend[disabled]{background:#eeeaf6;color:#918c9d;cursor:default;transform:none}
.ai-feed-card.is-just-recommended{border-color:#39a979;animation:recommendFlash 1.1s ease 2}
.ai-feed-empty{grid-column:1/-1;display:grid;place-items:center;min-height:240px;border:1px dashed #ddd6ee;border-radius:24px;color:#777486;background:rgba(255,255,255,.48)}
@keyframes recommendFlash{50%{box-shadow:0 0 0 7px rgba(57,169,121,.1),0 20px 42px rgba(70,51,128,.12)}}
@media(max-width:900px){
  .creator-inspiration-feed .inspiration-heading{height:228px;grid-template-columns:1fr;gap:16px}
  .creator-inspiration-feed .feed-columns{height:calc(100% - 228px)}
  .ai-feed-tools{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .ai-feed-actions{justify-content:flex-start}.ai-feed-categories{justify-content:flex-start;grid-column:1/-1}.ai-feed-demo-note{text-align:left}
  .ai-feed-card{min-height:240px;padding:20px}
}
@media(max-width:620px){
  .creator-inspiration-feed{height:760px!important}
  .creator-inspiration-feed .inspiration-panel{padding:22px 16px}
  .creator-inspiration-feed .inspiration-heading{height:292px;display:block}
  .creator-inspiration-feed .inspiration-heading h2{font-size:34px;margin:9px 0 8px}
  .creator-inspiration-feed .inspiration-heading p{font-size:14px}
  .ai-feed-tools{display:flex;gap:9px;margin-top:14px}.ai-feed-actions{justify-content:stretch}.ai-feed-actions .publish-idea-trigger{width:100%;height:42px;font-size:12px}
  .ai-feed-categories{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:2px}.ai-feed-categories button{flex:0 0 auto}
  .ai-feed-demo-note{font-size:10px}.creator-inspiration-feed .feed-columns{height:calc(100% - 292px)}
  .ai-feed-card{min-height:220px;padding:20px;border-radius:22px}.ai-feed-card h3{font-size:22px}.ai-feed-card>p{font-size:13px}.ai-feed-logo{width:50px;height:50px}
}
@media(prefers-reduced-motion:reduce){.ai-feed-card.is-just-recommended{animation:none}.creator-inspiration-feed .feed-track{animation:none!important}}

html { overflow-x: clip; }
body { background: #faf9ff; color: var(--ui-text); }
*, *::before, *::after { box-sizing: border-box; }
h1, h2, h3 { text-wrap: balance; overflow-wrap: break-word; word-break: normal; }
p { text-wrap: pretty; }
button, a { transition-duration: var(--ui-transition); }
button { white-space: nowrap; }

.page-container,
.footer-container {
  width: min(calc(100% - var(--page-padding-desktop) * 2), var(--page-max-width));
  margin-inline: auto;
}

/* 首页唯一 L1：AI 智能匹配首屏 */
.ai-banner.home-primary-banner {
  width: min(calc(100% - var(--page-padding-desktop) * 2), var(--page-max-width));
  min-height: clamp(680px, 78vh, 820px);
  margin: 88px auto 0;
  padding: clamp(72px, 8vh, 112px) clamp(40px, 5vw, 72px);
  border: 1px solid var(--ui-border);
  border-radius: var(--radius-section);
  gap: 6%;
  background:
    radial-gradient(circle at 82% 24%, rgba(154,124,255,.12), transparent 36%),
    radial-gradient(circle at 18% 22%, rgba(255,139,184,.08), transparent 34%),
    #faf9ff;
}
.home-primary-banner .banner-copy { width: 44%; max-width: 680px; }
.home-primary-banner .banner-copy h2 {
  max-width: 680px;
  margin: 22px 0 20px;
  font-size: clamp(52px, 4.6vw, 72px);
  line-height: 1.08;
  letter-spacing: -.04em;
}
.home-primary-banner .banner-copy p {
  max-width: 620px;
  font-size: var(--font-body-large);
  line-height: 1.7;
}
.home-primary-banner .banner-orbit-visual {
  width: min(50%, 620px);
  height: auto;
  aspect-ratio: 1;
}
.home-primary-banner .banner-copy .voice-entry-button {
  min-height: 52px;
  padding-inline: 24px;
  border-radius: var(--radius-control);
  font-size: 16px;
  box-shadow: 0 10px 24px rgba(116,87,246,.16);
}
.home-primary-banner .banner-copy .banner-text-entry {
  min-height: 44px;
  margin-top: 6px;
  font-size: 14px;
}
.banner-examples {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 760px;
  margin-top: 22px;
}
.banner-examples button {
  min-width: 0;
  min-height: 64px;
  padding: 14px 18px;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--radius-control) !important;
  background: var(--ui-card) !important;
  color: #262238 !important;
  box-shadow: 0 8px 24px rgba(57,45,94,.05) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.35;
  white-space: normal;
}
.banner-examples button:first-child { background: var(--ui-purple-soft) !important; }
.home-primary-banner .banner-examples{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-primary-banner .banner-examples [data-open-roadshow]{grid-column:1/2}
@media(max-width:767px){.home-primary-banner .banner-examples{grid-template-columns:1fr}.home-primary-banner .banner-examples [data-open-roadshow]{grid-column:auto}}
.banner-examples button:hover {
  transform: translateY(-2px);
  border-color: #bcb0ed !important;
  box-shadow: 0 12px 28px rgba(57,45,94,.08) !important;
}

/* 同级内容板块：共同宽度、圆角、节奏和标题层级 */
.recommendation-hub,
.creator-inspiration-feed,
.guest-preview {
  width: min(calc(100% - var(--page-padding-desktop) * 2), var(--page-max-width));
  max-width: var(--page-max-width);
  margin: clamp(88px, 8vw, 120px) auto 0;
  border: 1px solid var(--ui-border);
  border-radius: var(--radius-section);
}
.recommendation-hub {
  min-height: 620px;
  padding: clamp(64px, 7vw, 96px) clamp(32px, 5vw, 72px);
  background: radial-gradient(circle at 88% 18%, rgba(116,87,246,.07), transparent 34%), #faf9ff;
  box-shadow: 0 20px 60px rgba(70,54,120,.05);
}
.recommendation-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 32px;
  margin-bottom: clamp(36px, 4vw, 56px);
}
.recommendation-kicker,
.inspiration-kicker,
.guest-preview-kicker {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.recommendation-hero h2,
.inspiration-heading h2,
.guest-preview-copy h2 {
  max-width: 720px;
  font-size: var(--font-section-title);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.035em;
}
.recommendation-hero p,
.inspiration-heading p,
.guest-preview-copy p {
  max-width: 620px;
  color: var(--ui-body);
  font-size: var(--font-body);
  line-height: 1.7;
}
.recommendation-actions button,
.guest-preview-cta {
  min-height: 52px;
  height: 52px;
  padding-inline: 24px;
  border-radius: var(--radius-control);
  font-size: 16px;
  font-weight: 700;
}
/* 推荐榜只保留该板块唯一的核心动作，功能本身仍由原按钮处理。 */
.home-key-entries { display: none; }
.recommendation-ranking { gap: 16px; }
.recommendation-card {
  min-height: 150px;
  grid-template-columns: 56px 88px minmax(0, 1fr) 176px;
  gap: 20px;
  padding: 28px 32px;
  border-radius: var(--radius-card);
  box-shadow: 0 10px 28px rgba(72,55,125,.045);
  transition: transform var(--ui-transition), box-shadow var(--ui-transition), border-color var(--ui-transition);
}
.recommend-logo { width: 64px; height: 64px; border-radius: var(--radius-control); }
.recommend-main h3 { font-size: 24px; line-height: 1.35; }
.recommend-main > p { font-size: 17px; line-height: 1.6; }
.recommend-reason { font-size: 14px; line-height: 1.55; }
.recommend-count b { font-size: clamp(28px, 2.2vw, 38px); }
.recommend-side a, .recommend-side button {
  min-height: 44px;
  border-radius: var(--radius-small);
  font-size: 14px;
}

/* 保留原三列循环滚动，仅统一外框、标题与密度。 */
.creator-inspiration-feed {
  height: 790px;
  padding: 32px;
  background: radial-gradient(circle at 12% 25%, rgba(255,221,242,.25), transparent 30%), radial-gradient(circle at 86% 18%, rgba(169,135,255,.10), transparent 34%), #faf9ff;
}
.creator-inspiration-feed .inspiration-panel {
  max-width: none;
  padding: 32px;
  border-color: transparent;
  border-radius: calc(var(--radius-section) - 8px);
  background: rgba(255,255,255,.56);
  box-shadow: none;
}
.inspiration-heading { height: 132px; }
.inspiration-heading h2 { margin: 12px 0 12px; }
.inspiration-heading p { font-size: var(--font-body); }
.feed-columns { height: calc(100% - 132px); gap: 20px; }
.inspiration-card { border-radius: var(--radius-card); }
.creator-live, .feed-actions a, .publish-idea-trigger { min-height: 44px; height: 44px; padding-inline: 16px; font-size: 12px; }

.guest-preview {
  min-height: 620px;
  padding: clamp(64px, 7vw, 96px) clamp(32px, 5vw, 72px);
  grid-template-columns: minmax(280px, .85fr) minmax(520px, 1.35fr);
  background: radial-gradient(circle at 86% 18%, rgba(119,103,245,.08), transparent 38%), #faf9ff;
  box-shadow: 0 18px 52px rgba(45,34,90,.035);
}
.guest-preview-copy h2 { margin: 24px 0 20px; }
.guest-preview-count strong { font-size: clamp(64px, 7vw, 104px); }
.guest-preview-copy p { margin-top: 24px; }
.guest-preview-cta { border-radius: var(--radius-control); }

.site-footer { margin-top: clamp(88px, 8vw, 120px); padding-inline: 0; }
.site-footer .footer-container { width: min(calc(100% - var(--page-padding-desktop) * 2), var(--page-max-width)); }

@media (max-width: 1279px) {
  .page-container,
  .footer-container,
  .ai-banner.home-primary-banner,
  .recommendation-hub,
  .creator-inspiration-feed,
  .guest-preview,
  .site-footer .footer-container {
    width: calc(100% - var(--page-padding-tablet) * 2);
  }
  .ai-banner.home-primary-banner { min-height: 700px; padding-inline: 40px; }
  .home-primary-banner .banner-copy h2 { font-size: clamp(44px, 5.8vw, 58px); }
  .banner-examples { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .banner-examples button:last-child { grid-column: 1 / -1; max-width: calc(50% - 6px); }
  .recommendation-card { grid-template-columns: 48px 72px minmax(0, 1fr); }
  .recommend-side { grid-column: 2 / -1; grid-template-columns: auto 1fr 1fr; align-items: center; }
  .recommend-count { grid-column: auto; text-align: left; }
  .guest-preview { grid-template-columns: minmax(260px,.72fr) minmax(400px,1fr); }
}

@media (max-width: 1023px) {
  .ai-banner.home-primary-banner { display: grid; min-height: auto; padding-block: 80px 56px; }
  .home-primary-banner .banner-copy { width: 100%; max-width: 680px; }
  .home-primary-banner .banner-orbit-visual { width: min(100%, 520px); margin: 20px auto 0; }
  .guest-preview { grid-template-columns: 1fr; }
  .guest-constellation { min-height: auto; }
}

@media (max-width: 767px) {
  :root { --font-section-title: clamp(32px, 9vw, 40px); }
  .page-container,
  .footer-container,
  .ai-banner.home-primary-banner,
  .recommendation-hub,
  .creator-inspiration-feed,
  .guest-preview,
  .site-footer .footer-container {
    width: calc(100% - var(--page-padding-mobile) * 2);
  }
  .ai-banner.home-primary-banner {
    margin-top: 78px;
    padding: 52px 18px 36px;
    border-radius: 28px;
    text-align: left;
  }
  .home-primary-banner .banner-copy { text-align: left; }
  .home-primary-banner .banner-copy h2 { font-size: clamp(36px, 10vw, 46px); line-height: 1.12; }
  .home-primary-banner .banner-copy p { font-size: 16px; }
  .home-primary-banner .banner-copy .voice-entry-button { width: 100%; justify-content: center; }
  .home-primary-banner .banner-copy .banner-text-entry { width: 100%; text-align: center; }
  .banner-examples { grid-template-columns: 1fr; }
  .banner-examples button, .banner-examples button:last-child { min-height: 56px; max-width: none; grid-column: auto; }
  .home-primary-banner .banner-orbit-visual { width: min(100%, 390px); opacity: .88; }

  .recommendation-hub,
  .guest-preview {
    min-height: auto;
    margin-top: 72px;
    padding: 44px 18px;
    border-radius: 28px;
  }
  .recommendation-hero { display: block; margin-bottom: 36px; }
  .recommendation-hero p, .inspiration-heading p, .guest-preview-copy p { font-size: 15px; }
  .recommendation-actions { margin-top: 24px; }
  .recommendation-actions button { width: 100%; }
  .recommendation-card {
    min-height: 0;
    grid-template-columns: 40px 56px minmax(0, 1fr);
    gap: 12px;
    padding: 20px 16px;
    border-radius: 22px;
  }
  .recommend-logo { width: 52px; height: 52px; }
  .recommend-main { grid-column: 1 / -1; }
  .recommend-main h3 { font-size: 20px; }
  .recommend-main > p { font-size: 15px; white-space: normal; }
  .recommend-side { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .recommend-count { grid-column: 1 / -1; }
  .recommend-side a, .recommend-side button { min-width: 0; width: 100%; }

  .creator-inspiration-feed { width: calc(100% - 24px); height: 650px; margin-top: 72px; padding: 12px; border-radius: 28px; }
  .creator-inspiration-feed .inspiration-panel { padding: 28px 18px; border-radius: 24px; }
  .inspiration-heading { height: 166px; display: block; }
  .inspiration-heading h2 { margin-top: 10px; }
  .inspiration-heading p { font-size: 14px; }
  .feed-actions { justify-content: flex-start; overflow-x: auto; }
  .feed-columns { height: calc(100% - 166px); grid-template-columns: 1fr; }
  .column-2, .column-3 { display: none; }

  .guest-preview-count strong { font-size: 72px; }
  .guest-constellation { padding-inline: 0; }
  .guest-connection-lines { display: none; }
  .guest-preview-cta { width: 100%; }
  .site-footer { margin-top: 72px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

/* AI 推荐榜：只在完成推荐后以独立结果层呈现。 */
.page-anchor { display: block; height: 1px; scroll-margin-top: 88px; }
.view-unlocked-ranking {
  min-height: 44px;
  margin-top: 10px !important;
  padding: 0 4px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ui-purple) !important;
  box-shadow: none !important;
  font-size: 14px !important;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.ranking-open { overflow: hidden; }
.ai-ranking-overlay {
  position: fixed;
  inset: 0;
  z-index: 1800;
  display: grid;
  place-items: center;
  padding: 32px;
}
.ai-ranking-overlay[hidden] { display: none; }
.ai-ranking-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(23,21,43,.62);
  backdrop-filter: blur(12px);
}
.ai-ranking-dialog {
  position: relative;
  width: min(calc(100vw - 64px), 1480px);
  height: min(calc(100vh - 64px), 960px);
  overflow: hidden;
  border: 1px solid rgba(232,227,245,.85);
  border-radius: 32px;
  background: #faf9ff;
  box-shadow: 0 34px 110px rgba(23,21,43,.28);
}
.ai-ranking-content {
  height: 100%;
  overflow-y: auto;
  padding: clamp(48px,5vw,76px);
  overscroll-behavior: contain;
}
.ai-ranking-close {
  position: absolute;
  z-index: 3;
  top: 20px;
  right: 20px;
  width: 48px;
  height: 48px;
  border: 1px solid var(--ui-border);
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: var(--ui-text);
  font-size: 26px;
  cursor: pointer;
}
.ai-ranking-dialog .recommendation-hero { margin-bottom: 28px; padding-right: 64px; }
.ai-ranking-dialog .recommendation-hero h2 { margin: 12px 0 14px; }
.ai-ranking-dialog .recommendation-hero h2:focus { outline: none; }
.ranking-unlocked-note {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 24px;
  padding: 16px 18px;
  border: 1px solid rgba(57,169,121,.2);
  border-radius: var(--radius-control);
  background: #edf9f4;
  color: #278967;
}
.ranking-unlocked-note[hidden] { display: none; }
.ranking-unlocked-note strong { font-size: 15px; }
.ranking-unlocked-note span { color: #52756a; font-size: 14px; }
.ai-ranking-dialog .recommendation-tools { display: flex; margin: 0 0 16px; }
.ai-ranking-dialog .recommendation-demo-note { margin-bottom: 16px; }
.recommendation-card.is-just-recommended {
  border-color: rgba(57,169,121,.55);
  box-shadow: 0 0 0 3px rgba(57,169,121,.10), 0 16px 38px rgba(57,169,121,.10);
}
.ai-ranking-dialog .recommend-side { grid-template-columns: 1fr; }
.ai-ranking-dialog .recommend-count { text-align: center; }
.ai-ranking-dialog .recommend-side button { width: 100%; }

/* 首页背景层次：延续 AI 主视觉的紫粉蓝光晕与细网格 */
body{
  background:
    radial-gradient(circle at 8% 18%,rgba(255,154,202,.13),transparent 28%),
    radial-gradient(circle at 88% 36%,rgba(116,87,246,.16),transparent 32%),
    radial-gradient(circle at 54% 78%,rgba(90,170,255,.11),transparent 34%),
    #f7f5ff;
}
main{position:relative;isolation:isolate}
main:before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(116,87,246,.052) 1px,transparent 1px),linear-gradient(90deg,rgba(116,87,246,.052) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,transparent 0,#000 8%,#000 92%,transparent 100%)}
.creator-inspiration-feed{
  background:
    radial-gradient(circle at 10% 14%,rgba(255,147,199,.20),transparent 31%),
    radial-gradient(circle at 86% 18%,rgba(126,92,255,.22),transparent 35%),
    radial-gradient(circle at 58% 92%,rgba(94,176,255,.14),transparent 34%),
    linear-gradient(135deg,rgba(255,251,253,.96),rgba(246,242,255,.96) 56%,rgba(241,247,255,.96));
  border-color:rgba(116,87,246,.16);
  box-shadow:0 24px 74px rgba(70,51,128,.10);
}
.creator-inspiration-feed .inspiration-panel{
  background:transparent;
  border:0;
  box-shadow:none;
}
.creator-inspiration-feed{
  border-color:rgba(116,87,246,.09);
  box-shadow:0 30px 90px rgba(83,61,149,.075),inset 0 1px 0 rgba(255,255,255,.62);
}
.creator-inspiration-feed:before{content:"";position:absolute;inset:-1px;z-index:0;pointer-events:none;border-radius:inherit;background:linear-gradient(180deg,rgba(247,245,255,.28),transparent 16%,transparent 84%,rgba(247,245,255,.38));}
.creator-inspiration-feed .inspiration-panel{position:relative;z-index:1}
.guest-preview{
  background: var(--archive-section-background)!important;
  border-color: var(--archive-section-border)!important;
  box-shadow: var(--archive-section-shadow)!important;
  padding: clamp(64px, 7vw, 96px) clamp(32px, 5vw, 72px);
  min-height: 620px;
  width: min(calc(100% - var(--page-padding-desktop) * 2), var(--page-max-width));
  max-width: var(--page-max-width);
  margin-inline: auto;
  border: 1px solid var(--archive-section-border);
  border-radius: var(--radius-section);
  overflow: hidden;
  position: relative;
}
.guest-preview:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(var(--grid-color) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-color) 1px, transparent 1px);
  background-size: var(--grid-size) var(--grid-size);
  mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.65) 60%,transparent);
  border-radius: inherit;
}
.guest-preview>*{position:relative;z-index:1}
.site-footer{
  background-image:
    linear-gradient(rgba(116,87,246,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(116,87,246,.055) 1px,transparent 1px),
    radial-gradient(circle at 10% 20%,rgba(255,137,187,.18),transparent 31%),
    radial-gradient(circle at 82% 20%,rgba(118,88,246,.28),transparent 36%),
    radial-gradient(circle at 62% 90%,rgba(78,169,255,.18),transparent 35%),
    linear-gradient(135deg,#fff9fc,#f3edff 58%,#ebf5ff)!important;
  background-size:48px 48px,48px 48px,auto,auto,auto,auto!important;
  border-top:1px solid rgba(116,87,246,.14);
}
@media(max-width:767px){
  body{background:radial-gradient(circle at 92% 26%,rgba(116,87,246,.14),transparent 35%),radial-gradient(circle at 8% 66%,rgba(255,139,189,.11),transparent 34%),#f8f6ff}
  .creator-inspiration-feed,.guest-preview{box-shadow:0 18px 52px rgba(70,51,128,.09)!important}
  .creator-inspiration-feed{padding:10px}
  .creator-inspiration-feed .inspiration-panel{padding:28px 18px}
  .guest-preview:before{background-size:var(--grid-size) var(--grid-size)}
  .site-footer{background-size:36px 36px,36px 36px,auto,auto,auto,auto!important}
}
.ai-ranking-close:focus-visible,
.view-unlocked-ranking:focus-visible,
.ai-ranking-dialog button:focus-visible,
.ai-ranking-dialog a:focus-visible,
.ai-ranking-dialog input:focus-visible {
  outline: 3px solid rgba(116,87,246,.32);
  outline-offset: 3px;
}

@media (max-width: 900px) {
  .ai-ranking-overlay { padding: 24px; }
  .ai-ranking-dialog { width: calc(100vw - 48px); height: calc(100dvh - 48px); }
  .ai-ranking-content { padding: 56px 28px 32px; }
  .ai-ranking-dialog .recommendation-tools { display: grid; }
  .ai-ranking-dialog .recommend-side { grid-template-columns: 1fr; }
  .ranking-unlocked-note { align-items: flex-start; flex-direction: column; gap: 4px; }
}

@media (max-width: 767px) {
  .ai-ranking-overlay { padding: 0; }
  .ai-ranking-dialog { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .ai-ranking-content { padding: 70px 18px calc(30px + env(safe-area-inset-bottom)); }
  .ai-ranking-close { position: fixed; top: 12px; right: 12px; width: 44px; height: 44px; }
  .ai-ranking-dialog .recommendation-hero { padding-right: 0; }
  .ai-ranking-dialog .recommendation-hero h2 { font-size: clamp(32px,9vw,40px); }
  .ai-ranking-dialog .recommendation-categories { width: 100%; overflow-x: auto; }
  .ai-ranking-dialog .recommendation-search { width: 100%; }
}