feat: 한국어 우선 쇼케이스 정리

2026-08-26 18:14:41 +09:00 · 2026-08-26 18:14:41 +09:00 · 2b7fa32b5b
commit 2b7fa32b5b
parent e4087c29f5
109 changed files with 437 additions and 279 deletions
--- a/apps/site/public/work/baekje-celadon/index.html
+++ b/apps/site/public/work/baekje-celadon/index.html
@ -75,7 +75,7 @@
              천 년의 비색은<br />말이 없다
            </h1>
            <p class="lead reveal" style="--delay: 240ms">
-              비색(翡色)은 말로 설명되는 색이 아닙니다. 1,280°C의 환원 불에서만
+              비색은 말로 설명되는 색이 아닙니다. 1,280°C의 환원 불에서만
              나오는, 푸르름과 푸름이 아닌 사이의 색. 이 전시는 그 색을 설명하지
              않고 세 개의 암실에 놓아 두었습니다.
            </p>
--- a/apps/site/public/work/cask-archive/docent/index.html
+++ b/apps/site/public/work/cask-archive/docent/index.html
@ -3,7 +3,7 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
-    <title>1:1 위스키 도슨트 테이스팅 마스터클래스 — CASK ARCHIVE (樽室)</title>
+    <title>1:1 위스키 도슨트 테이스팅 마스터클래스 — CASK ARCHIVE</title>
    <meta name="description" content="캐스크 아카이브의 1:1 위스키 도슨트 테이스팅 마스터클래스 안내. 코피타 글래스웨어학, 감각 아로마 휠 분석, 독립병입자 싱글 캐스크 플라이트 및 가스트로노미 페어링." />
    
    <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
@ -140,7 +140,6 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a href="../index.html" class="wordmark" aria-label="캐스크 아카이브 홈">
-          <span class="wordmark-han" style="font-size: var(--step-0); color: var(--accent);">樽</span>
          캐스크 아카이브 <span class="wordmark-han">CASK ARCHIVE</span>
        </a>
        <nav class="nav" aria-label="메인 내비게이션">
--- a/apps/site/public/work/cask-archive/index.html
+++ b/apps/site/public/work/cask-archive/index.html
@ -3,7 +3,7 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
-    <title>캐스크 아카이브 (CASK ARCHIVE · 樽室) · 독립병입자 위스키바 & 도슨트 큐레이션</title>
+    <title>캐스크 아카이브 (CASK ARCHIVE) · 독립병입자 위스키바 & 도슨트 큐레이션</title>
    <meta
      name="description"
      content="Gordon & MacPhail, Signatory, SMWS 등 독립병입자(IB) 희귀 캐스크 공식 수입 인증 위스키바. 캐스크 넘버 원장과 1:1 위스키 도슨트 테이스팅 코스 예약."
@ -42,7 +42,7 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a class="wordmark" href="./index.html">
-          樽 캐스크 아카이브 <span class="wordmark-han">CASK ARCHIVE</span>
+          캐스크 아카이브 <span class="wordmark-han">CASK ARCHIVE</span>
        </a>

        <nav class="nav" aria-label="메인 메뉴">
@ -124,7 +124,7 @@
          </div>
          <div class="cert-item">
            <div class="cert-name">CADENHEAD'S</div>
-            <div class="cert-desc">1842년 스코틀랜드 최고(最古) 독립병입자 라인업</div>
+            <div class="cert-desc">1842년 설립, 스코틀랜드에서 가장 오래된 독립병입자 라인업</div>
          </div>
        </div>
      </section>
--- a/apps/site/public/work/cask-archive/styles/main.css
+++ b/apps/site/public/work/cask-archive/styles/main.css
@ -1,7 +1,7 @@
@import "./tokens.css";

 /* ==========================================================================
-   캐스크 아카이브 (CASK ARCHIVE · 樽室) — 메인 스타일시트 SSOT
+   캐스크 아카이브 (CASK ARCHIVE) — 메인 스타일시트 SSOT
   프리셋: editorial-archival + dark-instrument + high-end-visual-design
   ========================================================================== */

--- a/apps/site/public/work/cask-archive/styles/tokens.css
+++ b/apps/site/public/work/cask-archive/styles/tokens.css
@ -1,5 +1,5 @@
 /* ==========================================================================
-   캐스크 아카이브 (CASK ARCHIVE · 樽室) — 디자인 토큰 SSOT
+   캐스크 아카이브 (CASK ARCHIVE) — 디자인 토큰 SSOT
   프리셋: dark-instrument + editorial-archival
   컨셉: 독립병입자 희귀 캐스크 원장과 1:1 위스키 도슨트 — 오크와 피트의 시간
   단일 강조색: 앰버 골드 (#D99B38)
--- a/apps/site/public/work/cheongon-care/index.html
+++ b/apps/site/public/work/cheongon-care/index.html
@ -3,12 +3,12 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
-    <title>청온 케어 (淸溫) · 프리미엄 주거·오피스 전문 위생 케어 & 관제 콘솔</title>
+    <title>청온 케어 · 프리미엄 주거·오피스 전문 위생 케어 & 관제 콘솔</title>
    <meta
      name="description"
      content="임상 수준의 6단계 위생 프로토콜과 100% 정찰제 견적. 독일 카처 4.0bar 고온스팀과 에코서트 인증 천연 세제. 실시간 견적 신청 및 관제 콘솔 지원."
    />
-    <meta property="og:title" content="청온 케어 (淸溫) · 프리미엄 위생 케어" />
+    <meta property="og:title" content="청온 케어 · 프리미엄 위생 케어" />
    <meta property="og:description" content="공간의 숨결을 되돌리는 6단계 프로토콜과 투명한 정찰제 견적." />
    <meta property="og:type" content="website" />
    <meta name="theme-color" content="#f8faf9" />
@ -38,8 +38,8 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a class="wordmark" href="#" id="brandLogo">
-          <span class="wordmark-badge">淸</span>
-          청온 케어 <span class="wordmark-han">淸溫</span>
+          <span class="wordmark-badge">청</span>
+          청온 케어
        </a>

        <nav class="nav" aria-label="메인 메뉴">
--- a/apps/site/public/work/cheongon-care/protocol/index.html
+++ b/apps/site/public/work/cheongon-care/protocol/index.html
@ -3,7 +3,7 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
-    <title>임상 6단계 위생 프로토콜 & 한남 케이스 리포트 — 청온 케어 (淸溫)</title>
+    <title>임상 6단계 위생 프로토콜 & 한남 케이스 리포트 — 청온 케어</title>
    <meta name="description" content="청온 케어의 병원급 6단계 정밀 위생 프로토콜 및 ATP 생체 오염도 측정 검증 리포트. 나인원한남 86평형 준공 청소 케이스 스터디 및 32개 정밀 QC 체크리스트." />
    
    <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
@ -131,8 +131,8 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a href="../index.html" class="wordmark" aria-label="청온 케어 홈">
-          <span class="wordmark-badge">淸</span>
-          청온 케어 <span class="wordmark-han">淸溫</span>
+          <span class="wordmark-badge">청</span>
+          청온 케어
        </a>
        <nav class="nav" aria-label="메인 내비게이션">
          <a href="./index.html" class="active" style="color: var(--accent); font-weight: 600;">6단계 프로토콜</a>
--- a/apps/site/public/work/cheongon-care/styles/main.css
+++ b/apps/site/public/work/cheongon-care/styles/main.css
@ -1,7 +1,7 @@
@import "./tokens.css";

 /* ==========================================================================
-   청온 케어 (CHEONG-ON CARE · 淸溫) — 메인 스타일시트 SSOT
+   청온 케어 (CHEONG-ON CARE) — 메인 스타일시트 SSOT
   프리셋: clinical-sanitation + transparent-calculator + high-end-visual-design
   ========================================================================== */

