/* Layout proportions follow the supplied mobile screenshots. */
.app{container-type:inline-size;background:#fbf4ea}
.topbar{background:rgba(251,244,234,.97);border-bottom:1px solid #edf0e8}
.brand-row{position:relative;justify-content:center;min-height:16.8cqw;padding:2.8cqw 12cqw}
.brand-name{font-family:"Noto Serif SC","Songti SC","SimSun",serif;font-size:6.4cqw;letter-spacing:.04em;font-weight:800}
.back{position:absolute;left:3.4cqw;top:50%;transform:translateY(-50%);width:6.8cqw;height:9cqw;font-size:7cqw;font-weight:300}
.tabs{position:relative;gap:5cqw;padding:0 8cqw;justify-content:center}
.tab{font-size:3.45cqw;padding:3cqw 2.4cqw 3.7cqw;line-height:1.3;color:#808780}
.tab.active:after{display:none}.tab-indicator{position:absolute;left:0;bottom:0;height:3px;border-radius:3px;background:var(--forest);pointer-events:none;opacity:0;transition:width .34s cubic-bezier(.22,.72,.24,1),transform .34s cubic-bezier(.22,.72,.24,1),opacity .15s ease}.tab-indicator.ready{opacity:1}.tab-indicator:not(.ready){transition:none}@media(prefers-reduced-motion:reduce){.tab-indicator{transition:none}}
.panel{padding-top:7.4cqw;padding-bottom:12cqw}
.hero{margin:0 3.4cqw;height:59.4cqw;border-radius:5.7cqw}
.play{width:16cqw;height:16cqw;font-size:6.8cqw;top:48%}
.hero-label{left:4.8cqw;bottom:4.2cqw}
.hero-label strong{font-size:5.1cqw;line-height:1.4}
.hero-label small{font-size:3.65cqw;margin-top:0}
.nav-card{margin:3.4cqw 3.4cqw 0;padding:3.7cqw;border-radius:4.6cqw;gap:3cqw;background:#edf2eb;border-color:#e6ece4}
.nav-icon{width:11.1cqw;height:11.1cqw;border-radius:3.4cqw;font-size:5cqw}
.nav-card strong{font-size:3.8cqw;line-height:1.4}
.nav-card small{font-size:3.1cqw;margin-top:.8cqw;white-space:nowrap}
.nav-card a{font-size:3.2cqw;padding:3cqw 3.6cqw}
.detail-view{padding:9cqw 4.2cqw 0}
.detail-heading{display:flex;align-items:center;justify-content:space-between;gap:2cqw;margin-bottom:6cqw}
.detail-view h1{font-size:6.4cqw;line-height:1.3;margin:0;letter-spacing:0;white-space:nowrap}
.speak{font-size:2.25cqw;padding:1.6cqw 2cqw;white-space:nowrap;flex:none;background:#eff6ef;border-color:#dbe9dc}
.detail-body p{font-size:3.15cqw;line-height:1.9;margin:0 0 3.8cqw;color:#78877c;text-align:justify;text-indent:2em}
.detail-body h2{font-size:4.3cqw;line-height:1.6;margin:6cqw 0 3cqw;padding-top:3.4cqw;border-top:1px solid #edf0e7}
.detail-body h3{font-size:3.7cqw;line-height:1.5;margin:4cqw 0 2cqw}
#panel-seasons{padding-top:6.8cqw}
.season-list{padding:0 3.7cqw;gap:4.5cqw}
.season-card{border:0;border-radius:5.2cqw;background:#fff;box-shadow:0 12px 28px rgba(28,52,38,.045)}
.season-card img{height:52.2cqw}
.season-card .caption{padding:4.6cqw 4.6cqw;min-height:16cqw}
.season-card strong{font-size:6cqw;line-height:1}
.season-card span{font-size:2.8cqw;letter-spacing:.08em;color:#929790}
#panel-record{padding-top:6cqw}
.record-step{margin:0 3.7cqw 4cqw;padding:3.4cqw;border:0;border-radius:4.1cqw;background:#fff;box-shadow:0 8px 25px rgba(28,52,38,.025)}
.step-title{gap:2.8cqw;margin-bottom:3.6cqw}
.step-num{width:7.4cqw;height:7.4cqw;font-size:3.3cqw}
.step-title strong{font-size:4.1cqw}
.photo-pick{height:40.6cqw;border-radius:3.6cqw;background:#f6faf7}
.photo-pick span{font-size:8.2cqw}
.photo-pick small{font-size:3.3cqw}
.stamp-row{gap:3.2cqw}
.stamp-preview{width:19cqw;height:19cqw;flex:none;border-width:3px;font-size:3.3cqw}
.stamp-copy strong{font-size:3.8cqw;line-height:1.5}
.stamp-copy p{font-size:2.7cqw;line-height:1.65;margin:.8cqw 0 0;text-indent:2em}
.stamp-action{font-size:2.75cqw;padding:2.1cqw 2.6cqw}
.thoughts{min-height:27cqw;border-radius:3.5cqw;padding:3.4cqw;font-size:3.5cqw;line-height:1.8;text-indent:2em}
.counter{font-size:2.8cqw;margin-top:1.8cqw}
.generate{margin:0 3.7cqw;width:92.6cqw;border-radius:3.7cqw;padding:3.8cqw;font-size:4.2cqw;box-shadow:none}
.record-foot{font-size:2.8cqw;line-height:1.8;padding:4cqw 7cqw;color:#89968c}
#panel-record>.record-foot,#panel-seasons>.record-foot{display:none}
#panel-folklore{padding-top:4.3cqw}
.legend-feature{margin:0 4cqw;border-radius:4cqw;box-shadow:0 10px 28px rgba(28,52,38,.025);background:#fff}
.legend-art{height:49.2cqw}
.legend-index{left:4cqw;bottom:3cqw;font-size:3.3cqw;letter-spacing:.13em}
.share{position:absolute;z-index:2;right:3cqw;top:3cqw;width:8.5cqw;height:8.5cqw;padding:0;display:grid;place-items:center;font-size:4.5cqw;color:#fff;background:rgba(22,54,43,.65);border:1px solid rgba(255,255,255,.5)}
.legend-body{padding:5.4cqw 4cqw 12cqw}
.legend-body h2{font-size:5.5cqw;margin:0 0 3cqw}
.legend-body p{font-size:3.4cqw;line-height:1.85;color:#7c8783;text-align:justify;text-indent:2em}
.legend-switch{padding:4cqw 4cqw 0;gap:2.8cqw}
.legend-option{padding:2.4cqw;border:0;border-radius:3.8cqw;background:#fff;gap:3cqw}
.legend-option img{width:17cqw;height:14cqw;border-radius:2.4cqw}
.legend-option strong{font-size:3.5cqw;color:#25342f}
.legend-option small{font-size:2.6cqw;display:block;margin-top:1.2cqw}
.legend-option .arrow{font-size:5cqw;margin-right:1.5cqw}
#panel-history{padding-top:4.8cqw}
.simple-head{padding:0 6.2cqw 4.5cqw}
.simple-head h1{font-size:6.4cqw;margin:0 0 2.2cqw;line-height:1.4}
.simple-head p{font-size:2.8cqw;line-height:1.7;margin:0;color:#89968b}
.history-hero{margin:0 6.2cqw;border-radius:4.1cqw}
.history-hero img{height:54cqw}
.history-hero figcaption{font-size:2.2cqw;line-height:1.6;padding:2.6cqw 2cqw;background:#eef3ed;color:#92a094}
.history-copy{padding:0 6.6cqw 9cqw}
.history-highlight{font-size:4.2cqw;line-height:1.5;border-left-width:2px;padding:.3cqw 3cqw;margin:6cqw 0 4cqw}
.history-copy p{font-size:2.85cqw;line-height:1.95;margin:0 0 4.3cqw;color:#77847d;text-align:justify;text-indent:2em}
@media(max-width:320px){.speak{font-size:2.3cqw}.nav-card{gap:2.4cqw}}

/* Project credits are shared by every screen. Original transparent artwork
   keeps the footer background identical to its parent page. */
.home,.loading{height:auto;min-height:100dvh}
.home{background:#fbf4ea}
.home-scene,.loading-scene{position:relative;height:100dvh;overflow:hidden}
.home-bg{height:100%}
.settings-button{position:absolute;right:3.4cqw;top:50%;transform:translateY(-50%);width:10cqw;height:10cqw;min-width:32px;min-height:32px;display:grid;place-items:center;padding:2.1cqw;border:0;border-radius:50%;background:transparent;color:var(--forest);z-index:5}
.settings-button svg{display:block;width:100%;height:100%}
.settings-button:hover{background:rgba(29,75,62,.07)}
.home-scene>.settings-button,.loading-scene>.settings-button{right:3.4cqw;top:2.5%;transform:none;background:#fbf4ea;border:1px solid #173244;color:#173244}
.loading-scene>.settings-button{background:rgba(251,244,234,.88)}
.home-scene>.settings-button.home-info-button{right:3.4cqw;top:1.8%;width:9.2cqw;height:9.2cqw;min-width:36px;min-height:36px;padding:1.1cqw;background:rgba(29,75,62,.08);border:1px solid rgba(29,75,62,.2);color:var(--forest);box-shadow:none}.home-info-button svg circle{display:none}.home-info-button svg path{stroke-width:1.8}
.panel{padding-bottom:0}
.history-copy{padding-bottom:0}
.brand-footer{margin-top:8cqw;padding:8cqw 7cqw 6cqw;border-top:1px solid rgba(164,167,146,.15);background:transparent}
.footer-logos{display:flex;align-items:center;justify-content:center;gap:3.4cqw}
.footer-logos img{display:block;object-fit:contain;height:auto;min-width:0}
.footer-logos .fund-logo{width:42cqw}
.footer-logos .publisher-logo{width:36.5cqw}
.footer-divider{width:1px;height:7cqw;background:#d7d9c9;flex:none}
.icp-number{margin:5.5cqw 0 0;text-align:center;text-indent:0;font-size:3.3cqw;line-height:1.5;letter-spacing:0;color:#838577;white-space:nowrap}
.home>.brand-footer,.loading>.brand-footer{margin-top:0}
.copyright-page{position:fixed;z-index:50;top:0;bottom:0;left:50%;width:min(100%,440px);min-height:100dvh;overflow-y:auto;overscroll-behavior:contain;background:#fbf4ea;transform:translateX(-50%);box-shadow:-12px 0 32px rgba(27,53,45,.1)}
.copyright-page.copyright-opening{animation:copyright-slide-in .52s cubic-bezier(.22,.72,.24,1) both}.copyright-page.copyright-closing{animation:copyright-slide-out .48s cubic-bezier(.4,0,.3,1) both}.copyright-overlay-open{overflow:hidden}
@keyframes copyright-slide-in{from{transform:translateX(50%)}to{transform:translateX(-50%)}}
@keyframes copyright-slide-out{from{transform:translateX(-50%)}to{transform:translateX(50%)}}
@media(prefers-reduced-motion:reduce){.copyright-page.copyright-opening,.copyright-page.copyright-closing{animation-duration:.01ms}}
.copyright-page .brand-row{min-height:56px;padding:12px 52px}
.copyright-page .brand-name{font-family:inherit;font-size:18px;font-weight:600;line-height:1.4;letter-spacing:0}
.copyright-page .back{width:32px;height:36px;font-size:28px}
.copyright-content{padding:28px clamp(20px,6cqw,28px) 0;font-size:14px;line-height:1.85}
.copyright-content h1{font-family:inherit;font-size:22px;font-weight:600;line-height:1.45;letter-spacing:.02em;text-align:center;margin:0 0 12px;color:var(--forest)}
.copyright-fund{font-size:13px;line-height:1.75;text-align:center;margin:0 0 8px;color:#617465}
.copyright-isbn{font-size:12px;line-height:1.75;text-align:center;margin:0 0 28px;color:#7b847b;overflow-wrap:anywhere}
.credits{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:14px;row-gap:14px;margin:0;line-height:1.75}
.credits dt{font-size:14px;font-weight:500;letter-spacing:.04em;color:#72917f;white-space:nowrap}
.credits dd{margin:0;font-size:14px;font-weight:500;color:#294c3b;overflow-wrap:anywhere}
.photography-credits{margin:22px 0;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.copyright-content h2{font-size:14px;font-weight:500;line-height:1.85;margin:0 0 12px;color:#78867c}
.photography-credits h2 span{font-weight:400;font-size:12px;color:#879288}
.photographer-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px 8px;padding:0;font-size:14px;font-weight:500;line-height:1.75;color:#294c3b}
.photographer-grid span{white-space:nowrap}
.copyright-notice{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}
.copyright-notice h2{margin-bottom:8px}
.copyright-notice p{font-size:14px;line-height:1.9;margin:0;text-align:justify;text-indent:2em;color:#586d5e}
.copyright-contact{margin-top:24px;margin-bottom:calc(32px + env(safe-area-inset-bottom));padding-top:20px;border-top:1px solid var(--line)}
.copyright-contact a{color:var(--forest);text-decoration:underline;text-underline-offset:3px}
.copyright-page .icp-number{display:none}
@container(max-width:340px){.copyright-page .photographer-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:550px){.home-scene,.loading-scene{height:100dvh}}

/* Village data shares the original mobile layout. */
.village-hotspot{position:absolute;z-index:3;display:grid;place-items:center;padding:0;border:0;background:transparent;color:#294c3b;cursor:pointer;transform:translateY(5dvh)}
.village-label{display:inline-block;padding:.58cqw .9cqw;border:.7px solid rgba(51,91,69,.48);border-radius:.8cqw;background:rgba(251,244,234,.9);box-shadow:0 1px 3px rgba(34,65,51,.12);font-family:"Noto Serif SC","Songti SC","SimSun",serif;font-size:2.35cqw;font-weight:700;line-height:1.15;white-space:nowrap;animation:hotspot-breathe 3.2s ease-in-out var(--hotspot-delay,0s) infinite}
.village-hotspot:hover,.village-hotspot:focus-visible{z-index:4;outline:none}.village-hotspot:hover .village-label,.village-hotspot:focus-visible .village-label{border-color:#244f3a;background:#fffaf1;box-shadow:0 2px 6px rgba(34,65,51,.2);transform:scale(1.04);animation-play-state:paused}
@keyframes hotspot-breathe{0%,100%{opacity:.9;transform:translateY(0);box-shadow:0 1px 3px rgba(34,65,51,.1)}50%{opacity:1;transform:translateY(-1px);box-shadow:0 2px 5px rgba(34,65,51,.22)}}
@media(prefers-reduced-motion:reduce){.village-label{animation:none}}
.home-info-cover{position:absolute;left:86%;top:2%;width:13%;height:7%;z-index:2;background:#fbf4ea;mask-image:radial-gradient(ellipse 65% 65% at center,#000 65%,transparent 100%);pointer-events:none}
.home-map-title,.home-map-guide{position:absolute;z-index:2;left:50%;transform:translateX(-50%);margin:0;color:#17364a;text-align:center;pointer-events:none;white-space:nowrap}
.home-map-title{top:8.5%;width:80%;font-family:"Noto Serif SC","Songti SC","SimSun",serif}.home-map-title h1{margin:0;font-size:8.2cqw;line-height:1.15;letter-spacing:.12em}.home-map-title p{margin:1.5cqw 0 0;font-size:3.7cqw;font-weight:700;letter-spacing:.14em;color:#667180}
.home-map-guide{top:70.5%;color:#75877d;font-family:"Noto Serif SC","Songti SC","SimSun",serif}.home-map-guide strong{font-size:4.2cqw;letter-spacing:.06em}
button.season-card{display:block;width:100%;padding:0;text-align:left;color:var(--ink);font:inherit}
.gallery-hint{padding:0 4.6cqw 4cqw;font-size:12px;color:#7d8d80;line-height:1.5}
.empty-season{cursor:default}
.empty-season img{object-fit:contain}
.empty-season .gallery-hint{color:#8a978b}
#aerialPhotos{padding:0 3.7cqw}
.aerial-title{font-family:"Songti SC","SimSun",serif;font-size:5.2cqw;margin:7cqw 0 4cqw}
.legend-body p+p{margin-top:12px}
.history-copy h2,.history-copy h3{font-family:"Songti SC","SimSun",serif;font-size:4.2cqw;line-height:1.5;margin:6cqw 0 3cqw;color:var(--forest)}
.history-hero img[src$="photo-pending.svg"]{object-fit:contain}
.gallery-modal{padding:18px;width:min(100%,440px)}
.gallery-description{font-size:12px!important;margin:0 0 14px;line-height:1.6}
.photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.photo-grid button{padding:0;border:0;background:#edf1e8;border-radius:9px;overflow:hidden;aspect-ratio:4/3}
.photo-grid img{display:block;width:100%;height:100%;object-fit:cover}
.viewer-image-frame{display:grid;place-items:center;width:100%;height:clamp(240px,45dvh,440px);overflow:hidden;background:#edf1e8;border-radius:10px}
.viewer-image{display:block;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .18s ease}.viewer-image.loaded{opacity:1}
.viewer-caption{min-height:22px;font-size:13px!important;line-height:1.7;margin:12px 0;text-align:center}
.viewer-actions{display:flex;align-items:center;justify-content:space-between;margin-top:12px;color:#7c8c80;font-size:13px}
.viewer-actions button{width:42px;height:38px;border:1px solid #d7e1d2;border-radius:9px;background:#eff4eb;color:var(--forest);font-size:25px}
.viewer-back{display:block;width:100%;border:1px solid #c4d6c1;border-radius:11px;padding:11px;margin-top:15px;background:#edf3e8;color:var(--forest);font-size:13px;font-weight:600}