:root{--bg: #0d0f14;--panel: #161922;--panel-2: #1d2130;--line: #262b3a;--fg: #e8eaf0;--muted: #8b93a7;--accent: #ff3b6b;--accent-2: #6c8cff;--ok: #35d07f;--warn: #ffb547}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px}a{color:inherit;text-decoration:none}.app{min-height:100%;display:flex;flex-direction:column}.header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 18px;background:#0d0f14eb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);flex-wrap:wrap}.brand{font-weight:700;font-size:16px;letter-spacing:.3px;font-family:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;line-height:inherit;white-space:nowrap}.brand span{color:var(--accent)}.brand-singkat{display:none;color:var(--accent)}.brand:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}.header-search{flex:1 1 220px;min-width:150px;display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px 10px;min-height:40px}.header-search input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--fg);font-size:14px;font-family:inherit}.header-search input::placeholder{color:var(--muted)}.header-search .icon{color:var(--muted)}.header-search .clear{cursor:pointer;color:var(--muted);background:none;border:0;font:inherit;padding:0 2px}.header-search .clear:hover{color:var(--fg)}.pick{background:var(--panel);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:13px;font-family:inherit;cursor:pointer;max-width:200px;min-height:40px}.pick:hover,.pick:focus{border-color:var(--accent-2);outline:0}@media (max-width: 820px){.header-search{flex:1 1 140px}.pick{max-width:150px}}.main{flex:1;padding:16px 18px 40px}.section{margin-bottom:26px}.section-title{font-size:15px;font-weight:600;margin:0 0 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.section-title .count{color:var(--muted);font-weight:400;font-size:12px}.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));justify-content:center}.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;cursor:pointer;transition:transform .12s ease,border-color .12s ease;display:flex;flex-direction:column}.card:hover{transform:translateY(-3px);border-color:var(--accent-2)}.card:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}.card .thumb{position:relative;aspect-ratio:3 / 4;background:var(--panel-2)}.card .thumb img{width:100%;height:100%;object-fit:cover;display:block}.card .thumb .noimg{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:11.5px}.card .badge{position:absolute;left:6px;top:6px;background:#000000ad;color:#fff;font-size:11px;padding:2px 6px;border-radius:5px}.card .badge.right{left:auto;right:6px;background:#ff3b6be6}.card .meta{padding:8px 9px 10px}.card .name{font-size:12.5px;font-weight:600;line-height:1.32;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:33px}.card .sub{color:var(--muted);font-size:11px;margin-top:5px;display:flex;justify-content:space-between;gap:6px}.footer{color:var(--muted);font-size:11.5px;padding:10px 18px 26px;text-align:center}.loading{color:var(--muted);padding:18px;text-align:center}.empty{color:var(--muted);padding:26px 0;text-align:center}.unlock-info{border-left-color:var(--accent);color:var(--muted)}.lazy-marker{min-height:56px;display:flex;align-items:center;justify-content:center;padding:14px 0 26px}.lazy-marker .loading{padding:0}.lazy-more{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:10px 18px;font:inherit;cursor:pointer}.lazy-more:hover{border-color:var(--accent)}.lazy-habis{color:var(--muted);font-size:13px}.playlet{max-width:1100px;margin:0 auto;padding:14px 18px 40px}.detail-topbar{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}.detail-topbar .btn:last-child:not(:first-child){margin-left:auto}.btn{background:var(--panel);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;font-family:inherit;cursor:pointer}.btn:hover{border-color:var(--accent-2)}.btn:disabled{opacity:.5;cursor:default}.btn.back{min-height:40px}.hero{display:flex;gap:18px;flex-wrap:wrap;align-items:flex-start;background:linear-gradient(180deg,var(--panel) 0%,rgba(0,0,0,0) 100%);border:1px solid var(--line);border-radius:12px;padding:16px}.playlet{max-width:1100px}.hero>.hero-body{min-width:0}.hero-media{position:relative;width:190px;flex:0 0 auto}.hero-media img{width:100%;border-radius:10px;display:block;aspect-ratio:3 / 4;object-fit:cover;background:var(--panel-2)}.hero-media .noimg-poster{width:100%;aspect-ratio:3 / 4;border-radius:10px;background:var(--panel-2);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px}.hero-shade{position:absolute;inset:auto 0 0 0;height:54px;border-radius:0 0 10px 10px;background:linear-gradient(180deg,#0000,#000000c7);pointer-events:none}.hero-body{flex:1 1 340px;min-width:260px;display:flex;flex-direction:column}.hero-body>*{flex:0 0 auto;max-width:100%}.hero-head{display:flex;align-items:flex-start;gap:10px 12px;flex-wrap:wrap;margin:0 0 6px}.hero-title{font-size:21px;line-height:1.25;margin:0;flex:1 1 60%;min-width:0;overflow-wrap:anywhere}.hero-sub{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.badge-lang{background:var(--panel-2);border:1px solid var(--line);color:var(--muted);border-radius:6px;padding:1px 7px;font-size:11px;line-height:1.7}.hero-facts{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin:0 0 10px;color:var(--muted);font-size:12.5px;line-height:1.6;align-self:stretch}.hero-facts .fact{display:inline-flex;align-items:baseline;gap:4px}.hero-facts .fact-v{color:var(--fg);font-weight:600;font-variant-numeric:tabular-nums}.hero-synopsis{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.65;overflow-wrap:anywhere}@media (min-width: 901px){.hero-synopsis{max-height:168px;overflow:auto}}.detail-cta{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-top:4px}.btn-watch{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;padding:0 20px;font-size:16px;font-weight:700;border-radius:10px;background:var(--accent);border:1px solid var(--accent);color:#fff;font-family:inherit;cursor:pointer}.btn-watch:disabled{opacity:.5;cursor:default}.btn-watch-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:999px;background:#ffffff38;font-size:10px;line-height:1;padding-left:2px}.notice{background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--warn);padding:10px 12px;border-radius:8px;font-size:12.5px;color:var(--muted);line-height:1.6;margin-bottom:14px}.similar{margin-top:22px}.similar .grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.viewer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#000;display:flex;flex-direction:column;animation:viewer-in .22s ease-out}@supports (height: 100dvh){.viewer{height:100dvh}}@keyframes viewer-in{0%{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}.viewer .vwrap{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:pan-x}.viewer .vwrap video{width:100%;height:100%;max-height:100%;object-fit:contain;background:#000;display:block}.viewer .hls-wrap{position:absolute;top:0;right:0;bottom:0;left:0}.viewer .hls-error{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;color:#ffb4b4;font-size:13px;background:#000000b8}.viewer .hls-badge{position:absolute;top:8px;left:10px;font-size:10.5px;color:#d7d7d7;background:#0000008c;border-radius:6px;padding:2px 7px;letter-spacing:.3px;pointer-events:none}.viewer .vinfo{position:absolute;top:0;left:0;right:72px;padding:14px 16px;padding-top:max(14px,env(safe-area-inset-top));background:linear-gradient(180deg,#000000b8,#0000);pointer-events:none;cursor:default;opacity:0;transition:opacity .25s ease}.viewer .vinfo.on{opacity:1;pointer-events:auto}.viewer .vtitle{font-weight:700;font-size:17px;color:#fff;line-height:1.25;text-shadow:0 1px 3px rgba(0,0,0,.7);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer .vmeta{margin-top:2px;font-size:13px;color:var(--accent);font-variant-numeric:tabular-nums;text-shadow:0 1px 3px rgba(0,0,0,.7);display:flex;gap:10px;flex-wrap:wrap}.viewer .vtime{color:#ffffffb8}.viewer .vclose,.viewer .vepbtn{position:absolute;border:1px solid rgba(255,255,255,.24);background:#080a109e;color:#fff;font:inherit;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .25s ease}.viewer .vclose.on,.viewer .vepbtn.on{opacity:1;pointer-events:auto}.viewer .vclose:focus-visible,.viewer .vepbtn:focus-visible,.viewer .vsubbtn:focus-visible,.viewer .vephead .x:focus-visible{opacity:1;outline:2px solid var(--accent);outline-offset:2px}.viewer .vclose{top:max(10px,env(safe-area-inset-top));right:10px;width:44px;height:44px;border-radius:999px;font-size:18px;line-height:1}.viewer .vepbtn{right:10px;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;letter-spacing:.18em;font-size:12px;font-weight:600;padding:14px 10px;border-radius:999px;min-height:96px;box-sizing:border-box;min-width:44px}.viewer .vclose:hover,.viewer .vepbtn:hover{background:var(--accent);border-color:transparent}.viewer .vsub{position:absolute;right:10px;bottom:max(10px,env(safe-area-inset-bottom));z-index:3;display:flex;flex-direction:column;align-items:flex-end;gap:8px}.viewer .vsubbtn{width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.24);background:#080a109e;color:#fff;font:inherit;font-size:13px;font-weight:700;letter-spacing:.04em;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.viewer .vsub.on .vsubbtn{background:var(--accent);border-color:var(--accent);color:#fff}.viewer .vsubbtn:hover{background:var(--accent);border-color:transparent}.viewer .vsubpanel{width:min(280px,80vw);background:#0a0c12f2;border:1px solid var(--line);border-radius:10px;padding:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 12px 30px #00000080;display:flex;flex-direction:column;gap:10px}.viewer .vsubrow{display:flex;flex-direction:column;gap:6px;color:#fff;font-size:13px}.viewer .vsubrow select{width:100%;min-height:40px;padding:0 8px;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);color:var(--fg);font:inherit}.viewer .vsubrow select:disabled{opacity:.55}.viewer .vepdrawer{position:absolute;top:0;right:0;bottom:0;width:min(320px,82vw);background:var(--bg);border-left:1px solid var(--line);box-shadow:-12px 0 30px #00000080;transform:translate(100%);transition:transform .24s ease;display:flex;flex-direction:column;z-index:2}.viewer .vepdrawer.on{transform:none}.viewer .vephead{display:flex;align-items:center;justify-content:space-between;padding:14px;padding-top:max(14px,env(safe-area-inset-top));border-bottom:1px solid var(--line);font-weight:600}.viewer .vephead .x{width:40px;height:40px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--fg);font:inherit;cursor:pointer}.viewer .vephead .x:hover{border-color:var(--accent)}.viewer .vepgrid{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px;padding:14px;padding-bottom:max(14px,env(safe-area-inset-bottom));align-content:start}.viewer .epcell{min-height:48px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--fg);font:inherit;font-size:14px;font-weight:500;cursor:pointer;font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;justify-content:center;gap:2px}.viewer .epcell:hover{border-color:var(--accent-2)}.viewer .epcell.active{background:var(--accent);border-color:var(--accent);font-weight:700}.viewer .epcell.soft{color:var(--muted);border-style:dashed}.viewer .epcell .lock{font-size:9px}@media (max-width: 700px){.header{padding:10px 12px;gap:8px}.header-search{flex:1 1 60px;min-width:0;min-height:44px;padding:10px 12px}.header-search input{font-size:14px}.pick{flex:0 0 auto;width:140px;max-width:140px;min-height:44px;font-size:13px;padding:7px 6px}.main{padding:14px 12px 32px}.grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}.card .name{font-size:12px;min-height:31px}.playlet{padding:12px 12px 32px}.hero{gap:12px;padding:12px;border-radius:10px}.hero-media{width:116px}.hero-body{flex:1 1 150px;min-width:0}.hero-title{font-size:17px;line-height:1.3}.hero{display:grid;grid-template-columns:auto minmax(0,1fr)}.hero-body{display:contents}.hero-head,.hero-facts{grid-column:2}.hero-synopsis,.detail-cta{grid-column:1 / -1}.hero-synopsis{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}.hero-facts{gap:4px 12px;margin-bottom:8px}.detail-cta{align-self:stretch}.similar .grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}.viewer .vwrap{min-height:0;height:100dvh}.viewer .vwrap video{width:100%;height:100%;max-height:100vh;max-height:100dvh;aspect-ratio:auto;object-fit:contain}.viewer .vtitle{font-size:15.5px}.viewer .vepgrid{grid-template-columns:repeat(auto-fill,minmax(46px,1fr))}.viewer .vepbtn{padding:12px 8px;letter-spacing:.14em}.viewer .vsubpanel{width:min(260px,88vw)}}@media (orientation: landscape) and (max-height: 460px){.viewer .vepgrid{grid-template-columns:repeat(auto-fill,minmax(46px,1fr));padding:10px}.viewer .vephead{padding:8px 12px}}@media (max-width: 379px){.playlet .hero-media{width:92px}.playlet .hero{gap:10px;padding:10px}.similar .grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}}@media (max-width: 430px){.brand-penuh{display:none}.brand-singkat{display:inline}.brand{font-size:16px}.header{gap:8px;padding:10px}.header-search{padding:10px 8px;width:0;min-width:0;flex:1 1 0;overflow:hidden}.header-search input{width:100%;min-width:0}}@media (prefers-reduced-motion: reduce){.card,.viewer,.viewer .vepdrawer{transition:none;animation:none}}
