.rwb [hidden]{display:none!important}
.rwb output{display:block;min-height:0;margin:8px 0;font-size:1rem}
.rwb-note{margin:8px 0;font-weight:600}
.rwb-progress{display:block;width:100%;height:12px;margin:8px 0}
.rwb input[type=range]{width:100%;min-height:44px;padding:0;margin:0}
.rwb input[type=color]{min-height:44px;min-width:64px}
.rwb .calc-fields .rwb-check{display:flex;flex-direction:row;align-items:center;gap:8px;min-height:44px}
.rwb-check input{width:24px;height:24px;flex:none}
.rwb-stage{margin:16px 0;line-height:0}
.rwb-stage canvas{display:block;width:100%;max-width:900px;height:auto;margin:0 auto;border:1px solid #ccd5df;border-radius:8px;background-color:#fff;background-image:linear-gradient(45deg,#cfd6dd 25%,transparent 25%,transparent 75%,#cfd6dd 75%),linear-gradient(45deg,#cfd6dd 25%,transparent 25%,transparent 75%,#cfd6dd 75%);background-size:20px 20px;background-position:0 0,10px 10px}
.rwb-stage[data-backdrop=black] canvas{background:#000}
.rwb-stage[data-backdrop=colour] canvas{background:var(--rwb-colour)}
.rwb-stage[data-picking] canvas{cursor:crosshair}
.rwb button{min-height:44px}
/* Two columns squeeze the long mode names on a phone; one column keeps them readable. */
@media(max-width:600px){.rwb .calc-fields{grid-template-columns:1fr}}
