릴리스: v1.3.85 모바일 열 헤더/행 라벨 보정

docs/history.md

@@ -2,6 +2,8 @@
 
 ## 2026-04-02 v1.3.83
 - 모바일에서 열 헤더가 칸과 시각적으로 분리되는 문제는 전체 레이아웃을 다시 갈아엎기보다, 각 칸 안에 열 이름 배지를 같이 보여주는 편이 가장 적은 변경으로 효과를 낸다고 정리했다.
+- 배지를 쓰는 반응형 구간에서는 기존 상단 열 헤더까지 남겨두면 중복 정보가 되므로, 같은 브레이크포인트에서 헤더는 숨기고 칸 배지 하나만 남기는 편이 맞다고 정리했다.
+- 반응형 보정은 한 미디어 구간 안에서 서로 다른 규칙이 다시 덮어쓰지 않게 정리해야 하므로, 모바일용 `1fr` 레이아웃을 선언한 뒤 예전 `140px/150px` 규칙은 제거하는 편이 맞다고 판단했다.
 
 ## 2026-04-02 v1.3.82
 - 프리뷰 완성본도 결국 공유/열람용 결과물이므로, 이미지 다운로드 결과와 같은 작성자/저장 시각 메타를 같이 보여주는 편이 자연스럽다고 정리했다.

docs/todo.md

@@ -2,6 +2,8 @@
 
 ## 단기 확인
 - 티어표 편집/프리뷰 모바일 열 배지는 새로 붙였으므로, 실제 좁은 화면에서 칸 상단 배지와 아이템 썸네일이 겹치지 않고 열 구분이 자연스러운지 한 번 더 QA한다.
+- 모바일 열 배지는 같은 구간에서 상단 열 제목을 숨기도록 다시 맞췄으므로, 720px 안팎뿐 아니라 980px 이하 전 구간에서 중복 표기 없이 자연스러운지 한 번 더 QA한다.
+- 모바일 티어표 편집 레이아웃은 행 라벨 폭을 다시 덮어쓰던 규칙을 걷어냈으므로, 실제 980px 이하 구간에서 행 라벨이 과하게 넓지 않고 칸 폭을 충분히 남기는지 한 번 더 QA한다.
 - 프리뷰 완성본 하단 메타는 새로 붙였으므로, 작성자/저장 시각이 공개 열람 화면과 이미지 다운로드 결과 기준에서 모두 자연스럽게 읽히는지 한 번 더 QA한다.
 - 관리자 템플릿 요청 카드는 썸네일 클릭이 새창 열기 역할로 바뀌었으므로, 썸네일 클릭과 `확인하기` 액션이 서로 헷갈리지 않는지 한 번 더 QA한다.
 - 티어표 만들기 화면의 `공유하기`는 저장된 티어표에서만 노출되므로, 저장 직후/수정 중/복사본/읽기 전용 상태 각각에서 노출 조건과 클립보드 복사가 자연스러운지 한 번 더 QA한다.

docs/update.md

@@ -3,6 +3,8 @@
 ## 2026-04-02 v1.3.83
 - 티어표 편집/프리뷰 화면에서 열을 여러 개 쓰는 경우, 모바일처럼 좁은 화면에서는 기존 상단 열 헤더만으로 각 칸의 의미를 읽기 어려웠으므로 각 칸 상단에 작은 열 이름 배지를 추가함.
 - 이 배지는 모바일 구간에서만 보이고 데스크톱 레이아웃은 그대로 유지되므로, 작은 화면에서는 `메인 / 밸런스 / 서포트` 같은 열 맥락을 스크롤 중에도 잃지 않게 정리함.
+- 이후 배지가 칸 기준이 아니라 화면 한쪽에 겹치던 문제를 바로잡기 위해 각 칸을 기준점으로 다시 잡았고, 배지가 보이는 구간에서는 기존 상단 열 제목을 함께 숨겨 중복 표기를 제거함.
+- 추가로 같은 미디어 구간 안에서 행/열 모바일 레이아웃을 다시 `140px/150px`로 덮어쓰던 중복 규칙을 제거해, 모바일에서는 행 라벨이 화면 절반을 차지하지 않고 실제로 한 줄 전체 폭 기준 레이아웃으로 정리되게 맞춤.
 
 ## 2026-04-02 v1.3.82
 - 프리뷰 전용 완성본 화면에도 이미지 다운로드 결과와 같은 하단 메타를 붙여, 작성자 이름과 마지막 저장 시각을 바로 확인할 수 있게 정리함.

frontend/src/views/TierEditorView.vue

@@ -1509,6 +1509,7 @@ onUnmounted(() => {
   border: 1px solid var(--theme-border-strong);
 }
 .previewOnly__drop {
+  position: relative;
   border-radius: 14px;
   background: var(--theme-pill-bg);
   border: 1px solid var(--theme-border);
@@ -2497,54 +2498,13 @@ onUnmounted(() => {
   border-radius: 14px;
 }
 @media (max-width: 980px) {
-  .previewOnly__row {
-    grid-template-columns: 140px 1fr;
-  }
-  .heroCard {
-    grid-template-columns: 1fr;
-  }
-  .editorCanvas {
-    grid-template-columns: 1fr;
-  }
-  .row__content {
-    grid-template-columns: 1fr;
-  }
+  .previewOnly__row,
   .row {
-    grid-template-columns: 150px 1fr;
-  }
-  .sidebar {
-    position: static;
-  }
-  .pool {
-    grid-template-columns: repeat(6, minmax(0, 1fr));
-    gap: 8px;
-  }
-  .editorSidebar__actionGrid {
     grid-template-columns: 1fr;
   }
-  .editorSidebar__utilityLinks {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-  .requestChecklist__item {
-    grid-template-columns: 1fr;
-  }
-  .requestChecklist__icon {
-    text-align: left;
-  }
-  .modalCard__actions .btn {
-    width: 100%;
-  }
-}
-@media (max-width: 720px) {
-  .previewOnly {
-    padding: 14px;
-  }
   .previewOnly__columns,
-  .previewOnly__row,
-  .boardColumnsHeader,
-  .row {
-    grid-template-columns: 1fr;
+  .boardColumnsHeader {
+    display: none;
   }
   .previewOnly__columnsSpacer,
   .boardColumnsHeader__spacer {
@@ -2578,6 +2538,43 @@ onUnmounted(() => {
     overflow: hidden;
     text-overflow: ellipsis;
   }
+  .heroCard {
+    grid-template-columns: 1fr;
+  }
+  .editorCanvas {
+    grid-template-columns: 1fr;
+  }
+  .row__content {
+    grid-template-columns: 1fr;
+  }
+  .sidebar {
+    position: static;
+  }
+  .pool {
+    grid-template-columns: repeat(6, minmax(0, 1fr));
+    gap: 8px;
+  }
+  .editorSidebar__actionGrid {
+    grid-template-columns: 1fr;
+  }
+  .editorSidebar__utilityLinks {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+  .requestChecklist__item {
+    grid-template-columns: 1fr;
+  }
+  .requestChecklist__icon {
+    text-align: left;
+  }
+  .modalCard__actions .btn {
+    width: 100%;
+  }
+}
+@media (max-width: 720px) {
+  .previewOnly {
+    padding: 14px;
+  }
   .pool {
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }