@stylecrib/cli 0.3.1 → 0.3.2

package/themes/editorial/theme.yml

@@ -0,0 +1,173 @@
+# Editorial — Family C, Editorial & Print.
+#
+# Photography-first quarterly register. Off-white gallery-canvas
+# (#fafafa) with cold near-black ink (#0a0a0a) and ONE saturated
+# vermilion accent (#b81a1a) used sparingly for issue markers and
+# hover states. Sharp corners everywhere (0px radius). The photograph
+# does 90% of the design work — type stays small, precise, and out of
+# the way of the image.
+#
+# Authored 2026-07-04 as an upgrade to the v1 Editorial theme, which
+# rendered as an archetype fallback rather than a full composition.
+# Influence anchor (per Matt's pick): Aperture — a photography-forward
+# quarterly. Placeholder brand: "HELIOGRAPH" — a fictional photo
+# quarterly (heliograph is an early-photography term, sun-drawing).
+# Original name, original copy — no reproductions of any reference.
+#
+# The register is DISTINCT from other Family C bases:
+#   - Ember Poster is warm-dark editorial serif with hand-drawn ornaments
+#   - Case Panel is agency portfolio bento
+#   - Marker Mag is punk zine chaos
+#   - Pill Editorial is 999px cultural editorial (Black-cultural studio)
+#   - Cabana Poster is vintage travel-poster warmth
+# Editorial (Aperture-anchored) fills the PHOTOGRAPHY-FIRST QUARTERLY
+# slot — where the image is the primary design element and the type
+# is the caption underneath.
+#
+# Fifteenth theme via the v2 harness. Sixth Family C theme. This is
+# an UPGRADE of an existing v1 theme, not a new-base candidate.
+
+name: Editorial
+concept: Photography-first quarterly register — off-white gallery canvas at #fafafa with cold near-black ink (#0a0a0a) and ONE saturated vermilion accent (#b81a1a) used sparingly. Massive full-bleed photograph real estate as the composition anchor; small precise type as caption. Sharp corners everywhere. Sequential photo essays with tiny caption strips beneath each frame. Contributor bios as small headshot grids. Reads like a fine-art photography quarterly, not a literary magazine.
+influence: |
+  Fine-art photography quarterlies (Aperture at its most spartan,
+  Foam Magazine, IMA Magazine, The Photographic Journal). Gallery
+  publication design (Gagosian catalogues, David Zwirner books at
+  the type-restrained end). Distinct from other Family C bases
+  through PHOTOGRAPHY-AS-PRIMARY-DESIGN-ELEMENT — the image
+  dominates the composition; type is reduced to caption weight.
+
+family: C
+base_number: 29
+base_note: |
+  Family C editorial subregion, PHOTOGRAPHY-FIRST slot. All other
+  Family C bases have significant type-driven display moves (monumental
+  serif, cut-and-paste zine chaos, cultural pill display, vintage
+  outlined wordmark). Editorial as an Aperture-anchored quarterly
+  inverts that — the type stays SMALL and PRECISE, and the FULL-BLEED
+  PHOTOGRAPHY carries 90% of the design impact. This is not a new-base
+  candidate; it's an upgrade of the existing v1 Editorial slug from
+  archetype-fallback to a proper bespoke composition.
+
+render_url: http://localhost:5173/themes/editorial
+
+surface: web
+
+typography:
+  display: A precise geometric grotesk with quirky wide letterforms — the reference uses a Söhne / Grafik / Founders Grotesk / GT America family. Free fallback stack — "Neue Haas Grotesk Display", "Space Grotesk", "Inter", system-ui, sans-serif. Weight 500-700, mixed case for section titles + photographer names, UPPERCASE only for the nameplate wordmark. Top of scale ~48px for essay titles, 28px for section headings — deliberately RESTRAINED so the photograph carries the drama. Small caps at 10-11px for micro-labels (issue number, date, photographer credit).
+  body: The reference uses a text-optimized serif for essay body copy — Newsreader / Newzald / Domine / EB Garamond family. Free fallback stack — "Newsreader", "Domine", "Georgia", serif. Weight 400 for body, 400 italic for photographer credit lines. 14-15px body copy, line-height 1.55. Small captions at 11-12px in the display sans, not the body serif.
+  mono: none. Editorial is a consumer publication surface. Mono has no role.
+  scale: 1.25 (perfect fourth — restrained, so composition and photography carry the drama)
+  eyebrow_exception: |
+    Editorial LEGITIMATELY uses small uppercase 0.14em-tracked 10px
+    labels as ISSUE NAMEPLATE MARKS ("ISSUE 04 · MARCH 2026" in the
+    masthead, and "PLATE 07 / 12" for photo-sequence markers). This
+    is a THEME-SPECIFIC EXCEPTION to the universal slop-blocklist —
+    the reference publications use these EXACTLY in this register, as
+    diegetic publication markers rather than as decorative eyebrow
+    slop. Every use is deliberate and reference-anchored; every use
+    site must be manually preserved during harness grading.
+
+palette:
+  bg: "#fafafa"           # canvas — off-white gallery ground
+  surface: "#ffffff"      # pure white — inverted band + card fill
+  ink: "#0a0a0a"          # near-black cold press ink
+  accent: "#b81a1a"       # vermilion — the one saturated accent
+  cream: "#f5f0e5"        # warmer cream — used ONLY for cover-stock inverted band
+  darkInk: "#000000"      # pure black — masthead nameplate
+  mute: "#6a6a6a"         # dimmed ink — captions + micro-labels
+
+density: airy
+
+motion: |
+  Ships live in the section renderer (no external dependencies):
+  1. Hero photograph fade-in — the full-bleed cover image opens from opacity 0 + scale(1.02) to opacity 1 + scale(1) over 1400ms cubic-bezier(0.23,1,0.32,1) on first paint.
+  2. Progressive image reveal — every photograph on the page transitions from blur(8px) + opacity 0.3 → blur(0) + opacity 1 on IntersectionObserver at 25% visibility, 900ms cubic-bezier.
+  3. Caption strip fade — each photograph's tiny caption strip fades in 200ms AFTER its photograph finishes revealing, so the caption reads AFTER the image is seen.
+  4. Sticky reading progress — a thin horizontal bar in the vermilion accent grows across the top of the viewport as the user scrolls, indicating essay progress. Fixed position, 2px height.
+  5. Contributor headshot reveal — bios fade in with 100ms per-bio stagger + 500ms cubic-bezier on IntersectionObserver visibility.
+  6. Small essay-index hover — each entry in the numbered table of contents shifts the horizontal accent line from 0 → 100% width over 240ms cubic-bezier on hover, then reverses on hover-out.
+  7. Nav shrink on scroll — the top masthead reduces from 88px → 52px height after 200px of scroll, transitioning font-size and padding over 300ms cubic-bezier.
+  8. prefers-reduced-motion: reduce — hero photo shows at final scale; progressive image reveal disabled (photos show at final blur:0); caption strips show immediately; progress bar still tracks; contributor bios show all at once; hover accent-line still animates (interaction feedback); nav still shrinks (state change).
+
+  Motion character: gallery-quiet, precise, restrained. Custom cubic-bezier(0.23,1,0.32,1) for all reveals. The register lives in fine-art publication, not marketing web — motion should feel like turning a page in a printed quarterly, not like a SaaS product tour.
+
+signature: |
+  Off-white gallery canvas at #fafafa — the register's non-negotiable
+  base (deliberately NOT pure white, deliberately NOT claude-cream,
+  deliberately NOT warm cream). Cold near-black ink at #0a0a0a. ONE
+  vermilion accent at #b81a1a used ONLY for the reading-progress bar
+  and hover states on essay-index rows. Sharp corners everywhere.
+  Composition begins with a MINIMAL MASTHEAD — small Söhne-style
+  wordmark left (HELIOGRAPH, 20px, uppercase, letter-spacing tight),
+  center nav row (6-8 links, 13px), right-column shows ISSUE NAMEPLATE
+  MARK (small caps "ISSUE 04 · MARCH 2026", 10px 0.14em tracked). Below
+  the masthead: a FULL-BLEED HERO PHOTOGRAPH occupying the entire
+  hero viewport (78-90vh) with a subtle bottom-gradient scrim; overlaid
+  on the bottom-left are the essay title (24-32px display sans mixed
+  case) + photographer credit line ("Photographs by Ren Havelock",
+  Newsreader italic 14px). Below the hero: a NUMBERED TABLE OF
+  CONTENTS with 6-10 numbered essay entries — each row is "01 · Essay
+  title · photographer name" in a horizontal layout with a hairline
+  bottom border and the vermilion hover-underline. Below the ToC: the
+  FEATURED ESSAY block, which alternates SEQUENTIAL PHOTOGRAPH FRAMES
+  at varied aspect ratios (3:2 wide, 4:5 tall, 1:1 square) with tiny
+  caption strips beneath each frame ("PLATE 07 / 12 · location, year").
+  A drop-cap opens the accompanying body text. Between essays: a PULL
+  QUOTE BAND — full-width italic Newsreader at 40-56px display size
+  centered on a cream inverted band. A CONTRIBUTOR BIO GRID follows
+  with 4-6 headshots (140x140 sharp squares) + micro-bio (100 words
+  max in body serif). A SUBSCRIBE/ORDER STRIP with a horizontal input
+  + a black filled submit button. Footer opens with a giant
+  wordmark repeat, colophon body block, and utility link column.
+  Six bespoke SVG marks (issue-number seal, plate-number bracket,
+  camera-shutter icon, photographer's dot mark, subscribe-form arrow,
+  colophon separator glyph) are dropped as PUNCTUATION at specific
+  compositional moments — never as a uniform icon row.
+
+imagery: |
+  FULL-BLEED photography as the primary compositional element —
+  the reference uses fine-art documentary + portrait + landscape
+  photography shot at gallery/exhibition-print quality. FPO imagery
+  here should read as intentional photography (composed framing,
+  directional light, considered subject) — never generic stock, never
+  gradient blobs, never radial glow fallbacks. Every photograph is a
+  SHARP-EDGED rectangle with no border, no rounded corner, no drop
+  shadow. Caption strips beneath photographs use tiny sans-serif
+  labels (10-11px) with the PLATE number, subject, and year. NO stock
+  photography that reads as marketing-stock. NO 3D-rendered "photo"
+  placeholders. NO warm-glow gradient fills.
+
+best_for:
+  - Fine-art photography journals and photobook publishers
+  - Small-run print quarterlies and independent magazines
+  - Gallery + museum publication websites (catalogues, exhibition sites)
+  - Photographer portfolios that need editorial framing
+  - Architecture / interior-design publications with photography focus
+  - Documentary photo essay platforms and photojournalism sites
+
+avoid:
+  - "Warm cream canvas — Editorial's canvas is #fafafa (off-white gallery ground), deliberately COOLER and MORE NEUTRAL than the warm-cream family. Warm cream would collapse into a literary-quarterly register (which is a different theme)."
+  - "Multi-color accent palette — the whole register's move is ONE vermilion accent doing everything (progress bar, hover underline, issue-number mark). Introducing amber / green / any second accent collapses the discipline."
+  - "Rounded corners on cards, buttons, inputs, photograph frames — 0px radius everywhere. The gallery-print register is uncompromising on sharp edges."
+  - "Uniform 3-column photograph grid — sequential photo essays use VARIED aspect ratios and offsets. Uniform grids collapse into stock-photo-gallery slop."
+  - "Big monumental hero display type — Editorial's type stays RESTRAINED. The photograph carries the drama; type is caption weight. Any hero-sized (80px+) display type overrides the photograph and collapses the register."
+  - "Sans-serif body copy — body must be a text-optimized serif (Newsreader / Domine / EB Garamond). Sans body reads as marketing-web, not publication."
+  - "Serif display type — display face MUST be a precise geometric grotesk (Söhne / Grafik / Space Grotesk fallback). Serif display collapses into a literary register (which is a different theme)."
+  - "Drop shadows or glassmorphism on photographs — every photograph sits FLAT against the canvas with no shadow, no border. Frames are the AI-tell for placeholder imagery."
+  - "Mono-caps eyebrow labels outside the two legitimate use sites — ISSUE NAMEPLATE MARK (masthead) and PLATE-NUMBER STRIP (photo caption) are the ONLY permitted mono-caps uses. Any additional 'SECTION · X' / 'CHAPTER · Y' / 'READ TIME' plate is slop-blocklist violation."
+  - "Cycling headline words / auto-advancing sliders — no marketing motion. The photograph is STATIC, the pull quote is STATIC. Motion here is reveal-on-scroll + reading-progress bar + hover accent-line."
+
+banned_defaults:
+  # Global blocklist from BESPOKE_THEME_SYSTEM.md
+  - "claude-cream (#F4F1EA + serif + #D97757) — this theme's canvas is off-white gallery ground #fafafa, distinct from claude-cream."
+  - "void+acid (near-black bg + single bright acid-green or vermilion accent) — this theme's canvas is LIGHT gallery ground with a saturated vermilion accent used SPARINGLY, not a void+acid register."
+  - "broadsheet-on-noneditorial (hairline rules + zero border-radius + newspaper columns on non-editorial content) — Editorial IS an editorial context so hairline rules and 0px radius are legitimate."
+  - "tech-bro purple gradient (purple→blue gradient hero + centered headline + double CTA + emoji icons)"
+  - "uniform-everything (identical padding + one weight of one sans doing every job + rounded-2xl + shadow-md cards)"
+  # Base-specific
+  - "monumental-type-primary (Editorial's whole discipline is PHOTOGRAPHY-PRIMARY / TYPE-SECONDARY. Making the display type the compositional anchor inverts the register into a monumental-editorial base.)"
+  - "sans-body-serif-display (Editorial pairs SERIF BODY with SANS DISPLAY — the opposite of the marketing-web default. Flipping this pairing collapses the register.)"
+  - "photo-gallery-3col-grid (photograph sequences use VARIED aspect ratios and rhythmic offsets. Uniform 3-column photo grids are the AI-tell for stock-photo-gallery slop.)"
+  - "multi-accent-punctuation (ONE vermilion accent doing 100% of the punctuation work. Introducing green / blue / amber as a secondary punctuation accent collapses the discipline.)"
+  - "big-hero-marketing-copy (Editorial's essay-title overlay stays SMALL and RESTRAINED — this is a magazine cover, not a landing page hero. Any 80px+ hero-marketing display type collapses the register.)"

