*,
*::before,
*::after {
    box-sizing: border-box;
}
* {
    margin: 0;
}
body {
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;

    --base-font-size: 14pt;
}
img,
picture,
video,
canvas,
svg {
    display: block;
    max-width: 100%;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
    hyphens: auto;
}

body {
    margin: 1rem;
    text-rendering: optimizeLegibility;

    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: var(--base-font-size);
}
.page {
    max-width: 60rem;
    margin: 0 auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 3rem 0 0.5rem;
    font-family: "Libre Baskerville", serif;
    font-weight: 400;
    font-style: normal;
}
h1 {
    font-size: calc(3 * var(--base-font-size));
}
h2 {
    font-size: calc(2 * var(--base-font-size));
}
h3 {
    font-size: calc(1.5 * var(--base-font-size));
}
p {
    margin: 1.5rem 0;
    text-align: justify;
}
.photo-section {
    margin: 2rem 0;
}

:lang(zh) {
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    font-variant-east-asian: simplified;
    --base-font-size: 16pt;
}

.lang-switcher {
    text-align: right;
    font-size: 14pt;
    color: #666;
}
.lang-switcher + h1 {
    margin-top: 0;
}

a {
    color: teal;
    text-decoration: none;
}

sup {
    vertical-align: top;
    position: relative;
    top: -0.3rem;
}

a[data-footnote-ref="true"] {
    font-size: calc(0.8 * var(--base-font-size));
    padding: 0 0.1rem;
}

section.footnotes {
    margin-top: 5rem;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* react-photo-album styles. Pulled by hand from source :< */

.react-photo-album {
    display: flex;
}

.react-photo-album--track {
    display: flex;
    align-items: flex-start;
}

.react-photo-album--photo {
    position: relative;
    padding: calc(var(--react-photo-album--padding) * 1px);
}

.react-photo-album--image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: var(--react-photo-album--photo-width) /
        var(--react-photo-album--photo-height);
}

.react-photo-album--button {
    cursor: pointer;
    border: initial;
    background: initial;
}

.react-photo-album--rows {
    flex-direction: column;
    row-gap: calc(var(--react-photo-album--spacing) * 1px);
}

.react-photo-album--rows .react-photo-album--track {
    justify-content: space-between;

    --react-photo-album--track-gaps: calc(
        var(--react-photo-album--spacing) *
            (var(--react-photo-album--track-size) - 1) + 2 *
            var(--react-photo-album--padding) *
            var(--react-photo-album--track-size)
    );
}

.react-photo-album--rows .react-photo-album--photo {
    width: calc(
        (100% - var(--react-photo-album--track-gaps) * 1px) /
            (
                var(--react-photo-album--container-width) -
                    var(--react-photo-album--track-gaps)
            ) * var(--react-photo-album--photo-width) + 2px *
            var(--react-photo-album--padding)
    );
}

/* yet-another-react-lightbox styles. Pulled by hand from source :< */

:root {
    --yarl__color_backdrop: #000;
    --yarl__color_button: rgba(255, 255, 255, 0.8);
    --yarl__color_button_active: #fff;
    --yarl__color_button_disabled: rgba(255, 255, 255, 0.4);
    --yarl__portal_zindex: 9999;
    --yarl__fade_animation_duration: 250ms;
    --yarl__fade_animation_timing_function: ease;
    --yarl__container_background_color: var(--yarl__color_backdrop);
    --yarl__controller_touch_action: none;
    --yarl__controller_overscroll_behavior: contain;
    --yarl__slide_icon_loading_color: var(--yarl__color_button);
    --yarl__slide_icon_error_size: 48px;
    --yarl__slide_icon_error_color: red;
    --yarl__toolbar_padding: 8px;
    --yarl__icon_size: 32px;
    --yarl__button_background_color: transparent;
    --yarl__button_border: 0;
    --yarl__button_margin: 0;
    --yarl__button_padding: 8px;
    --yarl__button_filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.8));
    --yarl__navigation_button_padding: calc(16px + 16px) calc(8px + 8px);
}

.yarl__fullsize {
    width: 100%;
    height: 100%;
}

.yarl__relative {
    position: relative;
}

.yarl__portal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    overflow: hidden;
    z-index: var(--yarl__portal_zindex);
    transition: opacity var(--yarl__fade_animation_duration)
        var(--yarl__fade_animation_timing_function);
}

.yarl__portal_open {
    opacity: 1;
}

.yarl__container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    background-color: var(--yarl__container_background_color);
    outline: none;
    user-select: none;
    touch-action: var(--yarl__controller_touch_action);
    overscroll-behavior: var(--yarl__controller_overscroll_behavior);
}

.yarl__carousel {
    display: flex;
    flex: 0 0 auto;
    height: 100%;
    align-content: center;
    justify-content: center;
    align-items: stretch;
    width: calc(
        100% + (var(--yarl__carousel_slides_count) - 1) *
            (
                100% + var(--yarl__carousel_spacing_px, 0) * 1px +
                    var(--yarl__carousel_spacing_percent, 0) * 1%
            )
    );
    transform: translate(
        var(--yarl__swipe_offset, 0px),
        var(--yarl__pull_offset, 0px)
    );
    opacity: var(--yarl__pull_opacity, 1);
}

