kasaframe 0.1.1 → 0.1.4

package/themes/blueprint/slots.ts

@@ -0,0 +1,88 @@
+import { clamp, ease, rand, spring, type Style } from "@kasaframe/core";
+import type { ThemeSlots } from "@kasaframe/themes/slots";
+import { layer } from "@kasaframe/themes/slotkit";
+import { draftSheet, exposure, lettering, penLine } from "./effects.ts";
+
+// 장면 문법 패턴이 테마 이름 없이 부르는 자리 — 청사진 결로. 판은 펜이 한 바퀴 긋는 도면 칸,
+// 앉기는 그 아래 치수선이 가운데서 뻗는 것, 선은 외형선이 그어지고 그 위로 흐름 방향 쇄선이 흐른다
+
+const NS = "http://www.w3.org/2000/svg";
+
+export const slots: ThemeSlots = {
+  surface(el, { ctx }) {
+    return draftSheet(el, { ctx });
+  },
+
+  // 도면 칸 — 펜이 위 → 오른쪽 → 아래 → 왼쪽 차례로 테두리를 긋고, 칸 안은 한 단 밝은 청색. 강조 칸은 빨간 색연필 테두리
+  panel(el, { at, tone }) {
+    const box = layer(el, "inset:0", true);
+    const ink = tone === "accent" ? "var(--kf-accent)" : "var(--kf-ink)";
+    const face = layer(box, "inset:0;background:var(--kf-surface)");
+    const edges = [
+      layer(box, `left:0;right:0;top:0;height:4px;background:${ink};transform-origin:0 50%`),
+      layer(box, `top:0;bottom:0;right:0;width:4px;background:${ink};transform-origin:50% 0`),
+      layer(box, `left:0;right:0;bottom:0;height:4px;background:${ink};transform-origin:100% 50%`),
+      layer(box, `top:0;bottom:0;left:0;width:4px;background:${ink};transform-origin:50% 100%`),
+    ];
+    return (t) => {
+      box.style.visibility = t >= at ? "visible" : "hidden";
+      face.style.opacity = clamp((t - at) / 0.2).toFixed(3);
+      edges.forEach((e, i) => {
+        const k = ease.inOutCubic(clamp((t - at - i * 0.07) / 0.1));
+        e.style.transform = i % 2 ? `scaleY(${k.toFixed(4)})` : `scaleX(${k.toFixed(4)})`;
+      });
+    };
+  },
+
+  // 치수를 대는 순간 — 판 아래 보조선 둘이 서고 치수선이 가운데서 양 끝 화살촉까지 뻗는다, 판은 한 번 툭 내려앉는다
+  land(el, { at, seed }) {
+    const dim = layer(el, "left:0;right:0;bottom:-40px;height:24px;visibility:hidden");
+    const bar = layer(dim, "left:0;right:0;top:11px;height:2px;background:var(--kf-ink)");
+    const ticks = [layer(dim, "left:0;top:-16px;width:2px;height:40px;background:var(--kf-ink)"), layer(dim, "right:0;top:-16px;width:2px;height:40px;background:var(--kf-ink)")];
+    const heads = [
+      layer(dim, "left:2px;top:6px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:22px solid var(--kf-ink)"),
+      layer(dim, "right:2px;top:6px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:22px solid var(--kf-ink)"),
+    ];
+    const kick = 260 + rand(seed, 0) * 120;
+    return (t): Style => {
+      dim.style.visibility = t >= at ? "visible" : "hidden";
+      const e = clamp((t - at) / 0.12);
+      for (const k of ticks) k.style.transform = `scaleY(${ease.outCubic(e).toFixed(4)})`;
+      const g = ease.inOutCubic(clamp((t - at - 0.1) / 0.24));
+      bar.style.transform = `scaleX(${g.toFixed(4)})`;
+      for (const h of heads) h.style.visibility = g >= 1 ? "visible" : "hidden";
+      if (t < at) return {};
+      return { y: spring(t - at, { from: 0, to: 0, velocity: kick, stiffness: 340, damping: 18 }) };
+    };
+  },
+
+  write(el, { ctx, text, at, dur }) {
+    return lettering(el, { ctx, text, at, dur });
+  },
+
+  // 외형선이 그어지고, 다 그은 뒤엔 그 선 위로 흐름 방향 쇄선이 흐른다
+  trace(el, { ctx, points, at, dur, tone }) {
+    const draw = penLine(el, { ctx, shapes: [{ poly: points }], at, dur, color: tone === "accent" ? "accent" : "ink" });
+    const s = document.createElementNS(NS, "svg");
+    s.setAttribute("width", String(ctx.meta.width));
+    s.setAttribute("height", String(ctx.meta.height));
+    s.style.cssText = "position:absolute;left:0;top:0;overflow:visible;pointer-events:none";
+    const flow = document.createElementNS(NS, "path");
+    flow.setAttribute("d", `M${points.map((p) => `${p[0]} ${p[1]}`).join(" L")}`);
+    flow.setAttribute("fill", "none");
+    flow.setAttribute("stroke", ctx.style.colors.bg);
+    flow.setAttribute("stroke-width", "2");
+    flow.setAttribute("stroke-dasharray", "10 26");
+    s.append(flow);
+    el.append(s);
+    return (t) => {
+      draw(t);
+      flow.style.visibility = t >= at + dur ? "visible" : "hidden";
+      flow.setAttribute("stroke-dashoffset", (-(t - at - dur) * 120).toFixed(1));
+    };
+  },
+
+  drop(el, { ctx, drop }) {
+    return exposure(el, { ctx, drop });
+  },
+};

