feat(showcase): 신규 쇼케이스 3종 — RFS · 트웬티온스 · 새벽청과

각 워크를 서로 다른 클라이언트로 보고 0~6단계를 따로 돌았다(토큰 체계 신규 정의 =
전체 경로). 셋 모두 라이트/다크 반전을 .band-light / .band-dark 가 --band-* 를
재정의하는 규칙으로 정의해 하드 게이트 4를 통과시켰다 — 반전이 섹션마다의 기분이
아니라 두 클래스가 만드는 규칙이다.

RFS — 실시간 유체 시뮬레이터 (rfs-cfd)
  프리셋 darkroom-spec · 컨셉 "암실과 사양서"
  R1 luminary.ai · R2 teenage.engineering EP-133 · 보조 simscale.com (전부 실측)
  히어로에서 브라우저가 실제로 Navier–Stokes 를 푼다. 순수 WebGL2, three.js 미사용.
  이류 → 온도 소스 → 부력·설비 힘 → 발산 → 압력 Jacobi → 투영 → 파티클 전진.
  격자 224×126 / 파티클 26,000 / Jacobi 22회, 좁은 화면은 절반으로 줄인다.
  prefers-reduced-motion 이면 시작하지 않고 그 자리에 RFS 실물 파티클 렌더가 남는다.
  단위계로 세 번 실패했다: dt 를 프레임 단위로 넘겨 파티클이 0.2초 만에 소멸했고,
  전부 급기구에서만 재생성해 실 한 가닥이 됐으며, 랙이 위로 뿜어 핫/콜드 아일이
  갈라지지 않았다. dt 를 초로 못박고 속도를 초당 격자 셀로 통일해 해결했다.
  수치는 전부 RFS 저장소 README 출처. 정확도 지표는 싣지 않았다 — 사내 검증 자료이고
  현재 통과 상태가 아니다.

트웬티온스 (twentyoz-corp)
  프리셋 field-record · 컨셉 "네 개의 현장"
  R1 samsara.com · R2 lars-mueller-publishers.com · R3 = 현행 twentyoz.kr 감사
  현행 사이트 실측: 대비 실패 172개 요소(9~11px 가 3.61:1), 한글 폰트 미지정으로
  한글이 시스템 기본으로 떨어짐, h1 자간 −0.06em(한글 상한의 세 배), 배경 #020202.
  'Digital Genetics' 은유가 산업용 IoT 사업을 가리고 있었다.
  유지한 자산은 radius 0 과 무채색·모노 기조.
  첫 화면에 회사 이름 대신 현장 선택기를 뒀다 — 라디오 그룹이라 JS 0바이트이고
  좌우 화살표 키가 그냥 먹는다. 파트너 19곳은 원본에 도메인 표기가 없어 나누지 않았다.

새벽청과 (saebyeok-cheonggwa)
  프리셋 market-board · 컨셉 "오늘 새벽 두 시의 값"
  R1 natoora.com · R2 phillips.com · R3 제철 12개월 띠
  커머스가 감추는 시세 변동을 히어로의 주인공으로 삼았다. 상품 사진은 아래로 내렸다.
  경매 시각·경락가격·등급·당도 표시 규정을 조사해 카피의 근거로 썼다.
  무화과 당도를 "—" 로 두고 값이 없는 게 아니라 표시가 허용되지 않는 품목이라고 적었다.
  등락은 색이 아니라 ▲▼보합 기호가 먼저다.
  표의 숫자가 예시임을 판 아래와 푸터 두 곳에 명시하고, 주소·전화는 비웠다(게이트 11).
  사진 4장은 codex 내장 image_gen 생성물이며 합계 341KB.

검증: Astro 빌드 통과, verify 체인 L0~L6 10계층 전부 통과,
showcase-audit 신규 3종 12/12 통과(320/390/768/1440).
성능 실측(RFS): JS 24KB · 총 704KB. 폰트만 530KB 로 예산(200KB) 초과 —
한글 웹폰트 자체가 원인이고 기존 cheongon-care 는 650KB 로 더 크다.
저장소 공통 baseline 이라 이번 판은 기록만 남기고 넘어간다.

기존 16종에서 발견된 70건(대비 미달·히어로 줄 수 초과)은 이번 범위를 넘어
design.md 에 목록만 남겼다.

apps/site/src/data/work.ts

@@ -40,6 +40,12 @@ import caskArchive from "../assets/shots/work-cask-archive.png";
 import caskArchive2 from "../assets/shots/work-cask-archive-2.png";
 import materiaInterior from "../assets/shots/work-materia-interior.png";
 import materiaInterior2 from "../assets/shots/work-materia-interior-2.png";
