:root {
  color-scheme: light;
  --ink: #251e19;
  --muted: #6e6259;
  --paper: #fbf7ef;
  --surface: #fffdf8;
  --wall: #6c5645;
  --red: #7a2724;
  --red-dark: #5d1e1c;
  --gold: #b58a3b;
  --line: #d9cfc0;
  --success: #2f6a4f;
  --danger: #a22d2d;
  --shadow: 0 16px 40px rgba(47, 36, 28, .1);
  font-family: "Microsoft YaHei UI", "Noto Sans CJK SC", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--paper); line-height: 1.65; }
a { color: var(--red); text-underline-offset: 3px; }
button, input { font: inherit; letter-spacing: 0; }
.site-header { min-height: 78px; padding: 14px clamp(20px, 5vw, 72px); display: flex; align-items: center; justify-content: space-between; gap: 20px; background: var(--surface); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.brand img { width: 48px; height: 48px; border-radius: 6px; }
.brand span { display: grid; }
.brand strong { font-size: 18px; }
.brand small { color: var(--muted); }
.brand.compact { margin-bottom: 22px; }
.brand.compact img { width: 42px; height: 42px; }
.site-header nav, .button-row { display: flex; flex-wrap: wrap; gap: 10px; }
.button { min-height: 44px; padding: 9px 18px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 6px; font-weight: 700; text-decoration: none; cursor: pointer; transition: background .15s ease, border-color .15s ease; }
.button:disabled { opacity: .55; cursor: wait; }
.button-primary { color: #fffaf0; background: var(--red); border-color: var(--red); }
.button-primary:hover { background: var(--red-dark); }
.button-outline { color: var(--ink); background: transparent; border-color: #9d8e80; }
.button-outline:hover, .button-quiet:hover { background: #f1e9dc; }
.button-quiet { color: var(--ink); background: transparent; }
.button.full { width: 100%; margin-top: 18px; }
.intro-band { min-height: 520px; padding: clamp(52px, 8vw, 100px) clamp(20px, 7vw, 110px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); align-items: center; gap: clamp(36px, 7vw, 100px); color: #fffaf0; background: var(--wall); }
.intro-copy { max-width: 720px; }
.eyebrow { margin: 0 0 8px; color: var(--gold); font-weight: 800; }
.intro-copy h1 { max-width: 700px; margin: 0; font-size: clamp(38px, 6vw, 68px); line-height: 1.16; }
.intro-copy > p:not(.eyebrow) { max-width: 650px; margin: 24px 0; color: #eee3d5; font-size: 18px; }
.intro-band .button-outline { color: #fff; border-color: #d9c9b9; }
.intro-band .button-outline:hover { background: rgba(255,255,255,.09); }
.trust-panel { padding: 26px; color: var(--ink); background: var(--surface); border-left: 5px solid var(--gold); box-shadow: var(--shadow); }
.trust-panel h2 { margin-top: 0; font-size: 22px; }
.trust-panel dl { margin: 0; }
.trust-panel dl div { padding: 13px 0; border-top: 1px solid var(--line); }
.trust-panel dt { color: var(--muted); font-size: 13px; }
.trust-panel dd { margin: 3px 0 0; font-weight: 700; }
.content-section { padding: 72px clamp(20px, 7vw, 110px) 90px; }
.section-heading { max-width: 700px; margin: 0 auto 34px; text-align: center; }
.section-heading.left { margin-left: 0; text-align: left; }
.section-heading h1, .section-heading h2 { margin: 0; font-size: clamp(30px, 4vw, 44px); }
.section-heading p:last-child { color: var(--muted); }
.plan-grid { max-width: 980px; margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.plan-card { padding: 30px; background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--wall); box-shadow: 0 8px 24px rgba(47,36,28,.06); }
.plan-card.featured { border-top-color: var(--red); }
.plan-label { color: var(--muted); font-weight: 700; }
.price { display: flex; align-items: baseline; gap: 9px; margin: 14px 0 8px; }
.price strong { font-size: 42px; line-height: 1; }
.price span, .plan-card > p { color: var(--muted); }
.site-footer { padding: 26px clamp(20px, 5vw, 72px); display: flex; justify-content: space-between; gap: 18px; color: #dfd1c1; background: #2b241f; }
.site-footer nav { display: flex; gap: 18px; }
.site-footer a { color: #f1e9dc; }
.account-shell { display: grid; place-items: center; padding: 30px 18px; background: #eee3d0; }
.auth-layout { width: min(100%, 470px); }
.form-panel, .result-panel { padding: clamp(24px, 5vw, 42px); background: var(--surface); border: 1px solid var(--line); border-top: 5px solid var(--red); box-shadow: var(--shadow); }
.form-panel h1, .result-panel h1 { margin: 0; font-size: 34px; }
.form-intro { margin-bottom: 24px; color: var(--muted); }
form { display: grid; gap: 8px; }
form label { margin-top: 10px; font-weight: 700; }
input[type="email"], input[type="password"] { width: 100%; min-height: 48px; padding: 9px 12px; color: var(--ink); background: #fff; border: 1px solid #aa9d91; border-radius: 5px; }
input:focus { outline: 3px solid rgba(181,138,59,.25); border-color: var(--gold); }
.check-row { display: flex; align-items: flex-start; gap: 9px; font-weight: 400; }
.check-row input { margin-top: 6px; }
.form-foot { margin-bottom: 0; text-align: center; color: var(--muted); }
.message { padding: 11px 13px; color: var(--success); background: #edf6f0; border-left: 4px solid var(--success); }
.message.error { color: var(--danger); background: #fff0ee; border-color: var(--danger); }
.result-panel { width: min(100%, 520px); text-align: center; }
.result-panel img { width: 70px; height: 70px; border-radius: 7px; }
.dashboard { padding: 58px clamp(20px, 8vw, 130px); }
.dashboard-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.info-card { min-height: 170px; padding: 26px; display: flex; flex-direction: column; gap: 9px; background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--wall); }
.info-card.wide { grid-column: 1 / -1; }
.info-card span, .info-card small { color: var(--muted); }
.info-card strong { font-size: 24px; overflow-wrap: anywhere; }
.legal-page { width: min(100% - 36px, 820px); margin: 40px auto; padding: clamp(24px, 5vw, 54px); background: var(--surface); border: 1px solid var(--line); }
.legal-page h1 { font-size: 38px; }
.legal-page h2 { margin-top: 30px; font-size: 20px; }

@media (max-width: 760px) {
  .site-header { align-items: flex-start; }
  .site-header .brand small { display: none; }
  .intro-band { min-height: auto; grid-template-columns: 1fr; padding-top: 58px; }
  .intro-copy h1 { font-size: 40px; }
  .plan-grid, .dashboard-grid { grid-template-columns: 1fr; }
  .site-footer { flex-direction: column; }
}