:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #18211e;
  background: #f5f7f6;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { min-width: 320px; min-height: 100vh; margin: 0; display: flex; flex-direction: column; background: radial-gradient(circle at 50% 0, #fff 0, #f5f7f6 44%, #f1f4f2 100%); }
.agreement-header { height: 72px; padding: 0 clamp(20px, 5vw, 72px); display: flex; align-items: center; border-bottom: 1px solid #e3e8e5; background: rgba(255,255,255,.88); }
.agreement-brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; font-size: 15px; font-weight: 750; text-decoration: none; }
.agreement-brand img { border-radius: 10px; }
.agreement-shell { width: min(100% - 32px, 940px); margin: clamp(32px, 6vw, 72px) auto; flex: 1; }
.agreement-card { min-height: 480px; padding: clamp(30px, 6vw, 70px); border: 1px solid #e0e6e3; border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgba(29,45,39,.07); }
.agreement-kicker { margin: 0 0 14px; color: #358a6c; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.agreement-card h1 { margin: 0; font-size: clamp(30px, 5vw, 48px); line-height: 1.2; letter-spacing: -.045em; }
.agreement-updated { margin: 15px 0 0; color: #89938f; font-size: 12px; }
.agreement-divider { width: 44px; height: 3px; margin: 30px 0 34px; border-radius: 99px; background: #7465dc; }
.agreement-body { color: #3c4843; font-size: 15px; line-height: 2; overflow-wrap: anywhere; white-space: pre-wrap; }
.agreement-state { min-height: 330px; display: grid; place-content: center; justify-items: center; color: #7b8681; text-align: center; }
.agreement-loader { width: 28px; height: 28px; border: 3px solid #e5e9e7; border-top-color: #7465dc; border-radius: 50%; animation: agreement-spin .8s linear infinite; }
.agreement-error > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; background: #fff1ef; color: #bd4c4c; font-size: 20px; font-weight: 800; }
.agreement-error h1 { margin-top: 18px; font-size: 24px; }
.agreement-error p { margin: 10px 0 22px; }
.agreement-error a { padding: 10px 16px; border-radius: 9px; background: #f0eefc; color: #6556c8; font-size: 13px; font-weight: 700; text-decoration: none; }
.agreement-footer { padding: 0 20px 28px; color: #9aa29f; font-size: 11px; text-align: center; }
@keyframes agreement-spin { to { transform: rotate(360deg); } }
@media (max-width: 600px) {
  .agreement-header { height: 64px; }
  .agreement-shell { width: min(100% - 20px, 940px); margin: 18px auto 30px; }
  .agreement-card { min-height: 420px; border-radius: 15px; }
  .agreement-body { font-size: 14px; line-height: 1.9; }
}
@media (prefers-reduced-motion: reduce) { .agreement-loader { animation: none; } }