Add default accent colors and update use of Scratch

* Add default accent colors, because the user shouldn't be obliged to
set these params to see the theme working as intended

* Update use of Scratch. Some scopes were unnecessary and there were
also some repetitions

* Minor change to the JS. Add KaTeX-related JS to the KaTeX partial

* Update color-picker.png to reflect the accent color changes

* Remove some outdated comments

14 files changed, 74 insertions, 70 deletions

diff --git a/assets/js/postpone.js b/assets/js/postpone.js
index 20ea045..f220ee3 100644
--- a/assets/js/postpone.js
+++ b/assets/js/postpone.js
@@ -19,5 +19,4 @@ PALETTE.onchange = function () {
   };
   
   updateAccent()
-};
-
+}
diff --git a/assets/js/prepone.js b/assets/js/prepone.js
index 73c3ca3..cb6ea73 100644
--- a/assets/js/prepone.js
+++ b/assets/js/prepone.js
@@ -1,5 +1,12 @@
 'use strict';
 
+// Get default accent colors
+{{ $darkAccent  := .Scratch.Get "darkAccent" }}
+{{ $lightAccent := .Scratch.Get "lightAccent" }}
+
+// Get CSS transition
+{{ $changeTransition := .Scratch.Get "changeTransition" }}
+
 /******************************
 / Mode switcher + Custom accent color
 / Based on: https://gist.github.com/regpaq/04c67e8aceecbf0fd819945835412d1f
@@ -47,7 +54,7 @@ function getAccent() {
       console.log("The user never used the palette while in the 'dark' mode.");
       console.log("As the mode is 'dark', loading the 'default accent color' for the dark mode.");
       
-      var currentAccent = "{{ .Site.Params.style.darkAccent }}"
+      var currentAccent = "{{ $darkAccent }}"
     } else {
     
       var currentAccent = localStorage.getItem('darkAccent')
@@ -62,7 +69,7 @@ function getAccent() {
       console.log("The user never used the palette while in the 'light' mode.");
       console.log("As the mode is 'light', loading the 'default accent color' for the light mode.");
 
-      var currentAccent = "{{ .Site.Params.style.lightAccent }}"
+      var currentAccent = "{{ $lightAccent }}"
     } else {
       var currentAccent = localStorage.getItem('lightAccent')
       
@@ -94,17 +101,6 @@ function updateAccent() {
 };
 
 
-// Currently being used for a HACK
-// See the KaTeX partial
-function getAll(selector) {
-  return Array.prototype.slice.call(document.querySelectorAll(selector), 0)
-};
-
-
-// Match the property found in the CSS
-// Used in the function below
-{{ $changeTransition := .Site.Params.Style.changeTransition | default ".5s ease" }}
-  
 document.addEventListener('DOMContentLoaded', function () {
 
   // Update the color picker with the active accent color 
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
index 98624be..137ae8a 100644
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
@@ -1,13 +1,3 @@
-/*

-  TODO

-  * Responsiveness polish (max-height, max-width, portrait and landscape, etc)

-  * Clean code in general

-  * Improve animation consistency (why am I using different delays...?)

-  * Improve dimension consistency (rem, em and px is being used almost randomly)

-  * Not everything should be nested, you moron

-  * Why there are so many word-break rules

-*/

-

 @charset 'utf-8';

 

 // Import base (variables and mixins), typography and general colors

@@ -16,8 +6,8 @@
         'colors/variables';

 

 

-// Transition for color changes

-$change-transition: {{ .Site.Params.Style.changeTransition | default ".5s ease" }}

+// Get transition for color changes

+$change-transition: {{ .Scratch.Get "changeTransition" }};

 

 

 

