# Kicker Report Deck 모든 슬라이드가 '네이비 키커 → 굵은 제목 → 잉크 룰' 같은 머리로 시작하고, 수치는 볼드가 아니라 크기로 말하는 순백 바탕의 한국형 실무 보고서 덱. - taxonomy: corporate-clean · report-deck, navy-accent, kicker-rule, full-bleed-divider, metric-hero, label-value-list, korean-business · complexity=medium - page types: presentation - best for: 프로젝트 완료보고·성과보고 덱, 경영진 대상 실무 보고(수치·근거 중심), 한국어 비즈니스 문서형 프레젠테이션 - avoid for: 감성 브랜드 무드 키노트, 투자 유치 피치덱, 모션·비주얼 임팩트 중심 제품 런칭 덱 - provenance: pptx (개인 작성 보고서 덱(비공개 원본)에서 디자인 문법만 추출 — 조직·고객사 식별 정보, 실제 콘텐츠·수치·이미지는 일절 포함하지 않음) — confidence: colors=ooxml-measured, typography=ooxml-measured, layout=vision-inferred, spacing=vision-inferred, motion=manual ## Design rules # Kicker Report Deck ## Overview A Korean corporate reporting deck reduced to one repeating gesture: **navy kicker → bold title → full-width ink rule**, then a two-column body. Every content slide wears that same head block, so the deck reads as a document rather than a slideshow. One chromatic voice carries almost everything — ink navy — joined by a single muted gold used on exactly one line per slide and nowhere else; there is no red or green, not even for warnings. The style's real signature is inverted emphasis: **hero numbers are regular weight, not bold.** Size and navy carry the emphasis; weight is reserved for the small labels. Section dividers break the rhythm by flooding the left third with full-bleed navy under a 100pt light-weight numeral. ## Colors & Roles Canonical mode is **light**: every content slide sits on pure white. Text runs on a four-step neutral ramp measured from the source deck — ink (`foreground`, #1A1A1A) for titles and values, dark gray (#4A4A4A, `secondary-foreground`) for subtitles and supporting lines, mid gray (`muted-foreground`, #8A8A8A) for captions and list descriptions, and the faintest gray (#B0B0B0) for footers and the `CONFIDENTIAL` mark. Dividing lines use `border` #D9D9D9; figure panels sit on `muted`/`card` #F4F5F7. The dominant chromatic voice is **navy #1D4E89** (oklch 0.423 0.111 255.1), mapped to `primary`, `accent`, and `ring` alike: kickers, list labels, delta badges, table-of-contents numerals, the divider panel, and the closing background. `destructive` also maps to navy — there is no red or green anywhere, not even for warnings. `chart-1..5` put navy at `chart-1` and then step down a neutral lightness ramp, so series separate by lightness and the emphasized series is the only saturated one. There is exactly **one other color**, and it is easy to miss: `marker`, a muted gold (#C9A227, oklch 0.728 0.138 89.7). It never appears as a fill, a chart color, or an emphasis — it is reserved for a single 7.5pt bold line that tracks narrative progress ("what this slide solved"), measured at one occurrence on each of nine consecutive slides. Treat it as a second voice with exactly one thing to say; using it anywhere else breaks the style. The `dark` map is not a generic dark theme: it is the deck's **own inverted surface**, taken from the divider panel and closing slide. Background becomes navy, everything reads white, and the roles flip — white becomes `primary`/`accent` against navy `primary-foreground`. Supporting tones are lifted steels derived from the same hue. ## Typography Rules One grotesque family: Arial for Latin, Malgun Gothic for Korean (web fallbacks: Inter / Noto Sans KR). Deck type steps, in pt on a 13.33in × 7.5in canvas: deck title 48pt/700; section number 100pt/**300**; section title 38pt/700; hero metric 38pt/**400**; TOC numeral 33pt/400; KPI value 29pt/400; slide title 28pt/700; delta badge 22pt/700; item title 19pt/700; column label 16pt/700; subtitle 15pt/400; body 14.5pt/400; kicker 12pt/700; caption 11pt/400; footer 10pt/400. Two tracking rules run in opposite directions and are not optional. **Small labels are bold and open**: kickers and the `CONFIDENTIAL` mark carry +0.14em to +0.22em of letter-spacing. **Large type is tight**: every step above 28pt pulls in to −0.015em … −0.03em. Numbers use tabular figures. The weight inversion is the point — a 38pt hero metric at weight 400 next to a 12pt label at weight 700 is correct, not a mistake. ## Layout Principles 16:9, 12-column, margins 0.62in left/right, 0.45in top, 0.4in bottom. The head block occupies the top band and always closes with a full-width 1px ink rule. Below it the body splits asymmetrically: roughly five columns of label/value list on the left, six columns of figure panel on the right, with a gutter between. Everything is left-aligned except the cover, divider, and closing slides, which are still left-aligned horizontally but push their content into the lower two-thirds of the canvas. The footer carries the deck title bottom-left and `n / total` bottom-right, and is omitted on cover, divider, and closing slides. The source deck was authored at 20in × 11.25in — the same 16:9 ratio at exactly 1920 × 1080 px, a web-native grid. All pt values here are normalized to the standard 13.33in canvas (source ÷ 1.5). ## Depth & Elevation Completely flat. No shadows, gradients, glass, or blur. Containment is done two ways only: a 1px hairline, or a filled navy plane (divider panel, closing background). Figure panels are held by a light muted fill plus a 1px border — never a shadow. ## Shapes Zero border radius on everything structural — slide frames, figure panels, badges, table cells, chart bars (measured: 456 rectangles against 18 rounded ones). The **sole exception** is cards and chips drawn *inside* a figure panel, which round at 8% of their short side; the panel containing them stays square. Rules come in two weights that mean different things: the **ink rule** under a slide title closes the head block; **light gray hairlines** subdivide lists, columns, and KPI strips. Never use the ink weight for a subdivision. ## Component Stylings - **Slide head**: navy kicker (12pt/700/+0.14em, format `01 SECTION · SUBTOPIC`) → title (28pt/700 ink) → optional subtitle (15pt dark gray) → full-width 1px ink rule. The order is fixed. - **Label/value list**: the left column's whole vocabulary. A navy label (12pt/700) with an ink value beneath it (14.5pt/400), repeated down the column, pairs separated by faint hairlines. **No bullet glyphs** — the navy label is the bullet. - **Figure panel**: muted fill, 1px border, radius 0, no shadow, with a single 11pt mid-gray caption underneath. - **Metric hero**: navy column label (16pt/700) → hero figure (38pt/400, tight tracking) → navy delta badge beside it (22pt/700, e.g. `83%↓`) → gray supporting line (15pt). Two columns are split by a vertical hairline. - **Metric 3-up**: the results-slide lead. A very large figure (64pt/400 ink) with a small navy unit or delta glyph set on its baseline beside it (`분`, `%↓`, `h`), a hairline beneath, then a gray descriptive label. Three equal cells, separated by whitespace only — no vertical rules here. - **Status badge**: a single navy 1px outlined rectangle (no fill) holding small navy bold text, sitting top-right on the head-block line. Radius 0, at most one per slide. - **Two-column compare**: for contrasting two axes (wins vs. gaps). The left column takes a navy heading over a thick navy underline; the right takes a gray heading over a gray underline — the weight of the rule is the hierarchy. Items in each column are separated by hairlines, never bulleted. - **Chip grid**: inside a figure panel, N items as chips on the pale navy `chip` fill with 7.5pt navy bold text, numbered (①②③), wrapping at four per row — the one place rounded corners are allowed. - **Arrow takeaway**: a one-line conclusion at the bottom of the body, opening with `→` in 7.5pt bold `marker` gold — the sentence that closes the slide's argument. Gold, not navy. - **Progress marker**: on slides that run as a series, a single 7.5pt bold gold line ("Solved ▸ …") sitting above the body on the right, naming what this slide resolves. One per slide, and along with the arrow takeaway the only place gold appears. - **Summary line**: a single full-width sentence at 15.5pt/400 ink, sitting directly above the KPI strip and interpreting the numbers below it. Never bold, never navy — size alone lifts it one step above body text. - **KPI strip**: a bottom band closed on top by an ink rule and divided into 3–4 cells by vertical hairlines; each cell is a 29pt/400 value over a 12pt mid-gray label, tabular figures. - **TOC row**: large navy numeral (33pt/400) + bold item title (19pt/700) + gray description on the right; rows separated by faint hairlines. - **Section divider**: left third full-bleed navy with a 100pt/300 white numeral set low; right side has a tracked gray `PART n` kicker (13pt/+0.18em), a 38pt/700 title, a hairline, and a meta line. - **Cover**: white, tracked gray kicker top-left and `CONFIDENTIAL` top-right, a short navy rule (~0.7in) above a 48pt/700 title and a 19pt subtitle, then a bottom hairline over author/date and a right-aligned tagline. - **Closing**: the cover inverted — full navy field, the same short rule and title in white, same top kicker and bottom meta structure. ## Motion None. Hard cuts between slides; no build-ins, no object animation. This is a document that happens to be paginated. ## Do's and Don'ts **Do:** open every content slide with the kicker → title → ink rule head block; set hero metrics, KPI values, and section numerals at weight 400 and let size carry them; use the asymmetric label-list-left / figure-right body as the default; break sections with the full-bleed navy divider; keep the cover and closing as a light/navy mirrored pair; track kickers wide and large titles tight. **Don't:** introduce a third color — navy and the gold marker are the whole palette; spend the gold on anything but the progress marker or arrow takeaway; bold the hero metrics; use bullet glyphs where a navy label belongs; round corners, add shadows, gradients, or transitions; center-align content slides; use emoji, clipart, or stock icons. ## Slide Anatomy - **Cover**: tracked kicker + `CONFIDENTIAL` top band; short navy rule, 48pt title, subtitle in the lower-middle; hairline, author/date, tagline at the bottom. No footer. - **Table of contents**: navy `CONTENTS` kicker over a large title and an ink rule, then numbered rows (navy numeral + bold item + gray description) separated by hairlines. - **Executive summary**: an action-title style conclusion sentence, a two-column metric hero split by a vertical hairline, then a full-width summary line and a 4-cell KPI strip across the bottom. - **Content + figure** (the workhorse): standard head block; left column of label/value pairs; right column figure panel with caption; footer. A status badge may sit top-right, and an arrow takeaway may close the body. - **Results**: head block, then a metric 3-up across the upper body, then two or three label/value pairs below it — the numbers first, the interpretation under them. - **Compare**: head block over a two-column compare (navy-underlined wins on the left, gray-underlined gaps on the right), optionally closed by a small metric strip. - **Section divider**: full-bleed navy left third with a 100pt white numeral; `PART n` kicker, section title, hairline, and owner line on the right. No footer. - **Closing**: full navy field with a white short rule, a large white title (e.g. a closing courtesy line), a supporting line, and the bottom meta band. No footer. ## Agent Prompt Guide > Build this presentation in the 'Kicker Report Deck' style: pure-white 16:9 slides where every content slide opens with the same head block — a bold navy kicker with wide tracking, a 28pt bold ink title, an optional gray subtitle, closed by a full-width 1px ink rule. Below it, an asymmetric two-column body: navy bold labels each followed by an ink value line on the left (never bullet glyphs, hairlines between pairs), a figure panel on light muted fill with a 1px border and an 11pt gray caption on the right. The dominant accent is navy #1D4E89, plus one muted gold (#C9A227) spent only on a 7.5pt bold progress-marker or arrow-takeaway line — no third color exists, not even for warnings. Emphasis comes from size, not weight: hero metrics, KPI values, and section numerals are regular weight at large sizes with tight tracking, while small kickers are bold with wide tracking. Section dividers are the signature: fill the left third full-bleed navy with a 100pt light-weight white numeral, and put a tracked PART kicker, a 38pt bold title, a hairline, and a meta line on the right. Cover and closing are the same skeleton in light and navy-inverted form. Zero radius, no shadows, no gradients, cut transitions, footer with deck title bottom-left and `n / total` bottom-right. ## Known Gaps / Confidence Colors and type steps are `ooxml-measured` — read directly from the source deck's slide XML (run properties and `srgbClr` fills, censused across all slides), not from a rendered browser. Layout and spacing are `vision-inferred` from rendered slide images. Two honest caveats about the source: it declared **Arial for Korean text as well**, which has no Hangul glyphs, so Korean actually rendered through whatever fallback each machine supplied — this spec pins Malgun Gothic instead, and text set in it will not reflow identically to the source. And the source canvas was 20 × 11.25in; every pt value here is the ÷1.5 normalization to a standard 13.33in canvas. The dark map is the deck's own navy inversion rather than a neutral dark theme, and its supporting steels are authored, not measured. No organization, client, content, or imagery from the source deck is reproduced here — this entry describes design grammar only. ## Tokens (theme.css — use these values verbatim, do not re-derive) ```css /* Kicker Report Deck — theme.css (generated, do not edit) */ :root { --radius: 0px; --radius-selector: 0px; --radius-field: 0px; --font-sans: Arial, 'Malgun Gothic', 'Helvetica Neue', Helvetica, sans-serif; --spacing: 8px; --shadow: 0px 1px 2px 0px color-mix(in oklab, oklch(0 0 0) 0%, transparent); --background: oklch(1 0 0); --foreground: oklch(0.218 0 0); --card: oklch(0.97 0.003 264.5); --card-foreground: oklch(0.218 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.218 0 0); --primary: oklch(0.423 0.111 255.1); --primary-foreground: oklch(1 0 0); --secondary: oklch(0.933 0.005 258.3); --secondary-foreground: oklch(0.409 0 0); --muted: oklch(0.97 0.003 264.5); --muted-foreground: oklch(0.633 0 0); --accent: oklch(0.423 0.111 255.1); --accent-foreground: oklch(1 0 0); --destructive: oklch(0.423 0.111 255.1); --destructive-foreground: oklch(1 0 0); --border: oklch(0.885 0 0); --input: oklch(0.885 0 0); --ring: oklch(0.423 0.111 255.1); --chart-1: oklch(0.423 0.111 255.1); --chart-2: oklch(0.409 0 0); --chart-3: oklch(0.633 0 0); --chart-4: oklch(0.757 0 0); --chart-5: oklch(0.885 0 0); --marker: oklch(0.728 0.138 89.7); --marker-surface: oklch(0.973 0.02 91.6); --chip: oklch(0.955 0.014 254.6); } .dark { --background: oklch(0.423 0.111 255.1); --foreground: oklch(1 0 0); --card: oklch(0.378 0.104 255.1); --card-foreground: oklch(1 0 0); --popover: oklch(0.378 0.104 255.1); --popover-foreground: oklch(1 0 0); --primary: oklch(1 0 0); --primary-foreground: oklch(0.423 0.111 255.1); --secondary: oklch(0.478 0.101 255.1); --secondary-foreground: oklch(0.95 0.012 255.1); --muted: oklch(0.378 0.104 255.1); --muted-foreground: oklch(0.83 0.032 255.1); --accent: oklch(1 0 0); --accent-foreground: oklch(0.423 0.111 255.1); --destructive: oklch(0.93 0.022 255.1); --destructive-foreground: oklch(0.423 0.111 255.1); --border: oklch(0.535 0.093 255.1); --input: oklch(0.535 0.093 255.1); --ring: oklch(1 0 0); --chart-1: oklch(1 0 0); --chart-2: oklch(0.9 0.025 255.1); --chart-3: oklch(0.8 0.04 255.1); --chart-4: oklch(0.69 0.06 255.1); --chart-5: oklch(0.585 0.08 255.1); --marker: oklch(0.82 0.138 89.7); --marker-surface: oklch(0.46 0.06 91.6); --chip: oklch(0.5 0.075 255.1); } ``` ## Golden example (exemplar.html — match this structure and token usage) ```html

