diff --git a/docs/sw/sw-header-design-spec.md b/docs/sw/sw-header-design-spec.md
index 3970b6e..ad1aa00 100644
--- a/docs/sw/sw-header-design-spec.md
+++ b/docs/sw/sw-header-design-spec.md
@@ -266,19 +266,21 @@ Figma Plugin API로 26:8944와 메뉴 8개·문서·레이어 Component Set의 
 | `--hm-sw-header-hover-border-gradient` | 180deg `#A67D03` 0% → `#F2CC0F` 16.41% → `#FADD4F` 37.19% → `#F2CC0F` 62.03% → `#926E03` 87.88% | Figma `header/btn_home` hover 테두리(26:10655) |
 | `--hm-sw-header-document-background` | 사용자 확정 180deg gradient(§10 B) | 사용자 확정 = Figma 동일 |
 | `--hm-sw-header-object-background` | 사용자 확정 0deg gradient(§10 A) | 사용자 확정 = Figma 동일 |
+| `--hm-sw-header-document-border-gradient` | 180deg `#0E4C3A` 0% → `#041611` 13.73% → `#041611` 89.51% → `#18503F` 100% | Figma 26:10374 Rectangle 6671 Stroke(Plugin API, 2026-10-23) |
+| `--hm-sw-header-object-border-gradient` | 180deg `#135643` 0% → `#0E3D2F` 13.57% → `#34DAAA` 37.06% → `#08241C` 80.5% → `#1F5E4B` 100% | Figma 26:10375 Rectangle 7428 Stroke(Plugin API, 2026-10-23) |
 | `--hm-sw-header-property-background` | 사용자 확정 반투명 검정 gradient(§10 C) | 사용자 확정 = Figma 동일 |
 | `--hm-sw-header-pill-background` | `rgba(0,0,0,0.8)` | Figma `Rectangle 6959` |
 | `--hm-sw-header-stripe-color` | `rgba(28,106,81,0.32)` | Figma 창 이동 줄무늬 |
 | `--hm-sw-header-window-icon-color` | `#ADB0AF` | Figma 최소화 막대 |
 
-창 영역(`Rectangle 6669`)과 인쇄 버튼은 파일명 gradient·테두리를 Figma 그대로 재사용합니다.
+창 영역(`Rectangle 6669`)과 인쇄 버튼은 파일명 면 gradient와 단색 테두리(`--hm-sw-header-document-border-color`)를 재사용합니다. 파일명 면 자체의 gradient Stroke(`-document-border-gradient`)는 쓰지 않습니다.
 
 ## 8. Border · Radius · Shadow
 
 | 면 | Border | Radius | Shadow |
 |---|---|---|---|
-| 파일명 | 위·오른쪽·아래 1px `#0E4C3A`, 왼쪽 0 | 0 | none |
-| 객체 수정 | 1px `#135643` | 6px | none |
+| 파일명 | 위·오른쪽·아래 1px 세로 gradient Stroke(`--hm-sw-header-document-border-gradient`), 왼쪽 0 | 0 | none |
+| 객체 수정 | 1px 세로 gradient Stroke(`--hm-sw-header-object-border-gradient`, `#34DAAA` 하이라이트) | 6px | none |
 | 속성 필드(5개 메뉴, 더보기 버튼) | 1px `#08251C` | 3px | `0 1px 4px 0 rgba(9,39,30,.7)` |
 | 창 영역 | 1px `#0E4C3A`(4면, pseudo) | 0 | none |
 | 인쇄·가이드 pill | 1px `#092920` | 4px | inset `0 2px 2px rgba(0,0,0,.25)` |
@@ -334,23 +336,27 @@ SW Header는 여러 SW 프로그램이 공통으로 사용합니다. 따라서 *
 
 | 기존 뷰어 class | 신규 class | 토큰 |
 |---|---|---|
