Skills › HyperFrames › hyperframes › FRAME.md

FRAME.md

275 lines · skills/hyperframes/assets/frame-presets/blockframe/FRAME.md at a595755

Open on GitHub

1---

2version: alpha

3name: BlockFrame — Frame (video / frame layer)

4description: >

5 Video-first companion to BlockFrame's design.md. The unit is the frame (1920×1080). Atoms are

6 identical and sacred — 4px black borders + 8px hard offset shadows, the five-pastel candy palette

7 (pink/blue/green/yellow/cream) plus black/white/off-white, Inter 800–900 uppercase display +

8 Space Grotesk label chrome, square corners, label-pills, tilted decorations, star bursts, stripe

9 blocks, dot grids. Composition + frame scale rewritten. Motion out of scope.

10unit: the frame — 1920×1080 primary; 9:16 and 1:1 documented

11principle: atoms are sacred · composition is free · numbers come from the script

13colors:

14 black: "#000000"

15 white: "#FFFFFF"

16 offwhite: "#FFFDF5"

17 pink: "#FE90E8"

18 blue: "#C0F7FE"

19 green: "#99E885"

20 yellow: "#F7CB46"

21 cream: "#FFDC8B"

23borders: { primary: "4px solid black", thin: "3px solid black" }

24shadows: { default: "8px 8px 0 black", small: "4px 4px 0 black", hover: "6px 6px 0 black", close-yellow: "12px 12px 0 yellow", close-white: "6px 6px 0 white" }

26typography:

27 # — reading + chrome ramp —

28 body: { fontFamily: "Inter", cqw: 0.95, weight: 500, lineHeight: 1.6 }

29 card-title:{ fontFamily: "Inter", cqw: 1.15, weight: 700, upper: true, lineHeight: 1.2 }

30 label: { fontFamily: "Space Grotesk", px: 13, weight: 600, tracking: "0.08em", upper: true }

31 counter: { fontFamily: "Space Grotesk", px: 14, weight: 700, tracking: "0.1em", upper: true }

32 # — display ramp (Inter 800–900, uppercase, negative tracking) —

33 heading-md:{ fontFamily: "Inter", cqw: 2.1, weight: 700, lineHeight: 1.1, tracking: "-0.01em", upper: true }

34 quote-text:{ fontFamily: "Inter", cqw: 2.7, weight: 900, lineHeight: 1.15, tracking: "-0.02em", upper: true }

35 stat-number:{ fontFamily: "Inter", cqw: 3.3, weight: 900, lineHeight: 1.0 }

36 heading-lg:{ fontFamily: "Inter", cqw: 3.3, weight: 800, lineHeight: 1.0, tracking: "-0.02em", upper: true }

37 close-title:{ fontFamily: "Inter", cqw: 4.2, weight: 900, lineHeight: 0.95, tracking: "-0.03em", upper: true }

38 heading-xl:{ fontFamily: "Inter", cqw: 5.0, weight: 900, lineHeight: 0.95, tracking: "-0.03em", upper: true }

40spacing:

41 slide-pad: "3.1cqw" # 60px @1920

42 gap-md: "1.7cqw"

44components:

45 card-elevated:

46 backgroundColor: "{colors.white}"

47 border: "0.4cqw solid {colors.black}"

48 rounded: "0"

49 shadow: "0.8cqw 0.8cqw 0 {colors.black}"

50 description: "Primary card. Border/shadow coupled: 4px↔8px, 3px↔4px."

51 card-small:

52 backgroundColor: "{colors.white}"

53 border: "0.3cqw solid {colors.black}"

54 rounded: "0"

55 shadow: "0.4cqw 0.4cqw 0 {colors.black}"

56 description: "Stat cards, team cards, timeline steps."

57 label-pill:

58 border: "0.3cqw solid {colors.black}"

59 backgroundColor: "any pastel / {colors.white}"

60 rounded: "9999px"

61 shadow: "0.4cqw 0.4cqw 0 {colors.black}"

62 typography: "{typography.label}"

63 description: "The universal eyebrow — never plain text."

64 button-primary:

65 backgroundColor: "{colors.yellow}"

66 textColor: "{colors.black}"

