# Design Language for chloengine.com ## Aesthetics and Tone chloengine.com is **a chrome-and-rubber sticker-laminated zine of a girl-engineer's bedside reference library, scrolled sideways down a Brooklyn loading-dock at golden hour**. The domain reads as a portmanteau — *chloe* (the engineer, the author of every annotation) bonded to *engine* (the apparatus she keeps maintaining) — and the design refuses to choose between the two: it is at once **the personal sticker-bombed laptop of a working systems engineer** and **a hand-bound technical commonplace book** that someone has photocopied, hole-punched, taped, sharpie-annotated, and then carried in a tote bag for three years until the corners feathered. The aesthetic is **street-style** (4% in the registry — actively underused, fully claimed) routed through a **scholarly-engineering imagination** rather than the usual graffiti-skate vocabulary. There is no spray-can wildstyle, no concrete texture, no skater's deck print, no airbrushed flame. What remains, deliberately, is street-style's **structural inheritance**: the **layered sticker stack**, the **bold flat sticker shapes**, the **hand-cut die-cut edges**, the **playful headline lockups in chunky rounded sans**, and the **conviction that a surface is a reading-record** — every sticker on a laptop lid is a citation of where the laptop has been. chloengine.com treats the page as **that laptop lid**: a high-contrast field of die-cut stickers, each sticker carrying a footnoted technical fragment, layered three deep and offset at sticker-natural angles. Crossed onto the street-style sticker grammar is the **book-scholarly** motif (5% in the registry — underused, fully claimed): every sticker is *secretly a book*. Each playful rounded headline carries a small caret-pointer to a footnote; each footnote lives in a marginal column the way a Renaissance commentary lives beside Boethius; each citation is real. The result is **a working engineer's reading-record**, presented in the visual register of a sticker-bombed Pelican case, but read with the patience of a marginal scholar. The tone is **professional** (5% in the registry — underused) executed not as corporate-authoritative neutrality but as **the quiet competence of an engineer who has done the reading**. The voice is dry, specific, footnoted, secretly fond of its objects: an apprentice who has rebuilt the engine three times and knows which bolt to torque first. No marketing tone. No exclamation. No "we" or "us." Every visible string is **written in the first-person engineer's notebook voice** — *I-found, I-noticed, I-rebuilt, I-prefer* — annotated with a small caret to a marginal citation. The mood is **golden-hour loading-dock + library reading-lamp**: warm chrome edges of late sunlight bouncing off a metal door, the cool green of a banker's lamp inside a private reading carrel, a faint hum of a transit fan, a sticker peeling at one corner where someone's thumb has lifted it a dozen times. This is *not* a brand site, *not* a SaaS landing, *not* a portfolio. It is a **reading-record in motion**, scrolled horizontally because the reader is walking the loading-dock, sticker by sticker, at the engineer's deliberate pace. ## Layout Motifs and Structure The structural commitment is **horizontal-scroll** (8% in the registry — underused) executed as a **single 8000px-wide loading-dock floor**, with the entire site living on one continuous horizontal track. There is no vertical scroll. The page begins at the dock's east end (entrance) and ends at the west end (colophon), and the reader walks the dock by horizontally scrolling — wheel, trackpad, or arrow keys all map to the same horizontal axis with `scroll-snap-type: x mandatory` quantising movement to one **bay** per snap. - **The Dock Floor.** The viewport is a fixed 100vh tall, with a `display: grid; grid-auto-flow: column; grid-auto-columns: 100vw;` track of **eleven bays** (each bay one viewport wide). The floor is laid out as a horizontal twelve-row grid within each bay — the rows representing dock-floor lanes — and the *layered sticker stack* is positioned absolutely within each bay using row/column anchors rather than free-form coordinates. The **dock horizon-line** runs at exactly 61.8% top across all eleven bays as a single unbroken 2px hairline in #0E0E10, the only continuous element across the whole 8000px scroll. This horizon is the **shelf edge** — every sticker, every bookmark, every annotation is anchored to it the way books anchor to a shelf. - **The Eleven Bays.** Each bay is a *room* the reader walks through, but rooms are organised horizontally not vertically: 1. **Loading Dock (entrance)** — chrome-warm field, one large 36vw round-rect sticker reading `chloengine` in chunky rounded sans, peeled at the upper-right corner with a 8° lift, three smaller die-cut stickers stacked at offset angles below, one bokeh-orb cluster bleeding across the upper-right margin. 2. **The Manifest** — a horizontal manifest-list of 12 numbered engineering principles, each one die-cut as a 220×140 sticker, each carrying a single sentence in playful rounded sans plus a small caret-footnote in the margin. The manifest reads left-to-right as the reader scrolls. 3. **The Engine Room** — a single large exploded-axonometric SVG of a three-stage compute engine (input pipeline, scheduler, ledger), drawn in pure 1.6px hairlines with chunky rounded part-labels. Each label is magnetic-attractive within a 90px radius (see Patterns) and pulls toward the cursor as a small chunky sticker. 4. **The Reading-Record** — twelve stacked book-cards, each rendered as a sticker on the spine of a book, organised as a horizontal **dock-shelf** with the spines facing the reader. Each spine carries a real citation from a real engineering text — Knuth, Hoare, Lamport, Liskov, Gjessing, Granlund — and a small marginal annotation in the engineer's own voice. 5. **Margin Notebook** — eight columns of negative space with one annotation per column, in the style of a Renaissance marginal commentary: a small drop-cap die-cut sticker, a fragment of typed footnote text, a hand-drawn caret connecting back to the prior bay's sticker. Each annotation carries a footnote-superscript in the lower-right. 6. **Sticker Wall (the artefact bay)** — the densest bay, 24 layered stickers covering the entire 100vw floor in a high-contrast collage, each sticker a die-cut illustration of a working tool (a mu-metal can, a tape measure, a spool of solder, a binder clip, a card-punch chad). This bay reads as the *artefact wall* of the reading-record. 7. **The Lookbook** — a horizontal scroll-snapped row of nine 320×440 sticker-mounted photo-stand-ins (no real photos: each is a duotone CSS-gradient block representing a piece of equipment), each captioned with a small footnote. 8. **The Errata** — a single large open-codex SVG (book-scholarly motif) lying flat on the dock floor, both pages visible, with hand-drawn caret-corrections in red ink and chunky rounded annotations in the right margin. This is the only red on the entire site. 9. **Field Notes** — eight small bay-cards, each a folded-paper sticker with a single typed sentence in mono and a hand-drawn arrow pointing to the next bay. 10. **Colophon Wall** — a square 32×32 sticker-grid of small mono-set credits (type, palette, seed, date), each credit set on its own die-cut sticker. 11. **The Closing Door** — the final bay, mostly empty chrome-warm field with a single sticker in the lower-right corner reading `end of dock — turn around and walk back` in italic rounded sans. The reader can scroll back to the entrance, or use the keyboard left-arrow to step bay-by-bay. - **No Hero. No Vertical Scroll. No Cards-as-Marketing-Wall.** The page deliberately omits the corpus-saturated layout patterns — full-bleed (90%), centered (80%), card-grid (73%), asymmetric-vertical-stack — by simply having no vertical axis. Every section is a *bay*, every bay is one viewport, and the reader's input device is rerouted to horizontal motion. - **Sticker Layering Rules.** Every sticker has exactly three z-layers it can occupy: **shelf** (z 1, behind the horizon), **counter** (z 2, on the horizon), **lift** (z 3, peeled forward of the horizon with a small drop-shadow). No sticker may peel beyond 12° rotation. No sticker may overlap more than two others. The layering grammar is the visual rhythm of the scroll, and it is consistent across all eleven bays. ## Typography and Palette **Typefaces — Google Fonts only, all confirmed available:** - **`Fraunces`** (variable, opsz 9–144, weights 400–900, italic + roman) — the **principal scholarly serif**, used for body annotations and the engineer's own first-person voice. Fraunces is selected because its display-optical-size variant carries the warm vernacular character of a 1970s technical-press serif (the kind of face used in O'Reilly's earliest typography or in early MIT Press technical monographs) while its text-optical-size remains crisply readable at 0.92rem footnote scale. Fraunces does the *book* half of the book-scholarly motif. Used at: 1.05rem roman for body marginalia, 0.92rem italic for footnotes, 1.6rem italic for bay-titles, never above 2.4rem. - **`Fredoka`** (variable, weight 400–700, normal width) — the **chunky rounded sans** that does the *sticker-headline* half of the lockup. Fredoka is the playful-rounded face of choice (3% in the registry — underused) and is selected over Quicksand, Comfortaa, and Nunito because its terminals are flat-cut rather than hairline-thin, which makes it read as **hand-pressed sticker** rather than as 2010s-startup-friendly. Used at: 12vw for the wordmark, 3.6rem for sticker headlines, 1.4rem for sticker body, 1.0rem for sticker captions. Never italic — Fredoka's italic is weak; we keep it strictly upright. - **`JetBrains Mono`** (single weight 500, italic + roman) — used **only on stickers that are imitating typewritten field-notes** (Field Notes bay) and for the entire Colophon Wall. JetBrains is chosen over IBM Plex Mono because it leans slightly slab-square and reads as **mechanical-engineer's notebook** rather than cyberpunk-terminal. Used at 0.86rem with `font-feature-settings: "tnum", "ss19"` for the slashed zero. The three faces sit in a strict hierarchy: **Fraunces for the engineer's own voice and footnotes, Fredoka for sticker headlines and section names, JetBrains Mono for typewritten field-notes and the colophon**. There is no fourth face. There is no display face beyond Fredoka's largest cuts. **Palette — high-contrast (17% in the registry) executed as chrome-warm + ink-black + reading-lamp green, NOT the usual neon-bright dichromatic stamp:** The palette is built around three counterpoised temperature poles — **warm chrome** (the loading-dock at golden hour), **ink-black** (the engineer's pen), and **reading-lamp green** (the banker's lamp on the carrel) — with two accent colours used sparingly. Every value references a real surface in the engineer-girl's working day. - `#F2EDE2` — **chrome-warm cream** — the principal page wash, the colour of late-afternoon sunlight bouncing off galvanised metal. Covers ~74% of the page. - `#0E0E10` — **press ink** — the principal text colour and the dock horizon line; never pure black, the deep neutral-grey-black of pressed printer's ink on uncoated paper. - `#1F4733` — **reading-lamp green** — used for the marginal annotation rules, the manifest sticker borders, and the engineer's caret-footnote arrows. The colour of the wool shade on a banker's lamp. - `#E94F37` — **errata red** — used *only* on the Errata bay's caret-corrections and on the Closing Door arrow. Less than 0.5% of total surface area. - `#F3C969` — **dock-glow yellow** — the warm rim of every bokeh-orb (see Imagery), and the inner fill of the Manifest bay's principle-numerals. The colour of golden-hour bouncing off a yellow forklift. - `#7AAEA0` — **carrel-lamp glow** — the soft outer halo of the bokeh-orbs at the warm-cool seam where reading-lamp green diffuses into chrome-warm cream. - `#3B5BDB` — **annotation-blue** — used for hyperlinks within annotations and for the small footnote-superscripts. The blue of a Bic pen on yellow legal pad. - `#C8B79A` — **kraft-warm** — the secondary sticker-fill colour, the warm tan of unbleached kraft paper sticker-stock. The palette's **high-contrast** discipline is enforced not by extreme value separation alone but by **sticker-edge contrast**: every sticker has a 2.4px hard die-cut outline in #0E0E10 that establishes the contrast, regardless of fill colour. The chrome-warm wash and the ink-black die-cut together compose the high-contrast register. This is **high-contrast as printmaking discipline**, not as neon-stamp dichromatic flatness. The palette is gradient-poor by design. There are exactly **two gradients** on the entire site, both used in the bokeh-orb halos. No mesh-gradients. No hero-gradients. No CTA-gradients. ## Imagery and Motifs The visual world is built from five motif families, all hand-composed from SVG, CSS, and exactly two raster assets. **Zero photography (98% in the registry — its exclusion is the largest single deviation).** Zero 3D. Zero stock illustration. Zero icon-fonts. **1. Bokeh Background (bokeh-background imagery, 6% in the registry — underused, actively claimed).** The chrome-warm cream wash carries a *single layer* of bokeh-orb scatter — twelve large soft circles at 220–520px diameter, each composed of two nested CSS `radial-gradient()` rings: an inner fill of #F3C969 at 0.18 opacity bleeding to a soft outer rim of #7AAEA0 at 0.08 opacity. The bokeh layer is **fixed-positioned behind the dock track** and parallaxes very slightly with horizontal scroll at -8% the scroll-rate, simulating the *out-of-focus background* of a 50mm-wide-aperture photograph of the dock. The bokeh is *not* the cyberpunk-neon halo of the corpus's prior bokeh uses; it is the **golden-hour photographic bokeh** of a real loading-dock at 5:18 PM in autumn. There is exactly one bokeh layer; no sparkle, no twinkle, no shimmer animation — the orbs are static drift only. **2. Layered Sticker Stack (street-style aesthetic, 4% in the registry — underused, actively claimed).** The page's principal visual unit is **the die-cut sticker**: a flat-fill rounded shape with a 2.4px hard outline in #0E0E10, optionally rotated 0–12°, optionally lifted with a 4% drop-shadow at z-3. Every sticker is hand-composed in SVG with a deliberately **slightly imperfect path** — corners that don't quite round-trip cleanly, edges that wobble 0.3px from perfect — to read as **die-cut by an aging plotter** rather than as Figma-vector-clean. There are five sticker shape templates: - **Round-rect headline** (32×16 ratio, used for bay-titles and the wordmark); - **Burst** (eight-pointed playful star, used for emphasis stickers); - **Folded-paper** (with a small 12° corner-fold, used for Field Notes); - **Book-spine** (tall thin rectangle, used in the Reading-Record); - **Tag** (a price-tag silhouette with a single eyelet, used for the Errata corrections). No sticker uses a soft drop-shadow — only a single 2px hard offset shadow in #0E0E10 at 14% opacity for the lifted z-3 layer. **3. Book-Scholarly Inscriptions (book-scholarly motif, 5% in the registry — underused, actively claimed).** Embedded inside the street-style sticker grammar are **real book-scholarly artefacts**: an open codex (the Errata bay), a marginal commentary (Margin Notebook bay), a row of book-spines on a shelf (Reading-Record bay), and a hand-drawn caret-pointer connecting every Fredoka sticker-headline to a Fraunces footnote. The caret is the **bridge** between the two halves of the design's grammar — sticker on one side, marginalia on the other — and it appears 47 times across the site, always drawn as a tiny hand-traced SVG mark in #1F4733 reading-lamp green. The book-spines in the Reading-Record bay carry real cited engineering texts; the open codex in the Errata bay carries real corrigenda in the engineer's voice (`"this passage misstates the bound on stage 2 — should be O(n log n), not O(n²) — see fn 19"`). **4. The Engine Diagram (custom-illustration, 1% in the registry).** The Engine Room bay holds a single 92vw × 72vh axonometric SVG of a three-stage compute engine — input pipeline (left), scheduler (centre), ledger (right) — drawn entirely in 1.6px hairline #0E0E10 strokes with chunky rounded labels in Fredoka. The drawing references the visual style of **1972 Cambridge CompSci lecture notes, redrawn on a Brooklyn napkin**: rigid axonometric projection, no perspective, no shading, no fill, just hairlines and labels. Each label is a **magnetic chunky sticker** that pulls toward the cursor (see Patterns). The diagram is ~22kb gzipped and is the largest single asset on the page. **5. The Tiling Kraft-Paper Texture (paper-aged imagery, 0% in the registry — fully claimed).** One 480×480 tiling PNG (~12kb) gives the chrome-warm wash a faint kraft-paper grain, set as `background-blend-mode: multiply` over the #F2EDE2 base at 0.36 opacity. The texture is a hand-scanned sheet of unbleached kraft sticker-paper, scanned at 600dpi, desaturated, and tiled. It is the *first of the two raster assets* on the entire site. **6. The Forklift Bokeh PNG (small dock-photo silhouette).** A single 1200×600 PNG (~28kb) of a deeply blurred forklift silhouette in golden-hour, sitting at very low opacity (0.18) at the bottom edge of bays 7–9 only. This is the *only photograph-derived asset* on the entire site, and it is so blurred that it functions as background bokeh, not as imagery. It is the second and final raster asset. **Excluded categories (deliberate negative imagery):** no neon-glow, no glassmorphic-cards (68% in the registry — pointedly excluded), no gradient-mesh, no 3D-render, no isometric-icons, no lens-flare. The bokeh-orbs are the *only* glow on the site, and they read as warm photographic bokeh, not as neon. ## Prompts for Implementation Build chloengine.com as **one HTML document, one CSS file, one ES module, and exactly two raster assets**: `kraft.png` (480×480 tiling kraft sticker-paper, ~12kb) and `forklift-bokeh.png` (1200×600 deeply-blurred forklift silhouette, ~28kb). No framework. No bundler. No webfont self-host (use Google Fonts CDN — `Fraunces:ital,opsz,wght@0,9..144,400..900;1,9..144,400..900&family=Fredoka:wght@400..700&family=JetBrains+Mono:ital,wght@0,500;1,500&display=swap`). No Lottie. No WebGL. No canvas. No video. The whole experience is **static SVG, two CSS radial-gradient layers, two tiling/positioned PNGs, and one horizontal-scroll choreographer**. **Storytelling spine.** The page is *one slow walk west along an 8000px loading-dock at 5:18 PM*. The reader enters at the east-end Loading Dock, reads the Manifest sticker by sticker, walks past the Engine Room, scans the Reading-Record, reads the marginal commentary, lingers at the Sticker Wall, glances through the Lookbook, corrects the Errata, signs the Field Notes, salutes the Colophon Wall, and arrives at the Closing Door. The full traversal takes a deliberate ~6 minutes at the engineer's pace, longer if the reader stops to read the footnotes. There is **no pricing block, no plan grid, no testimonial wall, no statistics dashboard, no signup form, no FAQ, no "trusted by" logo strip, no contact form, no CTA button anywhere on the entire page**. **Horizontal-scroll choreography.** The entire site lives on a single horizontal track. Vertical wheel/trackpad input is intercepted in JS and remapped to horizontal scroll; arrow-left/arrow-right keys snap one bay; Page-Up/Page-Down snap three bays; Home/End jump to the dock ends. `scroll-snap-type: x mandatory` quantises movement to bay boundaries. On touch devices the track reads horizontal swipes natively. A small **dock-position indicator** (a die-cut Fredoka sticker reading `bay 03 / 11`) sits fixed in the lower-right and updates as bays scroll past the centre of the viewport. The dock horizon-line at 61.8% top remains pinned across all bays — it is the only element that does not translate horizontally. There is **no vertical scroll** anywhere on the site; the document `` is `overflow-y: hidden; overflow-x: auto`. **Magnetic interactions (magnetic, 65% in the registry but used here in a deliberately small surface area).** Magnetic attraction is enabled on **exactly one class of element** — the Engine Room labels — and on **the Closing Door arrow**. Each magnetic element has a 90px attraction radius; within the radius the element translates toward the cursor at a damping factor of 0.18 with a `cubic-bezier(0.22, 1, 0.36, 1)` ease, capped at 12px translation. No other element on the site is magnetic. This is a refusal of the corpus's saturated cursor-magnetism — magnetism is reserved for *parts that should look pickable*, like engine labels you might pluck off the diagram. **Sticker peel hover (street-style hover-lift).** Every sticker, on hover, lifts from z-2 to z-3 with a 200ms `cubic-bezier(0.85, 0, 0.15, 1)` ease, gaining its 2px hard-offset shadow and a 1.5° rotational tilt. This is the *only* hover affordance on the page. The cursor itself remains the OS default. There is no custom cursor. **Caret-footnote choreography.** When a sticker's hover-lift fires, its associated caret-footnote in the marginal column gains a 1.4px reading-lamp-green underline, drawn left-to-right over 360ms, and the footnote's superscript number scales 0.9 → 1.0. This is the **secret structural delight** of the site: every sticker is bound to its footnote, and the binding is visible on hover. **Reduced motion.** With `prefers-reduced-motion: reduce`, magnetic attraction is disabled, sticker-peel hover-lift becomes opacity-only at 240ms, the bokeh parallax stops translating, and the caret-footnote underline-draw becomes a single 200ms fade. The horizontal-scroll-snap remains, because horizontal navigation is the structural spine and not a motion effect. **Cursor.** The default OS cursor remains. This is a refusal of the corpus-saturated cursor-follow pattern (75%). The page's interactivity is announced by sticker-peel hover and magnetic engine-labels — both visible to the cursor's neighbourhood, not narrated by a custom cursor. **Sound.** No audio. The implied dock hum and reading-lamp click are descriptions of mood, not features. **Bias every implementation decision toward (1) the dock's golden-hour warmth, (2) the engineer's footnoted patience, and (3) the sticker's flat die-cut conviction.** Whenever a choice presents itself between *more chrome / more matte*, choose more matte. Whenever a choice presents itself between *more sticker / fewer stickers*, choose fewer but better — every sticker carries a real footnote. Whenever a choice presents itself between *more colour / less colour*, hold to the eight-value palette and refuse the ninth. ## Uniqueness Notes This design commits to the following differentiators, chosen explicitly to avoid duplicating other CMassC sites and to lean into the underused patterns surfaced by frequency analysis: 1. **Street-style (4%) routed through a scholarly-engineering imagination, not a graffiti-skate vocabulary.** The corpus's prior street-style sites lean on graffiti, concrete, and skate-deck signal. chloengine.com refuses every one of those tropes and keeps only street-style's *structural inheritance* — layered die-cut stickers, hand-cut edges, chunky rounded headline lockups — and crosses it with a Renaissance-marginalia book-scholarly grammar. The result is **street-style with zero spray-can, zero skate, zero concrete, and zero graffiti**, which makes its street-style inheritance load-bearing rather than decorative. 2. **Horizontal-scroll (8%) executed as a single 8000px loading-dock floor with an unbroken horizon line, not a carousel of cards.** The corpus's prior horizontal-scroll sites typically use horizontal motion as a contained *gallery* between vertical sections. chloengine.com makes horizontal motion the **only motion direction on the entire site**: there is no vertical scroll, the body is `overflow-y: hidden`, and the dock horizon at 61.8% top runs continuously across all eleven bays. The reader walks the dock; they do not scroll a feed. 3. **Bokeh-background (6%) reframed as a golden-hour loading-dock photographic bokeh, not a cyberpunk neon halo.** The corpus's prior bokeh uses lean cool/neon. chloengine.com's bokeh is **warm, photographic, golden-hour**, composed of two-stop radial gradients in #F3C969 → #7AAEA0 at low opacity, sitting at 0.18 max opacity behind the dock track. There is no sparkle, no twinkle, no shimmer — the bokeh is static drift simulating a 50mm wide-aperture photograph. 4. **Book-scholarly motif (5%) embedded inside a street-style sticker grammar, with caret-footnotes as the load-bearing bridge.** The corpus's prior book-scholarly sites stay in a single visual register — Cormorant, marble, parchment, leather. chloengine.com **forces a collision** between street-style sticker (Fredoka chunky sans, die-cut outlines) and book-scholarly marginalia (Fraunces italic, footnote superscripts, hand-drawn carets) and uses the **caret-footnote** as the structural bridge that unites them. Every sticker carries a caret to a footnote; the caret is the design's secret grammar. 5. **Playful-rounded (3%) executed in Fredoka, not Quicksand/Comfortaa/Nunito.** The corpus's prior playful-rounded uses lean toward Quicksand, Comfortaa, and Nunito — three faces with hairline-thin terminals that read as 2010s startup-friendly. chloengine.com chooses **Fredoka** for its flat-cut terminals, which give it the **hand-pressed sticker** character rather than the friendly-app character. Fredoka is paired with Fraunces (a 1970s technical-press serif), which the corpus does not use. 6. **High-contrast (17%) executed as printmaking discipline (chrome-warm + ink-black + reading-lamp green), not as neon-stamp dichromatic flatness.** The corpus's prior high-contrast palettes either lean dichromatic-neon or pure-black-on-pure-white. chloengine.com builds high-contrast through **2.4px hard die-cut outlines on every sticker** — the contrast lives in the edge, not in the fill — and the palette is a **three-pole composition** (warm chrome / press ink / lamp green) plus five accents, never reduced to a single dichromatic stamp. 7. **Magnetic interaction (65%) used at deliberately small surface area (one class of element).** The corpus saturates magnetic cursor-attraction across the whole page. chloengine.com restricts magnetism to **exactly one structural class** (Engine Room labels, plus the single Closing Door arrow), so when magnetism fires the reader feels they have **plucked something specific**, not "the page is alive." This is magnetism as *affordance*, not as ambient delight. 8. **Professional tone (5%) executed as the engineer's first-person notebook voice, not corporate-authoritative neutrality.** The corpus's prior professional-tone sites typically use third-person corporate copy. chloengine.com writes every visible string in **first-person engineer's notebook voice** (`I-found, I-noticed, I-rebuilt`) and footnotes every claim. The professional register is *competence under scrutiny*, not *authority over the reader*. 9. **Zero photography (98% saturation in the corpus) — except one deeply-blurred forklift silhouette functioning as bokeh.** The clay tablets, codex, engine diagram, sticker stack, and book-spines are all hand-drawn SVG. The single PNG of a forklift sits at 0.18 opacity and is so blurred it reads as background bokeh, not as photo-imagery. This is the corpus's largest deviation, kept honest by allowing one photograph at sub-photographic legibility. 10. **Exactly three Google Fonts (Fraunces / Fredoka / JetBrains Mono), no display face beyond Fredoka's largest cuts, wordmark in Fredoka.** No fourth face. No fifth weight. The Fraunces/Fredoka pairing in particular is **not present in the corpus** — Fraunces is rare (under 1%), Fredoka is rare (under 1%), and the pairing is unique among 120 prior designs. 11. **Frequency analysis cross-references — patterns avoided on purpose:** glassmorphism (68%), card-grid (75%), spring (75%), cursor-follow (75%), parallax (94%), photography (98%), gradient (96%), mono typography (95% — JetBrains is third-tier here, used only on Field Notes and Colophon), full-bleed (90%), centered (82%), pastoral-romantic tone (25%), hand-drawn (95% — chloengine's hand-drawn quality is *die-cut sticker hand-drawn*, not the corpus's typical sketchbook hand-drawn). Each of these saturated patterns is either fully absent or rephrased into something the corpus has not seen — horizontal-scroll replaces full-bleed verticality, bokeh-background replaces gradient-hero, sticker-stack replaces card-grid, caret-footnote replaces underline-draw. **Documented chosen seed:** *aesthetic: street-style, layout: horizontal-scroll, typography: playful-rounded, palette: high-contrast, patterns: magnetic, imagery: bokeh-background, motifs: book-scholarly, tone: professional.* Of the eight seed dimensions, six land in actively underused corpus territory (street-style 4%, horizontal-scroll 8%, playful-rounded 3%, bokeh-background 6%, book-scholarly 5%, professional 5%); only high-contrast (17%) and magnetic (65%) are common, and both are taken in directions the corpus has not seen — high-contrast as printmaking-edge discipline rather than dichromatic flatness, and magnetic restricted to one structural class of elements rather than as ambient cursor-feel.