:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--primary: hsl(232 86% 8%);--secondary: hsl(38.49deg 100% 96.5%);--highlight: hsl(32 100% 50%)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%;background-color:var(--primary);font-family:Arial,Helvetica,sans-serif;font-size:2rem}body{display:flex;flex-direction:column;justify-content:stretch;align-items:center}header{flex-grow:1;display:flex;align-items:center}#app{width:100%;height:100%;display:flex;flex-direction:column}main{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;box-sizing:border-box;width:100%;border-radius:4px;flex-grow:3;position:relative}h1{position:relative;color:var(--secondary);text-align:center;margin:auto;width:fit-content;text-shadow:var(--highlight) 6px 4px;word-wrap:break-word}h1:before{--foreground: var(--secondary);--background: var(--primary);text-shadow:var(--background) 6px 4px;content:"Dad the Doberman";top:-8px;left:-16px;position:absolute;color:var(--foreground)}h2{text-align:center}.divider{height:2px;width:40%;background-color:var(--primary);margin:1rem auto 2rem}.button-links a{text-align:center;position:relative;display:block;--foreground: var(--secondary);--background: var(--highlight);color:var(--foreground);text-decoration:underline var(--foreground)}.button{--background: var(--secondary);--foreground: var(--primary);background-color:var(--foreground);border:solid 2px var(--primary);border-radius:var(--borderRadius);padding:24px;border-top-left-radius:16px;box-shadow:var(--highlight) min(3vw,24px) min(2vh,24px)}.button-label{background-color:var(--highlight);margin-left:-40px;margin-top:-40px;width:fit-content;border-radius:8px;padding:8px 16px;--background: var(--secondary);--foreground: var(--primary);color:var(--foreground)}.button-container{display:flex;flex-direction:column;gap:48px;background-color:var(--secondary);padding:48px;max-width:min(100% - 6vw,800px);width:fit-content;border-radius:.5em .5em .5em 0;--x: 5vw;--y: 4vh;position:relative;left:calc((0vw - var(--x)) / 2);margin-top:calc(0 - var(--y));box-shadow:var(--highlight) var(--x) var(--y),var(--highlight) var(--x) 0,var(--highlight) 0 var(--y)}@media (max-width: 360px){h1{font-size:2rem}h2,h3,.button-label,.button-links a{font-size:.3em}}@media (min-width: 360px) and (max-width: 720px){h1{font-size:2rem}h3{font-size:.6em}.button-labels{font-size:.6rem}.button-links{font-size:.8rem}}@media (min-width: 720px) and (max-width: 1140px){h1{font-size:4rem}h3,.button-labels{font-size:.6rem}.button-links{font-size:2rem}}@media (min-width: 720px) and (max-width: 1140px){h1{font-size:2rem}.button-label{font-size:.5rem}.button-links{font-size:.8rem}.button-container{gap:24px;padding:32px}}
