:root{--body-font:"Segoe UI Variable", "Segoe UI", sans-serif}*{box-sizing:border-box}body{font-family:var(--body-font);background-color:#faebd7;min-height:100dvh;margin:0}.header-bar{height:20px}.header-bar.bar-1{background-color:#5f9ea0}.header-bar.bar-2{background-color:olive;height:20px}.header-bar.bar-3{background-color:#daa520;height:25px}.header-bar.bar-4{background-color:#8b4513;height:30px}.content{flex-direction:column;align-items:center;padding:.5rem 1.5rem;display:flex}.joke-card{text-align:center;background-color:#fffaf0;border-radius:4px;flex-direction:column;align-items:center;width:350px;height:350px;margin-top:2rem;padding:1rem;display:flex;box-shadow:0 1px 3px #0003}.joke-card img{width:128px;height:128px}.joke-question{margin:.75rem 0 0;font-size:1.5rem;font-weight:600}.joke-answer{margin:.5rem 0 0;font-size:1.25rem}.load-joke-button{color:#000;cursor:pointer;background-color:olive;border:none;border-radius:4px;align-items:center;gap:.5rem;margin-top:1.5rem;padding:.75rem 1.25rem;font-size:1.25rem;display:flex}.load-joke-button:hover{filter:brightness(1.1)}.loading-label{margin-top:1rem;font-size:1.1rem}.spinner{border:.5rem solid #e0e0e0;border-top-color:#8b4513;border-radius:50%;width:4rem;height:4rem;margin-top:2rem;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}