/* MicroDraft Landing Page Stylesheet (StyleX) */
html { overflow-x: clip; }
body { overflow-x: clip; }
main { overflow: clip; }
.page-section { position: relative; min-height: 720px; }
.section-curtain { display: block; position: absolute; inset: 0; z-index: 5; background: var(--paper); pointer-events: none; will-change: transform; }

/* Hero */
.hero {
  position: relative;
  min-height: clamp(520px, 72vh, 680px);
  padding: 48px 0 56px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.hero-inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.hero-rails { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; }
.hero-rails .hero-rail { stroke: var(--line-strong); stroke-width: 2; fill: none; }
.hero-rails .hero-rail--faint { stroke: var(--line); stroke-width: 1; opacity: .85; }
.hero-rails .hero-tick { stroke: var(--ink); stroke-width: 1; opacity: .2; }
.hero-rails .hero-word text { fill: var(--ink); opacity: .08; font-family: 'Archivo Black', 'Arial Black', 'Helvetica Neue', Arial, sans-serif; font-weight: 900; font-size: 100px; }
.hero-rails .hero-block { fill: var(--lime); }
.hero-rails .hero-note { fill: var(--muted); opacity: .55; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; font-weight: 600; letter-spacing: .16em; }
.eyebrow {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
  background: transparent;
  padding: 5px 12px;
  border: 1px solid var(--line-strong);
  border-left: 3px solid var(--ink);
  border-radius: 3px;
  font-family: ui-monospace, SFMono-Regular, monospace, sans-serif;
  letter-spacing: .06em;
}
.eyebrow i { width: 5px; height: 5px; border-radius: 1px; background: var(--ink); }
h1 { font-size: clamp(42px, 5.1vw, 64px); letter-spacing: .02em; line-height: 1.16; margin: 20px 0 23px; max-width: none; }
.hero-line { display: block; white-space: nowrap; }
.highlight { position: relative; white-space: nowrap; }
.highlight::after { content: ""; position: absolute; left: 0; right: -3px; height: 12px; bottom: 3px; z-index: -1; background: var(--lime); transform: rotate(-1.5deg); }
.lead { max-width: 530px; color: var(--muted); font-size: 18px; line-height: 1.9; margin: 0 auto 30px; }
.actions { display: flex; align-items: center; justify-content: center; gap: 14px; }
.quiet-link { font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }

/* Proof */
.proof {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-content: center;
}
.proof div {
  padding: 20px 16px;
  border-right: 1px solid var(--line);
  text-align: center;
  color: var(--muted);
  font-size: 14px;
}
.proof div:last-child { border-right: 0; }
.proof b { display: block; color: var(--ink); font-size: 25px; letter-spacing: -1px; margin-bottom: 4px; }
.proof-illustration { display: block; width: 88px; height: 88px; margin: 0 auto 13px; border-radius: 4px; object-fit: cover; box-shadow: 0 10px 18px rgba(21, 49, 42, .08); }

/* Showcase */
.app-showcase { min-height: auto; padding: 102px 0 108px; display: flex; flex-direction: column; justify-content: center; }
.showcase-head { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr); column-gap: clamp(32px, 7vw, 100px); row-gap: 16px; align-items: end; margin: 0 auto 36px; width: min(100%, 1040px); }
.showcase-kicker { grid-column: 1 / -1; display: inline-flex; align-items: center; gap: 8px; width: fit-content; color: var(--ink); font-size: 11px; font-weight: 750; letter-spacing: .08em; font-family: ui-monospace, SFMono-Regular, monospace, sans-serif; text-transform: uppercase; border: 1px solid var(--line-strong); border-left: 3px solid var(--ink); border-radius: 2px; padding: 4px 10px; background: transparent; }
.showcase-head h2 { min-width: 0; margin: 0; font-size: clamp(30px, 3.5vw, 46px); letter-spacing: -.02em; line-height: 1.22; overflow-wrap: anywhere; }
.showcase-head p { max-width: 30ch; margin: 0 0 3px; color: var(--muted); font-size: 16px; line-height: 1.8; }
.showcase-stage { position: relative; margin: 0 auto; width: min(100%, 1140px); }
.app-showcase .swiper { --swiper-theme-color: var(--ink); width: 100%; }
.app-showcase .swiper-wrapper { align-items: center; }
.app-showcase .swiper-slide { display: flex; justify-content: center; }
.app-showcase .swiper-slide figure { display: grid; place-items: center; width: min(100%, 1040px); aspect-ratio: 16 / 9; margin: 0; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--surface); box-shadow: 0 20px 48px var(--shadow-soft); }
.app-showcase .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: contain; background: var(--white); }
.showcase-controls { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: min(100%, 1040px); margin: 20px auto 0; }
.app-showcase .swiper-pagination { position: static; display: flex; justify-content: flex-start; gap: 8px; margin: 0; }
.app-showcase .swiper-pagination-bullet { width: 8px; height: 4px; margin: 0; border: 0; border-radius: 1px; background: var(--line-strong); opacity: 1; transition: width .24s ease, background .24s ease, transform .24s ease; }
.app-showcase .swiper-pagination-bullet:hover { background: var(--muted); transform: scale(1.12); }
.app-showcase .swiper-pagination-bullet-active { width: 28px; background: var(--ink); border-radius: 1px; }
.showcase-nav { display: flex; padding: 2px; border: 1px solid var(--line); border-radius: 4px; background: var(--white); }
.app-showcase .swiper-button-prev, .app-showcase .swiper-button-next { position: static; width: auto; min-width: 70px; height: 38px; margin: 0; padding: 0 13px; border: 0; border-radius: 2px; background: transparent; color: var(--muted); box-shadow: none; font-size: 13px; font-weight: 750; white-space: nowrap; transition: background .2s ease, color .2s ease; }
.app-showcase .swiper-button-prev { border-right: 1px solid var(--line); border-radius: 2px 0 0 2px; }
.app-showcase .swiper-button-next { border-radius: 0 2px 2px 0; }
.app-showcase .swiper-button-prev::after, .app-showcase .swiper-button-next::after { display: none; }
.app-showcase .swiper-navigation-icon { display: none; }
.app-showcase .swiper-button-prev.swiper-button-disabled, .app-showcase .swiper-button-next.swiper-button-disabled { opacity: .38; }
@media (hover: hover) and (pointer: fine) { .app-showcase .swiper-button-prev:hover, .app-showcase .swiper-button-next:hover { background: var(--mint); color: var(--ink); } }
.showcase-detail { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center; width: min(100%, 1040px); margin: 18px auto 0; padding-top: 20px; border-top: 1px solid var(--line); }
.showcase-index, .showcase-total { color: var(--muted); font-size: 13px; font-weight: 800; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.showcase-index { color: var(--ink); }
.showcase-copy { min-width: 0; }
.showcase-copy strong { display: block; margin-bottom: 4px; font-size: 16px; letter-spacing: .01em; }
.showcase-copy p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.showcase-progress { grid-column: 2 / -1; height: 3px; overflow: hidden; border-radius: 99px; background: var(--mint-strong); }
.showcase-progress > span { display: block; width: 100%; height: 100%; transform: scaleX(var(--showcase-progress, .3333)); transform-origin: left center; border-radius: inherit; background: var(--lime-deep); transition: transform .52s cubic-bezier(.2, .8, .2, 1); }

/* Features */
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.feature { position: relative; padding: 24px; border: 1px solid var(--line); border-radius: 4px; background: #fbfcf9; text-align: center; }
.feature::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 4px; background: var(--surface); box-shadow: 7px 7px 0 0 var(--ink); opacity: 0; transform: translate(3px, 3px); transition: opacity .24s ease, transform .3s cubic-bezier(.2, .8, .2, 1); pointer-events: none; }
@media (hover: hover) { .feature:hover::after { opacity: 1; transform: translate(0, 0); } }
.feature-icon { width: 38px; height: 38px; border-radius: 4px; background: var(--lime); display: grid; place-items: center; margin: 0 auto 24px; }
.feature-icon img { width: 20px; height: 20px; }
.feature h3 { margin: 0 0 9px; font-size: 20px; letter-spacing: .015em; line-height: 1.45; }
.feature p { margin: 0; line-height: 1.85; color: var(--muted); font-size: 14px; }

/* Pricing */
.pricing { min-height: auto; margin-bottom: 36px; padding: 72px 44px 48px; border-radius: 6px; background: var(--ink); color: var(--white); }
.pricing-heading { max-width: 620px; margin: 0 auto; text-align: center; }
.pricing-kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--lime); font-size: 11px; font-weight: 750; letter-spacing: .08em; font-family: ui-monospace, SFMono-Regular, monospace, sans-serif; text-transform: uppercase; border: 1px solid rgba(201,244,92,.4); border-left: 3px solid var(--lime); border-radius: 2px; padding: 4px 10px; background: transparent; }
.pricing-heading h2 { margin: 16px 0 0; font-size: clamp(36px, 4.3vw, 56px); letter-spacing: -.025em; line-height: 1.12; }
.pricing-heading p { margin: 16px 0 0; color: rgba(255,255,255,.66); font-size: 15px; line-height: 1.75; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; width: min(100%, 1060px); margin: 42px auto 0; }
.pricing-card { position: relative; display: flex; min-width: 0; height: 100%; flex-direction: column; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 4px; background: rgba(255,255,255,.055); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.pricing-card--featured { border-color: var(--lime); background: var(--lime); color: var(--ink); box-shadow: 0 18px 42px rgba(0,0,0,.2); }
.pricing-card-media { position: relative; aspect-ratio: 1.78; overflow: hidden; background: #08090b; }
.pricing-card-media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 46%, rgba(8,9,11,.48)); pointer-events: none; }
.pricing-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.pricing-card-body { display: flex; flex: 1; flex-direction: column; padding: 24px 28px 28px; }
.pricing-badge { position: absolute; z-index: 1; top: 16px; right: 16px; display: inline-flex; min-height: 22px; align-items: center; padding: 0 8px; border-radius: 2px; background: rgba(255,255,255,.08); color: var(--lime); border: 1px solid rgba(201,244,92,.6); font-size: 11px; font-weight: 750; font-family: ui-monospace, monospace; letter-spacing: .06em; }
.pricing-card--featured .pricing-badge { background: rgba(20,35,30,.06); color: var(--ink); border: 1px solid var(--ink); }
.pricing-card h3 { margin: 0; font-size: 22px; letter-spacing: -.015em; }
.pricing-card p { min-height: 44px; margin: 8px 0 0; color: rgba(255,255,255,.62); font-size: 13px; line-height: 1.7; }
.pricing-card--featured p { color: var(--ink-soft); }
.pricing-price { display: flex; align-items: baseline; gap: 6px; margin: 28px 0 4px; }
.pricing-price strong { font-size: clamp(43px, 5vw, 60px); letter-spacing: -.075em; line-height: .92; }
.pricing-price span { color: rgba(255,255,255,.58); font-size: 13px; font-weight: 700; }
.pricing-card--featured .pricing-price span { color: var(--ink-soft); }
.pricing-card .button { width: 100%; margin-top: auto; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: var(--white); }
.pricing-card .button .button-icon { filter: brightness(0) invert(1); }
.pricing-card--featured .button { border-color: var(--ink); background: var(--ink); color: var(--white); }
@media (hover: hover) and (pointer: fine) {
  .pricing-card .button:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.38); }
  .pricing-card--featured .button:hover { background: var(--ink-soft); border-color: var(--ink-soft); }
}
.pricing-studio { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; width: min(100%, 1060px); margin: 14px auto 0; padding: 24px 28px; border: 1px solid rgba(255,255,255,.12); border-left: 3px solid var(--lime); border-radius: 4px; background: rgba(255,255,255,.055); }
.pricing-studio-copy h3 { margin: 0; font-size: 22px; letter-spacing: -.015em; }
.pricing-studio-copy p { margin: 8px 0 0; color: rgba(255,255,255,.62); font-size: 13px; line-height: 1.7; }
.pricing-studio-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.pricing-studio-tags li { padding: 4px 10px; border: 1px solid rgba(201,244,92,.4); border-radius: 2px; color: var(--lime); font: 750 11px/1.4 ui-monospace, SFMono-Regular, monospace; letter-spacing: .06em; }
.pricing-studio-action { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.pricing-studio-price { display: flex; align-items: baseline; gap: 6px; }
.pricing-studio-price strong { font-size: clamp(30px, 3.4vw, 40px); letter-spacing: -.06em; line-height: .95; }
.pricing-studio-price span { color: rgba(255,255,255,.58); font-size: 13px; font-weight: 700; }
.pricing-studio .button { width: auto; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: var(--white); white-space: nowrap; }
.pricing-studio .button .button-icon { filter: brightness(0) invert(1); }
@media (hover: hover) and (pointer: fine) {
  .pricing-studio .button:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.38); }
}

/* Author Section */
.author-section { min-height: auto; margin-bottom: 36px; }
.author-card { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 40px 28px 36px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); box-shadow: 0 12px 32px var(--shadow-soft); }
.author-avatar-wrap { position: relative; margin-bottom: 16px; }
.author-avatar { display: block; width: 76px; height: 76px; border-radius: 50%; object-fit: cover; border: 3px solid var(--white); box-shadow: 0 8px 20px rgba(20,35,30,.12); background: var(--paper); }
.author-kicker { display: inline-block; margin-bottom: 6px; color: var(--ink-soft); font-size: 11px; font-weight: 750; letter-spacing: .08em; font-family: ui-monospace, monospace; text-transform: uppercase; }
.author-name { margin: 0 0 10px; font-size: 22px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); }
.author-bio { max-width: 520px; margin: 0 auto 24px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.author-contacts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: 760px; margin: 0 auto; }
.author-contact-pill { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid var(--line-strong); border-radius: 4px; background: transparent; color: var(--ink); font-size: 13px; font-weight: 650; text-decoration: none; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease; }
.author-contact-pill svg { flex: 0 0 auto; color: var(--muted); transition: color .2s ease; }
.author-contact-wechat { border-color: var(--line-strong); }
.author-wechat-contact { position: relative; display: inline-flex; align-items: center; }
.author-qr-trigger { display: inline-flex; align-items: center; justify-content: center; width: 40px; min-height: 40px; padding: 0; border: 1px solid var(--line-strong); border-radius: 4px; background: transparent; color: var(--muted); cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
.author-wechat-popup { position: absolute; bottom: calc(100% + 10px); left: 50%; z-index: 40; transform: translateX(-50%) translateY(4px); display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 10px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--white); box-shadow: 0 12px 32px var(--shadow-soft); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s ease, transform .18s ease, visibility .18s; }
.author-wechat-popup img { display: block; width: 168px; height: 168px; border: 1px solid var(--line); border-radius: 3px; background: #fff; object-fit: contain; }
.author-wechat-popup span { color: var(--ink-soft); font-size: 12px; white-space: nowrap; }
.author-wechat-popup strong { color: var(--ink); font-family: ui-monospace, monospace; }
.copy-badge { display: inline-block; padding: 2px 6px; border-radius: 2px; background: transparent; border: 1px solid var(--line-strong); color: var(--ink); font-size: 11px; font-weight: 700; margin-left: 4px; font-family: ui-monospace, monospace; transition: border-color .2s ease, background .2s ease; }
@media (hover: hover) and (pointer: fine) {
  .author-contact-pill:hover { border-color: var(--lime-deep); background: var(--mint); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(20,35,30,.08); color: var(--ink); }
  .author-contact-pill:hover svg { color: var(--ink); }
  .author-contact-wechat:hover .copy-badge { border-color: var(--ink); background: rgba(20,35,30,.04); }
  .payment-contact-row .copy-badge:hover { border-color: var(--ink); background: rgba(20,35,30,.04); }
  .author-qr-trigger:hover { border-color: var(--lime-deep); background: var(--mint); color: var(--ink); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(20,35,30,.08); }
  .author-wechat-contact:hover .author-wechat-popup { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
}
.author-qr-trigger:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.author-qr-trigger:focus ~ .author-wechat-popup { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.payment-modal { text-align: center; }
.payment-modal .auth-top { text-align: left; }
.payment-plan-badge { display: inline-flex; align-items: center; justify-content: center; margin: 0 auto 16px; padding: 5px 14px; border-radius: 2px; background: transparent; border: 1px solid var(--line-strong); border-left: 3px solid var(--ink); color: var(--ink); font-size: 12px; font-weight: 750; font-family: ui-monospace, monospace; letter-spacing: .04em; }
.payment-qrcode-wrap { display: flex; justify-content: center; align-items: center; margin: 0 auto 18px; width: 220px; height: 220px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #fff; box-shadow: 0 8px 24px var(--shadow-soft); }
.payment-qrcode { display: block; width: 100%; height: 100%; object-fit: contain; }
.payment-contact-row { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; color: var(--muted); }
.payment-contact-row strong { color: var(--ink); }
.payment-contact-row .copy-badge { cursor: pointer; }

/* Theme Hero */
.theme-hero { min-height: auto; padding: 92px 0 100px; display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; border-top: 1px solid var(--line); }
.theme-hero-content { display: flex; flex-direction: column; }
.theme-hero-eyebrow { display: inline-flex; align-items: center; gap: 8px; width: fit-content; color: var(--ink); font-size: 12px; font-weight: 750; background: transparent; padding: 5px 12px; border: 1px solid var(--line-strong); border-left: 3px solid var(--ink); border-radius: 3px; margin-bottom: 20px; font-family: ui-monospace, SFMono-Regular, monospace, sans-serif; letter-spacing: .06em; }
.theme-hero-eyebrow-icon { width: 16px; height: 16px; flex-shrink: 0; }
.theme-hero-eyebrow i { width: 5px; height: 5px; border-radius: 1px; background: var(--ink); }
.theme-hero-heading { font-size: clamp(32px, 3.8vw, 48px); letter-spacing: -.02em; line-height: 1.22; margin: 0 0 20px; }
.theme-hero-lead { color: var(--muted); font-size: 16px; line-height: 1.85; margin: 0 0 28px; max-width: 520px; }
.theme-hero-highlights { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 32px; max-width: 480px; }
.theme-highlight-item { padding: 14px 16px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); display: flex; flex-direction: column; gap: 3px; }
.theme-highlight-number { font-size: 22px; font-weight: 800; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.theme-highlight-label { font-size: 12px; color: var(--muted); font-weight: 600; }
.theme-hero-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.theme-hero-sublink { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: var(--ink-soft); text-decoration: underline; text-underline-offset: 4px; transition: color .2s ease; }
.theme-hero-sublink:hover { color: var(--focus); }
.theme-hero-stage { position: relative; width: 100%; }
.theme-preview-card { border: 1px solid var(--line-strong); border-radius: 4px; background: var(--white); box-shadow: 0 20px 48px var(--shadow-soft); overflow: hidden; display: flex; flex-direction: column; }
.theme-preview-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; background: #f4f6f2; border-bottom: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.theme-preview-dots { display: flex; gap: 6px; }
.theme-preview-dots span { width: 9px; height: 9px; border-radius: 50%; background: #d3dbd5; }
.theme-preview-header-title { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.theme-preview-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 2px; background: transparent; border: 1px solid var(--line-strong); color: var(--ink); font-size: 11px; font-weight: 750; font-family: ui-monospace, monospace; }
.theme-preset-tabs { display: flex; gap: 6px; padding: 10px 14px; background: #fafbfa; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.theme-preset-tabs::-webkit-scrollbar { display: none; }
.theme-preset-tab { border: 1px solid var(--line); border-radius: 2px; background: var(--white); padding: 6px 12px; font-size: 12px; font-weight: 700; color: var(--muted); cursor: pointer; transition: all .2s ease; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.theme-preset-tab .tab-indicator { width: 6px; height: 6px; border-radius: 50%; background: transparent; transition: background .2s ease; }
.theme-preset-tab:hover { background: var(--mint); color: var(--ink); }
.theme-preset-tab.is-active { background: var(--ink); color: var(--white); border-color: var(--ink); }
.theme-preset-tab.is-active .tab-indicator { background: var(--lime); }
.theme-preview-body { padding: 24px; min-height: 230px; display: flex; flex-direction: column; justify-content: center; gap: 14px; background: #fdfdfd; }
.preview-p { margin: 0; font-size: 14px; line-height: 1.85; color: #475569; }
.preview-highlight { background: #fef08a; padding: 1px 6px; border-radius: 3px; color: inherit; }
.preview-quote { margin: 0; padding: 8px 14px; border-left: 3px solid #cbd5e1; font-size: 13px; color: #64748b; background: #f8fafc; border-radius: 0 4px 4px 0; }
.preview-heading-marker { text-align: left; }
.preview-heading-marker span { font-size: 24px; font-weight: 700; color: #1f2328; display: inline-block; padding: 0 4px 2px; background: linear-gradient(#fde047, #fde047) left bottom / 100% 9px no-repeat; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.preview-heading-divider { text-align: left; }
.preview-heading-divider .heading-text { font-size: 24px; font-weight: 600; color: #1f2328; }
.preview-heading-divider .heading-divider-rule { display: flex; align-items: center; gap: 8px; margin-top: 8px; max-width: 260px; }
.preview-heading-divider .divider-line { flex: 1; height: 1px; background: #c9d0c4; }
.preview-heading-divider .divider-pen-icon { flex-shrink: 0; width: 18px; height: 18px; color: #65725d; }
.preview-ornament-divider { display: flex; align-items: center; gap: 8px; width: 100%; margin: 4px 0; }
.preview-ornament-divider .divider-line { flex: 1; height: 1px; background: #e2e8f0; }
.preview-ornament-divider .divider-pen-icon-mini { flex-shrink: 0; width: 16px; height: 16px; color: #94a3b8; }
.preview-heading-numbered { display: flex; align-items: baseline; gap: 10px; }
.preview-heading-numbered .heading-num { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 22px; border-radius: 4px; background: #e2e8f0; color: #334155; font-size: 11px; font-weight: 800; font-variant-numeric: tabular-nums; }
.preview-heading-numbered .heading-title { font-size: 22px; font-weight: 700; color: #1e293b; }
.preview-grid-box { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M 16 0 L 0 0 0 16' fill='none' stroke='rgba(0,0,0,0.06)' stroke-width='1'/%3E%3C/svg%3E"); background-repeat: repeat; background-size: 16px 16px; border: 1px solid #e2e8f0; border-radius: 4px; padding: 14px 16px; background-color: #faf8f5; }
.preview-p-grid { margin: 0; font-size: 13px; line-height: 1.8; color: #111827; }
.preview-footnote { border-top: 1px solid #e2e8f0; padding-top: 10px; font-size: 12px; color: #64748b; display: flex; gap: 6px; }
.preview-footnote .footnote-num { color: #087d64; font-weight: 700; }
.preview-heading-border { border-left: 3px solid #087d64; padding-left: 10px; }
.preview-heading-border .heading-text { font-size: 22px; font-weight: 700; color: #1f2328; }
.preview-callout-modern { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 12px 16px; border-radius: 12px; background: #e8f3ff; }
.preview-callout-modern .callout-modern-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; background: #1677ff; color: #fff; font-size: 12px; font-weight: 700; }
.preview-callout-modern strong { display: block; margin-bottom: 2px; font-size: 14px; color: #1677ff; }
.preview-callout-modern p { margin: 0; font-size: 12px; line-height: 1.5; color: #475569; }

/* Manifesto & Creator Galaxy */
.manifesto-section { min-height: auto; padding: 72px 0 36px; }
.galaxy-viewport { position: relative; overflow: hidden; padding: clamp(36px, 5vw, 56px) clamp(24px, 4vw, 52px); border-radius: 6px; border: 1px solid var(--line-strong); background: radial-gradient(circle at 50% 46%, rgba(201, 244, 92, 0.16), transparent 28%), radial-gradient(circle at 54% 48%, rgba(233, 245, 231, 0.55), transparent 45%), linear-gradient(135deg, #ffffff 0%, #fbfcf9 55%, #f7f8f4 100%); box-shadow: 0 16px 40px var(--shadow-soft); }
.galaxy-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 28px; flex-wrap: wrap; }
.galaxy-header-left { max-width: 680px; }
.galaxy-heart-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-size: 11px; font-weight: 750; background: transparent; padding: 4px 10px; border-radius: 2px; border: 1px solid var(--line-strong); border-left: 3px solid var(--ink); margin-bottom: 16px; font-family: ui-monospace, SFMono-Regular, monospace, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.galaxy-heart-eyebrow i { font-style: normal; color: #d0606b; font-size: 11px; }
.galaxy-title { margin: 0 0 12px; font-size: clamp(28px, 3.4vw, 42px); font-weight: 800; letter-spacing: -.02em; line-height: 1.22; color: var(--ink); }
.galaxy-lead { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.8; text-wrap: balance; }
.galaxy-header-right { flex: 0 0 auto; }
.galaxy-stat-pill { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong); border-radius: 2px; background: transparent; padding: 5px 12px; font-size: 11px; font-weight: 750; color: var(--ink-soft); font-family: ui-monospace, SFMono-Regular, monospace, sans-serif; letter-spacing: .04em; }
.galaxy-stat-dot { width: 4px; height: 4px; border-radius: 0; background: var(--ink); }
.galaxy-stage-wrap { position: relative; width: 100%; min-height: 480px; display: flex; justify-content: center; align-items: center; margin: 10px 0 24px; border-radius: 4px; }
.galaxy-orbits-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.galaxy-orbit-path { fill: none; stroke: rgba(84, 173, 99, 0.14); stroke-width: 1.2; stroke-dasharray: 4 6; }
.galaxy-decor-star { position: absolute; border-radius: 50%; pointer-events: none; opacity: .7; }
.galaxy-center-glow { position: absolute; left: 50%; top: 50%; width: 180px; height: 180px; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(201, 244, 92, .32) 0%, rgba(233, 245, 231, .2) 45%, transparent 70%); pointer-events: none; }
.galaxy-nodes-container { position: relative; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; min-height: 480px; }
.galaxy-nodes-container:hover .galaxy-node:not(:hover) { opacity: .35; filter: grayscale(15%); }
.galaxy-node { position: absolute; left: calc(50% + var(--node-x)); top: calc(50% + var(--node-y)); transform: translate(-50%, -50%); z-index: 2; display: flex; flex-direction: column; align-items: center; cursor: pointer; transition: transform .22s cubic-bezier(.2,0,0,1), opacity .2s ease, filter .2s ease; }
.galaxy-node:hover { transform: translate(-50%, -50%) scale(1.16) translateY(-2px); z-index: 20; opacity: 1 !important; }
.galaxy-node-inner { position: relative; border-radius: 50%; padding: 2.5px; background: var(--white); border: 1.5px solid var(--line-strong); box-shadow: 0 4px 14px rgba(20,35,30,.08); }
.galaxy-node--center .galaxy-node-inner { width: 80px; height: 80px; padding: 3.5px; border: 2.5px solid var(--lime-deep); box-shadow: 0 0 0 6px rgba(255,255,255,.9), 0 0 32px rgba(84, 173, 99, .24); }
.galaxy-node-avatar { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; background: var(--paper); }
.galaxy-avatar-fallback { width: 100%; height: 100%; border-radius: 50%; background: var(--mint); color: #2e6245; font-size: 13px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.galaxy-node--center .galaxy-avatar-fallback { font-size: 26px; background: var(--lime); color: var(--ink); }
.galaxy-crown-badge { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); font-size: 14px; line-height: 1; filter: drop-shadow(0 2px 4px rgba(0,0,0,.15)); }
.galaxy-node-count-badge { position: absolute; top: -4px; right: -4px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: var(--mint); color: #2e6245; font-size: 9px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--mint-strong); font-variant-numeric: tabular-nums; }
.galaxy-node-name { margin-top: 5px; font-size: 11px; font-weight: 700; color: var(--ink-soft); max-width: 64px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; }
.galaxy-quote-card { position: absolute; bottom: 12px; left: 12px; max-width: 220px; font-size: 12px; line-height: 1.7; color: var(--muted); background: rgba(255,255,255,.7); backdrop-filter: blur(8px); border: 1px solid rgba(84, 173, 99, .15); border-radius: 4px; padding: 12px 14px; pointer-events: none; }
.galaxy-handwritten-badge { position: absolute; bottom: 16px; right: 16px; font-size: 14px; font-weight: 700; color: #557d2d; transform: rotate(-5deg); opacity: .75; pointer-events: none; letter-spacing: .02em; }
.galaxy-footer-progress { margin-top: 8px; padding-top: 18px; border-top: 1px solid var(--line); }
.galaxy-progress-meta { display: flex; justify-content: space-between; align-items: baseline; font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.galaxy-progress-meta strong { color: var(--ink); font-size: 15px; font-variant-numeric: tabular-nums; }
.galaxy-progress-rem { font-size: 12px; color: #2e6245; font-weight: 750; }
.galaxy-progress-track { height: 8px; border-radius: 999px; background: var(--mint-strong); overflow: hidden; }
.galaxy-progress-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, #54ad63, var(--lime-deep)); transition: width .6s cubic-bezier(.2,.8,.2,1); }

/* Manifesto Letter */
.manifesto-letter { max-width: 740px; margin: 36px auto 0; width: 100%; display: flex; flex-direction: column; padding: 32px 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.manifesto-letter-header { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.manifesto-letter-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 2px solid var(--white); box-shadow: 0 4px 10px rgba(20,35,30,.1); }
.manifesto-letter-author { display: block; font-size: 16px; font-weight: 800; color: var(--ink); }
.manifesto-letter-role { display: block; font-size: 12px; color: var(--muted); font-weight: 600; margin-top: 2px; }
.manifesto-letter-body { color: var(--ink-soft); font-size: 15px; line-height: 1.85; display: flex; flex-direction: column; gap: 14px; }
.manifesto-letter-body p { margin: 0; }
.manifesto-letter-body strong { color: var(--ink); }
.manifesto-letter-sign { margin-top: 8px !important; padding-top: 14px; border-top: 1px dashed var(--line); color: var(--muted); font-size: 13px; line-height: 1.75; }

/* Responsive Media Queries */
@media (max-width: 960px) {
  .theme-hero { grid-template-columns: minmax(0, 1fr); gap: 36px; padding: 64px 0 72px; }
  .pricing-grid { grid-template-columns: 1fr; width: min(100%, 460px); }
}
@media (max-width: 760px) {
  .hero { min-height: auto; padding: 44px 0 52px; }
  .features { grid-template-columns: 1fr; }
  .proof { grid-template-columns: 1fr; }
  .proof div { border-right: 0; border-bottom: 1px solid var(--line); }
  .proof div:last-child { border-bottom: 0; }
  .galaxy-viewport { padding: 28px 18px; border-radius: 4px; }
  .galaxy-quote-card { display: none; }
  .galaxy-handwritten-badge { display: none; }
  .pricing { padding: 48px 20px 24px; border-radius: 4px; }
  .pricing-grid { grid-template-columns: 1fr; margin-top: 30px; }
  .pricing-card-body { padding: 22px 24px 24px; }
  .pricing-studio { grid-template-columns: 1fr; gap: 18px; padding: 22px 20px; }
  .pricing-studio-action { align-items: flex-start; }
  .author-card { padding: 32px 18px 28px; border-radius: 4px; }
  .author-contacts { flex-direction: column; width: 100%; }
  .author-wechat-contact { width: 100%; }
  .author-wechat-contact .author-contact-pill { justify-content: center; flex: 1; }
  .author-qr-trigger { flex: 0 0 auto; }
  .author-wechat-popup { left: auto; right: 0; transform: translateY(4px); }
  .author-wechat-contact:hover .author-wechat-popup { transform: translateY(0); }
  .author-contact-pill { justify-content: center; width: 100%; }
  h1 { min-width: 0; overflow-wrap: anywhere; font-size: clamp(30px, 9.4vw, 48px); letter-spacing: .015em; line-height: 1.2; }
  .hero-line { white-space: normal; }
  .showcase-head h2 { font-size: clamp(21px, 7.6vw, 30px); }
  .pricing-heading h2 { font-size: clamp(21px, 7.3vw, 36px); }
  .theme-hero-heading { font-size: clamp(24px, 8.8vw, 32px); }
  .theme-hero-highlights { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .theme-preview-body { padding: 18px 14px; }
}
@media (max-width: 640px) {
  .showcase-head { grid-template-columns: 1fr; row-gap: 10px; }
  .galaxy-stage-wrap { min-height: 380px; }
  .galaxy-nodes-container { min-height: 380px; transform: scale(.76); }
}

/* StyleX Compiled Landing Rules */
.x1ghz6dp{margin:0}
.xggk2y7{padding:24px}
.x16trjpx:not(#\#){border-color:rgba(255,255,255,.12)}
.xwf225k:not(#\#){border-color:var(--x1l4ao2w)}
.x1u4umx8:not(#\#){border-color:var(--x1l8c4d1)}
.x1wimqro:not(#\#){border-radius:var(--x1jsiyc9)}
.x1oqik8e:not(#\#){border-radius:var(--x1mv2yrm)}
.xym5rr1:not(#\#){border-radius:var(--xvfyttp)}
.x1y0btm7:not(#\#){border-style:solid}
.xmkeg23:not(#\#){border-width:1px}
.x1af02g3:not(#\#){gap:14px}
.x33pbmt:not(#\#){gap:28px}
.xtp3fuj:not(#\#){gap:44px}
.x1y9zxd1:not(#\#){gap:48px}
.x167g77z:not(#\#){gap:8px}
.x7giv3:not(#\#){overflow:clip}
.xb3r6kr:not(#\#){overflow:hidden}
@media (max-width: 760px){.x3vy7j1.x3vy7j1:not(#\#){border-radius:var(--x1mv2yrm)}}
@media (max-width: 760px){.x7x7q8u.x7x7q8u:not(#\#){gap:18px}}
@media (max-width: 760px){.x1h992gh.x1h992gh:not(#\#){gap:34px}}
@media (max-width: 960px){.x1cyfjri.x1cyfjri:not(#\#){gap:36px}}
.xc26acl:not(#\#):not(#\#){align-content:center}
.x6s0dn4:not(#\#):not(#\#){align-items:center}
.xcjzfw7:not(#\#):not(#\#){background-color:rgba(255,255,255,.055)}
.xjbqb8w:not(#\#):not(#\#){background-color:transparent}
.x128qpxg:not(#\#):not(#\#){background-color:var(--x12g2pbc)}
.x1h70ygh:not(#\#):not(#\#){background-color:var(--x1b7czt3)}
.xiyha3f:not(#\#):not(#\#){color:var(--x130gbrw)}
.xhr0nky:not(#\#):not(#\#){color:var(--x1b7czt3)}
.xn0bfad:not(#\#):not(#\#){color:var(--x1gqaozl)}
.x1lliihq:not(#\#):not(#\#){display:block}
.x78zum5:not(#\#):not(#\#){display:flex}
.xrvj5dj:not(#\#):not(#\#){display:grid}
.x3nfvp2:not(#\#):not(#\#){display:inline-flex}
.xdt5ytf:not(#\#):not(#\#){flex-direction:column}
.x1xyhgq5:not(#\#):not(#\#){font-family:var(--xhjbjr3)}
.xfifm61:not(#\#):not(#\#){font-size:12px}
.xif65rj:not(#\#):not(#\#){font-size:14px}
.xosj86m:not(#\#):not(#\#){font-size:18px}
.x1t8wntd:not(#\#):not(#\#){font-weight:750}
.xpzx5ch:not(#\#):not(#\#){grid-template-columns:1.05fr .95fr}
.x1o61qjw:not(#\#):not(#\#){grid-template-columns:1fr 1fr}
.xju1xpo:not(#\#):not(#\#){grid-template-columns:minmax(0,1fr) auto}
.x1wlfl8j:not(#\#):not(#\#){grid-template-columns:repeat(3,1fr)}
.x185a7wo:not(#\#):not(#\#){grid-template-columns:repeat(3,minmax(0,1fr))}
.xl501l6:not(#\#):not(#\#){grid-template-columns:repeat(4,1fr)}
.xl56j7k:not(#\#):not(#\#){justify-content:center}
.x1qab1bc:not(#\#):not(#\#){justify-self:end}
.x1dgsrnt:not(#\#):not(#\#){letter-spacing:.06em}
.xbs1c6g:not(#\#):not(#\#){line-height:1.9}
.x1n2onr6:not(#\#):not(#\#){position:relative}
.x2b8uid:not(#\#):not(#\#){text-align:center}
.xuxw1ft:not(#\#):not(#\#){white-space:nowrap}
@media (max-width: 760px){.x1guth9d.x1guth9d:not(#\#):not(#\#){grid-template-columns:1fr}}
@media (max-width: 960px){.x1e75u2o.x1e75u2o:not(#\#):not(#\#){grid-template-columns:1fr}}
@media (max-width: 760px){.xwn7hfu.xwn7hfu:not(#\#):not(#\#){justify-self:center}}
@media (max-width: 760px){.xsvzm3v.xsvzm3v:not(#\#):not(#\#){white-space:normal}}
.x1s6q92g:not(#\#):not(#\#):not(#\#){border-bottom-color:var(--x1l4ao2w)}
.x1q0q8m5:not(#\#):not(#\#):not(#\#){border-bottom-style:solid}
.xso031l:not(#\#):not(#\#):not(#\#){border-bottom-width:1px}
.x1nfs9la:not(#\#):not(#\#):not(#\#){border-left-color:var(--x1b7czt3)}
.x7xk80b:not(#\#):not(#\#):not(#\#){border-left-color:var(--xkfb4a3)}
.x19ypqd9:not(#\#):not(#\#):not(#\#){border-left-style:solid}
.x1vo0akb:not(#\#):not(#\#):not(#\#){border-left-width:3px}
.x1idqpyf:not(#\#):not(#\#):not(#\#){border-right-color:var(--x1l4ao2w)}
.x32b0ac:not(#\#):not(#\#):not(#\#){border-right-style:solid}
.xs1s249:not(#\#):not(#\#):not(#\#){border-right-width:1px}
.xd2eavf:not(#\#):not(#\#):not(#\#){border-top-color:var(--x1l4ao2w)}
.x13fuv20:not(#\#):not(#\#):not(#\#){border-top-style:solid}
.x178xt8z:not(#\#):not(#\#):not(#\#){border-top-width:1px}
.x4n8cb0:not(#\#):not(#\#):not(#\#){margin-bottom:30px}
.xvl6max:not(#\#):not(#\#):not(#\#){margin-bottom:36px}
.x8x9d4c:not(#\#):not(#\#):not(#\#){margin-left:auto}
.xack27t:not(#\#):not(#\#):not(#\#){margin-right:auto}
.xdj266r:not(#\#):not(#\#):not(#\#){margin-top:0}
.x1hmvnq2:not(#\#):not(#\#):not(#\#){margin-top:14px}
.x1ajfak3:not(#\#):not(#\#):not(#\#){margin-top:42px}
.xtrj1p:not(#\#):not(#\#):not(#\#){max-width:530px}
.x1wxaq2x:not(#\#):not(#\#):not(#\#){min-height:48px}
.x1sjpjwi:not(#\#):not(#\#):not(#\#){min-height:720px}
.x65nank:not(#\#):not(#\#):not(#\#){min-height:auto}
.xn4wywj:not(#\#):not(#\#):not(#\#){padding-bottom:100px}
.x16juu1z:not(#\#):not(#\#):not(#\#){padding-bottom:108px}
.xx6bls6:not(#\#):not(#\#):not(#\#){padding-bottom:20px}
.xwxc41k:not(#\#):not(#\#):not(#\#){padding-bottom:24px}
.xq1608w:not(#\#):not(#\#):not(#\#){padding-bottom:36px}
.x1sgudl8:not(#\#):not(#\#):not(#\#){padding-bottom:48px}
.xs9asl8:not(#\#):not(#\#):not(#\#){padding-bottom:5px}
.x193rbtx:not(#\#):not(#\#):not(#\#){padding-bottom:62px}
.xf18ygs:not(#\#):not(#\#):not(#\#){padding-left:12px}
.xnm25rq:not(#\#):not(#\#):not(#\#){padding-left:16px}
.xnljgj5:not(#\#):not(#\#):not(#\#){padding-left:22px}
.xxpkpgd:not(#\#):not(#\#):not(#\#){padding-left:28px}
.xg3sno2:not(#\#):not(#\#):not(#\#){padding-left:44px}
.xnuq7ks:not(#\#):not(#\#):not(#\#){padding-right:12px}
.xyfqnmn:not(#\#):not(#\#):not(#\#){padding-right:16px}
.x1oou3sl:not(#\#):not(#\#):not(#\#){padding-right:22px}
.x1sai7j1:not(#\#):not(#\#):not(#\#){padding-right:28px}
.x126bw0h:not(#\#):not(#\#):not(#\#){padding-right:44px}
.x55dkfv:not(#\#):not(#\#):not(#\#){padding-top:102px}
.x1cnzs8:not(#\#):not(#\#):not(#\#){padding-top:20px}
.x1p5oq8j:not(#\#):not(#\#):not(#\#){padding-top:24px}
.xahk0qz:not(#\#):not(#\#):not(#\#){padding-top:58px}
.x123j3cw:not(#\#):not(#\#):not(#\#){padding-top:5px}
.x15uerrv:not(#\#):not(#\#):not(#\#){padding-top:72px}
.xadcicp:not(#\#):not(#\#):not(#\#){padding-top:92px}
.x14grs4j:not(#\#):not(#\#):not(#\#){width:min(100%,1060px)}
.x1a5dbmk:not(#\#):not(#\#):not(#\#){width:min(100%,533px)}
@media (max-width: 760px){.x1rctly8.x1rctly8:not(#\#):not(#\#):not(#\#){border-bottom-color:var(--x1l4ao2w)}}
@media (max-width: 760px){.x45zcaj.x45zcaj:not(#\#):not(#\#):not(#\#){border-bottom-style:solid}}
@media (max-width: 760px){.xas92a0.xas92a0:not(#\#):not(#\#):not(#\#){border-bottom-width:1px}}
@media (max-width: 760px){.xxazgbe.xxazgbe:not(#\#):not(#\#):not(#\#){border-right-width:0}}
@media (max-width: 760px){.x18g4rqr.x18g4rqr:not(#\#):not(#\#):not(#\#){padding-bottom:22px}}
@media (max-width: 760px){.xc1ityh.xc1ityh:not(#\#):not(#\#):not(#\#){padding-bottom:24px}}
@media (max-width: 960px){.xwb07cu.xwb07cu:not(#\#):not(#\#):not(#\#){padding-bottom:72px}}
@media (max-width: 760px){.xa8g36c.xa8g36c:not(#\#):not(#\#):not(#\#){padding-bottom:76px}}
@media (max-width: 760px){.xfizjuq.xfizjuq:not(#\#):not(#\#):not(#\#){padding-left:20px}}
@media (max-width: 760px){.x1n60x5q.x1n60x5q:not(#\#):not(#\#):not(#\#){padding-right:20px}}
@media (max-width: 760px){.xm8oeox.xm8oeox:not(#\#):not(#\#):not(#\#){padding-top:22px}}
@media (max-width: 760px){.xzqsv3s.xzqsv3s:not(#\#):not(#\#):not(#\#){padding-top:40px}}
@media (max-width: 760px){.x90s8tq.x90s8tq:not(#\#):not(#\#):not(#\#){padding-top:48px}}
@media (max-width: 960px){.x17i1zo3.x17i1zo3:not(#\#):not(#\#):not(#\#){padding-top:64px}}
@media (max-width: 760px){.x1v5ykic.x1v5ykic:not(#\#):not(#\#):not(#\#){padding-top:68px}}
@media (max-width: 960px){.x1ww9mui.x1ww9mui:not(#\#):not(#\#):not(#\#){width:min(100%,460px)}}