/* Shared site typography. The cover signature is the sole handwritten exception. */
:root { --text-font: Georgia, 'Times New Roman', serif; --ink: #000; --paper: #fff; --rule: #d8d8d8; font-family: var(--text-font); color: var(--ink); background: var(--paper); }
body, .entry, .cover, input, textarea, select, button { font-family: var(--text-font); color: var(--ink); }
.entry { width: min(100%, 62rem); padding: clamp(1.4rem, 5vw, 4rem); }
.entry__body { width: min(100%, 38rem); margin-inline: auto; padding-block: 3rem; }
.entry h2 { max-width: 26ch; font-family: var(--text-font); font-size: clamp(1.65rem, 4vw, 2.4rem); font-weight: 400; font-style: normal; letter-spacing: -.02em; line-height: 1.3; margin-bottom: 1.4rem; }
.entry h3, .entry h4 { font-family: var(--text-font); font-weight: 400; font-style: normal; letter-spacing: 0; line-height: 1.45; }
.entry h3 { font-size: 1.25rem; }
.entry h4 { font-size: 1.1rem; }
.entry p, .entry li, .entry blockquote { line-height: 1.8; }
.entry .eyebrow, .entry .quiet-label, .entry .index-control { font-family: var(--text-font); font-size: .8rem; font-weight: 400; font-style: normal; letter-spacing: 0; text-transform: none; }
.entry .actions, .entry .text-action, .entry .byline, .entry .note, .entry summary, .entry label, .entry button { font-family: var(--text-font); font-weight: 400; font-style: normal; }
.entry .index-control { text-decoration: none; }
.entry .entry-navigation { gap: 1.4rem; }
.entry input, .entry textarea { font: inherit; background: #fff; border-color: var(--rule); }
.entry .fragment, .entry .object-copy { font-size: 1.05rem; line-height: 1.8; }
.entry .poem p, .entry .prose p { font-family: var(--text-font); }
.cover .entry__body { width: min(100%, 32rem); padding: 0 0 2rem; }
.cover h1 { font-family: 'Bradley Hand', 'Segoe Print', 'Comic Sans MS', cursive; }
.cover .cover-latest-film h2, .cover .cover-stack-link, .cover .cover-invitation h2 { font-family: var(--text-font); font-size: 1.05rem; font-weight: 400; line-height: 1.6; letter-spacing: 0; }
.cover .cover-invitation { width: 100%; margin-top: 2rem; }
.cover .cover-invitation h2 { max-width: 30ch; margin: 0 0 1rem; }
.cover-invitation textarea { display: block; min-height: 6rem; width: 100%; padding: .8rem 0; border: 0; border-bottom: 1px solid var(--rule); resize: vertical; border-radius: 0; font-size: .95rem; }
.invitation-contact { margin: 1rem 0 1.4rem; font-size: .875rem; }
.invitation-contact summary { cursor: pointer; }
.invitation-contact input[type="text"], .invitation-contact input[type="email"] { display: block; width: 100%; border: 0; border-bottom: 1px solid var(--rule); border-radius: 0; padding: .7rem 0; font-size: .875rem; }
.invitation-contact .checkbox { margin-top: 1rem; font-size: .8rem; }
.cover-invitation button[type="submit"] { padding: .2rem 0; border: 0; background: none; font-size: .875rem; cursor: pointer; }
.cover-invitation .invitation-privacy { margin: .5rem 0 0; font-size: .75rem; }
.cover-invitation [role="status"] { margin: .75rem 0 0; }

.cover-invitation input[type="text"], .cover-invitation input[type="email"] { display: block; width: 100%; border: 0; border-bottom: 1px solid var(--rule); border-radius: 0; padding: .8rem 0; margin: .5rem 0; font: inherit; font-size: .9rem; }
.cover-invitation button[type="submit"] { margin-top: 1rem; }

.cover .cover-latest-film h2 { display: flex; align-items: baseline; justify-content: flex-start; padding: 1rem 0; margin: 0 0 1rem; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.cover .cover-latest-film { margin: 0 0 1.5rem; }
.event-film-poster { display: grid; grid-template-columns: 1fr 1fr; min-height: 14rem; aspect-ratio: 16 / 9; width: 100%; color: #fff; background: #111; overflow: hidden; }
.event-poster-copy { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 1.3rem; text-align: left; font: 400 clamp(1.4rem, 4vw, 2rem)/1.15 var(--text-font); }
.event-poster-play { display: flex; gap: .4rem; align-items: center; font: 400 .8rem/1.5 var(--text-font); }
.event-poster-image { display: block; background-image: url('assets/cover/more-worlds-event-still.jpg'); background-size: auto 170%; background-position: 50% 45%; background-repeat: no-repeat; }
.journal-film-play:hover .event-poster-play { text-decoration: underline; text-underline-offset: .25em; }
@media (max-width: 400px) { .event-poster-copy { padding: 1rem; } .event-film-poster { min-height: 11rem; } }

/* Keep the white canvas in mobile browsers with automatic darkening. */
html, body, #app, .entry, .cover { color-scheme: only light; background-color: #fff; color: #000; }
.cover-artist-image { background-color: #fff; }
.cover-invitation input, .cover-invitation textarea { color-scheme: only light; background-color: #fff; color: #000; }
