*{box-sizing:border-box;margin:0}:root{--tan: #fff6e6;--faint: #9e88a5;--primary: #ff204d;--alt: #ffd5c3;--darkest: #643a71;font-family:Exo,Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:auto;font-weight:400;color-scheme:light dark;color:var(--darkest);background-color:var(--tan);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;flex-direction:column;min-width:320px;min-height:100vh}body.no-scroll{overflow:hidden}h1,h2,h3,h4,h5,h6{font-weight:400}h1{font-size:2em}a{color:var(--faint)}.navlink>a,button,.button-link{display:flex;align-items:center;justify-content:center;width:100%;height:60px;border-radius:8px;font-size:1.2rem;font-family:inherit;font-weight:400;color:var(--label-color);background-color:var(--background-color);border:1px solid var(--border-color);cursor:pointer;transition:all .15s;text-decoration:none}button:not(:disabled):hover,.button-link:hover{background-color:var(--background-hover-color);color:var(--label-hover-color);border-color:var(--border-hover-color)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}button:disabled{cursor:default;opacity:.4}button.filled,.button-link.filled{--label-color: white;--background-color: var(--primary);--border-color: transparent;--background-hover-color: var(--darkest);--label-hover-color: var(--tan)}button.filled-alt,.button-link.filled-alt{--label-color: white;--background-color: var(--darkest);--border-color: white;--background-hover-color: var(--primary);--label-hover-color: var(--tan)}button.outlined,.button-link.outlined{--label-color: var(--darkest);--background-color: transparent;--border-color: var(--darkest);--label-hover-color: var(--primary);--border-hover-color: var(--primary);--background-hover-color: white}hr{border-color:var(--darkest);width:100%}ol{display:flex;flex-direction:column;gap:.7rem;font-size:1.2rem;line-height:1.6rem}input,textarea,select{font-family:inherit}div.not-found{display:flex;width:100%;flex-direction:column;align-items:center;gap:30px;padding:20px}div.not-found h2{font-size:1.7rem}div.not-found p,div.not-found a{font-size:1.25rem}.home-layout{display:flex;flex-direction:column;align-items:center;justify-content:center;height:90dvh;gap:18px;padding:12px;max-width:500px;margin:auto}@media screen and (min-width: 769px){.home-layout{gap:30px}}.tooltip{position:relative;display:inline-block;border-bottom:1px dashed rgb(124,124,124)}.tooltip .tooltiptext{visibility:hidden;width:230px;background-color:#d3d3d3;color:#000;text-align:center;border-radius:6px;padding:8px;position:absolute;z-index:1;top:23px;right:10px}.tooltip:hover .tooltiptext{visibility:visible}header{--navbar-height: 80px;height:var(--navbar-height);border-bottom:1px solid var(--darkest)}nav{padding:0 24px;display:flex;justify-content:space-between;align-items:center;width:100%;height:100%;position:relative}a.header-logo{display:flex}button.menu-toggle{width:min-content;color:var(--primary)}@media screen and (min-width: 769px){button.menu-toggle{display:none}}ul.open .menu-toggle{color:var(--tan)}ul{display:flex;gap:18px;list-style-type:none}ul.open .navlinks-container,ul.closed .navlinks-container{position:fixed;flex-direction:column;top:0;padding:5px 20px;align-items:end}ul.closed .navlinks-container{right:-100%}ul.open .navlinks-container{right:0;background-color:var(--primary);border-radius:12px 0 0 12px;z-index:500}.navlinks-container{display:flex;align-items:end;gap:18px;width:80%;height:100%;transition:.3s ease-out}.navlink a{color:var(--primary)}.navlink:has(.active) a{color:var(--darkest)}.open .navlink{background-color:var(--tan);border-radius:8px;width:100%;height:60px;display:flex;align-items:center;justify-content:center}.open .navlink:hover{background-color:#fff}#overlay{z-index:499;width:100%;height:100%;position:fixed;top:0;left:0}.search-screen{position:absolute;z-index:5;top:0;left:0;width:100%;height:100%;background-color:var(--tan)}div.top-row{display:flex;justify-content:space-between;align-items:center;padding-inline:20px}div.top-row svg{color:var(--primary)}div.search-input-container{flex:1;cursor:text}div.search-input-container svg{position:absolute;top:16px;left:32px;color:var(--faint)}div.search-input-container input{width:96%;font-size:1.375rem;padding:20px 20px 20px 56px;border-radius:8px;border:1px solid var(--primary);color:var(--darkest);background-color:#fff}div.search-input-container input::placeholder{color:var(--faint)}.search-results-list{display:flex;flex-direction:column;padding-inline:20px;gap:8px;margin-top:12px}.search-result{font-size:1.375rem;text-align:center;padding:20px;border-radius:8px;border:1px solid var(--darkest);color:var(--darkest);cursor:pointer}.search-result:hover{background-color:#fff;border-color:var(--primary);color:var(--primary)}section.game-content{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-inline:28px;max-width:700px;margin:20px auto auto}div.round-info{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}div.round-info hr{width:70%}div.round-info h2{font-size:1.5rem}@media screen and (min-width: 769px){div.round-info{gap:5px}div.round-info h2{font-size:2rem}}div.score-display-line{margin-top:12px;margin-bottom:24px;display:flex}div.current-score-container{display:flex;justify-content:space-between;width:110px;font-size:1.125rem}@media screen and (min-width: 769px){div.current-score-container{font-size:1.375rem}}.score-increment{color:green}div.artist-cards-container{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px}div.artist-card{display:flex;flex-direction:column;gap:12px;align-items:center;width:100%;padding:14px;border:1px solid white;border-radius:8px;color:#fff}div.artist-card h2{font-size:1.375rem;font-weight:600}div.artist-card hr{border-color:#fff;width:60%}.artist-card.target{background-color:var(--darkest)}.artist-card.guess{background-color:var(--primary)}div.artist-info{display:flex;margin-top:5px;width:100%;justify-content:space-between;gap:8px}@media screen and (min-width: 769px){div.artist-info{width:50%}}div.artist-img-loading{display:flex;align-items:center;justify-content:center;background-color:var(--primary);color:#fff}div.artist-img-loading svg{animation:spin 1.5s ease infinite}@keyframes spin{to{transform:rotate(360deg)}}div.artist-img-loading,.artist-info>img{border-radius:8px;border:1px solid white;width:126px;height:120px;object-fit:cover}span.artist-name{flex:1;display:flex;justify-content:center;align-items:center;text-align:center;font-size:1.375rem}@media screen and (min-width: 769px){span.artist-name{flex:none}}div.artist-input-placeholder{width:100%;height:80px;background-color:#fff;border:1px solid var(--primary);border-radius:8px;cursor:text;display:flex;align-items:center;padding:12px;gap:8px;color:var(--faint)}div.artist-input-placeholder span{font-size:1.375rem}.post-guess-buttons{display:flex;flex-direction:column;align-items:center;margin-top:20px;width:100%;gap:10px}.reset-button{width:100%}.submit-guess-button{width:100%;font-size:1.5rem;background-color:var(--primary)}.overlay{height:100dvh;width:100dvw;position:fixed;top:0;left:0;background-color:#000000a0;display:flex;justify-content:center;align-items:center}div.round-end-panel{z-index:5;background-color:#fff;width:90%;border-radius:8px;border:1px solid var(--darkest);display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;gap:14px;padding:12px;text-align:center;max-width:700px}div.round-end-panel button{max-width:500px}.guess-section,.target-section{display:flex;flex-direction:column;gap:10px;width:90%}.guess-section h2,.target-section h2{color:var(--color-1)}.guess-section .artist-info-container,.target-section .artist-info-container{background-color:var(--color-1);color:#fff;display:flex;flex-direction:column;align-items:center;padding:8px;gap:8px;width:100%;border-radius:8px}.guess-section .artist-info-container .outer-bar,.target-section .artist-info-container .outer-bar{height:25px;width:80%;border-radius:8px;background-color:var(--tan)}.guess-section{--color-1: var(--primary);--color-2: var(--darkest)}.target-section{--color-1: var(--darkest);--color-2: var(--primary)}progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:80%;height:25px}progress::-webkit-progress-bar{background-color:var(--tan);border:2px solid var(--tan);border-radius:8px}progress::-webkit-progress-value{border-radius:inherit;background-color:var(--color-2)}.difference,.pre-round-score,.final-round-score{opacity:0}.final-round-score{font-size:1.375rem;color:#18c42c}section.scoreboard{width:90%;max-width:700px;margin-inline:auto;margin-top:18px;display:flex;flex-direction:column;align-items:center;gap:15px}section.scoreboard h2{font-size:2rem}@media screen and (min-width: 769px){section.scoreboard{gap:32px}}table.scoreboard-table{border-collapse:collapse;width:100%;margin-block:5px;font-size:1.2rem}table.scoreboard-table td,table.scoreboard-table th{text-align:center;padding:7px 5px}table.scoreboard-table tr.dashed-line{border-bottom:1px solid var(--primary)}div.account-forms{display:flex;flex-direction:column;align-items:center;padding:38px 20px;gap:20px}div.account-forms a{color:#fff}.account-forms h2{text-align:center}.account-forms form{display:flex;flex-direction:column;width:100%}.account-forms section{display:flex;flex-direction:column;align-items:center;padding:20px 8px;gap:15px;background-color:var(--primary);border-radius:8px;border:1px solid var(--darkest);color:#fff}.account-forms div.input-group{width:100%;display:flex;flex-direction:column;gap:5px}.account-forms input{padding:20px;background-color:#fff;border-radius:8px;border:1px solid var(--darkest);font-size:1.375rem;color:var(--darkest)}.account-forms .links-line{width:100%;display:flex;justify-content:space-evenly}.account-forms button{margin-top:60px}.dashboard{display:flex;flex-direction:column;align-items:center;padding-top:40px;max-width:800px;margin:auto}.account-options{margin-top:30px;display:flex;flex-direction:column;align-items:center;width:80%;gap:20px}@media screen and (min-width: 769px){.account-options{flex-direction:row}}.past-scores{width:100%;margin-top:50px;display:flex;flex-direction:column;align-items:center;gap:20px}.past-scores-table{border-collapse:collapse;width:100%;text-align:center}.past-scores-table tr{border-bottom:1px solid var(--darkest)}.past-scores-table tr.total-score-line{border-bottom:none}.past-scores-table td,.past-scores-table th{padding:9px 0}@media screen and (min-width: 769px){.past-scores-table{font-size:1.15rem}}.accordion-parent{width:100%;padding-inline:25px}.accordion{display:flex;flex-direction:column;gap:12px}.accordion button.toggle{background-color:var(--primary);display:flex;justify-content:space-between;align-items:center;font-size:1rem;padding:0 15px;transition:all .15s ease;cursor:pointer;width:100%;height:46px;color:#fff}@media screen and (min-width: 769px){.accordion button.toggle{font-size:1.15rem}}.arrow{transition:all .2s ease}.arrow.active{rotate:180deg}.accordion .content-parent{max-height:0;overflow:hidden;transition:max-height .15s ease-out}.accordion.toggled .content-parent{max-height:500px;transition:max-height .25s ease-in}.accordion .content{padding:15px 10px}.instructions-content{display:flex;flex-direction:column;padding:12px;height:85dvh;gap:8px;max-width:600px;margin:auto}.instructions-content .button-link{padding-block:16px}@media screen and (min-width: 769px){.instructions-content{text-align:center}}.info-card{display:flex;flex-direction:column;justify-content:center;height:60vh;gap:18px;background-color:#fff;border:1px solid var(--darkest);border-radius:8px;padding:14px}.info-card img{width:100%;height:270px;object-fit:contain;border-radius:8px}.info-card h2{font-weight:400}.arrow-group{display:flex;gap:8px;margin-bottom:10px}
