.blog-index{padding-top:1.5rem}.blog-index__head{border-bottom:1px solid var(--line-soft);margin-bottom:2.4rem;padding-bottom:1.2rem;position:relative}.blog-index__title{font-family:var(--font-sans);letter-spacing:-.04em;align-items:baseline;gap:.85rem;margin:.2rem 0 .4rem;font-size:clamp(2.2rem,5vw,3rem);font-weight:800;line-height:1.1;display:inline-flex;position:relative}.blog-index__title-en{font-weight:800}.blog-index__title-ja{letter-spacing:.3em;color:var(--muted);font-size:.92rem;font-weight:500}.blog-index__lead{max-width:36em;color:var(--ink-soft);margin:1.4rem 0 1.2rem}.blog-index__tags{flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.5rem;display:flex}.blog-index__tag{font-family:var(--font-sans);letter-spacing:-.005em;border:1px solid var(--line);background:var(--card);color:var(--ink-soft);transition:color .22s var(--ease-out), border-color .22s var(--ease-out), background-color .22s var(--ease-out);border-radius:999px;padding:.32rem .78rem;font-size:.78rem;font-weight:600}.blog-index__tag:hover{color:var(--ink);border-color:var(--ink)}.blog-index__tag[data-active=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.blog-index__tags[data-expanded=false] .blog-index__tag[data-extra=true]{display:none}.blog-index__tags[data-expanded=false] .blog-index__tag[data-extra=true][data-pinned=true]{animation:none;display:inline-flex}.blog-index__tags[data-expanded=true] .blog-index__tag[data-extra=true]{animation:tag-reveal .32s var(--ease-out) both;animation-delay:calc(var(--reveal-i,0) * 35ms)}@keyframes tag-reveal{0%{opacity:0;transform:translateY(-4px)scale(.94)}to{opacity:1;transform:none}}.blog-index__tag--toggle{font-family:var(--font-mono);letter-spacing:.02em;color:var(--muted);border-style:dashed;padding:.3rem .7rem;font-size:.72rem}.blog-index__tag--toggle:hover{color:var(--ink);border-color:var(--ink)}@media (prefers-reduced-motion:reduce){.blog-index__tags[data-expanded=true] .blog-index__tag[data-extra=true]{animation:none}}.blog-list{margin:0;padding:0;list-style:none}.blog-list__item{border-bottom:1px dashed var(--line-soft)}.blog-list__item:last-child{border-bottom:0}.blog-card{color:var(--ink);isolation:isolate;background-image:none;flex-direction:column;gap:.35rem;padding:1rem .4rem 1rem .2rem;display:flex;position:relative}.blog-card:before{--eff-rot:90deg;content:"";opacity:0;width:26px;height:26px;transform:scale(.3) rotate(var(--eff-rot));pointer-events:none;background:url(/images/effect-orange-bounce.png) 50%/contain no-repeat;position:absolute;top:.85rem;right:-6px}.blog-card:after{content:"";background:var(--card-hover);border-radius:var(--radius-sm);opacity:0;z-index:-1;transition:opacity .22s;position:absolute;inset:.4rem -.3rem}.blog-card:hover:after{opacity:1}.blog-card:hover:before{animation:hero-pop .72s var(--ease-soft) both}.blog-list__item:nth-child(2n) .blog-card:before{--eff-rot:-45deg;background-image:url(/images/effect-pink-wiggle.png)}.blog-list__item:nth-child(3n) .blog-card:before{--eff-rot:0deg;background-image:url(/images/effect-mint-sparkle.png)}.blog-card__date{font-family:var(--font-mono);letter-spacing:.04em;color:var(--muted);margin:0;font-size:.74rem}.blog-card__external{color:var(--accent-strong);letter-spacing:.02em;font-weight:600}.blog-card--external .blog-card__title{text-underline-offset:.18em;text-decoration-line:underline;text-decoration-color:#0000;text-decoration-thickness:1px;transition:text-decoration-color .22s}.blog-card--external:hover .blog-card__title{text-decoration-color:currentColor}.blog-card__title{font-family:var(--font-sans);letter-spacing:-.025em;color:var(--ink);margin:0;font-size:clamp(1.2rem,2.4vw,1.5rem);font-weight:800;line-height:1.35}.blog-card__desc{color:var(--ink-soft);max-width:none;margin:0;font-size:.92rem;font-weight:400;line-height:1.6}.blog-card__tags{flex-wrap:wrap;gap:.35rem;display:flex}.blog-list__empty{text-align:center;padding:2rem 0}