-| A `.cad-toolbar-object-area` | `.hm-sw-header__object-area` | `--hm-sw-header-object-background`, `-object-border-color`, `-object-radius` |
-| B `.cad-toolbar-document` | `.hm-sw-header__document` | `--hm-sw-header-document-background`, `-document-border-color` |
+| A `.cad-toolbar-object-area` | `.hm-sw-header__object-area` | `--hm-sw-header-object-background`, `-object-border-gradient`(2026-10-23, 이전 `-object-border-color`), `-object-radius` |
+| B `.cad-toolbar-document` | `.hm-sw-header__document` | `--hm-sw-header-document-background`, `-document-border-gradient`(2026-10-23, 이전 `-document-border-color`) |
 | C `.cad-toolbar-property-field` | `.hm-sw-header__field` | `--hm-sw-header-property-background`, `-property-border-color`, `-property-radius`, `-property-shadow` |
 
 ```css
-/* A. 객체 수정 */
-border-radius: 6px; border: 1px solid #135643; box-shadow: none;
-background: linear-gradient(0deg, #144838 0%, #1A4536 6%, #1F4134 10%, #10392D 18%, #296B55 72%, #1F5A47 83%, #144838 92%, #124133 100%);
-/* B. 파일명 */
-border-radius: 0; border-top/right/bottom: 1px solid #0E4C3A; border-left: 0; box-shadow: none;
-background: linear-gradient(180deg, #081813 0%, #09271E 8.69%, #0B3227 25.43%, #0E3D2F 51.25%, #0B3227 80.03%, #0A2B21 89.76%, #081813 100%);
+/* A. 객체 수정 — 테두리: 2026-10-23 Figma gradient Stroke (아래 참고) */
+border-radius: 6px; border: 1px solid transparent; box-shadow: none;
+background: linear-gradient(0deg, #144838 0%, #1A4536 6%, #1F4134 10%, #10392D 18%, #296B55 72%, #1F5A47 83%, #144838 92%, #124133 100%) padding-box,
+  linear-gradient(180deg, #135643 0%, #0E3D2F 13.57%, #34DAAA 37.06%, #08241C 80.5%, #1F5E4B 100%) border-box;
+/* B. 파일명 — 테두리: 2026-10-23 Figma gradient Stroke (아래 참고) */
+border-radius: 0; border-top/right/bottom: 1px solid transparent; border-left: 0; box-shadow: none;
+background: linear-gradient(180deg, #081813 0%, #09271E 8.69%, #0B3227 25.43%, #0E3D2F 51.25%, #0B3227 80.03%, #0A2B21 89.76%, #081813 100%) padding-box,
+  linear-gradient(180deg, #0E4C3A 0%, #041611 13.73%, #041611 89.51%, #18503F 100%) border-box;
 /* C. 속성 입력 */
 border-radius: 3px; border: 1px solid #08251C; box-shadow: 0 1px 4px 0 rgba(9, 39, 30, 0.70);
 background: linear-gradient(0deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.45) 26.41%, rgba(0,0,0,.40) 70%, rgba(0,0,0,.45) 100%);
 ```
 
-세 값은 Figma `get_design_context`의 해당 레이어 값과도 일치합니다(Figma 26.407% → 확정 26.41%). C의 반투명 검정은 A 위에서 합성되는 것이 의도입니다.
+면(fill) 값은 Figma `get_design_context`의 해당 레이어 값과도 일치합니다(Figma 26.407% → 확정 26.41%). C의 반투명 검정은 A 위에서 합성되는 것이 의도입니다.
+
+**테두리 갱신(2026-10-23, 사용자 승인).** 이전 확정값 A `1px solid #135643`, B `1px solid #0E4C3A`는 `get_design_context`가 gradient Stroke를 첫 색 하나로 줄여 보여준 값이었습니다. Plugin API로 읽은 실제 Stroke는 두 면 모두 INSIDE 세로 linear gradient입니다(B: 4-stop, 위·오른쪽·아래 1px, 왼쪽 0 / A: 5-stop `#34DAAA` 하이라이트, 4면 1px, radius 6). 1px 테두리를 투명으로 남기고 Stroke를 border-box 배경 층으로 그리므로 두께·위치·radius·padding·글자 위치는 그대로입니다. 단색 토큰 `-document-border-color`·`-object-border-color`는 호환성과 홈 뒤 면·창 영역·인쇄 버튼·메뉴의 단색 선에 계속 씁니다(파일명 면·객체 수정 면에는 쓰지 않음). Figma에는 Open 배치가 없어, Open 뒤 파일명의 왼쪽 가장자리도 Figma처럼 Stroke 없이 둡니다(2px 간격만).
 
 ## 11. 선택 · Focus · Hover · Disabled
 
@@ -567,8 +573,10 @@ Composed Controls의 기존 레이어·색상·상세보기 예제는 보존하
 | `--hm-sw-header-layer-icon-hover-background` | `rgba(0,0,0,.25)` | 전구 Hover(눈꽃·자물쇠는 Hover SVG) |
 | `--hm-sw-header-layer-chip-border-color` | `#C9C9C9` | 레이어 색상 견본 테두리 |
 | `--hm-sw-header-layer-footer-border-color` / `-layer-detail-background` / `-layer-detail-color` / `-layer-detail-text-opacity` | `rgba(197,177,158,.15)` / `rgba(197,177,158,.15)` / `#FFF` / .35 | 레이어 상세 영역·버튼 |
