/* 缶けり固有のスタイル（共通部分は assets/css/game.css） */

.hud {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 8px;
  min-height: 2.2em;
}
.timer {
  font-size: 1.4rem; font-weight: 900;
  background: #fff;
  border: 3px solid var(--ink);
  border-radius: 10px;
  padding: 0 12px;
  font-variant-numeric: tabular-nums;
}
.timer.hurry { color: var(--red); animation: pop 0.5s ease-out infinite alternate; }
.message { font-weight: 900; font-size: clamp(1rem, 3.6vw, 1.3rem); }
.message.alert { color: var(--red); }

.field-wrap {
  position: relative;
  border: 3px solid var(--ink);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  background: #d9b676;
}
.field {
  display: block;
  width: 100%;
  aspect-ratio: 900 / 600;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.big-text {
  position: absolute; left: 0; right: 0; top: 38%;
  text-align: center;
  font-size: clamp(2rem, 8vw, 4rem);
  font-weight: 900;
  color: #fff;
  text-shadow: 3px 3px 0 var(--ink), -1px -1px 0 var(--ink), 1px -1px 0 var(--ink), -1px 1px 0 var(--ink);
  pointer-events: none;
}
.big-text.show { animation: pop 0.3s ease-out; }
.big-text.red { color: var(--red); }
.big-text.yellow { color: var(--yellow); }
.status { text-align: center; font-weight: 700; color: var(--ink-soft); min-height: 1.4em; }
.choices .extreme { background: #3b2a1e; color: #fff; }
.choices input:checked + .extreme { background: var(--red); color: #fff; }