/* =========================================================
   site-shell.css — universal, loaded on every page
   Paper, fonts, type tokens, body, container, utilities,
   shared ornaments (❖ separator + divider), colophon.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Bevan&family=Old+Standard+TT:ital,wght@0,400;0,700;1,400&family=Cormorant+Garamond:ital,wght@0,400;0,700;1,400;1,700&family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root {
  --paper-bg: #f4ece0;
  --paper-stain-1: rgba(139, 79, 26, 0.06);
  --paper-stain-2: rgba(70, 40, 20, 0.05);
  --paper-stain-3: rgba(110, 70, 30, 0.04);
  --ink-primary: #1a1810;
  --ink-faded: #231a0c;
  --ink-faint: #7a6a55;
  --rule: #2a2018;
  --rule-faint: #6a5a48;
  --accent-red: #7a1f1f;
  --column-width: 740px;
}

html, body { margin: 0; padding: 0; }

body.daily-pensive {
  background-color: var(--paper-bg);
  background-image:
    radial-gradient(ellipse 380px 220px at 18% 22%, var(--paper-stain-1), transparent 70%),
    radial-gradient(ellipse 320px 200px at 82% 68%, var(--paper-stain-2), transparent 70%),
    radial-gradient(ellipse 260px 180px at 55% 90%, var(--paper-stain-3), transparent 70%),
    radial-gradient(ellipse 200px 140px at 88% 12%, var(--paper-stain-3), transparent 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='5'/><feColorMatrix type='matrix' values='0 0 0 0 0.4 0 0 0 0 0.32 0 0 0 0 0.22 0 0 0 0.12 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  color: var(--ink-primary);
  font-family: 'Old Standard TT', 'Times New Roman', Times, Georgia, serif;
  font-size: 17px;
  line-height: 1.65;
  min-height: 100vh;
}

.container {
  max-width: var(--column-width);
  margin: 0 auto;
  padding: 36px 28px 72px;
}

/* small hand glyph for editorial marks (✍) */
.hand {
  font-family: 'Old Standard TT', 'Segoe UI Symbol', 'Apple Symbols', sans-serif;
  font-style: normal;
  font-weight: 400;
  display: inline-block;
  transform: translateY(-1px);
}

/* eyebrow utility — small caps strap text used above the lede etc. */
.eyebrow {
  font-family: 'Old Standard TT', serif;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-faint);
  text-align: center;
  margin: 0 0 6px;
}

/* ❖ separator — between coda and Sources on day pages */
hr.separator {
  border: none;
  text-align: center;
  margin: 64px 0 8px;
  height: 24px;
  position: relative;
}
hr.separator::after {
  content: "\B7   \2756\FE0E   \B7";
  font-family: 'Old Standard TT', 'Segoe UI Symbol', 'Apple Symbols', serif;
  color: var(--ink-faded);
  font-size: 18px;
  letter-spacing: 0.4em;
  display: inline-block;
  transform: translateY(-2px);
}

/* ❖ divider — between sections on the home page */
hr.divider {
  border: none;
  text-align: center;
  margin: 56px 0;
  height: 24px;
  position: relative;
}
hr.divider::after {
  content: "\B7   \2756\FE0E   \B7";
  font-family: 'Old Standard TT', 'Segoe UI Symbol', 'Apple Symbols', serif;
  color: var(--ink-faded);
  font-size: 18px;
  letter-spacing: 0.4em;
}

/* colophon — quiet single line of italic Cormorant at the foot */
.colophon {
  margin: 72px 0 0;
  padding: 24px 0 0;
  border-top: 6px double var(--rule);
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  color: var(--ink-faint);
  font-size: 14px;
  line-height: 1.55;
}
.colophon .dot { padding: 0 0.4em; color: var(--rule-faint); }

/* archive + day pages use a thinner colophon (no own top rule, foot-nav has it) */
.colophon.tight {
  margin: 28px 0 0;
  padding: 0;
  border-top: none;
  line-height: 1.5;
}

/* mobile */
@media (max-width: 700px) {
  .container { padding: 22px 18px 56px; }
}
