/* joint-refine-20261015-1
   Homepage only. Load after the incumbent styles. #main scopes override the
   previous appended rules without changing the navigation, media or scripts. */
html body.home-glass-refresh #main {
  --refine-ink: #233d58;
  --refine-muted: #476078;
  --refine-accent: #3c658b;
  --refine-rule: rgb(51 86 121 / .18);
  --refine-ease: cubic-bezier(.2,.8,.2,1);
  --refine-spring: cubic-bezier(.22,1.12,.36,1);
}
html[data-theme="dark"] body.home-glass-refresh #main {
  --refine-ink: #edf4ff;
  --refine-muted: #c4d3e4;
  --refine-accent: #b5d8f4;
  --refine-rule: rgb(190 215 243 / .2);
}
html body.home-glass-refresh.yu7-selected #main {
  --refine-ink: #f6f1f2;
  --refine-muted: #d3cbd0;
  --refine-accent: #efb5c0;
  --refine-rule: rgb(225 196 203 / .2);
}
/* Background choice changes exposed text and the translucent dark trays, not
   the pale creative-copy panels. Each surface keeps its own ink pairing. */
html body.home-glass-refresh:is([data-motion-background="planet"],[data-motion-background="doorway"]) #main .hero,
html body.home-glass-refresh:is([data-motion-background="planet"],[data-motion-background="doorway"]) #main .entry-gallery .destination:not(.entry-feature),
html body.home-glass-refresh #main #character-studio,
html body.home-glass-refresh #main #private {
  --refine-ink: var(--nq-glass-ink);
  --refine-muted: var(--nq-glass-muted);
  --refine-accent: var(--nq-glass-accent);
  --refine-rule: var(--nq-glass-rule);
}
html body.home-glass-refresh #main ::selection {
  color: var(--refine-ink);
  background: color-mix(in srgb,var(--refine-accent) 30%,transparent);
}

/* The full-screen background stays intact; only the readable island changes. */
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero {
  padding-block: clamp(40px,7vh,92px) clamp(36px,6vh,72px);
}
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero-copy {
  width: min(100%,56rem) !important;
  max-width: 56rem;
  padding: 28px 20px 24px !important;
}
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero-copy > .eyebrow,
html body.motion-site.home-glass-refresh #main .entry-gallery .card-kicker {
  display: none;
}
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main #welcome {
  margin: 0 0 26px;
  font-size: clamp(44px,5.6vw,84px);
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: -.035em;
  text-wrap: balance;
}
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main #welcome .headline-line:not(.headline-accent) {
  color: var(--refine-ink) !important;
  -webkit-text-fill-color: currentColor;
}
/* The existing pink/blue headline-accent gradient is an approved brand cue. */
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .hero-desc {
  max-width: 34em;
  margin: 0 0 26px;
  color: var(--refine-muted) !important;
  font-size: clamp(16px,1.2vw,19px);
  line-height: 1.8;
  letter-spacing: 0;
}
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .hero-actions { gap: 14px; }
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .scene-note {
  width: min(34rem,calc(100% - 40px)) !important;
  margin: 8px auto 0 !important;
  padding: 16px 22px;
  gap: 14px;
}
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .scene-note small { font-size: 13px; }
html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .scene-note strong { font-size: 15px; }

