*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.7;color:#111;background:#fff}
.sc-WhNiLj{max-width:900px;margin:0 auto;padding:0 28px}
.sc-tLLJyf{background:#111;color:#fff;padding:64px 0;margin-bottom:48px}
.sc-tLLJyf h1{font-size:42px;font-weight:800;letter-spacing:-1px;margin-bottom:8px}
.sc-tLLJyf p{font-size:18px;opacity:.7}
.sc-tLLJyf a{color:#fff;text-decoration:none;font-size:22px;font-weight:800}
.sc-gWnYNy{padding:0}
.sc-QTXntc{padding:32px 0;border-left:4px solid #111;padding-left:24px;margin-bottom:28px}
.sc-QTXntc h2{font-size:24px;font-weight:700;margin-bottom:6px}
.sc-QTXntc h2 a{color:#111;text-decoration:none}
.sc-QTXntc h2 a:hover{text-decoration:underline}
.sc-QTXntc .sc-TLFusg{font-size:12px;font-weight:600;text-transform:uppercase;color:#888;letter-spacing:1px;margin-bottom:8px}
.sc-QTXntc p{font-size:15px;color:#444;margin-bottom:10px}
.sc-YaHivU{display:inline-block;background:#111;color:#fff;padding:8px 20px;font-size:13px;font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:1px}
.sc-YaHivU:hover{background:#333}
.sc-Vjuheb{padding-bottom:60px}
.sc-Vjuheb h1{font-size:38px;font-weight:800;letter-spacing:-1px;margin-bottom:10px}
.sc-Vjuheb time{font-size:12px;font-weight:600;text-transform:uppercase;color:#888;letter-spacing:1px;display:block;margin-bottom:28px}
.sc-Vjuheb h2{font-size:26px;font-weight:700;margin:40px 0 14px}
.sc-Vjuheb h3{font-size:20px;font-weight:700;margin:32px 0 10px}
.sc-Vjuheb p{margin-bottom:18px;font-size:17px}
.sc-Vjuheb ul,.sc-Vjuheb ol{margin:0 0 18px 24px}
.sc-Vjuheb a{color:#111;font-weight:600;text-decoration:underline}
.sc-Vjuheb img{max-width:100%;height:auto;margin:20px 0}
.sc-NYkjUy{background:#111;color:#888;padding:28px 0;margin-top:48px;text-align:center;font-size:12px}
.sc-NYkjUy a{color:#888;text-decoration:none}
.sc-kOOxBw{background:#222;color:#aaa;padding:14px 20px;margin-bottom:24px;font-size:13px;font-style:italic}
.sc-SlXETP{background:#1a1a1a;color:#888;padding:14px 20px;margin-top:32px;font-size:12px;border-top:3px solid #444}
.sc-KRtCzi{font-size:12px;font-weight:600;text-transform:uppercase;color:#666;letter-spacing:1px;margin:-20px 0 28px;padding-left:12px;border-left:2px solid #ccc}
.sc-HpSvHW{margin:0 0 24px}
.sc-BfOTnK{width:100%;height:auto;border-radius:0}
.sc-GGHaJO{border-left:4px solid #111;padding-left:24px;margin-top:48px}
.sc-GGHaJO h3{font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.sc-GGHaJO ul{list-style:none;padding:0}
.sc-GGHaJO li{padding:6px 0}
.sc-GGHaJO a{color:#111;text-decoration:underline;font-weight:600}
.sc-EOuMCY{border-left:4px solid #ddd;padding-left:24px;margin-top:36px}
.sc-EOuMCY ul{list-style:none;padding:0}
.sc-EOuMCY li{padding:6px 0;font-size:16px}
.sc-EOuMCY a{color:#111;text-decoration:none;font-weight:600}
.sc-EOuMCY a:hover{text-decoration:underline}
.sc-EOuMCY .sc-TLFusg{margin:0 0 0 8px}
/* === Theme === */
:root{--primary:#4C3D3D;--accent:#C9A878;--bg:#ECE4D0;--fg:#1F1A1A;--border:#C5BBA8;--moment:#5E3A5C;--r:2px;--fb:'Literata';--fh:'Literata';--fd:'Newsreader';--fm:'Archivo'}
/* === Custom === */
/* v.6b26dd — layout revision */
/* Eyes After Forty — editorial signature pass. Webfonts declared as @font-face
   (the top-of-file @import is dropped by the concatenated deploy, so it is dead);
   @font-face is position-independent and always loads. */
@font-face { font-family: 'Literata'; font-style: normal; font-weight: 300 700; font-display: swap; src: url(https://fonts.gstatic.com/s/literata/v40/or3PQ6P12-iJxAIgLa78DkTtAoDhk0oVpaK3YLanFLHpPf2TbLi4J_HWTA.woff2) format('woff2'); }
@font-face { font-family: 'Literata'; font-style: italic; font-weight: 300 700; font-display: swap; src: url(https://fonts.gstatic.com/s/literata/v40/or3yQ6P12-iJxAIgLYT1PLs1a-t7PU0AbeE9KK5U5Ck.woff2) format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 300 700; font-display: swap; src: url(https://fonts.gstatic.com/s/newsreader/v26/cY9CfjOCX1hbuyalUrK439vCjohC.woff2) format('woff2'); }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 400 800; font-display: swap; src: url(https://fonts.gstatic.com/s/archivo/v25/k3kPo8UDI-1M0wlSV9XAw6lQkqWY8Q82sLydOxI.woff2) format('woff2'); }

/* --- Foundation: book-weight serif, larger measure. This is a site read by
people whose near vision is failing — 19px Literata, not 17px sans. --- */
:root body { font-family: var(--fb), Georgia, serif; font-size: 19px; line-height: 1.66; background: var(--bg); color: var(--fg); }
:root hr { border-top: 1px solid rgba(76, 61, 61, .2); }
::selection { background: var(--moment); color: var(--bg); }

:root>body>div:first-child>div { max-width: min(1080px, 92vw); }
:root main:has(>div>h2) { max-width: min(1080px, 92vw); padding-bottom: 96px; }
:root main:not(:has(>div>h2)) { max-width: min(716px, 92vw); padding-bottom: 88px; }
:root footer>div { max-width: min(1080px, 92vw); }

/* -- MASTHEAD -- */
/* Photo plate + warm ink wash. The asset is Patricia's own register:
rain on the window, two pairs of readers, a supplement bottle, a book. */
:root>body>div:first-child { position: relative; background-color: #2E2424; background-image: linear-gradient(180deg, rgba(34, 26, 26, .72) 0%, rgba(52, 41, 41, .68) 42%, rgba(70, 56, 56, .9) 100%), url("/theme-assets/hero-masthead.jpg"); background-size: cover; background-position: center 64%; background-repeat: no-repeat; border-bottom: 3px solid var(--accent); padding: 0; margin-bottom: 68px; }
:root>body>div:first-child:has(h1)>div { padding-top: 66px; padding-bottom: 46px; }
:root>body>div:first-child:has(>div>a)>div { padding-top: 38px; padding-bottom: 34px; }
:root>body>div:first-child:has(>div>a) { margin-bottom: 52px; }

/* SIGNATURE MARK — the Snellen "E", the first line of every eye chart, and the
initial of the masthead. Boxed like library signage. */
:root>body>div:first-child>div::before { content: ""; display: block; width: 48px; height: 48px; margin-bottom: 26px; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2294%22%20height%3D%2294%22%20fill%3D%22none%22%20stroke%3D%22%23C9A878%22%20stroke-width%3D%223%22%2F%3E%3Cg%20fill%3D%22%23ECE4D0%22%3E%3Crect%20x%3D%2226%22%20y%3D%2226%22%20width%3D%2211%22%20height%3D%2248%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2226%22%20width%3D%2248%22%20height%3D%2211%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2244%22%20width%3D%2240%22%20height%3D%2211%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2263%22%20width%3D%2248%22%20height%3D%2211%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-size: contain; background-repeat: no-repeat; }
:root>body>div:first-child:has(>div>a)>div::before { display: inline-block; width: 30px; height: 30px; margin: 0 14px -7px 0; }

:root>body>div:first-child h1::before { content: "A READING LOG\0000A0\0000B7\0000A0PORTLAND, OREGON"; display: block; font-family: var(--fm), sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: .34em; text-transform: uppercase; color: var(--accent); margin-bottom: 20px; font-style: normal; }
:root>body>div:first-child h1, body>div:first-child a { font-family: var(--fd), Georgia, serif; font-style: italic; font-weight: 600; color: var(--bg); letter-spacing: -.02em; text-shadow: 0 2px 14px rgba(0, 0, 0, .38); }
:root>body>div:first-child h1 { font-size: clamp(44px, 6.6vw, 76px); line-height: 1.0; margin: 0 0 22px; }
:root>body>div:first-child a { font-size: clamp(26px, 3.2vw, 34px); }
:root>body>div:first-child p { font-family: var(--fb), Georgia, serif; font-style: italic; font-size: 17.5px; line-height: 1.55; color: rgba(236, 228, 208, .84); max-width: 54ch; margin: 0; text-shadow: 0 1px 8px rgba(0, 0, 0, .4); }
:root>body>div:first-child>div:has(>h1)::after { content: "WRITTEN BY PATRICIA WHITFIELD\0000A0\0000B7\0000A0RETIRED ENGLISH TEACHER\0000A0\0000B7\0000A0NOT A DOCTOR"; display: block; margin-top: 30px; padding-top: 16px; border-top: 1px solid rgba(236, 228, 208, .3); font-family: var(--fm), sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: rgba(236, 228, 208, .72); }

/* -- HOMEPAGE — SHARED CARD RESET -- */
:root main>div:has(>h2) { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; margin: 0; transition: none; position: relative; }
:root main>div:has(>h2):hover { transform: none; box-shadow: none; }
:root main>div:has(>h2)>h2 a { color: var(--primary); text-decoration: none; }
:root main>div:has(>h2)>h2 a:hover { color: var(--moment); }
:root main>div:has(>h2)>p:first-child { font-family: var(--fm), sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(31, 26, 26, .55); margin: 0 0 12px; }
:root main>div:has(>h2)>p:not(:first-child) { font-family: var(--fb), Georgia, serif; color: var(--fg); opacity: .78; margin: 0 0 16px; }
:root main>div:has(>h2)>a:last-child { font-family: var(--fm), sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--primary); background: transparent; border: 0; border-radius: 0; padding: 0; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; transition: gap .18s ease, color .18s ease; }
:root main>div:has(>h2)>a:last-child::after { content: "\002192"; font-size: 14px; }
:root main>div:has(>h2)>a:last-child:hover { background: transparent; color: var(--moment); gap: 13px; }

/* Editor's Picks kicker label — full-row block above the three picks. */
:root main:has(>div>h2)>div:nth-of-type(2):has(>h2)::before { content: "EDITOR'S PICKS\0000A0\002014\0000A0READ THESE THREE FIRST"; font-family: var(--fm), sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: .32em; text-transform: uppercase; color: var(--moment); border-bottom: 1px solid rgba(76, 61, 61, .22); padding-bottom: 12px; display: block; margin-bottom: 30px; }

/* -- SECTION STRIPS (RULE F) — two rainy-window photo bands as gear-changes.
   Strip 1 sits above The Full Log; Strip 2 above the older-entries index.
   hero-photo.jpg is 404 on this site, so both reuse the masthead plate at
   different crops — repetition far apart reads as rhythm, not duplication. -- */
:root main:has(>div>h2)>div:nth-of-type(5):has(>h2)::before,
:root main:has(>div>h2)>div:has(>ul)::before {
  display: flex; align-items: center; justify-content: center;
  height: 150px; margin: 40px 0 46px; padding: 0;
  background-color: #2E2424;
  background-image: linear-gradient(rgba(44, 34, 40, .50), rgba(30, 24, 26, .34)), url("/theme-assets/hero-masthead.jpg");
  background-size: cover; background-repeat: no-repeat;
  border-radius: 8px; border-bottom: 0;
  font-family: var(--fm), sans-serif; font-size: 13px; font-weight: 700;
  letter-spacing: .32em; text-transform: uppercase; color: #F5EEDF;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .7);
}
:root main:has(>div>h2)>div:nth-of-type(5):has(>h2)::before { content: "IN ORDER OF WRITING"; background-position: center 30%; }
:root main:has(>div>h2)>div:has(>ul)::before { content: "OLDER ENTRIES"; background-position: center 70%; }

/* -- THE HERO -- */
:root main:has(>div>h2)>div:nth-of-type(1) { padding: 6px 0 56px; border-bottom: 3px double rgba(76, 61, 61, .34); margin-bottom: 0; }
:root main:has(>div>h2)>div:nth-of-type(1)>h2 { font-family: var(--fd), Georgia, serif; font-style: italic; font-weight: 600; font-size: clamp(36px, 4.6vw, 58px); line-height: 1.05; letter-spacing: -.018em; margin: 0 0 20px; max-width: 21ch; }
:root main:has(>div>h2)>div:nth-of-type(1)>h2::after { content: "BY PATRICIA WHITFIELD\0000A0\0000B7\0000A0FIELD NOTES FROM PORTLAND"; display: block; margin-top: 24px; line-height: 1.8; font-style: normal; font-family: var(--fm), sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: rgba(31, 26, 26, .58); }
:root main:has(>div>h2)>div:nth-of-type(1)>p:not(:first-child) { font-size: 20px; line-height: 1.54; opacity: .86; max-width: 52ch; margin: 0 0 30px; }
:root main:has(>div>h2)>div:nth-of-type(1)>p:not(:first-child)::first-letter { font-family: var(--fd), Georgia, serif; font-style: italic; font-weight: 600; font-size: 76px; line-height: .76; float: left; margin: 8px 13px 0 0; color: var(--moment); }
:root main:has(>div>h2)>div:nth-of-type(1)>a:last-child { font-size: 12px; letter-spacing: .2em; padding: 13px 27px 12px; border: 1.5px solid var(--primary); border-radius: 999px; }
:root main:has(>div>h2)>div:nth-of-type(1)>a:last-child:hover { background: var(--primary); color: var(--bg); border-color: var(--primary); gap: 8px; }
:root main:has(>div>h2)>div:nth-of-type(1)>p:first-child::before { content: "N\0000B0 01"; display: block; text-transform: none; font-family: var(--fd), Georgia, serif; font-style: italic; font-weight: 600; font-size: 62px; line-height: 1; letter-spacing: -.02em; color: rgba(76, 61, 61, .6); margin-bottom: 8px; }
:root main:has(>div>h2)>div:nth-of-type(1)::before { content: "LATEST ENTRY"; font-family: var(--fm), sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; color: var(--primary); border: 1px solid rgba(76, 61, 61, .45); border-radius: 999px; padding: 6px 15px 5px; }
:root main:has(>div>h2)>div:nth-of-type(1)::after { content: "FIVE SUPPLEMENTS\0000A0\0000B7\0000A0FOUR YEARS\0000A0\0000B7\0000A0ONE PAIR OF EYES"; font-family: var(--fm), sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(31, 26, 26, .5); border-top: 1px solid rgba(76, 61, 61, .22); padding-top: 14px; max-width: 215px; }

/* -- EDITOR'S PICKS BAND (2-4) -- */
:root main:has(>div>h2)>div:nth-of-type(n+2):nth-of-type(-n+4):has(>h2) { padding: 44px 0 8px; }
:root main:has(>div>h2)>div:nth-of-type(n+2):nth-of-type(-n+4):has(>h2)>h2 { font-family: var(--fb), Georgia, serif; font-size: 21px; font-weight: 700; line-height: 1.22; letter-spacing: -.005em; margin: 0 0 10px; }
:root main:has(>div>h2)>div:nth-of-type(n+2):nth-of-type(-n+4):has(>h2)>p:not(:first-child) { font-size: 15.5px; line-height: 1.56; opacity: .74; }
:root main:has(>div>h2)>div:nth-of-type(n+2):nth-of-type(-n+4):has(>h2)>p:first-child::before { color: var(--accent); font-weight: 700; letter-spacing: .12em; }
:root main:has(>div>h2)>div:nth-of-type(2):has(>h2)>p:first-child::before { content: "I\0000A0\0000B7\0000A0"; }
:root main:has(>div>h2)>div:nth-of-type(3):has(>h2)>p:first-child::before { content: "II\0000A0\0000B7\0000A0"; }
:root main:has(>div>h2)>div:nth-of-type(4):has(>h2)>p:first-child::before { content: "III\0000A0\0000B7\0000A0"; }

/* -- THE FULL LOG (5+) — date-rail chronological rows -- */
:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2) { border-top: 1px solid rgba(76, 61, 61, .18); padding: 26px 0 28px; }
:root main:has(>div>h2)>div:nth-of-type(5):has(>h2) { border-top: 0; padding: 0 0 28px; }
:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>h2 { font-family: var(--fb), Georgia, serif; font-size: 23px; font-weight: 700; line-height: 1.24; letter-spacing: -.005em; margin: 0 0 9px; max-width: 40ch; }
:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>p:not(:first-child) { font-size: 16.5px; line-height: 1.58; max-width: 66ch; margin-bottom: 13px; }

/* -- OLDER ENTRIES INDEX (RULE G) — full-width two-column magazine index -- */
:root main:has(>div>h2)>div:has(>ul) { position: relative; margin: 0; padding: 0; border-left: 0; border-top: 0; }
:root main:has(>div>h2)>div:has(>ul)>ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 54px; }
:root main:has(>div>h2)>div:has(>ul)>ul>li { break-inside: avoid; padding: 11px 0; border-bottom: 1px dotted rgba(76, 61, 61, .3); border-top: 0; }
:root main:has(>div>h2)>div:has(>ul)>ul>li>a { display: block; font-family: var(--fb), Georgia, serif; font-size: 16px; line-height: 1.34; color: var(--fg); text-decoration: none; font-weight: 400; }
:root main:has(>div>h2)>div:has(>ul)>ul>li>a:hover { color: var(--moment); }
:root main:has(>div>h2)>div:has(>ul)>ul>li>span { display: block; font-family: var(--fm), sans-serif; font-size: 9.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(31, 26, 26, .45); margin: 4px 0 0; }

@media (min-width: 900px) {
:root main:has(>div>h2) { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 44px; row-gap: 0; align-items: start; }
:root main:has(>div>h2)>div { grid-column: 1 / -1; }
:root main:has(>div>h2)>div:nth-of-type(n+2):nth-of-type(-n+4):has(>h2) { grid-column: span 2; padding-top: 108px; }

:root main:has(>div>h2)>div:nth-of-type(2):has(>h2)::before { position: absolute; top: 46px; left: 0; margin-bottom: 0; width: calc(300% + 88px); max-width: min(1024px, 90vw); }

/* Strips: absolutely-positioned photo bands (so they never join the date-rail
   grid); their host divs reserve top space via padding. */
:root main:has(>div>h2)>div:nth-of-type(5):has(>h2)::before,
:root main:has(>div>h2)>div:has(>ul)::before { position: absolute; top: 0; left: 0; right: 0; height: 138px; margin: 0; }
:root main:has(>div>h2)>div:nth-of-type(5):has(>h2) { padding-top: 176px; }
:root main:has(>div>h2)>div:has(>ul) { padding-top: 182px; }

:root main:has(>div>h2)>div:nth-of-type(1) { display: grid; grid-template-columns: minmax(0, 1.68fr) minmax(0, 1fr); column-gap: 56px; align-items: start; padding-bottom: 62px; }
:root main:has(>div>h2)>div:nth-of-type(1)>* { grid-column: 1; }
:root main:has(>div>h2)>div:nth-of-type(1)>p:first-child { grid-column: 2; grid-row: 1; text-align: right; margin: 0; }
:root main:has(>div>h2)>div:nth-of-type(1)::before { grid-column: 2; grid-row: 2; justify-self: end; align-self: start; margin-top: 4px; }
:root main:has(>div>h2)>div:nth-of-type(1)::after { grid-column: 2; grid-row: 3; justify-self: end; text-align: right; width: 100%; margin-top: 18px; }

:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2) { display: grid; grid-template-columns: 150px minmax(0, 1fr); column-gap: 36px; align-items: start; }
:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>p:first-child { grid-column: 1; grid-row: 1 / span 3; margin: 0; padding-top: 5px; }
:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>h2, :root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>p:not(:first-child), :root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>a:last-child { grid-column: 2; }
}

/* -- ARTICLE PAGE -- */
:root main:not(:has(>div>h2))>hgroup>h1, :root main:not(:has(>div>h2))>h1, :root main:not(:has(>div>h2))>article>h1 { font-family: var(--fd), Georgia, serif; font-style: italic; font-weight: 600; font-size: clamp(33px, 4.8vw, 51px); line-height: 1.07; letter-spacing: -.016em; color: var(--primary); margin: 10px 0 20px; }
:root main:not(:has(>div>h2))>hgroup>time, :root main:not(:has(>div>h2))>time { font-family: var(--fm), sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: rgba(31, 26, 26, .55); margin-bottom: 44px; padding-bottom: 18px; border-bottom: 1px solid rgba(76, 61, 61, .2); }
:root main:not(:has(>div>h2))>hgroup>time::after, :root main:not(:has(>div>h2))>time::after { content: "\0000A0\0000B7\0000A0BY PATRICIA WHITFIELD\0000A0\0000B7\0000A0NOT A DOCTOR, JUST A CLOSE READER"; }

:root main>article>p { font-family: var(--fb), Georgia, serif; font-size: 19px; line-height: 1.74; margin-bottom: 22px; color: var(--fg); }
:root main:has(>hgroup)>article>p:first-of-type { font-size: 19px; color: var(--fg); opacity: 1; line-height: 1.72; }
:root main:has(>hgroup)>article>p:first-of-type::first-letter { font-family: var(--fd), Georgia, serif; font-style: italic; font-weight: 600; font-size: 74px; line-height: .76; float: left; margin: 9px 12px 0 0; color: var(--moment); }
:root main>article>h2 { font-family: var(--fb), Georgia, serif; font-size: 27px; font-weight: 700; color: var(--primary); border-top: 0; padding-top: 0; margin: 54px 0 18px; letter-spacing: -.008em; line-height: 1.22; }
:root main>article>h2::before { content: "\0000B6 \0000B6 \0000B6"; display: block; text-align: center; font-weight: 400; font-size: 14px; letter-spacing: .7em; color: var(--accent); opacity: .8; margin: 0 0 44px; text-indent: .7em; }
:root main>article>h2:first-of-type::before { content: none; }
:root main>article>h3 { font-family: var(--fb), Georgia, serif; font-style: italic; font-weight: 700; font-size: 21px; color: var(--primary); margin: 38px 0 12px; }
:root main>article>section>h2 { font-family: var(--fb), Georgia, serif; font-size: 24px; font-weight: 700; color: var(--primary); margin: 46px 0 16px; padding-top: 22px; border-top: 1px solid rgba(76, 61, 61, .2); }
:root main>article>section>ul>li>a { color: var(--primary); text-decoration-color: var(--accent); text-underline-offset: 3px; }

:root main>article blockquote { border-left: 0; background: transparent; border-radius: 0; position: relative; font-family: var(--fb), Georgia, serif; font-size: 21px; line-height: 1.52; font-style: italic; color: var(--primary); padding: 6px 0 6px 46px; margin: 46px 0; }
:root main>article blockquote::before { content: "\00201C"; position: absolute; left: -2px; top: 10px; font-family: var(--fd), Georgia, serif; font-style: italic; font-size: 86px; line-height: .74; color: var(--accent); }

:root main>article>p a, :root main>article>p a:visited { color: var(--primary); text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px; font-weight: 600; }
:root main>article>p a[href^="/link/"], :root main>article>p a[href^="/link/"]:visited { background: var(--primary); color: var(--bg); padding: 2px 9px 3px; border-radius: 2px; text-decoration: none; font-family: var(--fm), sans-serif; font-size: 15.5px; font-weight: 600; letter-spacing: .01em; }
:root main>article>p a[href^="/link/"]:hover { background: #2E2424; color: var(--bg); }

:root main>article>section>img { border-radius: 2px; background: rgba(76, 61, 61, .09); box-shadow: 0 6px 24px rgba(31, 26, 26, .15); margin: 6px 0 4px; }
:root main>article>section:has(>img) { margin: 0 0 38px; }

:root main>article>aside { position: relative; border: 1px solid rgba(76, 61, 61, .24); border-left: 3px solid var(--primary); border-radius: 0; padding: 20px 26px 20px 23px; margin: 58px 0 0; font-family: var(--fb), Georgia, serif; font-size: 15px; font-style: italic; line-height: 1.62; color: rgba(31, 26, 26, .84); background: linear-gradient(225deg, var(--bg) 0 22px, rgba(76, 61, 61, .3) 22px 23px, rgba(201, 168, 120, .17) 23px); }
:root main>article>aside::before { content: "A NOTE ON WHAT THIS IS NOT"; display: block; font-style: normal; font-family: var(--fm), sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: var(--primary); opacity: .78; margin-bottom: 10px; }

:root main:not(:has(>div>h2))>div:has(>ul) { margin-top: 80px; padding: 34px 0 0 26px; border-top: 3px double rgba(76, 61, 61, .3); border-left: 3px solid var(--accent); }
:root main:not(:has(>div>h2))>div:has(>ul)>h3 { font-family: var(--fm), sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; color: var(--moment); margin-bottom: 20px; }
:root main:not(:has(>div>h2))>div:has(>ul)>ul>li { padding: 13px 0; border-bottom: 1px solid rgba(76, 61, 61, .12); }
:root main:not(:has(>div>h2))>div:has(>ul)>ul>li>a { font-family: var(--fb), Georgia, serif; font-size: 17px; line-height: 1.38; color: var(--fg); text-decoration: none; font-weight: 400; }
:root main:not(:has(>div>h2))>div:has(>ul)>ul>li>a:hover { color: var(--moment); }

/* -- FOOTER -- */
:root footer { border-top: 0; margin-top: 96px; padding: 0 0 52px; text-align: center; font-family: var(--fm), sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: rgba(31, 26, 26, .58); opacity: 1; }
:root footer>div { border-top: 3px double rgba(76, 61, 61, .3); padding-top: 30px; }
:root footer a { color: rgba(31, 26, 26, .58); border-bottom: 0; }
:root footer a:hover { color: var(--moment); }

/* -- MOBILE -- */
@media (max-width: 899px) {
:root body { font-size: 18px; }
:root>body>div:first-child:has(h1)>div { padding-top: 62px; padding-bottom: 40px; }
:root>body>div:first-child { margin-bottom: 46px; }
:root main:has(>div>h2)>div:nth-of-type(1) { padding-bottom: 40px; }
:root main:has(>div>h2)>div:nth-of-type(1)>p:first-child::before { font-size: 46px; }
:root main:has(>div>h2)>div:nth-of-type(1)>p:not(:first-child)::first-letter { font-size: 60px; }
:root main:has(>div>h2)>div:nth-of-type(1)::before { display: inline-block; margin: 6px 0 0; }
:root main:has(>div>h2)>div:nth-of-type(1)::after { display: block; margin-top: 26px; max-width: none; }
:root main:has(>div>h2)>div:nth-of-type(2):has(>h2) { padding-top: 46px; }
:root main:has(>div>h2)>div:nth-of-type(3):has(>h2), :root main:has(>div>h2)>div:nth-of-type(4):has(>h2) { padding-top: 26px; }
:root main:has(>div>h2)>div:nth-of-type(n+5):has(>h2)>p:first-child { margin-bottom: 8px; }
:root main:has(>div>h2)>div:has(>ul)>ul { columns: 1; }
:root main:has(>hgroup)>article>p:first-of-type::first-letter { font-size: 58px; }
:root main>article>h2 { font-size: 24px; }
:root main>article blockquote { font-size: 19px; padding-left: 34px; }
:root main>article>h2::before { margin-bottom: 34px; }
}
