builtbykev
f549422758
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
962 lines
116 KiB
HTML
962 lines
116 KiB
HTML
<!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>
|
||
|
||
<!-- ============ THE WIRE ============ -->
|
||
<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">Offseason desk open — 214 NFL season lines repriced on news.</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">
|
||
|
||
<!-- ============ MASTHEAD ============ -->
|
||
<div style="padding:52px 0 30px">
|
||
<div class="mono" style="font-size:11px;letter-spacing:.34em;color:#00D4A0;margin-bottom:16px">SESSION 2 · SURFACE 1 · THE OFFSEASON HUB</div>
|
||
<h1 style="font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1.05">Every sport is always in season.<span class="mono" style="color:#00D4A0;animation:vy-cursor 1.1s steps(1) infinite">▌</span></h1>
|
||
<p style="margin-top:12px;max-width:640px;color:#B8BCC8;font-size:14px;line-height:1.55">A sport is in one of two states: LIVE SLATE or OFFSEASON HUB. The hub lives inside the sport — tapping NFL gets NFL, whatever NFL is today. Season-long is a different read: no "tonight," longer horizons, lines that move on news. The story is the movement — open, current, model.</p>
|
||
<div class="mono" style="margin-top:14px;font-size:10px;letter-spacing:.16em;color:#707080"><a href="Vyndr System.dc.html">◂ DESKTOP SYSTEM</a> · <a href="Vyndr Mobile.dc.html">MOBILE</a> · <a href="Vyndr Intelligence.dc.html">INTELLIGENCE (S2-5) ▸</a></div>
|
||
</div>
|
||
|
||
<!-- ============ ACT 01 · HUB HOME ============ -->
|
||
<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">HUB HOME</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Per sport. NFL primary · NBA variant. Countdown is ambient context, never the hero — the hero is what changed today.</div></div>
|
||
</div>
|
||
|
||
<div id="hub" data-screen-label="Hub home · NFL desktop" 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">NFL HUB · DESKTOP</span>
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#707080">SPORT TAB STATE LIVES IN THE TAB · NEVER A SEPARATE "OFFSEASON" TAB</span>
|
||
</div>
|
||
|
||
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;overflow:hidden;box-shadow:0 30px 60px -34px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.03)">
|
||
<!-- terminal top bar w/ sport states -->
|
||
<div style="display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 20px;border-bottom:1px solid #14141E;background:rgba(6,6,11,.6)">
|
||
<div style="display:flex;align-items:center;gap:10px;flex:none">
|
||
<svg width="22" height="22" 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>
|
||
<span class="mono" style="font-weight:800;font-size:13px;letter-spacing:.26em;animation:vy-glitch 7s steps(1) infinite">VYND<span style="color:#00D4A0">R</span></span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:6px;flex:1;justify-content:center">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:7px;font-size:9.5px;letter-spacing:.12em;color:#B8BCC8"><span style="width:5px;height:5px;border-radius:50%;background:#00D4A0;animation:vy-livedot 1.5s ease-in-out infinite"></span>MLB · 9 LIVE</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:7px;background:#14141E;border:1px solid #2A2A38;font-size:9.5px;letter-spacing:.12em;color:#F0F0F0;font-weight:700">NFL · CAMP −5D</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:7px;font-size:9.5px;letter-spacing:.12em;color:#707080">NBA · SL DAY 8</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:7px;font-size:9.5px;letter-spacing:.12em;color:#707080">NHL · FA</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:7px;font-size:9.5px;letter-spacing:.12em;color:#707080">UFC · SAT</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:8px;flex:none">
|
||
<span style="width:6px;height:6px;border-radius:50%;background:#00D4A0;animation:vy-syncdot 1.4s ease-in-out infinite"></span>
|
||
<span class="mono" data-sync-clock style="font-size:10px;color:#B8BCC8;letter-spacing:.06em">--:--:--</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- hub header: countdown = ambient -->
|
||
<div style="display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:22px 24px 0;flex-wrap:wrap">
|
||
<div>
|
||
<div style="display:flex;align-items:baseline;gap:12px">
|
||
<span style="font-size:26px;font-weight:800;letter-spacing:-.01em">NFL</span>
|
||
<span class="mono" style="font-size:10px;letter-spacing:.26em;color:#707080">THE OFFSEASON DESK</span>
|
||
</div>
|
||
<div class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#4a4a58;margin-top:6px">OUTLOOKS REPRICE ON NEWS · NOT GAME ODDS · AS OF JUL 17</div>
|
||
</div>
|
||
<div class="mono" style="font-size:11px;letter-spacing:.2em;color:#707080"><span data-kickoff style="color:#B8BCC8;font-weight:700">{{ kickoffDays }}</span> DAYS TO KICKOFF · THU SEP 10</div>
|
||
</div>
|
||
|
||
<!-- key dates strip -->
|
||
<div style="padding:18px 24px 4px">
|
||
<div style="position:relative;height:34px">
|
||
<div style="position:absolute;left:0;right:0;top:8px;height:1px;background:#1E1E2A"></div>
|
||
<div style="position:absolute;left:0;top:8px;height:1px;width:22%;background:#2A2A38"></div>
|
||
<div style="position:absolute;left:0;right:0;top:0;display:grid;grid-template-columns:repeat(6,1fr)">
|
||
<div><span style="display:block;width:7px;height:7px;border-radius:50%;background:#2A2A38;margin-top:5px"></span><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58;margin-top:6px">TAG DDL · JUL 15</div></div>
|
||
<div><span style="display:block;width:9px;height:9px;border-radius:50%;background:#F0F0F0;margin-top:4px;box-shadow:0 0 0 3px rgba(240,240,240,.12)"></span><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#F0F0F0;margin-top:5px;font-weight:700">CAMPS · JUL 22</div></div>
|
||
<div><span style="display:block;width:7px;height:7px;border-radius:50%;background:#1E1E2A;border:1px solid #2A2A38;margin-top:5px"></span><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:6px">HOF GAME · JUL 30</div></div>
|
||
<div><span style="display:block;width:7px;height:7px;border-radius:50%;background:#1E1E2A;border:1px solid #2A2A38;margin-top:5px"></span><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:6px">PRESEASON · AUG 6</div></div>
|
||
<div><span style="display:block;width:7px;height:7px;border-radius:50%;background:#1E1E2A;border:1px solid #2A2A38;margin-top:5px"></span><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:6px">FINAL CUTS · SEP 1</div></div>
|
||
<div style="justify-self:end;text-align:right"><span style="display:inline-block;width:9px;height:9px;border-radius:50%;background:#00D4A0;margin-top:4px;box-shadow:0 0 10px rgba(0,212,160,.5)"></span><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#00D4A0;margin-top:5px;font-weight:700">KICKOFF · SEP 10</div></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="display:grid;grid-template-columns:1.25fr 1fr;gap:16px;padding:16px 24px 22px">
|
||
<!-- WHAT CHANGED TODAY -->
|
||
<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">WHAT CHANGED TODAY</span>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">4 EVENTS · JUL 17</span>
|
||
</div>
|
||
<div style="height:1px;background:#14141E;transform-origin:left;animation:vy-bootline .6s ease-out both"></div>
|
||
<div style="--o:1;opacity:1;padding:12px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55);animation:vy-rowin .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:.14s">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080;flex:none">11:42 AM</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:8px;letter-spacing:.14em;color:#B8BCC8;flex:none">CLEARED</span></div>
|
||
<div style="font-size:13.5px;font-weight:700;margin-top:6px">Nabers cleared for camp — no restrictions</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.08em;color:#707080;margin-top:5px"><span style="display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,#0B2265,#5a7fd4);vertical-align:-1.5px;margin-right:3px"></span>NYG · REC YDS <span style="color:#4a4a58">1,050.5</span> → <span data-react data-fmt="line" style="color:#F0F0F0;font-weight:700;padding:1px 3px;border-radius:4px">1,120.5</span> · <span style="color:#00D4A0">VYNDR 1,188</span> · <a href="#reveal" class="mono" style="font-size:9px;letter-spacing:.12em">READ ▸</a></div>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;padding:12px 16px;border-top:1px solid #101018;animation:vy-rowin .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:.22s">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080;flex:none">10:15 AM</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:8px;letter-spacing:.14em;color:#B8BCC8;flex:none">CAMP REPORT</span></div>
|
||
<div style="font-size:13.5px;font-weight:600;margin-top:6px">Worthy running clear WR1 reps in KC installs</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.08em;color:#707080;margin-top:5px"><span style="display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,#E31837,#FFB81C);vertical-align:-1.5px;margin-right:3px"></span>KC · REC YDS <span style="color:#4a4a58">990.5</span> → <span data-react data-fmt="line" style="color:#F0F0F0;font-weight:700;padding:1px 3px;border-radius:4px">1,024.5</span> · <span style="color:#00D4A0">VYNDR 1,061</span> · <span class="mono" style="color:#4a4a58">READ ▸</span></div>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;padding:12px 16px;border-top:1px solid #101018;animation:vy-rowin .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:.3s">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080;flex:none">9:30 AM</span><span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:rgba(255,179,71,.08);border:1px solid rgba(255,179,71,.25);font-size:8px;letter-spacing:.14em;color:#FFB347;flex:none">CONTRACT</span></div>
|
||
<div style="font-size:13.5px;font-weight:600;margin-top:6px">Higgins restructure done — reports Tuesday</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.08em;color:#707080;margin-top:5px"><span style="display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,#FB4F14,#1a1a1a);vertical-align:-1.5px;margin-right:3px"></span>CIN · BURROW PASS TD <span style="color:#4a4a58">27.5</span> → <span data-react data-fmt="half" style="color:#F0F0F0;font-weight:700;padding:1px 3px;border-radius:4px">28.5</span> · <span style="color:#00D4A0">VYNDR 29.8</span> · <span class="mono" style="color:#4a4a58">READ ▸</span></div>
|
||
</div>
|
||
<div style="--o:.64;opacity:.64;padding:12px 16px;border-top:1px solid #101018;animation:vy-rowin .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:.38s">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080;flex:none">8:05 AM</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:8px;letter-spacing:.14em;color:#B8BCC8;flex:none">DEPTH</span></div>
|
||
<div style="font-size:13.5px;font-weight:600;margin-top:6px">Bills name Coleman the starting X receiver</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.08em;color:#707080;margin-top:5px"><span style="display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,#00338D,#C60C30);vertical-align:-1.5px;margin-right:3px"></span>BUF · REC YDS <span style="color:#4a4a58">815.5</span> → <span style="color:#F0F0F0;font-weight:700">815.5</span> · <span style="color:#707080">FLAT · MODEL HOLDS 862</span></div>
|
||
</div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;justify-content:space-between">
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#4a4a58">SOURCE-LINKED · EVERY IMPACT SHOWS THE REPRICE</span>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">FULL FEED ▸</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SEASON BOARD PREVIEW + report signup -->
|
||
<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">SEASON BOARD</span>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">BIGGEST MODEL−MARKET GAPS</span>
|
||
</div>
|
||
<div style="height:1px;background:#14141E"></div>
|
||
<div style="--o:1;opacity:1;display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55)">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Nabers <span style="color:#B8BCC8;font-weight:500">o1,120.5 Rec Yds</span></div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">O 1,050.5 · NOW 1,120.5 · <span style="color:#00D4A0">M 1,188</span></div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.14);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.3)">A+</span>
|
||
<span class="mono" data-react data-fmt="edge" style="font-size:11.5px;font-weight:700;color:#00D4A0;width:46px;text-align:right;padding:1px 3px;border-radius:4px">+6.0%</span>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Allen <span style="color:#B8BCC8;font-weight:500">o37.5 Pass+Rush TD</span></div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">O 36.5 · NOW 37.5 · <span style="color:#00D4A0">M 40.2</span></div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.1);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.24)">A</span>
|
||
<span class="mono" data-react data-fmt="edge" style="font-size:11.5px;font-weight:700;color:#00D4A0;width:46px;text-align:right;padding:1px 3px;border-radius:4px">+4.8%</span>
|
||
</div>
|
||
<div style="--o:.64;opacity:.64;display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Chiefs <span style="color:#B8BCC8;font-weight:500">u11.5 Wins</span></div><div class="mono" style="font-size:8px;letter-spacing:.1em;color:#707080;margin-top:2px">O 11.5 · NOW 11.5 · <span style="color:#00D4A0">M 10.8</span></div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10px;border:1px solid #1E1E2A">B</span>
|
||
<span class="mono" style="font-size:11.5px;font-weight:700;color:#00D4A0;width:46px;text-align:right">+3.1%</span>
|
||
</div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;justify-content:space-between">
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#4a4a58">214 SEASON LINES</span>
|
||
<a href="#board" class="mono" style="font-size:9px;letter-spacing:.14em">FULL BOARD ▸</a>
|
||
</div>
|
||
</div>
|
||
<!-- report signup slim (spec'd in Intelligence S5) -->
|
||
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:14px 16px;display:flex;align-items:center;gap:12px">
|
||
<div style="flex:1;min-width:0">
|
||
<div class="mono" style="font-size:9.5px;letter-spacing:.22em;color:#F0F0F0;font-weight:700">THE VYNDR REPORT</div>
|
||
<div style="font-size:11px;color:#707080;margin-top:3px">The offseason, read daily. One email, no noise.</div>
|
||
</div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:7px;background:#00D4A0;color:#06060B;font-weight:800;font-size:9.5px;letter-spacing:.14em;flex:none">SUBSCRIBE</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- hub mobile: NFL + NBA variant -->
|
||
<div data-screen-label="Hub home · mobile NFL + NBA" 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">HUB HOME · 390</span>
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#707080">NEW TAB BAR — SLATE · EXPLORE · READ FAB · LEDGER · MORE</span>
|
||
</div>
|
||
<div style="display:flex;flex-wrap:wrap;gap:34px;justify-content:center;align-items:flex-start">
|
||
|
||
<div>
|
||
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S1-A · NFL HUB</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">
|
||
<div style="display:flex;align-items:center;gap:9px">
|
||
<svg width="24" height="24" 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>
|
||
<span class="mono" style="font-weight:800;font-size:14px;letter-spacing:.26em">VYND<span style="color:#00D4A0">R</span></span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:7px">
|
||
<span style="width:6px;height:6px;border-radius:50%;background:#00D4A0;animation:vy-syncdot 1.4s ease-in-out infinite"></span>
|
||
<span class="mono" data-sync-clock style="font-size:10px;color:#B8BCC8;letter-spacing:.06em">--:--:--</span>
|
||
</div>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:6px;padding:9px 16px;border-bottom:1px solid #14141E;overflow:hidden">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#B8BCC8;flex:none"><span style="width:4px;height:4px;border-radius:50%;background:#00D4A0"></span>MLB 9</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #2A2A38;font-size:8.5px;letter-spacing:.1em;color:#F0F0F0;font-weight:700;flex:none">NFL · CAMP −5D</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">NBA · SL</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">NHL</span>
|
||
</div>
|
||
<div style="display:flex;align-items:baseline;justify-content:space-between;padding:14px 16px 10px">
|
||
<div style="display:flex;align-items:baseline;gap:8px"><span style="font-size:19px;font-weight:800">NFL</span><span class="mono" style="font-size:8px;letter-spacing:.22em;color:#707080">OFFSEASON DESK</span></div>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#707080"><span data-kickoff style="color:#B8BCC8;font-weight:700">{{ kickoffDays }}</span>D TO KICKOFF</span>
|
||
</div>
|
||
<div style="flex:1;overflow:hidden">
|
||
<div style="display:flex;align-items:center;justify-content:space-between;padding:4px 16px 6px">
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.22em;color:#F0F0F0;font-weight:700">WHAT CHANGED TODAY</span>
|
||
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#707080">JUL 17</span>
|
||
</div>
|
||
<div style="padding:10px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55)">
|
||
<div style="font-size:12.5px;font-weight:700;line-height:1.3">Nabers cleared for camp — no restrictions</div>
|
||
<div class="mono" style="font-size:8.5px;letter-spacing:.06em;color:#707080;margin-top:4px"><span style="display:inline-block;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#0B2265,#5a7fd4);vertical-align:-1px;margin-right:3px"></span>NYG · REC YDS <span style="color:#4a4a58">1,050.5</span> → <span style="color:#F0F0F0;font-weight:700">1,120.5</span> · <span style="color:#00D4A0">M 1,188</span></div>
|
||
</div>
|
||
<div style="padding:10px 16px;border-top:1px solid #101018;opacity:.85">
|
||
<div style="font-size:12.5px;font-weight:600;line-height:1.3">Worthy running clear WR1 reps in KC installs</div>
|
||
<div class="mono" style="font-size:8.5px;letter-spacing:.06em;color:#707080;margin-top:4px"><span style="display:inline-block;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#E31837,#FFB81C);vertical-align:-1px;margin-right:3px"></span>KC · REC YDS <span style="color:#4a4a58">990.5</span> → <span style="color:#F0F0F0;font-weight:700">1,024.5</span> · <span style="color:#00D4A0">M 1,061</span></div>
|
||
</div>
|
||
<div style="padding:10px 16px;border-top:1px solid #101018;opacity:.7">
|
||
<div style="font-size:12.5px;font-weight:600;line-height:1.3">Higgins restructure done — reports Tuesday</div>
|
||
<div class="mono" style="font-size:8.5px;letter-spacing:.06em;color:#707080;margin-top:4px"><span style="display:inline-block;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#FB4F14,#1a1a1a);vertical-align:-1px;margin-right:3px"></span>CIN · PASS TD <span style="color:#4a4a58">27.5</span> → <span style="color:#F0F0F0;font-weight:700">28.5</span> · <span style="color:#00D4A0">M 29.8</span></div>
|
||
</div>
|
||
<div style="display:flex;align-items:center;justify-content:space-between;padding:12px 16px 6px;border-top:1px solid #14141E;margin-top:2px">
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.22em;color:#F0F0F0;font-weight:700">SEASON BOARD</span>
|
||
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#00D4A0">FULL BOARD ▸</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55)">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Nabers <span style="color:#B8BCC8;font-weight:500">o1,120.5 Rec Yds</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">O 1,050.5 → 1,120.5 · <span style="color:#00D4A0">M 1,188</span></div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.14);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.3)">A+</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018;opacity:.85">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Allen <span style="color:#B8BCC8;font-weight:500">o37.5 P+R TD</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">O 36.5 → 37.5 · <span style="color:#00D4A0">M 40.2</span></div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.1);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.24)">A</span>
|
||
</div>
|
||
<!-- key dates compact -->
|
||
<div style="display:flex;align-items:center;gap:0;padding:12px 16px 0">
|
||
<div style="flex:1;text-align:left"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#F0F0F0;font-weight:700">CAMPS</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">JUL 22</div></div>
|
||
<div style="flex:1;text-align:center"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#707080">PRESEASON</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">AUG 6</div></div>
|
||
<div style="flex:1;text-align:center"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#707080">CUTS</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">SEP 1</div></div>
|
||
<div style="flex:1;text-align:right"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#00D4A0;font-weight:700">KICKOFF</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">SEP 10</div></div>
|
||
</div>
|
||
</div>
|
||
<!-- wire -->
|
||
<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" data-wire 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>
|
||
<!-- tab bar w/ READ fab -->
|
||
<div style="position:relative;display:flex;align-items:center;justify-content:space-around;padding:10px 8px 6px;border-top:1px solid #14141E;background:rgba(6,6,11,.9)">
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path stroke="#00D4A0" stroke-width="2" stroke-linecap="round" d="M4 6h16M4 12h16M4 18h9"></path></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#00D4A0;font-weight:700">SLATE</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><circle cx="11" cy="11" r="6.5" stroke="#707080" stroke-width="2"></circle><path stroke="#707080" stroke-width="2" stroke-linecap="round" d="M19.5 19.5 16 16"></path></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">EXPLORE</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:3px;min-width:60px;padding:0;transform:translateY(-14px)">
|
||
<span style="width:50px;height:50px;border-radius:50%;background:#00D4A0;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px -6px rgba(0,212,160,.55),0 0 0 6px #06060B"><svg width="24" height="24" viewBox="0 0 32 32" fill="none"><path d="M8 9 L16 24 L24 9" fill="none" stroke="#06060B" stroke-width="3.2" stroke-linecap="round" stroke-linejoin="round"></path><circle cx="24" cy="9" r="2.2" fill="#06060B"></circle></svg></span>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#00D4A0;font-weight:800">READ</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path stroke="#707080" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M5 4h14v16H5zM8 9h8M8 13h6"></path></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">LEDGER</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><circle cx="5" cy="12" r="1.8" fill="#707080"></circle><circle cx="12" cy="12" r="1.8" fill="#707080"></circle><circle cx="19" cy="12" r="1.8" fill="#707080"></circle></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">MORE</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</x-import>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S1-B · NBA VARIANT · SUMMER LEAGUE HONESTY</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">
|
||
<div style="display:flex;align-items:center;gap:9px">
|
||
<svg width="24" height="24" 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>
|
||
<span class="mono" style="font-weight:800;font-size:14px;letter-spacing:.26em">VYND<span style="color:#00D4A0">R</span></span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:7px">
|
||
<span style="width:6px;height:6px;border-radius:50%;background:#00D4A0;animation:vy-syncdot 1.4s ease-in-out infinite"></span>
|
||
<span class="mono" data-sync-clock style="font-size:10px;color:#B8BCC8;letter-spacing:.06em">--:--:--</span>
|
||
</div>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:6px;padding:9px 16px;border-bottom:1px solid #14141E;overflow:hidden">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#B8BCC8;flex:none"><span style="width:4px;height:4px;border-radius:50%;background:#00D4A0"></span>MLB 9</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">NFL · CAMP</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #2A2A38;font-size:8.5px;letter-spacing:.1em;color:#F0F0F0;font-weight:700;flex:none">NBA · SL DAY 8</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">NHL</span>
|
||
</div>
|
||
<div style="display:flex;align-items:baseline;justify-content:space-between;padding:14px 16px 10px">
|
||
<div style="display:flex;align-items:baseline;gap:8px"><span style="font-size:19px;font-weight:800">NBA</span><span class="mono" style="font-size:8px;letter-spacing:.22em;color:#707080">SUMMER DESK</span></div>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.12em;color:#707080">95D TO OPENING NIGHT</span>
|
||
</div>
|
||
<div style="flex:1;overflow:hidden">
|
||
<!-- summer league: outlook only, engine refuses -->
|
||
<div style="margin:2px 16px 0;border-radius:11px;background:#0E0E14;border:1px solid #1E1E2A;overflow:hidden">
|
||
<div style="display:flex;align-items:center;justify-content:space-between;padding:11px 13px 9px">
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.2em;color:#F0F0F0;font-weight:700">SUMMER LEAGUE · LAS VEGAS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:rgba(255,179,71,.08);border:1px solid rgba(255,179,71,.25);font-size:7.5px;letter-spacing:.12em;color:#FFB347">OUTLOOK ONLY</span>
|
||
</div>
|
||
<div style="padding:0 13px 10px;font-size:10.5px;line-height:1.45;color:#707080">We don't grade Summer League props. Ten-day samples against fringe rosters aren't signal — they're noise wearing a jersey. We read minutes, roles, and rotation intent instead.</div>
|
||
<div style="padding:10px 13px;border-top:1px solid #101018">
|
||
<div style="display:flex;align-items:center;gap:9px"><span style="width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#1E1E2A,#2A2A38);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#B8BCC8;flex:none">AD</span><div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:700">Dybantsa <span class="mono" style="font-size:8px;color:#707080;letter-spacing:.08em">F · R</span></div><div class="mono" style="font-size:8px;letter-spacing:.06em;color:#707080;margin-top:1px">31 MIN/G · USAGE-HEAVY · STARTER-TRACK</div></div><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;flex:none">NOT GRADED</span></div>
|
||
</div>
|
||
<div style="padding:10px 13px;border-top:1px solid #101018;opacity:.85">
|
||
<div style="display:flex;align-items:center;gap:9px"><span style="width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#1E1E2A,#2A2A38);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#B8BCC8;flex:none">CB</span><div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:600">Boozer <span class="mono" style="font-size:8px;color:#707080;letter-spacing:.08em">F · R</span></div><div class="mono" style="font-size:8px;letter-spacing:.06em;color:#707080;margin-top:1px">28 MIN/G · CLOSING LINEUPS · ROTATION LOCK</div></div><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;flex:none">NOT GRADED</span></div>
|
||
</div>
|
||
<div style="padding:10px 13px;border-top:1px solid #101018;opacity:.7">
|
||
<div style="display:flex;align-items:center;gap:9px"><span style="width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#1E1E2A,#2A2A38);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#B8BCC8;flex:none">DP</span><div style="flex:1;min-width:0"><div style="font-size:12px;font-weight:600">Peterson <span class="mono" style="font-size:8px;color:#707080;letter-spacing:.08em">G · R</span></div><div class="mono" style="font-size:8px;letter-spacing:.06em;color:#707080;margin-top:1px">24 MIN/G · SECOND UNIT · WATCHLIST</div></div><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;flex:none">NOT GRADED</span></div>
|
||
</div>
|
||
</div>
|
||
<!-- futures preview -->
|
||
<div style="display:flex;align-items:center;justify-content:space-between;padding:14px 16px 6px">
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.22em;color:#F0F0F0;font-weight:700">SEASON BOARD</span>
|
||
<span class="mono" style="font-size:8px;letter-spacing:.12em;color:#00D4A0">FULL BOARD ▸</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55)">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:700">Wembanyama <span style="color:#B8BCC8;font-weight:500">MVP</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">O +420 → +330 · <span style="color:#00D4A0">FAIR +270</span></div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.1);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.24)">A</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #101018;opacity:.85">
|
||
<div style="flex:1;min-width:0"><div style="font-size:12.5px;font-weight:600">Thunder <span style="color:#B8BCC8;font-weight:500">o61.5 Wins</span></div><div class="mono" style="font-size:8px;letter-spacing:.08em;color:#707080;margin-top:2px">O 60.5 → 61.5 · <span style="color:#00D4A0">M 60.9</span> · THIN</div></div>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:#14141E;color:#B8BCC8;font-weight:800;font-size:10px;border:1px solid #1E1E2A">C</span>
|
||
</div>
|
||
<!-- key dates -->
|
||
<div style="display:flex;align-items:center;gap:0;padding:12px 16px 0">
|
||
<div style="flex:1;text-align:left"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#F0F0F0;font-weight:700">SL ENDS</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">JUL 19</div></div>
|
||
<div style="flex:1;text-align:center"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#707080">MEDIA DAY</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">SEP 28</div></div>
|
||
<div style="flex:1;text-align:center"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#707080">CAMPS</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">SEP 29</div></div>
|
||
<div style="flex:1;text-align:right"><div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#00D4A0;font-weight:700">OPENER</div><div class="mono" style="font-size:7.5px;color:#4a4a58;margin-top:1px">OCT 20</div></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">Wemby MVP steams +420 → +330 since June.</span>
|
||
</div>
|
||
<div style="position:relative;display:flex;align-items:center;justify-content:space-around;padding:10px 8px 6px;border-top:1px solid #14141E;background:rgba(6,6,11,.9)">
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path stroke="#00D4A0" stroke-width="2" stroke-linecap="round" d="M4 6h16M4 12h16M4 18h9"></path></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#00D4A0;font-weight:700">SLATE</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><circle cx="11" cy="11" r="6.5" stroke="#707080" stroke-width="2"></circle><path stroke="#707080" stroke-width="2" stroke-linecap="round" d="M19.5 19.5 16 16"></path></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">EXPLORE</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:3px;min-width:60px;padding:0;transform:translateY(-14px)">
|
||
<span style="width:50px;height:50px;border-radius:50%;background:#00D4A0;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px -6px rgba(0,212,160,.55),0 0 0 6px #06060B"><svg width="24" height="24" viewBox="0 0 32 32" fill="none"><path d="M8 9 L16 24 L24 9" fill="none" stroke="#06060B" stroke-width="3.2" stroke-linecap="round" stroke-linejoin="round"></path><circle cx="24" cy="9" r="2.2" fill="#06060B"></circle></svg></span>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.14em;color:#00D4A0;font-weight:800">READ</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path stroke="#707080" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M5 4h14v16H5zM8 9h8M8 13h6"></path></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">LEDGER</span>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px;padding:2px 0">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none"><circle cx="5" cy="12" r="1.8" fill="#707080"></circle><circle cx="12" cy="12" r="1.8" fill="#707080"></circle><circle cx="19" cy="12" r="1.8" fill="#707080"></circle></svg>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.12em;color:#707080">MORE</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</x-import>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============ ACT 02 · SEASON-LONG BOARD ============ -->
|
||
<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">02</span>
|
||
<div><div class="mono" style="font-size:13px;letter-spacing:.3em;color:#F0F0F0;font-weight:800">SEASON-LONG BOARD</div><div style="font-size:12.5px;color:#707080;margin-top:5px">The open → current → model triplet is the signature. Ladder pattern: one row per player, lines nested.</div></div>
|
||
</div>
|
||
|
||
<div id="board" data-screen-label="Season board · desktop" 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">NFL SEASON BOARD · DESKTOP</span>
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#707080">OPEN DIM · NOW WHITE · MODEL GREEN — ONE READING ORDER, EVERY ROW</span>
|
||
</div>
|
||
|
||
<div style="border-radius:16px;background:#0A0A10;border:1px solid #1E1E2A;overflow:hidden;box-shadow:0 30px 60px -34px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.03)">
|
||
<!-- filters -->
|
||
<div style="display:flex;align-items:center;gap:6px;padding:14px 16px;border-bottom:1px solid #14141E;flex-wrap:wrap">
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;background:#14141E;border:1px solid #2A2A38;font-size:9px;letter-spacing:.14em;color:#F0F0F0;font-weight:700">ALL MARKETS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;font-size:9px;letter-spacing:.14em;color:#707080">PASSING</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;font-size:9px;letter-spacing:.14em;color:#707080">RUSH / REC</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;font-size:9px;letter-spacing:.14em;color:#707080">TDS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;font-size:9px;letter-spacing:.14em;color:#707080">WIN TOTALS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;font-size:9px;letter-spacing:.14em;color:#707080">DIVISIONS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:24px;padding:0 11px;border-radius:7px;font-size:9px;letter-spacing:.14em;color:#707080">AWARDS</span>
|
||
<span class="mono" style="margin-left:auto;font-size:9px;letter-spacing:.16em;color:#707080">SORTED · MODEL GAP ▼</span>
|
||
</div>
|
||
<!-- column heads -->
|
||
<div style="display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:9px 16px 7px">
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58">PLAYER / MARKET</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">OPEN</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">NOW</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#00D4A0;justify-self:end">VYNDR</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">EDGE</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">GRD</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;justify-self:end">MOVE · SINCE OPEN</span>
|
||
</div>
|
||
<div style="height:1px;background:#14141E;transform-origin:left;animation:vy-bootline .6s ease-out both"></div>
|
||
|
||
<!-- ladder: NABERS -->
|
||
<div style="display:flex;align-items:center;gap:10px;padding:11px 16px 7px;border-top:1px solid #101018">
|
||
<span style="position:relative;width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#0B2265,#5a7fd4);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#cdd9ff;flex:none">MN<image-slot id="hs-nabers" shape="rounded" radius="7" style="position:absolute;inset:0" placeholder="Nabers headshot"></image-slot></span>
|
||
<span style="font-size:13.5px;font-weight:700">Malik Nabers</span>
|
||
<span class="mono" style="font-size:9px;color:#707080;letter-spacing:.08em">WR · NYG</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:18px;padding:0 8px;border-radius:5px;background:rgba(255,122,74,.09);border:1px solid rgba(255,122,74,.28);font-size:8.5px;letter-spacing:.14em;color:#FF7A4A;font-weight:700"><svg width="11" height="11" viewBox="0 0 24 24" fill="none" style="color:#FF7A4A"><path fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" d="M3 19 19 5M14 5h5v5"></path><path stroke="currentColor" stroke-width="2" stroke-linecap="round" d="M4 14l2 2M8 10l2 2"></path></svg>BURNER</span>
|
||
<span class="mono" style="margin-left:auto;font-size:8.5px;letter-spacing:.12em;color:#4a4a58">2 LINES</span>
|
||
</div>
|
||
<div style="--o:1;opacity:1;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 8px 52px;box-shadow:inset 2px 0 0 rgba(0,212,160,.55)">
|
||
<span style="font-size:12.5px;font-weight:600;color:#B8BCC8">Receiving Yards <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">1,050.5</span>
|
||
<span class="mono" data-react data-fmt="line" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">1,120.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">1,188</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+6.0%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:rgba(0,212,160,.14);color:#00D4A0;font-weight:800;font-size:10.5px;border:1px solid rgba(0,212,160,.3)">A+</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><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></span>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 10px 52px;border-bottom:1px solid #101018">
|
||
<span style="font-size:12.5px;font-weight:500;color:#B8BCC8">Receptions <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">88.5</span>
|
||
<span class="mono" data-react data-fmt="half" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">92.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">97.0</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+3.2%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">B</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,14 26,14 26,11 56,11 56,7 86,7" fill="none" stroke="#B8BCC8" stroke-width="1.5" stroke-linejoin="round" opacity=".6"></polyline><circle cx="86" cy="7" r="2" fill="#B8BCC8"></circle></svg><span class="mono" style="font-size:9px;color:#B8BCC8;font-weight:700">▲ +4.0</span></span>
|
||
</div>
|
||
|
||
<!-- ladder: ALLEN -->
|
||
<div style="display:flex;align-items:center;gap:10px;padding:11px 16px 7px;border-top:1px solid #101018">
|
||
<span style="width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#00338D,#C60C30);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#bcd0ff;flex:none">JA</span>
|
||
<span style="font-size:13.5px;font-weight:700">Josh Allen</span>
|
||
<span class="mono" style="font-size:9px;color:#707080;letter-spacing:.08em">QB · BUF</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:18px;padding:0 8px;border-radius:5px;background:rgba(217,164,65,.09);border:1px solid rgba(217,164,65,.28);font-size:8.5px;letter-spacing:.14em;color:#D9A441;font-weight:700"><svg width="11" height="11" 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>MAESTRO</span>
|
||
<span class="mono" style="margin-left:auto;font-size:8.5px;letter-spacing:.12em;color:#4a4a58">3 LINES</span>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 8px 52px">
|
||
<span style="font-size:12.5px;font-weight:500;color:#B8BCC8">Pass + Rush TD <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">36.5</span>
|
||
<span class="mono" data-react data-fmt="half" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">37.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">40.2</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+4.8%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:rgba(0,212,160,.1);color:#00D4A0;font-weight:800;font-size:10.5px;border:1px solid rgba(0,212,160,.24)">A</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,13 34,13 34,9 86,9" fill="none" stroke="#B8BCC8" stroke-width="1.5" stroke-linejoin="round" opacity=".6"></polyline><circle cx="86" cy="9" r="2" fill="#B8BCC8"></circle></svg><span class="mono" style="font-size:9px;color:#B8BCC8;font-weight:700">▲ +1.0</span></span>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 8px 52px">
|
||
<span style="font-size:12.5px;font-weight:500;color:#B8BCC8">Passing Yards <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">3,895.5</span>
|
||
<span class="mono" data-react data-fmt="line" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">3,940.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">4,080</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+3.6%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">B</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,13 40,13 40,10 86,10" fill="none" stroke="#B8BCC8" stroke-width="1.5" stroke-linejoin="round" opacity=".6"></polyline><circle cx="86" cy="10" r="2" fill="#B8BCC8"></circle></svg><span class="mono" style="font-size:9px;color:#B8BCC8;font-weight:700">▲ +45.0</span></span>
|
||
</div>
|
||
<div style="--o:.64;opacity:.64;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 10px 52px;border-bottom:1px solid #101018">
|
||
<span style="font-size:12.5px;font-weight:500;color:#B8BCC8">MVP <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">AWARDS</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">+650</span>
|
||
<span class="mono" data-react data-fmt="odds" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">+600</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">+490</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+2.6%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">B</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,12 50,12 50,9 86,9" fill="none" stroke="#B8BCC8" stroke-width="1.5" stroke-linejoin="round" opacity=".6"></polyline><circle cx="86" cy="9" r="2" fill="#B8BCC8"></circle></svg><span class="mono" style="font-size:9px;color:#B8BCC8;font-weight:700">▲ 650→600</span></span>
|
||
</div>
|
||
|
||
<!-- ladder: BIJAN -->
|
||
<div style="display:flex;align-items:center;gap:10px;padding:11px 16px 7px;border-top:1px solid #101018">
|
||
<span style="width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#A71930,#1a1a1a);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:9px;color:#ffb8c4;flex:none">BR</span>
|
||
<span style="font-size:13.5px;font-weight:700">Bijan Robinson</span>
|
||
<span class="mono" style="font-size:9px;color:#707080;letter-spacing:.08em">RB · ATL</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:18px;padding:0 8px;border-radius:5px;background:rgba(181,137,90,.09);border:1px solid rgba(181,137,90,.28);font-size:8.5px;letter-spacing:.14em;color:#B5895A;font-weight:700"><svg width="11" height="11" viewBox="0 0 24 24" fill="none" style="color:#B5895A"><path fill="currentColor" fill-opacity=".16" d="M6 17c0-6 2-9 6-9s6 3 6 9z"></path><path fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" d="M6 17c0-6 2-9 6-9s6 3 6 9zM4 17h16M12 8V5"></path><circle cx="12" cy="20" r="1.6" fill="currentColor"></circle></svg>BELL COW</span>
|
||
<span class="mono" style="margin-left:auto;font-size:8.5px;letter-spacing:.12em;color:#4a4a58">2 LINES</span>
|
||
</div>
|
||
<div style="--o:.64;opacity:.64;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 8px 52px">
|
||
<span style="font-size:12.5px;font-weight:500;color:#B8BCC8">Rushing Yards <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">1,275.5</span>
|
||
<span class="mono" data-react data-fmt="line" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">1,290.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">1,342</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+2.2%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#B8BCC8;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">C</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,12 60,12 60,10 86,10" fill="none" stroke="#B8BCC8" stroke-width="1.5" stroke-linejoin="round" opacity=".5"></polyline><circle cx="86" cy="10" r="2" fill="#B8BCC8"></circle></svg><span class="mono" style="font-size:9px;color:#B8BCC8;font-weight:700">▲ +15.0</span></span>
|
||
</div>
|
||
<div style="--o:.48;opacity:.48;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 10px 52px;border-bottom:1px solid #101018">
|
||
<span style="font-size:12.5px;font-weight:500;color:#B8BCC8">Rushing TD <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">11.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0">11.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">12.4</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+1.4%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#B8BCC8;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">C</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,11 86,11" fill="none" stroke="#4a4a58" stroke-width="1.5" opacity=".7"></polyline></svg><span class="mono" style="font-size:9px;color:#4a4a58;font-weight:700">FLAT · 41D</span></span>
|
||
</div>
|
||
|
||
<!-- ladder: WIN TOTALS -->
|
||
<div style="display:flex;align-items:center;gap:10px;padding:11px 16px 7px;border-top:1px solid #101018">
|
||
<span class="mono" style="font-size:10px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">TEAM WIN TOTALS</span>
|
||
<span class="mono" style="margin-left:auto;font-size:8.5px;letter-spacing:.12em;color:#4a4a58">32 TEAMS</span>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 8px 52px">
|
||
<span style="font-size:12.5px;font-weight:600;color:#B8BCC8"><span style="display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,#0076B6,#B0B7BC);vertical-align:-1.5px;margin-right:6px"></span>DET Lions <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">WINS O/U</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">10.5</span>
|
||
<span class="mono" data-react data-fmt="half" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0;padding:1px 4px;border-radius:5px">11.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">11.9</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+1.9%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#B8BCC8;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">C</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,14 44,14 44,8 86,8" fill="none" stroke="#B8BCC8" stroke-width="1.5" stroke-linejoin="round" opacity=".6"></polyline><circle cx="86" cy="8" r="2" fill="#B8BCC8"></circle></svg><span class="mono" style="font-size:9px;color:#B8BCC8;font-weight:700">▲ +1.0</span></span>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;display:grid;grid-template-columns:1fr 88px 88px 88px 64px 44px 150px;align-items:center;gap:12px;padding:8px 16px 10px 52px;border-bottom:1px solid #101018">
|
||
<span style="font-size:12.5px;font-weight:600;color:#B8BCC8"><span style="display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,#E31837,#FFB81C);vertical-align:-1.5px;margin-right:6px"></span>KC Chiefs <span class="mono" style="font-size:8.5px;color:#4a4a58;letter-spacing:.1em">WINS O/U · MODEL LEANS UNDER</span></span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;color:#707080">11.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:700;color:#F0F0F0">11.5</span>
|
||
<span class="mono" style="justify-self:end;font-size:12.5px;font-weight:800;color:#00D4A0">10.8</span>
|
||
<span class="mono" style="justify-self:end;font-size:11.5px;font-weight:700;color:#00D4A0">+3.1%</span>
|
||
<span class="mono" style="justify-self:end;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10.5px;border:1px solid #1E1E2A">B</span>
|
||
<span style="justify-self:end;display:flex;align-items:center;gap:8px"><svg width="86" height="20" viewBox="0 0 86 20" preserveAspectRatio="none" style="display:block"><polyline points="0,10 86,10" fill="none" stroke="#4a4a58" stroke-width="1.5" opacity=".7"></polyline></svg><span class="mono" style="font-size:9px;color:#4a4a58;font-weight:700">FLAT · 62D</span></span>
|
||
</div>
|
||
|
||
<div style="padding:12px 16px;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:9px;letter-spacing:.14em;color:#4a4a58">+ 207 SEASON LINES · REPRICED ON NEWS · LAST REPRICE JUL 17 · 11:42 AM ET</span>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">EDGE = MODEL VS CURRENT · ODDS MARKETS GRADED ON FAIR PRICE</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- board mobile -->
|
||
<div data-screen-label="Season board · mobile" style="margin-top:44px">
|
||
<div style="display:flex;flex-wrap:wrap;gap:34px;justify-content:center;align-items:flex-start">
|
||
<div>
|
||
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S1-C · SEASON BOARD · 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">
|
||
<div style="display:flex;align-items:center;gap:9px">
|
||
<span class="mono" style="font-size:11px;color:#707080">◂</span>
|
||
<span class="mono" style="font-weight:800;font-size:11px;letter-spacing:.2em">NFL <span style="color:#707080;font-weight:600">· SEASON BOARD</span></span>
|
||
</div>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">214 LINES</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:6px;padding:9px 16px;border-bottom:1px solid #14141E">
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:6px;background:#14141E;border:1px solid #2A2A38;font-size:8.5px;letter-spacing:.1em;color:#F0F0F0;font-weight:700;flex:none">ALL</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">PASS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">RUSH/REC</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">WINS</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:6px;font-size:8.5px;letter-spacing:.1em;color:#707080;flex:none">AWARDS</span>
|
||
</div>
|
||
<div style="flex:1;overflow:hidden">
|
||
<!-- player group -->
|
||
<div style="display:flex;align-items:center;gap:8px;padding:12px 16px 6px">
|
||
<span style="width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#0B2265,#5a7fd4);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:8px;color:#cdd9ff;flex:none">MN</span>
|
||
<span style="font-size:13px;font-weight:700">Nabers</span>
|
||
<span class="mono" style="font-size:8px;color:#707080;letter-spacing:.08em">WR · NYG</span>
|
||
<span class="mono" style="margin-left:auto;display:inline-flex;align-items:center;gap:4px;height:16px;padding:0 6px;border-radius:4px;background:rgba(255,122,74,.09);border:1px solid rgba(255,122,74,.28);font-size:7.5px;letter-spacing:.12em;color:#FF7A4A;font-weight:700">BURNER</span>
|
||
</div>
|
||
<div style="padding:9px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55);display:flex;align-items:center;gap:10px">
|
||
<div style="flex:1;min-width:0">
|
||
<div style="font-size:12.5px;font-weight:600;color:#B8BCC8">Rec Yds</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.04em;color:#707080;margin-top:3px"><span style="color:#4a4a58">1,050.5</span> → <span style="color:#F0F0F0;font-weight:700;font-size:11px">1,120.5</span> · <span style="color:#00D4A0;font-weight:700">V 1,188</span></div>
|
||
</div>
|
||
<span class="mono" style="font-size:10px;font-weight:700;color:#00D4A0;flex:none">▲ +70</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.14);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.3);flex:none">A+</span>
|
||
</div>
|
||
<div style="padding:9px 16px;border-top:1px solid #101018;opacity:.85;display:flex;align-items:center;gap:10px">
|
||
<div style="flex:1;min-width:0">
|
||
<div style="font-size:12.5px;font-weight:500;color:#B8BCC8">Receptions</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.04em;color:#707080;margin-top:3px"><span style="color:#4a4a58">88.5</span> → <span style="color:#F0F0F0;font-weight:700;font-size:11px">92.5</span> · <span style="color:#00D4A0;font-weight:700">V 97.0</span></div>
|
||
</div>
|
||
<span class="mono" style="font-size:10px;font-weight:700;color:#B8BCC8;flex:none">▲ +4</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10px;border:1px solid #1E1E2A;flex:none">B</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:8px;padding:12px 16px 6px;border-top:1px solid #101018">
|
||
<span style="width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#00338D,#C60C30);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:8px;color:#bcd0ff;flex:none">JA</span>
|
||
<span style="font-size:13px;font-weight:700">Allen</span>
|
||
<span class="mono" style="font-size:8px;color:#707080;letter-spacing:.08em">QB · BUF</span>
|
||
<span class="mono" style="margin-left:auto;display:inline-flex;align-items:center;gap:4px;height:16px;padding:0 6px;border-radius:4px;background:rgba(217,164,65,.09);border:1px solid rgba(217,164,65,.28);font-size:7.5px;letter-spacing:.12em;color:#D9A441;font-weight:700">MAESTRO</span>
|
||
</div>
|
||
<div style="padding:9px 16px;border-top:1px solid #101018;opacity:.85;display:flex;align-items:center;gap:10px">
|
||
<div style="flex:1;min-width:0">
|
||
<div style="font-size:12.5px;font-weight:500;color:#B8BCC8">Pass + Rush TD</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.04em;color:#707080;margin-top:3px"><span style="color:#4a4a58">36.5</span> → <span style="color:#F0F0F0;font-weight:700;font-size:11px">37.5</span> · <span style="color:#00D4A0;font-weight:700">V 40.2</span></div>
|
||
</div>
|
||
<span class="mono" style="font-size:10px;font-weight:700;color:#B8BCC8;flex:none">▲ +1</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:rgba(0,212,160,.1);color:#00D4A0;font-weight:800;font-size:10px;border:1px solid rgba(0,212,160,.24);flex:none">A</span>
|
||
</div>
|
||
<div style="padding:9px 16px;border-top:1px solid #101018;opacity:.7;display:flex;align-items:center;gap:10px">
|
||
<div style="flex:1;min-width:0">
|
||
<div style="font-size:12.5px;font-weight:500;color:#B8BCC8">MVP <span class="mono" style="font-size:7.5px;color:#4a4a58;letter-spacing:.1em">FAIR PRICE</span></div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.04em;color:#707080;margin-top:3px"><span style="color:#4a4a58">+650</span> → <span style="color:#F0F0F0;font-weight:700;font-size:11px">+600</span> · <span style="color:#00D4A0;font-weight:700">V +490</span></div>
|
||
</div>
|
||
<span class="mono" style="font-size:10px;font-weight:700;color:#B8BCC8;flex:none">▲</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:#14141E;color:#F0F0F0;font-weight:800;font-size:10px;border:1px solid #1E1E2A;flex:none">B</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:8px;padding:12px 16px 6px;border-top:1px solid #101018">
|
||
<span class="mono" style="font-size:9px;letter-spacing:.2em;color:#F0F0F0;font-weight:700">TEAM WIN TOTALS</span>
|
||
</div>
|
||
<div style="padding:9px 16px;border-top:1px solid #101018;opacity:.85;display:flex;align-items:center;gap:10px">
|
||
<div style="flex:1;min-width:0">
|
||
<div style="font-size:12.5px;font-weight:500;color:#B8BCC8"><span style="display:inline-block;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#0076B6,#B0B7BC);vertical-align:-1px;margin-right:4px"></span>DET Wins</div>
|
||
<div class="mono" style="font-size:9px;letter-spacing:.04em;color:#707080;margin-top:3px"><span style="color:#4a4a58">10.5</span> → <span style="color:#F0F0F0;font-weight:700;font-size:11px">11.5</span> · <span style="color:#00D4A0;font-weight:700">V 11.9</span></div>
|
||
</div>
|
||
<span class="mono" style="font-size:10px;font-weight:700;color:#B8BCC8;flex:none">▲ +1</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;height:17px;padding:0 6px;border-radius:5px;background:#14141E;color:#B8BCC8;font-weight:800;font-size:10px;border:1px solid #1E1E2A;flex:none">C</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">Last reprice 11:42 AM — Nabers rec yds.</span>
|
||
</div>
|
||
</div>
|
||
</x-import>
|
||
</div>
|
||
|
||
<!-- reveal mobile -->
|
||
<div>
|
||
<div class="mono" style="font-size:10px;letter-spacing:.2em;color:#707080;margin-bottom:12px;text-align:center">S1-D · SEASON READ REVEAL · 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">◂ BOARD</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.16em;color:#707080">SEASON READ</span>
|
||
<span class="mono" style="font-size:11px;color:#707080">⋯</span>
|
||
</div>
|
||
<div style="flex:1;overflow:hidden;padding:18px 16px 0">
|
||
<div style="display:flex;align-items:center;gap:11px">
|
||
<span style="position:relative;width:44px;height:44px;border-radius:11px;background:linear-gradient(135deg,#0B2265,#5a7fd4);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:#cdd9ff;flex:none">MN<image-slot id="hs-nabers-m" shape="rounded" radius="11" style="position:absolute;inset:0" placeholder="Nabers headshot"></image-slot></span>
|
||
<div style="flex:1;min-width:0">
|
||
<div style="font-weight:700;font-size:16px">Malik Nabers</div>
|
||
<div class="mono" style="font-size:9px;color:#707080;letter-spacing:.08em;margin-top:2px">WR · NYG · <span style="color:#FF7A4A">BURNER</span></div>
|
||
</div>
|
||
<span class="mono" style="font-size:34px;font-weight:800;color:#00D4A0;text-shadow:0 0 22px rgba(0,212,160,.5);flex:none">A+</span>
|
||
</div>
|
||
<div style="font-size:14.5px;font-weight:700;margin-top:14px">Over 1,120.5 Receiving Yards <span style="color:#707080;font-weight:500">· 2026 season</span></div>
|
||
<!-- triplet band -->
|
||
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:12px;background:#1E1E2A;border:1px solid #1E1E2A;border-radius:10px;overflow:hidden">
|
||
<div style="background:#0E0E14;padding:10px 12px"><div class="mono" style="font-size:8px;letter-spacing:.16em;color:#707080;margin-bottom:4px">OPEN · MAR 4</div><div class="mono" style="font-size:15px;font-weight:700;color:#707080">1,050.5</div></div>
|
||
<div style="background:#0E0E14;padding:10px 12px"><div class="mono" style="font-size:8px;letter-spacing:.16em;color:#707080;margin-bottom:4px">NOW</div><div class="mono" style="font-size:15px;font-weight:800;color:#F0F0F0">1,120.5</div></div>
|
||
<div style="background:#0E0E14;padding:10px 12px"><div class="mono" style="font-size:8px;letter-spacing:.16em;color:#00D4A0;margin-bottom:4px">VYNDR</div><div class="mono" style="font-size:15px;font-weight:800;color:#00D4A0">1,188</div></div>
|
||
</div>
|
||
<!-- movement with news markers -->
|
||
<div style="margin-top:14px">
|
||
<svg width="100%" height="46" viewBox="0 0 358 46" preserveAspectRatio="none" style="display:block">
|
||
<polyline points="0,36 40,36 40,30 110,30 110,24 200,24 200,16 290,16 290,8 358,8" fill="none" stroke="#00D4A0" stroke-width="1.6" stroke-linejoin="round" opacity=".9"></polyline>
|
||
<polyline points="0,36 40,36 40,30 110,30 110,24 200,24 200,16 290,16 290,8 358,8 358,46 0,46" fill="rgba(0,212,160,.06)" stroke="none"></polyline>
|
||
<circle cx="40" cy="30" r="2.4" fill="#B8BCC8"></circle>
|
||
<circle cx="200" cy="16" r="2.4" fill="#B8BCC8"></circle>
|
||
<circle cx="290" cy="8" r="2.8" fill="#00D4A0" style="animation:vy-livedot 1.5s ease-in-out infinite"></circle>
|
||
</svg>
|
||
<div style="display:flex;align-items:center;justify-content:space-between;margin-top:4px">
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#4a4a58">MAR 12 · FA</span>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#4a4a58">APR 25 · DRAFT</span>
|
||
<span class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#00D4A0">JUL 16 · CLEARED</span>
|
||
</div>
|
||
</div>
|
||
<!-- season context -->
|
||
<div style="margin-top:14px;background:#0A0A10;border:1px solid #14141E;border-radius:10px;padding:12px 14px">
|
||
<div style="display:flex;align-items:center;gap:8px;margin-bottom:7px">
|
||
<span style="width:5px;height:5px;border-radius:50%;background:#00D4A0"></span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.22em;color:#B8BCC8">VYNDR INTELLIGENCE</span>
|
||
</div>
|
||
<p style="font-size:11.5px;line-height:1.5;color:#B8BCC8">Pre-injury target share <span class="mono" style="color:#F0F0F0">28%</span> with no added competition. Market repriced the clearance <span class="mono" style="color:#00D4A0">+70</span> but still carries the injury discount — on current form the number is <span class="mono" style="color:#00D4A0">68</span> yards light.</p>
|
||
</div>
|
||
<!-- what would change this read -->
|
||
<div style="margin-top:12px">
|
||
<div class="mono" style="font-size:8.5px;letter-spacing:.2em;color:#707080;margin-bottom:7px">WHAT WOULD CHANGE THIS READ</div>
|
||
<div style="display:flex;align-items:center;gap:8px;padding:7px 0;border-top:1px solid #101018"><span class="mono" style="font-size:10px;color:#FF4757;flex:none">▼</span><span style="font-size:11px;color:#B8BCC8;flex:1">Soft-tissue setback in camp</span><span class="mono" style="font-size:8px;color:#4a4a58;letter-spacing:.1em">RE-GRADE ≤ B</span></div>
|
||
<div style="display:flex;align-items:center;gap:8px;padding:7px 0;border-top:1px solid #101018"><span class="mono" style="font-size:10px;color:#FF4757;flex:none">▼</span><span style="font-size:11px;color:#B8BCC8;flex:1">QB room change before Week 1</span><span class="mono" style="font-size:8px;color:#4a4a58;letter-spacing:.1em">RE-RUN MODEL</span></div>
|
||
<div style="display:flex;align-items:center;gap:8px;padding:7px 0;border-top:1px solid #101018"><span class="mono" style="font-size:10px;color:#B8BCC8;flex:none">▲</span><span style="font-size:11px;color:#B8BCC8;flex:1">Slot usage in preseason installs</span><span class="mono" style="font-size:8px;color:#4a4a58;letter-spacing:.1em">MODEL ↑</span></div>
|
||
</div>
|
||
</div>
|
||
<div style="padding:10px 16px 14px">
|
||
<div class="mono" style="font-size:7.5px;letter-spacing:.1em;color:#4a4a58;text-align:center;margin-bottom:8px">MODEL RUN JUL 17 · 6:00 AM ET · SETTLES WK 18 · CLV TRACKED FROM LOCK</div>
|
||
<div style="display:flex;gap:10px">
|
||
<span class="mono" style="flex:1;display:inline-flex;align-items:center;justify-content:center;height:44px;border-radius:11px;background:#00D4A0;color:#06060B;font-weight:800;font-size:11px;letter-spacing:.14em">LOCK THE READ</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;justify-content:center;height:44px;width:88px;border-radius:11px;background:#14141E;border:1px solid #2A2A38;color:#B8BCC8;font-weight:700;font-size:10px;letter-spacing:.12em">SHOP ▸</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</x-import>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============ ACT 03 · SEASON READ REVEAL · DESKTOP ============ -->
|
||
<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">SEASON READ REVEAL</div><div style="font-size:12.5px;color:#707080;margin-top:5px">The grade reveal at a season horizon — no "tonight." News-driven factors, movement annotated with events, and what would change the read.</div></div>
|
||
</div>
|
||
|
||
<div id="reveal" data-screen-label="Season reveal · desktop" style="margin-top:44px">
|
||
<div style="display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start">
|
||
<div style="position:relative;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),inset 0 1px 0 rgba(255,255,255,.05);animation:vy-arrive .7s cubic-bezier(.2,.8,.2,1) both">
|
||
<div style="position:relative;padding:22px 24px">
|
||
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px">
|
||
<span class="mono" style="font-size:10.5px;letter-spacing:.28em;color:#707080">SEASON READ · 2026 · NFL</span>
|
||
<span class="mono" style="font-size:10px;letter-spacing:.18em;color:#00D4A0">CLV TRACKED FROM LOCK</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:20px">
|
||
<div style="display:flex;flex-direction:column;align-items:center;gap:6px">
|
||
<div class="mono" style="font-size:82px;line-height:.82;font-weight:800;color:#00D4A0;text-shadow:0 0 34px rgba(0,212,160,.5)">A+</div>
|
||
<div class="mono" style="font-size:9.5px;letter-spacing:.24em;color:#707080">TIER</div>
|
||
</div>
|
||
<div style="flex:1;min-width:0">
|
||
<div style="display:flex;align-items:center;gap:10px;margin-bottom:8px">
|
||
<span style="position:relative;width:38px;height:38px;border-radius:9px;background:linear-gradient(135deg,#0B2265,#5a7fd4);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#cdd9ff">MN<image-slot id="hs-nabers-d" shape="rounded" radius="9" style="position:absolute;inset:0" placeholder="Nabers headshot"></image-slot></span>
|
||
<div>
|
||
<div style="font-weight:700;font-size:16px;line-height:1.1">Malik Nabers</div>
|
||
<div class="mono" style="font-size:10.5px;color:#707080;letter-spacing:.08em">WR · NYG · <span style="color:#FF7A4A">BURNER</span></div>
|
||
</div>
|
||
</div>
|
||
<div style="font-size:15px;font-weight:600;line-height:1.35">Over 1,120.5 Receiving Yards <span style="color:#707080;font-weight:500">· season</span></div>
|
||
<div style="margin-top:12px">
|
||
<svg width="100%" height="40" viewBox="0 0 420 40" preserveAspectRatio="none" style="display:block">
|
||
<polyline points="0,32 48,32 48,27 130,27 130,21 236,21 236,14 340,14 340,7 420,7" fill="none" stroke="#00D4A0" stroke-width="1.6" stroke-linejoin="round" opacity=".9"></polyline>
|
||
<polyline points="0,32 48,32 48,27 130,27 130,21 236,21 236,14 340,14 340,7 420,7 420,40 0,40" fill="rgba(0,212,160,.07)" stroke="none"></polyline>
|
||
<circle cx="48" cy="27" r="2.4" fill="#B8BCC8"></circle>
|
||
<circle cx="236" cy="14" r="2.4" fill="#B8BCC8"></circle>
|
||
<circle cx="340" cy="7" r="2.8" fill="#00D4A0" style="animation:vy-livedot 1.5s ease-in-out infinite"></circle>
|
||
</svg>
|
||
<div style="display:flex;align-items:center;justify-content:space-between;margin-top:4px">
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#4a4a58">OPEN 1,050.5 · MAR 4</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#4a4a58">MAR 12 FA · APR 25 DRAFT</span>
|
||
<span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#00D4A0">JUL 16 CLEARED · NOW 1,120.5</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:20px;background:#1E1E2A;border:1px solid #1E1E2A;border-radius:10px;overflow:hidden">
|
||
<div style="background:#0E0E14;padding:12px 14px"><div class="mono" style="font-size:9.5px;letter-spacing:.18em;color:#707080;margin-bottom:6px">OPEN</div><div class="mono" style="font-size:20px;font-weight:700;color:#707080">1,050.5</div></div>
|
||
<div style="background:#0E0E14;padding:12px 14px"><div class="mono" style="font-size:9.5px;letter-spacing:.18em;color:#707080;margin-bottom:6px">NOW</div><div class="mono" data-react data-fmt="line" style="font-size:20px;font-weight:800;color:#F0F0F0;padding:1px 4px;border-radius:5px">1,120.5</div></div>
|
||
<div style="background:#0E0E14;padding:12px 14px"><div class="mono" style="font-size:9.5px;letter-spacing:.18em;color:#00D4A0;margin-bottom:6px">VYNDR</div><div class="mono" style="font-size:20px;font-weight:800;color:#00D4A0">1,188</div></div>
|
||
</div>
|
||
<div style="margin-top:16px;background:#0A0A10;border:1px solid #14141E;border-radius:10px;padding:14px 16px">
|
||
<div style="display:flex;align-items:center;gap:8px;margin-bottom:8px">
|
||
<span style="width:5px;height:5px;border-radius:50%;background:#00D4A0"></span>
|
||
<span class="mono" style="font-size:9.5px;letter-spacing:.24em;color:#B8BCC8">VYNDR INTELLIGENCE</span>
|
||
</div>
|
||
<p style="font-size:12.5px;line-height:1.5;color:#B8BCC8">On current form: pre-injury target share <span class="mono" style="color:#F0F0F0">28%</span>, no added target competition, QB continuity intact. The market repriced the clearance <span class="mono" style="color:#00D4A0">+70</span> yards but still carries last season's injury discount. Our season sim puts the number <span class="mono" style="color:#00D4A0">68</span> yards light — the news, not the noise, moved this line.</p>
|
||
</div>
|
||
<div class="mono" style="margin-top:14px;font-size:8.5px;letter-spacing:.12em;color:#4a4a58">MODEL RUN JUL 17 · 6:00 AM ET · SETTLES WK 18 · JAN 3 2027 · NO "TONIGHT" ON A SEASON READ</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- factors + change-the-read -->
|
||
<div style="display:flex;flex-direction:column;gap:16px">
|
||
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;overflow:hidden">
|
||
<div style="padding:14px 16px 12px"><span class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">NEWS-DRIVEN FACTORS</span></div>
|
||
<div style="height:1px;background:#14141E"></div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58;width:44px;flex:none">JUL 16</span><span style="font-size:11.5px;color:#B8BCC8;flex:1">Cleared for camp — no restrictions</span><span class="mono" style="font-size:9.5px;color:#00D4A0;font-weight:700">MODEL ▲</span></div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.86"><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58;width:44px;flex:none">APR 25</span><span style="font-size:11.5px;color:#B8BCC8;flex:1">No WR drafted in first four rounds</span><span class="mono" style="font-size:9.5px;color:#00D4A0;font-weight:700">MODEL ▲</span></div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px;opacity:.64"><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58;width:44px;flex:none">MAR 12</span><span style="font-size:11.5px;color:#B8BCC8;flex:1">O-line additions in free agency</span><span class="mono" style="font-size:9.5px;color:#B8BCC8;font-weight:700">NEUTRAL</span></div>
|
||
</div>
|
||
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;overflow:hidden">
|
||
<div style="padding:14px 16px 12px"><span class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700">WHAT WOULD CHANGE THIS READ</span></div>
|
||
<div style="height:1px;background:#14141E"></div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:11px;color:#FF4757;flex:none">▼</span><span style="font-size:11.5px;color:#B8BCC8;flex:1">Soft-tissue setback in camp</span><span class="mono" style="font-size:8px;color:#4a4a58;letter-spacing:.1em">RE-GRADE ≤ B</span></div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:11px;color:#FF4757;flex:none">▼</span><span style="font-size:11.5px;color:#B8BCC8;flex:1">QB room change before Week 1</span><span class="mono" style="font-size:8px;color:#4a4a58;letter-spacing:.1em">RE-RUN MODEL</span></div>
|
||
<div style="padding:11px 16px;border-top:1px solid #101018;display:flex;align-items:center;gap:10px"><span class="mono" style="font-size:11px;color:#B8BCC8;flex:none">▲</span><span style="font-size:11.5px;color:#B8BCC8;flex:1">Heavy slot usage in preseason installs</span><span class="mono" style="font-size:8px;color:#4a4a58;letter-spacing:.1em">MODEL ↑</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">EVERY SEASON READ NAMES ITS KILL CONDITIONS — HONESTY IS THE PRODUCT</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============ ACT 04 · NEWS / OUTLOOK FEED ============ -->
|
||
<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">NEWS / OUTLOOK FEED</div><div style="font-size:12.5px;color:#707080;margin-top:5px">Event → affected entities → line impact → article. One anatomy, reused in the hub, the reveal, and /blog.</div></div>
|
||
</div>
|
||
|
||
<div data-screen-label="News feed + anatomy" style="margin-top:44px;display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start">
|
||
<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">THE FEED · NFL</span>
|
||
<span class="mono" style="font-size:9px;letter-spacing:.14em;color:#707080">EVENTS THAT MOVED OUTLOOKS ONLY</span>
|
||
</div>
|
||
<div style="height:1px;background:#14141E"></div>
|
||
<div style="padding:9px 16px 5px"><span class="mono" style="font-size:8.5px;letter-spacing:.2em;color:#4a4a58">TODAY · JUL 17</span></div>
|
||
<div style="--o:1;opacity:1;padding:12px 16px;border-top:1px solid #101018;box-shadow:inset 2px 0 0 rgba(0,212,160,.55)">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">11:42 AM</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:8px;letter-spacing:.14em;color:#B8BCC8">CLEARED</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58">SOURCE · TEAM REPORT</span></div>
|
||
<div style="font-size:14px;font-weight:700;margin-top:6px;line-height:1.35">Nabers cleared for camp with no restrictions — the injury discount is now the market's mistake</div>
|
||
<div style="display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;letter-spacing:.08em;color:#B8BCC8"><span style="width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#0B2265,#5a7fd4)"></span>NYG</span>
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;letter-spacing:.08em;color:#B8BCC8">M. NABERS</span>
|
||
<span class="mono" style="font-size:9.5px;color:#707080">REC YDS <span style="color:#4a4a58">1,050.5</span> → <span style="color:#F0F0F0;font-weight:700">1,120.5</span> · <span style="color:#00D4A0">V 1,188</span></span>
|
||
<a href="Vyndr Intelligence.dc.html#articles" class="mono" style="margin-left:auto;font-size:9px;letter-spacing:.14em">FULL ARTICLE ▸</a>
|
||
</div>
|
||
</div>
|
||
<div style="--o:.86;opacity:.86;padding:12px 16px;border-top:1px solid #101018">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">10:15 AM</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:8px;letter-spacing:.14em;color:#B8BCC8">CAMP REPORT</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58">SOURCE · BEAT POOL</span></div>
|
||
<div style="font-size:14px;font-weight:600;margin-top:6px;line-height:1.35">Worthy running clear WR1 reps in KC installs</div>
|
||
<div style="display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;letter-spacing:.08em;color:#B8BCC8"><span style="width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#E31837,#FFB81C)"></span>KC</span>
|
||
<span class="mono" style="font-size:9.5px;color:#707080">REC YDS <span style="color:#4a4a58">990.5</span> → <span style="color:#F0F0F0;font-weight:700">1,024.5</span> · <span style="color:#00D4A0">V 1,061</span></span>
|
||
<span class="mono" style="margin-left:auto;font-size:9px;letter-spacing:.14em;color:#4a4a58">FULL ARTICLE ▸</span>
|
||
</div>
|
||
</div>
|
||
<div style="--o:.7;opacity:.7;padding:12px 16px;border-top:1px solid #101018">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">9:30 AM</span><span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:rgba(255,179,71,.08);border:1px solid rgba(255,179,71,.25);font-size:8px;letter-spacing:.14em;color:#FFB347">CONTRACT</span><span class="mono" style="font-size:8px;letter-spacing:.1em;color:#4a4a58">SOURCE · LEAGUE FILING</span></div>
|
||
<div style="font-size:14px;font-weight:600;margin-top:6px;line-height:1.35">Higgins restructure keeps the WR2 in stripes — Burrow's ceiling holds</div>
|
||
<div style="display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;letter-spacing:.08em;color:#B8BCC8"><span style="width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#FB4F14,#1a1a1a)"></span>CIN</span>
|
||
<span class="mono" style="font-size:9.5px;color:#707080">PASS TD <span style="color:#4a4a58">27.5</span> → <span style="color:#F0F0F0;font-weight:700">28.5</span> · <span style="color:#00D4A0">V 29.8</span></span>
|
||
<span class="mono" style="margin-left:auto;font-size:9px;letter-spacing:.14em;color:#4a4a58">FULL ARTICLE ▸</span>
|
||
</div>
|
||
</div>
|
||
<div style="padding:9px 16px 5px;border-top:1px solid #101018"><span class="mono" style="font-size:8.5px;letter-spacing:.2em;color:#4a4a58">WED · JUL 16</span></div>
|
||
<div style="--o:.55;opacity:.55;padding:12px 16px;border-top:1px solid #101018">
|
||
<div style="display:flex;align-items:center;gap:8px"><span class="mono" style="font-size:8.5px;letter-spacing:.12em;color:#707080">4:40 PM</span><span class="mono" style="display:inline-flex;align-items:center;height:15px;padding:0 6px;border-radius:4px;background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.25);font-size:8px;letter-spacing:.14em;color:#FF4757">INJURY</span></div>
|
||
<div style="font-size:14px;font-weight:600;margin-top:6px;line-height:1.35">Kincaid tweaks hamstring in conditioning — monitoring, not moving</div>
|
||
<div style="display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap">
|
||
<span class="mono" style="display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:6px;background:#14141E;border:1px solid #1E1E2A;font-size:9px;letter-spacing:.08em;color:#B8BCC8"><span style="width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#00338D,#C60C30)"></span>BUF</span>
|
||
<span class="mono" style="font-size:9.5px;color:#707080">REC YDS <span style="color:#F0F0F0;font-weight:700">625.5</span> · <span style="color:#707080">HELD · WATCHING</span></span>
|
||
</div>
|
||
</div>
|
||
<!-- honest empty -->
|
||
<div style="margin:14px 16px 16px;border:1px dashed #1E1E2A;border-radius:10px;padding:16px;text-align:center">
|
||
<div class="mono" style="font-size:9px;letter-spacing:.22em;color:#707080">QUIET WIRE</div>
|
||
<div style="font-size:12px;color:#707080;margin-top:6px">No outlook-moving news since 11:42 AM. We don't manufacture movement.</div>
|
||
<div class="mono" style="font-size:8px;letter-spacing:.12em;color:#4a4a58;margin-top:6px">EMPTY STATE · RENDERS WHEN A DAY HAS NO EVENTS</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- anatomy spec -->
|
||
<div style="border-radius:12px;background:#0E0E14;border:1px solid #1E1E2A;padding:16px">
|
||
<div class="mono" style="font-size:10.5px;letter-spacing:.24em;color:#F0F0F0;font-weight:700;margin-bottom:12px">ROW ANATOMY</div>
|
||
<div style="display:flex;flex-direction:column;gap:10px">
|
||
<div style="display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:9px;color:#00D4A0;width:18px;flex:none">1</span><div><div class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#B8BCC8">TIME + EVENT TAG + SOURCE</div><div style="font-size:11px;color:#707080;margin-top:2px">Tag color = meaning: neutral grey, CONTRACT amber, INJURY red. Never green — green is edge only.</div></div></div>
|
||
<div style="display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:9px;color:#00D4A0;width:18px;flex:none">2</span><div><div class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#B8BCC8">HEADLINE</div><div style="font-size:11px;color:#707080;margin-top:2px">Editorial voice — states what happened and why the desk cares. Weight 700 only when the event repriced a line.</div></div></div>
|
||
<div style="display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:9px;color:#00D4A0;width:18px;flex:none">3</span><div><div class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#B8BCC8">AFFECTED CHIPS</div><div style="font-size:11px;color:#707080;margin-top:2px">Existing TeamChip + player chips. Tap target ≥ 44px on mobile.</div></div></div>
|
||
<div style="display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:9px;color:#00D4A0;width:18px;flex:none">4</span><div><div class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#B8BCC8">LINE IMPACT</div><div style="font-size:11px;color:#707080;margin-top:2px">old → new · VYNDR model. FLAT + HELD are honest values — a non-move is information.</div></div></div>
|
||
<div style="display:flex;gap:10px;align-items:baseline"><span class="mono" style="font-size:9px;color:#00D4A0;width:18px;flex:none">5</span><div><div class="mono" style="font-size:9.5px;letter-spacing:.14em;color:#B8BCC8">FULL ARTICLE ▸</div><div style="font-size:11px;color:#707080;margin-top:2px">Present only when an article exists. No dead links, no "coming soon."</div></div></div>
|
||
</div>
|
||
<div style="margin-top:14px;padding-top:12px;border-top:1px solid #14141E">
|
||
<div class="mono" style="font-size:8.5px;letter-spacing:.14em;color:#4a4a58;line-height:1.7">REUSED IN · HUB "WHAT CHANGED TODAY" · REVEAL FACTORS · /BLOG FEED · THE REPORT EMAIL</div>
|
||
</div>
|
||
</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">HUB HOME · SEASON BOARD · SEASON REVEAL · THE FEED · NFL + NBA · DESKTOP + 390</span>
|
||
<span class="mono" style="font-size:10px;letter-spacing:.16em;color:#00D4A0">VYNDR · SESSION 2 · SURFACE 1</span>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</x-dc>
|
||
<script type="text/x-dc" data-dc-script data-props="{"motion":{"editor":"boolean","default":true,"tsType":"boolean","section":"Behavior"},"reactions":{"editor":"boolean","default":true,"tsType":"boolean","section":"Behavior"}}">
|
||
class Component extends DCLogic {
|
||
renderVals() {
|
||
const kick = Math.max(0, Math.ceil((new Date('2026-09-10T13:00:00-04:00') - Date.now()) / 864e5));
|
||
return {
|
||
rootRef: (n) => { this.rootNode = n; },
|
||
kickoffDays: String(kick),
|
||
stillClass: (this.props.motion ?? true) ? '' : 'vy-still'
|
||
};
|
||
}
|
||
componentDidMount() {
|
||
this._t = [];
|
||
const tick = () => {
|
||
const now = new Date();
|
||
const s = now.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 = [
|
||
'Nabers 1,050.5 → 1,120.5 on camp clearance. Grade holds A+.',
|
||
'Worthy rec yds repriced +34.0 on WR1 camp reps.',
|
||
'KC win total: market 11.5, model 10.8 — under lean logged.',
|
||
'NBA · Wemby MVP steams +420 → +330 since June.',
|
||
'Summer League stays ungraded — low-signal market refused.',
|
||
'214 NFL season lines live · last reprice 11:42 AM ET.'
|
||
];
|
||
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));
|
||
|
||
// reactions: gated post-boot, fire on "data events" only
|
||
const fmt = {
|
||
line: v => v.toLocaleString('en-US', { minimumFractionDigits: 1, maximumFractionDigits: 1 }),
|
||
half: v => v.toFixed(1),
|
||
edge: v => (v >= 0 ? '+' : '') + v.toFixed(1) + '%',
|
||
odds: v => (v >= 0 ? '+' : '') + Math.round(v),
|
||
int: v => String(Math.round(v))
|
||
};
|
||
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') || 'half';
|
||
let v = parseFloat(el.textContent.replace(/[,%+]/g, ''));
|
||
if (isNaN(v)) return;
|
||
let up;
|
||
if (f === 'edge') { const d = (Math.random() - .45) * .3; up = d >= 0; v += d; }
|
||
else if (f === 'odds') { const d = Math.random() < .5 ? -25 : 25; up = d < 0; v += d; }
|
||
else { const step = f === 'line' && v > 500 ? (Math.random() < .5 ? -1 : 1) * (Math.random() < .7 ? 1 : 2) : (Math.random() < .5 ? -.5 : .5); up = step > 0; v += step; }
|
||
el.textContent = fmt[f] ? fmt[f](v) : 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, 5200)); }, 1800));
|
||
|
||
// scroll reveal
|
||
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>
|