cloudflare
tcp/443 tcp/80 tcp/8443
Open service 2606:4700:3035::6815:1c19:443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
cf-cache-status: DYNAMIC
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=1U%2BG%2BzS88lkiXJfxeamg8Ogjczv08bWgEv%2FIUVLFfnHjigyphnuc6PqqGWkn7UPuPqXCeN%2B3tPJc642F04Z%2BG6J1tZmMXwaQ0mBdjPz2KbFS9%2ByE41iMJUEnIA%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
Server-Timing: cfCacheStatus;desc="DYNAMIC"
Server-Timing: cfEdge;dur=9,cfOrigin;dur=34
CF-RAY: 9c215febd9ad34dc-YYZ
alt-svc: h3=":443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 2606:4700:3035::6815:1c19:8443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=DjJKLSHeaaA5hD4e%2FLvMajMxxy9tlkUqFC9DvFGrzyLdNih38EQ2aLIslrqLmNnx8xyrHRA7GzTONHFSxTgRPuBMfrhnr32%2FoCy36N%2Fu560WYH%2BnhmiHQr7OOw%3D%3D"}]}
Server: cloudflare
cf-cache-status: DYNAMIC
CF-RAY: 9c215febafe5340d-FRA
alt-svc: h3=":8443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 104.21.28.25:443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=CapEnZ9oBEq7Xx76ET%2FRGO4UbEXRiS4qs1UX7Zxux8VIkuMPXhEnK%2BS%2F8ozt9ZqUFaCVIkALkCbYsY8MFcMh1SLKvsr7nOMpxMaQorj4EQ%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
cf-cache-status: DYNAMIC
CF-RAY: 9c215feaff6f66a6-AMS
alt-svc: h3=":443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 2606:4700:3033::ac43:aa32:80 · booksreader.app
2026-01-22 19:14
HTTP/1.1 301 Moved Permanently
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Length: 0
Connection: close
Location: https://booksreader.app/
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=gEgqYA2tX1dAxNRN6vsUbDbro5X49gKsxv%2FfFt4hRH%2Fv1uv9eAFeDdb5x2WNIPTJTQH%2BElSEI8LX98E205zoxwt2OMQ2CuNWgVdMB9ca7EIRDlXDuKuOt0o%2Bkw%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
Cache-Control: no-store, no-cache, must-revalidate
cf-cache-status: DYNAMIC
CF-RAY: 9c215feab9e0fe9b-AMS
alt-svc: h3=":443"; ma=86400
Open service 2606:4700:3033::ac43:aa32:8443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=K0nBSBHno%2Bswhdx%2BfSOKZM%2BJfU%2F28hnOo4CqO7V%2FQ%2FNCBN%2BNy2fsk4K6WfQ%2BthcCAPHV6K%2FotV1oHH49TWbOkXuInGNmYvJVIk4qciIhygMKwExqtPEhm2TpHQ%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
cf-cache-status: DYNAMIC
CF-RAY: 9c215feae8cb6519-LHR
alt-svc: h3=":8443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 172.67.170.50:443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
cf-cache-status: DYNAMIC
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=aj5wuccl7SRfPj543RecMMTMvBrnsC%2FP3%2BjN84ODIj%2FCJYKTOJnZi0mtMYEf1MQyqdaTI4bpZOyOmyEZjk7JwJgcFlRh2%2FmHzklMoY2W3Q%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
Server-Timing: cfCacheStatus;desc="DYNAMIC"
Server-Timing: cfEdge;dur=15,cfOrigin;dur=127
CF-RAY: 9c215feaafd938e2-YYZ
alt-svc: h3=":443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 172.67.170.50:80 · booksreader.app
2026-01-22 19:14
HTTP/1.1 301 Moved Permanently
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Length: 0
Connection: close
Location: https://booksreader.app/
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=Xlh8sbM1aD1Ofvn7zEbIPCb%2B5%2BkKd6ipktsNyGqMiVUyT8pdwulZpxpBQYkg2JAoDAcvcYA223%2Bb0uTVQkjkXoU%2B2FOFh00yJz1pESLwVQ%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
Server-Timing: cfCacheStatus;desc="DYNAMIC"
Server-Timing: cfEdge;dur=16,cfOrigin;dur=7
cf-cache-status: DYNAMIC
Cache-Control: no-store, no-cache, must-revalidate
CF-RAY: 9c215fea6c5a5cb9-EWR
alt-svc: h3=":443"; ma=86400
Open service 104.21.28.25:8443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=P3KCW%2FtuD3FwekKmwa8MV7D0KZh3I5SCcdCR20QGTbK39z0JCeozvc33lcRgZWfY7GzjxlpRrMLOCRJhE6P0A1i%2FsDpIj8hta6BbuSGy2g%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
cf-cache-status: DYNAMIC
CF-RAY: 9c215fea7bb6a007-AMS
alt-svc: h3=":8443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 2606:4700:3033::ac43:aa32:443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=O0uINH%2BgY%2F6fL5wgIFgm7Aty2ruk6LXvFpHI0ARLC6YWpIwy8DIGxBm55HANZde82pGyLrI5XcHv09YxfJCaZb2HtLRrsJwN4dhYp8cq0b%2FxG5QNViVPxuuupQ%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
cf-cache-status: DYNAMIC
CF-RAY: 9c215fea8b222443-AMS
alt-svc: h3=":443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for
Open service 2606:4700:3035::6815:1c19:80 · booksreader.app
2026-01-22 19:14
HTTP/1.1 301 Moved Permanently
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Length: 0
Connection: close
Location: https://booksreader.app/
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=HCQPO8aDmt4zZ6rLpSXaXUPPWGR6U0lEFbWPk4N6ZNZ3GHXkCJ1LFIiU25272d07eq8Zb5hsWaRtfeapmZbGA06TTgVQIKHCdvh%2Fjc5%2BWHol5n3UUkL6XeIqew%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
Server-Timing: cfCacheStatus;desc="DYNAMIC"
Server-Timing: cfEdge;dur=17,cfOrigin;dur=8
cf-cache-status: DYNAMIC
Cache-Control: no-store, no-cache, must-revalidate
CF-RAY: 9c215fea286cc745-EWR
alt-svc: h3=":443"; ma=86400
Open service 104.21.28.25:80 · booksreader.app
2026-01-22 19:14
HTTP/1.1 301 Moved Permanently
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Length: 0
Connection: close
Location: https://booksreader.app/
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=ylzqID7ajPsRkTSa2ozeIjeHtcFjEV8pEH27dW7HmsScoTV1h6%2BbL6SzeuKHbtiulAHIbe%2BIxho1i%2FTlf30bMSYg%2FBkNPhMRiksJ1ORYlg%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
Server-Timing: cfCacheStatus;desc="DYNAMIC"
Server-Timing: cfEdge;dur=14,cfOrigin;dur=6
cf-cache-status: DYNAMIC
Cache-Control: no-store, no-cache, must-revalidate
CF-RAY: 9c215fea0c528ae3-EWR
alt-svc: h3=":443"; ma=86400
Open service 172.67.170.50:8443 · booksreader.app
2026-01-22 19:14
HTTP/1.1 200 OK
Date: Thu, 22 Jan 2026 19:14:30 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: close
Access-Control-Allow-Origin: *
Cache-Control: no-store, no-cache, must-revalidate
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
Vary: accept-encoding
Report-To: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=ZfB8wldSSzt9F%2BZA0gcCfN8i6aQSOXYz%2BlnAl8%2FOmzgIvmyda3H2wspKFXsMswLnlPWFkCVexkuaedZwqWbbo6smIAnlCv1o3IWxGj9jqA%3D%3D"}]}
Nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800}
Server: cloudflare
cf-cache-status: DYNAMIC
CF-RAY: 9c215fea5d440f25-DUS
alt-svc: h3=":8443"; ma=86400
Page title: Book Reader
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<title>Book Reader</title>
<!-- Manifest for PWA -->
<link rel="manifest" href="manifest.json" />
<meta name="theme-color" content="#000000" />
<!-- Styles -->
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Home Screen -->
<div id="home-screen" class="screen active">
<div class="home-top-bar" role="presentation">
<button id="open-book-button" class="icon-button" aria-label="Open Book">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M11.25 4.533A9.707 9.707 0 0 0 6 3a9.735 9.735 0 0 0-3.25.555.75.75 0 0 0-.5.707v14.25a.75.75 0 0 0 1 .707A8.237 8.237 0 0 1 6 18.75c1.995 0 3.823.707 5.25 1.886V4.533ZM12.75 20.636A8.214 8.214 0 0 1 18 18.75c.966 0 1.89.166 2.75.47a.75.75 0 0 0 1-.708V4.262a.75.75 0 0 0-.5-.707A9.735 9.735 0 0 0 18 3a9.707 9.707 0 0 0-5.25 1.533v16.103Z"/>
</svg>
</button>
<button id="open-settings-button" class="icon-button" aria-label="Settings">
<svg
class="icon"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
stroke="currentColor"
stroke-width="1.5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
</button>
</div>
<div class="home-screen-content">
<p class="reading-tip">
When reading a book, tap at the top of the screen to see the menu.
</p>
<h1>Books Reader</h1>
<p class="install-message">
You can install Books Reader PWA to your mobile phone or desktop computer right from your browser.
</p>
</div>
<input type="file" id="file-input" accept=".txt,.fb2" onchange="handleFile(event)" hidden />
</div>
<!-- Settings Screen -->
<div id="settings-screen" class="screen">
<div class="top-bar visible settings-top-bar">
<div class="book-info">
<h2 class="settings-title settings-top-bar-title" id="settings-screen-title">Settings</h2>
</div>
<button id="settings-back" class="icon-button" aria-label="Back">
<svg class="icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 11H7.83l5.59-5.59L12 4 4 12l8 8 1.41-1.41L7.83 13H19v-2z"
transform="translate(12 12) scale(1.125) translate(-12 -12)"
/>
</svg>
</button>
</div>
<div class="settings-content" aria-labelledby="settings-screen-title">
<div class="controls">
<div class="settings-section">
<h3>Text</h3>
<table class="settings-table">
<tbody>
<tr>
<th scope="row"><label for