kasaframe 0.1.1 → 0.1.4

package/themes/ink-wash/slots.ts

@@ -0,0 +1,150 @@
+import { clamp, noise1, randRange, type Style } from "@kasaframe/core";
+import type { ThemeSlots } from "@kasaframe/themes/slots";
+import { letters, partial, traceCanvas } from "@kasaframe/themes/slotkit";
+import { hanji, inkDrop, soak } from "./effects.ts";
+
+// 장면 문법 패턴이 테마 이름 없이 부르는 자리 — 화선지에 먹이 스미는 결로. 끊지 않고 흐른다
+const SVG = "http://www.w3.org/2000/svg";
+
+/** 거친 가장자리 사각 — 넓은 붓으로 쓸어 놓은 담묵 면. viewBox 0..100 */
+function roughRect(seed: string): string {
+  const pts: string[] = [];
+  const side = (n: number, f: (u: number, j: number) => [number, number]) => {
+    for (let i = 0; i < n; i++) {
+      const u = i / n;
+      pts.push(f(u, noise1(seed, i * 0.7 + n) * 1.6).map((v) => v.toFixed(2)).join(","));
+    }
+  };
+  side(24, (u, j) => [u * 100, 0 + j]);
+  side(14, (u, j) => [100 + j, u * 100]);
+  side(24, (u, j) => [100 - u * 100, 100 + j]);
+  side(14, (u, j) => [0 + j, 100 - u * 100]);
+  return `M${pts.join("L")}Z`;
+}
+
+function svgIn(el: HTMLElement, css: string): SVGSVGElement {
+  const sv = document.createElementNS(SVG, "svg");
+  sv.setAttribute("viewBox", "0 0 100 100");
+  sv.setAttribute("preserveAspectRatio", "none");
+  sv.style.cssText = `position:absolute;overflow:visible;pointer-events:none;${css}`;
+  el.append(sv);
+  return sv;
+}
+
+export const slots: ThemeSlots = {
+  surface(el, { ctx, seed }) {
+    return hanji(el, { ctx, seed });
+  },
+
+  // 담묵 면 — 넓은 붓이 왼쪽에서 오른쪽으로 쓸며 거친 가장자리 먹 면을 놓는다. 강조 판은 인주
+  panel(el, { at, seed, tone }) {
+    const sv = svgIn(el, "inset:0;width:100%;height:100%");
+    el.prepend(sv);
+    const p = document.createElementNS(SVG, "path");
+    p.setAttribute("d", roughRect(seed));
+    p.setAttribute("fill", tone === "accent" ? "var(--kf-accent)" : "color-mix(in srgb, var(--kf-ink) 13%, transparent)");
+    sv.append(p);
+    const rim = document.createElementNS(SVG, "path");
+    rim.setAttribute("d", roughRect(`${seed}:rim`));
+    rim.setAttribute("fill", "none");
+    rim.setAttribute("stroke", tone === "accent" ? "var(--kf-accent)" : "color-mix(in srgb, var(--kf-ink) 35%, transparent)");
+    rim.setAttribute("stroke-width", "3");
+    rim.setAttribute("vector-effect", "non-scaling-stroke");
+    sv.append(rim);
+    return (t) => {
+      const u = clamp((t - at) / 0.32);
+      sv.style.visibility = t >= at ? "visible" : "hidden";
+      sv.style.clipPath = `inset(0 ${((1 - (1 - (1 - u) ** 3)) * 100).toFixed(1)}% 0 0)`;
+    };
+  },
+
+  // 젖은 먹으로 놓였다가 마르며 또렷해진다 — 둘레에 담묵 번짐이 한 번 퍼진다(0.55초 안에 선다)
+  land(el, { at, seed }) {
+    const sv = svgIn(el, "left:-18%;top:-24%;width:136%;height:148%;z-index:-1;display:none");
+    const p = document.createElementNS(SVG, "path");
+    const n = 40;
+    let d = "";
+    for (let i = 0; i <= n; i++) {
+      const a = (i / n) * Math.PI * 2;
+      const r = 46 * (1 + 0.12 * noise1(seed, i * 0.9) + 0.05 * noise1(`${seed}:f`, i * 2.3));
+      d += `${i ? "L" : "M"}${(50 + Math.cos(a) * r).toFixed(2)},${(50 + Math.sin(a) * r).toFixed(2)}`;
+    }
+    p.setAttribute("d", `${d}Z`);
+    p.setAttribute("fill", "color-mix(in srgb, var(--kf-ink) 16%, transparent)");
+    sv.append(p);
+    const rot = randRange(seed, 0, -8, 8);
+    return (t): Style => {
+      const k = t - at;
+      sv.style.display = t >= at ? "block" : "none";
+      const e = 1 - (1 - clamp(k / 0.55)) ** 3;
+      sv.style.transform = `rotate(${rot}deg) scale(${(0.35 + 0.65 * e).toFixed(3)})`;
+      if (t < at) return {};
+      return k < 0.55 ? soak(t, { at, dur: 0.55, blur: 12 }) : {};
+    };
+  },
+
+  // 글자가 차례로 먹으로 스민다 — 한 자씩 옅게 번졌다가 마르며 진해진다
+  write(el, { text, at, dur }) {
+    const spans = letters(el, text);
+    const n = spans.length;
+    return (t) => {
+      spans.forEach((s, i) => {
+        const born = at + (dur * i) / Math.max(1, n);
+        const u = clamp((t - born) / 0.28);
+        s.style.visibility = t >= born ? "visible" : "hidden";
+        s.style.opacity = t >= at + dur + 0.28 ? "" : (0.35 + 0.65 * u).toFixed(3);
+        s.style.textShadow = u < 1 && t >= born ? `0 0 ${(1 + 9 * (1 - u)).toFixed(1)}px color-mix(in srgb, var(--kf-ink) 55%, transparent)` : "";
+      });
+    };
+  },
+
+  // 붓 한 획 — 붓털 여섯 가닥이 함께 그어지고 끝이 갈라진다. 다 그은 뒤엔 먹이 둘레로 천천히 스며 번짐 테가 넓어진다
+  trace(el, { points, at, dur, seed, tone }) {
+    const { g, clear } = traceCanvas(el, points, 60);
+    const ink = getComputedStyle(el).getPropertyValue(tone === "accent" ? "--kf-accent" : "--kf-ink").trim() || "#1B1A18";
+    const K = 6;
+    const offs = Array.from({ length: K }, (_, k) => (k / (K - 1) - 0.5) * 9 + randRange(seed, k, -1, 1));
+    const caps = Array.from({ length: K }, (_, k) => randRange(seed, k + 20, 0.72, 1.05));
+    return (t) => {
+      clear();
+      const p = clamp((t - at) / Math.max(0.05, dur));
+      if (p <= 0) return;
+      const pts = partial(points, p);
+      if (pts.length < 2) return;
+      g.lineCap = "round";
+      g.lineJoin = "round";
+      if (p >= 1) {
+        const bleed = Math.min(1, (t - at - dur) / 1.2);
+        g.strokeStyle = ink;
+        g.globalAlpha = 0.12;
+        g.lineWidth = 14 + 22 * bleed;
+        g.beginPath();
+        pts.forEach((q, i) => (i ? g.lineTo(q[0], q[1]) : g.moveTo(q[0], q[1])));
+        g.stroke();
+      }
+      g.strokeStyle = ink;
+      for (let k = 0; k < K; k++) {
+        const sub = partial(points, Math.min(p, caps[k]));
+        g.globalAlpha = 0.7;
+        g.lineWidth = 3.2;
+        g.beginPath();
+        sub.forEach((q, i) => {
+          const a = sub[Math.min(sub.length - 1, i + 1)];
+          const b = sub[Math.max(0, i - 1)];
+          const L = Math.hypot(a[0] - b[0], a[1] - b[1]) || 1;
+          const x = q[0] - ((a[1] - b[1]) / L) * offs[k];
+          const y = q[1] + ((a[0] - b[0]) / L) * offs[k];
+          if (i) g.lineTo(x, y);
+          else g.moveTo(x, y);
+        });
+        g.stroke();
+      }
+      g.globalAlpha = 1;
+    };
+  },
+
+  drop(el, { ctx, drop }) {
+    return inkDrop(el, { ctx, drop });
+  },
+};
+

