html { min-height: 100%; }
body {
  margin: 0;
  padding: 8px 0 35px;
  background: #d9e7f2;
  color: #222;
  font: 12px/1.6 SimSun, "宋体", serif;
  background-image: linear-gradient(#b8d0e4 0, #e8f1f7 150px, #d9e7f2 430px);
  background-repeat: no-repeat;
}
a { color: #003399; text-decoration: underline; }
a:visited { color: #663399; }
.site { width: 778px; margin: 0 auto; border: 1px solid #6f98ba; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.22); }
.masthead { height: 77px; color: #07559b; padding-left: 19px; background: #fff; border-bottom: 3px solid #1e75b9; background-image: radial-gradient(ellipse at 78% 105%, #9cdbf3 0, #d9f2fa 26%, #fff 63%); }
.title { padding-top: 8px; font: bold 28px/1.25 STKaiti, KaiTi, serif; letter-spacing: 5px; text-shadow: 1px 1px #b6d8ed; }
.subtitle { color: #5791b9; letter-spacing: 1px; margin-top: 3px; }
.topline { background: linear-gradient(#e9f6ff, #c5e1f5); border-bottom: 1px solid #79a6c9; padding: 3px 9px; color: #446d8c; font-size: 12px; }
.right { float: right; }
.sidebar { width: 166px; padding: 7px 6px 20px; background: #edf6fb; border-right: 1px solid #91b6d2; }
.nav-title { padding: 2px 7px; color: #fff; font-weight: bold; background: linear-gradient(#4f9ace, #1973b5); border: 1px solid #176aa5; border-bottom-color: #0c568e; }
.nav-title.space { margin-top: 16px; }
.nav { display: block; height: 24px; line-height: 24px; padding-left: 19px; border: 1px solid #c2d8e8; border-top: 0; color: #07539a; text-decoration: none; background: #fff url("arrow.svg") no-repeat 7px center; }
.nav:hover, .nav.active { color: #e15000; background-color: #fffbe8; }
.broken { cursor: help; }
.search { padding: 8px 3px 2px; white-space: nowrap; }
.search input { width: 91px; height: 19px; padding: 0 3px; border: 1px solid #777; font: 12px SimSun; background: #fff; }
button { height: 22px; padding: 0 5px; font: 12px SimSun; }
.notice-small { color: #777; font-size: 11px; padding: 0 4px; line-height: 1.5; }
.friend { display: block; margin: 5px 5px; font-size: 12px; }
.content { padding: 8px 13px 30px; background: #fff; }
.crumb { color: #777; padding-bottom: 5px; border-bottom: 1px dotted #aaa; font-size: 12px; }
.welcome { margin: 8px 0 10px; padding: 6px 9px; border: 1px solid #8db9d7; background: #f0f8fe; text-indent: 0; }
.section-title { clear: both; height: 24px; line-height: 24px; margin-top: 9px; border: 1px solid #7fafcf; background: linear-gradient(90deg, #d8effd, #f8fcff); font-weight: bold; color: #07599b; }
.section-title span { padding-left: 8px; border-left: 4px solid #f39a16; }
.section-title em { margin-left: 7px; color: #d60000; font: bold 10px Arial; }
.news-list { list-style: square; margin: 8px 0 14px; padding-left: 24px; }
.news-list li { border-bottom: 1px dotted #bbb; line-height: 26px; }
.date { color: #777; font-family: Arial; font-size: 11px; }
.new-gif { width: 25px; height: 11px; vertical-align: middle; }
.feature { width: 100%; margin-top: 9px; }
.feature img { width: 250px; height: 166px; object-fit: cover; padding: 3px; border: 1px solid #8caac0; background: #fff; }
.feature td + td { padding-left: 13px; }
.feature p { margin: 7px 0; text-indent: 2em; }
.feature .more { text-align: right; text-indent: 0; }
.plain { text-indent: 2em; }
.signature { text-align: right; color: #666; }
.footer { border-top: 3px solid #4b94c6; padding: 8px; text-align: center; color: #66869d; background: #eef7fc; font-size: 11px; line-height: 1.8; }
.counter { padding: 1px 4px; background: #131313; color: #ff4b37; font: 12px "Courier New"; letter-spacing: 1px; }
.article-title { font-size: 18px; text-align: center; margin: 18px 0 4px; color: #07559b; }
.article-meta { text-align: center; color: #888; font-size: 11px; border-bottom: 1px solid #ccc; padding-bottom: 7px; }
.article { margin-top: 14px; }
.article p { text-indent: 2em; }
.scan { display: block; max-width: 520px; max-height: 520px; margin: 13px auto 5px; padding: 5px; border: 1px solid #879fb0; background: #eee; }
.caption { text-align: center; color: #777; font-size: 11px; }
.archive-box { margin: 16px 7px; border: 1px solid #9cbcd2; background: #f0f8fc; padding: 10px 13px; }
.archive-box dt { float: left; width: 95px; color: #666; }
.archive-box dd { margin-left: 100px; border-bottom: 1px dotted #bbb; }
.route-table { width: 96%; margin: 13px auto; border-collapse: collapse; text-align: center; background: #fff; }
.route-table th { color: #fff; background: #438dbc; font-weight: normal; }
.route-table th, .route-table td { border: 1px solid #888; padding: 4px; }
.route-table .missing { color: #aaa; background: #efeee9; letter-spacing: 4px; }
.stamp { display: inline-block; border: 2px solid rgba(150,20,20,.58); color: rgba(150,20,20,.7); padding: 0 4px; transform: rotate(-7deg); font-weight: bold; }
.hint { color: #777; font-size: 12px; border-left: 3px solid #aaa; padding-left: 8px; }
.search-panel { margin: 20px 5px; padding: 15px; background: #edf7fd; border: 1px solid #8db6d0; }
.search-panel input { width: 300px; }
.result { margin: 13px 5px; padding: 8px 12px; border-bottom: 1px dotted #999; }
.result h3 { font-size: 14px; margin: 0; }
.result p { margin: 3px 0; color: #555; }
.no-result { padding: 18px 12px; color: #555; }
.system-note { font-family: SimSun; color: #888; background: #eee; padding: 5px; }
.hidden-entry { color: #eee; user-select: text; }
.dark-page { background: #e5e2d8; }
.record { border: 1px solid #777; margin: 16px auto; padding: 18px 22px; width: 480px; background: #efede5; font-family: FangSong, STFangsong, serif; box-shadow: 1px 2px 4px #aaa; }
.record h2 { text-align: center; letter-spacing: 5px; font-size: 19px; }
.record table { width: 100%; border-collapse: collapse; }
.record td { border: 1px solid #777; padding: 5px 7px; }
.redacted { background: #222; color: #222; padding: 0 10px; }
.player { margin: 20px auto 8px; width: 430px; border: 2px inset #ddd; background: #c8c8c8; padding: 5px; font: 12px Arial; }
.player button { width: 34px; }
.player-bar { display: inline-block; width: 285px; height: 7px; margin: 0 8px; border: 1px inset #aaa; background: #444; vertical-align: middle; }
.player-bar i { display: block; width: 0; height: 100%; background: #659079; transition: width 6s linear; }
.transcript { margin: 15px auto; width: 410px; color: #555; }
.back { margin-top: 25px; text-align: center; }
.legacy-tools { padding: 2px 8px; text-align: right; color: #5b7e97; background: #f4faff; border-bottom: 1px dotted #8db1c9; }
.legacy-tools a { margin: 0 4px; }
.marquee { height: 20px; line-height: 20px; overflow: hidden; color: #e45300; background: #fffceb; border-bottom: 1px solid #e6cf86; white-space: nowrap; }
.marquee span { display: inline-block; padding-left: 100%; animation: ticker 18s linear infinite; }
@keyframes ticker { to { transform: translateX(-100%); } }
.photo-grid { width: 100%; margin-top: 8px; border-collapse: separate; border-spacing: 6px; }
.photo-grid td { width: 50%; border: 1px solid #aac6d9; padding: 5px; text-align: center; background: #f7fbfe; vertical-align: top; }
.photo-grid img { width: 240px; height: 155px; object-fit: cover; }
.glitch { animation: flash .18s 2; }
@keyframes flash { 50% { color: #fff; background: #173244; } }
.registration { color: #a00000; font-weight: bold; }
.map-wrap { position: relative; width: 532px; margin: 13px auto 5px; }
.map-wrap .scan { width: 520px; margin: 0; }
.map-label { position: absolute; padding: 0 2px; color: #3f514e; background: rgba(226,218,185,.72); font: 12px SimSun; transform: rotate(-3deg); }
.map-label.road { left: 243px; top: 78px; transform: rotate(88deg); letter-spacing: 4px; }
.map-label.factory-label { left: 105px; top: 165px; }
.map-label.xyl { left: 318px; top: 141px; color: #5d5440; font-family: KaiTi; transform: rotate(-12deg); }
.map-label.bridge { left: 370px; top: 65px; }
.archive-card { margin: 9px 0; padding: 7px; border: 1px solid #a7c5d9; background: #f7fbfe; overflow: hidden; }
.archive-card img { float: left; width: 155px; height: 105px; object-fit: cover; margin-right: 10px; padding: 2px; border: 1px solid #9ab1c0; background: #fff; }
.archive-card h3 { margin: 1px 0 5px; font-size: 13px; color: #07559b; }
.archive-card p { margin: 3px 0; }
.archive-card:after { content: ""; display: block; clear: both; }
.related-link { margin: 25px 0 8px; padding: 9px; text-align: center; border-top: 1px dotted #789; border-bottom: 1px dotted #789; }
.log-table { width: 96%; margin: 12px auto; border-collapse: collapse; font-family: "Courier New", SimSun; font-size: 11px; }
.log-table th, .log-table td { padding: 4px; border: 1px solid #8da6b8; }
.log-table th { background: #d8eaf5; }
.ending-panel { margin: 20px auto; padding: 18px; width: 480px; color: #b8c7b4; background: #152018; border: 3px inset #777; font: 13px/1.8 "Courier New", SimSun; }
.ending-panel h2 { color: #e1efe0; font-size: 16px; text-align: center; }
.ending-panel button { margin: 6px; padding: 3px 10px; }
.ending-result { min-height: 92px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed #6f836c; color: #ffda75; }
.progress-only, .source-secret { display: none; }
.source-mask { color: #777; letter-spacing: 2px; }
.log-tools { margin: 9px auto; width: 96%; padding: 6px 8px; background: #eee; border: 1px solid #aaa; text-align: right; }
.case-note { border-left: 4px solid #999; margin: 15px 8px; padding: 7px 10px; background: #f4f1e8; color: #4f4b42; }
@media (max-width: 790px) {
  body { min-width: 0; padding: 0; background: #d9e7f2; }
  .site, .site > tbody, .site > tbody > tr { display: block; width: 100%; }
  .site { margin: 0; border-left: 0; border-right: 0; box-shadow: none; }
  .site td { box-sizing: border-box; }
  .masthead, .topline, .legacy-tools, .marquee, .footer { display: block; width: 100%; }
  .masthead { height: 70px; padding-left: 12px; }
  .title { font-size: 23px; letter-spacing: 3px; }
  .subtitle { font-size: 11px; }
  .right { float: none; margin-left: 12px; }
  .sidebar, .content { display: block; width: 100%; }
  .sidebar { padding: 7px 6px 10px; border-right: 0; border-bottom: 1px solid #91b6d2; }
  .sidebar .nav { display: inline-block; width: 33.333%; box-sizing: border-box; border-top: 1px solid #c2d8e8; vertical-align: top; }
  .content { padding: 8px 9px 24px; overflow-wrap: anywhere; }
  .scan { max-width: calc(100% - 12px); height: auto; }
  .feature td, .photo-grid td { display: block; width: 100%; box-sizing: border-box; }
  .feature td + td { padding: 8px 0 0; }
  .feature img, .photo-grid img { max-width: calc(100% - 8px); height: auto; }
  .archive-card img { width: 120px; height: 82px; }
  .record, .ending-panel, .transcript { width: auto; max-width: 100%; box-sizing: border-box; }
  .player { display: flex; width: auto; max-width: 100%; box-sizing: border-box; align-items: center; }
  .player-bar { flex: 1; width: auto; min-width: 80px; }
  .map-wrap { width: 100%; max-width: 532px; }
  .map-wrap .scan { width: 100%; box-sizing: border-box; }
  .map-label.road { left: 45.7%; top: 15%; }
  .map-label.factory-label { left: 19.7%; top: 32.5%; }
  .map-label.xyl { left: 59.7%; top: 27.8%; }
  .map-label.bridge { left: 69.5%; top: 12.8%; }
}
