:root{
  --paper:#f4f1e7;
  --paper-raised:#fbf9f2;
  --ink:#2d2a22;
  --pencil:#6b6455;
  --faint:#958c79;
  --line:rgba(45,42,34,.24);
  --blue:#2e5aa8;
  --red:#b63a27;
  --tape:rgba(232,213,140,.66);
  --sans:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --serif:"Songti SC","STSong","Noto Serif SC",Georgia,serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:
    linear-gradient(rgba(46,90,168,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(46,90,168,.045) 1px,transparent 1px),
    linear-gradient(rgba(46,90,168,.075) 1px,transparent 1px),
    linear-gradient(90deg,rgba(46,90,168,.075) 1px,transparent 1px),
    var(--paper);
  background-size:8px 8px,8px 8px,40px 40px,40px 40px;
  font-family:var(--sans);
  line-height:1.78;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit}
button{font:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--blue);outline-offset:4px}

.shell{
  width:min(100% - 3rem,1080px);
  margin-inline:auto;
}

.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  padding:1.35rem 0 1rem;
  border-bottom:1.5px solid var(--ink);
}

.wordmark{
  color:var(--ink);
  font-size:.92rem;
  font-weight:700;
  letter-spacing:.28em;
  text-decoration:none;
}

.site-nav{
  display:flex;
  align-items:center;
  gap:1.35rem;
  color:var(--pencil);
  font-size:.76rem;
  letter-spacing:.08em;
}

.site-nav a{text-decoration:none}
.site-nav a:hover{color:var(--blue)}

.language-switch{
  display:inline-flex;
  padding:3px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.38);
}

.language-switch button{
  min-width:3.8rem;
  border:0;
  padding:.34rem .62rem;
  color:var(--pencil);
  background:transparent;
  cursor:pointer;
  font-size:.72rem;
}

.language-switch button[aria-pressed="true"]{
  color:#fff;
  background:var(--blue);
}

.document-hero{
  position:relative;
  padding:clamp(3.2rem,8vw,6rem) 0 clamp(2.6rem,6vw,4.3rem);
  border-bottom:1px solid var(--line);
}

.eyebrow{
  margin:0 0 1rem;
  color:var(--faint);
  font-family:var(--mono);
  font-size:.69rem;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.document-hero h1{
  max-width:12em;
  margin:0;
  font-family:var(--serif);
  font-size:clamp(2.45rem,6vw,4.35rem);
  font-weight:700;
  letter-spacing:.02em;
  line-height:1.2;
}

.document-hero .lede{
  max-width:44rem;
  margin:1.45rem 0 0;
  color:var(--pencil);
  font-size:.96rem;
}

.stamp{
  position:absolute;
  top:clamp(3.5rem,8vw,5.7rem);
  right:1rem;
  display:inline-block;
  border:1.5px solid var(--red);
  padding:.45rem .75rem;
  color:var(--red);
  font-family:var(--mono);
  font-size:.65rem;
  letter-spacing:.18em;
  transform:rotate(2deg);
}

.document-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem 1.5rem;
  margin-top:1.65rem;
  color:var(--faint);
  font-family:var(--mono);
  font-size:.67rem;
  letter-spacing:.08em;
}

.document-layout{
  display:grid;
  grid-template-columns:13rem minmax(0,1fr);
  gap:clamp(2.6rem,7vw,6.5rem);
  align-items:start;
  padding:clamp(2.8rem,7vw,5.5rem) 0 5.5rem;
}

.toc{
  position:sticky;
  top:1.5rem;
  border-top:1.5px solid var(--ink);
  padding-top:1rem;
}

.toc-label{
  margin:0 0 .8rem;
  color:var(--faint);
  font-family:var(--mono);
  font-size:.64rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.toc ol{
  margin:0;
  padding:0;
  list-style:none;
}

.toc li+li{border-top:1px dashed var(--line)}
.toc a{
  display:block;
  padding:.58rem 0;
  color:var(--pencil);
  font-size:.76rem;
  line-height:1.45;
  text-decoration:none;
}
.toc a:hover{color:var(--blue)}

.legal-copy{
  min-width:0;
  background:rgba(251,249,242,.58);
  border:1px solid rgba(45,42,34,.14);
  box-shadow:0 20px 50px -42px rgba(45,42,34,.55);
  padding:clamp(1.5rem,4.5vw,3.6rem);
}

.summary{
  position:relative;
  margin:0 0 2.6rem;
  padding:1.25rem 1.35rem;
  border:1px dashed rgba(45,42,34,.4);
  background:rgba(255,255,255,.45);
  color:var(--pencil);
  font-size:.9rem;
}

.summary::before{
  content:"";
  position:absolute;
  top:-9px;
  left:1.2rem;
  width:76px;
  height:18px;
  background:var(--tape);
  transform:rotate(-1.4deg);
}

.legal-section{
  scroll-margin-top:1.5rem;
  padding:0 0 2.25rem;
}

.legal-section+.legal-section{
  border-top:1px dashed var(--line);
  padding-top:2.25rem;
}

.section-no{
  display:block;
  margin-bottom:.45rem;
  color:var(--blue);
  font-family:var(--mono);
  font-size:.65rem;
  letter-spacing:.16em;
}

.legal-section h2{
  margin:0 0 1rem;
  font-size:1.14rem;
  letter-spacing:.04em;
  line-height:1.45;
}

.legal-section p{
  margin:.75rem 0;
  color:var(--pencil);
  font-size:.91rem;
}

.legal-section ul{
  margin:.8rem 0;
  padding-left:1.25rem;
  color:var(--pencil);
  font-size:.91rem;
}

.legal-section li{margin:.48rem 0}
.legal-section strong{color:var(--ink)}
.legal-section a{
  color:var(--blue);
  text-underline-offset:3px;
}

.contact-line{
  display:inline-block;
  margin-top:.35rem;
  font-family:var(--mono);
  font-size:.78rem;
}

.site-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  padding:1.55rem 0 2.8rem;
  border-top:1.5px solid var(--ink);
  color:var(--pencil);
  font-size:.75rem;
}

.site-footer a{text-decoration:none}
.site-footer a:hover{color:var(--blue)}
.site-footer .sig{
  color:var(--faint);
  font-family:var(--mono);
  font-size:.63rem;
  letter-spacing:.17em;
}

@media (max-width:760px){
  .shell{width:min(100% - 2rem,1080px)}
  .site-header{align-items:flex-start;gap:1rem}
  .site-nav{flex-wrap:wrap;justify-content:flex-end;gap:.65rem 1rem}
  .site-nav>a{display:none}
  .document-hero{padding-top:3.4rem}
  .document-hero h1{font-size:clamp(2.25rem,12vw,3.25rem)}
  .stamp{position:static;margin-bottom:1.45rem;transform:rotate(-1deg)}
  .document-layout{display:block;padding-top:2rem}
  .toc{position:static;margin-bottom:2rem}
  .toc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1rem}
  .legal-copy{padding:1.35rem 1.15rem}
  .site-footer{align-items:flex-start;flex-direction:column}
}

@media (max-width:410px){
  .wordmark{font-size:.82rem;letter-spacing:.2em}
  .language-switch button{min-width:3.25rem;padding-inline:.45rem}
  .toc ol{grid-template-columns:1fr}
  .document-meta{display:block}
  .document-meta span{display:block;margin-top:.35rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}
