/* Eleutheromania — "Lamplight Ledger"
   Editorial, warm-dark, literary. Distinctive serifs, brass lamplight, paper grain.
   Tokens + public reading surface live here; admin.css layers the vault on top. */

:root {
  --ink:        #14110d;   /* warm near-black */
  --ink-2:      #1b1712;   /* raised panel */
  --ink-3:      #221d16;   /* hover / inset */
  --line:       #2e2820;   /* hairline */
  --line-2:     #3d352a;
  --parch:      #ece3d1;   /* primary text */
  --parch-dim:  #b8ab92;   /* secondary */
  --parch-faint:#8a7c64;   /* tertiary */
  --brass:      #c79a4b;   /* lamplight accent */
  --brass-lit:  #e3bd6c;
  --brass-deep: #9a7531;
  --gain:       #86a36c;   /* sage (for later P&L) */
  --loss:       #c0795c;   /* terracotta */
  --maxw:       68ch;

  --serif-display: "Fraunces", "Hoefler Text", Georgia, serif;
  --serif-body:    "Newsreader", "Iowan Old Style", Georgia, serif;
  --mono:          "Spline Sans Mono", ui-monospace, "SFMono-Regular", monospace;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--ink);
  color: var(--parch);
  font-family: var(--serif-body);
  font-size: 19px;
  line-height: 1.72;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
}

/* paper grain + a low lamplight glow from the top */
body::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  background:
    radial-gradient(1100px 520px at 50% -8%, rgba(199,154,75,0.10), transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

a { color: var(--brass-lit); text-decoration: none; }
a:hover { color: var(--brass); }

::selection { background: rgba(199,154,75,0.28); color: #fff; }

.wrap { position: relative; z-index: 1; }

/* ---------- public masthead ---------- */
.masthead {
  text-align: center;
  padding: 9vh 24px 6vh;
  border-bottom: 1px solid var(--line);
  position: relative; z-index: 1;
}
.wordmark {
  font-family: var(--serif-display);
  font-weight: 600;
  font-size: clamp(2.6rem, 7vw, 5rem);
  letter-spacing: -0.015em;
  line-height: 0.98;
  margin: 0;
  font-variation-settings: "opsz" 110, "SOFT" 30;
  background: linear-gradient(180deg, var(--brass-lit), var(--brass-deep));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.wordmark a { color: inherit; -webkit-text-fill-color: transparent; }
.masthead .tagline {
  margin: 1.2rem auto 0;
  max-width: 46ch;
  color: var(--parch-dim);
  font-style: italic;
  font-size: 1.05rem;
}
.masthead .rule {
  width: 64px; height: 1px; margin: 2rem auto 0;
  background: linear-gradient(90deg, transparent, var(--brass), transparent);
}

/* ---------- index list of essays ---------- */
.feed {
  max-width: 760px; margin: 0 auto; padding: 4vh 24px 14vh;
  position: relative; z-index: 1;
}
.entry {
  display: block; padding: 2.4rem 0;
  border-bottom: 1px solid var(--line);
  transition: padding-left .35s cubic-bezier(.2,.7,.2,1);
}
.entry:hover { padding-left: 14px; }
.entry .meta {
  font-family: var(--mono); font-size: .74rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--parch-faint);
  display: flex; gap: 1rem; align-items: center;
}
.entry .meta .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--brass-deep); }
.entry h2 {
  font-family: var(--serif-display); font-weight: 500;
  font-size: clamp(1.5rem, 3.4vw, 2.1rem); line-height: 1.12;
  margin: .5rem 0 .4rem; color: var(--parch);
  font-variation-settings: "opsz" 60;
}
.entry:hover h2 { color: var(--brass-lit); }
.entry p { margin: 0; color: var(--parch-dim); font-size: 1.02rem; }
.entry .arrow { color: var(--brass); opacity: 0; transition: opacity .3s; }
.entry:hover .arrow { opacity: 1; }

.empty {
  max-width: 760px; margin: 0 auto; padding: 10vh 24px;
  text-align: center; color: var(--parch-faint); font-style: italic;
}

/* ---------- single post ---------- */
.article {
  max-width: var(--maxw); margin: 0 auto; padding: 8vh 24px 12vh;
  position: relative; z-index: 1;
}
.article .back {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--parch-faint);
}
.article .post-meta {
  font-family: var(--mono); font-size: .76rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--parch-faint);
  margin: 3.2rem 0 .8rem; display: flex; gap: 1rem; align-items: center;
}
.article h1 {
  font-family: var(--serif-display); font-weight: 600;
  font-size: clamp(2.1rem, 5.2vw, 3.4rem); line-height: 1.06;
  letter-spacing: -0.018em; margin: 0 0 2.4rem;
  font-variation-settings: "opsz" 130, "SOFT" 20;
}
.prose { font-size: 1.18rem; line-height: 1.78; color: var(--parch); }
.prose > p:first-of-type::first-letter {
  font-family: var(--serif-display); font-weight: 600;
  float: left; font-size: 3.6em; line-height: .76;
  padding: .06em .12em 0 0; color: var(--brass);
}
.prose h2, .prose h3 {
  font-family: var(--serif-display); font-weight: 500;
  margin: 2.4rem 0 .8rem; line-height: 1.2;
}
.prose h2 { font-size: 1.7rem; } .prose h3 { font-size: 1.35rem; }
.prose a { border-bottom: 1px solid var(--brass-deep); }
.prose blockquote {
  margin: 1.8rem 0; padding: .2rem 0 .2rem 1.4rem;
  border-left: 2px solid var(--brass-deep);
  color: var(--parch-dim); font-style: italic;
}
.prose code {
  font-family: var(--mono); font-size: .86em;
  background: var(--ink-2); padding: .12em .4em; border-radius: 4px;
  border: 1px solid var(--line);
}
.prose pre {
  background: var(--ink-2); border: 1px solid var(--line);
  border-radius: 10px; padding: 1.1rem 1.2rem; overflow: auto;
}
.prose pre code { background: none; border: none; padding: 0; }
.prose hr { border: none; border-top: 1px solid var(--line); margin: 2.6rem 0; }
.prose img { max-width: 100%; border-radius: 8px; }
.prose ul, .prose ol { padding-left: 1.3rem; }

.site-foot {
  text-align: center; padding: 4vh 24px; border-top: 1px solid var(--line);
  color: var(--parch-faint); font-family: var(--mono);
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  position: relative; z-index: 1;
}
.site-foot a { color: var(--parch-faint); }
.site-foot a:hover { color: var(--brass); }

/* staggered page-load reveal */
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.rise { opacity: 0; animation: rise .7s cubic-bezier(.2,.7,.2,1) forwards; }

@media (max-width: 600px) {
  body { font-size: 17.5px; }
  .prose { font-size: 1.08rem; }
}
@media (prefers-reduced-motion: reduce) {
  .rise { animation: none; opacity: 1; transform: none; }
  .entry, .entry:hover { transition: none; padding-left: 0; }
}