package/themes/blueprint/style.json

@@ -0,0 +1,114 @@
+{
+  "name": "blueprint",
+  "label": "청사진 도면 — 정보가 제도되고 숫자는 치수로 잰다",
+  "scheme": "dark",
+  "colors": {
+    "bg": "#1B4E7B",
+    "surface": "#205886",
+    "raised": "#28639A",
+    "line": "#3A70A1",
+    "ink": "#F1F7FB",
+    "inkSoft": "#CFE2F0",
+    "dim": "#A9C7DF",
+    "accent": "#FF8F80",
+    "accentSoft": "#5E4B6E",
+    "accentText": "#FFA597",
+    "onAccent": "#1B4E7B",
+    "success": "#F1F7FB",
+    "danger": "#FF8F80",
+    "warning": "#FFD789",
+    "grid": "#25598A",
+    "gridMajor": "#30679A"
+  },
+  "fonts": {
+    "sans": "\"Barlow Condensed\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+    "display": "\"Barlow Condensed\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+    "mono": "\"B612 Mono\", ui-monospace, \"Pretendard Variable\", \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+    "faces": [
+      {
+        "family": "Barlow Condensed",
+        "src": "https://cdn.jsdelivr.net/npm/@fontsource/barlow-condensed@5/files/barlow-condensed-latin-500-normal.woff2",
+        "weight": "500"
+      },
+      {
+        "family": "Barlow Condensed",
+        "src": "https://cdn.jsdelivr.net/npm/@fontsource/barlow-condensed@5/files/barlow-condensed-latin-600-normal.woff2",
+        "weight": "600"
+      },
+      {
+        "family": "Barlow Condensed",
+        "src": "https://cdn.jsdelivr.net/npm/@fontsource/barlow-condensed@5/files/barlow-condensed-latin-700-normal.woff2",
+        "weight": "700"
+      },
+      {
+        "family": "B612 Mono",
+        "src": "https://cdn.jsdelivr.net/npm/@fontsource/b612-mono@5/files/b612-mono-latin-400-normal.woff2",
+        "weight": "400"
+      },
+      {
+        "family": "B612 Mono",
+        "src": "https://cdn.jsdelivr.net/npm/@fontsource/b612-mono@5/files/b612-mono-latin-700-normal.woff2",
+        "weight": "700"
+      },
+      {
+        "family": "Pretendard Variable",
+        "src": "https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/variable/woff2/PretendardVariable.woff2",
+        "weight": "45 920"
+      }
+    ]
+  },
+  "type": {
+    "hero": 220,
+    "title": 96,
+    "body": 44,
+    "caption": 32,
+    "weightDisplay": 700,
+    "weightBody": 600,
+    "tracking": "0.02em"
+  },
+  "radius": {
+    "sm": 0,
+    "md": 0,
+    "lg": 0,
+    "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": "inOutCubic",
+    "durations": {
+      "fast": 0.12,
+      "base": 0.3,
+      "slow": 0.6
+    }
+  },
+  "theme": {
+    "inks": [
+      "#1B4E7B 청사진 종이(프러시안 블루) — 바탕은 꼼짝 않는다",
+      "#F1F7FB 선과 글 — 빛을 못 받아 하얗게 남은 자리",
+      "#FF8F80 빨간 색연필 — 개정·검토 표시에만",
+      "grid · gridMajor 제도 모눈 — 옅게, 움직이지 않는다"
+    ],
+    "texture": "단색 청색 위 흰 선. 선 종류가 뜻이다 — 외형선(굵은 실선)·숨은선(파선)·중심선(일점쇄선)·가상선(이점쇄선)·치수선(가는 실선과 화살표). 단면은 45° 해칭. 그림자·그라데이션·종이결 없음",
+    "movement": "제도하는 순서대로 — 펜 끝이 선을 긋고, 보조선이 서고 치수선이 가운데서 양쪽으로 뻗어 수가 앉고, 절단선이 지나가며 단면이 해칭으로 차고, 품번 풍선이 붙는다. 드롭 한 번만 노광 섬광"
+  },
+  "notes": [
+    "청사진 색은 1925 미 해군 노퍽 공창 도면에서 잰 #1C5B7E·#275577 을 조금 짙게.",
+    "빨간 색연필은 개정 구름·Δ 표·강조 수 하나에만. 작은 글은 ink.",
+    "카메라 이동 없음 — 도면은 제도대에 붙어 있다. 구도는 마디마다 새 도면 칸으로 컷."
+  ]
+}

