PageSourceSearch

https://www.timeitt.com/home

html timeitt.com collected 2026-10-02 01:46:13 UTC 80,727 bytes, 514 lines download raw bytes

1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/><link rel="stylesheet" href="/_next/static/css/65559c6c59d4ee8a.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-2cd8219c1aa51a4f.js"/>
1<script src="/_next/static/chunks/4bd1b696-2b8703bf2940f042.js" async=""></script>
1<script src="/_next/static/chunks/5231-559e5d2bc5696f84.js" async=""></script>
1<script src="/_next/static/chunks/main-app-0b4e96624470ed3f.js" async=""></script>
1<script src="/_next/static/chunks/app/home/page-62a2462c1b522076.js" async=""></script>
1<link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/><link rel="icon" href="/FaviconTimeittChromeExtension.png" media="(prefers-color-scheme: dark)"/><link rel="icon" href="/FaviconTimeittChromeExtensionLight.png" media="(prefers-color-scheme: light)"/><link rel="icon" href="/FaviconTimeittChromeExtension.png"/>
1<script>try{var t=localStorage.getItem('timeitt-theme');document.documentElement.dataset.theme=(t==='light'||t==='dark')?t:'dark';}catch(e){document.documentElement.dataset.theme='dark';}</script>
1<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap"/><meta name="sentry-trace" content="b5a348478f830831a3aa113301a0d85b-98a43f51a4cd9210-0"/><meta name="baggage" content="sentry-environment=production,sentry-release=6c3b3a581e7d41eaf57de99f925e86d3f571df8e,sentry-public_key=6c68c8edb59e42a7396fc7d2bdabddc2,sentry-trace_id=b5a348478f830831a3aa113301a0d85b,sentry-org_id=4511157447491584,sentry-sampled=false,sentry-sample_rand=0.23667545551935598,sentry-sample_rate=0"/>
1<script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script>
1</head><body><div hidden=""><!--$?--><template id="B:0"></template><!--/$--></div><!--$?--><template id="B:1"></template><div class="tl-root" role="status" aria-live="polite" aria-label="Loading Timeitt"><style>
2@property --tl-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
3
4.tl-root {
5  position: fixed;
6  inset: 0;
7  z-index: 9999;
8  /* Defaults to the theme-aware page background set in globals.css, so the
9     splash never disagrees with the page underneath it. */
10  background: var(--tl-bg, var(--page-bg, #000));
11  display: grid;
12  place-items: center;
13  overflow: hidden;
14  /* Failsafe: if the JS bundle never arrives, never trap the page behind the splash. */
15  animation: tl-failsafe 0.4s ease 8s forwards;
16}
17.tl-root.tl-out {
18  animation: none;
19  opacity: 0;
20  pointer-events: none;
21  transition: opacity 0.35s ease;
22}
23@keyframes tl-failsafe { to { opacity: 0; visibility: hidden; } }
24
25/* ── Drifting bubbles ───────────────────────────────────────────────
26   Negative animation-delays start every bubble mid-flight, so the very
27   first painted frame already has motion in it. */
28.tl-bubble {
29  position: absolute;
30  border-radius: 50%;
31  filter: blur(60px);
32  opacity: 0;
33  animation: tl-drift linear infinite;
34  pointer-events: none;
35}
36/* Extra mid-stops in each gradient: a single 0%→transparent ramp bands visibly
37   at this size, even under a 60px blur. */
38.tl-bubble-1 { width: 420px; height: 420px; left: -110px; bottom: -110px; background: radial-gradient(circle, rgba(29,155,240,0.42) 0%, rgba(29,155,240,0.20) 42%, rgba(29,155,240,0.05) 66%, transparent 78%); animation-duration: 18s; animation-delay: -9s; }
39.tl-bubble-2 { width: 320px; height: 320px; right: -70px; top: 8%;        background: radial-gradient(circle, rgba(60,160,255,0.34) 0%, rgba(60,160,255,0.16) 42%, rgba(60,160,255,0.04) 66%, transparent 78%); animation-duration: 22s; animation-delay: -6s; }
40.tl-bubble-3 { width: 240px; height: 240px; left: 16%; bottom: 12%;       background: radial-gradient(circle, rgba(100,180,255,0.30) 0%, rgba(100,180,255,0.14) 42%, rgba(100,180,255,0.04) 66%, transparent 78%); animation-duration: 26s; animation-delay: -11s; }
41.tl-bubble-4 { width: 190px; height: 190px; right: 14%; bottom: 16%;      background: radial-gradient(circle, rgba(29,155,240,0.36) 0%, rgba(29,155,240,0.17) 42%, rgba(29,155,240,0.04) 66%, transparent 78%); animation-duration: 20s; animation-delay: -4s; }
42.tl-bubble-5 { width: 300px; height: 300px; left: 34%; top: -40px;        background: radial-gradient(circle, rgba(60,160,255,0.26) 0%, rgba(60,160,255,0.12) 42%, rgba(60,160,255,0.03) 66%, transparent 78%); animation-duration: 30s; animation-delay: -15s; }
43/* Sits directly behind the panel — without it backdrop-filter has nothing to
44   blur and the glass reads as flat fill. */
45.tl-bubble-6 { width: 560px; height: 560px; left: 50%; top: 50%; margin: -280px 0 0 -280px; background: radial-gradient(circle, rgba(29,155,240,0.30) 0%, rgba(29,155,240,0.14) 40%, rgba(29,155,240,0.03) 64%, transparent 76%); filter: blur(70px); animation-duration: 24s; animation-delay: -12s; }
46@keyframes tl-drift {
47  0%   { transform: translateY(60px) scale(0.85); opacity: 0; }
48  10%  { opacity: 1; }
49  85%  { opacity: 1; }
50  100% { transform: translateY(-80px) scale(1.08); opacity: 0; }
51}
52
53/* ── Frosted glass panel ──────────────────────────────────────────── */
54.tl-panel {
55  position: relative;
56  width: 264px;
57  height: 164px;
58  border-radius: 24px;
59  border: 1px solid transparent;
60  overflow: hidden;
61  display: flex;
62  flex-direction: column;
63  align-items: center;
64  justify-content: center;
65  gap: 22px;
66  backdrop-filter: blur(24px) saturate(180%);
67  -webkit-backdrop-filter: blur(24px) saturate(180%);
68  background:
69    linear-gradient(rgba(22,24,28,0.72), rgba(22,24,28,0.72)) padding-box,
70    conic-gradient(from var(--tl-angle),
71      rgba(255,255,255,0.06) 0%,
72      rgba(255,255,255,0.06) 70%,
73      rgba(29,155,240,0.5) 85%,
74      rgba(255,255,255,0.06) 100%) border-box;
75  animation: tl-stroke 6s linear infinite, tl-panel-in 0.5s cubic-bezier(0.16,1,0.3,1) both;
76  box-shadow: 0 24px 60px rgba(0,0,0,0.45);
77}
78@keyframes tl-stroke { to { --tl-angle: 360deg; } }
79@keyframes tl-panel-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }
80
81/* ── Wisps rising inside the panel, behind the logo ───────────────── */
82.tl-basin {
83  position: absolute;
84  bottom: 0;
85  left: 50%;
86  width: 150px;
87  height: 26px;
88  border-radius: 50%;
89  background: radial-gradient(ellipse, rgba(29,155,240,0.30) 0%, rgba(100,160,255,0.12) 60%, transparent 100%);
90  filter: blur(9px);
91  animation: tl-basin-pulse 4s ease-in-out infinite;
92  pointer-events: none;
93}
94@keyframes tl-basin-pulse {
95  0%, 100% { opacity: 0.5; transform: translateX(-50%) scaleX(1); }
96  50%      { opacity: 0.7; transform: translateX(-50%) scaleX(1.05); }
97}
98.tl-wisp { position: absolute; bottom: 4px; border-radius: 50%; filter: blur(4px); pointer-events: none; }
99.tl-wisp-1 { left: 42%; width: 11px; height: 17px; background: rgba(29,155,240,0.34);  animation: tl-rise-1 5.0s ease-out 0s   infinite; }
100.tl-wisp-2 { left: 33%; width: 8px;  height: 13px; background: rgba(214,232,255,0.55); animation: tl-rise-2 5.8s ease-out 0.9s infinite; }
101.tl-wisp-3 { left: 56%; width: 13px; height: 19px; background: rgba(60,160,255,0.30);  animation: tl-rise-3 5.4s ease-out 2.1s infinite; }
102.tl-wisp-4 { left: 62%; width: 7px;  height: 11px; background: rgba(220,236,255,0.50); animation: tl-rise-4 6.2s ease-out 3.0s infinite; }
103.tl-wisp-5 { left: 48%; width: 10px; height: 15px; background: rgba(29,155,240,0.28);  animation: tl-rise-5 5.6s ease-out 1.5s infinite; }
104@keyframes tl-rise-1 { 0% { opacity:0; transform:translate(0,0) scale(1); } 15% { opacity:0.7; } 85% { opacity:0.45; } 100% { opacity:0; transform:translate(7px,-104px) scale(0.34); } }
105@keyframes tl-rise-2 { 0% { opacity:0; transform:translate(0,0) scale(1); } 12% { opacity:0.62; } 88% { opacity:0.38; } 100% { opacity:0; transform:translate(-11px,-96px) scale(0.4); } }
106@keyframes tl-rise-3 { 0% { opacity:0; transform:translate(0,0) scale(1); } 18% { opacity:0.74; } 82% { opacity:0.48; } 100% { opacity:0; transform:translate(5px,-110px) scale(0.3); } }
107@keyframes tl-rise-4 { 0% { opacity:0; transform:translate(0,0) scale(1); } 14% { opacity:0.58; } 86% { opacity:0.36; } 100% { opacity:0; transform:translate(-8px,-92px) scale(0.42); } }
108@keyframes tl-rise-5 { 0% { opacity:0; transform:translate(0,0) scale(1); } 16% { opacity:0.68; } 84% { opacity:0.44; } 100% { opacity:0; transform:translate(12px,-100px) scale(0.36); } }
109
110/* ── Logo + indeterminate bar ─────────────────────────────────────── */
111.tl-logo { position: relative; z-index: 1; height: 30px; width: auto; animation: tl-logo-pulse 2.6s ease-in-out infinite; }
112@keyframes tl-logo-pulse { 0%, 100% { opacity: 0.92; } 50% { opacity: 0.6; } }
113.tl-logo--on-light { display: none; }
114
115.tl-bar {
116  position: relative;
117  z-index: 1;
118  width: 108px;
119  height: 3px;
120  border-radius: 999px;
121  background: rgba(255,255,255,0.08);
122  overflow: hidden;
123}
124.tl-bar::after {
125  content: '';
126  position: absolute;
127  inset: 0;
128  background: linear-gradient(90deg, transparent 0%, rgba(29,155,240,0.95) 50%, transparent 100%);
129  transform: translateX(-100%);
130  animation: tl-bar-sweep 1.4s ease-in-out infinite;
131}
132@keyframes tl-bar-sweep { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
133
134/* ── Light theme ──────────────────────────────────────────────────────
135   The dark palette is invisible on #FAF8F6, so swap to the muted blue-greys
136   already tuned for light mode in PensieveWisps on the landing page. */
137:root[data-theme="light"] .tl-logo--on-dark  { display: none; }
138:root[data-theme="light"] .tl-logo--on-light { display: block; }
139:root[data-theme="light"] .tl-panel {
140  background:
141    linear-gradient(rgba(255,255,255,0.72), rgba(255,255,255,0.72)) padding-box,
142    conic-gradient(from var(--tl-angle),
143      rgba(0,0,0,0.06) 0%,
144      rgba(0,0,0,0.06) 70%,
145      rgba(29,155,240,0.45) 85%,
146      rgba(0,0,0,0.06) 100%) border-box;
147  box-shadow: 0 24px 60px rgba(80,90,120,0.18);
148}
149:root[data-theme="light"] .tl-bubble-1 { background: radial-gradient(circle, rgba(29,100,200,0.30) 0%, rgba(29,100,200,0.14) 42%, rgba(29,100,200,0.04) 66%, transparent 78%); }
150:root[data-theme="light"] .tl-bubble-2 { background: radial-gradient(circle, rgba(60,120,210,0.24) 0%, rgba(60,120,210,0.11) 42%, rgba(60,120,210,0.03) 66%, transparent 78%); }
151:root[data-theme="light"] .tl-bubble-3 { background: radial-gradient(circle, rgba(100,120,170,0.24) 0%, rgba(100,120,170,0.11) 42%, rgba(100,120,170,0.03) 66%, transparent 78%); }
152:root[data-theme="light"] .tl-bubble-4 { background: radial-gradient(circle, rgba(29,100,200,0.26) 0%, rgba(29,100,200,0.12) 42%, rgba(29,100,200,0.03) 66%, transparent 78%); }
153:root[data-theme="light"] .tl-bubble-5 { background: radial-gradient(circle, rgba(90,110,160,0.20) 0%, rgba(90,110,160,0.09) 42%, rgba(90,110,160,0.02) 66%, transparent 78%); }
154:root[data-theme="light"] .tl-bubble-6 { background: radial-gradient(circle, rgba(29,100,200,0.22) 0%, rgba(29,100,200,0.10) 40%, rgba(29,100,200,0.02) 64%, transparent 76%); }
155:root[data-theme="light"] .tl-basin { background: radial-gradient(ellipse, rgba(29,100,200,0.16) 0%, rgba(80,120,200,0.07) 60%, transparent 100%); }
156:root[data-theme="light"] .tl-wisp-1 { background: rgba(29,100,200,0.20); }
157:root[data-theme="light"] .tl-wisp-2 { background: rgba(110,130,175,0.24); }
158:root[data-theme="light"] .tl-wisp-3 { background: rgba(60,120,210,0.18); }
159:root[data-theme="light"] .tl-wisp-4 { background: rgba(100,120,170,0.22); }
160:root[data-theme="light"] .tl-wisp-5 { background: rgba(29,100,200,0.17); }
161:root[data-theme="light"] .tl-bar { background: rgba(0,0,0,0.07); }
162
163@media (prefers-reduced-motion: reduce) {
164  .tl-panel, .tl-basin, .tl-wisp, .tl-logo, .tl-bar::after {
165    animation: none !important;
166  }
167  .tl-bubble { animation: none !important; opacity: 0.3 !important; }
168  .tl-bar::after { transform: none; opacity: 0.5; }
169}
170</style><div class="tl-bubble tl-bubble-1"></div><div class="tl-bubble tl-bubble-2"></div><div class="tl-bubble tl-bubble-3"></div><div class="tl-bubble tl-bubble-4"></div><div class="tl-bubble tl-bubble-5"></div><div class="tl-bubble tl-bubble-6"></div><div class="tl-panel"><div class="tl-basin"></div><div class="tl-wisp tl-wisp-1"></div><div class="tl-wisp tl-wisp-2"></div><div class="tl-wisp tl-wisp-3"></div><div class="tl-wisp tl-wisp-4"></div><div class="tl-wisp tl-wisp-5"></div><img src="/logo.svg" alt="Timeitt" class="tl-logo tl-logo--on-dark"/><img src="/logoDark.svg" alt="" aria-hidden="true" class="tl-logo tl-logo--on-light"/><div class="tl-bar"></div></div></div><!--/$-->
170<script>requestAnimationFrame(function(){$RT=performance.now()});</script>
170<script src="/_next/static/chunks/webpack-2cd8219c1aa51a4f.js" id="_R_" async=""></script>
170<div hidden id="S:1"><!--$?--><template id="B:2"></template><div class="tl-root" role="status" aria-live="polite" aria-label="Loading Timeitt"><style>
171@property --tl-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
172
173.tl-root {
174  position: fixed;
175  inset: 0;
176  z-index: 9999;
177  /* Defaults to the theme-aware page background set in globals.css, so the
178     splash never disagrees with the page underneath it. */
179  background: var(--tl-bg, var(--page-bg, #000));
180  display: grid;
181  place-items: center;
182  overflow: hidden;
183  /* Failsafe: if the JS bundle never arrives, never trap the page behind the splash. */
184  animation: tl-failsafe 0.4s ease 8s forwards;
185}
186.tl-root.tl-out {
187  animation: none;
188  opacity: 0;
189  pointer-events: none;
190  transition: opacity 0.35s ease;
191}
192@keyframes tl-failsafe { to { opacity: 0; visibility: hidden; } }
193
194/* ── Drifting bubbles ───────────────────────────────────────────────
195   Negative animation-delays start every bubble mid-flight, so the very
196   first painted frame already has motion in it. */
197.tl-bubble {
198  position: absolute;
199  border-radius: 50%;
200  filter: blur(60px);
201  opacity: 0;
202  animation: tl-drift linear infinite;
203  pointer-events: none;
204}
205/* Extra mid-stops in each gradient: a single 0%→transparent ramp bands visibly
206   at this size, even under a 60px blur. */
207.tl-bubble-1 { width: 420px; height: 420px; left: -110px; bottom: -110px; background: radial-gradient(circle, rgba(29,155,240,0.42) 0%, rgba(29,155,240,0.20) 42%, rgba(29,155,240,0.05) 66%, transparent 78%); animation-duration: 18s; animation-delay: -9s; }
208.tl-bubble-2 { width: 320px; height: 320px; right: -70px; top: 8%;        background: radial-gradient(circle, rgba(60,160,255,0.34) 0%, rgba(60,160,255,0.16) 42%, rgba(60,160,255,0.04) 66%, transparent 78%); animation-duration: 22s; animation-delay: -6s; }
209.tl-bubble-3 { width: 240px; height: 240px; left: 16%; bottom: 12%;       background: radial-gradient(circle, rgba(100,180,255,0.30) 0%, rgba(100,180,255,0.14) 42%, rgba(100,180,255,0.04) 66%, transparent 78%); animation-duration: 26s; animation-delay: -11s; }
210.tl-bubble-4 { width: 190px; height: 190px; right: 14%; bottom: 16%;      background: radial-gradient(circle, rgba(29,155,240,0.36) 0%, rgba(29,155,240,0.17) 42%, rgba(29,155,240,0.04) 66%, transparent 78%); animation-duration: 20s; animation-delay: -4s; }
211.tl-bubble-5 { width: 300px; height: 300px; left: 34%; top: -40px;        background: radial-gradient(circle, rgba(60,160,255,0.26) 0%, rgba(60,160,255,0.12) 42%, rgba(60,160,255,0.03) 66%, transparent 78%); animation-duration: 30s; animation-delay: -15s; }
212/* Sits directly behind the panel — without it backdrop-filter has nothing to
213   blur and the glass reads as flat fill. */
214.tl-bubble-6 { width: 560px; height: 560px; left: 50%; top: 50%; margin: -280px 0 0 -280px; background: radial-gradient(circle, rgba(29,155,240,0.30) 0%, rgba(29,155,240,0.14) 40%, rgba(29,155,240,0.03) 64%, transparent 76%); filter: blur(70px); animation-duration: 24s; animation-delay: -12s; }
215@keyframes tl-drift {
216  0%   { transform: translateY(60px) scale(0.85); opacity: 0; }
217  10%  { opacity: 1; }
218  85%  { opacity: 1; }
219  100% { transform: translateY(-80px) scale(1.08); opacity: 0; }
220}
221
222/* ── Frosted glass panel ──────────────────────────────────────────── */
223.tl-panel {
224  position: relative;
225  width: 264px;
226  height: 164px;
227  border-radius: 24px;
228  border: 1px solid transparent;
229  overflow: hidden;
230  display: flex;
231  flex-direction: column;
232  align-items: center;
233  justify-content: center;
234  gap: 22px;
235  backdrop-filter: blur(24px) saturate(180%);
236  -webkit-backdrop-filter: blur(24px) saturate(180%);
237  background:
238    linear-gradient(rgba(22,24,28,0.72), rgba(22,24,28,0.72)) padding-box,
239    conic-gradient(from var(--tl-angle),
240      rgba(255,255,255,0.06) 0%,
241      rgba(255,255,255,0.06) 70%,
242      rgba(29,155,240,0.5) 85%,
243      rgba(255,255,255,0.06) 100%) border-box;
244  animation: tl-stroke 6s linear infinite, tl-panel-in 0.5s cubic-bezier(0.16,1,0.3,1) both;
245  box-shadow: 0 24px 60px rgba(0,0,0,0.45);
246}
247@keyframes tl-stroke { to { --tl-angle: 360deg; } }
248@keyframes tl-panel-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }
249
250/* ── Wisps rising inside the panel, behind the logo ───────────────── */
251.tl-basin {
252  position: absolute;
253  bottom: 0;
254  left: 50%;
255  width: 150px;
256  height: 26px;
257  border-radius: 50%;
258  background: radial-gradient(ellipse, rgba(29,155,240,0.30) 0%, rgba(100,160,255,0.12) 60%, transparent 100%);
259  filter: blur(9px);
260  animation: tl-basin-pulse 4s ease-in-out infinite;
261  pointer-events: none;
262}
263@keyframes tl-basin-pulse {
264  0%, 100% { opacity: 0.5; transform: translateX(-50%) scaleX(1); }
265  50%      { opacity: 0.7; transform: translateX(-50%) scaleX(1.05); }
266}
267.tl-wisp { position: absolute; bottom: 4px; border-radius: 50%; filter: blur(4px); pointer-events: none; }
268.tl-wisp-1 { left: 42%; width: 11px; height: 17px; background: rgba(29,155,240,0.34);  animation: tl-rise-1 5.0s ease-out 0s   infinite; }
269.tl-wisp-2 { left: 33%; width: 8px;  height: 13px; background: rgba(214,232,255,0.55); animation: tl-rise-2 5.8s ease-out 0.9s infinite; }
270.tl-wisp-3 { left: 56%; width: 13px; height: 19px; background: rgba(60,160,255,0.30);  animation: tl-rise-3 5.4s ease-out 2.1s infinite; }
271.tl-wisp-4 { left: 62%; width: 7px;  height: 11px; background: rgba(220,236,255,0.50); animation: tl-rise-4 6.2s ease-out 3.0s infinite; }
272.tl-wisp-5 { left: 48%; width: 10px; height: 15px; background: rgba(29,155,240,0.28);  animation: tl-rise-5 5.6s ease-out 1.5s infinite; }
273@keyframes tl-rise-1 { 0% { opacity:0; transform:translate(0,0) scale(1); } 15% { opacity:0.7; } 85% { opacity:0.45; } 100% { opacity:0; transform:translate(7px,-104px) scale(0.34); } }
274@keyframes tl-rise-2 { 0% { opacity:0; transform:translate(0,0) scale(1); } 12% { opacity:0.62; } 88% { opacity:0.38; } 100% { opacity:0; transform:translate(-11px,-96px) scale(0.4); } }
275@keyframes tl-rise-3 { 0% { opacity:0; transform:translate(0,0) scale(1); } 18% { opacity:0.74; } 82% { opacity:0.48; } 100% { opacity:0; transform:translate(5px,-110px) scale(0.3); } }
276@keyframes tl-rise-4 { 0% { opacity:0; transform:translate(0,0) scale(1); } 14% { opacity:0.58; } 86% { opacity:0.36; } 100% { opacity:0; transform:translate(-8px,-92px) scale(0.42); } }
277@keyframes tl-rise-5 { 0% { opacity:0; transform:translate(0,0) scale(1); } 16% { opacity:0.68; } 84% { opacity:0.44; } 100% { opacity:0; transform:translate(12px,-100px) scale(0.36); } }
278
279/* ── Logo + indeterminate bar ─────────────────────────────────────── */
280.tl-logo { position: relative; z-index: 1; height: 30px; width: auto; animation: tl-logo-pulse 2.6s ease-in-out infinite; }
281@keyframes tl-logo-pulse { 0%, 100% { opacity: 0.92; } 50% { opacity: 0.6; } }
282.tl-logo--on-light { display: none; }
283
284.tl-bar {
285  position: relative;
286  z-index: 1;
287  width: 108px;
288  height: 3px;
289  border-radius: 999px;
290  background: rgba(255,255,255,0.08);
291  overflow: hidden;
292}
293.tl-bar::after {
294  content: '';
295  position: absolute;
296  inset: 0;
297  background: linear-gradient(90deg, transparent 0%, rgba(29,155,240,0.95) 50%, transparent 100%);
298  transform: translateX(-100%);
299  animation: tl-bar-sweep 1.4s ease-in-out infinite;
300}
301@keyframes tl-bar-sweep { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
302
303/* ── Light theme ──────────────────────────────────────────────────────
304   The dark palette is invisible on #FAF8F6, so swap to the muted blue-greys
305   already tuned for light mode in PensieveWisps on the landing page. */
306:root[data-theme="light"] .tl-logo--on-dark  { display: none; }
307:root[data-theme="light"] .tl-logo--on-light { display: block; }
308:root[data-theme="light"] .tl-panel {
309  background:
310    linear-gradient(rgba(255,255,255,0.72), rgba(255,255,255,0.72)) padding-box,
311    conic-gradient(from var(--tl-angle),
312      rgba(0,0,0,0.06) 0%,
313      rgba(0,0,0,0.06) 70%,
314      rgba(29,155,240,0.45) 85%,
315      rgba(0,0,0,0.06) 100%) border-box;
316  box-shadow: 0 24px 60px rgba(80,90,120,0.18);
317}
318:root[data-theme="light"] .tl-bubble-1 { background: radial-gradient(circle, rgba(29,100,200,0.30) 0%, rgba(29,100,200,0.14) 42%, rgba(29,100,200,0.04) 66%, transparent 78%); }
319:root[data-theme="light"] .tl-bubble-2 { background: radial-gradient(circle, rgba(60,120,210,0.24) 0%, rgba(60,120,210,0.11) 42%, rgba(60,120,210,0.03) 66%, transparent 78%); }
320:root[data-theme="light"] .tl-bubble-3 { background: radial-gradient(circle, rgba(100,120,170,0.24) 0%, rgba(100,120,170,0.11) 42%, rgba(100,120,170,0.03) 66%, transparent 78%); }
321:root[data-theme="light"] .tl-bubble-4 { background: radial-gradient(circle, rgba(29,100,200,0.26) 0%, rgba(29,100,200,0.12) 42%, rgba(29,100,200,0.03) 66%, transparent 78%); }
322:root[data-theme="light"] .tl-bubble-5 { background: radial-gradient(circle, rgba(90,110,160,0.20) 0%, rgba(90,110,160,0.09) 42%, rgba(90,110,160,0.02) 66%, transparent 78%); }
323:root[data-theme="light"] .tl-bubble-6 { background: radial-gradient(circle, rgba(29,100,200,0.22) 0%, rgba(29,100,200,0.10) 40%, rgba(29,100,200,0.02) 64%, transparent 76%); }
324:root[data-theme="light"] .tl-basin { background: radial-gradient(ellipse, rgba(29,100,200,0.16) 0%, rgba(80,120,200,0.07) 60%, transparent 100%); }
325:root[data-theme="light"] .tl-wisp-1 { background: rgba(29,100,200,0.20); }
326:root[data-theme="light"] .tl-wisp-2 { background: rgba(110,130,175,0.24); }
327:root[data-theme="light"] .tl-wisp-3 { background: rgba(60,120,210,0.18); }
328:root[data-theme="light"] .tl-wisp-4 { background: rgba(100,120,170,0.22); }
329:root[data-theme="light"] .tl-wisp-5 { background: rgba(29,100,200,0.17); }
330:root[data-theme="light"] .tl-bar { background: rgba(0,0,0,0.07); }
331
332@media (prefers-reduced-motion: reduce) {
333  .tl-panel, .tl-basin, .tl-wisp, .tl-logo, .tl-bar::after {
334    animation: none !important;
335  }
336  .tl-bubble { animation: none !important; opacity: 0.3 !important; }
337  .tl-bar::after { transform: none; opacity: 0.5; }
338}
339</style><div class="tl-bubble tl-bubble-1"></div><div class="tl-bubble tl-bubble-2"></div><div class="tl-bubble tl-bubble-3"></div><div class="tl-bubble tl-bubble-4"></div><div class="tl-bubble tl-bubble-5"></div><div class="tl-bubble tl-bubble-6"></div><div class="tl-panel"><div class="tl-basin"></div><div class="tl-wisp tl-wisp-1"></div><div class="tl-wisp tl-wisp-2"></div><div class="tl-wisp tl-wisp-3"></div><div class="tl-wisp tl-wisp-4"></div><div class="tl-wisp tl-wisp-5"></div><img src="/logo.svg" alt="Timeitt" class="tl-logo tl-logo--on-dark"/><img src="/logoDark.svg" alt="" aria-hidden="true" class="tl-logo tl-logo--on-light"/><div class="tl-bar"></div></div></div><!--/$--></div>
339<script>$RB=[];$RV=function(a){$RT=performance.now();for(var b=0;b<a.length;b+=2){var c=a[b],e=a[b+1];null!==e.parentNode&&e.parentNode.removeChild(e);var f=c.parentNode;if(f){var g=c.previousSibling,h=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d||"/&"===d)if(0===h)break;else h--;else"$"!==d&&"$?"!==d&&"$~"!==d&&"$!"!==d&&"&"!==d||h++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;e.firstChild;)f.insertBefore(e.firstChild,c);g.data="$";g._reactRetry&&requestAnimationFrame(g._reactRetry)}}a.length=0};
340$RC=function(a,b){if(b=document.getElementById(b))(a=document.getElementById(a))?(a.previousSibling.data="$~",$RB.push(a,b),2===$RB.length&&("number"!==typeof $RT?requestAnimationFrame($RV.bind(null,$RB)):(a=performance.now(),setTimeout($RV.bind(null,$RB),2300>a&&2E3<a?2300-a:$RT+300-a)))):b.parentNode.removeChild(b)};$RC("B:1","S:1")</script>
340<div hidden id="S:2"><div class="tl-root" style="--tl-bg:#0a0a0a" role="status" aria-live="polite" aria-label="Loading Timeitt"><style>
341@property --tl-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
342
343.tl-root {
344  position: fixed;
345  inset: 0;
346  z-index: 9999;
347  /* Defaults to the theme-aware page background set in globals.css, so the
348     splash never disagrees with the page underneath it. */
349  background: var(--tl-bg, var(--page-bg, #000));
350  display: grid;
351  place-items: center;
352  overflow: hidden;
353  /* Failsafe: if the JS bundle never arrives, never trap the page behind the splash. */
354  animation: tl-failsafe 0.4s ease 8s forwards;
355}
356.tl-root.tl-out {
357  animation: none;
358  opacity: 0;
359  pointer-events: none;
360  transition: opacity 0.35s ease;
361}
362@keyframes tl-failsafe { to { opacity: 0; visibility: hidden; } }
363
364/* ── Drifting bubbles ───────────────────────────────────────────────
365   Negative animation-delays start every bubble mid-flight, so the very
366   first painted frame already has motion in it. */
367.tl-bubble {
368  position: absolute;
369  border-radius: 50%;
370  filter: blur(60px);
371  opacity: 0;
372  animation: tl-drift linear infinite;
373  pointer-events: none;
374}
375/* Extra mid-stops in each gradient: a single 0%→transparent ramp bands visibly
376   at this size, even under a 60px blur. */
377.tl-bubble-1 { width: 420px; height: 420px; left: -110px; bottom: -110px; background: radial-gradient(circle, rgba(29,155,240,0.42) 0%, rgba(29,155,240,0.20) 42%, rgba(29,155,240,0.05) 66%, transparent 78%); animation-duration: 18s; animation-delay: -9s; }
378.tl-bubble-2 { width: 320px; height: 320px; right: -70px; top: 8%;        background: radial-gradient(circle, rgba(60,160,255,0.34) 0%, rgba(60,160,255,0.16) 42%, rgba(60,160,255,0.04) 66%, transparent 78%); animation-duration: 22s; animation-delay: -6s; }
379.tl-bubble-3 { width: 240px; height: 240px; left: 16%; bottom: 12%;       background: radial-gradient(circle, rgba(100,180,255,0.30) 0%, rgba(100,180,255,0.14) 42%, rgba(100,180,255,0.04) 66%, transparent 78%); animation-duration: 26s; animation-delay: -11s; }
380.tl-bubble-4 { width: 190px; height: 190px; right: 14%; bottom: 16%;      background: radial-gradient(circle, rgba(29,155,240,0.36) 0%, rgba(29,155,240,0.17) 42%, rgba(29,155,240,0.04) 66%, transparent 78%); animation-duration: 20s; animation-delay: -4s; }
381.tl-bubble-5 { width: 300px; height: 300px; left: 34%; top: -40px;        background: radial-gradient(circle, rgba(60,160,255,0.26) 0%, rgba(60,160,255,0.12) 42%, rgba(60,160,255,0.03) 66%, transparent 78%); animation-duration: 30s; animation-delay: -15s; }
382/* Sits directly behind the panel — without it backdrop-filter has nothing to
383   blur and the glass reads as flat fill. */
384.tl-bubble-6 { width: 560px; height: 560px; left: 50%; top: 50%; margin: -280px 0 0 -280px; background: radial-gradient(circle, rgba(29,155,240,0.30) 0%, rgba(29,155,240,0.14) 40%, rgba(29,155,240,0.03) 64%, transparent 76%); filter: blur(70px); animation-duration: 24s; animation-delay: -12s; }
385@keyframes tl-drift {
386  0%   { transform: translateY(60px) scale(0.85); opacity: 0; }
387  10%  { opacity: 1; }
388  85%  { opacity: 1; }
389  100% { transform: translateY(-80px) scale(1.08); opacity: 0; }
390}
391
392/* ── Frosted glass panel ──────────────────────────────────────────── */
393.tl-panel {
394  position: relative;
395  width: 264px;
396  height: 164px;
397  border-radius: 24px;
398  border: 1px solid transparent;
399  overflow: hidden;
400  display: flex;
401  flex-direction: column;
402  align-items: center;
403  justify-content: center;
404  gap: 22px;
405  backdrop-filter: blur(24px) saturate(180%);
406  -webkit-backdrop-filter: blur(24px) saturate(180%);
407  background:
408    linear-gradient(rgba(22,24,28,0.72), rgba(22,24,28,0.72)) padding-box,
409    conic-gradient(from var(--tl-angle),
410      rgba(255,255,255,0.06) 0%,
411      rgba(255,255,255,0.06) 70%,
412      rgba(29,155,240,0.5) 85%,
413      rgba(255,255,255,0.06) 100%) border-box;
414  animation: tl-stroke 6s linear infinite, tl-panel-in 0.5s cubic-bezier(0.16,1,0.3,1) both;
415  box-shadow: 0 24px 60px rgba(0,0,0,0.45);
416}
417@keyframes tl-stroke { to { --tl-angle: 360deg; } }
418@keyframes tl-panel-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }
419
420/* ── Wisps rising inside the panel, behind the logo ───────────────── */
421.tl-basin {
422  position: absolute;
423  bottom: 0;
424  left: 50%;
425  width: 150px;
426  height: 26px;
427  border-radius: 50%;
428  background: radial-gradient(ellipse, rgba(29,155,240,0.30) 0%, rgba(100,160,255,0.12) 60%, transparent 100%);
429  filter: blur(9px);
430  animation: tl-basin-pulse 4s ease-in-out infinite;
431  pointer-events: none;
432}
433@keyframes tl-basin-pulse {
434  0%, 100% { opacity: 0.5; transform: translateX(-50%) scaleX(1); }
435  50%      { opacity: 0.7; transform: translateX(-50%) scaleX(1.05); }
436}
437.tl-wisp { position: absolute; bottom: 4px; border-radius: 50%; filter: blur(4px); pointer-events: none; }
438.tl-wisp-1 { left: 42%; width: 11px; height: 17px; background: rgba(29,155,240,0.34);  animation: tl-rise-1 5.0s ease-out 0s   infinite; }
439.tl-wisp-2 { left: 33%; width: 8px;  height: 13px; background: rgba(214,232,255,0.55); animation: tl-rise-2 5.8s ease-out 0.9s infinite; }
440.tl-wisp-3 { left: 56%; width: 13px; height: 19px; background: rgba(60,160,255,0.30);  animation: tl-rise-3 5.4s ease-out 2.1s infinite; }
441.tl-wisp-4 { left: 62%; width: 7px;  height: 11px; background: rgba(220,236,255,0.50); animation: tl-rise-4 6.2s ease-out 3.0s infinite; }
442.tl-wisp-5 { left: 48%; width: 10px; height: 15px; background: rgba(29,155,240,0.28);  animation: tl-rise-5 5.6s ease-out 1.5s infinite; }
443@keyframes tl-rise-1 { 0% { opacity:0; transform:translate(0,0) scale(1); } 15% { opacity:0.7; } 85% { opacity:0.45; } 100% { opacity:0; transform:translate(7px,-104px) scale(0.34); } }
444@keyframes tl-rise-2 { 0% { opacity:0; transform:translate(0,0) scale(1); } 12% { opacity:0.62; } 88% { opacity:0.38; } 100% { opacity:0; transform:translate(-11px,-96px) scale(0.4); } }
445@keyframes tl-rise-3 { 0% { opacity:0; transform:translate(0,0) scale(1); } 18% { opacity:0.74; } 82% { opacity:0.48; } 100% { opacity:0; transform:translate(5px,-110px) scale(0.3); } }
446@keyframes tl-rise-4 { 0% { opacity:0; transform:translate(0,0) scale(1); } 14% { opacity:0.58; } 86% { opacity:0.36; } 100% { opacity:0; transform:translate(-8px,-92px) scale(0.42); } }
447@keyframes tl-rise-5 { 0% { opacity:0; transform:translate(0,0) scale(1); } 16% { opacity:0.68; } 84% { opacity:0.44; } 100% { opacity:0; transform:translate(12px,-100px) scale(0.36); } }
448
449/* ── Logo + indeterminate bar ─────────────────────────────────────── */
450.tl-logo { position: relative; z-index: 1; height: 30px; width: auto; animation: tl-logo-pulse 2.6s ease-in-out infinite; }
451@keyframes tl-logo-pulse { 0%, 100% { opacity: 0.92; } 50% { opacity: 0.6; } }
452.tl-logo--on-light { display: none; }
453
454.tl-bar {
455  position: relative;
456  z-index: 1;
457  width: 108px;
458  height: 3px;
459  border-radius: 999px;
460  background: rgba(255,255,255,0.08);
461  overflow: hidden;
462}
463.tl-bar::after {
464  content: '';
465  position: absolute;
466  inset: 0;
467  background: linear-gradient(90deg, transparent 0%, rgba(29,155,240,0.95) 50%, transparent 100%);
468  transform: translateX(-100%);
469  animation: tl-bar-sweep 1.4s ease-in-out infinite;
470}
471@keyframes tl-bar-sweep { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
472
473/* ── Light theme ──────────────────────────────────────────────────────
474   The dark palette is invisible on #FAF8F6, so swap to the muted blue-greys
475   already tuned for light mode in PensieveWisps on the landing page. */
476:root[data-theme="light"] .tl-logo--on-dark  { display: none; }
477:root[data-theme="light"] .tl-logo--on-light { display: block; }
478:root[data-theme="light"] .tl-panel {
479  background:
480    linear-gradient(rgba(255,255,255,0.72), rgba(255,255,255,0.72)) padding-box,
481    conic-gradient(from var(--tl-angle),
482      rgba(0,0,0,0.06) 0%,
483      rgba(0,0,0,0.06) 70%,
484      rgba(29,155,240,0.45) 85%,
485      rgba(0,0,0,0.06) 100%) border-box;
486  box-shadow: 0 24px 60px rgba(80,90,120,0.18);
487}
488:root[data-theme="light"] .tl-bubble-1 { background: radial-gradient(circle, rgba(29,100,200,0.30) 0%, rgba(29,100,200,0.14) 42%, rgba(29,100,200,0.04) 66%, transparent 78%); }
489:root[data-theme="light"] .tl-bubble-2 { background: radial-gradient(circle, rgba(60,120,210,0.24) 0%, rgba(60,120,210,0.11) 42%, rgba(60,120,210,0.03) 66%, transparent 78%); }
490:root[data-theme="light"] .tl-bubble-3 { background: radial-gradient(circle, rgba(100,120,170,0.24) 0%, rgba(100,120,170,0.11) 42%, rgba(100,120,170,0.03) 66%, transparent 78%); }
491:root[data-theme="light"] .tl-bubble-4 { background: radial-gradient(circle, rgba(29,100,200,0.26) 0%, rgba(29,100,200,0.12) 42%, rgba(29,100,200,0.03) 66%, transparent 78%); }
492:root[data-theme="light"] .tl-bubble-5 { background: radial-gradient(circle, rgba(90,110,160,0.20) 0%, rgba(90,110,160,0.09) 42%, rgba(90,110,160,0.02) 66%, transparent 78%); }
493:root[data-theme="light"] .tl-bubble-6 { background: radial-gradient(circle, rgba(29,100,200,0.22) 0%, rgba(29,100,200,0.10) 40%, rgba(29,100,200,0.02) 64%, transparent 76%); }
494:root[data-theme="light"] .tl-basin { background: radial-gradient(ellipse, rgba(29,100,200,0.16) 0%, rgba(80,120,200,0.07) 60%, transparent 100%); }
495:root[data-theme="light"] .tl-wisp-1 { background: rgba(29,100,200,0.20); }
496:root[data-theme="light"] .tl-wisp-2 { background: rgba(110,130,175,0.24); }
497:root[data-theme="light"] .tl-wisp-3 { background: rgba(60,120,210,0.18); }
498:root[data-theme="light"] .tl-wisp-4 { background: rgba(100,120,170,0.22); }
499:root[data-theme="light"] .tl-wisp-5 { background: rgba(29,100,200,0.17); }
500:root[data-theme="light"] .tl-bar { background: rgba(0,0,0,0.07); }
501
502@media (prefers-reduced-motion: reduce) {
503  .tl-panel, .tl-basin, .tl-wisp, .tl-logo, .tl-bar::after {
504    animation: none !important;
505  }
506  .tl-bubble { animation: none !important; opacity: 0.3 !important; }
507  .tl-bar::after { transform: none; opacity: 0.5; }
508}
509</style><div class="tl-bubble tl-bubble-1"></div><div class="tl-bubble tl-bubble-2"></div><div class="tl-bubble tl-bubble-3"></div><div class="tl-bubble tl-bubble-4"></div><div class="tl-bubble tl-bubble-5"></div><div class="tl-bubble tl-bubble-6"></div><div class="tl-panel"><div class="tl-basin"></div><div class="tl-wisp tl-wisp-1"></div><div class="tl-wisp tl-wisp-2"></div><div class="tl-wisp tl-wisp-3"></div><div class="tl-wisp tl-wisp-4"></div><div class="tl-wisp tl-wisp-5"></div><img src="/logo.svg" alt="Timeitt" class="tl-logo tl-logo--on-dark"/><img src="/logoDark.svg" alt="" aria-hidden="true" class="tl-logo tl-logo--on-light"/><div class="tl-bar"></div></div></div><div style="min-height:100vh;background:#0a0a0a;display:flex;align-items:center;justify-content:center;font-family:&#x27;Inter&#x27;, -apple-system, BlinkMacSystemFont, &#x27;Segoe UI&#x27;, Roboto, sans-serif;padding:24px;position:relative;overflow:hidden"><style>
510          @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
511          html, body { margin: 0; padding: 0; background: #0a0a0a; }
512          .login-card { background: rgba(17,17,17,0.75); border: 1px solid #222; border-radius: 16px; padding: 20px; display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; transition: border-color 0.15s, background 0.15s; cursor: pointer; backdrop-filter: blur(8px); }
513          .login-card:hover { border-color: #333; background: rgba(22,22,22,0.85); }
514        </style><div style="position:absolute;inset:0;background-image:url(&#x27;
514/heroTimeitt.png&#x27;);background-size:cover;background-position:center 15%;background-repeat:no-repeat;opacity:0.5;pointer-events:none;mask-image:linear-gradient(to bottom, transparent 0%, black 8%, black 55%, transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0%, black 8%, black 55%, transparent 100%)"></div><div style="position:absolute;inset:0;background:linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, transparent 40%, rgba(0,0,0,0.7) 100%);pointer-events:none"></div><div style="text-align:center;width:100%;max-width:360px;position:relative;z-index:1"><img src="https://backend-ashen-psi-12.vercel.app/logo.png" alt="Timeitt" style="height:36px;width:auto;margin-bottom:32px"/><p style="font-size:11px;font-weight:600;color:#8b98a5;letter-spacing:0.08em;text-transform:uppercase;margin-bottom:12px;text-align:center">Already have an account?</p><a href="/api/auth/google?prompt=login" style="display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:#111;border-radius:9999px;padding:12px 24px;font-size:14px;font-weight:600;text-decoration:none;margin-bottom:24px;box-shadow:0 1px 3px rgba(0,0,0,0.3)"><svg width="18" height="18" viewBox="0 0 48 48"><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path><path fill="none" d="M0 0h48v48H0z"></path></svg>Sign in with Google</a><div style="display:flex;align-items:center;gap:12px;margin-bottom:20px"><div style="flex:1;height:1px;background:#222"></div><span style="color:#8b98a5;font-size:12px">or</span><div style="flex:1;height:1px;background:#222"></div></div><p style="font-size:11px;font-weight:600;color:#8b98a5;letter-spacing:0.08em;text-transform:uppercase;margin-bottom:6px;text-align:center">New to Timeitt?</p><p style="font-size:13px;color:#8b98a5;text-align:center;margin-bottom:14px;margin:0 0 14px">Pick the option that works best for you.</p><a href="https://t.me/timeitt_bot" target="_blank" rel="noopener noreferrer" class="login-card" style="margin-bottom:10px"><svg width="28" height="28" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="12" fill="#229ED9"></circle><path d="M5.5 11.5l10-4-2 10-3-3-2 2V13l5-5-6.5 3.5-1.5-.5z" fill="#fff"></path></svg><div style="text-align:left"><div style="font-size:14px;font-weight:600;color:#e7e9ea;display:flex;align-items:center;gap:8px">Telegram Bot<span style="font-size:10px;font-weight:700;background:#1d9bf0;color:#fff;border-radius:4px;padding:2px 6px;letter-spacing:0.04em">RECOMMENDED</span></div><div style="font-size:12px;color:#666;margin-top:2px">Forward tweets directly to @timeitt_bot — no install needed</div></div></a><a href="https://chromewebstore.google.com/detail/timeitt/pocccngpcnicdpmofhmlfdiniademhoi" target="_blank" rel="noopener noreferrer" class="login-card" style="margin-bottom:24px"><img src="/chrome-icon.svg" width="28" height="28" alt="Chrome"/><div style="text-align:left"><div style="font-size:14px;font-weight:600;color:#e7e9ea;display:flex;align-items:center;gap:8px">Chrome Extension</div><div style="font-size:12px;color:#666;margin-top:2px">Save tweets with one click directly on X.com</div></div></a><div style="display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-bottom:20px"><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#1d9bf0;color:#fff;transition:all 0.15s;font-family:inherit">EN</button><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#222222;color:#555;transition:all 0.15s;font-family:inherit">ES</button><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#222222;color:#555;transition:all 0.15s;font-family:inherit">
514FR</button><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#222222;color:#555;transition:all 0.15s;font-family:inherit">DE</button><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#222222;color:#555;transition:all 0.15s;font-family:inherit">JA</button><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#222222;color:#555;transition:all 0.15s;font-family:inherit">CA</button><button style="padding:4px 10px;border-radius:99px;font-size:11px;font-weight:500;border:none;cursor:pointer;background:#222222;color:#555;transition:all 0.15s;font-family:inherit">IT</button></div><a href="/landing" style="color:#444;font-size:13px;text-decoration:none">Back to Timeitt</a></div></div><!--$?--><template id="B:3"></template><!--/$--></div>
514<script>$RC("B:2","S:2")</script>
514<div hidden id="S:3"></div>
514<script>$RC("B:3","S:3")</script>
514<title>Home — Timeitt</title><meta name="description" content="Your Timeitt dashboard."/><meta property="og:title" content="Home — Timeitt"/><meta property="og:description" content="Your Timeitt dashboard."/><meta property="og:site_name" content="Timeitt"/><meta property="og:image" content="https://www.timeitt.com/heroTimeitt.png"/><meta property="og:image:width" content="2912"/><meta property="og:image:height" content="1632"/><meta property="og:image:alt" content="Timeitt — Save posts from X and read them on your schedule"/><meta property="og:type" content="website"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Home — Timeitt"/><meta name="twitter:description" content="Your Timeitt dashboard."/><meta name="twitter:image" content="https://www.timeitt.com/heroTimeitt.png"/><div hidden id="S:0"></div>
514<script>$RC("B:0","S:0")</script>
514<script>(self.__next_f=self.__next_f||[]).push([0])</script>
514<script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[9766,[],\"\"]\n3:I[8924,[],\"\"]\nb:I[7150,[],\"\"]\nd:I[4431,[],\"OutletBoundary\"]\nf:I[5278,[],\"AsyncMetadataOutlet\"]\n21:I[4431,[],\"ViewportBoundary\"]\n23:I[4431,[],\"MetadataBoundary\"]\n24:\"$Sreact.suspense\"\n26:I[2983,[\"8620\",\"static/chunks/app/home/page-62a2462c1b522076.js\"],\"HomeClient\"]\n:HL[\"/_next/static/css/65559c6c59d4ee8a.css\",\"style\"]\n4:T1745,"])</script>
514<script>self.__next_f.push([1,"\n  * { margin: 0; padding: 0; box-sizing: border-box; }\n  html, body { margin: 0; background: #000; }\n\n  .nf-page {\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n    background: #000;\n    min-height: 100vh;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    -webkit-font-smoothing: antialiased;\n    position: relative;\n    overflow: hidden;\n  }\n\n  /* ── Pensieve wisps ── */\n  .pw-root {\n    position: fixed;\n    inset: 0;\n    display: flex;\n    align-items: flex-end;\n    justify-content: center;\n    pointer-events: none;\n    z-index: 0;\n  }\n\n  .pw-basin {\n    position: absolute;\n    bottom: 38%;\n    left: 50%;\n    width: 260px;\n    height: 40px;\n    border-radius: 50%;\n    background: radial-gradient(ellipse, rgba(255,255,255,0.22) 0%, rgba(220,220,220,0.07) 60%, transparent 100%);\n    filter: blur(12px);\n    transform: translateX(-50%);\n    animation: pw-basin-pulse 6s ease-in-out infinite;\n  }\n\n  @keyframes pw-basin-pulse {\n    0%, 100% { opacity: 0.5; transform: translateX(-50%) scaleX(1); }\n    50%       { opacity: 0.7; transform: translateX(-50%) scaleX(1.05); }\n  }\n\n  .pw-wisp {\n    position: absolute;\n    bottom: 38%;\n    border-radius: 50%;\n    filter: blur(4px);\n  }\n\n  .pw-wisp-1  { left: calc(50% - 6px);  width: 12px; height: 18px; background: rgba(255,255,255,0.40); animation: pw-rise-1  9.0s ease-out 0.0s infinite; }\n  .pw-wisp-2  { left: calc(50% - 22px); width:  8px; height: 13px; background: rgba(220,220,220,0.30); animation: pw-rise-2  8.2s ease-out 1.5s infinite; }\n  .pw-wisp-3  { left: calc(50% + 10px); width: 14px; height: 20px; background: rgba(255,255,255,0.45); animation: pw-rise-3 10.0s ease-out 3.0s infinite; }\n  .pw-wisp-4  { left: calc(50% - 38px); width:  7px; height: 11px; background: rgba(230,230,230,0.28); animation: pw-rise-4  8.6s ease-out 4.5s infinite; }\n  .pw-wisp-5  { left: calc(50% + 28px); width: 11px; height: 16px; background: rgba(255,255,255,0.38); animation: pw-rise-5  9.5s ease-out 6.0s infinite; }\n  .pw-wisp-6  { left: calc(50% - 2px);  width:  9px; height: 14px; background: rgba(210,210,210,0.32); animation: pw-rise-6  8.8s ease-out 2.0s infinite; }\n  .pw-wisp-7  { left: calc(50% - 16px); width: 13px; height: 18px; background: rgba(255,255,255,0.42); animation: pw-rise-7  9.2s ease-out 5.0s infinite; }\n  .pw-wisp-8  { left: calc(50% + 20px); width:  6px; height: 10px; background: rgba(235,235,235,0.30); animation: pw-rise-8  8.4s ease-out 7.0s infinite; }\n  .pw-wisp-9  { left: calc(50% - 30px); width: 10px; height: 16px; background: rgba(255,255,255,0.36); animation: pw-rise-9  9.8s ease-out 3.8s infinite; }\n\n  @keyframes pw-rise-1 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 15% { opacity:0.72; } 85% { opacity:0.55; } 100% { opacity:0; transform:translateY(-220px) translateX(8px) scale(0.35); } }\n  @keyframes pw-rise-2 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 12% { opacity:0.65; } 88% { opacity:0.40; } 100% { opacity:0; transform:translateY(-200px) translateX(-12px) scale(0.40); } }\n  @keyframes pw-rise-3 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 18% { opacity:0.78; } 82% { opacity:0.50; } 100% { opacity:0; transform:translateY(-230px) translateX(5px) scale(0.30); } }\n  @keyframes pw-rise-4 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 14% { opacity:0.60; } 86% { opacity:0.45; } 100% { opacity:0; transform:translateY(-190px) translateX(-8px) scale(0.45); } }\n  @keyframes pw-rise-5 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 16% { opacity:0.70; } 84% { opacity:0.48; } 100% { opacity:0; transform:translateY(-210px) translateX(14px) scale(0.38); } }\n  @keyframes pw-rise-6 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 13% { opacity:0.62; } 87% { opacity:0.42; } 100% { opacity:0; transform:translateY(-225px) translateX(-6px) scale(0.32); } }\n  @keyframes pw-rise-7 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 20% { opacity:0.75; } 80% { opacity:0.50; } 100% { opacity:0; transform:translateY(-205px) translateX(10px) scale(0.42); } }\n  @keyframes pw-rise-8 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 11% { opacity:0.68; } 89% { opacity:0.44; } 100% { opacity:0; transform:translateY(-235px) translateX(-15px) scale(0.28); } }\n  @keyframes pw-rise-9 { 0% { opacity:0; transform:translateY(0) translateX(0) scale(1); } 17% { opacity:0.74; } 83% { opacity:0.52; } 100% { opacity:0; transform:translateY(-215px) translateX(7px) scale(0.36); } }\n\n  @media (prefers-reduced-motion: reduce) {\n    .pw-wisp, .pw-basin { animation: none !important; opacity: 0.25 !important; }\n  }\n\n  /* ── Content ── */\n  .nf-container {\n    text-align: center;\n    max-width: 420px;\n    padding: 40px 24px;\n    position: relative;\n    z-index: 1;\n    animation: nf-fade-up 0.6s cubic-bezier(0.16,1,0.3,1) both;\n  }\n\n  @keyframes nf-fade-up {\n    from { opacity: 0; transform: translateY(16px); }\n    to   { opacity: 1; transform: translateY(0); }\n  }\n\n  .nf-logo {\n    width: 48px;\n    height: 48px;\n    margin: 0 auto 28px;\n    display: block;\n    border-radius: 12px;\n  }\n\n  .nf-code {\n    font-size: 13px;\n    font-weight: 600;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    color: #555;\n    margin-bottom: 12px;\n  }\n\n  .nf-title {\n    color: #e7e9ea;\n    font-size: 22px;\n    font-weight: 600;\n    letter-spacing: -0.5px;\n    line-height: 1.3;\n    margin-bottom: 12px;\n  }\n\n  .nf-text {\n    color: #555;\n    font-size: 15px;\n    line-height: 1.6;\n    margin-bottom: 32px;\n  }\n\n  .nf-button {\n    display: inline-block;\n    background: #1d9bf0;\n    color: #fff;\n    font-size: 15px;\n    font-weight: 600;\n    padding: 12px 32px;\n    border-radius: 9999px;\n    text-decoration: none;\n    transition: background 0.2s;\n  }\n\n  .nf-button:hover { background: #1a8cd8; }\n"])</script>
514<script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"_S3AnPcyfH4UNJjdTvzAN\",\"p\":\"\",\"c\":[\"\",\"home\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"home\",{\"children\":[\"__PAGE__\",{}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/65559c6c59d4ee8a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"script\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"try{var t=localStorage.getItem('timeitt-theme');document.documentElement.dataset.theme=(t==='light'||t==='dark')?t:'dark';}catch(e){document.documentElement.dataset.theme='dark';}\"}}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.googleapis.com\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.gstatic.com\",\"crossOrigin\":\"anonymous\"}],[\"$\",\"link\",null,{\"rel\":\"stylesheet\",\"href\":\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600\u0026display=swap\"}],[\"$\",\"link\",null,{\"rel\":\"icon\",\"href\":\"/FaviconTimeittChromeExtension.png\",\"media\":\"(prefers-color-scheme: dark)\"}],[\"$\",\"link\",null,{\"rel\":\"icon\",\"href\":\"/FaviconTimeittChromeExtensionLight.png\",\"media\":\"(prefers-color-scheme: light)\"}],[\"$\",\"link\",null,{\"rel\":\"icon\",\"href\":\"/FaviconTimeittChromeExtension.png\"}]]}],[\"$\",\"body\",null,{\"children\":[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"$4\"}}],\"$L5\"],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]]}]]}],{\"children\":[\"home\",\"$L6\",{\"children\":[\"__PAGE__\",\"$L7\",{},null,false]},[\"$L8\",[],[]],false]},[\"$L9\",[],[]],false],\"$La\",false]],\"m\":\"$undefined\",\"G\":[\"$b\",[]],\"s\":false,\"S\":false}\n"])</script>
514<script>self.__next_f.push([1,"5:[\"$\",\"div\",null,{\"className\":\"nf-page\",\"children\":[[\"$\",\"div\",null,{\"aria-hidden\":\"true\",\"className\":\"pw-root\",\"children\":[[\"$\",\"div\",null,{\"className\":\"pw-basin\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-1\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-2\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-3\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-4\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-5\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-6\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-7\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-8\"}],[\"$\",\"div\",null,{\"className\":\"pw-wisp pw-wisp-9\"}]]}],[\"$\",\"div\",null,{\"className\":\"nf-container\",\"children\":[[\"$\",\"img\",null,{\"src\":\"/FaviconTimeittChromeExtensionLight.png\",\"alt\":\"Timeitt\",\"className\":\"nf-logo\"}],[\"$\",\"p\",null,{\"className\":\"nf-code\",\"children\":\"404\"}],[\"$\",\"h1\",null,{\"className\":\"nf-title\",\"children\":\"This memory seems to have dissolved.\"}],[\"$\",\"p\",null,{\"className\":\"nf-text\",\"children\":\"The page you're looking for is no longer here — but your Stories are waiting.\"}],[\"$\",\"a\",null,{\"href\":\"/\",\"className\":\"nf-button\",\"children\":\"Go home\"}]]}]]}]\n"])</script>
514<script>self.__next_f.push([1,"6:[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]\n7:[\"$\",\"$1\",\"c\",{\"children\":[\"$Lc\",null,[\"$\",\"$Ld\",null,{\"children\":[\"$Le\",[\"$\",\"$Lf\",null,{\"promise\":\"$@10\"}]]}]]}]\n11:T2841,"])</script>
514<script>self.__next_f.push([1,"\n@property --tl-angle { syntax: '\u003cangle\u003e'; initial-value: 0deg; inherits: false; }\n\n.tl-root {\n  position: fixed;\n  inset: 0;\n  z-index: 9999;\n  /* Defaults to the theme-aware page background set in globals.css, so the\n     splash never disagrees with the page underneath it. */\n  background: var(--tl-bg, var(--page-bg, #000));\n  display: grid;\n  place-items: center;\n  overflow: hidden;\n  /* Failsafe: if the JS bundle never arrives, never trap the page behind the splash. */\n  animation: tl-failsafe 0.4s ease 8s forwards;\n}\n.tl-root.tl-out {\n  animation: none;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.35s ease;\n}\n@keyframes tl-failsafe { to { opacity: 0; visibility: hidden; } }\n\n/* ── Drifting bubbles ───────────────────────────────────────────────\n   Negative animation-delays start every bubble mid-flight, so the very\n   first painted frame already has motion in it. */\n.tl-bubble {\n  position: absolute;\n  border-radius: 50%;\n  filter: blur(60px);\n  opacity: 0;\n  animation: tl-drift linear infinite;\n  pointer-events: none;\n}\n/* Extra mid-stops in each gradient: a single 0%→transparent ramp bands visibly\n   at this size, even under a 60px blur. */\n.tl-bubble-1 { width: 420px; height: 420px; left: -110px; bottom: -110px; background: radial-gradient(circle, rgba(29,155,240,0.42) 0%, rgba(29,155,240,0.20) 42%, rgba(29,155,240,0.05) 66%, transparent 78%); animation-duration: 18s; animation-delay: -9s; }\n.tl-bubble-2 { width: 320px; height: 320px; right: -70px; top: 8%;        background: radial-gradient(circle, rgba(60,160,255,0.34) 0%, rgba(60,160,255,0.16) 42%, rgba(60,160,255,0.04) 66%, transparent 78%); animation-duration: 22s; animation-delay: -6s; }\n.tl-bubble-3 { width: 240px; height: 240px; left: 16%; bottom: 12%;       background: radial-gradient(circle, rgba(100,180,255,0.30) 0%, rgba(100,180,255,0.14) 42%, rgba(100,180,255,0.04) 66%, transparent 78%); animation-duration: 26s; animation-delay: -11s; }\n.tl-bubble-4 { width: 190px; height: 190px; right: 14%; bottom: 16%;      background: radial-gradient(circle, rgba(29,155,240,0.36) 0%, rgba(29,155,240,0.17) 42%, rgba(29,155,240,0.04) 66%, transparent 78%); animation-duration: 20s; animation-delay: -4s; }\n.tl-bubble-5 { width: 300px; height: 300px; left: 34%; top: -40px;        background: radial-gradient(circle, rgba(60,160,255,0.26) 0%, rgba(60,160,255,0.12) 42%, rgba(60,160,255,0.03) 66%, transparent 78%); animation-duration: 30s; animation-delay: -15s; }\n/* Sits directly behind the panel — without it backdrop-filter has nothing to\n   blur and the glass reads as flat fill. */\n.tl-bubble-6 { width: 560px; height: 560px; left: 50%; top: 50%; margin: -280px 0 0 -280px; background: radial-gradient(circle, rgba(29,155,240,0.30) 0%, rgba(29,155,240,0.14) 40%, rgba(29,155,240,0.03) 64%, transparent 76%); filter: blur(70px); animation-duration: 24s; animation-delay: -12s; }\n@keyframes tl-drift {\n  0%   { transform: translateY(60px) scale(0.85); opacity: 0; }\n  10%  { opacity: 1; }\n  85%  { opacity: 1; }\n  100% { transform: translateY(-80px) scale(1.08); opacity: 0; }\n}\n\n/* ── Frosted glass panel ──────────────────────────────────────────── */\n.tl-panel {\n  position: relative;\n  width: 264px;\n  height: 164px;\n  border-radius: 24px;\n  border: 1px solid transparent;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 22px;\n  backdrop-filter: blur(24px) saturate(180%);\n  -webkit-backdrop-filter: blur(24px) saturate(180%);\n  background:\n    linear-gradient(rgba(22,24,28,0.72), rgba(22,24,28,0.72)) padding-box,\n    conic-gradient(from var(--tl-angle),\n      rgba(255,255,255,0.06) 0%,\n      rgba(255,255,255,0.06) 70%,\n      rgba(29,155,240,0.5) 85%,\n      rgba(255,255,255,0.06) 100%) border-box;\n  animation: tl-stroke 6s linear infinite, tl-panel-in 0.5s cubic-bezier(0.16,1,0.3,1) both;\n  box-shadow: 0 24px 60px rgba(0,0,0,0.45);\n}\n@keyframes tl-stroke { to { --tl-angle: 360deg; } }\n@keyframes tl-panel-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }\n\n/* ── Wisps rising inside the panel, behind the logo ───────────────── */\n.tl-basin {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  width: 150px;
514\n  height: 26px;\n  border-radius: 50%;\n  background: radial-gradient(ellipse, rgba(29,155,240,0.30) 0%, rgba(100,160,255,0.12) 60%, transparent 100%);\n  filter: blur(9px);\n  animation: tl-basin-pulse 4s ease-in-out infinite;\n  pointer-events: none;\n}\n@keyframes tl-basin-pulse {\n  0%, 100% { opacity: 0.5; transform: translateX(-50%) scaleX(1); }\n  50%      { opacity: 0.7; transform: translateX(-50%) scaleX(1.05); }\n}\n.tl-wisp { position: absolute; bottom: 4px; border-radius: 50%; filter: blur(4px); pointer-events: none; }\n.tl-wisp-1 { left: 42%; width: 11px; height: 17px; background: rgba(29,155,240,0.34);  animation: tl-rise-1 5.0s ease-out 0s   infinite; }\n.tl-wisp-2 { left: 33%; width: 8px;  height: 13px; background: rgba(214,232,255,0.55); animation: tl-rise-2 5.8s ease-out 0.9s infinite; }\n.tl-wisp-3 { left: 56%; width: 13px; height: 19px; background: rgba(60,160,255,0.30);  animation: tl-rise-3 5.4s ease-out 2.1s infinite; }\n.tl-wisp-4 { left: 62%; width: 7px;  height: 11px; background: rgba(220,236,255,0.50); animation: tl-rise-4 6.2s ease-out 3.0s infinite; }\n.tl-wisp-5 { left: 48%; width: 10px; height: 15px; background: rgba(29,155,240,0.28);  animation: tl-rise-5 5.6s ease-out 1.5s infinite; }\n@keyframes tl-rise-1 { 0% { opacity:0; transform:translate(0,0) scale(1); } 15% { opacity:0.7; } 85% { opacity:0.45; } 100% { opacity:0; transform:translate(7px,-104px) scale(0.34); } }\n@keyframes tl-rise-2 { 0% { opacity:0; transform:translate(0,0) scale(1); } 12% { opacity:0.62; } 88% { opacity:0.38; } 100% { opacity:0; transform:translate(-11px,-96px) scale(0.4); } }\n@keyframes tl-rise-3 { 0% { opacity:0; transform:translate(0,0) scale(1); } 18% { opacity:0.74; } 82% { opacity:0.48; } 100% { opacity:0; transform:translate(5px,-110px) scale(0.3); } }\n@keyframes tl-rise-4 { 0% { opacity:0; transform:translate(0,0) scale(1); } 14% { opacity:0.58; } 86% { opacity:0.36; } 100% { opacity:0; transform:translate(-8px,-92px) scale(0.42); } }\n@keyframes tl-rise-5 { 0% { opacity:0; transform:translate(0,0) scale(1); } 16% { opacity:0.68; } 84% { opacity:0.44; } 100% { opacity:0; transform:translate(12px,-100px) scale(0.36); } }\n\n/* ── Logo + indeterminate bar ─────────────────────────────────────── */\n.tl-logo { position: relative; z-index: 1; height: 30px; width: auto; animation: tl-logo-pulse 2.6s ease-in-out infinite; }\n@keyframes tl-logo-pulse { 0%, 100% { opacity: 0.92; } 50% { opacity: 0.6; } }\n.tl-logo--on-light { display: none; }\n\n.tl-bar {\n  position: relative;\n  z-index: 1;\n  width: 108px;\n  height: 3px;\n  border-radius: 999px;\n  background: rgba(255,255,255,0.08);\n  overflow: hidden;\n}\n.tl-bar::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(90deg, transparent 0%, rgba(29,155,240,0.95) 50%, transparent 100%);\n  transform: translateX(-100%);\n  animation: tl-bar-sweep 1.4s ease-in-out infinite;\n}\n@keyframes tl-bar-sweep { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }\n\n/* ── Light theme ──────────────────────────────────────────────────────\n   The dark palette is invisible on #FAF8F6, so swap to the muted blue-greys\n   already tuned for light mode in PensieveWisps on the landing page. */\n:root[data-theme=\"light\"] .tl-logo--on-dark  { display: none; }\n:root[data-theme=\"light\"] .tl-logo--on-light { display: block; }\n:root[data-theme=\"light\"] .tl-panel {\n  background:\n    linear-gradient(rgba(255,255,255,0.72), rgba(255,255,255,0.72)) padding-box,\n    conic-gradient(from var(--tl-angle),\n      rgba(0,0,0,0.06) 0%,\n      rgba(0,0,0,0.06) 70%,\n      rgba(29,155,240,0.45) 85%,\n      rgba(0,0,0,0.06) 100%) border-box;\n  box-shadow: 0 24px 60px rgba(80,90,120,0.18);\n}\n:root[data-theme=\"light\"] .tl-bubble-1 { background: radial-gradient(circle, rgba(29,100,200,0.30) 0%, rgba(29,100,200,0.14) 42%, rgba(29,100,200,0.04) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-2 { background: radial-gradient(circle, rgba(60,120,210,0.24) 0%, rgba(60,120,210,0.11) 42%, rgba(60,120,210,0.03) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-3 { background: radial-gradient(circle, rgba(100,120,170,0.24) 0%, rgba(100,120,170,0.11) 42%, rgba(100,120,170,0.03) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-4 { background: radial-gradient(circle, rgba(29,100,200,0.26) 0%, rgba(29,100,200,0.12) 42%, rgba(29,100,200,0.03) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-5 { background: radial-gradient(circle, rgba(90,110,160,0.20) 0%, rgba(90,110,160,0.09) 42%, rgba(90,110,160,0.02) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-6 { background: radial-gradient(circle, rgba(29,100,200,0.22) 0%, rgba(29,100,200,0.10) 40%, rgba(29,100,200,0.02) 64%, transparent 76%); }\n:root[data-theme=\"light\"] .tl-basin { background: radial-gradient(ellipse, rgba(29,100,200,0.16) 0%, rgba(80,120,200,0.07) 60%, transparent 100%); }\n:root[data-theme=\"light\"] .tl-wisp-1 { background: rgba(29,100,200,0.20); }\n:root[data-theme=\"light\"] .tl-wisp-2 { background: rgba(110,130,175,0.24); }\n:root[data-theme=\"light\"] .tl-wisp-3 { background: rgba(60,120,210,0.18); }\n:root[data-theme=\"light\"] .tl-wisp-4 { background: rgba(100,120,170,0.22); }\n:root[data-theme=\"light\"] .tl-wisp-5 { background: rgba(29,100,200,0.17); }\n:root[data-theme=\"light\"] .tl-bar { background: rgba(0,0,0,0.07); }\n\n@media (prefers-reduced-motion: reduce) {\n  .tl-panel, .tl-basin, .tl-wisp, .tl-logo, .tl-bar::after {\n    animation: none !important;\n  }\n  .tl-bubble { animation: none !important; opacity: 0.3 !important; }\n  .tl-bar::after { transform: none; opacity: 0.5; }\n}\n"])</script>
514<script>self.__next_f.push([1,"8:[\"$\",\"div\",\"l\",{\"className\":\"tl-root\",\"style\":\"$undefined\",\"role\":\"status\",\"aria-live\":\"polite\",\"aria-label\":\"Loading Timeitt\",\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"$11\"}}],\"$L12\",\"$L13\",\"$L14\",\"$L15\",\"$L16\",\"$L17\",\"$L18\"]}]\n19:T2841,"])</script>
514<script>self.__next_f.push([1,"\n@property --tl-angle { syntax: '\u003cangle\u003e'; initial-value: 0deg; inherits: false; }\n\n.tl-root {\n  position: fixed;\n  inset: 0;\n  z-index: 9999;\n  /* Defaults to the theme-aware page background set in globals.css, so the\n     splash never disagrees with the page underneath it. */\n  background: var(--tl-bg, var(--page-bg, #000));\n  display: grid;\n  place-items: center;\n  overflow: hidden;\n  /* Failsafe: if the JS bundle never arrives, never trap the page behind the splash. */\n  animation: tl-failsafe 0.4s ease 8s forwards;\n}\n.tl-root.tl-out {\n  animation: none;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.35s ease;\n}\n@keyframes tl-failsafe { to { opacity: 0; visibility: hidden; } }\n\n/* ── Drifting bubbles ───────────────────────────────────────────────\n   Negative animation-delays start every bubble mid-flight, so the very\n   first painted frame already has motion in it. */\n.tl-bubble {\n  position: absolute;\n  border-radius: 50%;\n  filter: blur(60px);\n  opacity: 0;\n  animation: tl-drift linear infinite;\n  pointer-events: none;\n}\n/* Extra mid-stops in each gradient: a single 0%→transparent ramp bands visibly\n   at this size, even under a 60px blur. */\n.tl-bubble-1 { width: 420px; height: 420px; left: -110px; bottom: -110px; background: radial-gradient(circle, rgba(29,155,240,0.42) 0%, rgba(29,155,240,0.20) 42%, rgba(29,155,240,0.05) 66%, transparent 78%); animation-duration: 18s; animation-delay: -9s; }\n.tl-bubble-2 { width: 320px; height: 320px; right: -70px; top: 8%;        background: radial-gradient(circle, rgba(60,160,255,0.34) 0%, rgba(60,160,255,0.16) 42%, rgba(60,160,255,0.04) 66%, transparent 78%); animation-duration: 22s; animation-delay: -6s; }\n.tl-bubble-3 { width: 240px; height: 240px; left: 16%; bottom: 12%;       background: radial-gradient(circle, rgba(100,180,255,0.30) 0%, rgba(100,180,255,0.14) 42%, rgba(100,180,255,0.04) 66%, transparent 78%); animation-duration: 26s; animation-delay: -11s; }\n.tl-bubble-4 { width: 190px; height: 190px; right: 14%; bottom: 16%;      background: radial-gradient(circle, rgba(29,155,240,0.36) 0%, rgba(29,155,240,0.17) 42%, rgba(29,155,240,0.04) 66%, transparent 78%); animation-duration: 20s; animation-delay: -4s; }\n.tl-bubble-5 { width: 300px; height: 300px; left: 34%; top: -40px;        background: radial-gradient(circle, rgba(60,160,255,0.26) 0%, rgba(60,160,255,0.12) 42%, rgba(60,160,255,0.03) 66%, transparent 78%); animation-duration: 30s; animation-delay: -15s; }\n/* Sits directly behind the panel — without it backdrop-filter has nothing to\n   blur and the glass reads as flat fill. */\n.tl-bubble-6 { width: 560px; height: 560px; left: 50%; top: 50%; margin: -280px 0 0 -280px; background: radial-gradient(circle, rgba(29,155,240,0.30) 0%, rgba(29,155,240,0.14) 40%, rgba(29,155,240,0.03) 64%, transparent 76%); filter: blur(70px); animation-duration: 24s; animation-delay: -12s; }\n@keyframes tl-drift {\n  0%   { transform: translateY(60px) scale(0.85); opacity: 0; }\n  10%  { opacity: 1; }\n  85%  { opacity: 1; }\n  100% { transform: translateY(-80px) scale(1.08); opacity: 0; }\n}\n\n/* ── Frosted glass panel ──────────────────────────────────────────── */\n.tl-panel {\n  position: relative;\n  width: 264px;\n  height: 164px;\n  border-radius: 24px;\n  border: 1px solid transparent;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 22px;\n  backdrop-filter: blur(24px) saturate(180%);\n  -webkit-backdrop-filter: blur(24px) saturate(180%);\n  background:\n    linear-gradient(rgba(22,24,28,0.72), rgba(22,24,28,0.72)) padding-box,\n    conic-gradient(from var(--tl-angle),\n      rgba(255,255,255,0.06) 0%,\n      rgba(255,255,255,0.06) 70%,\n      rgba(29,155,240,0.5) 85%,\n      rgba(255,255,255,0.06) 100%) border-box;\n  animation: tl-stroke 6s linear infinite, tl-panel-in 0.5s cubic-bezier(0.16,1,0.3,1) both;\n  box-shadow: 0 24px 60px rgba(0,0,0,0.45);\n}\n@keyframes tl-stroke { to { --tl-angle: 360deg; } }\n@keyframes tl-panel-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } to { opacity: 1; transform: none; } }\n\n/* ── Wisps rising inside the panel, behind the logo ───────────────── */\n.tl-basin {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  width: 150px;
514\n  height: 26px;\n  border-radius: 50%;\n  background: radial-gradient(ellipse, rgba(29,155,240,0.30) 0%, rgba(100,160,255,0.12) 60%, transparent 100%);\n  filter: blur(9px);\n  animation: tl-basin-pulse 4s ease-in-out infinite;\n  pointer-events: none;\n}\n@keyframes tl-basin-pulse {\n  0%, 100% { opacity: 0.5; transform: translateX(-50%) scaleX(1); }\n  50%      { opacity: 0.7; transform: translateX(-50%) scaleX(1.05); }\n}\n.tl-wisp { position: absolute; bottom: 4px; border-radius: 50%; filter: blur(4px); pointer-events: none; }\n.tl-wisp-1 { left: 42%; width: 11px; height: 17px; background: rgba(29,155,240,0.34);  animation: tl-rise-1 5.0s ease-out 0s   infinite; }\n.tl-wisp-2 { left: 33%; width: 8px;  height: 13px; background: rgba(214,232,255,0.55); animation: tl-rise-2 5.8s ease-out 0.9s infinite; }\n.tl-wisp-3 { left: 56%; width: 13px; height: 19px; background: rgba(60,160,255,0.30);  animation: tl-rise-3 5.4s ease-out 2.1s infinite; }\n.tl-wisp-4 { left: 62%; width: 7px;  height: 11px; background: rgba(220,236,255,0.50); animation: tl-rise-4 6.2s ease-out 3.0s infinite; }\n.tl-wisp-5 { left: 48%; width: 10px; height: 15px; background: rgba(29,155,240,0.28);  animation: tl-rise-5 5.6s ease-out 1.5s infinite; }\n@keyframes tl-rise-1 { 0% { opacity:0; transform:translate(0,0) scale(1); } 15% { opacity:0.7; } 85% { opacity:0.45; } 100% { opacity:0; transform:translate(7px,-104px) scale(0.34); } }\n@keyframes tl-rise-2 { 0% { opacity:0; transform:translate(0,0) scale(1); } 12% { opacity:0.62; } 88% { opacity:0.38; } 100% { opacity:0; transform:translate(-11px,-96px) scale(0.4); } }\n@keyframes tl-rise-3 { 0% { opacity:0; transform:translate(0,0) scale(1); } 18% { opacity:0.74; } 82% { opacity:0.48; } 100% { opacity:0; transform:translate(5px,-110px) scale(0.3); } }\n@keyframes tl-rise-4 { 0% { opacity:0; transform:translate(0,0) scale(1); } 14% { opacity:0.58; } 86% { opacity:0.36; } 100% { opacity:0; transform:translate(-8px,-92px) scale(0.42); } }\n@keyframes tl-rise-5 { 0% { opacity:0; transform:translate(0,0) scale(1); } 16% { opacity:0.68; } 84% { opacity:0.44; } 100% { opacity:0; transform:translate(12px,-100px) scale(0.36); } }\n\n/* ── Logo + indeterminate bar ─────────────────────────────────────── */\n.tl-logo { position: relative; z-index: 1; height: 30px; width: auto; animation: tl-logo-pulse 2.6s ease-in-out infinite; }\n@keyframes tl-logo-pulse { 0%, 100% { opacity: 0.92; } 50% { opacity: 0.6; } }\n.tl-logo--on-light { display: none; }\n\n.tl-bar {\n  position: relative;\n  z-index: 1;\n  width: 108px;\n  height: 3px;\n  border-radius: 999px;\n  background: rgba(255,255,255,0.08);\n  overflow: hidden;\n}\n.tl-bar::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(90deg, transparent 0%, rgba(29,155,240,0.95) 50%, transparent 100%);\n  transform: translateX(-100%);\n  animation: tl-bar-sweep 1.4s ease-in-out infinite;\n}\n@keyframes tl-bar-sweep { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }\n\n/* ── Light theme ──────────────────────────────────────────────────────\n   The dark palette is invisible on #FAF8F6, so swap to the muted blue-greys\n   already tuned for light mode in PensieveWisps on the landing page. */\n:root[data-theme=\"light\"] .tl-logo--on-dark  { display: none; }\n:root[data-theme=\"light\"] .tl-logo--on-light { display: block; }\n:root[data-theme=\"light\"] .tl-panel {\n  background:\n    linear-gradient(rgba(255,255,255,0.72), rgba(255,255,255,0.72)) padding-box,\n    conic-gradient(from var(--tl-angle),\n      rgba(0,0,0,0.06) 0%,\n      rgba(0,0,0,0.06) 70%,\n      rgba(29,155,240,0.45) 85%,\n      rgba(0,0,0,0.06) 100%) border-box;\n  box-shadow: 0 24px 60px rgba(80,90,120,0.18);\n}\n:root[data-theme=\"light\"] .tl-bubble-1 { background: radial-gradient(circle, rgba(29,100,200,0.30) 0%, rgba(29,100,200,0.14) 42%, rgba(29,100,200,0.04) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-2 { background: radial-gradient(circle, rgba(60,120,210,0.24) 0%, rgba(60,120,210,0.11) 42%, rgba(60,120,210,0.03) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-3 { background: radial-gradient(circle, rgba(100,120,170,0.24) 0%, rgba(100,120,170,0.11) 42%, rgba(100,120,170,0.03) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-4 { background: radial-gradient(circle, rgba(29,100,200,0.26) 0%, rgba(29,100,200,0.12) 42%, rgba(29,100,200,0.03) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-5 { background: radial-gradient(circle, rgba(90,110,160,0.20) 0%, rgba(90,110,160,0.09) 42%, rgba(90,110,160,0.02) 66%, transparent 78%); }\n:root[data-theme=\"light\"] .tl-bubble-6 { background: radial-gradient(circle, rgba(29,100,200,0.22) 0%, rgba(29,100,200,0.10) 40%, rgba(29,100,200,0.02) 64%, transparent 76%); }\n:root[data-theme=\"light\"] .tl-basin { background: radial-gradient(ellipse, rgba(29,100,200,0.16) 0%, rgba(80,120,200,0.07) 60%, transparent 100%); }\n:root[data-theme=\"light\"] .tl-wisp-1 { background: rgba(29,100,200,0.20); }\n:root[data-theme=\"light\"] .tl-wisp-2 { background: rgba(110,130,175,0.24); }\n:root[data-theme=\"light\"] .tl-wisp-3 { background: rgba(60,120,210,0.18); }\n:root[data-theme=\"light\"] .tl-wisp-4 { background: rgba(100,120,170,0.22); }\n:root[data-theme=\"light\"] .tl-wisp-5 { background: rgba(29,100,200,0.17); }\n:root[data-theme=\"light\"] .tl-bar { background: rgba(0,0,0,0.07); }\n\n@media (prefers-reduced-motion: reduce) {\n  .tl-panel, .tl-basin, .tl-wisp, .tl-logo, .tl-bar::after {\n    animation: none !important;\n  }\n  .tl-bubble { animation: none !important; opacity: 0.3 !important; }\n  .tl-bar::after { transform: none; opacity: 0.5; }\n}\n"])</script>
514<script>self.__next_f.push([1,"9:[\"$\",\"div\",\"l\",{\"className\":\"tl-root\",\"style\":\"$undefined\",\"role\":\"status\",\"aria-live\":\"polite\",\"aria-label\":\"Loading Timeitt\",\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"$19\"}}],\"$L1a\",\"$L1b\",\"$L1c\",\"$L1d\",\"$L1e\",\"$L1f\",\"$L20\"]}]\na:[\"$\",\"$1\",\"h\",{\"children\":[null,[[\"$\",\"$L21\",null,{\"children\":\"$L22\"}],null],[\"$\",\"$L23\",null,{\"children\":[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$24\",null,{\"fallback\":null,\"children\":\"$L25\"}]}]}]]}]\n12:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-1\"}]\n13:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-2\"}]\n14:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-3\"}]\n15:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-4\"}]\n16:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-5\"}]\n17:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-6\"}]\n18:[\"$\",\"div\",null,{\"className\":\"tl-panel\",\"children\":[[\"$\",\"div\",null,{\"className\":\"tl-basin\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-1\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-2\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-3\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-4\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-5\"}],[\"$\",\"img\",null,{\"src\":\"/logo.svg\",\"alt\":\"Timeitt\",\"className\":\"tl-logo tl-logo--on-dark\"}],[\"$\",\"img\",null,{\"src\":\"/logoDark.svg\",\"alt\":\"\",\"aria-hidden\":\"true\",\"className\":\"tl-logo tl-logo--on-light\"}],[\"$\",\"div\",null,{\"className\":\"tl-bar\"}]]}]\n1a:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-1\"}]\n1b:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-2\"}]\n1c:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-3\"}]\n1d:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-4\"}]\n1e:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-5\"}]\n1f:[\"$\",\"div\",null,{\"className\":\"tl-bubble tl-bubble-6\"}]\n20:[\"$\",\"div\",null,{\"className\":\"tl-panel\",\"children\":[[\"$\",\"div\",null,{\"className\":\"tl-basin\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-1\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-2\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-3\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp"])</script>
514<script>self.__next_f.push([1," tl-wisp-4\"}],[\"$\",\"div\",null,{\"className\":\"tl-wisp tl-wisp-5\"}],[\"$\",\"img\",null,{\"src\":\"/logo.svg\",\"alt\":\"Timeitt\",\"className\":\"tl-logo tl-logo--on-dark\"}],[\"$\",\"img\",null,{\"src\":\"/logoDark.svg\",\"alt\":\"\",\"aria-hidden\":\"true\",\"className\":\"tl-logo tl-logo--on-light\"}],[\"$\",\"div\",null,{\"className\":\"tl-bar\"}]]}]\nc:[\"$\",\"$L26\",null,{\"token\":null,\"name\":null,\"tier\":\"free\",\"email\":null,\"avatarUrl\":null,\"calendarConnected\":false,\"locale\":null,\"unscheduledCount\":0,\"upcomingCount\":0,\"scheduleCapPerDay\":1,\"currentStreak\":0,\"totalPostsSaved\":0,\"totalSessions\":0,\"totalMinutes\":0,\"lastSession\":null}]\n22:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1, viewport-fit=cover\"}]]\ne:null\n"])</script>
514<script>self.__next_f.push([1,"10:{\"metadata\":[[\"$\",\"title\",\"0\",{\"children\":\"Home — Timeitt\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Your Timeitt dashboard.\"}],[\"$\",\"meta\",\"2\",{\"property\":\"og:title\",\"content\":\"Home — Timeitt\"}],[\"$\",\"meta\",\"3\",{\"property\":\"og:description\",\"content\":\"Your Timeitt dashboard.\"}],[\"$\",\"meta\",\"4\",{\"property\":\"og:site_name\",\"content\":\"Timeitt\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:image\",\"content\":\"https://www.timeitt.com/heroTimeitt.png\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:image:width\",\"content\":\"2912\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:image:height\",\"content\":\"1632\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:image:alt\",\"content\":\"Timeitt — Save posts from X and read them on your schedule\"}],[\"$\",\"meta\",\"9\",{\"property\":\"og:type\",\"content\":\"website\"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:title\",\"content\":\"Home — Timeitt\"}],[\"$\",\"meta\",\"12\",{\"name\":\"twitter:description\",\"content\":\"Your Timeitt dashboard.\"}],[\"$\",\"meta\",\"13\",{\"name\":\"twitter:image\",\"content\":\"https://www.timeitt.com/heroTimeitt.png\"}]],\"error\":null,\"digest\":\"$undefined\"}\n"])</script>
514<script>self.__next_f.push([1,"25:\"$10:metadata\"\n"])</script>
514</body></html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.