:root {
  color-scheme: light;
  --legal-bg: #f7f6f5;
  --legal-bg-alt: #f5f4f3;
  --legal-surface-base: #f1f0ef;
  --legal-surface-muted: #fcfbfa;
  --legal-surface: #ffffff;
  --legal-border: rgba(47, 36, 26, 0.12);
  --legal-text: #1f1a16;
  --legal-muted: #6a5f53;
  --legal-accent: #c9864e;
  --legal-accent-strong: #e3a56e;
  --legal-shadow: 0 18px 42px rgba(31, 26, 22, 0.08);
  --legal-reading-width: 780px;
  --legal-radius: 22px;
}

* {
  box-sizing: border-box;
}

html {
  background: linear-gradient(
    180deg,
    var(--legal-bg) 0%,
    var(--legal-bg-alt) 55%,
    #fffbf6 100%
  );
  min-height: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--legal-text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}

a {
  color: var(--legal-accent);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

.legal-shell {
  width: min(calc(100% - 32px), 960px);
  margin: 0 auto;
  padding: 28px 0 56px;
}

.legal-main {
  background: var(--legal-surface);
  border: 1px solid var(--legal-border);
  border-radius: var(--legal-radius);
  box-shadow: var(--legal-shadow);
  padding: 28px clamp(20px, 4vw, 44px) 40px;
}

h1,
h2,
h3,
h4 {
  color: var(--legal-text);
  line-height: 1.18;
}

h1 {
  margin: 0 0 1.4rem;
  font-size: clamp(1.85rem, 3.2vw, 2.6rem);
  font-weight: 800;
}

h2 {
  margin: 2.2rem 0 0.85rem;
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  font-weight: 700;
}

h3,
h4 {
  margin: 1.6rem 0 0.7rem;
  font-size: 1.05rem;
  font-weight: 700;
}

p,
ul,
ol,
pre,
blockquote {
  max-width: var(--legal-reading-width);
}

p,
ul,
ol {
  margin: 0 0 1rem;
  font-size: 1rem;
}

ul,
ol {
  padding-left: 1.4rem;
}

li + li {
  margin-top: 0.4rem;
}

code {
  background: var(--legal-surface-base);
  border-radius: 8px;
  padding: 0.14rem 0.34rem;
  font-family: "SFMono-Regular", "Cascadia Code", "Consolas", monospace;
  font-size: 0.95em;
}

pre {
  overflow-x: auto;
  padding: 1rem 1.1rem;
  border-radius: 18px;
  background: #27221d;
  color: #f7f6f5;
}

pre code {
  background: transparent;
  padding: 0;
  color: inherit;
}

blockquote {
  margin: 1.4rem 0;
  padding: 0.2rem 0 0.2rem 1rem;
  border-left: 4px solid var(--legal-accent-strong);
  color: var(--legal-muted);
}

@media (max-width: 720px) {
  .legal-shell {
    width: min(calc(100% - 20px), 960px);
    padding-top: 18px;
    padding-bottom: 30px;
  }

  .legal-main {
    border-radius: 18px;
    padding: 22px 18px 30px;
  }

  p,
  ul,
  ol {
    font-size: 1rem;
  }
}