package/themes/blueprint/theme.json

@@ -0,0 +1,137 @@
+{
+  "id": "blueprint",
+  "name": "청사진 도면",
+  "metaphor": "정보가 청사진 도면으로 제도된다 — 펜이 외형을 긋고, 치수선이 숫자를 재고, 절단선이 지나가며 속이 단면으로 드러난다",
+  "status": "approved",
+  "approvedAt": "2026-10-11",
+  "purposes": [
+    "explainer",
+    "launch",
+    "promo",
+    "demo",
+    "shorts"
+  ],
+  "aspect": [
+    "16:9",
+    "1:1",
+    "9:16"
+  ],
+  "vary": {
+    "scheme": [
+      "dark"
+    ],
+    "hue": [
+      [
+        5,
+        55
+      ]
+    ],
+    "chroma": [
+      0.85,
+      1.1
+    ],
+    "bg": {
+      "dark": [
+        0.32,
+        0.46
+      ]
+    },
+    "fonts": [
+      "base",
+      "plex-mono",
+      "space-mono",
+      "plex",
+      "suit"
+    ],
+    "texture": [
+      "none"
+    ],
+    "tempo": [
+      0.9,
+      1.15
+    ]
+  },
+  "tags": {
+    "mood": [
+      "정밀",
+      "기술적",
+      "차분한",
+      "도면",
+      "구조적"
+    ],
+    "light": "dark",
+    "use": [
+      "구조",
+      "구성 요소",
+      "치수",
+      "비교",
+      "설계",
+      "아키텍처",
+      "개정",
+      "설명"
+    ],
+    "dims": "2D"
+  },
+  "effects": [
+    {
+      "name": "draftSheet",
+      "kind": "layer",
+      "does": "도면 종이 — 청사진 바탕·옅은 제도 모눈·도면 테두리, 꼼짝 않는다",
+      "use": "draftSheet(layer(root), { ctx })  // 모눈 없이: { ctx, grid: false }"
+    },
+    {
+      "name": "tSquare",
+      "kind": "layer",
+      "does": "T자 — 제도판 왼쪽 머리에 물린 긴 자가 지금 긋는 줄 높이로 미끄러져 가고 그 사이에도 다음 줄을 향해 늘 움직인다(눈금 달린 투명한 자)",
+      "use": "const rule = tSquare(layer(root), { ctx, stops: [[0, 230], [0.29, 560], [0.64, 840]] })  // [장면 안 초, 자 윗변 y]"
+    },
+    {
+      "name": "penLine",
+      "kind": "layer",
+      "does": "제도선 — 펜 끝이 꼴(선·꺾은선·사각·원)을 차례로 긋는다. 선 종류가 뜻: visible 외형 · hidden 숨은 · center 중심 · phantom 가상(폴백·다른 자리) · cut 절단(letter 를 주면 양 끝에 보는 쪽 화살표와 A … A) · thin",
+      "use": "const part = penLine(el, { ctx, shapes: [{ rect: [400, 300, 600, 200] }, { circle: [700, 400, 40] }], at: 0.3, dur: 0.4 })  // 절단선: { ctx, shapes: [{ line: [120, 425, 1800, 425] }], kind: \"cut\", letter: \"A\", side: -1, at: 1.35 }"
+    },
+    {
+      "name": "dimension",
+      "kind": "layer",
+      "does": "치수 — 보조선이 서고 치수선이 가운데서 양 끝 화살촉까지 뻗는 동안 수가 0 에서 값까지 잰다(숫자는 늘 치수로). text 를 주면 낱말을 잰다",
+      "use": "const dim = dimension(el, { ctx, from: [400, 300], to: [1700, 300], offset: -40, at: 0.4, value: 41, size: 44 })"
+    },
+    {
+      "name": "hatch",
+      "kind": "layer",
+      "does": "단면 해칭 — 45° 가는 선이 한쪽부터 한 줄씩 차오른다. 잘린 면·채운 양(구간·비율·걸린 시간)에",
+      "use": "const cut = hatch(el, { ctx, rect: [120, 470, 700, 70], at: 0.36, dur: 0.3 })"
+    },
+    {
+      "name": "balloon",
+      "kind": "layer",
+      "does": "품번 풍선 — 부품 위 점에서 지시선이 뻗고 번호 풍선이 톡 붙는다. kind datum 은 기준면 표(모든 치수를 재는 한 기준 = 한 주소)",
+      "use": "const no = balloon(el, { ctx, x: 560, y: 180, to: [480, 240], text: \"1\", at: 0.3 })  // 기준면: { …, text: \"A\", kind: \"datum\" }"
+    },
+    {
+      "name": "revisionCloud",
+      "kind": "layer",
+      "does": "개정 구름 — 바뀐 곳(가격·설정)을 빨간 색연필 구름이 한 바퀴 두르고 모서리에 개정 삼각 Δ 가 붙는다",
+      "use": "const rev = revisionCloud(el, { ctx, rect: [96, 330, 748, 236], at: 0.72, rev: \"1\" })"
+    },
+    {
+      "name": "titleBlock",
+      "kind": "layer",
+      "does": "표제란 — 칸 상자가 그어지고 칸마다 이름·값이 차례로 찍힌다(이름·주소·날짜) — 끝 카드",
+      "use": "const tb = titleBlock(el, { ctx, x: 360, y: 420, w: 1200, at: 0, rows: [{ label: \"이름\", value: \"OpenGateway\", h: 130 }, { label: \"주소\", value: \"opengateway.ai\", h: 120 }] })"
+    },
+    {
+      "name": "lettering",
+      "kind": "layer",
+      "does": "제도 글씨 — 옅은 안내선 두 줄이 먼저 서고 그 사이에 글자가 한 자씩 찍힌다(다 찍으면 안내선은 걷힌다). 글꼴·자리는 그대로",
+      "use": "const name = lettering(label, { ctx, text: \"Anthropic\", at: 0.64, dur: 0.24 })"
+    },
+    {
+      "name": "exposure",
+      "kind": "layer",
+      "does": "드롭 = 노광 — 흰 섬광 한 번과 노광 램프 띠가 위에서 아래로 지나간다, 흔들림을 돌려준다",
+      "use": "const s = expose(t); applyStyle(frame, s.shake)  // expose = exposure(layer(page), { ctx, drop: 0 })"
+    }
+  ]
+}

