@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;600;700&family=Unbounded:wght@500;600&display=swap');

:root{
  --bg:#0B0D10; --surface:#12151A; --surface2:#151A22;
  --divider:#1E242C; --border:#262D37;
  --muted:#7A8794; --text2:#98A6B3; --text1:#C6D0D8; --text:#F2F5F7;
  --accent:#C8F04F;
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#F7F9FB; --surface:#FFFFFF; --surface2:#FFFFFF;
    --divider:#E4EAF0; --border:#E4EAF0;
    --muted:#64748B; --text2:#475569; --text1:#334155; --text:#0F172A;
    --accent:#047857;
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text1);
  font-family:'Onest',system-ui,sans-serif; font-size:16px; line-height:1.65;
  padding:0 20px 80px;
}

.wrap{max-width:760px; margin:0 auto}

.doc-top{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:22px 0; border-bottom:1px solid var(--divider); margin-bottom:40px; flex-wrap:wrap;
}
.doc-top a{color:var(--muted); text-decoration:none; font-size:14px}
.doc-top a:hover{color:var(--accent)}
.brand{font-family:'Unbounded',sans-serif; font-weight:600; font-size:17px; color:var(--text); text-decoration:none}

h1{
  font-family:'Unbounded',sans-serif; font-weight:600;
  font-size:clamp(24px,4.5vw,34px); line-height:1.25; color:var(--text);
  margin:0 0 10px; letter-spacing:-.01em;
}
.meta{color:var(--muted); font-size:14px; margin:0 0 40px}

h2{
  font-size:19px; font-weight:600; color:var(--text);
  margin:44px 0 14px; padding-top:22px; border-top:1px solid var(--divider);
}
h2:first-of-type{border-top:none; padding-top:0; margin-top:0}
h3{font-size:16px; font-weight:600; color:var(--text); margin:26px 0 10px}

p{margin:0 0 14px}
ul,ol{margin:0 0 16px; padding-left:22px}
li{margin-bottom:8px}
strong{color:var(--text); font-weight:600}
a{color:var(--accent)}

.card{
  background:var(--surface); border:1px solid var(--border);
  border-radius:14px; padding:20px 22px; margin:24px 0;
}
.card p:last-child,.card ul:last-child{margin-bottom:0}

.kv{list-style:none; padding:0; margin:0}
.kv li{
  display:flex; gap:14px; padding:9px 0; border-bottom:1px solid var(--divider);
  flex-wrap:wrap; margin:0;
}
.kv li:last-child{border-bottom:none}
.kv b{color:var(--muted); font-weight:500; min-width:190px; flex-shrink:0}
.kv span{color:var(--text1)}

.foot{
  margin-top:56px; padding-top:22px; border-top:1px solid var(--divider);
  color:var(--muted); font-size:13px;
}
.foot a{color:var(--muted)}

@media (max-width:600px){
  body{padding:0 16px 60px}
  .kv b{min-width:100%}
}