.header{width:100%;display:flex;justify-content:space-between;align-items:center;background-color:var(--secondary-color);padding:25px 35px;box-shadow:var(--shadow-red);color:var(--main-text-color);overflow:hidden}.header__logo{font-size:24px;font-style:normal;font-weight:700;line-height:normal}.language-switcher{display:flex;align-items:center}.language-switcher__lang{position:relative;padding:0 2px;background-color:var(--primary-color);color:var(--primary-color);cursor:pointer;transition:font-weight .3s ease-in-out}.language-switcher__lang:after{content:"";position:absolute;bottom:-4px;left:50%;width:calc(100% - 4px);transform:translate(-50%);height:1px;background-color:var(--main-text-color);opacity:0;transition:opacity .3s ease-in-out}.language-switcher__lang:disabled{cursor:not-allowed;font-weight:700}.language-switcher__lang:disabled:after{opacity:1}.title{text-align:center;font-size:48px;font-style:normal;font-weight:900;line-height:normal}.description{font-family:lato,sans-serif;font-size:20px;font-style:normal;font-weight:400;line-height:140%;letter-spacing:1px;text-align:justify}.description__strong{font-weight:900}.roles-card{-webkit-user-select:unset;user-select:unset;width:192.5px;height:250px;position:relative}.roles-card:hover .roles-card__information{opacity:1;visibility:visible}.roles-card__image{display:inline-block;width:100%;height:100%;object-fit:contain}.roles-card__information{transition:all .3s ease-in-out;opacity:0;visibility:hidden;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#2c2c2cd9;padding:12px;text-align:center;display:flex;align-items:center;justify-content:center;border:2px solid #ffffff;border-radius:6px;cursor:pointer;-webkit-user-select:none;user-select:none}.roles-card__text{font-size:12px;font-style:normal;font-weight:400;line-height:125%}.roles-card__text span{font-weight:900}.backside{z-index:10;transition:transform 1s ease-in-out;transform:rotateY(0);transition-delay:1s}.backside.active{transition-delay:0s;transform:rotateY(90deg)}.frontside{z-index:5;transition:transform 1s ease-in-out;transform:rotateY(0);transition-delay:1s}.frontside.active{transition-delay:0s;transform:rotateY(90deg)}.player-card{position:relative;width:395px;height:513px;border-radius:10px;overflow:hidden;cursor:pointer}.player-card img{position:absolute;top:0;left:0;right:0;bottom:0;display:inline-block;width:100%;height:100%}.label{display:flex;flex-direction:column;align-items:center;gap:25px;font-size:18px;font-weight:700;letter-spacing:-.2px}.label:not(:last-child){margin-bottom:25px}.input{width:52px;padding:15px 12px;font-size:18px;color:var(--main-text-color);text-align:center;background-color:var(--main-color);border-radius:5px;outline:none;border:2px solid var(--main-text-color);-webkit-transition:box-shadow .3s ease-in-out;-moz-transition:box-shadow .3s ease-in-out;-ms-transition:box-shadow .3s ease-in-out;-o-transition:box-shadow .3s ease-in-out;transition:box-shadow .3s ease-in-out}.input:hover,.input:focus{box-shadow:var(--shadow-white)}.settings__form{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.select-wrapper{position:relative;width:100%;margin:0 0 20px;border:2px solid var(--main-text-color);border-radius:5px;-webkit-transition:box-shadow .3s ease-in-out;-moz-transition:box-shadow .3s ease-in-out;-ms-transition:box-shadow .3s ease-in-out;-o-transition:box-shadow .3s ease-in-out;transition:box-shadow .3s ease-in-out}.select-wrapper:hover{box-shadow:var(--shadow-white)}.select-wrapper select{outline:none;width:145px;font-size:18px;height:48px;padding:0 15px;background:transparent;color:var(--main-text-color);border:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer}.select-wrapper select::-ms-expand{display:none}.button{display:inline-block;font-family:lato,sans-serif;font-size:16px;font-style:normal;font-weight:800;line-height:normal;padding:15px 30px;border-radius:10px;cursor:pointer;transition:box-shadow .3s ease-in-out,color .3s ease-in-out,background-color .3s ease-in-out}.button.disabled{cursor:not-allowed;background-color:var(--disabled-bg-color);color:var(--disabled-text-color);box-shadow:unset}.button.disabled:hover{box-shadow:inherit;color:var(--disabled-text-color)}.button--primary{background-color:var(--secondary-color);color:var(--main-text-color);box-shadow:var(--shadow-red)}.button--primary:hover{box-shadow:var(--shadow-red-hover)}.button--secondary{background-color:var(--main-text-color);color:var(--secondary-color);box-shadow:var(--shadow-white)}.button--secondary:hover{box-shadow:var(--shadow-white-hover)}.button--third{background-color:transparent;color:var(--third-color);box-shadow:var(--shadow-white)}.button--third:hover{color:var(--main-text-color);box-shadow:var(--shadow-white-hover)}.timer{display:flex;flex-direction:column;align-items:stretch;width:634px}.timer__clock{position:relative;margin-bottom:40px}.timer__clock span{text-align:center;display:block;width:100%;font-size:128px;font-style:normal;font-weight:900;line-height:100%}.timer__clock svg{position:absolute;display:inline-block;top:50%;right:10%;transform:translateY(-45%)}.timer__clock svg.disabled path{opacity:.2;cursor:not-allowed}.timer__clock svg.disabled path:hover{opacity:.2}.timer__clock svg path{opacity:.2;transition:opacity .3s ease-in-out;cursor:pointer}.timer__clock svg path:hover{opacity:1}.timer__controls{display:flex;justify-content:space-between;align-items:center}.penalty{display:flex;align-items:center;gap:10px}.penalty__point{display:inline-block;width:25px;height:25px;cursor:pointer;border:2px solid var(--secondary-color);border-radius:50%;transition:background-color .15s ease-in-out,filter .15s ease-in-out}.penalty__point:hover{background-color:var(--secondary-color-transparent)}.penalty__point.pressed{background-color:var(--secondary-color)}.penalty__point.disabled{pointer-events:none;filter:grayscale(100%)}.player__card{position:relative;overflow:hidden}.player__title{font-size:18px;font-style:normal;font-weight:700;line-height:normal}.player__queue{position:absolute;top:-22px;left:7px;width:15px;height:75px;background-color:var(--third-color);border:2px solid var(--main-text-color);transform:rotate(45deg);z-index:30;cursor:pointer;transition:background-color .15s ease-in-out,border .15s ease-in-out}.player__queue.pressed{background-color:var(--main-text-color);border:2px solid var(--main-text-color)}.player__queue.disabled{background-color:var(--main-color);border:2px solid var(--main-text-color);z-index:10;cursor:unset}.player__actions{position:relative}.player__context-menu{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:15px;padding:29px 15px 29px 14px;opacity:0;background-color:var(--main-color-transparent);transition:opacity .3s ease-in-out;z-index:0}.player__context-menu.visible{z-index:20}.player__context-menu.visible:hover{opacity:1}.player__button{width:100%;display:inline-flex;padding:3px 10px 3px 3px;align-items:center;gap:7px;color:var(--main-text-color);border-radius:10px;cursor:pointer}.player__button span{flex:1 0 0;font-size:10px;font-style:normal;font-weight:900;line-height:150%}.player__button--primary{background-color:var(--secondary-color)}.player__button--secondary{color:var(--secondary-color);background-color:var(--main-text-color)}.player__button--third{background-color:var(--main-color)}.player__status{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;display:flex;align-items:center;justify-content:center;background-color:var(--main-color-transparent);transition:opacity .15s ease-in-out;z-index:10}.player__status.visible{opacity:1}.player__image{width:100%}.game-desk{display:flex;flex-direction:column;align-items:center;width:100%}.game-desk__cards{margin-bottom:25px;display:grid;align-items:center;justify-content:space-between;width:100%;grid-row-gap:25px}.game-desk__cards--7,.game-desk__cards--9,.game-desk__cards--11{justify-content:space-around}.game-desk__cards--6{grid-template-rows:1fr;grid-template-columns:repeat(6,118.5px)}.game-desk__cards--7{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,118.5px)}.game-desk__cards--7 .game-desk__player:last-child{grid-column-start:2;grid-column-end:3}.game-desk__cards--8{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(4,118.5px)}.game-desk__cards--9{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,118.5px)}.game-desk__cards--10{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(5,118.5px)}.game-desk__cards--11{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(5,118.5px)}.game-desk__cards--11 .game-desk__player:last-child{grid-column-start:3;grid-column-end:4}.game-desk__cards--12{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(6,118.5px)}.game-desk__player{display:flex;flex-direction:column;align-items:center;max-width:118.5px;gap:8px}.queueing{overflow:hidden}.queueing__players{margin:25px 0;display:flex;flex-direction:column;gap:40px}.queueing__player{display:flex;justify-content:space-between;align-items:center}.queueing__number{font-weight:700;font-size:24px;line-height:125%}.queueing__controls{padding:15px;display:flex;align-items:center;justify-content:space-between;max-width:180px;width:100%;border-radius:10px;border:1px solid rgba(255,255,255,.25)}.queueing__count{font-size:24px;line-height:100%;font-weight:900}.queueing__button{display:flex;align-items:center;justify-content:center;padding:8px;border-radius:50%;cursor:pointer;background-color:var(--secondary-color);border:1px solid var(--secondary-color);transition:background-color .3s ease-in-out,border .3s ease-in-out}.queueing__button:disabled{background-color:var(--main-color);border:1px solid rgba(255,255,255,.25)}.gameover{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#000000bf;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(15px);gap:25px;z-index:1000}.gameover__winner{font-size:24px;font-weight:400;margin-bottom:12px}.gameover__team{font-weight:900}.gameover__row{display:flex;align-items:center;gap:15px}.session{width:100%;display:flex;flex-direction:column;align-items:center;gap:20px;padding-bottom:15px}.session__wrapper{width:100%}.session__controls{display:flex;align-items:center;gap:25px}.not-found{width:100%;display:flex;flex-direction:column;gap:24px;align-items:center;justify-content:center;max-width:320px;margin:50px auto 0}.not-found__subtitle{font-size:18px;font-weight:900}.not-found__description{text-align:center;line-height:150%;font-size:14px;font-weight:400;letter-spacing:.25px}.notification{z-index:10000;position:fixed;overflow:hidden;top:40px;right:40px;padding:25px 30px;display:flex;flex-direction:column;gap:17px;color:var(--main-text-color);background-color:var(--main-color);border:4px solid var(--secondary-color);border-radius:10px;box-shadow:var(--shadow-red)}.notification__status-bar{position:absolute;top:0;left:0;display:inline-block;height:5px;background-color:var(--main-text-color)}.notification__header{display:flex;justify-content:space-between;align-items:center;gap:25px}.notification__title{font-size:20px;font-style:normal;font-weight:700;line-height:normal}.notification__close{cursor:pointer}#root{background-color:var(--main-color);min-height:100vh}.wrapper{position:relative;width:100%;height:100%}.container{display:flex;justify-content:center;align-items:center;max-width:920px;min-height:calc(100vh - 100px);margin:0 auto;color:var(--main-text-color);padding:76px 40px}.flex-center-column{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:48px}.flex-row-wrapper{display:flex;gap:20px;align-items:center;justify-content:space-between;width:100%}.flex-row-wrapper .button{flex:1 1;text-align:center}.flex-column-wrapper{display:flex;flex-direction:column;gap:20px;align-items:center;justify-content:center}.roles-wrapper{display:flex;flex-wrap:wrap;align-items:center;gap:48px;max-width:433px;-webkit-user-select:unset;user-select:unset}.stats{display:flex;flex-direction:column;align-items:center;gap:25px;justify-content:center;padding:0 10px}.stats__subtitle{font-size:32px;font-weight:700}.stats__winner{display:inline-block;padding:15px 25px;font-size:32px;font-style:normal;font-weight:900;border-radius:20px;border:2px solid var(--main-text-color)}.stats__winner--innocent{background-color:var(--secondary-color)}.stats__winner--mafia{background-color:var(--main-color)}.stats__list{margin:50px 0 25px;display:flex;flex-direction:column;gap:40px}.stats__list-item{display:flex;align-items:center;gap:48px;padding:25px;border-radius:20px;border:1px solid rgba(255,255,255,.25)}.stats__list-player{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:18px;font-weight:700}.stats__list-player img{width:118.5px;height:153.9px;object-fit:cover}.stats__list-description{display:flex;flex-direction:column;gap:15px;font-size:18px;font-style:normal;font-weight:400}.stats__strong{font-weight:900}html,body,div,span,object,iframe,figure,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,em,img,small,strike,strong,sub,sup,tt,b,u,i,ol,ul,li,fieldset,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,canvas,embed,footer,header,nav,section,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;text-size-adjust:none}footer,header,nav,section,main{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input{-webkit-appearance:none;border-radius:0}*,*:before,*:after{box-sizing:border-box}body,*{font-family:lato,sans-serif;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}a{text-decoration:none;color:inherit;font:inherit}button{border:none;outline:none;background:transparent;color:inherit;font:inherit}:root{--main-color: #2c2c2c;--main-color-transparent: rgba(44, 44, 44, 50%);--secondary-color: #b11f1f;--secondary-color-transparent: rgba(177, 31, 31, 35%);--third-color: rgba(255, 255, 255, .25);--main-text-color: #ffffff;--disabled-bg-color: #676767;--disabled-text-color: #b0b0b0;--shadow-white: 0px 0px 20px 0px rgba(255, 255, 255, .25);--shadow-red: 0px 0px 20px 0px rgba(177, 31, 31, .25);--shadow-white-hover: 0px 0px 20px 0px rgba(255, 255, 255, .75);--shadow-red-hover: 0px 0px 20px 0px rgba(177, 31, 31, .75)}@media screen and (max-width: 992px){.header{padding:15px;z-index:1000}.header__logo{font-size:14px;display:inline-block}.container{padding:30px 15px;min-height:calc(100vh - 72px)}.flex-center-column{gap:24px}.title{font-size:24px}.button{font-size:12px;padding:12.5px 20px}.description{text-align:justify;font-size:14px}.flex-row-wrapper{flex-direction:column;align-items:center;max-width:75%}.flex-row-wrapper .button{width:100%}.roles-wrapper{flex-direction:column}.roles-card{width:80%;height:100%}.roles-card__image{object-fit:cover}.roles-card__information{padding:25px;border:3.25px solid var(--main-text-color)}.roles-card__text{font-size:14px}.player-card{width:257.5px;height:335px}.player-card img{object-fit:cover}.notification{top:unset;bottom:5px;right:5px;left:5px;max-width:unset;gap:7px}.notification__header{gap:7px}.notification__title{font-size:14px}.game-desk__cards{justify-content:space-around;grid-template-rows:auto}.game-desk__cards--6,.game-desk__cards--12{grid-template-columns:repeat(3,118.5px)}.game-desk__cards--8{grid-template-columns:repeat(4,118.5px)}.game-desk__cards--10{grid-template-columns:repeat(3,118.5px)}.game-desk__cards--10 .game-desk__player:last-child{grid-column-start:2;grid-column-end:3}.game-desk__cards--11{grid-template-columns:repeat(3,118.5px);grid-template-rows:auto}.game-desk__cards--11 .game-desk__player:last-child{grid-column-start:auto;grid-column-end:auto}.penalty__point{padding:unset;width:25px;height:25px}}@media screen and (max-width: 700px){.timer{width:100%}.timer__clock span{font-size:80px}.session__controls{width:65%;flex-direction:column;align-items:stretch;text-align:center;gap:10px}}@media screen and (max-width: 470px){.timer__clock{margin-bottom:15px}.timer__clock svg{width:28px;height:36px;right:4%}.timer__clock svg path{opacity:.2;transition:opacity .3s ease-in-out;cursor:pointer}.timer__clock svg path:hover{opacity:.2}.timer__controls{margin:0 auto;width:210px;flex-wrap:wrap;justify-content:center;gap:10px}.timer__controls button{flex:40%}.game-desk{margin:0 auto;max-width:300px;justify-content:center}.game-desk__cards{justify-content:space-around}.game-desk__cards--6,.game-desk__cards--7,.game-desk__cards--8,.game-desk__cards--9,.game-desk__cards--10,.game-desk__cards--11,.game-desk__cards--12{grid-template-columns:repeat(2,118.5px);grid-template-rows:auto}.game-desk__cards--7 .game-desk__player:last-child,.game-desk__cards--9 .game-desk__player:last-child,.game-desk__cards--11 .game-desk__player:last-child{grid-column-start:1;grid-column-end:2}.queueing__players{gap:25px}.queueing__number{font-size:18px}.queueing__controls{max-width:135px}.queueing__count{font-size:18px}.queueing__button{width:30px;height:30px}.gameover{position:fixed;padding:0 25px;text-align:center;height:100vh;top:0;width:100vw;gap:15px}.gameover__winner{font-size:18px;line-height:150%;max-width:95%}.gameover__row{flex-direction:column}.stats{gap:15px}.stats__subtitle{font-size:18px}.stats__winner{font-size:18px;padding:10px 15px}.stats__list{margin:15px 0;gap:25px}.stats__list-item{gap:25px;padding:15px;border-radius:10px}.stats__list-player{font-size:14px}.stats__list-player img{width:94.8px;height:123.12px}.stats__list-description{font-size:14px;text-align:left;line-height:125%;gap:10px}}@media screen and (max-width: 375px){.timer__clock svg{right:0}}