/* Four daily destinations, then two larger creative experiences. */
html body.motion-site.home-glass-refresh #main .entry-gallery {
  --entry-ink: var(--refine-ink);
  --entry-muted: var(--refine-muted);
  padding-block: clamp(28px,3.2vw,56px) clamp(30px,3.5vw,60px);
}
html body.motion-site.home-glass-refresh #main .entry-gallery .card-grid {
  grid-template-columns: repeat(12,minmax(0,1fr));
  gap: clamp(16px,1.5vw,28px);
  row-gap: clamp(24px,2.3vw,40px);
}
html body.motion-site.home-glass-refresh #main .entry-gallery .destination:not(.entry-feature) {
  grid-column: span 3;
  padding: clamp(22px,1.8vw,34px);
  min-height: 280px;
}
html body.motion-site.home-glass-refresh #main .entry-gallery .destination.entry-feature {
  grid-column: span 6;
  padding: 0;
}
html body.motion-site.home-glass-refresh #main .entry-gallery .destination h3 {
  color: var(--refine-ink);
  font-size: clamp(20px,1.5vw,25px);
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: -.02em;
  margin: 0 0 12px;
  text-wrap: balance;
}
html body.motion-site.home-glass-refresh #main .entry-gallery .destination > p:not(.card-kicker),
html body.motion-site.home-glass-refresh #main .entry-gallery .feature-copy > p {
  color: var(--refine-muted);
  font-size: clamp(14px,.98vw,16px);
  line-height: 1.75;
  letter-spacing: 0;
  margin: 0 0 20px;
  max-width: 32em;
}
html body.motion-site.home-glass-refresh #main .entry-gallery .badge {
  color: var(--refine-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .01em;
  opacity: 1;
}
html body.motion-site.home-glass-refresh #main .entry-gallery .card-cta {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--refine-ink);
  border-color: var(--refine-rule);
  font-size: 14px;
  font-weight: 550;
  line-height: 1.5;
  padding-top: 14px;
}
html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-link {
  grid-template-columns: 44% minmax(0,1fr);
}
html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-copy {
  justify-content: center;
  padding: clamp(24px,2.2vw,42px);
}
html body.motion-site.home-glass-refresh #main .entry-gallery .feature-copy .card-top { margin-bottom: 12px; }
html body.motion-site.home-glass-refresh #main .entry-gallery .feature-copy h3 { font-size: clamp(22px,1.7vw,29px); }
/* Keep all source alpha, music notation and Luotianyi geometry untouched. */

/* A quieter interval between the entrance cards and the private tools. */
html body.motion-site.home-glass-refresh #main #character-studio {
  margin-block: 4px clamp(36px,4.5vw,72px);
}
html body.motion-site.home-glass-refresh #main #character-studio .character-copy {
  width: 49%;
  max-width: 720px;
  padding-top: clamp(136px,11.5vw,184px);
  padding-bottom: 166px;
}
html body.motion-site.home-glass-refresh #main #character-studio #character-title {
  color: var(--refine-ink) !important;
  font-size: clamp(36px,3.5vw,64px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.03em;
  margin-bottom: 22px;
}
html body.motion-site.home-glass-refresh #main #character-studio .character-intro {
  font-size: 14px;
  letter-spacing: .01em;
  margin-bottom: 16px;
}
html body.motion-site.home-glass-refresh #main #character-studio .character-message {
  color: var(--refine-muted) !important;
  font-size: clamp(16px,1.25vw,20px);
  line-height: 1.8;
  max-width: 26em;
  margin-bottom: 26px;
}
html body.motion-site.home-glass-refresh #main #character-studio .character-actions {
  gap: 10px;
  max-width: 450px;
}
html body.motion-site.home-glass-refresh #main #character-studio .character-pill {
  min-height: 44px;
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 550;
  line-height: 1.5;
}
html body.motion-site.home-glass-refresh #main #character-studio .character-share { font-size: 13px; font-weight: 400; }
html body.motion-site.home-glass-refresh #main #character-studio .character-hint { font-size: 13px; }
html body.motion-site.home-glass-refresh #main #character-studio .character-hint strong { font-size: 13px; }
/* The portrait is the moving subject; its decorative orbit can rest. */
html body.motion-site.home-glass-refresh #main #character-studio .character-orbit { animation: none !important; opacity: .45; }

/* Reuse the real 4/4/2 HTML groups inside one uninterrupted glass panel. */
html body.motion-site.home-glass-refresh #main #private.private-circuit.private-workspace.private-unified {
  --private-ink: var(--refine-ink);
  --private-muted: var(--refine-muted);
  --private-accent: var(--refine-accent);
  padding: clamp(24px,2.8vw,48px);
  margin-block: 0 clamp(28px,3vw,48px);
}
html body.motion-site.home-glass-refresh #main #private.private-unified > .private-intro {
  align-items: end;
  gap: 20px 40px;
  padding: 0 4px 28px;
  margin-bottom: 28px;
  border-bottom-color: var(--refine-rule);
}
html body.motion-site.home-glass-refresh #main #private.private-unified #private-title {
  color: var(--refine-ink) !important;
  font-size: clamp(28px,2.6vw,38px);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.025em;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-intro p { font-size: 14px; line-height: 1.75; }
