PageSourceSearch

https://lothianspos.com/

html lothianspos.com collected 2026-10-02 01:34:36 UTC 27,987 bytes, 603 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">
6  
6<script src="/quiet-console.js"></script>
6
7  <meta name="description" content="LOTHIANSPOS - Web Office Authentication">
8  <title>LOTHIANSPOS - Sign In</title>
9  <!-- Auth perf: before first paint — Data Saver / 2G / reduced-data → html.auth-perf-lite -->
10  
10<script>
11  (function () {
12    try {
13      var root = document.documentElement;
14      var nav = navigator;
15      var conn = nav.connection || nav.mozConnection || nav.webkitConnection;
16      if (conn && conn.saveData) {
17        root.classList.add('auth-perf-lite');
18        return;
19      }
20      if (conn) {
21        var et = conn.effectiveType;
22        if (et === 'slow-2g' || et === '2g') {
23          root.classList.add('auth-perf-lite');
24          return;
25        }
26      }
27      if (typeof matchMedia === 'function' && matchMedia('(prefers-reduced-data: reduce)').matches) {
28        root.classList.add('auth-perf-lite');
29        return;
30      }
31      try {
32        if (typeof location !== 'undefined' && new URLSearchParams(location.search).get('authLite') === '1') {
33          root.classList.add('auth-perf-lite');
34        }
35      } catch (e2) { /* ignore */ }
36    } catch (e) { /* ignore */ }
37  })();
38  </script>
38
39  <!-- Auth decorative layer: few CPU cores / low RAM → html.auth-bg-gpu-lite (before paint). ?authBgGpu=1|0 -->
40  
40<script>
41  (function () {
42    try {
43      var root = document.documentElement;
44      if (root.classList.contains('auth-perf-lite')) return;
45      var params = typeof location !== 'undefined' ? new URLSearchParams(location.search) : null;
46      if (params && params.get('authBgGpu') === '0') return;
47      if (params && params.get('authBgGpu') === '1') {
48        root.classList.add('auth-bg-gpu-lite');
49        return;
50      }
51      var nav = navigator;
52      var liteBg = false;
53      var hc = nav.hardwareConcurrency;
54      if (typeof hc === 'number' && hc > 0 && hc <= 4) liteBg = true;
55      var dm = nav.deviceMemory;
56      if (!liteBg && typeof dm === 'number' && dm > 0 && dm <= 4) liteBg = true;
57      if (liteBg) root.classList.add('auth-bg-gpu-lite');
58    } catch (e) { /* ignore */ }
59  })();
60  </script>
60
61  
61<script src="/theme-head.js"></script>
61
62
63  <!-- Favicons -->
64  <link rel="icon" type="image/svg+xml" href="/favicon.svg">
65  <link rel="icon" type="image/png" sizes="32x32" href="/favicon.svg">
66  <link rel="icon" type="image/png" sizes="16x16" href="/favicon.svg">
67  <link rel="apple-touch-icon" sizes="180x180" href="/favicon.svg">
68  
69  <!-- Open Graph / Facebook -->
70  <meta property="og:type" content="website">
71  <meta property="og:url" content="https://lothianspos.web.app/">
72  <meta property="og:title" content="LOTHIANSPOS - Web Office">
73  <meta property="og:description" content="Modern business management hub for your POS system">
74  <meta property="og:image" content="https://lothianspos.web.app/favicon.svg">
75  
76  <!-- Twitter -->
77  <meta property="twitter:card" content="summary_large_image">
78  <meta property="twitter:url" content="https://lothianspos.web.app/">
79  <meta property="twitter:title" content="LOTHIANSPOS - Web Office">
80  <meta property="twitter:description" content="Modern business management hub for your POS system">
81  <meta property="twitter:image" content="https://lothianspos.web.app/favicon.svg">
82  
83  <!-- Performance Optimizations -->
84  <link rel="preconnect" href="https://fonts.googleapis.com">
85  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
86  <link rel="dns-prefetch" href="https://fonts.googleapis.com">
87  <!-- App Check (reCAPTCHA v3) — early connection setup, no extra Firebase usage -->
88  <link rel="preconnect" href="https://www.google.com">
89  <link rel="preconnect" href="https://www.gstatic.com" crossorigin>
90  <link rel="dns-prefetch" href="https://www.gstatic.com">
91  <link rel="prefetch" href="/office.html" as="document">
92
93  <!-- Stylesheet -->
94  <link rel="stylesheet" href="/styles.css">
95
96  <!-- Hero copy: IBM Plex — non-blocking so first interaction stays responsive -->
97  <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500&display=swap" onload="this.onload=null;this.rel='stylesheet'">
98  <noscript><link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500&display=swap" rel="stylesheet"></noscript>
99  
100  <!-- Material Icons - Optimized Loading -->
101  <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined&display=block" rel="stylesheet">
102  <noscript><link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined" rel="stylesheet"></noscript>
103</head>
104<body>
105  <div class="auth-page">
106    <!-- Animated Background with App Interface -->
107    <div class="animated-background">
108      <!-- Subtle gradient base -->
109      <div class="bg-gradient-1"></div>
110      <div class="bg-gradient-2"></div>
111      <div class="bg-gradient-3"></div>
112      
113      <!-- Shooting Stars - Light Speed Effect -->
114      <div class="shooting-star" style="top: 10%; left: 0%; animation: shootingStar1 2s linear infinite; animation-delay: 0s;"></div>
115      <div class="shooting-star" style="top: 20%; left: 0%; animation: shootingStar2 2.5s linear infinite; animation-delay: 0.5s;"></div>
116      <div class="shooting-star" style="top: 30%; left: 0%; animation: shootingStar1 1.8s linear infinite; animation-delay: 1s;"></div>
117      <div class="shooting-star" style="top: 40%; left: 0%; animation: shootingStar3 2.2s linear infinite; animation-delay: 1.5s;"></div>
118      <div class="shooting-star" style="top: 50%; left: 0%; animation: shootingStar4 2.3s linear infinite; animation-delay: 0.3s;"></div>
119      <div class="shooting-star" style="top: 60%; left: 0%; animation: shootingStar2 1.9s linear infinite; animation-delay: 0.8s;"></div>
120      <div class="shooting-star" style="top: 70%; left: 0%; animation: shootingStar1 2.4s linear infinite; animation-delay: 1.2s;"></div>
121      <div class="shooting-star" style="top: 80%; left: 0%; animation: shootingStar3 2.1s linear infinite; animation-delay: 0.6s;"></div>
122      <div class="shooting-star" style="top: 15%; left: 0%; animation: shootingStar4 2.6s linear infinite; animation-delay: 1.8s;"></div>
123      <div class="shooting-star" style="top: 25%; left: 0%; animation: shootingStar2 2.0s linear infinite; animation-delay: 0.4s;"></div>
124      <div class="shooting-star" style="top: 35%; left: 0%; animation: shootingStar1 1.7s linear infinite; animation-delay: 1.4s;"></div>
125      <div class="shooting-star" style="top: 45%; left: 0%; animation: shootingStar3 2.7s linear infinite; animation-delay: 0.9s;"></div>
126      <div class="shooting-star" style="top: 55%; left: 0%; animation: shootingStar4 2.2s linear infinite; animation-delay: 1.6s;"></div>
127      <div class="shooting-star" style="top: 65%; left: 0%; animation: shootingStar2 1.6s linear infinite; animation-delay: 0.7s;"></div>
128      <div class="shooting-star" style="top: 75%; left: 0%; animation: shootingStar1 2.5s linear infinite; animation-delay: 1.1s;"></div>
129      
130      <!-- Black Holes - Space Depth Effect -->
131      <div class="blackhole" style="animation: blackholeAppear1 8s ease-in-out infinite; animation-delay: 0s;"></div>
132      <div class="blackhole" style="animation: blackholeAppear2 10s ease-in-out infinite; animation-delay: 2s;"></div>
133      <div class="blackhole" style="animation: blackholeAppear3 9s ease-in-out infinite; animation-delay: 4s;"></div>
134      <div class="blackhole" style="animation: blackholeAppear4 11s ease-in-out infinite; animation-delay: 6s;"></div>
135      
136      <!-- Planets - Solar System Journey (Passing by one by one) -->
137      <div class="planet planet-mercury" style="animation: planetPassMercury 25s linear infinite; animation-delay: 0s;"></div>
138      <div class="planet planet-venus" style="animation: planetPassVenus 25s linear infinite; animation-delay: 3s;"></div>
139      <div class="planet planet-earth" style="animation: planetPassEarth 25s linear infinite; animation-delay: 6s;"></div>
140      <div class="planet planet-mars" style="animation: planetPassMars 25s linear infinite; animation-delay: 9s;"></div>
141      <div class="planet planet-jupiter" style="animation: planetPassJupiter 25s linear infinite; animation-delay: 12s;"></div>
142      <div class="planet planet-saturn" style="animation: planetPassSaturn 25s linear infinite; animation-delay: 15s;"></div>
143      <div class="planet planet-uranus" style="animation: planetPassUranus 25s linear infinite; animation-delay: 18s;"></div>
144      <div class="planet planet-neptune" style="animation: planetPassNeptune 25s linear infinite; animation-delay: 21s;"></div>
145      
146      <!-- Sun - Final Destination -->
147      <div class="planet planet-sun" style="animation: sunAppear 25s ease-in-out infinite; animation-delay: 24s;"></div>
148      
149      <!-- AUTH Screen Animations -->
150      <div class="app-mockup app-auth-form-card" data-delay="0">
151        <div class="mockup-header">
152          <div class="mockup-dot"></div>
153          <div class="mockup-dot"></div>
154          <div class="mockup-dot"></div>
155        </div>
156        <div class="mockup-content">
157          <div class="mockup-title">Sign In</div>
158          <div class="mockup-form-field"></div>
159          <div class="mockup-form-field"></div>
160          <div class="mockup-form-field" style="width: 60%;"></div>
161        </div>
162      </div>
163      
164      <div class="app-mockup app-security-card-auth" data-delay="2">
165        <div class="mockup-header">
166          <div class="mockup-dot"></div>
167          <div class="mockup-dot"></div>
168          <div class="mockup-dot"></div>
169        </div>
170        <div class="mockup-content">
171          <div class="mockup-security-icon">
172            <span class="material-icons-outlined" style="color: white; font-size: 28px;">verified_user</span>
173          </div>
174          <div class="mockup-title">Secure Login</div>
175        </div>
176      </div>
177      
178      <div class="app-mockup app-lock-icon-card" data-delay="4">
179        <div class="mockup-header">
180          <div class="mockup-dot"></div>
181          <div class="mockup-dot"></div>
182          <div class="mockup-dot"></div>
183        </div>
184        <div class="mockup-content">
185          <div class="mockup-lock-icon">
186            <span class="material-icons-outlined" style="color: var(--color-primary); font-size: 40px;">lock</span>
187          </div>
188        </div>
189      </div>
190      
191      <div class="app-mockup app-auth-form-card" data-delay="6" style="top: 60%; left: 8%;">
192        <div class="mockup-header">
193          <div class="mockup-dot"></div>
194          <div class="mockup-dot"></div>
195          <div class="mockup-dot"></div>
196        </div>
197        <div class="mockup-content">
198          <div class="mockup-title">Create Account</div>
199          <div class="mockup-form-field"></div>
200          <div class="mockup-form-field"></div>
201        </div>
202      </div>
203      
204      <div class="app-mockup app-security-card-auth" data-delay="8" style="bottom: 10%; right: 5%;">
205        <div class="mockup-header">
206          <div class="mockup-dot"></div>
207          <div class="mockup-dot"></div>
208          <div class="mockup-dot"></div>
209        </div>
210        <div class="mockup-content">
211          <div class="mockup-title">Protected</div>
212          <div class="subscription-badge">Encrypted</div>
213        </div>
214      </div>
215    </div>
216
217    <!-- Auth Content Wrapper -->
218    <div class="auth-page-wrapper">
219      <!-- Auth Container -->
220      <div class="auth-container">
221      <!-- Brand Header -->
222      <div class="auth-brand-header">
223        <h1 class="auth-brand-title">LOTHIANSPOS</h1>
224      </div>
225
226      <!-- Theme Toggle -->
227      <button id="theme-toggle" class="theme-toggle" aria-label="Toggle dark mode" title="Toggle dark mode">
228        <span class="material-icons-outlined theme-icon">dark_mode</span>
229      </button>
230
231      <div class="auth-layout container-3d">
232      <section class="auth-hero-panel" aria-label="Platform highlights">
233        <div class="auth-hero-intro">
234          <div class="auth-hero-badge">
235            <span class="material-icons-outlined">auto_awesome</span>
236            LOTHIANSPOS Business Hub
237          </div>
238          <p class="auth-hero-subtitle">Access your account, monitor reports, manage team operations, and keep your services in sync from a single dashboard.</p>
239        </div>
240        <div class="auth-hero-play-cta lothians-google-play-cta lothians-google-play-cta--prominent">
241          <a
242            href="https://play.google.com/store/apps/details?id=com.ct.lothianspos"
243            class="lothians-google-play-badge-link lothians-google-play-badge-link--prominent"
244            target="_blank"
245            rel="noopener noreferrer"
246            aria-label="Get LOTHIANSPOS on Google Play"
247          >
248            <img
249              src="/images/google-play-badge-en.png"
250              alt="Get it on Google Play"
251              class="lothians-google-play-badge lothians-google-play-badge--prominent"
252              width="646"
253              height="250"
254              loading="lazy"
255              decoding="async"
256            />
257          </a>
258        </div>
259        <div class="auth-hero-metrics" role="list" aria-label="Platform quality highlights">
260          <article class="auth-metric-card" role="listitem">
261            <span class="material-icons-outlined">admin_panel_settings</span>
262            <strong>Account Control</strong>
263            <small>Update profile settings, security access, and subscription details in one place.</small>
264          </article>
265          <article class="auth-metric-card" role="listitem">
266            <span class="material-icons-outlined">analytics</span>
267            <strong>Reports & Insights</strong>
268            <small>View business performance reports to track sales and make informed decisions.</small>
269          </article>
270          <article class="auth-metric-card" role="listitem">
271            <span class="material-icons-outlined">settings_suggest</span>
272            <strong>Operational Setup</strong>
273            <small>Configure store options, service preferences, and support workflows quickly.</small>
274          </article>
275        </div>
276
277        <div id="auth-hero-report-showcase" class="auth-hero-report-showcase" role="img" aria-label="Live weekly sales and transaction trend">
278          <div class="auth-hero-report-head">
279            <span class="material-icons-outlined auth-hero-report-head-icon" aria-hidden="true">stacked_bar_chart</span>
280            <div class="auth-hero-report-head-text">
281              <h3 class="auth-hero-report-title">Reports</h3>
282              <p class="auth-hero-report-meta">Sales, movement, and performance in one view</p>
283            </div>
284          </div>
285          <div class="auth-hero-report-body">
286            <div class="auth-hero-report-bars" aria-hidden="true">
287              <div class="auth-hero-bar" data-day-index="0" style="--bar-pct: 38%"></div>
288              <div class="auth-hero-bar" data-day-index="1" style="--bar-pct: 55%"></div>
289              <div class="auth-hero-bar" data-day-index="2" style="--bar-pct: 44%"></div>
290              <div class="auth-hero-bar" data-day-index="3" style="--bar-pct: 72%"></div>
291              <div class="auth-hero-bar" data-day-index="4" style="--bar-pct: 61%"></div>
292              <div class="auth-hero-bar" data-day-index="5" style="--bar-pct: 88%"></div>
293              <div class="auth-hero-bar" data-day-index="6" style="--bar-pct: 52%"></div>
294            </div>
295            <div class="auth-hero-report-spark" aria-hidden="true">
296              <svg class="auth-hero-spark-svg" viewBox="0 0 240 72" preserveAspectRatio="none" focusable="false">
297                <defs>
298                  <linearGradient id="authHeroSparkFill" x1="0" y1="0" x2="0" y2="1">
299                    <stop offset="0%" stop-color="rgba(37, 99, 235, 0.35)"/>
300                    <stop offset="100%" stop-color="rgba(37, 99, 235, 0)"/>
301                  </linearGradient>
302                </defs>
303                <path class="auth-hero-spark-area" d="M0,52 L40,44 L80,48 L120,36 L160,30 L200,18 L240,24 L240,72 L0,72 Z" fill="url(#authHeroSparkFill)"/>
304                <path class="auth-hero-spark-line" d="M0,52 L40,44 L80,48 L120,36 L160,30 L200,18 L240,24" fill="none" stroke-width="2.25" stroke-linecap="round" stroke-linejoin="round"/>
305              </svg>
306              <div class="auth-hero-spark-axis">
307                <span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span><span>Sat</span><span>Sun</span>
308              </div>
309            </div>
310          </div>
311          <div class="auth-hero-report-kpis">
312            <div class="auth-hero-kpi">
313              <span class="auth-hero-kpi-label">Net sales</span>
314              <span id="auth-hero-net-sales" class="auth-hero-kpi-value">—</span>
315            </div>
316            <div class="auth-hero-kpi">
317              <span class="auth-hero-kpi-label">Transactions</span>
318              <span id="auth-hero-transactions" class="auth-hero-kpi-value">—</span>
319            </div>
320            <div class="auth-hero-kpi">
321              <span class="auth-hero-kpi-label">Avg. ticket</span>
322              <span id="auth-hero-avg-ticket" class="auth-hero-kpi-value">—</span>
323            </div>
324          </div>
325        </div>
326      </section>
327
328      <!-- Auth Card -->
329      <div class="auth-card">
330        <!-- Sign In Mode -->
331        <div id="signin-mode" class="auth-mode active">
332          <div class="auth-header">
333            <h1 class="auth-title">Welcome back</h1>
334            <p class="auth-subtitle">Sign in to continue ringing sales with a smooth, cohesive workspace.</p>
335          </div>
336
337          <form id="signin-form" class="auth-form">
338            <div class="form-group">
339              <label for="signin-email" class="form-label">Email</label>
340              <input 
341                type="email" 
342                id="signin-email" 
343                class="form-input" 
344                placeholder="[email protected]"
345                autocomplete="email"
346                required
347              />
348            </div>
349
350            <div class="form-group">
351              <label for="signin-password" class="form-label">Password</label>
352              <div class="input-wrapper">
353                <input 
354                  type="password" 
355                  id="signin-password" 
356                  class="form-input" 
357                  placeholder="Minimum 8 characters"
358                  autocomplete="current-password"
359                  required
360                />
361                <button type="button" class="password-toggle" id="signin-password-toggle" aria-label="Toggle password visibility">
362                  <span class="material-icons-outlined">visibility_off</span>
363                </button>
364              </div>
365              <p id="signin-caps-warning" class="caps-lock-warning" hidden>
366                Caps Lock is on — passwords are case-sensitive.
367              </p>
368            </div>
369
370            <button type="button" class="btn-text forgot-password-link" id="forgot-password-link">
371              Forgot password?
372            </button>
373
374            <button type="submit" class="btn btn-primary" id="signin-submit">
375              Sign in
376            </button>
377
378            <div id="signin-status" class="status-message"></div>
379            <div id="signin-error" class="error-message"></div>
380
381            <button type="button" class="btn-ghost" id="toggle-to-register">
382              New here? Create an account
383            </button>
384          </form>
385        </div>
386
387        <!-- Register Mode -->
388        <div id="register-mode" class="auth-mode">
389          <div class="auth-header">
390            <h1 class="auth-title">Create your account</h1>
391            <p class="auth-subtitle">Set up access so every device feels consistent from day one.</p>
392          </div>
393
394          <form id="register-form" class="auth-form">
395            <div class="form-group">
396              <label for="register-name" class="form-label">Business name</label>
397              <input 
398                type="text" 
399                id="register-name" 
400                class="form-input" 
401                placeholder="Cooper Retail Ltd."
402                autocomplete="organization"
403                required
404              />
405            </div>
406
407            <div class="form-group">
408              <label for="register-country" class="form-label">Country</label>
409              <div class="input-wrapper">
410                <input 
411                  type="text" 
412                  id="register-country" 
413                  class="form-input select-field" 
414                  placeholder="Select country"
415                  readonly
416                  autocomplete="country"
417                  required
418                />
419                <span class="material-icons-outlined select-arrow">arrow_drop_down</span>
420              </div>
421            </div>
422
423            <div class="form-group">
424              <label for="register-email" class="form-label">Email</label>
425              <input 
426                type="email" 
427                id="register-email" 
428                class="form-input" 
429                placeholder="[email protected]"
430                autocomplete="email"
431                required
432              />
433            </div>
434
435            <div class="form-group">
436              <label for="register-contact" class="form-label">Business contact number</label>
437              <input 
438                type="tel" 
439                id="register-contact" 
440                class="form-input" 
441                    placeholder="e.g. 8768297062"
442                inputmode="numeric"
443                pattern="[0-9]{10,}"
444                autocomplete="tel"
445                required
446              />
447            </div>
448
449            <div class="form-group">
450              <label for="register-password" class="form-label">Password</label>
451              <div class="input-wrapper">
452                <input 
453                  type="password" 
454                  id="register-password" 
455                  class="form-input" 
456                  placeholder="Minimum 8 characters"
457                  autocomplete="new-password"
458                  minlength="6"
459                  required
460                />
461                <button type="button" class="password-toggle" id="register-password-toggle" aria-label="Toggle password visibility">
462                  <span class="material-icons-outlined">visibility_off</span>
463                </button>
464              </div>
465            </div>
466
467            <div class="form-group">
468              <label for="register-confirm-password" class="form-label">Confirm password</label>
469              <div class="input-wrapper">
470                <input 
471                  type="password" 
472                  id="register-confirm-password" 
473                  class="form-input" 
474                  placeholder="Re-enter password"
475                  autocomplete="new-password"
476                  minlength="6"
477                  required
478                />
479                <button type="button" class="password-toggle" id="register-confirm-password-toggle" aria-label="Toggle password visibility">
480                  <span class="material-icons-outlined">visibility_off</span>
481                </button>
482              </div>
483            </div>
484
485            <div class="form-group form-group-checkbox">
486              <label class="checkbox-label">
487                <input type="checkbox" id="register-terms" required />
488                <span class="checkbox-text">
489                  I agree to the 
490                  <a href="/terms-of-service.html" class="link" id="terms-link" target="_blank">Terms of Service</a>
491                  and 
492                  <a href="/privacy-policy.html" class="link" id="privacy-link" target="_blank">Privacy Policy</a>
493                </span>
494              </label>
495            </div>
496
497            <button type="submit" class="btn btn-primary" id="register-submit" disabled>
498              Create account
499            </button>
500
501            <div id="register-status" class="status-message"></div>
502            <div id="register-error" class="error-message"></div>
503
504            <button type="button" class="btn-ghost" id="toggle-to-signin">
505              Already have an account? Sign in
506            </button>
507          </form>
508        </div>
509      </div>
510      </div>
511    </div>
512
513    <!-- Country Selection Popup -->
514    <div id="country-popup" class="select-popup hidden">
515      <div class="select-popup-backdrop"></div>
516      <div class="select-popup-container">
517        <div class="select-popup-header">
518          <h3 class="select-popup-title">Select Country</h3>
519          <button type="button" class="select-popup-close" aria-label="Close">
520            <span class="material-icons-outlined">close</span>
521          </button>
522        </div>
523        <div class="select-popup-content">
524          <div class="select-popup-search">
525            <input 
526              type="text" 
527              id="country-search" 
528              class="form-input" 
529              placeholder="Search countries..."
530              autocomplete="off"
531            />
532          </div>
533          <div class="select-popup-list" id="country-list">
534            <!-- Countries will be populated by JavaScript -->
535          </div>
536        </div>
537      </div>
538    </div>
539
540    <!-- Forgot Password Modal -->
541    <div id="forgot-password-modal" class="modal-backdrop hidden">
542      <div class="modal">
543        <div class="modal-header">
544          <h2 class="modal-title">Reset password</h2>
545          <button type="button" class="modal-close" aria-label="Close">
546            <span class="material-icons-outlined">close</span>
547          </button>
548        </div>
549        <div class="modal-content">
550          <p class="modal-body">Enter the email you used to register. We'll send reset instructions.</p>
551          <form id="forgot-password-form">
552            <div class="form-group">
553              <label for="forgot-email" class="form-label">Email</label>
554              <input 
555                type="email" 
556                id="forgot-email" 
557                class="form-input" 
558                placeholder="[email protected]"
559                autocomplete="email"
560                required
561              />
562            </div>
563            <div id="forgot-status" class="status-message"></div>
564            <div id="forgot-error" class="error-message"></div>
565            <div class="modal-actions">
566              <button type="button" class="btn btn-ghost" id="forgot-cancel">Cancel</button>
567              <button type="submit" class="btn btn-primary" id="forgot-submit">Send reset</button>
568            </div>
569          </form>
570        </div>
571      </div>
572    </div>
573    </div>
574    <!-- End Auth Page Wrapper -->
575
576    <div id="auth-toast-host" class="auth-toast-host" aria-live="polite"></div>
577
578    <!-- Loading Overlay -->
579    <div id="loading-overlay" class="loading-overlay hidden">
580      <div class="loading-content">
581        <div class="loading-spinner"></div>
582        <p class="loading-text">Signing in...</p>
583      </div>
584    </div>
585  </div>
586
587  <!-- Firebase SDK -->
588  
588<script defer src="/__/firebase/12.9.0/firebase-app-compat.js"></script>
588
589  
589<script defer src="/__/firebase/12.9.0/firebase-app-check-compat.js"></script>
589
590  
590<script defer src="/__/firebase/12.9.0/firebase-auth-compat.js"></script>
590
591  
591<script defer src="/__/firebase/12.9.0/firebase-firestore-compat.js"></script>
591
592  
592<script defer src="/__/firebase/12.9.0/firebase-functions-compat.js"></script>
592
593  
593<script defer src="/firebase-init-lothians.js"></script>
vendor: 1 bytes, line 593
593
594<script defer src="/app-check-config.js"></script>
594
595  
595<script defer src="/app-check-init.js"></script>
595
596
597  <!-- Scripts - Deferred for Performance -->
598  
598<script defer src="/touch-safe.js"></script>
598
599  
599<script defer src="/auth.js"></script>
599
600  
600<script defer src="/google-play-badge.js"></script>
600
601  
601<script defer src="/footer.js"></script>
601
602</body>
603</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.