:root{--bg:#0f0f0f;--card:#1a1a1a;--line:#2a2a2a;--text:#eee;--muted:#9aa;--accent:#e11}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}
.muted{color:var(--muted)}.sm{font-size:12px}
.center{display:flex;min-height:100vh;align-items:center;justify-content:center}
.bar{display:flex;align-items:center;gap:16px;padding:12px 20px;background:#000;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.bar .logo{font-size:20px;font-weight:800;color:var(--accent)}
.bar a{padding:6px 10px;border-radius:6px}.bar a:hover{background:#222}
.search{margin-left:auto}
.search input{padding:8px 12px;width:min(360px,50vw);border-radius:20px;border:1px solid var(--line);background:#111;color:#fff}
.donate{margin-left:auto;background:#0a0;font-weight:700}
.wrap{max-width:1200px;margin:0 auto;padding:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:20px}
.card.ok{background:#123d12;border-color:#1a5}
.login{width:min(360px,92vw)}
.card input,.card textarea,.card select{width:100%;padding:10px;margin:6px 0;border-radius:8px;border:1px solid var(--line);background:#111;color:#fff}
label{display:block;margin-top:10px;font-size:13px;color:var(--muted)}
.chk{display:flex;gap:8px;align-items:center;color:var(--text);margin:8px 0}
.chk input{width:auto;margin:0}
button,.btn{background:var(--accent);color:#fff;border:0;padding:10px 18px;border-radius:8px;cursor:pointer;font-weight:600;display:inline-block}
button:disabled{opacity:.5}
.link{background:none;color:var(--accent);padding:0 6px}.danger{color:#f66}.err{color:#f66}
.on{color:#4c9}.off{color:#f93}
.progress{height:8px;background:#111;border-radius:6px;overflow:hidden;margin-top:8px}
#bar{height:100%;width:0;background:var(--accent);transition:width .2s}
.list{width:100%;border-collapse:collapse}
.list th,.list td{text-align:left;padding:8px;border-bottom:1px solid var(--line);font-size:14px}
/* home layout with side rail */
.home{display:grid;grid-template-columns:1fr 300px;gap:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.tile .thumb{aspect-ratio:16/9;background:#222;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:34px;color:#555}
.tile .meta{padding:8px 2px}.tile .t{font-weight:600;line-height:1.3}
/* ad zones */
.adzone img{max-width:100%;display:block;border-radius:8px}
.adzone.top{max-width:1200px;margin:12px auto 0;padding:0 20px;text-align:center}
.adzone.top img{margin:0 auto;max-height:120px}
.adzone.side{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.adzone.under{margin:12px 0}
/* watch layout */
.watch{display:grid;grid-template-columns:1fr 320px;gap:20px}
.stage{position:relative}
.player video{width:100%;border-radius:12px;background:#000;aspect-ratio:16/9;pointer-events:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}
.noStream{aspect-ratio:16/9;background:#000;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#889}
.player h1{margin:14px 0 4px;font-size:20px}.desc{margin-top:12px;line-height:1.5}
.side h3{margin:16px 0 12px}
.row{display:flex;gap:10px;margin-bottom:12px;align-items:center}
.rthumb{width:120px;aspect-ratio:16/9;background:#222;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#555;flex:0 0 auto}
.rt{font-size:14px;font-weight:600}
/* L-ad: bottom strip + right strip forming an L over the video */
.lad{position:absolute;inset:0;pointer-events:none}
.lad.hidden{display:none}
.lad img{position:absolute;pointer-events:auto;border-radius:6px;box-shadow:0 2px 10px rgba(0,0,0,.5)}
.lad img:first-of-type{left:8px;right:60px;bottom:8px;width:calc(100% - 68px);height:64px;object-fit:cover}
.ladClose{position:absolute;top:8px;right:8px;pointer-events:auto;background:#000a;border-radius:50%;width:30px;height:30px;padding:0;z-index:3}
/* pre-roll gate over the player */
.preroll{position:absolute;inset:0;background:#000;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:20}
.preroll img{max-width:100%;max-height:100%;object-fit:contain}
.pradvid{width:100%;height:100%;object-fit:contain;background:#000}
.pradlink{position:absolute;bottom:12px;left:12px;background:#e11;color:#fff;padding:8px 14px;border-radius:6px;font-size:14px;font-weight:600;text-decoration:none;z-index:21}
.prtag{position:absolute;top:8px;left:8px;background:#f90;color:#000;font-weight:700;font-size:11px;padding:2px 8px;border-radius:4px}
.prskip{position:absolute;bottom:16px;right:16px;z-index:22;background:#000c;color:#fff;padding:10px 18px;border-radius:8px;font-size:15px;font-weight:700;cursor:default;user-select:none}
.prskip.ready{cursor:pointer;background:#e11;box-shadow:0 2px 12px rgba(0,0,0,.5)}
.prskip.ready:hover{background:#f22}
/* modal */
.modal{position:fixed;inset:0;background:#000b;display:flex;align-items:center;justify-content:center;z-index:50}
.modal.hidden{display:none}
.modalbox{width:min(400px,92vw);position:relative}
.modalClose{position:absolute;top:8px;right:8px;background:#333;border-radius:50%;width:30px;height:30px;padding:0}
.foot{text-align:center;padding:30px}
/* footer links + legal pages */
.footlinks{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;margin-bottom:12px}
.footlinks a{color:inherit;text-decoration:none;font-weight:600;white-space:nowrap}
.footlinks a:hover{text-decoration:underline}
.footwarn{max-width:760px;margin:0 auto 12px;font-size:13px;line-height:1.5;opacity:.9}
.footwarn a{color:inherit;text-decoration:underline}
.page{display:block;max-width:860px;margin:0 auto}
.doc{line-height:1.6}
.doc h1{margin:0 0 14px;font-size:24px}
.doc h2{margin:22px 0 8px;font-size:18px}
.doc p,.doc li{margin:0 0 12px}
.doc ol,.doc ul{padding-left:22px}
@media(max-width:900px){.watch,.home{grid-template-columns:1fr}}
/* cover thumbnails */
.tile .thumb{overflow:hidden}
.tile .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.rthumb img{width:100%;height:100%;object-fit:cover;border-radius:8px;display:block}
/* scrolling news ticker under the player */
.ticker{position:relative;overflow:hidden;white-space:nowrap;border-radius:8px;margin-top:10px;padding:8px 0;line-height:1.4}
/* ticker overlaid INSIDE the player (news-style strip along the BOTTOM of the video) */
.ticker-inside{position:absolute;left:0;right:0;bottom:0;top:auto;margin-top:0;border-radius:0 0 12px 12px;z-index:6;padding:6px 0;box-shadow:0 -2px 8px rgba(0,0,0,.35)}
/* custom fullscreen button (native one is disabled so the ticker survives fullscreen) */
.fsBtn{position:absolute;top:10px;right:10px;z-index:7;width:38px;height:34px;border:0;border-radius:6px;background:#000a;color:#fff;font-size:18px;line-height:1;cursor:pointer}
.fsBtn:hover{background:#000d}
/* when the stage is fullscreen, fill the screen and keep the ticker on top */
.stage:fullscreen{width:100vw;height:100vh;background:#000;display:flex;align-items:center;justify-content:center;border-radius:0}
.stage:-webkit-full-screen{width:100vw;height:100vh;background:#000;display:flex;align-items:center;justify-content:center;border-radius:0}
.stage:fullscreen video{width:100%;height:100%;border-radius:0;aspect-ratio:auto}
.stage:-webkit-full-screen video{width:100%;height:100%;border-radius:0;aspect-ratio:auto}
.stage:fullscreen .ticker-inside,.stage:-webkit-full-screen .ticker-inside{border-radius:0}
/* ---- custom player: transparent tap layer, centre play button, control bar ---- */
.tap{position:absolute;inset:0;z-index:3;background:transparent;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.bigplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:4;width:64px;height:64px;border:0;border-radius:50%;background:#000a;color:#fff;font-size:26px;line-height:64px;padding:0;cursor:pointer}
.bigplay:hover{background:#000d}
.stage.preroll-active .tap,.stage.preroll-active .bigplay,.stage.preroll-active .cpc{display:none}
.cpc{position:absolute;left:0;right:0;bottom:0;z-index:8;display:flex;align-items:center;gap:8px;padding:6px 10px;background:linear-gradient(transparent,rgba(0,0,0,.78));box-sizing:border-box;opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s;pointer-events:none;border-radius:0 0 12px 12px}
.stage.show-ui .cpc{opacity:1;transform:none;pointer-events:auto}
.stage.has-ticker .cpc{bottom:34px;border-radius:0}
.cpbtn{flex:0 0 auto;width:34px;height:30px;border:0;border-radius:6px;background:transparent;color:#fff;font-size:16px;line-height:1;cursor:pointer}
.cpbtn:hover{background:#ffffff33}
.cptime{flex:0 0 auto;color:#fff;font-size:12px;font-variant-numeric:tabular-nums;min-width:36px;text-align:center}
.cpseek{flex:1 1 auto;height:4px;-webkit-appearance:none;appearance:none;background:#ffffff55;border-radius:3px;cursor:pointer;accent-color:#e11}
.cpseek::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#e11;cursor:pointer}
.cpseek::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#e11;cursor:pointer}
/* iOS pseudo-fullscreen (real Fullscreen API can't wrap a <div> on iPhone) */
html.fs-lock,html.fs-lock body{overflow:hidden}
.stage.ios-fs{position:fixed;inset:0;width:100vw;height:100vh;z-index:9999;background:#000;display:flex;align-items:center;justify-content:center;border-radius:0}
.stage.ios-fs video{width:100%;height:100%;border-radius:0;aspect-ratio:auto}
.stage.ios-fs .ticker-inside{border-radius:0}
.stage.ios-fs .cpc{border-radius:0}
.stage.ios-fs.has-ticker .cpc{bottom:34px}
/* ---- rotating banner inside the player (stays visible in fullscreen) ---- */
.pbanner{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:center;overflow:hidden;pointer-events:none;border-radius:12px 12px 0 0}
.pbanner.hidden{display:none}
.pbanner .bslide{display:none;width:100%;pointer-events:auto;text-align:center}
.pbanner .bslide.on{display:block}
.pbanner .bslide .ad,.pbanner .bslide a.ad{display:block}
.pbanner img{display:block;margin:0 auto;max-width:100%;max-height:90px;width:auto;height:auto;object-fit:contain}
.bnClose{position:absolute;top:4px;right:6px;z-index:11;pointer-events:auto;width:24px;height:24px;padding:0;border:0;border-radius:50%;background:#000a;color:#fff;font-size:15px;line-height:24px;text-align:center;cursor:pointer}
.bnClose:hover{background:#000d}
.stage.ios-fs .pbanner,.stage:fullscreen .pbanner,.stage:-webkit-full-screen .pbanner{border-radius:0}
.stage.ios-fs .pbanner img,.stage:fullscreen .pbanner img,.stage:-webkit-full-screen .pbanner img{max-height:120px}
.ticker-track{display:inline-block;white-space:nowrap;will-change:transform;animation-name:tickerScroll;animation-timing-function:linear;animation-iteration-count:infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-item{display:inline-block;padding:0 34px;font-weight:600;text-decoration:none}
@keyframes tickerScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
/* ---- home: fill the width when there is no side ad, + infinite scroll ---- */
.wrap.home{max-width:1600px}
.home.no-side{grid-template-columns:1fr}
.col-side:empty{display:none}
#sentinel{width:100%;height:1px}

/* ---- picture clarity: de-fade covers + player ----------------------------
   480p files can't become true HD, but low-res video usually looks "faded"
   because its contrast and colour are weak. Nudging contrast/saturation/
   brightness restores the punch so it reads much clearer. The home-page
   covers also get a gentle SVG sharpen (#sharpen is defined inline in
   index.php; Safari only supports inline SVG filters, so it lives in the
   page, not an external file). crisp-edges keeps upscaled thumbs from going
   blurry. Kept mild on moving video so it doesn't look crunchy. */
.tile .thumb img{
  filter:contrast(1.08) saturate(1.15) brightness(1.03) url(#sharpen);
  image-rendering:-webkit-optimize-contrast;
}
.rthumb img{
  filter:contrast(1.08) saturate(1.14) brightness(1.03);
  image-rendering:-webkit-optimize-contrast;
}
/* De-fade the player with a <canvas> overlay (.vfx) that re-paints each video
   frame with contrast/colour + a real sharpen. A plain filter on the <video>
   is ignored on desktop Chrome (hardware video overlay) — which is why the
   thumbnails changed but the player did not — so the actual enhancement is
   done on the canvas in watch.php. The mild filter below is only a fallback
   for browsers that cannot filter a canvas; it never stacks with the canvas
   (the canvas is opaque over the video) so there is no over-saturation/pink. */
.player video{filter:contrast(1.08) saturate(1.1) brightness(1.03);}
.vfx{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  display:block;width:100%;height:100%;border-radius:12px;
}
.stage:fullscreen .vfx,.stage:-webkit-full-screen .vfx,.stage.ios-fs .vfx{border-radius:0}