@media (max-width: 700px) {
  .menu [aria-current] { background: none; text-decoration: underline 2px var(--accent); text-underline-offset: 8px; }
}

.doc { position: relative; padding-top: 40px; padding-bottom: 104px; }
.doc::before { content: ""; position: absolute; left: 50%; top: -140px; width: min(980px, 100%); height: 560px; transform: translateX(-50%);
  background: radial-gradient(50% 50% at 50% 50%, rgba(148,102,255,.15), rgba(148,102,255,0) 70%); pointer-events: none; }
.doc > * { position: relative; }
.doc .sheet { max-width: 760px; padding: 72px 72px 80px;
  box-shadow: inset 0 1px 0 var(--w6), 0 40px 80px -48px rgba(0,0,0,.9); line-height: 29px; }
.doc .sheet > :last-child { margin-bottom: 0; }

.doc .sheet h1::before { content: none; display: none; }
.doc .sheet h1 { margin: 0 0 22px; font-size: clamp(38px, 6vw, 56px); }

.doc .sheet h1 + p:not(.updated), .doc .sheet .updated + p, .doc .sheet .sheet-meta + p { color: var(--text-tag); font-size: 19px; line-height: 31px; }
.doc .sheet p.updated { margin-bottom: 36px; }
.doc .sheet .sheet-meta { margin-bottom: 36px; }
.doc .sheet .sheet-meta p.updated { margin: 0; }
.doc .sheet h2 { margin: 56px 0 14px; padding-top: 36px; border-top-color: var(--w8); font-size: 28px; line-height: 34px; letter-spacing: -.02em; text-wrap: balance; scroll-margin-top: 16px; }
.doc .sheet h3 { margin: 32px 0 8px; font-size: 20px; line-height: 27px; letter-spacing: -.01em; text-wrap: balance; }
.doc .sheet p { margin: 0 0 18px; text-wrap: wrap; }
.doc .sheet ul, .doc .sheet ol { margin: 0 0 20px; padding-left: 24px; }
.doc .sheet li { margin: 10px 0; padding-left: 6px; }
.doc .sheet li ul { margin: 10px 0 4px; }
.doc .sheet a:not(.lang-link) { text-decoration-color: var(--accent-edge-45); overflow-wrap: anywhere; border-radius: 4px; }
.doc .sheet a:not(.lang-link):hover { color: var(--text); text-decoration-color: currentColor; }
.lang-link { transition: border-color .15s, background-color .15s; }
.lang-link:hover { background: var(--accent-14); }

.doc .sheet .toc { margin: 0 0 8px; border-radius: var(--r-card); background: var(--raised); border: 1px solid var(--w10); }
.doc .sheet .toc summary { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 20px; border-radius: var(--r-card); cursor: pointer; list-style: none;
  color: var(--text); font-weight: 700; transition: background-color .15s; }
.doc .sheet .toc summary::-webkit-details-marker { display: none; }
.doc .sheet .toc summary::after { content: ""; width: 9px; height: 9px; margin: -4px 4px 0 auto; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent);
  transform: rotate(45deg); transition: transform .2s; }
.doc .sheet .toc[open] summary::after { margin-top: 4px; transform: rotate(-135deg); }
.doc .sheet .toc summary:hover { background: var(--accent-14); }
.doc .sheet .toc ul { columns: 2; column-gap: 16px; margin: 0; padding: 4px 10px 14px; list-style: none; }
.doc .sheet .toc li { margin: 0; padding: 0; break-inside: avoid; }
.doc .sheet .toc a { display: flex; align-items: center; min-height: 44px; padding: 4px 10px; border-radius: 12px; color: var(--text2); text-decoration: none;
  font-weight: 600; font-size: 15px; line-height: 20px; overflow-wrap: normal; transition: color .15s, background-color .15s; }
.doc .sheet .toc a:hover { color: var(--text); background: var(--surface); }