html body.motion-site.home-glass-refresh #main #private.private-unified .private-links.private-link-groups {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 28px;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link-group {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  grid-column: auto;
  align-items: start;
  gap: 8px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-group-title {
  position: static;
  display: flex;
  align-items: center;
  gap: 18px;
  width: auto;
  height: auto;
  min-height: 28px;
  margin: 0;
  padding: 0 4px 6px;
  overflow: visible;
  clip-path: none;
  white-space: normal;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: .02em;
  color: var(--refine-muted) !important;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-group-title::after {
  height: 1px;
  background: var(--refine-rule);
  opacity: .75;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-group-links {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  grid-template-rows: none;
  gap: 12px;
  min-width: 0;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-manage > .private-group-links {
  grid-template-columns: repeat(2,minmax(0,1fr));
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  grid-template-rows: auto 1fr;
  align-content: start;
  align-items: start;
  justify-content: start;
  min-height: 180px;
  padding: 18px;
  gap: 14px;
  border-radius: 16px;
  overflow: visible;
  transform: none !important;
  transition: transform .34s var(--refine-ease);
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link .tile-icon {
  grid-column: 1;
  grid-row: 1;
  width: 40px;
  height: 40px;
  min-width: 40px;
  flex-basis: 40px;
  border-radius: 12px;
  color: var(--refine-accent) !important;
  transition: transform .34s var(--refine-ease);
}
html body.motion-site.home-glass-refresh #main #private.private-unified .tile-icon .icon { width: 23px; height: 23px; }
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link-copy {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link strong {
  color: var(--refine-ink) !important;
  font-size: clamp(16px,1.12vw,19px);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link small {
  color: var(--refine-muted) !important;
  font-size: 14px;
  line-height: 1.7;
  margin-top: 8px;
  max-width: 32em;
  overflow-wrap: anywhere;
}
html body.motion-site.home-glass-refresh #main #private.private-unified :is(.private-category,.private-action) { display: none; }
html body.motion-site.home-glass-refresh #main #private.private-unified .private-manage .private-link {
  grid-template-columns: 40px minmax(0,1fr);
  grid-template-rows: auto;
  min-height: 106px;
  align-items: start;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-manage .private-link-copy { grid-column: 2; grid-row: 1; }
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link::before { transition: opacity .22s ease; }
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link:focus-visible {
  outline: 2px solid var(--refine-accent);
  outline-offset: 3px;
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  html:not([data-motion="paused"]) body.motion-site.home-glass-refresh:not(:has(#motion-pause:checked,#private-motion-pause:checked)) #main #private.private-unified .private-link:is(:hover,:focus-visible) {
    transform: translateY(-4px) scale(1.018) !important;
    transition: transform .42s var(--refine-spring);
  }
  html:not([data-motion="paused"]) body.motion-site.home-glass-refresh:not(:has(#motion-pause:checked,#private-motion-pause:checked)) #main #private.private-unified .private-link:is(:hover,:focus-visible) .tile-icon {
    transform: translateY(-1px) scale(1.025);
    transition: transform .42s var(--refine-spring);
  }
}

@media (max-width:1120px) {
  html body.motion-site.home-glass-refresh #main .entry-gallery .destination:not(.entry-feature) { grid-column: span 6; min-height: 250px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-link { grid-template-columns: 1fr; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-copy { padding: 24px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-group-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link { min-height: 174px; }
}
@media (max-width:900px) and (min-width:651px) {
  html body.motion-site.home-glass-refresh #main #character-studio .character-copy { padding-top: 128px; padding-bottom: 200px; }
  html body.motion-site.home-glass-refresh #main #character-studio .character-message { font-size: 16px; }
  html body.motion-site.home-glass-refresh #main #character-studio .character-pill { font-size: 13px; padding-inline: 12px; }
}
@media (max-width:650px) {
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero { padding-block: 12px 24px; }
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero-copy { width: 100% !important; padding: 22px 8px 14px !important; }
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main #welcome { font-size: clamp(34px,9.3vw,48px); line-height: 1.2; margin-bottom: 20px; }
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .hero-desc { font-size: 15px; line-height: 1.75; margin-bottom: 22px; }
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .hero-actions { gap: 10px; }
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main .hero .scene-note { width: calc(100% - 16px) !important; margin-top: 6px !important; padding: 13px 16px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery { padding-block: 20px 34px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; row-gap: 16px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .destination:not(.entry-feature) { grid-column: span 1; min-height: 240px; padding: 16px 14px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .destination h3 { font-size: 18px; line-height: 1.45; margin-bottom: 10px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .destination > p:not(.card-kicker) { font-size: 14px; line-height: 1.7; margin-bottom: 14px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .badge { font-size: 12px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .card-cta { font-size: 13px; min-height: 44px; padding-top: 12px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .destination.entry-feature { grid-column: 1/-1; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-link { grid-template-columns: 37% minmax(0,1fr); }
  html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-copy { padding: 20px 16px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .feature-copy h3 { font-size: 19px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .feature-copy > p { font-size: 14px; line-height: 1.7; margin-bottom: 14px; }
  html body.motion-site.home-glass-refresh #main #character-studio { margin-block: 2px 32px; }
  html body.motion-site.home-glass-refresh #main #character-studio .character-copy {
    width: 100%;
    max-width: none;
    padding-top: 498px;
    padding-right: var(--character-text-inset,24px);
    padding-bottom: 22px;
  }
  html body.motion-site.home-glass-refresh:not(.yu7-selected) #main #character-studio .character-copy { padding-top: 354px; }
  html body.motion-site.home-glass-refresh #main #character-studio #character-title { font-size: 30px; line-height: 1.25; margin-bottom: 16px; }
  html body.motion-site.home-glass-refresh #main #character-studio .character-intro { font-size: 13px; margin-bottom: 12px; }
  html body.motion-site.home-glass-refresh #main #character-studio .character-message { font-size: 15px; line-height: 1.75; margin-bottom: 20px; }
  html body.motion-site.home-glass-refresh #main #character-studio .character-pill { font-size: 13px; padding-inline: 14px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified { padding: 22px 14px 18px; margin-bottom: 24px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified > .private-intro { display: block; padding: 0 4px 22px; margin-bottom: 22px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified #private-title { font-size: 27px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-intro p { margin-top: 12px; font-size: 14px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-links.private-link-groups { gap: 24px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-group-title { font-size: 15px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-group-links,
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-manage > .private-group-links { grid-template-columns: minmax(0,1fr); gap: 6px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link,
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-manage .private-link {
    grid-template-columns: 36px minmax(0,1fr);
    grid-template-rows: auto;
    min-height: 104px;
    padding: 14px 8px;
    gap: 12px;
  }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link .tile-icon { width: 36px; height: 36px; min-width: 36px; flex-basis: 36px; border-radius: 11px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link-copy { grid-column: 2; grid-row: 1; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link strong { font-size: 16px; }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link small { margin-top: 6px; font-size: 14px; line-height: 1.65; }
}
@media (max-width:359px) {
  html body.motion-site.home-glass-refresh #main .entry-gallery .card-grid { grid-template-columns: minmax(0,1fr); }
  html body.motion-site.home-glass-refresh #main .entry-gallery .destination:not(.entry-feature) { min-height: 0; padding: 20px; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-link { grid-template-columns: 1fr; }
  html body.motion-site.home-glass-refresh #main .entry-gallery .entry-feature .feature-copy { padding: 20px; }
}
/* Static focus/active surfaces remain available when motion is disabled. */
html[data-motion="paused"] body.motion-site.home-glass-refresh #main #private.private-unified .private-link,
html body.motion-site.home-glass-refresh:has(#motion-pause:checked,#private-motion-pause:checked) #main #private.private-unified .private-link,
html[data-motion="paused"] body.motion-site.home-glass-refresh #main #private.private-unified .private-link .tile-icon,
html body.motion-site.home-glass-refresh:has(#motion-pause:checked,#private-motion-pause:checked) #main #private.private-unified .private-link .tile-icon {
  transform: none !important;
  transition: none !important;
}
@media (prefers-reduced-motion:reduce),(hover:none),(pointer:coarse) {
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link,
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link .tile-icon { transform: none !important; transition: none !important; }
}
@media (forced-colors:active) {
  html body.home-glass-refresh #main { --refine-ink: CanvasText; --refine-muted: CanvasText; --refine-accent: LinkText; --refine-rule: CanvasText; }
  html body.home-glass-refresh #main #private.private-unified .private-link { border-color: ButtonText !important; }
}