PageSourceSearch

https://gratitude-journey-journal-m6dpzqrq.taskade.app/_siteWideProtection

html gratitude-journey-journal-m6dpzqrq.taskade.app collected 2026-10-03 15:00:55 UTC 22,180 bytes, 754 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <title>Password Protected</title>
7  <!-- Google Analytics 4 -->
vendor: 66 bytes, lines 7-8
7
8  <script async src="https://www.googletagmanager.com/gtag/js?id=
8G-WWJTNN1SFE
vendor: 14 bytes, lines 8-9
8"></script>
9  
9<script>
10    
vendor: 139 bytes, lines 10-13
10window.dataLayer = window.dataLayer || [];
11    function gtag(){dataLayer.push(arguments);}
12    gtag('js', new Date());
13    gtag('config', '
13G-WWJTNN1SFE
vendor: 6 bytes, lines 13-14
13');
14  
14</script>
14
15  
15<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.js"></script>
15
16  <style>
17    @import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500&family=Geist+Mono:wght@300;400&display=swap');
18    
19    * {
20      margin: 0;
21      padding: 0;
22      box-sizing: border-box;
23    }
24
25    :root {
26      /* Geist-inspired Minimal Palette */
27      --void: #000000;
28      --taskade-heart: #ff2d60;
29      --dream-coral: #ff6b8a;
30      --memory-azure: #4a9eff;
31      --spirit-jade: #2dd4aa;
32      --whisper-gold: #ffa726;
33      --consciousness-white: rgba(255, 255, 255, 0.9);
34      --dream-mist: rgba(255, 255, 255, 0.12);
35      --heart-glow: rgba(255, 45, 96, 0.08);
36      --spirit-flow: rgba(77, 182, 172, 0.06);
37      
38      --font-mono: 'Geist Mono', 'SF Mono', Consolas, monospace;
39      --font-display: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
40      --ease-cinematic: cubic-bezier(0.22, 1, 0.36, 1);
41      --ease-cinematic-slow: cubic-bezier(0.16, 1, 0.3, 1);
42
43      /* Dark theme (default) */
44      --bg-color: var(--void);
45      --text-color: var(--consciousness-white);
46      --text-secondary: rgba(255, 255, 255, 0.6);
47      --error-bg: rgba(255, 45, 96, 0.08);
48      --error-border: var(--taskade-heart);
49      --error-text: var(--dream-coral);
50      --border-color: rgba(255, 255, 255, 0.1);
51      --border-hover: rgba(255, 255, 255, 0.2);
52      --btn-hover-bg: rgba(255, 255, 255, 0.05);
53      --glass-bg: rgba(0, 0, 0, 0.4);
54      --glass-border: rgba(255, 255, 255, 0.1);
55      --input-bg: rgba(255, 255, 255, 0.05);
56      --input-focus-bg: rgba(255, 255, 255, 0.08);
57
58      /* Ambient orb colorway (OKLCH) */
59      --orb-bg: oklch(12.9% 0.042 264.695);
60      --orb-c1: oklch(44.4% 0.070 26.899);
61      --orb-c2: oklch(82% 0.055 91.936);
62      --orb-c3: oklch(56% 0.065 241.966);
63    }
64
65    [data-theme="light"] {
66      /* Light theme */
67      --void: #ffffff;
68      --consciousness-white: rgba(0, 0, 0, 0.85);
69      --dream-mist: rgba(0, 0, 0, 0.08);
70      --heart-glow: rgba(255, 45, 96, 0.06);
71      --spirit-flow: rgba(77, 182, 172, 0.04);
72
73      --bg-color: var(--void);
74      --text-color: var(--consciousness-white);
75      --text-secondary: rgba(0, 0, 0, 0.6);
76      --error-bg: rgba(255, 45, 96, 0.06);
77      --error-border: var(--taskade-heart);
78      --error-text: #dc3545;
79      --border-color: rgba(0, 0, 0, 0.1);
80      --border-hover: rgba(0, 0, 0, 0.2);
81      --btn-hover-bg: rgba(0, 0, 0, 0.05);
82      --glass-bg: rgba(255, 255, 255, 0.4);
83      --glass-border: rgba(0, 0, 0, 0.1);
84      --input-bg: rgba(0, 0, 0, 0.03);
85      --input-focus-bg: rgba(0, 0, 0, 0.05);
86
87      /* Light theme ambient orb palette */
88      --orb-bg: oklch(98% 0.01 264.695);
89      --orb-c1: oklch(60% 0.08 26.899);
90      --orb-c2: oklch(92% 0.06 91.936);
91      --orb-c3: oklch(70% 0.07 241.966);
92    }
93
94    /* Visually hidden but accessible to screen readers */
95    .visually-hidden {
96      position: absolute;
97      width: 1px;
98      height: 1px;
99      padding: 0;
100      margin: -1px;
101      overflow: hidden;
102      clip: rect(0, 0, 0, 0);
103      white-space: nowrap;
104      border: 0;
105    }
106
107    /* Default to dark mode, light mode on system preference */
108    @media (prefers-color-scheme: light) {
109      :root {
110        --void: #ffffff;
111        --consciousness-white: rgba(0, 0, 0, 0.85);
112        --dream-mist: rgba(0, 0, 0, 0.08);
113        --heart-glow: rgba(255, 45, 96, 0.06);
114        --spirit-flow: rgba(77, 182, 172, 0.04);
115
116        --bg-color: var(--void);
117        --text-color: var(--consciousness-white);
118        --text-secondary: rgba(0, 0, 0, 0.6);
119        --error-bg: rgba(255, 45, 96, 0.06);
120        --error-border: var(--taskade-heart);
121        --error-text: #dc3545;
122        --border-color: rgba(0, 0, 0, 0.1);
123        --border-hover: rgba(0, 0, 0, 0.2);
124        --btn-hover-bg: rgba(0, 0, 0, 0.05);
125        --glass-bg: rgba(255, 255, 255, 0.4);
126        --glass-border: rgba(0, 0, 0, 0.1);
127        --input-bg: rgba(0, 0, 0, 0.03);
128        --input-focus-bg: rgba(0, 0, 0, 0.05);
129
130        /* Light theme ambient orb palette */
131        --orb-bg: oklch(98% 0.01 264.695);
132        --orb-c1: oklch(60% 0.08 26.899);
133        --orb-c2: oklch(92% 0.06 91.936);
134        --orb-c3: oklch(70% 0.07 241.966);
135      }
136    }
137
138    body {
139      font-family: var(--font-display);
140      background: var(--bg-color);
141      color: var(--text-color);
142      min-height: 100vh;
143      display: flex;
144      align-items: center;
145      justify-content: center;
146      -webkit-font-smoothing: antialiased;
147      -moz-osx-font-smoothing: grayscale;
148      text-rendering: optimizeLegibility;
149      font-kerning: normal;
150      transition: background-color 600ms var(--ease-cinematic), color 600ms var(--ease-cinematic);
151    }
152
153    .container {
154      text-align: center;
155      position: relative;
156      z-index: 1;
157      max-width: 480px;
158      width: 100%;
159      padding: 2rem;
160    }
161
162    .lock-icon {
163      width: 64px;
164      height: 64px;
165      margin: 0 auto 1.5rem;
166      color: var(--text-secondary);
167      opacity: 0.6;
168    }
169
170    h1 {
171      font-size: 1.75rem;
172      font-weight: 400;
173      color: var(--text-color);
174      letter-spacing: 0.025em;
175      margin-bottom: 0.75rem;
176      -webkit-font-smoothing: antialiased;
177    }
178
179    .description {
180      font-size: 1rem;
181      color: var(--text-secondary);
182      margin-bottom: 2rem;
183      font-weight: 300;
184      line-height: 1.5;
185      letter-spacing: 0.01em;
186    }
187
188    /* Genesis Minimal Messages */
189    .genesis-whispers {
190      font-family: var(--font-display);
191      font-size: 1.05rem;
192      font-weight: 300;
193      color: var(--consciousness-white);
194      letter-spacing: 0.015em;
195      opacity: 0.75;
196      margin: 0 0 2.5rem 0;
197      min-height: 1.6em;
198      animation: geist-whisper 24s var(--ease-cinematic) infinite;
199      text-shadow: 0 2px 16px rgba(255,255,255,0.08);
200      filter: blur(0);
201      transform: translateY(0) scale(1);
202      transform-origin: center;
203      backdrop-filter: blur(0.25vmin);
204      line-height: 1.28;
205      -webkit-font-smoothing: antialiased;
206    }
207
208    /* Geist Minimal Whisper Animation */
209    @keyframes geist-whisper {
210      0%, 6% { opacity: 0; transform: translateY(6px) scale(0.985); filter: blur(1.2px); }
211      14%, 86% { opacity: 0.85; transform: translateY(0) scale(1); filter: blur(0); }
212      94%, 100% { opacity: 0; transform: translateY(-6px) scale(0.985); filter: blur(1.2px); }
213    }
214
215    .password-form {
216      display: flex;
217      flex-direction: column;
218      gap: 1rem;
219      margin-bottom: 1.5rem;
220    }
221
222    .input-wrapper {
223      position: relative;
224      width: 100%;
225    }
226
227    .password-input {
228      width: 100%;
229      padding: 1rem 3rem 1rem 1.25rem;
230      background: var(--input-bg);
231      backdrop-filter: blur(12px);
232      border: 1px solid var(--glass-border);
233      border-radius: 12px;
234      font-size: 1rem;
235      font-weight: 400;
236      color: var(--text-color);
237      font-family: var(--font-display);
238      letter-spacing: 0.01em;
239      transition: all 300ms var(--ease-cinematic);
240      outline: none;
241    }
242
243    .password-input::placeholder {
244      color: var(--text-secondary);
245      opacity: 0.5;
246    }
247
248    .password-input:focus {
249      background: var(--input-focus-bg);
250      border-color: var(--border-hover);
251      box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
252    }
253
254    .toggle-password {
255      position: absolute;
256      right: 1rem;
257      top: 50%;
258      transform: translateY(-50%);
259      background: none;
260      border: none;
261      color: var(--text-secondary);
262      cursor: pointer;
263      padding: 0.5rem;
264      display: flex;
265      align-items: center;
266      justify-content: center;
267      transition: color 200ms var(--ease-cinematic);
268    }
269
270    .toggle-password:hover {
271      color: var(--text-color);
272    }
273
274    .toggle-password i {
275      width: 20px;
276      height: 20px;
277    }
278
279    .submit-btn {
280      padding: 1rem 2rem;
281      background: var(--glass-bg);
282      backdrop-filter: blur(12px);
283      border: 1px solid var(--glass-border);
284      border-radius: 12px;
285      font-size: 1rem;
286      font-weight: 400;
287      cursor: pointer;
288      color: var(--text-color);
289      font-family: var(--font-display);
290      letter-spacing: 0.01em;
291      transition: all 300ms var(--ease-cinematic);
292      display: inline-flex;
293      align-items: center;
294      justify-content: center;
295      gap: 0.5rem;
296    }
297
298    .submit-btn:hover:not(:disabled) {
299      background: var(--btn-hover-bg);
300      border-color: var(--border-hover);
301      transform: translateY(-2px);
302      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
303    }
304
305    .submit-btn:disabled {
306      opacity: 0.5;
307      cursor: not-allowed;
308    }
309
310    .submit-btn.loading {
311      pointer-events: none;
312    }
313
314    .submit-btn i {
315      width: 20px;
316      height: 20px;
317    }
318
319    .error-message {
320      margin-top: 1rem;
321      padding: 1rem 1.25rem;
322      background: var(--error-bg);
323      backdrop-filter: blur(12px);
324      border-radius: 12px;
325      border: 1px solid var(--error-border);
326      font-size: 0.9rem;
327      color: var(--error-text);
328      text-align: left;
329      display: none;
330      animation: shake 0.5s var(--ease-cinematic);
331    }
332
333    .error-message.show {
334      display: flex;
335      align-items: center;
336      gap: 0.75rem;
337    }
338
339    .error-message i {
340      width: 18px;
341      height: 18px;
342      flex-shrink: 0;
343    }
344
345    @keyframes shake {
346      0%, 100% { transform: translateX(0); }
347      10%, 30%, 50%, 70%, 90% { transform: translateX(-4px); }
348      20%, 40%, 60%, 80% { transform: translateX(4px); }
349    }
350
351    /* Vignette effect */
352    .vignette {
353      position: fixed;
354      inset: 0;
355      background: radial-gradient(
356        ellipse 50% 35% at center,
357        transparent 0%,
358        transparent 60%,
359        rgba(0, 0, 0, 0.15) 100%
360      );
361      pointer-events: none;
362      z-index: 0;
363    }
364
365    [data-theme="light"] .vignette {
366      background: radial-gradient(
367        ellipse 50% 35% at center,
368        transparent 0%,
369        transparent 60%,
370        rgba(255, 255, 255, 0.15) 100%
371      );
372    }
373
374    /* Responsive */
375    @media (max-width: 768px) {
376      .container {
377        padding: 1.5rem;
378        max-width: 100%;
379      }
380
381      h1 {
382        font-size: 1.5rem;
383      }
384      
385      .description {
386        font-size: 0.9rem;
387      }
388
389      .lock-icon {
390        width: 56px;
391        height: 56px;
392      }
393    }
394
395    @media (max-width: 480px) {
396      .container {
397        padding: 1rem;
398      }
399
400      h1 {
401        font-size: 1.25rem;
402      }
403      
404      .description {
405        font-size: 0.85rem;
406      }
407
408      .lock-icon {
409        width: 48px;
410        height: 48px;
411      }
412
413      .password-input {
414        padding: 0.875rem 3rem 0.875rem 1rem;
415      }
416
417      .submit-btn {
418        padding: 0.875rem 1.5rem;
419      }
420    }
421
422    /* Background Orb Effects */
423    @property --angle {
424      syntax: "<angle>";
425      inherits: false;
426      initial-value: 0deg;
427    }
428
429    /* Orb field */
430    .orb-field {
431      position: fixed;
432      inset: 0;
433      pointer-events: none;
434      z-index: 1;
435      display: grid;
436      place-items: center;
437    }
438
439    .orb {
440      position: relative;
441      display: grid;
442      grid-template-areas: "stack";
443      aspect-ratio: 1;
444      overflow: hidden;
445      border-radius: 50%;
446      inline-size: min(64vmin, 80vw);
447      filter: blur(3.2vmin) contrast(1.0) saturate(0.9) brightness(0.95);
448      mix-blend-mode: screen;
449      will-change: transform, filter, opacity;
450      animation: orb-breathe 28s var(--ease-cinematic-slow) infinite;
451      backdrop-filter: blur(2vmin) saturate(1.1);
452      opacity: 0.3;
453    }
454
455    [data-theme="light"] .orb { 
456      mix-blend-mode: multiply; 
457      opacity: 0.2;
458    }
459
460    .orb::before,
461    .orb::after {
462      content: "";
463      display: block;
464      grid-area: stack;
465      width: 100%;
466      height: 100%;
467      border-radius: 50%;
468      transform: translateZ(0);
469    }
470
471    .orb::before {
472      background:
473        conic-gradient(
474          from calc(var(--angle) * 2) at 25% 70%,
475          var(--orb-c3),
476          transparent 20% 80%,
477          var(--orb-c3)
478        ),
479        conic-gradient(
480          from calc(var(--angle) * 2) at 45% 75%,
481          var(--orb-c2),
482          transparent 30% 60%,
483          var(--orb-c2)
484        ),
485        conic-gradient(
486          from calc(var(--angle) * -3) at 80% 20%,
487          var(--orb-c1),
488          transparent 40% 60%,
489          var(--orb-c1)
490        ),
491        conic-gradient(
492          from calc(var(--angle) * 2) at 15% 5%,
493          var(--orb-c2),
494          transparent 10% 90%,
495          var(--orb-c2)
496        ),
497        conic-gradient(
498          from calc(var(--angle) * 1) at 20% 80%,
499          var(--orb-c1),
500          transparent 10% 90%,
501          var(--orb-c1)
502        ),
503        conic-gradient(
504          from calc(var(--angle) * -2) at 85% 10%,
505          var(--orb-c3),
506          transparent 20% 80%,
507          var(--orb-c3)
508        );
509      box-shadow: inset var(--orb-bg) 0 0 9vmin 1.8vmin, 0 0 12vmin rgba(0,0,0,0.18);
510      filter: blur(4vmin) contrast(2.8) saturate(0.85) brightness(0.82);
511      animation: rotate 90s linear infinite;
512    }
513
514    .orb::after {
515      --dot: 1.5px;
516      background-image: radial-gradient(circle at center, var(--orb-bg) var(--dot), transparent var(--dot));
517      background-size: calc(var(--dot) * 2) calc(var(--dot) * 2);
518      -webkit-mask-image: radial-gradient(black 25%, transparent 75%);
519      mask-image: radial-gradient(black 25%, transparent 75%);
520      backdrop-filter: blur(11vmin) contrast(5.5) brightness(0.85);
521      mix-blend-mode: soft-light;
522      opacity: 0.6;
523    }
524
525    @keyframes rotate { to { --angle: 360deg; } }
526
527    @keyframes orb-breathe {
528      0% { transform: translate3d(0,0,0) scale(0.95); opacity: 0.25; filter: blur(2.6vmin) contrast(1.02); }
529      25% { transform: translate3d(0,0,0) scale(1.01); opacity: 0.32; filter: blur(2.8vmin) contrast(1.05); }
530      50% { transform: translate3d(0,0,0) scale(1.03); opacity: 0.36; filter: blur(3vmin) contrast(1.08); }
531      75% { transform: translate3d(0,0,0) scale(1.00); opacity: 0.3; filter: blur(2.8vmin) contrast(1.05); }
532      100% { transform: translate3d(0,0,0) scale(0.95); opacity: 0.25; filter: blur(2.6vmin) contrast(1.02); }
533    }
534
535    [data-theme="light"] .orb {
536      opacity: 0.15;
537    }
538
539    [data-theme="light"] @keyframes orb-breathe {
540      0% { transform: translate3d(0,0,0) scale(0.95); opacity: 0.15; filter: blur(2.6vmin) contrast(1.02); }
541      25% { transform: translate3d(0,0,0) scale(1.01); opacity: 0.22; filter: blur(2.8vmin) contrast(1.05); }
542      50% { transform: translate3d(0,0,0) scale(1.03); opacity: 0.26; filter: blur(3vmin) contrast(1.08); }
543      75% { transform: translate3d(0,0,0) scale(1.00); opacity: 0.2; filter: blur(2.8vmin) contrast(1.05); }
544      100% { transform: translate3d(0,0,0) scale(0.95); opacity: 0.15; filter: blur(2.6vmin) contrast(1.02); }
545    }
546
547    /* Accessibility */
548    @media (prefers-reduced-motion: reduce) {
549      *,
550      *::before,
551      *::after {
552        animation-duration: 0.01ms !important;
553        animation-iteration-count: 1 !important;
554        transition-duration: 0.01ms !important;
555      }
556      
557      .orb {
558        animation: none;
559        opacity: 0.15;
560      }
561      
562      .orb::before {
563        animation: none;
564      }
565    }
566
567    /* Spinner animation for loading state */
568    @keyframes spin {
569      to { transform: rotate(360deg); }
570    }
571
572    .submit-btn.loading i {
573      animation: spin 1s linear infinite;
574    }
575  </style>
576</head>
577<body>
578  <!-- Vignette effect -->
579  <div class="vignette"></div>
580  
581  <!-- Background orb field -->
582  <div class="orb-field">
583    <div class="orb"></div>
584  </div>
585  
586  <div class="container">
587    <div class="lock-icon">
588      <i data-lucide="lock"></i>
589    </div>
590    
591    <h1>Password Protected</h1>
592    <div class="genesis-whispers" id="whispers">Enter the password to access this app...</div>
593    
594    <form class="password-form" id="password-form" action="/_siteWideProtection/submit" method="POST">
595      <label for="password-input" class="visually-hidden">Password</label>
596      <div class="input-wrapper">
597        <input 
598          type="password" 
599          id="password-input"
600          name="password"
601          class="password-input" 
602          placeholder="Enter password"
603          autocomplete="new-password"
604          required
605        />
606        <button type="button" class="toggle-password" id="toggle-password" aria-label="Toggle password visibility">
607          <i data-lucide="eye"></i>
608        </button>
609      </div>
610      
611      <button type="submit" class="submit-btn" id="submit-btn">
612        <i data-lucide="unlock"></i>
613        Unlock
614      </button>
615    </form>
616    
617    <div id="error-message" class="error-message">
618      <i data-lucide="alert-circle"></i>
619      <span id="error-text">Incorrect password. If it was just changed, wait a minute and try again.</span>
620    </div>
621  </div>
622
623  
623<script>
624    // Theme detection and application
625    function applyTheme() {
626      const urlParams = new URLSearchParams(window.location.search);
627      let theme = urlParams.get('theme');
628      
629      if (!theme) {
630        try {
631          if (window.parent !== window) {
632            const parentTheme = window.parent.document.documentElement.getAttribute('data-theme');
633            if (parentTheme) theme = parentTheme;
634          }
635        } catch (e) {}
636        
637        if (!theme) {
638          theme = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark';
639        }
640      }
641      
642      document.documentElement.setAttribute('data-theme', theme === 'light' ? 'light' : 'dark');
643    }
644
645    // Password visibility toggle
646    function setupPasswordToggle() {
647      const toggleBtn = document.getElementById('toggle-password');
648      const passwordInput = document.getElementById('password-input');
649      
650      if (toggleBtn && passwordInput) {
651        toggleBtn.addEventListener('click', () => {
652          const isPassword = passwordInput.type === 'password';
653          passwordInput.type = isPassword ? 'text' : 'password';
654          toggleBtn.innerHTML = isPassword 
655            ? '<i data-lucide="eye-off"></i>' 
656            : '<i data-lucide="eye"></i>';
657          
658          // Re-initialize Lucide icons
659          if (typeof lucide !== 'undefined') {
660            lucide.createIcons();
661          }
662        });
663      }
664    }
665
666    // Form submission handler
667    function setupFormHandler() {
668      const passwordInput = document.getElementById('password-input');
669      
670      if (passwordInput) {
671        // Auto-focus password input
672        passwordInput.focus();
673        
674        // Check for error parameter in URL (server redirect on failure)
675        const urlParams = new URLSearchParams(window.location.search);
676        const error = urlParams.get('error');
677        
678        if (error) {
679          const errorMessage = document.getElementById('error-message');
680          const errorText = document.getElementById('error-text');
681          
682          if (errorMessage && errorText) {
683            errorText.textContent = error === 'invalid' 
684              ? 'Incorrect password. If it was just changed, wait a minute and try again.'
685              : 'An error occurred. Please try again.';
686            errorMessage.classList.add('show');
687          }
688        }
689      }
690    }
691
692    // Rotating whisper messages
693    function initializeWhispers() {
694      const passwordMessages = [
695        'Enter the password to access this app...',
696        'Protected spaces await your key...',
697        'The guardian waits for the secret phrase...',
698        'Authentication opens the digital doorway...',
699        'Your credentials unlock the experience...',
700        'Security ensures the right access...',
701        'The password is the key to entry...',
702        'Verify your identity to proceed...',
703      ];
704
705      const whispersElement = document.getElementById('whispers');
706      if (!whispersElement) return;
707
708      let currentIndex = 0;
709      const stageDurationMs = 20000; // 20s per message
710
711      function setWhisperMessage(index) {
712        const message = passwordMessages[index % passwordMessages.length];
713        whispersElement.style.animation = 'none';
714        whispersElement.textContent = message;
715        // Trigger reflow
716        void whispersElement.offsetHeight;
717        whispersElement.style.animation = 'geist-whisper 20s var(--ease-cinematic) infinite';
718      }
719
720      // Set initial message
721      setWhisperMessage(0);
722
723      // Rotate through messages
724      setInterval(() => {
725        currentIndex++;
726        setWhisperMessage(currentIndex);
727      }, stageDurationMs);
728    }
729
730    // Wait for DOM to load
731    document.addEventListener('DOMContentLoaded', () => {
732      applyTheme();
733      setupPasswordToggle();
734      setupFormHandler();
735      initializeWhispers();
736      
737      // Initialize Lucide icons
738      if (typeof lucide !== 'undefined') {
739        lucide.createIcons();
740      }
741    });
742
743    // Theme change listener
744    window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', (e) => {
745      const urlParams = new URLSearchParams(window.location.search);
746      if (!urlParams.get('theme')) {
747        document.documentElement.setAttribute('data-theme', e.matches ? 'light' : 'dark');
748      }
749    });
750  </script>
vendor: 1 bytes, line 750
750
751<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"8d4254f20c524f6fbf6ecde0b2c89fb4","spa":2}' crossorigin="anonymous"></script>
751
752</body>
753</html>
754

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.