/* SOFT BRUTALISM 
   The 'Monospace' vibe but without the eye-strain.
*/

* {
  box-sizing: border-box;
  margin: 0;
}

body {
  /* Using a cleaner Monospace stack for that "SDE manual" feel */
  font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace; 
  background-color: #f5f5f5; /* A light grey "concrete" that's easier on the eyes */
  color: #2a2a2a; /* Softened black */
  line-height: 1.5;
  padding: clamp(2rem, 8vh, 5rem) 2rem;
  max-width: 70ch;
  margin: 0 auto;
  font-size: 1rem;
}

/* Navigation - Structural but clean */
nav ul {
  list-style: none;
  padding: 0;
  display: flex;
  gap: 1.5rem;
  border-bottom: 2px solid #2a2a2a;
  padding-bottom: 1rem;
  margin-bottom: 3rem;
}

nav a {
  text-decoration: none;
  color: #2a2a2a;
  text-transform: lowercase;
}

nav a:hover {
  background: #2a2a2a;
  color: #f5f5f5;
}

nav [aria-current="page"] {
  font-weight: bold;
  border-bottom: 2px solid #2a2a2a;
}

/* Headers - The "Label" look you liked */
h3, .Footnotes__title {
  text-transform: lowercase;
  font-size: 1.25rem;
  margin-top: 3.5rem;
  margin-bottom: 1.5rem;
  background: #2a2a2a;
  color: #f5f5f5;
  display: inline-block;
  padding: 2px 8px;
}

/* Typography bits */
p, li {
  margin-bottom: 1.2rem;
}

/* Links - Keeping it "Logic" themed */
a {
  color: #2a2a2a;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

a:hover {
  text-decoration: none;
  background-color: #e0e0e0;
}

/* Blockquotes - The Redacted/Draft look */
blockquote {
  margin: 2.5rem 0;
  padding: 1.25rem;
  border: 1px dashed #2a2a2a;
  background-color: #ededed;
}

/* The $5 Footnotes */
.Footnotes {
  margin-top: 6rem;
  padding-top: 2rem;
  border-top: 1px solid #2a2a2a;
  font-size: 0.9rem;
  opacity: 0.8;
}

.Footnotes__list-item::marker {
  content: "» ";
}

/* Image - Muted but sharp */
img.cover-img {
  max-width: 100%;
  filter: grayscale(100%);
  border: 1px solid #2a2a2a;
  margin: 2rem 0;
}

/* Strikethrough - The 'Reluctant' voice */
s {
  color: #888;
  text-decoration-thickness: 1.5px;
}

/* Footer - Minimalist */
footer {
  margin-top: 6rem;
  border-top: 1px solid #ddd;
  padding-top: 1rem;
  font-size: 0.8rem;
  color: #666;
}

/* Smooth selection */
::selection {
  background: #2a2a2a;
  color: #f5f5f5;
}

/* Highlight the footnote when you jump to it */
.Footnotes__list-item:target {
  background-color: #ffffd0; /* A soft 'highlighter' yellow */
  outline: 2px dashed #2a2a2a;
  padding: 0.5rem;
  transition: background-color 0.3s ease;
}

/* Optional: Highlight the text reference when jumping back */
/* (The plugin usually gives the original link an ID like #fnref-1) */
[role="doc-noteref"]:target {
  background-color: #ffffd0;
  outline: 2px dashed #2a2a2a;
}