/* Companai 3 checkbox and radio: custom drawn, same markup (input[type=checkbox]). */
input[type=checkbox],input[type=radio]{appearance:none;-webkit-appearance:none;width:18px;height:18px;margin:0;flex:none;display:inline-grid;place-content:center;cursor:pointer;
  background:var(--surface2);box-shadow:0 0 0 1px var(--edge-strong);transition:background var(--t-fast),box-shadow var(--t-fast)}
input[type=checkbox]{border-radius:6px}
input[type=radio]{border-radius:50%}
input[type=checkbox]:hover,input[type=radio]:hover{box-shadow:0 0 0 1px var(--acc-line)}
input[type=checkbox]:checked,input[type=radio]:checked{background:var(--acc);box-shadow:0 0 12px -2px var(--acc)}
input[type=checkbox]:checked:after{content:"";width:9px;height:5px;border:2px solid var(--on-acc);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px);animation:pop var(--t) var(--ease)}
input[type=radio]:checked:after{content:"";width:6px;height:6px;border-radius:50%;background:var(--on-acc)}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:none;box-shadow:var(--glow-ring)}
input[type=checkbox]:disabled,input[type=radio]:disabled{opacity:.45;cursor:not-allowed}
@keyframes pop{from{opacity:0;transform:scale(.8)}}