kasaframe 0.1.1 → 0.1.4

package/themes/clay-toy/slots.ts

@@ -0,0 +1,132 @@
+import { clamp, type SceneCtx, type Style } from "@kasaframe/core";
+import { dropBurst } from "@kasaframe/motion";
+import { stillStage } from "@kasaframe/themes/stage3d";
+import type { ThemeSlots } from "@kasaframe/themes/slots";
+import { cssVar, layer, letters, partial, shownCount, strokePath, traceCanvas } from "@kasaframe/themes/slotkit";
+import { clayStage } from "./effects.ts";
+
+// 장면 문법 패턴이 테마 이름 없이 부르는 자리 — 점토의 결로. 3D 는 surface(점토 매트 한 장, 서 있다) 하나, 나머지는 DOM·캔버스 2D.
+// 움직임은 한 손 — 닿으면 납작했다 늘어났다 출렁이고 선다
+const col = (ctx: SceneCtx, k: string, fb: string) => ctx.style.colors[k] ?? fb;
+const wobble = (u: number, amp = 0.3): number => (u < 0 || u > 1.1 ? 0 : amp * Math.exp(-6.5 * u) * Math.cos(15 * u));
+
+export const slots: ThemeSlots = {
+  // 하늘색 점토 매트가 둥근 벽으로 이어지는 빈 탁상 — 처음 한 번 그려 서 있다
+  surface(el, { ctx }) {
+    const stage = clayStage(el, { ctx, shots: [{ from: -1, to: 1e9, keys: [{ t: 0, pos: [0, 7, 12], look: [0, 0, -2] }] }] });
+    return stillStage(stage, stage);
+  },
+
+  // 손바닥으로 눌러 편 점토 판 — 위에서 털썩 떨어져 납작했다 출렁이며 선다. 강조 판은 빨강 점토
+  panel(el, { ctx, at, tone }) {
+    const r = ctx.style.radius?.lg ?? 40;
+    const accent = tone === "accent";
+    const p = layer(
+      el,
+      `inset:0;border-radius:${r}px;background:${col(ctx, accent ? "request" : "plaque", "#F6EFE4")};box-shadow:inset 0 -10px 0 rgba(0,0,0,.1), inset 0 8px 0 rgba(255,255,255,.45), 0 12px 0 rgba(35,38,52,.18);transform-origin:50% 100%`,
+      true,
+    );
+    return (t) => {
+      p.style.visibility = t >= at ? "visible" : "hidden";
+      if (t < at) return;
+      const u = t - at;
+      const fall = u < 0.18 ? (1 - u / 0.18) ** 2 : 0;
+      const s = u < 0.18 ? -0.1 : wobble(u - 0.18, 0.22);
+      p.style.transform = `translateY(${(-fall * 60).toFixed(1)}px) scale(${(1 + s * 0.5).toFixed(4)}, ${(1 - s).toFixed(4)})`;
+    };
+  },
+
+  // 떨어져 털썩 — 납작해졌다 길쭉해졌다 선다(0.6초 안)
+  land(_el, { at }) {
+    return (t): Style => {
+      const u = t - at;
+      if (u < -0.16 || u > 0.6) return {};
+      if (u < 0) return { y: -((u / 0.16) ** 2) * 40, scaleY: 1.12, scaleX: 0.94 };
+      const s = wobble(u, 0.3) * (1 - clamp(u / 0.6));
+      return { scaleX: 1 + s * 0.5, scaleY: 1 - s };
+    };
+  },
+
+  // 글자마다 꾹 — 새로 찍힌 글자는 빨강 점토로 잠깐, 앉으면 글 색으로
+  write(el, { ctx, text, at, dur }) {
+    const spans = letters(el, text);
+    const fresh = col(ctx, "accentText", "#B8341F");
+    return (t) => {
+      const n = shownCount(spans.length, t, at, dur);
+      spans.forEach((s, i) => {
+        s.style.visibility = i < n ? "visible" : "hidden";
+        s.style.color = t < at + dur + 0.1 && i >= n - 2 ? fresh : "";
+      });
+    };
+  },
+
+  // 점토 띠가 짜여 나오듯 그어지고(둥근 끝·위쪽 빛·아래 그림자), 다 그은 뒤엔 빨강 공이 띠를 따라 굴러간다
+  trace(el, { points, at, dur, tone }) {
+    const { g, clear } = traceCanvas(el, points, 50);
+    const body = tone === "accent" ? cssVar(el, "request", "#E4533C") : cssVar(el, "clay", "#F2BE2E");
+    const ball = tone === "accent" ? cssVar(el, "clay", "#F2BE2E") : cssVar(el, "request", "#E4533C");
+    return (t) => {
+      clear();
+      const p = clamp((t - at) / Math.max(0.05, dur));
+      if (p <= 0) return;
+      const pts = partial(points, p < 1 ? 1 - (1 - p) ** 3 : 1);
+      g.lineCap = "round";
+      g.lineJoin = "round";
+      g.save();
+      g.translate(0, 7);
+      g.strokeStyle = "rgba(35,38,52,0.18)";
+      g.lineWidth = 18;
+      strokePath(g, pts);
+      g.restore();
+      g.strokeStyle = body;
+      g.lineWidth = 18;
+      strokePath(g, pts);
+      g.save();
+      g.translate(-2, -4);
+      g.strokeStyle = "rgba(255,255,255,0.35)";
+      g.lineWidth = 5;
+      strokePath(g, pts);
+      g.restore();
+      if (p < 1) return;
+      const [x, y] = partial(points, ((t - at - dur) * 0.7) % 1).at(-1)!;
+      g.fillStyle = ball;
+      g.beginPath();
+      g.arc(x, y - 4, 13, 0, Math.PI * 2);
+      g.fill();
+    };
+  },
+
+  // 쿵 — 점토 알갱이가 가운데서 튀어 나가 납작하게 붙는다. 흔들림은 패턴이 화면 틀에
+  drop(el, { ctx, drop }) {
+    const c = el.ownerDocument.createElement("canvas");
+    const W = ctx.meta.width;
+    const H = ctx.meta.height;
+    c.width = Math.round(W / 2);
+    c.height = Math.round(H / 2);
+    c.style.cssText = "position:absolute;inset:0;width:100%;height:100%;pointer-events:none";
+    el.append(c);
+    const g = c.getContext("2d")!;
+    const tones = [col(ctx, "request", "#E4533C"), col(ctx, "clay", "#F2BE2E")];
+    const bits = Array.from({ length: 16 }, (_, i) => ({ a: (i / 16) * Math.PI * 2 + (i % 3) * 0.2, d: 0.28 + (i % 5) * 0.05, r: 10 + (i % 4) * 5 }));
+    return (t) => {
+      const s = dropBurst(t, { beats: ctx.beats, drop, rules: ctx.style.motion, scene: ctx.id, source: "clayDrop" });
+      g.clearRect(0, 0, c.width, c.height);
+      const u = t - ctx.beats.drop(drop);
+      if (u < 0 || u > 1.2) return s;
+      const fly = clamp(u / 0.4);
+      const fade = 1 - clamp((u - 0.8) / 0.4);
+      bits.forEach((b, i) => {
+        const x = c.width / 2 + Math.cos(b.a) * b.d * c.width * fly;
+        const y = c.height / 2 + Math.sin(b.a) * b.d * c.height * fly - Math.sin(Math.PI * fly) * 60;
+        const flat = fly >= 1 ? 1.6 : 1;
+        g.globalAlpha = fade;
+        g.fillStyle = tones[i % 2];
+        g.beginPath();
+        g.ellipse(x, y, b.r * flat, b.r / flat, 0, 0, Math.PI * 2);
+        g.fill();
+      });
+      g.globalAlpha = 1;
+      return s;
+    };
+  },
+};