.yarl__carousel_with_slides {
    column-gap: calc(
        var(--yarl__carousel_spacing_px, 0) * 1px + 100 /
            (
                100 * var(--yarl__carousel_slides_count) +
                    (var(--yarl__carousel_slides_count) - 1) *
                    var(--yarl__carousel_spacing_percent, 0)
            ) * var(--yarl__carousel_spacing_percent, 0) * 1%
    );
}

.yarl__flex_center {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.yarl__slide {
    flex: 1;
    position: relative;
    overflow: hidden;
    padding: calc(
        var(--yarl__carousel_padding_px, 0) * 1px + 100 /
            (
                100 * var(--yarl__carousel_slides_count) +
                    (var(--yarl__carousel_slides_count) - 1) *
                    var(--yarl__carousel_spacing_percent, 0)
            ) * var(--yarl__carousel_padding_percent, 0) * 1%
    );
}

[dir="rtl"] .yarl__slide {
    --yarl__direction: -1;
}

.yarl__slide_image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    touch-action: var(--yarl__controller_touch_action);
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.yarl__slide_image_cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yarl__slide_image_loading {
    opacity: 0;
}

@media screen and (min-width: 800px) {
    .yarl__slide_wrapper:not(.yarl__slide_wrapper_interactive)
        .yarl__slide_image {
        -webkit-transform: translateZ(0);
        -webkit-backface-visibility: hidden;
        -webkit-transform-style: preserve-3d;
    }
}

.yarl__slide_placeholder {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    line-height: 0;
}

.yarl__slide_loading {
    color: var(--yarl__slide_icon_loading_color);
    animation: yarl__delayed_fadein 1s linear;
}

.yarl__slide_loading line {
    animation: yarl__stroke_opacity 1s linear infinite;
}

.yarl__slide_loading line:nth-of-type(1) {
    animation-delay: -0.875s;
}
.yarl__slide_loading line:nth-of-type(2) {
    animation-delay: -0.75s;
}
.yarl__slide_loading line:nth-of-type(3) {
    animation-delay: -0.625s;
}
.yarl__slide_loading line:nth-of-type(4) {
    animation-delay: -0.5s;
}
.yarl__slide_loading line:nth-of-type(5) {
    animation-delay: -0.375s;
}
.yarl__slide_loading line:nth-of-type(6) {
    animation-delay: -0.25s;
}
.yarl__slide_loading line:nth-of-type(7) {
    animation-delay: -0.125s;
}
.yarl__slide_loading line:nth-of-type(8) {
    animation-delay: 0s;
}

.yarl__slide_error {
    width: var(--yarl__slide_icon_error_size);
    height: var(--yarl__slide_icon_error_size);
    color: var(--yarl__slide_icon_error_color);
}

@media (prefers-reduced-motion) {
    .yarl__portal,
    .yarl__slide {
        transition: unset;
    }

    .yarl__slide_loading,
    .yarl__slide_loading line {
        animation: unset;
    }
}

.yarl__toolbar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: auto;
    left: auto;
    display: flex;
    justify-content: flex-end;
    padding: var(--yarl__toolbar_padding);
}

[dir="rtl"] .yarl__toolbar {
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
}

.yarl__icon {
    width: var(--yarl__icon_size);
    height: var(--yarl__icon_size);
}

.yarl__button {
    cursor: pointer;
    appearance: none;
    background-color: var(--yarl__button_background_color);
    border: var(--yarl__button_border);
    margin: var(--yarl__button_margin);
    outline: none;
    line-height: 0;
    padding: var(--yarl__button_padding);
    color: var(--yarl__color_button);
    filter: var(--yarl__button_filter);
    -webkit-tap-highlight-color: transparent;
}

.yarl__button:focus {
    color: var(--yarl__color_button_active);
}

.yarl__button:focus:not(:focus-visible) {
    color: var(--yarl__color_button);
}

.yarl__button:focus-visible {
    color: var(--yarl__color_button_active);
}

@media (hover: hover) {
    .yarl__button:hover,
    .yarl__button:focus:hover,
    .yarl__button:focus-visible:hover {
        color: var(--yarl__color_button_active);
    }
}

.yarl__button:disabled {
    color: var(--yarl__color_button_disabled);
    cursor: default;
}

.yarl__navigation_prev,
.yarl__navigation_next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding: var(--yarl__navigation_button_padding);
}

.yarl__navigation_prev {
    left: 0;
}

[dir="rtl"] .yarl__navigation_prev {
    left: unset;
    right: 0;
    transform: translateY(-50%) rotate(180deg);
}

.yarl__navigation_next {
    right: 0;
}

[dir="rtl"] .yarl__navigation_next {
    left: 0;
    right: unset;
    transform: translateY(-50%) rotate(180deg);
}

.yarl__no_scroll {
    height: 100%;
    overflow: hidden;
    overscroll-behavior: none;
}

@keyframes yarl__delayed_fadein {
    0% {
        opacity: 0;
    }
    80% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes yarl__stroke_opacity {
    from {
        stroke-opacity: 1;
    }
    to {
        stroke-opacity: 0.125;
    }
}