@@ -1347,7 +1337,13 @@ p.error {
 

 

 // Rich Content

-@import 'rich-content';

+{{ if (fileExists "static/css/rich-content.css") }}

+  @import '/css/rich-content.css';

+{{ else if (fileExists "assets/scss/rich-content.scss") }}

+  @import 'rich-content';

+{{ end }}

+

+

 

 // TODO

 // Custom user stuff

diff --git a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content
index f7e808f..74479f0 100644
--- a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content
+++ b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content
@@ -1 +1 @@
-@font-face{font-family:oswald;font-style:normal;font-weight:700;font-display:swap;src:local("Oswald"),url(../fonts/oswald-v29-latin-700.woff2)format("woff2"),url(../fonts/oswald-v29-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:400;font-display:swap;src:local("Open Sans Regular"),local("OpenSans-Regular"),url(../fonts/open-sans-v17-latin-regular.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-regular.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:700;font-display:swap;src:local("Open Sans Bold"),local("OpenSans-Bold"),url(../fonts/open-sans-v17-latin-700.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:italic;font-weight:400;font-display:swap;src:local("Open Sans Italic"),local("OpenSans-Italic"),url(../fonts/open-sans-v17-latin-italic.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-italic.woff)format("woff")}:root{font-size:18px}html{scroll-behavior:smooth}html[data-mode=light]{--bg: #ddd;--fg: #444;--alt-bg: #d6d6d6;--alt-fg: #333;--dtl: #fdfdfd;--bgmod: rgba(0, 0, 0, 0.3);--input-bg: #fefefe;--input-fg: #111;--input-bd: #ccc;--lpress: rgba(0, 0, 0, 0.2);--rlpress: rgba(255, 255, 255, 0.2)}html[data-mode=light] .chroma,html[data-mode=light] pre,html[data-mode=light] p code,html[data-mode=light] li code{color:#93a1a1;background-color:#002b36}html[data-mode=light] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=light] .chroma .lntable{border-spacing:0;padding:0;margin:0;border:0;width:auto;overflow:auto;display:block}html[data-mode=light] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=light] .chroma .nb{color:#b58900}html[data-mode=light] .chroma .ge{font-style:italic}html[data-mode=light] .chroma .gr{color:#e8625f;font-weight:700}html[data-mode=light] .chroma .gs{font-weight:700}html[data-mode=light] .chroma .x,html[data-mode=light] .chroma .kc,html[data-mode=light] .chroma .no,html[data-mode=light] .chroma .ni,html[data-mode=light] .chroma .ne,html[data-mode=light] .chroma .se,html[data-mode=light] .chroma .gh{color:#e9662f}html[data-mode=light] .chroma .lnt,html[data-mode=light] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#848f8f}html[data-mode=light] .chroma .k,html[data-mode=light] .chroma .kn,html[data-mode=light] .chroma .kp,html[data-mode=light] .chroma .o,html[data-mode=light] .chroma .ow,html[data-mode=light] .chroma .cs,html[data-mode=light] .chroma .cp,html[data-mode=light] .chroma .cpf,html[data-mode=light] .chroma .gi{color:#859900}html[data-mode=light] .chroma .kd,html[data-mode=light] .chroma .kr,html[data-mode=light] .chroma .bp,html[data-mode=light] .chroma .nc,html[data-mode=light] .chroma .nd,html[data-mode=light] .chroma .nf,html[data-mode=light] .chroma .nt,html[data-mode=light] .chroma .nv,html[data-mode=light] .chroma .gu{color:#3294da}html[data-mode=light] .chroma .kt,html[data-mode=light] .chroma .sr,html[data-mode=light] .chroma .gd{color:#e8625f}html[data-mode=light] .chroma .s,html[data-mode=light] .chroma .sa,html[data-mode=light] .chroma .sc,html[data-mode=light] .chroma .dl,html[data-mode=light] .chroma .s2,html[data-mode=light] .chroma .si,html[data-mode=light] .chroma .sx,html[data-mode=light] .chroma .s1,html[data-mode=light] .chroma .ss,html[data-mode=light] .chroma .m,html[data-mode=light] .chroma .mb,html[data-mode=light] .chroma .mf,html[data-mode=light] .chroma .mh,html[data-mode=light] .chroma .mi,html[data-mode=light] .chroma .il,html[data-mode=light] .chroma .mo{color:#2aa198}html[data-mode=light] .chroma .sb,html[data-mode=light] .chroma .c,html[data-mode=light] .chroma .ch,html[data-mode=light] .chroma .cm,html[data-mode=light] .chroma .c1{color:#759299}html[data-mode=dark]{--bg: #1f1f1f;--fg: #bbb;--alt-bg: #1c1c1c;--alt-fg: #ddd;--dtl: #1a1a1a;--bgmod: rgba(255, 255, 255, 0.3);--input-bg: #222;--input-fg: #f0f0f0;--input-bd: #262626;--lpress: rgba(255, 255, 255, 0.2);--rlpress: rgba(0, 0, 0, 0.2)}html[data-mode=dark] img{filter:contrast(0.85)grayscale(0.3)}html[data-mode=dark] .chroma,html[data-mode=dark] pre,html[data-mode=dark] p code,html[data-mode=dark] li code{color:#f8f8f2;background:#272822}html[data-mode=dark] .chroma .err{color:#eb0083;background-color:#1e0010}html[data-mode=dark] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=dark] .chroma .lntable{border-spacing:0;padding:0;margin:0;border:0;width:auto;overflow:auto;display:block}html[data-mode=dark] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=dark] .chroma .ge{font-style:italic}html[data-mode=dark] .chroma .gs{font-weight:700}html[data-mode=dark] .chroma .lnt,html[data-mode=dark] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#8e8e8e}html[data-mode=dark] .chroma .k,html[data-mode=dark] .chroma .kc,html[data-mode=dark] .chroma .kd,html[data-mode=dark] .chroma .kp,html[data-mode=dark] .chroma .kr,html[data-mode=dark] .chroma .kt,html[data-mode=dark] .chroma .no{color:#66d9ef}html[data-mode=dark] .chroma .kn,html[data-mode=dark] .chroma .nt,html[data-mode=dark] .chroma .o,html[data-mode=dark] .chroma .ow,html[data-mode=dark] .chroma .gd{color:#f94e8a}html[data-mode=dark] .chroma .na,html[data-mode=dark] .chroma .nc,html[data-mode=dark] .chroma .nd,html[data-mode=dark] .chroma .ne,html[data-mode=dark] .chroma .nf,html[data-mode=dark] .chroma .nx,html[data-mode=dark] .chroma .gi{color:#a6e22e}html[data-mode=dark] .chroma .l,html[data-mode=dark] .chroma .se,html[data-mode=dark] .chroma .m,html[data-mode=dark] .chroma .mb,html[data-mode=dark] .chroma .mf,html[data-mode=dark] .chroma .mh,html[data-mode=dark] .chroma .mi,html[data-mode=dark] .chroma .il,html[data-mode=dark] .chroma .mo{color:#ae81ff}html[data-mode=dark] .chroma .ld,html[data-mode=dark] .chroma .s,html[data-mode=dark] .chroma .sa,html[data-mode=dark] .chroma .sb,html[data-mode=dark] .chroma .sc,html[data-mode=dark] .chroma .dl,html[data-mode=dark] .chroma .sd,html[data-mode=dark] .chroma .s2,html[data-mode=dark] .chroma .sh,html[data-mode=dark] .chroma .si,html[data-mode=dark] .chroma .sx,html[data-mode=dark] .chroma .sr,html[data-mode=dark] .chroma .s1,html[data-mode=dark] .chroma .ss{color:#e6db74}html[data-mode=dark] .chroma .c,html[data-mode=dark] .chroma .ch,html[data-mode=dark] .chroma .cm,html[data-mode=dark] .chroma .c1,html[data-mode=dark] .chroma .cs,html[data-mode=dark] .chroma .cp,html[data-mode=dark] .chroma .cpf,html[data-mode=dark] .chroma .gu{color:#949076}body{margin:0;padding:0;font-family:open sans,sans-serif;background:var(--bg);color:var(--fg);display:flex;min-height:100vh;flex-direction:column}body a{color:var(--accent);outline:2px dashed transparent;outline-offset:2px;transition:opacity .2s ease-in-out,outline .2s ease-in-out,padding .2s ease-in-out;word-break:break-word}body a:focus{outline-color:var(--accent)}body a:hover{opacity:.75}body>header,body>footer{background:var(--alt-bg);color:var(--alt-fg);text-align:center}body>header{padding:0 2rem 1rem}body>header nav{margin:.5rem 0 0}body>header nav ul{margin:0;display:flex;flex-wrap:wrap;justify-content:center;padding:0}body>header nav ul a{display:block;word-break:keep-all;margin:0 7.5px 15px;padding:9px 21px 12px;font-size:.75rem;font-weight:700;text-transform:uppercase}body>footer{padding:18px 45px}body>footer p{line-height:1.8rem;margin:15px 0;white-space:pre-wrap}body>footer a{transition:opacity .2s ease-in-out,padding .2s ease-in-out,outline-color .3s ease}body>footer a:hover{opacity:.75}body>footer aside{padding:6px 0 12px}body>footer aside input{border:1px solid var(--fg);outline-offset:3px;padding:0}body>footer aside input::-webkit-color-swatch{border:none}body>footer aside input::-webkit-color-swatch-wrapper{padding:0}body>footer aside button{background:0;border:0;padding:3px 3px 0}body>footer aside button svg{fill:var(--fg);stroke:var(--fg);stroke-width:.6rem}body>footer aside input,body>footer aside button{margin:0 7.5px;outline:2px dashed transparent;cursor:pointer;transition:outline .2s ease-in-out,transform .2s ease-in-out}body>footer aside input:focus,body>footer aside button:focus{outline-color:var(--accent)}body>footer aside input:hover,body>footer aside button:hover{transform:scale(1.2)}body>footer aside input::-moz-focus-inner,body>footer aside button::-moz-focus-inner{border:0}body>footer aside input,body>footer aside button svg{width:42px;height:42px}ol,ul{list-style:none}h1{text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress)}hr{border:1px solid var(--lpress);margin:2.4rem 0 1.2rem}::selection{background:var(--accent);color:#f0f0f0;text-shadow:none}div.filler{flex:1;align-items:center;justify-content:center}article>header h1{line-height:3rem}article>header img{margin:1rem 0 0}article>header p{font-size:.9rem;font-style:italic}h1,h2,h3,h4,h5,h6{font-family:oswald,sans-serif;font-weight:700}h1{font-size:2.25rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}main p{line-height:1.65rem}code{font-family:monospace}body>header>a{font-family:oswald,sans-serif;font-size:2.1rem;font-weight:700;transition:color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress);display:inline-block;margin:1.5rem 0 .75rem}article>header{margin:0 0 2rem}article>header h1{margin:9px 0}article>header p{margin:0}article h2,article h3,main.index h2,main.index h3{margin:2rem 0 1rem}article p,main.index p{margin:1.5rem 0}h1+p,h2+p,h3+p,h4+p,h5+p,h6+p{margin-top:0}h2,h3,h4,h5,h6{padding-top:1rem}audio,img,video{margin:1.8rem auto}a.anchor{background-image:none}a.anchor svg{fill:var(--accent);width:21px;height:21px}h2 a.anchor{margin-left:.4rem}h2 a.anchor svg{transform:scale(1.5)}h3 a.anchor{margin-left:.2rem}h3 a.anchor svg{transform:scale(1.25)}span.lnt,summary,sup.footnote-ref{user-select:none}article ol li,article>ul li,#error ul li{margin-bottom:.45rem}ol{counter-reset:a-counter}ol li{counter-increment:a-counter}ol li::before{content:counter(a-counter)"";font-size:.85rem;font-weight:700;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);background:var(--fg);border:1px solid var(--lpress);border-radius:2px;color:var(--bg);margin-right:12px;padding:2px 7.5px}section.footnotes{border-top:2px solid var(--fg);display:block;margin-top:2.4rem;padding:1rem 1rem 1.8rem}section.footnotes h2{margin:0 0 2rem}section.footnotes a{word-break:break-word}section.footnotes ol li p:first-of-type{display:inline;margin-left:-6px}section.footnotes a.footnote-backref{margin-left:9px;padding:0 9px}section.footnotes a.footnote-backref svg{fill:var(--dtl);stroke:var(--lpress);stroke-width:.6rem;width:18px;height:18px}section.footnotes hr{display:none}sup{line-height:0}sup a.footnote-ref{text-decoration:none}sup a.footnote-ref::before{content:'['}sup a.footnote-ref::after{content:']'}code,.chroma,.chroma span{transition:background-color .3s ease,color .3s ease}article>pre,section.scroll,span.katex-display,div.highlight>pre,div.highlight>div{overflow-x:auto;transition:background-color .3s ease,color .3s ease,outline-color .3s ease;outline:3px solid transparent}article>pre:focus,section.scroll:focus,span.katex-display:focus,div.highlight>pre:focus,div.highlight>div:focus{outline-color:var(--accent)}section.scroll{border:1px solid var(--fg)}section.scroll>table{border-collapse:collapse;color:var(--fg);font-family:open sans,sans-serif;min-width:600px;width:100%}section.scroll>table td+td{border-left:1px solid var(--fg)}section.scroll>table tr+tr{border-top:1px solid var(--fg)}section.scroll>table tr:not(:first-child):last-of-type{border-bottom:1px solid var(--fg)}section.scroll>table td,section.scroll>table th{padding:9px}section.scroll>table th{background:var(--fg);color:var(--bg)}section.scroll>table tr{transition:background .2s ease-in-out,color .2s ease-in-out}section.scroll>table tr:nth-child(even){background:var(--alt-bg)}section.scroll>table tr:nth-child(odd){background:var(--bg)}section.scroll>table tr:hover{background:var(--accent);color:var(--dtl)}div.highlight>div table{padding:0 24px!important;max-height:75vh}div.chroma td:first-of-type{padding:0 18px 0 0}article>pre,span.katex-display,div.highlight>pre{padding:21px 24px}article>pre,span.katex-display,div.highlight>pre,div.highlight>div.chroma{border:1px solid #222;line-height:1.5rem;max-height:75vh}mark,p code,li code{border-radius:2px;padding:1px 3px;word-break:break-all}p code{word-break:break-word}li a{word-break:break-all}article>header aside.tags{margin:.9rem 0 .6rem}article>header aside.tags ul{padding:0}article>header aside.tags li{display:inline}article>header aside.tags a{display:inline-block;margin:0 7.5px 9px 0;padding:6px 15px 9px}ul.posts{padding:0}ul.posts li{margin:.5rem 0}ul.posts a{background:var(--accent);color:var(--dtl);display:flex;margin:15px auto;padding:15px 30px 18px;text-decoration:none;align-items:center;word-break:break-word}ul.posts a p{flex:1;margin:0}ul.posts a time{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);border-radius:2px;font-size:.85rem;margin-left:1.8rem;padding:0 6px 2px}@media(max-width:768px){ul.posts a{flex-direction:column-reverse;align-items:unset}ul.posts a time{margin:.3rem 0}}span.katex-display{border:1px dashed var(--alt-fg);overflow-x:auto;padding:15px 30px}span.katex-display:focus{border:1px solid #222}img{display:block;max-width:100%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease,filter .3s ease}img.cover{border:1px solid var(--fg);object-fit:cover;width:100%}article p>img{display:block;margin:2rem auto;max-width:100%}figure{margin:1.8rem auto}figure img{display:block;margin:0 auto;max-width:90%}figure figcaption{font-size:.85rem;text-align:center;margin:.75rem;line-height:1.5rem}video{display:block;max-width:91%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease}video:focus,video:hover{border-color:var(--accent);outline-color:var(--accent)}video.gifoid{margin:3rem auto;max-width:90%}audio{display:block;width:90%}img.border,video.border{border:1px solid var(--fg)}img.borderless,video.borderless{border:0}details.toc{background:var(--alt-bg);color:var(--dtl);transition:background-color .3s ease,border .3s ease,linear-gradient .3s ease}details.toc summary{background:var(--accent);border:1px solid rgba(0,0,0,.3);border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);font-family:oswald,sans-serif;padding:15px 30px 18.5px;outline:2px dashed transparent;outline-offset:3px;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);cursor:pointer;transition:color .3s ease,opacity .2s ease,outline-color .2s ease,padding .2s ease}details.toc summary:hover{opacity:.75}details.toc summary:focus{outline-color:var(--accent)}details.toc[open] summary{border-radius:2px 2px 0 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.2);padding:15px 30px}details.toc[open] summary~*{animation:smoothReveal .3s ease-in-out}details.toc nav#TableOfContents{border-style:solid;border-color:rgba(0,0,0,.3);border-width:0 1px 1px;border-radius:0 0 2px 2px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.3);padding:6px 15px 15px 9px}details.toc nav#TableOfContents li:first-of-type{margin-top:.3rem}details.toc nav#TableOfContents ul li:not(:last-of-type),details.toc nav#TableOfContents ul li ul li:first-of-type,details.toc nav#TableOfContents ul li ol li:first-of-type,details.toc nav#TableOfContents ol li:not(:last-of-type),details.toc nav#TableOfContents ol li ul li:first-of-type,details.toc nav#TableOfContents ol li ol li:first-of-type{margin-bottom:.3rem}#TableOfContents,section.footnotes ol,article>ul,article>ol{line-height:1.5rem}#TableOfContents ul,section.footnotes ol{padding-left:24px}article>ul,article>ul ul,article>ol,article>ol ol{padding:0 24px}#TableOfContents ul li:before,article>ul li:before{content:'';margin-right:12px;background:var(--fg);border-radius:2px;width:18px;height:18px;display:inline-block;margin-bottom:-3px}@keyframes smoothReveal{0%{opacity:0}100%{opacity:1}}a.btn,a.footnote-backref,section.social a,input[type=submit]{background:var(--accent);border:1px solid rgba(0,0,0,.3);color:var(--dtl);transition:background-color .3s ease,color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-decoration:none;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}a.btn:hover,a.footnote-backref:hover,section.social a:hover,input[type=submit]:hover{opacity:.75}li.cats a{font-weight:700}ul.tags{display:flex;flex-wrap:wrap;padding:0}ul.tags a{display:flex;flex:1;align-items:center;margin:0 9px 9px 0;padding:7.5px 18px 10.5px;word-break:keep-all}ul.tags a span{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);margin-left:.45rem;padding:0 6px 1px;font-size:.85rem;border-radius:2px}ul.pagination{font-family:open sans,sans-serif;font-weight:700;text-align:center;margin:3rem auto 1rem;padding:0;display:flex;flex-wrap:wrap;justify-content:center}ul.pagination li{display:inline-block;transition:background .2s ease-in-out,border .2s ease-in-out}ul.pagination li a,ul.pagination li.current p{display:block;margin:0 9px 9px 0;padding:7.5px 12px 10.5px;width:21px}ul.pagination li a{color:var(--dtl)}ul.pagination li.current p{background:var(--alt-bg);border:1px solid rgba(0,0,0,.45);color:var(--alt-fg);line-height:inherit;user-select:none;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}ul.pagination svg{fill:currentColor;width:18px;height:18px;display:inline-block;margin:auto auto -2px}mark{background:var(--accent);filter:contrast(1.2)invert(1)}abbr{text-decoration-style:solid}blockquote{background:var(--alt-bg);border-style:solid;border-width:1px 1px 1px 12px;color:var(--alt-fg);margin:2.1rem 1.5rem;padding:0 30px}blockquote p{margin:1.2rem 0}kbd{background-color:#eee;border-radius:2px;border:1px solid #b4b4b4;box-shadow:0 1px 1px rgba(0,0,0,.2),0 2px 0 0 rgba(255,255,255,.7)inset;color:#333;display:inline-block;font-size:.85em;font-weight:700;line-height:1;padding:2px;white-space:nowrap}kbd>kbd{margin:0 2px}main{margin:90px auto;max-width:660px;padding:0 15px}article{margin:90px auto 120px}@media(min-width:768px){a.anchor:not(:focus){opacity:0}h2>a:focus+a.anchor,h3>a:focus+a.anchor,h2:hover>a.anchor,h3:hover>a.anchor{opacity:1}}p.error{color:red}p.noscript{font-weight:700}blockquote.twitter-tweet{border-color:#1da0f1;padding:0 30px 27px}div.__h_instagram{margin:2rem auto}div.__h_instagram a:nth-child(2){display:block;margin:.6rem 0;line-height:0}div.__h_instagram a:nth-child(2):hover{opacity:.75}div.__h_instagram img{border:1px solid var(--fg);max-width:100%;object-fit:cover}h2#vimeo-simple-shortcode{margin-bottom:1rem}div.s_video_simple{margin:0 auto;width:96%}div.s_video_simple a{border:1px solid var(--fg);display:block;margin:6px;line-height:0}div.s_video_simple a:hover{opacity:.75}section.youtube{border:1px solid var(--fg);margin:2rem 0;padding-bottom:56.25%;position:relative;overflow:hidden;height:0}section.info img{border:3px solid var(--fg);border-radius:9px}
\ No newline at end of file
+@font-face{font-family:oswald;font-style:normal;font-weight:700;font-display:swap;src:local("Oswald"),url(../fonts/oswald-v29-latin-700.woff2)format("woff2"),url(../fonts/oswald-v29-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:400;font-display:swap;src:local("Open Sans Regular"),local("OpenSans-Regular"),url(../fonts/open-sans-v17-latin-regular.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-regular.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:700;font-display:swap;src:local("Open Sans Bold"),local("OpenSans-Bold"),url(../fonts/open-sans-v17-latin-700.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:italic;font-weight:400;font-display:swap;src:local("Open Sans Italic"),local("OpenSans-Italic"),url(../fonts/open-sans-v17-latin-italic.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-italic.woff)format("woff")}:root{font-size:18px}html{scroll-behavior:smooth}html[data-mode=light]{--bg: #ddd;--fg: #444;--alt-bg: #d6d6d6;--alt-fg: #333;--dtl: #fdfdfd;--bgmod: rgba(0, 0, 0, 0.3);--input-bg: #fefefe;--input-fg: #111;--input-bd: #ccc;--lpress: rgba(0, 0, 0, 0.2);--rlpress: rgba(255, 255, 255, 0.2)}html[data-mode=light] .chroma,html[data-mode=light] pre,html[data-mode=light] p code,html[data-mode=light] li code{color:#93a1a1;background-color:#002b36}html[data-mode=light] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=light] .chroma .lntable{border-spacing:0;padding:0;margin:0;border:0;width:auto;overflow:auto;display:block}html[data-mode=light] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=light] .chroma .nb{color:#b58900}html[data-mode=light] .chroma .ge{font-style:italic}html[data-mode=light] .chroma .gr{color:#e8625f;font-weight:700}html[data-mode=light] .chroma .gs{font-weight:700}html[data-mode=light] .chroma .x,html[data-mode=light] .chroma .kc,html[data-mode=light] .chroma .no,html[data-mode=light] .chroma .ni,html[data-mode=light] .chroma .ne,html[data-mode=light] .chroma .se,html[data-mode=light] .chroma .gh{color:#e9662f}html[data-mode=light] .chroma .lnt,html[data-mode=light] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#848f8f}html[data-mode=light] .chroma .k,html[data-mode=light] .chroma .kn,html[data-mode=light] .chroma .kp,html[data-mode=light] .chroma .o,html[data-mode=light] .chroma .ow,html[data-mode=light] .chroma .cs,html[data-mode=light] .chroma .cp,html[data-mode=light] .chroma .cpf,html[data-mode=light] .chroma .gi{color:#859900}html[data-mode=light] .chroma .kd,html[data-mode=light] .chroma .kr,html[data-mode=light] .chroma .bp,html[data-mode=light] .chroma .nc,html[data-mode=light] .chroma .nd,html[data-mode=light] .chroma .nf,html[data-mode=light] .chroma .nt,html[data-mode=light] .chroma .nv,html[data-mode=light] .chroma .gu{color:#3294da}html[data-mode=light] .chroma .kt,html[data-mode=light] .chroma .sr,html[data-mode=light] .chroma .gd{color:#e8625f}html[data-mode=light] .chroma .s,html[data-mode=light] .chroma .sa,html[data-mode=light] .chroma .sc,html[data-mode=light] .chroma .dl,html[data-mode=light] .chroma .s2,html[data-mode=light] .chroma .si,html[data-mode=light] .chroma .sx,html[data-mode=light] .chroma .s1,html[data-mode=light] .chroma .ss,html[data-mode=light] .chroma .m,html[data-mode=light] .chroma .mb,html[data-mode=light] .chroma .mf,html[data-mode=light] .chroma .mh,html[data-mode=light] .chroma .mi,html[data-mode=light] .chroma .il,html[data-mode=light] .chroma .mo{color:#2aa198}html[data-mode=light] .chroma .sb,html[data-mode=light] .chroma .c,html[data-mode=light] .chroma .ch,html[data-mode=light] .chroma .cm,html[data-mode=light] .chroma .c1{color:#759299}html[data-mode=dark]{--bg: #1f1f1f;--fg: #bbb;--alt-bg: #1c1c1c;--alt-fg: #ddd;--dtl: #1a1a1a;--bgmod: rgba(255, 255, 255, 0.3);--input-bg: #222;--input-fg: #f0f0f0;--input-bd: #262626;--lpress: rgba(255, 255, 255, 0.2);--rlpress: rgba(0, 0, 0, 0.2)}html[data-mode=dark] img{filter:contrast(0.85)grayscale(0.3)}html[data-mode=dark] .chroma,html[data-mode=dark] pre,html[data-mode=dark] p code,html[data-mode=dark] li code{color:#f8f8f2;background:#272822}html[data-mode=dark] .chroma .err{color:#eb0083;background-color:#1e0010}html[data-mode=dark] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=dark] .chroma .lntable{border-spacing:0;padding:0;margin:0;border:0;width:auto;overflow:auto;display:block}html[data-mode=dark] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=dark] .chroma .ge{font-style:italic}html[data-mode=dark] .chroma .gs{font-weight:700}html[data-mode=dark] .chroma .lnt,html[data-mode=dark] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#8e8e8e}html[data-mode=dark] .chroma .k,html[data-mode=dark] .chroma .kc,html[data-mode=dark] .chroma .kd,html[data-mode=dark] .chroma .kp,html[data-mode=dark] .chroma .kr,html[data-mode=dark] .chroma .kt,html[data-mode=dark] .chroma .no{color:#66d9ef}html[data-mode=dark] .chroma .kn,html[data-mode=dark] .chroma .nt,html[data-mode=dark] .chroma .o,html[data-mode=dark] .chroma .ow,html[data-mode=dark] .chroma .gd{color:#f94e8a}html[data-mode=dark] .chroma .na,html[data-mode=dark] .chroma .nc,html[data-mode=dark] .chroma .nd,html[data-mode=dark] .chroma .ne,html[data-mode=dark] .chroma .nf,html[data-mode=dark] .chroma .nx,html[data-mode=dark] .chroma .gi{color:#a6e22e}html[data-mode=dark] .chroma .l,html[data-mode=dark] .chroma .se,html[data-mode=dark] .chroma .m,html[data-mode=dark] .chroma .mb,html[data-mode=dark] .chroma .mf,html[data-mode=dark] .chroma .mh,html[data-mode=dark] .chroma .mi,html[data-mode=dark] .chroma .il,html[data-mode=dark] .chroma .mo{color:#ae81ff}html[data-mode=dark] .chroma .ld,html[data-mode=dark] .chroma .s,html[data-mode=dark] .chroma .sa,html[data-mode=dark] .chroma .sb,html[data-mode=dark] .chroma .sc,html[data-mode=dark] .chroma .dl,html[data-mode=dark] .chroma .sd,html[data-mode=dark] .chroma .s2,html[data-mode=dark] .chroma .sh,html[data-mode=dark] .chroma .si,html[data-mode=dark] .chroma .sx,html[data-mode=dark] .chroma .sr,html[data-mode=dark] .chroma .s1,html[data-mode=dark] .chroma .ss{color:#e6db74}html[data-mode=dark] .chroma .c,html[data-mode=dark] .chroma .ch,html[data-mode=dark] .chroma .cm,html[data-mode=dark] .chroma .c1,html[data-mode=dark] .chroma .cs,html[data-mode=dark] .chroma .cp,html[data-mode=dark] .chroma .cpf,html[data-mode=dark] .chroma .gu{color:#949076}body{margin:0;padding:0;font-family:open sans,sans-serif;background:var(--bg);color:var(--fg);display:flex;min-height:100vh;flex-direction:column}body a{color:var(--accent);outline:2px dashed transparent;outline-offset:2px;transition:opacity .2s ease-in-out,outline .2s ease-in-out,padding .2s ease-in-out;word-break:break-word}body a:focus{outline-color:var(--accent)}body a:hover{opacity:.75}body>header,body>footer{background:var(--alt-bg);color:var(--alt-fg);text-align:center}body>header{padding:0 2rem 1rem}body>header nav{margin:.5rem 0 0}body>header nav ul{margin:0;display:flex;flex-wrap:wrap;justify-content:center;padding:0}body>header nav ul a{display:block;word-break:keep-all;margin:0 7.5px 15px;padding:9px 21px 12px;font-size:.75rem;font-weight:700;text-transform:uppercase}body>footer{padding:18px 45px}body>footer p{line-height:1.8rem;margin:15px 0;white-space:pre-wrap}body>footer a{transition:opacity .2s ease-in-out,padding .2s ease-in-out,outline-color .3s ease}body>footer a:hover{opacity:.75}body>footer aside{padding:6px 0 12px}body>footer aside input{border:1px solid var(--fg);outline-offset:3px;padding:0}body>footer aside input::-webkit-color-swatch{border:none}body>footer aside input::-webkit-color-swatch-wrapper{padding:0}body>footer aside button{background:0;border:0;padding:3px 3px 0}body>footer aside button svg{fill:var(--fg);stroke:var(--fg);stroke-width:.6rem}body>footer aside input,body>footer aside button{margin:0 7.5px;outline:2px dashed transparent;cursor:pointer;transition:outline .2s ease-in-out,transform .2s ease-in-out}body>footer aside input:focus,body>footer aside button:focus{outline-color:var(--accent)}body>footer aside input:hover,body>footer aside button:hover{transform:scale(1.2)}body>footer aside input::-moz-focus-inner,body>footer aside button::-moz-focus-inner{border:0}body>footer aside input,body>footer aside button svg{width:42px;height:42px}ol,ul{list-style:none}h1{text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress)}hr{border:1px solid var(--lpress);margin:2.4rem 0 1.2rem}::selection{background:var(--accent);color:#f0f0f0;text-shadow:none}div.filler{flex:1;align-items:center;justify-content:center}article>header h1{line-height:3rem}article>header img{margin:1rem 0 0}article>header p{font-size:.9rem;font-style:italic}h1,h2,h3,h4,h5,h6{font-family:oswald,sans-serif;font-weight:700}h1{font-size:2.25rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}main p{line-height:1.65rem}code{font-family:monospace}body>header>a{font-family:oswald,sans-serif;font-size:2.1rem;font-weight:700;transition:color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress);display:inline-block;margin:1.5rem 0 .75rem}article>header{margin:0 0 2rem}article>header h1{margin:9px 0}article>header p{margin:0}article h2,article h3,main.index h2,main.index h3{margin:2rem 0 1rem}article p,main.index p{margin:1.5rem 0}h1+p,h2+p,h3+p,h4+p,h5+p,h6+p{margin-top:0}h2,h3,h4,h5,h6{padding-top:1rem}audio,img,video{margin:1.8rem auto}a.anchor{background-image:none}a.anchor svg{fill:var(--accent);width:21px;height:21px}h2 a.anchor{margin-left:.4rem}h2 a.anchor svg{transform:scale(1.5)}h3 a.anchor{margin-left:.2rem}h3 a.anchor svg{transform:scale(1.25)}span.lnt,summary,sup.footnote-ref{user-select:none}article ol li,article>ul li,#error ul li{margin-bottom:.45rem}ol{counter-reset:a-counter}ol li{counter-increment:a-counter}ol li::before{content:counter(a-counter)"";font-size:.85rem;font-weight:700;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);background:var(--fg);border:1px solid var(--lpress);border-radius:2px;color:var(--bg);margin-right:12px;padding:2px 7.5px}section.footnotes{border-top:2px solid var(--fg);display:block;margin-top:2.4rem;padding:1rem 1rem 1.8rem}section.footnotes h2{margin:0 0 2rem}section.footnotes a{word-break:break-word}section.footnotes ol li p:first-of-type{display:inline;margin-left:-6px}section.footnotes a.footnote-backref{margin-left:9px;padding:0 9px}section.footnotes a.footnote-backref svg{fill:var(--dtl);stroke:var(--lpress);stroke-width:.6rem;width:18px;height:18px}section.footnotes hr{display:none}sup{line-height:0}sup a.footnote-ref{text-decoration:none}sup a.footnote-ref::before{content:'['}sup a.footnote-ref::after{content:']'}code,.chroma,.chroma span{transition:background-color .3s ease,color .3s ease}article>pre,section.scroll,span.katex-display,div.highlight>pre,div.highlight>div{overflow-x:auto;transition:background-color .3s ease,color .3s ease,outline-color .3s ease;outline:3px solid transparent}article>pre:focus,section.scroll:focus,span.katex-display:focus,div.highlight>pre:focus,div.highlight>div:focus{outline-color:var(--accent)}section.scroll{border:1px solid var(--fg)}section.scroll>table{border-collapse:collapse;color:var(--fg);font-family:open sans,sans-serif;min-width:600px;width:100%}section.scroll>table td+td{border-left:1px solid var(--fg)}section.scroll>table tr+tr{border-top:1px solid var(--fg)}section.scroll>table tr:not(:first-child):last-of-type{border-bottom:1px solid var(--fg)}section.scroll>table td,section.scroll>table th{padding:9px}section.scroll>table th{background:var(--fg);color:var(--bg)}section.scroll>table tr{transition:background .2s ease-in-out,color .2s ease-in-out}section.scroll>table tr:nth-child(even){background:var(--alt-bg)}section.scroll>table tr:nth-child(odd){background:var(--bg)}section.scroll>table tr:hover{background:var(--accent);color:var(--dtl)}div.highlight>div table{padding:0 24px!important;max-height:75vh}div.chroma td:first-of-type{padding:0 18px 0 0}article>pre,span.katex-display,div.highlight>pre{padding:21px 24px}article>pre,span.katex-display,div.highlight>pre,div.highlight>div.chroma{border:1px solid #222;line-height:1.5rem;max-height:75vh}mark,p code,li code{border-radius:2px;padding:1px 3px;word-break:break-all}p code{word-break:break-word}li a{word-break:break-all}article>header aside.tags{margin:.9rem 0 .6rem}article>header aside.tags ul{padding:0}article>header aside.tags li{display:inline}article>header aside.tags a{display:inline-block;margin:0 7.5px 9px 0;padding:6px 15px 9px}ul.posts{padding:0}ul.posts li{margin:.5rem 0}ul.posts a{background:var(--accent);color:var(--dtl);display:flex;margin:15px auto;padding:15px 30px 18px;text-decoration:none;align-items:center;word-break:break-word}ul.posts a p{flex:1;margin:0}ul.posts a time{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);border-radius:2px;font-size:.85rem;margin-left:1.8rem;padding:0 6px 2px}@media(max-width:768px){ul.posts a{flex-direction:column-reverse;align-items:unset}ul.posts a time{margin:.3rem 0}}span.katex-display{border:1px dashed var(--alt-fg);overflow-x:auto;padding:15px 30px}span.katex-display:focus{border:1px solid #222}img{display:block;max-width:100%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease,filter .3s ease}img.cover{border:1px solid var(--fg);object-fit:cover;width:100%}article p>img{display:block;margin:2rem auto;max-width:100%}figure{margin:1.8rem auto}figure img{display:block;margin:0 auto;max-width:90%}figure figcaption{font-size:.85rem;text-align:center;margin:.75rem;line-height:1.5rem}video{display:block;max-width:91%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease}video:focus,video:hover{border-color:var(--accent);outline-color:var(--accent)}video.gifoid{margin:3rem auto;max-width:90%}audio{display:block;width:90%}img.border,video.border{border:1px solid var(--fg)}img.borderless,video.borderless{border:0}details.toc{background:var(--alt-bg);color:var(--dtl);transition:background-color .3s ease,border .3s ease,linear-gradient .3s ease}details.toc summary{background:var(--accent);border:1px solid rgba(0,0,0,.3);border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);font-family:oswald,sans-serif;padding:15px 30px 18.5px;outline:2px dashed transparent;outline-offset:3px;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);cursor:pointer;transition:color .3s ease,opacity .2s ease,outline-color .2s ease,padding .2s ease}details.toc summary:hover{opacity:.75}details.toc summary:focus{outline-color:var(--accent)}details.toc[open] summary{border-radius:2px 2px 0 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.2);padding:15px 30px}details.toc[open] summary~*{animation:smoothReveal .3s ease-in-out}details.toc nav#TableOfContents{border-style:solid;border-color:rgba(0,0,0,.3);border-width:0 1px 1px;border-radius:0 0 2px 2px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.3);padding:6px 15px 15px 9px}details.toc nav#TableOfContents li:first-of-type{margin-top:.3rem}details.toc nav#TableOfContents ul li:not(:last-of-type),details.toc nav#TableOfContents ul li ul li:first-of-type,details.toc nav#TableOfContents ul li ol li:first-of-type,details.toc nav#TableOfContents ol li:not(:last-of-type),details.toc nav#TableOfContents ol li ul li:first-of-type,details.toc nav#TableOfContents ol li ol li:first-of-type{margin-bottom:.3rem}#TableOfContents,section.footnotes ol,article>ul,article>ol{line-height:1.5rem}#TableOfContents ul,section.footnotes ol{padding-left:24px}article>ul,article>ul ul,article>ol,article>ol ol{padding:0 24px}#TableOfContents ul li:before,article>ul li:before{content:'';margin-right:12px;background:var(--fg);border-radius:2px;width:18px;height:18px;display:inline-block;margin-bottom:-3px}@keyframes smoothReveal{0%{opacity:0}100%{opacity:1}}a.btn,a.footnote-backref,section.social a,input[type=submit]{background:var(--accent);border:1px solid rgba(0,0,0,.3);color:var(--dtl);transition:background-color .3s ease,color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-decoration:none;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}a.btn:hover,a.footnote-backref:hover,section.social a:hover,input[type=submit]:hover{opacity:.75}li.cats a{font-weight:700}ul.tags{display:flex;flex-wrap:wrap;padding:0}ul.tags a{display:flex;flex:1;align-items:center;margin:0 9px 9px 0;padding:7.5px 18px 10.5px;word-break:keep-all}ul.tags a span{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);margin-left:.45rem;padding:0 6px 1px;font-size:.85rem;border-radius:2px}ul.pagination{font-family:open sans,sans-serif;font-weight:700;text-align:center;margin:3rem auto 1rem;padding:0;display:flex;flex-wrap:wrap;justify-content:center}ul.pagination li{display:inline-block;transition:background .2s ease-in-out,border .2s ease-in-out}ul.pagination li a,ul.pagination li.current p{display:block;margin:0 9px 9px 0;padding:7.5px 12px 10.5px;width:21px}ul.pagination li a{color:var(--dtl)}ul.pagination li.current p{background:var(--alt-bg);border:1px solid rgba(0,0,0,.45);color:var(--alt-fg);line-height:inherit;user-select:none;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}ul.pagination svg{fill:currentColor;width:18px;height:18px;display:inline-block;margin:auto auto -2px}mark{background:var(--accent);filter:contrast(1.2)invert(1)}abbr{text-decoration-style:solid}blockquote{background:var(--alt-bg);border-style:solid;border-width:1px 1px 1px 12px;color:var(--alt-fg);margin:2.1rem 1.5rem;padding:0 30px}blockquote p{margin:1.2rem 0}kbd{background-color:#eee;border-radius:2px;border:1px solid #b4b4b4;box-shadow:0 1px 1px rgba(0,0,0,.2),0 2px 0 0 rgba(255,255,255,.7)inset;color:#333;display:inline-block;font-size:.85em;font-weight:700;line-height:1;padding:2px;white-space:nowrap}kbd>kbd{margin:0 2px}main{margin:90px auto;max-width:660px;padding:0 15px}article{margin:90px auto 120px}@media(min-width:768px){a.anchor:not(:focus){opacity:0}h2>a:focus+a.anchor,h3>a:focus+a.anchor,h2:hover>a.anchor,h3:hover>a.anchor{opacity:1}}p.error{color:red}p.noscript{font-weight:700}
\ No newline at end of file
diff --git a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json
index 8f09aeb..7d5508f 100644
--- a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json
+++ b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json
@@ -1 +1 @@
-{"Target":"css/main.min.ef1f8ba2890a54fbac97258f57d7e1563d24d43b8912ec0a66739a3ffbcfed1d810b7e37681020c258d3c6c2b93b7e4658e04d44de9e3ca80cc616dd433e33b0.css","MediaType":"text/css","Data":{"Integrity":"sha512-7x+LookKVPuslyWPV9fhVj0k1DuJEuwKZnOaP/vP7R2BC343aBAgwljTxsK5O35GWOBNRN6ePKgMxhbdQz4zsA=="}}
\ No newline at end of file
+{"Target":"css/main.min.854ca6bfab8aff996d55f287252c8932b0035c0eab7df9d115c0c504e682b9ff0dfd69fbf7d653c78a90649608f56e83810b26c8a60ed628e01f39c30ff22ec9.css","MediaType":"text/css","Data":{"Integrity":"sha512-hUymv6uK/5ltVfKHJSyJMrADXA6rffnRFcDFBOaCuf8N/Wn799ZTx4qQZJYI9W6DgQsmyKYO1ijgHznDD/IuyQ=="}}
\ No newline at end of file
diff --git a/images/color-picker.png b/images/color-picker.png
index dafe748..bebd1ad 100644
--- a/images/color-picker.png
+++ b/images/color-picker.png
diff --git a/layouts/_default/_markup/render-heading.html b/layouts/_default/_markup/render-heading.html
index 85e04c9..78f73ea 100644
--- a/layouts/_default/_markup/render-heading.html
+++ b/layouts/_default/_markup/render-heading.html
@@ -7,12 +7,12 @@
   Would like to test a few more things
 -->
 
-{{ $svgBundle := ($.Page.Scratch.Get "svgBundle").RelPermalink }}
+{{ $icons := (.Page.Scratch.Get "svgBundle").RelPermalink }}
 
 {{ $anchoredLinkLevels := slice 2 3 }}
 
 {{ if in $anchoredLinkLevels .Level }}
-  <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} {{ printf "<a class=\"anchor\" href=\"#%s\" title='%s \"%s\".'><svg aria-hidden=\"true\"><use xlink:href=\"%s#hashtag\"/></svg></a>" (.Anchor | safeURL) (T "anchor_for") (.Text | plainify | safeHTML) $svgBundle | safeHTML }}</h{{ .Level }}> 
+  <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} {{ printf "<a class=\"anchor\" href=\"#%s\" title='%s \"%s\".'><svg aria-hidden=\"true\"><use xlink:href=\"%s#hashtag\"/></svg></a>" (.Anchor | safeURL) (T "anchor_for") (.Text | plainify | safeHTML) $icons | safeHTML }}</h{{ .Level }}> 
 {{ else }}
   <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }}</h{{ .Level }}> 
 {{ end }}
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 74f0a26..fab044a 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -4,7 +4,7 @@
 -->
 
 {{- $svgBundle := resources.Get "bundle.svg" | resources.ExecuteAsTemplate "img/bundle.svg" . | minify | resources.Fingerprint "md5" -}}
-{{- $.Page.Scratch.Set "svgBundle" $svgBundle -}}
+{{- .Scratch.Set "svgBundle" $svgBundle -}}
 
 <!DOCTYPE html>
 <html lang="{{ .Site.Language.Lang }}" data-mode="{{ if .Site.Params.Style.isDark }}dark{{ else }}light{{ end }}">
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 1ea0aa3..6d86f16 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -14,12 +14,6 @@
       {{ end }}
     {{ else }}
 
-      <!--
-      range last 9
-      .Format "2006-01-02"
-      | dateFormat "Jan 02"
-      -->
-
       {{ $pages := where site.RegularPages "Type" "in" .Site.Params.mainSections }}
       
       {{ $paginator := .Paginate .Pages }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 33dd41e..2a5ebe9 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,6 +1,6 @@
 {{ define "main" }}
 
-  {{ $svgBundle := ($.Page.Scratch.Get "svgBundle").RelPermalink }}
+  {{ $icons := (.Scratch.Get "svgBundle").RelPermalink }}
 
   <main>
     <article>
@@ -74,7 +74,7 @@
       
       <!-- OR replace the footnote return links with a SVG icon -->
       {{ if .Site.Params.Style.hasIconAsFootnoteReturnLink }}
-        {{ $footnoteReturnLink = ( printf "${1}<svg transform=\"rotate(180) translate(0 -1)\" aria-hidden=\"true\" ><use xlink:href=\"%s#caret-down\"/></svg>${2}" $svgBundle) }}
+        {{ $footnoteReturnLink = ( printf "${1}<svg transform=\"rotate(180) translate(0 -1)\" aria-hidden=\"true\" ><use xlink:href=\"%s#caret-down\"/></svg>${2}" $icons) }}
       {{ end }}
 
       <!--
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 6462b80..489f363 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,6 +1,10 @@
-<!-- Set SVG bundle -->
+<!-- Get SVG bundle -->
 {{ $icons := (.Scratch.Get "svgBundle").RelPermalink }}
 
+<!-- Get default accent colors -->
+{{ $darkAccent  := .Scratch.Get "darkAccent" }}
+{{ $lightAccent := .Scratch.Get "lightAccent" }}
+
 <!-- Custom footer or default copyright -->
 {{ if or (templates.Exists "partials/custom/footer") (templates.Exists "partials/custom/footer.html") }}
   {{ partialCached "custom/footer" . }}
@@ -27,9 +31,9 @@
 {{ end }}
 
 
-<!-- Fancy stuff -->
+<!-- Footer button and color picker -->
 <aside class="js">
-  <button title="{{ T "change_mode" }}"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><use xlink:href="{{ $icons }}#adjust"/></svg></button><input type="color" list="presets" value="{{ if .Site.Params.Style.isDark }}{{ .Site.Params.style.darkAccent }}{{ else }}{{ .Site.Params.style.lightAccent }}{{ end }}" title="{{ T "change_accent" }}"><datalist id="presets"><option value="{{ .Site.Params.style.lightAccent }}"><option value="{{ .Site.Params.style.darkAccent }}"><!-- Extra colors -->{{- range .Site.Params.style.presets -}}<option value="{{ . }}">{{ end }}</datalist>
+  <button title="{{ T "change_mode" }}"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><use xlink:href="{{ $icons }}#adjust"/></svg></button><input type="color" list="presets" value="{{ if .Site.Params.Style.isDark }}{{ $darkAccent }}{{ else }}{{ $lightAccent }}{{ end }}" title="{{ T "change_accent" }}"><datalist id="presets"><option value="{{ $lightAccent }}"><option value="{{ $darkAccent }}"><!-- Extra colors -->{{- range .Site.Params.style.presets -}}<option value="{{ . }}">{{ end }}</datalist>
 </aside>
 
 <!-- noscript notice -->
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index fe89a10..f04f4e7 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -299,6 +299,10 @@
 {{ end }}
 
 
+<!-- Set as scratch to be used in CSS and JS -->
+{{ $changeTransition := .Site.Params.Style.changeTransition | default ".5s ease" }}
+{{ .Scratch.Set "changeTransition" $changeTransition }}
+
 
 <!-- Main CSS -->
 {{ $main := resources.Get "scss/main.scss" | resources.ExecuteAsTemplate "css/main.scss" . | toCSS | minify | resources.Fingerprint "sha512" }}
@@ -308,14 +312,21 @@
 <!-- If JS is disabled -->
 <noscript>
 
+  {{ $darkAccent   := .Site.Params.Style.darkAccent   | default "#dd587c" }}
+  {{ $lightAccent  := .Site.Params.Style.lightAccent  | default "#225670" }}
+  
+  <!-- Set default accent colors -->
+  {{ .Scratch.Set "darkAccent"  $darkAccent }}
+  {{ .Scratch.Set "lightAccent" $lightAccent }}
+
   <!-- Not properly tested? -->
-  <meta name="theme-color" content="{{ .Site.Params.Style.lightAccent }}" {{ if .Site.Params.Style.isDark }}media="(prefers-color-scheme: light)"{{ end }}>
-  <meta name="theme-color" content="{{ .Site.Params.Style.darkAccent }}" {{ if not .Site.Params.Style.isDark }}media="(prefers-color-scheme: dark)"{{ end }}>
+  <meta name="theme-color" content="{{ $darkAccent }}" {{ if not .Site.Params.Style.isDark }}media="(prefers-color-scheme: dark)"{{ end }}>
+  <meta name="theme-color" content="{{ $lightAccent }}" {{ if .Site.Params.Style.isDark }}media="(prefers-color-scheme: light)"{{ end }}>
 
   <style>
   
     html {
-      --accent: {{ if .Site.Params.Style.isDark }}{{ .Site.Params.Style.darkAccent }}{{ else }}{{ .Site.Params.Style.lightAccent }}{{ end }};
+      --accent: {{ if .Site.Params.Style.isDark }}{{ $darkAccent }}{{ else }}{{ $lightAccent }}{{ end }};
     }
   
     .js,
diff --git a/layouts/partials/katex.html b/layouts/partials/katex.html
index 64b9a37..bb664af 100644
--- a/layouts/partials/katex.html
+++ b/layouts/partials/katex.html
@@ -26,6 +26,11 @@
 -->

 

 <script>

+  'use strict';

+  

+  function getAll(selector) {

+    return Array.prototype.slice.call(document.querySelectorAll(selector), 0)

+  };

 

   function addTabIndex() {

   

diff --git a/layouts/shortcodes/social.html b/layouts/shortcodes/social.html
index a27a962..2740069 100644
--- a/layouts/shortcodes/social.html
+++ b/layouts/shortcodes/social.html
@@ -1,9 +1,14 @@
-{{ $svgBundle := resources.Get "bundle.svg" | resources.ExecuteAsTemplate "img/bundle.svg" . | minify | resources.Fingerprint "md5" }}
-{{ $icons := $svgBundle.RelPermalink }}
+{{ $icons := (.Page.Scratch.Get "svgBundle").RelPermalink }}
+
+<!-- Reduce repetition... -->
+{{ $centralizedOnPage   := .Page.Params.Social.Centralized }}
+{{ $centralizedOnSite   := .Site.Params.Social.Centralized }}
+{{ $decentralizedOnPage := .Page.Params.Social.Decentralized }}
+{{ $decentralizedOnSite := .Site.Params.Social.Decentralized }}
 
 <section class="social">
 
-  {{ with or .Page.Params.Social.Centralized.facebook .Site.Params.Social.Centralized.facebook }}
+  {{ with or $centralizedOnPage.facebook $centralizedOnSite.facebook }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Facebook" }}
@@ -22,7 +27,7 @@
     
   {{ end }}
   
-  {{ with or .Page.Params.Social.Centralized.github .Site.Params.Social.Centralized.github }}
+  {{ with or $centralizedOnPage.github $centralizedOnSite.github }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "GitHub" }}
@@ -41,7 +46,7 @@
     
   {{ end }}
 
-  {{ with or .Page.Params.Social.Centralized.gitlab .Site.Params.Social.Centralized.gitlab }}
+  {{ with or $centralizedOnPage.gitlab $centralizedOnSite.gitlab }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "GitLab" }}
@@ -60,7 +65,7 @@
     
   {{ end }}
   
-  {{ with or .Page.Params.Social.Centralized.instagram .Site.Params.Social.Centralized.instagram }}
+  {{ with or $centralizedOnPage.instagram $centralizedOnSite.instagram }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Instagram" }}
@@ -79,7 +84,7 @@
     
   {{ end }}
   
-  {{ with or .Page.Params.Social.Centralized.keybase .Site.Params.Social.Centralized.keybase }}
+  {{ with or $centralizedOnPage.keybase $centralizedOnSite.keybase }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Keybase" }}
@@ -98,7 +103,7 @@
     
   {{ end }}
 
-  {{ with or .Page.Params.Social.Centralized.linkedin .Site.Params.Social.Centralized.linkedin }}
+  {{ with or $centralizedOnPage.linkedin $centralizedOnSite.linkedin }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "LinkedIn" }}
@@ -119,15 +124,9 @@
   
 
 
+  {{ if or $decentralizedOnPage.mastodon $decentralizedOnSite.mastodon }}
   
-
-
-  
-  
-  
-  {{ if or .Page.Params.Social.Decentralized.mastodon .Site.Params.Social.Decentralized.mastodon }}
-  
-    {{ range or .Page.Params.Social.Decentralized.mastodon .Site.Params.Social.Decentralized.mastodon }}
+    {{ range or $decentralizedOnPage.mastodon $decentralizedOnSite.mastodon }}
 
       <a rel="me nofollow" href="{{ index . 0 }}" title="{{ index . 1 }} (Mastodon)">
         <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
@@ -141,9 +140,9 @@
     
   {{ end }}
   
-  {{ if or .Page.Params.Social.Decentralized.matrix .Site.Params.Social.Decentralized.matrix }}
+  {{ if or $decentralizedOnPage.matrix $decentralizedOnSite.matrix }}
   
-    {{ range or .Page.Params.Social.Decentralized.matrix .Site.Params.Social.Decentralized.matrix }}
+    {{ range or $decentralizedOnPage.matrix $decentralizedOnSite.matrix }}
       <a rel="me nofollow" href="{{ index . 0 }}" title="{{ index . 1 }} (Matrix)">
         <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
           <use xlink:href="{{ $icons }}#matrix"/>
@@ -156,7 +155,7 @@
   {{ end }}
   
   
-  {{ with or .Page.Params.Social.Centralized.medium .Site.Params.Social.Centralized.medium }}
+  {{ with or $centralizedOnPage.medium $centralizedOnSite.medium }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Medium" }}
@@ -176,7 +175,7 @@
   {{ end }}
   
   
-  {{ with or .Page.Params.Social.Centralized.stackOverflow .Site.Params.Social.Centralized.stackOverflow }}
+  {{ with or $centralizedOnPage.stackOverflow $centralizedOnSite.stackOverflow }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Stack Overflow" }}
@@ -196,7 +195,7 @@
   {{ end }}
   
   
-  {{ with or .Page.Params.Social.Centralized.reddit .Site.Params.Social.Centralized.reddit }}
+  {{ with or $centralizedOnPage.reddit $centralizedOnSite.reddit }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Reddit" }}
@@ -216,7 +215,7 @@
   {{ end }}
   
 
-  {{ with or .Page.Params.Social.Centralized.telegram .Site.Params.Social.Centralized.telegram }}
+  {{ with or $centralizedOnPage.telegram $centralizedOnSite.telegram }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Telegram" }}
@@ -235,7 +234,7 @@
     
   {{ end }}
   
-  {{ with or .Page.Params.Social.Centralized.twitter .Site.Params.Social.Centralized.twitter }}
+  {{ with or $centralizedOnPage.twitter $centralizedOnSite.twitter }}
   
     {{ $url   := (index . 0) }}
     {{ $label := "Twitter" }}