:root {
  --winfo-night: #292338;
  --winfo-plum: #5f315e;
  --winfo-coral: #d2674d;
  --winfo-cream: #f3eee5;
  --winfo-ink: #28272d;
  --winfo-rule: #c7bdb2;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  color: var(--winfo-ink);
  background: var(--winfo-cream);
  font: 16px/1.75 "Microsoft YaHei", sans-serif;
}
main {
  max-width: 1400px;
  margin: auto;
  padding: 2rem 5vw 5rem;
}
.b35-brand {
  padding: 1rem 5vw;
  color: white;
  background: var(--winfo-night);
  font-size: 1.75rem;
  font-weight: 700;
}
.b35-brand a {
  color: white;
  text-decoration: none;
}
.b35-navigation {
  display: flex;
  gap: .55rem;
  overflow-x: auto;
  padding: .65rem 5vw;
  background: var(--winfo-plum);
}
.b35-navigation a {
  flex: 0 0 auto;
  color: white;
  text-decoration: none;
  padding: .3rem .55rem;
  border-bottom: 2px solid transparent;
}
.b35-navigation a:hover {
  border-color: var(--winfo-coral);
}
.b35-footer {
  padding: 2rem 5vw;
  color: white;
  background: var(--winfo-night);
}
.b35-footer a {
  color: white;
  margin-right: 1.2rem;
}
.winfo-front {
  position: relative;
  padding: 2rem 0 1.6rem 2rem;
  border-left: 8px solid var(--winfo-coral);
  border-bottom: 1px solid var(--winfo-rule);
}
.winfo-front h1 {
  max-width: 980px;
  margin: 0 0 1rem;
  color: var(--winfo-night);
  font: 700 clamp(2.2rem, 4.5vw, 4.3rem)/1.16 Georgia, "Microsoft YaHei", serif;
}
.winfo-front-copy {
  max-width: 1000px;
}
.winfo-front-rule {
  display: flex;
  gap: 1.3rem;
  color: var(--winfo-plum);
  font-size: .9rem;
  font-weight: 700;
}
.winfo-front-rule span {
  border-bottom: 2px solid var(--winfo-coral);
}
.winfo-section-list {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.3rem;
}
.winfo-topic, .winfo-community, .winfo-faq, .winfo-news {
  grid-column: span 6;
  padding: 1rem 1.2rem;
  border-top: 1px solid var(--winfo-rule);
  background: #faf8f2;
}
.winfo-topic.winfo-wide, .winfo-news {
  grid-column: span 12;
}
.winfo-section-list > section:nth-child(1), .winfo-section-list > section:nth-child(4) {
  grid-column: span 7;
}
.winfo-section-list > section:nth-child(2), .winfo-section-list > section:nth-child(5) {
  grid-column: span 5;
}
.winfo-section-list > section:nth-child(3), .winfo-section-list > section:nth-child(7) {
  grid-column: span 12;
}
.winfo-topic > header, .winfo-community > header, .winfo-faq > header, .winfo-news > header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 2px solid var(--winfo-plum);
}
.winfo-topic h2, .winfo-community h2, .winfo-faq h2, .winfo-news h2 {
  margin: .25rem 0 .6rem;
  color: var(--winfo-plum);
  font-family: Georgia, "Microsoft YaHei", serif;
}
.winfo-note {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: .9rem;
  margin: 1rem 0;
  padding: .8rem 0;
  border-bottom: 1px dashed var(--winfo-rule);
}
.winfo-note h3 {
  margin: 0 0 .35rem;
  font-size: 1.08rem;
}
.winfo-note p {
  margin: 0;
}
.winfo-miniature {
  width: 58px;
  height: 58px;
  object-fit: contain;
  padding: 3px;
  border: 1px solid var(--winfo-rule);
  background: white;
}
.winfo-event-rail {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  padding: 0;
  list-style: none;
}
.winfo-event {
  display: grid;
  gap: .12rem;
  padding: .75rem;
  border-left: 4px solid var(--winfo-coral);
  background: #f1ebe4;
}
.winfo-event time, .winfo-zone, .winfo-event small {
  color: #6b6264;
  font-size: .8rem;
}
.winfo-event strong {
  color: var(--winfo-night);
}
.winfo-view-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.site-viewpoint {
  padding: .9rem;
  border-bottom: 3px solid var(--winfo-coral);
  background: #f1ebe4;
}
.site-viewpoint h3 {
  margin: 0 0 .35rem;
  font-size: 1rem;
}
.site-viewpoint p {
  margin: 0;
}
.winfo-bulletin-grid, .winfo-article-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.winfo-bulletin {
  padding: .9rem;
  border-left: 3px solid var(--winfo-coral);
  background: #f8f4ec;
}
.winfo-bulletin time {
  color: #6b6264;
  font-size: .8rem;
}
.winfo-bulletin h2, .winfo-bulletin h3 {
  font-size: 1.1rem;
  line-height: 1.45;
}
.winfo-bulletin p {
  margin-bottom: 0;
}
.winfo-answer-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem .8rem;
}
.winfo-answer {
  padding: .7rem 0;
  border-bottom: 1px solid var(--winfo-rule);
}
.winfo-answer summary {
  cursor: pointer;
  color: var(--winfo-night);
  font-weight: 700;
}
.faq-answer {
  margin-bottom: 0;
}
.winfo-crosslinks {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  padding: 1.6rem 0;
}
.winfo-crosslinks a {
  padding: .45rem .8rem;
  color: white;
  background: var(--winfo-plum);
  text-decoration: none;
}
.winfo-about > header, .winfo-news-page > header, .winfo-data-page > header, .winfo-chinese-page > header, .winfo-mobile-page > header {
  margin-bottom: 1.4rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid var(--winfo-rule);
}
.winfo-about h1, .winfo-news-page h1, .winfo-data-page h1, .winfo-chinese-page h1, .winfo-mobile-page h1 {
  color: var(--winfo-night);
  font: 700 clamp(2rem, 4vw, 3.4rem)/1.2 Georgia, "Microsoft YaHei", serif;
}
.winfo-about-row, .winfo-data-pair, .winfo-chinese-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.winfo-about-tail, .winfo-chinese-caption, .winfo-mobile-end {
  margin-top: 1.5rem;
  padding: 1.1rem 1.4rem;
  border-left: 5px solid var(--winfo-coral);
  background: #f8f4ec;
}
.winfo-all-events {
  margin-top: 1.5rem;
  padding: 1rem;
  background: #faf8f2;
}
.winfo-all-events h2 {
  color: var(--winfo-plum);
}
.winfo-mobile-ledger {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  max-width: 780px;
}
.winfo-mobile-ledger article:nth-child(2) {
  margin-left: 3.5rem;
}
@media (max-width: 820px) {
  main {
  padding: 1rem;
}
.winfo-front {
  padding-left: 1rem;
}
.winfo-section-list > section:nth-child(n) {
  grid-column: span 12;
}
.winfo-view-list, .winfo-answer-columns, .winfo-bulletin-grid, .winfo-article-stack, .winfo-event-rail, .winfo-about-row, .winfo-data-pair, .winfo-chinese-columns {
  grid-template-columns: 1fr;
}
.winfo-mobile-ledger article:nth-child(2) {
  margin-left: 0;
}

}