package/themes/clay-toy/style.json

@@ -0,0 +1,101 @@
+{
+  "name": "clay-toy",
+  "label": "점토 장난감 — 눌리고 늘어나며 상태가 바뀐다",
+  "scheme": "light",
+  "colors": {
+    "bg": "#BCDCEA",
+    "surface": "#F6EFE4",
+    "raised": "#EDE3D3",
+    "line": "#9CC4D6",
+    "ink": "#232634",
+    "inkSoft": "#363B4E",
+    "dim": "#4B566E",
+    "accent": "#E4533C",
+    "accentSoft": "#F4A592",
+    "accentText": "#B8341F",
+    "onAccent": "#FFF6EC",
+    "success": "#3C9A68",
+    "danger": "#E4533C",
+    "warning": "#E6A91E",
+    "clay": "#F2BE2E",
+    "request": "#E4533C",
+    "plaque": "#F6EFE4",
+    "mat": "#A6CFE1",
+    "rim": "#FFF7EA"
+  },
+  "fonts": {
+    "sans": "\"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+    "display": "Jua, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+    "mono": "\"JetBrains Mono\", ui-monospace, \"SF Mono\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+    "faces": [
+      {
+        "family": "Jua",
+        "src": "https://cdn.jsdelivr.net/gh/google/fonts@main/ofl/jua/Jua-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"
+      },
+      {
+        "family": "JetBrains Mono",
+        "src": "https://cdn.jsdelivr.net/npm/@fontsource-variable/jetbrains-mono@5/files/jetbrains-mono-latin-wght-normal.woff2",
+        "weight": "100 800"
+      }
+    ]
+  },
+  "type": {
+    "hero": 220,
+    "title": 110,
+    "body": 42,
+    "caption": 30,
+    "weightDisplay": 400,
+    "weightBody": 600,
+    "tracking": "0em"
+  },
+  "radius": {
+    "sm": 14,
+    "md": 26,
+    "lg": 40,
+    "pill": 999
+  },
+  "shadow": {
+    "soft": "0 10px 0 rgba(35, 38, 52, 0.18)",
+    "lift": "0 16px 0 rgba(35, 38, 52, 0.16)"
+  },
+  "motion": {
+    "beatPulse": "drops-only",
+    "shake": {
+      "on": [
+        "drop"
+      ],
+      "maxPerPhrase": 1,
+      "maxPx": 10
+    },
+    "cameraMove": "once-per-phrase",
+    "repeatSameMove": false,
+    "maxFreezeSec": 0.1,
+    "enter": "pop",
+    "ease": "outBack",
+    "durations": {
+      "fast": 0.16,
+      "base": 0.3,
+      "slow": 0.55
+    }
+  },
+  "theme": {
+    "inks": [
+      "#BCDCEA 하늘색 점토판 — 작업 매트와 둥근 벽 한 면",
+      "#F2BE2E 노랑 점토 — 모델·덩어리·값",
+      "#E4533C 빨강 점토 — 요청·지금 움직이는 것, 크림 #F6EFE4 판 위 짙은 글"
+    ],
+    "texture": "무광 점토 — 지문·손자국 결(노멀), 꼭짓점이 조금씩 울퉁불퉁, 가장자리에 옅은 빛. 반짝임 없음",
+    "movement": "눌리고 늘어나고 되돌아온다 — 닿으면 납작, 튀어 오를 땐 길게, 앉으면 한 번 출렁이고 선다. 공(요청)은 포물선으로 튀어 가 덩어리(모델)에 꾹 붙고, 값이 내리면 덩어리가 눌려 낮아진다"
+  },
+  "notes": [
+    "점토 두 색만 — 노랑은 모델·값, 빨강은 요청. 크림은 이름표 판.",
+    "얼굴·눈·떠다니는 소품 금지 — 덩어리는 덩어리로, 움직임은 내용에서.",
+    "카메라는 작은 탁상 세트를 비스듬히 내려다본다 — 이유가 있을 때만(다가가기·드롭에 한 번 쿵) 움직인다."
+  ]
+}

