/* Both writing routes share the site's header, page width and responsive shell. */
html{scrollbar-gutter:stable}
.top-nav{view-transition-name:site-header}
::view-transition-old(site-header),::view-transition-new(site-header){animation:none}
/* User-supplied pencil landscape. Keep the quiet left side behind the poems. */
.poetry-page{--bg:#fbfbf9;--poetry-background-image:url("/pictures/poetry/mountain-house.png");min-height:100vh;min-height:100svh;background-color:var(--bg);background-image:var(--poetry-background-image);background-size:cover;background-position:center top;background-repeat:no-repeat}
.poetry-page main{width:100%}
.poetry-page main h1{font-size:2.8rem;line-height:1.1;font-weight:500;letter-spacing:-.025em;color:#111;margin:0 0 3rem}
.poems{max-width:42rem}
.poem{scroll-margin-top:2rem}
.poem+.poem{margin-top:3rem;padding-top:3rem;border-top:1px solid #e5e5e5}
.poem h2{font-size:1.5rem;line-height:1.3;font-weight:500;letter-spacing:-.015em;color:#111;margin:0 0 1rem}
.poem-lines{font-size:1.125rem;line-height:1.9;margin:0;overflow-wrap:break-word}
.poetry-skip{position:absolute;top:-100px;left:1rem;padding:.5rem 1rem;background:#fbfbf9}
.poetry-skip:focus{top:1rem}
@media(max-width:700px){
 .poetry-page{background-image:linear-gradient(90deg,rgba(251,251,249,.65),rgba(251,251,249,.15)),var(--poetry-background-image);background-size:auto 100svh;background-position:85% top}
 .poetry-page main h1{font-size:2.25rem;margin-bottom:2.5rem}
}