67 border: "0.3cqw solid {colors.black}"

68 rounded: "0"

69 shadow: "0.4cqw 0.4cqw 0 {colors.black}"

70 typography: "Inter 700"

71 description: "The CTA."

72 star-burst:

73 backgroundColor: "any pastel"

74 border: "0.3cqw solid {colors.black}"

75 clip: "10-point clip-path star"

76 description: "Corner attention-grabber."

77 stripe-block:

78 backgroundImage: "45° {colors.black} + pastel diagonal stripes"

79 border: "0.3cqw solid {colors.black}"

80 description: "Poster decoration."

81 bg-dot-grid:

82 backgroundImage: "radial-dot ~1.2px dots, 24px grid, {colors.black}"

83 description: "Faint corner/ground overlay."

84 tilt-deco:

85 transform: "rotate(±2°–12°)"

86 description: "Rotated rectangle/badge/star. Stat cards alternate −2/+2°. The grid-puncture signature."

87 stat-deco-dot:

88 backgroundColor: "any pastel"

89 border: "2px solid {colors.black}"

90 rounded: "50%"

91 size: "12px"

92 description: "The ONLY round shape, pinned to stat cards."

93 close-frame:

94 backgroundColor: "{colors.black}"

95 textColor: "{colors.white}"

96 border: "0.4cqw solid {colors.white}"

97 rounded: "0"

98 shadow: "1.2cqw 1.2cqw 0 {colors.yellow}"

99 description: "Inverted closer — the only colored shadow."

100---

101

102# BlockFrame — Frame (video / frame layer)

103

BlockFrame — Frame (video / frame layer)

Raw lines 1 to 103

104## Overview

105

106BlockFrame at frame scale is a **maximalist neobrutalist** system on five laws: every region has a

1074px black border, every elevated element an 8px hard offset shadow, every corner square, every

108accent a saturated pastel, and every layout allowed to be a little crooked. The joy is the

109deliberate collision — bordered cards meeting bordered cards, shadows stacking, tilted decorations

110puncturing the grid.

111

112The voice is **Inter** at weight 800–900 in tight uppercase with negative tracking (display) +

113weight 500 sentence body, and **Space Grotesk** weight 600 uppercase 0.08em as the label/chrome

114voice. Five candy pastels (pink/blue/green/yellow/cream) cycle as full-bleed grounds across frames

115— the color cycling is the primary rhythm. Depth is **hard offset shadow** (8px/4px, solid black,

116zero blur, bottom-right); the close-frame's 12px yellow shadow is the one colored exception.

117

118**Key characteristics at frame scale:**

119

120- **4px black borders + 8px hard shadows** on primary cards; 3px + 4px on chrome (weights coupled).

121- **Five-pastel palette** cycled as full-bleed grounds; black/white/off-white structural.

122- **Inter 800–900 uppercase** negative-tracked display; **Space Grotesk** label chrome.

123- **Square corners** everywhere (only the stat-deco dot is round); **tilted decorations** puncture the grid.

124- **Label-pills** open every region; star bursts, stripe blocks, dot grids are reusable attention units.

125- **Comfortably dense** — packed reads as authoritative; empty corners read as broken.

126

Overview

BlockFrame at frame scale is a maximalist neobrutalist system on five laws: every region has a 4px black border, every elevated element an 8px hard offset shadow, every corner square, every accent a saturated pastel, and every layout allowed to be a little crooked. The joy is the deliberate collision — bordered cards meeting bordered cards, shadows stacking, tilted decorations puncturing the grid.

The voice is Inter at weight 800–900 in tight uppercase with negative tracking (display) + weight 500 sentence body, and Space Grotesk weight 600 uppercase 0.08em as the label/chrome voice. Five candy pastels (pink/blue/green/yellow/cream) cycle as full-bleed grounds across frames — the color cycling is the primary rhythm. Depth is hard offset shadow (8px/4px, solid black, zero blur, bottom-right); the close-frame's 12px yellow shadow is the one colored exception.

Key characteristics at frame scale:

