html { color-scheme: light; background: light-dark(#fbfaf7,#1d1d1b); }
html, body { margin: 0; padding: 0; }
#az-memorial { min-height: 100vh; }
#az-memorial {
--az-paper: light-dark(#fbfaf7, #1d1d1b);
--az-ink: light-dark(#2b2b26, #ece9e1);
--az-muted: light-dark(#706e66, #b0ada3);
--az-line: light-dark(#dedbd2, #3a3932);
--az-photo: light-dark(#e9e6de, #34332d);
--az-skeleton: light-dark(#e9e6de, #393830);
--az-selected-background: light-dark(#000000, #ffffff);
--az-selected-text: light-dark(#ffffff, #000000);
--az-reading-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--az-sidebar-width: clamp(280px, 24vw, 380px);
background: var(--az-paper); color: var(--az-ink); color-scheme: light;
font-family: var(--az-reading-font);
font-size: 14px; line-height: 1.5; text-align: left; width: 100%; margin: 0 auto; position: relative;
}
#az-memorial * { box-sizing: border-box; }
#az-memorial[data-appearance="system"] { color-scheme: light dark; }
#az-memorial[data-appearance="light"] { color-scheme: light; }
#az-memorial[data-appearance="dark"] { color-scheme: dark; }
#az-memorial[data-reading-font="serif"] { --az-reading-font: Georgia, "Times New Roman", serif; }
#az-memorial [hidden] { display: none !important; }
#az-memorial p, #az-memorial h1, #az-memorial h2 { margin: 0; }
#az-memorial button { font: inherit; color: inherit; background: transparent; border: 0; border-radius: 0; text-align: left; cursor: pointer; }
#az-memorial button:focus-visible { outline: 2px solid var(--az-ink); outline-offset: 5px; }
#az-memorial .az-name, #az-memorial .az-mobile-name, #az-memorial .az-pages a, #az-memorial .az-collection-heading, #az-memorial .az-poem-links a, #az-memorial .az-see-all, #az-memorial .az-read-all, #az-memorial .az-back, #az-memorial .az-expand { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
#az-memorial .az-full-name-en { display: block; overflow-wrap: anywhere; }
#az-memorial .az-full-name-ru { display: block; margin-top: .35em; font-size: .7em; line-height: 1.45; font-weight: 400; letter-spacing: normal; overflow-wrap: anywhere; }
#az-memorial .az-author-credit { display: block; margin-bottom: 12px; font-size: 12px; }
#az-memorial .az-author-credit .az-full-name-ru { font-size: 11px; }
#az-memorial .az-layout { display: grid; grid-template-columns: var(--az-sidebar-width) minmax(0, 1fr); min-height: 740px; }
#az-memorial .az-sidebar-rail { position: sticky; top: 0; align-self: start; height: 100vh; height: 100dvh; min-width: 0; }
#az-memorial .az-sidebar { height: 100%; overflow-y: auto; overflow-x: hidden; overscroll-behavior-y: contain; overflow-anchor: none; scrollbar-width: thin; padding: 36px 22px; border-right: 1px solid var(--az-line); display: flex; flex-direction: column; gap: 0; }
#az-memorial .az-sidebar-resize { position: absolute; top: 0; right: -5px; z-index: 5; width: 10px; height: 100%; margin: 0; padding: 0; cursor: col-resize; touch-action: none; }
#az-memorial .az-sidebar-resize::after { content: ""; position: absolute; top: 50%; left: 4px; width: 2px; height: 44px; margin-top: -22px; border-radius: 2px; background: var(--az-muted); opacity: .45; }
#az-memorial .az-sidebar-resize:hover::after, #az-memorial .az-sidebar-resize:focus-visible::after { opacity: 1; }
#az-memorial.az-resizing, #az-memorial.az-resizing * { cursor: col-resize !important; user-select: none !important; }
#az-memorial .az-sidebar > * { flex-shrink: 0; }
#az-memorial .az-name { padding: 0; font-family: var(--az-reading-font); font-size: 22px; font-weight: 700; line-height: 1.3; letter-spacing: -.03em; margin-bottom: 19px; }
#az-memorial .az-name .az-full-name-ru { font-weight: 700; }
#az-memorial .az-nav-dates { font-size: 11px; line-height: 1.8; color: var(--az-muted); margin-bottom: 18px; }
#az-memorial .az-nav-dates time { white-space: nowrap; }
#az-memorial .az-nav-photo { display: block; width: 132px; max-width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; margin-bottom: 15px; }
#az-memorial .az-nav-photo span { font-size: 11px; }
#az-memorial .az-nav-photo svg { width: 23px; height: 23px; stroke-width: 1; }
#az-memorial .az-header-actions { display: flex; align-items: center; gap: 10px; position: relative; flex: 0 0 auto; }
#az-memorial .az-reader-tools { position: static; display: flex; align-items: center; gap: 6px; }
#az-memorial .az-tools-trigger { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 34px; padding: 0; border: 1px solid var(--az-line); border-radius: 6px; background: var(--az-paper); font-size: 18px; font-weight: 700; }
#az-memorial .az-font-trigger { font-family: Georgia, "Times New Roman", serif; }
#az-memorial .az-tools-trigger:hover, #az-memorial .az-tools-trigger[aria-expanded="true"] { background: var(--az-photo); }
#az-memorial .az-reader-panel { position: absolute; top: calc(100% + 8px); right: 0; z-index: 30; width: 188px; max-width: calc(100vw - 32px); padding: 16px; border: 1px solid var(--az-line); border-radius: 8px; background: var(--az-paper); box-shadow: 0 6px 20px light-dark(#0000001a, #00000055); display: grid; gap: 18px; }
#az-memorial .az-setting-label { margin-bottom: 10px; }
#az-memorial .az-setting-group { display: flex; align-items: center; gap: 2px; }
#az-memorial .az-icon-button { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 30px; border-radius: 5px; padding: 0; flex: 0 0 auto; }
#az-memorial .az-icon-button:hover { background: var(--az-photo); }
#az-memorial .az-icon-button[aria-pressed="true"] { background: var(--az-selected-background); color: var(--az-selected-text); }
#az-memorial .az-theme-glyph { font-family: "Segoe UI Symbol", "Arial Unicode MS", sans-serif; font-size: 20px; line-height: 1; }
#az-memorial .az-system-icon { display: block; position: relative; width: 16px; height: 11px; border: 1.5px solid currentColor; border-radius: 1px; }
#az-memorial .az-system-icon::before { content: ""; position: absolute; bottom: -4px; left: 6px; width: 1px; height: 3px; background: currentColor; }
#az-memorial .az-system-icon::after { content: ""; position: absolute; bottom: -5px; left: 3px; width: 7px; height: 1px; background: currentColor; }
#az-memorial .az-font-icon-serif { font-family: Georgia, "Times New Roman", serif; font-size: 18px; line-height: 1; }
#az-memorial .az-font-icon-sans { font-family: Arial, Helvetica, sans-serif; font-size: 18px; line-height: 1; }
#az-memorial .az-action-copy, #az-memorial .az-action-en, #az-memorial .az-action-ru { display: block; }
#az-memorial .az-action-en { font-size: 13px; font-weight: 700; }
#az-memorial .az-action-ru { font-size: 12px; line-height: 1.4; margin-top: 3px; opacity: .85; }
#az-memorial .az-action-arrow { margin-left: 8px; }
#az-memorial .az-pages { display: grid; gap: 15px; margin-bottom: 36px; }
#az-memorial .az-pages a, #az-memorial .az-collection-heading { padding: 7px 9px; margin: 0 -9px; border-radius: 6px; color: var(--az-ink); display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 13px; }
#az-memorial .az-pages a[aria-current="page"], #az-memorial .az-collection-heading[aria-current="page"] { background: var(--az-selected-background); color: var(--az-selected-text); }
#az-memorial .az-pages .az-poem-count, #az-memorial .az-collection-heading .az-poem-count { font-size: 11px; }
#az-memorial .az-pages a[aria-current="page"] .az-action-ru, #az-memorial .az-collection-heading[aria-current="page"] .az-action-ru { opacity: 1; }
#az-memorial .az-collection-heading { margin-bottom: 15px; font-weight: 700; }
#az-memorial .az-poem-links { display: grid; gap: 23px; }
#az-memorial .az-nav-poem { padding: 8px 10px; margin: 0 -10px; border-radius: 7px; color: var(--az-ink); }
#az-memorial .az-nav-poem::before { content: ""; display: block; width: 30px; height: 1px; background: var(--az-muted); opacity: .5; margin-bottom: 12px; }
#az-memorial .az-poem-links a { display: block; width: 100%; padding: 0; margin: 0; font-size: 15px; line-height: 1.5; color: inherit; }
#az-memorial .az-nav-poem[aria-current="page"] { background: var(--az-selected-background); color: var(--az-selected-text); }
#az-memorial .az-nav-poem[aria-current="page"]::before { background: currentColor; }
#az-memorial .az-nav-poem[aria-current="page"] .az-nav-title-ru { opacity: 1; }
#az-memorial .az-poem-links a:hover, #az-memorial .az-pages a:hover, #az-memorial .az-collection-heading:hover { text-decoration-thickness: 2px; }
#az-memorial .az-nav-more { display: block; width: 100%; padding: 10px 12px; border: 1px solid var(--az-line); border-radius: 6px; margin-top: 25px; text-align: center; font-size: 12px; }
#az-memorial .az-nav-more:hover { border-color: var(--az-muted); }
#az-memorial .az-see-all { display: block; width: 100%; padding: 10px 0; margin-top: 13px; font-size: 12px; text-align: center; }
#az-memorial .az-domain { margin-top: 48px; font-size: 11px; color: var(--az-muted); }
#az-memorial .az-main { padding: 48px clamp(24px, 4.7vw, 52px) 52px; min-width: 0; container-type: inline-size; }
#az-memorial .az-home { width: 100%; max-width: 960px; margin-inline: auto; }
#az-memorial .az-home:not([hidden]) ~ .az-translation-note { width: 100%; max-width: 960px; margin-inline: auto; }
#az-memorial .az-intro { display: block; }
#az-memorial .az-home-portrait { display: block; width: 100%; max-width: 420px; height: auto; margin-top: 32px; }
#az-memorial .az-eyebrow { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--az-muted); margin-bottom: 17px; }
#az-memorial h1 { font-family: var(--az-reading-font); font-size: clamp(34px, 4.5vw, 49px); letter-spacing: -.045em; font-weight: 400; line-height: 1.12; overflow-wrap: anywhere; }
#az-memorial .az-subtitle { font-family: var(--az-reading-font); font-size: 18px; margin-top: 19px; color: var(--az-muted); }
#az-memorial .az-life-dates { margin-top: 17px; font-size: 12px; line-height: 1.75; color: var(--az-muted); max-width: 260px; }
#az-memorial .az-eulogy { margin-top: 38px; max-width: 560px; }
#az-memorial h2 { font-family: var(--az-reading-font); font-size: 24px; line-height: 1.3; font-weight: 400; letter-spacing: -.025em; }
#az-memorial .az-placeholder-copy { margin-top: 15px; font-family: var(--az-reading-font); font-size: 17px; line-height: 1.8; color: var(--az-muted); }
#az-memorial .az-writing-lines { display: grid; gap: 11px; margin-top: 17px; max-width: 500px; }
#az-memorial .az-writing-lines span { height: 5px; background: var(--az-skeleton); width: 96%; }
#az-memorial .az-writing-lines span:nth-child(2) { width: 100%; }
#az-memorial .az-writing-lines span:last-child { width: 64%; }
#az-memorial .az-read-all { padding: 0 0 5px; margin-top: 27px; font-size: 12px; border-bottom: 1px solid var(--az-line); }
#az-memorial .az-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
#az-memorial .az-section-heading h2 { font-size: 30px; }
#az-memorial .az-section-heading > span { font-size: 11px; color: var(--az-muted); }
#az-memorial .az-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 70px 52px; margin-top: 30px; }
#az-memorial .az-poem-tile { display: flex; flex-direction: column; padding: 16px 0 0; border-top: 1px solid var(--az-line); min-width: 0; min-height: 206px; }
#az-memorial .az-poem-language { display: block; width: 100%; padding: 0; margin: 0; }
#az-memorial .az-poem-language > span { display: block; }
#az-memorial .az-tile-title { font-family: var(--az-reading-font); font-size: 24px; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
#az-memorial .az-tile-title-ru { font-family: var(--az-reading-font); font-size: 20px; line-height: 1.5; color: var(--az-ink); margin-top: 19px; overflow-wrap: anywhere; }
#az-memorial .az-tile-title, #az-memorial .az-tile-title-ru { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
#az-memorial .az-poem-language:hover .az-tile-title, #az-memorial .az-poem-language:hover .az-tile-title-ru { text-decoration-thickness: 2px; }
#az-memorial .az-tile-description, #az-memorial .az-tile-description-ru { font-family: var(--az-reading-font); font-size: 12px; line-height: 1.65; color: var(--az-muted); margin-top: 8px; overflow-wrap: anywhere; }
#az-memorial .az-expand { display: block; margin: 31px auto 0; padding: 8px 0; font-size: 12px; }
#az-memorial .az-all-grid { margin-top: 36px; }
#az-memorial .az-reading { width: 100%; max-width: 680px; margin-inline: auto; text-align: left; }
#az-memorial .az-reading:not([hidden]) ~ .az-translation-note { width: 100%; max-width: 680px; margin-inline: auto; }
#az-memorial .az-reading-title { font-family: var(--az-reading-font); font-size: clamp(30px, 4vw, 42px); font-weight: 700; scroll-margin-top: 24px; }
#az-memorial .az-reading-meta { margin-top: 18px; color: var(--az-muted); font-size: 12px; line-height: 1.6; }
#az-memorial .az-original-label, #az-memorial .az-reading-date { white-space: nowrap; }
#az-memorial .az-reading-text { margin-top: 19px !important; }
#az-memorial :is(.az-russian-version, .az-english-version) { border-top: 1px solid var(--az-line); padding-top: 44px; margin-top: 64px; }
#az-memorial .az-translation-label { font-family: var(--az-reading-font); font-size: 11px; color: var(--az-muted); letter-spacing: .04em; margin-bottom: 14px; scroll-margin-top: 24px; }
#az-memorial .az-translation-heading { font-family: var(--az-reading-font); font-size: 29px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
#az-memorial .az-translation-text { margin-top: 23px; font-family: var(--az-reading-font); font-size: 18px; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; }
#az-memorial .az-translation-note { padding-top: 48px; margin-top: 24px; font-size: 11px; color: var(--az-muted); max-width: 540px; line-height: 1.7; }
#az-memorial .az-nav-title { display: block; font-weight: 700; }
#az-memorial .az-nav-title-ru { display: block; font-size: 13px; margin-top: 3px; opacity: .85; }
#az-memorial .az-reading-text { margin-top: 32px; font-family: var(--az-reading-font); font-size: 18px; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; }
#az-memorial .az-adjacent-poems { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px; margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--az-line); }
#az-memorial .az-adjacent-link { display: block; min-width: 0; color: var(--az-ink); text-decoration: none; overflow-wrap: anywhere; }
#az-memorial .az-adjacent-action { display: block; color: var(--az-muted); margin-bottom: 13px; }
#az-memorial .az-adjacent-title { display: block; font-size: 18px; line-height: 1.45; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
#az-memorial .az-adjacent-title-ru { display: block; margin-top: 7px; font-size: 14px; line-height: 1.5; color: var(--az-muted); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
#az-memorial .az-adjacent-link:hover .az-adjacent-title, #az-memorial .az-adjacent-link:hover .az-adjacent-title-ru { text-decoration-thickness: 2px; }
#az-memorial .az-next-poem { grid-column: 2; text-align: right; }
#az-memorial.az-phone .az-adjacent-poems { grid-template-columns: minmax(0,1fr); gap: 28px; }
#az-memorial.az-phone .az-next-poem { grid-column: auto; text-align: left; }
@container (max-width: 440px) {
#az-memorial .az-adjacent-poems { grid-template-columns: minmax(0,1fr); gap: 28px; }
#az-memorial .az-next-poem { grid-column: auto; text-align: left; }
}
@media (max-width: 560px) {
#az-memorial .az-adjacent-poems { grid-template-columns: minmax(0,1fr); gap: 28px; }
#az-memorial .az-next-poem { grid-column: auto; text-align: left; }
}
#az-memorial .az-back { margin-top: 38px; padding: 0; font-size: 12px; color: var(--az-muted); }
#az-memorial .az-back .az-action-arrow { margin-left: 0; margin-right: 8px; }
#az-memorial .az-menu .az-action-en { font-size: 12px; }
#az-memorial .az-menu .az-action-ru { font-size: 11px; }
#az-memorial .az-mobile-header { display: flex; position: absolute; top: 12px; right: 16px; z-index: 20; }
#az-memorial .az-mobile-name, #az-memorial .az-menu { display: none; }
#az-memorial.az-phone { max-width: 390px; }
#az-memorial.az-phone .az-layout { display: block; }
#az-memorial.az-phone .az-sidebar-rail { display: none; position: static; height: auto; }
#az-memorial.az-phone.az-menu-open .az-sidebar-rail { display: block; }
#az-memorial.az-phone .az-sidebar-resize { display: none; }
#az-memorial.az-phone .az-mobile-header { display: flex; position: relative; top: auto; right: auto; width: 100%; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 21px; border-bottom: 1px solid var(--az-line); }
#az-memorial.az-phone .az-mobile-name { display: block; min-width: 0; flex: 1 1 auto; padding: 0; font-family: var(--az-reading-font); font-size: 20px; letter-spacing: -.03em; }
#az-memorial.az-phone .az-menu { display: flex; align-items: center; gap: 9px; padding: 10px 0 10px 8px; font-size: 11px; }
#az-memorial.az-phone .az-menu svg { width: 15px; height: 15px; }
#az-memorial.az-phone .az-sidebar { display: none; position: static; height: auto; max-height: 75vh; max-height: 75dvh; border-right: 0; border-bottom: 1px solid var(--az-line); padding: 22px; }
#az-memorial.az-phone.az-menu-open .az-sidebar { display: flex; }
#az-memorial.az-phone .az-name { display: none; }
#az-memorial.az-phone .az-main { padding: 30px 22px 38px; }
#az-memorial.az-phone h1 { font-size: 34px; }
#az-memorial.az-phone .az-eyebrow { font-size: 11px; margin-bottom: 12px; }
#az-memorial.az-phone .az-subtitle { font-size: 15px; margin-top: 13px; }
#az-memorial.az-phone .az-eulogy { margin-top: 31px; }
#az-memorial.az-phone h2 { font-size: 23px; }
#az-memorial.az-phone .az-placeholder-copy { font-size: 16px; }
#az-memorial.az-phone .az-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 58px 35px; }
#az-memorial.az-phone .az-poem-tile { min-height: 206px; }
#az-memorial.az-phone .az-tile-title { font-size: 21px; }
#az-memorial.az-phone .az-tile-title-ru { font-size: 18px; }
@media(max-width: 650px) {
#az-memorial:not(.az-phone) .az-sidebar { padding: 30px 17px; }
#az-memorial:not(.az-phone) .az-main { padding: 30px 22px; }
#az-memorial:not(.az-phone) .az-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width: 768px) {
#az-memorial:not(.az-phone) .az-sidebar-rail { display: none; position: static; height: auto; }
#az-memorial:not(.az-phone).az-menu-open .az-sidebar-rail { display: block; }
#az-memorial .az-sidebar-resize { display: none; }
#az-memorial .az-tile-title { font-size: 21px; }
#az-memorial .az-tile-title-ru { font-size: 18px; }
#az-memorial:not(.az-phone) .az-layout { display: block; }
#az-memorial:not(.az-phone) .az-sidebar { display: none; position: static; height: auto; max-height: 75vh; max-height: 75dvh; }
#az-memorial:not(.az-phone).az-menu-open .az-sidebar { display: flex; }
#az-memorial:not(.az-phone) .az-mobile-header { display: flex; position: relative; top: auto; right: auto; width: 100%; gap: 12px; justify-content: space-between; align-items: center; padding: 16px 21px; border-bottom: 1px solid var(--az-line); }
#az-memorial:not(.az-phone) .az-mobile-name { display: block; min-width: 0; flex: 1 1 auto; font-family: var(--az-reading-font); font-size: 20px; padding: 0; }
#az-memorial:not(.az-phone) .az-menu { display: flex; align-items: center; gap: 8px; font-size: 11px; }
#az-memorial:not(.az-phone) .az-menu svg { width: 15px; height: 15px; }
}
@media (max-width: 380px) {
#az-memorial:not(.az-phone) .az-mobile-header { flex-wrap: wrap; }
#az-memorial:not(.az-phone) .az-mobile-name { flex-basis: 100%; }
#az-memorial .az-header-actions { width: 100%; margin-left: auto; justify-content: flex-end; }
}
@media(max-width: 350px) {
#az-memorial .az-grid, #az-memorial.az-phone .az-grid { grid-template-columns: minmax(0,1fr); }
#az-memorial.az-phone h1 { font-size: 29px; }
#az-memorial .az-poem-tile { min-height: 130px; }
}
@media(pointer:coarse) {
#az-memorial .az-pages a, #az-memorial .az-collection-heading, #az-memorial .az-poem-links a, #az-memorial .az-menu, #az-memorial .az-read-all, #az-memorial .az-expand, #az-memorial .az-back { min-height: 44px; }
#az-memorial .az-icon-button { width: 44px; height: 44px; }
#az-memorial .az-tools-trigger { width: 44px; height: 44px; }
#az-memorial .az-sidebar-resize { width: 44px; right: -22px; }
#az-memorial .az-sidebar-resize::after { left: 21px; }
}
@container (max-width: 720px) {
#az-memorial .az-main .az-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@container (max-width: 340px) {
#az-memorial .az-main .az-grid { grid-template-columns: minmax(0,1fr); }
}
/* Ordinary links replace the legacy preview's routing buttons. */
#az-memorial a { font-family: inherit; color: inherit; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
#az-memorial a:focus-visible { outline: 2px solid var(--az-ink); outline-offset: 5px; }
#az-memorial .az-read-all, #az-memorial .az-back { display: inline-block; }
#az-memorial .az-poem-language, #az-memorial .az-adjacent-link { text-decoration: none; }
#az-memorial .az-nojs-collection { display: none; font-size: 12px; }
#az-memorial.az-enhanced .az-nojs-collection { display: none; }
@media (max-width: 768px) {
#az-memorial:not(.az-enhanced) .az-nojs-collection { display: block; }
}
/* Poem sharing is a small progressive enhancement below the complete text. */
#az-memorial .az-sharing { margin-top: 40px; }
#az-memorial .az-share-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
#az-memorial .az-share-button { padding: 8px 12px; border: 1px solid var(--az-line); border-radius: 6px; }
#az-memorial .az-share-button:hover { background: var(--az-photo); }
#az-memorial.az-enhanced .az-share-permalink { display: none; }
#az-memorial .az-share-status { margin-top: 0; color: var(--az-muted); font-size: 12px; line-height: 1.6; }
#az-memorial .az-share-status:not(:empty) { margin-top: 12px; }
#az-memorial .az-share-manual { margin-top: 14px; }
#az-memorial .az-share-manual label { display: block; margin-bottom: 8px; color: var(--az-muted); }
#az-memorial .az-share-manual input { display: block; width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid var(--az-line); border-radius: 6px; background: var(--az-paper); color: var(--az-ink); font: inherit; }
@media (pointer: coarse) {
#az-memorial .az-share-button { min-height: 44px; }
#az-memorial .az-share-manual input { font-size: 16px; }
}
/* All Poems progressively switches the existing grid and a complete static stream. */
#az-memorial .az-view-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
#az-memorial .az-view-tabs a { display: block; padding: 9px 12px; border: 1px solid var(--az-line); border-radius: 6px; }
#az-memorial .az-view-tabs [aria-selected="true"] { background: var(--az-selected-background); color: var(--az-selected-text); }
#az-memorial .az-view-tabs [aria-selected="true"] .az-action-ru { opacity: 1; }
#az-memorial .az-collection-panel { scroll-margin-top: 24px; }
#az-memorial .az-view-heading { margin-top: 32px; }
#az-memorial.az-enhanced .az-view-heading { display: none; }
#az-memorial .az-reading-stream { width: 100%; max-width: 680px; margin: 36px auto 0; }
#az-memorial .az-stream-poem { scroll-margin-top: 24px; }
#az-memorial .az-stream-poem + .az-stream-poem { border-top: 10px solid var(--az-selected-background); margin-top: 64px; padding-top: 56px; }
#az-memorial .az-stream-poem .az-translation-heading { margin: 0; }
@media (pointer: coarse) {
#az-memorial .az-view-tabs a { min-height: 44px; }
}
#az-memorial .az-collection-actions { display: flex; align-items: stretch; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
#az-memorial .az-collection-actions .az-view-tabs { margin-top: 0; }
#az-memorial .az-book-open { padding: 9px 12px; border: 1px solid var(--az-line); border-radius: 6px; }
#az-memorial .az-book-open:hover { background: var(--az-photo); }
@media (pointer: coarse) { #az-memorial .az-book-open { min-height: 44px; } }
/*
* Editorial memorial concept
* A restrained visual layer over the complete static-site functionality.
*/
html { background: light-dark(#f1eee7, #171715); }
#az-memorial {
--az-paper: light-dark(#f6f3ec, #1b1b18);
--az-paper-raised: light-dark(#fbf9f4, #22221e);
--az-ink: light-dark(#1b1b19, #f0ede5);
--az-muted: light-dark(#69675f, #aaa69b);
--az-line: light-dark(#d6d0c4, #3d3b34);
--az-photo: light-dark(#e9e3d8, #302f29);
--az-skeleton: light-dark(#e5dfd3, #34332d);
--az-accent: light-dark(#75382f, #d09386);
--az-accent-soft: light-dark(#eee2dc, #3b2926);
--az-selected-background: light-dark(#1b1b19, #f0ede5);
--az-selected-text: light-dark(#f8f5ee, #181816);
--az-reading-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
--az-sidebar-width: clamp(300px, 24vw, 370px);
background:
linear-gradient(90deg, color-mix(in srgb, var(--az-paper) 96%, var(--az-accent)) 0, var(--az-paper) 38%, var(--az-paper) 100%);
background-color: var(--az-paper);
font-size: 15px;
line-height: 1.55;
letter-spacing: .002em;
}
#az-memorial[data-reading-font="serif"] {
--az-reading-font: Georgia, "Times New Roman", serif;
}
#az-memorial::before {
content: "";
position: fixed;
inset: 0 0 auto var(--az-sidebar-width);
height: 3px;
background: var(--az-accent);
z-index: 12;
pointer-events: none;
}
.az-skip-link {
position: fixed;
top: 10px;
left: 10px;
z-index: 100;
padding: 10px 14px;
color: #fff;
background: #1b1b19;
transform: translateY(-150%);
transition: transform .18s ease;
}
.az-skip-link:focus { transform: translateY(0); }
#az-memorial a,
#az-memorial .az-name,
#az-memorial .az-mobile-name,
#az-memorial .az-pages a,
#az-memorial .az-collection-heading,
#az-memorial .az-poem-links a,
#az-memorial .az-see-all,
#az-memorial .az-read-all,
#az-memorial .az-back,
#az-memorial .az-expand {
text-decoration-color: color-mix(in srgb, currentColor 58%, transparent);
text-underline-offset: .24em;
transition: color .18s ease, text-decoration-color .18s ease, background-color .18s ease, transform .18s ease;
}
#az-memorial a:hover { text-decoration-color: currentColor; }
#az-memorial .az-layout { min-height: 100vh; }
#az-memorial .az-sidebar-rail {
background: var(--az-paper-raised);
box-shadow: 1px 0 0 var(--az-line);
}
#az-memorial .az-sidebar {
padding: 34px 28px 30px;
border-right: 0;
scrollbar-color: var(--az-line) transparent;
}
#az-memorial .az-name {
max-width: 280px;
margin-bottom: 24px;
font-size: clamp(22px, 2vw, 27px);
font-weight: 650;
line-height: 1.12;
letter-spacing: -.045em;
text-decoration: none;
}
#az-memorial .az-name .az-full-name-ru {
margin-top: 10px;
font-size: .58em;
font-weight: 500;
line-height: 1.35;
letter-spacing: -.01em;
color: var(--az-muted);
}
#az-memorial .az-nav-photo {
width: 100%;
max-width: 180px;
aspect-ratio: 1;
margin-bottom: 13px;
border: 1px solid var(--az-line);
object-position: 50% 42%;
filter: saturate(.82) contrast(1.02);
}
#az-memorial .az-nav-dates {
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 30px;
font-variant-numeric: tabular-nums;
letter-spacing: .055em;
}
#az-memorial .az-pages {
margin: 0 0 26px;
padding: 18px 0 20px;
border-top: 1px solid var(--az-line);
border-bottom: 1px solid var(--az-line);
}
#az-memorial .az-pages a,
#az-memorial .az-collection-heading {
margin-inline: -10px;
padding: 9px 10px;
border-radius: 2px;
text-decoration: none;
}
#az-memorial .az-pages a[aria-current="page"],
#az-memorial .az-collection-heading[aria-current="page"] {
box-shadow: inset 3px 0 0 var(--az-accent);
}
#az-memorial .az-collection-heading {
margin-bottom: 10px;
}
#az-memorial .az-poem-links { gap: 0; }
#az-memorial .az-nav-poem {
position: relative;
padding: 13px 10px 14px 22px;
margin-inline: -10px;
border-radius: 2px;
border-top: 1px solid var(--az-line);
}
#az-memorial .az-nav-poem::before {
position: absolute;
top: 20px;
left: 10px;
width: 4px;
height: 4px;
margin: 0;
border-radius: 50%;
background: var(--az-accent);
opacity: .75;
}
#az-memorial .az-nav-poem[aria-current="page"] {
box-shadow: inset 3px 0 0 var(--az-accent);
}
#az-memorial .az-poem-links a {
font-size: 13px;
line-height: 1.35;
text-decoration: none;
}
#az-memorial .az-nav-title-ru {
margin-top: 5px;
font-size: 12px;
font-weight: 400;
line-height: 1.4;
color: var(--az-muted);
}
#az-memorial .az-nav-poem[aria-current="page"] .az-nav-title-ru { color: inherit; }
#az-memorial .az-nav-more,
#az-memorial .az-share-button,
#az-memorial .az-view-tabs a,
#az-memorial .az-book-open,
#az-memorial .az-tools-trigger {
border-radius: 2px;
}
#az-memorial .az-nav-more {
padding: 12px;
border-color: var(--az-ink);
}
#az-memorial .az-see-all {
padding: 14px 0 5px;
text-align: left;
color: var(--az-accent);
}
#az-memorial .az-domain {
padding-top: 16px;
border-top: 1px solid var(--az-line);
letter-spacing: .08em;
}
#az-memorial .az-sidebar-resize::after {
width: 1px;
background: var(--az-accent);
}
#az-memorial .az-main {
padding: clamp(58px, 7vw, 100px) clamp(30px, 6vw, 96px) 72px;
}
#az-memorial .az-home {
display: grid;
grid-template-columns: minmax(0, 1.3fr) minmax(280px, 430px);
grid-template-areas:
"intro portrait"
"action portrait";
column-gap: clamp(50px, 8vw, 120px);
row-gap: 32px;
max-width: 1180px;
min-height: calc(100vh - 180px);
align-content: center;
}
#az-memorial .az-intro { grid-area: intro; align-self: end; }
#az-memorial .az-intro-copy { max-width: 720px; }
#az-memorial .az-eyebrow {
display: flex;
align-items: center;
gap: 13px;
margin-bottom: 24px;
color: var(--az-accent);
font-size: 10px;
font-weight: 700;
letter-spacing: .18em;
}
#az-memorial .az-eyebrow::before {
content: "";
width: 32px;
height: 1px;
background: currentColor;
}
#az-memorial h1 {
max-width: 980px;
font-size: clamp(42px, 5.7vw, 78px);
font-weight: 560;
line-height: .98;
letter-spacing: -.06em;
overflow-wrap: normal;
}
#az-memorial h1 .az-full-name-en { max-width: 12ch; }
#az-memorial h1 .az-full-name-ru {
max-width: 22ch;
margin-top: 22px;
font-size: .43em;
line-height: 1.15;
font-weight: 450;
letter-spacing: -.035em;
color: var(--az-muted);
}
#az-memorial .az-life-dates {
margin-top: 32px;
max-width: none;
font-size: 12px;
letter-spacing: .11em;
font-variant-numeric: tabular-nums;
}
#az-memorial .az-subtitle {
max-width: 490px;
margin-top: 28px;
padding-top: 26px;
border-top: 1px solid var(--az-line);
color: var(--az-ink);
font-size: clamp(19px, 2vw, 25px);
line-height: 1.45;
letter-spacing: -.018em;
}
#az-memorial .az-home-portrait {
grid-area: portrait;
align-self: center;
width: 100%;
max-width: none;
margin: 0;
aspect-ratio: 4 / 5;
object-fit: cover;
object-position: 50% 42%;
border: 1px solid var(--az-line);
box-shadow: 22px 22px 0 var(--az-accent-soft);
filter: saturate(.86) contrast(1.02);
}
#az-memorial .az-read-all {
grid-area: action;
justify-self: start;
align-self: start;
margin: 0;
padding: 11px 0 7px;
border-bottom: 1px solid var(--az-accent);
color: var(--az-accent);
text-decoration: none;
}
#az-memorial .az-read-all:hover { transform: translateX(4px); }
#az-memorial .az-all { max-width: 1140px; margin-inline: auto; }
#az-memorial .az-collection-intro {
display: grid;
grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr);
gap: 32px 70px;
padding-bottom: 40px;
border-bottom: 1px solid var(--az-line);
}
#az-memorial .az-collection-intro .az-eyebrow { grid-column: 1 / -1; margin-bottom: 0; }
#az-memorial .az-collection-intro h1 { font-size: clamp(48px, 7vw, 84px); }
#az-memorial .az-collection-intro h1 span {
display: block;
margin-top: 12px;
color: var(--az-muted);
font-size: .46em;
font-weight: 450;
letter-spacing: -.035em;
}
#az-memorial .az-collection-summary {
align-self: end;
color: var(--az-muted);
font-size: 15px;
line-height: 1.65;
}
#az-memorial .az-collection-summary span { display: block; margin-top: 12px; }
#az-memorial .az-collection-actions {
justify-content: space-between;
gap: 14px;
margin-top: 30px;
padding-bottom: 30px;
border-bottom: 1px solid var(--az-line);
}
#az-memorial .az-view-tabs { gap: 0; }
#az-memorial .az-view-tabs a,
#az-memorial .az-book-open {
padding: 10px 14px;
border-color: var(--az-line);
text-decoration: none;
}
#az-memorial .az-view-tabs a + a { margin-left: -1px; }
#az-memorial .az-book-open { border-color: var(--az-ink); }
#az-memorial .az-all-grid {
counter-reset: poem-card;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0 64px;
margin-top: 0;
}
#az-memorial .az-poem-tile {
counter-increment: poem-card;
position: relative;
min-height: 0;
padding: 31px 0 34px 50px;
border-top: 1px solid var(--az-line);
}
#az-memorial .az-poem-tile:nth-child(-n+2) { border-top: 0; }
#az-memorial .az-poem-tile::before {
content: counter(poem-card, decimal-leading-zero);
position: absolute;
top: 34px;
left: 0;
color: var(--az-accent);
font-size: 10px;
font-weight: 700;
letter-spacing: .08em;
font-variant-numeric: tabular-nums;
}
#az-memorial .az-poem-language { transition: transform .18s ease; }
#az-memorial .az-poem-language:hover { transform: translateX(4px); }
#az-memorial .az-tile-title {
font-size: clamp(22px, 2.35vw, 30px);
line-height: 1.14;
letter-spacing: -.035em;
}
#az-memorial .az-tile-title-ru {
margin-top: 20px;
color: var(--az-accent);
font-size: 17px;
line-height: 1.35;
font-weight: 560;
}
#az-memorial .az-tile-description,
#az-memorial .az-tile-description-ru {
max-width: 44ch;
margin-top: 10px;
font-size: 12px;
line-height: 1.6;
}
#az-memorial .az-reading,
#az-memorial .az-reading-stream {
max-width: 760px;
}
#az-memorial .az-reading:not([hidden]) ~ .az-translation-note,
#az-memorial .az-reading-stream:not([hidden]) ~ .az-translation-note { max-width: 760px; }
#az-memorial .az-reading-title {
max-width: 14ch;
font-size: clamp(40px, 5vw, 64px);
line-height: 1.02;
letter-spacing: -.055em;
}
#az-memorial .az-reading-meta {
display: flex;
flex-wrap: wrap;
gap: 7px;
margin-top: 24px;
padding-bottom: 25px;
border-bottom: 1px solid var(--az-line);
font-size: 11px;
letter-spacing: .08em;
text-transform: uppercase;
}
#az-memorial .az-reading-text,
#az-memorial .az-translation-text {
margin-top: 35px !important;
font-size: clamp(18px, 1.65vw, 21px);
line-height: 1.86;
}
#az-memorial :is(.az-russian-version, .az-english-version) {
position: relative;
margin-top: 78px;
padding: 44px 0 0 34px;
border-top: 1px solid var(--az-line);
border-left: 3px solid var(--az-accent);
}
#az-memorial .az-translation-label {
color: var(--az-accent);
font-size: 10px;
font-weight: 700;
letter-spacing: .1em;
text-transform: uppercase;
}
#az-memorial .az-translation-heading {
max-width: 17ch;
font-size: clamp(30px, 3.5vw, 43px);
line-height: 1.12;
letter-spacing: -.04em;
}
#az-memorial .az-sharing {
margin-top: 60px;
padding: 22px 0;
border-top: 1px solid var(--az-line);
border-bottom: 1px solid var(--az-line);
}
#az-memorial .az-share-button { border-color: var(--az-ink); }
#az-memorial .az-adjacent-poems {
gap: 60px;
margin-top: 56px;
padding-top: 0;
border-top: 0;
}
#az-memorial .az-adjacent-link {
padding-top: 18px;
border-top: 3px solid var(--az-ink);
}
#az-memorial .az-adjacent-link:hover { transform: translateY(-3px); }
#az-memorial .az-adjacent-action {
color: var(--az-accent);
font-size: 11px;
}
#az-memorial .az-adjacent-title { font-size: 20px; line-height: 1.25; }
#az-memorial .az-back { margin-top: 56px; color: var(--az-accent); }
#az-memorial .az-reading-stream { margin-top: 50px; }
#az-memorial .az-stream-poem + .az-stream-poem {
margin-top: 88px;
padding-top: 74px;
border-top: 3px solid var(--az-ink);
}
#az-memorial .az-stream-poem .az-reading-title { font-size: clamp(36px, 4.4vw, 55px); }
#az-memorial .az-stream-poem :is(.az-russian-version, .az-english-version) { margin-top: 58px; }
#az-memorial .az-translation-note {
margin-top: 52px;
padding-top: 24px;
border-top: 1px solid var(--az-line);
}
#az-memorial .az-reader-panel {
border-radius: 2px;
box-shadow: 0 14px 34px light-dark(#46392a22, #00000055);
}
@media (max-width: 1080px) {
#az-memorial .az-main { padding-inline: clamp(30px, 4.5vw, 58px); }
#az-memorial .az-home { column-gap: 52px; }
#az-memorial .az-all-grid { gap: 0 42px; }
}
@media (max-width: 900px) {
#az-memorial .az-home {
grid-template-columns: minmax(0, 1.15fr) minmax(240px, .85fr);
column-gap: 40px;
}
#az-memorial .az-home-portrait { box-shadow: 14px 14px 0 var(--az-accent-soft); }
}
@media (max-width: 768px) {
#az-memorial::before { inset: 0 0 auto 0; }
#az-memorial:not(.az-phone) .az-mobile-header,
#az-memorial.az-phone .az-mobile-header {
position: sticky;
top: 0;
z-index: 25;
padding: 13px 18px;
background: color-mix(in srgb, var(--az-paper-raised) 94%, transparent);
border-top: 3px solid var(--az-accent);
backdrop-filter: blur(12px);
}
#az-memorial:not(.az-phone) .az-mobile-name,
#az-memorial.az-phone .az-mobile-name {
max-width: 255px;
font-size: 16px;
font-weight: 650;
line-height: 1.15;
text-decoration: none;
}
#az-memorial .az-mobile-name .az-full-name-ru { margin-top: 4px; font-size: .64em; color: var(--az-muted); }
#az-memorial:not(.az-phone) .az-sidebar,
#az-memorial.az-phone .az-sidebar {
max-height: calc(100dvh - 78px);
padding: 24px 22px;
background: var(--az-paper-raised);
}
#az-memorial:not(.az-phone) .az-main,
#az-memorial.az-phone .az-main { padding: 42px 22px 54px; }
#az-memorial .az-home {
display: grid;
grid-template-columns: 1fr;
grid-template-areas: "intro" "portrait" "action";
gap: 34px;
min-height: 0;
}
#az-memorial h1 { font-size: clamp(42px, 12vw, 62px); }
#az-memorial .az-home-portrait {
width: min(100%, 480px);
aspect-ratio: 1;
justify-self: start;
}
#az-memorial .az-collection-intro { grid-template-columns: 1fr; gap: 24px; padding-bottom: 32px; }
#az-memorial .az-collection-summary { max-width: 46ch; }
#az-memorial .az-main .az-all-grid { grid-template-columns: 1fr; }
#az-memorial .az-poem-tile:nth-child(2) { border-top: 1px solid var(--az-line); }
#az-memorial .az-poem-tile { padding-left: 42px; }
#az-memorial .az-tile-title { font-size: 25px; }
#az-memorial .az-reading-title { font-size: clamp(39px, 12vw, 56px); }
#az-memorial :is(.az-russian-version, .az-english-version) { margin-top: 62px; padding-left: 22px; }
#az-memorial .az-adjacent-poems { grid-template-columns: 1fr; gap: 42px; }
#az-memorial .az-next-poem { grid-column: 1; text-align: left; }
}
@media (max-width: 520px) {
#az-memorial .az-header-actions { gap: 6px; }
#az-memorial .az-tools-trigger { width: 34px; height: 34px; }
#az-memorial .az-menu .az-action-copy { display: none; }
#az-memorial .az-collection-actions { align-items: stretch; }
#az-memorial .az-view-tabs { width: 100%; }
#az-memorial .az-view-tabs a { flex: 1 1 50%; }
#az-memorial .az-book-open { width: 100%; text-align: center; }
#az-memorial .az-home-portrait { box-shadow: 10px 10px 0 var(--az-accent-soft); }
#az-memorial .az-reading-text,
#az-memorial .az-translation-text { font-size: 18px; line-height: 1.78; }
}
/* Adapt to the space remaining after the resizable sidebar. */
@container (max-width: 760px) {
#az-memorial .az-home {
grid-template-columns: minmax(0, 1fr);
grid-template-areas: "intro" "portrait" "action";
gap: 34px;
min-height: 0;
}
#az-memorial .az-home-portrait {
width: min(100%, 480px);
aspect-ratio: 1;
justify-self: start;
}
}
@container (max-width: 650px) {
#az-memorial .az-collection-intro {
grid-template-columns: minmax(0, 1fr);
gap: 24px;
}
}
@container (max-width: 600px) {
#az-memorial .az-main .az-all-grid { grid-template-columns: minmax(0, 1fr); }
#az-memorial .az-poem-tile:nth-child(2) { border-top: 1px solid var(--az-line); }
}
@media (prefers-reduced-motion: reduce) {
#az-memorial *, .az-skip-link { scroll-behavior: auto !important; transition: none !important; }
}