package/themes/clay-toy/theme.json

@@ -0,0 +1,146 @@
+{
+  "id": "clay-toy",
+  "name": "점토 장난감",
+  "metaphor": "말랑한 점토 물체가 눌리고 늘어나며 상태가 바뀐다 — 요청은 튀어 와 꾹 붙는 빨강 공, 모델은 받을 때마다 눌렸다 부푸는 덩어리",
+  "status": "approved",
+  "approvedAt": "2026-10-11",
+  "purposes": [
+    "explainer",
+    "shorts",
+    "promo",
+    "square",
+    "launch"
+  ],
+  "aspect": [
+    "16:9",
+    "9:16",
+    "1:1"
+  ],
+  "vary": {
+    "scheme": [
+      "light"
+    ],
+    "hue": [
+      [
+        0,
+        360
+      ]
+    ],
+    "chroma": [
+      0.85,
+      1.15
+    ],
+    "tint": [
+      0.005,
+      0.035
+    ],
+    "bg": {
+      "light": [
+        0.82,
+        0.95
+      ]
+    },
+    "fonts": [
+      "base",
+      "jua",
+      "bagel",
+      "dongle",
+      "gowun-dodum",
+      "do-hyeon",
+      "sunflower"
+    ],
+    "texture": [
+      "none",
+      "grain"
+    ],
+    "stroke": [
+      0.8,
+      1.3
+    ],
+    "tempo": [
+      0.9,
+      1.15
+    ]
+  },
+  "tags": {
+    "mood": [
+      "말랑한",
+      "친근한",
+      "따뜻한",
+      "장난스러운",
+      "손맛"
+    ],
+    "light": "light",
+    "use": [
+      "설명",
+      "흐름",
+      "소개",
+      "온보딩",
+      "비교",
+      "구조"
+    ],
+    "dims": "3D"
+  },
+  "effects": [
+    {
+      "name": "clayStage",
+      "kind": "layer",
+      "does": "점토 세트 — 하늘색 매트와 둥근 벽, 창빛·가장자리 빛·부드러운 그림자, 컷마다 세트를 비스듬히 내려다보는 카메라(키로만 움직인다)",
+      "use": "const stage = clayStage(root, { ctx, shots: [{ from: -1, to: 1e9, keys: [{ t: 0, pos: [0, 6.8, 12], look: [0, 0.9, 0.2] }] }] })"
+    },
+    {
+      "name": "clayBlob",
+      "kind": "rig",
+      "does": "모델 = 노랑 점토 덩어리 — 떨어져 털썩 앉고 hits 마다 눌렸다 출렁인다, grow(t) 면 값만큼 부푼다",
+      "use": "stage.add(clayBlob(stage, { ctx, pos: [3, 0, -1.7], r: 0.85, at: 0.1, hits: [0.9, 1.3] }))"
+    },
+    {
+      "name": "clayBall",
+      "kind": "rig",
+      "does": "요청 = 빨강 점토 공 — times 마다 포물선으로 튀어 가 닿는 곳에 꾹 붙어 스며든다, rest 면 남아 쌓이고 cube 면 네모 덩이",
+      "use": "stage.add(clayBall(stage, { ctx, from: [-8, 0, 1], to: [-4.2, 2.05, -0.6], times: [0.35, 0.7], dur: 0.38, hop: 1.4 }))"
+    },
+    {
+      "name": "claySnake",
+      "kind": "rig",
+      "does": "점토 띠 — 점들을 잇는 가래떡이 짜여 나온다, linear 면 일정한 빠르기로 dur 초 동안(늘어나는 시간 = 지연)",
+      "use": "stage.add(claySnake(stage, { ctx, points: [[-4.5, 0.3, 0], [0.6, 0.3, -2.6], [3.4, 0.3, -2.6]], tone: \"request\", at: 0.42, dur: 0.6125, linear: true }))"
+    },
+    {
+      "name": "clayDigits",
+      "kind": "rig",
+      "does": "점토 숫자 — 숫자·기호를 가래떡처럼 굽혀 빚는다(획을 따라 짜여 나온다), prints 마다 새 값, hits 마다 눌린다",
+      "use": "stage.add(clayDigits(stage, { ctx, text: \"102\", pos: [0, 0, 0], size: 3.4, align: \"center\", at: 0, hits: [0.22] }))"
+    },
+    {
+      "name": "clayTag",
+      "kind": "rig",
+      "does": "이름표 — 손바닥으로 눌러 편 크림 점토 판에 꾹 찍은 글, 떨어져 앉고 hits 마다 눌린다, 여러 줄·바뀌는 글",
+      "use": "stage.add(clayTag(stage, { ctx, text: \"apis.opengateway.ai/v1\", pos: [-4.2, 0, 1.3], height: 0.5, font: \"mono\", at: 0.06 }))"
+    },
+    {
+      "name": "clayFunnel",
+      "kind": "rig",
+      "does": "한 주소 = 점토 깔때기 — 어디서 온 공이든 위 입으로 들어가 아래 한 구멍으로 나온다, hits 마다 꿀꺽 눌린다",
+      "use": "stage.add(clayFunnel(stage, { ctx, pos: [-4.2, 0, -0.6], at: 0, hits: [0.73, 1.09] }))"
+    },
+    {
+      "name": "clayPie",
+      "kind": "rig",
+      "does": "24 조각 점토 파이 — 조각이 차례로 떨어져 모이고 press(i, t) 만큼 조각이 눌려 낮아진다(값이 내린 시간)",
+      "use": "stage.add(clayPie(stage, { ctx, pos: [-2.4, 0, 0], tone: (h) => (h < 10 ? \"request\" : \"clay\"), at: 1.41, press: (h, t) => (h < 10 && t > 1.8 ? 1 : 0) }))"
+    },
+    {
+      "name": "clayBar",
+      "kind": "rig",
+      "does": "점토 기둥 — height(t) 만큼 위로 늘어나고(넘쳤다 앉는다) 값이 내리면 꾹 눌려 낮아진다, hits 마다 꼭대기가 눌린다",
+      "use": "stage.add(clayBar(stage, { ctx, pos: [0.2, 0, -0.8], r: 0.9, height: (t) => (t < 3.5 ? 3.6 : 0.36), at: 2.85 }))"
+    },
+    {
+      "name": "claySplat",
+      "kind": "rig",
+      "does": "드롭 = 쿵 — 점토 물결 고리가 바닥을 따라 퍼지고 알갱이가 튀어 납작하게 붙는다, 카메라가 한 번 흔들린다(dropBurst)",
+      "use": "stage.add(claySplat(stage, { ctx, pos: [0, 0, 0.8], drop: 0 }))"
+    }
+  ]
+}

