*,*:before,*:after{box-sizing:border-box}*{margin:0}@media(prefers-reduced-motion:no-preference){html{interpolate-size:allow-keywords}}:root{--color-light: yellow;--color-dark: red;--color-neutral: grey;--font-permanent-marker: "Permanent Marker", cursive}body{line-height:1.5;-webkit-font-smoothing:antialiased;font-size:1rem;font-family:Inter,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}input[type=radio]{appearance:none;margin-top:.35rem;width:1rem;height:1rem;border-radius:50%;--background-color:var(--color-neutral);background:radial-gradient(var(--background-color) 50%,var(--color-dark) 0 100%);position:relative;cursor:pointer}input[type=radio]:checked{--background-color: var(--color-light)}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}button{width:max-content;border-width:5px;border-radius:5px;border-color:var(--color-light);background:var(--color-dark);color:var(--color-light);font-weight:100;font-family:var(--font-permanent-marker)}.guesser-view{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;background-color:#ffffff1a;border-radius:8px;text-align:center;font-family:var(--font-permanent-marker)}.guesser-view h3{margin-bottom:1rem;font-weight:400;color:#fff}.guesser-view p{color:#ccc}.words-container{display:flex;flex-direction:column;gap:1rem;width:100%;margin-top:1rem}.game-info p{font-family:var(--font-permanent-marker)}.disabled{background:gray;border-color:gray;color:#000}.word-container{display:grid;width:100%;grid-template-columns:40% 1rem auto auto;align-items:center;gap:.5rem}.word-container .word{font-weight:700;border:3px var(--color-dark) solid;padding:.5rem;border-radius:10px;background:var(--color-light)}.word-container .word.disabled{background:var(--color-neutral)}.scoreboard{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:.5rem;width:100%}.scoreboard div{border:4px solid red;padding:.25rem;border-radius:8px;background:var(--color-neutral);width:80%;text-align:center;font-family:var(--font-permanent-marker)}div .active{background:#ff0;font-weight:700}.auth{display:flex;flex-direction:column;align-items:end;justify-content:center}.initial-button,.google-button{display:flex;flex-direction:column;border-radius:50%;height:2.5rem;aspect-ratio:1;justify-content:center;align-items:center;text-align:center}.initial-button{background:green}.initial-button span{color:#fff;font-weight:700}.google-button{background:#fff}fieldset{display:flex;flex-direction:column;border:0;font-family:var(--font-permanent-marker)}fieldset .selection{display:flex;flex-direction:row;gap:.5rem}@property --glow-deg{syntax: "<angle>"; inherits: true; initial-value: 0deg;}.logo-wrapper{--gradient-colors: white, yellow, gold, white;--gradient-glow: conic-gradient(from var(--glow-deg), var(--gradient-colors));background:padding-box var(--background-gradient),border-box var(--gradient-glow);display:flex;justify-content:center;align-items:center;max-width:100%;--bevel: 50px;clip-path:polygon(var(--bevel) 0,calc(100% - var(--bevel)) 0,100% var(--bevel),100% calc(100% - var(--bevel)),calc(100% - var(--bevel)) 100%,var(--bevel) 100%,0 calc(100% - var(--bevel)),0 var(--bevel));border:6px solid transparent;padding-inline:3rem;padding-block:1rem;position:relative;isolation:isolate;animation:glow 10s linear infinite}@supports (corner-shape: bevel){.logo-wrapper{clip-path:none;corner-shape:bevel;border-radius:var(--bevel)}}.logo-wrapper p{text-transform:uppercase;font-weight:700;font-size:2rem;background-clip:text;opacity:1;background:var(--gradient-glow) 0 0 / 200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent}@keyframes glow{0%{--glow-deg: 0deg}to{--glow-deg: 360deg}}body{display:flex;flex-direction:column;--background-gradient: linear-gradient(var(--background-angle), orangered, #0fdd00);background:var(--background-gradient);min-height:100vh;padding:1rem;align-items:center;animation:rotate 100s linear infinite}#root{display:flex;flex-direction:column;max-width:600px}header{display:grid;grid-template-columns:75% 20%;gap:.5rem;margin-bottom:.5rem}.new-game-button{margin-bottom:.5rem}.welcome{font-family:var(--font-permanent-marker)}@property --background-angle{syntax:"<angle>"; inherits: true; initial-value:0deg;}@keyframes rotate{0%{--background-angle:0deg}to{--background-angle:360deg}}
