@fectivnfy112358/minimax-code-web 0.1.0-preview.0 → 0.1.0-preview.3

package/server/assets/skills/pdf/templates/brand-guide-2page/cases/minimax-web-brand-guide/README.md

@@ -0,0 +1,155 @@
+# Case: MiniMax web brand guide two-pager
+
+> CREATE route exemplar for turning a live brand website into an exact two-page A4 brand style guide. Store only editable source (`source.html`); do not commit generated PDFs.
+
+## 1. Original user intent and acceptance criteria
+
+**User ask:** “Generate a two-page Brand Style Guide for https://www.minimax.io/. Output as PDF.”
+
+**Acceptance criteria:**
+
+- Output is a polished PDF, exactly **2 pages**, A4 portrait.
+- It reads like an official brand guide, not a generic website summary.
+- It captures MiniMax identity from the site: wordmark/logo, mission language, multimodal model/product matrix, current product names, color mood, type hierarchy, voice rules, and do/don’t usage guidance.
+- It preserves the best editable source for reuse; generated PDF files are disposable build artifacts.
+
+## 2. Source inspection and parsing steps
+
+Use the live site first, then inspect linked image assets. Do not infer the palette from prose alone.
+
+```bash
+TMP=/tmp/minimax-brand-guide
+mkdir -p "$TMP"
+python3 - <<'PYFETCH'
+from pathlib import Path
+import requests
+url = 'https://www.minimax.io/'
+Path('/tmp/minimax-brand-guide/site.html').write_text(requests.get(url, timeout=30).text, encoding='utf-8')
+PYFETCH
+```
+
+High-signal content to extract from `https://www.minimax.io/`:
+
+- Brand name: `MiniMax`.
+- Mission/tagline language: `co-create intelligence with everyone` / `Intelligence with everyone`.
+- Company position: “A world-leading general AI technology company.”
+- Model/product breadth: text, speech, video, image, music; MiniMax M2.7, Music 2.6, Hailuo 2.3, Speech 2.8, MiniMax Agent.
+- CTA/product rhythm: API platform, Agent, Hailuo, Audio, Talkie.
+- Visual cues: dark ink hero cards, magenta/coral/violet gradients, soft light surfaces, rounded cards, large confident sans typography.
+
+If the homepage is rendered by Next.js and the raw HTML is sparse, use a markdown fetch/browser snapshot and inspect image URLs from the rendered output. Prefer real logo assets (`logo_candidate.png` in this case) over a hand-drawn approximation.
+
+## 3. Transformation prompt and terminology rules
+
+No language translation was required. The transformation is **website → concise brand-system guide**.
+
+Use this prompt pattern when asking an LLM or drafting manually:
+
+```text
+Create a two-page A4 brand style guide from the inspected MiniMax website.
+Make it look like a real internal brand guideline, not a report.
+Keep copy short and directive. Preserve exact product names and the mission phrase.
+Use the real MiniMax wordmark/logo asset if available.
+Structure:
+Page 1: header with logo; large identity hero; six-color palette; typography/type scale.
+Page 2: voice pillars; tagline lockup; product matrix rhythm; do/don't rules.
+Tone: frontier but precise, human-scale, multimodal, production-ready.
+Do not invent unsupported claims, statistics, or extra brand colors.
+```
+
+Terminology rules:
+
+- Preserve product/model capitalization exactly: `MiniMax M2.7`, `Music 2.6`, `Hailuo 2.3`, `Speech 2.8`, `MiniMax Agent`.
+- Use `co-create intelligence with everyone` as the long mission phrase; use `Intelligence with everyone.` as the short display lockup.
+- Avoid vague claims such as “revolutionary AI” unless paired with product proof.
+- Use `Do` / `Don't`, `Voice & Application`, `Product matrix rhythm`, and `Core palette extracted from current web assets` as concise guide labels.
+
+## 4. Asset and layout preservation strategy
+
+What made this case work:
+
+1. **Real logo first.** The source HTML embeds the MiniMax logo as a data URI so the case is portable and does not depend on external files at render time.
+2. **Strong page-one identity block.** Left: large gradient mark panel. Right: dark hero card with mission statement. This creates brand-guide authority before details.
+3. **Exact two-page rhythm.** Each top-level `<section class="page">` maps to one A4 page with `height: calc(297mm - 30mm)` and `page-break-after: always`.
+4. **Palette from observed assets.** Use the magenta/coral/violet family plus ink, soft aura, and slate:
+   - Ink Core `#101020`
+   - Signal Magenta `#E02060`
+   - Motion Coral `#F06030`
+   - Model Violet `#8060F0`
+   - Soft Aura `#D0C0F0`
+   - System Slate `#A0B0B0`
+5. **Print-safe CSS.** Set `-webkit-print-color-adjust: exact; print-color-adjust: exact;` globally.
+6. **Source artifact only.** Keep `source.html` in the case. Generated PDF and PNG previews belong in scratch/workspace only.
+
+## 5. Rendering / compilation steps
+
+From the skill root:
+
+```bash
+SKILL={{DATA_DIR}}/.builtin-skills/pdf
+CASE="$SKILL/templates/brand-guide-2page/cases/minimax-web-brand-guide"
+OUT=/tmp/MiniMax_Brand_Style_Guide.pdf
+
+bash "$SKILL/scripts/make.sh" check
+bash "$SKILL/scripts/make.sh" render   --in "$CASE/source.html"   --out "$OUT"   --format A4   --wait 1200
+```
+
+Use longer waits (`--wait 15000`) if future variants add remote fonts, charts, or late-loading JS. This case is static HTML/CSS and does not need Chart.js settling.
+
+## 6. Verification commands and expected evidence
+
+Run all gates before delivery:
+
+```bash
+pdfinfo "$OUT" | grep -E 'Pages|Page size'
+pdfimages -list "$OUT"
+pdftotext -layout "$OUT" - | sed -n '1,120p'
+```
+
+Expected evidence:
+
+- `Pages: 2`
+- `Page size: 595.92 x 842.88 pts (A4)` or equivalent A4 dimensions.
+- `pdfimages -list` shows the embedded logo image on both pages (image + smask entries are normal for PNG transparency).
+- Text extraction contains, at minimum:
+  - `Co-create intelligence with everyone.`
+  - `Core palette extracted from current web assets`
+  - `MiniMax M2.7`, `Music 2.6`, `Hailuo 2.3`, `Speech 2.8`, `MiniMax Agent`
+  - `Do` and `Don't` sections.
+
+Optional visual check:
+
+```bash
+mkdir -p /tmp/minimax-brand-preview
+pdftoppm -png -r 150 "$OUT" /tmp/minimax-brand-preview/page
+```
+
+Inspect both PNGs for: no clipped header/footer, balanced whitespace, readable tables, and a strong first-page hero.
+
+## 7. Common pitfalls and recovery steps
+
+| Pitfall | Symptom | Recovery |
+|---|---|---|
+| Hand-drawn logo approximation | Output looks like a fake brand, not MiniMax | Use a real logo PNG/SVG and embed as data URI or inline SVG. |
+| Too many small modules | Looks like an AI report rather than a style guide | Use fewer, larger blocks: identity hero, palette, type, voice, tagline, product rhythm, rules. |
+| Palette inferred from generic AI colors | Blue/mint SaaS look; not MiniMax-specific | Re-anchor to magenta/coral/violet from observed MiniMax web assets. |
+| More than 2 pages | `pdfinfo` shows 3+ pages | Reduce copy, lower card min-heights, or remove secondary explanatory text; never shrink margins below the template rule. |
+| Missing logo in PDF | `pdfimages -list` is empty or logo box blank | Inline the image as a base64 data URI; avoid brittle relative paths from temp dirs. |
+| Text breaks awkwardly in hero | Large display line wraps poorly | Shorten tagline or reduce display size by 1–3 pt; keep max-width constrained. |
+| Weak page-two hierarchy | Do/don’t rules dominate before brand voice | Preserve order: voice cards → tagline lockup → product matrix rhythm → do/don’t. |
+
+## 8. Final reusable workflow
+
+1. **Match intent:** user asks for a 2-page brand/style guide PDF from a website.
+2. **Load skill route:** read `pdf` CREATE route and `templates/brand-guide-2page/README.md`.
+3. **Inspect source:** fetch/render the website; extract brand name, tagline, product names, logo assets, palette, typography mood, and recurring UI motifs.
+4. **Choose asset strategy:** download the best logo candidate; embed it as data URI in HTML for reproducibility.
+5. **Draft transformation:** compress website content into brand rules, not a report. Keep product terms exact and copy short.
+6. **Author HTML:** start from `templates/brand-guide-2page/skeleton.html` or this case’s `source.html`; keep two `<section class="page">` elements only.
+7. **Render:** `bash scripts/make.sh render --in source.html --out out.pdf --format A4 --wait 1200`.
+8. **Verify:** `pdfinfo` pages/size, `pdfimages` logo presence, `pdftotext` key content, optional raster preview.
+9. **Deliver PDF only to user; store source in skill/case.** Do not add generated PDFs as case artifacts.
+
+## 9. Case files
+
+- `source.html` — portable editable source with embedded MiniMax logo image.