package/themes/clay-toy/variants/blush-coral-grain.json

@@ -0,0 +1,126 @@
+{
+  "id": "blush-coral-grain",
+  "world": "clay-toy",
+  "name": "Blush Coral Grain",
+  "desc": "연분홍 바탕에 산호색 강조 · 둥글둥글 귀여운 제목체 · 고운 필름 입자",
+  "params": {
+    "scheme": "light",
+    "bgL": 0.8642,
+    "tint": {
+      "h": 13.6919,
+      "c": 0.031
+    },
+    "inkL": 0.272,
+    "hue": 17.8065,
+    "chroma": 1.127,
+    "fonts": "jua",
+    "texture": {
+      "kind": "grain",
+      "amount": 0.55
+    },
+    "stroke": 0.98,
+    "radius": null,
+    "tempo": 1.12,
+    "density": 1
+  },
+  "style": {
+    "scheme": "light",
+    "colors": {
+      "bg": "#E6CBCC",
+      "surface": "#FFE6DC",
+      "raised": "#FFD6C5",
+      "line": "#90C4CF",
+      "ink": "#391D23",
+      "inkSoft": "#4F313B",
+      "dim": "#42576F",
+      "accent": "#EB3E57",
+      "accentSoft": "#F89C9B",
+      "accentText": "#B50834",
+      "onAccent": "#FFEFEA",
+      "success": "#399765",
+      "danger": "#EB3E57",
+      "warning": "#CA9200",
+      "clay": "#FFB137",
+      "request": "#EB3E57",
+      "plaque": "#FFE6DC",
+      "mat": "#9ACFDA",
+      "rim": "#FFF0EA"
+    },
+    "fonts": {
+      "sans": "\"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "display": "Jua, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "mono": "\"JetBrains Mono\", ui-monospace, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "faces": [
+        {
+          "family": "Jua",
+          "src": "https://cdn.jsdelivr.net/gh/google/fonts@bd8f81ddb5c74d5c8897b36ad88b440266245103/ofl/jua/Jua-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"
+        },
+        {
+          "family": "JetBrains Mono",
+          "src": "https://cdn.jsdelivr.net/npm/@fontsource-variable/jetbrains-mono@5/files/jetbrains-mono-latin-wght-normal.woff2",
+          "weight": "100 800"
+        }
+      ]
+    },
+    "type": {
+      "weightDisplay": 400,
+      "weightBody": 500,
+      "tracking": "0em"
+    },
+    "look": {
+      "texture": {
+        "kind": "grain",
+        "amount": 0.55
+      },
+      "stroke": 0.98,
+      "tempo": 1.12
+    }
+  },
+  "tags": {
+    "mood": [
+      "말랑한",
+      "친근한",
+      "따뜻한",
+      "장난스러운",
+      "손맛",
+      "밝은",
+      "선명한",
+      "아날로그",
+      "귀여운"
+    ],
+    "light": "light",
+    "use": [
+      "설명",
+      "흐름",
+      "소개",
+      "온보딩",
+      "비교",
+      "구조"
+    ],
+    "dims": "3D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-12",
+    "colors": {
+      "ink": 9.97,
+      "inkSoft": 7.45,
+      "dim": 4.86,
+      "accentText": 4.5,
+      "accent": 2.57,
+      "onAccent": 3.53,
+      "success~danger": 0.055,
+      "success~warning": 0.083,
+      "danger~warning": 0.09,
+      "accent~ink": 0.27
+    },
+    "frame": "kf check 통과 — 끝 구간 3.183–4초(입체라 가볍게)·끝 프레임 한 장",
+    "pattern": "hook-number.roll"
+  }
+}