4px black borders + 8px hard shadows on primary cards; 3px + 4px on chrome (weights coupled).
Five-pastel palette cycled as full-bleed grounds; black/white/off-white structural.
Inter 800–900 uppercase negative-tracked display; Space Grotesk label chrome.
Square corners everywhere (only the stat-deco dot is round); tilted decorations puncture the grid.
Label-pills open every region; star bursts, stripe blocks, dot grids are reusable attention units.
Comfortably dense — packed reads as authoritative; empty corners read as broken.

Raw lines 104 to 126

127## The Frame

128

The Frame

Raw lines 127 to 128

129### Frame Craft Bar

130

131Three eyeball tests gate every frame before any structural check:

132

133- **Squint** — one Inter display moment dominates at 3–6× its neighbor; cards read as a system, not rivals.

134- **Silence** — cover/quote/close keep air (decorations, not content); the **feature-card and stat grids are the dense exception**.

135- **Restraint** — the 4px→08px / 3px→4px coupling holds; black borders only (white on close); pastel ground **cycles** one per frame; no sixth pastel.

136- **Reference** — aim at a **zine / 1990s sticker-book / toy-packaging spread** (bordered blocks, tilted decorations); failure looks like a **flat, borderless, blurred-shadow web card grid**.

137

138- **Primary:** 1920×1080 (16:9). Display authored in **`cqw`** (`px ÷ 1920 × 100 = cqw`).

139- **Vertical:** 1080×1920 (9:16). **Square:** 1080×1080 (1:1).

140- **Safe area:** `slide-pad` ~3.1cqw; decorations may bleed off edges.

141

142**The container law (load-bearing).** Every frame ground sets `container-type: size`; ALL

143frame-relative units are `cqw`/`cqh` against it — never `vw`. Borders/shadows scale in `cqw` so the

1444px↔8px coupling holds proportionally; corners stay square.

145

Frame Craft Bar

Three eyeball tests gate every frame before any structural check:

Squint — one Inter display moment dominates at 3–6× its neighbor; cards read as a system, not rivals.
Silence — cover/quote/close keep air (decorations, not content); the feature-card and stat grids are the dense exception.
Restraint — the 4px→08px / 3px→4px coupling holds; black borders only (white on close); pastel ground cycles one per frame; no sixth pastel.
Reference — aim at a zine / 1990s sticker-book / toy-packaging spread (bordered blocks, tilted decorations); failure looks like a flat, borderless, blurred-shadow web card grid.

Primary: 1920×1080 (16:9). Display authored in **cqw** (px ÷ 1920 × 100 = cqw).
Vertical: 1080×1920 (9:16). Square: 1080×1080 (1:1).
Safe area: slide-pad ~3.1cqw; decorations may bleed off edges.

The container law (load-bearing). Every frame ground sets container-type: size; ALL frame-relative units are cqw/cqh against it — never vw. Borders/shadows scale in cqw so the 4px↔8px coupling holds proportionally; corners stay square.

Raw lines 129 to 145

146## Colors

147

148Tokens identical to the source. `{colors.offwhite}` is the default ground, but frames **cycle**

149through `{colors.cream}`/`blue`/`pink`/`green`/`yellow` grounds — the cycle is the rhythm.

150`{colors.black}` is every border + structural text; `{colors.white}` is card fills. The five pastels

151are interchangeable with **no semantic meaning** — pair by juxtaposition (pink+blue+green trio,

152cream+yellow warm pair). `{colors.yellow}` is the CTA + the one colored (close) shadow;

153`{colors.black}` ground is the close surface. **No sixth pastel.**

154

Colors

Tokens identical to the source. {colors.offwhite} is the default ground, but frames cycle through {colors.cream}/blue/pink/green/yellow grounds — the cycle is the rhythm. {colors.black} is every border + structural text; {colors.white} is card fills. The five pastels are interchangeable with no semantic meaning — pair by juxtaposition (pink+blue+green trio, cream+yellow warm pair). {colors.yellow} is the CTA + the one colored (close) shadow; {colors.black} ground is the close surface. No sixth pastel.

Raw lines 146 to 154

155## Typography

156

157Two ramps. The **reading/chrome ramp** (Inter body 0.95cqw weight 500, Space Grotesk labels in px)

