.odd-one-out-stage { padding: clamp(20px, 3vw, 38px); }
.odd-start { width: min(520px, 100%); }
.odd-start > div { width: 100%; }

.odd-start__pattern {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 28px;
}

.odd-start__pattern svg {
  width: 76px;
  padding: 8px;
  color: var(--gold);
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(4, 18, 12, 0.66);
}

.odd-start__pattern svg:nth-child(2) { transform: rotate(90deg); }
.odd-start__pattern svg:nth-child(3) { transform: rotate(210deg); }
.odd-start h2 { margin-top: 16px; }

.odd-difficulty {
  display: grid;
  gap: 9px;
  margin: 0 auto 18px;
  max-width: 400px;
  color: var(--gold);
  font-size: 12px;
  text-align: left;
}

.odd-difficulty select {
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  color: var(--text);
  background: #0a1c13;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}

.odd-start .odd-rules { max-width: 400px; font-size: 12px; }
.odd-game { width: min(720px, 100%); gap: 14px; }
.odd-game__topline p { text-align: center; font-weight: 500; }
.odd-game__topline span { white-space: nowrap; }

.odd-countdown {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
}

.odd-countdown strong { color: var(--gold); font-size: 16px; font-variant-numeric: tabular-nums; }

.odd-timer {
  grid-column: 1 / -1;
  height: 4px;
  overflow: hidden;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.08);
}

.odd-timer i {
  display: block;
  height: 100%;
  background: var(--gold);
  transform-origin: left;
  transition: transform 100ms linear;
}

.odd-game.is-urgent .odd-countdown strong { color: #f09a91; }
.odd-game.is-urgent .odd-timer i { background: var(--red); }

.odd-grid {
  width: 100%;
  gap: clamp(3px, 0.65vw, 8px);
  grid-template-columns: repeat(var(--odd-grid-size), minmax(0, 1fr));
}

.odd-cell {
  aspect-ratio: 1;
  padding: 3%;
  overflow: hidden;
  border-radius: clamp(6px, 1vw, 12px);
  color: var(--gold);
}

.odd-symbol {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  background: none;
  filter: none;
}

.odd-cell:hover:not(:disabled) { transform: none; background: rgba(234, 215, 167, 0.07); }
.odd-cell.is-correct { transform: none; }
.odd-cell.is-revealed { border: 2px solid var(--gold); background: rgba(234, 215, 167, 0.13); }
.odd-cell:focus-visible, .odd-difficulty select:focus-visible { outline: 2px solid var(--gold-strong); outline-offset: 2px; }
.odd-game .brain-feedback { width: 100%; min-height: 36px; text-align: center; font-size: 13px; line-height: 1.5; }
.odd-result__time { color: var(--muted); font-size: 13px; }

@media (max-width: 760px) {
  .odd-one-out-stage { padding: 24px 12px; }
  .odd-game__topline { gap: 8px; font-size: 11px; }
  .odd-one-out-page .brain-stat { min-width: 0; }
}

@media (max-width: 460px) {
  .odd-one-out-page .brain-nav__games { font-size: 11px; }
  .odd-one-out-page .brain-nav__games::after { content: none; }
}

@media (max-width: 360px) {
  .odd-one-out-page .brain-nav__games { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .odd-cell, .odd-timer i { transition: none; }
}