01 PLATFORM · TO-BE

Single run replaces the weekly manual merge

One macro pass consolidates the source files and feeds every downstream sheet

Design
Extracts only the mapped fields, on a fixed schema
Consolidation
New files are collected and sorted from one folder
Downstream
Demand, stock and order sheets update with no re-entry
Source files
→
One run
→
Merged output

Drop in the folder, run once — merge through to ordering is automatic

→ The manual merge step is gone entirely

Programme completion report 6 / 20
01

PART 1

Automated data consolidation

Owner: Planning & Procurement

00 OVERVIEW · EXECUTIVE SUMMARY

Both workstreams are live in day-to-day operations

Workstream 1 · Data consolidation
1 hr → 10 min 83%↓

Macro-driven merge · about 25 hours saved per year

Workstream 2 · Status platform
13 of 13 live

Zero manual input · one platform, five independent views

Built in-house with existing capability — run cost stays at internal effort plus tool subscriptions

18–27
Effort, person-months
5
Independent views
18 → 4
Weeks to delivery
0
Re-entry steps
Programme completion report 2 / 20
``` ## Apply - shadcn project: `npx shadcn@latest add https://web.ggum.uk/styles/r/ppt-kicker-report.json` — installs the tokens above into globals.css, then use semantic classes (bg-background, text-primary, …) only. - other stack: paste the theme.css block above into your global stylesheet and style everything via `var(--…)` references. - single HTML/artifact: embed the theme.css block in a `