@charset "UTF-8";
html { -webkit-text-size-adjust: none; font-size: 18px; }

body { margin: 0; }

section#main { box-sizing: border-box; max-width: 620px; margin: 0 auto; padding: 0 20px; }

.blog-item { font-size: 1rem; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; margin-bottom: 40px; }
.blog-item a { text-decoration: none; border-bottom: 1px solid #595E66; color: inherit; }
@media (prefers-color-scheme: dark) { .blog-item a { border-bottom-color: #92979F; } }
.blog-item a:hover { color: #b55400; border-bottom-color: #b55400; }
@media (prefers-color-scheme: dark) { .blog-item a:hover { color: #E67B1E; border-bottom-color: #E67B1E; } }
.blog-item .heading { margin-top: 12px; }
.blog-item .heading .title { font-family: Charter, Palatino, Cambria, Times, "Source-Han-Serif-SC", SimSun, serif; font-size: 2rem; font-weight: 900; line-height: 1.35em; margin: 0; padding: 10px 0; color: #222831; }
@media (prefers-color-scheme: dark) { .blog-item .heading .title { color: #E3E7EF; } }
.blog-item .heading .title .subtitle { display: block; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; font-size: 1.25rem; font-weight: 500; line-height: 1.35em; }
.blog-item .heading .meta { font-size: 0.75rem; color: #595E66; }
@media (prefers-color-scheme: dark) { .blog-item .heading .meta { color: #92979F; } }
.blog-item .heading a { color: inherit; text-decoration: none; }
.blog-item .heading a:hover .title, .blog-item .heading a:hover .meta { color: #b55400; }
@media (prefers-color-scheme: dark) { .blog-item .heading a:hover .title, .blog-item .heading a:hover .meta { color: #E67B1E; } }
.blog-item .body { font-family: Charter, Palatino, Cambria, Times, "Source-Han-Serif-SC", SimSun, serif; font-size: 1rem; line-height: 1.5em; /* ------- TABLES -------- */ }
.blog-item .body strong { font-weight: 900; }
.blog-item .body img, .blog-item .body video { width: 100%; }
.blog-item .body h2 { font-size: 1.5rem; line-height: 1.35em; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; margin-top: 50px; border-left: 10px solid #222831; margin-left: -20px; padding-left: 10px; }
@media (prefers-color-scheme: dark) { .blog-item .body h2 { border-left-color: #E3E7EF; } }
.blog-item .body h3 { font-size: 1.25rem; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; line-height: 1.35em; margin: 30px 0 0; }
.blog-item .body hr { width: 50%; min-width: 240px; height: 1px; border: none; background-color: #595E66; margin: 60px auto; }
@media (prefers-color-scheme: dark) { .blog-item .body hr { background-color: #92979F; } }
.blog-item .body blockquote { padding: 0 0 0 10px; margin: 0; border-left: 10px solid #eeeeee; }
@media (prefers-color-scheme: dark) { .blog-item .body blockquote { border-left-color: #3d3d3d; } }
.blog-item .body ul, .blog-item .body ol { padding-inline-start: 2em; }
.blog-item .body sup { line-height: 0em; }
.blog-item .body sup a { border-bottom-style: none; }
.blog-item .body iframe.youtube-16-by-9 { width: 100%; height: 56vw; max-height: 300px; }
.blog-item .body img.blog-ios-app-icon { mask-size: cover; mask-image: url("/assets/res/styles/mask-ios-app-icon.svg"); -webkit-mask-size: cover; -webkit-mask-image: url("/assets/res/styles/mask-ios-app-icon.svg"); width: 160px; margin: 20px 30px 30px 20px; float: left; }
@media (max-width: 620px) { .blog-item .body img.blog-ios-app-icon { width: 100px; margin: 10px 20px 20px 10px; } }
.blog-item .body img.blog-mac-app-icon { mask-size: cover; mask-image: url("/assets/res/styles/mask-mac-app-icon.svg"); -webkit-mask-size: cover; -webkit-mask-image: url("/assets/res/styles/mask-mac-app-icon.svg"); width: 200px; margin: 0 10px 10px 0; float: left; }
@media (max-width: 620px) { .blog-item .body img.blog-mac-app-icon { width: 120px; margin: 0 10px 10px 0; } }
.blog-item .body img.blog-book-cover, .blog-item .body img.blog-poster { width: 160px; margin: 0 0 20px 20px; float: right; box-shadow: 0px 10px 10px -10px rgba(0, 0, 0, 0.5), 0 2px 8px -3px rgba(0, 0, 0, 0.5); }
@media (max-width: 620px) { .blog-item .body img.blog-book-cover, .blog-item .body img.blog-poster { float: none; margin: 0 auto; } }
.blog-item .body img.inline { width: 40%; }
.blog-item .body figure { margin: 1em 0; width: 100%; background-color: #eeeeee; }
@media (prefers-color-scheme: dark) { .blog-item .body figure { background-color: #3d3d3d; } }
.blog-item .body figure img, .blog-item .body figure video { width: revert; display: block; margin: 0 auto; max-width: 100%; }
@media (min-width: 360px) { .blog-item .body figure img, .blog-item .body figure video { max-height: 95vh; min-height: 200px; } }
.blog-item .body caption, .blog-item .body figure figcaption { font-size: 0.75rem; line-height: 1.35em; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; color: #595E66; background-color: #ffffff; font-style: normal; display: block; padding: 10px 0; margin: 0; font-weight: normal; }
@media (prefers-color-scheme: dark) { .blog-item .body caption, .blog-item .body figure figcaption { color: #92979F; background-color: #222222; } }
.blog-item .body .footnotes { font-size: 0.75rem; line-height: 1.5em; margin: 40px 0; }
.blog-item .body .footnotes ol { padding-inline-start: 2em; }
.blog-item .body .footnotes:first-of-type:before { font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; color: #595E66; content: "尾注"; display: block; }
@media (prefers-color-scheme: dark) { .blog-item .body .footnotes:first-of-type:before { color: #92979F; } }
.blog-item .body table { color: #222831; border-top: 1px solid #595E66; border-bottom: 1px solid #595E66; width: 100%; -webkit-border-horizontal-spacing: 0; -webkit-border-vertical-spacing: 0; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; font-size: 0.8rem; line-height: 1.45em; }
@media (prefers-color-scheme: dark) { .blog-item .body table { color: #E3E7EF; border-top: 1px solid #92979F; border-bottom: 1px solid #92979F; } }
.blog-item .body table td, .blog-item .body table th { padding: 4px 6px; }
.blog-item .body table thead th { border-bottom: 1px solid #595E66; }
@media (prefers-color-scheme: dark) { .blog-item .body table thead th { border-bottom: 1px solid #92979F; } }
.blog-item .body table tbody tr:nth-of-type(2n+1) { background: #ffffff; }
@media (prefers-color-scheme: dark) { .blog-item .body table tbody tr:nth-of-type(2n+1) { background: #222222; } }
.blog-item .footing { margin-top: 60px; font-size: 0.75rem; }
.blog-item .footing .post-tags { list-style-type: none; padding: 0; padding-inline-start: 0; display: flex; flex-wrap: wrap; gap: 12px; margin: 10px 0; }
.blog-item .footing .post-tags .post-tag { display: block; }
.blog-item .footing .post-tags .post-tag a { border: none; }
.blog-item .footing .permalink a { font-weight: bold; border: none; }
.blog-item .footing .endnote { color: #595E66; font-size: 0.75rem; line-height: 1.5em; }
@media (prefers-color-scheme: dark) { .blog-item .footing .endnote { color: #92979F; } }
.blog-item .footing .endnote ol { padding-inline-start: 2em; }
.blog-item .footing .pagination { margin-top: 30px; }
.blog-item .footing .pagination a { color: inherit; display: block; border: none; }
.blog-item .footing .pagination a:hover { color: #b55400; }
@media (prefers-color-scheme: dark) { .blog-item .footing .pagination a:hover { color: #E67B1E; } }
.blog-item .footing .pagination h1 { font-family: Charter, Palatino, Cambria, Times, "Source-Han-Serif-SC", SimSun, serif; font-weight: 900; line-height: 1.35em; font-size: 1.75rem; margin: 20px 0; }
.blog-item .footing .pagination h1.related { margin: 15px 0; }
.blog-item .footing .pagination h1.related:nth-of-type(n+1) { margin-top: 0; }
.blog-item .footing .pagination h1.related:first-of-type:before { content: "相关文章"; }
.blog-item .footing .pagination h1.previous:before { content: "上一篇"; }
.blog-item .footing .pagination h1.next:before { content: "下一篇"; }
.blog-item .footing .pagination h1:before { font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; display: block; font-size: 0.75rem; font-weight: normal; line-height: 1rem; color: #595E66; margin-bottom: 10px; margin-top: 40px; }
@media (prefers-color-scheme: dark) { .blog-item .footing .pagination h1:before { color: #92979F; } }

section#main .blog-list, section#home-blog .post-list { width: 100%; }
section#main .blog-list .year-month, section#main .blog-list .year, section#home-blog .post-list .year-month, section#home-blog .post-list .year { font-size: 36px; font-weight: bold; color: #222831; margin: 24px 0 0; }
@media (prefers-color-scheme: dark) { section#main .blog-list .year-month, section#main .blog-list .year, section#home-blog .post-list .year-month, section#home-blog .post-list .year { color: #E3E7EF; } }
section#main .blog-list .year-month:first-of-type, section#main .blog-list .year:first-of-type, section#home-blog .post-list .year-month:first-of-type, section#home-blog .post-list .year:first-of-type { margin-top: 0; }
section#main .blog-list .item, section#home-blog .post-list .item { align-content: start; margin: -4px 0; display: block; color: #222831; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item, section#home-blog .post-list .item { color: #E3E7EF; } }
section#main .blog-list .item .content, section#home-blog .post-list .item .content { display: flex; padding: 16px 0; }
section#main .blog-list .item .content .thumbnail-container, section#home-blog .post-list .item .content .thumbnail-container { width: 72px; height: 72px; margin-top: 4px; margin-right: 12px; background-position: center; background-size: cover; flex-shrink: 0; background-color: #eeeeee; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .thumbnail-container, section#home-blog .post-list .item .content .thumbnail-container { background-color: #3d3d3d; } }
section#main .blog-list .item .content .thumbnail-container .thumbnail, section#home-blog .post-list .item .content .thumbnail-container .thumbnail { width: 100%; height: 100%; background-color: #595E66; mask-repeat: no-repeat; mask-position: center; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .thumbnail-container .thumbnail, section#home-blog .post-list .item .content .thumbnail-container .thumbnail { background-color: #92979F; } }
section#main .blog-list .item .content .thumbnail-container .link-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .link-thumbnail { mask-image: url("/assets/icons/link.svg"); }
section#main .blog-list .item .content .thumbnail-container .travel-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .travel-thumbnail { mask-image: url("/assets/icons/navigation.svg"); }
section#main .blog-list .item .content .thumbnail-container .trails-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .trails-thumbnail { mask-image: url("/assets/icons/map.svg"); }
section#main .blog-list .item .content .thumbnail-container .books-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .books-thumbnail { mask-image: url("/assets/icons/book.svg"); }
section#main .blog-list .item .content .thumbnail-container .games-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .games-thumbnail { mask-image: url("/assets/icons/coffee.svg"); }
section#main .blog-list .item .content .thumbnail-container .music-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .music-thumbnail { mask-image: url("/assets/icons/music.svg"); }
section#main .blog-list .item .content .thumbnail-container .movies-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .movies-thumbnail { mask-image: url("/assets/icons/film.svg"); }
section#main .blog-list .item .content .thumbnail-container .text-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .text-thumbnail { mask-image: url("/assets/icons/align-left.svg"); }
section#main .blog-list .item .content .thumbnail-container .photo-thumbnail, section#home-blog .post-list .item .content .thumbnail-container .photo-thumbnail { mask-image: none; background-size: cover; background-position: center; }
section#main .blog-list .item .content .text, section#home-blog .post-list .item .content .text { width: 100%; }
section#main .blog-list .item .content .text .title, section#home-blog .post-list .item .content .text .title { line-height: 1.4em; font-size: 1.25rem; font-weight: 900; margin: 0; font-family: Charter, Palatino, Cambria, Times, "Source-Han-Serif-SC", SimSun, serif; }
section#main .blog-list .item .content .text .subtitle, section#home-blog .post-list .item .content .text .subtitle { line-height: 1.4em; font-size: 0.8rem; font-weight: bold; margin: 0; font-family: -apple-system, "Helvetica Neue", Helvatica, Verdana, Arial, "Source-Han-Sans-SC", "Heiti SC", Heiti, sans; color: #222831; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .text .subtitle, section#home-blog .post-list .item .content .text .subtitle { color: #E3E7EF; } }
section#main .blog-list .item .content .text .stats, section#home-blog .post-list .item .content .text .stats { display: flex; gap: 12px; }
section#main .blog-list .item .content .text .stats .stats-ratings, section#home-blog .post-list .item .content .text .stats .stats-ratings { color: #ff4500; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .text .stats .stats-ratings, section#home-blog .post-list .item .content .text .stats .stats-ratings { color: #ff6644; } }
section#main .blog-list .item .content .text .meta, section#home-blog .post-list .item .content .text .meta { font-size: 0.8rem; margin-top: 2px; color: #595E66; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .text .meta, section#home-blog .post-list .item .content .text .meta { color: #92979F; } }
section#main .blog-list .item .content .text .meta .location, section#home-blog .post-list .item .content .text .meta .location { padding: 2px 6px; background-color: #eeeeee; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .text .meta .location, section#home-blog .post-list .item .content .text .meta .location { background-color: #3d3d3d; } }
section#main .blog-list .item .content .text .preview, section#home-blog .post-list .item .content .text .preview { font-size: 10pt; line-height: 1.45em; margin-top: 8px; color: #595E66; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .text .preview, section#home-blog .post-list .item .content .text .preview { color: #92979F; } }
section#main .blog-list .item .content .text .preview .read-more, section#home-blog .post-list .item .content .text .preview .read-more { display: inline-block; font-weight: bold; color: #222831; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item .content .text .preview .read-more, section#home-blog .post-list .item .content .text .preview .read-more { color: #E3E7EF; } }
section#main .blog-list .item + .item:before, section#home-blog .post-list .item + .item:before { content: ""; margin-left: 84px; display: block; height: 1px; background-color: #eeeeee; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item + .item:before, section#home-blog .post-list .item + .item:before { background-color: #3d3d3d; } }
section#main .blog-list .item-hidden .content, section#home-blog .post-list .item-hidden .content { filter: saturate(0); opacity: 0.25; }
section#main .blog-list .item:hover .content .text .preview, section#main .blog-list .item:hover .content .text .meta, section#home-blog .post-list .item:hover .content .text .preview, section#home-blog .post-list .item:hover .content .text .meta { color: #222831; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item:hover .content .text .preview, section#main .blog-list .item:hover .content .text .meta, section#home-blog .post-list .item:hover .content .text .preview, section#home-blog .post-list .item:hover .content .text .meta { color: #E3E7EF; } }
section#main .blog-list .item:hover .content .text .preview .read-more, section#main .blog-list .item:hover .content .text .title, section#main .blog-list .item:hover .content .text .subtitle, section#home-blog .post-list .item:hover .content .text .preview .read-more, section#home-blog .post-list .item:hover .content .text .title, section#home-blog .post-list .item:hover .content .text .subtitle { color: #b55400; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item:hover .content .text .preview .read-more, section#main .blog-list .item:hover .content .text .title, section#main .blog-list .item:hover .content .text .subtitle, section#home-blog .post-list .item:hover .content .text .preview .read-more, section#home-blog .post-list .item:hover .content .text .title, section#home-blog .post-list .item:hover .content .text .subtitle { color: #E67B1E; } }
section#main .blog-list .item-large, section#home-blog .post-list .item-large { margin-top: 16px; }
section#main .blog-list .item-large .content, section#home-blog .post-list .item-large .content { flex-direction: column; padding: 0; }
section#main .blog-list .item-large .content .image-container .image, section#home-blog .post-list .item-large .content .image-container .image { height: 0px; padding-top: 61.8%; background-size: cover; background-position: center; background-repeat: no-repeat; }
section#main .blog-list .item-large .content .text, section#home-blog .post-list .item-large .content .text { padding: 12px; background-color: #eeeeee; box-sizing: border-box; }
@media (prefers-color-scheme: dark) { section#main .blog-list .item-large .content .text, section#home-blog .post-list .item-large .content .text { background-color: #3d3d3d; } }
section#main .blog-list .item-large .content .text .subtitle, section#home-blog .post-list .item-large .content .text .subtitle { text-transform: revert; }
section#main .blog-list .item-large .content .text .preview, section#home-blog .post-list .item-large .content .text .preview { font-size: 0.85rem; }

section#home-blog, section#main .blog-navigation { border-bottom: 1px solid #eeeeee; margin-bottom: 20px; }
@media (prefers-color-scheme: dark) { section#home-blog, section#main .blog-navigation { border-bottom-color: #3d3d3d; } }
section#home-blog .blog-navigation-section, section#main .blog-navigation .blog-navigation-section { margin: 20px 0; }
section#home-blog .blog-navigation-section .title, section#main .blog-navigation .blog-navigation-section .title { margin: 0; }
section#home-blog .blog-navigation-section ul.items, section#main .blog-navigation .blog-navigation-section ul.items { list-style-type: none; padding: 0; padding-inline-start: 0; display: flex; flex-wrap: wrap; gap: 12px; margin: 10px 0; }
section#home-blog .blog-navigation-section ul.items li, section#main .blog-navigation .blog-navigation-section ul.items li { display: block; }
section#home-blog .blog-navigation-section ul.items li a:hover, section#main .blog-navigation .blog-navigation-section ul.items li a:hover { color: #b55400; }
@media (prefers-color-scheme: dark) { section#home-blog .blog-navigation-section ul.items li a:hover, section#main .blog-navigation .blog-navigation-section ul.items li a:hover { color: #E67B1E; } }
section#home-blog .blog-navigation-section ul.items li a.item-active, section#main .blog-navigation .blog-navigation-section ul.items li a.item-active { pointer-events: none; color: #b55400; border-bottom: 1px solid #b55400; }
@media (prefers-color-scheme: dark) { section#home-blog .blog-navigation-section ul.items li a.item-active, section#main .blog-navigation .blog-navigation-section ul.items li a.item-active { color: #E67B1E; } }
@media (prefers-color-scheme: dark) { section#home-blog .blog-navigation-section ul.items li a.item-active, section#main .blog-navigation .blog-navigation-section ul.items li a.item-active { border-bottom-color: #E67B1E; } }
section#home-blog .blog-navigation-section .numeric, section#main .blog-navigation .blog-navigation-section .numeric { font-variant-numeric: tabular-nums; }

section#home-blog { margin-bottom: 20px; border: none; }
section#home-blog .blog-navigation-section { margin: 0 0 20px; }