package/themes/ink-wash/style.json

@@ -0,0 +1,108 @@
+{
+  "name": "ink-wash",
+  "label": "수묵 — 정보가 화선지에 먹으로 스며 나타난다",
+  "scheme": "light",
+  "colors": {
+    "bg": "#EDE6D6",
+    "surface": "#F4EFE3",
+    "raised": "#E2D9C5",
+    "line": "#8A8478",
+    "ink": "#1B1A18",
+    "inkSoft": "#4A4741",
+    "dim": "#5F594F",
+    "accent": "#B8332B",
+    "accentSoft": "#E6B3A6",
+    "accentText": "#A12A23",
+    "onAccent": "#F4EFE3",
+    "success": "#1B1A18",
+    "danger": "#B8332B",
+    "warning": "#B8332B",
+    "paper": "#EDE6D6",
+    "ink2": "#4A4741",
+    "ink3": "#8A8478",
+    "ink4": "#BFB7A8",
+    "seal": "#B8332B"
+  },
+  "fonts": {
+    "sans": "\"Song Myung\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", serif",
+    "display": "\"Nanum Brush Script\", \"Song Myung\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", cursive",
+    "mono": "\"Nanum Gothic Coding\", ui-monospace, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+    "faces": [
+      {
+        "family": "Nanum Brush Script",
+        "src": "https://cdn.jsdelivr.net/gh/google/fonts@main/ofl/nanumbrushscript/NanumBrushScript-Regular.ttf",
+        "weight": "400"
+      },
+      {
+        "family": "Song Myung",
+        "src": "https://cdn.jsdelivr.net/gh/google/fonts@main/ofl/songmyung/SongMyung-Regular.ttf",
+        "weight": "400"
+      },
+      {
+        "family": "Nanum Gothic Coding",
+        "src": "https://cdn.jsdelivr.net/gh/google/fonts@main/ofl/nanumgothiccoding/NanumGothicCoding-Regular.ttf",
+        "weight": "400"
+      },
+      {
+        "family": "Pretendard Variable",
+        "src": "https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/variable/woff2/PretendardVariable.woff2",
+        "weight": "45 920"
+      }
+    ]
+  },
+  "type": {
+    "hero": 260,
+    "title": 120,
+    "body": 48,
+    "caption": 34,
+    "weightDisplay": 400,
+    "weightBody": 400,
+    "tracking": "0em"
+  },
+  "radius": {
+    "sm": 2,
+    "md": 4,
+    "lg": 8,
+    "pill": 999
+  },
+  "shadow": {
+    "soft": "none",
+    "lift": "none"
+  },
+  "motion": {
+    "beatPulse": "drops-only",
+    "shake": {
+      "on": [
+        "drop"
+      ],
+      "maxPerPhrase": 1,
+      "maxPx": 8
+    },
+    "cameraMove": "off",
+    "repeatSameMove": false,
+    "maxFreezeSec": 0.1,
+    "enter": "fade",
+    "ease": "outCubic",
+    "durations": {
+      "fast": 0.2,
+      "base": 0.45,
+      "slow": 0.9
+    }
+  },
+  "theme": {
+    "inks": [
+      "#EDE6D6 화선지 — 화면 반 이상은 늘 빈 종이(여백)",
+      "#1B1A18 → #4A4741 → #8A8478 → #BFB7A8 먹 다섯 단(墨分五色) — 색이 아니라 물의 양",
+      "#B8332B 인주 낙관 — 결정적인 하나에만, 작게"
+    ],
+    "texture": "한지 섬유가 비치는 종이, 먹은 스며 가장자리가 손가락처럼 뻗고 마른 테두리가 조금 진하다. 빠른 획 끝은 붓털이 갈라진 비백. 겹친 먹은 곱하기로 더 진해진다",
+    "movement": "60fps 로 흐른다(끊지 않는다). 글·숫자는 젖은 먹으로 번졌다가 마르며 또렷해지고, 번진 먹 가장자리는 장면이 끝날 때까지 천천히 기어간다. 붓은 눌러 멈칫 → 빠르게 → 들며 갈라짐. 드롭은 먹 한 방울이 떨어져 크게 퍼지고 먹이 튄다"
+  },
+  "notes": [
+    "여백이 주인공 — 형태는 한쪽으로 치우치고 화면 반 이상을 종이로 남긴다. 상자·테두리·직선 도형을 두지 않는다.",
+    "글은 농묵(ink)·중묵(inkSoft)만 — 담묵(ink3)·청묵(ink4)은 번짐·안개·먼 봉우리에만(글로 쓰면 대비가 모자라다).",
+    "큰 숫자·낱말은 Nanum Brush Script(붓글씨), 모델 ID·주소·작은 글은 Song Myung(붓 명조). 한글은 Pretendard 로 받친다.",
+    "붉은 낙관(accent)은 한 화면에 한 곳 — 결정타 숫자나 끝 카드 도장에만.",
+    "카메라는 움직이지 않는다 — 종이는 책상에 펼쳐져 있다. 흔들림은 드롭의 먹 방울 한 번."
+  ]
+}

