.docs-page { min-height: calc(100vh - 70px); padding: 56px 0 88px; background: radial-gradient(circle at 15% 0, rgba(41,121,255,.12), transparent 28%), var(--bg); }
.docs-intro { max-width: 800px; margin-bottom: 34px; }
.docs-intro h1 { margin: 8px 0 12px; font-size: clamp(36px,5vw,56px); letter-spacing: -.05em; line-height: 1; }
.docs-intro p { margin: 0; color: var(--muted); font-size: 16px; }
.docs-layout { display: grid; grid-template-columns: 230px minmax(0,1fr); gap: 24px; align-items: start; }
.docs-nav { position: sticky; top: 94px; padding: 12px; display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.docs-nav strong { padding: 8px 10px; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.docs-nav a { padding: 9px 10px; border-radius: 7px; color: #aeb9c8; font-size: 12px; }
.docs-nav a:hover { background: rgba(41,121,255,.08); color: white; }
.docs-content { min-width: 0; display: grid; gap: 20px; }
.docs-panel { scroll-margin-top: 94px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; }
.docs-panel-heading { padding: 21px 23px; border-bottom: 1px solid var(--line); }
.docs-panel-heading h2 { margin: 0; font-size: 20px; letter-spacing: -.02em; }
.docs-panel-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.faq-list details { border-top: 1px solid var(--line); }
.faq-list details:first-child { border-top: 0; }
.faq-list summary { padding: 17px 21px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: #edf3fc; font-size: 13px; font-weight: 800; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { width: 24px; height: 24px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: #73a8ff; content: "+"; }
.faq-list details[open] summary::after { content: "−"; }
.faq-answer { padding: 0 21px 19px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.faq-answer p { margin: 0 0 10px; }
.faq-answer p:last-child { margin-bottom: 0; }
.faq-answer ul { margin: 8px 0 0; padding-left: 20px; }
.faq-answer a, .legal-card a { color: #77aaff; font-weight: 750; }
.legal-section { scroll-margin-top: 94px; }
.legal-section > h2 { margin: 0 0 12px; font-size: 22px; letter-spacing: -.025em; }
.legal-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.legal-card { padding: 20px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); }
.legal-card.wide { grid-column: 1 / -1; }
.legal-card h3 { margin: 0 0 9px; font-size: 15px; }
.legal-card p, .legal-card li { color: var(--muted); font-size: 12px; line-height: 1.7; }
.legal-card p { margin: 0 0 9px; }
.legal-card p:last-child { margin-bottom: 0; }
.legal-card ul { margin: 0; padding-left: 19px; }
.legal-note { padding: 18px 20px; border: 1px solid rgba(41,121,255,.28); border-radius: 11px; background: rgba(41,121,255,.07); color: #c8d9f4; font-size: 12px; }
@media (max-width: 850px) { .docs-layout { grid-template-columns: 1fr; } .docs-nav { position: static; display: flex; overflow-x: auto; } .docs-nav strong { display: none; } .docs-nav a { white-space: nowrap; } }
@media (max-width: 650px) { .docs-page { padding-top: 38px; } .legal-grid { grid-template-columns: 1fr; } .legal-card.wide { grid-column: auto; } }