/* styles.css — современный минималистичный стиль */
:root{
  --bg:#0b0f14;
  --panel:#121821;
  --text:#e6edf3;
  --muted:#9aa8b5;
  --primary:#ff4757;
  --primary-700:#d63b48;
  --outline:#3a4756;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,#0b0f14 0%,#0d1219 100%);
}
img{max-width:100%;display:block}
.container{max-width:1100px;margin:0 auto;padding:0 20px}

/* Header / Nav */
.site-header{position:sticky;top:0;z-index:50;background:rgba(18,24,33,.8);backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid var(--outline)}
.nav{display:flex;align-items:center;gap:16px;padding:12px 20px}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700}
.brand-logo{width:28px;height:28px}
.brand-name{letter-spacing:.3px}
.nav-toggle{margin-left:auto;background:transparent;border:1px solid var(--outline);color:var(--text);padding:8px 10px;border-radius:8px;display:none}
.nav-links{display:flex;gap:16px;margin-left:auto;list-style:none;padding:0}
.nav a{color:var(--muted);text-decoration:none;padding:8px 10px;border-radius:8px}
.nav a:hover{color:var(--text);background-color:#19202b}

@media (max-width:860px){
  .nav-toggle{display:block}
  .nav-links{position:absolute;top:60px;left:0;right:0;background:var(--panel);border-bottom:1px solid var(--outline);flex-direction:column;display:none}
  .nav-links.open{display:flex}
}

/* Sections */
.section{padding:48px 0;border-top:1px solid var(--outline)}
.section h2{font-size:28px;margin:0 0 10px}
.section p{color:var(--muted)}

/* Footer */
.footer{border-top:1px solid var(--outline);padding:24px 0;color:var(--muted)}
.doc-content{background:var(--panel);border:1px solid var(--outline);border-radius:12px;padding:16px}
.doc-loading{color:var(--muted)}
.doc-content h1,.doc-content h2,.doc-content h3{color:var(--text)}
.doc-content p, .doc-content li{color:var(--muted)}
.doc-content table{width:100%;border-collapse:collapse}
.doc-content table, .doc-content th, .doc-content td{border:1px solid var(--outline)}
.doc-content th, .doc-content td{padding:8px}

/* Якори для заголовков, чтобы не прятались под фиксированным хедером */
.doc-content h1, .doc-content h2, .doc-content h3{scroll-margin-top:80px}

/* Улучшаем читаемость разделов */
.doc-content h1{margin-top:24px}
.doc-content h2{margin-top:20px}
.doc-content h3{margin-top:16px}