.checker { margin: 20px 0 28px; }
.checker #cf-out { margin: 16px 0 0; color: var(--text); font-weight: 700; }
.checker #cf-out:empty { margin: 0; }
.checker #cf-out.found::before, .checker #cf-out.none::before { content: ""; display: inline-block; box-sizing: border-box; width: 12px; height: 12px; margin-right: 10px; border-radius: 50%; vertical-align: 0; }
.checker #cf-out.found::before { background: var(--accent); box-shadow: 0 0 0 4px var(--accent-20); }
.checker #cf-out.none { color: var(--text-tag); }
.checker #cf-out.none::before { border: 2px solid var(--text-tag); }
.checker #cf-more { margin: 8px 0 0; padding-left: 22px; font-size: 15px; line-height: 24px; }
.checker #cf-more:empty { margin: 0; }
.checker #cf-more li { margin: 4px 0; overflow-wrap: anywhere; }
.checker noscript p { margin: 16px 0 0; }
@media (max-width: 900px) { .doc .sheet { padding: 56px 48px 64px; } }
@media (max-width: 640px) {
  .doc { padding-top: 20px; padding-bottom: 72px; }
  .doc .sheet { padding: 0; border-radius: 0; background: none; border: 0; box-shadow: none; font-size: 16px; line-height: 27px; }
  .doc .sheet h1 + p:not(.updated), .doc .sheet .updated + p, .doc .sheet .sheet-meta + p { font-size: 17px; line-height: 28px; }
  .doc .sheet h2 { margin-top: 44px; padding-top: 30px; font-size: 24px; line-height: 30px; }
  .doc .sheet h3 { margin-top: 28px; font-size: 19px; line-height: 25px; }
  .doc .sheet ul, .doc .sheet ol { padding-left: 20px; }
  .doc .sheet li { padding-left: 4px; }
  .checker { padding: 20px 16px; }
  .doc .sheet .toc summary { padding: 0 16px; }
  .doc .sheet .toc ul { columns: 1; padding: 0 6px 10px; }
}

.lost { position: relative; padding: 64px 0 112px; }
.lost::before { content: ""; position: absolute; left: 50%; top: -60px; width: min(760px, 100%); height: 460px; transform: translateX(-50%);
  background: radial-gradient(50% 50% at 50% 50%, rgba(148,102,255,.18), rgba(148,102,255,0) 70%); pointer-events: none; }
.lost > * { position: relative; }
.lost__mix span { transform-origin: 50% 100%; animation: lost-breathe 3.2s ease-in-out infinite; }
.lost__mix span:nth-child(1) { border-color: rgba(255,79,139,.75); }
.lost__mix span:nth-child(2) { border-color: rgba(245,185,66,.75); animation-delay: -.6s; }
.lost__mix span:nth-child(3) { border-color: rgba(46,107,230,.9); animation-delay: -1.2s; }
.lost__mix span:nth-child(4) { border-color: rgba(238,240,245,.6); animation-delay: -1.8s; }
.lost__mix span:nth-child(5) { border-color: var(--accent-edge-70); animation-delay: -2.4s; }
@keyframes lost-breathe { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.86); } }
.lost p.lost__code { margin-top: 32px; color: var(--accent); font: 700 20px/26px var(--font-title); }
.lost h1 { margin-top: 10px; }
.lost .cta { margin-top: 36px; }
.lost__more { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 6px; margin: 22px 0 0; padding: 0; list-style: none; }
.lost__more a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 22px; color: var(--text2); font-weight: 600; text-decoration: none;
  transition: color .15s, background-color .15s; }
.lost__more a:hover { color: var(--text); background: var(--surface); }
@media (max-width: 640px) {
  .lost { padding: 40px 0 80px; }
  .lost p { font-size: 17px; line-height: 28px; }
  .lost .cta { flex-direction: column; align-items: stretch; max-width: 340px; margin-left: auto; margin-right: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .lost__mix span { animation: none; }
  .doc .sheet .toc summary::after, .doc .sheet .toc summary { transition: none; }
}