package/themes/editorial/tokens.ts

@@ -0,0 +1,29 @@
+// Generated from theme.yml. Do not edit by hand — edit theme.yml + re-materialize.
+
+export const tokens = {
+  slug: "editorial",
+  family: "C",
+  base: "29",
+  palette: {
+    "bg": "#fafafa",
+    "surface": "#ffffff",
+    "ink": "#0a0a0a",
+    "accent": "#b81a1a",
+    "cream": "#f5f0e5",
+    "darkInk": "#000000",
+    "mute": "#6a6a6a"
+  },
+  typography: {
+    "display": "A precise geometric grotesk with quirky wide letterforms — the reference uses a Söhne / Grafik / Founders Grotesk / GT America family. Free fallback stack — \"Neue Haas Grotesk Display\", \"Space Grotesk\", \"Inter\", system-ui, sans-serif. Weight 500-700, mixed case for section titles + photographer names, UPPERCASE only for the nameplate wordmark. Top of scale ~48px for essay titles, 28px for section headings — deliberately RESTRAINED so the photograph carries the drama. Small caps at 10-11px for micro-labels (issue number, date, photographer credit).",
+    "body": "The reference uses a text-optimized serif for essay body copy — Newsreader / Newzald / Domine / EB Garamond family. Free fallback stack — \"Newsreader\", \"Domine\", \"Georgia\", serif. Weight 400 for body, 400 italic for photographer credit lines. 14-15px body copy, line-height 1.55. Small captions at 11-12px in the display sans, not the body serif.",
+    "mono": "none. Editorial is a consumer publication surface. Mono has no role.",
+    "scale": "1.25 (perfect fourth — restrained, so composition and photography carry the drama)",
+    "eyebrow_exception": "Editorial LEGITIMATELY uses small uppercase 0.14em-tracked 10px\nlabels as ISSUE NAMEPLATE MARKS (\"ISSUE 04 · MARCH 2026\" in the\nmasthead, and \"PLATE 07 / 12\" for photo-sequence markers). This\nis a THEME-SPECIFIC EXCEPTION to the universal slop-blocklist —\nthe reference publications use these EXACTLY in this register, as\ndiegetic publication markers rather than as decorative eyebrow\nslop. Every use is deliberate and reference-anchored; every use\nsite must be manually preserved during harness grading.\n"
+  },
+  surface: "web",
+  density: "airy",
+  motion: "Ships live in the section renderer (no external dependencies):\n1. Hero photograph fade-in — the full-bleed cover image opens from opacity 0 + scale(1.02) to opacity 1 + scale(1) over 1400ms cubic-bezier(0.23,1,0.32,1) on first paint.\n2. Progressive image reveal — every photograph on the page transitions from blur(8px) + opacity 0.3 → blur(0) + opacity 1 on IntersectionObserver at 25% visibility, 900ms cubic-bezier.\n3. Caption strip fade — each photograph's tiny caption strip fades in 200ms AFTER its photograph finishes revealing, so the caption reads AFTER the image is seen.\n4. Sticky reading progress — a thin horizontal bar in the vermilion accent grows across the top of the viewport as the user scrolls, indicating essay progress. Fixed position, 2px height.\n5. Contributor headshot reveal — bios fade in with 100ms per-bio stagger + 500ms cubic-bezier on IntersectionObserver visibility.\n6. Small essay-index hover — each entry in the numbered table of contents shifts the horizontal accent line from 0 → 100% width over 240ms cubic-bezier on hover, then reverses on hover-out.\n7. Nav shrink on scroll — the top masthead reduces from 88px → 52px height after 200px of scroll, transitioning font-size and padding over 300ms cubic-bezier.\n8. prefers-reduced-motion: reduce — hero photo shows at final scale; progressive image reveal disabled (photos show at final blur:0); caption strips show immediately; progress bar still tracks; contributor bios show all at once; hover accent-line still animates (interaction feedback); nav still shrinks (state change).\n\nMotion character: gallery-quiet, precise, restrained. Custom cubic-bezier(0.23,1,0.32,1) for all reveals. The register lives in fine-art publication, not marketing web — motion should feel like turning a page in a printed quarterly, not like a SaaS product tour.\n",
+  signature: "Off-white gallery canvas at #fafafa — the register's non-negotiable\nbase (deliberately NOT pure white, deliberately NOT claude-cream,\ndeliberately NOT warm cream). Cold near-black ink at #0a0a0a. ONE\nvermilion accent at #b81a1a used ONLY for the reading-progress bar\nand hover states on essay-index rows. Sharp corners everywhere.\nComposition begins with a MINIMAL MASTHEAD — small Söhne-style\nwordmark left (HELIOGRAPH, 20px, uppercase, letter-spacing tight),\ncenter nav row (6-8 links, 13px), right-column shows ISSUE NAMEPLATE\nMARK (small caps \"ISSUE 04 · MARCH 2026\", 10px 0.14em tracked). Below\nthe masthead: a FULL-BLEED HERO PHOTOGRAPH occupying the entire\nhero viewport (78-90vh) with a subtle bottom-gradient scrim; overlaid\non the bottom-left are the essay title (24-32px display sans mixed\ncase) + photographer credit line (\"Photographs by Ren Havelock\",\nNewsreader italic 14px). Below the hero: a NUMBERED TABLE OF\nCONTENTS with 6-10 numbered essay entries — each row is \"01 · Essay\ntitle · photographer name\" in a horizontal layout with a hairline\nbottom border and the vermilion hover-underline. Below the ToC: the\nFEATURED ESSAY block, which alternates SEQUENTIAL PHOTOGRAPH FRAMES\nat varied aspect ratios (3:2 wide, 4:5 tall, 1:1 square) with tiny\ncaption strips beneath each frame (\"PLATE 07 / 12 · location, year\").\nA drop-cap opens the accompanying body text. Between essays: a PULL\nQUOTE BAND — full-width italic Newsreader at 40-56px display size\ncentered on a cream inverted band. A CONTRIBUTOR BIO GRID follows\nwith 4-6 headshots (140x140 sharp squares) + micro-bio (100 words\nmax in body serif). A SUBSCRIBE/ORDER STRIP with a horizontal input\n+ a black filled submit button. Footer opens with a giant\nwordmark repeat, colophon body block, and utility link column.\nSix bespoke SVG marks (issue-number seal, plate-number bracket,\ncamera-shutter icon, photographer's dot mark, subscribe-form arrow,\ncolophon separator glyph) are dropped as PUNCTUATION at specific\ncompositional moments — never as a uniform icon row.\n",
+} as const;
+
+export type Tokens = typeof tokens;

