.badge{vertical-align:super;font-size:.8em;border-width:1px;border-style:solid;border-color:rgba(0,0,0,0);padding:.25em .5em}.badge--pill{border-radius:1em}.badge--gray-0{background-color:var(--gray-0)}.badge--gray-1{background-color:var(--gray-5)}.badge--gray-2{background-color:var(--gray-10)}.badge--gray-3{background-color:var(--gray-15)}.badge--gray-4{background-color:var(--gray-20)}.badge--gray-5{background-color:var(--gray-25)}.badge--gray-6{background-color:var(--gray-30)}.badge--gray-7{background-color:var(--gray-35)}.badge--gray-8{background-color:var(--gray-40)}.badge--gray-9{background-color:var(--gray-45)}.badge--gray-10{background-color:var(--gray-50)}.badge--gray-11{background-color:var(--gray-55)}.badge--gray-12{background-color:var(--gray-60)}.badge--gray-13{background-color:var(--gray-65)}.badge--gray-14{background-color:var(--gray-70)}.badge--gray-15{background-color:var(--gray-75)}.badge--gray-16{background-color:var(--gray-80)}.badge--gray-17{background-color:var(--gray-85)}.badge--gray-18{background-color:var(--gray-90)}.badge--gray-19{background-color:var(--gray-95)}.badge--gray-20{background-color:var(--gray-100)}.badge--primary{color:var(--white);background-color:var(--primary)}.pagination{display:flex;list-style:none}.pagination__item{border:1px solid var(--gray-85);border-right-width:0;width:4ch;height:4ch;display:flex;align-items:center;justify-content:center;background-color:var(--white)}.pagination__item:first-child{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.pagination__item:last-child{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem;border-right-width:1px}@media(hover: hover){.pagination__item :hover{background-color:var(--gray-85)}}.pagination__item--current,.pagination__item--current:hover{color:var(--white);border-color:var(--body);background-color:var(--body)}.pagination__item a{width:100%;height:100%;text-decoration:none;text-align:center;display:grid;place-content:center}.youtube,.youtube-detail{display:grid;grid-template-columns:subgrid;gap:2rem;margin:2rem 0}.youtube>*,.youtube-detail>*{grid-column:1/-1}.youtube h1,.youtube p,.youtube-detail h1,.youtube-detail p{margin:0}.youtube .button,.youtube-detail .button{justify-self:start}.youtube .pagination,.youtube-detail .pagination{margin:2rem auto}.videos{display:grid;grid-template-columns:subgrid;gap:1rem}.videos__video{grid-column:span 12;grid-row:span 4;display:grid;grid-template-rows:subgrid;gap:1rem;padding:.5rem;border-radius:.25rem;border:1px solid var(--gray-85)}@media(min-width: 768px){.videos__video{grid-column:span 6}}@media(min-width: 1024px){.videos__video{grid-column:span 4}}@media(min-width: 1280px){.videos__video{grid-column:span 3}}.videos__image{aspect-ratio:16/9}.videos__image img{width:100%;height:100%;object-fit:cover}.videos__date,.videos__viewcount,.videos__likecount{grid-row:2;display:flex;gap:.5rem;color:var(--gray-25)}.videos__viewcount{justify-self:center}.videos__likecount{justify-self:end}.videos__image,.videos__name,.videos__shortdescription{grid-column:span 3}.videos .pagination{margin:2rem auto}.youtube-detail a{text-decoration:underline}.youtube-detail .video{display:grid;grid-template-columns:subgrid;align-items:start;gap:1rem}.youtube-detail .video__iframe{grid-column:1/-1;width:100%;aspect-ratio:16/9}@media(min-width: 1024px){.youtube-detail .video__iframe{grid-column:span 7}}.youtube-detail .video__info{grid-column:1/-1;display:grid;grid-template-columns:repeat(3, 1fr);gap:1rem;grid-auto-rows:min-content;align-self:stretch;align-items:start;background-color:var(--gray-95);padding:1rem}@media(min-width: 1024px){.youtube-detail .video__info{grid-column:span 5}}.youtube-detail .video__date,.youtube-detail .video__viewcount,.youtube-detail .video__likecount{grid-row:1;display:flex;gap:.5rem;color:var(--gray-25)}.youtube-detail .video__viewcount{justify-self:center}.youtube-detail .video__likecount{justify-self:end}.youtube-detail .video__name{grid-column:1/-1}.youtube-detail .video__tags{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}.youtube-detail .video__longdescription{grid-column:1/-1}