package/themes/ink-wash/theme.json

@@ -0,0 +1,131 @@
+{
+  "id": "ink-wash",
+  "name": "수묵",
+  "metaphor": "정보가 화선지에 먹으로 스며 나타난다 — 숫자는 젖은 먹으로 번졌다 마르며 또렷해지고, 요청은 붓 한 획, 결정적인 하나에 붉은 낙관",
+  "status": "approved",
+  "approvedAt": "2026-10-11",
+  "purposes": [
+    "promo",
+    "launch",
+    "explainer",
+    "shorts",
+    "mv"
+  ],
+  "aspect": [
+    "16:9",
+    "9:16",
+    "1:1"
+  ],
+  "vary": {
+    "scheme": [
+      "light"
+    ],
+    "hue": [
+      [
+        12,
+        40
+      ]
+    ],
+    "chroma": [
+      0.85,
+      1.1
+    ],
+    "tint": [
+      0.004,
+      0.016
+    ],
+    "bg": {
+      "light": [
+        0.88,
+        0.96
+      ]
+    },
+    "fonts": [
+      "base",
+      "gowun-batang",
+      "hahmlet",
+      "myeongjo"
+    ],
+    "texture": [
+      "none",
+      "grain"
+    ],
+    "stroke": [
+      0.85,
+      1.3
+    ],
+    "tempo": [
+      0.85,
+      1.1
+    ]
+  },
+  "tags": {
+    "mood": [
+      "고요한",
+      "여백",
+      "동양적",
+      "우아한",
+      "절제된"
+    ],
+    "light": "light",
+    "use": [
+      "소개",
+      "발표",
+      "브랜드",
+      "철학",
+      "결정",
+      "뮤직비디오"
+    ],
+    "dims": "2D"
+  },
+  "effects": [
+    {
+      "name": "hanji",
+      "kind": "layer",
+      "does": "한지 — 미색 종이에 섬유가 비친다. 서 있는 바탕(움직이지 않는다), 장면 맨 아래",
+      "use": "const paper = hanji(layer, { ctx })"
+    },
+    {
+      "name": "inkBloom",
+      "kind": "layer",
+      "does": "먹 번짐 — 먹이 스며 손가락처럼 뻗고 마른 테두리가 진하다. 다 퍼진 뒤에도 가장자리가 천천히 기어가고, 겹치면 곱하기로 진해진다",
+      "use": "const blot = inkBloom(el, { ctx, x: 960, y: 520, r: 300, at: hit, density: 0.5, grow: 0.4 })"
+    },
+    {
+      "name": "brushStroke",
+      "kind": "layer",
+      "does": "붓 한 획 — 붓털이 필압대로 벌어지며 그어지고 끝에서 갈라져 비백이 남는다. 요청 한 번·연결선·취소선·원상에",
+      "use": "const stroke = brushStroke(el, { ctx, points: [[1700, 300], [1200, 420], [700, 520]], width: 46, at: hit, dur: 0.35, dry: 0.6 })"
+    },
+    {
+      "name": "inkText",
+      "kind": "layer",
+      "does": "먹 글씨 — 글·숫자가 한 점에서 젖은 먹으로 번지며 나타나고 번진 테가 마르며 또렷해진다. vertical 이면 세로쓰기",
+      "use": "const n = inkText(el, { ctx, text: \"102\", x: 960, y: 520, size: 360, font: \"display\", at: drop, dur: 0.5 })"
+    },
+    {
+      "name": "mountain",
+      "kind": "layer",
+      "does": "먹 봉우리 — 붓이 꼭대기에서 아래로 쓸며 먹을 놓고 발치는 안개로 풀린다. 높이가 숫자, 진하기가 거리·무게",
+      "use": "const peak = mountain(el, { ctx, x: 1400, base: 900, h: 41 * 16, w: 300, at: hit, density: 0.9 })"
+    },
+    {
+      "name": "inkDrop",
+      "kind": "layer",
+      "does": "먹 방울 드롭 — 드롭 직전 먹 한 방울이 떨어지고 종이에 닿아 크게 퍼지며 둘레로 튄다. 흔들림을 돌려준다",
+      "use": "const drop = inkDrop(el, { ctx, drop: 0, origin: [960, 520] }); const s = drop(t); applyStyle(paperFrame, s.shake)"
+    },
+    {
+      "name": "sealStamp",
+      "kind": "layer",
+      "does": "낙관 — 붉은 인주 도장이 꾹 눌려 찍힌다. baek 흰 글·ju 붉은 글, 글 대신 svg(로고)도. 결정적인 하나에만",
+      "use": "const seal = sealStamp(el, { ctx, text: \"−90%\", x: 1500, y: 600, size: 240, at: hit, kind: \"baek\" })"
+    },
+    {
+      "name": "soak",
+      "kind": "value",
+      "does": "스밈 — 아무 요소나 젖은 먹처럼 흐리고 옅게 번져 있다가 마르며 또렷해진다",
+      "use": "applyStyle(el, soak(t, { at: hit, dur: 0.5 }))"
+    }
+  ]
+}

