:root{
  --bg:#0b0c0e;
  --fg:#d7d7d7;
  --dim:#9aa0a6;
  --link:#cbb7ff;   /* lilás suave */
  --rule:#3a3f44;
}

*{ box-sizing:border-box; }

html,body{
  margin:0;
  background-color:#0b0c0e;
  color:var(--fg);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  line-height: 1.35;
  min-height:100vh;
}

.wrap{
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 14px 60px;
}

.header img{
  max-width:100%;
  margin: 0 0 14px 0;
  display:block;
}

.header pre{
  margin:0 0 10px 0;
  color:var(--fg);
}

.nav{
  margin: 10px 0 18px;
  color: var(--dim);
}
.nav a{ color: var(--link); text-decoration: none; }
.nav a:hover{ text-decoration: underline; }

.rule{
  border:0;
  border-top: 1px solid var(--rule);
  margin: 14px 0;
}

pre, code{
  white-space: pre-wrap;
  word-break: break-word;
}

.article-title{
  margin: 0 0 6px 0;
  font-size: 18px;
  font-weight: 700;
}

.meta{
  color: var(--dim);
  font-size: 13px;
}

.block{
  border: 1px solid var(--rule);
  padding: 12px;
  border-radius: 6px;
  background: rgba(255,255,255,0.02);
}

.small{
  font-size: 13px;
  color: var(--dim);
}

.footer{
  margin-top: 14px;
  color: var(--dim);
  font-size: 12px;
}