/* ===== MANCO SYNC — CYBERPUNK PORTAL ===== */
/* Loaded on top of app.css. Neon cyan/magenta over the purple base. */

:root{
    --cy:#00f0ff;      /* cyan */
    --mg:#ff2bd6;      /* magenta */
    --pp:#8b5cf6;      /* purple */
    --cy-dim:rgba(0,240,255,.5);
    --mg-dim:rgba(255,43,214,.5);
    --portal-bg:#07060f;
    --portal-panel:#0f0d1c;
    --portal-line:rgba(0,240,255,.18);
    /* Teks & permukaan — ditimpa oleh tema terang di bawah */
    --p-head:#fff;
    --p-text:#e6f4ff;
    --p-muted:#8fb2c4;
    --p-dim:#6f93a3;
    --p-ink:5,4,10;
    --p-panel2:#141225;
}

/* ===== Tema terang: seluruh portal, bukan hanya navbar ===== */
[data-theme="light"]{
    --cy:#0e7490;
    --mg:#be185d;
    --pp:#6d28d9;
    --cy-dim:rgba(14,116,144,.45);
    --mg-dim:rgba(190,24,93,.4);
    --portal-bg:#f4f6fb;
    --portal-panel:#ffffff;
    --portal-line:rgba(14,116,144,.2);
    --p-head:#0f172a;
    --p-text:#1e293b;
    --p-muted:#475569;
    --p-dim:#64748b;
    --p-ink:255,255,255;
    --p-panel2:#eef2f7;
}
[data-theme="light"] .portal-page::before{opacity:.55}
[data-theme="light"] .cy-card,[data-theme="light"] .cy-ep,[data-theme="light"] .cy-chshortcut,[data-theme="light"] .cy-reader-bar,[data-theme="light"] .cy-notice,[data-theme="light"] .hub-card{box-shadow:0 1px 3px rgba(15,23,42,.06)}

.portal-page{position:relative;min-height:100vh;background:var(--portal-bg);color:var(--p-text);overflow:hidden}
.portal-page::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
    background:
      radial-gradient(ellipse at 15% -10%,rgba(0,240,255,.12),transparent 45%),
      radial-gradient(ellipse at 90% 110%,rgba(255,43,214,.12),transparent 45%),
      linear-gradient(rgba(139,92,246,.05) 1px,transparent 1px),
      linear-gradient(90deg,rgba(139,92,246,.05) 1px,transparent 1px);
    background-size:auto,auto,40px 40px,40px 40px}
.portal-page > *{position:relative;z-index:1}
.portal-wrap{max-width:1320px;margin:0 auto;padding:1.5rem 1.25rem 5rem}

/* --- breadcrumb / hero --- */
.portal-crumb{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--p-dim);margin-bottom:1rem;flex-wrap:wrap}
.portal-crumb a{color:var(--cy);transition:.2s}
.portal-crumb a:hover{text-shadow:0 0 10px var(--cy-dim)}
.portal-crumb i{font-size:.6rem;opacity:.5}

.portal-hero{margin-bottom:1.8rem}
.portal-kicker{font-family:'Orbitron',sans-serif;font-size:.7rem;letter-spacing:5px;color:var(--cy);text-transform:uppercase;text-shadow:0 0 10px var(--cy-dim)}
.portal-title{font-family:'Orbitron',sans-serif;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;letter-spacing:2px;margin:.35rem 0;color:var(--p-head);position:relative;display:inline-block}
.portal-title .accent{color:var(--mg);text-shadow:0 0 22px var(--mg-dim)}
.portal-sub{color:var(--p-muted);font-size:.95rem;max-width:60ch}

/* --- search --- */
.cy-search{display:flex;max-width:520px;margin:1.2rem 0 0;border:1px solid var(--portal-line);border-radius:10px;overflow:hidden;background:rgba(0,240,255,.04);backdrop-filter:blur(6px)}
.cy-search input{flex:1;background:transparent;border:none;outline:none;color:var(--p-text);padding:.7rem 1rem;font-size:.9rem}
.cy-search input::placeholder{color:var(--p-dim)}
.cy-search button{background:linear-gradient(135deg,var(--pp),var(--cy));color:#05040a;border:none;padding:0 1.2rem;font-weight:800;cursor:pointer}

/* --- tabs --- */
.cy-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:1.4rem 0 .4rem}
.cy-tab{font-family:'Orbitron',sans-serif;font-size:.72rem;letter-spacing:1px;text-transform:uppercase;color:var(--p-muted);padding:.5rem 1.1rem;border:1px solid var(--portal-line);border-radius:999px;cursor:pointer;background:transparent;transition:.2s}
.cy-tab.active,.cy-tab:hover{color:#05040a;background:linear-gradient(135deg,var(--cy),var(--pp));border-color:transparent;box-shadow:0 0 18px var(--cy-dim)}

/* --- section --- */
.cy-section{margin-top:2.2rem}
.cy-section-title{display:flex;align-items:center;gap:.6rem;font-family:'Orbitron',sans-serif;font-size:1.05rem;font-weight:800;letter-spacing:1px;margin-bottom:1rem;color:var(--p-head)}
.cy-section-title i{color:var(--cy);text-shadow:0 0 12px var(--cy-dim)}
.cy-section-title::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--portal-line),transparent)}

