@layer components{.blog-list{--margin:40px;--padding:20px;width:min(calc(100% - var(--padding)),var(--layout-width));min-height:calc(100vh - (var(--navigation-height) + var(--margin)*2));border-top:var(--layout-border-dashed);border-bottom:var(--layout-border-dashed);margin:0 auto 40px;display:flex;position:relative}@media (width>=520px) and (width<=920px){.blog-list{--padding:50px}}.blog-list__inner{flex-direction:column;gap:12px;width:min(100% - 20px,720px);margin-inline:auto;padding-block:22px;display:flex}@media (width>=720px){.blog-list__inner{padding-block:44px}}.blog-list__tagline{margin-bottom:8px}.blog-list__categories{flex-wrap:wrap;align-items:center;gap:6px;margin-block:6px;display:flex}.blog-list__categories-title{margin-right:4px}.blog-list__categories-title,.blog-list__category{font-family:var(--monospace-font)}.blog-list__item{color:var(--grey-700);border-radius:var(--radius-100);flex-direction:column;margin-block:8px;text-decoration:none;display:flex}.blog-list__item-title{font-family:var(--serif-font)}.blog-list__item:is(:hover,:focus) .blog-list__item-title{text-decoration:underline}.blog-list__item-date{font-size:var(--label);font-family:var(--serif-font)}.blog-list__item-categories{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.blog-list__item-category{font-size:calc(var(--label) - 3px);font-family:var(--monospace-font);background-color:var(--grey-000);border:var(--layout-border);border-radius:var(--radius-100);padding:3px 5px}}