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 #000;background:none;outline:none;unicode-bidi:bidi-override;direction:rtl}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:#fff0}header .view .view-icon span{display:inline-flex;width:24px;height:24px;fill:#000}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}.pieces{display:grid;grid-template-columns:repeat(1,1fr);grid-gap:8px}.pieces .piece{display:inline-flex;border:1px solid #000;border-radius:8px;align-items:center;justify-content:center;padding:0}.pieces .piece:focus-within{border:3px solid #EA4C89}.pieces .piece .dividend{display:inline-flex;align-items:center;justify-content:space-around;padding:0}.pieces .piece .dividend .rests{display:none}.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 .spans .value{min-width:50px;text-align:center}.pieces .piece .spans span.separator{background:#000;width:3px;display:block;padding:0;height:100%}.pieces .piece .totals{display:inline-flex;align-items:center;justify-content:space-around;padding:0}.vertical.pieces{grid-template-columns:repeat(2,1fr)}.vertical.pieces .piece{flex-direction:row;position:relative;align-items:flex-start}.vertical.pieces .piece .dividend .value,.vertical.pieces .piece .dividend input,.vertical.pieces .piece .divider .value,.vertical.pieces .piece .divider input{text-align:left;min-width:60px;font-size:28px;height:34px;width:100%}.vertical.pieces .piece .dividend{flex-direction:column;position:relative}.vertical.pieces .piece .dividend :nth-child(1){border-bottom:2px solid #fff0}.vertical.pieces .piece .dividend .rests{display:inline-flex;align-items:flex-end;justify-content:space-around;padding:0;flex-direction:column}.vertical.pieces .piece .dividend .rests input{width:100%;text-align:left;direction:ltr;display:block}.vertical.pieces .piece .dividend .rests .rest_1{width:calc(100% - 16px);min-width:0}.vertical.pieces .piece .dividend .rests .rest_2{width:calc(100% - 32px);min-width:0}.vertical.pieces .piece .dividend .rests .rest_3{width:calc(100% - 48px);min-width:0}.vertical.pieces .piece .dividend .rests .rest_4{width:calc(100% - 64px);min-width:0}.vertical.pieces .piece .dividend .rests .rest_5{width:calc(100% - 80px);min-width:0}.vertical.pieces .piece :nth-child(2){display:none}.vertical.pieces .piece .divider :nth-child(1){border-bottom:2px solid;border-left:2px solid}.vertical.pieces .piece input{border-bottom:0;margin:0}.vertical.pieces .piece .divider{display:inline-flex;flex-direction:column;position:relative;align-items:flex-start}.vertical.pieces .piece .divider span{width:100%;text-align:left}.vertical.pieces .piece .divider input{direction:ltr;text-align:left;width:100%}@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{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)}}