/* --- card grid --- */
.cy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1.1rem}
.cy-grid.wide{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.cy-card{display:block;background:var(--portal-panel);border:1px solid var(--portal-line);border-radius:12px;overflow:hidden;transition:transform .22s,box-shadow .22s,border-color .22s}
.cy-card:hover{transform:translateY(-5px);border-color:var(--cy);box-shadow:0 8px 30px rgba(0,240,255,.22)}
.cy-card-poster{position:relative;aspect-ratio:2/3;background:linear-gradient(135deg,#141225,#1d1533);overflow:hidden}
.cy-card-poster img{width:100%;height:100%;object-fit:cover;transition:transform .35s;background:var(--p-panel2)}
.cy-card:hover .cy-card-poster img{transform:scale(1.07)}
.cy-card-badge{position:absolute;top:8px;left:8px;background:rgba(var(--p-ink),.8);color:var(--cy);font-size:.66rem;font-weight:800;letter-spacing:.5px;padding:.2rem .5rem;border-radius:5px;border:1px solid var(--cy-dim);backdrop-filter:blur(4px)}
.cy-card-badge.mg{color:var(--mg);border-color:var(--mg-dim)}
.cy-card-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--p-ink),.45);opacity:0;transition:.25s}
.cy-card-play i{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--cy),var(--pp));color:#05040a;font-size:1.1rem;box-shadow:0 0 26px var(--cy-dim)}
.cy-card:hover .cy-card-play{opacity:1}
.cy-card-body{padding:.6rem .7rem .8rem}
.cy-card-title{font-size:.83rem;font-weight:600;color:var(--p-text);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.1em}
.cy-card-sub{display:inline-block;margin-top:.35rem;font-size:.72rem;color:var(--cy)}

/* --- buttons --- */
.cy-btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:.9rem;padding:.7rem 1.4rem;border-radius:10px;border:none;cursor:pointer;background:linear-gradient(135deg,var(--pp),var(--cy));color:#05040a;box-shadow:0 0 22px var(--cy-dim);transition:.25s}
.cy-btn:hover{transform:translateY(-2px);box-shadow:0 0 34px var(--mg-dim)}
.cy-btn-ghost{background:transparent;color:var(--cy);border:1px solid var(--cy-dim);box-shadow:none}
.cy-btn-ghost:hover{background:rgba(0,240,255,.08);color:var(--p-head)}

/* --- empty / notice --- */
.cy-empty,.cy-notice{text-align:center;padding:3rem 1.5rem;border:1px dashed var(--portal-line);border-radius:14px;color:var(--p-muted);background:var(--portal-panel)}
.cy-empty i,.cy-notice i{font-size:2.4rem;color:var(--cy);margin-bottom:.8rem;display:block;text-shadow:0 0 16px var(--cy-dim)}
.cy-notice h3{font-family:'Orbitron',sans-serif;color:var(--p-head);margin-bottom:.5rem}
.cy-notice code{background:rgba(0,240,255,.1);color:var(--cy);padding:.15rem .4rem;border-radius:4px}

/* --- detail --- */
.cy-detail{display:grid;grid-template-columns:260px 1fr;gap:2rem;align-items:start}
.cy-detail-poster{border-radius:14px;overflow:hidden;border:1px solid var(--portal-line);box-shadow:0 0 34px rgba(139,92,246,.25);position:sticky;top:1rem}
.cy-detail-poster img{width:100%;display:block;background:var(--p-panel2)}
.cy-detail h1{font-family:'Orbitron',sans-serif;font-size:1.7rem;color:var(--p-head);margin-bottom:.3rem;line-height:1.2}
.cy-detail .jp{color:var(--mg);font-size:.9rem;margin-bottom:1rem}
.cy-meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.2rem}
.cy-meta span{font-size:.76rem;padding:.3rem .7rem;border-radius:6px;background:rgba(0,240,255,.06);border:1px solid var(--portal-line);color:var(--p-text)}
.cy-meta span i{color:var(--cy);margin-right:.3rem}
.cy-genres{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.3rem}
.cy-genre{font-size:.72rem;padding:.28rem .7rem;border-radius:999px;border:1px solid var(--mg-dim);color:var(--mg)}
.cy-synopsis{color:var(--p-muted);line-height:1.7;font-size:.92rem;margin-bottom:1.6rem}
.cy-synopsis p{margin-bottom:.7rem}

/* --- episode / chapter list --- */
.cy-eplist{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.6rem}
.cy-ep{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.7rem .9rem;border:1px solid var(--portal-line);border-radius:9px;background:var(--portal-panel);transition:.2s}
.cy-ep:hover{border-color:var(--cy);background:rgba(0,240,255,.06);transform:translateX(3px)}
.cy-ep .ep-t{font-size:.85rem;font-weight:600;color:var(--p-text)}
.cy-ep .ep-d{font-size:.7rem;color:var(--p-dim)}
.cy-ep i{color:var(--cy)}