158carries copy + chrome; the **display ramp** (Inter `heading-md` 2.1cqw → `heading-xl` 5cqw, weight

159800–900 uppercase) carries every headline + stat.

160

161- **Legibility floor:** any load-bearing line ≥ **1.4cqw**; px labels are chrome only.

162- **Fit-to-measure:** size the headline to its length. Cap the block at **≤ 78cqw**; ≤3 words → `heading-xl`; 4–6 → `heading-lg`; 7+ → `heading-md`.

163- **Inter display is uppercase, weight 800–900, negative-tracked** (−0.01..−0.03em); body weight 500 sentence case; **Space Grotesk labels uppercase 0.08em**. No sentence-case display, no untracked display.

164

Typography

Two ramps. The reading/chrome ramp (Inter body 0.95cqw weight 500, Space Grotesk labels in px) carries copy + chrome; the display ramp (Inter heading-md 2.1cqw → heading-xl 5cqw, weight 800–900 uppercase) carries every headline + stat.

Legibility floor: any load-bearing line ≥ 1.4cqw; px labels are chrome only.
Fit-to-measure: size the headline to its length. Cap the block at ≤ 78cqw; ≤3 words → heading-xl; 4–6 → heading-lg; 7+ → heading-md.
Inter display is uppercase, weight 800–900, negative-tracked (−0.01..−0.03em); body weight 500 sentence case; Space Grotesk labels uppercase 0.08em. No sentence-case display, no untracked display.

Raw lines 155 to 164

165## Depth & Surface

166

167Hard offset shadow, solid black, zero blur, bottom-right:

168

169- **0.8cqw (8px)** primary cards; **0.4cqw (4px)** chrome; **0.6cqw (6px)** hover.

170- **Border-based depth** — the 4px/3px borders do much of the lift; shadow makes it "elevated."

171- **Tilt** — ±2°–12° rotation breaks the grid for perceived dimension.

172- **Inverted close** — 12px YELLOW shadow (and 6px white on close-btn) — the only colored shadows.

173

174**Ceiling:** no blurred shadow, no rounded corner (save the stat-deco dot), no gradient depth.

175

Depth & Surface

Hard offset shadow, solid black, zero blur, bottom-right:

0.8cqw (8px) primary cards; 0.4cqw (4px) chrome; 0.6cqw (6px) hover.
Border-based depth — the 4px/3px borders do much of the lift; shadow makes it "elevated."
Tilt — ±2°–12° rotation breaks the grid for perceived dimension.
Inverted close — 12px YELLOW shadow (and 6px white on close-btn) — the only colored shadows.

Ceiling: no blurred shadow, no rounded corner (save the stat-deco dot), no gradient depth.

Raw lines 165 to 175

176## Shapes

177

178- **0 radius everywhere** except the 12px stat-deco dot (50%). Square corners are the structural identity.

179

Shapes

0 radius everywhere except the 12px stat-deco dot (50%). Square corners are the structural identity.

Raw lines 176 to 179

180## Components

181

182- **card-elevated / card-small** — the bordered+shadowed content cards (weight-coupled).

183- **label-pill** — the universal eyebrow (border+shadow+pastel). **button-primary** — yellow CTA.

184- **star-burst / stripe-block / bg-dot-grid / tilt-deco** — the reusable decoration units (one per frame min).

185- **stat-deco-dot** — the lone round shape. **close-frame** — the inverted black+white+yellow-shadow closer.

186

Components

card-elevated / card-small — the bordered+shadowed content cards (weight-coupled).
label-pill — the universal eyebrow (border+shadow+pastel). button-primary — yellow CTA.
star-burst / stripe-block / bg-dot-grid / tilt-deco — the reusable decoration units (one per frame min).
stat-deco-dot — the lone round shape. close-frame — the inverted black+white+yellow-shadow closer.

Raw lines 180 to 186

187## Frame Treatments

188

189> Recipe: ground · container · composes · focal · chrome · accent · silence · Fixed/Free · density.

190> Cycle the ground color; add ≥1 decoration per frame; open with a label-pill.

191

Frame Treatments

