/* compute.bio blog theme: mirrors compute_bio_landing/src/theme.ts (MUI tokens), light + dark */
:root {
  --blue:#0066cc; --teal:#00b8a9; --bg:#f8f9fa; --paper:#fff; --fg:#212121; --muted:#616161;
  --line:rgba(0,0,0,.12); --bar:rgba(248,249,250,.8);
}
html[data-theme=dark] {
  --blue:#4d94ff; --teal:#4dd4c4; --bg:#0a0a0a; --paper:#1a1a1a; --fg:#fff; --muted:#a6a6a6;
  --line:rgba(255,255,255,.12); --bar:rgba(10,10,10,.8);
  color-scheme:dark;
}
body, textarea, input, button, select {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif !important;
}
body { background:var(--bg) !important; color:var(--fg) !important; line-height:1.6; }
h1,h2,h3,h4,h5,h6 { font-family:inherit !important; font-weight:600; color:var(--fg); }
a, a:link, a:visited { color:var(--blue); }
a:hover { color:var(--teal); }

/* WriteFreely hardcodes greys; remap to tokens */
header nav a, header nav span, header p.description, header p.meta-note, header p.meta-note span,
body footer nav, body footer nav a:link, body footer nav a:visited, .post-title time, time, .hint, p.dateline { color:var(--muted) !important; }
body footer nav a.home, header h1 a, header h2 a, .post-title a, h2.post-title a, article h2 a { color:var(--fg) !important; font-weight:600; }
body footer nav a:hover, header nav a:hover, .post-title a:hover, h2.post-title a:hover { color:var(--blue) !important; }
hr { background:var(--line) !important; }
footer { border-top:1px solid var(--line); margin-top:3em; }
footer hr { display:none; }

pre, code { border-radius:8px; }
pre { background:var(--paper) !important; color:var(--fg) !important; border:1px solid var(--line); padding:12px; }
code { background:var(--paper) !important; color:var(--fg) !important; }
blockquote { border-left:3px solid var(--teal) !important; color:var(--muted) !important; }
table, th, td { border-color:var(--line) !important; }
img { max-width:100%; border-radius:8px; }

input, textarea, select { background:var(--paper) !important; color:var(--fg) !important; border:1px solid var(--line) !important; border-radius:8px !important; }
textarea#editor { background:var(--bg) !important; border:0 !important; border-radius:0 !important; }
button, .btn, input[type=submit], a.btn, a.btn:link, a.btn:visited, input[type=submit]:visited {
  background:var(--blue) !important; color:#fff !important; border:0 !important;
  border-radius:8px !important; font-weight:500; text-transform:none;
}
button:hover, .btn:hover, input[type=submit]:hover { background:var(--teal) !important; }
.cb-bar button { background:transparent !important; color:inherit !important; }

/* Top bar (injected by theme.js): same layout as landing AppBar */
.cb-bar {
  position:sticky; top:0; z-index:1000; display:flex; align-items:center; gap:8px;
  height:64px; padding:0 24px; box-sizing:border-box; margin:0;
  background:var(--bar); backdrop-filter:blur(8px); border-bottom:1px solid var(--line);
}
.cb-bar a { color:var(--fg) !important; text-decoration:none; }
.cb-brand { display:flex; align-items:center; gap:8px; margin-right:auto; font-size:1.25rem; font-weight:600; }
.cb-brand img { height:36px; border-radius:0; }
.cb-bar nav a { padding:6px 12px; border-radius:8px; font-weight:500; }
.cb-bar nav a:hover, .cb-bar button:hover { background:rgba(128,128,128,.15) !important; }
.cb-bar button { border:0 !important; border-radius:50% !important; width:40px; height:40px; font-size:1.2rem; cursor:pointer; line-height:1; padding:0; }
html:not([data-theme=dark]) .logo-w, html[data-theme=dark] .logo-b { display:none; }