+import rfsCfd from "../assets/shots/work-rfs-cfd.png";
+import rfsCfd2 from "../assets/shots/work-rfs-cfd-2.png";
+import twentyozCorp from "../assets/shots/work-twentyoz-corp.png";
+import twentyozCorp2 from "../assets/shots/work-twentyoz-corp-2.png";
+import saebyeokCheonggwa from "../assets/shots/work-saebyeok-cheonggwa.png";
+import saebyeokCheonggwa2 from "../assets/shots/work-saebyeok-cheonggwa-2.png";
 
 export interface WorkItem {
   slug: string;
@@ -321,4 +327,69 @@ export const WORK: WorkItem[] = [
     alt: "마테리아 스튜디오 — 트래버틴 벽체 펜트하우스 거실 전경과 천연 마감재 플랫레이",
     size: "sm",
   },
+
+  /* ── 8행: 신규 쇼케이스 3종 (2 + 2 + 2) ── */
+  {
+    slug: "rfs-cfd",
+    name: "RFS — 실시간 유체 시뮬레이터",
+    kind: "데이터센터 열관리 GPU 엔진",
+    concept: "암실과 사양서 — 유동이 있는 곳은 어둡고, 읽는 곳은 밝다",
+    risk: "히어로에서 브라우저가 실제로 열유동을 풉니다. 슬라이더로 랙 부하와 급기량을 바꾸면 그 자리에서 유동이 달라집니다",
+    preset: "darkroom-spec",
+    date: "2026-08",
+    metrics: [
+      "WebGL2 실시간 열유동 (three.js 미사용)",
+      "라이트/다크 반전을 토큰 규칙으로",
+      "수치는 전부 개발 저장소 출처",
+      "정확도 지표는 싣지 않음",
+      "하드 게이트 14/14",
+    ],
+    href: "/work/rfs-cfd/",
+    shot: rfsCfd,
+    shotAlt: rfsCfd2,
+    alt: "RFS — 어두운 전산실 단면에서 서버랙 위로 초록 열기둥이 오르고 주변에 청록 냉기가 순환하는 실시간 유체 화면",
+    size: "sm",
+  },
+  {
+    slug: "twentyoz-corp",
+    name: "트웬티온스 (TWENTYOZ)",
+    kind: "ICT 기업 홈페이지 리디자인",
+    concept: "네 개의 현장 — 회사 소개가 아니라, 같은 기술이 어느 현장에서 무엇을 하는지의 목록",
+    risk: "첫 화면에 회사 이름과 슬로건을 두지 않습니다. 현장을 고르면 제품·기술·납품 사례가 통째로 바뀝니다",
+    preset: "field-record",
+    date: "2026-08",
+    metrics: [
+      "현행 사이트 감사: 대비 실패 172개 요소",
+      "한글 폰트 미지정 → Pretendard 지정",
+      "현장 전환 JS 0바이트 (라디오 그룹)",
+      "신호 적색 1색",
+      "하드 게이트 14/14",
+    ],
+    href: "/work/twentyoz-corp/",
+    shot: twentyozCorp,
+    shotAlt: twentyozCorp2,
+    alt: "트웬티온스 — 종이 톤 위에 네 개의 현장 탭이 가로로 놓이고 선택된 현장의 제품과 납품 사례가 아래에 펼쳐진 화면",
+    size: "sm",
+  },
+  {
+    slug: "saebyeok-cheonggwa",
+    name: "새벽청과 (曉靑果)",
+    kind: "청과 도매 직거래",
+    concept: "오늘 새벽 두 시의 값 — 값이 매일 바뀐다는 사실을 첫 화면의 주인공으로 삼는다",
+    risk: "상품 사진 대신 오늘의 시세판이 히어로입니다. 낙찰가와 판매가를 같은 것처럼 적지 않고, 당도를 표시할 수 없는 품목은 '—' 로 둡니다",
+    preset: "market-board",
+    date: "2026-08",
+    metrics: [
+      "시세판이 히어로",
+      "등급·당도·규격 실제 표준규격 근거",
+      "제철 12개월 띠 · 이번 달 자동 표시",
+      "새벽 남색 1색 · 사진만 유채색",
+      "하드 게이트 14/14",
+    ],
+    href: "/work/saebyeok-cheonggwa/",
+    shot: saebyeokCheonggwa,
+    shotAlt: saebyeokCheonggwa2,
+    alt: "새벽청과 — 새벽 도매시장 통로 사진 위에 품목·산지·등급·당도·낙찰가가 적힌 오늘의 시세판",
+    size: "sm",
+  },
 ];