package/themes/clay-toy/variants/blush-coral.json

@@ -0,0 +1,123 @@
+{
+  "id": "blush-coral",
+  "world": "clay-toy",
+  "name": "Blush Coral",
+  "desc": "연분홍 바탕에 산호색 강조 · 손간판 같은 각진 좁은 제목체 · 고운 필름 입자",
+  "params": {
+    "scheme": "light",
+    "bgL": 0.8279,
+    "tint": {
+      "h": 31.0066,
+      "c": 0.0201
+    },
+    "inkL": 0.1951,
+    "hue": 16.2033,
+    "chroma": 0.8599,
+    "fonts": "do-hyeon",
+    "texture": {
+      "kind": "grain",
+      "amount": 0.55
+    },
+    "stroke": 1,
+    "radius": null,
+    "tempo": 0.92,
+    "density": 1
+  },
+  "style": {
+    "scheme": "light",
+    "colors": {
+      "bg": "#D3C2BF",
+      "surface": "#FFD8C4",
+      "raised": "#FFC8A8",
+      "line": "#8EB4BC",
+      "ink": "#230D11",
+      "inkSoft": "#392129",
+      "dim": "#354557",
+      "accent": "#A92D41",
+      "accentSoft": "#DC9697",
+      "accentText": "#98273A",
+      "onAccent": "#FFE3D5",
+      "success": "#2E8E5D",
+      "danger": "#A92D41",
+      "warning": "#BF8A00",
+      "clay": "#EBA648",
+      "request": "#A92D41",
+      "plaque": "#FFD8C4",
+      "mat": "#99C0C7",
+      "rim": "#FFE4D5"
+    },
+    "fonts": {
+      "sans": "\"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "display": "\"Do Hyeon\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "mono": "\"Geist Mono\", ui-monospace, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "faces": [
+        {
+          "family": "Do Hyeon",
+          "src": "https://cdn.jsdelivr.net/gh/google/fonts@bd8f81ddb5c74d5c8897b36ad88b440266245103/ofl/dohyeon/DoHyeon-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"
+        },
+        {
+          "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": 400,
+      "weightBody": 500,
+      "tracking": "0em"
+    },
+    "look": {
+      "texture": {
+        "kind": "grain",
+        "amount": 0.55
+      },
+      "tempo": 0.92
+    }
+  },
+  "tags": {
+    "mood": [
+      "말랑한",
+      "친근한",
+      "따뜻한",
+      "장난스러운",
+      "손맛",
+      "밝은",
+      "아날로그"
+    ],
+    "light": "light",
+    "use": [
+      "설명",
+      "흐름",
+      "소개",
+      "온보딩",
+      "비교",
+      "구조"
+    ],
+    "dims": "3D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-12",
+    "colors": {
+      "ink": 10.78,
+      "inkSoft": 8.58,
+      "dim": 5.71,
+      "accentText": 4.54,
+      "accent": 2.78,
+      "onAccent": 3.89,
+      "success~danger": 0.076,
+      "danger~warning": 0.188,
+      "success~warning": 0.077,
+      "accent~ink": 0.237
+    },
+    "frame": "kf check 통과 — 끝 구간 3.183–4초(입체라 가볍게)·끝 프레임 한 장",
+    "pattern": "hook-number.roll"
+  }
+}