:root {
  color: #333;
  background: #f2f2f2;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif;
  --green: #0bbe63;
  --green-dark: #08a655;
  --muted: #777;
  --line: #e7e7e7;
}

* { box-sizing: border-box; }
html { background: #f2f2f2; }
body { max-width: 840px; min-width: 320px; min-height: 100vh; margin: 0 auto; color: #333; background: #f2f2f2; }
a { color: inherit; text-decoration: none; }
img { display: block; }

.topbar { height: 50px; padding: 0 14px; background: #000; display: flex; align-items: center; justify-content: space-between; }
.brand { display: flex; align-items: center; gap: 9px; color: #fff; font-size: 17px; font-weight: 700; }
.brand img { width: 34px; height: 34px; border-radius: 8px; object-fit: cover; }
.home-link { color: #ddd; font-size: 14px; }
.home-link:hover { color: #fff; }

.nav { height: 40px; display: grid; grid-template-columns: repeat(3, 1fr); background: #fff; }
.nav a { display: grid; place-items: center; font-size: 15px; }
.nav a[aria-current="page"] { color: var(--green); font-weight: 700; }

.breadcrumb { height: 40px; padding: 0 14px; display: flex; align-items: center; gap: 6px; background: #f4f4f4; color: #555; font-size: 13px; }
.breadcrumb a:hover { color: var(--green-dark); }

.page-card { margin: 0 0 10px; padding: 24px 24px 28px; background: #fff; }
.product-heading { display: flex; align-items: center; gap: 14px; }
.product-heading img { width: 76px; height: 76px; border-radius: 9px; object-fit: cover; }
.eyebrow { margin: 0 0 4px; color: var(--green); font-size: 14px; font-weight: 700; }
h1 { margin: 0; font-size: 27px; line-height: 1.25; }
.lead { margin: 20px 0 0; color: #5f5f5f; font-size: 16px; line-height: 1.9; }
.badge { display: inline-flex; margin-top: 20px; padding: 6px 12px; border-radius: 3px; background: var(--green); color: #fff; font-size: 14px; }

.info-box { margin-top: 14px; padding: 18px 20px; border: 1px solid var(--line); background: #fafafa; }
.info-box h2 { margin: 0 0 12px; font-size: 20px; }
.info-box ol { margin: 0; padding-left: 24px; color: #555; font-size: 15px; line-height: 2; }

.entry-card { margin-top: 16px; padding: 20px; border: 1px solid #dff2e8; background: #f5fff9; }
.entry-card h2 { margin: 0 0 8px; font-size: 20px; }
.entry-card p { margin: 0 0 16px; color: var(--muted); font-size: 14px; line-height: 1.8; }
.primary-button, .secondary-button { min-height: 48px; padding: 0 16px; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 700; }
.primary-button { background: var(--green); color: #fff; }
.primary-button:hover { background: var(--green-dark); }
.secondary-button { margin-top: 10px; border: 1px solid var(--green); color: var(--green-dark); background: #fff; }
.safe-note { margin: 16px 0 0; color: #888; font-size: 13px; line-height: 1.7; }

.content-section { margin-top: 18px; padding-top: 2px; }
.content-section + .content-section { padding-top: 18px; border-top: 1px solid var(--line); }
.content-section h2 { margin: 0 0 9px; font-size: 20px; }
.content-section p { margin: 0 0 9px; color: #5f5f5f; font-size: 15px; line-height: 1.85; }
.plain-list { margin: 0; padding-left: 22px; color: #555; font-size: 15px; line-height: 1.95; }
.contact-link { color: var(--green-dark); overflow-wrap: anywhere; }
.action-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 20px; }
.action-row .secondary-button { margin-top: 0; }
.error-code { margin: 4px 0 2px; color: var(--green); font-size: 64px; font-weight: 800; line-height: 1; }

.footer { height: 54px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 10px; color: #555; font-size: 13px; }
.footer a:hover { color: var(--green-dark); }

@media (max-width: 480px) {
  .page-card { padding: 20px 16px 24px; }
  .product-heading img { width: 68px; height: 68px; }
  h1 { font-size: 24px; }
  .lead { font-size: 15px; line-height: 1.85; }
  .info-box, .entry-card { padding: 16px; }
  .info-box h2, .entry-card h2 { font-size: 19px; }
  .action-row { grid-template-columns: 1fr; }
}