:root{
    --bg:#121212; 
    --fg:#f0f0f0;   
    --link:#80d0ff; 
}

html,body{
    height:100%;
    margin:0;
}

body{
    background:var(--bg);
    color:var(--fg);
    font:16px/1.6 Arial,Helvetica,sans-serif;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:center;
    padding:40px 2vw;
    box-sizing:border-box;
}

.block{
    max-width:720px;         
    width:100%;
    margin-top:1.5rem;
}

h1, h2, h3, h4, h5, h6{margin:1.4em 0 .6em;font-weight:700}
h1{font-size:2.2rem;text-align:center}
h2{font-size:1.6rem}
h3{font-size:1.3rem}
em{font-style:italic}

p {
  margin: 1em 0;
  font-size: 1rem;
}

a {
  color: var(--link);
  text-decoration: none;
  font-size: 1rem;
}

ul, ol{margin:0 0 1.2em 1.4em}
li{margin:.35em 0}

.site-header {
  width: 100%;
  background: var(--bg);
  color: var(--fg);
  border-bottom: 1px solid #333;
  padding: 1rem 2rem;
  box-sizing: border-box;
}

.header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 720px;
  margin: 0 auto;
}

.site-title {
  margin: 0;
  font-size: 1.8rem;
  text-align: left;
}

.site-nav a {
  color: var(--link);
  font-size: 1rem;
  text-decoration: none;
  margin-left: 1.5rem;
}

.site-nav a:hover {
  text-decoration: underline;
}