/* 00-tokens.css */ /* Structural tokens. Colour and font tokens are emitted into from the theme configuration (see scripts/helpers.js: theme_tokens_css). */ :root { --theme-color: var(--masthead); --column-width: 760px; /* content pages and mastheads */ --reading-width: 39.667rem; /* article text column (634.67px at the 1280px reference width) */ --photo-width: 1080px; /* posts with several photographs */ --wide-width: 1160px; /* wide pages such as a gallery */ --masthead-height: 216px; --masthead-height-mobile: 176px; } .home-root { --theme-color: var(--home-nav); } /* 01-base.css */ /* Minimal base: only the defaults that shape the visible design. */ *, *::before, *::after { box-sizing: border-box; } html { font-size: 16px; letter-spacing: var(--letter-spacing, 0.02em); -webkit-text-size-adjust: 100%; } html, body { height: 100%; } body { margin: 0; color: var(--text); background-color: var(--paper); font-family: var(--font-ui); font-size: 1rem; font-weight: 400; line-height: 1.5; text-align: left; overflow-wrap: break-word; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out; } body.mobile-menu-open, body.lightbox-open, body.search-dialog-open { overflow: hidden; } [hidden] { display: none !important; } h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; } h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } h3 { font-size: 1.75rem; } h4 { font-size: 1.5rem; } h5 { font-size: 1.25rem; } h6 { font-size: 1rem; } p { margin-top: 0; margin-bottom: 1rem; } ul, ol, dl { margin-top: 0; margin-bottom: 1rem; } ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; } figure { margin: 1rem 0; } img { max-width: 100%; vertical-align: middle; border-style: none; filter: brightness(var(--image-brightness, 1)); transition: filter 0.2s ease-in-out; } svg { overflow: hidden; vertical-align: middle; } a { color: var(--text); text-decoration: none; background-color: transparent; cursor: pointer; transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out; } a:hover { color: var(--link-hover); text-decoration: none; } strong, b { font-weight: bolder; } small { font-size: 80%; } sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } hr { box-sizing: content-box; height: 0; margin: 1rem 0; overflow: visible; background-color: initial; border: 0; border-top: 1px solid var(--line); transition: border-top-color 0.2s ease-in-out; } code, kbd, pre, samp { font-family: var(--font-mono); font-size: 1em; } pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; } code { color: inherit; overflow-wrap: break-word; } table { color: var(--prose); font-size: inherit; border-collapse: collapse; } th { text-align: inherit; } button, input, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } button { border-radius: 0; text-transform: none; -webkit-appearance: button; appearance: button; cursor: pointer; } label { margin-bottom: 0; } ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-thumb { background-color: var(--scrollbar); border-radius: 6px; } ::-webkit-scrollbar-thumb:hover { background-color: var(--scrollbar-hover); } ::-webkit-scrollbar-corner { background-color: transparent; } .icon { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .noscript-warning { position: fixed; bottom: 0; left: 0; z-index: 99; width: 100%; padding: 0.5rem; color: #fff; background-color: #b3453c; font-family: sans-serif; font-size: 1rem; font-weight: bold; text-align: center; } /* 10-nav.css */ /* Site navigation: transparent over the masthead, solid once scrolled; a full-screen text menu below 992px. */ .site-header { position: relative; } .site-nav { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; padding: 0.5rem 1rem; background-color: transparent; font-size: 0.875rem; line-height: 1.5; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; will-change: background, padding; } @media (min-width: 600px) { .site-nav { padding-top: 12px; padding-bottom: 12px; } } .site-nav--solid, .site-nav--open { background-color: var(--masthead); } .site-nav--solid { padding-top: 5px; padding-bottom: 5px; } .home-page .site-nav { background-color: var(--home-nav); } .site-nav__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 15px; } .site-nav__brand { display: inline-block; margin-right: 1rem; padding: 0.3125rem 0; color: var(--nav-text); font-size: 1.25rem; font-weight: bold; line-height: inherit; white-space: nowrap; } .site-nav__brand:hover, .site-nav__brand:focus-visible { color: var(--nav-text); } .site-nav__toggle { display: none; margin: 0; padding: 0.25rem 0.75rem; background: transparent; border: 0; font-size: 1.25rem; line-height: 1; } .site-nav__burger { position: relative; display: block; width: 30px; height: 20px; transform: rotate(0deg); transition: 0.5s ease-in-out; } .site-nav__burger span { position: absolute; left: 0; display: block; width: 100%; height: 3px; background: var(--nav-text); border-radius: 9px; opacity: 1; transform: rotate(0deg); transition: 0.25s ease-in-out; } .site-nav__burger span:nth-child(1) { top: 0; } .site-nav__burger span:nth-child(2) { top: 10px; } .site-nav__burger span:nth-child(3) { top: 20px; } .site-nav--open .site-nav__burger span:nth-child(1) { top: 11px; transform: rotate(135deg); } .site-nav--open .site-nav__burger span:nth-child(2) { left: -60px; opacity: 0; } .site-nav--open .site-nav__burger span:nth-child(3) { top: 11px; transform: rotate(-135deg); } .site-menu { display: flex; flex-direction: row; align-items: center; margin: 0 0 0 auto; padding: 0; list-style: none; text-align: center; } .site-menu__entry { position: relative; } .site-menu__item, .scheme-toggle { position: relative; display: block; padding: 0.5rem; color: var(--nav-text); letter-spacing: 0.055em; transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out; } .site-menu__item:hover, .site-menu__item:focus-visible { color: var(--accent); } .site-menu__label { position: relative; } .site-menu__label::after { position: absolute; right: 0; bottom: -0.28rem; left: 0; height: 1px; background: currentColor; content: ""; opacity: 0; transform: scaleX(0.35); transition: opacity 160ms ease, transform 160ms ease; } .site-menu__item:hover .site-menu__label::after, .site-menu__item:focus-visible .site-menu__label::after { opacity: 0.9; transform: scaleX(1); } .site-menu__icon { display: none; } .scheme-toggle { margin: 0; background: transparent; border: 0; font: inherit; line-height: inherit; letter-spacing: 0; } .scheme-toggle:hover, .scheme-toggle:focus-visible { color: var(--nav-text); } .scheme-toggle__icon { display: inline-block; width: 0.875rem; height: 0.875rem; margin: 0 0.2rem; vertical-align: -0.125em; } .scheme-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; } @media (max-width: 1199.98px) { .site-nav__inner { max-width: 960px; } } @media (max-width: 991.98px) { .site-nav__inner { max-width: 720px; padding: 0; } .site-nav__toggle { display: block; } .site-menu { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1029; display: block; margin: 0; padding: 4.4rem 0 2rem; overflow-y: auto; -webkit-overflow-scrolling: touch; background-color: var(--masthead); text-align: left; opacity: 0; pointer-events: none; visibility: hidden; transform: translateY(-12px); transition: opacity 0.18s ease, transform 0.18s ease; will-change: opacity, transform; } .home-page .site-menu { background-color: var(--home-nav); } .site-nav--open .site-menu { opacity: 1; pointer-events: auto; visibility: visible; transform: translateY(0); } .site-menu__entry { width: min(100% - 2rem, 30rem); margin: 0 auto; } .site-nav--open .site-menu__entry { animation: site-menu-entry-in 0.18s ease both; } .site-menu__item, .scheme-toggle { display: flex; align-items: center; justify-content: flex-start; width: 100%; min-height: 0; padding: 0.95rem 0.15rem; background: transparent; border-bottom: 1px solid rgba(255, 255, 255, 0.14); border-radius: 0; color: var(--nav-text); letter-spacing: 0; text-align: left; } .site-menu__item:hover, .site-menu__item:active, .site-menu__item:focus-visible, .scheme-toggle:hover, .scheme-toggle:active { color: var(--nav-text); background: rgba(255, 255, 255, 0.055); } .site-menu__label, .scheme-toggle__label { position: static; width: auto; height: auto; overflow: visible; clip: auto; font-size: 0.92rem; letter-spacing: 0.055em; line-height: 1.2; text-align: left; white-space: normal; } .site-menu__label::after { display: none; } .site-menu__icon, .scheme-toggle__icon { display: inline-block; order: 2; width: 1rem; height: 1rem; margin: 0 0 0 auto; vertical-align: middle; } } @media (max-width: 767px) { .site-nav { font-size: 1rem; line-height: 2.5rem; } .site-nav__inner { max-width: 540px; } } @media (max-width: 575.98px) { .site-nav__inner { max-width: none; } } @keyframes site-menu-entry-in { from { opacity: 0; transform: scale(0.82) translateY(10px); } to { opacity: 1; transform: scale(1) translateY(0); } } @media (prefers-reduced-motion: reduce) { .site-nav, .site-menu, .site-nav__burger, .site-nav__burger span, .site-menu__label::after { transition: none; } .site-nav--open .site-menu__entry { animation: none; } } /* 20-masthead.css */ /* Editorial masthead: a solid band with the page title resting on its baseline. */ .masthead { position: relative; display: flex; align-items: flex-end; justify-content: center; height: var(--masthead-height); padding: 0 0 2.65rem; overflow: hidden; background: var(--masthead); cursor: default; } .masthead__inner { width: min(100% - 2rem, var(--column-width)); margin: 0; color: var(--masthead-text); text-align: left; overflow-wrap: break-word; } .masthead__title { margin: 0; color: inherit; font-family: var(--font-ui); font-size: clamp(1.72rem, 2.15vw, 2.05rem); font-weight: 400; letter-spacing: 0.035em; line-height: 1.25; } .masthead__inner::after { display: block; width: 2.75rem; height: 1px; margin-top: 0.95rem; background: var(--masthead-line); content: ""; } @media (max-width: 767px) { .masthead { height: var(--masthead-height-mobile); padding-bottom: 1.9rem; } .masthead__title { font-size: 1.5rem; } .masthead__inner::after { width: 2.25rem; margin-top: 0.75rem; } } /* 30-home.css */ /* Home: a fixed full-viewport cover with a typed slogan, then a grid of square cards. */ html.home-root, body.home-page { background: var(--home-bg); overscroll-behavior-y: none; } .home-page { min-height: 100%; --home-navbar-height: 3.5rem; --home-edge-gap: clamp(0.75rem, 2vh, 1rem); --home-card-gap: clamp(0.625rem, 1.5vh, 0.875rem); --home-card-size: clamp( 9.5rem, calc( ( 100vh - var(--home-navbar-height) - var(--home-edge-gap) - var(--home-edge-gap) - var(--home-card-gap) - var(--home-card-gap) ) / 3 ), 13.5rem ); --home-card-size: clamp( 9.5rem, calc( ( 100svh - var(--home-navbar-height) - var(--home-edge-gap) - var(--home-edge-gap) - var(--home-card-gap) - var(--home-card-gap) ) / 3 ), 13.5rem ); } .home-page .site-header { position: relative; z-index: auto; height: 100vh; height: 100svh; } .home-page .site-nav { z-index: 1030; -webkit-backdrop-filter: none; backdrop-filter: none; } .home-cover { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; width: 100%; height: 100vh; height: 100svh; overflow: hidden; background-color: var(--home-bg); background-repeat: no-repeat; background-position: center center; background-size: cover; cursor: default; } .home-cover__mask { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: linear-gradient( 180deg, rgba(3, 15, 25, 0.3) 0%, rgba(3, 15, 25, 0.1) 45%, rgba(3, 15, 25, 0.28) 100% ); } .home-cover__slogan { width: 80%; max-width: calc(960px - 6rem); color: var(--home-slogan, #fff); text-align: center; text-shadow: 0 2px 22px rgba(2, 13, 22, 0.75); overflow-wrap: break-word; transition: opacity 260ms ease, transform 260ms ease; } .home-cover__text { margin: 0 0 0.5rem; font-size: 2rem; font-weight: 500; line-height: 1.2; } .typed-cursor { margin: 0 0.2rem; } @media (max-width: 767px) { #subtitle, .home-slogan-static, .typed-cursor { font-size: 1.5rem; } } @media (max-width: 575px) { .home-cover__slogan { font-size: 0.9rem; } #subtitle, .home-slogan-static, .typed-cursor { font-size: 1.35rem; } } .home-page--scrolled .home-cover__slogan { opacity: 0; transform: translateY(-1.25rem); } .home-main { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; min-height: 100vh; min-height: 100svh; padding: calc(var(--home-navbar-height) + var(--home-edge-gap)) 0 var(--home-edge-gap); background: transparent; } .home-main__inner { width: min(100% - 2rem, 1180px); margin: 0 auto; } .home-grid { display: grid; grid-template-columns: repeat(4, var(--home-card-size)); grid-template-rows: repeat(3, var(--home-card-size)); grid-auto-flow: column; gap: var(--home-card-gap); align-items: start; justify-content: start; direction: ltr; width: 100%; } .index-card { position: relative; display: flex; flex-direction: column; justify-content: flex-start; width: 100%; aspect-ratio: 1; margin: 0; padding: clamp(1rem, 2.3vh, 1.25rem); overflow: hidden; direction: ltr; background: var(--home-card); border: 0; border-radius: 0; box-shadow: 0 10px 26px rgba(2, 9, 14, 0.14); cursor: pointer; transition: background-color 160ms ease, box-shadow 160ms ease; } .index-card:hover, .index-card:focus-within { z-index: 1; background-color: var(--home-card-hover); box-shadow: 0 14px 32px rgba(2, 9, 14, 0.2); } .index-card:focus-within { outline: 1px solid rgba(231, 229, 219, 0.5); outline-offset: 3px; } .index-header { margin: 0 0 0.65rem; color: var(--home-card-title); font-size: clamp(1.15rem, 2.5vh, 1.45rem); font-weight: 600; line-height: 1.25; white-space: normal; overflow: visible; text-overflow: clip; } .index-header a { color: inherit; } .index-header a::after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; content: ""; } .index-header a:hover, .index-header a:focus { color: var(--home-card-title-hover); } .index-excerpt { display: block; height: auto; margin: 0 0 0.9rem; color: var(--home-card-excerpt); font-size: clamp(0.78rem, 1.7vh, 0.88rem); pointer-events: none; } .index-excerpt > div { display: -webkit-box; width: 100%; overflow: hidden; line-height: 1.55; word-break: break-word; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .index-meta { display: flex; flex-wrap: wrap; margin-top: auto; margin-bottom: 0; color: var(--home-card-meta); font-size: 0.7rem; letter-spacing: 0.04em; pointer-events: none; } .index-meta a { color: var(--home-card-meta-link); } .index-meta__item { display: inline-flex; align-items: center; } .index-meta__item > * { margin-right: 0.2rem; } .index-meta__icon { opacity: 0.75; } .home-page .site-footer { display: none; } @media (max-width: 991px) { .home-grid { grid-template-columns: repeat(3, var(--home-card-size)); grid-template-rows: repeat(4, var(--home-card-size)); } } @media (max-width: 767px) { .home-main { padding-top: 3.5rem; } .home-main__inner { width: min(100% - 1.25rem, 38rem); } .home-grid { grid-template-columns: 1fr; grid-template-rows: repeat(12, auto); } .index-card { padding: 1.5rem; } .index-header { display: -webkit-box; overflow: hidden; word-break: break-word; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } } @media (prefers-reduced-motion: reduce) { .home-cover__slogan, .index-card { transition: none; } } .home-slogan-static { display: none; } @media (max-width: 767px) { .home-cover__text--mobile-static #subtitle, .home-cover__text--mobile-static .typed-cursor, .home-cover__text--mobile-static .home-slogan-nojs { display: none; } .home-cover__text--mobile-static .home-slogan-static { display: inline; } } /* 40-editorial.css */ /* Content pages share one editorial surface: a 760px column below the masthead. */ .page-body { position: relative; z-index: 3; margin: 0; padding: 3.25rem 0 4rem; background: transparent; } .content-column { display: flow-root; width: min(100% - 2rem, var(--column-width)); max-width: var(--column-width); margin: 0 auto; padding: 0; } .editorial-page .markdown-body, .listing, .about-info { font-family: var(--font-prose); font-size: 1.0625rem; font-weight: 400; line-height: 1.78; } .editorial-page .markdown-body p { margin-bottom: 1.15em; } .page-content strong, .post-content strong { font-weight: bold; } .page-content img, .post-content img { max-width: 100%; object-fit: cover; } /* Lists of posts: archives, tags, categories. */ .listing { display: flex; flex-direction: column; margin: 0; padding: 0; } .listing__year { margin: 2.25rem 0 0.45rem; color: var(--muted); font-size: 0.86rem; font-weight: 500; letter-spacing: 0.08em; line-height: 1.2; } .listing__year:first-child { margin-top: 0; } .listing__item { position: relative; display: flex; align-items: baseline; gap: 1rem; width: 100%; padding: 0.78rem 0.2rem; color: var(--text); text-align: inherit; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; } .listing__item:hover, .listing__item:focus { color: var(--link-hover); background: var(--link-hover-bg); } .listing__date { flex: 0 0 4.5rem; color: var(--muted); font-size: 0.8rem; font-variant-numeric: tabular-nums; } .listing__title { display: block; overflow: visible; font-size: 1rem; text-overflow: clip; white-space: normal; } .listing__count { margin-left: auto; color: var(--muted); font-size: 0.8rem; font-variant-numeric: tabular-nums; } .listing__kind { flex: 0 0 4.5rem; color: var(--muted); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.08em; } .listing__copy { display: block; } .listing__summary { display: block; margin-top: 0.1rem; color: var(--muted); font-size: 0.78rem; line-height: 1.5; } /* Pagination below long lists. */ .pagination-nav { margin-top: 3rem; } .pagination { display: flex; justify-content: center; margin: 0; padding-left: 0; list-style: none; } .pagination .space { align-self: flex-end; } .pagination .page-number, .pagination .current, .pagination .extend { padding: 0.5rem 0.75rem; background-color: transparent; border: 0; border-radius: 0.125rem; outline: 0; font-size: 0.9rem; line-height: 1.25; } .pagination .page-number { margin: 0 0.05rem; } .pagination .page-number:hover, .pagination .current { background-color: var(--link-hover-bg); transition: background-color 0.2s ease-in-out; } /* About. */ .about-header { text-align: center; } .about-avatar { position: relative; z-index: 1; width: 8rem; height: 8rem; margin: 0 auto 1.6rem; } .about-avatar img { width: 100%; height: 100%; background-color: transparent; border: 1px solid var(--line); border-radius: 50%; box-shadow: none; object-fit: cover; } .about-info > div { margin-bottom: 0.55rem; } .about-name { color: var(--text); font-size: 1.45rem; font-weight: 500; } .about-intro { color: var(--muted); font-size: 1rem; } .about-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.25rem 1.25rem; font-size: 0.9rem; } .about-links__item { color: var(--link); letter-spacing: 0.055em; } .about-content { margin-top: 2.5rem; } /* 404. */ .error-page .page-body { padding: 0; } .error-cover { display: flex; min-height: 100vh; min-height: 100svh; background-color: var(--masthead); background-repeat: no-repeat; background-position: center center; background-size: cover; } .error-cover__mask { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 1.5rem; padding: 6rem 1rem; color: #fff; background: rgba(0, 0, 0, 0.3); text-align: center; } .error-cover__title { margin: 0; font-size: 2rem; font-weight: 500; line-height: 1.2; text-shadow: 0 2px 22px rgba(2, 13, 22, 0.75); } .error-cover__link { padding-bottom: 0.15rem; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.6); font-size: 0.9rem; letter-spacing: 0.055em; } .error-cover__link:hover, .error-cover__link:focus-visible { color: var(--accent); border-bottom-color: currentColor; } .site-footer { padding: 3rem 0 1rem; text-align: center; } @media (max-width: 767px) { .page-body { padding-top: 2.5rem; } .listing__item { gap: 0.65rem; padding: 0.7rem 0.1rem; } .listing__date, .listing__kind { flex-basis: 3.75rem; } } @media (max-width: 575px) { .listing__item { font-size: 0.95rem; } } /* 50-post.css */ /* Article pages: a centred reading column with an optional table of contents. */ .post-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, var(--reading-width)) minmax(0, 1fr); align-items: start; } .post-content { grid-column: 2; display: flow-root; box-sizing: border-box; width: 100%; max-width: var(--reading-width); margin: 0 auto; padding: 0; } .post-toc { position: sticky; top: 2rem; grid-column: 3; max-width: 16rem; margin-left: 2rem; padding: 3rem 0; } .post-toc__header { margin: 0 0 0.5rem; font-size: 1.25rem; font-weight: bold; line-height: 1.2; } .post-toc__header .icon { width: 1.25rem; height: 1.25rem; margin-right: 0.2rem; } .post-toc__body { max-height: 75vh; overflow-y: auto; scrollbar-width: none; } .post-toc__body::-webkit-scrollbar { display: none; } .post-toc ol { position: relative; margin: 0; padding-left: 1rem; list-style: none; } .post-toc .toc-item { position: relative; padding: 0.1rem 0; } .post-toc .toc-item::before { position: absolute; left: 0.25rem; width: 0.15rem; height: 0.2rem; margin: 0.65rem 0; background: var(--link-hover); border-radius: 2px; content: ""; visibility: hidden; transition: height 0.1s ease-in-out, margin 0.1s ease-in-out, visibility 0.1s ease-in-out; } .post-toc .toc-item.is-active::before { height: 1rem; margin: 0.25rem 0; visibility: visible; } .post-toc .toc-link { display: -webkit-box; overflow: hidden; color: var(--text); font-size: 0.95rem; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .post-toc ol ol .toc-link { font-size: 0.85rem; } .post-toc .toc-link.is-active { color: var(--link-hover); font-weight: bold; } /* Previous / next. */ .post-nav { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 1rem -0.35rem; font-size: 0.9rem; } .post-nav__cell { display: flex; flex: 0 0 50%; max-width: 50%; padding: 0; } .post-nav__cell--next { justify-content: flex-end; } .post-nav__prev, .post-nav__next { display: flex; align-items: center; color: var(--text); } .post-nav .icon { flex-shrink: 0; width: 1.5rem; height: 1.5rem; } .post-nav__title { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .post-nav__label { display: none; } .post-nav__prev:hover .icon, .post-nav__prev:active .icon { animation: post-prev-anim 1s ease-in-out 0.1s infinite alternate forwards; } .post-nav__next:hover .icon, .post-nav__next:active .icon { animation: post-next-anim 1s ease-in-out 0.1s infinite alternate forwards; } @keyframes post-prev-anim { 0% { transform: translateX(0); } 50% { transform: translateX(-0.35rem); } 100% { transform: translateX(0); } } @keyframes post-next-anim { 0% { transform: translateX(0); } 50% { transform: translateX(0.35rem); } 100% { transform: translateX(0); } } .post-tags { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin: 1rem 0; font-size: 0.9rem; } .post-tags__item { color: var(--muted); } /* Photo posts: several photographs in a wider column without a table of contents. */ .photo-post .post-layout { grid-template-columns: 1fr; } .photo-post .post-content { grid-column: 1; max-width: var(--photo-width); padding-right: 3rem; padding-left: 3rem; } .photo-post .post-toc { display: none; } .photo-post .markdown-body > p:first-child { max-width: var(--column-width); margin-right: auto; margin-left: auto; } .photo-post .markdown-body p > img, .photo-post .markdown-body p > a > img, .photo-post .markdown-body figure > img, .photo-post .markdown-body figure > a > img { width: 100%; max-width: 100%; height: auto; margin: 3rem auto 0; border-radius: 2px; box-shadow: none; object-fit: contain; object-position: center; } .photo-post .markdown-body figcaption.image-caption { color: var(--muted); } /* Heading anchors, shown on hover. */ .markdown-body .heading-anchor { float: left; margin-left: -1.25em; padding-right: 0.25em; color: var(--muted); font-size: 0.8em; line-height: 1; text-decoration: none; opacity: 0; transition: opacity 0.2s ease-in-out; } .markdown-body h1:hover .heading-anchor, .markdown-body h2:hover .heading-anchor, .markdown-body h3:hover .heading-anchor, .markdown-body h4:hover .heading-anchor, .markdown-body h5:hover .heading-anchor, .markdown-body h6:hover .heading-anchor, .markdown-body .heading-anchor:focus-visible { opacity: 1; } .markdown-body .heading-anchor .icon { width: 1em; height: 1em; vertical-align: -0.1em; } /* Image lightbox (dialog). */ .lightbox { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100vh; height: 100dvh; max-height: none; margin: 0; padding: 0; overflow: hidden; color: #eeeae3; background: #242424; border: 0; font-family: var(--font-prose); } .lightbox[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; } .lightbox::backdrop { background: #242424; } .lightbox__toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: max(0.5rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) 0.5rem max(1.5rem, env(safe-area-inset-left)); } .lightbox__count { margin: 0; color: #bdbab4; font-size: 0.875rem; font-variant-numeric: tabular-nums; } .lightbox__controls { display: flex; gap: 0.5rem; } .lightbox__controls button { display: grid; width: 44px; height: 44px; padding: 0; place-items: center; color: inherit; background: transparent; border: 0; border-radius: 0; font: 1.5rem/1 Georgia, serif; cursor: pointer; } .lightbox__controls button:disabled { opacity: 0.3; cursor: default; } .lightbox__controls button:hover:not(:disabled) { background: rgba(255, 255, 255, 0.08); } .lightbox__controls button:focus-visible { outline: 1px solid #eeeae3; outline-offset: -3px; } .lightbox__stage { display: flex; align-items: center; justify-content: center; min-height: 0; margin: 0 1.5rem max(1.5rem, env(safe-area-inset-bottom)); } .lightbox__stage img { display: block; width: auto; max-width: 100%; height: auto; max-height: 100%; margin: 0; border-radius: 0; box-shadow: none; object-fit: contain; filter: none; } .lightbox__caption { max-height: 20vh; margin: -0.5rem auto 0; padding: 0 1.5rem max(1rem, env(safe-area-inset-bottom)); overflow: auto; color: #bdbab4; font-size: 0.875rem; line-height: 1.6; text-align: center; } @media (max-width: 991.98px) { .post-layout { display: block; } .post-content { max-width: calc(var(--reading-width) + 4rem); padding-right: 2rem; padding-left: 2rem; } .post-toc { display: none; } } @media (max-width: 767px) { .page-content, .post-content { overflow: hidden; } .photo-post .post-content { padding-right: 1.5rem; padding-left: 1.5rem; } .lightbox__stage { margin-right: 0.75rem; margin-left: 0.75rem; } } @media (max-width: 575px) { .post-nav__title { display: none; } .post-nav__label { display: block; } } @media (max-width: 424px) { .post-content { padding-right: 1rem; padding-left: 1rem; } .markdown-body .heading-anchor { display: none; } } @media (prefers-reduced-motion: reduce) { .post-nav__prev:hover .icon, .post-nav__next:hover .icon { animation: none; } } /* 60-markdown.css */ /* * github-markdown-css 4.0.0 — MIT License, Copyright (c) Sindre Sorhus (https://sindresorhus.com) * Vendored unchanged except for removing octicon, anchor, task-list and GitHub utility-class rules (the only ones using !important) that Markdown output never produces. * Blue Note overrides follow at the end of this file. */ .markdown-body { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; line-height: 1.5; color: #24292e; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji; font-size: 16px; line-height: 1.5; word-wrap: break-word; } .markdown-body details { display: block; } .markdown-body summary { display: list-item; } .markdown-body a { background-color: initial; } .markdown-body a:active, .markdown-body a:hover { outline-width: 0; } .markdown-body strong { font-weight: inherit; font-weight: bolder; } .markdown-body h1 { font-size: 2em; margin: .67em 0; } .markdown-body img { border-style: none; } .markdown-body code, .markdown-body kbd, .markdown-body pre { font-family: monospace,monospace; font-size: 1em; } .markdown-body hr { box-sizing: initial; height: 0; overflow: visible; } .markdown-body input { font: inherit; margin: 0; } .markdown-body input { overflow: visible; } .markdown-body [type=checkbox] { box-sizing: border-box; padding: 0; } .markdown-body * { box-sizing: border-box; } .markdown-body input { font-family: inherit; font-size: inherit; line-height: inherit; } .markdown-body a { color: #0366d6; text-decoration: none; } .markdown-body a:hover { text-decoration: underline; } .markdown-body strong { font-weight: 600; } .markdown-body hr { height: 0; margin: 15px 0; overflow: hidden; background: transparent; border: 0; border-bottom: 1px solid #dfe2e5; } .markdown-body hr:after, .markdown-body hr:before { display: table; content: ""; } .markdown-body hr:after { clear: both; } .markdown-body table { border-spacing: 0; border-collapse: collapse; } .markdown-body td, .markdown-body th { padding: 0; } .markdown-body details summary { cursor: pointer; } .markdown-body kbd { display: inline-block; padding: 3px 5px; font: 11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace; line-height: 10px; color: #444d56; vertical-align: middle; background-color: #fafbfc; border: 1px solid #d1d5da; border-radius: 3px; box-shadow: inset 0 -1px 0 #d1d5da; } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin-top: 0; margin-bottom: 0; } .markdown-body h1 { font-size: 32px; } .markdown-body h1, .markdown-body h2 { font-weight: 600; } .markdown-body h2 { font-size: 24px; } .markdown-body h3 { font-size: 20px; } .markdown-body h3, .markdown-body h4 { font-weight: 600; } .markdown-body h4 { font-size: 16px; } .markdown-body h5 { font-size: 14px; } .markdown-body h5, .markdown-body h6 { font-weight: 600; } .markdown-body h6 { font-size: 12px; } .markdown-body p { margin-top: 0; margin-bottom: 10px; } .markdown-body blockquote { margin: 0; } .markdown-body ol, .markdown-body ul { padding-left: 0; margin-top: 0; margin-bottom: 0; } .markdown-body ol ol, .markdown-body ul ol { list-style-type: lower-roman; } .markdown-body ol ol ol, .markdown-body ol ul ol, .markdown-body ul ol ol, .markdown-body ul ul ol { list-style-type: lower-alpha; } .markdown-body dd { margin-left: 0; } .markdown-body code, .markdown-body pre { font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace; font-size: 12px; } .markdown-body pre { margin-top: 0; margin-bottom: 0; } .markdown-body input::-webkit-inner-spin-button, .markdown-body input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; appearance: none; } .markdown-body :checked+.radio-label { position: relative; z-index: 1; border-color: #0366d6; } .markdown-body .pl-c { color: #6a737d; } .markdown-body .pl-c1, .markdown-body .pl-s .pl-v { color: #005cc5; } .markdown-body .pl-e, .markdown-body .pl-en { color: #6f42c1; } .markdown-body .pl-s .pl-s1, .markdown-body .pl-smi { color: #24292e; } .markdown-body .pl-ent { color: #22863a; } .markdown-body .pl-k { color: #d73a49; } .markdown-body .pl-pds, .markdown-body .pl-s, .markdown-body .pl-s .pl-pse .pl-s1, .markdown-body .pl-sr, .markdown-body .pl-sr .pl-cce, .markdown-body .pl-sr .pl-sra, .markdown-body .pl-sr .pl-sre { color: #032f62; } .markdown-body .pl-smw, .markdown-body .pl-v { color: #e36209; } .markdown-body .pl-bu { color: #b31d28; } .markdown-body .pl-ii { color: #fafbfc; background-color: #b31d28; } .markdown-body .pl-c2 { color: #fafbfc; background-color: #d73a49; } .markdown-body .pl-c2:before { content: "^M"; } .markdown-body .pl-sr .pl-cce { font-weight: 700; color: #22863a; } .markdown-body .pl-ml { color: #735c0f; } .markdown-body .pl-mh, .markdown-body .pl-mh .pl-en, .markdown-body .pl-ms { font-weight: 700; color: #005cc5; } .markdown-body .pl-mi { font-style: italic; color: #24292e; } .markdown-body .pl-mb { font-weight: 700; color: #24292e; } .markdown-body .pl-md { color: #b31d28; background-color: #ffeef0; } .markdown-body .pl-mi1 { color: #22863a; background-color: #f0fff4; } .markdown-body .pl-mc { color: #e36209; background-color: #ffebda; } .markdown-body .pl-mi2 { color: #f6f8fa; background-color: #005cc5; } .markdown-body .pl-mdr { font-weight: 700; color: #6f42c1; } .markdown-body .pl-ba { color: #586069; } .markdown-body .pl-sg { color: #959da5; } .markdown-body .pl-corl { text-decoration: underline; color: #032f62; } .markdown-body hr { border-bottom-color: #eee; } .markdown-body kbd { display: inline-block; padding: 3px 5px; font: 11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace; line-height: 10px; color: #444d56; vertical-align: middle; background-color: #fafbfc; border: 1px solid #d1d5da; border-radius: 3px; box-shadow: inset 0 -1px 0 #d1d5da; } .markdown-body:after, .markdown-body:before { display: table; content: ""; } .markdown-body:after { clear: both; } .markdown-body a:not([href]) { color: inherit; text-decoration: none; } .markdown-body blockquote, .markdown-body details, .markdown-body dl, .markdown-body ol, .markdown-body p, .markdown-body pre, .markdown-body table, .markdown-body ul { margin-top: 0; margin-bottom: 16px; } .markdown-body hr { height: .25em; padding: 0; margin: 24px 0; background-color: #e1e4e8; border: 0; } .markdown-body blockquote { padding: 0 1em; color: #6a737d; border-left: .25em solid #dfe2e5; } .markdown-body blockquote>:first-child { margin-top: 0; } .markdown-body blockquote>:last-child { margin-bottom: 0; } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin-top: 24px; margin-bottom: 16px; font-weight: 600; line-height: 1.25; } .markdown-body h1 { font-size: 2em; } .markdown-body h1, .markdown-body h2 { padding-bottom: .3em; border-bottom: 1px solid #eaecef; } .markdown-body h2 { font-size: 1.5em; } .markdown-body h3 { font-size: 1.25em; } .markdown-body h4 { font-size: 1em; } .markdown-body h5 { font-size: .875em; } .markdown-body h6 { font-size: .85em; color: #6a737d; } .markdown-body ol, .markdown-body ul { padding-left: 2em; } .markdown-body ol ol, .markdown-body ol ul, .markdown-body ul ol, .markdown-body ul ul { margin-top: 0; margin-bottom: 0; } .markdown-body li { word-wrap: break-all; } .markdown-body li>p { margin-top: 16px; } .markdown-body li+li { margin-top: .25em; } .markdown-body dl { padding: 0; } .markdown-body dl dt { padding: 0; margin-top: 16px; font-size: 1em; font-style: italic; font-weight: 600; } .markdown-body dl dd { padding: 0 16px; margin-bottom: 16px; } .markdown-body table { display: block; width: 100%; overflow: auto; } .markdown-body table th { font-weight: 600; } .markdown-body table td, .markdown-body table th { padding: 6px 13px; border: 1px solid #dfe2e5; } .markdown-body table tr { background-color: #fff; border-top: 1px solid #c6cbd1; } .markdown-body table tr:nth-child(2n) { background-color: #f6f8fa; } .markdown-body img { max-width: 100%; box-sizing: initial; background-color: #fff; } .markdown-body img[align=right] { padding-left: 20px; } .markdown-body img[align=left] { padding-right: 20px; } .markdown-body code { padding: .2em .4em; margin: 0; font-size: 85%; background-color: rgba(27,31,35,.05); border-radius: 3px; } .markdown-body pre { word-wrap: normal; } .markdown-body pre>code { padding: 0; margin: 0; font-size: 100%; word-break: normal; white-space: pre; background: transparent; border: 0; } .markdown-body .highlight { margin-bottom: 16px; } .markdown-body .highlight pre { margin-bottom: 0; word-break: normal; } .markdown-body .highlight pre, .markdown-body pre { padding: 16px; overflow: auto; font-size: 85%; line-height: 1.45; background-color: #f6f8fa; border-radius: 3px; } .markdown-body pre code { display: inline; max-width: auto; padding: 0; margin: 0; overflow: visible; line-height: inherit; word-wrap: normal; background-color: initial; border: 0; } .markdown-body .commit-tease-sha { display: inline-block; font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace; font-size: 90%; color: #444d56; } .markdown-body .full-commit .btn-outline:not(:disabled):hover { color: #005cc5; border-color: #005cc5; } .markdown-body .blob-wrapper { overflow-x: auto; overflow-y: hidden; } .markdown-body .blob-wrapper-embedded { max-height: 240px; overflow-y: auto; } .markdown-body .blob-num { width: 1%; min-width: 50px; padding-right: 10px; padding-left: 10px; font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace; font-size: 12px; line-height: 20px; color: rgba(27,31,35,.3); text-align: right; white-space: nowrap; vertical-align: top; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .markdown-body .blob-num:hover { color: rgba(27,31,35,.6); } .markdown-body .blob-num:before { content: attr(data-line-number); } .markdown-body .blob-code { position: relative; padding-right: 10px; padding-left: 10px; line-height: 20px; vertical-align: top; } .markdown-body .blob-code-inner { overflow: visible; font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace; font-size: 12px; color: #24292e; word-wrap: normal; white-space: pre; } .markdown-body .pl-token.active, .markdown-body .pl-token:hover { cursor: pointer; background: #ffea7f; } .markdown-body .tab-size[data-tab-size="1"] { -moz-tab-size: 1; tab-size: 1; } .markdown-body .tab-size[data-tab-size="2"] { -moz-tab-size: 2; tab-size: 2; } .markdown-body .tab-size[data-tab-size="3"] { -moz-tab-size: 3; tab-size: 3; } .markdown-body .tab-size[data-tab-size="4"] { -moz-tab-size: 4; tab-size: 4; } .markdown-body .tab-size[data-tab-size="5"] { -moz-tab-size: 5; tab-size: 5; } .markdown-body .tab-size[data-tab-size="6"] { -moz-tab-size: 6; tab-size: 6; } .markdown-body .tab-size[data-tab-size="7"] { -moz-tab-size: 7; tab-size: 7; } .markdown-body .tab-size[data-tab-size="8"] { -moz-tab-size: 8; tab-size: 8; } .markdown-body .tab-size[data-tab-size="9"] { -moz-tab-size: 9; tab-size: 9; } .markdown-body .tab-size[data-tab-size="10"] { -moz-tab-size: 10; tab-size: 10; } .markdown-body .tab-size[data-tab-size="11"] { -moz-tab-size: 11; tab-size: 11; } .markdown-body .tab-size[data-tab-size="12"] { -moz-tab-size: 12; tab-size: 12; } /* Restored from github-markdown-css: the first and last block in a body carry no outer margin. */ .markdown-body > :first-child { margin-top: 0 !important; } .markdown-body > :last-child { margin-bottom: 0 !important; } /* 65-markdown-overrides.css */ /* Theme overrides on top of github-markdown-css: colours from tokens, serif type, quieter headings, images without shadows, code blocks in the paper palette. */ .markdown-body { margin-bottom: 2rem; color: var(--prose); font-family: var(--font-ui); font-size: 1rem; line-height: 1.6; } .markdown-body > h1, .markdown-body > h2 { border-bottom-color: var(--line); } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin-top: 2em; margin-bottom: 0.75em; color: var(--heading); font-weight: bold; transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; } /* Offset in-page anchors below the fixed navigation. */ .markdown-body > h1::before, .markdown-body > h2::before, .markdown-body > h3::before, .markdown-body > h4::before, .markdown-body > h5::before, .markdown-body > h6::before { display: block; width: 1px; height: 5rem; margin-top: -5rem; content: ""; visibility: hidden; } .markdown-body h1:focus, .markdown-body h2:focus, .markdown-body h3:focus, .markdown-body h4:focus, .markdown-body h5:focus, .markdown-body h6:focus { outline: none; } .markdown-body a { color: var(--link); } .markdown-body strong { font-weight: bold; } .markdown-body code { background-color: var(--inline-code-bg); tab-size: 4; transition: background-color 0.2s ease-in-out; } .markdown-body table tr, .markdown-body table tr:nth-child(2n) { background-color: transparent; transition: background-color 0.2s ease-in-out; } .markdown-body table th, .markdown-body table td { border-color: var(--line); transition: border-color 0.2s ease-in-out; } .markdown-body pre { font-size: 85%; } .markdown-body .highlight pre, .markdown-body pre { padding: 1.45rem 1rem; } .markdown-body .hljs, .markdown-body .highlight pre, .markdown-body pre, .markdown-body .code-wrapper pre, .markdown-body figure.highlight td.gutter { background-color: var(--code-bg); transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out; } .markdown-body .code-wrapper { position: relative; margin-bottom: 1rem; border-radius: 4px; } .markdown-body figure.highlight { position: relative; } .markdown-body figure.highlight table { width: auto; margin: 0; border: 0; border-radius: 4px; } .markdown-body figure.highlight td, .markdown-body figure.highlight tr { padding: 0; border: 0; } .markdown-body figure.highlight td.code { width: 100%; } .markdown-body figure.highlight td.gutter { position: sticky; left: 0; z-index: 1; display: table-cell; } .markdown-body figure.highlight td.gutter pre { padding: 0 0.75rem; border-right: 1px solid #999; border-radius: 0; text-align: right; } .markdown-body figure.highlight td.gutter span.line { color: #999; } .markdown-body figure.highlight td.code > pre { border-top-left-radius: 0; border-bottom-left-radius: 0; } .markdown-body p > img, .markdown-body p > a > img, .markdown-body figure > img, .markdown-body figure > a > img { display: block; max-width: 90%; margin: 1.5rem auto; background-color: transparent; border-radius: 4px; box-shadow: none; } .markdown-body figure.figure { margin: 0 0 1.15em; } .markdown-body figcaption.image-caption { margin: -0.75rem auto 2rem; color: var(--prose); font-size: 0.8rem; line-height: 1; text-align: center; opacity: 0.65; } .markdown-body figcaption:not(.image-caption) { display: none; } .markdown-body blockquote { color: var(--muted); } .markdown-body details { cursor: pointer; } .markdown-body details summary { outline: none; } .markdown-body hr { height: 0; margin: 2rem 0; background-color: initial; border-top: 1px solid var(--line); } .markdown-body img { max-width: 100%; object-fit: cover; } /* 70-panels.css */ /* Literary blocks: a quiet framed panel for quotations, formulas and signals, and an open verse block with rules above and below. */ .markdown-body .literary-block { box-sizing: border-box; color: var(--prose); } .markdown-body .literary-panel, .markdown-body .literary-block--signal { box-sizing: border-box; max-width: 48rem; margin: 0 auto 2.5rem; padding: 1.75rem 1.65rem 1.6rem; color: var(--prose); background: var(--panel); border: 1px solid var(--line); border-radius: 0; } .markdown-body .literary-block__section { text-align: center; } .markdown-body .literary-block__section p { margin: 0; font-family: var(--font-math); font-size: 1.06rem; line-height: 1.75; } .markdown-body .literary-block__section--opening p + p { margin-top: 0.12rem; } .markdown-body .literary-block__divider { width: 3.5rem; margin: 1.35rem auto 1.25rem; border-top: 1px solid var(--line); } .markdown-body .literary-block__section .literary-block__emphasis { font-size: 1.11rem; font-weight: 600; letter-spacing: 0.075em; } .markdown-body .literary-block__section .literary-block__note { margin-top: 0.65rem; color: var(--muted); font-family: "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", STSong, Georgia, serif; font-size: 0.88rem; line-height: 1.65; } .markdown-body .literary-block__title { font-family: var(--font-math); font-style: italic; } .markdown-body .literary-block--verse { max-width: 34rem; margin: 2.75rem auto 1rem; padding: 2rem 1rem; text-align: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); } .markdown-body .literary-block--verse p { margin: 0; font-family: var(--font-math); font-size: 1.08rem; line-height: 2.05; } .markdown-body .literary-block--verse p:nth-child(5) { margin-top: 0.85rem; } @media (max-width: 767px) { .markdown-body .literary-panel, .markdown-body .literary-block--signal { padding: 1.45rem 1.1rem 1.35rem; } .markdown-body .literary-block__section p { font-size: 0.98rem; } .markdown-body .literary-block__section .literary-block__emphasis { font-size: 0.95rem; letter-spacing: 0.02em; } .markdown-body .literary-block--verse { padding-right: 0.25rem; padding-left: 0.25rem; } } /* 80-highlight.css */ /* * Code block colours: highlight.js 11.12.0 "github" (light) and "dark" themes. * BSD-3-Clause License, Copyright (c) 2006 Ivan Sagalaev and contributors. Selectors are scoped by colour scheme. */ .markdown-body pre code.hljs { display: block; overflow-x: auto; padding: 0; } .hljs { color: #24292e; background: #ffffff; } .hljs-doctag, .hljs-keyword, .hljs-meta .hljs-keyword, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-variable.language_ { color: #d73a49; } .hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_ { color: #6f42c1; } .hljs-attr, .hljs-attribute, .hljs-literal, .hljs-meta, .hljs-number, .hljs-operator, .hljs-variable, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id { color: #005cc5; } .hljs-regexp, .hljs-string, .hljs-meta .hljs-string { color: #032f62; } .hljs-built_in, .hljs-symbol { color: #e36209; } .hljs-comment, .hljs-code, .hljs-formula { color: #6a737d; } .hljs-name, .hljs-quote, .hljs-selector-tag, .hljs-selector-pseudo { color: #22863a; } .hljs-subst { color: #24292e; } .hljs-section { color: #005cc5; font-weight: bold; } .hljs-bullet { color: #735c0f; } .hljs-emphasis { color: #24292e; font-style: italic; } .hljs-strong { color: #24292e; font-weight: bold; } .hljs-addition { color: #22863a; background-color: #f0fff4; } .hljs-deletion { color: #b31d28; background-color: #ffeef0; } @media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) .hljs { color: #ddd; background: #303030; } :root:not([data-scheme="light"]) .hljs-keyword, :root:not([data-scheme="light"]) .hljs-selector-tag, :root:not([data-scheme="light"]) .hljs-literal, :root:not([data-scheme="light"]) .hljs-section, :root:not([data-scheme="light"]) .hljs-link { color: white; } :root:not([data-scheme="light"]) .hljs-string, :root:not([data-scheme="light"]) .hljs-title, :root:not([data-scheme="light"]) .hljs-name, :root:not([data-scheme="light"]) .hljs-type, :root:not([data-scheme="light"]) .hljs-attribute, :root:not([data-scheme="light"]) .hljs-symbol, :root:not([data-scheme="light"]) .hljs-bullet, :root:not([data-scheme="light"]) .hljs-built_in, :root:not([data-scheme="light"]) .hljs-addition, :root:not([data-scheme="light"]) .hljs-variable, :root:not([data-scheme="light"]) .hljs-template-tag, :root:not([data-scheme="light"]) .hljs-template-variable { color: #d88; } :root:not([data-scheme="light"]) .hljs-comment, :root:not([data-scheme="light"]) .hljs-quote, :root:not([data-scheme="light"]) .hljs-deletion, :root:not([data-scheme="light"]) .hljs-meta { color: #979797; } :root:not([data-scheme="light"]) .hljs-keyword, :root:not([data-scheme="light"]) .hljs-selector-tag, :root:not([data-scheme="light"]) .hljs-literal, :root:not([data-scheme="light"]) .hljs-title, :root:not([data-scheme="light"]) .hljs-section, :root:not([data-scheme="light"]) .hljs-doctag, :root:not([data-scheme="light"]) .hljs-type, :root:not([data-scheme="light"]) .hljs-name, :root:not([data-scheme="light"]) .hljs-strong { font-weight: bold; } :root:not([data-scheme="light"]) .hljs-emphasis { font-style: italic; } } :root[data-scheme="dark"] .hljs { color: #ddd; background: #303030; } :root[data-scheme="dark"] .hljs-keyword, :root[data-scheme="dark"] .hljs-selector-tag, :root[data-scheme="dark"] .hljs-literal, :root[data-scheme="dark"] .hljs-section, :root[data-scheme="dark"] .hljs-link { color: white; } :root[data-scheme="dark"] .hljs-string, :root[data-scheme="dark"] .hljs-title, :root[data-scheme="dark"] .hljs-name, :root[data-scheme="dark"] .hljs-type, :root[data-scheme="dark"] .hljs-attribute, :root[data-scheme="dark"] .hljs-symbol, :root[data-scheme="dark"] .hljs-bullet, :root[data-scheme="dark"] .hljs-built_in, :root[data-scheme="dark"] .hljs-addition, :root[data-scheme="dark"] .hljs-variable, :root[data-scheme="dark"] .hljs-template-tag, :root[data-scheme="dark"] .hljs-template-variable { color: #d88; } :root[data-scheme="dark"] .hljs-comment, :root[data-scheme="dark"] .hljs-quote, :root[data-scheme="dark"] .hljs-deletion, :root[data-scheme="dark"] .hljs-meta { color: #979797; } :root[data-scheme="dark"] .hljs-keyword, :root[data-scheme="dark"] .hljs-selector-tag, :root[data-scheme="dark"] .hljs-literal, :root[data-scheme="dark"] .hljs-title, :root[data-scheme="dark"] .hljs-section, :root[data-scheme="dark"] .hljs-doctag, :root[data-scheme="dark"] .hljs-type, :root[data-scheme="dark"] .hljs-name, :root[data-scheme="dark"] .hljs-strong { font-weight: bold; } :root[data-scheme="dark"] .hljs-emphasis { font-style: italic; } /* 85-search.css */ /* Site search panel (optional module; needs hexo-generator-search). */ .site-search-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1220; display: grid; padding: clamp(4.5rem, 10vh, 7rem) 1rem 2rem; overflow-y: auto; place-items: start center; background: rgba(8, 13, 17, 0.72); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); } .site-search-dialog { position: relative; width: min(100%, 42rem); max-height: min(76vh, 42rem); overflow: hidden; color: #3e3a34; background: #f1ece2; border: 1px solid rgba(62, 58, 52, 0.16); box-shadow: 0 1.6rem 5rem rgba(0, 0, 0, 0.32); } .site-search-dialog__close { position: relative; width: 2.25rem; height: 2.25rem; padding: 0; color: #777168; background: transparent; border: 0; font-size: 0; cursor: pointer; } .site-search-dialog__close::before, .site-search-dialog__close::after { position: absolute; top: 50%; left: 50%; width: 1rem; height: 1px; background: currentColor; border-radius: 1px; content: ""; transform: translate(-50%, -50%) rotate(45deg); } .site-search-dialog__close::after { transform: translate(-50%, -50%) rotate(-45deg); } .site-search-dialog__field { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) 2.25rem; gap: 0.5rem; align-items: center; min-width: 0; min-height: 4.5rem; padding: 0 1rem; color: #777168; } .site-search-dialog__icon { width: 1.15rem; height: 1.15rem; justify-self: center; } .site-search-dialog__field input { flex: 1; min-width: 0; padding: 0; color: #2d2b27; background: transparent; border: 0; outline: 0; font-family: "Songti SC", "Noto Serif CJK SC", STSong, Georgia, serif; font-size: 1.08rem; line-height: 1.25; } .site-search-dialog__field input::placeholder { color: #9a948b; } .site-search-dialog__field input::-webkit-search-cancel-button { display: none; -webkit-appearance: none; appearance: none; } .site-search-results { max-height: calc(min(76vh, 42rem) - 4.5rem); overflow-y: auto; } .site-search-results:empty { display: none; } .site-search-status { margin: 0; padding: 1rem 1.6rem; color: var(--muted); font-size: 0.9rem; } .site-search-status button { margin-left: 1rem; padding: 0.25rem 0.5rem; color: var(--link); background: transparent; border: 1px solid var(--line); font: inherit; cursor: pointer; } .site-search-result { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.35rem 1rem; padding: 1rem 1.6rem; color: #3e3a34; border-bottom: 1px solid rgba(62, 58, 52, 0.12); transition: color 150ms ease, background-color 150ms ease; } .site-search-result:first-child { margin-top: 0.35rem; } .site-search-result:last-child { border-bottom: 0; } .site-search-result:hover, .site-search-result:focus-visible { color: #435d70; background: rgba(99, 117, 131, 0.08); } .site-search-result__title { overflow: hidden; font-family: "Songti SC", "Noto Serif CJK SC", STSong, Georgia, serif; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; } .site-search-result__excerpt { grid-column: 1 / -1; color: #777168; font-size: 0.82rem; line-height: 1.55; } .site-search-result__privacy { display: inline-flex; align-items: center; align-self: center; color: #777168; } .site-search-result__privacy .private-lock-icon { width: 0.72rem; height: 0.72rem; } /* Dark scheme: system preference unless the reader chose light, or an explicit choice of dark. */ @media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) .site-search-dialog { color: #dedad2; background: #302f2d; border-color: rgba(222, 218, 210, 0.16); } :root:not([data-scheme="light"]) .site-search-dialog__close, :root:not([data-scheme="light"]) .site-search-dialog__field, :root:not([data-scheme="light"]) .site-search-result__excerpt, :root:not([data-scheme="light"]) .site-search-result__privacy { color: #aaa59d; } :root:not([data-scheme="light"]) .site-search-dialog__field input, :root:not([data-scheme="light"]) .site-search-result { color: #dedad2; } :root:not([data-scheme="light"]) .site-search-result { border-color: rgba(222, 218, 210, 0.13); } :root:not([data-scheme="light"]) .site-search-result:hover, :root:not([data-scheme="light"]) .site-search-result:focus-visible { color: #d0d5d8; background: rgba(184, 192, 197, 0.08); } } :root[data-scheme="dark"] .site-search-dialog { color: #dedad2; background: #302f2d; border-color: rgba(222, 218, 210, 0.16); } :root[data-scheme="dark"] .site-search-dialog__close, :root[data-scheme="dark"] .site-search-dialog__field, :root[data-scheme="dark"] .site-search-result__excerpt, :root[data-scheme="dark"] .site-search-result__privacy { color: #aaa59d; } :root[data-scheme="dark"] .site-search-dialog__field input, :root[data-scheme="dark"] .site-search-result { color: #dedad2; } :root[data-scheme="dark"] .site-search-result { border-color: rgba(222, 218, 210, 0.13); } :root[data-scheme="dark"] .site-search-result:hover, :root[data-scheme="dark"] .site-search-result:focus-visible { color: #d0d5d8; background: rgba(184, 192, 197, 0.08); } @media (max-width: 575px) { .site-search-overlay { padding: 4.25rem 0.75rem 1rem; place-items: start stretch; } .site-search-dialog { width: 100%; max-height: calc(100svh - 5.25rem); } .site-search-dialog__field { gap: 0.35rem; min-height: 4.25rem; padding: 0 0.75rem; } .site-search-result { padding-right: 1.2rem; padding-left: 1.2rem; } .site-search-results { max-height: calc(100svh - 10rem); } } /* 90-print.css */ @media print { .site-header, .site-footer, .post-toc, .post-nav, .home-cover, .lightbox, .site-search-overlay { display: none !important; } body { color: #000; background: #fff; } .markdown-body a:not([href^='#']):not([href^='javascript:']):not(.print-no-link)::after { color: #000; font-size: 0.8rem; content: ' (' attr(href) ')'; opacity: 0.8; } .markdown-body > h1, .markdown-body > h2 { border-bottom-color: transparent !important; } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin-top: 1.25em !important; margin-bottom: 0.25em !important; } .markdown-body .heading-anchor { display: none; } .markdown-body figure.highlight table, .markdown-body figure.highlight tbody, .markdown-body figure.highlight tr, .markdown-body figure.highlight td.code, .markdown-body figure.highlight td.code pre { display: block !important; width: 100% !important; } .markdown-body figure.highlight pre > code { white-space: pre-wrap; } .markdown-body figure.highlight .gutter { display: none !important; } }