:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background: #f6f8fc;
  color: #111b31;
}

* { box-sizing: border-box; }

body { margin: 0; background: #f6f8fc; }

a { color: #176bff; overflow-wrap: anywhere; }

.page {
  width: min(920px, calc(100% - 32px));
  margin: 0 auto;
  padding: 40px 0 72px;
}

.brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
}

.brand a { color: #111b31; font-weight: 800; text-decoration: none; }

.brand nav { display: flex; flex-wrap: wrap; gap: 14px; font-size: 14px; }

.brand nav a { color: #53637d; }

.hero,
.section {
  background: #fff;
  border: 1px solid #e4eaf4;
  border-radius: 24px;
  box-shadow: 0 12px 34px rgba(24, 52, 94, .06);
}

.hero { padding: clamp(24px, 5vw, 48px); }

.hero h1 { margin: 0 0 12px; font-size: clamp(30px, 6vw, 48px); line-height: 1.16; }

.eyebrow { margin: 0 0 12px; color: #176bff; font-weight: 750; }

.meta,
.muted { color: #66758d; }

.summary {
  margin: 22px 0 0;
  padding: 18px 20px;
  border-radius: 16px;
  background: #eef4ff;
  line-height: 1.8;
}

.section { margin-top: 18px; padding: clamp(22px, 4vw, 34px); }

.section h2 { margin: 0 0 14px; font-size: 22px; }

.section h3 { margin: 22px 0 8px; font-size: 17px; }

.section p,
.section li { color: #42516b; line-height: 1.85; }

.section ul,
.section ol { padding-left: 22px; }

.important {
  border-left: 4px solid #ff4967;
  padding: 12px 16px;
  border-radius: 0 12px 12px 0;
  background: #fff4f6;
}

table { width: 100%; border-collapse: collapse; margin-top: 14px; }

th,
td { padding: 12px; border: 1px solid #e4eaf4; text-align: left; vertical-align: top; line-height: 1.65; }

th { background: #f2f6fc; }

footer { padding: 28px 4px 0; color: #78869b; font-size: 13px; line-height: 1.8; }

@media (max-width: 640px) {
  .page { width: min(100% - 20px, 920px); padding-top: 18px; }
  .brand { align-items: flex-start; flex-direction: column; padding: 0 8px; }
  .hero, .section { border-radius: 18px; }
  .table-wrap { overflow-x: auto; }
  table { min-width: 680px; }
}