package/themes/blueprint/variants/deep-rose-2.json

@@ -0,0 +1,90 @@
+{
+  "id": "deep-rose-2",
+  "world": "blueprint",
+  "name": "Deep Rose 2",
+  "desc": "깊은 청록 바탕에 장밋빛 강조",
+  "params": {
+    "scheme": "dark",
+    "bgL": 0.334,
+    "tint": {
+      "h": 227.487,
+      "c": 0.0912
+    },
+    "inkL": 0.9728,
+    "hue": 7.391,
+    "chroma": 0.9844,
+    "fonts": "base",
+    "texture": {
+      "kind": "none",
+      "amount": 0
+    },
+    "stroke": 1,
+    "radius": null,
+    "tempo": 1.09,
+    "density": 1
+  },
+  "style": {
+    "scheme": "dark",
+    "colors": {
+      "bg": "#003C50",
+      "surface": "#00475D",
+      "raised": "#005570",
+      "line": "#006481",
+      "ink": "#F0F8FA",
+      "inkSoft": "#C8E1E8",
+      "dim": "#9CC3D1",
+      "accent": "#F1839B",
+      "accentSoft": "#3E3B5E",
+      "accentText": "#F49BAC",
+      "onAccent": "#003C50",
+      "success": "#F0F8FA",
+      "danger": "#F1839B",
+      "warning": "#FFD789",
+      "grid": "#004961",
+      "gridMajor": "#005975"
+    },
+    "look": {
+      "tempo": 1.09
+    }
+  },
+  "tags": {
+    "mood": [
+      "정밀",
+      "기술적",
+      "차분한",
+      "도면",
+      "구조적",
+      "어두운"
+    ],
+    "light": "dark",
+    "use": [
+      "구조",
+      "구성 요소",
+      "치수",
+      "비교",
+      "설계",
+      "아키텍처",
+      "개정",
+      "설명"
+    ],
+    "dims": "2D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-12",
+    "colors": {
+      "ink": 10.97,
+      "inkSoft": 8.66,
+      "dim": 6.27,
+      "accentText": 5.73,
+      "accent": 4.79,
+      "onAccent": 4.79,
+      "success~danger": 0.229,
+      "success~warning": 0.114,
+      "danger~warning": 0.178,
+      "accent~ink": 0.229
+    },
+    "frame": "kf check 통과 — 표준 장면 0–4초",
+    "pattern": "hook-number.counter"
+  }
+}