-| `--hm-sw-header-document-background` / `-document-border-color` | §10 B / `#0E4C3A` | 파일명, 홈 뒤, 창 영역, 인쇄 버튼 |
-| `--hm-sw-header-object-background` / `-object-border-color` / `-object-radius` | §10 A / `#135643` / 6px | 객체 수정 면, 더보기 메뉴 테두리 |
+| `--hm-sw-header-document-background` / `-document-border-color` | §10 B / `#0E4C3A` | 파일명 면, 홈 뒤, 창 영역, 인쇄 버튼(단색 선: 홈 뒤·창 영역) |
+| `--hm-sw-header-document-border-gradient` | §7 | 파일명 면 테두리(SW Header·Viewer, Open 면 포함) |
+| `--hm-sw-header-object-background` / `-object-border-color` / `-object-radius` | §10 A / `#135643` / 6px | 객체 수정 면, 더보기 메뉴 테두리(단색) |
+| `--hm-sw-header-object-border-gradient` | §7 | 객체 수정 면 테두리(SW Header·Viewer, Viewer 끝 둥근 면 포함) |
 | `--hm-sw-header-property-background` / `-property-border-color` / `-property-radius` / `-property-shadow` | §10 C / `#08251C` / 3px / §10 C | 5개 필드, 더보기 버튼 |
 | `--hm-sw-header-pill-background` / `-pill-border-color` | `rgba(0,0,0,.8)` / `#092920` | 인쇄·가이드 pill |
 | `--hm-sw-header-stripe-color` | `rgba(28,106,81,.32)` | 창 이동 줄무늬 |
diff --git a/packages/sw/ai/DESIGN_RULES.md b/packages/sw/ai/DESIGN_RULES.md
index 1c563fa..0bb1db3 100644
--- a/packages/sw/ai/DESIGN_RULES.md
+++ b/packages/sw/ai/DESIGN_RULES.md
@@ -29,8 +29,8 @@
 | 기본 글자 / 제목 | `#F6F4F2` / `#F0F7F5` | `--hm-sw-header-text-color` / `--hm-sw-header-title-color` |
 | Selected·On·Hover 글자 | `#FFC600` | `--hm-sw-header-selected-color` |
 | 화살표 | `#47AF91` | `--hm-sw-header-arrow-color` |
-| 파일명 면 | 세로 gradient, 테두리 `#0E4C3A` | `--hm-sw-header-document-background`, `--hm-sw-header-document-border-color` |
-| 객체 수정 면 | gradient, 테두리 `#135643`, radius 6px | `--hm-sw-header-object-background`, `-object-border-color`, `-object-radius` |
+| 파일명 면 | 세로 gradient 면, 위·오른쪽·아래 1px 세로 gradient 테두리 `linear-gradient(180deg, #0E4C3A 0%, #041611 13.73%, #041611 89.51%, #18503F 100%)` | `--hm-sw-header-document-background`, `--hm-sw-header-document-border-gradient`(단색 `--hm-sw-header-document-border-color` `#0E4C3A`는 호환·단색 선용) |
+| 객체 수정 면 | gradient 면, 1px 세로 gradient 테두리 `linear-gradient(180deg, #135643 0%, #0E3D2F 13.57%, #34DAAA 37.06%, #08241C 80.5%, #1F5E4B 100%)`, radius 6px | `--hm-sw-header-object-background`, `-object-border-gradient`, `-object-radius`(단색 `-object-border-color` `#135643`은 호환·메뉴 테두리용) |
 | 속성 필드 면 | 검정 45–40% gradient, 테두리 `#08251C`, radius 3px, shadow `0 1px 4px rgba(9,39,30,.7)` | `--hm-sw-header-property-background`, `-property-border-color`, `-property-radius`, `-property-shadow` |
 | 인쇄·K pill | `rgba(0,0,0,.8)`, 테두리 `#092920` | `--hm-sw-header-pill-background`, `-pill-border-color` |
 | 문서 Dropdown | `#103127`, 테두리 `#041611` | `--hm-sw-header-document-menu-*` |
