style.css

:root.WoB{--text-color: hsl(0, 0%, 98%);--background-color: hsl(0, 0%, 2%);--link-text-color: hsl(0, 0%, 95%);--text-text-hover-color: hsl(0, 0%, 100%)}:root.BoW{--text-color: hsl(0, 0%, 2%);--background-color: hsl(0, 0%, 98%);--link-text-color: hsl(0, 0%, 0%);--link-text-hover-color: hsl(0, 0%, 0%)}html{background:var(--background-color);color:var(--text-color)}body{font:1em -apple-system,Roboto,sans-serif;line-height:1.4em;margin:auto;max-width:28rem;overflow-x:hidden;padding-bottom:8rem;padding-top:3rem;scrollbar-width:none;transition:color .25s ease}p{hyphens:auto}hr{width:50%}div:has(>sup){padding-left:10%;padding-right:10%;width:80%}main{margin:auto;padding-top:3rem;padding-bottom:8rem}.footnote-definition{display:flex}.footnote-definition-label{padding-right:1em;padding-top:1em}div:has(>p>.demo_canvas){padding-top:5%;padding-bottom:5%}p:has(>.demo_canvas){box-shadow:0px 0px 30px 6px var(--link-text-color)}p>code{font-size:85%;padding-left:3%;padding-right:3%;border-radius:3px;background-color:var(--text-color);color:var(--background-color)}aside>.q-1{border:2px solid var(--text-color);border-radius:20px 20px 20px 0px;padding:5px}aside>.a-me{border:2px solid var(--text-color);border-radius:20px 20px 0px 20px;padding:5px}#archive{padding-top:30px}.homepage-list{list-style:none;padding-left:0}.archive-list{list-style:none;padding-top:1.7rem;padding-left:0;line-height:1.3em;margin-bottom:10px}.archive-list>li{line-height:1.5rem}.homepage-list>li{margin-bottom:10px}a{color:var(--link-text-color);text-decoration:underline;text-decoration-thickness:1.5px}div>div>a,nav>a,div>ul>*>a,article>h1>a,footer>div>a{text-decoration:none}ul,ol{padding-left:3ch}a:hover{color:var(--background-color);background-color:var(--text-color);outline:2px solid var(--text-color)}div>div>a:hover,nav>a:hover,div>ul>*>a:hover,article>h1>a:hover,footer>div>a :hover{text-decoration:underline}.sun{display:none;cursor:pointer;user-select:none;-webkit-user-select:none;color:var(--link-text-color);border-radius:100%}.sun:hover{text-decoration:underline;}.sun_container{display:flex;flex-direction:row-reverse;align-items:end;height:1rem}@keyframes fade{0%{opacity:0}100%{opacity:1}}.fade-in-0{margin:0;animation:fade 0s}.fade-in-1{margin:0;animation:fade .0833333333s}.fade-in-2{margin:0;animation:fade .1666666667s}.fade-in-3{margin:0;animation:fade .25s}.fade-in-4{margin:0;animation:fade .3333333333s}.fade-in-5{margin:0;animation:fade .4166666667s}.fade-in-6{margin:0;animation:fade .5s}.fade-in-7{margin:0;animation:fade .5833333333s}.fade-in-8{margin:0;animation:fade .6666666667s}.fade-in-9{margin:0;animation:fade .75s}.fade-in-10{margin:0;animation:fade .8333333333s}.fade-in-11{margin:0;animation:fade .9166666667s}.fade-in-12{margin:0;animation:fade 1s}.fade-in-13{margin:0;animation:fade 1.0833333333s}.fade-in-14{margin:0;animation:fade 1.1666666667s}.fade-in-15{margin:0;animation:fade 1.25s}.fade-in-16{margin:0;animation:fade 1.3333333333s}.fade-in-17{margin:0;animation:fade 1.4166666667s}.fade-in-18{margin:0;animation:fade 1.5s}.fade-in-19{margin:0;animation:fade 1.5833333333s}.fade-in-20{margin:0;animation:fade 1.6666666667s}.fade-in-21{margin:0;animation:fade 1.75s}.fade-in-22{margin:0;animation:fade 1.8333333333s}.fade-in-23{margin:0;animation:fade 1.9166666667s}.fade-in-24{margin:0;animation:fade 2s}.fade-in-25{margin:0;animation:fade 2.0833333333s}.fade-in-26{margin:0;animation:fade 2.1666666667s}.fade-in-27{margin:0;animation:fade 2.25s}.fade-in-28{margin:0;animation:fade 2.3333333333s}.fade-in-29{margin:0;animation:fade 2.4166666667s}.fade-in-30{margin:0;animation:fade 2.5s}.fade-in-31{margin:0;animation:fade 2.5833333333s}.fade-in-32{margin:0;animation:fade 2.6666666667s}.fade-in-33{margin:0;animation:fade 2.75s}.fade-in-34{margin:0;animation:fade 2.8333333333s}.fade-in-35{margin:0;animation:fade 2.9166666667s}.hide{display:none;font-size:small;animation:fade .2s linear}.reveal{width:65%}.revealDate{min-width:35%;text-align:right}.homepage-list{max-width:100%}li:hover>div>.hide{display:block;animation:fade .2s linear}.unset{all:unset}pre>code>span{color:#abb2bf}pre>code{background-color:inherit}.warning{color:var(--link-text-hover-color)}p:has(>a>img){padding-top:2rem;padding-bottom:3rem}p>img{max-width:100%}table{min-width:96%;padding-left:2%;padding-right:2%}th{border-bottom:1px var(--link-text-color) solid}td{flex-wrap:wrap}pre:has(code){border-style:dashed;line-height:1.3em}pre>code{color:var(--text-color)}.hidden{color:var(--background-color)}.hidden:hover{color:var(--text-color)}.image_panel>p>img{width:90%;margin-left:5%;margin-right:5%;border-radius:1%}video{max-width:100%}.image_panel{display:flex;justify-content:space-around}.fancy_button{width:100%;font-size:120%;text-align:center;border:2px solid var(--text-color);background-color:var(--background-color);color:var(--text-color);padding-top:5px;padding-bottom:5px}.fancy_button:hover{cursor:pointer;background-color:var(--text-color);color:var(--background-color)}.fancy_button:active{cursor:pointer;transform:translateY(1px)}.highlights{position:absolute;left:9%;top:415px;width:1500px;box-shadow:0 0 0 0;border-radius:0}.moon{--height: 15px;height:calc(var(--height));--moon_percent: 50;width:var(--height);border-radius:100% 100% 100% 100%;background:var(--text-color)}.moon_increasing{rotate:215deg}.moon_decreasing{rotate:35deg}.earth{position:relative;height:calc(var(--height));left:calc(1%*var(--moon_percent));width:calc(var(--height));border-radius:100% 100% 100% 100%;background:var(--background-color);opacity:90%}.moon:hover{cursor:pointer;box-shadow:0px 0px 31px 8px var(--text-color)}.moon:hover .earth{display:none}@media (max-width: 760px){body{padding-left:2%;padding-right:2%}.navbar{display:flex;flex-direction:row;justify-content:space-around;position:static;text-decoration:underline;text-decoration-thickness:1.5px}.logo a{font-size:28px;font-weight:800;text-align:center}.logo{display:flex;justify-content:space-around;padding-bottom:51.5px}pre{max-width:90%;padding-left:5%;padding-right:5%;border-radius:10px;overflow:auto}.sun_container{transform:translate(1963%, -322%);position:absolute}}@media (min-width: 761px){.navbar{padding-bottom:1rem;display:flex;flex-direction:column;text-align:right;position:fixed;transform:translate(-240%, 87%)}.logo a{font-size:32px;font-weight:800}.logo{padding-bottom:21.5px}pre{padding:1rem;border-radius:10px}.sun_container{position:fixed;transform:translate(3643%, 900%)}img:hover,video:hover{box-shadow:0px 0px 31px 8px var(--link-text-hover-color)}a:has(>img){padding-left:25%}.image_panel{margin-left:-20%;margin-right:-20%}}