:root{--font-family:"Arial",sans-serif;--font-size-base:14px;--background-color:#000;--text-color:#fff;--padding:2rem;--vitals-width:25%;--stats-width:25%%;--items-width:100%;--skills-width:100%;--quests-width:100%;@media (min-width:768px){--vitals-width:20%;--stats-width:20%;--items-width:60%;--skills-width:60%;--quests-width:60%}--progress-background:hsla(0,0%,100%,.3);--progress-fill:hsla(0,0%,100%,.6);--backdrop-filter:blur(10px) brightness(1.2);--modal-background-color:rgba(0,0,0,.5);--modal-text-color:#fff;--modal-backdrop-blur:10px;--hexagon-width:3rem;--hexagon-height:3.5rem;--label-font-size:0.9rem;--label-line-height:0.9rem;--color-white:#fff;--color-white-50:hsla(0,0%,100%,.5);--color-red:hsla(0,50%,70%,.5);--color-red-50:hsla(0,50%,70%,.5);--color-green:rgba(112,255,193,.5);--color-green-50:rgba(112,255,193,.5);--color-yellow:#e3c869;--color-yellow-50:hsla(47,69%,65%,.5);--button-background-color:hsla(0,0%,100%,.1);--button-background-color-hover:hsla(0,0%,100%,.2);--button-primary-background-color:var(--color-yellow);--button-primary-background-color-hover:var(--color-yellow);--button-primary-text-color:var(--color-white);--button-primary-text-color-hover:var(--color-white-50);--button-text-color:hsla(0,0%,100%,.5);--button-padding:1rem 2rem;--button-border-radius:2rem}*,body,html{margin:0;padding:0;box-sizing:border-box}body,html{font-size:var(--font-size-base);font-weight:100;letter-spacing:.05em;line-height:1.5em}body{background-color:var(--background-color);color:var(--text-color);font-family:var(--font-family)}h1,h2,h3,h4,h5,h6{font-size:2rem;font-weight:400}p{font-size:1rem}a{text-decoration:none;color:inherit}footer,header{position:fixed;width:100%;z-index:100}header{top:0;font-size:3rem;text-transform:lowercase}nav{display:flex;gap:1rem}nav a{color:inherit}footer{bottom:0;font-size:2rem;padding:1rem}.button,button{background-color:var(--button-background-color);color:var(--button-text-color);padding:var(--button-padding);border-radius:var(--button-border-radius);transition:background-color .3s ease,color .3s ease;border:none;cursor:pointer;font-size:1rem}.button:hover{background-color:var(--button-background-color-hover)}.button-primary{background-color:var(--button-primary-background-color);color:var(--button-primary-text-color)}.button-primary:hover{background-color:var(--button-primary-background-color-hover);color:var(--button-primary-text-color-hover)}