hls.js: drop segment load cap 30s -> 10s

Dribbling CDN segments (logged at 17.8s/59.7s) made the player stare
at 'Buffering…' for half a minute per attempt. Cap total load at 10s
so a retry kicks in sooner (timeoutRetry still 6x, backoff 1-20s);
fast segments (0.1-0.2s) are unaffected.

static/app.js

@@ -831,15 +831,17 @@ async function play(ep_id, ep_no) {
     // hls.js 1.5.x reads the retry budget from the errorRetry / timeoutRetry
     // sub-objects (a top-level maxNumRetry is ignored — that was the old bug).
     //   maxTimeToFirstByteMs  first byte within 15s
-    //   maxLoadTimeMs         total load within 30s — MUST be finite, else a CDN
-    //                         that starts sending then stalls hangs us forever
+    //   maxLoadTimeMs         total load within 10s — finite cap, and LOWER than
+    //                         the first-byte cap, so a dribbling CDN segment is
+    //                         aborted at 10s and retried (timeoutRetry 6x) instead
+    //                         of the player staring at "Buffering…" for 30s
     //   timeoutRetry          retries for a load *timeout* (was default 1!)
     //   errorRetry            retries for HTTP errors like our proxy's 502
     // Together: a slow/stalled CDN gets retried with backoff instead of one
     // shot -> fatal fragLoadTimeOut.
     hls = new Hls({ fragLoadPolicy: { default: {
       maxTimeToFirstByteMs: 15000,
-      maxLoadTimeMs: 30000,
+      maxLoadTimeMs: 10000,
       timeoutRetry: { maxNumRetry: 6, retryDelayMs: 1000, maxRetryDelayMs: 20000, backoff: "linear" },
       errorRetry:   { maxNumRetry: 8, retryDelayMs: 1000, maxRetryDelayMs: 20000, backoff: "linear" },
     } } });

static/index.html

@@ -6,7 +6,7 @@
 <title>ani-web</title>
 <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect width='64' height='64' rx='14' fill='%23f97316'/%3E%3Ctext x='32' y='45' font-family='sans-serif' font-size='42' font-weight='700' text-anchor='middle' fill='%230e0f13'%3Ea%3C/text%3E%3C/svg%3E">
 
-<link rel="stylesheet" href="style.css?v=3">
+<link rel="stylesheet" href="style.css?v=4">
 </head>
 <body>
 <header>
@@ -30,6 +30,6 @@
      max-age=300 in browser AND possibly in your HTTPS proxy, and a stale
      copy is exactly how users keep seeing an old UI after a deploy -->
 <script src="hls.min.js"></script>
-<script src="app.js?v=3"></script>
+<script src="app.js?v=4"></script>
 </body>
 </html>