package/themes/education-formal/THEME.md

@@ -0,0 +1,154 @@
+# Education Formal
+
+> Ivy League institutional gravitas — deep Yale-blue canvas at
+
+**Slug:** `education-formal` — **Surface:** web — **Density:** airy
+
+## Influence
+
+Ivy League and Oxbridge university identity systems (Yale at its
+most tradition-forward, Princeton for the palette gravitas, Trinity
+College Dublin for the heraldic register). Distinct from consumer
+editorial through the DEEP NAVY CANVAS + ALL-SERIF TYPOGRAPHY +
+ONE GOLD ACCENT trio — which reads as institutional-and-old rather
+than editorial-and-modern. The register carries the weight of
+centuries; the design does not fight it.
+
+
+## Signature move
+
+Deep Yale-blue canvas at #0e2a4a — the register's non-negotiable
+base. Every card, button, input, border, timeline dot, program-list
+divider ships at 0px border radius. Every ink is cream #f2ecd8 or
+ONE aged-gold accent #b89a4a used sparingly for heraldic seal
+strokes, hover underlines, and admissions-callout accents.
+
+MASTHEAD — a Cormorant-family wordmark "REDCLIFFE COLLEGE" (ALL
+CAPS, tracking 0.06em, ~24px) on the left, a horizontal nav
+(Academics / Admissions / Campus Life / Research / Athletics /
+Give) center, a filled aged-gold "Apply" button right-aligned.
+Shrinks after 200px of scroll.
+
+HERO — a two-column split. LEFT column carries the big Cormorant
+display headline at ~80px ("A liberal-arts college for the next
+century."), a body-copy lede paragraph in EB Garamond at 17px, and
+a gold "Explore programs →" text link. RIGHT column carries a
+HERALDIC SEAL SVG (~280x280px) — a bespoke oval crest with the
+college name in a circular band around a central shield containing
+three horizontal bars, a lamp, and a founding-year "Est. 1897" —
+drawn in aged-gold with cream infill.
+
+Below: NUMBERED PROGRAMS LIST — 6 program entries with roman-
+numeral indices (I / II / III / IV / V / VI), each row shows the
+program name (Cormorant 24px), department (small caps), and student
+count (right-aligned). Rows fade in with 100ms stagger on scroll.
+Hover state: gold underline sweeps left-to-right across the row.
+
+FACULTY PORTRAIT BAND — an inverted cream band featuring a rotating
+faculty portrait slot with 3 photographs cycling every 5s + a
+faculty-name callout + a course reference. Portraits drawn as
+bespoke SVG (formal academic portrait with warm interior light).
+
+ADMISSIONS COUNTDOWN — a wide dark-navy band with a big gold
+"Applications open" callout, a live counter showing days until the
+admissions deadline, and a filled gold "Begin your application"
+block button. The days counter is diegetic (calculated from actual
+target date, not fake incrementing).
+
+FULL-BLEED CAMPUS ARCHITECTURE PHOTOGRAPH — a wide band with a
+bespoke SVG rendering of the college's central quadrangle at dusk
+(Gothic buildings, gas lamps, evening light). Photograph translates
+-8% Y as user scrolls past — subtle parallax.
+
+ALUMNUS TESTIMONIAL — an italic Cormorant pull quote at 32px from
+a named alumnus with graduation year and current role. Bordered
+with a gold left rule.
+
+FOOTER — deep-navy inverted band with the heraldic seal repeated
+at ~120px, a "Founded 1897" datestamp, 4-column utility grid
+(Academics / Admissions / About / Contact), a small colophon
+paragraph, and legal / accessibility links.
+
+Six bespoke SVG marks (heraldic seal, gothic-arch program divider,
+campus architecture cluster, faculty portrait framing, admissions
+countdown dot, gold Yale-blue watermark) — dropped as PUNCTUATION
+at specific compositional moments, never as a uniform icon row.
+
+## Palette
+
+- **bg:** `#0e2a4a`
+- **surface:** `#16305c`
+- **ink:** `#f2ecd8`
+- **accent:** `#b89a4a`
+
+## Typography
+
+- **Display:** A heavy transitional serif with strong stress contrast for maximum academic gravitas — the reference brand uses Yale New (proprietary). Free fallback stack — "Cormorant Garamond", "EB Garamond", "Playfair Display", Georgia, serif. Weight 500-700, mixed case for section titles, small-caps for micro-labels (LEGITIMATELY per academic tradition), ALL CAPS ONLY for the wordmark. Top of scale ~80px hero, 48px section headings, 32px h3. Letter-spacing -0.005em (subtle negative).
+- **Body:** A warmer humanist serif for long-form reading — the reference uses Yale New. Free fallback stack — "EB Garamond", "Cormorant Garamond", "Iowan Old Style", Georgia, serif. Weight 400 for body copy, 500 for callouts. 16-17px body copy, line-height 1.65 (generous for long-form academic reading).
+- **Mono:** none. Education Formal is a consumer institutional surface. Mono has no role.
+- **Scale:** 1.414 (augmented fourth — comfortable for long-form academic reading with strong hierarchy contrast)
+
+## Motion
+
+Ships live in the section renderer (no external dependencies):
+1. Hero display serif reveal — headline fades in from opacity 0 + translateY(24px) over 900ms cubic-bezier(0.23,1,0.32,1) on first paint. Body copy follows with 200ms delay.
+2. Heraldic seal SVG reveal — the seal fades + rotates from -5deg → 0deg over 1200ms cubic-bezier on first paint, subtle enough to read as institutional composure not marketing sparkle.
+3. Building photograph parallax — the full-bleed campus architecture photo translates -8% Y as the user scrolls past it, tied to scroll position via a single passive scroll listener.
+4. Faculty portrait rotation — a slot in the faculty band cycles between 3 portraits at 5000ms per portrait with a 400ms crossfade. Pauses on hover. State advances even in reduced-motion (crossfade becomes instant).
+5. Applications counter — the admissions callout counter counts up from 0 → target on first scroll into view via requestAnimationFrame, 2000ms ease-out.
+6. Programs list reveal — the numbered programs list rows fade in with 100ms per-row stagger + 500ms cubic-bezier when the section scrolls into view.
+7. Nav shrink on scroll — masthead height reduces from 92px → 56px after 200px of scroll with padding + wordmark font-size transitioning over 300ms cubic-bezier.
+8. Section reveals — each below-fold section fades in from opacity 0 + translateY(24px) → 0 over 700ms cubic-bezier on IntersectionObserver at 25% threshold.
+9. prefers-reduced-motion: reduce — all reveals disabled; counter shows final; faculty rotates instantly (no crossfade); parallax disabled; state changes still fire.
+
+Motion character: institutional composure, restrained, tradition-forward. Custom cubic-bezier(0.23,1,0.32,1) for all reveals. Never marketing-loud, never modern-startup — reads as a considered admissions viewbook, not a SaaS marketing page.
+
+
+## Imagery
+
+BESPOKE SVG renderings of institutional / academic subjects — the
+reference uses photography of Gothic architecture, faculty
+portraits, seminar rooms, and library interiors under warm evening
+light or overcast day light. FPO imagery here should read as
+considered institutional photography (Gothic-arch buildings, warm-
+lit reading rooms, formal faculty portraits under classroom light).
+NO stock "smiling-students-on-quad" photography (that's the AI-tell
+for university-marketing slop). NO warm-radial-gradient placeholder
+fills. NO 3D-rendered campus mockups.
+
+## Best for
+
+- Liberal arts colleges and Ivy League / Oxbridge-tier universities
+- Graduate programs (MBA, JD, MD, PhD, MFA) with a heritage register
+- Academic quarterlies and university presses
+- Endowed research institutes (Rand, RIIA, Brookings, IAS) with an academic register
+- Prep schools and international schools with a heritage brand
+- Museum / cultural-institution sites with an academic-editorial register
+
+## Reject if
+
+_Director grades each of the following as a pass/fail check. Any violation blocks the theme._
+
+- Light canvas — Education Formal's canvas is DEEP YALE-BLUE at #0e2a4a. A cream / off-white canvas inverts the institutional-tradition register into a modern-editorial register (which is a different theme — Editorial v2).
+- Sans-serif display or body — the whole point is all-serif academic tradition. Any sans-serif type (Inter Display, Söhne, Space Grotesk) collapses the register into a modern-startup-university mistake.
+- Multi-color accent palette — the whole register's move is ONE aged-gold accent doing everything (heraldic strokes, hover underlines, admissions callouts, alumnus pull-quote border). Introducing amber / cyan / any secondary accent collapses the discipline.
+- Rounded corners on cards, buttons, seal borders, program-list dividers — 0px radius everywhere. The heraldic seal is a bespoke SVG oval, not a border-radius on a div.
+- Emoji or unicode marks (🎓 📚 🏛) — bespoke SVG only for all institutional ornament. Emoji is the biggest AI-tell for university-marketing slop.
+- Stock 'smiling-students-on-quad' photography — imagery MUST feel institutional and considered (Gothic architecture, warm-lit reading rooms, formal faculty portraits under classroom light). Smiling-students-on-quad is the AI-tell for corporate-university slop.
+- Warm-radial gradient placeholder fills — every FPO must read as institutional photography (bespoke SVG buildings, formal portraits, campus architecture). Warm-radial gradients are the AI-tell for missing imagery.
+- Mono-caps eyebrow labels outside the legitimate use sites — PROGRAM MARKERS (PROGRAM I / PROGRAM II) and SECTION HEADERS (ACADEMICS / ADMISSIONS / CAMPUS LIFE) are the ONLY permitted uses. Any additional 'SECTION · X' / '5 MIN READ' plate is slop-blocklist violation.
+- Cycling headline words / auto-advancing sliders / horizontal tickers — institutional register requires STATIC, TRADITION-FIRST motion. Marketing-web motion collapses into startup-marketing slop. The faculty portrait rotation IS legitimate per the reference (slow crossfade at 5s per portrait); any other cycling / advancing is out.
+- Modern-tech-blue accents (electric blue / cyan / cobalt) — the accent is AGED GOLD only. Modern-blue accents read as tech-startup, not tradition-institutional.
+
+## Banned defaults (inherited + theme-specific)
+
+- claude-cream (#F4F1EA + serif + #D97757) — this theme's canvas is DELIBERATELY dark navy, not cream. Any cream flood is a register violation.
+- void+acid (near-black bg + single bright acid-green or vermilion accent) — accent is aged gold, not acid.
+- broadsheet-on-noneditorial (hairline rules + zero border-radius + newspaper columns) — Education Formal is 0px radius but the composition is academic-quarterly, not broadsheet.
+- tech-bro purple gradient (purple→blue gradient hero + centered headline + double CTA + emoji icons)
+- uniform-everything (identical padding + one weight of one sans doing every job + rounded-2xl + shadow-md cards)
+- light-canvas-inversion (canvas is dark navy #0e2a4a. Swapping to cream / off-white collapses the institutional-tradition register into a modern-editorial register, which is a different theme.)
+- sans-display-anywhere (all-serif typography is the register's fingerprint. Any sans-serif display collapses into modern-startup slop.)
+- multi-accent-flood (ONE gold accent doing 100% of the punctuation. Introducing crimson / hunter-green / orange / any second accent collapses the discipline.)
+- smiling-students-photography (imagery must feel considered and institutional. Stock 'smiling-students-on-quad' photography is the AI-tell for corporate-university slop.)
+- modern-tech-blue-accent (the accent is aged GOLD, not modern blue. Any tech-startup-blue accent collapses the register.)

package/themes/education-formal/audit.log.jsonl

@@ -0,0 +1 @@
+{"slug":"education-formal","gates":[{"gate":"slop-blocklist","verdict":{"passed":true,"failures":[]},"ran_at":"2026-07-05T01:00:05.358Z","dismissed":[]},{"gate":"regression-scan","verdict":{"passed":true,"failures":[]},"ran_at":"2026-07-05T01:00:05.371Z","dismissed":[]},{"gate":"avoid-rubric","verdict":{"passed":true,"failures":[]},"ran_at":"2026-07-05T01:00:44.116Z","dismissed":[]},{"gate":"anchor-compare","verdict":{"passed":true,"failures":[],"skipped":"Family C rubric.md missing at /Users/mattfrischer/Taste/site/design-system/golden-set/C/rubric.md — anchor-compare skipped."},"ran_at":"2026-07-05T01:00:44.118Z","dismissed":[]}],"overall":"PASS","ran_at":"2026-07-05T01:00:05.358Z"}

package/themes/education-formal/tailwind.snippet.ts

@@ -0,0 +1,15 @@
+// Generated from theme.yml. Merge into your tailwind.config.ts under theme.extend.
+// slug: education-formal
+export const educationFormalTailwindExtend = {
+  colors: {
+    bg: "#0e2a4a",
+    surface: "#16305c",
+    ink: "#f2ecd8",
+    accent: "#b89a4a",
+  },
+  fontFamily: {
+    display: ["A heavy transitional serif with strong stress contrast for maximum academic gravitas — the reference brand uses Yale New (proprietary). Free fallback stack — \"Cormorant Garamond\", \"EB Garamond\", \"Playfair Display\", Georgia, serif. Weight 500-700, mixed case for section titles, small-caps for micro-labels (LEGITIMATELY per academic tradition), ALL CAPS ONLY for the wordmark. Top of scale ~80px hero, 48px section headings, 32px h3. Letter-spacing -0.005em (subtle negative)."],
+    body: ["A warmer humanist serif for long-form reading — the reference uses Yale New. Free fallback stack — \"EB Garamond\", \"Cormorant Garamond\", \"Iowan Old Style\", Georgia, serif. Weight 400 for body copy, 500 for callouts. 16-17px body copy, line-height 1.65 (generous for long-form academic reading)."],
+    mono: ["none. Education Formal is a consumer institutional surface. Mono has no role."],
+  },
+};

package/themes/education-formal/theme.yml

@@ -0,0 +1,186 @@
+# Education Formal — Family C, Editorial & Print (institutional-editorial subregion).
+#
+# Ivy League institutional gravitas. Deep Yale-blue canvas at #0e2a4a
+# with warm cream ink (#f2ecd8) and ONE aged-gold accent (#b89a4a)
+# used for heraldic seal accents, hover underlines, and admissions
+# callouts. Sharp corners everywhere (0px radius). All-serif
+# typography — Cormorant Garamond display + EB Garamond body for
+# maximum academic gravitas.
+#
+# Influence anchor: Yale University corporate identity. Placeholder
+# brand: "REDCLIFFE COLLEGE" — a fictional Ivy-adjacent institution.
+# Original name, original copy, no reproductions of any reference.
+#
+# Distinct from other Family C bases:
+#   - Editorial (v2) is Aperture photography-first quarterly (light canvas)
+#   - Pharma Clinical is Genentech warm-professional pharma (cream canvas)
+#   - Ember Poster is warm-dark editorial serif with hand-drawn ornaments
+#   - Case Panel is agency portfolio bento
+#   - Marker Mag is punk zine chaos
+#   - Pill Editorial is 999px cultural editorial
+#   - Cabana Poster is vintage travel-poster warmth
+# Education Formal fills the INSTITUTIONAL-EDITORIAL slot — dark navy
+# academic-quarterly register with gold accents.
+#
+# Seventeenth theme via the v2 harness. Eighth Family C theme.
+# Upgrade of the existing v1 archetype-fallback slug.
+
+name: Education Formal
+concept: Ivy League institutional gravitas — deep Yale-blue canvas at #0e2a4a with warm cream ink and ONE aged-gold accent used sparingly for heraldic seal accents, hover underlines, and admissions callouts. All-serif typography (Cormorant Garamond display + EB Garamond body). Full-bleed campus architecture photography, heraldic seal, numbered program listings, faculty portrait rotation, admissions countdown, and a slow-scroll parallax on the building photography. Reads like a Yale admissions viewbook — heavy, considered, tradition-forward.
+influence: |
+  Ivy League and Oxbridge university identity systems (Yale at its
+  most tradition-forward, Princeton for the palette gravitas, Trinity
+  College Dublin for the heraldic register). Distinct from consumer
+  editorial through the DEEP NAVY CANVAS + ALL-SERIF TYPOGRAPHY +
+  ONE GOLD ACCENT trio — which reads as institutional-and-old rather
+  than editorial-and-modern. The register carries the weight of
+  centuries; the design does not fight it.
+
+family: C
+base_number: 32
+base_note: |
+  Family C editorial subregion, INSTITUTIONAL-EDITORIAL slot. Distinct
+  from Editorial (v2) which is a light-canvas photography quarterly,
+  and from Pharma Clinical which is a warm-cream pharmaceutical
+  quarterly. Education Formal inverts to DEEP NAVY CANVAS with
+  academic all-serif typography and gold heraldic accents. Upgrade of
+  the existing v1 education-formal slug from archetype-fallback to a
+  full bespoke institutional-quarterly composition.
+
+render_url: http://localhost:5173/themes/education-formal
+
+surface: web
+
+typography:
+  display: A heavy transitional serif with strong stress contrast for maximum academic gravitas — the reference brand uses Yale New (proprietary). Free fallback stack — "Cormorant Garamond", "EB Garamond", "Playfair Display", Georgia, serif. Weight 500-700, mixed case for section titles, small-caps for micro-labels (LEGITIMATELY per academic tradition), ALL CAPS ONLY for the wordmark. Top of scale ~80px hero, 48px section headings, 32px h3. Letter-spacing -0.005em (subtle negative).
+  body: A warmer humanist serif for long-form reading — the reference uses Yale New. Free fallback stack — "EB Garamond", "Cormorant Garamond", "Iowan Old Style", Georgia, serif. Weight 400 for body copy, 500 for callouts. 16-17px body copy, line-height 1.65 (generous for long-form academic reading).
+  mono: none. Education Formal is a consumer institutional surface. Mono has no role.
+  scale: 1.414 (augmented fourth — comfortable for long-form academic reading with strong hierarchy contrast)
+  eyebrow_exception: |
+    Education Formal LEGITIMATELY uses small-caps 0.14em-tracked 11-12px labels for PROGRAM MARKERS (PROGRAM I / PROGRAM II) and SECTION HEADERS (ACADEMICS / ADMISSIONS / CAMPUS LIFE). This is a THEME-SPECIFIC EXCEPTION — academic quarterly tradition uses small-caps EXACTLY in this register as institutional section markers, not as decorative eyebrow slop. Roman numeral index (I II III IV) is also legitimate here per centuries of academic-quarterly convention.
+
+palette:
+  bg: "#0e2a4a"           # canvas — deep Yale-blue navy
+  surface: "#16305c"      # slightly-lifted panel for section bands
+  ink: "#f2ecd8"          # warm cream — primary text on navy
+  accent: "#b89a4a"       # aged gold — the ONE accent (heraldic + hover + callouts)
+  cream: "#f7f1e0"        # bright cream for inverted band + hero secondary text
+  darkInk: "#050f22"      # deepest navy for masthead and footer
+  mute: "#7a90b0"         # dimmed cream / warm-blue for captions
+
+density: airy
+
+motion: |
+  Ships live in the section renderer (no external dependencies):
+  1. Hero display serif reveal — headline fades in from opacity 0 + translateY(24px) over 900ms cubic-bezier(0.23,1,0.32,1) on first paint. Body copy follows with 200ms delay.
+  2. Heraldic seal SVG reveal — the seal fades + rotates from -5deg → 0deg over 1200ms cubic-bezier on first paint, subtle enough to read as institutional composure not marketing sparkle.
+  3. Building photograph parallax — the full-bleed campus architecture photo translates -8% Y as the user scrolls past it, tied to scroll position via a single passive scroll listener.
+  4. Faculty portrait rotation — a slot in the faculty band cycles between 3 portraits at 5000ms per portrait with a 400ms crossfade. Pauses on hover. State advances even in reduced-motion (crossfade becomes instant).
+  5. Applications counter — the admissions callout counter counts up from 0 → target on first scroll into view via requestAnimationFrame, 2000ms ease-out.
+  6. Programs list reveal — the numbered programs list rows fade in with 100ms per-row stagger + 500ms cubic-bezier when the section scrolls into view.
+  7. Nav shrink on scroll — masthead height reduces from 92px → 56px after 200px of scroll with padding + wordmark font-size transitioning over 300ms cubic-bezier.
+  8. Section reveals — each below-fold section fades in from opacity 0 + translateY(24px) → 0 over 700ms cubic-bezier on IntersectionObserver at 25% threshold.
+  9. prefers-reduced-motion: reduce — all reveals disabled; counter shows final; faculty rotates instantly (no crossfade); parallax disabled; state changes still fire.
+
+  Motion character: institutional composure, restrained, tradition-forward. Custom cubic-bezier(0.23,1,0.32,1) for all reveals. Never marketing-loud, never modern-startup — reads as a considered admissions viewbook, not a SaaS marketing page.
+
+signature: |
+  Deep Yale-blue canvas at #0e2a4a — the register's non-negotiable
+  base. Every card, button, input, border, timeline dot, program-list
+  divider ships at 0px border radius. Every ink is cream #f2ecd8 or
+  ONE aged-gold accent #b89a4a used sparingly for heraldic seal
+  strokes, hover underlines, and admissions-callout accents.
+
+  MASTHEAD — a Cormorant-family wordmark "REDCLIFFE COLLEGE" (ALL
+  CAPS, tracking 0.06em, ~24px) on the left, a horizontal nav
+  (Academics / Admissions / Campus Life / Research / Athletics /
+  Give) center, a filled aged-gold "Apply" button right-aligned.
+  Shrinks after 200px of scroll.
+
+  HERO — a two-column split. LEFT column carries the big Cormorant
+  display headline at ~80px ("A liberal-arts college for the next
+  century."), a body-copy lede paragraph in EB Garamond at 17px, and
+  a gold "Explore programs →" text link. RIGHT column carries a
+  HERALDIC SEAL SVG (~280x280px) — a bespoke oval crest with the
+  college name in a circular band around a central shield containing
+  three horizontal bars, a lamp, and a founding-year "Est. 1897" —
+  drawn in aged-gold with cream infill.
+
+  Below: NUMBERED PROGRAMS LIST — 6 program entries with roman-
+  numeral indices (I / II / III / IV / V / VI), each row shows the
+  program name (Cormorant 24px), department (small caps), and student
+  count (right-aligned). Rows fade in with 100ms stagger on scroll.
+  Hover state: gold underline sweeps left-to-right across the row.
+
+  FACULTY PORTRAIT BAND — an inverted cream band featuring a rotating
+  faculty portrait slot with 3 photographs cycling every 5s + a
+  faculty-name callout + a course reference. Portraits drawn as
+  bespoke SVG (formal academic portrait with warm interior light).
+
+  ADMISSIONS COUNTDOWN — a wide dark-navy band with a big gold
+  "Applications open" callout, a live counter showing days until the
+  admissions deadline, and a filled gold "Begin your application"
+  block button. The days counter is diegetic (calculated from actual
+  target date, not fake incrementing).
+
+  FULL-BLEED CAMPUS ARCHITECTURE PHOTOGRAPH — a wide band with a
+  bespoke SVG rendering of the college's central quadrangle at dusk
+  (Gothic buildings, gas lamps, evening light). Photograph translates
+  -8% Y as user scrolls past — subtle parallax.
+
+  ALUMNUS TESTIMONIAL — an italic Cormorant pull quote at 32px from
+  a named alumnus with graduation year and current role. Bordered
+  with a gold left rule.
+
+  FOOTER — deep-navy inverted band with the heraldic seal repeated
+  at ~120px, a "Founded 1897" datestamp, 4-column utility grid
+  (Academics / Admissions / About / Contact), a small colophon
+  paragraph, and legal / accessibility links.
+
+  Six bespoke SVG marks (heraldic seal, gothic-arch program divider,
+  campus architecture cluster, faculty portrait framing, admissions
+  countdown dot, gold Yale-blue watermark) — dropped as PUNCTUATION
+  at specific compositional moments, never as a uniform icon row.
+
+imagery: |
+  BESPOKE SVG renderings of institutional / academic subjects — the
+  reference uses photography of Gothic architecture, faculty
+  portraits, seminar rooms, and library interiors under warm evening
+  light or overcast day light. FPO imagery here should read as
+  considered institutional photography (Gothic-arch buildings, warm-
+  lit reading rooms, formal faculty portraits under classroom light).
+  NO stock "smiling-students-on-quad" photography (that's the AI-tell
+  for university-marketing slop). NO warm-radial-gradient placeholder
+  fills. NO 3D-rendered campus mockups.
+
+best_for:
+  - Liberal arts colleges and Ivy League / Oxbridge-tier universities
+  - Graduate programs (MBA, JD, MD, PhD, MFA) with a heritage register
+  - Academic quarterlies and university presses
+  - Endowed research institutes (Rand, RIIA, Brookings, IAS) with an academic register
+  - Prep schools and international schools with a heritage brand
+  - Museum / cultural-institution sites with an academic-editorial register
+
+avoid:
+  - "Light canvas — Education Formal's canvas is DEEP YALE-BLUE at #0e2a4a. A cream / off-white canvas inverts the institutional-tradition register into a modern-editorial register (which is a different theme — Editorial v2)."
+  - "Sans-serif display or body — the whole point is all-serif academic tradition. Any sans-serif type (Inter Display, Söhne, Space Grotesk) collapses the register into a modern-startup-university mistake."
+  - "Multi-color accent palette — the whole register's move is ONE aged-gold accent doing everything (heraldic strokes, hover underlines, admissions callouts, alumnus pull-quote border). Introducing amber / cyan / any secondary accent collapses the discipline."
+  - "Rounded corners on cards, buttons, seal borders, program-list dividers — 0px radius everywhere. The heraldic seal is a bespoke SVG oval, not a border-radius on a div."
+  - "Emoji or unicode marks (🎓 📚 🏛) — bespoke SVG only for all institutional ornament. Emoji is the biggest AI-tell for university-marketing slop."
+  - "Stock 'smiling-students-on-quad' photography — imagery MUST feel institutional and considered (Gothic architecture, warm-lit reading rooms, formal faculty portraits under classroom light). Smiling-students-on-quad is the AI-tell for corporate-university slop."
+  - "Warm-radial gradient placeholder fills — every FPO must read as institutional photography (bespoke SVG buildings, formal portraits, campus architecture). Warm-radial gradients are the AI-tell for missing imagery."
+  - "Mono-caps eyebrow labels outside the legitimate use sites — PROGRAM MARKERS (PROGRAM I / PROGRAM II) and SECTION HEADERS (ACADEMICS / ADMISSIONS / CAMPUS LIFE) are the ONLY permitted uses. Any additional 'SECTION · X' / '5 MIN READ' plate is slop-blocklist violation."
+  - "Cycling headline words / auto-advancing sliders / horizontal tickers — institutional register requires STATIC, TRADITION-FIRST motion. Marketing-web motion collapses into startup-marketing slop. The faculty portrait rotation IS legitimate per the reference (slow crossfade at 5s per portrait); any other cycling / advancing is out."
+  - "Modern-tech-blue accents (electric blue / cyan / cobalt) — the accent is AGED GOLD only. Modern-blue accents read as tech-startup, not tradition-institutional."
+
+banned_defaults:
+  - "claude-cream (#F4F1EA + serif + #D97757) — this theme's canvas is DELIBERATELY dark navy, not cream. Any cream flood is a register violation."
+  - "void+acid (near-black bg + single bright acid-green or vermilion accent) — accent is aged gold, not acid."
+  - "broadsheet-on-noneditorial (hairline rules + zero border-radius + newspaper columns) — Education Formal is 0px radius but the composition is academic-quarterly, not broadsheet."
+  - "tech-bro purple gradient (purple→blue gradient hero + centered headline + double CTA + emoji icons)"
+  - "uniform-everything (identical padding + one weight of one sans doing every job + rounded-2xl + shadow-md cards)"
+  - "light-canvas-inversion (canvas is dark navy #0e2a4a. Swapping to cream / off-white collapses the institutional-tradition register into a modern-editorial register, which is a different theme.)"
+  - "sans-display-anywhere (all-serif typography is the register's fingerprint. Any sans-serif display collapses into modern-startup slop.)"
+  - "multi-accent-flood (ONE gold accent doing 100% of the punctuation. Introducing crimson / hunter-green / orange / any second accent collapses the discipline.)"
+  - "smiling-students-photography (imagery must feel considered and institutional. Stock 'smiling-students-on-quad' photography is the AI-tell for corporate-university slop.)"
+  - "modern-tech-blue-accent (the accent is aged GOLD, not modern blue. Any tech-startup-blue accent collapses the register.)"

package/themes/education-formal/tokens.ts

@@ -0,0 +1,29 @@
+// Generated from theme.yml. Do not edit by hand — edit theme.yml + re-materialize.
+
+export const tokens = {
+  slug: "education-formal",
+  family: "C",
+  base: "32",
+  palette: {
+    "bg": "#0e2a4a",
+    "surface": "#16305c",
+    "ink": "#f2ecd8",
+    "accent": "#b89a4a",
+    "cream": "#f7f1e0",
+    "darkInk": "#050f22",
+    "mute": "#7a90b0"
+  },
+  typography: {
+    "display": "A heavy transitional serif with strong stress contrast for maximum academic gravitas — the reference brand uses Yale New (proprietary). Free fallback stack — \"Cormorant Garamond\", \"EB Garamond\", \"Playfair Display\", Georgia, serif. Weight 500-700, mixed case for section titles, small-caps for micro-labels (LEGITIMATELY per academic tradition), ALL CAPS ONLY for the wordmark. Top of scale ~80px hero, 48px section headings, 32px h3. Letter-spacing -0.005em (subtle negative).",
+    "body": "A warmer humanist serif for long-form reading — the reference uses Yale New. Free fallback stack — \"EB Garamond\", \"Cormorant Garamond\", \"Iowan Old Style\", Georgia, serif. Weight 400 for body copy, 500 for callouts. 16-17px body copy, line-height 1.65 (generous for long-form academic reading).",
+    "mono": "none. Education Formal is a consumer institutional surface. Mono has no role.",
+    "scale": "1.414 (augmented fourth — comfortable for long-form academic reading with strong hierarchy contrast)",
+    "eyebrow_exception": "Education Formal LEGITIMATELY uses small-caps 0.14em-tracked 11-12px labels for PROGRAM MARKERS (PROGRAM I / PROGRAM II) and SECTION HEADERS (ACADEMICS / ADMISSIONS / CAMPUS LIFE). This is a THEME-SPECIFIC EXCEPTION — academic quarterly tradition uses small-caps EXACTLY in this register as institutional section markers, not as decorative eyebrow slop. Roman numeral index (I II III IV) is also legitimate here per centuries of academic-quarterly convention.\n"
+  },
+  surface: "web",
+  density: "airy",
+  motion: "Ships live in the section renderer (no external dependencies):\n1. Hero display serif reveal — headline fades in from opacity 0 + translateY(24px) over 900ms cubic-bezier(0.23,1,0.32,1) on first paint. Body copy follows with 200ms delay.\n2. Heraldic seal SVG reveal — the seal fades + rotates from -5deg → 0deg over 1200ms cubic-bezier on first paint, subtle enough to read as institutional composure not marketing sparkle.\n3. Building photograph parallax — the full-bleed campus architecture photo translates -8% Y as the user scrolls past it, tied to scroll position via a single passive scroll listener.\n4. Faculty portrait rotation — a slot in the faculty band cycles between 3 portraits at 5000ms per portrait with a 400ms crossfade. Pauses on hover. State advances even in reduced-motion (crossfade becomes instant).\n5. Applications counter — the admissions callout counter counts up from 0 → target on first scroll into view via requestAnimationFrame, 2000ms ease-out.\n6. Programs list reveal — the numbered programs list rows fade in with 100ms per-row stagger + 500ms cubic-bezier when the section scrolls into view.\n7. Nav shrink on scroll — masthead height reduces from 92px → 56px after 200px of scroll with padding + wordmark font-size transitioning over 300ms cubic-bezier.\n8. Section reveals — each below-fold section fades in from opacity 0 + translateY(24px) → 0 over 700ms cubic-bezier on IntersectionObserver at 25% threshold.\n9. prefers-reduced-motion: reduce — all reveals disabled; counter shows final; faculty rotates instantly (no crossfade); parallax disabled; state changes still fire.\n\nMotion character: institutional composure, restrained, tradition-forward. Custom cubic-bezier(0.23,1,0.32,1) for all reveals. Never marketing-loud, never modern-startup — reads as a considered admissions viewbook, not a SaaS marketing page.\n",
+  signature: "Deep Yale-blue canvas at #0e2a4a — the register's non-negotiable\nbase. Every card, button, input, border, timeline dot, program-list\ndivider ships at 0px border radius. Every ink is cream #f2ecd8 or\nONE aged-gold accent #b89a4a used sparingly for heraldic seal\nstrokes, hover underlines, and admissions-callout accents.\n\nMASTHEAD — a Cormorant-family wordmark \"REDCLIFFE COLLEGE\" (ALL\nCAPS, tracking 0.06em, ~24px) on the left, a horizontal nav\n(Academics / Admissions / Campus Life / Research / Athletics /\nGive) center, a filled aged-gold \"Apply\" button right-aligned.\nShrinks after 200px of scroll.\n\nHERO — a two-column split. LEFT column carries the big Cormorant\ndisplay headline at ~80px (\"A liberal-arts college for the next\ncentury.\"), a body-copy lede paragraph in EB Garamond at 17px, and\na gold \"Explore programs →\" text link. RIGHT column carries a\nHERALDIC SEAL SVG (~280x280px) — a bespoke oval crest with the\ncollege name in a circular band around a central shield containing\nthree horizontal bars, a lamp, and a founding-year \"Est. 1897\" —\ndrawn in aged-gold with cream infill.\n\nBelow: NUMBERED PROGRAMS LIST — 6 program entries with roman-\nnumeral indices (I / II / III / IV / V / VI), each row shows the\nprogram name (Cormorant 24px), department (small caps), and student\ncount (right-aligned). Rows fade in with 100ms stagger on scroll.\nHover state: gold underline sweeps left-to-right across the row.\n\nFACULTY PORTRAIT BAND — an inverted cream band featuring a rotating\nfaculty portrait slot with 3 photographs cycling every 5s + a\nfaculty-name callout + a course reference. Portraits drawn as\nbespoke SVG (formal academic portrait with warm interior light).\n\nADMISSIONS COUNTDOWN — a wide dark-navy band with a big gold\n\"Applications open\" callout, a live counter showing days until the\nadmissions deadline, and a filled gold \"Begin your application\"\nblock button. The days counter is diegetic (calculated from actual\ntarget date, not fake incrementing).\n\nFULL-BLEED CAMPUS ARCHITECTURE PHOTOGRAPH — a wide band with a\nbespoke SVG rendering of the college's central quadrangle at dusk\n(Gothic buildings, gas lamps, evening light). Photograph translates\n-8% Y as user scrolls past — subtle parallax.\n\nALUMNUS TESTIMONIAL — an italic Cormorant pull quote at 32px from\na named alumnus with graduation year and current role. Bordered\nwith a gold left rule.\n\nFOOTER — deep-navy inverted band with the heraldic seal repeated\nat ~120px, a \"Founded 1897\" datestamp, 4-column utility grid\n(Academics / Admissions / About / Contact), a small colophon\nparagraph, and legal / accessibility links.\n\nSix bespoke SVG marks (heraldic seal, gothic-arch program divider,\ncampus architecture cluster, faculty portrait framing, admissions\ncountdown dot, gold Yale-blue watermark) — dropped as PUNCTUATION\nat specific compositional moments, never as a uniform icon row.\n",
+} as const;
+
+export type Tokens = typeof tokens;