package/themes/ink-wash/variants/blush-orange.json

@@ -0,0 +1,125 @@
+{
+  "id": "blush-orange",
+  "world": "ink-wash",
+  "name": "Blush Orange",
+  "desc": "연분홍 바탕에 주황 강조 · 단정한 바탕체 제목에 고딕 본문 · 고운 필름 입자",
+  "params": {
+    "scheme": "light",
+    "bgL": 0.9098,
+    "tint": {
+      "h": 347.2579,
+      "c": 0.0151
+    },
+    "inkL": 0.2181,
+    "hue": 38.7367,
+    "chroma": 1.0251,
+    "fonts": "gowun-batang",
+    "texture": {
+      "kind": "grain",
+      "amount": 0.55
+    },
+    "stroke": 1.02,
+    "radius": null,
+    "tempo": 1.02,
+    "density": 1
+  },
+  "style": {
+    "scheme": "light",
+    "colors": {
+      "bg": "#E9DDE3",
+      "surface": "#F0E6F0",
+      "raised": "#DED1D2",
+      "line": "#877F85",
+      "ink": "#1A1924",
+      "inkSoft": "#48444E",
+      "dim": "#5D565C",
+      "accent": "#B23800",
+      "accentSoft": "#E0B09A",
+      "accentText": "#9B3000",
+      "onAccent": "#F0E6F0",
+      "success": "#1A1924",
+      "danger": "#B23800",
+      "warning": "#B23800",
+      "paper": "#E9DDE3",
+      "ink2": "#48444E",
+      "ink3": "#877F85",
+      "ink4": "#BCB0B5",
+      "seal": "#B23800"
+    },
+    "fonts": {
+      "sans": "\"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "display": "\"Gowun Batang\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", serif",
+      "mono": "\"Geist Mono\", ui-monospace, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "faces": [
+        {
+          "family": "Gowun Batang",
+          "src": "https://cdn.jsdelivr.net/gh/google/fonts@bd8f81ddb5c74d5c8897b36ad88b440266245103/ofl/gowunbatang/GowunBatang-Bold.ttf",
+          "weight": "700"
+        },
+        {
+          "family": "Pretendard Variable",
+          "src": "https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/variable/woff2/PretendardVariable.woff2",
+          "weight": "45 920"
+        },
+        {
+          "family": "Geist Mono",
+          "src": "https://cdn.jsdelivr.net/npm/geist@1.3.1/dist/fonts/geist-mono/GeistMono-Variable.woff2",
+          "weight": "100 900"
+        }
+      ]
+    },
+    "type": {
+      "weightDisplay": 700,
+      "weightBody": 500,
+      "tracking": "-0.01em"
+    },
+    "look": {
+      "texture": {
+        "kind": "grain",
+        "amount": 0.55
+      },
+      "stroke": 1.02,
+      "tempo": 1.02
+    }
+  },
+  "tags": {
+    "mood": [
+      "고요한",
+      "여백",
+      "동양적",
+      "우아한",
+      "절제된",
+      "밝은",
+      "따뜻한",
+      "아날로그",
+      "고전적"
+    ],
+    "light": "light",
+    "use": [
+      "소개",
+      "발표",
+      "브랜드",
+      "철학",
+      "결정",
+      "뮤직비디오"
+    ],
+    "dims": "2D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-11",
+    "colors": {
+      "ink": 13.26,
+      "inkSoft": 7.2,
+      "dim": 5.44,
+      "accentText": 5.65,
+      "accent": 4.6,
+      "onAccent": 4.98,
+      "success~danger": 0.243,
+      "success~warning": 0.243,
+      "accent~ink": 0.243
+    },
+    "frame": "kf check 통과 — 표준 장면 0–4초",
+    "pattern": "hook-number.counter"
+  }
+}