package/server/assets/skills/pdf/templates/brand-guide-2page/cases/minimax-web-brand-guide/source.html

@@ -0,0 +1,188 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>MiniMax Web Brand Style Guide Case Source</title>
+  <style>
+    @page { size: A4 portrait; margin: 15mm; }
+    * { box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
+    :root {
+      --ink: #101020;
+      --paper: #F7F8FA;
+      --white: #FFFFFF;
+      --muted: #5D6673;
+      --rule: #E2E5EA;
+      --magenta: #E02060;
+      --coral: #F06030;
+      --violet: #8060F0;
+      --lavender: #D0C0F0;
+      --slate: #A0B0B0;
+    }
+    html, body { margin: 0; padding: 0; background: var(--paper); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Hiragino Sans", "Apple SD Gothic Neo", "Helvetica Neue", Arial, sans-serif; }
+    .page { height: calc(297mm - 30mm); page-break-after: always; break-after: page; display: flex; flex-direction: column; overflow: hidden; }
+    .page:last-of-type { page-break-after: auto; break-after: auto; }
+    header { display: flex; align-items: center; justify-content: space-between; border-bottom: 0.6px solid var(--rule); padding-bottom: 4mm; margin-bottom: 5mm; }
+    .brand-lockup { display: flex; align-items: center; gap: 4mm; }
+    .brand-lockup img { width: 46mm; height: auto; display: block; }
+    .doc-kicker { font-size: 8pt; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
+    .doc-title { font-size: 14pt; font-weight: 800; margin-top: 1mm; }
+    .meta { text-align: right; font-size: 8pt; color: var(--muted); line-height: 1.45; }
+    .hero { display: grid; grid-template-columns: 48mm 1fr; gap: 7mm; align-items: stretch; margin-bottom: 6mm; }
+    .mark-panel { border-radius: 6mm; background: radial-gradient(circle at 30% 20%, rgba(224,32,96,.24), transparent 38%), radial-gradient(circle at 80% 85%, rgba(128,96,240,.24), transparent 42%), var(--white); border: .5px solid var(--rule); display: flex; align-items: center; justify-content: center; min-height: 50mm; }
+    .mark { width: 28mm; height: 28mm; border-radius: 9mm; background: linear-gradient(145deg, var(--violet), var(--magenta) 55%, var(--coral)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.45); position: relative; }
+    .mark:before, .mark:after { content: ""; position: absolute; background: rgba(255,255,255,.92); border-radius: 8mm; }
+    .mark:before { width: 16mm; height: 4.5mm; left: 6mm; top: 8mm; transform: rotate(32deg); }
+    .mark:after { width: 16mm; height: 4.5mm; right: 6mm; bottom: 8mm; transform: rotate(32deg); opacity: .78; }
+    .positioning { background: var(--ink); color: #fff; border-radius: 6mm; padding: 7mm; display: flex; flex-direction: column; justify-content: space-between; min-height: 50mm; }
+    .positioning h1 { margin: 0; font-size: 31pt; line-height: 1.02; letter-spacing: -.04em; }
+    .gradient-text { background: linear-gradient(90deg, var(--magenta), var(--coral)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
+    .positioning p { margin: 4mm 0 0; font-size: 9.5pt; line-height: 1.45; color: rgba(255,255,255,.78); max-width: 105mm; }
+    .section { margin-top: 4mm; }
+    .section-label { font-size: 7.5pt; color: var(--muted); letter-spacing: .18em; text-transform: uppercase; font-weight: 800; margin-bottom: 3mm; }
+    .palette { display: grid; grid-template-columns: repeat(6, 1fr); gap: 3mm; }
+    .swatch { background: var(--white); border: .5px solid var(--rule); border-radius: 3mm; overflow: hidden; min-height: 28mm; }
+    .chip { height: 14mm; }
+    .swatch-meta { padding: 2mm 2.2mm; }
+    .swatch-name { font-size: 7.5pt; font-weight: 800; line-height: 1.15; }
+    .hex { font-size: 7pt; color: var(--muted); margin-top: .8mm; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
+    .type-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 5mm; }
+    .type-card { background: var(--white); border: .5px solid var(--rule); border-radius: 4mm; padding: 4mm; min-height: 41mm; }
+    .specimen-big { font-size: 27pt; line-height: 1; letter-spacing: -.04em; font-weight: 850; }
+    .specimen-body { font-size: 10pt; color: var(--muted); line-height: 1.45; margin-top: 3mm; }
+    table { width: 100%; border-collapse: collapse; font-size: 7.8pt; }
+    th { text-align: left; background: var(--ink); color: #fff; font-weight: 800; padding: 2mm; }
+    td { padding: 1.8mm 2mm; border-bottom: .4px solid var(--rule); }
+    .footer { margin-top: auto; border-top: .5px solid var(--rule); padding-top: 2mm; display: grid; grid-template-columns: 1fr 1fr 1fr; font-size: 7.5pt; color: var(--muted); }
+    .footer .center { text-align: center; font-style: italic; }
+    .footer .right { text-align: right; }
+    .voice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4mm; margin-bottom: 5mm; }
+    .voice-card { background: var(--white); border: .5px solid var(--rule); border-radius: 4mm; padding: 4mm; min-height: 42mm; }
+    .voice-card .num { color: var(--magenta); font-size: 8pt; font-weight: 900; letter-spacing: .12em; }
+    .voice-card h3 { margin: 2mm 0 1.5mm; font-size: 13pt; line-height: 1.1; }
+    .voice-card p { margin: 0; font-size: 8.2pt; line-height: 1.42; color: var(--muted); }
+    .tagline-box { background: linear-gradient(135deg, rgba(224,32,96,.10), rgba(128,96,240,.13)); border: .5px solid var(--rule); border-radius: 5mm; padding: 5mm; margin-bottom: 5mm; }
+    .tagline { font-size: 27pt; line-height: 1.03; font-weight: 900; letter-spacing: -.04em; max-width: 140mm; }
+    .tagline-note { margin-top: 2.5mm; font-size: 8.2pt; line-height: 1.45; color: var(--muted); }
+    .rules-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; }
+    .rules-col { background: var(--white); border: .5px solid var(--rule); border-radius: 4mm; padding: 4mm; }
+    .rules-col h4 { margin: 0 0 2mm; font-size: 11pt; }
+    .rule-row { display: grid; grid-template-columns: 5mm 1fr; gap: 2mm; padding: 1.4mm 0; border-top: .4px solid var(--rule); font-size: 7.9pt; line-height: 1.35; }
+    .glyph { font-weight: 900; }
+    .do .glyph { color: #1F8A4C; }
+    .dont .glyph { color: #D01316; }
+    .app-strip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2.5mm; margin: 3mm 0 5mm; }
+    .app { border-radius: 3mm; padding: 2.5mm; background: var(--ink); color: #fff; min-height: 20mm; display: flex; flex-direction: column; justify-content: space-between; }
+    .app span { font-size: 7pt; color: rgba(255,255,255,.62); text-transform: uppercase; letter-spacing: .12em; }
+    .app strong { font-size: 8.7pt; line-height: 1.1; }
+    .app:nth-child(2) { background: linear-gradient(135deg, var(--magenta), var(--coral)); }
+    .app:nth-child(3) { background: linear-gradient(135deg, var(--violet), #4F46E5); }
+    .app:nth-child(4) { background: #2A3340; }
+    .app:nth-child(5) { background: #46515F; }
+    @media screen { html { background: #d0d0d0; } body { padding: 20px 0; } body > section { width: 210mm; min-height: 297mm; margin: 0 auto 20px; background: var(--paper); box-shadow: 0 4px 24px rgba(0,0,0,.18); padding: 15mm; } }
+  </style>
+</head>
+<body>
+  <section class="page" data-page="1">
+    <header>
+      <div class="brand-lockup"><img src="data:image/png;base64,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" alt="MiniMax logo"></div>
+      <div class="meta"><div class="doc-kicker">Brand Style Guide</div><div>Identity system · 2026</div></div>
+    </header>
+
+    <div class="hero">
+      <div class="mark-panel"><div class="mark" aria-label="MiniMax gradient mark"></div></div>
+      <div class="positioning">
+        <div>
+          <div class="doc-kicker" style="color:rgba(255,255,255,.55);">MiniMax / Visual Identity</div>
+          <h1>Co-create <span class="gradient-text">intelligence</span> with everyone.</h1>
+        </div>
+        <p>A world-leading general AI technology company spanning text, speech, video, image and music. The brand should feel multimodal, production-ready and optimistic without losing technical precision.</p>
+      </div>
+    </div>
+
+    <div class="section">
+      <div class="section-label">01 / Core palette extracted from current web assets</div>
+      <div class="palette">
+        <div class="swatch"><div class="chip" style="background:#101020"></div><div class="swatch-meta"><div class="swatch-name">Ink Core</div><div class="hex">#101020</div></div></div>
+        <div class="swatch"><div class="chip" style="background:#E02060"></div><div class="swatch-meta"><div class="swatch-name">Signal Magenta</div><div class="hex">#E02060</div></div></div>
+        <div class="swatch"><div class="chip" style="background:#F06030"></div><div class="swatch-meta"><div class="swatch-name">Motion Coral</div><div class="hex">#F06030</div></div></div>
+        <div class="swatch"><div class="chip" style="background:#8060F0"></div><div class="swatch-meta"><div class="swatch-name">Model Violet</div><div class="hex">#8060F0</div></div></div>
+        <div class="swatch"><div class="chip" style="background:#D0C0F0"></div><div class="swatch-meta"><div class="swatch-name">Soft Aura</div><div class="hex">#D0C0F0</div></div></div>
+        <div class="swatch"><div class="chip" style="background:#A0B0B0"></div><div class="swatch-meta"><div class="swatch-name">System Slate</div><div class="hex">#A0B0B0</div></div></div>
+      </div>
+    </div>
+
+    <div class="section type-grid">
+      <div class="type-card">
+        <div class="section-label">02 / Typography</div>
+        <div class="specimen-big">MiniMax M2.7</div>
+        <div class="specimen-body">Use a confident system sans stack for product clarity: SF Pro / Helvetica Neue with CJK fallbacks. Keep headings tight, bold and compact; keep body text neutral and readable.</div>
+      </div>
+      <div class="type-card">
+        <div class="section-label">03 / Type scale</div>
+        <table>
+          <thead><tr><th>Role</th><th>Size</th><th>Use</th></tr></thead>
+          <tbody>
+            <tr><td>Display</td><td>44-52 pt</td><td>Hero claims</td></tr>
+            <tr><td>H1</td><td>28-34 pt</td><td>Model names</td></tr>
+            <tr><td>H2</td><td>16-20 pt</td><td>Sections</td></tr>
+            <tr><td>Body</td><td>10-11 pt</td><td>Product copy</td></tr>
+            <tr><td>Caption</td><td>7.5-8.5 pt</td><td>Specs / metadata</td></tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+
+    <footer class="footer"><div>Page 1 / 2</div><div class="center">Identity · Logo · Color · Type</div><div class="right">minimax.io</div></footer>
+  </section>
+
+  <section class="page" data-page="2">
+    <header>
+      <div><div class="doc-kicker">Part Two</div><div class="doc-title">Voice & Application</div></div>
+      <div class="brand-lockup"><img src="data:image/png;base64,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" alt="MiniMax logo"></div>
+    </header>
+
+    <div class="voice-grid">
+      <div class="voice-card"><div class="num">01</div><h3>Frontier, not vague</h3><p>Lead with concrete model capabilities, supported modalities and developer outcomes. Replace generic AI superlatives with specific proof.</p></div>
+      <div class="voice-card"><div class="num">02</div><h3>Human-scale</h3><p>Balance AGI ambition with everyday usefulness: work, life, creativity, coding, media and enterprise delivery.</p></div>
+      <div class="voice-card"><div class="num">03</div><h3>Multimodal energy</h3><p>Use motion, gradient and modular layouts to show the breadth of text, speech, video, image and music without visual clutter.</p></div>
+    </div>
+
+    <div class="tagline-box">
+      <div class="section-label">04 / Tagline lockup</div>
+      <div class="tagline">Intelligence with everyone.</div>
+      <div class="tagline-note">Use as a short brand promise near company-level messaging. Pair with the MiniMax wordmark on light surfaces or reverse it on Ink Core for launch moments.</div>
+    </div>
+
+    <div class="section-label">05 / Product matrix rhythm</div>
+    <div class="app-strip">
+      <div class="app"><span>Text</span><strong>MiniMax M2.7</strong></div>
+      <div class="app"><span>Music</span><strong>Music 2.6</strong></div>
+      <div class="app"><span>Video</span><strong>Hailuo 2.3</strong></div>
+      <div class="app"><span>Speech</span><strong>Speech 2.8</strong></div>
+      <div class="app"><span>Agent</span><strong>MiniMax Agent</strong></div>
+    </div>
+
+    <div class="section">
+      <div class="section-label">06 / Do's & Don'ts</div>
+      <div class="rules-grid">
+        <div class="rules-col">
+          <h4>Do</h4>
+          <div class="rule-row do"><span class="glyph">✓</span><span><strong>Use the gradient sparingly</strong> — reserve Magenta to Coral for hero moments, CTA accents and generative motion cues.</span></div>
+          <div class="rule-row do"><span class="glyph">✓</span><span><strong>Keep modules distinct</strong> — text, speech, video and music can each own a card, but typography should remain consistent.</span></div>
+          <div class="rule-row do"><span class="glyph">✓</span><span><strong>Show product proof</strong> — name models, versions, APIs and outcomes when making capability claims.</span></div>
+          <div class="rule-row do"><span class="glyph">✓</span><span><strong>Leave generous whitespace</strong> — let the dark wordmark and bright swatches carry the identity.</span></div>
+        </div>
+        <div class="rules-col">
+          <h4>Don't</h4>
+          <div class="rule-row dont"><span class="glyph">×</span><span><strong>Do not recolor the wordmark</strong> — keep it Ink Core or white on dark backgrounds.</span></div>
+          <div class="rule-row dont"><span class="glyph">×</span><span><strong>Do not stack all accent colors</strong> — choose one dominant accent per composition.</span></div>
+          <div class="rule-row dont"><span class="glyph">×</span><span><strong>Do not overuse generic AI motifs</strong> — avoid random sparkles, robot icons and ungrounded purple haze.</span></div>
+          <div class="rule-row dont"><span class="glyph">×</span><span><strong>Do not bury CTAs</strong> — API, Agent and Hailuo links should remain direct and action-oriented.</span></div>
+        </div>
+      </div>
+    </div>
+
+    <footer class="footer"><div>Compiled 2026-04-25</div><div class="center">Co-create intelligence with everyone</div><div class="right">Page 2 of 2</div></footer>
+  </section>
+</body>
+</html>

package/server/assets/skills/pdf/templates/brand-guide-2page/skeleton.html

@@ -0,0 +1,264 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title><!-- BRAND_NAME --> Brand Style Guide</title>
+  <style>
+    @page { size: A4 portrait; margin: 15mm; }
+
+    :root {
+      --charcoal: #181E25;
+      --surface: #F7F8FA;
+      --primary: <!-- BRAND_PRIMARY -->;
+      --secondary: <!-- BRAND_SECONDARY -->;
+      --muted: #5A6470;
+      --rule: #E2E5EA;
+      --magenta: #E01878;   /* tagline gradient top */
+      --coral:   #F06030;   /* tagline gradient bottom */
+    }
+
+    /* Local font embeds (point to your assets/fonts/) — fall back to system stack
+       cleanly if files missing. Replace these src URLs to ship with the project. */
+    @font-face { font-family: "Outfit"; font-weight: 700;
+                 src: local("Outfit Bold"), local("Outfit-Bold"); }
+    @font-face { font-family: "Outfit"; font-weight: 600;
+                 src: local("Outfit SemiBold"), local("Outfit-SemiBold"); }
+    @font-face { font-family: "Poppins"; font-weight: 400;
+                 src: local("Poppins Regular"), local("Poppins-Regular"); }
+    @font-face { font-family: "Poppins"; font-weight: 500;
+                 src: local("Poppins Medium"), local("Poppins-Medium"); }
+
+    html, body {
+      background: var(--surface);
+      color: var(--charcoal);
+      font-family: "Poppins", system-ui, sans-serif;
+      -webkit-print-color-adjust: exact;
+      print-color-adjust: exact;
+      margin: 0; padding: 0;
+    }
+
+    .page {
+      width: 100%;
+      height: calc(297mm - 30mm);
+      display: flex;
+      flex-direction: column;
+      page-break-after: always;
+      break-after: page;
+    }
+    .page:last-of-type { page-break-after: auto; break-after: auto; }
+    .page[data-page="2"] .footer { margin-top: auto; }
+
+    .doc-header {
+      display: flex; justify-content: space-between; align-items: center;
+      border-bottom: 0.6px solid var(--rule);
+      padding-bottom: 3mm; margin-bottom: 4mm;
+    }
+    .doc-header .lockup svg { height: 14mm; width: auto; }
+    .doc-header .meta { text-align: right; }
+    .doc-header .meta .doc-title { font-family: "Outfit"; font-weight: 600; font-size: 14px; }
+    .doc-header .meta .doc-sub { font-size: 10px; color: var(--muted); }
+
+    .section { margin-top: 4mm; }
+    .section-label {
+      font-family: "Poppins"; font-size: 8.5px; font-weight: 600;
+      text-transform: uppercase; letter-spacing: 0.18em;
+      color: var(--muted); margin-bottom: 3mm;
+    }
+
+    /* Color swatches (page 1) */
+    .swatch-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5mm; }
+    .swatch { border-radius: 2.5mm; border: 0.5px solid var(--rule);
+              overflow: hidden; display: flex; flex-direction: column; }
+    .swatch .chip { flex: 1; min-height: 16mm; }
+    .swatch .meta-row { background: #FFF; padding: 2mm 3mm; }
+    .swatch .name { font-family: "Outfit"; font-weight: 600; font-size: 10px; }
+    .swatch .hex { font-family: "Poppins"; font-weight: 500; font-size: 9.5px; color: var(--muted); }
+
+    /* Type scale (page 1) */
+    .type-row { padding: 1.5mm 0; border-top: 0.4px solid var(--rule); display: flex;
+                justify-content: space-between; align-items: baseline; gap: 4mm; }
+    .type-row .label { font-size: 9px; color: var(--muted); width: 18mm; flex: 0 0 auto; }
+    .type-row .specimen { font-family: "Outfit"; flex: 1; }
+
+    /* Voice cards (page 2) */
+    .voice-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4mm; margin-top: 1mm; }
+    .voice-card { background: #FFF; border: 0.5px solid var(--rule);
+                  border-radius: 2.5mm; padding: 4mm; }
+    .voice-card .num { font-family: "Outfit"; font-weight: 700; font-size: 11px; color: var(--primary); }
+    .voice-card .label { font-family: "Outfit"; font-weight: 600; font-size: 14px; margin: 1mm 0 1mm; }
+    .voice-card .desc { font-size: 9px; line-height: 1.4; color: var(--muted); }
+
+    /* Tagline (page 2) */
+    .tagline-display {
+      font-family: "Outfit"; font-weight: 700;
+      font-size: 38px; line-height: 1.05;
+      background: linear-gradient(180deg, var(--magenta) 0%, var(--coral) 100%);
+      -webkit-background-clip: text; background-clip: text;
+      -webkit-text-fill-color: transparent;
+      margin: 1mm 0;
+    }
+
+    /* Do's & Don'ts (page 2) */
+    .rules-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; }
+    .rules-col h4 { font-family: "Outfit"; font-weight: 600; font-size: 13px; margin: 0 0 2mm; }
+    .rule-row { display: grid; grid-template-columns: 5mm 1fr; gap: 2mm;
+                padding: 1.4mm 0; font-size: 9.5px; border-top: 0.4px solid var(--rule); }
+    .rule-row .glyph { font-family: "Outfit"; font-weight: 700; font-size: 11px; }
+    .rule-row.do .glyph { color: #1F8A4C; }
+    .rule-row.dont .glyph { color: #D01316; }
+
+    .footer { border-top: 0.5px solid var(--rule); padding-top: 2mm;
+              display: grid; grid-template-columns: 1fr 1fr 1fr; font-size: 8.5px; }
+    .footer .col-left { font-weight: 500; }
+    .footer .col-center { text-align: center; font-style: italic; color: var(--muted); }
+    .footer .col-right { text-align: right; font-weight: 500; }
+  
+  /* === Screen-emulation: open in browser → looks like the A4 PDF =========== */
+  @media screen {
+    html { background: #d0d0d0; }
+    body { margin: 0; padding: 20px 0; }
+    body > section {
+      width: 210mm; min-height: 297mm; margin: 0 auto 20px;
+      background: #fff; box-shadow: 0 4px 24px rgba(0,0,0,0.18);
+      box-sizing: border-box; overflow: hidden;
+    }
+  }
+</style>
+</head>
+<body>
+
+<!-- ─── PAGE 1 — Identity ─────────────────────────────────────────── -->
+<section class="page" data-page="1">
+  <header class="doc-header">
+    <div class="lockup">
+      <!-- BRAND_LOGO_SVG (paste inline <svg>...</svg> here, ~200-400 chars) -->
+      <svg viewBox="0 0 100 28" xmlns="http://www.w3.org/2000/svg">
+        <text x="0" y="20" font-family="Outfit, sans-serif" font-weight="700" font-size="22"
+              fill="var(--charcoal)"><!-- BRAND_NAME --></text>
+      </svg>
+    </div>
+    <div class="meta">
+      <div class="doc-title">Brand Style Guide</div>
+      <div class="doc-sub">Identity &middot; <!-- DATE_YEAR --></div>
+    </div>
+  </header>
+
+  <div class="section">
+    <div class="section-label">01 / Logo</div>
+    <!-- Logo lockup + clearspace spec content here -->
+    <p style="font-size:10px;color:var(--muted);">Clearspace = X (= height of brand mark). Min size 12mm. Never recolour.</p>
+  </div>
+
+  <div class="section">
+    <div class="section-label">02 / Color Palette</div>
+    <div class="swatch-grid">
+      <div class="swatch">
+        <div class="chip" style="background: var(--primary)"></div>
+        <div class="meta-row">
+          <div class="name"><!-- COLOR_1_NAME --></div>
+          <div class="hex"><!-- BRAND_PRIMARY --></div>
+        </div>
+      </div>
+      <div class="swatch">
+        <div class="chip" style="background: var(--secondary)"></div>
+        <div class="meta-row">
+          <div class="name"><!-- COLOR_2_NAME --></div>
+          <div class="hex"><!-- BRAND_SECONDARY --></div>
+        </div>
+      </div>
+      <!-- REPEAT: add 4 more swatch blocks for 60-30-10 palette balance -->
+    </div>
+  </div>
+
+  <div class="section">
+    <div class="section-label">03 / Typography</div>
+    <div class="type-row">
+      <span class="label">H1 / 48/56</span>
+      <span class="specimen" style="font-size: 28px; font-weight: 700;">Display heading</span>
+    </div>
+    <div class="type-row">
+      <span class="label">H2 / 32/40</span>
+      <span class="specimen" style="font-size: 20px; font-weight: 700;">Section heading</span>
+    </div>
+    <div class="type-row">
+      <span class="label">Body / 12/18</span>
+      <span class="specimen" style="font-family: 'Poppins'; font-size: 12px;">The quick brown fox.</span>
+    </div>
+  </div>
+
+  <footer class="footer">
+    <div class="col-left">Page 1 / 2</div>
+    <div class="col-center"><!-- BRAND_NAME --></div>
+    <div class="col-right"><!-- BRAND_DOMAIN --></div>
+  </footer>
+</section>
+
+<!-- ─── PAGE 2 — Voice & Application ──────────────────────────────── -->
+<section class="page" data-page="2">
+  <header class="doc-header">
+    <div class="meta" style="text-align:left;">
+      <div class="doc-sub" style="font-size:9px;letter-spacing:.18em;text-transform:uppercase;">Part Two</div>
+      <div class="doc-title" style="font-size:18px;">Voice &amp; Application</div>
+    </div>
+  </header>
+
+  <div class="section">
+    <div class="section-label">04 / Voice Pillars</div>
+    <div class="voice-cards">
+      <div class="voice-card">
+        <div class="num">01</div>
+        <div class="label"><!-- PILLAR_1_NAME --></div>
+        <div class="desc"><!-- PILLAR_1_DESCRIPTION --></div>
+      </div>
+      <div class="voice-card">
+        <div class="num">02</div>
+        <div class="label"><!-- PILLAR_2_NAME --></div>
+        <div class="desc"><!-- PILLAR_2_DESCRIPTION --></div>
+      </div>
+      <div class="voice-card">
+        <div class="num">03</div>
+        <div class="label"><!-- PILLAR_3_NAME --></div>
+        <div class="desc"><!-- PILLAR_3_DESCRIPTION --></div>
+      </div>
+    </div>
+  </div>
+
+  <div class="section">
+    <div class="section-label">05 / Tagline Lockup</div>
+    <div class="tagline-display"><!-- BRAND_TAGLINE --></div>
+    <p style="font-size:9px;color:var(--muted);margin-top:1mm;">
+      Use only on light backgrounds. Never alter the gradient direction.
+    </p>
+  </div>
+
+  <div class="section">
+    <div class="section-label">06 / Do's &amp; Don'ts</div>
+    <div class="rules-grid">
+      <div class="rules-col">
+        <h4>Do</h4>
+        <div class="rule-row do">
+          <span class="glyph">✓</span>
+          <span><strong><!-- DO_1_LABEL --></strong> — <!-- DO_1_REASON --></span>
+        </div>
+        <!-- REPEAT: 3-4 do entries -->
+      </div>
+      <div class="rules-col">
+        <h4>Don't</h4>
+        <div class="rule-row dont">
+          <span class="glyph">✕</span>
+          <span><strong><!-- DONT_1_LABEL --></strong> — <!-- DONT_1_REASON --></span>
+        </div>
+        <!-- REPEAT: 4-7 don't entries -->
+      </div>
+    </div>
+  </div>
+
+  <footer class="footer">
+    <div class="col-left">Compiled <!-- COMPILE_DATE --></div>
+    <div class="col-center"><!-- BRAND_TAGLINE --></div>
+    <div class="col-right">Page 2 of 2</div>
+  </footer>
+</section>
+
+</body>
+</html>