:root { 
  /* Light theme (default) */
  --bg: #f8f9fb;        /* page background */
  --panel: #ffffff;     /* content panel */
  --border: #e5e9f2;    /* panel border */
  --fg: #0b0e14;        /* primary text */
  --muted: #5a6169;     /* subdued text */
  --link: #0b8f4f;      /* deep green to keep terminal vibe */
  --accent-red: #ff5f56;
  --accent-yellow: #ffbd2e;
  --accent-green: #27c93f;
}
* { box-sizing: border-box; }
html, body { 
  margin: 0; padding: 0; 
  background: var(--bg); color: var(--fg); 
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; 
  line-height: 1.6; 
  text-rendering: optimizeLegibility;
}

/* Terminal window look for the main content */
.container { 
  position: relative;
  max-width: 820px; 
  margin: 24px auto; 
  padding: 48px 28px 28px; 
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px; 
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
}
/* Title bar with macOS style traffic lights */
.container::before {
  content: "";
  position: absolute;
  top: 10px; left: 14px;
  width: 36px; height: 10px;
  border-radius: 10px;
  background:
    radial-gradient(circle at 5px 5px, var(--accent-red) 4px, transparent 5px) 0 0/12px 10px no-repeat,
    radial-gradient(circle at 5px 5px, var(--accent-yellow) 4px, transparent 5px) 12px 0/12px 10px no-repeat,
    radial-gradient(circle at 5px 5px, var(--accent-green) 4px, transparent 5px) 24px 0/12px 10px no-repeat;
}

header a { color: var(--muted); text-decoration: none; }
header a:hover { text-decoration: underline; color: var(--fg); }

h1, h2, h3 { line-height: 1.25; }
h1 { font-size: 2rem; margin: 0 0 12px; color: var(--fg); }
.home h1 { font-size: 2.2rem; margin: 0 0 24px; line-height: 1.2; }

/* Prompt-like heading */
h1::before { content: "$ "; color: var(--link); opacity: 0.9; }

.meta { color: var(--muted); font-size: 0.95rem; margin-bottom: 24px; }
.date { color: var(--muted); font-size: 0.95rem; }

a { color: var(--link); }
/* Emphasis: make strong/b text orange for terminal vibe */
strong, b { color: #ff9f43; }
.post { margin: 18px 0; }
.post a { color: var(--fg); text-decoration: none; }
.post a:hover { color: var(--link); text-decoration: underline; }

/* Code/Pre blocks (light theme) */
pre { 
  padding: 14px; 
  border-radius: 8px; 
  overflow: auto; 
  background: #f5f7fb; 
  border: 1px solid #e5e9f2;
}
code { 
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; 
  font-size: 0.95em; 
  color: #0b0e14;
}

/* Subtle caret animation utility if needed */
.cursor {
  display: inline-block; width: 8px; height: 1.1em; 
  background: var(--link); margin-left: 4px; 
  animation: blink 1.1s steps(1) infinite;
}
@keyframes blink { 50% { opacity: 0; } }

footer { margin-top: 48px; color: var(--muted); font-size: 0.9rem; }

/* Text colors for common elements in light theme */
p, ul, li { color: #3a3f46; }

/* About page: single hero image responsive */
.about-hero {
  display: block;
  width: 100%;
  max-width: 760px; /* cap width on large screens */
  height: auto;     /* keep aspect ratio */
  margin: 0 auto 16px; /* center within container */
}