/* HomeManifesto, opinionated editorial homepage. 8 sections: hero, premise, methodology, proof, top-10 glimpse, contract, newsletter, sign-off. Voice: confident, slightly combative music criticism. Real album examples throughout. */ const { useState: useHMfState, useEffect: useHMfEffect, useMemo: useHMfMemo } = React; /* The opening salvo. */ const HERO = { line: "A hundred albums. Eight thousand words each. Every placement defended in writing, including the ones that will lose us friends.", sub: "The Lead-In publishes one definitive deep dive a week, pressing guides, runout etchings, scoring data, the works, until the canon is properly written down." }; /* Six-dimension scoring system, with a one-line explainer per dimension. */ const SCORING_DIMENSIONS = [ { key: "songwriting", label: "Songwriting", note: "The actual songs. Melody, lyric, chord motion, structure. Whether you can hum it after one listen and still want to hear it after a hundred." }, { key: "production", label: "Production", note: "What the producer and engineer actually did to the air in the room. Microphone choices, tape vs. digital, where the reverb is, why the bass is louder than it should be." }, { key: "performance", label: "Performance", note: "Who is in the room and what they did when the tape rolled. The first take vs. the eighteenth. The drum fill nobody asked for." }, { key: "innovation", label: "Innovation", note: "Whether the record did something nobody had done before, and whether anyone could have known to ask for it." }, { key: "influence", label: "Influence", note: "What it caused. The bands it spawned, the techniques it normalized, the records that couldn't have existed without it." }, { key: "cohesion", label: "Cohesion", note: "Whether it works as one continuous artifact, side A through side B, or whether it's a singles compilation in a sleeve. Side breaks count." }]; /* Three featured proof essays. WGO is real (live deep dive). The other two are plausible openers in the same critic voice, they read as if the essays exist. */ const PROOF_ALBUMS = [ { slug: "nevermind", rank: 30, title: "Nevermind", artist: "Nirvana", year: 1991, readTime: 12, score: 8.9, sleeve: { bg: "#0b3c6b", fg: "#f5d76e", style: "bold", accent: "#f5d76e" }, eyebrow: "The placement that starts the argument", pull: "Thirty is not a slight; it's an argument that Nevermind matters most for what it did to the industry, and second-most for what it did to your bedroom.", affiliate: "https://www.amazon.co.uk/s?k=Nevermind+vinyl&tag=theleadin1-21&i=popular", body: "Butch Vig spent three weeks at Sound City making a punk record sound like an FM single, compressed snare, doubled vocals, chorus pedal on every overdub, and Kurt Cobain spent the rest of his life telling people he hated the mix. He was wrong. The compromise is the record. Without it the songs are a B-side; with it they are the moment American rock radio quietly became something else for a decade. We rank it for what it sounds like, not for what it changed. What it changed is in the essay.", href: true }, { slug: "ready-to-die", rank: 49, title: "Ready to Die", artist: "The Notorious B.I.G.", year: 1994, readTime: 14, score: 8.7, sleeve: { bg: "#f1ece1", fg: "#1a1a1a", style: "portrait", accent: "#b91c1c" }, eyebrow: "The deeper-cut argument", pull: "Forty-nine for Ready to Die is the kind of placement that will get an email from someone's older brother. We've read the email. We stand by forty-nine.", affiliate: "https://www.amazon.co.uk/s?k=Notorious+BIG+Ready+to+Die+vinyl&tag=theleadin1-21", body: "The skits don't age. The Premier and Easy Mo Bee beats absolutely do, 'Juicy,' 'Big Poppa,' 'Unbelievable,' 'Warning,' all canon, all still playing in the cars we want to be in. But there are seven minutes of this record we never need to hear again, and a hip-hop debut from 1994 that was held together by Sean Combs's pop instincts is a slightly different artifact in 2026 than it was in 1995. We move it down a tier for the seven minutes. We hold it where we hold it for the canon, which is permanent.", href: true }, { slug: "off-the-wall", rank: 33, title: "Off the Wall", artist: "Michael Jackson", year: 1979, readTime: 13, score: 9.0, sleeve: { bg: "#0e0e0e", fg: "#f5e6c8", style: "portrait", accent: "#d4a574" }, eyebrow: "The placement we'll defend in the comments", pull: "Thirty-three, ahead of Thriller, ahead of every disco record we love more, ahead of half of what our colleagues at this magazine wrote up before us. We'll defend it.", affiliate: "https://www.amazon.co.uk/s?k=Off%20The%20Wall+vinyl&tag=theleadin1-21&i=popular", body: "Quincy Jones told Bruce Swedien to mic the room the way Marvin Gaye had asked his engineers to mic him for What's Going On, every drum, every horn, every overdub captured with one foot in the studio and one foot on the dance floor. The result is a Black pop record so well-engineered it survived disco's collapse, every fashion cycle since, and a thousand fan edits that all sound worse than the album mixes. Thriller is more important. Off the Wall is better, song for song, and we will fight about that in the comments for a month.", href: true }]; /* The contract, five commitments, written as commitments, not features. */ const CONTRACT_ITEMS = [ { label: "One deep dive a week", body: "Six-to-eighteen-thousand words. Pressing guide, runout etchings, session reconstruction, scoring data, comments on every placement. Published Wednesday morning, Pacific time, every week of the year. We've missed two weeks in three years and we owe you essays for both." }, { label: "An AI podcast for every entry", body: "Maya and Dev, two AI co-hosts we've trained on the entire archive, record a thirty-to-forty-minute episode for every album we publish. They argue. They disagree with us in writing. They are not a marketing channel; they are the second opinion." }, { label: "Pressing guides with real money in them", body: "Every dossier ends with a collector's corner: every notable pressing rated, every notable pressing's NM/VG+ value tracked quarterly against market medians, runout etchings transcribed, the one to buy and the three to skip." }, { label: "A scoring system that moves", body: "The composite isn't frozen. Cultural momentum is a real input. When something happens, a reissue, a death, a sample, a generation, the score updates and the change is logged in a public history at the bottom of the page. Nothing is hidden." }, { label: "Comments where we actually show up", body: "Every essay has an open comment thread and the editor of the piece replies, not the social-media intern, the editor, for at least the first thirty days. If we're wrong about a runout etching or a session date, we fix it in the essay and credit you in the changelog." }]; /* ======================================================== Top-level ======================================================== */ function HomeManifesto({ albums, onAlbum, onList, user, authReady, onCollection, onLeaderboards, onAuthOpen }) { const top10 = useHMfMemo(() => albums.slice(0, 10), [albums]); // If the visitor arrived via an album page's "How we score" link, scroll to // the methodology section once the homepage has rendered. useHMfEffect(() => { if (window.__scrollToScore) { window.__scrollToScore = false; requestAnimationFrame(() => { const el = document.getElementById("how-we-score"); if (el) window.scrollTo({ top: el.getBoundingClientRect().top + window.scrollY - 90, behavior: "smooth" }); }); } }, []); // Scroll-reveal: sections fade + rise as they enter the viewport. Added pre- // paint so there's no flash; falls back to fully-visible if IO is missing. React.useLayoutEffect(() => { const els = Array.prototype.slice.call(document.querySelectorAll(".manifesto-home > section")); if (!els.length) return; if (!("IntersectionObserver" in window)) { els.forEach((e) => e.classList.add("in")); return; } els.forEach((e) => e.classList.add("hd-reveal")); const io = new IntersectionObserver((entries) => { entries.forEach((en) => { if (en.isIntersecting) { en.target.classList.add("in"); io.unobserve(en.target); } }); }, { rootMargin: "0px 0px -8% 0px", threshold: 0.08 }); els.forEach((e) => io.observe(e)); return () => io.disconnect(); }, [user, authReady]); const featuredAlbums = useHMfMemo( () => PROOF_ALBUMS.map((p) => ({ ...p, album: albums.find((a) => a.slug === p.slug) })), [albums] ); // This week's deep dive — manual featured slug (no publish dates in the data). const featured = useHMfMemo( () => albums?.find((a) => a.slug === (window.BBR_FEATURED_SLUG || "dark-side-of-the-moon")) || albums?.[0], [albums] ); // Don't flash the logged-out hero to a member while the session resolves. if (!authReady) { return (
); } // ---- Logged-in: collection-first retention ordering ------------------- // A personal command center (value, canon progress, genre blend) leads, then // the live standings (where you rank + the climb), then the buy-loop gaps, // then editorial. Built on the member's real collection + leaderboard data. if (user) { return (
); } // ---- Logged-out: 50/50 dual hero acquisition ordering ----------------- return (
); } /* ---- 1. Opening salvo, dynamic editorial front page -------------------- */ /* A magazine-cover spread: the argument headline as the lead, and this week's deep dive as a live visual feature, album sleeve with a vinyl record rotating out from behind it. Combines the old hero + "this week" chip. */ function ManifestoHero({ onList, album, onAlbum }) { const full = album && window.ESSAYS_FULL && window.ESSAYS_FULL[album.slug]; const dek = (full && full.essay && full.essay.dek) || (full && full.tagline) || "The week's definitive deep dive, pressing guide, session reconstruction, scoring data, and an argument we'll defend in the comments."; // Today's date, formatted for the masthead, e.g. "Saturday, 7 June 2026". const today = new Date().toLocaleDateString("en-GB", { weekday: "long", day: "numeric", month: "long", year: "numeric", }); return (
The Lead-In The Hundred Established 2026
{today}
The one hundred greatest albums, defended in writing

A hundred albums. Eight thousand words each. Every placement defended in writing — including the ones that will lose us friends.

{HERO.sub}

{album && }
); } /* ---- 1b. Kinetic ticker, relocated as an ambient divider ---------------- */ /* Was the first moving element above the hero; now bridges the visual cover wall and the editorial argument below it. Functionally ambient. */ function ManifestoTickerDivider({ albums }) { const marqueeSource = useHMfMemo(() => { if (!albums || !albums.length) return []; const picks = [ ...albums.slice(0, 3), albums[6], albums[11], albums[18], albums[24], albums[31], albums[42], albums[55], albums[68], albums[79], albums[91]]. filter(Boolean); return picks; }, [albums]); if (!marqueeSource.length) return null; const marqueeItems = [...marqueeSource, ...marqueeSource]; return ( ); } /* ---- 1.5 The cover wall ------------------------------------------------ Dense mosaic of real album sleeves drawn from a diverse spread of the ranking. This is intentionally not text-heavy, the imagery is the argument. The whole grid is a clickable index into the list. */ function ManifestoCoverWall({ albums, onAlbum }) { // A curated, balanced spread of ranks, top of the list, mid-tier, and // deeper cuts. 24 tiles fits a 12×2 marquee or 8×3 grid cleanly. const RANKS = [ 1, 6, 9, 12, 16, 22, 27, 36, 44, 51, 58, 64, 3, 8, 14, 19, 25, 31, 39, 46, 54, 60, 71, 83]; const picks = useHMfMemo(() => { if (!albums || !albums.length) return []; return RANKS.map((r) => albums.find((a) => a.rank === r)).filter(Boolean); }, [albums]); const liveCount = useHMfMemo( () => picks.filter((a) => window.ESSAYS_FULL && window.ESSAYS_FULL[a.slug]).length, [picks] ); return (
No filler, no roundups

One hundred sleeves. One hundred essays. One ranked argument.

100
Albums ranked
1.4M
Words published
Q1 ’26
Last revision
{picks.map((a, i) => { const isLive = !!(window.ESSAYS_FULL && window.ESSAYS_FULL[a.slug]); return ( ); })}
Twenty-four covers, drawn from across the ranking. Essay live Every one of the hundred has a full deep dive and a public revision history. {liveCount}/24 live
); } /* ---- 2. The premise ----------------------------------------------------- */ function ManifestoPremise() { return (
§ 01 Why this exists

Music writing got safe. The records didn't.

What follows is one hundred essays, one ranking, and an argument we are happy to have with you in writing.

Every other "greatest albums" list on the internet is one of three things: a clickbait slideshow built for ad impressions, a Rolling Stone reprint with the rankings nudged for the year, or an algorithmically generated playlist with the headline rewritten by a marketing intern. None of them treat albums like the artifacts they are. None of them care about side breaks, runout etchings, or the producer's marriage. None of them are willing to put Tago Mago at thirty-seven and stand behind it.

We do this because the alternative is letting the canon be written by people whose only relationship to a record is the streaming royalties on it. Vinyl is the format the canon was made on; it imposes length, sequence, fidelity, and stakes. A digital playlist has none of those things. A list of one hundred albums, properly written and properly defended, is a small act of resistance against a culture that wants you to forget the format ever mattered.

); } /* ---- 3. The methodology -------------------------------------------------- */ /* Six scoring dimensions for the worked example. There is no per-dimension data in the dataset, so this breakdown is authored to demonstrate the grid on a mid-table classic, Rumours (№ 36), rather than repeat the #1 album, which already leads the homepage as the flagship deep dive. The numbers reflect critical consensus: reference-grade songwriting, production and cohesion; comparatively modest on innovation for a record that perfected rather than invented its form. */ const EXAMPLE_SCORE = { composite: 8.9, dims: [ { key: "songwriting", label: "Songwriting", value: 9.4 }, { key: "production", label: "Production", value: 9.5 }, { key: "performance", label: "Performance", value: 9.0 }, { key: "innovation", label: "Innovation", value: 7.6 }, { key: "influence", label: "Influence", value: 8.8 }, { key: "cohesion", label: "Cohesion", value: 9.3 }] }; function ManifestoMethodology({ album, onAlbum }) { // Use the canonical scoring function (same one the deep-dive ScoreBreakdown // uses) so the composite + dimensions shown here exactly match the album's // own page. Fall back to the static example only if it hasn't loaded yet. const score = (album && window.bbrScoreFor && window.bbrScoreFor(album)) || EXAMPLE_SCORE; return (
§ 02 How the ranking is made

Six dimensions. One composite. Every placement defended in writing.

{SCORING_DIMENSIONS.map((d, i) =>
{String(i + 1).padStart(2, "0")} {d.label}

{d.note}

)}
{/* Worked example, abstract criteria, made concrete on the #1 album */}
Here’s what the scoring looks like in practice
{score.dims.map((d) =>
{d.label}
)}
Songwriting and production weighted ×1.25; cohesion the lightest input.
The composite

Each dimension is scored zero to ten by the editorial board after listening to a verified pressing on a calibrated system, blind-rated, then deliberated. The composite is not the average. Songwriting and production are weighted at one-and-a-quarter, because if those are weak, nothing else saves the record. Innovation and influence are tied. Cohesion is the smallest weight, but it can swing a placement by five spots in either direction.

Editorial vs. data

The score is built by humans. The data is there to keep us honest, pressing values from quarterly market medians, sample counts from WhoSampled, cultural references tracked through a small custom corpus we've built since 2021. When the score and the data disagree, the score wins, and we explain why in the essay. We are critics, not statisticians. Statisticians would have ranked Thriller higher.

What goes in the calculation

Pressing values matter because the market is also a critic, when a record's NM original sustains $300 in 2026 dollars, that is a thousand collectors voting against the streaming era. Cultural momentum matters because some records gain meaning over time and others lose it. The Velvet Underground & Nico is a different record in 2026 than it was in 1996, and the score reflects it. Nothing is frozen.

The defense

Every entry on the list has a full essay attached to it, with a public revision history. Every essay closes with an open comment section where the editor responds in writing for thirty days. We have changed three placements in the last eighteen months on the strength of reader arguments. We have refused to change forty-one others. The point is not that we're right. The point is that we're accountable.

); } /* ---- 4. The proof ------------------------------------------------------- */ function ManifestoProof({ items, onAlbum, onList }) { const open = (it) => { // All essays are live, navigate straight to the deep dive. if (onAlbum) onAlbum(it); else if (onList) onList(); }; return (
§ 03 Evidence the writing delivers

Three openers, picked so the range isn't an accident.

{items.map((it) =>
{it.title
№ {String(it.rank).padStart(3, "0")}
{it.eyebrow}

{it.title} — {it.artist}

{it.year} · composite {it.score.toFixed(1)} · {it.readTime}-min read

{it.pull}

{it.body}

{it.affiliate && e.stopPropagation()}> Own it on vinyl → }
)}
); } /* Recreate the Sleeve component's spirit at proof scale, without the dependency. */ function ProofSleeve({ sleeve, title, artist, year }) { const { bg, fg, accent, style } = sleeve; return (
{style === "portrait" && <>
{artist.split(" ").slice(-1)[0].toUpperCase()}
{title}
} {style === "minimal" &&
{title}
{artist}
{year}
} {style === "bold" &&
{title}
{artist}
}
); } /* ---- 5. The ranking, glimpsed ------------------------------------------- */ function ManifestoTop10({ top10, onAlbum, onList }) { // Shares the "heard" set with the full list page (localStorage key bbr:heard). const [heard, setHeard] = useHMfState(() => { try { return new Set(JSON.parse(localStorage.getItem("bbr:heard") || "[]")); } catch (e) { return new Set(); } }); useHMfEffect(() => { try { localStorage.setItem("bbr:heard", JSON.stringify([...heard])); } catch (e) {} }, [heard]); const toggleHeard = (rank, e) => { e.stopPropagation(); setHeard((h) => { const n = new Set(h); if (n.has(rank)) n.delete(rank); else n.add(rank); return n; }); }; return (
§ 04 The top ten, as a teaser

One through ten.
The other ninety are on the list.

A ranked one hundred without a top ten is a magazine without a cover. Here it is. Read it the way you'd read the front page of a serious paper, assume every position is an argument, and assume we'll defend it. Tap a circle to mark the ones you've heard.

    {top10.map((a) => { const isHeard = heard.has(a.rank); const onVinyl = !!(window.ESSAYS_FULL && window.ESSAYS_FULL[a.slug]); return (
  1. onAlbum(a)}>
    e.stopPropagation()}>
    {String(a.rank).padStart(2, "0")}
    {a.title} {a.artist}
    {a.year}
    {a.genre}
    {(9.9 - (a.rank - 1) * 0.07).toFixed(2)}
    {onVinyl && On vinyl }
    2. ); })}
