/* Scoped styles for the existing Sudoku React bundle. */
.ba-sudoku{--background-color:#fff;--color-blue:#2c8ff2;--color-grey:#344860;--color-grey-light:#7793b6;--color-grey-lighter:#b9c8da;--color-orange:#eae4dc;--color-orange-dark:#f8e6ce}
.ba-sudoku #root *{box-sizing:border-box;margin:0;padding:0}
.ba-sudoku #root{background:#fff;background:var(--background-color);color:#2c8ff2;color:var(--color-blue);font-family:"Montserrat",sans-serif;line-height:1.4em;font-weight:300}
.ba-sudoku #root .container{max-width:700px;min-width:270px;margin:0 auto;padding:0 10px}
.ba-sudoku #root .header__group-one{color:#2c8ff2;color:var(--color-blue)}
.ba-sudoku #root .header__group-two{color:#7793b6;color:var(--color-grey-light)}
.ba-sudoku #root .header h2{float:right;font-size:18px;font-weight:400;line-height:2;color:#344860;color:var(--color-grey);padding-top:16px;cursor:pointer}
.ba-sudoku #root .header h2:hover{text-shadow:0 2px 4px rgba(0,0,0,.2)}
.ba-sudoku #root .header:after{content:"";display:block;clear:both}
.ba-sudoku #root .innercontainer{display:-webkit-flex;display:flex;color:#344860;color:var(--color-grey);-webkit-flex-wrap:wrap;flex-wrap:wrap;padding:0 20px}
.ba-sudoku #root .game{width:70%}
.ba-sudoku #root .game__board{font-family:"Montserrat",sans-serif;font-size:26px;margin:30px 0;border:2px solid #344860;border:2px solid var(--color-grey);border-collapse:collapse}
.ba-sudoku #root .game__row:nth-child(3n){border-bottom:2px solid #344860;border-bottom:2px solid var(--color-grey)}
.ba-sudoku #root .game__cell{border:1px solid #b9c8da;border:1px solid var(--color-grey-lighter);padding:12px 16px;color:#fff;color:var(--background-color);cursor:pointer}
.ba-sudoku #root .game__cell.game__cell--filled{color:#344860;color:var(--color-grey)}
.ba-sudoku #root .game__cell.game__cell--userfilled{color:#7793b6;color:var(--color-grey-light)}
.ba-sudoku #root .game__cell.game__cell--selected{color:#eae4dc;color:var(--color-orange);background-color:#eae4dc;background-color:var(--color-orange)}
.ba-sudoku #root .game__cell.game__cell--filled.game__cell--selected{color:#344860;color:var(--color-grey);background-color:#eae4dc;background-color:var(--color-orange)}
.ba-sudoku #root .game__cell.game__cell--userfilled.game__cell--selected{color:#7793b6;color:var(--color-grey-light);background-color:#eae4dc;background-color:var(--color-orange)}
.ba-sudoku #root .game__cell.game__cell--highlightselected{color:#f8e6ce;color:var(--color-orange-dark);background-color:#f8e6ce;background-color:var(--color-orange-dark)}
.ba-sudoku #root .game__cell.game__cell--filled.game__cell--highlightselected{color:#344860;color:var(--color-grey);background-color:#f8e6ce;background-color:var(--color-orange-dark)}
.ba-sudoku #root .game__cell.game__cell--userfilled.game__cell--highlightselected{color:#7793b6;color:var(--color-grey-light);background-color:#f8e6ce;background-color:var(--color-orange-dark)}
.ba-sudoku #root .game__cell:nth-child(3n){border-right:2px solid #344860;border-right:2px solid var(--color-grey)}
.ba-sudoku #root .status{width:30%}
.ba-sudoku #root .status__difficulty{position:relative;top:39px;left:20px}
.ba-sudoku #root .status__difficulty-text{font-size:16px;font-weight:600;line-height:2}
.ba-sudoku #root .status__difficulty-select{display:inline-block;border:none;-webkit-appearance:none;appearance:none;padding-left:10px;padding-right:30px;font-size:14px;font-weight:600;line-height:2;background-color:#fff;background-color:var(--background-color);background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:right .7em top 50%,0 0;background-size:.65em auto,100%}
.ba-sudoku #root .status__difficulty-select,.ba-sudoku #root .status__time{position:relative;color:#7793b6;color:var(--color-grey-light)}
.ba-sudoku #root .status__time{top:70px;left:10px;text-align:center;font-family:"Teko",sans-serif;font-size:30px;line-height:1.5;letter-spacing:.2em;background-color:#eae4dc;background-color:var(--color-orange);padding-top:4px;margin:0 30px}
.ba-sudoku #root .status__numbers{display:grid;grid-template-columns:repeat(3,1fr);position:relative;top:93px;left:10px}
.ba-sudoku #root .status__number{text-align:center;font-family:"Montserrat",sans-serif;font-size:26px;padding:12px 0;cursor:pointer}
.ba-sudoku #root .status__number.status__number--selected{color:#2c8ff2;color:var(--color-blue)}
.ba-sudoku #root .status__actions{position:relative;top:100px;left:10px;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}
.ba-sudoku #root .status__action-erase,.ba-sudoku #root .status__action-fast-mode,.ba-sudoku #root .status__action-hint,.ba-sudoku #root .status__action-mistakes-mode,.ba-sudoku #root .status__action-undo{text-align:center;position:relative}
.ba-sudoku #root .status__action-erase,.ba-sudoku #root .status__action-hint,.ba-sudoku #root .status__action-undo{width:33.33%;cursor:pointer}
.ba-sudoku #root .status__action-mistakes-mode{width:60%}
.ba-sudoku #root .status__action-fast-mode{width:40%}
.ba-sudoku #root .status__action-fast-mode-switch,.ba-sudoku #root .status__action-mistakes-mode-switch,.ba-sudoku #root .status__action-svg{position:absolute;left:50%;-webkit-transform:translate(-50%);transform:translate(-50%)}
.ba-sudoku #root .status__action-undo .status__action-svg{top:18px;width:38%;height:38%}
.ba-sudoku #root .status__action-erase .status__action-svg{top:20px;width:32%;height:32%}
.ba-sudoku #root .status__action-hint .status__action-svg{top:11px;width:48%;height:48%}
.ba-sudoku #root .status__action-fast-mode-switch,.ba-sudoku #root .status__action-mistakes-mode-switch{top:16px;display:inline-block;width:46px;height:26px}
.ba-sudoku #root .status__action-text{font-size:16px;font-weight:600;line-height:1.2;padding-top:50px}
.ba-sudoku #root .status__action-fast-mode-switch input,.ba-sudoku #root .status__action-mistakes-mode-switch input{opacity:0;width:0;height:0}
.ba-sudoku #root .status__action-fast-mode-slider,.ba-sudoku #root .status__action-mistakes-mode-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#b9c8da;background-color:var(--color-grey-lighter);border-radius:26px;transition:.4s}
.ba-sudoku #root .status__action-fast-mode-slider:before,.ba-sudoku #root .status__action-mistakes-mode-slider:before{position:absolute;content:"";height:20px;width:20px;left:3px;bottom:3px;background-color:#fff;background-color:var(--background-color);border-radius:50%;transition:.4s}
.ba-sudoku #root input:checked+.status__action-fast-mode-slider,.ba-sudoku #root input:checked+.status__action-mistakes-mode-slider{background-color:#2c8ff2;background-color:var(--color-blue)}
.ba-sudoku #root input:focus+.status__action-fast-mode-slider,.ba-sudoku #root input:focus+.status__action-mistakes-mode-slider{box-shadow:0 0 1px #2c8ff2;box-shadow:0 0 1px var(--color-blue)}
.ba-sudoku #root input:checked+.status__action-fast-mode-slider:before,.ba-sudoku #root input:checked+.status__action-mistakes-mode-slider:before{-webkit-transform:translateX(20px);transform:translateX(20px)}
.ba-sudoku #root .overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);z-index:2;cursor:pointer}
.ba-sudoku #root .overlay--visible{display:block}
.ba-sudoku #root .overlay__text{position:absolute;width:100%;text-align:center;top:50%;left:50%;font-family:"Montserrat",sans-serif;font-size:60px;font-weight:600;color:#eae4dc;color:var(--color-orange);text-shadow:0 2px 4px rgba(0,0,0,.2),0 10px 20px rgba(0,0,0,.25);-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}
.ba-sudoku #root .overlay__textspan1{color:#b9c8da;color:var(--color-grey-lighter)}
.ba-sudoku #root .overlay__textspan2{color:#2c8ff2;color:var(--color-blue)}
.ba-sudoku #root .blur{-webkit-filter:blur(2px);-moz-filter:blur(2px);-o-filter:blur(2px);-ms-filter:blur(2px);filter:blur(2px)}
@media screen and (max-width:670px){.ba-sudoku #root .innercontainer{max-width:500px;margin:0 auto}
.ba-sudoku #root .game,.ba-sudoku #root .status{width:100%;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}
.ba-sudoku #root .game__board{width:100%}
.ba-sudoku #root .game__cell{text-align:center}
.ba-sudoku #root .status__difficulty{top:-18px;left:0;width:70%}
.ba-sudoku #root .status__time{top:-20px;left:0;width:30%;margin:0;background-color:#fff;background-color:var(--background-color);text-align:right;font-size:22px}
.ba-sudoku #root .status__numbers{top:-10px;left:0;width:100%;grid-template-columns:repeat(9,1fr);background-color:#eae4dc;background-color:var(--color-orange)}
.ba-sudoku #root .status__number{padding:12px 0}
.ba-sudoku #root .status__actions{top:0;left:0;width:100%}
.ba-sudoku #root .status__action-erase,.ba-sudoku #root .status__action-hint,.ba-sudoku #root .status__action-undo{width:16.66%}
.ba-sudoku #root .status__action-mistakes-mode{width:30%}
.ba-sudoku #root .status__action-fast-mode{width:20%}}
@media screen and (max-width:500px){.ba-sudoku #root .game__cell,.ba-sudoku #root .status__number{font-size:18px;padding:8px 0}
.ba-sudoku #root .status__action-text{font-size:14px}
.ba-sudoku #root .overlay__text{font-size:50px}}
@media screen and (max-width:350px){.ba-sudoku #root .game__cell,.ba-sudoku #root .status__number{font-size:16px;padding:4px 0}
.ba-sudoku #root .status__action-erase,.ba-sudoku #root .status__action-hint,.ba-sudoku #root .status__action-undo{width:33%}
.ba-sudoku #root .status__action-mistakes-mode{width:60%}
.ba-sudoku #root .status__action-fast-mode{width:40%}
.ba-sudoku #root .overlay__text{font-size:40px}}
@media screen and (max-width:300px){.ba-sudoku #root .game__cell,.ba-sudoku #root .status__number{font-size:14px;padding:2px 0}
.ba-sudoku #root .status__difficulty-text{display:none}
.ba-sudoku #root .status__difficulty-select{padding-left:0;margin-top:3px}
.ba-sudoku #root .overlay__text{font-size:30px}}
