@font-face { font-family: Newsreader; src: url('/assets/fonts/newsreader.woff2') format('woff2'); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: Newsreader; src: url('/assets/fonts/newsreader-italic.woff2') format('woff2'); font-weight: 200 800; font-style: italic; font-display: swap; }
@font-face { font-family: 'Noto Naskh Arabic'; src: url('/assets/fonts/noto-naskh-arabic.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
:root {
  color-scheme: light;
  --paper: #F5F1EA;
  --ink: #292724;
  --muted: #686159;
  --rule: #D8D1C8;
  --accent: #836958;
  --surface: #ECE6DC;
  --serif: Newsreader, Georgia, serif;
  --interface: system-ui, sans-serif;
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4.5rem;
  --space-7: 7rem;
  --measure: 68ch;
  --reading-width: 720px;
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.7;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
}
* { box-sizing: border-box; }
html:lang(ar) { --serif: 'Noto Naskh Arabic', Georgia, serif; line-height: 1.95; }
body { max-width: 1216px; margin: 0 auto; padding-inline: clamp(20px, 4vw, 48px); }
a { color: inherit; text-underline-offset: .22em; text-decoration-thickness: 1px; transition: color 120ms ease; }
a:hover { color: var(--accent); }
a:focus-visible, button:focus-visible, video:focus-visible, audio:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
p { margin-block: 0 var(--space-3); }
h1, h2, h3, h4 { font-weight: 450; line-height: 1.15; margin-block: 0 var(--space-3); text-wrap: pretty; }
h1 { font-size: clamp(2.3rem, 5.4vw, 4.3rem); letter-spacing: -.035em; }
h2 { font-size: clamp(1.5rem, 2.7vw, 2rem); letter-spacing: -.02em; }
h3 { font-size: clamp(1.65rem, 3.5vw, 2.65rem); letter-spacing: -.025em; }
:lang(ar) h1, :lang(ar) h2, :lang(ar) h3, :lang(ar) h4 { letter-spacing: normal; line-height: 1.5; }
:lang(ar) em { font-style: normal; font-weight: 600; }
.site-header { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: var(--space-5); padding-block: var(--space-3); border-bottom: 1px solid var(--rule); }
.site-header a, .site-footer a { text-decoration: none; }
.brand { font-size: 1.45rem; line-height: 1.4; letter-spacing: -.02em; }
:lang(ar) .brand { letter-spacing: normal; }
.site-header nav { display: flex; align-items: center; gap: var(--space-3); }
.site-header nav a { display: inline-flex; align-items: center; min-height: 44px; }
.site-header nav, .site-footer, .eyebrow, .work-meta, .text-link, .archive-nav, .return-link { font-family: var(--interface); font-size: .68rem; font-weight: 400; line-height: 1.7; }
.site-header .languages { gap: .6rem; }
.languages span { color: var(--muted); }
.languages [aria-current] { text-decoration: underline; text-underline-offset: .35em; }
.site-header a[aria-current='page'] { color: var(--accent); text-decoration: underline; }
main { min-height: 65vh; padding-block: var(--space-6) var(--space-7); }
.opening { display: grid; grid-template-columns: 1.6fr 1fr; align-items: end; gap: var(--space-6); padding-block: var(--space-3) var(--space-6); }
.opening h1 { font-size: clamp(4rem, 9vw, 7rem); line-height: 1; margin: 0; letter-spacing: -.045em; }
:lang(ar) .opening h1 { font-size: clamp(3.8rem, 8.5vw, 6.2rem); letter-spacing: normal; line-height: 1.45; }
.opening-note { max-width: 28ch; color: var(--muted); margin-block: 0 .25rem; font-size: 1.1rem; line-height: 1.65; }
.eyebrow { color: var(--muted); margin-bottom: var(--space-3); }
.section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); padding-block: var(--space-3); border-top: 1px solid var(--rule); }
.section-heading h2 { margin: 0; font-size: 1.35rem; }
.text-link { color: var(--accent); text-decoration: underline; display: inline-block; padding-block: .3rem; }
.text-link span { margin-inline-start: .5rem; }
.work-list, .book-list { list-style: none; padding: 0; margin: 0; }
.work-row, .book-list li { display: grid; grid-template-columns: 200px minmax(0, 1fr); align-items: start; gap: var(--space-6); padding-block: var(--space-4) var(--space-5); border-bottom: 1px solid var(--rule); }
.work-row:not(:has(.work-art)) { grid-template-columns: 1fr; }
.work-row:lang(ar) { font-family: 'Noto Naskh Arabic', Georgia, serif; line-height: 1.95; }
.work-art { display: block; max-width: 200px; }
.work-copy { max-width: 740px; }
.work-copy h2 { font-size: clamp(1.65rem, 3.5vw, 2.65rem); }
.work-copy h2 a, .work-copy h3 a { text-decoration: none; }
.work-copy h2 a:hover, .work-copy h3 a:hover { text-decoration: underline; }
.work-meta { color: var(--muted); margin-bottom: var(--space-2); }
.work-excerpt, .work-copy > p:not(.work-meta) { max-width: 60ch; margin-bottom: var(--space-3); }
.author-note { display: grid; grid-template-columns: 1fr 2fr; column-gap: var(--space-6); margin-top: var(--space-6); max-width: 880px; }
.author-note .text-link { grid-column: 2; justify-self: start; }
.author-note > p:not(.eyebrow) { font-size: 1.25rem; }
.page-heading { max-width: 850px; margin-bottom: var(--space-6); }
.page-heading > p:last-child { color: var(--muted); max-width: 42ch; }
.archive-nav { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-bottom: var(--space-5); }
.archive-nav span { color: var(--muted); margin-inline-start: .4rem; }
.archive-section + .archive-section { margin-top: var(--space-6); }
.empty-note { color: var(--muted); max-width: 50ch; }
.reading-page { max-width: var(--reading-width); margin-inline: auto; }
.article-header { margin-bottom: var(--space-5); }
.article-header h1 { font-size: clamp(2.2rem, 4.8vw, 3.4rem); }
.article-deck { color: var(--muted); font-size: 1.15rem; }
.prose { max-width: min(var(--measure), var(--reading-width)); }
.prose p { margin-block: 0 var(--space-3); }
.prose h2, .prose h3, .prose h4 { margin-top: var(--space-5); }
.prose h2 { font-size: 1.6rem; }
.prose h3 { font-size: 1.3rem; }
.prose blockquote { margin: var(--space-5) 0; padding-inline-start: var(--space-4); border-inline-start: 2px solid var(--rule); color: var(--muted); font-size: 1.2rem; }
.prose ul, .prose ol { padding-inline-start: var(--space-3); margin-block: var(--space-3); }
.prose li { padding-inline-start: .3rem; margin-block: .5rem; }
.prose .footnotes { border-top: 1px solid var(--rule); margin-top: var(--space-5); padding-top: var(--space-3); font-size: .85rem; }
.prose pre, .prose table { max-width: 100%; overflow-x: auto; display: block; }
.prose figure { margin: var(--space-5) 0; }
.prose figcaption { color: var(--muted); font-size: .8rem; margin-top: var(--space-1); }
.book-page > .article-header { max-width: 900px; }
.book-detail { display: grid; grid-template-columns: 240px minmax(0, 1fr); align-items: start; gap: var(--space-6); margin-bottom: var(--space-6); }
.book-detail img { width: 240px; }
.book-introduction { max-width: 42ch; font-size: 1.15rem; }
.book-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
.book-description { margin-inline-start: auto; }
.return-link { padding-top: var(--space-4); margin-top: var(--space-5); border-top: 1px solid var(--rule); }
img { display: block; max-width: 100%; height: auto; }
video, audio { width: 100%; max-width: 100%; margin-block: var(--space-4); }
.site-footer { border-top: 1px solid var(--rule); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); color: var(--muted); padding-block: var(--space-4); }
.site-footer > a:first-child { font-family: var(--serif); font-size: 1.15rem; color: var(--ink); }
.skip { position: absolute; inset-block-start: -200px; padding: var(--space-1) var(--space-2); background: var(--paper); z-index: 10; }
.skip:focus { inset-block-start: 8px; }
::selection { background: var(--surface); color: var(--ink); }
@media (max-width: 800px) {
  .site-header { gap: var(--space-3); }
  .opening { grid-template-columns: 1fr; gap: var(--space-4); }
  .opening-note { max-width: 40ch; }
  .work-row, .book-list li { gap: var(--space-4); grid-template-columns: 150px minmax(0, 1fr); }
  .book-detail { gap: var(--space-4); grid-template-columns: 180px minmax(0, 1fr); }
  .author-note { column-gap: var(--space-4); }
}
@media (max-width: 560px) {
  :root { font-size: 19px; }
  .site-header { grid-template-columns: 1fr auto; gap: var(--space-1) var(--space-2); padding-block: var(--space-2); }
  .site-header > nav:first-of-type { grid-row: 2; grid-column: 1 / -1; }
  .site-header > .languages { grid-row: 1; grid-column: 2; }
  .brand { font-size: 1.25rem; }
  main { padding-block: var(--space-5) var(--space-6); }
  .opening { padding-block: 0 var(--space-5); }
  .opening h1 { font-size: clamp(3.6rem, 16vw, 5rem); }
  :lang(ar) .opening h1 { font-size: 4rem; }
  .section-heading { align-items: start; }
  .section-heading .text-link { white-space: nowrap; font-size: .62rem; }
  .work-row, .book-list li, .book-detail { grid-template-columns: 1fr; gap: var(--space-3); }
  .work-art { max-width: 130px; }
  .book-detail img { width: 190px; }
  .work-copy h2, .work-copy h3 { font-size: 1.8rem; }
  .author-note { grid-template-columns: 1fr; gap: var(--space-1); margin-top: var(--space-5); }
  .author-note .text-link { grid-column: 1; }
  .page-heading { margin-bottom: var(--space-5); }
  .site-footer > span { width: 100%; order: 3; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }