:root{--background-color:white;--foreground-color:white;--panel-color:white;--focused-text-color:black;--unfocused-text-color:grey;--accent-color-bright:#06bcc2;--accent-color-dark:#0b888b}body{background:var(--background-color);margin:0;padding:0}ul.horizontal{padding:0;list-style-type:none;display:flex}main{border-left:1px solid var(--unfocused-text-color);border-right:1px solid var(--unfocused-text-color);background-color:var(--foreground-color);width:calc(40vw + 200px);color:var(--focused-text-color);min-height:100vh;margin:0 auto;padding:2rem clamp(2rem,3%,4rem);font-family:Noto Serif,serif}main *{margin-top:0}main h1{font-size:clamp(1.5rem,3vw,2.25rem)}main h2{border-bottom:1px solid var(--unfocused-text-color);font-size:clamp(1.2rem,2vw,1.5rem)}main h3{font-size:clamp(1.1rem,1.5vw,1.2rem)}:root{--header-unselected-bg-color:#fff7;--header-unselected-text-color:#00151f;--header-hover-bg-color:#0b888b77;--header-hover-text-color:#000c11;--header-selected-bg-color:#0b888b;--header-selected-text-color:#fff;--header-border-color:grey}header{-webkit-backdrop-filter:blur(4px)blur(6px);backdrop-filter:blur(4px)blur(6px);background-color:var(--header-unselected-bg-color);width:100%;font-family:Open Sans,Segoe UI,Tahoma,sans-serif;font-weight:700;position:sticky;top:0}header:after{content:"";transform-origin:50%;background-color:var(--header-selected-text-color);width:16vw;height:16vw;position:absolute;top:0;right:0;transform:translate(50%,-50%)rotate(-45deg);box-shadow:4px 0 4px 4px #000}header ul{border-bottom:1px solid var(--header-border-color);justify-content:left;margin:0}header li{width:clamp(15%,1vw,100%);color:var(--header-unselected-text-color);text-align:center;background-color:#0000;transition:background-color .4s,color .3s}header li:hover{background-color:var(--header-hover-bg-color);color:var(--header-hover-text-color)}header li.selected{background-color:var(--header-selected-bg-color);color:var(--header-selected-text-color)}header a{color:inherit;padding:.5rem;text-decoration:none;display:block}