builtbykev/vyndr
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity
Files
main
vyndr/specs/design-reference/Vyndr Intelligence.dc.html
T
builtbykev f549422758 Design bundle: Price Triplet (ACT 01) + Offseason/Intelligence + 83 glyphs 
Drops the updated claude.ai/design bundle into specs/design-reference/ as the
build reference. New since the Jul-18 export: Vyndr Price Triplet.dc.html (the
reality-corrected ACT 01 — five honesty states incl. EDGE-NOT-TAKEABLE, and the
projection-then-price read-card hierarchy), Vyndr Offseason.dc.html,
Vyndr Intelligence.dc.html, PNG export masters, and 83 archetype glyphs
(74 display + 9 classifier-legacy).

Reference material only. No product code touched.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01VCNgGSt5qvcLxaeQqa7Zpj
2026-07-20 17:53:23 -04:00

1271 lines
164 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="./support.js"></script>
</head>
<body>
<x-dc>
<helmet>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
<style>
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#06060B;color:#F0F0F0;font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:rgba(0,212,160,.28);color:#F0F0F0}
a{color:#00D4A0;text-decoration:none}
a:hover{color:#5cf0cf}
.mono{font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums}
@keyframes vy-livedot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.82)}}
@keyframes vy-syncdot{0%,100%{opacity:1}50%{opacity:.2}}
@keyframes vy-rxup{0%{background:rgba(0,212,160,.28)}100%{background:rgba(0,212,160,0)}}
@keyframes vy-rxdown{0%{background:rgba(255,71,87,.26)}100%{background:rgba(255,71,87,0)}}
@keyframes vy-rowin{0%{opacity:0;transform:translateY(9px)}100%{opacity:var(--o,1);transform:translateY(0)}}
@keyframes vy-bootline{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
@keyframes vy-arrive{0%{opacity:0;transform:scale(.88) translateY(10px);filter:blur(6px)}60%{opacity:1;transform:scale(1.015) translateY(0);filter:blur(0)}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes vy-glitch{0%,90%,100%{transform:translate(0,0);clip-path:inset(0 0 0 0);text-shadow:none}91%{transform:translate(-1.5px,0);clip-path:inset(12% 0 42% 0);text-shadow:1.6px 0 #FF4757,-1.6px 0 #00D4A0}93%{transform:translate(1.5px,0);clip-path:inset(58% 0 8% 0);text-shadow:-1.6px 0 #FF4757,1.6px 0 #00D4A0}95%{transform:translate(-1px,0);clip-path:inset(32% 0 30% 0);text-shadow:1px 0 #00D4A0}96%{transform:translate(1px,0);clip-path:inset(70% 0 4% 0);text-shadow:none}}
@keyframes vy-cursor{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes vy-wirein{0%{opacity:0;transform:translateY(4px)}8%,86%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-3px)}}
.rx-up{animation:vy-rxup .75s ease-out}
.rx-down{animation:vy-rxdown .75s ease-out}
.vy-grain{position:fixed;inset:0;z-index:5;pointer-events:none;mix-blend-mode:overlay;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:140px}
.vy-vignette{position:fixed;inset:0;z-index:4;pointer-events:none;box-shadow:inset 0 0 200px 40px rgba(0,0,0,.55),inset 0 90px 120px -60px rgba(0,212,160,.05)}
[data-reveal]{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.2,.8,.2,1),transform .6s cubic-bezier(.2,.8,.2,1)}
[data-reveal].vy-in{opacity:1;transform:none}
.vy-still *{animation-play-state:paused !important}
html{scroll-behavior:smooth}
</style>
<script src="image-slot.js"></script>
<style>image-slot::part(empty){opacity:0}</style>
</helmet>
<div ref="{{ rootRef }}" class="{{ stillClass }}" style="min-height:100vh;background:radial-gradient(1200px 700px at 78% -8%,rgba(0,212,160,.06),transparent 60%),#06060B;padding:0 0 120px">
<div class="vy-vignette" aria-hidden="true"></div>
<div class="vy-grain" aria-hidden="true"></div>
<div style="position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;align-items:center;gap:14px;height:36px;padding:0 40px;background:rgba(6,6,11,.88);backdrop-filter:blur(14px);border-top:1px solid #14141E">
<span class="mono" style="font-size:9px;letter-spacing:.26em;color:#00D4A0;font-weight:800;flex:none">THE WIRE</span>
<span style="width:1px;height:14px;background:#1E1E2A;flex:none"></span>
<span class="mono" data-wire-time style="font-size:10px;color:#707080;letter-spacing:.06em;flex:none">--:--:--</span>
<span class="mono" data-wire style="font-size:11px;color:#B8BCC8;letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1">Intelligence desk open — 7 books held per prop, CLV tracked from lock.</span>
<span class="mono" style="font-size:9px;letter-spacing:.16em;color:#4a4a58;flex:none">LOG ▸</span>
</div>
<div style="max-width:1240px;margin:0 auto;padding:0 40px">
<div style="padding:52px 0 30px">
<div class="mono" style="font-size:11px;letter-spacing:.34em;color:#00D4A0;margin-bottom:16px">SESSION 2 · SURFACES 2–5 · INTELLIGENCE EXTENSIONS</div>
<h1 style="font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1.05">The honest layer, rendered.<span class="mono" style="color:#00D4A0;animation:vy-cursor 1.1s steps(1) infinite">▌</span></h1>
<p style="margin-top:12px;max-width:660px;color:#B8BCC8;font-size:14px;line-height:1.55">The price triplet leads — <span class="mono" style="color:#F0F0F0">book · fair · model</span>, the de-vigged number nobody else shows consumers. Then line shopping, article media, CLV &amp; calibration, and The Report — extensions sharing primitives. The movement strip is defined once here and reused everywhere a line has a past.</p>
<div class="mono" style="margin-top:14px;font-size:10px;letter-spacing:.16em;color:#707080"><a href="Vyndr Offseason.dc.html">◂ OFFSEASON HUB (S1)</a> · <a href="Vyndr System.dc.html">DESKTOP SYSTEM</a> · <a href="Vyndr Mobile.dc.html">MOBILE</a></div>
</div>
<!-- ============ ACT 01 · THE PRICE TRIPLET (HERO FEATURE) ============ -->
<div data-reveal style="margin-top:14px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">01</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">THE PRICE TRIPLET <span style="color:#FFB347">· HERO</span></div><div style="font-size:12.5px;color:#707080;margin-top:5px">Book · fair · model, per prop — the price-honesty layer beside the stat projection. Fair is the amber hero, honest on every row: value, edge-but-priced-out, or no edge. Renders on the read card, board and hero; the close lives in the ledger.</div></div>
</div>
<div id="triplet" data-screen-label="Price triplet · anatomy + four honesty states" style="margin-top:44px">
<!-- anatomy · inherits the parlay TRUE FAIR VALUE language -->
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;padding:22px 24px">
<div style="display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px">
<span class="mono" style="font-size:12px;letter-spacing:.28em;color:#F0F0F0;font-weight:700">ANATOMY</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">EXTENDS THE PARLAY "TRUE FAIR VALUE" — 2-UP GRID → 3-LEG PER-PROP</span>
</div>
<div style="max-width:560px">
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:12px;overflow:hidden;background:#0E0E14">
<div style="flex:1;min-width:0;text-align:center;padding:16px 10px">
<div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">BOOK</div>
<div class="mono" style="font-size:22px;font-weight:800;color:#F0F0F0;margin-top:8px;letter-spacing:-.01em">+125</div>
<div class="mono" style="font-size:7px;letter-spacing:.12em;color:#4a4a58;margin-top:6px">OFFERED</div>
</div>
<div style="flex:1.16;min-width:0;text-align:center;padding:16px 10px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A">
<div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div>
<div class="mono" style="font-size:31px;font-weight:800;color:#FFB347;margin-top:5px;letter-spacing:-.02em;text-shadow:0 0 22px rgba(255,179,71,.24)">+110</div>
<div class="mono" style="font-size:7px;letter-spacing:.12em;color:#8a7a55;margin-top:5px">DE-VIGGED · HERO</div>
</div>
<div style="flex:1;min-width:0;text-align:center;padding:16px 10px">
<div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">MODEL</div>
<div class="mono" style="font-size:22px;font-weight:800;color:#00D4A0;margin-top:8px;letter-spacing:-.01em">+98</div>
<div class="mono" style="font-size:7px;letter-spacing:.12em;color:#4a4a58;margin-top:6px">OUR PRICE</div>
</div>
</div>
</div>
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px;max-width:820px">
<div><div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#F0F0F0;font-weight:700">BOOK</div><div style="font-size:10.5px;color:#707080;line-height:1.55;margin-top:5px">The market's offered line. Honest on every row.</div></div>
<div><div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#FFB347;font-weight:700">FAIR · THE HERO</div><div style="font-size:10.5px;color:#B8BCC8;line-height:1.55;margin-top:5px">The de-vigged fair number. The whole product. Never hidden — not even when the model leg is poisoned.</div></div>
<div><div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#00D4A0;font-weight:700">MODEL</div><div style="font-size:10.5px;color:#707080;line-height:1.55;margin-top:5px">VYNDR's own price. Green only for takeable edge — never a juiced one. Suppressible on quarantined rows.</div></div>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:16px;line-height:1.7">SAME TOKENS AS THE PARLAY · LABEL 7.5PX / .14EM / #707080 · VALUE MONO 800 · FAIR AMBER #FFB347 VS BOOK #F0F0F0 · GREEN #00D4A0 = TAKEABLE EDGE ONLY · BLUE = EDGE PRICED OUT</div>
</div>
<!-- four honesty states · desktop -->
<div style="display:flex;align-items:center;gap:12px;margin:30px 0 14px">
<span class="mono" style="font-size:12px;letter-spacing:.28em;color:#F0F0F0;font-weight:700">FIVE HONESTY STATES · DESKTOP</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">THREE VERDICTS — VALUE · EDGE-NOT-TAKEABLE · NO EDGE — PLUS QUARANTINE &amp; REFUSAL</span>
</div>
<div style="display:grid;grid-template-columns:1fr 1fr;gap:16px">
<!-- STATE 1 · POSITIVE VALUE -->
<div style="border-radius:14px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px;display:flex;flex-direction:column;gap:13px">
<div style="display:flex;align-items:flex-start;justify-content:space-between;gap:10px">
<div style="min-width:0"><div style="font-size:13.5px;font-weight:700">Nabers <span style="color:#B8BCC8;font-weight:500">o 1,115.5 Rec Yds</span></div><div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:3px">NYG · WK 1</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:8px;letter-spacing:.12em;color:#00D4A0;font-weight:700;flex:none">1 · VALUE</span>
</div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:11px;overflow:hidden;background:#0A0A10">
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">BOOK</div><div class="mono" style="font-size:20px;font-weight:800;color:#F0F0F0;margin-top:7px">+125</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">OFFERED</div></div>
<div style="flex:1.16;min-width:0;text-align:center;padding:14px 8px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:29px;font-weight:800;color:#FFB347;margin-top:4px;letter-spacing:-.02em;text-shadow:0 0 20px rgba(255,179,71,.22)">+110</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#8a7a55;margin-top:4px">DE-VIGGED</div></div>
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">MODEL</div><div class="mono" style="font-size:20px;font-weight:800;color:#00D4A0;margin-top:7px;text-shadow:0 0 16px rgba(0,212,160,.35)">+98</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">OUR PRICE</div></div>
</div>
<div style="padding:11px 13px;border-radius:10px;background:rgba(0,212,160,.08);border:1px solid rgba(0,212,160,.28)">
<div style="display:flex;align-items:center;gap:8px"><span style="width:7px;height:7px;border-radius:50%;background:#00D4A0;flex:none;box-shadow:0 0 8px rgba(0,212,160,.7)"></span><span class="mono" style="font-size:10.5px;font-weight:800;letter-spacing:.05em;color:#00D4A0">VALUE · +2.9% VS FAIR</span></div>
<div style="font-size:10.5px;color:#B8BCC8;line-height:1.5;margin-top:6px">Model prices it shorter than the honest number — the book is paying longer than the leg is worth. Real edge.</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px"><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">THE PRICE STORY · READ CARD</span><a href="#clv" class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">CLOSES TRACKED IN YOUR LEDGER ▸</a></div>
</div>
<!-- STATE 2 · EDGE BUT NOT TAKEABLE (priced out) -->
<div style="border-radius:14px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px;display:flex;flex-direction:column;gap:13px">
<div style="display:flex;align-items:flex-start;justify-content:space-between;gap:10px">
<div style="min-width:0"><div style="font-size:13.5px;font-weight:700">Chase <span style="color:#B8BCC8;font-weight:500">o 6.5 Receptions</span></div><div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:3px">CIN · WK 1</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(106,147,200,.12);border:1px solid rgba(106,147,200,.34);font-size:8px;letter-spacing:.1em;color:#8fb2de;font-weight:700;flex:none">2 · PRICED OUT</span>
</div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:11px;overflow:hidden;background:#0A0A10">
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">BOOK</div><div class="mono" style="font-size:20px;font-weight:800;color:#F0F0F0;margin-top:7px">−210</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">JUICED</div></div>
<div style="flex:1.16;min-width:0;text-align:center;padding:14px 8px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:29px;font-weight:800;color:#FFB347;margin-top:4px;letter-spacing:-.02em;text-shadow:0 0 20px rgba(255,179,71,.22)">−175</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#8a7a55;margin-top:4px">DE-VIGGED</div></div>
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">MODEL</div><div class="mono" style="font-size:20px;font-weight:800;color:#8fb2de;margin-top:7px">−240</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">OUR PRICE</div></div>
</div>
<div style="padding:11px 13px;border-radius:10px;background:rgba(106,147,200,.08);border:1px solid rgba(106,147,200,.3)">
<div style="display:flex;align-items:center;justify-content:space-between;gap:10px"><div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:12px;color:#8fb2de;flex:none;line-height:1">⊘</span><span class="mono" style="font-size:10.5px;font-weight:800;letter-spacing:.05em;color:#8fb2de">EDGE · NOT TAKEABLE</span></div><span class="mono" style="font-size:9px;letter-spacing:.06em;color:#7a93b0">+11.7% EV AT −210</span></div>
<div style="font-size:10.5px;color:#B8BCC8;line-height:1.5;margin-top:6px">The math shows edge — but −210 is too juiced to bet. We won't call a juiced price a value, and we won't pretend the edge wasn't there.</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px"><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">TAKEABLE BAND −160 TO +200</span><a href="#clv" class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">CLOSES TRACKED IN YOUR LEDGER ▸</a></div>
</div>
<!-- STATE 3 · NO / NEGATIVE VALUE -->
<div style="border-radius:14px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px;display:flex;flex-direction:column;gap:13px">
<div style="display:flex;align-items:flex-start;justify-content:space-between;gap:10px">
<div style="min-width:0"><div style="font-size:13.5px;font-weight:700">Achane <span style="color:#B8BCC8;font-weight:500">o 71.5 Rush Yds</span></div><div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:3px">MIA · WK 1</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #2A2A38;font-size:8px;letter-spacing:.12em;color:#B8BCC8;font-weight:700;flex:none">3 · NO EDGE</span>
</div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:11px;overflow:hidden;background:#0A0A10">
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">BOOK</div><div class="mono" style="font-size:20px;font-weight:800;color:#F0F0F0;margin-top:7px">+118</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">OFFERED</div></div>
<div style="flex:1.16;min-width:0;text-align:center;padding:14px 8px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:29px;font-weight:800;color:#FFB347;margin-top:4px;letter-spacing:-.02em;text-shadow:0 0 20px rgba(255,179,71,.22)">+104</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#8a7a55;margin-top:4px">DE-VIGGED</div></div>
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">MODEL</div><div class="mono" style="font-size:20px;font-weight:800;color:#B8BCC8;margin-top:7px">+112</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">OUR PRICE</div></div>
</div>
<div style="padding:11px 13px;border-radius:10px;background:#101018;border:1px solid #1E1E2A">
<div style="display:flex;align-items:center;gap:8px"><span style="width:7px;height:7px;border-radius:50%;border:1.5px solid #707080;flex:none"></span><span class="mono" style="font-size:10.5px;font-weight:800;letter-spacing:.05em;color:#B8BCC8">NO EDGE HERE · −1.8% VS FAIR</span></div>
<div style="font-size:10.5px;color:#707080;line-height:1.5;margin-top:6px">Model lands short of fair — the honest number is already priced. We're not calling this a play. That "no" is the instrument working.</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px"><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">THE PRICE STORY · READ CARD</span><a href="#clv" class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">CLOSES TRACKED IN YOUR LEDGER ▸</a></div>
</div>
<!-- STATE 4 · MODEL-LEG SUPPRESSED (quarantined) · PRIMARY -->
<div style="border-radius:14px;background:#0E0E14;border:1px solid #2A2A38;padding:18px;display:flex;flex-direction:column;gap:13px;box-shadow:inset 3px 0 0 rgba(255,179,71,.4)">
<div style="display:flex;align-items:flex-start;justify-content:space-between;gap:10px">
<div style="min-width:0"><div style="font-size:13.5px;font-weight:700">Bijan <span style="color:#B8BCC8;font-weight:500">o 84.5 Rush Yds</span></div><div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:3px">ATL · WK 1</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(255,179,71,.1);border:1px solid rgba(255,179,71,.3);font-size:8px;letter-spacing:.1em;color:#FFB347;font-weight:700;flex:none">4 · QUARANTINE · 38%</span>
</div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:11px;overflow:hidden;background:#0A0A10">
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">BOOK</div><div class="mono" style="font-size:20px;font-weight:800;color:#F0F0F0;margin-top:7px">+130</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">OFFERED</div></div>
<div style="flex:1.16;min-width:0;text-align:center;padding:14px 8px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:29px;font-weight:800;color:#FFB347;margin-top:4px;letter-spacing:-.02em;text-shadow:0 0 20px rgba(255,179,71,.22)">+116</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#8a7a55;margin-top:4px">DE-VIGGED</div></div>
<div style="flex:1;min-width:0;text-align:center;padding:14px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,transparent,transparent 5px,rgba(255,255,255,.014) 5px,rgba(255,255,255,.014) 10px)"><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">MODEL</div><div class="mono" style="font-size:19px;font-weight:800;color:#4a4a58;margin-top:8px;letter-spacing:.1em">— · —</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#5a5a68;margin-top:6px">WITHHELD</div></div>
</div>
<div style="padding:11px 13px;border-radius:10px;background:#101018;border:1px solid #2A2A38">
<div style="display:flex;align-items:center;gap:8px"><span style="width:7px;height:7px;border-radius:2px;background:#FFB347;flex:none;opacity:.85"></span><span class="mono" style="font-size:10.5px;font-weight:800;letter-spacing:.05em;color:#B8BCC8">MODEL READ WITHHELD</span></div>
<div style="font-size:10.5px;color:#707080;line-height:1.5;margin-top:6px">Graded against an unverified matchup — so we suppressed our price. Book &amp; fair stand; we never hide the honest fair number because a different leg is poisoned.</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px"><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">PRIMARY STATE · 200 / 520 ROWS</span><a href="#clv" class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">CLOSES TRACKED IN YOUR LEDGER ▸</a></div>
</div>
<!-- STATE 5 · REFUSAL / CAN'T-GRADE · spans full width -->
<div style="grid-column:1 / -1;border-radius:14px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px;display:flex;flex-direction:column;gap:13px">
<div style="display:flex;align-items:flex-start;justify-content:space-between;gap:10px">
<div style="min-width:0"><div style="font-size:13.5px;font-weight:700">Egbuka <span style="color:#B8BCC8;font-weight:500">o 44.5 Rec Yds</span></div><div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:3px">TB · NFL DEBUT · NO PRIORS</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.28);font-size:8px;letter-spacing:.1em;color:#FF6B78;font-weight:700;flex:none">5 · REFUSAL</span>
</div>
<div style="flex:1;display:flex;align-items:center;justify-content:center;border:1px dashed #2A2A38;border-radius:11px;padding:20px 16px;text-align:center;background:#0A0A10">
<div>
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#FF6B78">CAN'T GRADE THIS ONE</div>
<div style="font-size:11.5px;color:#B8BCC8;margin-top:9px;line-height:1.55;max-width:340px">No fair price we'd defend yet — the inputs are too thin. When they clear, the triplet returns. We'd rather show nothing than a number we can't stand behind.</div>
<div class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58;margin-top:11px">NO FABRICATED PRICE · NO EMPTY GAUGE · TRUTH LAW</div>
</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px"><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">NOTHING TO TRACK YET</span><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">LEDGER OPENS ON FIRST HONEST LOCK</span></div>
</div>
</div>
<!-- in context · where it renders -->
<div style="display:flex;align-items:center;gap:12px;margin:30px 0 14px">
<span class="mono" style="font-size:12px;letter-spacing:.28em;color:#F0F0F0;font-weight:700">IN CONTEXT · WHERE IT RENDERS</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">READ-CARD HERO · BOARD ROW · FREE-TIER GATE</span>
</div>
<!-- A · read-card hero -->
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;overflow:hidden">
<div style="display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:16px 22px 0">
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:8.5px;letter-spacing:.14em;color:#B8BCC8">READ CARD · HERO</span>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:8.5px;letter-spacing:.14em;color:#B8BCC8">NFL</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#4a4a58;margin-left:auto">JUL 17, 2026 · THE DESK</span>
</div>
<div style="padding:14px 22px 20px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:24px;align-items:start">
<div style="min-width:0">
<div style="display:flex;align-items:center;gap:12px">
<span class="mono" style="display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:12px;background:rgba(0,212,160,.12);border:1px solid rgba(0,212,160,.32);font-size:22px;font-weight:800;color:#00D4A0;flex:none;text-shadow:0 0 18px rgba(0,212,160,.4)">A+</span>
<div style="min-width:0"><div style="font-size:18px;font-weight:800;letter-spacing:-.01em;line-height:1.15">Nabers over 1,115.5 receiving yards</div><div class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080;margin-top:4px">NYG · WK 1 · OPENED 1,050.5</div></div>
</div>
<p style="font-size:12.5px;line-height:1.65;color:#B8BCC8;margin-top:14px;max-width:420px">The market moved 70 on the clearance and stopped — our sim says the discount was worth twice that. Read the projection first (does it clear), then the price (is it fair). Two questions, one card.</p>
<div style="display:flex;align-items:center;gap:10px;margin-top:14px"><span class="mono" style="display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 18px;border-radius:11px;background:#00D4A0;color:#06060B;font-weight:800;font-size:10.5px;letter-spacing:.08em">TAKE +125 AT FANDUEL ▸</span><a href="#clv" class="mono" style="font-size:8px;letter-spacing:.12em;color:#707080;line-height:1.5">CLOSES TRACKED<br>IN YOUR LEDGER ▸</a></div>
</div>
<div style="min-width:0;display:flex;flex-direction:column;gap:12px">
<div style="border:1px solid #1E1E2A;border-radius:13px;background:#0E0E14;padding:13px 16px">
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px"><span class="mono" style="font-size:8px;letter-spacing:.16em;color:#707080">① PROJECTION · WILL IT CLEAR</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#00D4A0;font-weight:700">CLEARS BY 72.5</span></div>
<div style="display:flex;align-items:flex-end;gap:16px">
<div><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">MODEL PROJ</div><div class="mono" style="font-size:28px;font-weight:800;color:#00D4A0;line-height:1;margin-top:5px;text-shadow:0 0 18px rgba(0,212,160,.28)">1,188</div></div>
<div class="mono" style="padding-bottom:5px;color:#4a4a58;font-size:11px">vs</div>
<div><div class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">LINE</div><div class="mono" style="font-size:28px;font-weight:800;color:#F0F0F0;line-height:1;margin-top:5px">1,115.5</div></div>
<div style="flex:1;min-width:0;padding-bottom:6px"><div style="position:relative;height:8px;border-radius:4px;background:#14141E;overflow:hidden"><div style="position:absolute;left:0;top:0;bottom:0;width:64%;background:#00D4A0;opacity:.5"></div></div><div class="mono" style="font-size:6.5px;letter-spacing:.1em;color:#4a4a58;margin-top:5px">PROJECTED ABOVE THE LINE</div></div>
</div>
</div>
<div>
<div class="mono" style="font-size:8px;letter-spacing:.16em;color:#707080;margin-bottom:9px">② PRICE · IS IT FAIR</div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:13px;overflow:hidden;background:#0E0E14">
<div style="flex:1;min-width:0;text-align:center;padding:16px 8px"><div class="mono" style="font-size:8px;letter-spacing:.14em;color:#707080">BOOK</div><div class="mono" style="font-size:24px;font-weight:800;color:#F0F0F0;margin-top:8px">+125</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:6px">OFFERED</div></div>
<div style="flex:1.2;min-width:0;text-align:center;padding:16px 8px;background:rgba(255,179,71,.06);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:8px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:36px;font-weight:800;color:#FFB347;margin-top:4px;letter-spacing:-.02em;text-shadow:0 0 24px rgba(255,179,71,.26)">+110</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#8a7a55;margin-top:4px">DE-VIGGED · HERO</div></div>
<div style="flex:1;min-width:0;text-align:center;padding:16px 8px"><div class="mono" style="font-size:8px;letter-spacing:.14em;color:#707080">MODEL</div><div class="mono" style="font-size:24px;font-weight:800;color:#00D4A0;margin-top:8px;text-shadow:0 0 18px rgba(0,212,160,.35)">+98</div><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58;margin-top:6px">OUR PRICE</div></div>
</div>
<div style="margin-top:10px;padding:12px 14px;border-radius:11px;background:rgba(0,212,160,.08);border:1px solid rgba(0,212,160,.28)">
<div style="display:flex;align-items:center;justify-content:space-between;gap:10px"><div style="display:flex;align-items:center;gap:8px"><span style="width:7px;height:7px;border-radius:50%;background:#00D4A0;flex:none;box-shadow:0 0 8px rgba(0,212,160,.7)"></span><span class="mono" style="font-size:11px;font-weight:800;letter-spacing:.05em;color:#00D4A0">VALUE · +2.9% VS FAIR</span></div><span class="mono" style="font-size:9px;letter-spacing:.06em;color:#8fb8ac">+6.1% EV AT +125</span></div>
<div style="font-size:10.5px;color:#B8BCC8;line-height:1.5;margin-top:6px">Model beats the honest number and the price is takeable — the edge is real at what you can actually get.</div>
</div>
</div>
</div>
</div>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:8px;line-height:1.7">HIERARCHY · STAT PROJECTION READS FIRST (WILL IT CLEAR) → PRICE TRIPLET QUALIFIES IT (IS IT FAIR). TWO QUESTIONS, TWO STACKED BLOCKS — NEITHER CROWDS THE OTHER. FAIR STAYS THE AMBER HERO OF THE PRICE LAYER.</div>
<!-- B board row · C free-tier gate -->
<div style="display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;margin-top:16px;align-items:start">
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;overflow:hidden;min-width:0">
<div style="display:flex;align-items:center;justify-content:space-between;padding:15px 18px 13px"><span class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">TONIGHT'S BOARD · NBA</span><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">RANKED BY EDGE · FAIR IS THE NUMBER</span></div>
<div style="display:flex;align-items:center;gap:12px;padding:11px 18px;border-top:1px solid #101018">
<span class="mono" style="display:inline-flex;align-items:center;justify-content:center;width:30px;height:20px;border-radius:5px;background:rgba(0,212,160,.14);border:1px solid rgba(0,212,160,.3);font-size:9px;font-weight:800;color:#00D4A0;flex:none">A+</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Jokić <span style="color:#B8BCC8;font-weight:500">o 27.5 Pts</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">PROJ <span style="color:#00D4A0;font-weight:700">28.9</span> ▸ CLEARS · BOOK +125 · MDL <span style="color:#00D4A0;font-weight:700">+98</span></div></div>
<div style="text-align:right;flex:none"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:16px;font-weight:800;color:#FFB347;line-height:1">+110</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:9px;font-weight:800;color:#00D4A0;flex:none;width:52px;justify-content:center">+2.9%</span>
</div>
<div style="display:flex;align-items:center;gap:12px;padding:11px 18px;border-top:1px solid #101018;opacity:.9">
<span class="mono" style="display:inline-flex;align-items:center;justify-content:center;width:30px;height:20px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.24);font-size:9px;font-weight:800;color:#00D4A0;flex:none">A</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Edwards <span style="color:#B8BCC8;font-weight:500">o 5.5 Ast</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">PROJ <span style="color:#00D4A0;font-weight:700">6.4</span> ▸ CLEARS · BOOK +112 · MDL <span style="color:#00D4A0;font-weight:700">+96</span></div></div>
<div style="text-align:right;flex:none"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:16px;font-weight:800;color:#FFB347;line-height:1">+103</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:9px;font-weight:800;color:#00D4A0;flex:none;width:52px;justify-content:center">+1.6%</span>
</div>
<div style="display:flex;align-items:center;gap:12px;padding:11px 18px;border-top:1px solid #101018;box-shadow:inset 3px 0 0 rgba(255,179,71,.4)">
<span class="mono" style="display:inline-flex;align-items:center;justify-content:center;width:30px;height:20px;border-radius:5px;background:#14141E;border:1px solid #2A2A38;font-size:9px;font-weight:800;color:#B8BCC8;flex:none">B</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Gobert <span style="color:#B8BCC8;font-weight:500">o 11.5 Reb</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">PROJ <span style="color:#B8BCC8;font-weight:700">12.1</span> ▸ CLEARS · BOOK +108 · MDL <span style="color:#FFB347;font-weight:700">withheld</span></div></div>
<div style="text-align:right;flex:none"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:16px;font-weight:800;color:#FFB347;line-height:1">+99</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #2A2A38;font-size:8px;font-weight:700;color:#707080;flex:none;width:52px;justify-content:center">QUAR</span>
</div>
<div style="display:flex;align-items:center;gap:12px;padding:11px 18px;border-top:1px solid #101018;opacity:.72">
<span class="mono" style="display:inline-flex;align-items:center;justify-content:center;width:30px;height:20px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;font-weight:800;color:#B8BCC8;flex:none">C</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Murray <span style="color:#B8BCC8;font-weight:500">o 22.5 Pts</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">PROJ <span style="color:#B8BCC8;font-weight:700">22.9</span> ▸ THIN · BOOK +118 · MDL <span style="color:#B8BCC8;font-weight:700">+124</span></div></div>
<div style="text-align:right;flex:none"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:16px;font-weight:800;color:#FFB347;line-height:1">+109</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:5px;background:#101018;border:1px solid #1E1E2A;font-size:8px;font-weight:700;color:#707080;flex:none;width:52px;justify-content:center">NO EDGE</span>
</div>
<div style="padding:10px 18px;border-top:1px solid #101018"><span class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58">PROJECTION LEADS THE ROW (WILL IT CLEAR) · FAIR IS THE PRICE · EDGE CHIP IS THE VERDICT</span></div>
</div>
<!-- C · free-tier gate -->
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;padding:20px;min-width:0">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:14px">FREE-TIER GATE · MODEL LEG LOCKED</div>
<div style="border-radius:13px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px"><div style="font-size:12.5px;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">Nabers <span style="color:#B8BCC8;font-weight:500">o 1,115.5</span></div><span class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#707080;font-weight:700;flex:none">FREE</span></div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:11px;overflow:hidden;background:#0A0A10">
<div style="flex:1;text-align:center;padding:13px 6px"><div class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">BOOK</div><div class="mono" style="font-size:19px;font-weight:800;color:#F0F0F0;margin-top:6px">+125</div></div>
<div style="flex:1.16;text-align:center;padding:13px 6px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:26px;font-weight:800;color:#FFB347;margin-top:3px;letter-spacing:-.02em;text-shadow:0 0 18px rgba(255,179,71,.22)">+110</div></div>
<div style="flex:1;text-align:center;padding:13px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;background:#0C0C12"><div class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">MODEL</div><svg width="15" height="15" viewBox="0 0 24 24" fill="none" style="margin-top:8px;color:#5a5a68"><rect x="4" y="10" width="16" height="10" rx="2" stroke="currentColor" stroke-width="2"></rect><path d="M8 10V7a4 4 0 0 1 8 0v3" stroke="currentColor" stroke-width="2"></path></svg><div class="mono" style="font-size:11px;font-weight:800;color:#5a5a68;letter-spacing:.14em;margin-top:5px">+ █ █</div></div>
</div>
<div style="display:flex;align-items:center;gap:8px;margin-top:11px;padding:10px 12px;border-radius:10px;background:#101018;border:1px solid #1E1E2A"><span style="width:7px;height:7px;border-radius:50%;border:1.5px solid #707080;flex:none"></span><span class="mono" style="font-size:9.5px;font-weight:800;letter-spacing:.04em;color:#B8BCC8;flex:1">MODEL PRICE ON ANALYST</span><span class="mono" style="font-size:8.5px;letter-spacing:.08em;color:#00D4A0;font-weight:700;flex:none">UNLOCK ▸</span></div>
</div>
<div style="font-size:10.5px;color:#707080;line-height:1.55;margin-top:14px">The honest de-vigged number stays free — that's the hook. Only VYNDR's own price gates. The fair leg is never the paywall.</div>
</div>
</div>
<!-- mobile 390 + tier -->
<div style="display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:16px;margin-top:16px;align-items:start">
<!-- mobile 390 -->
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;padding:20px;min-width:0">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:14px">MOBILE · 390 · THREE LEGS HOLD, FAIR STAYS HERO</div>
<div style="width:340px;max-width:100%;margin:0 auto;display:flex;flex-direction:column;gap:12px">
<!-- positive -->
<div style="border-radius:13px;background:#0E0E14;border:1px solid #1E1E2A;padding:14px">
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px"><div style="font-size:12.5px;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">Nabers <span style="color:#B8BCC8;font-weight:500">o 1,115.5 Rec</span></div><span class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#00D4A0;font-weight:700;flex:none">VALUE</span></div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:10px;overflow:hidden;background:#0A0A10">
<div style="flex:1;text-align:center;padding:11px 4px"><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#707080">BOOK</div><div class="mono" style="font-size:16px;font-weight:800;color:#F0F0F0;margin-top:5px">+125</div></div>
<div style="flex:1.14;text-align:center;padding:11px 4px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:23px;font-weight:800;color:#FFB347;margin-top:3px;letter-spacing:-.02em">+110</div></div>
<div style="flex:1;text-align:center;padding:11px 4px"><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#707080">MODEL</div><div class="mono" style="font-size:16px;font-weight:800;color:#00D4A0;margin-top:5px">+98</div></div>
</div>
<div style="display:flex;align-items:center;gap:7px;margin-top:10px;padding:8px 10px;border-radius:9px;background:rgba(0,212,160,.08);border:1px solid rgba(0,212,160,.26)"><span style="width:6px;height:6px;border-radius:50%;background:#00D4A0;flex:none"></span><span class="mono" style="font-size:9px;font-weight:800;letter-spacing:.04em;color:#00D4A0">+2.9% VS FAIR</span><span style="font-size:9px;color:#707080;margin-left:auto">real edge</span></div>
</div>
<!-- quarantine -->
<div style="border-radius:13px;background:#0E0E14;border:1px solid #2A2A38;padding:14px;box-shadow:inset 3px 0 0 rgba(255,179,71,.4)">
<div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px"><div style="font-size:12.5px;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">Bijan <span style="color:#B8BCC8;font-weight:500">o 84.5 Rush</span></div><span class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#FFB347;font-weight:700;flex:none">QUARANTINE</span></div>
<div style="display:flex;align-items:stretch;border:1px solid #1E1E2A;border-radius:10px;overflow:hidden;background:#0A0A10">
<div style="flex:1;text-align:center;padding:11px 4px"><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#707080">BOOK</div><div class="mono" style="font-size:16px;font-weight:800;color:#F0F0F0;margin-top:5px">+130</div></div>
<div style="flex:1.14;text-align:center;padding:11px 4px;background:rgba(255,179,71,.055);border-left:1px solid #1E1E2A;border-right:1px solid #1E1E2A"><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#FFB347">◆ FAIR</div><div class="mono" style="font-size:23px;font-weight:800;color:#FFB347;margin-top:3px;letter-spacing:-.02em">+116</div></div>
<div style="flex:1;text-align:center;padding:11px 4px;background:repeating-linear-gradient(45deg,transparent,transparent 4px,rgba(255,255,255,.014) 4px,rgba(255,255,255,.014) 8px)"><div class="mono" style="font-size:7px;letter-spacing:.1em;color:#707080">MODEL</div><div class="mono" style="font-size:15px;font-weight:800;color:#4a4a58;margin-top:6px">—</div></div>
</div>
<div style="display:flex;align-items:center;gap:7px;margin-top:10px;padding:8px 10px;border-radius:9px;background:#101018;border:1px solid #2A2A38"><span style="width:6px;height:6px;border-radius:2px;background:#FFB347;opacity:.85;flex:none"></span><span class="mono" style="font-size:9px;font-weight:800;letter-spacing:.04em;color:#B8BCC8">MODEL WITHHELD</span><span style="font-size:9px;color:#707080;margin-left:auto">book &amp; fair stand</span></div>
</div>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58;margin-top:14px;line-height:1.6;text-align:center">44PX MIN TAP ON THE LEDGER LINK · NO HORIZONTAL SCROLL AT 390 · FAIR NEVER DROPS BELOW BOOK/MODEL IN SIZE</div>
</div>
<!-- tier placement -->
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;padding:20px 22px;min-width:0">
<div style="display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px"><span class="mono" style="font-size:11px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">TIER PLACEMENT</span><span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;background:rgba(255,179,71,.1);border:1px solid rgba(255,179,71,.28);font-size:7.5px;letter-spacing:.1em;color:#FFB347;font-weight:700">RECOMMENDED · CONFIRM</span></div>
<div style="font-size:11.5px;color:#707080;line-height:1.55;margin-bottom:16px">The de-vigged fair number is the free-tier hook per prior product intent — worth surfacing on Free. Flagged for confirmation before ship.</div>
<div style="display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:flex-start;gap:12px;padding:13px 14px;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A">
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#FFB347;font-weight:800;width:62px;flex:none;padding-top:1px">FREE</span>
<div style="min-width:0"><div style="font-size:11.5px;color:#F0F0F0;font-weight:600">Book · fair — model leg locked.</div><div style="font-size:10.5px;color:#707080;line-height:1.5;margin-top:3px">The hook: the honest de-vigged number, free. Model shows as a locked teaser that upsells the read.</div></div>
</div>
<div style="display:flex;align-items:flex-start;gap:12px;padding:13px 14px;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A">
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#00D4A0;font-weight:800;width:62px;flex:none;padding-top:1px">ANALYST</span>
<div style="min-width:0"><div style="font-size:11.5px;color:#F0F0F0;font-weight:600">Full triplet + VALUE marker.</div><div style="font-size:10.5px;color:#707080;line-height:1.5;margin-top:3px">All three legs, the verdict fires both ways — value and no-edge. Quarantine renders as the primary two-leg state.</div></div>
</div>
<div style="display:flex;align-items:flex-start;gap:12px;padding:13px 14px;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A">
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#B8BCC8;font-weight:800;width:62px;flex:none;padding-top:1px">DESK</span>
<div style="min-width:0"><div style="font-size:11.5px;color:#F0F0F0;font-weight:600">Triplet + ledger cross-ref + calibration.</div><div style="font-size:10.5px;color:#707080;line-height:1.5;margin-top:3px">The price story wired to its resolved close and the confidence-bucket record behind the model leg.</div></div>
</div>
</div>
</div>
</div>
<div style="margin-top:16px;padding:13px 18px;border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px">
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#FFB347;font-weight:700">THE TRIPLET NEVER PRINTS A NUMBER IT CAN'T STAND BEHIND</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">NO FABRICATED MODEL PRICE · NO HIDDEN "NO EDGE" · FAIR IS HONEST ON EVERY ROW</span>
</div>
</div>
<!-- ============ ACT 02 · LINE SHOPPING ============ -->
<div data-reveal style="margin-top:14px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">02</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">LINE SHOPPING · MARKET BREADTH</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Seven books per prop. Best number crowned, model as the reference the books array around, disagreement as its own signal.</div></div>
</div>
<!-- movement strip primitive -->
<div id="strip" data-screen-label="Movement strip primitive" style="margin-top:44px">
<div style="display:flex;align-items:center;gap:12px;margin-bottom:14px">
<span class="mono" style="font-size:12px;letter-spacing:.28em;color:#F0F0F0;font-weight:700">MOVEMENT STRIP · PRIMITIVE</span>
<span class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#707080">DEFINED ONCE · REUSED IN BOARD ROWS · REVEALS · HUB · ARTICLES</span>
</div>
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:16px">
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:10px">ROW · 86×20 · SILENT</div>
<div style="display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none"><polyline points="0,16 18,16 18,12 40,12 40,9 62,9 62,4 86,4" fill="none" stroke="#00D4A0" stroke-width="1.5" stroke-linejoin="round" opacity=".85"></polyline><circle cx="86" cy="4" r="2.2" fill="#00D4A0"></circle></svg><span class="mono" style="font-size:9px;color:#00D4A0;font-weight:700">▲ +70.0</span></div>
<div style="font-size:10.5px;color:#707080;margin-top:10px;line-height:1.5">Steps, not curves — a line is discrete. No axes, no labels. Delta chip carries the number. Grey when the mover isn't the read's direction.</div>
</div>
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:10px">REVEAL · FULL-WIDTH · ANNOTATED</div>
<svg width="100%" height="40" viewBox="0 0 320 40" preserveAspectRatio="none" style="display:block"><polyline points="0,32 40,32 40,26 110,26 110,20 190,20 190,12 260,12 260,6 320,6" fill="none" stroke="#00D4A0" stroke-width="1.6" stroke-linejoin="round" opacity=".9"></polyline><polyline points="0,32 40,32 40,26 110,26 110,20 190,20 190,12 260,12 260,6 320,6 320,40 0,40" fill="rgba(0,212,160,.07)" stroke="none"></polyline><circle cx="110" cy="26" r="2.4" fill="#B8BCC8"></circle><circle cx="260" cy="6" r="2.8" fill="#00D4A0" style="animation:vy-livedot 1.5s ease-in-out infinite"></circle></svg>
<div style="display:flex;justify-content:space-between;margin-top:4px"><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58">OPEN</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58">EVENT DOTS = NEWS</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#00D4A0">NOW · LIVE DOT</span></div>
<div style="font-size:10.5px;color:#707080;margin-top:10px;line-height:1.5">Event dots mark the news that moved it. Terminal dot pulses only while the market is open.</div>
</div>
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:10px">LAWS</div>
<div style="font-size:10.5px;color:#707080;line-height:1.7">Green stroke only when the move favors our read — otherwise <span style="color:#B8BCC8">grey</span>.<br>Fill opacity .06–.07, never higher.<br>FLAT renders as a single hairline + "FLAT · [N]D" — a non-move is data.<br>Timestamps real or absent. Never decorative.</div>
</div>
</div>
</div>
<!-- book comparison -->
<div id="books" data-screen-label="Book comparison + push-to-book" style="margin-top:44px">
<div style="display:flex;align-items:center;gap:12px;margin-bottom:14px">
<span class="mono" style="font-size:12px;letter-spacing:.28em;color:#F0F0F0;font-weight:700">BOOK COMPARISON</span>
<span class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#707080">LIVES IN THE REVEAL · EXPANDS FROM BOARD ROWS · WORDMARK CHIPS = DESIGNED FALLBACK, LOGOS DROP IN</span>
</div>
<div style="display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start">
<div style="border-radius:16px;background:linear-gradient(180deg,#12121C,#0C0C12);border:1px solid #2A2A38;overflow:hidden;box-shadow:0 30px 60px -34px rgba(0,0,0,.9);animation:vy-arrive .7s cubic-bezier(.2,.8,.2,1) both">
<div style="padding:18px 20px 0">
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-size:10.5px;letter-spacing:.28em;color:#707080">THE MARKET · NABERS O REC YDS · SEASON</span>
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:18px;padding:0 8px;border-radius:5px;background:rgba(255,179,71,.08);border:1px solid rgba(255,179,71,.25);font-size:8.5px;letter-spacing:.14em;color:#FFB347">SPLIT · 10.0 SPREAD</span>
</div>
<!-- disagreement mark: books arrayed around the model -->
<div style="margin-top:16px;position:relative;height:44px">
<div style="position:absolute;left:0;right:0;top:20px;height:1px;background:#1E1E2A"></div>
<div style="position:absolute;left:64%;top:8px;bottom:8px;width:2px;background:#00D4A0;box-shadow:0 0 10px rgba(0,212,160,.5)"></div>
<div class="mono" style="position:absolute;left:64%;top:-4px;transform:translateX(-50%);font-size:8px;letter-spacing:.14em;color:#00D4A0;font-weight:700">VYNDR 1,188</div>
<span title="FD 1,115.5" style="position:absolute;left:6%;top:16px;width:9px;height:9px;border-radius:50%;background:#1493FF;border:2px solid #0C0C12"></span>
<span title="B365 1,118.5" style="position:absolute;left:11%;top:16px;width:9px;height:9px;border-radius:50%;background:#FFE100;border:2px solid #0C0C12"></span>
<span title="DK 1,120.5" style="position:absolute;left:15%;top:16px;width:9px;height:9px;border-radius:50%;background:#53D337;border:2px solid #0C0C12"></span>
<span title="ESPN 1,120.5" style="position:absolute;left:17.5%;top:16px;width:9px;height:9px;border-radius:50%;background:#D50A0A;border:2px solid #0C0C12"></span>
<span title="MGM 1,120.5" style="position:absolute;left:20%;top:16px;width:9px;height:9px;border-radius:50%;background:#C4A45E;border:2px solid #0C0C12"></span>
<span title="FAN 1,122.5" style="position:absolute;left:24%;top:16px;width:9px;height:9px;border-radius:50%;background:#2E6BFF;border:2px solid #0C0C12"></span>
<span title="CZR 1,125.5" style="position:absolute;left:29%;top:16px;width:9px;height:9px;border-radius:50%;background:#AD9660;border:2px solid #0C0C12"></span>
<div class="mono" style="position:absolute;left:6%;bottom:-2px;font-size:8px;letter-spacing:.1em;color:#4a4a58">1,115.5</div>
<div class="mono" style="position:absolute;left:29%;bottom:-2px;font-size:8px;letter-spacing:.1em;color:#4a4a58">1,125.5</div>
<div class="mono" style="position:absolute;right:0;bottom:-2px;font-size:8px;letter-spacing:.1em;color:#4a4a58">EVERY BOOK IS BELOW THE MODEL</div>
</div>
</div>
<div style="margin-top:16px;height:1px;background:#14141E"></div>
<div style="display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:9px 20px 7px">
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58">BOOK</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">LINE</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">ODDS</span>
<span></span>
</div>
<!-- best crowned -->
<div style="--o:1;opacity:1;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55);background:rgba(0,212,160,.04)">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:8px;color:#1493FF;flex:none">FD<image-slot id="bk-fd" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="FanDuel logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#F0F0F0;font-weight:700">FANDUEL</span><span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:rgba(0,212,160,.14);border:1px solid rgba(0,212,160,.3);font-size:7.5px;letter-spacing:.14em;color:#00D4A0;font-weight:800;white-space:nowrap">BEST NUMBER</span></span>
<span class="mono" style="justify-self:end;font-size:13px;font-weight:800;color:#00D4A0">o1,115.5</span>
<span class="mono" data-react data-fmt="odds" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:4px">-112</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#00D4A0">▸</span>
</div>
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#FFE100;flex:none">365<image-slot id="bk-365" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="bet365 logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#B8BCC8;font-weight:700">BET365</span></span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">o1,118.5</span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:600;color:#B8BCC8">-115</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#4a4a58">▸</span>
</div>
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:8px;color:#53D337;flex:none">DK<image-slot id="bk-dk" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="DraftKings logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#B8BCC8;font-weight:700">DRAFTKINGS</span></span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">o1,120.5</span>
<span class="mono" data-react data-fmt="odds" style="justify-self:end;font-size:12px;font-weight:600;color:#B8BCC8;padding:1px 4px;border-radius:4px">-110</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#4a4a58">▸</span>
</div>
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#C4A45E;flex:none">MGM<image-slot id="bk-mgm" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="BetMGM logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#B8BCC8;font-weight:700">BETMGM</span><span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:#14141E;border:1px solid #1E1E2A;font-size:7.5px;letter-spacing:.12em;color:#707080;white-space:nowrap">BEST PRICE @ 1,120.5</span></span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">o1,120.5</span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">-105</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#4a4a58">▸</span>
</div>
<div style="--o:.64;opacity:.64;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#D50A0A;flex:none">ESPN<image-slot id="bk-espn" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="ESPN BET logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#B8BCC8;font-weight:700">ESPN BET</span></span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">o1,120.5</span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:600;color:#B8BCC8">-110</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#4a4a58">▸</span>
</div>
<div style="--o:.64;opacity:.64;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#2E6BFF;flex:none">FAN<image-slot id="bk-fan" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="Fanatics logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#B8BCC8;font-weight:700">FANATICS</span></span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">o1,122.5</span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:600;color:#B8BCC8">-108</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#4a4a58">▸</span>
</div>
<div style="--o:.48;opacity:.48;display:grid;grid-template-columns:1fr 90px 70px 40px;align-items:center;gap:12px;padding:10px 20px;border-top:1px solid #101018">
<span style="display:flex;align-items:center;gap:10px"><span style="position:relative;width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#AD9660;flex:none">CZR<image-slot id="bk-czr" shape="rounded" radius="6" style="position:absolute;inset:0" placeholder="Caesars logo"></image-slot></span><span class="mono" style="font-size:11px;letter-spacing:.12em;color:#B8BCC8;font-weight:700">CAESARS</span></span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:700;color:#F0F0F0">o1,125.5</span>
<span class="mono" style="justify-self:end;font-size:12px;font-weight:600;color:#B8BCC8">-110</span>
<span class="mono" style="justify-self:end;font-size:10px;color:#4a4a58">▸</span>
</div>
<div style="padding:11px 20px;border-top:1px solid #101018;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px">
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58">LINES AS OF <span data-sync-clock style="color:#707080">--:--:--</span> ET · REFRESHED ON CHANGE, NOT ON A TIMER</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#707080">WIDE SPREAD = THE MARKET ISN'T SURE · THAT'S SIGNAL</span>
</div>
</div>
<!-- push-to-book -->
<div style="display:flex;flex-direction:column;gap:16px">
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;overflow:hidden">
<div style="display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px">
<span class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">PUSH TO BOOK</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">NJ · 7 LEGAL BOOKS</span>
</div>
<div style="height:1px;background:#14141E"></div>
<div style="padding:12px 16px">
<span class="mono" style="display:flex;align-items:center;justify-content:center;gap:8px;height:44px;border-radius:11px;background:#00D4A0;color:#06060B;font-weight:800;font-size:11px;letter-spacing:.1em">TAKE o1,115.5 AT FANDUEL · −112 ▸</span>
<div style="display:flex;gap:8px;margin-top:8px">
<span class="mono" style="flex:1;display:inline-flex;align-items:center;justify-content:center;height:36px;border-radius:9px;background:#14141E;border:1px solid #2A2A38;color:#B8BCC8;font-weight:700;font-size:9px;letter-spacing:.08em">MGM −105 ▸</span>
<span class="mono" style="flex:1;display:inline-flex;align-items:center;justify-content:center;height:36px;border-radius:9px;background:#14141E;border:1px solid #2A2A38;color:#B8BCC8;font-weight:700;font-size:9px;letter-spacing:.08em">DK −110 ▸</span>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.08em;color:#4a4a58;margin-top:10px;line-height:1.7">DEEP-LINKS OPEN THE BOOK'S SLIP PRE-FILLED. STATE-LEGAL BOOKS ONLY — GEO-GATED AT RENDER.<br>VYNDR MAY EARN A REFERRAL FEE. THE NUMBER SHOWN IS THE NUMBER YOU GET.</div>
</div>
</div>
<!-- geo-empty honest state -->
<div style="border:1px dashed #1E1E2A;border-radius:12px;padding:16px;text-align:center">
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#707080">NO LEGAL BOOKS IN YOUR STATE</div>
<div style="font-size:11.5px;color:#707080;margin-top:6px">We still show you the market — we just can't take you there. The read is yours either way.</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:6px">GEO-EMPTY STATE · BUTTONS NEVER RENDER DISABLED — THEY DON'T RENDER</div>
</div>
<!-- mobile expand pattern -->
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:10px">390 PATTERN · EXPANDS FROM BOARD ROW</div>
<div style="border-radius:10px;border:1px solid #1E1E2A;overflow:hidden">
<div style="display:flex;align-items:center;gap:10px;padding:10px 12px;background:#0A0A10">
<div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:700">Nabers <span style="color:#B8BCC8;font-weight:500">o Rec Yds</span></div></div>
<span class="mono" style="font-size:9px;color:#00D4A0;font-weight:700">7 BOOKS ▾</span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-top:1px solid #101018;background:rgba(0,212,160,.04)"><span class="mono" style="font-size:9.5px;letter-spacing:.1em;color:#F0F0F0;font-weight:700"><span style="color:#1493FF">FD</span> 1,115.5 −112</span><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#00D4A0;font-weight:800">BEST ▸</span></div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-top:1px solid #101018;opacity:.75"><span class="mono" style="font-size:9.5px;letter-spacing:.1em;color:#B8BCC8"><span style="color:#C4A45E">MGM</span> 1,120.5 −105</span><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">▸</span></div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-top:1px solid #101018;opacity:.6"><span class="mono" style="font-size:9.5px;letter-spacing:.1em;color:#B8BCC8"><span style="color:#53D337">DK</span> 1,120.5 −110</span><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58">▸</span></div>
</div>
<div style="font-size:10px;color:#707080;margin-top:8px;line-height:1.5">Row rail: 44px min tap targets, best row tinted. Full sheet on tap-through.</div>
</div>
</div>
</div>
</div>
<!-- ============ ACT 02 · ARTICLE MEDIA ============ -->
<div data-reveal style="margin-top:110px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">03</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">ARTICLE MEDIA SYSTEM</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Our own generated visuals — data graphics in the system language, never stock photography.</div></div>
</div>
<div id="articles" data-screen-label="Article hero + figures" style="margin-top:44px">
<div style="display:flex;align-items:center;gap:12px;margin-bottom:14px">
<span class="mono" style="font-size:12px;letter-spacing:.28em;color:#F0F0F0;font-weight:700">HERO TEMPLATE + 4 HERO GRAPHIC ARCHETYPES</span>
</div>
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;overflow:hidden;padding:26px 28px">
<div style="display:flex;align-items:center;gap:8px;flex-wrap:wrap">
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:8.5px;letter-spacing:.14em;color:#B8BCC8">LINE MOVEMENT</span>
<span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:8.5px;letter-spacing:.14em;color:#B8BCC8">NFL</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#4a4a58;margin-left:auto">JUL 17, 2026 · 6 MIN READ · THE DESK</span>
</div>
<h2 style="font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-top:14px;max-width:720px">The market repriced Nabers' clearance in an hour. It kept the injury discount anyway.</h2>
<!-- hero graphic: line path archetype -->
<div style="margin-top:20px;border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:20px 22px">
<svg width="100%" height="120" viewBox="0 0 900 120" preserveAspectRatio="none" style="display:block">
<line x1="0" y1="100" x2="900" y2="100" stroke="#1E1E2A" stroke-width="1"></line>
<polyline points="0,92 90,92 90,80 260,80 260,64 470,64 470,42 720,42 720,22 900,22" fill="none" stroke="#00D4A0" stroke-width="2.2" stroke-linejoin="round"></polyline>
<polyline points="0,92 90,92 90,80 260,80 260,64 470,64 470,42 720,42 720,22 900,22 900,120 0,120" fill="rgba(0,212,160,.06)" stroke="none"></polyline>
<line x1="900" y1="8" x2="900" y2="112" stroke="#00D4A0" stroke-width="1" opacity=".3"></line>
<circle cx="90" cy="80" r="3.5" fill="#B8BCC8"></circle>
<circle cx="470" cy="42" r="3.5" fill="#B8BCC8"></circle>
<circle cx="720" cy="22" r="4.5" fill="#00D4A0"></circle>
</svg>
<div style="display:flex;align-items:center;justify-content:space-between;margin-top:8px">
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#4a4a58">OPEN 1,050.5 · MAR 4</span>
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#707080">FA · DRAFT · <span style="color:#00D4A0">CLEARED JUL 16</span></span>
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#F0F0F0;font-weight:700">NOW 1,120.5 · <span style="color:#00D4A0">VYNDR 1,188</span></span>
</div>
</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;margin-top:10px">HERO ARCHETYPE A · LINE PATH — FOR MOVEMENT PIECES. GENERATED FROM LIVE DATA AT PUBLISH; RE-RENDERS ON REPRICE.</div>
</div>
<!-- other 3 hero archetypes -->
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px">
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px">
<div style="height:110px;border-radius:9px;background:#0A0A10;border:1px solid #14141E;display:flex;align-items:flex-end;gap:10px;padding:14px 18px 12px">
<div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:5px"><div style="width:100%;height:64px;background:rgba(0,212,160,.55);border-radius:3px 3px 0 0"></div><span class="mono" style="font-size:8px;color:#00D4A0;font-weight:700">A · 71%</span></div>
<div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:5px"><div style="width:100%;height:46px;background:#B8BCC8;opacity:.75;border-radius:3px 3px 0 0"></div><span class="mono" style="font-size:8px;color:#B8BCC8">B · 62%</span></div>
<div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:5px"><div style="width:100%;height:34px;background:#707080;opacity:.7;border-radius:3px 3px 0 0"></div><span class="mono" style="font-size:8px;color:#707080">C · 55%</span></div>
<div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:5px"><div style="width:100%;height:18px;background:rgba(255,71,87,.6);border-radius:3px 3px 0 0"></div><span class="mono" style="font-size:8px;color:#FF4757">D · 41%</span></div>
</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;margin-top:10px;line-height:1.6">HERO B · DISTRIBUTION — RECORD &amp; CALIBRATION PIECES. REAL SETTLED RATES ONLY.</div>
</div>
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px">
<div style="height:110px;border-radius:9px;background:#0A0A10;border:1px solid #14141E;display:flex;align-items:center;justify-content:center;gap:16px">
<svg width="72" height="72" viewBox="0 0 24 24" fill="none" style="color:#D9A441"><path fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" d="M5 19 16 6"></path><circle cx="17" cy="5" r="1.9" fill="currentColor"></circle><path fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" d="M5 9c2-2 5-2 7 0M4 13c2.5-2.5 6-2.5 9 0"></path></svg>
<div><div class="mono" style="font-size:14px;font-weight:800;letter-spacing:.2em;color:#D9A441">MAESTRO</div><div class="mono" style="font-size:8px;letter-spacing:.14em;color:#4a4a58;margin-top:4px">ARCHETYPE MARK AT HERO SCALE</div></div>
</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;margin-top:10px;line-height:1.6">HERO C · MARK AT SCALE — ARCHETYPE &amp; PLAYER-IDENTITY PIECES. 83 MARKS, NEVER NEW ONES.</div>
</div>
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px">
<div style="height:110px;border-radius:9px;background:#0A0A10;border:1px solid #14141E;display:flex;align-items:center;justify-content:center;gap:14px">
<span style="width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#0B2265,#5a7fd4);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:11px;color:#cdd9ff">NYG</span>
<div style="text-align:center"><div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080">REC YDS</div><div class="mono" style="font-size:17px;font-weight:800;color:#F0F0F0;margin-top:2px">1,120.5</div><div class="mono" style="font-size:8px;letter-spacing:.14em;color:#00D4A0;margin-top:2px">VYNDR 1,188 · A+</div></div>
<span style="width:40px;height:40px;border-radius:10px;background:#14141E;border:1px solid #2A2A38;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#B8BCC8">O/U</span>
</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;margin-top:10px;line-height:1.6">HERO D · MATCHUP CARD — SINGLE-READ PIECES. CHIPS + MARKET + GRADE.</div>
</div>
</div>
<!-- inline figures + article card -->
<div style="display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;margin-top:16px;align-items:start">
<div style="min-width:0;border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:22px 24px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:14px">INLINE FIGURE STYLES · IN-ARTICLE</div>
<p style="font-size:14px;line-height:1.7;color:#B8BCC8;max-width:560px">The clearance hit the wire at 11:42 AM. Within the hour, <span class="mono" style="display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 7px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:10px;color:#B8BCC8;vertical-align:-3px"><span style="width:8px;height:8px;border-radius:2px;background:linear-gradient(135deg,#0B2265,#5a7fd4)"></span>NYG</span> receiving markets moved as a block — but only <span class="mono" style="color:#F0F0F0">70</span> of the roughly <span class="mono" style="color:#F0F0F0">140</span> yards our sim says the discount was worth.</p>
<!-- stat callout -->
<div style="display:flex;gap:1px;background:#1E1E2A;border:1px solid #1E1E2A;border-radius:10px;overflow:hidden;margin:16px 0;max-width:560px">
<div style="flex:1;background:#0A0A10;padding:12px 14px"><div class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#707080;margin-bottom:5px">MARKET MOVED</div><div class="mono" style="font-size:19px;font-weight:800;color:#F0F0F0">+70.0</div></div>
<div style="flex:1;background:#0A0A10;padding:12px 14px"><div class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#00D4A0;margin-bottom:5px">MODEL SAYS</div><div class="mono" style="font-size:19px;font-weight:800;color:#00D4A0">+137.5</div></div>
<div style="flex:1;background:#0A0A10;padding:12px 14px"><div class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#707080;margin-bottom:5px">LEFT ON TABLE</div><div class="mono" style="font-size:19px;font-weight:800;color:#F0F0F0">67.5</div></div>
</div>
<!-- comparison bars -->
<div style="max-width:560px;margin-bottom:16px">
<div style="display:flex;align-items:center;gap:10px;padding:5px 0"><span class="mono" style="font-size:9px;letter-spacing:.1em;color:#707080;width:110px;flex:none">TGT SHARE '24</span><div style="flex:1;height:10px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:82%;height:100%;background:#B8BCC8;opacity:.7"></div></div><span class="mono" style="font-size:9.5px;color:#B8BCC8;width:40px;text-align:right">28%</span></div>
<div style="display:flex;align-items:center;gap:10px;padding:5px 0"><span class="mono" style="font-size:9px;letter-spacing:.1em;color:#707080;width:110px;flex:none">MARKET IMPLIES</span><div style="flex:1;height:10px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:68%;height:100%;background:#707080;opacity:.8"></div></div><span class="mono" style="font-size:9.5px;color:#707080;width:40px;text-align:right">23%</span></div>
<div style="display:flex;align-items:center;gap:10px;padding:5px 0"><span class="mono" style="font-size:9px;letter-spacing:.1em;color:#00D4A0;width:110px;flex:none">VYNDR SIM</span><div style="flex:1;height:10px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:79%;height:100%;background:#00D4A0"></div></div><span class="mono" style="font-size:9.5px;color:#00D4A0;width:40px;text-align:right;font-weight:700">27%</span></div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:6px">FIG 2 · TARGET SHARE, SETTLED VS IMPLIED VS SIM · DATA AS OF JUL 17</div>
</div>
<!-- pull quote -->
<div style="border-left:2px solid #00D4A0;padding:4px 0 4px 18px;margin:16px 0;max-width:560px">
<div style="font-size:17px;font-weight:600;line-height:1.45;color:#F0F0F0">The market prices the memory of the injury. The model prices the leg.</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#4a4a58;margin-top:6px">PULL QUOTE — ONE PER ARTICLE, MAXIMUM</div>
</div>
<p style="font-size:14px;line-height:1.7;color:#B8BCC8;max-width:560px">Caption style sits under every figure: mono 8px, tracking .12em, <span class="mono" style="color:#707080">#4a4a58</span>, always carrying the data-source line. If a figure can't name its data, it doesn't ship.</p>
</div>
<div style="min-width:0;display:flex;flex-direction:column;gap:16px">
<!-- article card -->
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;overflow:hidden">
<div style="padding:14px 16px 0"><span class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080">ARTICLE CARD · /BLOG + HUB FEEDS</span></div>
<div style="margin:12px 16px;border-radius:10px;border:1px solid #1E1E2A;overflow:hidden">
<div style="height:92px;background:#0A0A10;border-bottom:1px solid #14141E;display:flex;align-items:center;justify-content:center;padding:0 18px">
<svg width="100%" height="52" viewBox="0 0 300 52" preserveAspectRatio="none"><polyline points="0,42 34,42 34,35 90,35 90,27 160,27 160,17 240,17 240,9 300,9" fill="none" stroke="#00D4A0" stroke-width="1.8" stroke-linejoin="round"></polyline><circle cx="240" cy="9" r="3" fill="#00D4A0"></circle></svg>
</div>
<div style="padding:12px 14px">
<div style="display:flex;align-items:center;gap:6px"><span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:#14141E;border:1px solid #1E1E2A;font-size:7.5px;letter-spacing:.12em;color:#B8BCC8">LINE MOVEMENT</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58">JUL 17 · 6 MIN</span></div>
<div style="font-size:13.5px;font-weight:700;line-height:1.35;margin-top:7px">The market repriced Nabers' clearance in an hour. It kept the injury discount anyway.</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#00D4A0;margin-top:8px">READ ▸</div>
</div>
</div>
<div style="padding:0 16px 14px"><div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;line-height:1.6">THUMB = THE HERO GRAPHIC, RE-CROPPED. NEVER A SEPARATE ASSET.</div></div>
</div>
<!-- article OG billboard 1200x630 @ .5 -->
<div>
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:8px">ARTICLE OG · 1200×630 · SHOWN AT 50%</div>
<div data-billboard="article-og" style="width:100%;max-width:600px;aspect-ratio:600/315;background:#06060B;border:1px solid #1E1E2A;border-radius:4px;overflow:hidden;position:relative;padding:28px 30px;display:flex;flex-direction:column">
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-weight:800;font-size:13px;letter-spacing:.26em">VYND<span style="color:#00D4A0">R</span></span>
<span class="mono" style="font-size:8px;letter-spacing:.18em;color:#707080">VYNDR.APP/BLOG · JUL 17</span>
</div>
<div style="flex:1;display:flex;align-items:center;gap:22px">
<div style="flex:1.2"><div class="mono" style="font-size:8px;letter-spacing:.2em;color:#00D4A0;margin-bottom:8px">LINE MOVEMENT · NFL</div><div style="font-size:20px;font-weight:800;line-height:1.2;letter-spacing:-.01em">The market kept the injury discount anyway.</div></div>
<div style="flex:1"><svg width="100%" height="80" viewBox="0 0 240 80" preserveAspectRatio="none"><line x1="0" y1="66" x2="240" y2="66" stroke="#1E1E2A" stroke-width="1"></line><polyline points="0,60 26,60 26,50 72,50 72,40 128,40 128,26 192,26 192,14 240,14" fill="none" stroke="#00D4A0" stroke-width="2" stroke-linejoin="round"></polyline><circle cx="192" cy="14" r="3.4" fill="#00D4A0"></circle></svg><div style="display:flex;justify-content:space-between;margin-top:4px"><span class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58">1,050.5</span><span class="mono" style="font-size:7px;letter-spacing:.1em;color:#00D4A0">1,120.5 · V 1,188</span></div></div>
</div>
<div class="mono" style="font-size:7.5px;letter-spacing:.16em;color:#4a4a58">THE READ IS FREE · THE RECORD IS PUBLIC</div>
</div>
</div>
</div>
</div>
</div>
<!-- ============ ACT 03 · CLV & CALIBRATION ============ -->
<div data-reveal style="margin-top:110px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">04</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">CLV &amp; CALIBRATION</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Honesty made visible. Nobody else shows this — it's the ledger differentiator, rendered.</div></div>
</div>
<div id="clv" data-screen-label="CLV chips + ledger + calibration" style="margin-top:44px;display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start">
<div style="display:flex;flex-direction:column;gap:16px">
<!-- settled rows with CLV chip -->
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;overflow:hidden">
<div style="display:flex;align-items:center;justify-content:space-between;padding:15px 16px 13px">
<span class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">LEDGER · SETTLED · PER-READ CLV</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">LOCKED NUMBER VS CLOSE</span>
</div>
<div style="height:1px;background:#14141E"></div>
<div style="--o:1;opacity:1;display:flex;align-items:center;gap:12px;padding:11px 16px;border-top:1px solid #101018">
<div style="flex:1;min-width:0"><div style="font-size:13px;font-weight:700">Jokić <span style="color:#B8BCC8;font-weight:500">o27.5 PTS</span> <span class="mono" style="font-size:9px;color:#00D4A0;font-weight:700">HIT · 34</span></div><div class="mono" style="font-size:8.5px;letter-spacing:.1em;color:#707080;margin-top:3px">GRADED 10:47 PM · LOCKED 27.5 −114 · CLOSED 29.5 −120</div></div>
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:20px;padding:0 9px;border-radius:6px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:9px;letter-spacing:.1em;color:#00D4A0;font-weight:800;flex:none">BEAT CLOSE +2.0</span>
</div>
<div style="--o:.86;opacity:.86;display:flex;align-items:center;gap:12px;padding:11px 16px;border-top:1px solid #101018">
<div style="flex:1;min-width:0"><div style="font-size:13px;font-weight:600">Skenes <span style="color:#B8BCC8;font-weight:500">o6.5 K</span> <span class="mono" style="font-size:9px;color:#FF4757;font-weight:700">MISS · 6</span></div><div class="mono" style="font-size:8.5px;letter-spacing:.1em;color:#707080;margin-top:3px">GRADED 9:58 PM · LOCKED 6.5 −118 · CLOSED 7.5 −105</div></div>
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:20px;padding:0 9px;border-radius:6px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:9px;letter-spacing:.1em;color:#00D4A0;font-weight:800;flex:none">BEAT CLOSE +1.0</span>
</div>
<div style="--o:.7;opacity:.7;display:flex;align-items:center;gap:12px;padding:11px 16px;border-top:1px solid #101018">
<div style="flex:1;min-width:0"><div style="font-size:13px;font-weight:600">Brunson <span style="color:#B8BCC8;font-weight:500">o24.5 PTS</span> <span class="mono" style="font-size:9px;color:#00D4A0;font-weight:700">HIT · 27</span></div><div class="mono" style="font-size:8.5px;letter-spacing:.1em;color:#707080;margin-top:3px">GRADED 10:31 PM · LOCKED 24.5 −110 · CLOSED 23.5 −112</div></div>
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:20px;padding:0 9px;border-radius:6px;background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.25);font-size:9px;letter-spacing:.1em;color:#FF4757;font-weight:800;flex:none">MISSED CLOSE −1.0</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#4a4a58">CLV IS INDEPENDENT OF HIT/MISS — A WIN THAT MISSED CLOSE IS STILL A PROCESS FLAG. CHIP COLOR FOLLOWS CLV SIGN, NEVER THE RESULT.</span></div>
</div>
<!-- aggregate + no-data -->
<div style="display:grid;grid-template-columns:1fr 1fr;gap:16px">
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:12px">AGGREGATE · JOINS THE RECORD LINE</div>
<div style="display:flex;align-items:baseline;gap:14px;flex-wrap:wrap">
<span class="mono" style="font-size:22px;font-weight:800;color:#F0F0F0">184–121</span>
<span class="mono" style="font-size:13px;font-weight:700;color:#00D4A0">+31.4u</span>
<span class="mono" style="font-size:13px;font-weight:800;color:#00D4A0">BEAT CLOSE 61%</span>
<span class="mono" data-react data-fmt="edge" style="font-size:13px;font-weight:700;color:#00D4A0;padding:1px 4px;border-radius:4px">AVG CLV +2.4%</span>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:10px">SETTLED READS ONLY · N=305 · SINCE JUL 1 2026</div>
</div>
<div style="border:1px dashed #1E1E2A;border-radius:12px;padding:16px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:10px">NO-DATA STATE</div>
<div style="font-size:12px;color:#B8BCC8;line-height:1.55">CLV tracking began <span class="mono" style="color:#F0F0F0">Jul 1, 2026</span>. Beat-close % publishes at <span class="mono" style="color:#F0F0F0">N ≥ 100</span> settled reads — <span class="mono" style="color:#F0F0F0">305</span> and counting.</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:10px">NEVER A FAKE 0% · NEVER AN EMPTY GAUGE</div>
</div>
</div>
</div>
<!-- calibration curve -->
<div style="border-radius:16px;background:linear-gradient(180deg,#12121C,#0C0C12);border:1px solid #2A2A38;padding:22px 24px;animation:vy-arrive .7s cubic-bezier(.2,.8,.2,1) both">
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:6px">
<span class="mono" style="font-size:10.5px;letter-spacing:.28em;color:#707080">CALIBRATION · /u/VYNDR</span>
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#00D4A0">PUBLIC</span>
</div>
<div style="font-size:17px;font-weight:700;line-height:1.35;margin-bottom:16px">When we say 70%, it hits <span class="mono" style="color:#00D4A0">68.2%</span>.</div>
<svg width="100%" height="210" viewBox="0 0 340 210" style="display:block">
<line x1="40" y1="10" x2="40" y2="180" stroke="#1E1E2A" stroke-width="1"></line>
<line x1="40" y1="180" x2="330" y2="180" stroke="#1E1E2A" stroke-width="1"></line>
<line x1="40" y1="180" x2="330" y2="10" stroke="#2A2A38" stroke-width="1" stroke-dasharray="3 4"></line>
<text x="335" y="14" fill="#4a4a58" font-family="JetBrains Mono" font-size="7" text-anchor="end">PERFECT</text>
<circle cx="98" cy="130" r="5" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.5"></circle>
<circle cx="156" cy="103" r="7" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.5"></circle>
<circle cx="214" cy="72" r="9" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.5"></circle>
<circle cx="272" cy="52" r="6" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.5"></circle>
<circle cx="310" cy="34" r="4" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.5"></circle>
<text x="98" y="196" fill="#707080" font-family="JetBrains Mono" font-size="8" text-anchor="middle">55%</text>
<text x="156" y="196" fill="#707080" font-family="JetBrains Mono" font-size="8" text-anchor="middle">60%</text>
<text x="214" y="196" fill="#F0F0F0" font-family="JetBrains Mono" font-size="8" text-anchor="middle" font-weight="700">70%</text>
<text x="272" y="196" fill="#707080" font-family="JetBrains Mono" font-size="8" text-anchor="middle">75%</text>
<text x="310" y="196" fill="#707080" font-family="JetBrains Mono" font-size="8" text-anchor="middle">80%</text>
<text x="214" y="60" fill="#00D4A0" font-family="JetBrains Mono" font-size="8" text-anchor="middle" font-weight="700">68.2% · N 412</text>
<text x="34" y="14" fill="#4a4a58" font-family="JetBrains Mono" font-size="7" text-anchor="end">HIT</text>
</svg>
<div style="display:flex;align-items:center;justify-content:space-between;margin-top:8px">
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58">DOT SIZE = SAMPLE · STATED CONFIDENCE →</span>
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58">N 1,214 SETTLED · SINCE JUL 2026</span>
</div>
<div style="margin-top:14px;padding-top:12px;border-top:1px solid #1E1E2A;font-size:11.5px;color:#B8BCC8;line-height:1.55">Dots on the dashed line mean our stated confidence matches reality. Above it, we're underselling; below it, overselling. Buckets under 30 samples render hollow and unlabeled — we don't grade what we can't see.</div>
</div>
</div>
<!-- ============ ACT 04 · THE VYNDR REPORT ============ -->
<div data-reveal style="margin-top:110px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">05</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">THE VYNDR REPORT</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Hybrid: dark billboard header that survives every client, light paper body Gmail can't wreck. 600px, stacked, no webfont dependence.</div></div>
</div>
<div id="report" data-screen-label="Newsletter · signup + issue + archive" style="margin-top:44px;display:grid;grid-template-columns:minmax(0,600px) minmax(0,1fr);gap:24px;align-items:start">
<!-- issue template -->
<div>
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:8px">ISSUE TEMPLATE · 600PX · EMAIL-SAFE STACK</div>
<div style="width:600px;max-width:100%;background:#F7F6F2;border-radius:4px;overflow:hidden;border:1px solid #2A2A38">
<!-- dark billboard header -->
<div style="background:#06060B;padding:26px 32px;display:flex;align-items:center;justify-content:space-between">
<div style="display:flex;align-items:center;gap:12px">
<svg width="26" height="26" viewBox="0 0 32 32" fill="none"><rect x="1" y="1" width="30" height="30" rx="7" fill="#0E0E14" stroke="#2A2A38" stroke-width="1"></rect><path d="M8 9 L16 24 L24 9" fill="none" stroke="#F0F0F0" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"></path><path d="M16 24 L24 9" fill="none" stroke="#00D4A0" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"></path><circle cx="24" cy="9" r="2" fill="#00D4A0"></circle></svg>
<div><span class="mono" style="font-weight:800;font-size:14px;letter-spacing:.26em;color:#F0F0F0">VYND<span style="color:#00D4A0">R</span></span><div class="mono" style="font-size:8px;letter-spacing:.24em;color:#707080;margin-top:3px">THE REPORT · Nº 128</div></div>
</div>
<div class="mono" style="text-align:right;font-size:8.5px;letter-spacing:.14em;color:#707080">FRI · JUL 17, 2026<br><span style="color:#00D4A0">READ TIME 3 MIN</span></div>
</div>
<!-- light body -->
<div style="padding:26px 32px;color:#1A1A22;font-family:'Inter',Arial,sans-serif">
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#6B6B76;margin-bottom:8px">TOP READ OF THE DAY</div>
<div style="border:1px solid #E3E1D8;border-radius:10px;padding:16px 18px;background:#FFFFFF">
<div style="display:flex;align-items:center;gap:12px">
<span class="mono" style="font-size:26px;font-weight:800;color:#00A57D;flex:none">A+</span>
<div style="flex:1"><div style="font-size:14.5px;font-weight:700;color:#1A1A22">Nabers Over 1,120.5 Rec Yds <span style="color:#6B6B76;font-weight:500">· season</span></div><div class="mono" style="font-size:9px;letter-spacing:.08em;color:#6B6B76;margin-top:3px">O 1,050.5 → 1,120.5 · VYNDR 1,188 · BEST: FD 1,115.5</div></div>
</div>
<div style="font-size:12px;line-height:1.6;color:#44444E;margin-top:10px">The market repriced the clearance in an hour — and kept the injury discount anyway. Our sim says the number is 68 yards light.</div>
<div class="mono" style="font-size:9px;letter-spacing:.14em;color:#00A57D;font-weight:800;margin-top:10px">READ THE FULL READ ▸</div>
</div>
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#6B6B76;margin:20px 0 8px">WHAT CHANGED</div>
<div style="border-top:1px solid #E3E1D8;padding:9px 2px;display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:8px;color:#9A9AA4;flex:none;width:52px">11:42 AM</span><span style="font-size:12px;color:#1A1A22;flex:1">Nabers cleared — NYG rec yds 1,050.5 → 1,120.5</span></div>
<div style="border-top:1px solid #E3E1D8;padding:9px 2px;display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:8px;color:#9A9AA4;flex:none;width:52px">10:15 AM</span><span style="font-size:12px;color:#1A1A22;flex:1">Worthy WR1 reps — KC rec yds up 34.0</span></div>
<div style="border-top:1px solid #E3E1D8;padding:9px 2px;display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:8px;color:#9A9AA4;flex:none;width:52px">9:30 AM</span><span style="font-size:12px;color:#1A1A22;flex:1">Higgins restructure — Burrow pass TD 27.5 → 28.5</span></div>
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#6B6B76;margin:20px 0 8px">THE RECORD</div>
<div style="background:#0E0E14;border-radius:10px;padding:14px 18px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap">
<span class="mono" style="font-size:16px;font-weight:800;color:#F0F0F0">184–121</span>
<span class="mono" style="font-size:11px;font-weight:700;color:#00D4A0">+31.4u</span>
<span class="mono" style="font-size:11px;font-weight:700;color:#00D4A0">BEAT CLOSE 61%</span>
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#707080;margin-left:auto">SETTLED · TIMESTAMPED</span>
</div>
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#6B6B76;margin:20px 0 8px">ONE ARTICLE</div>
<div style="border:1px solid #E3E1D8;border-radius:10px;padding:14px 18px;background:#FFFFFF">
<div style="font-size:13px;font-weight:700;color:#1A1A22;line-height:1.4">The market prices the memory of the injury. The model prices the leg.</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#9A9AA4;margin-top:6px">LINE MOVEMENT · 6 MIN · <span style="color:#00A57D;font-weight:800">READ ▸</span></div>
</div>
<div style="margin-top:22px;padding-top:14px;border-top:1px solid #E3E1D8;display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px">
<span class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#9A9AA4">VYNDR · THE READ IS FREE · THE RECORD IS PUBLIC</span>
<span class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#9A9AA4">UNSUBSCRIBE · ONE TAP, NO GUILT</span>
</div>
</div>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:10px;line-height:1.7">EMAIL LAWS · SINGLE COLUMN · SYSTEM FONT FALLBACKS (COURIER FOR MONO, ARIAL FOR UI) · GREEN SHIFTS TO #00A57D ON PAPER FOR CONTRAST · HEADER + RECORD BAND STAY DARK (RENDER AS-IS IN EVERY CLIENT) · NO IMAGES REQUIRED TO READ</div>
</div>
<div style="display:flex;flex-direction:column;gap:16px">
<!-- signup module -->
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:18px">
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:10px">SIGNUP MODULE · LANDING / HUB / ARTICLE FOOTER</div>
<div class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">THE VYNDR REPORT</div>
<div style="font-size:12px;color:#B8BCC8;margin-top:5px;line-height:1.5">One email per slate day. Top read, what changed, the record. Nothing else.</div>
<div style="display:flex;gap:8px;margin-top:12px">
<span class="mono" style="flex:1;display:flex;align-items:center;height:38px;padding:0 12px;border-radius:9px;background:#0A0A10;border:1px solid #2A2A38;color:#4a4a58;font-size:10px">you@…</span>
<span class="mono" style="display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:9px;background:#00D4A0;color:#06060B;font-weight:800;font-size:9.5px;letter-spacing:.14em;flex:none">SUBSCRIBE</span>
</div>
<div class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#4a4a58;margin-top:8px">12,408 READERS · NO SPAM, NO "LOCKS," NO CAPS-LOCK PICKS</div>
</div>
<!-- archive -->
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;overflow:hidden">
<div style="display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px">
<span class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">/REPORT · ARCHIVE</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">128 ISSUES</span>
</div>
<div style="height:1px;background:#14141E"></div>
<div style="--o:1;opacity:1;padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:8px;color:#4a4a58;width:56px;flex:none">Nº 128<br>JUL 17</span><div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:700">The clearance the market half-priced</div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">TOP READ · NABERS A+ · DAY RECORD 9–4</div></div><span class="mono" style="font-size:9px;color:#00D4A0">▸</span></div>
<div style="--o:.86;opacity:.86;padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:8px;color:#4a4a58;width:56px;flex:none">Nº 127<br>JUL 16</span><div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:600">Nine slates, one under lean</div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">TOP READ · SKENES A · DAY RECORD 7–5</div></div><span class="mono" style="font-size:9px;color:#4a4a58">▸</span></div>
<div style="--o:.64;opacity:.64;padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:8px;color:#4a4a58;width:56px;flex:none">Nº 126<br>JUL 15</span><div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:600">Tag deadline day, read cold</div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">TOP READ · WEMBY MVP A · DAY RECORD 8–6</div></div><span class="mono" style="font-size:9px;color:#4a4a58">▸</span></div>
<div style="padding:11px 16px;border-top:1px solid #101018"><span class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58">EVERY ISSUE SHOWS ITS OWN DAY RECORD — THE ARCHIVE IS A LEDGER TOO</span></div>
</div>
</div>
</div>
<!-- ============ ACT 05 · M2 BILLBOARD CROPS ============ -->
<div data-reveal style="margin-top:110px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">M2</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">BILLBOARD CROPS</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Square, story (recomposed, safe zones), X card — plus the new record billboard type. All shown at 50%; export at 2×.</div></div>
</div>
<div id="billboards" data-screen-label="M2 billboard crops" style="margin-top:44px;display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start">
<!-- square 1080x1080 -->
<div>
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:8px">SQUARE · 1080×1080 · FEED</div>
<div data-billboard="square" style="width:400px;height:400px;background:radial-gradient(500px 320px at 70% -10%,rgba(0,212,160,.08),transparent 60%),#06060B;border:1px solid #1E1E2A;position:relative;overflow:hidden;padding:26px 28px;display:flex;flex-direction:column">
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-weight:800;font-size:12px;letter-spacing:.26em;color:#F0F0F0">VYND<span style="color:#00D4A0">R</span></span>
<span class="mono" style="font-size:8px;letter-spacing:.16em;color:#707080">SETTLED · JUL 17</span>
</div>
<div style="flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center">
<div class="mono" style="font-size:104px;line-height:.82;font-weight:800;color:#00D4A0;text-shadow:0 0 44px rgba(0,212,160,.5)">A+</div>
<div style="font-size:16px;font-weight:700;margin-top:18px">Jokić Over 27.5 Points</div>
<div class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080;margin-top:6px"><span style="display:inline-block;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#0E4DA4,#4C8BF5);vertical-align:-1px;margin-right:3px"></span>DEN @ <span style="display:inline-block;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#0C2340,#236192);vertical-align:-1px;margin-right:3px"></span>MIN · <span style="color:#00D4A0;font-weight:700">HIT · 34</span></div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-size:8px;letter-spacing:.14em;color:#4a4a58">GRADED 10:47 PM · CLV +2.0</span>
<span class="mono" style="font-size:8px;letter-spacing:.14em;color:#707080">VYNDR.APP</span>
</div>
</div>
</div>
<!-- story 1080x1920 -->
<div>
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:8px">STORY · 1080×1920 · RECOMPOSED, NOT CROPPED</div>
<div data-billboard="story" style="width:270px;height:480px;background:radial-gradient(400px 500px at 60% -6%,rgba(0,212,160,.09),transparent 60%),#06060B;border:1px solid #1E1E2A;position:relative;overflow:hidden;padding:0;display:flex;flex-direction:column">
<div data-safezone style="height:54px;flex:none;border-bottom:1px dashed rgba(255,71,87,.25);display:flex;align-items:center;justify-content:center"><span class="mono" style="font-size:6.5px;letter-spacing:.18em;color:rgba(255,71,87,.5)">PLATFORM UI SAFE ZONE · 108PX</span></div>
<div style="flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 24px;text-align:center">
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.26em;color:#F0F0F0">VYND<span style="color:#00D4A0">R</span></span>
<div class="mono" style="font-size:120px;line-height:.82;font-weight:800;color:#00D4A0;text-shadow:0 0 50px rgba(0,212,160,.5);margin-top:28px">A+</div>
<div style="font-size:15px;font-weight:700;margin-top:22px;line-height:1.3">Jokić Over 27.5 Points</div>
<div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#707080;margin-top:7px">DEN @ MIN · <span style="color:#00D4A0;font-weight:700">HIT · 34</span></div>
<div style="display:flex;align-items:center;gap:4px;margin-top:22px">
<span style="width:11px;height:11px;border-radius:3px;background:#00D4A0"></span><span style="width:11px;height:11px;border-radius:3px;background:#00D4A0"></span><span style="width:11px;height:11px;border-radius:3px;background:#FF4757"></span><span style="width:11px;height:11px;border-radius:3px;background:#00D4A0"></span><span style="width:11px;height:11px;border-radius:3px;background:#00D4A0"></span><span style="width:11px;height:11px;border-radius:3px;background:#00D4A0"></span><span style="width:11px;height:11px;border-radius:3px;background:#00D4A0"></span>
</div>
<div class="mono" style="font-size:7.5px;letter-spacing:.16em;color:#4a4a58;margin-top:8px">LAST 7 · GRADED 10:47 PM</div>
</div>
<div data-safezone style="height:66px;flex:none;border-top:1px dashed rgba(255,71,87,.25);display:flex;align-items:center;justify-content:center"><span class="mono" style="font-size:6.5px;letter-spacing:.18em;color:rgba(255,71,87,.5)">SAFE ZONE · 132PX · CTA LIVES ABOVE</span></div>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:8px;max-width:270px;line-height:1.6">HERO LETTER SCALES UP · DOT STRIP REPLACES TABLE · DASHED ZONES ARE DESIGN-TIME ONLY, STRIPPED ON EXPORT</div>
</div>
<!-- X card 1200x675 -->
<div>
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:8px">X CARD · 1200×675</div>
<div data-billboard="xcard" style="width:480px;height:270px;background:radial-gradient(500px 300px at 75% -10%,rgba(0,212,160,.08),transparent 60%),#06060B;border:1px solid #1E1E2A;position:relative;overflow:hidden;padding:22px 26px;display:flex;flex-direction:column">
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.26em;color:#F0F0F0">VYND<span style="color:#00D4A0">R</span></span>
<span class="mono" style="font-size:7.5px;letter-spacing:.16em;color:#707080">TOP GRADE TONIGHT</span>
</div>
<div style="flex:1;display:flex;align-items:center;gap:22px">
<div class="mono" style="font-size:74px;line-height:.82;font-weight:800;color:#00D4A0;text-shadow:0 0 34px rgba(0,212,160,.5);flex:none">A+</div>
<div style="flex:1;min-width:0">
<div style="font-size:15px;font-weight:700">Jokić Over 27.5 Points</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#707080;margin-top:5px">DEN @ MIN · OPENED 25.5 · EDGE +8.4%</div>
<svg width="100%" height="26" viewBox="0 0 220 26" preserveAspectRatio="none" style="display:block;margin-top:10px"><polyline points="0,20 30,20 55,18 80,19 105,13 130,12 155,7 185,6 214,3" fill="none" stroke="#00D4A0" stroke-width="1.5" stroke-linejoin="round" opacity=".9"></polyline><circle cx="214" cy="3" r="2.4" fill="#00D4A0"></circle></svg>
</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#4a4a58">THE READ IS FREE · THE RECORD IS PUBLIC</span>
<span class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#707080">VYNDR.APP</span>
</div>
</div>
</div>
<!-- record billboard 1080x1350 -->
<div>
<div class="mono" style="font-size:9px;letter-spacing:.2em;color:#707080;margin-bottom:8px">NEW TYPE · RECORD BILLBOARD · 1080×1350</div>
<div data-billboard="record" style="width:320px;height:400px;background:radial-gradient(420px 400px at 60% -8%,rgba(0,212,160,.08),transparent 60%),#06060B;border:1px solid #1E1E2A;position:relative;overflow:hidden;padding:24px 26px;display:flex;flex-direction:column">
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.26em;color:#F0F0F0">VYND<span style="color:#00D4A0">R</span></span>
<span class="mono" style="font-size:7.5px;letter-spacing:.16em;color:#707080">THE MODEL · LAST 30D</span>
</div>
<div style="margin-top:26px;text-align:center">
<div class="mono" style="font-size:44px;font-weight:800;letter-spacing:-.01em;color:#F0F0F0">184<span style="color:#4a4a58">–</span>121</div>
<div class="mono" style="font-size:14px;font-weight:800;color:#00D4A0;margin-top:6px;text-shadow:0 0 18px rgba(0,212,160,.4)">+31.4u · BEAT CLOSE 61%</div>
</div>
<div style="margin-top:22px;flex:1">
<div style="display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #14141E"><span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;background:rgba(0,212,160,.14);color:#00D4A0;font-weight:800;font-size:9.5px;border:1px solid rgba(0,212,160,.3);flex:none;width:34px;justify-content:center">A+</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:78%;height:100%;background:#00D4A0"></div></div><span class="mono" style="font-size:9.5px;color:#F0F0F0;font-weight:700;flex:none;width:52px;text-align:right">18–6</span></div>
<div style="display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #14141E"><span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;background:rgba(0,212,160,.1);color:#00D4A0;font-weight:800;font-size:9.5px;border:1px solid rgba(0,212,160,.24);flex:none;width:34px;justify-content:center">A</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:64%;height:100%;background:rgba(0,212,160,.7)"></div></div><span class="mono" style="font-size:9.5px;color:#F0F0F0;font-weight:700;flex:none;width:52px;text-align:right">22–13</span></div>
<div style="display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #14141E"><span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:9.5px;border:1px solid #1E1E2A;flex:none;width:34px;justify-content:center">B</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:51%;height:100%;background:#B8BCC8;opacity:.7"></div></div><span class="mono" style="font-size:9.5px;color:#F0F0F0;font-weight:700;flex:none;width:52px;text-align:right">21–20</span></div>
<div style="display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #14141E;opacity:.7"><span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;background:#14141E;color:#B8BCC8;font-weight:800;font-size:9.5px;border:1px solid #1E1E2A;flex:none;width:34px;justify-content:center">C</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:49%;height:100%;background:#707080;opacity:.7"></div></div><span class="mono" style="font-size:9.5px;color:#B8BCC8;font-weight:700;flex:none;width:52px;text-align:right">44–46</span></div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between">
<span class="mono" style="font-size:7px;letter-spacing:.14em;color:#4a4a58">JUN 17 – JUL 17 · SETTLED &amp; TIMESTAMPED</span>
<span class="mono" style="font-size:7px;letter-spacing:.14em;color:#707080">VYNDR.APP/U/VYNDR</span>
</div>
</div>
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:8px;max-width:320px;line-height:1.6">TIER BARS = HIT RATE BY GRADE · C-TIER SHOWN HONESTLY UNDER .500 — THE RECORD IS THE BRAND</div>
</div>
</div>
<!-- ============ ACT 06 · MOBILE · 390 ============ -->
<div data-reveal style="margin-top:110px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid #14141E;padding-bottom:18px">
<span class="mono" style="font-size:64px;font-weight:800;line-height:.8;color:#14141E;-webkit-text-stroke:1px #2A2A38">06</span>
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">SURFACES 2–5 · MOBILE 390</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Every screen ships in mobile AND desktop. No horizontal overflow at 390px, ever. Tap targets ≥ 44px.</div></div>
</div>
<div id="mobile" data-screen-label="Intelligence · mobile screens" style="margin-top:44px;display:flex;flex-wrap:wrap;gap:34px;justify-content:center;align-items:flex-start">
<!-- S2 · market sheet -->
<div>
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S2 · THE MARKET · SHEET FROM REVEAL</div>
<x-import component-from-global-scope="IOSDevice" from="./ios-frame.jsx" dark="{{ true }}" hint-size="390px,844px">
<div style="display:flex;flex-direction:column;height:100%;background:#06060B;font-family:'Inter',system-ui,sans-serif;color:#F0F0F0;padding-top:54px">
<div style="display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid #14141E">
<span class="mono" style="font-size:11px;color:#707080">◂ READ</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#707080;white-space:nowrap">THE MARKET</span>
<span class="mono" style="font-size:11px;color:#707080">⋯</span>
</div>
<div style="padding:14px 16px 0">
<div style="display:flex;align-items:center;gap:10px">
<span style="width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#0B2265,#5a7fd4);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:10px;color:#cdd9ff;flex:none">MN</span>
<div style="flex:1;min-width:0"><div style="font-size:13.5px;font-weight:700">Nabers o Rec Yds <span style="color:#707080;font-weight:500">· season</span></div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">VYNDR 1,188 · A+ · 7 BOOKS</div></div>
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;background:rgba(255,179,71,.08);border:1px solid rgba(255,179,71,.25);font-size:7.5px;letter-spacing:.12em;color:#FFB347;flex:none;white-space:nowrap">SPLIT · 10.0</span>
</div>
<!-- disagreement compact -->
<div style="margin-top:14px;position:relative;height:34px">
<div style="position:absolute;left:0;right:0;top:14px;height:1px;background:#1E1E2A"></div>
<div style="position:absolute;left:66%;top:4px;bottom:4px;width:2px;background:#00D4A0;box-shadow:0 0 8px rgba(0,212,160,.5)"></div>
<div class="mono" style="position:absolute;left:66%;top:-5px;transform:translateX(-50%);font-size:7px;letter-spacing:.12em;color:#00D4A0;font-weight:700">V 1,188</div>
<span style="position:absolute;left:8%;top:10px;width:8px;height:8px;border-radius:50%;background:#1493FF;border:2px solid #06060B"></span>
<span style="position:absolute;left:14%;top:10px;width:8px;height:8px;border-radius:50%;background:#FFE100;border:2px solid #06060B"></span>
<span style="position:absolute;left:19%;top:10px;width:8px;height:8px;border-radius:50%;background:#53D337;border:2px solid #06060B"></span>
<span style="position:absolute;left:22%;top:10px;width:8px;height:8px;border-radius:50%;background:#D50A0A;border:2px solid #06060B"></span>
<span style="position:absolute;left:25%;top:10px;width:8px;height:8px;border-radius:50%;background:#C4A45E;border:2px solid #06060B"></span>
<span style="position:absolute;left:30%;top:10px;width:8px;height:8px;border-radius:50%;background:#2E6BFF;border:2px solid #06060B"></span>
<span style="position:absolute;left:36%;top:10px;width:8px;height:8px;border-radius:50%;background:#AD9660;border:2px solid #06060B"></span>
<div class="mono" style="position:absolute;left:8%;bottom:-4px;font-size:7px;letter-spacing:.08em;color:#4a4a58">1,115.5</div>
<div class="mono" style="position:absolute;left:36%;bottom:-4px;font-size:7px;letter-spacing:.08em;color:#4a4a58">1,125.5</div>
</div>
</div>
<div style="flex:1;overflow:hidden;margin-top:12px">
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55);background:rgba(0,212,160,.04);min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:8px;color:#1493FF;flex:none">FD</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#F0F0F0;font-weight:700">FANDUEL</span><span class="mono" style="display:inline-flex;align-items:center;height:14px;padding:0 5px;border-radius:4px;background:rgba(0,212,160,.14);border:1px solid rgba(0,212,160,.3);font-size:6.5px;letter-spacing:.12em;color:#00D4A0;font-weight:800;white-space:nowrap">BEST</span></span>
<span class="mono" style="font-size:11px;font-weight:800;color:#00D4A0">o1,115.5 <span style="color:#F0F0F0">−112</span></span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;opacity:.85;min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#FFE100;flex:none">365</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#B8BCC8;font-weight:700">BET365</span></span>
<span class="mono" style="font-size:11px;font-weight:700;color:#F0F0F0">o1,118.5 <span style="color:#B8BCC8;font-weight:600">−115</span></span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;opacity:.85;min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:8px;color:#53D337;flex:none">DK</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#B8BCC8;font-weight:700">DRAFTKINGS</span></span>
<span class="mono" style="font-size:11px;font-weight:700;color:#F0F0F0">o1,120.5 <span style="color:#B8BCC8;font-weight:600">−110</span></span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;opacity:.75;min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#C4A45E;flex:none">MGM</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#B8BCC8;font-weight:700">BETMGM</span></span>
<span class="mono" style="font-size:11px;font-weight:700;color:#F0F0F0">o1,120.5 <span style="color:#F0F0F0;font-weight:700">−105</span></span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;opacity:.65;min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:6.5px;color:#D50A0A;flex:none">ESPN</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#B8BCC8;font-weight:700">ESPN BET</span></span>
<span class="mono" style="font-size:11px;font-weight:700;color:#F0F0F0">o1,120.5 <span style="color:#B8BCC8;font-weight:600">−110</span></span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;opacity:.6;min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#2E6BFF;flex:none">FAN</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#B8BCC8;font-weight:700">FANATICS</span></span>
<span class="mono" style="font-size:11px;font-weight:700;color:#F0F0F0">o1,122.5 <span style="color:#B8BCC8;font-weight:600">−108</span></span>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #101018;opacity:.55;min-height:44px">
<span style="display:flex;align-items:center;gap:9px"><span style="width:24px;height:24px;border-radius:6px;background:#0E0E14;border:1px solid #1E1E2A;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:7px;color:#AD9660;flex:none">CZR</span><span class="mono" style="font-size:10px;letter-spacing:.1em;color:#B8BCC8;font-weight:700">CAESARS</span></span>
<span class="mono" style="font-size:11px;font-weight:700;color:#F0F0F0">o1,125.5 <span style="color:#B8BCC8;font-weight:600">−110</span></span>
</div>
<!-- line path since open -->
<div style="margin:12px 16px 0;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A;padding:12px 14px">
<div style="display:flex;align-items:center;justify-content:space-between"><span class="mono" style="font-size:8px;letter-spacing:.2em;color:#707080">CONSENSUS SINCE OPEN</span><span class="mono" style="font-size:8.5px;color:#00D4A0;font-weight:700">▲ +70.0</span></div>
<svg width="100%" height="34" viewBox="0 0 320 34" preserveAspectRatio="none" style="display:block;margin-top:8px"><polyline points="0,28 36,28 36,23 100,23 100,18 178,18 178,11 258,11 258,5 320,5" fill="none" stroke="#00D4A0" stroke-width="1.6" stroke-linejoin="round" opacity=".9"></polyline><circle cx="258" cy="5" r="2.6" fill="#00D4A0" style="animation:vy-livedot 1.5s ease-in-out infinite"></circle></svg>
<div style="display:flex;justify-content:space-between;margin-top:4px"><span class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58">OPEN 1,050.5 · MAR 4</span><span class="mono" style="font-size:7px;letter-spacing:.1em;color:#00D4A0">JUL 16 · CLEARED</span></div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;margin:12px 16px 0;min-height:44px;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A;padding:0 14px">
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#B8BCC8">ALERT ME IF A BOOK POSTS ≤ 1,110.5</span>
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#00D4A0;font-weight:800">SET ▸</span>
</div>
<div class="mono" style="padding:12px 16px 0;font-size:7px;letter-spacing:.1em;color:#4a4a58;line-height:1.7">NJ · STATE-LEGAL BOOKS ONLY. VYNDR MAY EARN A REFERRAL FEE.<br>THE NUMBER SHOWN IS THE NUMBER YOU GET. LINES AS OF 11:58 AM ET.</div>
</div>
<div style="padding:10px 16px 14px">
<span class="mono" style="display:flex;align-items:center;justify-content:center;height:44px;border-radius:11px;background:#00D4A0;color:#06060B;font-weight:800;font-size:10.5px;letter-spacing:.1em">TAKE o1,115.5 AT FANDUEL · −112 ▸</span>
</div>
</div>
</x-import>
</div>
<!-- S3 · article -->
<div>
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S3 · ARTICLE · 390</div>
<x-import component-from-global-scope="IOSDevice" from="./ios-frame.jsx" dark="{{ true }}" hint-size="390px,844px">
<div style="display:flex;flex-direction:column;height:100%;background:#06060B;font-family:'Inter',system-ui,sans-serif;color:#F0F0F0;padding-top:54px">
<div style="display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid #14141E">
<span class="mono" style="font-size:11px;color:#707080">◂ BLOG</span>
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.24em">VYND<span style="color:#00D4A0">R</span></span>
<span class="mono" style="font-size:11px;color:#707080">↗</span>
</div>
<div style="flex:1;overflow:hidden;padding:16px 16px 0">
<div style="display:flex;align-items:center;gap:6px;flex-wrap:wrap">
<span class="mono" style="display:inline-flex;align-items:center;height:16px;padding:0 7px;border-radius:4px;background:#14141E;border:1px solid #1E1E2A;font-size:7.5px;letter-spacing:.12em;color:#B8BCC8">LINE MOVEMENT</span>
<span class="mono" style="display:inline-flex;align-items:center;height:16px;padding:0 7px;border-radius:4px;background:#14141E;border:1px solid #1E1E2A;font-size:7.5px;letter-spacing:.12em;color:#B8BCC8">NFL</span>
<span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58;margin-left:auto">JUL 17 · 6 MIN</span>
</div>
<h3 style="font-size:20px;font-weight:800;letter-spacing:-.01em;line-height:1.25;margin-top:12px">The market repriced Nabers' clearance in an hour. It kept the injury discount anyway.</h3>
<div style="margin-top:14px;border-radius:10px;background:#0E0E14;border:1px solid #1E1E2A;padding:14px">
<svg width="100%" height="64" viewBox="0 0 320 64" preserveAspectRatio="none" style="display:block">
<line x1="0" y1="54" x2="320" y2="54" stroke="#1E1E2A" stroke-width="1"></line>
<polyline points="0,50 32,50 32,43 92,43 92,35 167,35 167,23 256,23 256,12 320,12" fill="none" stroke="#00D4A0" stroke-width="2" stroke-linejoin="round"></polyline>
<polyline points="0,50 32,50 32,43 92,43 92,35 167,35 167,23 256,23 256,12 320,12 320,64 0,64" fill="rgba(0,212,160,.06)" stroke="none"></polyline>
<circle cx="92" cy="43" r="2.6" fill="#B8BCC8"></circle>
<circle cx="256" cy="12" r="3.4" fill="#00D4A0"></circle>
</svg>
<div style="display:flex;justify-content:space-between;margin-top:6px">
<span class="mono" style="font-size:7px;letter-spacing:.1em;color:#4a4a58">OPEN 1,050.5</span>
<span class="mono" style="font-size:7px;letter-spacing:.1em;color:#00D4A0">NOW 1,120.5 · V 1,188</span>
</div>
</div>
<p style="font-size:13px;line-height:1.65;color:#B8BCC8;margin-top:14px">The clearance hit the wire at 11:42 AM. Within the hour, <span class="mono" style="display:inline-flex;align-items:center;gap:4px;height:17px;padding:0 6px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;color:#B8BCC8;vertical-align:-3px"><span style="width:8px;height:8px;border-radius:2px;background:linear-gradient(135deg,#0B2265,#5a7fd4)"></span>NYG</span> receiving markets moved as a block.</p>
<div style="display:flex;gap:1px;background:#1E1E2A;border:1px solid #1E1E2A;border-radius:10px;overflow:hidden;margin-top:14px">
<div style="flex:1;background:#0A0A10;padding:10px 10px"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#707080;margin-bottom:4px">MOVED</div><div class="mono" style="font-size:14px;font-weight:800;color:#F0F0F0">+70.0</div></div>
<div style="flex:1;background:#0A0A10;padding:10px 10px"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#00D4A0;margin-bottom:4px">MODEL</div><div class="mono" style="font-size:14px;font-weight:800;color:#00D4A0">+137.5</div></div>
<div style="flex:1;background:#0A0A10;padding:10px 10px"><div class="mono" style="font-size:7px;letter-spacing:.14em;color:#707080;margin-bottom:4px">LEFT</div><div class="mono" style="font-size:14px;font-weight:800;color:#F0F0F0">67.5</div></div>
</div>
<div style="border-left:2px solid #00D4A0;padding:2px 0 2px 14px;margin-top:16px">
<div style="font-size:14.5px;font-weight:600;line-height:1.45;color:#F0F0F0">The market prices the memory of the injury. The model prices the leg.</div>
</div>
<p style="font-size:13px;line-height:1.65;color:#B8BCC8;margin-top:14px">Pre-injury target share was <span class="mono" style="color:#F0F0F0">28%</span> and nothing in the offseason challenged it — no WR drafted in the first four rounds, no veteran signed. The sim keeps <span class="mono" style="color:#00D4A0">27%</span>; the market's number implies <span class="mono" style="color:#F0F0F0">23%</span>.</p>
<div style="margin-top:14px">
<div style="display:flex;align-items:center;gap:8px;padding:4px 0"><span class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;width:78px;flex:none">TGT '24</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:82%;height:100%;background:#B8BCC8;opacity:.7"></div></div><span class="mono" style="font-size:8.5px;color:#B8BCC8;width:30px;text-align:right;flex:none">28%</span></div>
<div style="display:flex;align-items:center;gap:8px;padding:4px 0"><span class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;width:78px;flex:none">MKT IMPLIES</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:68%;height:100%;background:#707080;opacity:.8"></div></div><span class="mono" style="font-size:8.5px;color:#707080;width:30px;text-align:right;flex:none">23%</span></div>
<div style="display:flex;align-items:center;gap:8px;padding:4px 0"><span class="mono" style="font-size:8px;letter-spacing:.08em;color:#00D4A0;width:78px;flex:none">VYNDR SIM</span><div style="flex:1;height:8px;background:#14141E;border-radius:3px;overflow:hidden"><div style="width:79%;height:100%;background:#00D4A0"></div></div><span class="mono" style="font-size:8.5px;color:#00D4A0;width:30px;text-align:right;font-weight:700;flex:none">27%</span></div>
<div class="mono" style="font-size:6.5px;letter-spacing:.12em;color:#4a4a58;margin-top:5px">FIG 2 · TARGET SHARE · DATA AS OF JUL 17</div>
</div>
</div>
<div style="display:flex;align-items:center;gap:9px;padding:9px 16px;border-top:1px solid #14141E;background:#08080D">
<span class="mono" style="font-size:8px;letter-spacing:.22em;color:#00D4A0;font-weight:800;flex:none">WIRE</span>
<span class="mono" style="font-size:9.5px;color:#B8BCC8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1">Nabers 1,050.5 → 1,120.5 on camp clearance.</span>
</div>
</div>
</x-import>
</div>
<!-- S4 · ledger + calibration -->
<div>
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S4 · LEDGER · CLV + CALIBRATION</div>
<x-import component-from-global-scope="IOSDevice" from="./ios-frame.jsx" dark="{{ true }}" hint-size="390px,844px">
<div style="display:flex;flex-direction:column;height:100%;background:#06060B;font-family:'Inter',system-ui,sans-serif;color:#F0F0F0;padding-top:54px">
<div style="display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid #14141E">
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.2em">LEDGER</span>
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080;white-space:nowrap">SETTLED · N 305</span>
</div>
<div style="padding:14px 16px 0">
<div style="border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A;padding:13px 15px">
<div style="display:flex;align-items:baseline;gap:11px;flex-wrap:wrap">
<span class="mono" style="font-size:19px;font-weight:800;color:#F0F0F0">184–121</span>
<span class="mono" style="font-size:11.5px;font-weight:700;color:#00D4A0">+31.4u</span>
<span class="mono" style="font-size:11.5px;font-weight:800;color:#00D4A0;white-space:nowrap">BEAT CLOSE 61%</span>
</div>
<div class="mono" style="font-size:7px;letter-spacing:.12em;color:#4a4a58;margin-top:7px">AVG CLV +2.4% · SINCE JUL 1 2026 · TIMESTAMPED</div>
</div>
</div>
<div style="flex:1;overflow:hidden;margin-top:10px">
<div style="padding:11px 16px;border-top:1px solid #101018">
<div style="display:flex;align-items:center;gap:8px"><span style="font-size:12.5px;font-weight:700;flex:1;min-width:0">Jokić <span style="color:#B8BCC8;font-weight:500">o27.5 PTS</span> <span class="mono" style="font-size:8.5px;color:#00D4A0;font-weight:700">HIT · 34</span></span><span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:8px;letter-spacing:.08em;color:#00D4A0;font-weight:800;white-space:nowrap;flex:none">BEAT +2.0</span></div>
<div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:4px">GRADED 10:47 PM · LOCKED 27.5 −114 · CLOSED 29.5</div>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;opacity:.85">
<div style="display:flex;align-items:center;gap:8px"><span style="font-size:12.5px;font-weight:600;flex:1;min-width:0">Skenes <span style="color:#B8BCC8;font-weight:500">o6.5 K</span> <span class="mono" style="font-size:8.5px;color:#FF4757;font-weight:700">MISS · 6</span></span><span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:8px;letter-spacing:.08em;color:#00D4A0;font-weight:800;white-space:nowrap;flex:none">BEAT +1.0</span></div>
<div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:4px">GRADED 9:58 PM · LOCKED 6.5 −118 · CLOSED 7.5</div>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;opacity:.7">
<div style="display:flex;align-items:center;gap:8px"><span style="font-size:12.5px;font-weight:600;flex:1;min-width:0">Brunson <span style="color:#B8BCC8;font-weight:500">o24.5 PTS</span> <span class="mono" style="font-size:8.5px;color:#00D4A0;font-weight:700">HIT · 27</span></span><span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.25);font-size:8px;letter-spacing:.08em;color:#FF4757;font-weight:800;white-space:nowrap;flex:none">MISSED −1.0</span></div>
<div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:4px">GRADED 10:31 PM · LOCKED 24.5 −110 · CLOSED 23.5</div>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;opacity:.6">
<div style="display:flex;align-items:center;gap:8px"><span style="font-size:12.5px;font-weight:600;flex:1;min-width:0">Acuña <span style="color:#B8BCC8;font-weight:500">o1.5 TB</span> <span class="mono" style="font-size:8.5px;color:#00D4A0;font-weight:700">HIT · 5</span></span><span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:8px;letter-spacing:.08em;color:#00D4A0;font-weight:800;white-space:nowrap;flex:none">BEAT +0.5</span></div>
<div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:4px">GRADED 10:12 PM · LOCKED 1.5 −122 · CLOSED 2.0</div>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;opacity:.5">
<div style="display:flex;align-items:center;gap:8px"><span style="font-size:12.5px;font-weight:600;flex:1;min-width:0">Ohtani <span style="color:#B8BCC8;font-weight:500">o1.5 H+R</span> <span class="mono" style="font-size:8.5px;color:#FF4757;font-weight:700">MISS · 1</span></span><span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:#14141E;border:1px solid #1E1E2A;font-size:8px;letter-spacing:.08em;color:#B8BCC8;font-weight:800;white-space:nowrap;flex:none">AT CLOSE 0.0</span></div>
<div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:4px">GRADED 11:04 PM · LOCKED 1.5 −118 · CLOSED 1.5</div>
</div>
<!-- calibration compact -->
<div style="margin:12px 16px 0;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A;padding:13px 15px">
<div style="display:flex;align-items:center;justify-content:space-between"><span class="mono" style="font-size:8.5px;letter-spacing:.2em;color:#707080">CALIBRATION</span><span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#00D4A0;white-space:nowrap">PUBLIC · /U/VYNDR</span></div>
<div style="font-size:13px;font-weight:700;margin-top:6px">When we say 70%, it hits <span class="mono" style="color:#00D4A0">68.2%</span>.</div>
<svg width="100%" height="96" viewBox="0 0 320 96" style="display:block;margin-top:8px">
<line x1="26" y1="6" x2="26" y2="80" stroke="#1E1E2A" stroke-width="1"></line>
<line x1="26" y1="80" x2="312" y2="80" stroke="#1E1E2A" stroke-width="1"></line>
<line x1="26" y1="80" x2="312" y2="6" stroke="#2A2A38" stroke-width="1" stroke-dasharray="3 4"></line>
<circle cx="82" cy="58" r="3.5" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.3"></circle>
<circle cx="138" cy="46" r="5" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.3"></circle>
<circle cx="194" cy="32" r="6.5" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.3"></circle>
<circle cx="250" cy="23" r="4.5" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.3"></circle>
<circle cx="292" cy="15" r="3" fill="rgba(0,212,160,.25)" stroke="#00D4A0" stroke-width="1.3"></circle>
<text x="82" y="92" fill="#707080" font-family="JetBrains Mono" font-size="7" text-anchor="middle">55</text>
<text x="138" y="92" fill="#707080" font-family="JetBrains Mono" font-size="7" text-anchor="middle">60</text>
<text x="194" y="92" fill="#F0F0F0" font-family="JetBrains Mono" font-size="7" text-anchor="middle" font-weight="700">70</text>
<text x="250" y="92" fill="#707080" font-family="JetBrains Mono" font-size="7" text-anchor="middle">75</text>
<text x="292" y="92" fill="#707080" font-family="JetBrains Mono" font-size="7" text-anchor="middle">80</text>
</svg>
<div class="mono" style="font-size:6.5px;letter-spacing:.12em;color:#4a4a58;margin-top:4px">DOT SIZE = SAMPLE · N 1,214 SETTLED · SINCE JUL 2026</div>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;margin-top:12px;opacity:.6">
<div style="display:flex;align-items:center;gap:8px"><span style="font-size:12.5px;font-weight:600;flex:1;min-width:0">Judge <span style="color:#B8BCC8;font-weight:500">o1.5 TB</span> <span class="mono" style="font-size:8.5px;color:#00D4A0;font-weight:700">HIT · 4</span></span><span class="mono" style="display:inline-flex;align-items:center;height:18px;padding:0 8px;border-radius:5px;background:rgba(0,212,160,.1);border:1px solid rgba(0,212,160,.28);font-size:8px;letter-spacing:.08em;color:#00D4A0;font-weight:800;white-space:nowrap;flex:none">BEAT +0.5</span></div>
<div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:4px">GRADED 10:22 PM · LOCKED 1.5 −130 · CLOSED 2.0</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;margin:12px 16px 0;min-height:44px;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A;padding:0 14px">
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#707080">CLV TRACKING BEGAN JUL 1 2026 · PUBLISHES AT N ≥ 100</span>
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#00D4A0;font-weight:800">305 ✓</span>
</div>
</div>
<div style="display:flex;align-items:center;gap:9px;padding:9px 16px;border-top:1px solid #14141E;background:#08080D">
<span class="mono" style="font-size:8px;letter-spacing:.22em;color:#00D4A0;font-weight:800;flex:none">WIRE</span>
<span class="mono" style="font-size:9.5px;color:#B8BCC8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1">CLV update: beat close on 61% of settled reads.</span>
</div>
</div>
</x-import>
</div>
<!-- S5 · report -->
<div>
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S5 · /REPORT · SIGNUP + ARCHIVE</div>
<x-import component-from-global-scope="IOSDevice" from="./ios-frame.jsx" dark="{{ true }}" hint-size="390px,844px">
<div style="display:flex;flex-direction:column;height:100%;background:#06060B;font-family:'Inter',system-ui,sans-serif;color:#F0F0F0;padding-top:54px">
<div style="display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid #14141E">
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.24em">VYND<span style="color:#00D4A0">R</span></span>
<span class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#707080;white-space:nowrap">THE REPORT</span>
</div>
<div style="flex:1;overflow:hidden">
<div style="padding:18px 16px 0">
<div class="mono" style="font-size:11px;letter-spacing:.26em;color:#F0F0F0;font-weight:800">THE VYNDR REPORT</div>
<div style="font-size:12.5px;color:#B8BCC8;margin-top:6px;line-height:1.55">One email per slate day. Top read, what changed, the record. Nothing else.</div>
<div style="display:flex;gap:8px;margin-top:12px">
<span class="mono" style="flex:1;display:flex;align-items:center;height:44px;padding:0 13px;border-radius:11px;background:#0E0E14;border:1px solid #2A2A38;color:#4a4a58;font-size:10.5px">you@…</span>
<span class="mono" style="display:inline-flex;align-items:center;height:44px;padding:0 15px;border-radius:11px;background:#00D4A0;color:#06060B;font-weight:800;font-size:9.5px;letter-spacing:.12em;flex:none">SUBSCRIBE</span>
</div>
<div class="mono" style="font-size:7px;letter-spacing:.12em;color:#4a4a58;margin-top:8px">12,408 READERS · NO SPAM, NO "LOCKS," NO CAPS-LOCK PICKS</div>
</div>
<div style="display:flex;align-items:center;justify-content:space-between;padding:18px 16px 8px">
<span class="mono" style="font-size:9.5px;letter-spacing:.22em;color:#F0F0F0;font-weight:700">ARCHIVE</span>
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#707080">128 ISSUES</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 128<br>JUL 17</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">The clearance the market half-priced</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">NABERS A+ · DAY RECORD 9–4</div></div>
<span class="mono" style="font-size:9px;color:#00D4A0;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.85;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 127<br>JUL 16</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Nine slates, one under lean</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">SKENES A · DAY RECORD 7–5</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.7;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 126<br>JUL 15</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Tag deadline day, read cold</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">WEMBY MVP A · DAY RECORD 8–6</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.55;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 125<br>JUL 14</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">The all-star pause, read anyway</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">HUB WEEK · NO SLATE RECORD</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.5;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 124<br>JUL 13</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">The derby is theater, the lines aren't</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">RALEIGH HR A · DAY RECORD 6–3</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.45;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 123<br>JUL 12</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Sunday slates and the K market</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">SKUBAL A+ · DAY RECORD 11–5</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.4;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 122<br>JUL 11</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Wemby's number won't sit still</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">NBA FUTURES · DAY RECORD 8–4</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.35;min-height:44px">
<span class="mono" style="font-size:7.5px;color:#4a4a58;width:50px;flex:none;line-height:1.5">Nº 121<br>JUL 10</span>
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Camp week zero, lines already moving</div><div class="mono" style="font-size:7.5px;letter-spacing:.08em;color:#707080;margin-top:2px">NFL SEASON BOARD · DAY RECORD 7–6</div></div>
<span class="mono" style="font-size:9px;color:#4a4a58;flex:none">▸</span>
</div>
<div class="mono" style="padding:9px 16px;border-top:1px solid #101018;font-size:7px;letter-spacing:.12em;color:#4a4a58">EVERY ISSUE SHOWS ITS OWN DAY RECORD — THE ARCHIVE IS A LEDGER TOO</div>
<div style="display:flex;align-items:center;justify-content:center;margin:10px 16px 0;min-height:44px;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A">
<span class="mono" style="font-size:9px;letter-spacing:.16em;color:#B8BCC8;font-weight:700">LOAD EARLIER ISSUES ▸ <span style="color:#4a4a58;font-weight:600">· 121 MORE</span></span>
</div>
</div>
</div>
</x-import>
</div>
</div>
<div data-screen-label="footer" style="margin-top:64px">
<div style="padding-top:22px;border-top:1px solid #14141E;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px">
<span class="mono" style="font-size:10px;letter-spacing:.16em;color:#707080">MOVEMENT STRIP · BOOKS · PUSH-TO-BOOK · ARTICLE MEDIA · CLV · CALIBRATION · THE REPORT · M2 CROPS</span>
<span class="mono" style="font-size:10px;letter-spacing:.16em;color:#00D4A0">VYNDR · SESSION 2 · SURFACES 2–5</span>
</div>
</div>
</div>
</div>
</x-dc>
<script type="text/x-dc" data-dc-script data-props="{&quot;motion&quot;:{&quot;editor&quot;:&quot;boolean&quot;,&quot;default&quot;:true,&quot;tsType&quot;:&quot;boolean&quot;,&quot;section&quot;:&quot;Behavior&quot;},&quot;reactions&quot;:{&quot;editor&quot;:&quot;boolean&quot;,&quot;default&quot;:true,&quot;tsType&quot;:&quot;boolean&quot;,&quot;section&quot;:&quot;Behavior&quot;}}">
class Component extends DCLogic {
renderVals() {
return {
rootRef: (n) => { this.rootNode = n; },
stillClass: (this.props.motion ?? true) ? '' : 'vy-still'
};
}
componentDidMount() {
this._t = [];
const tick = () => {
const s = new Date().toLocaleTimeString('en-US', { hour12: false });
document.querySelectorAll('[data-sync-clock]').forEach(el => el.textContent = s);
const wt = document.querySelector('[data-wire-time]');
if (wt) wt.textContent = s;
};
tick();
this._t.push(setInterval(tick, 1000));
const entries = [
'FD holds best number on Nabers o rec yds — 1,115.5 −112.',
'Market spread 10.0 across 7 books. Split logged as signal.',
'CLV update: beat close on 61% of settled reads (N 305).',
'Calibration holds — stated 70% bucket hitting 68.2%.',
'The Report Nº 128 out — 12,408 readers.'
];
let wi = 0;
this._t.push(setInterval(() => {
const el = document.querySelector('[data-wire]');
if (!el) return;
wi = (wi + 1) % entries.length;
el.textContent = entries[wi];
el.style.animation = 'none';
void el.offsetWidth;
el.style.animation = 'vy-wirein 6s ease both';
}, 6000));
const nudge = () => {
if (!(this.props.reactions ?? true)) return;
const cells = [...document.querySelectorAll('[data-react]')];
if (!cells.length) return;
const el = cells[Math.floor(Math.random() * cells.length)];
const f = el.getAttribute('data-fmt') || 'odds';
const raw = el.textContent;
const pct = raw.includes('%');
let v = parseFloat(raw.replace(/[^0-9.\-+]/g, ''));
if (isNaN(v)) return;
let up;
if (f === 'edge') { const d = (Math.random() - .45) * .2; up = d >= 0; v += d; el.textContent = (raw.startsWith('AVG') ? 'AVG CLV ' : '') + (v >= 0 ? '+' : '') + v.toFixed(1) + (pct ? '%' : ''); }
else { const d = Math.random() < .5 ? -2 : 2; up = d > 0; v += d; el.textContent = (v > 0 ? '+' : '') + Math.round(v); }
el.classList.remove('rx-up', 'rx-down');
void el.offsetWidth;
el.classList.add(up ? 'rx-up' : 'rx-down');
};
this._t.push(setTimeout(() => { this._t.push(setInterval(nudge, 6400)); }, 1800));
const secs = [...(this.rootNode || document).querySelectorAll('[data-reveal],[data-screen-label]')];
secs.forEach(s => { if (!s.hasAttribute('data-reveal')) s.setAttribute('data-reveal', ''); });
this._io = new IntersectionObserver(ents => {
ents.forEach(e => { if (e.isIntersecting) { e.target.classList.add('vy-in'); this._io.unobserve(e.target); } });
}, { rootMargin: '0px 0px -8% 0px' });
secs.forEach(s => this._io.observe(s));
}
componentWillUnmount() {
(this._t || []).forEach(t => { clearInterval(t); clearTimeout(t); });
if (this._io) this._io.disconnect();
}
}
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink