@property --hue{initial-value: 0; inherits: false; syntax: "<number>";}:root{--white: #ffffff;--black: #0a0a0a;--wrapper-margin: clamp(1rem, max(2vw, 2vh), 2rem);--wrapper-padding: clamp(1rem, max(3vw, 3vh), 2rem);--gap-list: 2em;--border-anim-duration: .7s;--border-anim-delay: .5s}a{text-decoration:none;color:inherit}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;font-family:Courier,Verdana,sans-serif;list-style:none}html{--accent: hsl(var(--hue), 100%, 40%);--bkg-color: var(--white);--frg-color: var(--black);--transparent-bg: rgba(255, 255, 255, .95);--border-thickness: 2px;animation:anim-color 10s linear infinite;background-color:var(--bkg-color);color:var(--frg-color)}html.dark-theme{--border-thickness: 1px;--accent: hsl(var(--hue), 80%, 50%);--bkg-color: var(--black);--frg-color: var(--white);--transparent-bg: rgba(0, 0, 0, .9)}@keyframes anim-color{to{--hue: 360}}.wrapper{position:relative;padding:var(--wrapper-padding);margin:var(--wrapper-margin);height:calc(100vh - (2 * var(--wrapper-margin)));background-color:var(--bkg-color)}.border{position:absolute;background-color:var(--accent)}.top{top:0;left:0;height:var(--border-thickness);width:100%;transform-origin:0% 0%;scale:0 1;animation:border-anim var(--border-anim-duration) forwards calc((var(--border-anim-duration) * 0) + var(--border-anim-delay))}.right{top:0;right:0;width:var(--border-thickness);height:100%;transform-origin:0% 0%;scale:1 0;animation:border-anim var(--border-anim-duration) forwards calc((var(--border-anim-duration) * 1) + var(--border-anim-delay))}.bottom{bottom:0;left:0;height:var(--border-thickness);width:100%;transform-origin:100% 0%;scale:0 1;animation:border-anim var(--border-anim-duration) forwards calc((var(--border-anim-duration) * 2) + var(--border-anim-delay))}.left{bottom:0;left:0;width:var(--border-thickness);height:100%;transform-origin:0% 100%;scale:1 0;animation:border-anim var(--border-anim-duration) forwards calc((var(--border-anim-duration) * 3) + var(--border-anim-delay))}.radial-mouse{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(calc(100vw - 2rem),calc(100vh - 2rem));height:min(calc(100vw - 2rem),calc(100vh - 2rem));opacity:30%;background-image:radial-gradient(circle,var(--accent) 0%,rgba(255,255,255,0) 75%);animation:anim-color 10s linear infinite}@keyframes border-anim{to{scale:1 1}}.anim-display{opacity:0%;transform:translate(var(--direction));animation:animation-display .2s forwards var(--delay)}@keyframes animation-display{to{opacity:100%;transform:translate(0)}}.no-anim{animation:none;scale:1 1;opacity:100%;transform:translate(0)}.content{height:100%;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between}a{position:relative}a:hover:after{--cursor-size: .7em;position:absolute;bottom:0;right:-var(--cursor-size);background-color:var(--accent);width:var(--cursor-size);height:.1em;content:"";animation:input-anim .75s steps(2,start) infinite}@keyframes input-anim{to{visibility:hidden}}.accent-letter:hover{color:var(--accent);font-weight:700}header{display:flex;align-items:center;justify-content:space-between;white-space:nowrap}.main-logo-short{display:none}.accent-color{color:var(--accent)}.main-logo-short,.main-logo-long{font-size:x-large;font-weight:bolder}.secret-link:hover{animation:input-anim .75s steps(2,start) infinite;cursor:pointer}@media screen and (width < 1024px){.main-logo-long{display:none}.main-logo-short{display:block}}@media screen and (width < 768px){.main-logo-short,.main-logo-long{font-size:large}}.header-nav ul{display:flex;gap:var(--gap-list)}.burger-nav{display:none;position:relative;z-index:2;font-weight:bolder;font-size:large}.burger-nav_closed p:nth-child(2){display:none}.burger-nav_openned p:nth-child(1){display:none}@media screen and (width < 768px){.header-nav{display:none;z-index:1;font-size:x-large;font-weight:700;position:absolute;width:calc(100% - var(--border-thickness) * 2);height:calc(100% - var(--border-thickness) * 2);text-align:center;top:var(--border-thickness);left:var(--border-thickness);background-color:var(--transparent-bg)}.header-nav nav{margin-top:20vh}.header-nav ul{flex-direction:column}.burger-nav{display:block}}main{height:75%;overflow-y:scroll}main::-webkit-scrollbar{display:none}.main-content{margin-block:5rem}main h1{margin-bottom:1em}form{margin-left:1em}form *{color:inherit;background-color:var(--bkg-color)}form input,textarea{display:block;margin-bottom:1rem;border:1px solid var(--accent);padding:.5em}form textarea{width:min(45em,100%);height:5em}form button{cursor:pointer;border:none;border-bottom:1px solid var(--accent)}footer{display:flex;align-items:center;justify-content:space-between;font-size:smaller;gap:.5em}@media screen and (width < 768px){footer{flex-direction:column;font-size:x-small}}footer ul{display:flex;align-items:center;gap:var(--gap-list)}.button-pointer{cursor:pointer}#toggle{font-weight:bolder;font-size:large}@media screen and (width < 1024px){:root{--gap-list: 1em}}
