:root{
  --bg:#0f1416;
  --panel:#151c1f;
  --text:#cfd6d6;
  --muted:#7f8a8d;
  --a:#22d3c5;
  --a2:#2aa9ff;
  --line:#243033;
  --w:1000px;
}

html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font:14px/1.45 "Courier New", Courier, monospace;
}

/* keep links simple, a little old-school */
a{color:var(--a);text-decoration:underline}
a:hover{color:var(--a2)}

/* centered page */
.wrap{max-width:var(--w);margin:0 auto;padding:14px 12px}

/* minimal panel, slightly rounded */
.panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  padding:14px 12px;
}

/* simple headings */
h1{margin:6px 0 10px;font-size:16px;text-align:center}
h2{margin:0 0 8px;font-size:14px}
hr{border:0;border-top:1px solid var(--line);margin:10px 0 12px}

/* keep nav centered but plain */
.nav{text-align:center;margin:0 0 10px;color:var(--muted)}
.nav a{padding:0 6px}

/* keep logo centered, remove modern glow */
.logo{display:block;margin:8px auto 6px;max-width:520px;width:92%;height:auto}

/* list: drop flex, keep very basic */
.list{margin:0;padding:0 0 0 18px}
.list li{padding:6px 0}
/* issue list: date inline in parentheses */
.list small{
  color:var(--muted);
  display:inline;
  margin-left:6px;
  font-size:12px;
}

.list small:before{content:"("}
.list small:after{content:")"}


/* basic text blocks */
.meta{color:var(--muted);font-size:12px;margin:0 0 8px}
.content p{margin:0 0 10px}

/* code: basic box, slightly rounded */
.content pre{
  background:#0b0f11;
  border:1px solid var(--line);
  padding:10px;
  border-radius:8px;
  overflow:auto;
  color:var(--text);
}

/* embedded stuff kept minimal */
.embed{background:var(--panel);color:var(--text);margin:0;padding:12px}
.issue-hero{display:block;width:100%;max-width:500px;height:auto;margin:8px 0 10px;border:1px solid var(--line);border-radius:8px}

.issue-frame{
  display:block;
  width:100%;
  min-height:10em;
  height:400px;   /* or whatever fits your content */
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:8px;
}

/* footer: simple stacked */
.footer{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
.footer > *{display:block;margin:2px 0}

/* page switching without js */
.page{display:none}
#issues{display:block}

/* when author or contact is targeted, hide issues and show that page */
#author:target, #contact:target{display:block}
#author:target ~ #issues, #contact:target ~ #issues{display:none}

/* if issues is explicitly targeted, show it */
#issues:target{display:block}

.list{
  list-style:none;
  padding-left:0;
  margin-left:0;
}