Composite scores recalculated quarterly. Last revision: Q1 2026, Tago Mago up two, Sgt. Pepper down four, To Pimp a Butterfly up one.
); } /* ---- 6. The contract ---------------------------------------------------- */ function ManifestoContract() { return (
§ 05 What we owe you

If you stick around, here’s what you get from us. Every week. Without fail.

{CONTRACT_ITEMS.map((c, i) =>
{String(i + 1).padStart(2, "0")}

{c.label}

{c.body}

)}

Five commitments. If we break one, you get to write a guest editorial about it and we publish it.

); } /* ---- 7. Newsletter ------------------------------------------------------ */ function ManifestoNewsletter() { const [email, setEmail] = useHMfState(""); const [submitted, setSubmitted] = useHMfState(false); const onSubmit = (e) => { e.preventDefault(); if (!email) return; setSubmitted(true); }; return (
§ 05 The list, in your inbox

We’ll tell you when a grail pressing comes back in print — and send the next essay before anyone else.

The editorial promise One legendary album, written up in full, every Wednesday. No filler, no roundups, no sponsored picks.
The commerce promise Restock and back-in-print alerts when a grail pressing returns, with price movement on the originals we track.
{!submitted ?
setEmail(e.target.value)} aria-label="Email address" />
:
✓ You’ll get the next deep dive Wednesday morning, plus the next restock alert. Reply to it; the editor reads everything.
}
One email a week, no exceptions · 18,000 readers · One unsubscribe link, no dark patterns.
); } /* ---- 8. Sign-off -------------------------------------------------------- */ function ManifestoSignoff({ onList }) { return (

Albums are the longest-form thing popular music has ever asked anyone to sit down with. We think that's worth something. We think it's worth writing about properly. We think one of these will be your favorite essay you read this year.

Edited by
R Iannucci-Dawson
Written by
A small group of people who care too much
Edition
Volume IV · 2026
); } window.HomeManifesto = HomeManifesto; /* ======================================================== Dual-identity homepage sections (editorial + collector) Appended; orchestrated by HomeManifesto above. ======================================================== */ function HdArrow() { return ( ); } function ValueSparkDemo() { // Static upward demo line for the logged-out showcase. const pts = [4, 10, 9, 16, 22, 20, 28, 34, 40, 46, 52, 60]; const W = 220, H = 56, max = 64; const d = pts.map((v, i) => (i ? "L" : "M") + (i / (pts.length - 1) * W).toFixed(1) + "," + (H - v / max * H).toFixed(1)).join(" "); return ( ); } /* The 50/50 acquisition hero. Source order is Collection, connective, Canon so mobile stacks Collection-on-top with the connective between; desktop uses a grid (Canon left, Collection right, connective spanning below). */ function DualHero({ albums, featured, onList, onCollection }) { const wall = useHMfMemo( () => [1, 2, 5, 9, 15, 23].map((r) => albums.find((a) => a.rank === r)).filter(Boolean), [albums] ); return (
Your collection

Know what your records are worth.

Track, value and rank your vinyl — and climb the collector leaderboard.

Read the canon. Build your collection. Compete over it.
The canon

The 100 greatest albums, settled.

One definitive list, every placement defended in writing. Argue with it.

); } /* This week's deep dive — the featured essay. */ function WeeklyDeepDive({ album, onAlbum }) { if (!album) return null; const full = window.ESSAYS_FULL && window.ESSAYS_FULL[album.slug]; const dek = (full && full.essay && full.essay.dek) || (full && full.tagline) || "This week's definitive deep dive — pressing guide, session reconstruction, scoring data, and an argument we'll defend in the comments."; return (
); } /* Collector-tool showcase: the 100-grid, value-over-time, genre blend, and a prominent LIVE leaderboard — the competitive hook, styled like the real board. */ function CollectorShowcase({ albums, onCollection, onLeaderboards }) { const [top, setTop] = useHMfState(null); useHMfEffect(() => { let c = false; if (window.BBR_supabase) { window.BBR_supabase.rpc("leaderboard_totals", { genre_filter: null }) .then(({ data }) => { if (!c) setTop((data || []).slice(0, 5)); }) .catch(() => { if (!c) setTop([]); }); } else { setTop([]); } return () => { c = true; }; }, []); return (
The collector tools

Your shelf, measured — and ranked.

Scan a record, get its market value, watch your total climb — then see exactly where you stand against every other collector on the leaderboard.

The 100, tracked
Collection value
£
Genre blend
); } /* Live leaderboard feature — dark panel echoing the real Leaderboards page (medals, gradient value bars, count-up), so the competitive hook is obvious. */ function LeaderboardFeature({ top, onLeaderboards }) { const rows = (top || []).slice(0, 5); const max = rows.length ? (Number(rows[0].total_value) || 1) : 1; return (
Live leaderboard

The collectors out in front

{top === null ? (
Loading the board…
) : rows.length === 0 ? (
Be the first on the board.
) : (
{rows.map((r, i) => ( ))}
)}
); } /* Living community band. */ function CommunityBand({ onList, onCollection }) { return (
A living argument

The canon is up for debate.

Comment on every placement, nominate what we missed, and climb the board — the list argues back.

Comments
JM
Joel M.

"№33 for Off the Wall, over Thriller? Unhinged. And I think you're right."

♥ 24the editor replied
Nominations
Spiderland — Slint+312
Madvillainy — Madvillain+241
Dummy — Portishead+188
Leaderboard
1Ric D.£3,480
2Sarah K.£2,910
3Tomás R.£2,140
); } /* ====================================================================== Logged-in collector dashboard — a personal command center. Everything here is the member's REAL data: live collection value, the cumulative value curve drawn from when records were actually added, canon progress, and the genre blend of what's on their shelf. ====================================================================== */ const CM_GENRE_COLORS = ["var(--accent)", "#caa53d", "#5b7a99", "#6b8f71", "#9a6b9a", "#b0763f"]; /* Real cumulative collection value, in the order records were added. Each point is the running total after that record joined the shelf — so the curve is a true history of how the collection's value was built, not a demo trend. */ function cmCumulativeSeries(items) { const rows = items .map((r) => ({ t: r.date_added ? Date.parse(r.date_added) : 0, v: Number(r.est_value) || 0 })) .sort((a, b) => a.t - b.t); let acc = 0; return rows.map((r) => (acc += r.v)); } /* Value added in the trailing 30 days (real, from date_added). 0 ⇒ hidden. */ function cmRecentGain(items) { const cutoff = Date.now() - 30 * 864e5; return items.reduce((s, r) => { const t = r.date_added ? Date.parse(r.date_added) : 0; return t >= cutoff ? s + (Number(r.est_value) || 0) : s; }, 0); } /* Top genres on the shelf by record count, tail collapsed into "Other". */ function cmGenreBlend(items) { const map = new Map(); items.forEach((r) => { const g = r.genre || "Other"; map.set(g, (map.get(g) || 0) + 1); }); const arr = [...map.entries()].map(([g, v]) => ({ g, v })).sort((a, b) => b.v - a.v); const top = arr.slice(0, 4); const rest = arr.slice(4).reduce((s, x) => s + x.v, 0); if (rest) top.push({ g: "Other", v: rest }); return top.map((s, i) => ({ ...s, c: CM_GENRE_COLORS[i % CM_GENRE_COLORS.length] })); } /* Value curve, tuned for the dark dashboard card. Wipes in on reveal. */ function CmSpark({ pts }) { if (!pts || pts.length < 2) return