*{margin:0;padding:0;box-sizing:border-box}:root{--bg-color: #fff7ec;--main-color: #272727;--main-font: "Courier New", Courier, monospace;--title-font: "Jacquard 12"}.retroUi{border:2px solid var(--main-color);box-shadow:4px 4px 0 0 var(--main-color);padding:1rem}.retroUi:focus{outline:none;transform:translate(3px,3px);box-shadow:2px 2px 0 0 var(--main-color)}nav{font-family:var(--title-font);font-size:54px;width:100%;display:flex;justify-content:space-evenly;margin-top:2rem}nav a{font-weight:400;text-decoration:none;color:var(--main-color)}.hover{transition:.3s linear}.hover:hover{transform:translate(3px,3px)}@keyframes hoverAnim{to{transform:translate(3px,3px)}}@media (max-width: 800px){nav{font-size:40px}}@media (max-width: 550px){nav{flex-direction:column;align-items:center;gap:1rem;margin-top:0}}.activeNav{position:relative;animation:hoverAnim .2s linear reverse}.activeNav:before{left:-30px;top:12px;position:absolute;display:block;content:"💜";font-size:20px;animation:x 1s infinite alternate linear}@media (max-width: 800px){.activeNav:before{top:5px}}@media (max-width: 550px){.activeNav:before{top:7px;font-size:12px}}@keyframes x{0%{opacity:1}59.9%{opacity:1}60%{opacity:0}to{opacity:0}}body{background:#000;color:#ffcded;display:grid;place-items:center;height:100vh}@keyframes typing{0%{width:0}}@keyframes blink-caret{50%{border-color:transparent}}h1{font:700 1.5rem Consolas,Monaco,monospace;border-right:.1em solid #ffcded;width:8em;margin:2em 1em;white-space:nowrap;overflow:hidden;animation:typing 2s steps(21,end),blink-caret .5s step-end infinite alternate}
