:root{--primary-color: #7bb1bd;--secondary-color: #bd7ba2;--primary-bg: #2c3946;--secondary-bg: #324252;--tertiary-bg: #42566a;--primary-border-radius: 4px;--secondary-border-radius: 7px;--red: #be7d7d;--orange: #bd987e;--yellow: #c5c387;--green: #7bbe92;--blue: #7cb2bd;--purple: #9a88bf;--pink: #be7aa1;--cf-purple: var(--purple)}html{background-color:var(--primary-bg);color:#c3ccd4;-moz-user-select:none;-webkit-user-select:none;overflow-x:hidden}body{font-family:Verdana,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;color:#c3ccd4;overflow-x:hidden}*{scrollbar-width:thin;scrollbar-color:var(--primary-color) rgba(0,0,0,.1)}.App,.Main{min-height:300vh}::-webkit-scrollbar{background:rgba(0,0,0,.1);width:5px;height:5px}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:var(--primary-border-radius)}a{color:var(--primary-color);text-decoration:none;font-weight:bold}.Flex{display:flex}.FlexCenter{display:flex;align-items:center;justify-content:center}
#root .LinkWrapper,#root .LinkWrapper:visited{all:unset}
.PaletteBlock{position:relative;width:max-content;transform:translate(0);background:var(--secondary-bg);padding:30px;border-radius:15px;overflow:hidden;margin:0 auto;margin-top:20vh;max-width:80vw;display:flex;flex-direction:column;box-shadow:0 0 12px 5px rgba(0,0,0,.08)}.PaletteBlock:first-child{margin-top:0;margin-bottom:75vh}.PaletteBlock:last-child{margin-bottom:10vh}.PaletteBlock>.TitleBarMockup{background-color:var(--tertiary-bg);margin:-30px;margin-bottom:20px;padding:10px 15px}.PaletteBlock>.TitleBarMockup>.Title{font-weight:bolder;font-size:1.1em;filter:brightness(1.15)}.PaletteBlock>.TitleBarMockup>.Buttons{margin-left:auto;gap:10px}.PaletteBlock>.TitleBarMockup>.Buttons>.Button{width:15px;height:15px;border-radius:50%}.PaletteBlock>.TitleBarMockup>.Buttons>.Button.Minimize{background:var(--green)}.PaletteBlock>.TitleBarMockup>.Buttons>.Button.Restore{background:var(--yellow)}.PaletteBlock>.TitleBarMockup>.Buttons>.Button.Close{background:var(--red)}.PaletteBlock .ImageBlock{position:relative;width:100%;max-width:800px;overflow:hidden;border-radius:15px}.PaletteBlock .ImageBlock:not(:last-child){margin-bottom:30px}.PaletteBlock .ImageBlock>.Image{width:100%;height:100%;object-fit:cover}.PaletteBlock .ImageBlock>.Author{position:absolute;top:20px;left:20px;display:block;background:var(--secondary-bg);padding:5px 15px;border-radius:100px}.PaletteBlock .Title{color:var(--primary-color);font-weight:bolder;font-size:1.7em}.PaletteBlock .Description{white-space:pre-line;font-size:1.5em;max-width:70vw;margin-top:10px;margin-bottom:20px}.PaletteBlock .Blocks{border-radius:var(--secondary-border-radius);overflow:hidden;width:max-content;max-width:75vw;display:flex;flex-wrap:wrap}.PaletteBlock .Blocks .Block{font-weight:bolder;font-family:monospace;font-size:1.2em;text-align:center;margin:7px}.PaletteBlock .Blocks .Block .ColorContainer{position:relative;width:100px;height:100px;cursor:pointer}.PaletteBlock .Blocks .Block .ColorContainer>.Color{box-shadow:0 0 7px rgba(0,0,0,.2);transition:border-width ease-in 100ms;box-sizing:border-box;border:0 solid currentColor}.PaletteBlock .Blocks .Block .ColorContainer>.Color>div{position:absolute;transition:opacity ease-in 100ms}.PaletteBlock .Blocks .Block .ColorContainer>.Color>div.Hover{opacity:0;font-size:2em}.PaletteBlock .Blocks .Block .ColorContainer:hover>.Color{border-width:4px}.PaletteBlock .Blocks .Block .ColorContainer:hover>.Color>div{opacity:0}.PaletteBlock .Blocks .Block .ColorContainer:hover>.Color>div.Hover{opacity:1}.PaletteBlock .Blocks .Block .ColorContainer:active>.Color{transform:scale(0.7)}.PaletteBlock .Blocks .Block .Color{width:100%;height:100%;border-radius:500px;display:flex;align-items:center;justify-content:center;color:#fff;text-transform:uppercase}.PaletteBlock .Blocks .Block .Hex{padding:10px;padding-bottom:5px}
.ToastsContainer{position:fixed;top:70px;bottom:0;margin-bottom:50px;pointer-events:none;z-index:10000;display:flex;flex-direction:column;justify-content:flex-end}.ToastsContainer.Top{justify-content:flex-start}.ToastsContainer.Bottom{justify-content:flex-end}.ToastsContainer.Left{left:50px;align-items:flex-start}.ToastsContainer.Center{left:0;right:0;align-items:center}.ToastsContainer.Right{right:50px;align-items:flex-end}.ToastsContainer .ClearButton{font-weight:bolder;text-align:center;width:100%;z-index:10;opacity:0;will-change:opacity;transition:opacity 500ms ease-in-out;text-shadow:0 0 10px #000}.ToastsContainer .ClearButton.Visible{opacity:1;pointer-events:all;cursor:pointer}.ToastsContainer .Toast{margin:5px 0;padding:5px;border-radius:var(--primary-border-radius);min-width:200px;background-color:var(--tertiary-bg);text-align:center;box-shadow:0 0 10px rgba(0,0,0,.5);animation:toast-open 500ms ease-in;pointer-events:all}.ToastsContainer .Toast.Success{background-color:var(--primary-color)}.ToastsContainer .Toast.Warning{background-color:#ffd466}.ToastsContainer .Toast.Failure{background-color:#f66}.ToastsContainer .Toast.Closing{animation:toast-close 500ms ease-out}@keyframes toast-open{0%{opacity:0;transform:scale(0)}80%{transform:scale(1.25);opacity:1}}@keyframes toast-close{0%{opacity:1}100%{opacity:0;transform:scale(0)}}.ToastsContainer .Toast:Not(.Closing) .ProgressBar{animation-name:ToastProgressBar;animation-timing-function:linear;animation-iteration-count:1;animation-play-state:paused}.ToastsContainer .Toast .ProgressBarContainer{background-color:rgba(0,0,0,.5);margin-top:5px;height:5px;width:100%;overflow:hidden;border-radius:var(--primary-border-radius)}.ToastsContainer .Toast .ProgressBarContainer .ProgressBar{background-color:#fff;width:0;height:100%;border-radius:var(--primary-border-radius)}@keyframes ToastProgressBar{0%{width:100%}100%{width:0}}.ToastsContainer .Toast img{border-radius:var(--primary-border-radius)}
.MainPage{overflow:hidden}.MainPage .FlyingCars{position:absolute;top:30vh;width:100vw;display:flex;flex-direction:column;z-index:-15;filter:brightness(0.9);overflow:hidden}.MainPage .FlyingCars>.FlyingCar{color:var(--secondary-bg);animation:flyingCar 1.5s infinite steps(200);transform:translateX(100vw)}.MainPage .FlyingCars>.FlyingCar:nth-child(even){color:var(--tertiary-bg);transform:scaleX(-1) translateX(200px);animation-name:flyingCarReverse}@keyframes flyingCar{100%{transform:translateX(-200px)}}@keyframes flyingCarReverse{100%{transform:translateX(100vw) scaleX(-1)}}.MainPage>.StarField{position:fixed;top:120vh;z-index:-100;border-radius:500px}.MainPage .Background,.MainPage .Background>.Skyline{position:absolute;width:100vw;height:420vh;pointer-events:none;margin-top:-5vh;overflow:hidden}.MainPage .Background>.Skyline{background-size:50% 65%;background-repeat:repeat-x}.MainPage .Background>.Skyline:first-child{background-size:50% 65%;background-position:-75% 0;z-index:-20}.MainPage .Background>.Skyline:last-child{top:27vh;z-index:-10}@media screen and (max-width: 700px){.MainPage .Background>.Skyline{background-size:150% 100%;height:300vh}.MainPage .Background>.Skyline:first-child{background-size:180% 100%}.MainPage .Background>.Skyline:last-child{margin-top:-17vh}}.MainPage .Background>.Rainbow{position:absolute;width:100vw;height:100vh;background-repeat:no-repeat;top:135vh;right:-70vw;transform:rotateZ(20deg)}@media screen and (max-width: 700px){.MainPage .Background>.Rainbow{left:20vw}}.MainPage .Background>.Vroom{position:absolute;width:100vw;height:100vh;background-repeat:no-repeat;background-size:120% 120%;top:320vh;left:-30vw}@media screen and (max-width: 700px){.MainPage .Background>.Vroom{width:150vw;left:-40vw}}.MainPage .Head{position:relative;flex-direction:column;justify-content:flex-start;text-align:center;min-height:100vh;gap:15px;padding-top:15vh}.MainPage .Head::before{content:"";position:absolute;top:10vh;left:0;bottom:0;right:0;opacity:.75;background:linear-gradient(0deg, var(--tertiary-bg) 0%, transparent 90%);z-index:-16;transform-origin:bottom center;animation:fogPulse 7s infinite steps(50)}@keyframes fogPulse{50%{transform:scaleY(1.05)}}.MainPage .Head .Icon{width:150px;height:150px;border-radius:0 50% 50% 50%;box-shadow:0 2px 12px #0d171d;pointer-events:none}.MainPage .Head .Header{display:flex;flex-direction:column;font-size:2.5em;font-weight:bolder;max-width:80vw}.MainPage .Head .Header .MainHeader{background:linear-gradient(90deg, var(--primary-color) 25%, var(--secondary-color) 75%);color:transparent;background-clip:text;-webkit-background-clip:text;font-size:1.25em;font-weight:normal;text-transform:uppercase;letter-spacing:.2ch}.MainPage .Head .Header .Desc{color:rgba(255,255,255,.7);font-weight:lighter;font-family:monospace;margin-top:20px}@media screen and (max-width: 700px){.MainPage .Head .Header{max-width:90%;margin:0}.MainPage .Head .Header .Desc{font-size:.8em}}
.TooltipContainer{pointer-events:none;position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transform:scale(0.8);transition:opacity ease-in 100ms,transform ease-in 100ms;z-index:100}.TooltipContainer .TooltipArrow{background-color:var(--primary-color);width:15px;height:15px;transform:rotateZ(45deg)}.TooltipContainer .Tooltip{background-color:var(--primary-color);padding:10px;border-radius:var(--primary-border-radius);white-space:nowrap;font-size:1em}.TooltipContainer .Tooltip .TooltipHint{font-weight:bolder;opacity:.3}.TooltipContainer.up{bottom:100%;left:50%;transform:translateX(-50%) scale(0.8);transform-origin:bottom}.TooltipContainer.up .Tooltip{margin-bottom:-10px}.TooltipContainer.left{top:50%;transform:translateY(-50%) scale(0.8);right:100%;flex-direction:row;transform-origin:right}.TooltipContainer.left .TooltipArrow{margin-left:-10px}.TooltipContainer.down{top:100%;left:50%;transform:translateX(-50%) scale(0.8);flex-direction:column-reverse;transform-origin:top}.TooltipContainer.down .Tooltip{margin-top:-10px}.TooltipContainer.right{top:50%;transform:translateY(-50%) scale(0.8);left:100%;flex-direction:row-reverse;transform-origin:left}.TooltipContainer.right .TooltipArrow{margin-right:-10px}.TooltipContainer.Detached{top:unset;left:unset;bottom:unset;right:unset}.TooltipContainer.Detached.Visible{opacity:1}.TooltipContainer.Detached.Visible.up,.TooltipContainer.Detached.Visible.down{transform:translateX(-50%)}.TooltipContainer.Detached.Visible.left,.TooltipContainer.Detached.Visible.right{transform:translateY(-50%)}.HasTooltip{position:relative}.HasTooltip:Hover>.TooltipContainer{opacity:1}.HasTooltip:Hover>.TooltipContainer.up,.HasTooltip:Hover>.TooltipContainer.down{transform:translateX(-50%)}.HasTooltip:Hover>.TooltipContainer.left,.HasTooltip:Hover>.TooltipContainer.right{transform:translateY(-50%)}
.App>footer{background-color:rgba(0,0,0,.1);backdrop-filter:blur(20px);--primary-color: var(--cf-purple)}.App>footer .LeftSections>*{padding:20px}.App>footer .HeadSection>div{margin-left:15px}.App>footer .HeadSection>div>*{margin:5px 0}.App>footer .HeadSection .FlexCenter{margin-bottom:20px}.App>footer .HeadSection h2{color:var(--primary-color);margin:0;margin-left:-0.05em}.App>footer .HeadSection .Logo{width:50px;height:50px;border-radius:100%}.App>footer .ContactSection{padding-top:0}.App>footer .ContactSection .ContactEntry{margin:0 10px;cursor:pointer;transition:color ease-in 100ms}.App>footer .ContactSection .ContactEntry:hover{color:#fff}.App>footer .ContactSection .ContactEntry .TooltipContainer{bottom:110%}.App>footer .MiddleSection{margin:auto}.App>footer .LinksSection{display:grid;margin-right:10px;grid-template-columns:repeat(3, 140px)}@media(max-width: 450px){.App>footer .LinksSection{display:flex;flex-direction:column}}.App>footer .LinksSection>*{margin:15px 0}.App>footer .LinksSection .Copyright{grid-column-start:2;grid-column-end:4;font-family:monospace;font-size:1.23em;opacity:.8}@media(max-width: 800px){#root .App>footer>.Flex{flex-direction:column}#root .App>footer .ContactSection{justify-content:center}#root .App>footer .RightSections{margin:0;text-align:center}}