@font-face{font-display:swap;font-family:'JetBrains Mono';font-style:normal;font-weight:400;src:url('../fonts/jetbrains-mono-v20-latin-regular.woff2') format('woff2')}.bloglist-container{width:100%;padding:2rem;font-family:'JetBrains Mono',monospace;color:#333}.bloglist-list{display:flex;flex-direction:column;width:100%}.bloglist-item{display:grid;grid-template-columns:minmax(15rem,25%) 1fr auto;grid-gap:1.5rem 0;width:100%;cursor:pointer;position:relative;padding:0;transition:background-color 0.2s ease}.bloglist-title{margin:0;font-size:1.4rem;font-weight:normal;text-transform:uppercase}.bloglist-title a{color:#333;text-decoration:none;position:relative;display:inline-block;overflow:hidden}.bloglist-title a span{position:relative;z-index:1;transition:color 0.1s}.bloglist-date,.bloglist-reading-time{position:relative;display:inline-block;overflow:hidden}.bloglist-date span,.bloglist-reading-time span{position:relative;z-index:1;transition:color 0.1s}@media (min-width:769px){.bloglist-title a::before,.bloglist-date::before,.bloglist-reading-time::before{content:'';position:absolute;top:0;left:0;width:0%;height:100%;background-color:#000;transition:width 0.6s cubic-bezier(0.05,0.95,0.1,1);z-index:0}.bloglist-item:hover .bloglist-title a::before,.bloglist-item:hover .bloglist-date::before,.bloglist-item:hover .bloglist-reading-time::before{width:100%}.bloglist-title a span,.bloglist-date span,.bloglist-reading-time span{color:#333}.bloglist-item:hover .bloglist-title a span,.bloglist-item:hover .bloglist-date span,.bloglist-item:hover .bloglist-reading-time span{color:white;z-index:2}}.bloglist-date{justify-self:center;font-size:1.4rem}.bloglist-reading-time{text-align:right;justify-self:end;min-width:2rem;font-size:1.4rem}.bloglist-item-link{position:absolute;top:0;left:0;width:100%;height:100%;z-index:5}.content-wrapper{display:flex;justify-content:center;width:100%;margin:0;padding:0}@media (max-width:768px){.content-wrapper{width:100%}.bloglist-container{width:100%;padding:1rem}.bloglist-item{grid-template-columns:minmax(10rem,1fr) 1fr auto;grid-gap:1.2rem 0}.bloglist-title,.bloglist-date{font-size:1.2rem}.bloglist-reading-time{display:none}}@media (max-width:480px){.bloglist-container{padding:0.25rem 0.75rem}.bloglist-item{grid-template-columns:1fr 1fr;grid-gap:0.5rem 0;padding:0.25rem 0}.bloglist-title{font-size:0.75rem;max-width:100%}.bloglist-date{font-size:0.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right;justify-self:end}.bloglist-reading-time{display:none}}html.dark-mode .bloglist-container{color:#e7e5e4}html.dark-mode .bloglist-title a,html.dark-mode .bloglist-date,html.dark-mode .bloglist-reading-time{color:#e7e5e4}@media (min-width:769px){html.dark-mode .bloglist-title a::before,html.dark-mode .bloglist-date::before,html.dark-mode .bloglist-reading-time::before{background-color:#fff}html.dark-mode .bloglist-title a span,html.dark-mode .bloglist-date span,html.dark-mode .bloglist-reading-time span{color:#e7e5e4}html.dark-mode .bloglist-item:hover .bloglist-title a span,html.dark-mode .bloglist-item:hover .bloglist-date span,html.dark-mode .bloglist-item:hover .bloglist-reading-time span{color:#000}}