html:has(> body.theme-matt_chung) { background: #f7f7f7; }
.theme-matt_chung {
/* Public presentation ported from rails8-blog 9d829bb, with owner approval.
   Loaded only for this fixed theme; never in the admin workspace. */
& { --matt-link: #67809c; --matt-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace; }
* { box-sizing: border-box; }
& { background: #f7f7f7; font-size: 16px; -webkit-text-size-adjust: 100%; }
& { min-height: 100vh; margin: 0; color: #222; background: #f7f7f7; font-family: "Aptos", "Segoe UI", "Helvetica Neue", Helvetica, Arial, ui-sans-serif, system-ui, sans-serif; font-feature-settings: "dlig"; line-height: 1.55; }
h1, h2, h3, h4, p, figure { margin: 0; }
a { color: inherit; text-underline-offset: .12em; }
a:hover { color: var(--matt-link); }
img { display: block; max-width: 100%; height: auto; }
:where(a, button, input, select, textarea):focus-visible { outline: 2px solid #67809cb3; outline-offset: 2px; }
::selection { background: #67809c2e; }
.skip-link { position: absolute; top: .5rem; left: 1rem; transform: translateY(-200%); z-index: 50; background: white; padding: .5rem; }
.skip-link:focus { transform: none; }
.preview-banner { padding: .6rem 1rem; background: #fff7d6; text-align: center; }
.matt-header { position: sticky; top: 0; z-index: 30; background: #f7f7f7ed; }
.matt-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; max-width: 58rem; margin: 0 auto; padding: .8rem 1rem; }
.matt-brand { display: inline-flex; align-items: center; min-width: 0; gap: .6rem; text-decoration: none; }
.matt-avatar { width: 1.7rem; height: 1.7rem; object-fit: cover; border: 1px solid #111; border-radius: .28rem; flex-shrink: 0; }
.matt-brand-text { display: inline-flex; flex-direction: column; gap: .28rem; line-height: 1.15; }
.matt-brand-text strong { font-size: .98rem; letter-spacing: -.015em; }
.matt-brand-text > span { color: #666; font: 500 .62rem var(--matt-mono); letter-spacing: .04em; text-transform: uppercase; }
.matt-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .15rem; }
.matt-nav-link { padding: .4rem .55rem; border: 1px solid transparent; border-radius: .2rem; font-size: .83rem; font-weight: 500; line-height: 1; text-decoration: none; }
.matt-nav-link:hover { background: white; border-color: #d6d6d6; }
.matt-nav-link[aria-current="page"] { background: white; border-color: var(--matt-link); color: var(--matt-link); font-weight: 700; }
.matt-main { max-width: 58rem; width: 100%; margin: 0 auto; padding: 1.4rem 1rem 2rem; }
.matt-card { background: white; border: 1px solid #d6d6d6; border-radius: .45rem; padding: 1.15rem; }
.matt-article { display: grid; gap: .75rem; }
.matt-article > * { min-width: 0; }
.matt-meta { color: #666; font: 400 .73rem var(--matt-mono); letter-spacing: .01em; }
.matt-article-title, .matt-card-title { color: #222; font-weight: 700; letter-spacing: -.02em; line-height: 1.08; }
.matt-article-title { font-size: clamp(1.7rem, 2vw + 1rem, 2.35rem); margin-top: .15rem; text-wrap: balance; }
.matt-card-title { font-size: 1.1rem; }
.matt-card-title a { text-decoration: none; }
.matt-card-title a:hover { text-decoration: underline; }
.matt-excerpt { color: #333; font-size: .9rem; line-height: 1.55; }
.matt-stack { display: grid; gap: .9rem; }
.matt-page-header { margin-bottom: .85rem; }
.matt-page-header h1 { font-size: clamp(1.5rem, 1.15rem + 1vw, 2.15rem); line-height: 1.08; letter-spacing: -.02em; }
.matt-page-header p { color: #666; font: .76rem/1.4 var(--matt-mono); margin-top: .25rem; }
.matt-featured { overflow: hidden; border: 1px solid #d6d6d6; border-radius: .35rem; }
.matt-content { font-size: 1rem; line-height: 1.7; overflow-wrap: anywhere; word-break: break-word; }
.matt-content :is(h1, h2, h3, h4) { font-weight: 700; letter-spacing: -.02em; margin: 1.25rem 0 .55rem; }
.matt-content h2 { font-size: 1.25rem; }
.matt-content h3 { font-size: 1.05rem; }
.matt-content :is(p, ul, ol, blockquote, pre) { margin: .7rem 0; }
.matt-content :is(ul, ol) { padding-left: 1.25rem; }
.matt-content ul { list-style: disc; }
.matt-content ol { list-style: decimal; }
.matt-content a { text-decoration-color: var(--matt-link); text-decoration-thickness: .08em; }
.matt-content code { background: white; border: 1px solid #d6d6d6; border-radius: .2rem; font: .88em var(--matt-mono); padding: .04rem .28rem .08rem; }
.matt-content pre { background: white; border: 1px solid #d6d6d6; border-radius: .35rem; overflow: auto; padding: .75rem .85rem; }
.matt-content pre code { border: 0; padding: 0; }
.matt-content blockquote { background: #fafafa; border-left: 2px solid #cfcfcf; border-radius: .2rem; color: #333; padding: .55rem .7rem; }
.matt-content :is(action-text-attachment, .attachment) { display: block; margin: 1rem 0; }
.matt-content :is(img, .attachment img) { border-radius: .35rem; max-width: 100%; height: auto; }
.matt-content .attachment__caption { color: #666; font-size: .85rem; text-align: center; }
.matt-content .attachment-gallery { display: flex; flex-wrap: wrap; gap: .5rem; }
.matt-content .attachment-gallery > * { flex: var(--ar, 1) 1 0; min-width: 0; margin: 0; }
.matt-content .video-embed { position: relative; aspect-ratio: 16 / 9; background: #111; overflow: hidden; border: 1px solid #d6d6d6; border-radius: .35rem; }
.matt-content .video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.matt-footer { background: oklch(95.6% 0 0); border-top: 1px solid oklch(84% 0 0); margin-top: 4rem; }
.matt-footer-inner { max-width: 58rem; margin: 0 auto; padding: 0 1rem; }
.matt-footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; padding: 1.5rem 0; color: #666; font-size: .875rem; }
.matt-footer-bottom nav { display: flex; gap: 1.5rem; }
.matt-newsletter { margin: 2rem 0; padding: 1rem; background: white; border: 1px solid #d6d6d6; border-radius: .45rem; text-align: center; }
.matt-newsletter h2 { margin: 0 0 .4rem; font-size: 1.2rem; font-weight: 600; letter-spacing: -.02em; }
.matt-newsletter-intro { margin: 0 0 1.25rem; color: #333; font-size: .92rem; line-height: 1.5; }
.pagination a { display: inline-block; border: 1px solid #d6d6d6; border-radius: .2rem; background: white; padding: .45rem .75rem; text-decoration: none; }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: .65rem; margin-top: 1rem; font-size: .84rem; }
.notes-stream { display: grid; gap: 1rem; }
.note-card { padding: 1.15rem; background: white; border: 1px solid #d6d6d6; border-radius: .45rem; }
.note-body { white-space: pre-wrap; }
@media (max-width: 36rem) { .matt-header-inner { flex-wrap: wrap; } .matt-nav { margin-left: auto; } }
@media (max-width: 28rem) { .matt-content .attachment-gallery { flex-direction: column; } }
.matt-tags { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; }
.matt-tag { border: 1px solid #d6d6d6; border-radius: 999px; padding: .2rem .48rem; color: #444; font: .68rem/1 var(--matt-mono); text-decoration: none; }
.matt-tag:hover { border-color: #222; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.matt-newsletter-fields { display: grid; gap: .75rem; margin-bottom: .75rem; }
.matt-newsletter-fields input { width: 100%; min-width: 0; padding: .62rem .72rem; background: white; color: #222; border: 1px solid #cfcfcf; border-radius: .38rem; font: .9rem/1.45 var(--matt-mono); }
.matt-newsletter-fields input::placeholder { color: #8b8b8b; }
.matt-newsletter-fields input:hover { border-color: #9f9f9f; }
.matt-newsletter-fields input:focus { border-color: var(--matt-link); }
@media (min-width: 36rem) { .matt-newsletter-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); } }
.matt-button { display: inline-flex; align-items: center; justify-content: center; padding: .4rem .55rem; background: white; color: #222; border: 1px solid #222; border-radius: .2rem; cursor: pointer; font-family: inherit; font-size: .83rem; font-weight: 700; line-height: 1; text-decoration: none; }
.matt-button:hover { border-color: var(--matt-link); color: var(--matt-link); }
.matt-newsletter-feedback { margin-bottom: .75rem; padding: .65rem .8rem; border: 1px solid #c7d3df; border-left: 3px solid var(--matt-link); border-radius: .35rem; background: white; color: #3d4f63; font: 500 .75rem/1.55 var(--matt-mono); text-align: left; }
.matt-newsletter-feedback[role="alert"] { border-color: #f1c6c2; border-left-color: #e04b43; color: #8b2b24; }
.matt-button:disabled { opacity: .6; cursor: default; }
.matt-content :is(.attachment--preview, .media-figure) { margin-inline: auto; width: fit-content; max-width: 100%; }
.matt-content :is(img, .attachment img, .media-figure img) { margin-inline: auto; max-height: min(22rem, 65vh); object-fit: contain; width: auto; }
.matt-content .attachment-gallery { --gallery-row: 13rem; margin: 1rem 0; }
.matt-content .attachment-gallery > * { flex: var(--ar, 1.4) 1 calc(var(--ar, 1.4) * var(--gallery-row)); }
.matt-content .attachment-gallery img { max-height: none; width: 100%; }
.public-note { padding: 1.15rem; background: white; border: 1px solid #d6d6d6; border-radius: .45rem; }
.note-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.note-byline { display: flex; flex-wrap: wrap; gap: .5rem; font-size: .8rem; color: #666; margin-bottom: .75rem; }
@media (max-width: 40rem) { .matt-content .attachment-gallery { --gallery-row: 7.5rem; } }

.matt-contact-card { padding: 0; overflow: hidden; }
.matt-contact-card .lexxy-content { display: grid; }
.matt-contact-card .iaw-hey-card__media { display: flex; align-items: center; justify-content: center; padding: 1.4rem; background: #f0f3f8; }
.matt-contact-card .iaw-hey-avatar-frame { width: min(16rem, 100%); }
.matt-contact-card .iaw-hey-avatar-frame img { width: 100%; border-radius: 50%; }
.matt-contact-card .iaw-hey-card__content { display: grid; gap: .9rem; padding: 1.4rem 1.5rem; }
.matt-contact-card .iaw-hey-card__content :is(h1, h2, p) { margin: 0; }
.matt-contact-card .iaw-hey-title { font-size: clamp(2rem, 2vw + 1.1rem, 2.8rem); line-height: .98; }
.matt-contact-card .iaw-hey-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.matt-contact-card .iaw-hey-actions :is(action-text-attachment, .media-figure) { margin: 0; }
.matt-contact-card .iaw-hey-actions a { display: inline-flex; align-items: center; min-height: 3rem; padding: .5rem 1rem; border: 1px solid #222; border-radius: .2rem; background: #222; color: white; text-decoration: none; font-size: .83rem; font-weight: 700; }
.matt-contact-card .iaw-hey-actions .iaw-btn-whatsapp { background: #159447; border-color: #12803c; }
.matt-contact-card .iaw-hey-socials { border-top: 1px solid #d6d6d6; padding-top: .95rem; }
.matt-contact-card .iaw-hey-socials__row { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .65rem; }
.matt-contact-card .iaw-hey-social-link { border: 1px solid #d6d6d6; border-radius: .2rem; padding: .4rem .55rem; font-size: .83rem; text-decoration: none; }
@media (min-width: 48rem) { .matt-contact-card .lexxy-content { grid-template-columns: minmax(14rem, 19rem) minmax(0, 1fr); } }

}