/* 타이핑 속도 테스트 전용 스타일 (공통 패널/통계/결과 UI는 assets/css/common.css 참고) */

.typing-app {
  margin-top: 1rem;
}

.sentence-display {
  font-size: 1.35rem;
  line-height: 1.9;
  letter-spacing: 0.01em;
  padding: 1.2rem;
  border-radius: var(--radius);
  background: var(--bg);
  border: 1px solid var(--border);
  margin-bottom: 1rem;
  word-break: break-word;
  min-height: 3.8em;
}

.sentence-display .char {
  border-radius: 3px;
  transition: background 0.05s ease;
}

.sentence-display .char.correct {
  color: var(--correct);
}

.sentence-display .char.incorrect {
  color: var(--incorrect);
  background: var(--incorrect-bg);
  text-decoration: underline;
  text-decoration-color: var(--incorrect);
}

.sentence-display .char.current {
  background: rgba(74, 108, 247, 0.22);
  outline: 2px solid var(--accent);
  outline-offset: -1px;
}

.sentence-display .char.pending {
  color: var(--fg-muted);
}

.typing-input {
  width: 100%;
  font-size: 1.1rem;
  font-family: inherit;
  padding: 0.9rem 1rem;
  border-radius: var(--radius);
  border: 1.5px solid var(--border);
  background: var(--bg);
  color: var(--fg);
  resize: none;
  outline: none;
  transition: border-color 0.15s ease;
}

.typing-input:focus {
  border-color: var(--accent);
}

/* ---------- 모바일 반응형 ---------- */
@media (max-width: 480px) {
  .sentence-display {
    font-size: 1.1rem;
    padding: 0.9rem;
    line-height: 1.75;
  }

  .typing-input {
    font-size: 16px; /* iOS 자동 확대 방지 */
  }
}