.yl-blog-shell{flex-direction:column;min-height:100dvh;display:flex}.yl-blog-shell>main{flex:1}.yl-blog-index{width:100%;max-width:720px;margin:0 auto;padding:48px 20px 80px}.yl-blog-index__header{margin-bottom:28px}.yl-blog-index__header p{color:var(--color-muted);margin:0;font-size:17px;line-height:1.6}.yl-blog-filter{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.yl-blog-filter--placeholder{pointer-events:none;-webkit-user-select:none;user-select:none;visibility:hidden}.yl-blog-post-card__link:focus-visible,.yl-blog-state__action:focus-visible,.yl-blog-not-found__home:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.yl-blog-post-list{gap:14px;display:grid}.yl-blog-post-card{margin:0}.yl-blog-post-card__link{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-card);color:var(--color-fg);transition:border-color var(--motion-base) var(--ease-out-soft), box-shadow var(--motion-base) var(--ease-out-soft), transform var(--motion-base) var(--ease-out-soft);align-items:flex-start;gap:20px;padding:24px 26px;text-decoration:none;display:flex}.yl-blog-post-card__body{flex:1;min-width:0}.yl-blog-post-card h2{letter-spacing:-.012em;transition:color var(--motion-base) var(--ease-out-soft);margin:0 0 8px;font-size:21px;line-height:1.35}.yl-blog-post-card__lead{color:var(--color-muted);margin:0 0 12px;font-size:16px;line-height:1.55}.yl-blog-post-card__meta{color:var(--color-muted);flex-wrap:wrap;align-items:center;gap:6px;margin:0;font-size:13.5px;line-height:1.45;display:flex}.yl-blog-post-card__cover{aspect-ratio:3/2;background:var(--color-surface-muted);border:1px solid var(--color-border);border-radius:var(--radius-control);flex:0 0 168px;overflow:hidden}.yl-blog-post-card__cover img{object-fit:cover;width:100%;height:100%;display:block}.yl-blog-filter-empty{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-panel);color:var(--color-muted);text-align:center;margin:0;padding:24px}.yl-blog-state{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-card);text-align:center;padding:clamp(28px,8vw,48px)}.yl-blog-state h2{letter-spacing:-.015em;margin:0 0 10px;font-size:24px;line-height:1.25}.yl-blog-state p{color:var(--color-muted);max-width:520px;margin:0 auto;font-size:16px;line-height:1.65}.yl-blog-state__action{background:var(--color-accent);border-radius:var(--radius-button);color:var(--color-accent-fg);min-height:48px;transition:filter var(--motion-base) var(--ease-out-soft);justify-content:center;align-items:center;margin-top:24px;padding:12px 22px;font-size:15px;font-weight:600;text-decoration:none;display:inline-flex}.yl-blog-not-found{text-align:center;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:680px;margin:0 auto;padding:72px 20px 96px;display:flex}.yl-blog-not-found__eyebrow{color:var(--color-accent);font-family:var(--font-mono);letter-spacing:.12em;margin:0 0 10px;font-size:13px;font-weight:600}.yl-blog-not-found h1{letter-spacing:-.025em;margin:0 0 12px;font-size:clamp(2rem,6vw,2.75rem);line-height:1.15}.yl-blog-not-found__actions{flex-direction:column;align-items:center;gap:14px;display:flex}.yl-blog-not-found__home{color:var(--color-muted);text-underline-offset:3px;font-size:14px}@media (hover:hover){.yl-blog-post-card__link:hover{border-color:color-mix(in oklab, var(--color-fg) 22%, var(--color-border));box-shadow:0 8px 28px color-mix(in oklab, var(--color-fg) 7%, transparent);transform:translateY(-1px)}.yl-blog-post-card__link:hover h2{color:var(--color-accent)}.yl-blog-state__action:hover{filter:brightness(1.08)}}@media (max-width:640px){.yl-blog-index{padding:36px 18px 64px}.yl-blog-index__header{margin-bottom:24px}.yl-blog-filter{scrollbar-width:none;scroll-snap-type:x proximity;flex-wrap:nowrap;margin-inline:-18px;padding-inline:18px;overflow-x:auto}.yl-blog-filter::-webkit-scrollbar{display:none}.yl-blog-filter__chip{scroll-snap-align:start;flex:none}.yl-blog-post-card__link{gap:14px;padding:20px}.yl-blog-post-card__cover{flex-basis:96px}.yl-blog-post-card:has(.yl-blog-post-card__cover) .yl-blog-post-card__lead{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}@media (max-width:380px){.yl-blog-index{padding-inline:14px}.yl-blog-post-card__link{gap:12px;padding:18px}.yl-blog-post-card h2{font-size:19px}.yl-blog-filter{margin-inline:-14px;padding-inline:14px}}@media (prefers-reduced-motion:reduce){.yl-blog-post-card__link,.yl-blog-post-card h2,.yl-blog-state__action{transition:none}}
