# Design Language for gabs.cafe ## Aesthetics and Tone **gabs.cafe is a midnight transit-room — a 1962 airport lounge frozen behind a sheet of fogged plate glass, where the espresso is still warm and the conversation has been redacted.** The site reads like the lobby card for a film that was never released: confident mid-century geometry (Saarinen, Alvin Lustig, Paul Rand) cooled to the point where its colors have lost most of their saturation and slid behind a translucent frost. The aesthetic is *mid-century muted* — not cheerful Mad Men orange, not retro-novelty, but the *quiet* mid-century: a closed reservation desk at 2:14 AM, a single tungsten bulb behind a sandblasted glass partition, the geometry of an Eames LCW chair seen through your own breath on the window. **Mood signature.** The page is overcast. Not dark mode (which would be modern), not light mode (which would be cheerful) — a *third* register: a foggy daylight that never resolves, somewhere between a Helsinki morning at 9 AM in February and the inside of a thermos. Every surface is *behind* something. Every type element sits on a frosted card; every photograph is double-glazed; every accent color is dampened by 30–45% white veil. Saturation is held at 28–34% across the palette. The viewer is always *outside the room looking in* — the design intentionally stages a small barrier between the reader and the content, and that barrier is the personality. **Voice register.** Mysterious-moody, but never gothic, never noir-melodramatic. The mood is closer to **Antonioni than to film noir** — the unease of a perfectly composed empty room, the dread of a perfectly framed empty street. The copy speaks in clipped fragments. Names of coffees ("Brume," "Fermata," "Nordlys," "Indigo Hour") read like the chapter titles of a novel that was never finished. The cafe's hours appear as a glyph table rather than a list ("◐ 06–11 / ◑ 14–22"). The phone number is a service number from a discontinued exchange. The reader should suspect that *something has just happened here*, and that they have arrived a half-hour late. **Inspiration anchor list.** - *L'Avventura* (1960), Antonioni — the architecture of waiting. - Alvin Lustig's New Directions paperback covers, especially the 1949 Lorca — geometry as melancholy. - Saul Bass's title sequence for *Vertigo* — disquiet from pure shape. - Helmut Schmid's typographic posters of the 1960s — the calm side of grotesque type. - The Pan Am Worldport ticket counter (Idlewild Airport, 1960) at 3 AM, as imagined. - Ettore Sottsass's 1959 *Tchou* covers — flat geometric abstraction with reserved color. - Hilma af Klint's geometric series, desaturated. The site is, in one sentence: **a frosted mid-century reservation card pressed against an empty room.** ## Layout Motifs and Structure **Foundational grid.** A **9-column asymmetric grid** with hard *minimal-navigation* commitment. There is no top nav bar. There is no hamburger. There is no sticky header. There is no footer-mega-menu. There is *one* navigation element on the entire page: a vertical rail along the left margin showing four single-character glyphs (◇ Menu, ◐ Hours, ◑ Address, ◯ Letter) — each glyph occupies its own row of the rail at 64px square, separated by 96px of negative space. Glyphs are unlabeled in their rest state. Hovering a glyph causes an elastic-suspension panel to *snap* sideways from the left edge, displaying that section. There are no anchor links, no scrollspy, no breadcrumbs, no pagination. The reader has four ways to go and they are all silent. **Vertical organization.** The page is a single tall column at 880px max-width, centered, *but* aligned to **column 4 of the 9-column grid** rather than dead center — pushed slightly right of mathematical center. This off-center centering is the structural signature: the reader's eye consistently lands a half-column right of where it expects, producing a low-grade unease that never resolves. The right margin (5 columns wide) is mostly empty white-frost — a deliberate *Ma negative space* that holds the page open. **Card system: Plate Cabinets.** Every block of content lives inside a *plate* — a frosted-glass card with a 0.5px hairline border in `#3A4148` and a 1px inset highlight on the top edge only. Plates have a *consistent radius of 2px* — sharp enough to read as mid-century industrial, not soft enough to read as iOS. Plates are stacked with **30px gap** vertically and **never touch horizontally** (the off-center single-column rule eliminates horizontal adjacency entirely). Each plate is internally subdivided by a single hairline rule that runs at exactly 38.2% (golden-ratio short side) from the top — Lustig's compositional reflex. **The Reservation Card Hero.** The first viewport is one Plate Cabinet rendered as a **mid-century reservation card**: a 5:7 portrait card centered in the upper-right two-thirds of the viewport, leaving a 3-column blank gutter to its left containing only one element — a single hairline horizontal line drawn 62% of the way down the viewport, terminating exactly at the card's left edge. The card itself contains: the wordmark "gabs" in oversized geometric grotesque (320px cap height), the diaeresis-styled subtitle "café — open by glass, closed by fog," and a small typewritten reservation number (`№ 0247`) etched into the bottom-right corner. The card is *not* full-bleed; the page's frost-white background is visible all around it. This is intentional: the card is a *physical artifact*, not a screen. **The Menu (Plate Two).** Below the reservation card, the menu appears as a **bilingual ledger**: two columns of equal width, the left column listing coffee names in geometric grotesque uppercase, the right column listing tasting-note fragments in italicized small-cap grotesque. There are *no prices*. There are *no portion sizes*. There are *no order buttons*. There is exactly one row of marginalia at the very bottom of the menu plate: a single glyph (※) followed by "service rendered between 06:00 and 22:00, except 11:01–13:59." The menu is a poem masquerading as a price list. **The Hours Telegram (Plate Three).** A frosted plate containing only a 12-row glyph chart — each row is a day of the week, expressed as a Unicode arc (◐, ◑, ◒, ◓) showing morning vs evening service, plus a single column of times in JetBrains Mono. No headings, no day names spelled out — only Mo/Tu/We/Th/Fr/Sa/Su in two-letter grotesque caps. The reader has to decode the chart, and the chart rewards them with a kind of intimacy. **The Address Postcard (Plate Four).** A horizontal-format frosted plate. Left half: a hand-drawn (in the "Lustig-vector" style — flat, geometric, no gradients) abstract diagram of the cafe's location — a single intersection rendered as three geometric shapes (a rectangle for the building, a triangle for the corner, a circle for the cafe entrance) with a dotted line tracing the approach from the nearest tram stop. Right half: the address in three lines of geometric grotesque, the floor number (`Étage 2.1`) rendered in italic, and a single closing fragment ("ring twice — second bell"). No map embed. No phone CTA. No "get directions" button. **The Letter (Plate Five).** A long-form frosted plate at the end of the page — 700 words of mid-century-modern proprietor's letter, set in a humanist serif (Cormorant Garamond) at 16px / 1.78 leading, *as a deliberate contrast* against the geometric grotesque elsewhere. The letter is signed "— G.", undated, and ends with the single italicized line "the door is unlocked Tuesday after 21:00." **Vertical rhythm.** All vertical spacing is built from a **9-step modular scale**: 4 / 8 / 12 / 18 / 30 / 48 / 78 / 126 / 204 px. This is a φ-adjacent Fibonacci with mid-century proportional intuition (the 30/48 step is the hero gap; the 126 step opens the chapters). All margins, paddings, gaps, and offsets snap to this scale. **No 16px. No 24px. No 32px.** The standard tech defaults are absent and that absence is felt. **Off-grid intrusions.** Three times on the page, a single graphic element *breaks the column* and intrudes into the right-hand 5-column gutter: (1) a 240px geometric-abstract glyph next to the reservation card; (2) a 180×180px Lustig-vector chair-shape next to the menu; (3) a long, attenuated dotted line connecting the address postcard to a single em-dash floating 320px to its right. These intrusions are the only *asymmetric* events in an otherwise rigorously off-center column, and they punctuate the reading like ellipses in the prose. **No bento. No card-grid. No dashboard. No hero-dominant marketing layout.** The frequency analysis showed `card-grid` at 83% and `centered` at 82% — both rejected here. The page is a single asymmetric reading column with rail-anchored minimal navigation. That's the layout. ## Typography and Palette **Typeface system (3 faces, all on Google Fonts — verified):** 1. **Space Grotesk** (variable, weights 300–700) — the geometric-grotesque workhorse. Used for the wordmark, all card titles, the menu names, the hours glyph chart's two-letter day codes, the address. **Capital height matters more than x-height in mid-century typography**, so all uppercase settings receive a +0.04em letter-spacing and a +6% baseline lift to optically center against the geometric counters. 2. **Cormorant Garamond** (italic & roman, 400/500) — the *contrast voice*. Used only for: the proprietor's Letter, the italicized phrase fragments in the menu's tasting notes, and the single italicized closing line of every plate. Its presence is rare and felt — appearing in roughly 12% of total type. Cormorant's Lustig-paperback resonance does the heavy mid-century lifting. 3. **JetBrains Mono** (400/600, 11–13px only) — the technical voice. Used for: the reservation number `№ 0247`, the hours-chart times, the marginalia glyph annotations, and any numerical fragment. JetBrains is held *small and structural* — never display size, never as body. This keeps the page from drifting toward "tech aesthetic" while still letting numbers feel printed-card precise. **Type scale (Fibonacci-φ, in px):** 11 / 13 / 16 / 21 / 34 / 55 / 89 / 144 / 233 / 320. The wordmark "gabs" hits 320px (cap height) at desktop. The Letter sits at 16px. The marginalia sits at 11px. **No type at 12px, 14px, or 18px** — the standard CMS defaults are absent. **Letter-spacing rules.** Display grotesque uses `letter-spacing: -0.02em` at 233px+ (optical correction for large display), `0` at 89–144px, `+0.04em` at 21–55px (which is where the menu titles live, and where the spacing reads as "mid-century cafe-card label"), and `+0.12em uppercase only` for the tiny 11px marginalia metadata. Cormorant Garamond uses the typeface's own native spacing, untouched. **Palette: Translucent Frost (mid-century muted).** Eleven colors, organized in three layers: **Layer 1 — Frost (the page substrate):** - `#E9EBE6` *Vellum Frost* — base page background, a cool-white with a green-gray cast (∼3% G/R/B asymmetry favoring G). This is the dominant color of the page; everything else floats on it. - `#DDE0DA` *Pane Frost* — the plate fill color, applied at 78% alpha over Vellum Frost so the substrate's grain shows through. Plates read as glass, not paper. - `#F4F4EE` *Specular Frost* — the 1px inset highlight on each plate's top edge. Pure-white would be wrong; this is white with the lounge's tungsten cast filtered through frost. **Layer 2 — Graphite (the structural ink):** - `#3A4148` *Graphite Ink* — primary text color, hairlines, and plate borders. Not pure black, not blue-black — a graphite that reads as 1962-printed-ink at low pressure. - `#5C6168` *Half-Graphite* — secondary text, marginalia, italicized fragments. The Cormorant Garamond Letter is rendered in this color, never in Graphite Ink, because the Letter must read as *handwritten through the frost*. - `#9AA0A4` *Cold-Graphite* — disabled-state text (used only on the navigation rail's resting glyphs), the dotted line of the address-postcard map. **Layer 3 — Mid-century accents (each used exactly once on the page):** - `#7A8B6F` *Brume Olive* — the reservation card's `№ 0247` plate is tinted with this at 14% alpha. A 1962-airport-lounge olive, deeply muted (saturation 19%, lightness 49%). - `#8A6E5C` *Fermata Cocoa* — the menu plate's bottom marginalia row sits on a 9% alpha wash of this color. A muted cocoa-leather hue from a Saarinen Tulip chair seat. - `#5E6B82` *Nordlys Slate* — the hours plate's glyph row separator hairlines are this color. A muted Helsinki-window slate-blue, saturation 21%. - `#8C566A` *Indigo Hour* — the Letter plate's drop-cap and its closing italicized line use this color. A muted oxblood-rose, saturation 26%, the warmest moment on the page and the most personal. - `#C9C2A6` *Telegram Cream* — the address postcard's left-half (the diagram side) uses this as a 22% alpha wash. The only "warm" wash on the page; everything else is cool. **Hex values appear in CSS as custom properties** — `--frost-vellum`, `--graphite-ink`, `--brume-olive`, etc. — and the palette is *closed*: no other colors appear on the page. No hyperlink-blue. No error-red. Browser defaults are overridden. **Saturation discipline.** No color on the page exceeds 30% saturation in HSL. The page reads as *muted* in the frequency-analysis sense — the rare 27%-muted bracket. There is **no gradient** on the page (rejecting the 97% gradient convention). There is **no warm-glow** dominant register (rejecting the 97% warm convention) — the dominant register is *cool*. ## Imagery and Motifs **Photographic register: ABSENT.** The 98% photography convention is **rejected outright**. There are no photographs of coffee, no photographs of pastry, no photographs of an interior, no photographs of a barista, no photographs of beans, no photographs of the cafe's exterior. *The cafe does not show itself.* The reader sees only the frosted glass and what can be inferred from the geometric diagram. This is the most aggressive single rejection on the page and it is the source of the moodiness. **Geometric-abstract illustration system.** Every illustration on the page is a **Lustig-vector** — flat, geometric, no gradients, no shading, no perspective, no texture. Constructed from a closed kit of seven primitives: 1. **The Square** — at 4 fixed sizes (78, 144, 233, 320 px) and 3 rotations (0°, 8°, 17°). 2. **The Circle** — at 5 fixed sizes (12, 30, 78, 144, 233 px). Always solid fill, never stroked. 3. **The Triangle** — equilateral only, at 4 sizes; always pointing up or right (mid-century optimism vector), never down (death) or left (regression). 4. **The Half-Circle** — the four cardinal orientations (◐ ◑ ◒ ◓). These are the navigation glyphs and the hours-chart cells. 5. **The Hairline** — 0.5px stroke, only in `#3A4148` Graphite Ink, only horizontal or vertical or 38.2°. 6. **The Diaeresis Dot** — a 4×4px graphite dot used as marginalia bullets and as the dotted-line punctuation. 7. **The Vesica Lens** — two overlapping circles producing the almond-shape, used exactly twice on the page (in the geometric-abstract glyph next to the reservation card, and in the address postcard's chair-shape). **Vintage motif kit.** The "vintage" motif (24% in frequency analysis — neither rare nor overused, used here in a non-default direction) is invoked **only through 1962-airport-lounge artifacts**: - A **reservation number** (`№ 0247`) in a small box, the boxed `№` glyph rendered in JetBrains Mono with the surrounding box being a single Hairline rectangle. - A **stamp impression** in the address postcard's lower-right corner: a 60px circular stamp shape with the date "29 · IX · 62" inside, set in Cormorant Garamond italic with a 0.5px graphite ring. The stamp is rotated -7° and printed at 64% alpha, suggesting a real ink impression. - A **telegram tear** at the top of the hours plate: the top edge of the plate is rendered with a single 14-zigzag clip-path producing a torn-telegram-paper edge. This is the only non-rectilinear plate edge on the entire page. - A **single ledger ruling** in the menu plate: a 0.5px graphite hairline running the full width of the plate at the 38.2% line, with a tiny `※` glyph hung off its left end. **Texture: dual frost grain.** A single 280×280 base64-encoded SVG `feTurbulence` noise layer is applied as `background-image` over the entire `body`, at 11% opacity, in a cool gray. *Above* the plates, a second viewport-fixed grain overlay (180×180, 6% opacity, slightly warmer cast, rotated -3°) sits on top of everything as a `position: fixed; pointer-events: none` layer at `z-index: 9999`. The two grain layers do not align — they cross-hatch and produce a moving optical interference that reads as *the actual frost on the actual glass*. This is the most expensive visual move on the page and it is the reason every plate feels "behind something." **Motif choreography.** The seven primitives compose three set pieces: 1. **The Reservation Glyph (240px square, right of hero card).** A composition of one large square (`#3A4148` at 8% alpha), one centered Vesica Lens (`#7A8B6F` Brume Olive at 30% alpha), and three Diaeresis Dots in a vertical row inside the Vesica's almond. This is the page's "watermark" — abstract, melancholy, suggesting an eye but not declaring it. 2. **The Tulip Chair Schematic (180×180, beside menu).** A single rotated half-circle (`◑`) sitting on a triangle-stem on a small circle-base — the geometric Lustig-vector silhouette of a Saarinen Tulip Chair, in `#8A6E5C` Fermata Cocoa at 80% alpha. It is the only "object" depicted on the entire site. 3. **The Address Diagram (full half of the postcard plate).** Three rectangles (the building, in two graphite tones), one triangle (the corner), one circle (the cafe entrance, filled `#8C566A` Indigo Hour at 100% alpha — the only fully-saturated point on the page), connected by a 0.5px dotted line of Diaeresis Dots tracing from a tram-stop circle in the lower-left corner. **No street labels. No compass rose. No north arrow.** The diagram is private — it presumes the reader already knows the city. ## Prompts for Implementation **Build target.** One HTML file (`index.html`), one CSS file (`styles.css`), one ES module (`elastic.js`). No framework, no router, no service worker, no build step. **Total uncompressed bundle target: under 64KB** (this is a quiet, dense page — every byte should justify itself). No external image files; the only imagery is inline SVG (Lustig-vectors) and the two `feTurbulence` grain layers (also inline SVG via `data:` URI). **Page is a single full-screen narrative experience, not a marketing landing page.** The reader scrolls through five plates: Reservation Card → Menu Ledger → Hours Telegram → Address Postcard → Proprietor's Letter. There is no CTA. There is no email capture. There is no pricing block. There is no stat-grid. There is no testimonial section. There is no logo wall. There is no FAQ. There is no contact form. **The cafe does not solicit.** The reader either understands and arrives, or does not, and that is the entire commercial logic of the page. **Page event timeline (first paint to steady state — total 2.10s):** - **0.00s — first paint.** Vellum Frost background renders. The two grain overlays render on top. Nothing else visible. - **0.18s — the navigation rail emerges** from the left edge with elastic snap: the four glyphs (◇ ◐ ◑ ◯) translate from `translateX(-32px); opacity: 0` to `translateX(0); opacity: 1` over 320ms with `cubic-bezier(0.34, 1.56, 0.64, 1)` — a hard elastic overshoot of ~+8% then settle. Stagger between glyphs: 80ms. - **0.62s — the hero plate's hairline border draws** (path-draw-svg style, but the *border itself* — implemented via a `clip-path: inset(0 100% 0 0)` that animates to `inset(0 0 0 0)` over 480ms). The plate's hairline rectangle paints itself left-to-right, like a draftsman drawing it on paper. - **1.10s — the wordmark "gabs" etches in.** Each of the four letterforms is rendered as inline SVG with `stroke-dasharray` set to the path length. Strokes draw in left-to-right with a 60ms stagger between letters, each letter taking 380ms with `cubic-bezier(0.83, 0, 0.17, 1)`. Once a letter completes, its fill fades in over 140ms in `#3A4148`. - **1.74s — the Reservation Glyph's composition assembles.** The large square fades in first; 80ms later the Vesica Lens scales up from `transform: scale(0.7)` with elastic snap (`cubic-bezier(0.34, 1.56, 0.64, 1)`, 320ms); 60ms after that, the three Diaeresis Dots snap-in from `scale(0)` in stagger sequence (40ms each). - **2.10s — steady state.** The reader can now read. **Scroll behavior. NO PARALLAX.** The 95% parallax convention is rejected. The page scrolls 1:1 with cursor input. Parallax would lie about the document's flatness — the page is a *frosted artifact lying on a desk*, not a 3D scene. The grain overlay is the *only* element that doesn't scroll, and it is rigidly viewport-fixed (which is not parallax — it is a different and stricter contract). **Plate-entry stagger.** Each subsequent plate (Menu, Hours, Address, Letter) executes its entrance when its top edge crosses the viewport at `rootMargin: -160px 0px`. The plate translates from `translateY(40px); opacity: 0` to `translateY(0); opacity: 1` over 540ms with elastic settle — `cubic-bezier(0.34, 1.56, 0.64, 1)` — overshooting by ~6% before settling. Internal elements within the plate (rows of the menu, glyphs of the hours chart, the diagram primitives of the address postcard) stagger in at 60ms intervals after their parent plate's entrance completes. **Plays once per session.** **Elastic interaction system (the core pattern).** The `patterns: elastic` seed manifests through **a single, rigorously consistent elastic-snap motion language**, applied across exactly four interaction types and *nowhere else*: 1. **Navigation rail glyph hover.** The hovered glyph translates `translateX(+12px)` and grows to `scale(1.08)` with elastic snap (220ms, `cubic-bezier(0.34, 1.56, 0.64, 1)`). On `mouseleave`, it snaps back over 280ms with the same curve. The rail glyphs are the only interactive surfaces on the page, and the elastic snap teaches the reader the page's motion vocabulary on first contact. 2. **Plate hover.** Hovering a plate causes the plate's 1px inset highlight (Specular Frost) to brighten from 100% to 140% (clamped to white) over 180ms, *and* the plate elastically lifts by 4px on the Y-axis with a `cubic-bezier(0.34, 1.56, 0.64, 1)` 240ms snap. The 4px is small enough that it reads as the plate "leaning forward" rather than "popping out." 3. **Reservation glyph kinetic snap.** The Vesica Lens inside the Reservation Glyph elastically pulses every 12 seconds — scales from 100% to 104% and back, total duration 1.4s, with the elastic curve. This is the page's only ambient motion, and it is the *heartbeat* of the empty room. 4. **Letter drop-cap reveal.** When the Letter plate enters viewport, the drop-cap "T" (Cormorant Garamond, 78px, Indigo Hour) elastically scales from `scale(0.6)` to `scale(1.0)` over 540ms with overshoot. This is the warmest moment on the page and the elastic snap is most pronounced here — `cubic-bezier(0.34, 1.8, 0.64, 1)` — to mark the transition from geometric grotesque to humanist serif. **Cursor convention.** **No custom cursor. No cursor-follow blob. No magnetic buttons.** The frequency-analysis 84% cursor-follow convention and 76% magnetic convention are both rejected. The reader's OS cursor is unmodified. A frosted document doesn't track the cursor; it lets the cursor pass through it. **Storytelling priorities.** - The page is a 4-minute read, top to bottom. - The reader is meant to *decode* the page (the hours glyph chart, the address diagram) rather than *consume* it. - The Letter at the bottom rewards the reader who has scrolled all the way down with the only piece of warm-tone color on the page (the Indigo Hour drop-cap and signature) and the only piece of "real" prose. - The tonal arc is: **mystery (hero) → ritual (menu) → time (hours) → place (address) → voice (letter).** Each plate is a smaller, warmer, more intimate revelation, and the voice register softens from "anonymous typographic monument" at the top to "handwritten personal note" at the bottom. **Responsive behavior.** Below 768px viewport width, the navigation rail collapses from a left-edge vertical strip into a *bottom-edge horizontal strip* (still four glyphs, still no labels). The 9-column grid collapses to a 4-column grid; plates remain off-center (aligned to columns 2–4 of 4, leaving column 1 empty). The wordmark scales to 144px cap height. **No mobile-specific layout reordering** — the narrative sequence is preserved exactly. **What is explicitly NOT built.** No dark mode (the page is *already* an overcast register; there is no warmer or colder version). No print stylesheet. No service worker. No analytics. No social-share. No "newsletter signup." No reCAPTCHA. No cookie banner (the page sets no cookies). No JSON-LD schema-org markup beyond a minimal `Cafe` entity. No RSS. No `manifest.webmanifest`. No `apple-touch-icon`. The favicon is a single SVG of the ◐ glyph in Graphite Ink. ## Uniqueness Notes **Chosen seed:** *aesthetic: mid-century, layout: minimal-navigation, typography: sans-grotesk, palette: translucent-frost, patterns: elastic, imagery: geometric-abstract, motifs: vintage, tone: mysterious-moody.* This combination is, to my knowledge, never used together in the existing 190 designs — the closest neighbors use mid-century in different palette/tone registers (warm-inviting, optimistic-bright), or use translucent-frost with neubrutalism rather than mid-century, or use mysterious-moody with cyberpunk/dark-academia rather than with mid-century minimalism. **Five differentiators from other designs:** 1. **Photography is absent.** The 98% photography convention is the single most universal default in the corpus, and this design rejects it outright. There are zero photographs on the page. The cafe is depicted only through Lustig-vector geometric primitives and the inferred space behind the frost. This is the most aggressive rejection on the page and it is the source of the mood. 2. **No parallax, no cursor-follow, no magnetic, no spring, no stagger-on-everything.** The five most-frequent interaction patterns in the corpus (parallax 95%, cursor-follow 84%, spring 82%, stagger 77%, magnetic 76%) are *all* rejected, with one exception: stagger appears only at plate-entry (a controlled, narrative use), never as a hover-decorator. The page's interaction language is built almost entirely on the rare *elastic* pattern (17%), used in exactly four narrative-justified positions, with one consistent cubic-bezier curve. This is a calculated rejection of the corpus's interaction defaults. 3. **Off-center single-column at column 4 of 9.** The 82% centered + 83% card-grid + 30% dashboard layout defaults are all rejected. The page is a single asymmetric reading column whose mathematical center is intentionally *not* the page's center — a half-column right of optical center. This sustained off-center commitment produces the page's quiet unease and is invisible to a casual scroll-by, but felt. 4. **Closed 11-color palette, all under 30% saturation, no gradient, no warm dominance.** The 97% gradient + 97% warm conventions are both rejected. The palette is the rare *translucent-frost* register (3% in corpus), and every accent color is muted to 19–28% saturation. There is no gradient anywhere on the page — every fill is a flat color or a flat-color-at-alpha composite. This is the rarest palette discipline available in the corpus. 5. **The page solicits nothing.** No CTA, no email capture, no pricing, no order button, no testimonial, no logo wall, no FAQ, no contact form, no "book a table." The cafe's only invitation is a single italicized closing line in the proprietor's Letter ("*the door is unlocked Tuesday after 21:00*"), and the only navigation is four unlabeled glyphs. The page is, in the *editorial-flow* sense, a closed document — it is meant to be *encountered*, not *converted*. This narrative posture is the inverse of every CTA-heavy default. **Avoided patterns (per frequency analysis):** - Avoided: photography (98%), parallax (95%), gradient (97%), warm palette (97%), mono typography (95%), full-bleed layout (93%), cursor-follow (84%), card-grid (83%), centered (82%), spring (82%), stagger-as-hover (77%), magnetic (76%), hand-drawn aesthetic (96%), glassmorphism (67%). - Preferred (underused): translucent-frost palette (3%), elastic pattern (17%), minimal-navigation layout (6%), mysterious-moody tone (4%), mid-century aesthetic (12%), sans-grotesk typography (6%), geometric-abstract imagery (5%), vintage motif (24%, used here in a non-default 1962-airport-lounge direction rather than the typical retro-Americana direction). **The page in one image.** A frosted-glass plate, sitting on a vellum-cool desk, holding a 1962 reservation card whose number is `№ 0247`, whose proprietor signs only `— G.`, and whose door is unlocked Tuesday after 21:00.