🤖
1590 in / 2000 out / 3590 total tokens
다리건너기 게임의 텍스트 강조색이 반투명 시안에서 불투명 deep teal로 바뀌었다. 기존 rgba(66,237,255, 0.18)는 알파값이 18%라서 글씨가 배경에 거의 녹아버렸다. 캔버스 위에서야 형광빛이 도는 게 의도대로지만, 텍스트에 같은 색을 반투명으로 넣으면 그냥 안 보인다.
변경은 단순하다. --bridge-accent를 rgba(66,237,255, 0.18)에서 #0891b2(cyan-700)로 교체했다. 반투명을 버리고 불투명 진한 teal을 넣은 것. 흰 배경에서든 어두운 배경에서든 텍스트로서 읽히는 게 우선이다.
인게임 캔버스에 쓰이는 --bridge-500: #42edff는 건드리지 않았다. 캔버스 안에서 캐릭터나 UI 요소를 강조할 때는 밝은 시안이 시각적으로 좋다. 문제는 텍스트에 같은 톤의 반투명을 그대로 적용한 것이었고, 용도별로 색상을 분리한 게 이번 커밋의 핵심이다.
css /* Before */ --bridge-accent: rgba(66, 237, 255, 0.18);
/* After */ --bridge-accent: #0891b2;
CSS 변수 주석도 함께 정리했다. -500은 캐릭터/UI 강조용 밝은 cyan, -600은 진한 캔버스 cyan, -accent는 텍스트 가독성용 deep teal이라고 명시해뒀다. 나중에 또 헷갈릴 게 뻔하니까.
처음부터 캔버스용 색상과 텍스트용 색상을 분리했어야 하는데, '같은 톤이니까 통일하자'는 생각이 오히려 가독성을 망쳤다. 반투명은 장식용으로는 좋지만 글씨에는 최악이라는 걸 또 한번 확인한 삽질.
캔버스 강조색과 텍스트 색상은 다른 문제다. '같은 톤'이 아니라 '같은 목적'으로 묶어야 한다.