body,html{display:flex;margin:0}body,header{position:relative}#mute-btn,#toggle-light-mode{top:1em;background-color:rgba(51,51,51,.7);color:#e0e0e0;padding:.5em 1em;font-size:1em;cursor:pointer;transition:background-color .3s;position:absolute}footer,header{padding:1em;text-align:center;background-color:transparent;color:inherit;box-shadow:none}#mute-btn,.star{position:absolute}#starfield,.star{pointer-events:none}body,html{height:100%;font-family:Arial,sans-serif;flex-direction:column}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.fade-in{opacity:0;animation:1s ease-out forwards fadeIn}body{transition:background-color .3s,color .3s;flex-direction:column;flex:1}body.dark-mode{background-color:#121212;color:#e0e0e0}body.light-mode{background-color:#f0f0f0;color:#333}header{border-bottom:none}#toggle-light-mode{right:1em;border:none;border-radius:5px}#mute-btn:hover,#toggle-light-mode:hover{background-color:rgba(51,51,51,.9)}#mute-btn{left:1em;border:none;border-radius:5px}.container{padding:2em;max-width:800px;margin:auto;flex:1}footer{border-top:none}@media (max-width:600px){#mute-btn,#toggle-light-mode{font-size:.8em;padding:.4em .8em}}#starfield{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:0 0}.star{border-radius:50%;background-color:#fff;opacity:.8;width:2px;height:2px;animation:1.5s infinite alternate twinkle;animation-delay:var(--animation-delay, 0s);animation-duration:var(--animation-duration, 1.5s)}@keyframes twinkle{from{opacity:.5}to{opacity:1}}#hobbies{margin-top:3em}#hobbies ul{list-style-type:none;padding:0}#hobbies li{margin-bottom:1em}