/* Neuriosity — Number Memory playfield.
   Shared chrome lives in ../_shared/game-kit.css */

.neu-digits {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(var(--gu) * 0.6);
  min-height: calc(var(--gu) * 18);
  padding: 0 calc(var(--gu) * 2);
  color: var(--navy, #062b63);
  font-size: calc(var(--gu) * 13);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: calc(var(--gu) * 0.3);
  line-height: 1;
}

.neu-digits--small { font-size: calc(var(--gu) * 8); }

.neu-digits__bar {
  width: min(100%, calc(var(--gu) * 60));
  height: calc(var(--gu) * 1.4);
  overflow: hidden;
  background: rgba(6, 43, 99, 0.12);
  border-radius: 999px;
}

.neu-digits__fill {
  width: 100%;
  height: 100%;
  background: var(--neu-accent, #13aa8b);
  border-radius: 999px;
  transform-origin: left center;
  transition: transform linear;
}

.neu-entry {
  display: flex;
  justify-content: center;
  gap: calc(var(--gu) * 1.4);
  width: min(100%, calc(var(--gu) * 66));
  margin-inline: auto;
}

.neu-entry input {
  flex: 1 1 auto;
  min-width: 0;
  height: calc(var(--gu) * 11);
  color: var(--navy, #062b63);
  font: inherit;
  font-size: calc(var(--gu) * 5.4);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-align: center;
  letter-spacing: calc(var(--gu) * 0.4);
  background: #fff;
  border: calc(var(--gu) * 0.3) solid rgba(6, 43, 99, 0.18);
  border-radius: calc(var(--gu) * 2.2);
}

.neu-entry input:focus-visible {
  outline: calc(var(--gu) * 0.5) solid var(--neu-accent, #13aa8b);
  outline-offset: calc(var(--gu) * 0.3);
}

.neu-recall { color: var(--ink-soft, #526b8e); font-size: calc(var(--gu) * 3); }
.neu-recall b { color: var(--coral, #f15f6d); }
.neu-recall s { color: var(--ink-soft, #526b8e); opacity: 0.75; }