.number-setup-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 1.2fr) minmax(0, 1fr); gap: 18px; align-items: end; margin-bottom: 26px; }
.operations-field { margin: 0; padding: 0; border: 0; }
.operations-field legend { margin-bottom: 8px; }
.operation-options { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.operation-options input { position: absolute; opacity: 0; pointer-events: none; }
.operation-options span { display: grid; min-height: 50px; place-items: center; color: var(--purple); border: 2px solid var(--border); border-radius: 14px; background: white; font-size: 1.7rem; font-weight: 900; cursor: pointer; transition: .18s ease; }
.operation-options input:checked + span { color: white; border-color: var(--purple); background: var(--purple); box-shadow: 0 7px 14px rgba(108,92,231,.24); transform: translateY(-2px); }
.operation-options input:focus-visible + span { outline: 3px solid var(--yellow); outline-offset: 2px; }

.accounts-game-screen { min-height: calc(100vh - 80px); }
.accounts-question-card { width: min(760px, 100%); padding: clamp(22px, 4vw, 40px); }
.accounts-question { overflow-wrap: anywhere; font-size: clamp(2.8rem, 9vw, 5.7rem); }
.answer-display { width: min(500px, 100%); min-height: 72px; margin: 24px auto 0; overflow: hidden; padding: 12px 20px; color: var(--purple); border: 3px solid var(--border); border-radius: 18px; background: #faf9ff; font-size: clamp(2rem, 6vw, 3.2rem); font-weight: 900; line-height: 1.15; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.answer-display.empty { color: #aaa5bc; }
.accounts-question-card.correct-card .answer-display { color: #176654; border-color: var(--mint); background: rgba(255,255,255,.65); }
.accounts-question-card.wrong-card .answer-display { color: #9b2634; border-color: var(--red); background: rgba(255,255,255,.65); }

.number-pad { display: grid; grid-template-columns: repeat(3, minmax(80px, 130px)); gap: 10px; justify-content: center; width: min(520px, 100%); margin: 18px auto 0; }
.number-pad button { min-height: 58px; color: var(--ink); border: 2px solid var(--border); border-radius: 16px; background: white; box-shadow: 0 6px 14px rgba(67,49,134,.08); font-size: 1.55rem; font-weight: 900; cursor: pointer; transition: .14s ease; }
.number-pad button:hover { color: var(--purple); border-color: var(--purple); transform: translateY(-2px); }
.number-pad button:active { transform: translateY(1px) scale(.98); }
.number-pad button:disabled { cursor: default; opacity: .55; transform: none; }
.number-pad .pad-action { min-height: 52px; font-size: 1rem; }
.number-pad .clear-key { color: #9b2634; background: #fff1f3; }
.number-pad .backspace-key { color: var(--purple); background: #f1edff; font-size: 1.5rem; }
.number-pad .submit-key { color: white; border-color: var(--purple); background: linear-gradient(135deg, var(--purple), var(--purple-dark)); }

@media (max-width: 720px) {
  .number-setup-grid { grid-template-columns: 1fr; align-items: stretch; }
  .accounts-question-card { padding: 20px 14px; }
  .accounts-question { font-size: clamp(2.2rem, 11vw, 4rem); }
  .answer-display { min-height: 60px; margin-top: 16px; font-size: 2rem; }
  .number-pad { grid-template-columns: repeat(3, minmax(70px, 1fr)); gap: 8px; }
  .number-pad button { min-height: 54px; }
}
