: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{padding:0 2rem;margin:0 2rem}.home-container{max-width:980px;margin:150px auto 0}header{position:fixed;top:0;left:0;right:0;z-index:9;border-bottom:4px solid #d3d3d3;background-color:white}header>.home-container{display:flex;align-items:center;justify-content:space-between;max-width:980px;margin:0 auto;padding-top:1rem;padding-bottom:1rem;transition:all .2s ease}.nav-desc,.nav-links{display:flex;width:250px}.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{font-size:.8rem;padding:0;align-items:center;justify-content:center}header.sticky .nav-brand h1{margin:0}header.sticky .nav-desc{display:none;margin-bottom:0;font-size:.6rem}header.sticky .nav-links{display:none}footer{display:flex;justify-content:center;align-items:center}.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{position:absolute;font-size:12px;bottom:0;right:-4px}.nes-btn.copycode{position:absolute;font-size:12px;top:0;right:0}section.showcase>section.samplecode>pre code{font-size:13px;line-height:1.5;padding:1.5rem}.item{margin-bottom:-1rem}.item>*{margin-bottom:1.5rem!important}.item.home-containers>.nes-container{display:inline-block;max-width:400px}.scroll-btn{position:fixed;bottom:-60px;right:2rem;box-shadow:0 5px 20px rgba(0,0,0,.6);transition:all .3s ease}.scroll-btn.active{bottom:25px}.scroll-btn>span{display:block;transform:rotate(90deg)}.progress-container{width:calc(100% - 8px)}.progress-count{display:flex;justify-content:space-between}.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 .05s,color .2s ease-in-out .1s}a:is(:hover,:focus){background-position:0 0;color:var(--blue)}body.dark{color:white}.dark header,body.dark{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 a,.dark .nes-list li:before{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 .05s,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:white}.auto header,body.auto{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 a,.auto .nes-list li:before{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 .05s,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{margin:0 .5rem;justify-content:center;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}}