/* Content-language and portrait-screen compatibility only.
   Original Field Trip styles remain byte-for-byte in _custom/css/. */
body{font-family:"Inconsolata","Microsoft YaHei","PingFang SC",sans-serif}
.memoirTitle{font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:75px;font-weight:500;line-height:1.2;margin-bottom:.3em;letter-spacing:.08em}
.memoirMark{font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;font-style:normal;font-size:26px!important;letter-spacing:.12em}
.memoirIntroNote{position:absolute;left:10%;bottom:30px;z-index:30;color:#fff;font-size:16px;line-height:1.8}
.memoirIntroNote small{display:block;font-size:12px;opacity:.7}
.memoirIntroSource{position:absolute;right:10%;bottom:30px;z-index:30;color:#fff;font-size:13px}
#ftIntroCaptionsContainer{pointer-events:none}
#ftoverview #ftMapContainer #ftMapCanvas .ftMapPin .fticon-silhouette{border-radius:50%;background-size:cover}
#ftoverview #ftMapContainer #ftMapCanvas .ftMapPin .ftMapPinDescription img{object-fit:cover}
#ftoverview #ftMapContainer #ftMapCanvas .ftMapPin .ftMapPinDescription span{white-space:nowrap;font-family:"Rubik","Microsoft YaHei",sans-serif}
#ftWeatherContainer{line-height:1.8!important}
#ftWeatherContainer small{display:block;font-size:12px}
.ftInfoContent{font-family:"Rubik","Microsoft YaHei",sans-serif;line-height:1.9}
.ftInfoContent p{line-height:1.9!important}
.ftInfoContent a{text-decoration:underline;text-underline-offset:.2em}
.ftInfoContent h5{line-height:1.6!important}
.ftInfoNavigation li a{line-height:1.8}
#ftCreditLink{line-height:1.6}
[role=button]:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid #fec570;outline-offset:5px}
@media(max-width:820px) and (orientation:portrait){
 html,body,.ftLayer,.ftLayer .ftLayerContent{height:100dvh}
 .ftLayer#ftintro #ftTagline{top:34%;left:8%;width:84%;margin:0;text-align:center;font-size:20px;line-height:1.7}
 .memoirTitle{font-size:58px}
 #ftStartButton{left:50%;top:65%}
 .memoirIntroNote{left:24px;bottom:26px;font-size:14px}
 .memoirIntroSource{right:24px;bottom:30px;max-width:100px;text-align:right;line-height:1.6}
 #ftoverview #ftMapContainer #ftMapCanvas{top:0!important;left:0!important;width:100%!important;height:100%!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin#ftMapPin1{top:25%!important;left:28%!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin#ftMapPin2{top:25%!important;left:72%!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin#ftMapPin3{top:49%!important;left:28%!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin#ftMapPin4{top:49%!important;left:72%!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin#ftMapPin5{top:73%!important;left:28%!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin#ftMapPin6{top:73%!important;left:72%!important}
 #ftoverview #ftMapContainer #ftWeatherContainer{top:auto!important;bottom:78px!important;left:24px!important;font-size:14px}
 #ftWeatherContainer small{font-size:10px}
 .ftPulsingHint{bottom:26px!important;font-size:14px!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin .ftMapPinDescription.is-visible{transform:scale(.62)}
 .ftInfoContent h5{font-size:24px}
 #fthyperInfo .ftInfoNavigation{height:65px;left:0;top:0;width:calc(100% - 45px);overflow:auto}
 #fthyperInfo .ftInfoNavigation ul{display:flex;gap:16px;white-space:nowrap;padding:16px}
 #fthyperInfo .ftInfoNavigation li{display:inline-block;margin:0;font-size:12px}
 #fthyperInfo .ftInfoContainer{margin:70px 0 0;padding:0 24px 70px}
 #fthyperInfo .ftLayerContent{overflow:auto!important}
 #fthyperInfo .ftLogo{display:none}
 .ftInfoContent{padding:0!important;width:100%!important}
 .ftInfoSection{min-height:0!important;padding-top:25px!important}
 .areaRightContainer[data-size="large"]{flex-basis:100vw;min-width:100vw}
 .areaRightContainer.closed{flex-basis:0;min-width:0}
 #ftCreditLink{font-size:12px;right:18px;bottom:18px}
 .ftScreen{top:10px}
 .ftNavItems{top:56px}
 .ftNavAbout{bottom:14px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* The upstream player uses a cropped 16:9 video canvas. Keep captions
   inside the actual viewport on portrait phones, without changing its engine. */
html,body{overflow:hidden}
#VideoPlayer .resourceDetail[data-type="image"] .resourceTooltip{display:none!important}
body.overlayHints #VideoPlayer .resourceDetail[data-type="image"]::before,body.overlayHints #VideoPlayer .resourceDetail[data-type="image"]::after{display:none!important}
#VideoPlayer .overlayElement:has(.memoir-caption){left:50%!important;transform:translateX(-50%)!important;width:min(860px,calc(100vw - 80px))!important;top:auto!important;bottom:85px!important;height:auto!important}
#VideoPlayer .overlayElement:has(.memoir-caption)>.resourceDetail,
#VideoPlayer .overlayElement:has(.memoir-media-note)>.resourceDetail,
#VideoPlayer .overlayElement:has(.memoir-next)>.resourceDetail{width:100%!important;height:auto!important;left:0!important;top:0!important;position:relative!important;transform:none!important;background:transparent!important;overflow:visible!important}
#VideoPlayer .memoir-caption{padding:18px 24px;background:rgba(0,0,0,.5)!important;font-family:"Microsoft YaHei","PingFang SC",sans-serif}
#VideoPlayer .memoir-caption small{font-size:14px!important;color:#fec570}
#VideoPlayer .memoir-caption p{font-size:23px!important;line-height:1.65!important;margin:7px 0 0!important}
#VideoPlayer .memoir-caption p,#VideoPlayer .memoir-caption small{display:block!important;background:transparent!important;padding:0!important}
#VideoPlayer .overlayElement:has(.memoir-media-note){left:50%!important;transform:translateX(-50%)!important;top:auto!important;bottom:25px!important;width:min(700px,calc(100vw - 80px))!important;height:auto!important;pointer-events:none}
#VideoPlayer .memoir-media-note{display:block!important;font-size:12px!important;line-height:1.6;text-align:center;color:#fff;text-shadow:0 1px 5px #000;background:transparent!important}
#VideoPlayer .memoir-source-panel p{font-size:17px!important;line-height:1.9!important;margin-bottom:1.2em!important}
#VideoPlayer .areaRightContainer .customhtmlContainer{font:16px/1.9 "Microsoft YaHei",sans-serif!important;padding:60px 26px 26px!important}
#VideoPlayer .areaRightContainer .customhtmlContainer p{font-size:16px!important;line-height:1.9!important;margin-bottom:1em!important}
#VideoPlayer .areaRightContainer .customhtmlContainer h2{font-size:21px!important;line-height:1.6!important;margin:0 0 24px!important}
#VideoPlayer .areaRightContainer .customhtmlContainer a{color:#fec570;text-decoration:underline;text-underline-offset:4px}
#VideoPlayer .overlayElement:has(.memoir-next){left:50%!important;transform:translateX(-50%)!important;top:95px!important;height:auto!important;width:220px!important}
#VideoPlayer .memoir-next{font-size:15px!important;line-height:1.5!important;padding:10px!important}
#ftoverview #ftMapContainer #ftMapCanvas .ftMapPin>.memoirPinLabel{display:block;position:absolute;left:50%;top:96px;transform:translateX(-50%);white-space:nowrap;font:16px/1.6 "Microsoft YaHei",sans-serif;padding:3px 10px;background:rgba(0,0,0,.5);color:#fff;pointer-events:none}
#ftoverview #ftMapContainer #ftMapCanvas .ftMapPin.pinOpen>.memoirPinLabel{opacity:0}
@media(max-width:820px) and (orientation:portrait){
 #VideoPlayer .overlayElement:has(.memoir-caption){bottom:90px!important;width:calc(100vw - 36px)!important}
 #VideoPlayer .memoir-caption{padding:12px 14px}
 #VideoPlayer .memoir-caption p{font-size:18px!important}
 #VideoPlayer .memoir-caption small{font-size:12px!important}
 #VideoPlayer .overlayElement:has(.memoir-media-note){bottom:48px!important;width:calc(100vw - 36px)!important}
 #VideoPlayer .memoir-media-note{font-size:10px!important}
 #VideoPlayer .overlayElement:has(.memoir-next){top:70px!important;width:160px!important}
 #ftoverview #ftMapContainer #ftMapCanvas .ftMapPin>.memoirPinLabel{top:82px;font-size:14px}
}