Recipe: ground · container · composes · focal · chrome · accent · silence · Fixed/Free · density. Cycle the ground color; add ≥1 decoration per frame; open with a label-pill.

Raw lines 187 to 191

192### 1 · Cover (identity · move: decorations puncture · left)

193

194**Ground** `{colors.cream}` (or offwhite) + faint dot-grid. **Composes** label-pill, heading-xl, tilt-deco rect, star-burst, counter. **Focal** a 2–3 line Inter `heading-xl` uppercase, left, under a label-pill; tilted pastel rects + a star burst puncture the right. **Chrome** counter pill. **Accent** the decorations' pastels. **Silence** right third holds decorations. **Fixed** 4px/8px coupling, uppercase display, square. **Free** title, decoration placement/colors. **Density** comfortable.

195

1 · Cover (identity · move: decorations puncture · left)

Ground {colors.cream} (or offwhite) + faint dot-grid. Composes label-pill, heading-xl, tilt-deco rect, star-burst, counter. Focal a 2–3 line Inter heading-xl uppercase, left, under a label-pill; tilted pastel rects + a star burst puncture the right. Chrome counter pill. Accent the decorations' pastels. Silence right third holds decorations. Fixed 4px/8px coupling, uppercase display, square. Free title, decoration placement/colors. Density comfortable.

Raw lines 192 to 195

196### 2 · Feature Cards (catalog · move: 3-up bordered grid · blue ground)

197

198**Ground** `{colors.blue}`, `slide-pad`. **Composes** label-pill, heading-lg, 3× card-elevated (icon-square + card-title + body). **Focal** three white bordered+shadowed cards. **Chrome** label-pill eyebrow. **Accent** the pastel icon-squares (pink/green/yellow). **Silence** tight — dense by design. **Fixed** 4px border + 8px shadow, square, uppercase card-titles. **Free** card content, icon hues. **Density** dense-exception.

199

2 · Feature Cards (catalog · move: 3-up bordered grid · blue ground)

Ground {colors.blue}, slide-pad. Composes label-pill, heading-lg, 3× card-elevated (icon-square + card-title + body). Focal three white bordered+shadowed cards. Chrome label-pill eyebrow. Accent the pastel icon-squares (pink/green/yellow). Silence tight — dense by design. Fixed 4px border + 8px shadow, square, uppercase card-titles. Free card content, icon hues. Density dense-exception.

Raw lines 196 to 199

200### 3 · Stat Grid (data · move: tilted stat cards · green ground)

201

202**Ground** `{colors.green}`, `slide-pad`. **Composes** label-pill, heading-lg, 3× card-small (tilted −2/+2°, stat-deco dot, stat-number + label). **Focal** three tilted bordered stat cards. **Accent** the deco-dots' pastels + black stat numerals. **Silence** moderate. **Fixed** alternating tilt, 3px+4px, round deco-dot only. **Free** figures (from script), dot hues. **Density** dense-exception.

203

3 · Stat Grid (data · move: tilted stat cards · green ground)

Ground {colors.green}, slide-pad. Composes label-pill, heading-lg, 3× card-small (tilted −2/+2°, stat-deco dot, stat-number + label). Focal three tilted bordered stat cards. Accent the deco-dots' pastels + black stat numerals. Silence moderate. Fixed alternating tilt, 3px+4px, round deco-dot only. Free figures (from script), dot hues. Density dense-exception.

Raw lines 200 to 203

204### 4 · Closing Plate (closer · move: inverted black · centered)

205

206**Ground** `{colors.black}`. **Composes** close-frame (4px white border, 12px yellow shadow), label-pill (inverted), close-title, star-burst. **Focal** a white `close-title` inside the white-bordered frame with the yellow offset shadow; a pink star punctures a corner. **Accent** the yellow shadow + pink star. **Silence** ~50%. **Fixed** white-on-black, 12px yellow shadow (only here), square. **Free** sign-off, star placement. **Density** low.

207

4 · Closing Plate (closer · move: inverted black · centered)

Ground {colors.black}. Composes close-frame (4px white border, 12px yellow shadow), label-pill (inverted), close-title, star-burst. Focal a white close-title inside the white-bordered frame with the yellow offset shadow; a pink star punctures a corner. Accent the yellow shadow + pink star. Silence ~50%. Fixed white-on-black, 12px yellow shadow (only here), square. Free sign-off, star placement. Density low.

