/* ═══════════════════════════════════════════════════════════
   누른 자국 (SSoT 104) — 2026-08-19 김대표
     "지난 일정 접기 줄에 파란 테두리가 남아 있다"

   왜 있나
     `outline:none` 규칙이 **입력칸에만** 있고 버튼에는 없었다.
     그래서 앱 전체 버튼 521개가 누르면 브라우저 기본 파란 테두리를 남긴다.
     지금까지 안 띈 것은 대부분 누르자마자 화면이 바뀌었기 때문이고,
     [접기/펼치기] 는 **그 자리에 남아서** 드러났다.

   ⚠️ button:focus{outline:none} 으로 하면 안 된다
     키보드(Tab)로 다니는 사람이 지금 어디 있는지 못 본다.
     :focus-visible 은 **키보드로 왔을 때만** 보여주고
     손가락·마우스로 누를 땐 안 보여준다.

   ⚠️ 왜 app.css 에 안 넣었나
     app.css 에는 :root 토큰과 다크모드 블록이 통째로 들어 있다.
     지금 6개 화면에만 붙어 있는데, 나머지 10개에 붙이면 각 화면 색을 덮을 수 있다.
     초점 규칙만 담은 **작은 파일**로 나눠 겹칠 것을 0 으로 만든다.
   ═══════════════════════════════════════════════════════════ */

button:focus:not(:focus-visible),
[role="button"]:focus:not(:focus-visible),
summary:focus:not(:focus-visible) { outline: none; }

button:focus-visible,
[role="button"]:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--primary, #3182F6);
  outline-offset: 2px;
  border-radius: inherit;
}