package/themes/blueprint/variants/deep-rose-suit.json

@@ -0,0 +1,117 @@
+{
+  "id": "deep-rose-suit",
+  "world": "blueprint",
+  "name": "Deep Rose Suit",
+  "desc": "깊은 청록 바탕에 장밋빛 강조 · 또렷한 기하 고딕",
+  "params": {
+    "scheme": "dark",
+    "bgL": 0.3877,
+    "tint": {
+      "h": 225.6129,
+      "c": 0.0973
+    },
+    "inkL": 0.9728,
+    "hue": 5.5169,
+    "chroma": 1.0511,
+    "fonts": "suit",
+    "texture": {
+      "kind": "none",
+      "amount": 0
+    },
+    "stroke": 1,
+    "radius": null,
+    "tempo": 1.06,
+    "density": 1
+  },
+  "style": {
+    "scheme": "dark",
+    "colors": {
+      "bg": "#004C62",
+      "surface": "#00576E",
+      "raised": "#006380",
+      "line": "#00718F",
+      "ink": "#F0F8F9",
+      "inkSoft": "#CAE3EA",
+      "dim": "#9DC9D6",
+      "accent": "#FC86A3",
+      "accentSoft": "#4A486F",
+      "accentText": "#FD9EB2",
+      "onAccent": "#004C62",
+      "success": "#F0F8F9",
+      "danger": "#FC86A3",
+      "warning": "#FFD789",
+      "grid": "#005872",
+      "gridMajor": "#006784"
+    },
+    "fonts": {
+      "sans": "\"SUIT Variable\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "display": "\"SUIT Variable\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "mono": "\"JetBrains Mono\", ui-monospace, \"SUIT Variable\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "faces": [
+        {
+          "family": "SUIT Variable",
+          "src": "https://cdn.jsdelivr.net/gh/sun-typeface/SUIT@2.0.5/fonts/variable/ttf/SUIT-Variable.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": "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": 800,
+      "weightBody": 500,
+      "tracking": "-0.02em"
+    },
+    "look": {
+      "tempo": 1.06
+    }
+  },
+  "tags": {
+    "mood": [
+      "정밀",
+      "기술적",
+      "차분한",
+      "도면",
+      "구조적",
+      "어두운"
+    ],
+    "light": "dark",
+    "use": [
+      "구조",
+      "구성 요소",
+      "치수",
+      "비교",
+      "설계",
+      "아키텍처",
+      "개정",
+      "설명"
+    ],
+    "dims": "2D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-12",
+    "colors": {
+      "ink": 8.8,
+      "inkSoft": 7.1,
+      "dim": 5.3,
+      "accentText": 4.84,
+      "accent": 4.1,
+      "onAccent": 4.1,
+      "success~danger": 0.209,
+      "success~warning": 0.114,
+      "danger~warning": 0.161,
+      "accent~ink": 0.209
+    },
+    "frame": "kf check 통과 — 표준 장면 0–4초",
+    "pattern": "hook-number.counter"
+  }
+}

package/themes/blueprint/variants/deep-rose.json

@@ -0,0 +1,117 @@
+{
+  "id": "deep-rose",
+  "world": "blueprint",
+  "name": "Deep Rose",
+  "desc": "깊은 청록 바탕에 장밋빛 강조 · 레트로 고정폭 라틴 제목",
+  "params": {
+    "scheme": "dark",
+    "bgL": 0.4532,
+    "tint": {
+      "h": 226.7604,
+      "c": 0.085
+    },
+    "inkL": 0.9137,
+    "hue": 6.6644,
+    "chroma": 0.918,
+    "fonts": "space-mono",
+    "texture": {
+      "kind": "none",
+      "amount": 0
+    },
+    "stroke": 1,
+    "radius": null,
+    "tempo": 0.95,
+    "density": 1
+  },
+  "style": {
+    "scheme": "dark",
+    "colors": {
+      "bg": "#075F7A",
+      "surface": "#0D6883",
+      "raised": "#067294",
+      "line": "#2B7C99",
+      "ink": "#F7FDFF",
+      "inkSoft": "#BCD5DC",
+      "dim": "#AED3E0",
+      "accent": "#F0899F",
+      "accentSoft": "#5B597C",
+      "accentText": "#FFBBC7",
+      "onAccent": "#060606",
+      "success": "#F7FDFF",
+      "danger": "#F0899F",
+      "warning": "#FFD789",
+      "grid": "#106987",
+      "gridMajor": "#1D7593"
+    },
+    "fonts": {
+      "sans": "\"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", sans-serif",
+      "display": "\"Space Mono\", \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "mono": "\"Space Mono\", ui-monospace, \"Pretendard Variable\", Pretendard, \"Noto Sans KR\", \"Apple SD Gothic Neo\", monospace",
+      "faces": [
+        {
+          "family": "Space Mono",
+          "src": "https://cdn.jsdelivr.net/gh/google/fonts@bd8f81ddb5c74d5c8897b36ad88b440266245103/ofl/spacemono/SpaceMono-Regular.ttf",
+          "weight": "400"
+        },
+        {
+          "family": "Space Mono",
+          "src": "https://cdn.jsdelivr.net/gh/google/fonts@bd8f81ddb5c74d5c8897b36ad88b440266245103/ofl/spacemono/SpaceMono-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"
+        }
+      ]
+    },
+    "type": {
+      "weightDisplay": 700,
+      "weightBody": 500,
+      "tracking": "-0.01em"
+    },
+    "look": {
+      "tempo": 0.95
+    }
+  },
+  "tags": {
+    "mood": [
+      "정밀",
+      "기술적",
+      "차분한",
+      "도면",
+      "구조적",
+      "어두운"
+    ],
+    "light": "dark",
+    "use": [
+      "구조",
+      "구성 요소",
+      "치수",
+      "비교",
+      "설계",
+      "아키텍처",
+      "개정",
+      "설명"
+    ],
+    "dims": "2D"
+  },
+  "check": {
+    "ok": true,
+    "at": "2026-10-12",
+    "colors": {
+      "ink": 7,
+      "inkSoft": 4.66,
+      "dim": 4.5,
+      "accentText": 4.5,
+      "accent": 3,
+      "onAccent": 8.5,
+      "success~danger": 0.239,
+      "success~warning": 0.128,
+      "danger~warning": 0.166,
+      "accent~ink": 0.239
+    },
+    "frame": "kf check 통과 — 표준 장면 0–4초",
+    "pattern": "hook-number.counter"
+  }
+}