section {margin-top: 8px;}select, input {border: none;width: 60px;font-family: 'Courier New', monospace;font-weight: 600;font-size: 26px;height: 26px;text-align: center;padding: 0;border-bottom: 2px solid black;background: none;outline: none;unicode-bidi:bidi-override;}header {display: flex;justify-content: space-between;}header .view {width: 80px;display: flex;justify-content: space-around;}header .view .view-icon {padding: 0;background-color: transparent;}header .view .view-icon span {display: inline-flex;width: 24px;height: 24px;fill: black;}header .view .view-icon.selected span {fill: #EA4C89;}header .content-sound label{width: 32px;height: 32px;display: block;background-size: 32px;background-image: url(.././icons/sound_on.png);}header .content-sound input[type="checkbox"] {display: none;}header .content-sound input[type="checkbox"]:checked~label{background-image: url(.././icons/sound_off.png);}.nav {display: inline-flex;justify-content: space-between;align-items: center;}.nav .content-inputs {font-size: 2rem;display: flex;justify-content: space-between;flex-direction: column;}.nav .content-inputs .content-inputs-select{display: flex;flex-direction: row;justify-content: center;align-items: center;}.nav .content-inputs input {max-width: 20px;}.pieces {display: flex;align-items: center;flex-direction: column;}.pieces .piece{display: inline-flex;border-bottom: 1px solid black;align-items: center;justify-content: space-around;padding: 0;height: 46px;}.pieces .piece:focus-within {border: 3px solid #EA4C89;}.pieces .piece span{color: #EA4C89;font-family: 'Courier New', monospace;font-weight: 600;font-size: 26px;height: 26px;}.pieces .piece input {margin: 8px 0;}.pieces .piece input:focus {border-bottom: 2px solid #EA4C89;}.pieces .piece input.ko {border-bottom: 2px solid red;color: red;}.pieces .piece input.ok {border-bottom: 2px solid darkgreen;color: darkgreen;}.pieces .piece .value {width: 50px;text-align: center;}.pieces .piece span.separator {background: black;width: 3px;display: block;padding: 0;height: 100%;}.vertical.pieces {grid-template-columns: repeat(2,1fr);}.vertical.pieces .piece {flex-direction: column;position: relative;}.vertical.pieces .piece :nth-child(2) {position: absolute;left: calc(50% - 45px);top: 15px;}.vertical.pieces .piece .value, .vertical.pieces .piece input {text-align: right;width: 60px;font-size: 28px;}.vertical.pieces .piece :nth-child(4) {display: none;}.vertical.pieces .piece :nth-child(5) {border-top: 2px solid black;}.vertical.pieces .piece input {border-bottom: 0;margin: 0;}@media only screen and (min-width: 768px) {.pieces {grid-template-columns: repeat(3,1fr);}.vertical.pieces {grid-template-columns: repeat(6,1fr);}}@media only screen and (min-width: 1024px) {body {font-size: 48px;}select, input {width: 90px;font-size: 38px;height: 42px;}header .content-sound label{width: 48px;height: 48px;background-size: 48px;}.pieces .piece span{height: 42px;font-size: 38px;}.pieces .piece .value {width: 70px;}.pieces {grid-template-columns: repeat(3,1fr);}.vertical.pieces .piece .value, .vertical.pieces .piece input {width: 90px;}.vertical.pieces .piece :nth-child(2) {left: calc(50% - 50px);}}