@@ -122,7 +122,7 @@
 |---|---|---|
 | `text` | 속성Bar·속성창 토글: 19px 행, 14px 700, 자간 0.04em, 묶음 위 12px 캡션, 버튼 사이 1px 구분선 | Hover·`pressed` 글자 `#FFC600`, 테두리·배경 변화 없음 |
 | `pill` | 인쇄·K: pill(`rgba(0,0,0,.8)`, 1px `#092920`, radius 4px) 안 40 × 38 버튼, 아이콘 영역 24 × 23 | Hover 노란 gradient 링 + `hoverIcon`. 아이콘 색은 기존 인쇄 아이콘 `#B6D0C9` → Hover `#FFC600`(`--hm-sw-header-selected-color`) |
-| `document` | 파일명 면: 48px, gradient 표면, 위·오른쪽·아래 1px `#0E4C3A`, 글자 `#F0F7F5` 700 · 자간 0.06em | 글자만 Hover `#FFC600`. Home 바로 뒤면 로고 사선 접점 공유, 그 뒤 파일명은 왼쪽 여백 12px |
+| `document` | 파일명 면: 48px, gradient 표면, 위·오른쪽·아래 1px gradient 테두리(`--hm-sw-header-document-border-gradient`), 글자 `#F0F7F5` 700 · 자간 0.06em | 글자만 Hover `#FFC600`. Home 바로 뒤면 로고 사선 접점 공유, 그 뒤 파일명은 왼쪽 여백 12px |
 
 ## 10. 새 컴포넌트 체크리스트
 
diff --git a/packages/sw/ai/examples/example-layout.css b/packages/sw/ai/examples/example-layout.css
index dca6591..20bd93b 100644
--- a/packages/sw/ai/examples/example-layout.css
+++ b/packages/sw/ai/examples/example-layout.css
@@ -18,9 +18,10 @@
   flex: 1 1 0;
   min-width: 0;
   padding: 4px;
-  border: 1px solid var(--hm-sw-header-object-border-color);
+  /* The gradient stroke shows through the transparent 1px border, as on the SWHeader object area. */
+  border: 1px solid transparent;
   border-radius: var(--hm-sw-header-object-radius);