package/themes/ink-wash/variants/blush-rose.json

@@ -0,0 +1,124 @@
+{
+  "id": "blush-rose",
+  "world": "ink-wash",
+  "name": "Blush Rose",
+  "desc": "연분홍 바탕에 장밋빛 강조 · 현대적인 가변 명조 · 고운 필름 입자",
+  "params": {
+    "scheme": "light",
+    "bgL": 0.9592,
+    "tint": {
+      "h": 9.2323,
+      "c": 0.0124
+    },
+    "inkL": 0.2443,
+    "hue": 13.362,
+    "chroma": 0.8969,
+    "fonts": "hahmlet",
+    "texture": {
+      "kind": "grain",
+      "amount": 0.55
+    },
+    "stroke": 1.29,
+    "radius": null,
+    "tempo": 1.05,
+    "density": 1
+  },
+  "style": {
+    "scheme": "light",
+    "colors": {
+      "bg": "#FAEEF0",
+      "surface": "#FFF8FC",
+      "raised": "#EEE1DE",
+      "line": "#938B8F",
+      "ink": "#1F1F29",
+      "inkSoft": "#504D55",
+      "dim": "#666064",
+      "accent": "#BA4358",
+      "accentSoft": "#EEBDBC",
+      "accentText": "#A4394C",
+      "onAccent": "#FFF8FC",
+      "success": "#1F1F29",
+      "danger": "#BA4358",
+      "warning": "#BA4358",
+      "paper": "#FAEEF0",
+      "ink2": "#504D55",
+      "ink3": "#938B8F",
+      "ink4": "#CABFC0",
+      "seal": "#BA4358"
+    },
+    "fonts": {
+      "sans": "Hahmlet, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", serif",
+      "display": "Hahmlet, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", serif",
+      "mono": "\"Geist Mono\", ui-monospace, Hahmlet, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "faces": [
+        {
+          "family": "Hahmlet",
+          "src": "https://cdn.jsdelivr.net/gh/google/fonts@bd8f81ddb5c74d5c8897b36ad88b440266245103/ofl/hahmlet/Hahmlet%5Bwght%5D.ttf",
+          "weight": "100 900"
+        },
+        {
+          "family": "Pretendard Variable",
+          "src": "https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/variable/woff2/PretendardVariable.woff2",
+          "weight": "45 920"
+        },
+        {
+          "family": "Geist Mono",
+          "src": "https://cdn.jsdelivr.net/npm/geist@1.3.1/dist/fonts/geist-mono/GeistMono-Variable.woff2",
+          "weight": "100 900"
+        }
+      ]
+    },
+    "type": {
+      "weightDisplay": 800,
+      "weightBody": 400,
+      "tracking": "-0.02em"
+    },
+    "look": {
+      "texture": {
+        "kind": "grain",
+        "amount": 0.55
+      },
+      "stroke": 1.29,
+      "tempo": 1.05
+    }
+  },
+  "tags": {
+    "mood": [
+      "고요한",
+      "여백",
+      "동양적",
+      "우아한",
+      "절제된",
+      "밝은",
+      "아날로그",
+      "고전적"
+    ],
+    "light": "light",
+    "use": [
+      "소개",
+      "발표",
+      "브랜드",
+      "철학",
+      "결정",
+      "뮤직비디오"
+    ],
+    "dims": "2D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-11",
+    "colors": {
+      "ink": 14.42,
+      "inkSoft": 7.3,
+      "dim": 5.45,
+      "accentText": 5.7,
+      "accent": 4.61,
+      "onAccent": 4.99,
+      "success~danger": 0.236,
+      "success~warning": 0.236,
+      "accent~ink": 0.236
+    },
+    "frame": "kf check 통과 — 표준 장면 0–4초",
+    "pattern": "hook-number.counter"
+  }
+}