.article-template__hero{background:var(--f);color:var(--fd)}
.article-template__hero-in{display:grid;gap:2.4rem 4.8rem;align-items:stretch;padding-top:2rem;padding-bottom:3.2rem}
@media screen and (min-width:700px){.article-template__hero-in{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}}
@media screen and (min-width:900px){.article-template__hero-in{padding-bottom:4.8rem}}
.article-template__head{display:grid;gap:1.4rem;min-width:0;align-content:center}
.article-template__title{font-size:clamp(3rem,4vw,5rem);color:var(--fd)}
.article-template__lede{margin:0;font-size:1.9rem;font-weight:500}
.article-template__meta{margin:0;font-size:1.4rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.article-template__hero-image{margin:0;line-height:0;max-width:52rem;display:flex;align-items:center}
.article-template__hero-image img{display:block;width:100%;height:auto;border-radius:3.2rem}
.hy-art{display:grid;gap:3.2rem 5.6rem;align-items:start}
@media screen and (min-width:1100px){.hy-art{grid-template-columns:28rem minmax(0,1fr)}}
.hy-toc{min-width:0;border-radius:2.8rem;background:#d9f2d3;color:#12332b;padding:2rem 2.2rem}
@media screen and (min-width:1100px){.hy-toc{position:sticky;top:10rem;max-height:calc(100vh - 12rem);overflow:auto}}
.hy-toc summary{font-family:var(--hy-head);font-size:2rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1.2rem}
.hy-toc summary::-webkit-details-marker{display:none}
.hy-toc summary .icon{width:1.4rem;height:1.4rem;transition:transform .2s}
.hy-toc[open] summary .icon{transform:rotate(180deg)}
.hy-toc ol{margin:1.4rem 0 0;padding:0;list-style:none;display:grid;gap:.2rem;counter-reset:toc}
.hy-toc li{counter-increment:toc}
.hy-toc a{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.4rem;padding:.7rem 0;font-size:1.5rem;font-weight:700;line-height:1.3;text-decoration:none;color:inherit}
.hy-toc a::before{content:counter(toc);font-family:var(--hy-head);color:#2fb24a}
.hy-toc a:hover{text-decoration:underline;text-underline-offset:.3rem}
.article-template__content{min-width:0;display:grid;gap:2rem}
.article-template__content>h2{margin-top:2.4rem;scroll-margin-top:10rem;font-size:clamp(2.6rem,3vw,3.6rem)}
.article-template__content>h2:first-child{margin-top:0}
.article-template__content>h3{margin-top:.8rem;font-size:2.2rem;scroll-margin-top:10rem}
.article-template__content>p{margin:0;font-size:1.8rem;line-height:1.65}
.article-template__content>p a,.hy-note a,.hy-fig figcaption a{text-decoration:underline;text-underline-offset:.3rem;text-decoration-thickness:.15rem}
.article-template__content>ul,.article-template__content>ol{margin:0;padding-left:2.4rem;display:grid;gap:.8rem;font-size:1.8rem;line-height:1.55}
.hy-fig{margin:0;display:grid;gap:1rem}
.hy-fig__img{border-radius:2.8rem;overflow:hidden;line-height:0;background:#fff}
.hy-fig__img img{display:block;width:100%;height:auto}
.hy-fig--side{grid-template-columns:minmax(0,1fr);align-items:start}
@media screen and (min-width:750px){.hy-fig--side{grid-template-columns:minmax(0,var(--fw,32rem)) minmax(0,1fr);gap:2.8rem}}
.hy-fig figcaption{font-size:1.5rem;line-height:1.5}
.hy-fig--side figcaption{font-size:1.8rem;line-height:1.6}
.hy-fig--side figcaption b{display:block;font-family:var(--hy-head);font-weight:400;font-size:2.2rem;line-height:1.2;margin-bottom:.8rem}
.hy-statfig{margin:0}
.hy-statfig figcaption{margin-top:1rem;font-size:1.4rem}
.hy-statfig .hy-stats li{background:#d9f2d3}
.hy-statfig .hy-ladder li:not(.is-best){background:#d9f2d3}
.hy-statfig .hy-ladder li:not(.is-best) .hy-ladder__bar{background:#fff}
.hy-shelf{margin:0}
.hy-shelf .hy-tickets .hy-ticket{flex-basis:100%}
@media screen and (min-width:750px){.hy-shelf .hy-tickets .hy-ticket{flex-basis:calc(50% - .8rem)}}
.hy-artbuy{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem 2rem;margin:0;padding:2rem 2.4rem;border-radius:2.8rem;background:#fde2df;color:#12332b;font-size:1.6rem}
.hy-artbuy figcaption{flex:1 1 26rem;min-width:0}
.hy-artfoot{display:grid;gap:2.4rem}
.blog-articles{display:grid;gap:2rem;margin:0;padding:0;list-style:none}
@media screen and (min-width:900px){.blog-articles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.main-blog__hero{background:#aae8bb}
.main-blog__hero .page-width{display:grid;gap:1.2rem;padding-top:2rem;padding-bottom:3.6rem}
.main-blog__hero p{margin:0;font-size:1.9rem;font-weight:500;max-width:70rem}