/* Blog, archive, search, and discussion share the project's paper-and-green design. */
.portfolio-site .site-writing { padding-bottom: 70px; }
.portfolio-site .site-writing-hero h1 { max-width: 23ch; overflow-wrap: anywhere; }
.portfolio-site .site-archive-description > :first-child { margin-top: 0; }
.portfolio-site .site-archive-description > :last-child { margin-bottom: 0; }
.portfolio-site .site-archive-description a { color: var(--case-accent); text-decoration: underline; text-underline-offset: 3px; }
.portfolio-site .site-writing-list { min-width: 0; }
/* Reserve an internal gutter for dates without changing the page's outer bounds. */
.portfolio-site .site-writing-list-grouped { --writing-year-indent: 64px; --writing-month-indent: 48px; --writing-rail-indent: 64px; --writing-year-gap: 40px; --writing-month-gap: 32px; --writing-date-ink: #37586e; --writing-year-bar: #416b85; --writing-month-bar: #507f9c; --writing-day-bar: #9fc8e5; --writing-day-intersection: #5d839b; --writing-date-track: #c6d6e1; padding-left: var(--writing-rail-indent); }
.portfolio-site .site-writing-year { display: flow-root; }
.portfolio-site .site-writing-year + .site-writing-year { margin-top: var(--writing-year-gap); }
.portfolio-site .site-writing-year-title { position: relative; width: max-content; margin: 0 0 4px calc(-1 * var(--writing-year-indent)); padding-top: 5px; color: var(--writing-date-ink); font-size: 23px; line-height: 1.25; letter-spacing: -.3px; }
.portfolio-site .site-writing-year-title::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 3px; background: var(--writing-year-bar); }
.portfolio-site .site-writing-month { position: relative; display: flow-root; }
/* Each rail reaches the next date marker; the final rail ends with its entries. */
.portfolio-site .site-writing-month::before { content: ""; position: absolute; top: 0; bottom: calc(-1 * var(--writing-month-gap)); left: calc(-1 * var(--writing-rail-indent)); width: 12px; background: linear-gradient(to bottom, var(--writing-month-bar) 0 22px, var(--writing-date-track) 22px); pointer-events: none; }
.portfolio-site .site-writing-month:last-child::before { bottom: 0; }
.portfolio-site .site-writing-year:not(:last-child) > .site-writing-month:last-child::before { bottom: calc(-1 * var(--writing-year-gap)); }
.portfolio-site .site-writing-month + .site-writing-month { margin-top: var(--writing-month-gap); }
.portfolio-site .site-writing-month-title { margin: 0 0 0 calc(-1 * var(--writing-month-indent)); color: var(--writing-date-ink); font: 700 15px / 1.4 "SFMono-Regular", Consolas, monospace; }
.portfolio-site .site-writing-month-entries { min-width: 0; }
.portfolio-site .site-writing-month-entries > .site-writing-entry:last-child { padding-bottom: 0; }
.portfolio-site .site-writing-entry { padding: 0 0 33px; margin: 0; }
.portfolio-site .site-writing-entry + .site-writing-entry { padding-top: 33px; border-top: 1px solid var(--case-line); }
.portfolio-site .site-entry-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 16px; color: var(--case-muted); font-size: 14px; line-height: 1.7; }
.portfolio-site .site-entry-meta > span:first-child { color: var(--case-accent); }
.portfolio-site .site-entry-content { display: grid; grid-template-columns: minmax(0, 1fr); gap: 13px 25px; align-items: start; min-width: 0; }
.portfolio-site .site-entry-has-image { grid-template-columns: minmax(0, 1fr) 192px; }
.portfolio-site .site-entry-header { grid-column: 1 / -1; grid-row: 1; min-width: 0; }
.portfolio-site .site-writing-list-grouped .site-entry-header { display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 12px; align-items: first baseline; margin-left: -36px; }
.portfolio-site .site-writing-list-grouped .site-entry-title { grid-column: 2; grid-row: 1; }
.portfolio-site .site-writing-list-grouped .site-entry-byline { grid-column: 2; grid-row: 2; }
.portfolio-site .site-entry-day { grid-column: 1; grid-row: 1; position: relative; display: block; margin: 0; color: var(--writing-date-ink); font: 700 14px / 1.5 "SFMono-Regular", Consolas, monospace; font-variant-numeric: tabular-nums; text-align: right; }
.portfolio-site .site-entry-day::before { content: ""; position: absolute; top: -4px; left: calc(-1 * var(--writing-rail-indent) + 36px); width: calc(var(--writing-rail-indent) - 12px); height: 4px; background: var(--writing-day-bar); pointer-events: none; }
.portfolio-site .site-entry-day::after { content: ""; position: absolute; top: -4px; left: calc(-1 * var(--writing-rail-indent) + 36px); width: 12px; height: 4px; background: var(--writing-day-intersection); pointer-events: none; }
.portfolio-site .site-entry-media { grid-column: 2; grid-row: 2; align-self: stretch; display: flex; align-items: center; min-width: 0; padding: 7px; border: 1px solid #cbd4c7; border-radius: 5px; background: #f0f2eb; box-shadow: inset 0 0 5px rgb(32 46 42 / 4%); }
.portfolio-site .site-entry-image { display: block; width: 100%; overflow: hidden; aspect-ratio: 4 / 3; border: 1px solid var(--case-line); border-radius: 4px; background: var(--case-tint); }
.portfolio-site .site-entry-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 250ms ease-out; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
	.portfolio-site .site-entry-media:hover .site-entry-image img { transform: scale(1.15); }
}
.portfolio-site .site-writing-entry .site-entry-title { margin: 0 0 6px; font-size: 26px; line-height: 1.25; letter-spacing: -.7px; overflow-wrap: anywhere; }
.portfolio-site .site-writing-entry .site-entry-title a { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
.portfolio-site .site-writing-entry .site-entry-title a > span { flex-shrink: 0; color: var(--case-accent); font-size: 21px; }
.portfolio-site .site-writing-entry .site-entry-title a:hover { text-decoration: underline; text-underline-offset: 5px; }
.portfolio-site .site-entry-excerpt { grid-column: 1; grid-row: 2; max-width: 72ch; margin: 0; color: #36453d; font-size: 17px; line-height: 1.8; overflow-wrap: anywhere; }
.portfolio-site .site-entry-byline { margin: 0; color: var(--case-muted); font-size: 14px; line-height: 1.8; }
.portfolio-site .site-entry-byline a, .portfolio-site .site-article-meta a { text-decoration: underline; text-underline-offset: 3px; }
.portfolio-site .site-entry-byline > span, .portfolio-site .site-article-meta > span { margin-inline: 4px; }
.portfolio-site .site-entry-taxonomy { display: flex; flex-wrap: wrap; gap: 4px 24px; margin-top: 17px; color: var(--case-muted); font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.portfolio-site .site-entry-taxonomy p { margin: 0; min-width: 0; }
.portfolio-site .site-entry-taxonomy a { color: inherit; text-decoration: underline; text-decoration-color: #b9c4ba; text-underline-offset: 3px; }
.portfolio-site .site-entry-taxonomy a:hover { color: var(--case-accent); text-decoration-color: currentColor; }
.portfolio-site .site-writing .pagination, .portfolio-site .site-discussion .navigation { margin: 24px 0 0; padding-top: 24px; border-top: 1px solid var(--case-line); font-size: 15px; }
.portfolio-site .site-writing .nav-links, .portfolio-site .site-discussion .nav-links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.portfolio-site .site-writing .page-numbers, .portfolio-site .site-discussion .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 42px; padding: 7px 12px; border: 1px solid var(--case-line); border-radius: 3px; }
.portfolio-site .site-writing a.page-numbers:hover, .portfolio-site .site-discussion a.page-numbers:hover { background: var(--case-tint); }
.portfolio-site .site-writing .page-numbers.current, .portfolio-site .site-discussion .page-numbers.current { border-color: var(--case-accent); background: var(--case-accent); color: #fff; }
.portfolio-site .site-writing .page-numbers.dots, .portfolio-site .site-discussion .page-numbers.dots { border-color: transparent; }
.portfolio-site .site-writing .screen-reader-text, .portfolio-site .site-discussion .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.portfolio-site .site-empty-state { padding: 25px 28px 30px; border: 1px solid var(--case-line); border-radius: 4px; background: #f0f3eb; }
.portfolio-site .site-empty-state h2 { margin: 0 0 12px; font-size: 27px; letter-spacing: -.5px; line-height: 1.3; }
.portfolio-site .site-empty-state p { margin: 0; max-width: 55ch; font-size: 17px; color: var(--case-muted); }
.portfolio-site .site-empty-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 24px; }
.portfolio-site .site-empty-actions .case-button, .portfolio-site .site-empty-actions .case-text-link { font-size: 15px; }
.portfolio-site .site-search-primary { max-width: 650px; margin-top: 27px; }
.portfolio-site .site-article-meta { margin: 0; color: var(--case-muted); font-size: 15px; line-height: 1.8; }
.portfolio-site .site-article-topics { margin-top: 22px; }
.portfolio-site .site-article-topics a { font-size: 13px; }
.portfolio-site .site-article-image { margin: 0 0 31px; }
.portfolio-site .site-article-image img { display: block; width: auto; max-width: 100%; height: auto; border: 1px solid var(--case-line); border-radius: 4px; }
.portfolio-site .site-article-copy::after { display: block; clear: both; content: ""; }
.portfolio-site .site-article-copy > :first-child { margin-top: 0; }
.portfolio-site .site-article-copy p > code, .portfolio-site .site-article-copy li > code { white-space: break-spaces; overflow-wrap: anywhere; }
.portfolio-site .site-article-copy code.portfolio-local-formula { display: block; max-width: 100%; margin-block: 10px; padding: 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.portfolio-site .site-article-copy .alignleft { float: left; margin: 5px 25px 20px 0; }
.portfolio-site .site-article-copy .alignright { float: right; margin: 5px 0 20px 25px; }
.portfolio-site .site-article-copy .aligncenter { margin-inline: auto; }
.portfolio-site .site-page-links { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 28px; font-size: 15px; }
.portfolio-site .site-page-links .post-page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 38px; border: 1px solid var(--case-line); border-radius: 3px; }
.portfolio-site .site-page-links .current { background: var(--case-tint); border-color: var(--case-accent); }
.portfolio-site .site-article-tags { margin: 31px 0 0; padding-top: 24px; border-top: 1px solid var(--case-line); color: var(--case-accent); font-size: 15px; }
.portfolio-site .site-article-tags > span { display: block; margin-bottom: 7px; color: var(--case-muted); font-size: 13px; }
.portfolio-site .site-article-tags a:hover { text-decoration: underline; text-underline-offset: 3px; }
.portfolio-site .site-article-navigation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 37px; padding-top: 27px; border-top: 1px solid var(--case-line); }
.portfolio-site .site-article-navigation a { display: block; font-size: 18px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.portfolio-site .site-navigation-label { display: block; margin-bottom: 8px; color: var(--case-muted); font-size: 14px; font-weight: 400; }
.portfolio-site .site-article-navigation a:hover > span:last-child { text-decoration: underline; text-underline-offset: 4px; }
.portfolio-site .site-navigation-next { grid-column: 2; text-align: right; }
.portfolio-site .site-sidebar-section + .site-sidebar-section { margin-top: 29px; padding-top: 25px; border-top: 1px solid var(--case-line); }
.portfolio-site .site-sidebar-list { margin: 17px 0 0; padding: 0; list-style: none; }
.portfolio-site .site-sidebar-list li + li { margin-top: 20px; }
.portfolio-site .site-sidebar-list a { display: block; }
.portfolio-site .site-sidebar-list a:hover .case-related-title { text-decoration: underline; text-underline-offset: 4px; }
.portfolio-site .site-topic-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.portfolio-site .site-topic-list li { margin: 0; }
.portfolio-site .site-topic-list a { display: block; padding: 5px 10px; border: 1px solid var(--case-line); border-radius: 3px; color: var(--case-muted); font-size: 15px; line-height: 1.6; }
.portfolio-site .site-topic-list a:hover { color: var(--case-accent); background: var(--case-tint); border-color: #a6b6a6; }
.portfolio-site .site-sidebar-search form { margin-top: 16px; }
.portfolio-site .site-discussion { margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--case-line); scroll-margin-top: 28px; }
.portfolio-site .site-discussion-heading h2 { margin: 9px 0 24px; font-size: 28px; line-height: 1.3; letter-spacing: -.7px; }
.portfolio-site .site-comment-list, .portfolio-site .site-comment-list .children { margin: 0; padding: 0; list-style: none; }
.portfolio-site .site-comment-list .children { padding-left: 25px; }
.portfolio-site .site-comment-list .comment-body { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid var(--case-line); overflow-wrap: anywhere; }
.portfolio-site .site-comment-list .comment-author { font-size: 16px; }
.portfolio-site .site-comment-list .comment-author .avatar { float: left; margin: 0 12px 12px 0; border-radius: 50%; }
.portfolio-site .site-comment-list .comment-author .fn { font-style: normal; font-weight: 600; }
.portfolio-site .site-comment-list .comment-metadata { margin-top: 3px; color: var(--case-muted); font-size: 13px; }
.portfolio-site .site-comment-list .comment-content { clear: both; padding-top: 9px; font-size: 17px; line-height: 1.8; }
.portfolio-site .site-comment-list .comment-content p { margin: 0 0 16px; }
.portfolio-site .site-comment-list .comment-content a, .portfolio-site .site-comment-list .reply a { color: var(--case-accent); text-decoration: underline; text-underline-offset: 3px; }
.portfolio-site .site-comment-list .reply { font-size: 15px; }
.portfolio-site .site-discussion .comment-respond { margin-top: 31px; }
.portfolio-site .site-discussion .comment-reply-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 15px; margin: 0 0 15px; font-size: 25px; line-height: 1.35; }
.portfolio-site .site-discussion .comment-reply-title small { font-size: 14px; font-weight: 400; }
.portfolio-site .site-discussion .comment-form { font-size: 16px; line-height: 1.75; }
.portfolio-site .site-discussion .comment-form > p { margin: 0 0 21px; }
.portfolio-site .site-discussion .comment-notes, .portfolio-site .site-discussion .logged-in-as { color: var(--case-muted); font-size: 15px; }
.portfolio-site .site-discussion .comment-form label { display: block; margin-bottom: 7px; color: var(--case-ink); }
.portfolio-site .site-discussion .comment-form input:not([type="submit"]):not([type="checkbox"]), .portfolio-site .site-discussion .comment-form textarea { display: block; width: 100%; max-width: 100%; padding: 11px 13px; border: 1px solid #9ba99a; border-radius: 3px; background: transparent; color: var(--case-ink); font: inherit; }
.portfolio-site .site-discussion .comment-form textarea { min-height: 180px; resize: vertical; }
.portfolio-site .site-discussion .comment-form textarea:focus-visible { outline: 3px solid var(--case-accent); outline-offset: 5px; }
.portfolio-site .site-discussion .comment-form-cookies-consent { display: flex; align-items: baseline; gap: 10px; }
.portfolio-site .site-discussion .comment-form-cookies-consent label { margin: 0; color: var(--case-muted); font-size: 15px; }
.portfolio-site .site-discussion .comment-form-cookies-consent input { flex-shrink: 0; }
.portfolio-site .site-discussion .comment-form a { color: var(--case-accent); text-decoration: underline; text-underline-offset: 3px; }
.portfolio-site .site-comment-submit { cursor: pointer; font: inherit; font-size: 15px; }
.portfolio-site .site-comments-closed { color: var(--case-muted); font-size: 15px; }
@media (max-width: 1100px) {
	.portfolio-site .site-writing-list-grouped { --writing-year-indent: 56px; --writing-month-indent: 40px; --writing-rail-indent: 56px; }
	.portfolio-site .site-sidebar-section + .site-sidebar-section { margin-top: 0; padding-top: 0; border-top: 0; }
	.portfolio-site .site-writing-layout .case-article-column { width: 100%; }
}
@media (max-width: 600px) {
	.portfolio-site .site-writing-list-grouped { --writing-year-indent: 44px; --writing-month-indent: 28px; --writing-rail-indent: 44px; }
	.portfolio-site .site-writing-year-title { font-size: 21px; }

	.portfolio-site .site-writing { padding-bottom: 45px; }
	.portfolio-site .site-writing-entry { padding-bottom: 28px; }
	.portfolio-site .site-writing-entry + .site-writing-entry { padding-top: 28px; }
	.portfolio-site .site-entry-content { row-gap: 18px; }
	.portfolio-site .site-entry-has-image { grid-template-columns: minmax(0, 1fr); }
	.portfolio-site .site-entry-media { grid-column: 1; grid-row: 2; width: 100%; max-width: 376px; }
	.portfolio-site .site-entry-image { aspect-ratio: 16 / 9; }
	.portfolio-site .site-entry-has-image .site-entry-excerpt { grid-row: 3; }
	.portfolio-site .site-writing-entry .site-entry-title { font-size: 24px; }
	.portfolio-site .site-entry-excerpt { font-size: 16px; }
	.portfolio-site .site-entry-taxonomy { font-size: 14px; }
	.portfolio-site .site-empty-state { padding: 22px 20px; }
	.portfolio-site .site-empty-state h2 { font-size: 24px; }
	.portfolio-site .site-article-topics a { font-size: 13px; }
	.portfolio-site .site-article-copy .alignleft, .portfolio-site .site-article-copy .alignright { float: none; margin: 22px 0; }
	.portfolio-site .site-article-navigation { grid-template-columns: minmax(0, 1fr); gap: 22px; }
	.portfolio-site .site-navigation-next { grid-column: auto; text-align: left; }
	.portfolio-site .site-sidebar-section + .site-sidebar-section { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--case-line); }
	.portfolio-site .site-comment-list .children { padding-left: 15px; }
}
@media print {
	.portfolio-site .site-writing-sidebar, .portfolio-site .site-discussion, .portfolio-site .site-article-navigation, .portfolio-site .site-search-primary, .portfolio-site .site-writing .pagination { display: none; }
	.portfolio-site .site-writing { padding-bottom: 0; }
}
