motsu0

@charset "utf-8";
.ImageSelector{
  display: inline-flex;
  position: relative;
  box-sizing: border-box;
  border: 1px solid #777;
  background-color: #fff;
  cursor: pointer;
}
.ImageSelector__display,.ImageSelector__preview,.ImageSelector__preview-child{

motsu0

#players-input {
  box-sizing: border-box;
  width: 100%;
  max-width: 600px;
  height: 200px;
  padding: 4px;
  resize: vertical;
}
#pair-select {
  height: 2em;

motsu0

.sample-img {
  width: 200px;
}
/*  */
.settings {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  align-items: center;
}

motsu0

.settings {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px;
  border-bottom: 1px dashed #555;
}
.number-input {
  width: 100px;
  padding: 0 2px;

motsu0

button{
  cursor: pointer;
}
#bt-area{
  margin: 10px 0;
  text-align: right;
}
#display-box,.timer{
  padding: 10px;
}

motsu0

.s-highlight{
  background-color:yellow;
}
.s-hide{
  display: none;
}

motsu0

.settings {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 20px;
  margin: 12px 0;
}
.settings-table {
  border-collapse: collapse;
}

motsu0

const width_canvas = 400;
const height_canvas = 214;

motsu0

<div id="demo1">
  <img src="pathto/sign1.png" alt="交通標識" class="ImageSelector__option" data-value="1">
  <img src="pathto/sign2.png" alt="交通標識" class="ImageSelector__option" data-value="2">
  <img src="pathto/sign3.png" alt="交通標識" class="ImageSelector__option" data-value="3">
  <img src="pathto/sign4.png" alt="交通標識" class="ImageSelector__option" data-value="4">
  <img src="pathto/sign5.png" alt="交通標識" class="ImageSelector__option" data-value="5">
  <img src="pathto/sign6.png" alt="交通標識" class="ImageSelector__option" data-value="6">
  <img src="pathto/sign7.png" alt="交通標識" class="ImageSelector__option" data-value="7">
  <img src="pathto/sign8.png" alt="交通標識" class="ImageSelector__option" data-value="8">
  <img src="pathto/sign9.png" alt="交通標識" class="ImageSelector__option" data-value="9">

motsu0

@charset "utf-8";
.simpleDialog_s-fix{
  overflow: hidden;
}
.simpleDialog_bg{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;