@font-face {
  font-family: "Smiley Sans";
  src:
    url("https://cdn.jsdelivr.net/npm/@fontpkg/smiley-sans@2.0.4/SmileySans-Oblique.otf.woff2") format("woff2"),
    url("assets/SmileySans-Oblique.otf.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 400 700;
}

@font-face {
  font-family: "Source Han Sans PPT";
  src: url("assets/fonts/SourceHanSansCN-PPT-Regular.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 400 599;
}

@font-face {
  font-family: "Source Han Sans PPT";
  src: url("assets/fonts/SourceHanSansCN-PPT-Bold.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 600 900;
}

:root {
  --title-font: "Smiley Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
  --button-radius: 3px;
  --gold-hover: #ddc793;
  --gold-hover-rgb: 221, 199, 147;
}

html[data-title-font="smiley"] {
  --title-font: "Smiley Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
}

html[data-title-font="sans"] {
  --title-font: "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", sans-serif;
}

html[data-title-font="serif"] {
  --title-font: "Songti SC", STSong, "SimSun", serif;
}

html[data-theme="champagne"] {
  --black: #080909;
  --deep-2: #101111;
  --ink: #111212;
  --paper: #f2efe8;
  --ivory: #fffdf7;
  --gold: #cbb07a;
  --gold-hover: #ddc793;
  --gold-dark: #7b6339;
  --black-rgb: 8, 9, 9;
  --overlay-rgb: 5, 5, 5;
  --ink-rgb: 17, 18, 18;
  --gold-rgb: 203, 176, 122;
  --gold-hover-rgb: 221, 199, 147;
  --line: rgba(203, 176, 122, .34);
  --light-text: #625e57;
  --light-muted: #706b63;
  --light-border: #c9bfaf;
  --light-border-strong: #a99f90;
  --light-soft: #a49c8e;
  --light-cite: #9f9789;
  --light-card: rgba(255, 255, 255, .28);
  --price-highlight: #efe1c3;
}

html[data-theme="midnight"] {
  --black: #07131d;
  --deep-2: #0d202c;
  --ink: #0d1b24;
  --paper: #edf2f4;
  --ivory: #f7fbfd;
  --gold: #a8c4d8;
  --gold-hover: #bed4e3;
  --gold-dark: #466f89;
  --black-rgb: 7, 19, 29;
  --overlay-rgb: 4, 13, 20;
  --ink-rgb: 13, 27, 36;
  --gold-rgb: 168, 196, 216;
  --gold-hover-rgb: 190, 212, 227;
  --line: rgba(168, 196, 216, .34);
  --light-text: #4d606c;
  --light-muted: #5d707c;
  --light-border: #bdcbd2;
  --light-border-strong: #91a6b1;
  --light-soft: #8296a1;
  --light-cite: #768b97;
  --light-card: rgba(255, 255, 255, .34);
  --price-highlight: #dcebf3;
}

html[data-theme="burgundy"] {
  --black: #190c10;
  --deep-2: #251216;
  --ink: #281519;
  --paper: #f5eee9;
  --ivory: #fff9f4;
  --gold: #d8a184;
  --gold-hover: #e5b79e;
  --gold-dark: #985c4f;
  --black-rgb: 25, 12, 16;
  --overlay-rgb: 18, 7, 10;
  --ink-rgb: 40, 21, 25;
  --gold-rgb: 216, 161, 132;
  --gold-hover-rgb: 229, 183, 158;
  --line: rgba(216, 161, 132, .34);
  --light-text: #6d534d;
  --light-muted: #735a54;
  --light-border: #d5c1b7;
  --light-border-strong: #b89c91;
  --light-soft: #9f8278;
  --light-cite: #9a7d74;
  --light-card: rgba(255, 255, 255, .3);
  --price-highlight: #f1d6c5;
}

h1,
h2,
h3,
.app-brand b,
.slide-brand b,
.long-brand b {
  font-family: var(--title-font) !important;
}

.presentation-body .ppt-canvas .proposal-slide {
  font-family: "Source Han Sans PPT", "PingFang SC", "Microsoft YaHei", sans-serif;
}

h1,
h2,
h3 {
  text-wrap: balance;
}

.brand b,
.siteFooterIdentity b {
  font-family: "Smiley Sans", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}

.hero h1 em {
  color: var(--gold) !important;
}

.primaryButton:hover {
  background: var(--gold) !important;
  filter: brightness(1.08);
}

.heroStats {
  border-color: rgba(var(--gold-rgb), .42) !important;
}

/* Shared palette overrides */
.darkSection,
.packageSection,
.phone-poster,
.long-section.dark,
.long-portfolio,
.image-slide,
.social-image {
  background-color: var(--black) !important;
}

.about,
.process,
.works,
.value,
.trust,
.long-section.light,
.light-slide {
  background-color: var(--paper) !important;
}

/* 作品集在浅色主题底色上使用深色文字，保持标题与说明的可读性 */
.works {
  color: var(--ink) !important;
}

.works .sectionHeading > p {
  color: var(--light-muted) !important;
}

.moon-art,
.moon-art::after {
  background-color: var(--deep-2) !important;
}

/* 浅色内容区：文字、边框与卡片全部跟随主题冷暖 */
.aboutCopy > p:not(.eyebrow),
.about-copy p,
.body-copy,
.light-slide .slide-lead,
.steps p,
.step p,
.arrival p,
.arrival-strip p,
.long-steps p,
.social-checks p,
.valueGrid p,
.value-grid p,
.social-value-grid p {
  color: var(--light-text) !important;
}

.lightHeading > p {
  color: var(--light-muted) !important;
}

.chips span,
.tags span,
.pill-row span {
  border-color: var(--light-border) !important;
  color: var(--light-text) !important;
}

.steps,
.steps-grid,
.long-steps,
.social-checks {
  border-color: var(--light-border-strong) !important;
}

.arrival,
.arrival-strip,
.valueGrid article,
.value-grid article,
.social-value-grid article {
  border-color: var(--light-border) !important;
  background: var(--light-card) !important;
}

.long-steps p,
.social-checks p {
  border-color: var(--light-border) !important;
}

.logoGrid {
  border-color: var(--light-border) !important;
}

.logoGrid li {
  border-color: var(--light-border) !important;
}

.reviews blockquote {
  border-color: var(--light-border) !important;
  color: var(--light-muted) !important;
}

.reviews cite {
  color: var(--light-cite) !important;
}

.light-slide::after {
  color: rgba(var(--ink-rgb), .28) !important;
}

/* 强调数字、价格和装饰线不再残留香槟金 */
.serviceNo,
.long-features article > b {
  color: rgba(var(--gold-rgb), .42) !important;
}

.prices b,
.price-pair b,
.social-price b,
.long-prices article > b {
  color: var(--price-highlight) !important;
}

.moon-art::after {
  box-shadow: -1.8cqw 0 4cqw rgba(var(--gold-rgb), .15) !important;
}

.footerArc {
  border-color: rgba(var(--gold-rgb), .22) !important;
  box-shadow: 0 0 100px rgba(var(--gold-rgb), .06) !important;
}

.contact-slide::before {
  border-color: rgba(var(--gold-rgb), .24) !important;
}

.qrPlaceholder {
  border-color: rgba(var(--gold-rgb), .5) !important;
  background-image:
    linear-gradient(45deg, transparent 48%, rgba(var(--gold-rgb), .1) 49% 51%, transparent 52%),
    linear-gradient(-45deg, transparent 48%, rgba(var(--gold-rgb), .1) 49% 51%, transparent 52%) !important;
}

.qr {
  border-color: rgba(var(--gold-rgb), .5) !important;
  background: rgba(var(--gold-rgb), .04) !important;
}

/* 图片区域：遮罩也随主题着色，避免蓝色或酒红页面突然出现纯黑断层 */
.heroShade {
  background:
    linear-gradient(90deg, rgba(var(--overlay-rgb), .9), rgba(var(--overlay-rgb), .42) 58%, rgba(var(--overlay-rgb), .08)),
    linear-gradient(180deg, rgba(var(--overlay-rgb), .1), rgba(var(--overlay-rgb), .07) 55%, rgba(var(--overlay-rgb), .94)) !important;
}

.cover::before {
  background:
    linear-gradient(90deg, rgba(var(--overlay-rgb), .88), rgba(var(--overlay-rgb), .28) 62%, rgba(var(--overlay-rgb), .08)),
    linear-gradient(180deg, transparent 55%, rgba(var(--overlay-rgb), .8)) !important;
}

.social-canvas .cover::before {
  background:
    linear-gradient(90deg, rgba(var(--overlay-rgb), .58), rgba(var(--overlay-rgb), .34) 46%, rgba(var(--overlay-rgb), .1) 76%, rgba(var(--overlay-rgb), .04)),
    linear-gradient(180deg, rgba(var(--overlay-rgb), .08), rgba(var(--overlay-rgb), .16) 32%, rgba(var(--overlay-rgb), .55) 56%, rgba(var(--overlay-rgb), .92) 80%, var(--black)) !important;
}

.equipmentShade {
  background:
    linear-gradient(90deg, rgba(var(--overlay-rgb), .97), rgba(var(--overlay-rgb), .8) 42%, rgba(var(--overlay-rgb), .08) 78%) !important;
}

.gear-slide::before {
  background:
    linear-gradient(90deg, rgba(var(--overlay-rgb), .98), rgba(var(--overlay-rgb), .8) 48%, rgba(var(--overlay-rgb), .06) 82%) !important;
}

.equipment-shade {
  background:
    linear-gradient(180deg, rgba(var(--overlay-rgb), .02), rgba(var(--overlay-rgb), .5) 38%, rgba(var(--overlay-rgb), .98) 74%) !important;
}

.luyue-view-dock,
.long-mode-nav {
  border-color: var(--line) !important;
  background: rgba(var(--black-rgb), .91) !important;
}

.siteHeader {
  background: rgba(var(--black-rgb), .9) !important;
}

.long-hero .shade {
  background: linear-gradient(
    180deg,
    rgba(var(--black-rgb), .04),
    rgba(var(--black-rgb), .2) 38%,
    rgba(var(--black-rgb), .94) 76%,
    var(--black)
  ) !important;
}

.luyue-view-dock a span,
.long-mode-nav a span {
  color: var(--gold) !important;
}

.luyue-view-dock a.is-active,
.long-mode-nav a.active {
  background: var(--gold) !important;
  color: var(--black) !important;
}

.luyue-view-dock a.is-active span,
.long-mode-nav a.active span {
  color: var(--black) !important;
}

/* PPT / 3:4：外围工作区始终使用独立深灰，不跟随画布配色 */
.presentation-body {
  background: #292a2d !important;
}

.app,
.workspace,
.canvas-wrap,
.controls {
  background: #292a2d !important;
}

.toolbar {
  background: #222326 !important;
}

.canvas {
  background: var(--black) !important;
  outline: 1px solid rgba(255, 255, 255, .09);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .55) !important;
}

.price-card.featured,
.social-price.featured,
.packageCard.featured,
.long-prices article.recommended {
  background-image: linear-gradient(180deg, rgba(var(--gold-rgb), .13), transparent) !important;
}

@media (max-width: 900px) {
  .heroShade {
    background:
      linear-gradient(180deg, rgba(var(--overlay-rgb), .2), rgba(var(--overlay-rgb), .58) 48%, rgba(var(--overlay-rgb), .98) 86%) !important;
  }

  .equipmentShade {
    background:
      linear-gradient(180deg, rgba(var(--overlay-rgb), .15), rgba(var(--overlay-rgb), .93) 50%, var(--black) 100%) !important;
  }

  .steps article {
    border-color: var(--light-border-strong) !important;
  }
}

/* Style picker */
.luyue-style-picker {
  position: fixed;
  z-index: 20000;
  top: 94px;
  right: 18px;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

.style-trigger {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  background: rgba(28, 29, 31, .94);
  color: rgba(255, 255, 255, .88);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
  backdrop-filter: blur(18px);
  cursor: pointer;
  font-size: 13px;
}

.style-trigger-dots {
  display: flex;
  gap: 3px;
}

.style-trigger-dots i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.style-trigger-dots i:nth-child(1) { background: #cbb07a; }
.style-trigger-dots i:nth-child(2) { background: #a8c4d8; }
.style-trigger-dots i:nth-child(3) { background: #d8a184; }

.style-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 294px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 20px;
  background: rgba(28, 29, 31, .97);
  color: #fff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .42);
  backdrop-filter: blur(22px);
}

.style-menu[hidden] {
  display: none;
}

.style-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.style-menu-head b {
  font-size: 15px;
  font-weight: 600;
}

.style-menu-head span {
  color: rgba(255, 255, 255, .34);
  font-size: 10px;
  letter-spacing: 1px;
}

.style-group + .style-group {
  margin-top: 18px;
}

.style-label {
  display: block;
  margin-bottom: 9px;
  color: rgba(255, 255, 255, .43);
  font-size: 11px;
  letter-spacing: 2px;
}

.palette-options {
  display: grid;
  gap: 7px;
}

.palette-option,
.font-option {
  border: 1px solid rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .035);
  color: rgba(255, 255, 255, .72);
  cursor: pointer;
}

.palette-option {
  display: grid;
  grid-template-columns: 54px 1fr 18px;
  align-items: center;
  gap: 11px;
  min-height: 43px;
  padding: 7px 11px;
  border-radius: 12px;
  text-align: left;
  font-size: 12px;
}

.palette-swatch {
  display: flex;
  overflow: hidden;
  height: 22px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 999px;
}

.palette-swatch i {
  flex: 1;
}

.palette-option[data-theme-choice="champagne"] .palette-swatch i:nth-child(1) { background: #080909; }
.palette-option[data-theme-choice="champagne"] .palette-swatch i:nth-child(2) { background: #cbb07a; }
.palette-option[data-theme-choice="champagne"] .palette-swatch i:nth-child(3) { background: #f2efe8; }
.palette-option[data-theme-choice="midnight"] .palette-swatch i:nth-child(1) { background: #07131d; }
.palette-option[data-theme-choice="midnight"] .palette-swatch i:nth-child(2) { background: #a8c4d8; }
.palette-option[data-theme-choice="midnight"] .palette-swatch i:nth-child(3) { background: #edf2f4; }
.palette-option[data-theme-choice="burgundy"] .palette-swatch i:nth-child(1) { background: #190c10; }
.palette-option[data-theme-choice="burgundy"] .palette-swatch i:nth-child(2) { background: #d8a184; }
.palette-option[data-theme-choice="burgundy"] .palette-swatch i:nth-child(3) { background: #f5eee9; }

.choice-check {
  color: transparent;
  font-size: 13px;
}

.palette-option[aria-pressed="true"],
.font-option[aria-pressed="true"] {
  border-color: var(--gold);
  background: rgba(var(--gold-rgb), .13);
  color: #fff;
}

.palette-option[aria-pressed="true"] .choice-check {
  color: var(--gold);
}

.font-options {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
}

.font-option {
  min-height: 64px;
  padding: 7px 3px;
  border-radius: 12px;
  font-size: 12px;
}

.font-option b {
  display: block;
  margin-bottom: 6px;
  font-size: 21px;
  font-weight: 500;
}

.font-option[data-font-choice="smiley"] b { font-family: "Smiley Sans", sans-serif; }
.font-option[data-font-choice="sans"] b { font-family: "PingFang SC", "Microsoft YaHei", sans-serif; }
.font-option[data-font-choice="serif"] b { font-family: "Songti SC", STSong, serif; }

.style-footnote {
  margin: 13px 0 0;
  color: rgba(255, 255, 255, .3);
  font-size: 10px;
  line-height: 1.55;
}

@media (max-width: 700px) {
  .luyue-style-picker {
    top: auto;
    right: 12px;
    bottom: 72px;
  }

  .style-trigger {
    min-height: 38px;
    padding: 0 13px;
    font-size: 11px;
  }

  .style-menu {
    top: auto;
    right: 0;
    bottom: calc(100% + 9px);
    width: min(294px, calc(100vw - 24px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .luyue-style-picker * {
    transition: none !important;
  }
}