Raw lines 204 to 207

208### 5 · Quote (quote · move: bordered quote frame · pink ground)

209

210**Ground** `{colors.pink}` (or offwhite). **Composes** label-pill, quote-text in a card-elevated, attribution. **Focal** an Inter `quote-text` (900 uppercase) inside a white bordered+shadowed frame. **Accent** the ground + one decoration. **Silence** moderate. **Fixed** uppercase quote, 4px/8px. **Free** quote, ground. **Density** comfortable.

211

5 · Quote (quote · move: bordered quote frame · pink ground)

Ground {colors.pink} (or offwhite). Composes label-pill, quote-text in a card-elevated, attribution. Focal an Inter quote-text (900 uppercase) inside a white bordered+shadowed frame. Accent the ground + one decoration. Silence moderate. Fixed uppercase quote, 4px/8px. Free quote, ground. Density comfortable.

Raw lines 208 to 211

212### 6 · Timeline (process · move: stepped bordered cards · offwhite)

213

214**Ground** `{colors.offwhite}`. **Composes** label-pill, heading-lg, 3–4 card-small steps + step-connectors. **Focal** a row of bordered step cards linked by black connector bars, each a pastel + step-num. **Accent** the step pastels. **Silence** moderate. **Fixed** 3px+4px steps, square, connectors. **Free** steps, hues. **Density** standard.

215

6 · Timeline (process · move: stepped bordered cards · offwhite)

Ground {colors.offwhite}. Composes label-pill, heading-lg, 3–4 card-small steps + step-connectors. Focal a row of bordered step cards linked by black connector bars, each a pastel + step-num. Accent the step pastels. Silence moderate. Fixed 3px+4px steps, square, connectors. Free steps, hues. Density standard.

Raw lines 212 to 215

216## Composition Rules

217

Composition Rules

Raw lines 216 to 217

218### Do

219

220- Pair **4px borders with 8px shadows**, **3px with 4px** — the coupling is non-negotiable.

221- **Cycle pastel grounds** across frames; keep the deck visually rhythmic.

222- Set Inter display **uppercase, 800–900, negative-tracked**; open every region with a **label-pill**.

223- Render shadows **solid black, zero blur, bottom-right**; add **≥1 decoration** (tilt/star/stripe/dots) per frame.

224- Use **yellow** for CTAs; use the **inverted black + 12px yellow shadow** close-frame for the closer.

225- Tilt decorations ±2°–12°; lean left on most frames.

226

Do

Pair 4px borders with 8px shadows, 3px with 4px — the coupling is non-negotiable.
Cycle pastel grounds across frames; keep the deck visually rhythmic.
Set Inter display uppercase, 800–900, negative-tracked; open every region with a label-pill.
Render shadows solid black, zero blur, bottom-right; add ≥1 decoration (tilt/star/stripe/dots) per frame.
Use yellow for CTAs; use the inverted black + 12px yellow shadow close-frame for the closer.
Tilt decorations ±2°–12°; lean left on most frames.

Raw lines 218 to 226

227### Don't

228

229- No rounded corners (save the stat-deco dot); no blurred shadows.

230- No colored borders (black only, save the close-frame white); no sixth pastel.

231- No sentence-case Inter display; no untracked display; no label as plain text.

232- Don't keep everything perfectly aligned (tilt is the signature); don't leave corners empty.

233- Don't blow a headline edge-to-edge — fit to measure.

234

Don't

No rounded corners (save the stat-deco dot); no blurred shadows.
No colored borders (black only, save the close-frame white); no sixth pastel.
No sentence-case Inter display; no untracked display; no label as plain text.
Don't keep everything perfectly aligned (tilt is the signature); don't leave corners empty.
Don't blow a headline edge-to-edge — fit to measure.

Raw lines 227 to 234

235## Aspect-Ratio Behavior

236

237| Treatment | 16:9 | 9:16 | 1:1 |

238| ------------- | ----------------------------- | ---------------------------- | ------------------------ |

