@charset "UTF-8";

/* Homepage colours from the verified 2026-10-09 final homepage release.
   Keep today's content, typography, layout and shared navigation unchanged. */
body.page-home {
  --site-page: #fff;
  --site-card: #f5f5f7;
  --site-soft: #e9e9ed;
  --site-deep: #101012;
  --site-deep-card: #1b1b1f;
  --site-ink: #1d1d1f;
  --site-heading: #1d1d1f;
  --site-muted: #6e6e73;
  --site-line: #dedee3;
  --site-accent: #0066cc;
  --site-on-deep: #f5f5f7;
  --site-muted-on-deep: #bebec8;
  --ink: #1d1d1f;
  --sub: #6e6e73;
  --paper: #f5f5f7;
  --blue: #0066cc;
  --line: #dedee3;
  background: #fff;
  color: #1d1d1f;
}

body.page-home .intro-section {
  background: radial-gradient(ellipse at 50% 57%, #fff 0, #f5f5f7 66%);
}
body.page-home .intro-heading h1 span {
  background: linear-gradient(115deg, #343439 0%, #7c7c85 58%, #343439 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
body.page-home .person-card {
  background: #fff;
  color: #1d1d1f;
  box-shadow: 0 16px 36px -20px rgba(17,24,50,.25), inset 0 0 0 1px rgba(255,255,255,.8);
}
body.page-home .person-card::before {
  background: radial-gradient(circle at var(--px,70%) var(--py,10%), rgba(226,235,255,.68), transparent 65%);
}
body.page-home .person-card:hover { box-shadow: 0 25px 55px -22px rgba(17,24,50,.26); }
body.page-home .person-en { color: #858589; }
body.page-home .person-role { color: #4b617e; }
body.page-home .person-description { color: #717177; }
body.page-home .person-liu {
  background: #22252b;
  color: #fff;
  box-shadow: 0 20px 45px -20px #202f50;
}
body.page-home .person-liu::before {
  background: radial-gradient(circle at var(--px,80%) var(--py,5%), #465264, transparent 72%);
}
body.page-home .person-liu .person-top h2 { color: #fff; }
body.page-home .person-liu .person-en { color: #a5acb6; }
body.page-home .person-liu .person-role { color: #b6c9e8; }
body.page-home .person-liu .person-description { color: #c0c3cb; }
body.page-home .person-liu .text-button { color: #aacdff; }
body.page-home .plus { background: rgba(120,130,150,.13); color: inherit; }

body.page-home .brand-section,
body.page-home .art-section,
body.page-home .service-discovery { background: #fff; }
body.page-home .section-heading h2 span,
body.page-home .art-heading h2 span { color: #86868b; }
body.page-home .brand-logo { border-color: #eeeef0; }
body.page-home .brand-caption,
body.page-home .art-type span { color: #929298; }
body.page-home .collaboration-label,
body.page-home .brand-name-label,
body.page-home .brand-text-list { color: #626269; }
body.page-home .collaboration-label span { color: #919197; }
body.page-home .creator-name,
body.page-home .star-name { color: #353539; }
body.page-home .creator-platform { color: #86868b; }
body.page-home .creator-avatar,
body.page-home .star-portrait { background: #f5f5f7; border-color: #ededf0; }
body.page-home .art-tags,
body.page-home .art-row .art-owner,
body.page-home .site-footer { color: #85858b; }

/* Selected work: neutral light grey with matching white, silver-rimmed cards. */
body.page-home #work {
  background: #f1f1f1;
  color: #444;
}
body.page-home #work .work-stage,
body.page-home #work .space-stage.desert-space {
  background: linear-gradient(#fff, #fff) padding-box,
    linear-gradient(125deg, #fff 0%, #bdbdbd 18%, #f8f8f8 38%, #d0d0d0 60%, #fff 78%, #a8a8a8 100%) border-box;
  background-color: #fff;
  color: #444;
  border: 1px solid transparent;
  border-radius: 28px;
  box-shadow: inset 0 1px 0 #fff,
    0 0 0 1px rgba(255,255,255,.75),
    0 3px 5px rgba(0,0,0,.045),
    0 24px 36px -24px rgba(0,0,0,.3);
}
body.page-home #work .space-stage.desert-space::after {
  display: none;
  background: none;
}
body.page-home #work .space-copy,
body.page-home #work .desert-concept-media figcaption { background: #fff; }
body.page-home #work .section-heading h2,
body.page-home #work .work-copy h2,
body.page-home #work .work-copy h3,
body.page-home #work .space-copy h2,
body.page-home #work .space-copy h3 { color: #3d3d3d; }
body.page-home #work .light h2 span { color: #737373; }
body.page-home #work .light .eyebrow,
body.page-home #work .light > p:last-child:not(.eyebrow),
body.page-home #work .work-copy .eyebrow,
body.page-home #work .space-copy .eyebrow,
body.page-home #work .work-copy > p:not(.eyebrow),
body.page-home #work .space-copy > p:not(.eyebrow),
body.page-home #work .desert-concept-media figcaption { color: #666; }
body.page-home #work .concept-play-label,
body.page-home #work button.concept-play-label { color: #4d4d4d; }
/* A clear silver rim and a soft reflected highlight, without changing control size. */
body.page-home #work .choice-group {
  padding: 3px;
  border: 1px solid transparent;
  background: linear-gradient(180deg, #fff 0%, #f9f9f9 42%, #ececec 100%) padding-box,
    linear-gradient(130deg, #fff 0%, #c2c2c2 22%, #fff 45%, #b8b8b8 73%, #fff 100%) border-box;
  box-shadow: inset 0 1px 0 #fff,
    inset 0 -1px 1px rgba(0,0,0,.04),
    0 0 0 1px rgba(190,190,190,.42),
    0 2px 4px rgba(0,0,0,.045);
}
body.page-home #work .choice { background: transparent; color: #666; }
body.page-home #work .choice.active {
  background: linear-gradient(180deg, #fff 0%, #fff 65%, #f6f6f6 100%);
  color: #3d3d3d;
  box-shadow: inset 0 0 0 1px #fff, 0 2px 5px rgba(0,0,0,.1);
}
body.page-home #work .round-button { background: #fff; color: #4d4d4d; border-color: #c8c8c8; }
body.page-home #work .round-button:hover { background: #f6f6f6; }
body.page-home #work .round-button .plus { background: #ededed; color: inherit; }
body.page-home .floating-frame { background: #93979e; }
body.page-home .floating-frame.rear,
body.page-home .frame-stage:hover .rear,
body.page-home .floating-frame.front,
body.page-home .frame-stage:hover .front { box-shadow: 0 30px 50px #30343b44; }
/* Remove only the case images' shadows; the outer work cards keep their depth. */
body.page-home #work .work-stage .frame-stage,
body.page-home #work .work-stage .floating-frame,
body.page-home #work .work-stage .frame-stage:hover .floating-frame,
body.page-home #work .work-stage .floating-frame img {
  box-shadow: none;
  filter: none;
}

/* This module was added later; use the original neutral light-card palette. */
body.page-home .presenter-feature {
  background: #f5f5f7;
  color: #1d1d1f;
  border-color: #e4e4e9;
  box-shadow: 0 16px 36px -20px rgba(17,24,50,.15), inset 0 0 0 1px rgba(255,255,255,.8);
}
body.page-home .presenter-feature-images img { background: #e9e9ed; }
body.page-home .presenter-feature-copy > span { color: #0066cc; }
body.page-home .presenter-feature:hover .presenter-feature-copy > span { color: #008eaf; }

body.page-home .film-section { background: #f5f5f7; color: #1d1d1f; }
body.page-home .film-stage { background: #516477; color: #fff; box-shadow: none; }
body.page-home .film-stage::after { background: linear-gradient(0deg, #0b182cc9, transparent 72%); }
body.page-home .film-overlay,
body.page-home .film-name,
body.page-home .film-play { color: #fff; }
body.page-home .film-kicker { color: #e5ebf1; }
body.page-home .film-play small { color: #c0cbd7; border-color: #abb7c888; }
body.page-home .play-icon { background: #fff; }
body.page-home .play-icon::after { border-left-color: #24364d; }
body.page-home .film-caption .text-button { color: #51545b; }
body.page-home .contact-section { background: #eaecef; color: #1d1d1f; }
body.page-home .contact-section h2 span { color: #81858d; }
body.page-home .contact-grid article { border-color: #caced4; }
body.page-home .contact-links { color: #585e69; }

body.page-home dialog { background: #f5f5f7; color: #1d1d1f; box-shadow: 0 30px 100px #0005; }
body.page-home dialog::backdrop { background: rgba(10,13,20,.65); }
body.page-home .dialog-close { background: #e5e5ea; color: #424249; box-shadow: none; }
body.page-home .gallery-view { background: #e9e9ed; }
body.page-home .gallery-nav button { background: #e0e0e5; color: #555; }
body.page-home .gallery-count { color: #888; }
body.page-home .film-player-state button { background: #eeeef2; color: #1d1d1f; }
body.page-home .pill-link { background: #1d1d1f; color: #fff; box-shadow: none; }
body.page-home .pill-link:hover { background: #424245; color: #fff; }

@media (max-width:760px) {
  body.page-home #work .work-stage,
  body.page-home #work .space-stage.desert-space {
    border-radius: 22px;
  }
}
