.saber{transform:rotate(135deg)}.pieces-drawer{display:flex;flex-direction:column;justify-content:stretch;align-items:center;height:100%}.pieces-drawer .pieces-drawer__player-label{height:50px;width:50px;font-weight:700;border-radius:32px;color:#fff;display:flex;justify-content:center;align-items:center;margin:16px}.pieces-drawer .pieces-drawer__player-label.pieces-drawer__player-label--disabled{background-color:#d3d3d3!important;color:grey}.pieces-drawer .info{height:30px;display:flex;justify-content:center;align-items:center;margin:12px 0;padding-left:8px;padding-right:8px}.pieces-drawer .info span{font-size:12px;font-weight:700}.pieces-drawer .info .back-button{background-color:#86bdd8}.pieces-drawer .selector{display:grid;grid-template-rows:repeat(4,1fr);height:min(100%,350px);width:min(100%,87px)}.pieces-drawer .selector .piece{display:flex;align-items:center;justify-content:center;cursor:pointer;width:100%;padding:12px 0}.pieces-drawer .selector .piece svg circle,.pieces-drawer .selector .piece svg line,.pieces-drawer .selector .piece svg rect{transition:stroke .25s}.pieces-drawer .selector .piece .el-badge__content{transition:background-color .25s}.pieces-drawer .selector .piece:hover{background-color:#d3d3d3}.pieces-drawer .selector .piece .north{transform:rotate(0deg)}.pieces-drawer .selector .piece .east{transform:rotate(90deg)}.pieces-drawer .selector .piece .south{transform:rotate(180deg)}.pieces-drawer .selector .piece .west{transform:rotate(270deg)}.pieces-drawer .selector .piece[disabled]{cursor:auto}.pieces-drawer .selector .piece[disabled]:hover{background-color:inherit}.pieces-drawer .selector .piece[disabled] svg circle,.pieces-drawer .selector .piece[disabled] svg line,.pieces-drawer .selector .piece[disabled] svg rect{stroke:#d3d3d3}.pieces-drawer .selector .piece[disabled] .el-badge__content{background-color:#d3d3d3!important}.pieces-drawer .selector .piece.piece--thinking svg circle,.pieces-drawer .selector .piece.piece--thinking svg line,.pieces-drawer .selector .piece.piece--thinking svg rect{stroke:silver}.pieces-drawer .selector .piece.piece--thinking .el-badge__content{background-color:silver!important}.pieces-drawer .selector .piece .el-badge--infinity .el-badge__content{font-size:20px;line-height:14px}.info-overlay .message{margin:16px 0}.mb-input{border:none;border-bottom:1px solid #2f4858}.mb-input input,.mb-input textarea{font-family:inherit;border:none;color:#2f4858;background-color:#86bdd8}.mb-input input::-moz-placeholder,.mb-input textarea::-moz-placeholder{color:rgba(51,101,138,.5)}.mb-input input:-ms-input-placeholder,.mb-input textarea:-ms-input-placeholder{color:rgba(51,101,138,.5)}.mb-input input::placeholder,.mb-input textarea::placeholder{color:rgba(51,101,138,.5)}.info-overlay{position:absolute;top:0;left:0;width:100vw;height:100vh;overflow-y:scroll;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:rgba(0,0,0,.7);color:#fff;z-index:1000;padding:16px}.info-overlay .title{font-size:32px;font-weight:700}.info-overlay .message{margin:8px 0 16px 0;min-width:400px}.info-overlay .message .label{margin:8px 0;font-weight:500}.info-overlay .actions{display:flex;flex-direction:column}.info-overlay .actions .mb-button{margin:4px 0}@media screen and (min-width:768px){.info-overlay .actions{flex-direction:row}.info-overlay .actions .mb-button{margin:0 4px}}.nav-bar{background-color:#86bdd8;color:#2f4858;display:flex;flex-direction:column;justify-content:space-between}.nav-bar .nav-bar__icon{height:32px;width:32px;border-radius:32px;margin-top:12px}@media screen and (min-width:1050px){.nav-bar .nav-bar__icon{height:64px;width:64px;border-radius:64px;margin:12px}}.nav-bar .nav-bar__title{font-size:24px;font-weight:500;display:none}@media screen and (min-width:1050px){.nav-bar .nav-bar__title{display:block}}.nav-bar .nav-bar__group{margin:12px;display:grid;grid-template-columns:44px;grid-template-rows:1fr;cursor:pointer}@media screen and (min-width:1050px){.nav-bar .nav-bar__group{grid-template-columns:44px -webkit-max-content;grid-template-columns:44px max-content}}.nav-bar .nav-bar__group .nav-bar__item{display:contents}.nav-bar .nav-bar__group .nav-bar__item:not([disabled=disabled]):hover{background-color:#2f4858;color:#86bdd8}.nav-bar .nav-bar__group .nav-bar__item[disabled=disabled]{color:grey!important;cursor:auto}.nav-bar .nav-bar__group .nav-bar__item .nav-bar-item__icon{padding:8px 0;background-color:inherit;border-radius:32px}@media screen and (min-width:1050px){.nav-bar .nav-bar__group .nav-bar__item .nav-bar-item__icon{border-radius:32px 0 0 32px}}.nav-bar .nav-bar__group .nav-bar__item .nav-bar-item__text{display:none;border-radius:0 32px 32px 0;padding:8px 12px;background-color:inherit;text-align:left;font-size:14px;font-weight:500}@media screen and (min-width:1050px){.nav-bar .nav-bar__group .nav-bar__item .nav-bar-item__text{display:block}}.turn-your-screen{position:absolute;top:0;left:0;height:100vh;width:100vw;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#2f4858;background-color:#86bdd8}.turn-your-screen i{font-size:2em;font-weight:700}.rules-container{position:fixed;z-index:2000;height:100vh;width:100vw;top:0;left:0;background-color:#86bdd8;color:#2f4858}.rules-container .rules__header{height:56px;font-size:32px;padding:8px}.rules-container .rules__header .close{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;height:48px;width:48px;font-size:32px;cursor:pointer;padding:16px}.rules-container .rules{height:calc(100vh - 48px);width:100vw;overflow-y:scroll;padding:12px}.rules-container .rules .rule{margin:12px 0;display:flex;flex-direction:row;align-items:center}@media screen and (min-width:900px){.rules-container .rules .rule{margin:12px 20%}}.rules-container .rules .rule .rule__image{height:256px;width:256px;background-color:grey;flex-shrink:0;flex-grow:0;border-radius:32px}.rules-container .rules .rule .rule__explanation{flex-grow:1;padding:12px 24px;display:flex;flex-direction:column}.rules-container .rules .rule .rule__explanation .explanation__title{font-size:24px;font-weight:700;text-align:start}.rules-container .rules .rule .rule__explanation .explanation__message{margin-top:8px;font-size:16px;text-align:start}.rules-container .rules .rule .types-of-mirrors{display:grid;grid-template-columns:auto fit-content(320px);grid-column-gap:16px}.rules-container .rules .rule .types-of-mirrors .type{text-align:right;font-weight:500}.rules-container .rules .rule .types-of-mirrors .explanation{text-align:left}.rules-container .rules .btn-play{margin-bottom:16px}.board{display:flex;flex-direction:row;align-items:center;justify-content:center}.board .nav-bar{flex:1 0 max(64px,calc(44px + env(safe-area-inset-left)));height:100vh;padding-left:calc(env(safe-area-inset-left) - 20px)}@media screen and (min-width:1050px){.board .nav-bar{flex:1 0 160px}}.board .content{flex:1 1 100%;overflow:scroll;overflow:visible;display:flex;flex-direction:row;justify-content:center;align-items:center}.board .content .grid{display:grid;grid-template-rows:repeat(7,50px);grid-template-columns:repeat(11,50px);width:550px;height:350px;margin:0 20px;border-top:1px solid #86bdd8;border-left:1px solid #86bdd8;position:relative}@media screen and (min-width:1050px){.board .content .grid{grid-template-rows:repeat(7,75px);grid-template-columns:repeat(11,75px);min-width:825px;min-height:525px}}.board .content .grid .emitter{position:absolute;top:-50px;left:calc(50% - 25px);z-index:20;height:50px;width:50px}.board .content .grid .player-a{left:-15px;transform:rotateY(180deg)}.board .content .grid .player-a,.board .content .grid .player-b{position:absolute;top:calc(50% - 25px);z-index:20;height:50px;width:15px}.board .content .grid .player-b{right:-15px}.board .content .grid .grid__square{border-right:0 dashed #86bdd8;border-bottom:0 dashed #86bdd8;position:relative;z-index:2}.board .content .grid .grid__square:nth-of-type(odd){background-color:rgba(134,189,216,.1)}.board .content .grid .grid__square .north{transform:rotate(0deg)}.board .content .grid .grid__square.wall__north{border-top:1px solid #86bdd8}.board .content .grid .grid__square .east{transform:rotate(90deg)}.board .content .grid .grid__square.wall__east{border-right:1px solid #86bdd8}.board .content .grid .grid__square .south{transform:rotate(180deg)}.board .content .grid .grid__square.wall__south{border-bottom:1px solid #86bdd8}.board .content .grid .grid__square .west{transform:rotate(270deg)}.board .content .grid .grid__square.wall__west{border-left:1px solid #86bdd8}.board .content .grid .grid__square.grid__square--selectable{cursor:pointer}.board .content .grid .grid__square.grid__square--highlighted{z-index:0;background-color:gold;-webkit-animation-name:flashing;animation-name:flashing;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.board .content .grid .grid__square .destroyed-leave-active{-webkit-animation:destroying 3s;animation:destroying 3s}.board .content .grid .laser-beam{background-color:red;position:absolute;-webkit-animation-name:perturbations;animation-name:perturbations;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.board .content .pieces{height:350px;width:115px}@media screen and (min-width:1050px){.board .content .pieces{height:525px;width:150px}}@-webkit-keyframes perturbations{0%{box-shadow:none}50%{box-shadow:0 0 1px 0 rgba(255,0,0,.8);transform:translate(1px,1px)}to{box-shadow:none}}@keyframes perturbations{0%{box-shadow:none}50%{box-shadow:0 0 1px 0 rgba(255,0,0,.8);transform:translate(1px,1px)}to{box-shadow:none}}@-webkit-keyframes flashing{0%{background-color:gold}50%{background-color:rgba(255,215,0,.8)}to{background-color:gold}}@keyframes flashing{0%{background-color:gold}50%{background-color:rgba(255,215,0,.8)}to{background-color:gold}}@-webkit-keyframes destroying{0%{opacity:1;filter:blur(1px);color:red}20%{opacity:1;filter:blur(2px);color:red}40%{opacity:.8;filter:blur(4px);color:red}to{opacity:.2;filter:blur(8px);color:red}}@keyframes destroying{0%{opacity:1;filter:blur(1px);color:red}20%{opacity:1;filter:blur(2px);color:red}40%{opacity:.8;filter:blur(4px);color:red}to{opacity:.2;filter:blur(8px);color:red}}.flip-enter{transform:rotateY(180deg)}.flip-leave{transform:rotateY(0deg)}.flip-enter-active{position:absolute;top:0;right:0;z-index:1000}.flip-enter-active,.flip-leave-active{transition:transform 10s}.flip-enter-to{transform:rotateY(0)}.flip-leave-to{transform:rotateY(180deg)}.setup-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background-color:#86bbd8;padding:16px}.setup-page .title{margin:16px 0}.setup-page .back{position:fixed;top:0;left:0;margin-top:16px;margin-left:16px;font-size:18px;font-weight:700;display:flex;align-items:center;cursor:pointer;font-color:#2f4858}.setup-page .back:hover span{text-decoration:underline}.setup-page .content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:3.33rem}.setup-page .content>*{margin:4px 0}@media screen and (min-width:768px){.setup-page .content{flex-direction:row}.setup-page .content>*{margin:0 4px}}.launch-game{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background-color:#86bbd8}.launch-game .back{position:fixed;top:0;left:0;margin-top:16px;margin-left:16px;font-size:18px;font-weight:700;display:flex;align-items:center;cursor:pointer;font-color:#2f4858}.launch-game .back:hover span{text-decoration:underline}.launch-game .offline-mode{width:80vw}@media screen and (min-width:768px){.launch-game .offline-mode{width:350px}}.launch-game .offline-mode .player{display:flex;align-items:center;justify-content:center}.launch-game .offline-mode .player .color-bubble{flex:0 0 16px;height:16px;border-radius:16px}.launch-game .offline-mode .player .color-bubble.left-player{background-color:#33658a}.launch-game .offline-mode .player .color-bubble.right-player{background-color:#f6ae2d}.launch-game .offline-mode .player span{flex:1 0 100px;margin:0 8px;font-weight:700}.online-create .online-create__content{display:flex;flex-direction:column;align-items:center}.online-create .online-create__content>*{margin:4px 0}.online-create .online-create__content .start-button{margin:16px 0}.online-create .online-create__content .share-link>*{margin:4px}.online-create .online-create__content .attribute-name{font-weight:700;margin-right:4px}.online-create .code{width:15em}.online-join .online-join__content{display:flex;flex-direction:column;align-items:center}.online-join .online-join__content .start-button{margin:16px 0}.online-join .online-join__content .share-link>*{margin:4px}.online-join .code{width:15em}.waiting-room .content{display:flex;flex-direction:column}.waiting-room .content .share{margin-top:8px}.waiting-room .content .share .attribute-name{font-weight:700}.waiting-room .content .share>*{margin:4px}.waiting-room .content .share .share-link{display:flex;flex-direction:row}.waiting-room .content .share .share-link>*{margin:4px}.waiting-room .content .share .share-link .code{width:15em}.waiting-room .content .share .feedback{font-size:12px;visibility:hidden}.waiting-room .content .share .feedback.feedback--visible{visibility:visible}.waiting-room .content .join .attribute-name{font-weight:700}.waiting-room .content .join>*{margin:4px}