.docs { max-width: 820px; margin: auto; padding: 60px 28px 80px; }
.docs .intro { padding: 16px 0 50px; }
.docs h1 { font-family: "Luckiest Guy", sans-serif; font-weight: 400; font-size: clamp(46px, 9vw, 78px); line-height: 1.08; }
.docs .eyebrow { letter-spacing: .1em; font-size: 12px; font-weight: 700; opacity: .75; }
.docs .lede { font-size: 21px; line-height: 1.6; max-width: 640px; }
.docs p, .docs li { line-height: 1.8; color: var(--muted); }
.docs .block { padding: 36px 0; }
.docs h2 { margin-bottom: 22px; }
.docs pre { padding: 22px; border-radius: 12px; background: rgba(0,0,0,.25); overflow-x: auto; line-height: 1.8; }
.docs pre code { padding: 0; background: none; font-size: 13px; white-space: pre; overflow-wrap: normal; }
.docs ol { padding-left: 24px; }
.docs li { margin: 14px 0; padding-left: 6px; }
.docs details { margin: 12px 0; }
.docs summary { font-weight: 700; cursor: pointer; padding: 8px 0; }
.docs footer { padding-top: 50px; font-size: 14px; }
@media (max-width: 580px) { .top nav a:nth-child(2), .top nav a:nth-child(3) { display: none; } .docs { padding: 35px 22px 65px; } .docs pre { padding: 16px; } }