/* Visitor-facing refinements: readable typography, independent artwork, no admin entry. */
dialog.viewer{box-sizing:border-box;margin:auto;padding:0;height:min(85dvh,900px);max-height:calc(100dvh - 32px);overflow:hidden;border-radius:14px}dialog.viewer[open]{display:flex;flex-direction:column}.viewer .viewer-head{flex:0 0 auto;min-height:64px}.viewer iframe{display:block;flex:1 1 0;min-height:0;height:0;width:100%;border:0}
.people-search-dialog{width:min(620px,calc(100vw - 32px));height:auto;max-height:80vh;overflow:auto;border-radius:12px}.people-search-dialog .viewer-head{justify-content:space-between}.people-search-body{padding:8px 24px 24px}.people-search-body>p{font-size:14px;color:#647064}.people-search-body .search{margin-top:16px}.people-search-body .results{max-height:45vh;overflow:auto}
:root{--serif:'Microsoft YaHei','PingFang SC',sans-serif;--sans:'Microsoft YaHei','PingFang SC',sans-serif}
body{font-weight:400;-webkit-font-smoothing:antialiased}body::before{opacity:.015}
.brand strong{font-weight:650;letter-spacing:1px}.seal{font-family:'SimSun',serif;font-weight:700}
h1{font-weight:650;font-size:clamp(42px,4.1vw,64px);line-height:1.42;letter-spacing:-1px}
.hero-copy>p{font-family:var(--sans);font-size:17px;line-height:1.95;color:#536053}
.outline{background:transparent;cursor:pointer;white-space:nowrap}
.header{background:#f7f4ec}.identity-item strong{font-weight:600;font-size:23px;letter-spacing:.3px}.identity-item span{font-size:13px;color:#657061}
.hero-art{width:56%;mask-image:linear-gradient(to right,transparent,#000 16%);-webkit-mask-image:linear-gradient(to right,transparent,#000 16%)}
.hero-art img{position:absolute;inset:0;width:100%;height:100%;max-width:100%;object-fit:cover;object-position:65% center;opacity:1}
.hero-wordmark{position:absolute;right:22px;top:38px;writing-mode:vertical-rl;letter-spacing:5px;font:600 20px var(--sans);border:1px solid #a3413066;border-radius:3px;padding:15px 7px;color:var(--red);background:#f7f4ecd9;z-index:2}
.section-heading h2,.editorial-title h2{font-weight:650;font-size:30px}.section-heading h2::before,.section-heading h2::after,.timeline::before,.editorial-title::after{display:none}
.section{padding:62px 0}.timeline{gap:28px}.era{grid-template-columns:64px minmax(0,1fr);gap:25px;padding:32px;background:#fffdf65c;border-radius:7px;box-shadow:0 5px 22px #263b2803}
.era-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:#e9eee4;color:#53715b;align-self:center}.era-icon svg{width:34px;height:34px;stroke:currentColor;stroke-width:1.5;fill:none}
.era h3{font-weight:600;font-size:24px}.era p{font-family:var(--sans);font-size:15px;line-height:1.9;color:#536253}
.story-grid{gap:32px}.story h3{font-weight:650;font-size:24px}.story>p{font-family:var(--sans);font-size:15px;line-height:1.95;color:#536053}
.story-art{width:100%;height:205px;max-width:none;margin:0;background:none!important;mix-blend-mode:multiply;overflow:hidden;border-radius:5px}
.story-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.story details{margin-top:18px}.story details summary{font-size:14px;padding:4px 0}.story details p{font-family:var(--sans);font-size:14px;line-height:2;color:#556154;margin:12px 0}
.story details[open]{padding-bottom:8px}.tools-section .section-heading p{font-size:14px}
button.tool{font-family:var(--sans);width:100%;color:var(--ink);cursor:pointer;text-align:left}.tool h3{font-weight:600;font-size:23px}.tool p{font-size:13px;line-height:1.7}
.footer{padding-top:30px;font-size:12px;align-items:center;flex-wrap:wrap}.footer button{font-size:12px;border:0;background:none;cursor:pointer;color:var(--red);padding:0}
.family-contact-dialog [hidden]{display:none!important}
@media(max-width:1050px){.identity-item strong{font-size:20px}.hero-art{width:55%}.hero-art img{width:100%;height:100%;top:0}.story-art{height:175px}.era{padding:25px;grid-template-columns:52px minmax(0,1fr);gap:18px}.era-icon{width:52px;height:52px}}
@media(max-width:760px){.header-inner{gap:14px}.brand strong{font-size:18px}.header .outline{padding:8px 11px}.hero-copy{padding:42px 0 290px}h1{font-size:42px;letter-spacing:0}.hero-copy>p{font-size:15px}.hero-art{width:100%;height:285px;mask-image:linear-gradient(to bottom,transparent,#000 22%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%)}.hero-art img{width:100%;height:100%;top:0;right:0;object-position:68% center}.hero-wordmark{font-size:14px;top:33px;right:20px;letter-spacing:3px;padding:10px 5px}.identity-item strong{font-size:20px}.section{padding:45px 0}.section-heading h2,.editorial-title h2{font-size:26px}.era{grid-template-columns:48px minmax(0,1fr);padding:22px 18px;gap:16px}.era-icon{width:48px;height:48px}.era-icon svg{width:29px;height:29px}.era h3{font-size:23px}.era p{font-size:14px}.story-art{height:auto;aspect-ratio:4/3;max-height:280px}.story h3{font-size:24px}.story details p{font-size:14px}.footer{padding:22px 0}}

/* Watercolor scenery and illustrated migration cards from the concept design. */
.identity{position:relative;isolation:isolate;background:#f4f1e8}
.identity::before{content:"";position:absolute;inset:0;background:url('ink-mountains-v1.png') center bottom/100% auto no-repeat;opacity:.35;pointer-events:none;z-index:-1}
.identity-inner{position:relative;min-height:116px;align-items:center;padding:19px 0}
.identity-item{gap:16px;text-shadow:0 1px #fff9}
.identity-icon{width:59px;height:47px;flex:none;color:#766e60}
.identity-item img.identity-icon{display:block;width:72px;height:62px;object-fit:contain}
.identity-item strong{font-weight:650}
.history-surface{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#faf8f1 0%,#f7f4ec 100%)}
.history-surface::before{content:"";position:absolute;inset:auto 0 0;height:190px;background:url('ink-mountains-v1.png') center bottom/100% auto no-repeat;opacity:.18;pointer-events:none;z-index:-1}
.history-surface .section{position:relative;padding-top:66px;padding-bottom:72px}
.history-surface .section-heading{margin-bottom:34px}
.history-surface .section-heading h2::before,.history-surface .section-heading h2::after{display:block;width:53px}
.timeline{gap:34px;align-items:stretch}
.timeline::before{display:block;left:calc(50% - 20px);right:calc(50% - 20px);top:50%;border-top:2px dashed #aa4535;z-index:2}
.era{display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);gap:0;align-items:stretch;min-height:216px;padding:0;background:rgba(255,253,248,.88);border-color:#d6d0c3;box-shadow:0 11px 30px #4c443611;overflow:visible}
.era:first-child::after,.era:last-child::before{content:"";position:absolute;top:calc(50% - 5px);width:10px;height:10px;border-radius:50%;background:#a34130;z-index:3;box-shadow:0 0 0 3px #f7f4ec}
.era:first-child::after{right:-22px}.era:last-child::before{left:-22px}
.era-art{position:relative;min-width:0;overflow:hidden;border-radius:7px 0 0 7px}
.era-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:22% center}
.era-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,rgba(255,253,248,.95));pointer-events:none}
.era-copy{position:relative;z-index:1;align-self:center;padding:22px 20px 22px 0}
.era .tag{display:inline-block;padding:4px 11px;font-weight:600;letter-spacing:.08em}
.era h3{margin:12px 0 7px;color:#183f37;font-size:26px}
.era p{font-size:14px;line-height:1.8}
.tools-section{position:relative;isolation:isolate;background:#e8ede8}
.tools-section::before{content:"";position:absolute;inset:0;background:url('ink-mountains-v1.png') center bottom/100% auto no-repeat;opacity:.2;pointer-events:none;z-index:-1}
.tools-grid .tool{background:rgba(250,248,240,.46)}
.tools-grid .tool:hover,.tools-grid .tool:focus-visible{background:rgba(250,248,240,.62)}
.tool img.tool-icon{display:block;width:82px;height:82px;object-fit:contain;flex:none}
@media(max-width:1050px){.identity-icon{width:48px;height:43px}.timeline{gap:24px}.era{grid-template-columns:38% minmax(0,1fr);min-height:220px;padding:0;gap:0}.era-copy{padding:18px 14px 18px 0}.era h3{font-size:23px}.era p{font-size:13px}.era:first-child::after{right:-17px}.era:last-child::before{left:-17px}}
@media(max-width:1050px){.identity-item img.identity-icon{width:58px;height:52px}.tool img.tool-icon{width:68px;height:68px}}
@media(max-width:760px){.identity-inner{min-height:0;padding:22px 0}.identity-icon{width:42px;height:39px}.history-surface .section{padding:48px 0 54px}.history-surface .section-heading h2::before,.history-surface .section-heading h2::after{width:30px}.timeline{display:grid;grid-template-columns:1fr;gap:20px}.timeline::before,.era:first-child::after,.era:last-child::before{display:none}.era{grid-template-columns:40% minmax(0,1fr);min-height:180px;margin:0;padding:0;gap:0}.era-copy{padding:16px 13px 16px 0}.era h3{font-size:21px}.era p{font-size:13px;line-height:1.65}}
@media(max-width:760px){.identity-item img.identity-icon{width:46px;height:43px}.tool img.tool-icon{width:66px;height:66px}}
@media(max-width:480px){.era{grid-template-columns:1fr}.era-art{height:150px;border-radius:7px 7px 0 0}.era-art img{object-position:center 45%}.era-art::after{background:linear-gradient(0deg,rgba(255,253,248,.92),transparent 55%)}.era-copy{padding:0 18px 20px}.era h3{margin:9px 0 5px}}

/* Keep the family overview visible in the first desktop viewport at 100% zoom. */
@media(min-width:761px){
  .hero-grid{min-height:0}
  .hero-copy{padding:42px 0 28px}
  .hero-copy h1{line-height:1.36;margin:18px 0 16px}
  .hero-copy .actions{margin:24px 0 20px}
  .identity-inner{min-height:108px;padding:16px 0}
}

/* Search suggestions float over the page instead of moving the family overview. */
.hero{overflow:visible}
.hero-copy{position:relative;z-index:6}
.hero-copy>.results{position:absolute;top:calc(100% - 28px);left:0;width:min(500px,100%);max-height:min(300px,44vh);margin:0;z-index:8;background:#fffdf8;border:1px solid #cfb7a3;border-top:4px solid #a34130;border-radius:7px;box-shadow:0 18px 42px #233b2c40,0 3px 10px #233b2c14}
.hero-copy>.results:not(:empty)::before{content:"查找结果 · 点击姓名查看完整祖脉";display:block;padding:9px 16px 7px;color:#a34130;background:#f7f1e8;font-size:12px;font-weight:600;letter-spacing:.03em;border-bottom:1px solid #e6d9ca}
.hero-copy>.results .result{background:#fffdf8;padding:13px 16px}
.hero-copy>.results .result:hover,.hero-copy>.results .result:focus-visible{background:#e9f0e8}
.hero-copy>.results .result strong{font:600 20px var(--serif)}
.hero-copy>.results .result small{color:#647369;font-size:12px}
.hero-copy>.results .result-message{color:#53675a;line-height:1.7}
@media(max-width:760px){.hero-copy>.results{top:calc(100% - 290px);max-height:230px}}

