{
 "cover_html": "<!doctype html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<title>329 orbital launches in 2025</title>\n<!--\n  Live Card template: one file is both the still and the motion. Render it with render_live_card at 1080 x 1440,\n  3000 ms, 30 fps, cover_ms 2900. Every move ends by 2.0 s, so the last second (and the still) is the full card.\n  To reuse it, change the words, the --n count in @keyframes count, and each bar's --v (its share of the tallest bar).\n-->\n<style>\n  @property --n { syntax: \"<integer>\"; inherits: false; initial-value: 0; }\n  :root {\n    --paper: #f4efe6; --ink: #1c1a17; --muted: #6b645a; --line: #ddd5c7; --bar: #d9cfbf; --accent: #e8590c;\n    --enter: cubic-bezier(0.23, 1, 0.32, 1); --travel: cubic-bezier(0.77, 0, 0.175, 1);\n  }\n  * { box-sizing: border-box; margin: 0; }\n  body { width: 1080px; height: 1440px; overflow: hidden; background: var(--paper); color: var(--ink); font-family: Inter, \"Noto Color Emoji\", system-ui, sans-serif; }\n  .card { position: relative; height: 100%; padding: 84px 80px 72px; display: flex; flex-direction: column; }\n  .top { display: flex; justify-content: space-between; align-items: center; font-size: 22px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; }\n  .kicker { color: var(--accent); }\n  .chip { color: var(--muted); border: 2px solid var(--line); border-radius: 999px; padding: 8px 18px; letter-spacing: 0.08em; }\n  h1 { margin-top: 44px; font-size: 64px; line-height: 1.04; font-weight: 750; letter-spacing: -0.035em; max-width: 860px; }\n  .sub { margin-top: 22px; font-size: 28px; line-height: 1.4; color: var(--muted); max-width: 820px; }\n  .hero { margin-top: 44px; display: flex; align-items: flex-end; justify-content: space-between; }\n  .num { font-size: 210px; line-height: 0.82; font-weight: 800; letter-spacing: -0.05em; color: var(--accent); font-variant-numeric: tabular-nums; counter-reset: n var(--n); animation: count 1.7s cubic-bezier(0.45, 0, 0.25, 1) 0.15s both; }\n  .num::after { content: counter(n); }\n  @keyframes count { from { --n: 87; } to { --n: 329; } }\n  .unit { margin-top: 18px; font-size: 30px; font-weight: 600; }\n  .unit span { display: block; color: var(--muted); font-weight: 500; font-size: 26px; margin-top: 6px; }\n  .rocket { font-size: 230px; line-height: 1; margin: 0 6px 60px 0; animation: lift 1.6s var(--travel) 0.1s both; }\n  @keyframes lift { from { transform: translate(-60px, 120px) rotate(0deg); opacity: 0; } 30% { opacity: 1; } to { transform: translate(0, 0); } }\n  .chart { position: relative; margin-top: auto; height: 520px; display: grid; grid-template-columns: repeat(11, 1fr); gap: 18px; align-items: end; border-bottom: 3px solid var(--ink); }\n  .bar { position: relative; height: calc(var(--v) * 100%); background: var(--bar); border-radius: 10px 10px 0 0; animation: grow 0.9s var(--enter) both; animation-delay: calc(0.25s + var(--i) * 0.07s); }\n  .bar.now { background: var(--accent); }\n  .bar b { position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%); font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }\n  .bar.now b { color: var(--accent); }\n  @keyframes grow { from { height: 0; } }\n  .bar b { animation: show 0.4s var(--enter) both; animation-delay: calc(0.9s + var(--i) * 0.07s); }\n  .years { display: grid; grid-template-columns: repeat(11, 1fr); gap: 18px; margin-top: 14px; font-size: 21px; color: var(--muted); text-align: center; font-variant-numeric: tabular-nums; }\n  .years .now { color: var(--ink); font-weight: 700; }\n  .foot { margin-top: 40px; padding-top: 22px; border-top: 2px solid var(--line); display: flex; justify-content: space-between; gap: 32px; font-size: 19px; line-height: 1.45; color: var(--muted); }\n  .foot strong { color: var(--ink); font-weight: 600; }\n  .made { white-space: nowrap; }\n  .fade { animation: fade 0.5s var(--enter) both; }\n  @keyframes fade { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }\n  @keyframes show { from { opacity: 0; } }\n</style>\n</head>\n<body>\n<main class=\"card\">\n  <div class=\"top\"><span class=\"kicker\">Spaceflight</span><span class=\"chip\">2015 to 2025</span></div>\n  <h1>A rocket now heads to orbit almost every day</h1>\n  <p class=\"sub\">Orbital launch attempts worldwide, per year. SpaceX flew 170 of the 329 in 2025.</p>\n  <div class=\"hero\">\n    <div>\n      <div class=\"num\" aria-label=\"329\"></div>\n      <p class=\"unit\">launches in 2025<span>up from 87 in 2015</span></p>\n    </div>\n    <div class=\"rocket\" aria-hidden=\"true\">🚀</div>\n  </div>\n  <div class=\"chart\" role=\"img\" aria-label=\"Bar chart: 87 in 2015, 85, 90, 114, 102, 114, 146, 186, 223, 262 and 329 in 2025\">\n    <div class=\"bar\" style=\"--v:0.264;--i:0\"><b>87</b></div>\n    <div class=\"bar\" style=\"--v:0.258;--i:1\"></div>\n    <div class=\"bar\" style=\"--v:0.274;--i:2\"></div>\n    <div class=\"bar\" style=\"--v:0.347;--i:3\"></div>\n    <div class=\"bar\" style=\"--v:0.310;--i:4\"></div>\n    <div class=\"bar\" style=\"--v:0.347;--i:5\"></div>\n    <div class=\"bar\" style=\"--v:0.444;--i:6\"></div>\n    <div class=\"bar\" style=\"--v:0.565;--i:7\"></div>\n    <div class=\"bar\" style=\"--v:0.678;--i:8\"></div>\n    <div class=\"bar\" style=\"--v:0.796;--i:9\"><b>262</b></div>\n    <div class=\"bar now\" style=\"--v:1;--i:10\"><b>329</b></div>\n  </div>\n  <div class=\"years\"><span>'15</span><span>'16</span><span>'17</span><span>'18</span><span>'19</span><span>'20</span><span>'21</span><span>'22</span><span>'23</span><span>'24</span><span class=\"now\">'25</span></div>\n  <footer class=\"foot fade\" style=\"animation-delay:1.2s\">\n    <p><strong>Source:</strong> Jonathan McDowell, Jonathan's Space Report, orbital launch attempts (tab1a), updated 30 Sep 2026. Counts include failed launches.</p>\n    <p class=\"made\">Made with Live Card</p>\n  </footer>\n</main>\n</body>\n</html>\n",
 "motion_html": "<!doctype html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<title>329 orbital launches in 2025</title>\n<!--\n  Live Card template: one file is both the still and the motion. Render it with render_live_card at 1080 x 1440,\n  3000 ms, 30 fps, cover_ms 2900. Every move ends by 2.0 s, so the last second (and the still) is the full card.\n  To reuse it, change the words, the --n count in @keyframes count, and each bar's --v (its share of the tallest bar).\n-->\n<style>\n  @property --n { syntax: \"<integer>\"; inherits: false; initial-value: 0; }\n  :root {\n    --paper: #f4efe6; --ink: #1c1a17; --muted: #6b645a; --line: #ddd5c7; --bar: #d9cfbf; --accent: #e8590c;\n    --enter: cubic-bezier(0.23, 1, 0.32, 1); --travel: cubic-bezier(0.77, 0, 0.175, 1);\n  }\n  * { box-sizing: border-box; margin: 0; }\n  body { width: 1080px; height: 1440px; overflow: hidden; background: var(--paper); color: var(--ink); font-family: Inter, \"Noto Color Emoji\", system-ui, sans-serif; }\n  .card { position: relative; height: 100%; padding: 84px 80px 72px; display: flex; flex-direction: column; }\n  .top { display: flex; justify-content: space-between; align-items: center; font-size: 22px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; }\n  .kicker { color: var(--accent); }\n  .chip { color: var(--muted); border: 2px solid var(--line); border-radius: 999px; padding: 8px 18px; letter-spacing: 0.08em; }\n  h1 { margin-top: 44px; font-size: 64px; line-height: 1.04; font-weight: 750; letter-spacing: -0.035em; max-width: 860px; }\n  .sub { margin-top: 22px; font-size: 28px; line-height: 1.4; color: var(--muted); max-width: 820px; }\n  .hero { margin-top: 44px; display: flex; align-items: flex-end; justify-content: space-between; }\n  .num { font-size: 210px; line-height: 0.82; font-weight: 800; letter-spacing: -0.05em; color: var(--accent); font-variant-numeric: tabular-nums; counter-reset: n var(--n); animation: count 1.7s cubic-bezier(0.45, 0, 0.25, 1) 0.15s both; }\n  .num::after { content: counter(n); }\n  @keyframes count { from { --n: 87; } to { --n: 329; } }\n  .unit { margin-top: 18px; font-size: 30px; font-weight: 600; }\n  .unit span { display: block; color: var(--muted); font-weight: 500; font-size: 26px; margin-top: 6px; }\n  .rocket { font-size: 230px; line-height: 1; margin: 0 6px 60px 0; animation: lift 1.6s var(--travel) 0.1s both; }\n  @keyframes lift { from { transform: translate(-60px, 120px) rotate(0deg); opacity: 0; } 30% { opacity: 1; } to { transform: translate(0, 0); } }\n  .chart { position: relative; margin-top: auto; height: 520px; display: grid; grid-template-columns: repeat(11, 1fr); gap: 18px; align-items: end; border-bottom: 3px solid var(--ink); }\n  .bar { position: relative; height: calc(var(--v) * 100%); background: var(--bar); border-radius: 10px 10px 0 0; animation: grow 0.9s var(--enter) both; animation-delay: calc(0.25s + var(--i) * 0.07s); }\n  .bar.now { background: var(--accent); }\n  .bar b { position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%); font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }\n  .bar.now b { color: var(--accent); }\n  @keyframes grow { from { height: 0; } }\n  .bar b { animation: show 0.4s var(--enter) both; animation-delay: calc(0.9s + var(--i) * 0.07s); }\n  .years { display: grid; grid-template-columns: repeat(11, 1fr); gap: 18px; margin-top: 14px; font-size: 21px; color: var(--muted); text-align: center; font-variant-numeric: tabular-nums; }\n  .years .now { color: var(--ink); font-weight: 700; }\n  .foot { margin-top: 40px; padding-top: 22px; border-top: 2px solid var(--line); display: flex; justify-content: space-between; gap: 32px; font-size: 19px; line-height: 1.45; color: var(--muted); }\n  .foot strong { color: var(--ink); font-weight: 600; }\n  .made { white-space: nowrap; }\n  .fade { animation: fade 0.5s var(--enter) both; }\n  @keyframes fade { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }\n  @keyframes show { from { opacity: 0; } }\n</style>\n</head>\n<body>\n<main class=\"card\">\n  <div class=\"top\"><span class=\"kicker\">Spaceflight</span><span class=\"chip\">2015 to 2025</span></div>\n  <h1>A rocket now heads to orbit almost every day</h1>\n  <p class=\"sub\">Orbital launch attempts worldwide, per year. SpaceX flew 170 of the 329 in 2025.</p>\n  <div class=\"hero\">\n    <div>\n      <div class=\"num\" aria-label=\"329\"></div>\n      <p class=\"unit\">launches in 2025<span>up from 87 in 2015</span></p>\n    </div>\n    <div class=\"rocket\" aria-hidden=\"true\">🚀</div>\n  </div>\n  <div class=\"chart\" role=\"img\" aria-label=\"Bar chart: 87 in 2015, 85, 90, 114, 102, 114, 146, 186, 223, 262 and 329 in 2025\">\n    <div class=\"bar\" style=\"--v:0.264;--i:0\"><b>87</b></div>\n    <div class=\"bar\" style=\"--v:0.258;--i:1\"></div>\n    <div class=\"bar\" style=\"--v:0.274;--i:2\"></div>\n    <div class=\"bar\" style=\"--v:0.347;--i:3\"></div>\n    <div class=\"bar\" style=\"--v:0.310;--i:4\"></div>\n    <div class=\"bar\" style=\"--v:0.347;--i:5\"></div>\n    <div class=\"bar\" style=\"--v:0.444;--i:6\"></div>\n    <div class=\"bar\" style=\"--v:0.565;--i:7\"></div>\n    <div class=\"bar\" style=\"--v:0.678;--i:8\"></div>\n    <div class=\"bar\" style=\"--v:0.796;--i:9\"><b>262</b></div>\n    <div class=\"bar now\" style=\"--v:1;--i:10\"><b>329</b></div>\n  </div>\n  <div class=\"years\"><span>'15</span><span>'16</span><span>'17</span><span>'18</span><span>'19</span><span>'20</span><span>'21</span><span>'22</span><span>'23</span><span>'24</span><span class=\"now\">'25</span></div>\n  <footer class=\"foot fade\" style=\"animation-delay:1.2s\">\n    <p><strong>Source:</strong> Jonathan McDowell, Jonathan's Space Report, orbital launch attempts (tab1a), updated 30 Sep 2026. Counts include failed launches.</p>\n    <p class=\"made\">Made with Live Card</p>\n  </footer>\n</main>\n</body>\n</html>\n",
 "width": 1080,
 "height": 1440,
 "duration_ms": 3000,
 "fps": 30,
 "cover_ms": 2900
}
