/* 100-cell grid: screen and print */
.g100t { border-collapse: collapse; font-family: var(--f-m); table-layout: fixed; }
.g100t th, .g100t td { border: 1.5px solid var(--ink); text-align: center; vertical-align: middle; padding: 0; position: relative; }
.g100t th { background: var(--chip); font-weight: 600; }
.g100t th.op { background: var(--sun); }
.g100t.play, .g100t.screen { --cell: min(calc((100vw - 2.5rem) / var(--n)), calc((100dvh - 23.75rem) / var(--n)), 3.625rem); }
@media (min-width: 700px) and (min-aspect-ratio: 5/4) { .g100t.play { --cell: min(calc((100vw - 420px) / var(--n)), calc((100dvh - 110px) / var(--n)), 64px); } }
.g100t.play th, .g100t.play td, .g100t.screen th, .g100t.screen td { width: var(--cell); height: var(--cell); min-width: 1.5rem; min-height: 1.5rem; font-size: max(.8125rem, calc(var(--cell) * .48)); }
.g100t.screen { --cell: min(calc((100vw - 4rem) / var(--n)), 2.75rem); }
.g100t .cur { background: #FFF6D8; box-shadow: inset 0 0 0 .1875rem var(--ink); }
.g100t th.hl { background: var(--sun); }
.g100t td.done { color: var(--ink2); }
.g100t td.wrong { color: var(--ink); }
.g100t .fixnum { position: absolute; right: 2px; top: 1px; font: 700 max(.625rem, calc(var(--cell) * .3))/1 var(--f-h); color: var(--tom); }
.g100t .ring.o { left: 4% !important; top: 4% !important; width: 92% !important; height: 92% !important; }
.g100t .ring.ck { left: 48% !important; top: 30% !important; width: 58% !important; height: 58% !important; }
.g100t .ring path { stroke-width: 6; }
.g100 { display: grid; place-items: center; }
@media print {
  .g100t.print { --cell: min(calc((var(--pw) - 30mm) / var(--n)), calc((var(--ph) - 85mm) / var(--n)), 17mm); margin: 2mm auto 0; }
  .g100t.print th, .g100t.print td { width: var(--cell); height: var(--cell); font-size: calc(var(--cell) * .42); border: .35mm solid #263049; }
  .g100t.print th { background: #F1F4FA; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .g100t.print th.op { background: #FFE8A3; }
  .g100t.print .sh-ans { color: #C0392B; }
}