:scope{--black:black;--dark-gray:#6f7a89;--half-gray:#cacfd1;--blue:#1f5de1;--green:#1ee494;--orange:#e4af27;--gray:#e2e4e8;--light-gray:#f6f6f6;--white:white;--trans:transparent}body{margin:0 2rem;padding:0 2rem}.home-container{max-width:980px;margin:150px auto 0}header{z-index:9;background-color:#fff;border-bottom:4px solid #d3d3d3;position:fixed;top:0;left:0;right:0}header>.home-container{justify-content:space-between;align-items:center;max-width:980px;margin:0 auto;padding-top:1rem;padding-bottom:1rem;transition:all .2s;display:flex}.nav-desc,.nav-links{width:250px;display:flex}.nav-links{flex-direction:column;align-items:flex-end}.nav-links>a{color:#212529;text-decoration:none}.nav-links p{margin-bottom:0}header.sticky>.home-container{justify-content:center;align-items:center;padding:0;font-size:.8rem}header.sticky .nav-brand h1{margin:0}header.sticky .nav-desc{margin-bottom:0;font-size:.6rem;display:none}header.sticky .nav-links{display:none}footer{justify-content:center;align-items:center;display:flex}.topic{margin-bottom:3rem}section.showcase{margin-top:2.5rem!important}section.showcase>section.nes-container{padding-bottom:2.5rem!important}section.showcase>section.nes-container,section.showcase>section.samplecode{position:relative}.nes-btn.showcode{font-size:12px;position:absolute;bottom:0;right:-4px}.nes-btn.copycode{font-size:12px;position:absolute;top:0;right:0}section.showcase>section.samplecode>pre code{padding:1.5rem;font-size:13px;line-height:1.5}.item{margin-bottom:-1rem}.item>*{margin-bottom:1.5rem!important}.item.home-containers>.nes-container{max-width:400px;display:inline-block}.scroll-btn{transition:all .3s;position:fixed;bottom:-60px;right:2rem;box-shadow:0 5px 20px #0009}.scroll-btn.active{bottom:25px}.scroll-btn>span{display:block;transform:rotate(90deg)}.progress-container{width:calc(100% - 8px)}.progress-count{justify-content:space-between;display:flex}.no-decoration a{text-decoration:none}a{background:linear-gradient(90deg,var(--green)50%,var(--trans)50%)100% 0/200% 100% no-repeat;transition:background-position .2s ease-out 50ms,color .2s ease-in-out .1s}a:is(:hover,:focus){color:var(--blue);background-position:0 0}body.dark{color:#fff;background-color:#242424}.dark header{background-color:#242424}.dark .nav-links a{color:#dedad6}.dark .nes-container:not(.is-dark).with-title>.title{background-color:#242424}.dark .nes-progress{border-image-source:url("data:image/svg+xml;utf8,<?xml version=\"1.0\" encoding=\"UTF-8\" ?><svg version=\"1.1\" width=\"5\" height=\"5\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M2 1 h1 v1 h-1 z M1 2 h1 v1 h-1 z M3 2 h1 v1 h-1 z M2 3 h1 v1 h-1 z\" fill=\"rgb(219,219,219)\" /></svg>")}.dark .nes-list li:before,.dark .nes-list li a{color:#dedad6}.dark a{background:linear-gradient(90deg,var(--orange)50%,var(--trans)50%)100% 0/200% 100% no-repeat;transition:background-position .2s ease-out 50ms,color .2s ease-in-out .1s}.dark a:is(:hover,:focus){background-position:0 0;color:var(--blue)!important}@media (prefers-color-scheme:dark){body.auto{color:#fff;background-color:#242424}.auto header{background-color:#242424}.auto .nav-links a{color:#dedad6}.auto .nes-container:not(.is-dark).with-title>.title{background-color:#242424}.auto .nes-progress{border-image-source:url("data:image/svg+xml;utf8,<?xml version=\"1.0\" encoding=\"UTF-8\" ?><svg version=\"1.1\" width=\"5\" height=\"5\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M2 1 h1 v1 h-1 z M1 2 h1 v1 h-1 z M3 2 h1 v1 h-1 z M2 3 h1 v1 h-1 z\" fill=\"rgb(219,219,219)\" /></svg>")}.auto .nes-list li:before,.auto .nes-list li a{color:#dedad6}.auto a{background:linear-gradient(90deg,var(--orange)50%,var(--trans)50%)100% 0/200% 100% no-repeat;transition:background-position .2s ease-out 50ms,color .2s ease-in-out .1s}.auto a:is(:hover,:focus){background-position:0 0;color:var(--blue)!important}}@media screen and (max-width:calc(980px - 4rem)){header>.home-container{margin:0 4rem}}@media screen and (max-width:768px){body{margin:2rem .5rem;padding:0}header>.home-container{justify-content:center;margin:0 .5rem;padding:0}.nav-desc,.nav-links{display:none}.nav-brand{margin-bottom:0}}@media screen and (max-width:580px){body>.home-container{margin-top:70px}.scroll-btn.active{bottom:60px}}