/* Adams's Synchronological Chart (1881): paper, ink and a little vermilion. */
/* Local serifs scaled to the real faces' widths and line metrics, so the swap to them moves nothing. */
/* fonts.py: fallbacks */
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 80.00%; ascent-override: 125.87%; descent-override: 37.25%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 96.00%; ascent-override: 104.90%; descent-override: 31.04%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 98.84%; ascent-override: 101.88%; descent-override: 30.15%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 95.62%; ascent-override: 105.31%; descent-override: 31.17%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 76.92%; ascent-override: 130.91%; descent-override: 38.74%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 85.87%; ascent-override: 117.27%; descent-override: 34.70%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 98.03%; ascent-override: 102.72%; descent-override: 30.40%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 79.05%; ascent-override: 127.40%; descent-override: 37.70%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 62.92%; ascent-override: 160.05%; descent-override: 47.36%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 75.44%; ascent-override: 133.48%; descent-override: 39.50%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 87.41%; ascent-override: 115.21%; descent-override: 34.09%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 74.76%; ascent-override: 134.70%; descent-override: 39.86%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 700; src: local('Times New Roman Bold'), local('TimesNewRomanPS-BoldMT'), local('Liberation Serif Bold'), local('LiberationSerif-Bold'), local('Tinos Bold'), local('Tinos-Bold'); size-adjust: 94.80%; ascent-override: 106.22%; descent-override: 31.43%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 700; src: local('Times New Roman Bold'), local('TimesNewRomanPS-BoldMT'), local('Liberation Serif Bold'), local('LiberationSerif-Bold'), local('Tinos Bold'), local('Tinos-Bold'); size-adjust: 105.80%; ascent-override: 95.18%; descent-override: 28.17%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 700; src: local('Times New Roman Bold'), local('TimesNewRomanPS-BoldMT'), local('Liberation Serif Bold'), local('LiberationSerif-Bold'), local('Tinos Bold'), local('Tinos-Bold'); size-adjust: 96.91%; ascent-override: 103.91%; descent-override: 30.75%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond Times'; font-style: normal; font-weight: 700; src: local('Times New Roman Bold'), local('TimesNewRomanPS-BoldMT'), local('Liberation Serif Bold'), local('LiberationSerif-Bold'), local('Tinos Bold'), local('Tinos-Bold'); size-adjust: 97.76%; ascent-override: 103.00%; descent-override: 30.48%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 700; src: local('Noto Serif Bold'), local('NotoSerif-Bold'), local('Droid Serif Bold'), local('DroidSerif-Bold'); size-adjust: 91.15%; ascent-override: 110.47%; descent-override: 32.69%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 700; src: local('Noto Serif Bold'), local('NotoSerif-Bold'), local('Droid Serif Bold'), local('DroidSerif-Bold'); size-adjust: 93.63%; ascent-override: 107.55%; descent-override: 31.83%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 700; src: local('Noto Serif Bold'), local('NotoSerif-Bold'), local('Droid Serif Bold'), local('DroidSerif-Bold'); size-adjust: 96.41%; ascent-override: 104.45%; descent-override: 30.91%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond Noto'; font-style: normal; font-weight: 700; src: local('Noto Serif Bold'), local('NotoSerif-Bold'), local('Droid Serif Bold'), local('DroidSerif-Bold'); size-adjust: 81.11%; ascent-override: 124.15%; descent-override: 36.74%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 700; src: local('DejaVu Serif Bold'), local('DejaVuSerif-Bold'); size-adjust: 68.08%; ascent-override: 147.92%; descent-override: 43.78%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 700; src: local('DejaVu Serif Bold'), local('DejaVuSerif-Bold'); size-adjust: 76.03%; ascent-override: 132.45%; descent-override: 39.20%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 700; src: local('DejaVu Serif Bold'), local('DejaVuSerif-Bold'); size-adjust: 83.60%; ascent-override: 120.45%; descent-override: 35.65%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: normal; font-weight: 700; src: local('DejaVu Serif Bold'), local('DejaVuSerif-Bold'); size-adjust: 74.24%; ascent-override: 135.65%; descent-override: 40.14%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 80.00%; ascent-override: 125.87%; descent-override: 37.25%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 96.00%; ascent-override: 104.90%; descent-override: 31.04%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 100.13%; ascent-override: 100.57%; descent-override: 29.76%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 92.60%; ascent-override: 108.75%; descent-override: 32.18%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 76.92%; ascent-override: 130.91%; descent-override: 38.74%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 85.87%; ascent-override: 117.27%; descent-override: 34.70%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 92.94%; ascent-override: 108.35%; descent-override: 32.06%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 79.47%; ascent-override: 126.72%; descent-override: 37.50%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 62.92%; ascent-override: 160.05%; descent-override: 47.36%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 75.44%; ascent-override: 133.48%; descent-override: 39.50%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 87.00%; ascent-override: 115.75%; descent-override: 34.25%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'EB Garamond DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 72.68%; ascent-override: 138.56%; descent-override: 41.00%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-9F, U+A1-10FFFF; }
@font-face { font-family: 'IM Fell English Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 87.30%; ascent-override: 103.69%; descent-override: 41.61%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 85.74%; ascent-override: 105.58%; descent-override: 42.37%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 108.33%; ascent-override: 83.57%; descent-override: 33.54%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 103.51%; ascent-override: 87.46%; descent-override: 35.10%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17F, U+192, U+218-21B, U+2C6-2C7, U+2C9, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E004, U+E006, U+E008-E00B, U+E01C, U+E02E, U+E040-E041, U+E047, U+E054, U+FB00-FB05; }
@font-face { font-family: 'IM Fell English Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 83.95%; ascent-override: 107.84%; descent-override: 43.28%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 76.69%; ascent-override: 118.04%; descent-override: 47.37%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 107.55%; ascent-override: 84.17%; descent-override: 33.78%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 86.06%; ascent-override: 105.19%; descent-override: 42.21%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17F, U+192, U+218-21B, U+2C6-2C7, U+2C9, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E004, U+E006, U+E008-E00B, U+E01C, U+E02E, U+E040-E041, U+E047, U+E054, U+FB00-FB05; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 68.66%; ascent-override: 131.84%; descent-override: 52.91%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 67.38%; ascent-override: 134.35%; descent-override: 53.91%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 95.78%; ascent-override: 94.52%; descent-override: 37.93%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 81.01%; ascent-override: 111.75%; descent-override: 44.84%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17F, U+192, U+218-21B, U+2C6-2C7, U+2C9, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E004, U+E006, U+E008-E00B, U+E01C, U+E02E, U+E040-E041, U+E047, U+E054, U+FB00-FB05; }
@font-face { font-family: 'IM Fell English Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 84.18%; ascent-override: 107.54%; descent-override: 43.16%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 82.94%; ascent-override: 109.15%; descent-override: 43.80%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 100.84%; ascent-override: 89.77%; descent-override: 36.03%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English Times'; font-style: italic; font-weight: 400; src: local('Times New Roman Italic'), local('TimesNewRomanPS-ItalicMT'), local('Liberation Serif Italic'), local('LiberationSerif-Italic'), local('Tinos Italic'), local('Tinos-Italic'); size-adjust: 85.32%; ascent-override: 106.11%; descent-override: 42.58%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+133, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17F, U+192, U+218-21B, U+2C6-2C7, U+2C9, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E004-E00B, U+E01B-E01C, U+E01F-E020, U+E022, U+E024, U+E026, U+E028, U+E02E, U+E040-E041, U+E047, U+E054, U+FB00-FB05; }
@font-face { font-family: 'IM Fell English Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 80.94%; ascent-override: 111.84%; descent-override: 44.88%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 74.19%; ascent-override: 122.03%; descent-override: 48.97%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 96.19%; ascent-override: 94.11%; descent-override: 37.77%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English Noto'; font-style: italic; font-weight: 400; src: local('Noto Serif Italic'), local('NotoSerif-Italic'), local('Droid Serif Italic'), local('DroidSerif-Italic'); size-adjust: 74.01%; ascent-override: 122.32%; descent-override: 49.09%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+133, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17F, U+192, U+218-21B, U+2C6-2C7, U+2C9, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E004-E00B, U+E01B-E01C, U+E01F-E020, U+E022, U+E024, U+E026, U+E028, U+E02E, U+E040-E041, U+E047, U+E054, U+FB00-FB05; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 66.21%; ascent-override: 136.74%; descent-override: 54.87%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 65.18%; ascent-override: 138.89%; descent-override: 55.74%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 85.33%; ascent-override: 106.09%; descent-override: 42.58%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English DejaVu'; font-style: italic; font-weight: 400; src: local('DejaVu Serif Italic'), local('DejaVuSerif-Italic'); size-adjust: 67.74%; ascent-override: 133.64%; descent-override: 53.63%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+133, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17F, U+192, U+218-21B, U+2C6-2C7, U+2C9, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E004-E00B, U+E01B-E01C, U+E01F-E020, U+E022, U+E024, U+E026, U+E028, U+E02E, U+E040-E041, U+E047, U+E054, U+FB00-FB05; }
@font-face { font-family: 'IM Fell English SC Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 85.74%; ascent-override: 105.58%; descent-override: 42.37%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English SC Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 85.81%; ascent-override: 105.50%; descent-override: 42.34%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English SC Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 104.49%; ascent-override: 86.63%; descent-override: 34.77%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English SC Times'; font-style: normal; font-weight: 400; src: local('Times New Roman'), local('TimesNewRomanPSMT'), local('Liberation Serif'), local('LiberationSerif'), local('Tinos'), local('Tinos-Regular'); size-adjust: 110.07%; ascent-override: 82.24%; descent-override: 33.00%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17E, U+192, U+218-21B, U+2C6-2C7, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E01C, U+E02E, U+E040-E041, U+E047, U+E052-E054; }
@font-face { font-family: 'IM Fell English SC Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 82.44%; ascent-override: 109.80%; descent-override: 44.06%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English SC Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 76.75%; ascent-override: 117.95%; descent-override: 47.33%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English SC Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 107.17%; ascent-override: 84.47%; descent-override: 33.90%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English SC Noto'; font-style: normal; font-weight: 400; src: local('Noto Serif'), local('NotoSerif-Regular'), local('NotoSerif'), local('Droid Serif'), local('DroidSerif'); size-adjust: 90.70%; ascent-override: 99.81%; descent-override: 40.05%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17E, U+192, U+218-21B, U+2C6-2C7, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E01C, U+E02E, U+E040-E041, U+E047, U+E052-E054; }
@font-face { font-family: 'IM Fell English SC DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 67.43%; ascent-override: 134.24%; descent-override: 53.87%; line-gap-override: 0.00%; unicode-range: U+20, U+A0; }
@font-face { font-family: 'IM Fell English SC DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 67.43%; ascent-override: 134.25%; descent-override: 53.87%; line-gap-override: 0.00%; unicode-range: U+30-39; }
@font-face { font-family: 'IM Fell English SC DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 92.93%; ascent-override: 97.41%; descent-override: 39.09%; line-gap-override: 0.00%; unicode-range: U+41-5A; }
@font-face { font-family: 'IM Fell English SC DejaVu'; font-style: normal; font-weight: 400; src: local('DejaVu Serif'), local('DejaVuSerif'); size-adjust: 86.06%; ascent-override: 105.20%; descent-override: 42.21%; line-gap-override: 0.00%; unicode-range: U+21-2F, U+3A-40, U+5B-7E, U+A1-107, U+10C-113, U+116-11B, U+11E-11F, U+122-123, U+12A-12B, U+12E-131, U+136-137, U+139-13E, U+141-148, U+14C-14D, U+150-15B, U+15E-165, U+16A-16B, U+16E-17E, U+192, U+218-21B, U+2C6-2C7, U+2D8-2DD, U+326, U+37E, U+3BC, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2153-2154, U+215B-215E, U+2215, U+2219, U+261C, U+261E, U+E01C, U+E02E, U+E040-E041, U+E047, U+E052-E054; }
/* fonts.py: end */
:root {
  --bg: #ece3cd;
  --bar: #f4eedf;
  --surround: #d6c9aa;
  --panel: #f8f3e7;
  --panel-2: #efe6d2;
  --ink: #261d14;
  --ink-2: #5b4a35;
  --ink-3: #85725a;
  --rule: #c2ae88;
  --rule-2: #dccdaa;
  --accent: #9b2c1c;
  --accent-ink: #fff8ee;
  --accent-soft: rgba(155, 44, 28, .1);
  --focus: #1f5f8b;
  --lit: #b3301c;
  --wash: #1f5f8b;
  --hover: rgba(38, 29, 20, .7);
  --loc-shade: rgba(38, 29, 20, .42);
  --shadow: 0 1px 2px rgba(60, 40, 15, .12), 0 8px 28px rgba(60, 40, 15, .16);
  --plate-filter: none;
  /* Until fonts/fonts.css arrives (after the first paint), a local serif sized to each face holds its place. */
  --serif: 'EB Garamond', 'EB Garamond Times', 'EB Garamond Noto', 'EB Garamond DejaVu', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
  --display: 'IM Fell English', 'IM Fell English Times', 'IM Fell English Noto', 'IM Fell English DejaVu', 'EB Garamond', 'EB Garamond Times', 'EB Garamond Noto', 'EB Garamond DejaVu', Georgia, serif;
  --caps: 'IM Fell English SC', 'IM Fell English SC Times', 'IM Fell English SC Noto', 'IM Fell English SC DejaVu', 'EB Garamond', 'EB Garamond Times', 'EB Garamond Noto', 'EB Garamond DejaVu', Georgia, serif;
  --bar-h: 56px;
  --ruler-h: 38px;
  --cover-r: 0px;
  --cover-b: 0px;
  /* The lanes, in the hand-colouring's tones */
  --l-scenes: #8e352a; --l-latin: #3c617c;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #15120e; --bar: #1c1813; --surround: #0d0b08; --panel: #1f1a14; --panel-2: #29221a;
    --ink: #efe5cf; --ink-2: #c4b394; --ink-3: #93836a; --rule: #4d4232; --rule-2: #372f24;
    --accent: #e4805f; --accent-ink: #1a120c; --accent-soft: rgba(228, 128, 95, .14); --focus: #8fc3e8;
    --hover: rgba(20, 14, 8, .8); --loc-shade: rgba(0, 0, 0, .55);
    --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 32px rgba(0, 0, 0, .5);
    --plate-filter: brightness(.84) contrast(1.04);
    --l-scenes: #d78479; --l-latin: #8aadc7;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #15120e; --bar: #1c1813; --surround: #0d0b08; --panel: #1f1a14; --panel-2: #29221a;
  --ink: #efe5cf; --ink-2: #c4b394; --ink-3: #93836a; --rule: #4d4232; --rule-2: #372f24;
  --accent: #e4805f; --accent-ink: #1a120c; --accent-soft: rgba(228, 128, 95, .14); --focus: #8fc3e8;
  --hover: rgba(20, 14, 8, .8); --loc-shade: rgba(0, 0, 0, .55);
  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 32px rgba(0, 0, 0, .5);
  --plate-filter: brightness(.84) contrast(1.04);
  --l-scenes: #d78479; --l-latin: #8aadc7;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { height: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 400 17px/1.5 var(--serif); font-variant-numeric: oldstyle-nums;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  display: grid; grid-template-rows: var(--bar-h) minmax(0, 1fr); grid-template-columns: minmax(0, 1fr); height: 100dvh; overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--accent); text-underline-offset: .15em; }
kbd { font: 500 .78em/1 var(--serif); font-variant-numeric: lining-nums; border: 1px solid var(--rule); border-bottom-width: 2px; border-radius: 4px; padding: .15em .4em; background: var(--panel); color: var(--ink-2); }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.skip { position: absolute; left: 8px; top: -60px; z-index: 50; background: var(--panel); padding: 8px 14px; border: 1px solid var(--rule); }
.skip:focus { top: 8px; }

/* ---------------------------------------------------------------- the bar */
.bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 0 max(12px, env(safe-area-inset-right)) 0 max(14px, env(safe-area-inset-left));
  background: var(--bar); border-bottom: 1px solid var(--rule); position: relative; z-index: 6;
}
.bar::after { content: ''; position: absolute; left: 0; right: 0; bottom: -4px; border-bottom: 1px solid var(--rule-2); pointer-events: none; }
.mark { display: flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; min-width: 0; flex: 1 1 auto; overflow: hidden; }
.mark-seal { width: 34px; height: 34px; flex: none; fill: none; stroke: var(--accent); stroke-width: 1.3; }
.mark-text { display: flex; flex-direction: column; line-height: 1.05; min-width: 0; }
.mark-title { font: 400 21px/1.05 var(--display); letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mark-sub { font: 400 13px/1.2 var(--caps); color: var(--ink-2); letter-spacing: .06em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mark .short { display: none; }
.tools { display: flex; align-items: center; gap: 2px; flex: none; }
.tool {
  display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 12px; border: 1px solid transparent;
  background: none; border-radius: 6px; font: 400 16px/1 var(--caps); letter-spacing: .04em; color: var(--ink);
}
.tool:hover { background: var(--accent-soft); }
.tool svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.tool-find { border-color: var(--rule); background: var(--panel); min-width: 150px; margin-right: 6px; }
.tool-find kbd { margin-left: auto; }
.tool[aria-pressed="true"] svg { fill: currentColor; }

/* ---------------------------------------------------------------- the stage and the plate */
.stage { position: relative; overflow: hidden; background: var(--surround); }
.plate { position: absolute; inset: 0; overflow: hidden; touch-action: none; cursor: grab; user-select: none; -webkit-user-select: none; outline: none; }
.plate.is-grabbing { cursor: grabbing; }
.plate.is-over { cursor: pointer; }
.pl-layers { position: absolute; inset: 0; filter: var(--plate-filter); }
.pl-layer { position: absolute; left: 0; top: 0; transform-origin: 0 0; will-change: transform; }
.pl-layer img { position: absolute; display: block; max-width: none; image-rendering: auto; }
.pl-overview img { position: static; }
.pl-tile { animation: tile-in .25s ease-out; }
.pl-fog { position: absolute; left: 0; top: 0; pointer-events: none; transform-origin: 0 0; will-change: transform; }
.is-exploring #boot-chart { filter: brightness(.06); }
.is-exploring .stage { background: #080e16; }
.explore-hud { position: absolute; z-index: 4; left: 14px; top: calc(var(--ruler-h) + 18px); width: min(340px, calc(100% - 100px - var(--cover-r))); padding: 15px 18px; color: #f1e5c9; background: #111b26; border: 1px solid #796344; border-radius: 10px; box-shadow: 0 8px 26px #0005; }
.explore-hud p { margin: 0; }
.explore-kicker { color: #d7af6e; font: 400 17px/1.3 var(--caps); letter-spacing: .04em; }
.explore-hud .explore-count { margin-top: 3px; font: 400 26px/1.3 var(--display); }
.explore-hud .explore-help { margin: 6px 0 10px; font-size: 15px; }
.explore-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 10px; border-top: 1px solid #44505a; padding-top: 8px; }
.explore-footer small { color: #c9bca2; font: 12px/1.4 system-ui, sans-serif; }
.explore-footer button { padding: 2px 0; color: #e7bd7a; border: 0; background: none; font-size: 14px; text-decoration: underline; }
.has-intro .explore-hud, .is-reading .explore-hud { display: none; }
@keyframes tile-in { from { opacity: 0; } to { opacity: 1; } }
.pl-overlay { position: absolute; left: 0; top: 0; pointer-events: none; }
.pl-reticle { position: absolute; width: 30px; height: 30px; left: calc((100% - var(--cover-r)) / 2 - 15px); top: calc(var(--ruler-h) + (100% - var(--ruler-h) - var(--cover-b)) / 2 - 15px); pointer-events: none; opacity: 0; transition: opacity .2s; }
.pl-reticle::before, .pl-reticle::after { content: ''; position: absolute; background: var(--accent); }
.pl-reticle::before { left: 14px; top: 0; width: 2px; height: 30px; }
.pl-reticle::after { top: 14px; left: 0; height: 2px; width: 30px; }
.plate:focus-visible .pl-reticle { opacity: 1; }
.plate:focus-visible { box-shadow: inset 0 0 0 3px var(--focus); }

/* The year ruler and the cartouche at the centre */
.ruler {
  position: absolute; left: 0; right: 0; top: 0; height: var(--ruler-h); z-index: 3; pointer-events: none;
  background: color-mix(in srgb, var(--bar) 92%, transparent); border-bottom: 1px solid var(--rule);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.ticks { position: absolute; inset: 0; overflow: hidden; }
.ticks i { position: absolute; left: 0; bottom: 0; width: 1px; height: 4px; background: var(--ink-3); }
.ticks i.mid { height: 8px; background: var(--ink-2); }
.ticks i.major { height: 13px; background: var(--ink); }
.ticks i span { position: absolute; bottom: 14px; left: 0; transform: translateX(-50%); white-space: nowrap; font: 400 14px/1 var(--caps); letter-spacing: .03em; color: var(--ink-2); font-variant-numeric: lining-nums; }
.cartouche { position: absolute; left: 0; top: 3px; width: 0; display: flex; flex-direction: column; align-items: center; }
.c-inner {
  display: flex; align-items: baseline; gap: 5px; white-space: nowrap; padding: 3px 16px 4px;
  background: var(--panel); border: 1px solid var(--ink-2); outline: 1px solid var(--rule); outline-offset: 2px;
  box-shadow: 0 2px 10px rgba(40, 25, 10, .18); position: relative;
}
.c-inner::after { content: ''; position: absolute; left: 50%; bottom: -9px; margin-left: -6px; border: 6px solid transparent; border-top-color: var(--ink-2); border-bottom: 0; }
.c-year { font: 400 25px/1 var(--display); font-variant-numeric: lining-nums; letter-spacing: .01em; min-width: 2.2em; text-align: right; }
.c-era { font: 400 15px/1 var(--caps); color: var(--ink-2); letter-spacing: .08em; min-width: 1.4em; }
.c-lane { margin-top: 10px; font: italic 400 15px/1.1 var(--display); color: var(--ink); white-space: nowrap; padding: 2px 9px; background: color-mix(in srgb, var(--panel) 82%, transparent); border-radius: 3px; }
.c-lane:empty { display: none; }

/* Controls, locator and credit, kept clear of the panel */
.controls { position: absolute; z-index: 4; right: calc(12px + var(--cover-r)); bottom: calc(14px + var(--cover-b)); display: flex; flex-direction: column; gap: 6px; transition: right .26s, bottom .26s; }
.ctl { width: 44px; height: 44px; display: grid; place-items: center; background: var(--panel); border: 1px solid var(--rule); border-radius: 8px; box-shadow: var(--shadow); color: var(--ink); }
.ctl:hover { border-color: var(--ink-2); }
.ctl svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ctl#z-fit { margin-top: 6px; }
.locator {
  position: absolute; z-index: 4; left: 12px; bottom: calc(34px + var(--cover-b)); width: min(520px, calc(100% - 96px - var(--cover-r)));
  aspect-ratio: 2048 / 218; border: 1px solid var(--ink-2); outline: 1px solid var(--rule); outline-offset: 2px; background: var(--panel);
  box-shadow: var(--shadow); cursor: crosshair; touch-action: none; transition: opacity .3s, bottom .26s;
}
.is-overview .locator, .has-intro .locator { opacity: 0; pointer-events: none; }
/* A vertical chart (time down the sheet): the ruler is a column at the left, the cartouche moves in Y and the
   locator is a column the sheet's shape. Adams never sets is-vertical. */
.is-vertical .stage { --ruler-w: 88px; }
.is-vertical .ruler { right: auto; bottom: 0; width: var(--ruler-w); height: auto; border-bottom: 0; border-right: 1px solid var(--rule); }
.is-vertical .ticks i { left: auto; right: 0; top: 0; bottom: auto; width: 13px; height: 1px; }
.is-vertical .ticks i span { left: auto; right: 16px; bottom: auto; top: 0; transform: translateY(-50%); }
.is-vertical .cartouche { left: 3px; top: 0; width: auto; height: 0; flex-direction: row; align-items: center; gap: 8px; }
.is-vertical .c-inner { padding: 3px 10px 4px; }
.is-vertical .c-inner::after { left: auto; right: -9px; bottom: auto; top: 50%; margin: -6px 0 0; border: 6px solid transparent; border-left-color: var(--ink-2); border-right: 0; }
.is-vertical .c-lane { margin-top: 0; }
.is-vertical .locator { left: calc(var(--ruler-w) + 12px); width: auto; height: min(300px, calc(100% - 120px - var(--cover-b))); aspect-ratio: var(--chart-aspect, 1); }
.is-broad .locator { width: auto; height: min(110px, 16vw, calc(100% - 160px - var(--cover-b))); aspect-ratio: var(--chart-aspect, 1.6); }
.credit { position: absolute; z-index: 4; left: 12px; bottom: calc(6px + var(--cover-b)); margin: 0; padding: 1px 8px; border-radius: 3px; background: color-mix(in srgb, var(--panel) 86%, transparent); font: 400 13px/1.35 var(--serif); color: var(--ink-2); transition: bottom .26s; max-width: calc(100% - 80px - var(--cover-r)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.credit button { background: none; border: 0; padding: 0; color: var(--accent); text-decoration: underline; text-underline-offset: .15em; }
.wash-note { position: absolute; z-index: 4; left: 50%; transform: translateX(-50%); top: calc(var(--ruler-h) + 62px); display: none; align-items: center; gap: 10px; padding: 5px 6px 5px 14px; background: var(--panel); border: 1px solid var(--rule); border-radius: 999px; box-shadow: var(--shadow); font-size: 15px; max-width: calc(100% - 32px - var(--cover-r)); }
.has-wash .wash-note { display: flex; }
.wash-note #wash-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wash-note button { border: 1px solid var(--rule); background: var(--panel-2); border-radius: 999px; padding: 2px 12px; font-size: 14px; }
.tip { position: absolute; z-index: 5; left: 0; top: 0; pointer-events: none; display: flex; flex-direction: column; max-width: 300px; padding: 6px 10px 7px; background: var(--panel); border: 1px solid var(--ink-2); box-shadow: var(--shadow); font-size: 15px; line-height: 1.25; }
.tip b { font: 400 17px/1.2 var(--display); }
.tip span { color: var(--ink-2); font-size: 14px; }
.toast { position: absolute; z-index: 9; left: 50%; bottom: calc(80px + var(--cover-b)); transform: translate(-50%, 8px); opacity: 0; transition: opacity .2s, transform .2s; background: var(--ink); color: var(--bg); padding: 8px 16px; border-radius: 6px; font-size: 15px; max-width: calc(100% - 32px); overflow-wrap: anywhere; }
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.failed { position: absolute; inset: auto 16px 50% 16px; text-align: center; z-index: 9; background: var(--panel); padding: 16px; border: 1px solid var(--accent); }

/* ---------------------------------------------------------------- buttons, chips, rows */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 6px 16px; border: 1px solid var(--ink-2); background: var(--panel); border-radius: 6px; font: 400 16px/1.1 var(--caps); letter-spacing: .04em; color: var(--ink); text-decoration: none; }
.btn:hover { background: var(--panel-2); }
.btn-primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.btn-primary:hover { background: color-mix(in srgb, var(--accent) 88%, var(--ink)); }
.chip-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--dot, var(--ink-3)); flex: none; }
[data-lane="scenes"] { --dot: var(--l-scenes); } [data-lane="latin"] { --dot: var(--l-latin); }
.chip { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 4px 12px; margin: 0 6px 6px 0; border: 1px solid var(--rule); background: var(--panel); border-radius: 999px; font-size: 16px; line-height: 1.2; text-align: left; }
.chip:hover { border-color: var(--ink-2); background: var(--panel-2); }
.chips { display: flex; flex-wrap: wrap; }
.rows { list-style: none; margin: 0; padding: 0; }
.row { display: grid; grid-template-columns: 6.6em 1fr; gap: 12px; width: 100%; padding: 9px 4px; border: 0; border-bottom: 1px solid var(--rule-2); background: none; text-align: left; align-items: baseline; text-decoration: none; color: var(--ink); }
.row:hover { background: var(--accent-soft); }
.row-date { font: 400 15px/1.3 var(--caps); color: var(--ink-2); letter-spacing: .02em; font-variant-numeric: lining-nums; }
.row-main { display: flex; flex-direction: column; min-width: 0; }
.row-title { font-size: 17px; line-height: 1.25; }
.row-lane { font-size: 14px; color: var(--ink-3); display: inline-flex; align-items: center; gap: 6px; }
.row .row-lane::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--dot, var(--ink-3)); }

/* ---------------------------------------------------------------- the panel */
.panel {
  position: absolute; z-index: 7; top: calc(var(--ruler-h) + 10px); right: 12px; bottom: 12px; width: clamp(330px, 33vw, 440px);
  display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--rule); border-radius: 8px; box-shadow: var(--shadow);
  transform: translateX(calc(100% + 24px)); transition: transform .26s cubic-bezier(.2, .8, .2, 1); overflow: hidden;
}
.panel.is-open { transform: none; }
.sheet-handle { display: none; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 8px 6px 20px; border-bottom: 1px solid var(--rule-2); }
.panel-kicker { font: 400 15px/1.2 var(--caps); letter-spacing: .08em; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.panel-close { width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: none; border-radius: 6px; color: var(--ink); flex: none; }
.panel-close:hover { background: var(--accent-soft); }
.panel-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.panel-body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 14px 22px 28px; scrollbar-width: thin; scrollbar-color: var(--rule) transparent; }

.eyebrow { margin: 0 0 4px; font: 400 15px/1.3 var(--caps); letter-spacing: .06em; color: var(--ink-2); }
.eyebrow .chip-dot { width: 9px; height: 9px; margin-right: 8px; vertical-align: .05em; }
.entry-title, .view-title { margin: 0 0 6px; font: 400 31px/1.08 var(--display); letter-spacing: -.003em; text-wrap: balance; outline: none; }
.year-title { font-size: 54px; font-variant-numeric: lining-nums; }
.year-title .era { font: 400 24px/1 var(--caps); color: var(--ink-2); letter-spacing: .08em; }
.view-sub { margin: 0 0 12px; color: var(--ink-2); }
.entry-date { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--rule-2); }
.date-big { font: 400 23px/1.1 var(--display); color: var(--accent); font-variant-numeric: lining-nums; }
.date-note { font-size: 14px; color: var(--ink-3); font-style: italic; }
.summary { margin: 0 0 16px; font-size: 18.5px; line-height: 1.5; }
.also { display: flex; flex-wrap: wrap; align-items: center; gap: 0; margin: -4px 0 14px; padding: 8px 10px 2px; background: var(--panel-2); border-radius: 6px; }
.also-head { font: 400 14px/1 var(--caps); letter-spacing: .06em; color: var(--ink-2); margin: 0 10px 6px 0; }
.also .chip { min-height: 32px; font-size: 15px; }
.printed { margin: 0 0 20px; padding: 16px 18px 12px; background: var(--panel-2); border: 1px solid var(--rule-2); position: relative; }
.printed::before { content: '“'; position: absolute; left: 8px; top: -14px; font: 400 58px/1 var(--display); color: var(--accent); }
.printed blockquote { margin: 0; }
.printed p { margin: 0; font: 400 18px/1.4 var(--display); letter-spacing: .015em; overflow-wrap: anywhere; }
.printed figcaption { margin-top: 8px; font: 400 14px/1 var(--caps); letter-spacing: .06em; color: var(--ink-3); text-align: right; }
.printed figcaption::before { content: '— '; }
.sec { margin: 0 0 18px; }
.sec-title { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font: 400 16px/1.2 var(--caps); letter-spacing: .08em; color: var(--ink-2); }
.sec-title::after { content: ''; flex: 1; border-top: 1px solid var(--rule-2); }
.knowledge-record { margin: 0 0 12px; padding: 14px 16px; background: var(--accent-soft); border-left: 3px solid var(--accent); border-radius: 0 6px 6px 0; }
.knowledge-title { margin: 0 0 6px; font: 400 24px/1.2 var(--display); overflow-wrap: anywhere; }
.knowledge-description { margin: 0 0 12px; color: var(--ink-2); }
.knowledge-relation { margin: 0 0 5px; font: 14px var(--caps); letter-spacing: .05em; color: var(--ink-2); }
.knowledge-facts { display: grid; grid-template-columns: minmax(0, 7em) minmax(0, 1fr); gap: 6px 12px; margin: 12px 0; font-size: 16px; line-height: 1.4; }
.knowledge-facts dt { color: var(--ink-2); }
.knowledge-facts dd { margin: 0; overflow-wrap: anywhere; }
.knowledge-source { border-top: 1px solid var(--rule); padding-top: 8px; font-size: 14px; color: var(--ink-2); overflow-wrap: anywhere; }
.knowledge-source summary { cursor: pointer; padding: 4px 0; }
.knowledge-source p { margin: 6px 0 0; }
.knowledge-facts a { color: var(--accent); text-underline-offset: 3px; }
.knowledge-open { font: 16px var(--caps); color: var(--accent); text-underline-offset: 3px; }
.knowledge-entity > .knowledge-facts { margin: 20px 0; font-size: 18px; gap: 10px 16px; }
.story { margin: 0; font-size: 18px; }
.refs { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }
.refs li { padding: 2px 10px; border: 1px solid var(--rule-2); border-radius: 4px; font-size: 16px; font-variant-numeric: lining-nums; }
.family { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; margin: 0; align-items: baseline; }
.family dt { font: italic 400 16px/2.2 var(--serif); color: var(--ink-2); }
.family dd { margin: 0; }
.hint { color: var(--ink-3); font-size: 15px; margin: 0 0 8px; }
.modern { padding: 10px 14px; border: 1px solid var(--rule-2); border-radius: 6px; margin-bottom: 8px; }
.modern p { margin: 0; }
.modern-date { font: 400 20px/1.2 var(--display); font-variant-numeric: lining-nums; }
.modern-src, .modern-lane { font: 400 14px var(--serif); color: var(--ink-3); }
.modern-title { font-weight: 500; margin: 2px 0 4px !important; }
.modern-sum { font-size: 16px; color: var(--ink-2); }
.places a { color: var(--ink); text-decoration-color: var(--rule); }
.shelf { margin: 0; padding-left: 1.1em; }
.shelf li { margin-bottom: 8px; }
.shelf-heading { display: block; font-size: 15px; color: var(--ink-2); }
.shelf-src { font-size: 14px; }
.step { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 22px 0 12px; }
.step-btn { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border: 1px solid var(--rule); border-radius: 6px; background: none; text-align: left; color: var(--ink); text-decoration: none; min-width: 0; }
.step-btn:hover { background: var(--panel-2); }
.step-btn.next { text-align: right; align-items: flex-end; }
.step-dir { font: 400 14px/1 var(--caps); letter-spacing: .05em; color: var(--ink-3); }
.step-title { font-size: 15px; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }
.tour { list-style: none; margin: 0; padding: 0; counter-reset: stop; }
.tour-stop { display: grid; grid-template-columns: 2.4em 1fr; gap: 10px; align-items: baseline; padding: 9px 4px; border-bottom: 1px solid var(--rule-2); text-decoration: none; color: var(--ink); }
.tour-stop:hover { background: var(--accent-soft); }
.tour-n { font: 400 22px/1 var(--display); color: var(--accent); text-align: right; font-variant-numeric: lining-nums; }
.lane-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 12px; }
.lane-chip { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 4px 12px; border: 1px solid var(--rule); background: var(--panel); border-radius: 999px; font-size: 15.5px; }
.lane-chip[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.lane-chip[aria-pressed="true"] .chip-dot { box-shadow: 0 0 0 2px var(--bg); }
.lane-n { font-size: 13px; color: var(--ink-3); font-variant-numeric: lining-nums; }
.lane-chip[aria-pressed="true"] .lane-n { color: inherit; opacity: .7; }
.group { content-visibility: auto; contain-intrinsic-size: auto 300px; }
.group-title { margin: 16px 0 2px; font: italic 400 17px/1.2 var(--display); color: var(--ink-2); }

/* ---------------------------------------------------------------- the introduction */
.intro {
  position: absolute; z-index: 6; left: 50%; bottom: 28px; transform: translateX(-50%); width: min(760px, calc(100% - 32px));
  padding: 26px 34px 26px; background: var(--panel); border: 1px solid var(--ink-2); outline: 1px solid var(--rule); outline-offset: 4px;
  box-shadow: var(--shadow); text-align: center; animation: rise .5s cubic-bezier(.2, .8, .2, 1);
}
@keyframes rise { from { opacity: 0; transform: translate(-50%, 14px); } }
.intro-close { position: absolute; right: 8px; top: 6px; width: 40px; height: 40px; border: 0; background: none; font-size: 26px; line-height: 1; color: var(--ink-2); border-radius: 6px; }
.intro-kicker { margin: 0; font: italic 400 19px/1.2 var(--display); color: var(--ink-2); }
.intro-title { margin: 2px 0 6px; font: 400 clamp(28px, 4.4vw, 44px)/1.05 var(--display); letter-spacing: .005em; text-wrap: balance; }
.intro-title i { color: var(--accent); }
.intro-by { margin: 0 0 12px; font: 400 15px/1.3 var(--caps); letter-spacing: .07em; color: var(--ink-2); }
.intro-text { margin: 0 auto 18px; max-width: 36em; font-size: 18px; text-wrap: pretty; }
.intro-count { display: block; margin-top: 6px; font: 400 14px/1.2 var(--caps); letter-spacing: .07em; color: var(--ink-3); font-variant-numeric: lining-nums; }
.intro-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.has-intro .controls { opacity: 0; pointer-events: none; }

/* ---------------------------------------------------------------- dialogs */
dialog { padding: 0; border: 0; background: none; color: var(--ink); max-width: none; max-height: none; }
dialog::backdrop { background: rgba(25, 17, 9, .42); backdrop-filter: blur(2px); }
.find { width: min(660px, calc(100% - 24px)); margin: 9vh auto auto; }
.find-box { background: var(--panel); border: 1px solid var(--ink-2); box-shadow: var(--shadow); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; max-height: 76vh; }
.find-field { display: flex; align-items: center; gap: 10px; padding: 6px 8px 6px 16px; border-bottom: 1px solid var(--rule); }
.find-field svg { width: 22px; height: 22px; fill: none; stroke: var(--ink-2); stroke-width: 1.7; stroke-linecap: round; flex: none; }
.find-field input { flex: 1; min-width: 0; height: 50px; border: 0; background: none; font: 400 22px/1 var(--display); outline: none; }
.find-field input::placeholder { color: var(--ink-3); }
.find-field input::-webkit-search-cancel-button { display: none; }
.find-close { border: 1px solid var(--rule); background: var(--panel-2); border-radius: 5px; padding: 4px 10px; font-size: 14px; color: var(--ink-2); }
.find-list { list-style: none; margin: 0; padding: 6px 0 10px; overflow-y: auto; overscroll-behavior: contain; }
.find-head { padding: 10px 18px 4px; font: 400 14px/1 var(--caps); letter-spacing: .08em; color: var(--ink-3); }
.find-item { display: flex; flex-direction: column; gap: 1px; padding: 8px 18px; cursor: pointer; border-left: 3px solid transparent; }
.find-item[aria-selected="true"] { background: var(--accent-soft); border-left-color: var(--accent); }
.f-title { display: flex; align-items: center; gap: 8px; font-size: 18px; line-height: 1.25; }
.f-meta { font-size: 14.5px; color: var(--ink-2); padding-left: 16px; }
.find-item .f-title:not(:has(.chip-dot)) + .f-meta { padding-left: 0; }
.find-empty { padding: 18px; color: var(--ink-2); font-style: italic; }
.about { width: min(760px, calc(100% - 24px)); margin: 5vh auto; }
.about-box { background: var(--panel); border: 1px solid var(--ink-2); box-shadow: var(--shadow); border-radius: 8px; display: flex; flex-direction: column; max-height: 90vh; }
.about-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 12px 10px 26px; border-bottom: 1px solid var(--rule); }
.about-head h2 { margin: 0; font: 400 28px/1.1 var(--display); }
.about-body { overflow-y: auto; padding: 16px 26px 26px; }
.about-body h3 { margin: 22px 0 6px; font: 400 17px/1.2 var(--caps); letter-spacing: .07em; color: var(--ink-2); }
.about-body .lede { font: italic 400 19px/1.4 var(--display); }
.about-body p { margin: 0 0 10px; }
.howto { padding-left: 1.1em; margin: 0; }
.howto li { margin-bottom: 6px; }
.licence { white-space: pre-wrap; font: 400 14px/1.45 var(--serif); background: var(--panel-2); border: 1px solid var(--rule-2); padding: 12px 14px; margin: 0 0 10px; color: var(--ink-2); max-height: 260px; overflow: auto; }
.build { color: var(--ink-3); font-size: 14px; margin-top: 18px !important; font-variant-numeric: lining-nums; }
.noscript { padding: 20px; }

/* ---------------------------------------------------------------- tablets and phones */
@media (max-width: 1023px) {
  .tool-label { display: none; }
  .tool-find .tool-label { display: inline; }
  .tool-find { min-width: 0; }
}
@media (max-width: 759px) {
  :root { --bar-h: 52px; --ruler-h: 34px; }
  .mark-title { font-size: 19px; }
  .mark .long { display: none; }
  .mark .short { display: inline; }
  .tool { padding: 0 7px; }
  #btn-theme { display: none; }
  .mark-sub { font-size: 12px; }
  .mark-seal { width: 30px; height: 30px; }
  .tool { padding: 0 9px; height: 40px; }
  .tool-find { border-color: transparent; background: none; margin: 0; }
  .tool-find .tool-label, .tool-find kbd { display: none; }
  .ticks i span { font-size: 12.5px; bottom: 13px; }
  .c-year { font-size: 22px; }
  .c-lane { font-size: 14px; }
  .panel {
    top: auto; left: 0; right: 0; bottom: 0; width: auto; border-radius: 14px 14px 0 0; border-bottom: 0;
    transform: translateY(100%); transition: transform .28s cubic-bezier(.2, .8, .2, 1);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .panel.is-dragging { transition: none; }
  /* At peek the whole sheet is a drag surface (js/panel.js touchSetup); the text scrolls once it is full. */
  .panel[data-snap="peek"] { touch-action: none; }
  .panel[data-snap="full"] .panel-body { touch-action: pan-y; }
  .sheet-handle { display: flex; justify-content: center; align-items: center; height: 22px; flex: none; cursor: grab; touch-action: none; }
  .sheet-handle span { width: 44px; height: 5px; border-radius: 3px; background: var(--rule); }
  .panel-head { padding: 0 6px 4px 18px; }
  .panel-body { padding: 10px 18px 24px; }
  .entry-title, .view-title { font-size: 27px; }
  .summary { font-size: 17.5px; }
  .controls { right: 10px; }
  .controls .ctl { width: 42px; height: 42px; }
  .locator { width: calc(100% - 78px); left: 10px; bottom: calc(32px + var(--cover-b)); }
  .credit { left: 10px; font-size: 12px; }
  .intro { left: 0; right: 0; bottom: 0; transform: none; width: auto; padding: 22px 20px calc(20px + env(safe-area-inset-bottom)); outline: 0; border-width: 1px 0 0; border-radius: 14px 14px 0 0; }
  @keyframes rise { from { opacity: 0; transform: translateY(20px); } }
  .intro-text { font-size: 16.5px; }
  .intro-actions .btn { flex: 1 1 40%; }
  .intro-actions .btn-primary { flex-basis: 100%; }
  .find { margin: 0; width: 100%; max-height: 100%; }
  .find-box { max-height: 100dvh; height: 100dvh; border-radius: 0; border: 0; }
  .about { margin: 0; width: 100%; }
  .about-box { max-height: 100dvh; height: 100dvh; border-radius: 0; border: 0; }
  .about-body { padding: 14px 18px 30px; }
  .row { grid-template-columns: 5.8em 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Scripture opens as a reader with a whole chapter around the cited passage. */
.bible-reference { margin: 18px 0; }
.bible-reference label, .bible-pickers label { display: flex; flex-direction: column; gap: 5px; font: 16px var(--caps); color: var(--ink-2); }
.bible-input-row { display: flex; gap: 8px; margin-top: 5px; }
.bible-input-row input { flex: 1; min-width: 0; width: 100%; padding: 10px; font: 18px var(--serif); color: var(--ink); background: var(--panel); border: 1px solid var(--rule); border-radius: 4px; }
.bible-pickers { display: flex; flex-wrap: wrap; gap: 10px; }
.bible-pickers label:first-child { flex: 1; min-width: 140px; }
.bible-pickers select { max-width: 100%; min-height: 44px; padding: 5px; font: 18px var(--serif); color: var(--ink); background: var(--panel); border: 1px solid var(--rule); }
.bible-nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin: 16px 0; }
.bible-citation { font-size: 17px; color: var(--ink-2); }
.bible-verse { font-size: 21px; line-height: 1.65; padding: 6px 8px; margin: 0 0 4px; scroll-margin-top: 20px; }
.bible-verse.is-cited { background: var(--accent-soft); }
.verse-number { font: 15px var(--caps); vertical-align: super; color: var(--accent); }
.bible-superscription { font-style: italic; color: var(--ink-2); }
.bible-error { padding: 12px; border: 1px solid var(--accent); }
@media (min-width: 760px) { .is-reading .panel { width: min(600px, calc(100vw - 36px)); } }
@media (max-width: 759px) { .tools { gap: 0; } .tool { padding-left: 7px; padding-right: 7px; } }

.reader-back { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; padding: 9px 0; color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

/* Reference library and the text edition of Wikipedia. */
.library-filters,.wiki-controls { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.library-filters [aria-pressed="true"] { background:var(--accent); color:var(--paper, #fff8e8); }
#library-query { display:block; box-sizing:border-box; width:100%; margin:8px 0; padding:10px 12px; border:1px solid var(--rule); border-radius:4px; background:var(--bg); color:var(--ink); font:inherit; }
.library-results { list-style:none; padding:0; margin:0; }
.library-results li { padding:14px 0; border-top:1px solid var(--rule); }
.library-record { display:block; color:var(--ink); text-decoration:none; }
.library-record strong { display:block; font:400 23px/1.3 var(--display); }
.library-caption { display:block; color:var(--ink-2); font-size:14px; margin:4px 0; overflow-wrap:anywhere; }
.library-article,.wikipedia-open { color:var(--accent); text-underline-offset:3px; }
.wiki-contents { padding:12px 0; border-block:1px solid var(--rule); margin:16px 0; }
.wiki-contents summary { cursor:pointer; }
.wiki-contents ol { padding-left:24px; }
.wiki-contents li { margin:5px 0; }
.wiki-contents [data-level="2"] { margin-left:12px; }
.wiki-contents [data-level="3"] { margin-left:24px; }
.wiki-article { line-height:1.6; overflow-wrap:anywhere; }
.wiki-article h2,.wiki-article h3,.wiki-article h4 { font-family:var(--display); font-weight:400; line-height:1.2; margin:1.5em 0 .6em; }
.wiki-article h2 { font-size:28px; border-bottom:1px solid var(--rule); padding-bottom:6px; }
.wiki-article h3 { font-size:24px; }
.wiki-article p { margin:.8em 0; }
.wiki-article a { color:var(--accent); text-underline-offset:3px; }
.wiki-article sup { font-size:.72em; }
.wiki-article ul,.wiki-article ol { padding-left:24px; }
.wiki-article pre { white-space:pre-wrap; }
.wiki-table { overflow-x:auto; max-width:100%; margin:16px 0; }
.wiki-table table { border-collapse:collapse; font-size:15px; width:100%; }
.wiki-table th,.wiki-table td { padding:6px 8px; border:1px solid var(--rule); vertical-align:top; }
.wiki-attribution { border-top:1px solid var(--rule); margin-top:24px; padding-top:12px; color:var(--ink-2); font-size:14px; overflow-wrap:anywhere; }
.wiki-error { padding:12px; background:var(--accent-soft); }
@media (max-width:759px) { #btn-library .tool-label { display:none; } .tool { min-width:32px; } }

.wiki-media { display:inline-flex; flex-direction:column; max-width:100%; vertical-align:middle; }
.wiki-media img { max-width:100%; height:auto; object-fit:contain; }
.wiki-image-open { display:inline-flex; max-width:100%; padding:0; border:0; background:none; cursor:zoom-in; }
.wiki-image-open:focus-visible,.wiki-image-toggle:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.wiki-image-dialog { position:fixed; inset:0; margin:0; width:100%; height:100dvh; background:var(--panel); overflow:hidden; }
.wiki-image-dialog[open] { display:flex; flex-direction:column; }
.wiki-image-toolbar { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; border-bottom:1px solid var(--rule); }
.wiki-image-toolbar > span { font:18px/1.2 var(--display); }
.wiki-image-tools { display:flex; gap:6px; }
.wiki-image-tools .btn { min-width:44px; padding:6px 10px; }
@media(max-width:520px) { .wiki-image-toolbar { flex-wrap:wrap; } .wiki-image-toolbar > span { flex:1 1 100%; } }
.wiki-image-stage { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; container-type:size; background:var(--surround); }
.wiki-image-canvas { width:max-content; min-width:100%; min-height:100%; display:grid; place-items:center; padding:16px; }
.wiki-image-toggle { display:block; padding:0; border:0; background:none; cursor:zoom-in; user-select:none; -webkit-user-select:none; }
.wiki-image-toggle img { display:block; width:100%; height:auto; max-width:none; }
.wiki-image-caption { flex:none; max-height:140px; overflow:auto; padding:8px 12px; border-top:1px solid var(--rule); font:14px/1.4 var(--serif); }
.wiki-image-caption p { margin:0 0 4px; }
.wiki-image-caption a { color:var(--accent); }
.wiki-image-credit { display:block; font:12px/1.4 var(--serif); padding:4px 0; }
.wiki-article figure { margin:1.2em 0; max-width:100%; }
.wiki-article figcaption { font-size:.9em; color:var(--ink-2); }
.wiki-article .wiki-media a { overflow-wrap:anywhere; }

.ebook-text { font-family:var(--serif); font-size:var(--ebook-size,20px); line-height:1.75; overflow-wrap:anywhere; }
.ebook-text p { margin:1em 0; }
.ebook-section { line-height:1.3; }
.ebook-contents { border-block:1px solid var(--rule); padding:12px 0; }
.ebook-contents summary { cursor:pointer; }
.ebook-contents ol { max-height:45vh; overflow:auto; padding-left:24px; }
.ebook-contents a[aria-current="page"] { font-weight:bold; }
.ebook-steps { display:flex; justify-content:space-between; gap:12px; margin-top:24px; }

.explore-hint { margin: 0 0 10px; font: 14px/1.4 system-ui, sans-serif; }
.explore-hint button { color: #f1e5c9; background: #263544; border: 1px solid #796344; border-radius: 5px; padding: 5px 9px; font: inherit; }
.explore-hint p:not(:empty) { margin-top: 8px; }
.explore-hint a { display: block; color: #e7bd7a; margin-top: 3px; }
.scripture-context + .scripture-context { margin-top: 16px; }
.atlas-reader { min-height: 60vh; }
.atlas-map-choices, .atlas-place-list { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 12px 0; font-size: 15px; }
.atlas-map-choices a[aria-current="true"] { font-weight: bold; text-decoration-thickness: 2px; }
.atlas-map { display: block; width: 100%; height: min(55vh, 480px); background: #eee1bf; border: 1px solid var(--rule); border-radius: 6px; touch-action: none; cursor: grab; }
.atlas-map:active { cursor: grabbing; }
.atlas-pin circle { fill: #245b75; stroke: white; stroke-width: 2px; }
.atlas-pin.selected circle { fill: #b13d22; stroke-width: 3px; }
.atlas-pin:focus circle { stroke: #e9a218; stroke-width: 5px; }
.atlas-map-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.atlas-map-controls button { min-width: 40px; min-height: 36px; }
.atlas-map-controls small, .atlas-caption, .atlas-credit { font: 12px/1.5 system-ui,sans-serif; }
.atlas-caption, .atlas-credit { color: var(--ink-3); }
.atlas-place-detail h3 { margin: 20px 0 8px; }
.atlas-event { display: flex; flex-wrap: wrap; gap: 3px 12px; padding: 9px 0; border-bottom: 1px solid var(--rule); }
.atlas-event small { min-width: 85px; }
.atlas-place-detail select { max-width: 100%; margin-top: 6px; }
.atlas-find { display: block; margin-top: 24px; }
.atlas-find input { display: block; width: 100%; margin-top: 6px; }

.atlas-pin .atlas-hit, .atlas-pin.selected .atlas-hit { fill: transparent; stroke: none; }
.atlas-place-list a { display: inline-flex; align-items: center; min-height: 32px; }

.atlas-map-choices select { font: inherit; max-width: 100%; }

/* Chronicle renderer reused from Trivium. */
adams-chronicle { flex: 1; height: auto; }
.tl-chronicle-region .ch-meanwhile { top: 68px; }
.tl-chronicle-region[data-fullscreen] .ch-meanwhile { top: 120px; }

/* Chronologies (datasets). Shown only with two or more installed. No chronology is styled as
   preferred: every row, mark and dating is set alike. Full borders only, no radius. */
.tl-lane-picker > div { flex: 1 1 100%; }
.tl-lane-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tl-chronologies { display: grid; gap: 6px; padding-bottom: 8px; border-bottom: 1px solid var(--rule); }
/* .tl-lane-picker outranks the LCARS kit's heading face, so the group heading matches the dataset headings beside it. */
.tl-lane-picker .tl-chronologies h4, .tl-picker-head { margin: 0; font: 600 11px var(--sans); letter-spacing: .14em; text-transform: uppercase; font-variant: small-caps; color: var(--sepia); }
.tl-picker-head { flex-basis: 100%; padding-top: 4px; }
.tl-picker-break { flex-basis: 100%; height: 0; border-top: 1px solid var(--rule); }
.tl-chron { display: flex; gap: 10px; align-items: flex-start; width: 100%; min-height: 44px; padding: 8px 12px; text-align: left; border: 1px solid var(--rule-strong); background: var(--vellum); color: var(--ink); cursor: pointer; }
.tl-chron.on { border-color: var(--fill); background: color-mix(in srgb, var(--fill) 10%, var(--vellum)); }
.tl-chron[aria-disabled="true"] { cursor: default; }
.tl-chron-tick { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid var(--rule-strong); background: var(--parchment); font: 600 14px var(--sans); }
.tl-chron.on .tl-chron-tick { background: var(--fill); border-color: var(--fill); color: var(--on-fill); }
.tl-chron-text { display: grid; gap: 2px; font: 15px var(--serif); }
.tl-chron-text small { font-size: 13px; color: var(--sepia); }
/* A dataset's heading over its lanes, drawn like the era labels: small caps on a hairline. Its
   height is View.Timeline.groupHeadHeight, which the counterpart connector counts on. */
.tl-group-head { position: relative; z-index: 2; height: 24px; box-sizing: border-box; border-bottom: 1px solid var(--rule); }
.tl-group-head span { display: inline-block; padding: 4px 8px; font: 600 11px var(--sans); letter-spacing: .14em; text-transform: uppercase; font-variant: small-caps; color: var(--sepia); }
/* A hairline from a selected event to its counterparts in other chronologies; both marks get the
   same neutral outline. */
.tl-connector { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 1; }
.tl-connector line { stroke: var(--sepia); stroke-width: 1; }
.tl-hit.tl-linked { outline: 1px solid var(--sepia); outline-offset: -1px; }
.tl-add-chronology { margin: 0; }
.map-events { display: grid; gap: 6px; margin: 8px 0; }

/* The Chronicle: the map above the time strip. Square plates for every label (no rounded thing has
   an edge bar); pictures use the same mat as everywhere else. The map itself is drawn by
   <adams-chronicle> (chronicle.js) from these same tokens. */
adams-chronicle { display: flex; flex-direction: column; height: 100%; min-height: 0; background: var(--parchment); user-select: none; -webkit-user-select: none; }
.ch-map { position: relative; flex: 1; min-height: 0; overflow: hidden; touch-action: none; }
.ch-gl { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ch-geography { background:var(--parchment); }
.ch-sea, .ch-lakes { fill:var(--parchment); }
.ch-coast-wash { fill:none; stroke:var(--gold); stroke-width:14px; opacity:.18; stroke-linejoin:round; }
.ch-land { fill:var(--vellum); stroke:var(--rule-strong); stroke-width:1px; stroke-linejoin:round; }
.ch-lakes { stroke:var(--rule-strong); stroke-width:.7px; }
.ch-rivers { stroke:var(--sepia); stroke-width:.75px; opacity:.32; }
.ch-ink { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.ch-pin-glow { fill:url(#chronicle-pin-glow); }
.ch-pin-dot { fill:var(--oxblood); stroke:var(--vellum); stroke-width:1px; }
.ch-region-wash { fill:url(#chronicle-region-wash); }
.ch-journey-base { stroke:var(--sepia); stroke-width:1.5px; stroke-dasharray:4 5; opacity:.4; }
.ch-journey-progress { stroke:var(--oxblood); stroke-width:3px; stroke-dasharray:4 5; animation:chronicle-voyage 2s linear infinite; }
.ch-tape > svg { display:block; pointer-events:none; }
.ch-tape-original { color:var(--sepia); opacity:.55; }
.ch-tape-active { color:var(--oxblood); }
.ch-tape-year { fill:var(--sepia); font:12px system-ui,sans-serif; }
.ch-tape-tick { stroke:var(--rule-strong); stroke-width:1px; }
.ch-tape-playhead { stroke:var(--oxblood); stroke-width:2px; }
.ch-lens-wash { fill:var(--gold); opacity:.13; }
@keyframes chronicle-voyage { to { stroke-dashoffset:-36; } }
@media(prefers-reduced-motion:reduce) { .ch-journey-progress { animation:none; } }
.ch-marks { position: absolute; inset: 0; pointer-events: none; }
.ch-marks > * { position: absolute; left: 0; top: 0; pointer-events: auto; transition: opacity 300ms var(--ease); will-change: transform, opacity; }
.ch-label { display: flex; align-items: center; min-width: 44px; min-height: 44px; margin: -22px 0 0 -22px; padding: 0 0 0 34px; border: 0; background: none; color: var(--ink); text-align: left; white-space: nowrap; }
.ch-label b { font: 15px/1.15 var(--serif); font-weight: 400; padding: 2px 7px 1px; background: color-mix(in srgb, var(--vellum) 90%, transparent); border: 1px solid var(--rule-strong); max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.ch-label small { display: none; }
.ch-pin small { display: block; position: absolute; left: 35px; top: 35px; font: 600 10px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--sepia); }
.ch-region { flex-direction: column; justify-content: center; align-items: center; text-align: center; margin: -22px 0 0 0; padding: 0; }
.ch-region b { padding: 0; background: none; border: 0; font: 600 11px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--sepia); }
.ch-region small { display: block; font: italic 16px/1.2 var(--serif); color: var(--ink); max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ch-left { margin-left: 0; padding: 0 34px 0 0; justify-content: flex-end; }
.ch-pin.ch-left small { left: auto; right: 35px; }
.ch-journey b { font-style: italic; }
.ch-label:disabled { cursor: default; }
.ch-label:focus-visible b { outline: 2px solid var(--oxblood); outline-offset: 2px; }
.ch-art { display: grid; place-items: center; width: 60px; height: 52px; margin: -26px 0 0 -30px; padding: 0; border: 0; background: none; }
.ch-art img { display: block; max-width: 52px; max-height: 42px; background: var(--placeholder); outline: 1px solid var(--rule-strong); outline-offset: 3px; }
.ch-year { position: absolute; left: 12px; top: 12px; display: grid; padding: 4px 12px 6px; background: color-mix(in srgb, var(--vellum) 90%, transparent); border: 1px solid var(--rule-strong); pointer-events: none; }
.ch-year b { font: 32px/1.1 var(--serif); color: var(--oxblood); font-weight: 400; font-variant-numeric: lining-nums tabular-nums; }
.ch-year span { font: 600 10px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sepia); }
.ch-meanwhile { position: absolute; right: 12px; top: 12px; display: grid; justify-items: end; gap: 6px; max-width: 250px; }
.ch-mean { display: grid; justify-items: end; text-align: right; min-height: 44px; max-width: 250px; padding: 3px 10px; border: 1px solid var(--rule-strong); background: color-mix(in srgb, var(--vellum) 92%, transparent); color: var(--ink); font: 14px/1.2 var(--serif); text-align: left; }
.ch-mean small { font: 600 9px var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--sepia); }
.ch-zoom { position: absolute; right: 12px; bottom: 12px; display: grid; gap: 6px; }
.ch-zoom .btn { padding: 0; font-size: 18px; background: color-mix(in srgb, var(--vellum) 92%, transparent); }
.ch-strip { flex: none; display: flex; align-items: center; gap: 6px; height: 124px; padding: 0 8px; background: var(--bar); border-top: 1px solid var(--rule-strong); }
.ch-tape { position: relative; flex: 1; align-self: stretch; min-width: 0; margin: 6px 0; background: var(--parchment); border: 1px solid var(--rule); touch-action: none; cursor: grab; }
.ch-tape canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ch-tape:focus-visible { outline: 2px solid var(--oxblood); outline-offset: 2px; }
.ch-play { min-width: 96px; font-weight: 600; }
.ch-step { padding: 0; font-size: 20px; }
.ch-tape { order: 1; }
.ch-step[data-step="1"] { order: 2; }
@media (max-width: 640px), (orientation: portrait) {
  .ch-play { min-width: 44px; padding: 0 8px; }
}
/* Short screens (200% zoom): a lower strip, a smaller year, and no Meanwhile list over the map. */
@media (max-height: 420px) {
  .ch-strip { height: 96px; }
  .ch-meanwhile { display: none; }
  .ch-year { padding: 2px 8px; }
  .ch-year b { font-size: 22px; }
  .ch-year span { display: none; }
}


adams-chronicle { --parchment:var(--bg); --vellum:var(--panel); --rule-strong:var(--rule); --sepia:var(--ink-2); --oxblood:var(--accent); --gold:#a47b31; --fill:var(--panel-2); --sans:system-ui,sans-serif; --ease:ease; --placeholder:var(--panel-2); height:clamp(430px,66vh,760px); width:100%; border:1px solid var(--rule); }
.ch-zoom button, .ch-step, .ch-play { min-width:44px; min-height:44px; }
.ch-label, .ch-mean { cursor:pointer; }
.ch-strip { height:142px; }
.atlas-modes { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.atlas-modes a[aria-current="page"] { border-color:var(--accent); color:var(--accent); }
.atlas-context img { display:block; width:100%; height:auto; border:1px solid var(--rule); border-radius:5px; }
.atlas-context .hint { margin:6px 0; }
.atlas-context .chips { gap:10px; margin:8px 0; }
.atlas-context-events ul { margin:0; padding-left:20px; font-size:16px; }
.atlas-context-events small { color:var(--ink-2); }
.chronicle-journeys { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.chronicle-credit { margin:10px 0; }
@media(min-width:760px) { .is-mapping .panel { width:min(1120px,calc(100vw - 36px)); } }
@media(max-width:640px) { adams-chronicle { height:520px; } .ch-meanwhile { display:none; } .ch-play { min-width:60px; font-size:12px; } .ch-strip { gap:4px; padding:0 4px; } }

/* Present-day vector tiles share the Chronicle's paper, ink and accent palette. */
.ch-modern { position:absolute; inset:0; }
.ch-modern[hidden], .ch-modern-status[hidden], .ch-gl[hidden] { display:none; }
.ch-modern canvas { outline:none; }
.ch-modern-status { position:absolute; bottom:36px; left:8px; right:70px; padding:7px 10px; background:var(--panel); color:var(--ink); border:1px solid var(--rule); font:14px/1.35 var(--serif); }
.ch-time-actions { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:6px 8px; border-top:1px solid var(--rule); background:var(--bar); }
.ch-time-actions label { display:flex; gap:6px; align-items:center; font:14px var(--serif); }
.ch-year-input { width:85px; min-height:36px; padding:3px 6px; border:1px solid var(--rule); background:var(--panel); color:var(--ink); font:16px var(--serif); }
.ch-date-note { flex:1 1 230px; font:12px/1.35 var(--serif); color:var(--ink-2); }
.ch-time-actions button { min-height:36px; padding:5px 10px; }
[data-basemap="modern"] .ch-pin::before { content:""; position:absolute; left:16px; top:16px; width:10px; height:10px; border-radius:50%; background:var(--accent); outline:2px solid var(--panel); box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 25%,transparent); }
.ch-map .ch-modern .maplibregl-ctrl-attrib { font:10px/1.35 system-ui,sans-serif; color:var(--ink); background:color-mix(in srgb,var(--panel) 95%,transparent); max-width:100%; }
.ch-modern .maplibregl-ctrl-attrib a { color:var(--ink); }
.ch-modern .maplibregl-ctrl-bottom-right { max-width:100%; }
@media(max-width:640px) { .ch-time-actions { gap:4px; } .ch-date-note { flex-basis:100%; } }

.ch-map .ch-modern { position:absolute; inset:0; width:100%; height:100%; }


/* Read a chart card alongside the map without losing its camera or time. */
.chronicle-chart-control { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; position:sticky; top:0; z-index:6; padding:8px 0; margin-bottom:8px; background:var(--panel); border-bottom:1px solid var(--rule); }
.chronicle-chart-status { flex:1 1 180px; font:15px/1.4 var(--serif); overflow-wrap:anywhere; }
.chronicle-chart-control .btn { min-height:44px; padding:6px 10px; font-size:14px; }
.chronicle-workspace { display:flex; gap:16px; align-items:stretch; }
.chronicle-map-column { flex:1; min-width:0; }
.chronicle-entry { flex:0 0 340px; min-width:0; max-height:clamp(430px,66vh,760px); overflow:auto; overscroll-behavior:contain; background:var(--panel); border:1px solid var(--rule); padding:0 16px 16px; }
.chronicle-entry-header { display:flex; gap:6px; justify-content:space-between; position:sticky; top:0; z-index:3; padding:8px 0; background:var(--panel); border-bottom:1px solid var(--rule); }
.chronicle-entry-header .btn { font-size:13px; min-height:36px; padding:5px 8px; }
.chronicle-entry .entry-title { font-size:27px; margin-top:16px; }
.chronicle-entry .atlas-context { display:none; }
.chronicle-entry .summary { font-size:17px; }
@media(max-width:640px) {
  .chronicle-entry { position:fixed; left:0; right:0; bottom:0; z-index:20; max-height:44dvh; padding:0 16px max(16px,env(safe-area-inset-bottom)); border-radius:12px 12px 0 0; box-shadow:0 -4px 20px #0003; }
  .chronicle-workspace.has-entry .chronicle-map-column { padding-bottom:44dvh; }
}

/* Guided journeys: a dark projection room around the original engraved plate. */
.journey-library { padding: 28px 30px 36px; }
.journey-library .view-title { font-size: clamp(34px,4vw,48px); line-height: 1.06; max-width: 12em; }
.journey-library .view-sub { font-size: 21px; line-height: 1.45; margin: 18px 0 26px; }
.journey-cards { display: grid; gap: 14px; }
.journey-card { position: relative; overflow: hidden; display: block; padding: 25px 24px; border: 1px solid #746446; border-radius: 3px; background: radial-gradient(ellipse at 100% 0%,#4e5545 0%,transparent 75%),#182629; color: #f4e8cd; text-decoration: none; box-shadow: inset 0 0 55px #0a151750; transition: transform .25s, border-color .25s; }
.journey-card::after { content: '✧'; position: absolute; right: 15px; bottom: -35px; font: 160px Georgia,serif; opacity: .07; }
.journey-card:hover { transform: translateY(-2px); border-color: #c9a879; }
.journey-number,.journey-start { font: 11px/1.5 system-ui,sans-serif; letter-spacing: .14em; color: #d7b982; }
.journey-card h3 { font: 35px/1.1 var(--serif); margin: 14px 0 8px; }
.journey-card p { font: 18px/1.4 var(--serif); margin: 0 0 22px; max-width: 28em; color: #e2d8c4; }
.journey-section { font: 30px/1.2 var(--serif); margin: 38px 0 12px; }
.journey-small { color: var(--ink-3); font-size: 16px; margin-top: 26px; }
.original-tour { padding: 10px 30px 28px; }
.original-tour summary { cursor: pointer; color: var(--ink-2); }
.presentation-resume { position: fixed; z-index: 12; bottom: max(14px,env(safe-area-inset-bottom)); left: 16px; }
.presentation-resume a { display: block; padding: 12px 20px; border: 1px solid #bc9f6d; border-radius: 30px; background: #142326; color: #f6e8c9; box-shadow: 0 4px 20px #0006; font: 16px/1.2 var(--serif); text-decoration: none; }
body.is-presenting { background: #111d20; }
.is-presenting .stage { position: fixed; inset: 0; background: #111d20; }
.is-presenting .plate { inset: 0; }
.is-presenting .bar,.is-presenting .ruler,.is-presenting #panel,.is-presenting .credit,.is-presenting .locator,.is-presenting .zoom,.is-presenting .explore-hud,.is-presenting .tooltip { visibility: hidden; pointer-events: none; }
/* The subject stays at full brightness; the feathered spotlight shades only its surroundings. */
.is-presenting .pl-layers,.is-presenting .pl-canvas,.is-presenting .pl-tiles { filter: none; }
/* Full-bleed television presentation. The image is the stage; text floats over it. */
.presentation { --cinema-cream:#fff3da; --cinema-gold:#e8ca8c; position:fixed; inset:0; z-index:20; isolation:isolate; color:var(--cinema-cream); font-family:var(--serif); overflow:hidden; background:transparent; }
.presentation a { color:var(--cinema-gold); text-underline-offset:4px; }
.presentation a:hover { color:#fff6df; }
.presentation :focus-visible { outline:3px solid #f2d191; outline-offset:4px; }
.presentation:focus { outline:none; }
.presentation button,.presentation select { font:14px/1.25 system-ui,sans-serif; background:#112023d9; color:#fff3da; border:1px solid #ddc18a70; border-radius:4px; padding:10px 13px; min-height:40px; cursor:pointer; }
.presentation button:hover,.presentation select:hover { background:#253839; border-color:#e7c88b; }
.presentation button:disabled { opacity:.3; cursor:default; }
.presentation button[aria-pressed=true],#cinema-play { background:#e1c68d; color:#152326; border-color:#e1c68d; }
.cinema-scene-host,.cinema-scene,.cinema-visual { position:absolute; inset:0; width:100%; height:100%; overflow:hidden; }
.cinema-visual { animation:cinema-reveal 1.8s ease both; }
.cinema-vignette { position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(0deg,#081619dd,transparent 65%),linear-gradient(90deg,#07141645,transparent 80%); }
.cinema-header { position:absolute; top:0; left:0; right:0; z-index:6; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:3vh 3.5vw; background:linear-gradient(#081619c9,transparent); transition:opacity .6s,visibility .6s; }
.cinema-eyebrow { color:#edce91; font:12px/1.5 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.18em; margin:0 0 12px; }
.cinema-header .cinema-eyebrow { font-size:9px; margin-bottom:4px; }
.cinema-header h1 { font:italic 24px/1.2 var(--serif); margin:0; }
.cinema-exit { font:12px/1.4 system-ui,sans-serif; padding:8px; text-decoration:none; }
.cinema-copy { --copy-low:11vh; position:absolute; z-index:3; left:5vw; bottom:var(--copy-low); width:65vw; max-width:1450px; padding:0; overflow:hidden; color:#fff6df; text-shadow:0 2px 18px #0009; }
.cinema-copy h2 { font:400 clamp(32px,5vh,100px)/1.02 var(--serif); margin:0 0 16px; letter-spacing:-.018em; text-wrap:balance; max-width:22em; }
.cinema-copy .cinema-eyebrow { font-size:clamp(10px,1.2vh,22px); }
.cinema-narration,.cinema-reading-page { animation:cinema-copy-in 1.1s ease both; }
.cinema-lede { margin:0; font:clamp(22px,2.8vh,52px)/1.38 var(--serif); max-width:35em; }
.cinema-verses { margin:0; padding:0; }
.cinema-verses p { margin:0 0 10px; font:clamp(28px,3.5vh,68px)/1.38 var(--serif); }
.cinema-verses sup { display:inline-block; margin-right:9px; font:11px/1 system-ui,sans-serif; color:#f0d194; text-shadow:0 1px 6px #000; }
.cinema-date { position:absolute; z-index:3; top:4vh; right:4vw; max-width:40vw; text-align:right; color:#fff1d0; font:clamp(22px,2.6vh,52px)/1.1 var(--serif); text-shadow:0 2px 12px #000; }
.cinema-date span { display:block; font:9px/1.5 system-ui,sans-serif; letter-spacing:.15em; margin-bottom:5px; }
.cinema-header .cinema-exit { margin-right:0; }
.cinema-header { padding-right:22vw; }
.cinema-header .cinema-exit { white-space:nowrap; }
.cinema-connections { display:flex; align-items:baseline; gap:14px; margin-top:16px; }
.cinema-connections>span { font:9px/1.4 system-ui,sans-serif; letter-spacing:.12em; color:#ddc79e; }
.cinema-connections>div { display:flex; gap:14px; flex-wrap:wrap; font:clamp(15px,1.7vh,30px)/1.4 var(--serif); }
.cinema-sources { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:16px; font:12px/1.4 system-ui,sans-serif; }
.is-playing .cinema-sources { display:none; }
.cinema-reading-pages { display:flex; align-items:center; gap:12px; margin-top:10px; height:26px; }
.cinema-reading-pages small { font:10px/1.3 system-ui,sans-serif; letter-spacing:.13em; color:#e1d2b7; }
.presentation .cinema-reading-pages button { min-height:24px; height:24px; padding:0 9px; border-color:transparent; background:transparent; font-size:22px; }
.is-playing .cinema-reading-pages button { visibility:hidden; }
.cinema-footer { position:absolute; z-index:7; bottom:0; left:0; right:0; padding:15px 3.5vw 18px; background:linear-gradient(transparent,#071619dd); transition:background .6s; }
.cinema-next { display:flex; justify-content:space-between; gap:20px; font:10px/1.4 system-ui,sans-serif; letter-spacing:.12em; color:#e4c994; margin-bottom:10px; transition:opacity .6s; }
.cinema-next small { color:#dfd4bc; font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:65%; }
.cinema-progress { height:2px; background:#eee0bd30; margin:0 0 12px; }
.cinema-progress span { display:block; height:100%; width:100%; background:#e7cb93; transform-origin:left; }
/* Scene meters fill in CSS: Elm starts each run at its offset and pauses it with the clock. */
.cinema-progress span,.cinema-up-next-meter span { animation-name:cinema-meter; animation-timing-function:linear; animation-fill-mode:both; }
@keyframes cinema-meter { from { transform:scaleX(0); } to { transform:scaleX(1); } }
.cinema-controls { display:flex; align-items:center; gap:9px; transition:opacity .6s,visibility .6s; }
.cinema-chapters { flex:1; min-width:0; max-width:380px; margin-left:10px; }
.cinema-chapters select { width:100%; text-overflow:ellipsis; }
#cinema-play { min-width:100px; }
#cinema-fullscreen { margin-left:auto; }
.cinema-help { font:9px/1.5 system-ui,sans-serif; color:#e0d3b7; margin:8px 0 0; text-align:right; transition:opacity .6s; }
.controls-hidden .cinema-header,.controls-hidden .cinema-controls,.controls-hidden .cinema-help,.controls-hidden .cinema-next { opacity:0; visibility:hidden; pointer-events:none; }
.controls-hidden .cinema-footer { background:transparent; padding:0; pointer-events:none; }
.controls-hidden .cinema-progress { position:absolute; bottom:0; left:0; right:0; margin:0; height:2px; opacity:.4; }
.cinema-art { position:absolute; inset:0; overflow:hidden; background:#102023; }
.cinema-art-wash { position:absolute; inset:-5%; background-position:center; background-size:cover; filter:blur(26px) brightness(.65); }
.presentation .cinema-art-open,.presentation .cinema-art-open:hover { position:absolute; inset:0; width:100%; height:100%; display:block; padding:0; border:0; border-radius:0; background:transparent; cursor:zoom-in; }
.cinema-art img { width:100%; height:100%; object-fit:cover; animation:cinema-drift var(--scene-duration,32s) linear both; }
/* Calm light: a full-screen picture holds still rather than drifting, and captions and pages
   appear without fading in. Reduced motion's short dissolve keeps its own !important rules. */
.presentation.is-calm :is(.cinema-scene *,.cinema-heading) { animation:none; }
.cinema-portrait img { object-fit:contain; }
.is-paused .cinema-art img { animation-play-state:paused; }
.cinema-image-credit { position:absolute; z-index:4; top:3.5vh; left:4vw; max-width:60vw; padding:6px 9px; background:#11202377; font:9px/1.4 system-ui,sans-serif; }
.cinema-header~.cinema-scene-host .cinema-image-credit { top:11vh; }
.controls-hidden .cinema-scene-host .cinema-image-credit { top:3.5vh; transition:top .6s; }
.cinema-media-fallback { position:absolute; top:14vh; right:4vw; display:flex; flex-direction:column; gap:5px; max-width:26vw; font:10px/1.4 system-ui,sans-serif; text-shadow:0 2px 8px #000; }
.cinema-media-fallback span { letter-spacing:.12em; }
.cinema-map { position:absolute; inset:0; background:radial-gradient(ellipse at 45% 30%,#31494b,#132c31); }
.cinema-map svg { width:100%; height:100%; }
.cinema-map-land { fill:#c3c4a1; stroke:#eadba6; stroke-width:.04; }
.cinema-map-water { fill:#263e42; }
.cinema-map-rivers { fill:none; stroke:#577b81; stroke-width:.045; }
.cinema-map-dot { fill:#8c331c; stroke:#fff0c8; stroke-width:.12; }
.cinema-map-halo { fill:#a6602466; stroke:#8d502d; stroke-width:.02; }
.cinema-map-label { fill:#fff5dd; stroke:#173038; stroke-width:.16; paint-order:stroke; font-family:system-ui,sans-serif; }
.cinema-map-legend { position:absolute; bottom:3vh; right:4vw; width:30vw; font:9px/1.4 system-ui,sans-serif; text-align:right; color:#f3e8cc; }
.cinema-map-legend>span { display:block; font:20px Georgia,serif; margin-bottom:7px; }
.cinema-map-legend small { display:block; }
.cinema-map-loading,.cinema-loading { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:15px; background:#14272b; padding:4vw; text-align:center; }
.cinema-loading h2 { font:48px/1.1 var(--serif); }
.cinema-shader { position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none; opacity:.4; mix-blend-mode:screen; }
.cinema-shader:not(canvas) { display:none; }
cinema-light { position:absolute; inset:0; pointer-events:none; }
.is-presenting .pl-fog { visibility:hidden; }
@keyframes cinema-reveal { from { opacity:0; } to { opacity:1; } }
@keyframes cinema-copy-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes cinema-drift { from { transform:scale(1.01) translateX(-.4%); } to { transform:scale(1.06) translateX(.4%); } }
@media (max-height:800px) and (min-width:760px) {
  .cinema-copy { --copy-low:14vh; width:68vw; }
  .cinema-copy h2 { margin-bottom:12px; }
  .cinema-copy .cinema-eyebrow { margin-bottom:9px; }
  .cinema-sources { font-size:10px; margin-top:10px; }
  .cinema-connections { margin-top:10px; }
}
@media (max-width:1100px) and (min-width:760px) {
  .presentation button,.presentation select { font-size:12px; padding:9px; }
  .cinema-controls { gap:7px; }
  #cinema-effects { display:none; }
}
@media (max-width:759px) {
  .cinema-header { padding:18px 20px; }
  .cinema-header h1 { font-size:19px; }
  .cinema-header .cinema-eyebrow { font-size:7px; letter-spacing:.1em; }
  .cinema-exit { font-size:10px; }
  .cinema-copy { --copy-low:190px; left:6vw; width:88vw; max-width:none; }
  .controls-hidden .cinema-copy { --copy-low:7vh; }
  .cinema-copy h2 { font-size:30px; margin-bottom:12px; }
  .cinema-copy .cinema-eyebrow { font-size:9px; }
  .cinema-lede { font-size:21px; }
  .cinema-verses p { font-size:26px; }
  .cinema-date { top:13vh; right:6vw; font-size:21px; }
  .cinema-date span { font-size:7px; }
  .cinema-connections { gap:9px; margin-top:10px; }
  .cinema-connections>span { font-size:7px; }
  .cinema-connections>div { font-size:15px; gap:8px; }
  .cinema-sources { font-size:10px; gap:8px 12px; margin-top:10px; }
  .cinema-footer { padding:12px 18px max(14px,env(safe-area-inset-bottom)); }
  .cinema-controls { display:grid; grid-template-columns:36px 76px 36px minmax(0,1fr); gap:7px; }
  .presentation button,.presentation select { font-size:11px; min-height:36px; padding:8px; }
  .cinema-chapters { grid-column:1 / 4; grid-row:2; width:100%; margin:0; }
  .cinema-pace { grid-column:4; grid-row:2; width:100%; }
  .cinema-pace select { width:100%; }
  #cinema-fullscreen { grid-column:4; grid-row:1; width:100%; }
  #cinema-loop,#cinema-effects,#cinema-calm { display:none; }
  #cinema-play { min-width:76px; }
  .cinema-image-credit { top:20vh !important; left:6vw; font-size:8px; }
  .cinema-map-legend { width:43vw; font-size:7px; }
  .cinema-help { font-size:8px; }
  .journey-library { padding:22px; }
}
@media (prefers-reduced-motion:reduce) {
  .cinema-scene *,.cinema-header,.cinema-heading,.cinema-footer,.cinema-controls,.cinema-help,.cinema-next { animation:none !important; transition:none !important; }
  .cinema-shader { display:none; }
}
.is-presenting .controls,.is-presenting .tip { visibility:hidden; pointer-events:none; }
.cinema-vignette { display:none; }
.cinema-visual::after { content:''; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(0deg,#081619e6,transparent 67%),linear-gradient(90deg,#07141645,transparent 80%); }
.cinema-map-legend { z-index:3; text-shadow:0 1px 8px #000; }
/* While the controls show (playing or paused) the caption clears them: --cinema-footer is the measured
   height of the footer's visible rows (cinema-footer-gauge), with fallbacks for its fixed-size layouts.
   Hidden controls leave the caption at its lower place. */
.presentation { --cinema-footer:118px; }
cinema-footer-gauge { display:none; }
@media (max-width:759px) { .presentation { --cinema-footer:151px; } }
.presentation:not(.controls-hidden) .cinema-copy { bottom:max(var(--copy-low),calc(var(--cinema-footer) + 14px)); }

/* Context insets keep their corner clear of the selected chart subject. */
.cinema-inset { position:absolute; z-index:4; top:16vh; right:4vw; width:30vw; height:32vh; border:1px solid #dfc99555; border-radius:5px; overflow:hidden; background:#14272b; box-shadow:0 12px 45px #0007; animation:cinema-copy-in 1.1s ease both; }
.cinema-inset:empty { visibility:hidden; }
.cinema-inset .cinema-art img { object-fit:contain; animation:none; }
.cinema-inset .cinema-art-wash { filter:blur(18px) brightness(.45); }
.cinema-scene-host .cinema-inset .cinema-image-credit { top:auto !important; bottom:0; left:0; right:0; max-width:none; margin:0; font-size:clamp(7px,1vh,17px); padding:7px 9px; background:#112023c9; }
.cinema-inset .cinema-map-legend { bottom:0; right:0; width:100%; padding:8px; font-size:clamp(7px,.9vh,15px); background:#112023b3; }
.cinema-inset .cinema-map-legend>span { position:absolute; right:8px; bottom:100%; font-size:clamp(12px,1.6vh,28px); }
@media (max-width:759px) {
  .cinema-inset { top:20vh; right:6vw; width:44vw; height:16vh; }
  .cinema-inset .cinema-map-legend { padding:4px; font-size:6px; }
  .cinema-scene-host .cinema-inset .cinema-image-credit { font-size:6px; padding:4px; }
}

/* Styled form controls retain the browser's keyboard, type-ahead, and touch behavior. */
select { --select-paper:var(--panel); --select-ink:var(--ink); --select-rule:var(--rule); --select-hover:var(--panel-2); --select-mark:var(--accent); appearance:none; color:var(--select-ink); background-color:var(--select-paper); border:1px solid var(--select-rule); border-radius:5px; padding:.55em 2.2em .55em .8em; font:inherit; cursor:pointer; }
select:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.presentation select { --select-paper:#14272b; --select-ink:#fff3da; --select-rule:#ddc18a80; --select-hover:#2a4142; --select-mark:#e8ca8c; color-scheme:dark; border-color:var(--select-rule); padding-right:2.2em; }
select { background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%); background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%; background-size:5px 5px; background-repeat:no-repeat; }
@supports (appearance:base-select) {
  select,select::picker(select) { appearance:base-select; }
  select,.presentation select { background-image:none; }
  select::picker-icon { color:var(--select-mark); margin-left:.9em; font-size:.85em; transition:rotate .18s; }
  select:open::picker-icon { rotate:180deg; }
  select::picker(select) { color:var(--select-ink); background:var(--select-paper); border:1px solid var(--select-rule); border-radius:7px; padding:5px; box-shadow:0 8px 30px #0005; max-height:min(45vh,440px); max-width:calc(100vw - 24px); overflow-y:auto; font:inherit; }
  select option { padding:10px 12px; min-height:40px; border-radius:4px; gap:12px; cursor:pointer; }
  select option:hover,select option:focus { background:var(--select-hover); outline:none; }
  select option:checked { background:var(--select-hover); color:var(--select-mark); }
  select option::checkmark { color:var(--select-mark); }
}
.controls-hidden:has(select:open) .cinema-controls,.controls-hidden .cinema-controls:has(select:focus-visible) { opacity:1; visibility:visible; pointer-events:auto; }
@media (prefers-reduced-motion:reduce) { select::picker-icon { transition:none; } }

/* The chart's atmospheric shade remains mounted throughout every journey. */
.cinema-vignette { display:block; }
.cinema-visual { animation:none; }
.cinema-visual::after { background:none; }
.cinema-scene-layer { position:absolute; inset:0; z-index:3; pointer-events:none; }
/* Dissolves change these opacities every frame; their own layers keep that a compositor-only change. */
.cinema-scene-host[data-transitioning=true] :is(.cinema-copy,.cinema-date,.cinema-inset,.cinema-up-next,.cinema-visual > *) { will-change:opacity; }
.cinema-scene-current .cinema-copy,.cinema-scene-current .cinema-inset,.cinema-scene-current .cinema-up-next { pointer-events:auto; }
/* Dissolves are CSS animations, started as the layers mount or change class, so no frame needs
   an Elm view. Elm sets --dissolve (150 ms under reduced motion or calm light) and removes the old
   layer after it; !important keeps that short dissolve through the reduced-motion "animation:none" rule. */
.cinema-scene-host[data-transitioning=true] .cinema-scene-current .cinema-inset { animation:cinema-scene-in var(--dissolve,1.4s) linear both !important; }
.cinema-scene-host[data-transitioning=true] .cinema-scene-current :is(.cinema-copy,.cinema-date,.cinema-up-next) { animation:cinema-copy-arrive var(--dissolve,1.4s) linear both !important; }
.cinema-scene-departing .cinema-visual > :not(.cinema-date) { animation:cinema-scene-out var(--dissolve,1.4s) linear both !important; }
.cinema-scene-departing :is(.cinema-copy,.cinema-date,.cinema-up-next) { animation:cinema-copy-leave var(--dissolve,1.4s) linear both !important; }
/* The incoming inset fades in over the last 85%; captions leave in the first 40% and arrive in the
   last half, each eased with smoothstep (cubic-bezier(1/3,0,2/3,1) is exactly 3t²-2t³). */
@keyframes cinema-scene-in { 0%,15% { opacity:0; } 100% { opacity:1; } }
@keyframes cinema-scene-out { from { opacity:1; } to { opacity:0; } }
@keyframes cinema-copy-leave { 0% { opacity:1; animation-timing-function:cubic-bezier(.3333,0,.6667,1); } 40%,100% { opacity:0; } }
@keyframes cinema-copy-arrive { 0%,50% { opacity:0; animation-timing-function:cubic-bezier(.3333,0,.6667,1); } 100% { opacity:1; } }
.cinema-scene-departing * { pointer-events:none !important; }
.cinema-inset { animation:none; }
.cinema-help button { margin-left:12px; font-size:inherit; min-height:28px; padding:4px 9px; }

select { min-inline-size:0; }
.cinema-inset .cinema-art,.cinema-inset .cinema-map svg { animation:cinema-reveal .65s ease both; }
/* A picture that arrives after its scene is shown fades in once; calm light and reduced motion cut. */
.cinema-art-late { animation:cinema-reveal .65s ease both; }
@media (prefers-reduced-motion:reduce) { .cinema-inset .cinema-art,.cinema-inset .cinema-map svg { animation:none; } }

.is-preparing .cinema-help { position:fixed; right:3.5vw; bottom:12px; padding:7px 12px; margin:0; opacity:1; visibility:visible; pointer-events:auto; background:#112023e6; border-radius:4px; }

/* Up next: the following journey, or this one again, near the final scene's end. */
.cinema-heading { animation:cinema-copy-in 1.1s ease both; }
.cinema-up-next { position:absolute; z-index:5; right:4vw; bottom:11vh; width:min(24vw,520px); padding:clamp(14px,1.6vh,28px); background:#0b1b20e6; border:1px solid #dfc99555; border-radius:5px; box-shadow:0 12px 45px #0007; color:#fff6df; animation:cinema-copy-in 1.1s ease both; }
.cinema-up-next .cinema-eyebrow { font-size:clamp(9px,1vh,18px); margin-bottom:6px; }
.cinema-up-next h3 { margin:0; font:400 clamp(20px,2.4vh,44px)/1.15 var(--serif); }
.cinema-up-next-scene { margin:4px 0 12px; font:clamp(13px,1.4vh,26px)/1.35 var(--serif); color:#e1d2b7; }
.cinema-up-next-meter { height:3px; background:#ffffff26; overflow:hidden; }
.cinema-up-next-meter span { display:block; height:100%; background:#e1c68d; transform-origin:left; transition:transform .25s linear; }
.cinema-up-next-status { display:block; margin:8px 0 12px; font:clamp(10px,1.1vh,20px)/1.3 system-ui,sans-serif; letter-spacing:.08em; color:#e1d2b7; }
.cinema-up-next-actions { display:flex; flex-wrap:wrap; gap:8px; }
.presentation .cinema-up-next-play { background:#e1c68d; color:#152326; border-color:#e1c68d; }
.presentation:not(.controls-hidden) .cinema-up-next { bottom:max(11vh,calc(var(--cinema-footer) + 14px)); }
@media (max-width:759px) {
  /* Covers the phone inset's slot completely, so it is opaque rather than layered over the map. */
  .cinema-up-next { left:6vw; right:6vw; width:auto; top:20vh; bottom:auto; padding:12px; background:#0b1b20; }
  .presentation:not(.controls-hidden) .cinema-up-next { bottom:auto; }
  .cinema-up-next h3 { font-size:19px; }
  .cinema-up-next-scene { font-size:13px; margin-bottom:8px; }
}

/* Light opens around the lit subject: the vignette and ink shader fade out over a soft ellipse. */
#presentation { --lit-x:50%; --lit-y:45%; --lit-rx:0px; --lit-ry:0px; --lit-open:0; }
.cinema-vignette { --lit-mask:radial-gradient(ellipse calc((var(--lit-rx) + 16vmin) * var(--lit-open)) calc((var(--lit-ry) + 16vmin) * var(--lit-open)) at var(--lit-x) var(--lit-y),transparent 40%,#000 100%); }
/* Grain thins rather than vanishing near the subject, over a wider ramp, so its edge is never visible. */
.cinema-shader { --lit-mask:radial-gradient(ellipse calc((var(--lit-rx) + 34vmin) * var(--lit-open)) calc((var(--lit-ry) + 34vmin) * var(--lit-open)) at var(--lit-x) var(--lit-y),#0000004d 20%,#00000080 50%,#000000c0 75%,#000 100%); }
.cinema-vignette,.cinema-shader { -webkit-mask-image:var(--lit-mask); mask-image:var(--lit-mask); }