/* --- watch / player --- */
.cy-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border:1px solid var(--cy-dim);border-radius:14px;overflow:hidden;box-shadow:0 0 40px rgba(0,240,255,.18)}
.cy-player iframe{width:100%;height:100%;border:0}
/* compatibility badge under player */
.cy-compat{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;margin-top:.9rem;padding:.6rem .9rem;border:1px solid var(--portal-line);border-radius:10px;background:rgba(0,240,255,.04);font-size:.78rem}
.cy-compat-fmt{font-family:'Orbitron',sans-serif;font-size:.7rem;letter-spacing:1px;color:var(--cy);padding:.25rem .6rem;border:1px solid var(--cy-dim);border-radius:6px;white-space:nowrap}
.cy-compat-browsers{display:flex;gap:.7rem;flex-wrap:wrap}
.cy-compat-browsers span{display:inline-flex;align-items:center;gap:.3rem;color:var(--p-dim);opacity:.45;transition:.2s}
.cy-compat-browsers span.ok{color:#4ade80;opacity:1}
.cy-compat-browsers span.ok::after{content:'\2713';font-size:.7em;margin-left:.1rem}
.cy-compat-browsers span.no{color:#ef4444;opacity:.65}
.cy-compat-you{margin-left:auto;color:var(--p-text)}
.cy-compat-you .ok{color:#4ade80;font-weight:700}
.cy-compat-you .warn{color:#fbbf24;font-weight:700}
@media(max-width:560px){.cy-compat-you{margin-left:0;width:100%}}

.cy-watch-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.cy-watch-head h1{font-family:'Orbitron',sans-serif;font-size:1.25rem;color:var(--p-head)}
.cy-nav-eps{display:flex;gap:.6rem}
.cy-servers{margin-top:1.3rem}
.cy-server-group{margin-bottom:.9rem}
.cy-server-group .q{font-family:'Orbitron',sans-serif;font-size:.72rem;letter-spacing:1px;color:var(--mg);margin-bottom:.4rem;text-transform:uppercase}
.server-btn{font-size:.76rem;padding:.4rem .8rem;margin:0 .4rem .4rem 0;border-radius:7px;border:1px solid var(--portal-line);background:var(--portal-panel);color:var(--p-text);cursor:pointer;transition:.2s}
.server-btn:hover,.server-btn.active{color:#05040a;background:linear-gradient(135deg,var(--cy),var(--pp));border-color:transparent}
.cy-downloads{margin-top:2rem}
.cy-dl-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.6rem 0;border-bottom:1px solid var(--portal-line)}
.cy-dl-row .q{font-weight:800;color:var(--cy);min-width:90px;font-size:.82rem}
.cy-dl-row a{font-size:.74rem;padding:.3rem .7rem;border-radius:6px;border:1px solid var(--mg-dim);color:var(--mg);transition:.2s}
.cy-dl-row a:hover{background:rgba(255,43,214,.12);color:var(--p-head)}

/* --- comic reader --- */
.cy-reader{max-width:820px;margin:0 auto;background:#000;border-radius:10px;overflow:hidden}
.cy-reader img{width:100%;display:block}
/* per-panel skeleton (shimmer + spinner) while an image loads */
.cy-reader .cy-page{position:relative;min-height:380px;background:linear-gradient(100deg,#0a0a14 30%,#12121f 50%,#0a0a14 70%);background-size:200% 100%;animation:cy-shim 1.5s ease-in-out infinite}
.cy-reader .cy-page.is-loaded{min-height:0;background:none;animation:none}
.cy-reader .cy-page img{opacity:0;transition:opacity .35s ease}
.cy-reader .cy-page.is-loaded img{opacity:1}
.cy-reader .cy-page-sk{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;pointer-events:none}
.cy-reader .cy-page.is-loaded .cy-page-sk{display:none}
.cy-reader .cy-page-sk .sp{width:34px;height:34px;border:3px solid rgba(0,240,255,.18);border-top-color:var(--cy);border-radius:50%;animation:cy-spin .8s linear infinite}
.cy-reader .cy-page-sk .lbl{font-family:'Orbitron',sans-serif;font-size:.72rem;letter-spacing:2px;color:var(--cy-dim)}
.cy-reader .cy-page.is-error{min-height:180px;background:rgba(255,43,214,.06);animation:none;cursor:pointer}
.cy-reader .cy-page.is-error .cy-page-sk .sp{border-color:rgba(255,43,214,.35);border-top-color:var(--mg);animation:none}
.cy-reader .cy-page.is-error .cy-page-sk .lbl{color:var(--mg)}
/* floating "still loading" badge — fixed, unobtrusive, bottom-right */
.cy-loadbar{position:fixed;right:16px;bottom:16px;z-index:70;display:none;align-items:center;gap:.55rem;padding:.5rem .9rem;border-radius:999px;background:rgba(var(--p-ink),.85);border:1px solid var(--cy-dim);color:var(--cy);font-family:'Orbitron',sans-serif;font-size:.7rem;letter-spacing:1px;backdrop-filter:blur(6px);box-shadow:0 0 22px rgba(0,240,255,.28)}
.cy-loadbar.show{display:flex}
.cy-loadbar .sp{width:14px;height:14px;border:2px solid rgba(0,240,255,.25);border-top-color:var(--cy);border-radius:50%;animation:cy-spin .8s linear infinite}
@keyframes cy-spin{to{transform:rotate(360deg)}}
@keyframes cy-shim{0%{background-position:200% 0}100%{background-position:-200% 0}}
.cy-reader-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;max-width:820px;margin:0 auto 1.2rem;padding:.8rem 1rem;background:var(--portal-panel);border:1px solid var(--portal-line);border-radius:10px}
.cy-reader-bar h1{font-size:.95rem;color:var(--p-head);font-family:'Orbitron',sans-serif}
/* reader chapter nav: dropdown + shortcut grid */
.cy-readnav{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.cy-chsel{background:rgba(var(--p-ink),.7);color:var(--cy);border:1px solid var(--cy-dim);border-radius:9px;padding:.55rem .7rem;font-size:.82rem;max-width:230px;cursor:pointer;font-family:inherit}
.cy-chsel:focus{outline:none;border-color:var(--cy)}
.cy-chsel option{background:var(--p-panel2);color:var(--p-text)}
.cy-chshortcut{max-width:820px;margin:1.4rem auto 0;background:var(--portal-panel);border:1px solid var(--portal-line);border-radius:12px;padding:1.1rem}
.cy-chshortcut-head{font-family:'Orbitron',sans-serif;font-size:.78rem;letter-spacing:1px;color:var(--cy);margin-bottom:.8rem}
.cy-chshortcut-head span{color:var(--p-muted)}
.cy-chgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:.45rem;max-height:340px;overflow-y:auto;padding-right:.3rem}
.cy-chbtn{display:flex;align-items:center;justify-content:center;text-align:center;padding:.5rem .3rem;font-size:.8rem;font-weight:700;color:var(--p-text);background:rgba(var(--p-ink),.5);border:1px solid var(--portal-line);border-radius:8px;transition:.15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cy-chbtn:hover{border-color:var(--cy);color:var(--cy);background:rgba(0,240,255,.07)}
.cy-chbtn.active{background:linear-gradient(135deg,var(--cy),var(--pp));color:#05040a;border-color:transparent}
/* novel text reader */
.cy-novel{max-width:760px;margin:0 auto;padding:1.8rem 1.5rem;background:var(--portal-panel);border:1px solid var(--portal-line);border-radius:12px;color:var(--p-text);font-size:1.06rem;line-height:1.95;letter-spacing:.2px}
.cy-novel p{margin:0 0 1.15rem}
.cy-novel p:last-child{margin-bottom:0}

/* --- hub --- */
.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.4rem;margin-top:2.5rem}
.hub-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:280px;padding:1.5rem;border-radius:18px;overflow:hidden;border:1px solid var(--portal-line);background:var(--portal-panel);transition:transform .25s,box-shadow .25s;isolation:isolate}
.hub-card::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.9;transition:.3s;background:linear-gradient(160deg,rgba(0,240,255,.16),transparent 55%),linear-gradient(320deg,rgba(255,43,214,.16),transparent 55%)}
.hub-card:hover{transform:translateY(-6px);border-color:var(--cy);box-shadow:0 14px 44px rgba(0,240,255,.22)}
.hub-card .hub-ic{font-size:2.4rem;color:var(--cy);text-shadow:0 0 20px var(--cy-dim);margin-bottom:auto}
.hub-card h2{font-family:'Orbitron',sans-serif;font-size:1.3rem;color:var(--p-head);margin:.8rem 0 .3rem;letter-spacing:1px}
.hub-card p{font-size:.82rem;color:var(--p-muted);line-height:1.5}
.hub-card .hub-go{margin-top:1rem;font-family:'Orbitron',sans-serif;font-size:.72rem;letter-spacing:2px;color:var(--cy);text-transform:uppercase}
.hub-card.soon{opacity:.6}
.hub-card.soon .hub-tag{position:absolute;top:1rem;right:1rem;font-size:.62rem;letter-spacing:1px;color:var(--mg);border:1px solid var(--mg-dim);padding:.2rem .5rem;border-radius:5px}

/* --- portal nav dropdown (in main navbar) --- */
.nav-portal-link{color:var(--cy)!important;font-weight:700!important}
.nav-portal-link::before{content:'\f0e7';font-family:'Font Awesome 6 Free';font-weight:900;margin-right:.35rem;font-size:.8em}

/* source selector bar */
.cy-srcbar{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin:.4rem 0 1rem;padding:.6rem .9rem;border:1px solid var(--portal-line);border-radius:10px;background:rgba(139,92,246,.06)}
.cy-srcbar-label{font-family:'Orbitron',sans-serif;font-size:.7rem;letter-spacing:1px;color:var(--pp);text-transform:uppercase}
.cy-srcs{display:flex;gap:.5rem;flex-wrap:wrap}
.cy-src{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:600;color:var(--p-text);padding:.4rem .85rem;border-radius:8px;border:1px solid var(--portal-line);transition:.2s}
.cy-src i{color:var(--pp)}
.cy-src.active,.cy-src:hover{color:#05040a;background:linear-gradient(135deg,var(--pp),var(--cy));border-color:transparent}
.cy-src.active i,.cy-src:hover i{color:#05040a}

/* Plyr player — cyberpunk theme */
:root{
    --plyr-color-main:#00f0ff;
    --plyr-video-control-color:var(--p-text);
    --plyr-video-control-color-hover:#05040a;
    --plyr-video-controls-background:linear-gradient(transparent,rgba(var(--p-ink),.9));
    --plyr-menu-background:var(--portal-panel);
    --plyr-menu-color:var(--p-text);
    --plyr-badge-background:#8b5cf6;
    --plyr-range-fill-background:#00f0ff;
    --plyr-video-progress-buffered-background:rgba(0,240,255,.25);
    --plyr-captions-background:rgba(var(--p-ink),.75);
}
.cy-player .plyr{width:100%;height:100%;border-radius:0}
.cy-player .plyr__video-wrapper{height:100%;background:#000}
.cy-player .plyr video{width:100%;height:100%;object-fit:contain}

/* live tv channel cards */
.tv-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:1rem .8rem;min-height:130px;background:var(--portal-panel);border:1px solid var(--portal-line);border-radius:12px;text-align:center;transition:.2s}
.tv-card:hover{transform:translateY(-4px);border-color:var(--cy);box-shadow:0 8px 26px rgba(0,240,255,.2)}
.tv-logo{height:58px;display:flex;align-items:center;justify-content:center}
.tv-logo img{max-height:58px;max-width:100%;object-fit:contain}
.tv-name{font-size:.78rem;color:var(--p-text);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tv-card.featured{border-color:var(--mg);background:linear-gradient(160deg,rgba(255,43,214,.12),var(--portal-panel))}
.tv-live{color:#ff4d4d;font-size:.66rem;font-weight:800;letter-spacing:1px;position:absolute;top:8px;right:10px}
.cy-watch-head .tv-live{position:static}

/* pagination */
.cy-pagination{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.6rem}
.cy-page-ind{font-family:'Orbitron',sans-serif;font-size:.8rem;color:var(--cy)}

/* hub rows */
.cy-row-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.cy-row-head .cy-section-title{margin:0}
.cy-row-head .cy-section-title::after{display:none}
.cy-seeall{color:var(--cy);font-size:.8rem;white-space:nowrap}
.cy-seeall:hover{text-shadow:0 0 10px var(--cy-dim)}
/* 18+ hub: section header (title + see-all) with a source badge */
.cy-sechead{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.4rem}
.cy-sechead-src{font-family:'Orbitron',sans-serif;font-size:.6rem;letter-spacing:2px;text-transform:uppercase;color:var(--mg);border:1px solid rgba(255,43,214,.45);padding:.15rem .5rem;border-radius:6px;margin-left:.55rem;vertical-align:middle}
/* frontend auth (login gate for 18+) */
.cy-auth{background:var(--portal-panel);border:1px solid var(--portal-line);border-radius:14px;padding:1.8rem 1.6rem;box-shadow:0 0 40px rgba(0,240,255,.1)}
.cy-auth-note{color:var(--p-muted);font-size:.85rem;line-height:1.6;margin:0 0 1.3rem}
.cy-authform label{display:block;font-size:.72rem;letter-spacing:1px;text-transform:uppercase;color:var(--cy);margin:.9rem 0 .35rem;font-family:'Orbitron',sans-serif}
.cy-authform input[type=text],.cy-authform input[type=password]{width:100%;padding:.75rem .9rem;background:rgba(var(--p-ink),.6);border:1px solid var(--portal-line);border-radius:9px;color:var(--p-head);font-size:.95rem;outline:none;transition:.2s}
.cy-authform input[type=text]:focus,.cy-authform input[type=password]:focus{border-color:var(--cy);box-shadow:0 0 0 3px rgba(0,240,255,.12)}
.cy-remember{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--p-muted);text-transform:none;letter-spacing:0;font-family:inherit;margin:.9rem 0 1.2rem}
.cy-remember input{width:auto}
.cy-notice-err{border-color:var(--mg)!important;color:#ffd6f2}
.cy-notice-err i{color:var(--mg)!important}
.cy-auth-back{display:inline-block;margin-top:1.1rem;color:var(--p-muted);font-size:.82rem}
.cy-auth-back:hover{color:var(--cy)}

@media(max-width:720px){
    .cy-detail{grid-template-columns:1fr}
    .cy-detail-poster{position:relative;max-width:220px;margin:0 auto}
}

/* Sampul pengganti: cover yang gagal dimuat (diblokir sumber, tautan mati, kosong)
   diganti judulnya di atas gradien, bukan kotak gelap kosong. */
.cy-card-poster.is-tanpa-cover img,.cy-detail-poster.is-tanpa-cover img{opacity:0}
.cy-card-poster.is-tanpa-cover::after,.cy-detail-poster.is-tanpa-cover::after{content:attr(data-judul);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:.9rem;text-align:center;font-weight:700;font-size:.92rem;line-height:1.35;color:#e9e6ff;background:linear-gradient(150deg,rgba(0,240,255,.16),rgba(139,92,246,.28)),#141225;overflow:hidden;word-break:break-word}
.cy-detail-poster.is-tanpa-cover{position:relative;aspect-ratio:2/3}
.cy-detail-poster.is-tanpa-cover::after{font-size:1.15rem}

/* Halaman tonton: bar & grid episode memakai komponen pembaca manga, selebar pemutar */
.cy-watch-bar{max-width:none}
.cy-reader-bar.cy-watch-bar{margin:0 0 1rem}
.cy-chshortcut.cy-watch-bar{margin:1.4rem 0 0}
[data-theme="light"] .cy-notice-err{color:#9d174d}
[data-theme="light"] .cy-compat-browsers span.ok,[data-theme="light"] .cy-compat-you .ok{color:#15803d}

/* Pratinjau film di atas pemutar */
.cy-film-hero{position:relative;display:flex;gap:1.6rem;align-items:flex-end;padding:1.6rem;margin-bottom:1.4rem;border:1px solid var(--portal-line);border-radius:14px;overflow:hidden;background:var(--portal-panel);min-height:300px}
.cy-film-hero::before{content:'';position:absolute;inset:0;background:var(--hero-bg,none) center/cover no-repeat;opacity:.55;z-index:0}
.cy-film-hero::after{content:'';position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,var(--portal-panel) 18%,rgba(var(--p-ink),.82) 55%,rgba(var(--p-ink),.35)),linear-gradient(0deg,var(--portal-panel),transparent 60%)}
.cy-film-hero>*{position:relative;z-index:1}
.cy-film-hero-poster{flex:0 0 190px}
.cy-film-hero-poster img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:10px;border:1px solid var(--portal-line);box-shadow:0 12px 30px rgba(0,0,0,.45)}
.cy-film-hero-info{flex:1;min-width:0}
.cy-film-hero-info h1{font-family:'Orbitron',sans-serif;font-size:clamp(1.3rem,3vw,2rem);color:var(--p-head);line-height:1.2;margin:.2rem 0 .4rem}
.cy-film-ep{font-size:.8rem;margin-left:.6rem;padding:.2rem .55rem;border-radius:6px;border:1px solid var(--cy-dim);color:var(--cy);vertical-align:middle;font-family:inherit}
.cy-film-tagline{font-style:italic;color:var(--p-muted);margin-bottom:.7rem}
.cy-film-overview{color:var(--p-text);font-size:.92rem;line-height:1.7;margin:.8rem 0 1rem;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;max-width:820px}
.cy-film-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.cy-trailer{position:relative;aspect-ratio:16/9;margin-bottom:1.4rem;border-radius:14px;overflow:hidden;border:1px solid var(--portal-line);background:#000}
.cy-trailer iframe{width:100%;height:100%;border:0}
@media (max-width:700px){
    .cy-film-hero{flex-direction:column;align-items:flex-start;padding:1.1rem}
    .cy-film-hero-poster{flex-basis:auto;width:130px}
}

/* Pencarian 'Semua Sumber' */
.cy-src-all{border-style:dashed}
.cy-allstat{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 1.2rem}
.cy-allchip{display:inline-flex;align-items:center;gap:.4rem;font:inherit;font-size:.76rem;font-weight:600;padding:.4rem .8rem;border-radius:8px;border:1px solid var(--portal-line);background:var(--portal-panel);color:var(--p-text);cursor:pointer;transition:.15s}
.cy-allchip b{color:var(--cy)}
.cy-allchip em{font-style:normal;font-size:.68rem;padding:.05rem .35rem;border-radius:4px;background:var(--p-panel2);color:var(--p-muted)}
.cy-allchip:hover:not(:disabled),.cy-allchip.active{border-color:var(--cy);color:var(--cy)}
.cy-allchip.is-loading{opacity:.75;cursor:progress}
.cy-allchip.is-empty{opacity:.45;cursor:default}
.cy-allcard{position:relative}
.cy-allcard[hidden]{display:none}
.cy-allcard[data-local] .cy-card{opacity:.92}
.cy-card-src{position:absolute;right:.45rem;top:.45rem;z-index:3;display:inline-flex;align-items:center;gap:.3rem;max-width:calc(100% - .9rem);font-size:.66rem;font-weight:700;padding:.22rem .5rem;border-radius:6px;background:rgba(5,4,10,.82);color:#fff;border:1px solid rgba(0,240,255,.35);backdrop-filter:blur(4px);pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cy-card-src i{color:#00f0ff}
.cy-allnote{margin-top:1rem;font-size:.75rem;color:var(--p-dim)}

/* Filter jenis komik */
.cy-jenis{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;margin:.2rem 0 1.4rem}
.cy-jenis-btn{font-size:.76rem;font-weight:600;padding:.35rem .85rem;border-radius:999px;border:1px solid var(--portal-line);background:var(--portal-panel);color:var(--p-text);transition:.15s}
.cy-jenis-btn:hover{border-color:var(--cy);color:var(--cy)}
.cy-jenis-btn.active{background:linear-gradient(135deg,var(--cy),var(--pp));color:#05040a;border-color:transparent}
.cy-jenis-btn.is-off{opacity:.4;pointer-events:none}
.cy-jenis-note{font-size:.74rem;color:var(--p-dim)}

/* Ikon di dalam tombol pada kotak notice/empty tetap seukuran teks */
.cy-notice .cy-btn i,.cy-empty .cy-btn i,.cy-empty .cy-genre i{font-size:inherit;display:inline;margin:0;text-shadow:none;color:inherit}

/* ===== Halaman tonton: cegah layar berkedip saat video diputar =====
   Chromium/Brave berkedip bila video (terutama iframe embed) dikomposisi di bawah
   efek berat: header sticky ber-backdrop-filter blur (di-blur ulang tiap frame
   video), lapisan latar position:fixed selebar layar, dan bayangan glow besar.
   Efek-efek itu dimatikan HANYA di halaman yang memuat pemutar. */
body:has(.cy-player) .site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(15,14,23,.98)}
[data-theme="light"] body:has(.cy-player) .site-header{background:rgba(245,244,255,.99)}
body:has(.cy-player) .portal-page::before{position:absolute;background-attachment:scroll}
body:has(.cy-player) .cy-card-src{backdrop-filter:none}
.cy-player{isolation:isolate;transform:translateZ(0);box-shadow:0 4px 18px rgba(0,0,0,.35)}
.cy-player iframe,.cy-player video{display:block;backface-visibility:hidden}

/* Daftar server film: dua kelompok, chip rapi (penyedia · audio · kualitas) */
.cy-srv-group{margin-top:.9rem}
.cy-srv-head{display:flex;align-items:baseline;gap:.5rem;font-size:.82rem;font-weight:700;color:var(--p-head);margin-bottom:.55rem}
.cy-srv-head i{color:var(--cy)}
.cy-srv-head span{font-weight:500;font-size:.74rem;color:var(--p-dim)}
.cy-srv-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.5rem}
.cy-srv{display:flex;align-items:center;gap:.4rem;min-width:0;padding:.5rem .7rem;border-radius:9px;border:1px solid var(--portal-line);background:var(--portal-panel);color:var(--p-text);font-size:.78rem;transition:.15s}
.cy-srv:hover{border-color:var(--cy);color:var(--cy)}
.cy-srv.active{background:linear-gradient(135deg,var(--pp),var(--cy));border-color:transparent;color:#fff}
.cy-srv-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.cy-srv-name small{font-weight:600;opacity:.7}
.cy-srv-tag,.cy-srv-q{flex-shrink:0;font-size:.66rem;font-weight:700;padding:.12rem .4rem;border-radius:5px;background:var(--p-panel2);color:var(--p-muted)}
.cy-srv-q{color:var(--cy)}
.cy-srv-tag.is-id{background:rgba(220,38,38,.15);color:#ef4444}
.cy-srv.active .cy-srv-tag,.cy-srv.active .cy-srv-q{background:rgba(255,255,255,.22);color:#fff}

/* Popup dukungan (Saweria / Sociabuzz) */
.sawer-backdrop{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(5,4,10,.72);opacity:0;transition:opacity .2s}
/* [hidden] HARUS menang dari display:flex di atas — tanpa ini lapisan transparan
   selebar layar menutupi halaman dan semua klik tertangkap (5 Okt: situs tak bisa diklik). */
.sawer-backdrop[hidden]{display:none!important}
.sawer-backdrop{pointer-events:none}
.sawer-backdrop.is-open{opacity:1;pointer-events:auto}
.sawer-box{position:relative;width:100%;max-width:560px;max-height:calc(100vh - 32px);overflow:auto;padding:1.6rem 1.4rem 1.2rem;border-radius:16px;background:var(--portal-panel,#0f0d1c);border:1px solid var(--portal-line,rgba(0,240,255,.18));text-align:center;color:var(--p-text,#e6f4ff);transform:translateY(12px) scale(.98);transition:transform .2s}
.sawer-backdrop.is-open .sawer-box{transform:none}
.sawer-close{position:absolute;top:.6rem;right:.6rem;width:36px;height:36px;border-radius:50%;border:0;background:var(--p-panel2,#141225);color:var(--p-muted,#8fb2c4);cursor:pointer;font-size:1rem}
.sawer-close:hover{color:var(--p-head,#fff)}
.sawer-emoji{font-size:2rem;line-height:1}
.sawer-box h2{font-family:'Orbitron',sans-serif;font-size:1.15rem;line-height:1.35;margin:.6rem 0 .35rem;color:var(--p-head,#fff)}
.sawer-sub{font-size:.85rem;color:var(--p-muted,#8fb2c4);margin:0 0 1.1rem}
.sawer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.8rem}
.sawer-card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.9rem;border-radius:12px;border:2px solid var(--sawer);background:color-mix(in srgb,var(--sawer) 10%,transparent);color:inherit;transition:transform .15s}
.sawer-card:hover{transform:translateY(-2px)}
.sawer-qr{background:#fff;border-radius:10px;padding:8px;line-height:0}
.sawer-qr svg{width:170px;height:170px;display:block}
.sawer-name{font-weight:800;font-size:1rem;color:var(--p-head,#fff)}
.sawer-btn{font-size:.78rem;font-weight:700;padding:.4rem .8rem;border-radius:999px;background:var(--sawer);color:#111}
.sawer-later{margin-top:1rem;background:none;border:0;color:var(--p-dim,#6f93a3);font-size:.8rem;cursor:pointer;text-decoration:underline}
/* HP: dua QR berdampingan (lebih kecil) supaya semua terlihat tanpa menggulir */
@media (max-width:480px){
  .sawer-box{padding:1.3rem .9rem 1rem}
  .sawer-box h2{font-size:.98rem}
  .sawer-sub{font-size:.78rem;margin-bottom:.9rem}
  .sawer-grid{grid-template-columns:1fr 1fr;gap:.55rem}
  .sawer-card{padding:.6rem .45rem;gap:.4rem}
  .sawer-qr{padding:6px}
  .sawer-qr svg{width:100%;height:auto;max-width:132px}
  .sawer-name{font-size:.88rem}
  .sawer-btn{font-size:.68rem;padding:.35rem .6rem}
}

/* QR bergaya resmi: latar berwarna + logo di tengah */
.sawer-qr{background:var(--qrbg,#fff);border-radius:12px;padding:10px;line-height:0}
.sawer-qr-code{position:relative;line-height:0}
.sawer-qr-logo{position:absolute;left:50%;top:50%;width:22%;height:auto;max-width:42px;transform:translate(-50%,-50%);border-radius:8px;background:var(--qrbg,#fff);padding:3px;box-sizing:content-box}
.sawer-card.is-saweria .sawer-qr{border:2px solid #111;box-shadow:4px 4px 0 #111}
.sawer-card.is-sociabuzz .sawer-qr{padding:8px 12px 10px;border-radius:14px}
.sawer-qr-top,.sawer-qr-bottom{line-height:1.2;font-weight:800;color:#111;font-family:inherit}
.sawer-qr-top{font-size:.92rem;margin-bottom:6px}
.sawer-qr-bottom{font-size:.88rem;margin-top:6px}
@media (max-width:480px){.sawer-qr-top{font-size:.78rem}.sawer-qr-bottom{font-size:.72rem}.sawer-card.is-saweria .sawer-qr{box-shadow:3px 3px 0 #111}}

/* Tombol Audio Boost di bawah pemutar */
.cy-boost{display:inline-flex;align-items:center;gap:.35rem;margin-left:auto;font:inherit;font-size:.74rem;font-weight:600;padding:.3rem .7rem;border-radius:999px;border:1px solid var(--portal-line);background:var(--portal-panel);color:var(--p-muted);cursor:pointer}
.cy-boost b{font-weight:800}
.cy-boost.is-on{border-color:var(--cy);color:var(--cy)}
.cy-boost.is-on i{color:var(--cy)}
.cy-boost[hidden]{display:none}
.cy-boost-na{cursor:help;opacity:.75}

/* ===== Video AI (drama pendek vertikal): pemutar tegak kiri, info kanan ===== */
.sd-layout{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.5rem;align-items:start;margin-top:1rem}
.sd-left{position:sticky;top:130px;width:min(100%,calc((100vh - 230px) * 9 / 16));min-width:300px}
.sd-left .cy-player{aspect-ratio:9/16;width:100%;margin:0;border-radius:16px;overflow:hidden}
.sd-left .cy-compat{flex-wrap:wrap;gap:.5rem;justify-content:space-between;margin-top:.6rem;padding:.5rem .7rem}
.sd-left .cy-compat-browsers,.sd-left .cy-compat-you{display:none}
.sd-left .cy-boost{margin-left:0}
/* Kontrol Plyr di bingkai sempit: buang yang jarang dipakai supaya tidak berdesakan */
.sd-left .plyr__volume input[type="range"],.sd-left .plyr__time--duration,.sd-left [data-plyr="pip"],.sd-left [data-plyr="rewind"],.sd-left [data-plyr="fast-forward"]{display:none}
.sd-left .plyr__controls{gap:.15rem;padding:.6rem .5rem .5rem}
.sd-right{min-width:0;display:flex;flex-direction:column;gap:1rem}
.sd-right .cy-watch-bar{margin:0}
.sd-right .cy-reader-bar h1{font-size:1.15rem;line-height:1.35}
.sd-right .cy-servers{margin:0}
.sd-right .cy-chshortcut{margin:0}
.sd-right .cy-chgrid{max-height:calc(100vh - 420px);min-height:120px}
@media (max-width:860px){
    .sd-layout{grid-template-columns:1fr;gap:1rem}
    .sd-left{position:static;width:min(100%,calc(72vh * 9 / 16));min-width:0;margin-inline:auto}
    .sd-right .cy-chgrid{max-height:320px}
}
.cy-fallback-note{margin:.6rem 0;padding:.55rem .8rem;border:1px solid rgba(234,179,8,.45);background:rgba(234,179,8,.08);color:#eab308;border-radius:10px;font-size:.82rem}
