#app{display:flex;flex:1;padding:10px;text-align:center;max-width:600px}.board-response{background-color:var(--secondary-bg-color);border-radius:5px;display:flex;justify-content:space-between;font-size:12px;padding:2px}.board-response.-empty{background-color:transparent}.board-response-text{text-align:center;flex:1;overflow:hidden}.board-response-weight{text-align:center;width:26px;border-left:1px var(--secondary-color) solid;border-radius:20px;padding-left:2px;flex-shrink:0}.board-container{display:grid;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(2,1fr);grid-gap:8px 8px;grid-auto-flow:column;margin:0 0 10px;padding:5px;border:2px solid var(--light-gray3);border-radius:5px;font-weight:700}.buzz-in-button{aspect-ratio:1 / 1;background-size:contain;flex-shrink:1;cursor:pointer;background-repeat:no-repeat;background-position:center;background-image:var(--buzz-in-button-url)}.buzz-in-button:active{background-image:var(--buzz-in-button-pressed-url)}.loading-image{animation:LoadingImageFadeIn 1s forwards ease-in}.loading-image img{max-width:100%;animation:LoadingImageFadeInOut 3s infinite ease-in-out}@keyframes LoadingImageFadeIn{0%{opacity:0}to{opacity:1}}@keyframes LoadingImageFadeInOut{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}.lobby-container{display:flex;flex-direction:column;gap:40px}.lobby-container .host-intro{text-align:left}.display-name-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:4px;width:100%}.dislay-name-input{max-width:16em}.user-cell-in-team-table{font-weight:800}.intro-images{display:flex;justify-content:center;align-items:center;margin:2em 0}.intro-images>div{margin:0 1em 0 0;flex:1;height:auto;aspect-ratio:1 / 1;background-size:contain}.intro-images>div:last-child{flex-grow:1.75;aspect-ratio:7 / 4;margin-right:0}.main-menu-container{display:flex;flex-direction:column;gap:40px;max-width:400px;align-self:center}.room-code-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:4px;width:100%}.room-code-input{max-width:12em}.layout-container{display:flex;flex:1;flex-direction:column;justify-content:flex-start;align-items:stretch}.layout-container .header{margin:0 0 10px}.layout-container .header img{width:200px;height:108px}.layout-container>.main{display:flex;flex-direction:column;justify-content:flex-start;flex:max-content;overflow-y:auto}.layout-container>.main .host-block{margin-bottom:20px;text-align:left}.layout-container .music-control{position:absolute;top:0;right:0;margin:20px}:root{--black: #10161a;--dark-gray1: #182026;--dark-gray2: #202b33;--dark-gray3: #293742;--dark-gray4: #30404d;--dark-gray5: #394b59;--gray1: #5c7080;--gray2: #738694;--gray3: #8a9ba8;--gray4: #a7b6c2;--gray5: #bfccd6;--light-gray1: #ced9e0;--light-gray2: #d8e1e8;--light-gray3: #e1e8ed;--light-gray4: #ebf1f5;--light-gray5: #f5f8fa;--white: #ffffff;--blue1: #0e5a8a;--blue2: #106ba3;--blue3: #137cbd;--blue4: #2b95d6;--blue5: #48aff0;--green1: #0a6640;--green2: #0d8050;--green3: #0f9960;--green4: #15b371;--green5: #3dcc91;--orange1: #a66321;--orange2: #bf7326;--orange3: #d9822b;--orange4: #f29d49;--orange5: #ffb366;--red1: #a82a2a;--red2: #c23030;--red3: #db3737;--red4: #f55656;--red5: #ff7373;--vermilion1: #9e2b0e;--vermilion2: #b83211;--vermilion3: #d13913;--vermilion4: #eb532d;--vermilion5: #ff6e4a;--rose1: #a82255;--rose2: #c22762;--rose3: #db2c6f;--rose4: #f5498b;--rose5: #ff66a1;--violet1: #5c255c;--violet2: #752f75;--violet3: #8f398f;--violet4: #a854a8;--violet5: #c274c2;--indigo1: #5642a6;--indigo2: #634dbf;--indigo3: #7157d9;--indigo4: #9179f2;--indigo5: #ad99ff;--cobalt1: #1f4b99;--cobalt2: #2458b3;--cobalt3: #2965cc;--cobalt4: #4580e6;--cobalt5: #669eff;--turquoise1: #008075;--turquoise2: #00998c;--turquoise3: #00b3a4;--turquoise4: #14ccbd;--turquoise5: #2ee6d6;--forest1: #1d7324;--forest2: #238c2c;--forest3: #29a634;--forest4: #43bf4d;--forest5: #62d96b;--lime1: #728c23;--lime2: #87a629;--lime3: #9bbf30;--lime4: #b6d94c;--lime5: #d1f26d;--gold1: #a67908;--gold2: #bf8c0a;--gold3: #d99e0b;--gold4: #f2b824;--gold5: #ffc940;--sepia1: #63411e;--sepia2: #7d5125;--sepia3: #96622d;--sepia4: #b07b46;--sepia5: #c99765}:root{--main-bg-color: var(--dark-gray1);--main-color: var(--light-gray1);--secondary-bg-color: #145da0;--interactive-bg-color: #1a1a1a;--secondary-color: #2e8bc0;--tertiary-color: #b1d4e0;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:var(--main-color);background:var(--main-bg-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;justify-content:center;width:100vw;height:100vh}h1{font-size:3.2em;line-height:1.1;color:var(--main-color)}input{border:1px solid;border-radius:2px;background-color:var(--interactive-bg-color);outline:4px auto -webkit-focus-ring-color;transition:border-color .25s;height:30px}input:hover{border-color:var(--secondary-color)}input:focus-visible{border-color:var(--secondary-color)}input.middle:focus{outline-width:0}:root{--buzz-in-button-url: url(https://assets.artificialfeud.com/misc/buzzin.webp);--buzz-in-button-pressed-url: url(https://assets.artificialfeud.com/misc/buzzin-pressed.webp)}