--- a/apps/site/public/work/cheongon-care/styles/tokens.css
+++ b/apps/site/public/work/cheongon-care/styles/tokens.css
@ -1,5 +1,5 @@
 /* ==========================================================================
-   청온 케어 (淸溫 · CHEONG-ON CARE) — 디자인 토큰 SSOT
+   청온 케어 (CHEONG-ON CARE) — 디자인 토큰 SSOT
   프리셋: ledger-console + swiss-minimal
   컨셉: 임상 수준의 위생 프로토콜과 정직한 정찰제 — 공간의 숨결을 되돌리는 케어
   단일 강조색: 에메랄드 틸 (#0D9488)
--- a/apps/site/public/work/dure-enrollment/index.html
+++ b/apps/site/public/work/dure-enrollment/index.html
@ -9,11 +9,11 @@
    <link rel="manifest" href="./manifest.webmanifest" />
    <link rel="apple-touch-icon" href="./icon-192.png" />
    <meta property="og:type" content="website" />
-    <meta property="og:title" content="두레대학 수강신청 — 시간표 도장 앱" />
+    <meta property="og:title" content="두레대학 수강신청 — 시간표 관리 앱" />
    <meta property="og:url" content="https://designpaca.chanpaca.net/work/dure-enrollment/" />
    <meta property="og:image" content="https://designpaca.chanpaca.net/work/dure-enrollment/og.png" />
    <meta name="twitter:card" content="summary_large_image" />
-    <meta name="twitter:title" content="두레대학 수강신청 — 시간표 도장 앱" />
+    <meta name="twitter:title" content="두레대학 수강신청 — 시간표 관리 앱" />
    <meta name="twitter:image" content="https://designpaca.chanpaca.net/work/dure-enrollment/og.png" />
    <meta
      name="description"
@ -49,7 +49,7 @@
    <header class="appbar">
      <div class="appbar-inner">
        <a class="brand" href="#main">
-          <span class="brand-seal" aria-hidden="true">申</span>
+          <span class="brand-mark" aria-hidden="true"></span>
          두레대학 수강신청
        </a>
        <div class="appbar-actions">
@ -108,7 +108,7 @@
            <p class="tt-legend">
              <span class="key"><i class="k-major"></i>전공</span>
              <span class="key"><i class="k-gen"></i>교양</span>
-              <span class="key"><i class="k-seal"></i>신청됨</span>
+              <span class="key"><i class="k-state"></i>신청됨</span>
            </p>
          </div>
        </aside>
@ -230,8 +230,7 @@
    <dialog id="course-dialog" class="modal modal-split" aria-labelledby="cd-h">
      <div class="mspread">
        <div class="mcover">
-          <span class="mcover-mark" aria-hidden="true">申</span>
-          <span class="mcover-seal" aria-hidden="true">申</span>
+          <span class="mcover-label" aria-hidden="true">COURSE</span>
          <h2 class="mcover-name" id="cd-h">과목명</h2>
          <p class="mcover-meta mono" id="cd-code">CODE · 계열</p>
          <dl class="mcover-stats">
@ -261,7 +260,7 @@

          <p class="warn" id="cd-warn" hidden></p>
          <div class="modal-actions">
-            <button type="button" class="btn-seal" id="cd-apply">수강 신청</button>
+            <button type="button" class="btn-primary" id="cd-apply">수강 신청</button>
            <button type="button" class="btn-line" id="cd-cancel" hidden>신청 취소</button>
            <button type="button" class="btn-star" id="cd-star" aria-pressed="false">관심 남기기</button>
          </div>
@ -501,7 +500,7 @@
              <span class="c-credit">${c.credits}학점</span>
              <span class="c-seats ${c.seats <= 5 ? "is-low" : ""}">${c.seats === 0 ? "정원 마감" : "여석 " + c.seats}</span>
              ${starred.has(c.id) ? '<span class="c-star">★</span>' : ""}
-              ${enrolled.has(c.id) ? '<span class="c-seal">申</span>' : ""}
+              ${enrolled.has(c.id) ? '<span class="c-enrolled">신청</span>' : ""}
            </span>
          </button>`;
        return li;
--- a/apps/site/public/work/dure-enrollment/og.png
+++ b/apps/site/public/work/dure-enrollment/og.png
--- a/apps/site/public/work/dure-enrollment/styles/main.css
+++ b/apps/site/public/work/dure-enrollment/styles/main.css
@ -2,7 +2,7 @@

 /* ==========================================================================
   두레대학 수강신청 — 프로덕션 콘솔 (shadcn/ui new-york 문법의 바닐라 이식)
-   액센트는 벽돌(申) 하나. 나머지는 무채상 완성도로 말한다.
+   액센트는 벽돌색 하나. 나머지는 무채상 완성도로 말한다.
   ========================================================================== */

 *,
@ -92,15 +92,13 @@ h3 { font-size: var(--step-0); font-weight: 500; }
  font-family: var(--font-display);
  display: inline-flex; align-items: center; gap: var(--space-2);
  color: var(--foreground); text-decoration: none;
-  font-weight: 600; font-size: var(--step-1);
+  font-weight: 600; font-size: var(--step-1); white-space: nowrap;
 }