-  background: var(--hm-sw-header-object-background);
+  background: var(--hm-sw-header-object-background) padding-box, var(--hm-sw-header-object-border-gradient) border-box;
 }
 /* Window-area surface for print / K / window buttons. */
 .app-sw-window {
diff --git a/packages/sw/src/theme/sw-viewer.css b/packages/sw/src/theme/sw-viewer.css
index 1f5de05..d4e6b97 100644
--- a/packages/sw/src/theme/sw-viewer.css
+++ b/packages/sw/src/theme/sw-viewer.css
@@ -115,9 +115,10 @@ button.hm-sw-viewer-header__brand { text-align: left; }
   min-width: 56px;
   height: calc(var(--hm-sw-viewer-height) - 2px);
   padding: 0 16px 0 24px;
-  border: 1px solid var(--hm-sw-header-document-border-color);
+  /* SWHeader file-name surface: the Figma gradient stroke through the transparent top / right / bottom 1px. */
+  border: 1px solid transparent;
   border-left: 0;
-  background: var(--hm-sw-header-document-background);
+  background: var(--hm-sw-header-document-background) padding-box, var(--hm-sw-header-document-border-gradient) border-box;
 }
 .hm-sw-viewer-header__document-name { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
 
@@ -266,9 +267,10 @@ button.hm-sw-viewer-header__brand { text-align: left; }
   height: calc(var(--hm-sw-viewer-height) - 2px);
   gap: var(--hm-sw-viewer-gap);
   padding-inline: var(--hm-sw-viewer-gap);
-  border: 1px solid var(--hm-sw-header-object-border-color);
+  /* SWHeader object surface: the Figma gradient stroke through the transparent 1px border. */
+  border: 1px solid transparent;
   border-radius: var(--hm-sw-header-object-radius);
-  background: var(--hm-sw-header-object-background);
+  background: var(--hm-sw-header-object-background) padding-box, var(--hm-sw-header-object-border-gradient) border-box;
 }
 
 .hm-sw-viewer-header__group {
@@ -449,10 +451,11 @@ button.hm-sw-viewer-header__brand { text-align: left; }
 .hm-sw-viewer-header .hm-sw-viewer-header__actions > :is(.hm-sw-viewer-status, .hm-sw-viewer-header__button, .hm-sw-header__window-buttons):not(:is(.hm-sw-viewer-status, .hm-sw-viewer-header__button, .hm-sw-header__window-buttons) + *)::after {
   box-sizing: border-box;
   width: var(--hm-sw-header-object-radius);
-  border: 1px solid var(--hm-sw-header-object-border-color);
+  /* The object surface end: its face and gradient stroke, spanning the same 1px-outset height so both line up. */
+  border: 1px solid transparent;
   border-left: 0;
   border-radius: 0 var(--hm-sw-header-object-radius) var(--hm-sw-header-object-radius) 0;
-  background: var(--hm-sw-header-object-background);
+  background: var(--hm-sw-header-object-background) padding-box, var(--hm-sw-header-object-border-gradient) border-box;
 }
 /* No line around the license / info button: the window buttons right after it drop their line before it. */
 .hm-sw-viewer-header .hm-sw-viewer-header__actions > .hm-sw-viewer-header__button + .hm-sw-header__window-buttons { box-shadow: none; }
diff --git a/packages/sw/src/theme/sw.css b/packages/sw/src/theme/sw.css
index eeecaa3..8505d43 100644
--- a/packages/sw/src/theme/sw.css
+++ b/packages/sw/src/theme/sw.css
@@ -131,10 +131,17 @@
   /* User-confirmed: document (file name) surface */
   --hm-sw-header-document-background: linear-gradient(180deg, #081813 0%, #09271e 8.69%, #0b3227 25.43%, #0e3d2f 51.25%, #0b3227 80.03%, #0a2b21 89.76%, #081813 100%);
   --hm-sw-header-document-border-color: #0e4c3a;
+  /* Figma 26:10374 (Rectangle 6671) stroke, Plugin API 2026-10-23: vertical 4-stop gradient, INSIDE, top / right /
+     bottom 1px. The file-name surfaces draw it; the solid color above stays for compatibility and for the window
+     area, print button and menus that keep a plain 1px line. */
+  --hm-sw-header-document-border-gradient: linear-gradient(180deg, #0e4c3a 0%, #041611 13.73%, #041611 89.51%, #18503f 100%);
 
   /* User-confirmed: object (editing) surface */
   --hm-sw-header-object-background: linear-gradient(0deg, #144838 0%, #1a4536 6%, #1f4134 10%, #10392d 18%, #296b55 72%, #1f5a47 83%, #144838 92%, #124133 100%);
   --hm-sw-header-object-border-color: #135643;
+  /* Figma 26:10375 (Rectangle 7428) stroke: vertical 5-stop gradient with the #34DAAA highlight, INSIDE, 1px on every
+     side. The object surfaces draw it; the solid color above stays for compatibility and for the menus. */
+  --hm-sw-header-object-border-gradient: linear-gradient(180deg, #135643 0%, #0e3d2f 13.57%, #34daaa 37.06%, #08241c 80.5%, #1f5e4b 100%);
   --hm-sw-header-object-radius: 6px;
 
   /* User-confirmed: property field surface */
@@ -381,11 +388,13 @@
   padding: 0 12px 0 5px;
   gap: 15px;
   border-radius: 0;
-  border-top: 1px solid var(--hm-sw-header-document-border-color);
-  border-right: 1px solid var(--hm-sw-header-document-border-color);
-  border-bottom: 1px solid var(--hm-sw-header-document-border-color);
+  /* The 1px borders stay (transparent) so nothing moves; the Figma gradient stroke shows through them from the
+     border-box layer, the face fills the padding box as before. */
+  border-top: 1px solid transparent;
+  border-right: 1px solid transparent;
+  border-bottom: 1px solid transparent;
   border-left: 0;
-  background: var(--hm-sw-header-document-background);
+  background: var(--hm-sw-header-document-background) padding-box, var(--hm-sw-header-document-border-gradient) border-box;
   box-shadow: none;
   color: var(--hm-sw-header-title-color);
   font-weight: 700;
@@ -561,9 +570,10 @@
   min-width: 0;
   height: var(--hm-sw-header-bar-height);
   padding: 4px 0;
-  border: 1px solid var(--hm-sw-header-object-border-color);
+  /* Figma gradient stroke through the transparent 1px border (same box, radius and padding). */
+  border: 1px solid transparent;
   border-radius: var(--hm-sw-header-object-radius);
-  background: var(--hm-sw-header-object-background);
+  background: var(--hm-sw-header-object-background) padding-box, var(--hm-sw-header-object-border-gradient) border-box;
   box-shadow: none;
 }
 /* Figma places the 90px mode cell and the 157px property block on the area's outer edge (over the 1px border). */