/* 케어뷰.3DX_v1.0 — 「케어 모드」 메뉴 (2026-09-02)
   ⚠ 3DX v1.0 의 기존 스타일을 **덮지 않습니다.** `cv3cm-` 로만 시작합니다.
      이 파일과 스크립트 두 줄을 지우면 원래대로 돌아갑니다. */
.cv3cm-btn {
  display: inline-flex !important; align-items: center; gap: 6px;
  width: auto !important; padding: 0 12px !important; margin-left: 10px;
  font-weight: 700; white-space: nowrap;
}
.cv3cm-ic { font-size: 12px; opacity: .8; }
.cv3cm-c { font-size: 10px; opacity: .7; transition: transform .18s ease; }
.cv3cm-btn[aria-expanded="true"] .cv3cm-c { transform: rotate(180deg); }
.cv3cm-bd { position: fixed; inset: 0; z-index: 9600; background: transparent; }
.cv3cm-panel {
  position: fixed; z-index: 9601; max-height: 78vh; overflow-y: auto;
  background: #12161c; color: #e8edf4;
  border: 1px solid rgba(255,255,255,.14); border-radius: 14px;
  box-shadow: 0 18px 48px rgba(0,0,0,.5);
}
.cv3cm-in { padding: 6px; }
.cv3cm-top { display: flex; align-items: center; padding: 10px 10px 8px; font-size: 14px; }
.cv3cm-x {
  margin-left: auto; width: 28px; height: 28px; border-radius: 8px; cursor: pointer;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
  color: #e8edf4; font-size: 13px;
}
.cv3cm-sec { padding: 4px 0 8px; }
.cv3cm-sl {
  margin: 8px 10px 6px; font-size: 11px; font-weight: 800; letter-spacing: .02em;
  color: #9fb0c4; text-transform: none;
}
.cv3cm-sl em { display: block; font-style: normal; font-weight: 500; font-size: 10.5px;
  color: #6f8296; margin-top: 2px; }
.cv3cm-it {
  display: flex; align-items: center; gap: 9px; padding: 10px 11px; margin: 0 4px 3px;
  border-radius: 10px; text-decoration: none; color: #e8edf4; cursor: pointer;
  border: 1px solid transparent;
}
.cv3cm-it:hover { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.12); }
.cv3cm-it b { font-size: 13.5px; font-weight: 700; flex: none; }
.cv3cm-it small { font-size: 10.5px; color: #8b9db1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv3cm-it i {
  margin-left: auto; flex: none; font-style: normal; font-size: 10px; font-weight: 800;
  padding: 3px 8px; border-radius: 999px;
  background: rgba(120,200,255,.16); color: #8fd0ff;
}
/*  지금 보고 계신 화면 — **누를 수 없게**. 눌러도 아무 일 없으면 고장으로 읽힙니다. */
.cv3cm-it.is-here { cursor: default; opacity: .62; }
.cv3cm-it.is-here:hover { background: transparent; border-color: transparent; }
.cv3cm-it.is-here i { background: rgba(255,255,255,.08); color: #9fb0c4; }
.cv3cm-foot { margin: 8px 10px 6px; font-size: 10.5px; line-height: 1.6; color: #6f8296; }
.cv3cm-foot b { color: #8b9db1; }

/*  2026-09-03 — 「가정용」은 이제 **이 화면 안에서** 열립니다(주소 안 바뀜).
    ⚠ 그래서 `<a>` 가 아니라 `<button>` 입니다. 단추는 브라우저 기본 스타일
       (배경·테두리·글꼴·가운데 정렬)을 갖고 있어, 옆의 `<a>` 와 나란히 두면
       혼자 다르게 보입니다. 여기서 벗겨 맞춥니다. */
button.cv3cm-it {
  width: calc(100% - 8px); font: inherit; text-align: left;
  background: transparent; appearance: none; -webkit-appearance: none;
}
button.cv3cm-it:focus-visible { outline: 2px solid #5b8cff; outline-offset: 1px; }

/*  2026-09-03 — 지금 보고 있는 쪽도 **누를 수 있습니다.**
    못 누르게 두었더니 대표님이 그걸 누르시고 「전환이 안 된다」 하셨습니다.
    ⚠ 회색으로 죽이지 않습니다 — 죽은 것처럼 보이면 또 «고장» 으로 읽힙니다.
       체크 표시와 옅은 바탕으로 «지금 여기» 만 알립니다. */
.cv3cm-it.is-here { background: rgba(255,255,255,.07); }
.cv3cm-it.is-here i { background: rgba(160,255,200,.16); color: #8fe3b6; }
.cv3cm-it.is-here:hover { background: rgba(255,255,255,.12); }