-.brand-seal {
-  display: inline-flex; align-items: center; justify-content: center;
-  width: 26px; height: 26px;
+.brand-mark {
+  display: inline-block;
+  width: 10px; height: 10px;
  background: var(--accent);
-  color: var(--on-accent);
-  border-radius: var(--radius);
-  font-size: var(--step-0); font-weight: 600;
+  border-radius: 2px;
 }
 .credits {
  display: inline-flex; align-items: center; gap: 6px;
@ -251,12 +249,15 @@ h3 { font-size: var(--step-0); font-weight: 500; }
 .c-seats { color: var(--muted-foreground); }
 .c-seats.is-low { color: var(--danger); font-weight: 600; }
 .c-star { color: var(--accent); font-weight: 600; }
-.c-seal {
-  display: inline-grid; place-items: center;
-  width: 22px; height: 22px;
-  background: var(--accent); color: var(--on-accent);
+.c-enrolled {
+  display: inline-flex; align-items: center;
+  color: var(--accent-ink);
+  background: var(--accent-soft);
+  border: 1px solid var(--accent);
  border-radius: var(--radius-xs);
-  font-size: var(--step--1);
+  padding: 1px 5px;
+  font-size: var(--step--2);
+  font-weight: 600;
 }
 .empty { padding: var(--space-4) 0; color: var(--muted-foreground); }

@ -378,10 +379,10 @@ tbody tr:hover { background: var(--muted); }
 .key i { width: 10px; height: 10px; display: inline-block; border-radius: var(--radius-xs); }
 .k-major { background: var(--accent-soft); box-shadow: inset 2px 0 0 var(--accent); }
 .k-gen { background: var(--muted-2); box-shadow: inset 2px 0 0 var(--border-strong); }
-.k-seal { background: var(--accent); }
+.k-state { background: var(--accent); }

 /* ── 버튼 ── */
-.btn-seal, .btn-line, .btn-star {
+.btn-primary, .btn-line, .btn-star {
  appearance: none; cursor: pointer; font: inherit;
  font-size: var(--step-0); font-weight: 500;
  height: 36px; padding: 0 var(--space-4);
@ -390,17 +391,17 @@ tbody tr:hover { background: var(--muted); }
  transition: background-color var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out), scale var(--dur-1) var(--ease-out);
  white-space: nowrap;
 }
-.btn-seal { background: var(--accent); border: 1px solid var(--accent); color: var(--on-accent); box-shadow: var(--shadow-sm); }
-.btn-seal:hover:not(:disabled) { background: var(--accent-ink); border-color: var(--accent-ink); }
-.btn-seal:disabled { opacity: 0.45; cursor: not-allowed; }
+.btn-primary { background: var(--accent); border: 1px solid var(--accent); color: var(--on-accent); box-shadow: var(--shadow-sm); }
+.btn-primary:hover:not(:disabled) { background: var(--accent-ink); border-color: var(--accent-ink); }
+.btn-primary:disabled { opacity: 0.45; cursor: not-allowed; }
 .btn-line { background: var(--card); border: 1px solid var(--border-strong); color: var(--foreground); box-shadow: var(--shadow-sm); }
 .btn-line:hover { background: var(--muted); }
 .btn-star { background: none; border: 1px solid var(--border-strong); color: var(--muted-foreground); }
 .btn-star:hover { color: var(--accent-ink); border-color: var(--accent); }
 .btn-star[aria-pressed="true"] { color: var(--accent-ink); border-color: var(--accent); background: var(--accent-soft); font-weight: 600; }
-.btn-seal:active, .btn-line:active, .btn-star:active { scale: 0.98; }
+.btn-primary:active, .btn-line:active, .btn-star:active { scale: 0.98; }

-/* ── 모달: 스플릿. 표지 = 잉크판, 액센트 도장. ── */
+/* ── 모달: 스플릿. 정보 패널과 핵심 동작을 분리한다. ── */
 .modal {
  margin: auto;
  width: min(94vw, 860px);
@ -427,19 +428,16 @@ tbody tr:hover { background: var(--muted); }
  display: flex; flex-direction: column;
  overflow: hidden;
 }
-.mcover-mark {
-  position: absolute; right: -18px; bottom: -24px;
-  font-size: 8rem; font-weight: 600; line-height: 1;
-  color: var(--panel-mark);
-  pointer-events: none; user-select: none;
-}
-.mcover-seal {
-  width: 44px; height: 44px;
-  display: inline-flex; align-items: center; justify-content: center;
-  font-size: var(--step-2); font-weight: 600;
-  color: var(--on-accent);
-  background: var(--accent);
-  border-radius: var(--radius);
+.mcover-label {
+  display: inline-flex;
+  align-items: center;
+  width: fit-content;
+  color: var(--panel-muted);
+  border: 1px solid var(--panel-line);
+  padding: 3px 6px;
+  font-size: var(--step--2);
+  font-weight: 600;
+  letter-spacing: 0.12em;
  margin-bottom: var(--space-4);
 }
 .mcover-name { font-size: var(--step-3); line-height: 1.25; font-weight: 600; letter-spacing: -0.02em; word-break: keep-all; }
@ -532,11 +530,10 @@ tbody tr:hover { background: var(--muted); }
@media (max-width: 680px) {
  .mspread { grid-template-columns: minmax(0, 1fr); }
  .mcover { padding: var(--space-4); flex-direction: row; align-items: center; gap: var(--space-3); }
-  .mcover-seal { width: 40px; height: 40px; margin-bottom: 0; font-size: var(--step-0); }
+  .mcover-label { margin-bottom: 0; }
  .mcover-name { font-size: var(--step-2); }
  .mcover-meta { margin-top: 2px; }
  .mcover-stats, .mcover-foot { display: none; }
-  .mcover-mark { font-size: 5rem; }
  .msheet { padding: var(--space-4); min-height: 0; }
  .course-row { flex-direction: column; align-items: flex-start; gap: var(--space-2); }
  .c-side { text-align: left; display: flex; gap: var(--space-3); align-items: center; }
@ -644,7 +641,7 @@ kbd {
  thead th, tbody tr { break-inside: avoid; }
  tbody tr:hover { background: none; }
  .tt { min-width: 0; }
-  .tt-block, .cd-slot, .eval-seg, .c-seal, .c-dept, .no-kind {
+  .tt-block, .cd-slot, .eval-seg, .c-enrolled, .c-dept, .no-kind {
    print-color-adjust: exact; -webkit-print-color-adjust: exact;
  }

@ -739,7 +736,7 @@ kbd {
@media (pointer: coarse) {
  .chip, .give-btn, .btn-line { min-height: 44px; }
  .icon-btn, .bell, .modal-close { width: 44px; height: 44px; }
-  .btn-seal, .btn-star { min-height: 44px; }
+  .btn-primary, .btn-star { min-height: 44px; }
  #q { min-height: 44px; }
 }

--- a/apps/site/public/work/dure-enrollment/styles/tokens.css
+++ b/apps/site/public/work/dure-enrollment/styles/tokens.css
@ -1,8 +1,8 @@
 /* ==========================================================================
   두레대학 수강신청 — 디자인 토큰 (v3: 프로덕션 콘솔)
   프리셋: production-console — shadcn/ui (new-york) zinc 스키마 + 벽돌 액센트 1.
-   컨셉 한 문장: 실제 대학이 쓰는 것 같은 수강신청 — 도장은 액센트 하나로 남고
-              나머지는 완성도로 말한다.
+   컨셉 한 문장: 실제 대학이 쓰는 것 같은 수강신청 — 상태 표식은 하나로,
+              나머지는 정보 밀도와 반응으로 말한다.
   레퍼런스: shadcn/ui 디자인 시스템. 종이/배판 컨셉은 철회(사용자 판정).
   하지 않은 것: 신문 배판 마스트헤드, 세리프 마스트, 전공별 색, 진행바 게이지.
   ========================================================================== */
@ -36,7 +36,7 @@
  --primary: #18181b;
  --primary-foreground: #fafafa;
  --ring: #a1a1aa;
-  --accent: #c2410c;        /* 벽돌 — 申 도장과 신청 액션만 */
+  --accent: #c2410c;        /* 벽돌색 — 신청 상태와 핵심 동작만 */
  --accent-soft: #fff7ed;
  --accent-ink: #9a3412;
  --on-accent: #ffffff;     /* 벽돌·남색 배경 위 잉크 */
--- a/apps/site/public/work/font-foundry/index.html
+++ b/apps/site/public/work/font-foundry/index.html
@ -50,7 +50,7 @@
    <main id="main">
      <!--
        스페시멘 히어로 — 파운드리의 첫 화면은 설명이 아니라 글자다.
-        '한' 한 글자를 페이지에서 가장 크게, 인주각과 함께.
+        '한' 한 글자를 페이지에서 가장 크게, 글자 자체의 비례로 보여준다.
      -->
      <section class="hero" aria-labelledby="hero-h">
        <div class="wrap">
@ -107,7 +107,7 @@
              <p class="muted">제목·표제용 · 웨이트 600 · 큰 짝에서 벌어짐 0</p>
            </header>
            <p class="specimen specimen-display" style="font-family: 'MaruBuri', serif">
-              활자는 붓의 속도를 기억한다
+              활자는 읽는 리듬을 설계한다
            </p>
          </article>
        </div>
@ -160,7 +160,7 @@
      </section>

      <!--
-        활자 케이스 — 연구소의 물성. 금속 활자와 인주.
+        활자 케이스 — 연구소의 재료. 금속 활자와 편집 도구.
      -->
      <section id="case" class="section" aria-labelledby="case-h">
        <div class="wrap case-grid">
@ -184,13 +184,13 @@
            </p>
            <figure class="case-photo-b reveal" style="--delay: 80ms">
              <img
-                src="./assets/inkstone.webp"
-                alt="연구한 먹이 고인 연적과 옆에 놓인 인주 연판"
+                src="./assets/metaltype.webp"
+                alt="빛을 받은 금속 활자와 정렬된 활자 케이스"
                width="1100"
                height="825"
                loading="lazy"
              />
-              <figcaption>먹을 갈고 인주를 찍는 자리 — 시험 인쇄 전</figcaption>
+              <figcaption>활자 폭과 여백을 비교하는 편집 자리</figcaption>
            </figure>
          </div>
        </div>
--- a/apps/site/public/work/font-foundry/styles/main.css
+++ b/apps/site/public/work/font-foundry/styles/main.css
@ -143,16 +143,6 @@ a {
  margin-top: var(--space-4);
  position: relative;
 }
-/* 인주각 — 글리프 옆에 찍히는 도장 */
-.hero-glyph::after {
-  content: "";
-  position: absolute;
-  right: 0.12em;
-  bottom: 0.18em;
-  width: 0.11em;
-  height: 0.11em;
-  background: var(--accent);
-}
 .hero-side {
  margin-top: var(--space-5);
  display: grid;
--- a/apps/site/public/work/font-foundry/styles/tokens.css
+++ b/apps/site/public/work/font-foundry/styles/tokens.css
@ -6,7 +6,7 @@
            스페시멘은 Lorem 이 아니라 실제 문장, 테스터는 즉시 반영.
   하지 않은 것: Lorem ipsum, 서체 카드 3열, '구독하면 웨이트 전부' 마케팅,
               책등 세로 내비. 이유: 활자는 보여주는 것이지 포장하는 게 아니다.
-   강조 인주빨강 #A63D2F — 인장·CTA에만. 배경 채움은 버튼 하나 뿐.
+   강조 벽돌빨강 #A63D2F — CTA에만. 배경 채움은 버튼 하나 뿐.
   ========================================================================== */

 :root {
@ -23,15 +23,15 @@
  --font-display: "MaruBuri", serif;
  --font-body: "Pretendard Variable", Pretendard, -apple-system, sans-serif;

-  --surface: #f5f1e8;      /* 한지 */
+  --surface: #f5f1e8;      /* 따뜻한 중성 바탕 */
  --surface-raised: #ede7d9;
  --ink: #26221d;
  --ink-muted: #6a635a;
  --ink-faint: #948b7c;
  --line: #d9d1bf;
-  --accent: #a63d2f;       /* 인주 */
+  --accent: #a63d2f;       /* 강조 */
  --accent-ink: #f5f1e8;
-  --accent-hover: #8a3225; /* 인주 눌린 단계 */
+  --accent-hover: #8a3225; /* 강조 호버 */

  --space-1: 0.25rem;
  --space-2: 0.5rem;
--- a/apps/site/public/work/gaon-lms/index.html
+++ b/apps/site/public/work/gaon-lms/index.html
@ -527,7 +527,7 @@
          <header class="view-head">
            <div>
              <h2 class="v-h" id="fi-h">자료실</h2>
-              <p class="view-sub">배부 자료의 원장. 배부를 눌렀는지에 따라 도장이 남습니다.</p>
+              <p class="view-sub">배부 자료의 목록. 배부 여부와 일시를 바로 확인할 수 있습니다.</p>
            </div>
          </header>

@ -546,7 +546,7 @@
            <table>
              <caption class="sr-only">배부 자료 목록</caption>
              <thead>
-                <tr><th scope="col">자료</th><th scope="col">과목</th><th scope="col">종류</th><th scope="col" class="num">크기</th><th scope="col" class="num">조회</th><th scope="col" class="num">날인일</th><th scope="col">배부</th></tr>
+                <tr><th scope="col">자료</th><th scope="col">과목</th><th scope="col">종류</th><th scope="col" class="num">크기</th><th scope="col" class="num">조회</th><th scope="col" class="num">배부일</th><th scope="col">배부</th></tr>
              </thead>
              <tbody id="file-body"><!-- JS --></tbody>
            </table>
@ -666,7 +666,7 @@
      <div class="mspread">
        <div class="mcover">
          <span class="mcover-mark" id="stu-mark" aria-hidden="true">가</span>
-          <span class="mcover-seal" id="stu-seal" aria-hidden="true">가</span>
+          <span class="mcover-label" aria-hidden="true">STUDENT</span>
          <h2 class="mcover-name" id="stu-dlg-h">수강생</h2>
          <p class="mcover-meta" id="stu-meta">주 과목 · 상태</p>
          <dl class="mcover-stats">
@ -799,7 +799,7 @@
    <script>
      /*
        앱 상태는 전부 이 안에 있다. 서버도 localStorage 도 없다 — 데모 원칙.
-        뷰 전환 · 검색/필터 · 출석 순환 · 배부 도장 · 리포트 계산까지
+        뷰 전환 · 검색/필터 · 출석 순환 · 배부 상태 · 리포트 계산까지
        네이티브 기능 위에 얹은 얇은 JS.
      */
      const STUDENTS = [
@ -1279,7 +1279,6 @@
        if (!btn || btn.classList.contains("att-btn")) return;
        const i = +btn.dataset.stu;
        const s = STUDENTS[i];
-        document.getElementById("stu-seal").textContent = s.name[0];
        document.getElementById("stu-mark").textContent = s.name[0];
        document.getElementById("stu-dlg-h").innerHTML = `<span class="hl">${s.name}</span>`;
        document.getElementById("stu-meta").textContent = `${s.sub} · ${s.status} · 개강 2026-03-02`;
--- a/apps/site/public/work/gaon-lms/styles/main.css
+++ b/apps/site/public/work/gaon-lms/styles/main.css
@ -489,13 +489,14 @@ tbody tr:hover { background: var(--muted); }
  color: var(--panel-mark);
  pointer-events: none; user-select: none;
 }
-.mcover-seal {
-  width: 44px; height: 44px;
-  display: inline-flex; align-items: center; justify-content: center;
-  font-size: var(--step-2); font-weight: 600;
-  color: var(--on-accent);
-  background: var(--accent);
-  border-radius: var(--radius);
+.mcover-label {
+  display: inline-flex; align-items: center;
+  width: fit-content;
+  color: var(--panel-muted);
+  border: 1px solid var(--panel-line);
+  padding: 3px 6px;
+  font-size: var(--step--2); font-weight: 600;
+  letter-spacing: 0.12em;
  margin-bottom: var(--space-4);
 }
 .mcover-name {
@ -626,7 +627,7 @@ tbody tr:hover { background: var(--muted); }
@media (max-width: 680px) {
  .mspread { grid-template-columns: minmax(0, 1fr); }
  .mcover { padding: var(--space-4); flex-direction: row; align-items: center; gap: var(--space-3); }
-  .mcover-seal { width: 40px; height: 40px; margin-bottom: 0; font-size: var(--step-1); }
+  .mcover-label { margin-bottom: 0; }
  .mcover-name { font-size: var(--step-2); }
  .mcover-meta { margin-top: 2px; }
  .mcover-stats, .mcover-foot { display: none; }
--- a/apps/site/public/work/hyang-incense/index.html
+++ b/apps/site/public/work/hyang-incense/index.html
@ -3,12 +3,12 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>향연 (享煙) · 자연 침향 아카이브</title>
+    <title>향연 · 자연 침향 아카이브</title>
    <meta
      name="description"
      content="연기는 흩어지고 향기만 머뭅니다. 자연 침향목의 수지 함량과 숙성 연도를 기록으로 남기는 향 아카이브. 서울 삼청동."
    />
-    <meta property="og:title" content="향연 (享煙) · 자연 침향 아카이브" />
+    <meta property="og:title" content="향연 · 자연 침향 아카이브" />
    <meta property="og:description" content="수지 함량과 숙성 연도를 기록으로 남기는 침향 아카이브." />
    <meta property="og:type" content="website" />
    <meta name="theme-color" content="#F6F2E9" />
@ -30,20 +30,11 @@
  </head>

  <body>
-    <!-- 재질: 한지. 아주 옅은 섬유 그레인 — 사진이 아니라 종이 위에 있다는 감각 -->
-    <svg class="paper" aria-hidden="true">
-      <filter id="hanji">
-        <feTurbulence type="fractalNoise" baseFrequency="0.9 0.7" numOctaves="2" seed="7" stitchTiles="stitch" />
-        <feColorMatrix type="matrix" values="0 0 0 0 0.55  0 0 0 0 0.52  0 0 0 0 0.46  0 0 0 0.05 0" />
-      </filter>
-      <rect width="100%" height="100%" filter="url(#hanji)" />
-    </svg>
-
    <a class="skip" href="#main">본문으로 건너뛰기</a>

    <header class="site-head">
      <div class="wrap head-inner">
-        <a class="wordmark" href="#main">향연 <span class="han">享煙</span></a>
+        <a class="wordmark" href="#main">향연</a>
        <nav class="nav" aria-label="섹션">
          <a href="#wood">향목</a>
          <a href="#aging">숙성</a>
@ -77,13 +68,13 @@
          <figure class="hero-photo reveal" style="--delay: 120ms">
            <img
              src="./assets/smoke.webp"
-              alt="밝은 한지 위 검은 석 받침대에서 한 줄기 침향 연기가 곧게 피어오르는 모습"
+              alt="밝은 배경의 검은 받침대에서 한 줄기 침향 연기가 곧게 피어오르는 모습"
              width="900"
              height="1200"
              loading="eager"
              fetchpriority="high"
            />
-            <figcaption class="vertical">침향 한 줄기 · 삼청동 아카이브룸</figcaption>
+            <figcaption>침향 한 줄기 · 삼청동 아카이브룸</figcaption>
          </figure>
        </div>
      </section>
@ -233,7 +224,7 @@
              </div>
            </dl>
          </div>
-          <p class="vertical visit-mark">향연 享煙</p>
+          <p class="visit-mark">향연</p>
        </div>
      </section>
    </main>
--- a/apps/site/public/work/hyang-incense/styles/main.css
+++ b/apps/site/public/work/hyang-incense/styles/main.css
@ -1,7 +1,7 @@
@import url("./tokens.css");

 /* ==========================================================================
-   향연 — quiet-luxury. 한지 위의 장부.
+   향연 — quiet-luxury. 밝은 편집면 위의 기록.
   ========================================================================== */

 *,
@ -33,20 +33,6 @@ body {
  -webkit-font-smoothing: antialiased;
 }

-/* 한지 그레인 — 본문 뒤 전면, 알파 0.05. 이 페이지의 유일한 재질 효과 */
-.paper {
-  position: fixed;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  pointer-events: none;
-  z-index: 1;
-}
-body > *:not(.paper) {
-  position: relative;
-  z-index: 2;
-}
-
 :where(h1, h2, h3) {
  font-family: var(--font-display);
  font-weight: 500;
@ -121,13 +107,6 @@ a {
  margin-inline: auto;
 }

-/* 세로쓰기 — 이 스튜디오의 물성 어휘. 목요일의 화원과 같은 결, 다른 용도 */
-.vertical {
-  writing-mode: vertical-rl;
-  text-orientation: upright;
-  letter-spacing: 0.3em;
-}
-
 /* ── 헤더 ─────────────────────────────────────────────────────────────── */

 .site-head {
@ -219,8 +198,8 @@ a {
 .hero-photo {
  position: relative;
  display: grid;
-  grid-template-columns: auto auto;
-  gap: var(--space-4);
+  grid-template-columns: minmax(0, 1fr);
+  gap: var(--space-2);
  justify-content: end;
  align-items: start;
 }
@ -233,7 +212,7 @@ a {
 .hero-photo figcaption {
  font-size: var(--step--1);
  color: var(--ink-faint);
-  height: 14rem;
+  letter-spacing: 0.06em;
 }

 /* ── 섹션 공통 ────────────────────────────────────────────────────────── */
@ -382,7 +361,8 @@ tbody th {
  font-family: var(--font-display);
  color: var(--ink-faint);
  font-size: var(--step--1);
-  height: 11rem;
+  letter-spacing: 0.08em;
+  align-self: end;
 }

 /* ── 등장 모션 — 다른 페이지보다 느리다 ──────────────────────────────── */
@ -416,7 +396,6 @@ tbody th {
  }
  .hero-photo {
    max-width: 24rem;
-    grid-template-columns: 1fr auto;
    justify-content: start;
  }
  .visit-grid {
--- a/apps/site/public/work/hyang-incense/styles/tokens.css
+++ b/apps/site/public/work/hyang-incense/styles/tokens.css
@ -1,7 +1,7 @@
 /* ==========================================================================
-   향연 (享煙) — 디자인 토큰
+   향연 — 디자인 토큰
   프리셋: quiet-luxury
-   컨셉 한 문장: 한지 위의 장부 — 여백이 주인공이고 연기 한 줄기가 흔적이다.
+   컨셉 한 문장: 밝은 편집면 위의 기록 — 여백이 주인공이고 연기 한 줄기가 흔적이다.
   레퍼런스: 방향은 dogfood-incense(단, 그 파일의 6축 수치는 audit-references.md
            에서 날조로 판명 — 토큰 근거로 쓰지 않는다). 사이트 선택(정향·아카이브
            계열의 절제)만 방향 앵커로 쓰고, 값은 브리프에서 다시 정했다.
@ -23,14 +23,14 @@
  --font-display: "MaruBuri", serif;
  --font-body: "Pretendard Variable", Pretendard, -apple-system, sans-serif;

-  /* 색 — 한지 2단계 + 잉크 3단계 + 적갈 1. 정확한 유약색이 아니라 '건조한 종이' */
+  /* 색 — 따뜻한 중성 바탕 2단계 + 텍스트 3단계 + 적갈 1. */
  --surface: #f6f2e9;
  --surface-raised: #efe9dc;
  --ink: #2b2724;
  --ink-muted: #6d655c;
  --ink-faint: #9a9083;
  --line: #ddd4c3;
-  --accent: #7c3b24;      /* 적갈 — 잉크가 아니라 인주의 위험한 사촌 */
+  --accent: #7c3b24;      /* 적갈 — 링크와 핵심 동작만 */
  --accent-hover: #5f2c1a;

  --space-1: 0.25rem;
--- a/apps/site/public/work/materia-interior/index.html
+++ b/apps/site/public/work/materia-interior/index.html
@ -42,7 +42,7 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a class="wordmark" href="./index.html">
-          MATERIA <span class="wordmark-han">空間素材</span>
+          MATERIA
        </a>

        <nav class="nav" aria-label="메인 메뉴">
@ -197,7 +197,7 @@
                <h3 class="work-card-title">성북동 포레스트 레지던스</h3>
                <div class="work-card-type">Private Residence · 340㎡ · 자연석 화강석 & 벨기에 리넨</div>
                <p class="work-card-desc">
-                  북악산 사계절의 숲 풍경을 차경(借景)으로 끌어들이고, 실내에는 자연석 아일랜드와 수공예 패브릭을 배치한 친환경 럭셔리 주거.
+                  북악산 사계절의 숲 풍경을 차경 기법으로 끌어들이고, 실내에는 자연석 아일랜드와 수공예 패브릭을 배치한 친환경 럭셔리 주거.
                </p>
                <div class="work-card-actions">
                  <button
--- a/apps/site/public/work/materia-interior/projects/hannam-duplex/index.html
+++ b/apps/site/public/work/materia-interior/projects/hannam-duplex/index.html
@ -353,7 +353,7 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a href="../../index.html" class="wordmark" aria-label="MATERIA 홈">
-          MATERIA <span class="wordmark-han">空間素材</span>
+          MATERIA
        </a>
        <nav class="nav" aria-label="주요 메뉴">
          <a href="./index.html" class="active" style="color: var(--accent); font-weight: 600;">24개 공간 갤러리</a>
@ -577,7 +577,7 @@
            <div class="gallery-card-body">
              <span class="gallery-card-zone">Zone B · Guest Suite</span>
              <h3 class="gallery-card-title">게스트 침실 스위트</h3>
-              <p class="gallery-card-desc">따뜻한 라임워시 도장 벽체와 천연 원목 가구의 안락한 조화.</p>
+              <p class="gallery-card-desc">따뜻한 라임워시 마감 벽체와 천연 원목 가구의 안락한 조화.</p>
            </div>
          </div>

@ -624,8 +624,8 @@
            </div>
            <div class="gallery-card-body">
              <span class="gallery-card-zone">Zone C · Tea Alcove</span>
-              <h3 class="gallery-card-title">명상 다도실 (Tea Room)</h3>
-              <p class="gallery-card-desc">천연 한지 스크린을 투과하는 부드러운 격자 채광과 원목 다도상.</p>
+              <h3 class="gallery-card-title">조용한 독서실 (Reading Alcove)</h3>
+              <p class="gallery-card-desc">반투명 패브릭 스크린을 통과하는 부드러운 격자 채광과 낮은 원목 테이블.</p>
            </div>
          </div>

@ -768,8 +768,8 @@
            </div>
            <div class="gallery-card-body">
              <span class="gallery-card-zone">Zone F · Detail</span>
-              <h3 class="gallery-card-title">전통 장부 맞춤 마스터 목공</h3>
-              <p class="gallery-card-desc">못 없이 체결되는 장인 직영 정밀 결구 구조의 하드웨어.</p>
+              <h3 class="gallery-card-title">맞춤 정밀 조인트 목공</h3>
+              <p class="gallery-card-desc">숨은 체결부로 완성한 정밀 패널 조인트와 하드웨어.</p>
            </div>
          </div>
        </div>
@ -868,11 +868,11 @@
        { img: '../../assets/hannam-05-master-bedroom.webp', zone: 'Zone B · Master Suite', title: '마스터 베드룸 스위트', desc: '천연 리넨 헤드보드 월과 간접 라인 조명으로 완성한 정숙한 침실.' },
        { img: '../../assets/hannam-06-spa-bathroom.webp', zone: 'Zone B · Spa Bath', title: '화산석 통원석 스파 배스', desc: '자연석을 통째로 깎아낸 원석 욕조와 독립형 파티나 브론즈 수전.' },
        { img: '../../assets/hannam-13-powder-room.webp', zone: 'Zone B · Powder Room', title: '석재 세면대 파우더룸', desc: '조각적인 통라임스톤 세면대와 수직 슬릿 조명이 빚은 명암.' },
-        { img: '../../assets/hannam-14-guest-suite.webp', zone: 'Zone B · Guest Suite', title: '게스트 침실 스위트', desc: '따뜻한 라임워시 도장 벽체와 천연 원목 가구의 안락한 조화.' },
+        { img: '../../assets/hannam-14-guest-suite.webp', zone: 'Zone B · Guest Suite', title: '게스트 침실 스위트', desc: '따뜻한 라임워시 마감 벽체와 천연 원목 가구의 안락한 조화.' },
        { img: '../../assets/hannam-07-library-audio.webp', zone: 'Zone C · Library', title: '서재 & 하이파이 오디오 룸', desc: '음향 반사를 고려한 훈증 오크 책장과 아날로그 턴테이블 석재 콘솔.' },
        { img: '../../assets/hannam-11-dressing-room.webp', zone: 'Zone C · Dressing Room', title: '비스포크 워크인 드레스룸', desc: '플루티드 브론즈 유리장과 시계/주얼리 수납 아일랜드 쇼케이스.' },
        { img: '../../assets/hannam-12-wine-cellar.webp', zone: 'Zone C · Wine Cellar', title: '항온항습 글래스 와인 셀러', desc: '백라이트 트래버틴 벽체와 브론즈 프레임 유리 파티션 셀러.' },
-        { img: '../../assets/hannam-20-tea-room.webp', zone: 'Zone C · Tea Alcove', title: '명상 다도실 (Tea Room)', desc: '천연 한지 스크린을 투과하는 부드러운 격자 채광과 원목 다도상.' },
+        { img: '../../assets/hannam-20-tea-room.webp', zone: 'Zone C · Reading Alcove', title: '조용한 독서실 (Reading Alcove)', desc: '반투명 패브릭 스크린을 통과하는 부드러운 격자 채광과 낮은 원목 테이블.' },
        { img: '../../assets/hannam-08-terrace.webp', zone: 'Zone D · Terrace', title: '루프탑 프라이빗 테라스', desc: '대형 트래버틴 페이버와 조형 소나무 분재, 한강 석양 조망.' },
        { img: '../../assets/hannam-09-foyer.webp', zone: 'Zone D · Entrance', title: '미니멀 입구 현관 (Foyer)', desc: '거대한 화강석 벤치 원석과 플러시 히든 피벗 도어 시스템.' },
        { img: '../../assets/hannam-22-lightwell.webp', zone: 'Zone D · Lightwell', title: '실내 석경 중정 (Zen Lightwell)', desc: '천장 보이드에서 쏟아지는 수직 채광과 백자갈 디딤돌 정원.' },
@ -884,7 +884,7 @@
        { img: '../../assets/hannam-02-blueprint.webp', zone: 'Zone F · Blueprint', title: '86평 복층 건축 평면 설계도', desc: '동선 효율과 채광축을 정밀하게 구획한 마스터 아키텍처 드래프트.' },
        { img: '../../assets/hannam-23-light-simulation.webp', zone: 'Zone F · Analysis', title: '3D 태양광 입사 조도 분석', desc: '하지 및 춘분 정오 55° 고도각에 따른 Lux 분포 및 음영 계산도.' },
        { img: '../../assets/hannam-19-joinery.webp', zone: 'Zone F · Detail', title: '5mm 음각 섀도우 갭 조인트', desc: '석재와 원목 패널 사이의 0.5mm 오차 없는 스위스 규격 결합부.' },
-        { img: '../../assets/hannam-24-timber-joinery.webp', zone: 'Zone F · Detail', title: '전통 장부 맞춤 마스터 목공', desc: '못 없이 체결되는 장인 직영 정밀 결구 구조의 하드웨어.' }
+        { img: '../../assets/hannam-24-timber-joinery.webp', zone: 'Zone F · Detail', title: '맞춤 정밀 조인트 목공', desc: '숨은 체결부로 완성한 정밀 패널 조인트와 하드웨어.' }
      ];

      // 3. Filter Chips Logic
--- a/apps/site/public/work/muwol-coffee/index.html
+++ b/apps/site/public/work/muwol-coffee/index.html
@ -3,12 +3,12 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>무월 (霧月) · 싱글오리진 원두 정기구독</title>
+    <title>무월 · 싱글오리진 원두 정기구독</title>
    <meta
      name="description"
      content="원두마다 산미·단맛·바디를 같은 척도로 측정해 적고, 생두 매입가를 공개합니다. 격주 화요일 로스팅, 서울 서촌."
    />
-    <meta property="og:title" content="무월 (霧月) · 싱글오리진 원두 정기구독" />
+    <meta property="og:title" content="무월 · 싱글오리진 원두 정기구독" />
    <meta
      property="og:description"
      content="측정된 좌표로 원두를 고르는 격주 구독. 생두 매입 원장 공개."
@ -43,9 +43,7 @@

    <header class="site-head">
      <div class="wrap head-inner">
-        <a class="wordmark" href="#main">
-          무월 <span class="wordmark-han">霧月</span>
-        </a>
+        <a class="wordmark" href="#main">무월</a>
        <nav class="nav" aria-label="섹션">
          <a href="#scale">척도</a>
          <a href="#ledger">원장</a>
--- a/apps/site/public/work/muwol-coffee/styles/tokens.css
+++ b/apps/site/public/work/muwol-coffee/styles/tokens.css
@ -1,5 +1,5 @@
 /* ==========================================================================
-   무월 (霧月 · MUWOL) — 디자인 토큰
+   무월 (MUWOL) — 디자인 토큰
   프리셋: quiet-commerce
   컨셉 한 문장: 종이 원장처럼 정직한 구독 — 화면에는 사양과 실측만.
   레퍼런스: R1 coffeecollective.dk(구조·가격 노출·거래 투명성)
--- a/apps/site/public/work/overtone-sound/index.html
+++ b/apps/site/public/work/overtone-sound/index.html
@ -84,7 +84,7 @@
            </li>
            <li class="work work-b reveal" style="--delay: 60ms">
              <p class="work-year mono">2025</p>
-              <h3>무(無)의 스펙트럼</h3>
+              <h3>무의 스펙트럼</h3>
              <p>
                아무 소리도 없는 방의 바닥 소음(−62dB)을 증폭해 들려주는
                퍼포먼스. 침묵에는 평균 진폭이 있다.
--- a/apps/site/public/work/saebyeok-cheonggwa/index.html
+++ b/apps/site/public/work/saebyeok-cheonggwa/index.html
@ -3,12 +3,12 @@
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
-    <title>새벽청과 (曉靑果) — 오늘 새벽 두 시의 값</title>
+    <title>새벽청과 — 오늘 새벽 두 시의 값</title>
    <meta
      name="description"
      content="새벽 경매에서 낙찰받아 그날 아침에 보냅니다. 품목마다 산지·등급·당도·규격과 오늘 낙찰가를 그대로 적는 청과 직거래."
    />
-    <meta property="og:title" content="새벽청과 (曉靑果)" />
+    <meta property="og:title" content="새벽청과" />
    <meta property="og:description" content="값이 매일 바뀐다는 사실을 첫 화면에 적습니다." />
    <meta property="og:type" content="website" />
    <meta name="theme-color" content="#16181a" />
@ -38,7 +38,7 @@
    <header class="site-head">
      <div class="wrap head-inner">
        <a class="wordmark" href="#top">
-          새벽청과 <span class="wordmark-han" aria-hidden="true">曉靑果</span>
+          새벽청과
        </a>
        <nav class="nav" aria-label="주요 섹션">
          <a href="#route">오는 길</a>
@ -65,10 +65,10 @@
          aria-hidden="true"
        />
        <div class="wrap hero-inner">
-          <p class="hero-stamp mono">
+          <p class="hero-meta mono">
            <span>오늘 경매</span>
            <time datetime="2026-08-24T02:00+09:00">08월 24일 02:00</time>
-            <span class="stamp-sep" aria-hidden="true">·</span>
+            <span class="meta-sep" aria-hidden="true">·</span>
            <span>하절기 기준</span>
          </p>

@ -362,7 +362,7 @@
                </dd>
              </div>
              <div>
-                <dt>선과 <span class="term-en mono">選果</span></dt>
+                <dt>선과</dt>
                <dd>
                  기계로 골라내는 일입니다. 드럼식은 지름으로, 중량식은 무게로 나눕니다.
                  같은 상자 안의 알이 고른 이유가 여기 있습니다.
@ -714,7 +714,7 @@

    <footer class="band band-dark site-foot">
      <div class="wrap foot-inner">
-        <p class="foot-name">새벽청과 <span aria-hidden="true">曉靑果</span></p>
+        <p class="foot-name">새벽청과</p>
        <p class="foot-line">새벽 경매에서 받아 그날 아침에 보냅니다</p>
        <p class="foot-fine">
          이 페이지는 designpaca 쇼케이스입니다. 실제 영업하는 상호가 아니며,
@ -739,10 +739,10 @@
            .map((part) => [part.type, part.value]),
        );
        const currentMonth = Number(dateParts.month);
-        const stamp = document.querySelector(".hero-stamp time");
-        if (stamp) {
-          stamp.dateTime = `${dateParts.year}-${dateParts.month}-${dateParts.day}T02:00+09:00`;
-          stamp.textContent = `${dateParts.month}월 ${dateParts.day}일 02:00`;
+        const heroMetaTime = document.querySelector(".hero-meta time");
+        if (heroMetaTime) {
+          heroMetaTime.dateTime = `${dateParts.year}-${dateParts.month}-${dateParts.day}T02:00+09:00`;
+          heroMetaTime.textContent = `${dateParts.month}월 ${dateParts.day}일 02:00`;
        }

        /* 판의 한 행을 고르면 같은 값으로 로트 판독기가 바뀐다. */
--- a/apps/site/public/work/saebyeok-cheonggwa/og.png
+++ b/apps/site/public/work/saebyeok-cheonggwa/og.png
--- a/apps/site/public/work/saebyeok-cheonggwa/styles/main.css
+++ b/apps/site/public/work/saebyeok-cheonggwa/styles/main.css
@ -239,7 +239,7 @@ h3 {
  z-index: 1;
 }

-.hero-stamp {
+.hero-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
@ -250,11 +250,11 @@ h3 {
  border-bottom: 1px solid var(--band-line-strong);
 }

-.hero-stamp time {
+.hero-meta time {
  color: var(--band-accent);
 }

-.stamp-sep {
+.meta-sep {
  color: var(--band-ink-faint);
 }

--- a/apps/site/public/work/saebyeok-cheonggwa/styles/tokens.css
+++ b/apps/site/public/work/saebyeok-cheonggwa/styles/tokens.css
@ -1,5 +1,5 @@
 /* ==========================================================================
-   새벽청과 (曉靑果) — 청과 도매 직거래 · 디자인 토큰 SSOT
+   새벽청과 — 청과 도매 직거래 · 디자인 토큰 SSOT

   컨셉 : 오늘 새벽 두 시의 값 — 값이 매일 바뀐다는 사실을 숨기지 않고
          첫 화면의 주인공으로 삼는다
--- a/apps/site/public/work/thursday-flowers/index.html
+++ b/apps/site/public/work/thursday-flowers/index.html
@ -55,7 +55,7 @@
      <section class="hero" aria-labelledby="hero-h">
        <div class="hero-inner wrap">
          <div class="hero-text">
-            <p class="vertical hero-role reveal">플로럴 스튜디오 / 서울 서촌 / 2019</p>
+            <p class="hero-role reveal">플로럴 스튜디오 / 서울 서촌 / 2019</p>

            <div class="hero-body">
              <h1 id="hero-h" class="hero-h reveal">
@ -102,7 +102,7 @@
                loading="lazy"
              />
            </figure>
-            <p class="vertical hero-tags reveal" style="--delay: 420ms">
+            <p class="hero-tags reveal" style="--delay: 420ms">
              주문 제작 / 정기 구독 / 공간 장식
            </p>
          </div>
@ -274,7 +274,7 @@
          <p class="visit-note muted">
            목요일 외에는 상주하지 않습니다. 다른 요일 방문은 미리 연락 주세요.
          </p>
-          <p class="vertical visit-mark">목요일의 화원</p>
+          <p class="visit-mark">목요일의 화원</p>
        </div>
      </section>
    </main>
--- a/apps/site/public/work/thursday-flowers/styles/main.css
+++ b/apps/site/public/work/thursday-flowers/styles/main.css
@ -142,16 +142,13 @@ h3 + * {
  padding-block: var(--space-8);
 }

-/* 세로로 세운 글자. R1 이 여백을 이렇게 쓴다 —
-   가로 공간을 먹지 않으면서 빈 곳에 정보를 흘려 넣는다. */
-.vertical {
-  writing-mode: vertical-rl;
+/* 가로 정보 라벨. 여백은 글자를 세우지 않고도 충분히 구분된다. */
+.hero-role,
+.hero-tags,
+.visit-mark {
  font-size: var(--step-label);
  font-weight: var(--weight-bold);
-  /* 가로쓰기 라벨의 자간(0.14em)을 그대로 쓰면 안 된다.
-     세로쓰기에서 자간은 **글자 사이 세로 간격**이 되어 낱글자가 흩어진다.
-     한글은 자소가 모여 한 글자라 특히 심하다. */
-  letter-spacing: 0.02em;
+  letter-spacing: 0.08em;
  color: var(--ink-faint);
  white-space: nowrap;
 }
@ -287,7 +284,7 @@ h3 + * {
 .hero-inner {
  display: grid;
  /* 텍스트 칼럼이 좁으면 h1 이 3줄로 접힌다(카운트 규칙: 헤드라인 2줄 이하).
-     세로 라벨이 왼쪽에서 자리를 먹으므로 그만큼 더 준다. */
+     정보 라벨이 왼쪽에서 자리를 먹으므로 그만큼 더 준다. */
  grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr);
  gap: var(--space-5);
  align-items: center;
@ -515,14 +512,14 @@ h3 + * {
    gap: var(--space-6);
  }
  /* 여기가 실제 사고 지점이었다. .hero-text 가 `auto 1fr` 2칸인데
-     세로 라벨을 가로로 눕히자 그 긴 문장이 auto 칸을 통째로 먹어
+     정보 라벨이 긴 문장을 차지하자 auto 칸을 통째로 먹어
     h1 칸이 짜부라졌다 — 390px 에서 헤드라인이 6줄, 320px 에서 11줄이 됐다. */
  .hero-text {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
  .hero-role {
-    writing-mode: horizontal-tb;
+    max-width: 100%;
  }
  /* 히어로의 텍스트 요소는 넷을 넘지 않는다(카운트 규칙) */
  .hero-tags {
@ -532,7 +529,7 @@ h3 + * {
    aspect-ratio: 1 / 0.9;
  }
  .visit-mark {
-    writing-mode: horizontal-tb;
+    max-width: 100%;
  }

  .two,
--- a/apps/site/public/work/thursday-flowers/styles/tokens.css
+++ b/apps/site/public/work/thursday-flowers/styles/tokens.css
@ -30,7 +30,7 @@
  --font-body: "Pretendard", -apple-system, "Segoe UI", sans-serif;

  /* 가장 긴 줄이 "그 주에 좋은 꽃만"(한글 7 + 공백 2 ≒ 7.7em)이다.
-     세로 라벨이 왼쪽에서 60px 을 먹으므로 텍스트 칼럼은 화면 폭의 절반보다 좁다.
+     정보 라벨이 왼쪽에서 60px 을 먹으므로 텍스트 칼럼은 화면 폭의 절반보다 좁다.
     1024px 에서 55.7px 로 잡히자 딱 넘쳐 3줄이 됐다(카운트 규칙 위반).
     기울기를 낮춰 전 구간에서 2줄을 유지한다. */
  --step-display: clamp(2.2rem, 1.3rem + 2.9vw, 4.2rem);