245

246`slide-pad` holds on the short edge; re-step display above the 1.4cqw floor. Decoration count drops

247on tighter ratios so the frame stays bordered, not cluttered.

248

Aspect-Ratio Behavior

Treatment	16:9	9:16	1:1
Cover	title left, decorations right	title top, decorations below	title, fewer decorations
Feature Cards	3 across	3 stacked	2+1
Stat Grid	3 tilted across	3 tilted stacked	2×2
Closing	centered close-frame	centered, taller	centered
Quote	quote frame	quote stacked	centered
Timeline	horizontal steps	vertical (connectors hidden)	2×2

slide-pad holds on the short edge; re-step display above the 1.4cqw floor. Decoration count drops on tighter ratios so the frame stays bordered, not cluttered.

Raw lines 235 to 248

249## Approved Entities

250

251No real customers, logos, or vendors are defined in the source — render any such mark as a

252placeholder. Pastel fills, decorations, and tilts are content-agnostic.

253

Approved Entities

No real customers, logos, or vendors are defined in the source — render any such mark as a placeholder. Pastel fills, decorations, and tilts are content-agnostic.

Raw lines 249 to 253

254## Numerals & Claims (hard rule)

255

256Never invent figures, stats, or counts at frame scale. Render slots as `— figure —`, `{metric}`,

257`N×`. Stat cards and charts carry placeholders until the script supplies values. Slide counters and

258list numbers are decorative.

259

Numerals & Claims (hard rule)

Never invent figures, stats, or counts at frame scale. Render slots as — figure —, {metric}, N×. Stat cards and charts carry placeholders until the script supplies values. Slide counters and list numbers are decorative.

Raw lines 254 to 259

260## Pre-Render Self-Audit

261

262- **Squint** — one Inter display moment dominates; cards read as a system.

263- **Silence** — only feature/stat grids run dense; cover/quote/close keep air with decorations.

264- **Borders/shadows** — 4px↔8px / 3px↔4px coupling holds; solid black, zero blur.

265- **Color** — pastel ground cycles; black borders only (white on close); no sixth pastel.

266- **Type** — Inter uppercase 800–900 negative-tracked, fit-to-measure; Space Grotesk labels 0.08em; ≥1.4cqw floor.

267- **Shape** — square corners (only stat-deco dot round); ≥1 tilt/decoration per frame.

268- **Fabrication** — every numeral traces to the script, else placeholder.

269

Pre-Render Self-Audit

Squint — one Inter display moment dominates; cards read as a system.
Silence — only feature/stat grids run dense; cover/quote/close keep air with decorations.
Borders/shadows — 4px↔8px / 3px↔4px coupling holds; solid black, zero blur.
Color — pastel ground cycles; black borders only (white on close); no sixth pastel.
Type — Inter uppercase 800–900 negative-tracked, fit-to-measure; Space Grotesk labels 0.08em; ≥1.4cqw floor.
Shape — square corners (only stat-deco dot round); ≥1 tilt/decoration per frame.
Fabrication — every numeral traces to the script, else placeholder.

Raw lines 260 to 269

270## Known Gaps

271

272- **Motion intentionally out of scope.** frame.md specifies composition only; the source toggles slides via display, no transition.

273- **Inter + Space Grotesk via Google Fonts.** CJK: Noto Sans SC 900 (sentence case — the uppercase signal drops); lean harder on borders/shadows/decoration to carry the brutalist identity.

274- **9:16 / 1:1 are guidance**; verify the floor and that decoration count scales down.

275- Star bursts (clip-path), stripe blocks, dot grids, and tilts are CSS-only; no external imagery is required.

Known Gaps

Motion intentionally out of scope. frame.md specifies composition only; the source toggles slides via display, no transition.
Inter + Space Grotesk via Google Fonts. CJK: Noto Sans SC 900 (sentence case — the uppercase signal drops); lean harder on borders/shadows/decoration to carry the brutalist identity.
9:16 / 1:1 are guidance; verify the floor and that decoration count scales down.
Star bursts (clip-path), stripe blocks, dot grids, and tilts are CSS-only; no external imagery is required.

Raw lines 270 to 275