/* Adjustments for the English text, which runs longer than the Japanese original. */
.home-rules { display: block; margin: 10px auto 0; }
.brand-en { letter-spacing: .16em; }
.hand-status { line-height: 1.4; }
.reservation-state { white-space: normal; }

/* Corner labels (5m, 3p, E…) for players who don't read the characters. */
.tile { container-type: inline-size; }
.tile-labels .tile[data-label]::before {
  content: attr(data-label);
  position: absolute;
  top: 1px;
  left: 2px;
  z-index: 1;
  font: 800 max(6.5px, 22cqw)/1 ui-sans-serif, system-ui, sans-serif;
  letter-spacing: -.02em;
  color: #5b2b20;
  background: #f6f3e7e6; box-shadow: 0 0 0 1px #f6f3e7e6;
  border-radius: 2px;
  padding: 0 1px;
  pointer-events: none;
}
.tile-labels .tile[data-t^="p"]::before { color: #1d3c7a; }
.tile-labels .tile[data-t^="s"]::before { color: #1f5a2c; }
.tile-labels .tile[data-t^="z"]::before { color: #333; }

/* The white dragon is a blank tile in this set; give it the usual blue frame so it doesn't look missing. */
.tile[data-t="z5"] img { box-sizing: border-box; border: max(1.5px, 5cqw) solid #4c7bb8; border-radius: 8%; transform: scale(.62, .66); }
.settings-content .hand-preferences { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.settings-content .hand-preferences .switch-label { padding: 0; }