:root{--bg:#121214;--bg2:#1c1c20;--bg3:#26262c;--fg:#eaeaea;--muted:#9a9aa3;--accent:#e5a00d;--accent2:#f2c14e;--danger:#e0564a;--radius:10px}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-weight:600;margin:.4em 0}
h2{font-size:1.25rem;margin-top:1.6em}
button,select,input{font:inherit;border-radius:8px;border:1px solid #3a3a42;background:var(--bg3);color:var(--fg);padding:.45em .8em}
button{cursor:pointer}
button.primary{background:var(--accent);color:#111;border-color:var(--accent);font-weight:600}
button.danger{background:var(--danger);border-color:var(--danger);color:#fff}
button:disabled{opacity:.5;cursor:default}
.topnav{display:flex;align-items:center;gap:1.2em;padding:.6em 1.2em;background:var(--bg2);position:sticky;top:0;z-index:10;border-bottom:1px solid #2a2a30}
.brand{font-weight:700;color:var(--accent);font-size:1.1rem;white-space:nowrap}
.navlinks{display:flex;gap:1em;flex-wrap:wrap}
.navlinks a{color:var(--muted)}.navlinks a:hover,.navlinks a.active{color:var(--fg)}
.searchform{margin-left:auto}.searchform input{width:220px}
.navuser{display:flex;gap:1em;color:var(--muted);white-space:nowrap}
main{padding:1.2em 1.6em;max-width:1600px;margin:0 auto}
.loading{color:var(--muted);padding:2em}
.error{color:var(--danger)}
.muted{color:var(--muted)}
.authbox{max-width:380px;margin:12vh auto;background:var(--bg2);padding:2em;border-radius:var(--radius)}
.authbox label{display:block;margin:.8em 0 .3em}.authbox input{width:100%}.authbox button{width:100%;margin-top:1em;background:var(--accent);color:#111;font-weight:600}
.row{display:flex;gap:1em;align-items:center;flex-wrap:wrap}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1em}
.hscroll{display:flex;gap:1em;overflow-x:auto;padding-bottom:.6em;scroll-snap-type:x proximity}
.hscroll .card{flex:0 0 150px;scroll-snap-align:start}
.hscroll .card.wide{flex-basis:280px}
.card{position:relative;background:var(--bg2);border-radius:var(--radius);overflow:hidden;transition:transform .15s}
.card:hover{transform:scale(1.03)}
.card .poster{aspect-ratio:2/3;background:var(--bg3) center/cover no-repeat;display:flex;align-items:flex-end;justify-content:center;color:var(--muted);font-size:.85rem;text-align:center;padding:.5em}
.card.wide .poster{aspect-ratio:16/9}
.card .poster.empty span{opacity:.8}
.card .ctitle{padding:.5em .6em .1em;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .csub{padding:0 .6em .6em;font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .bar{position:absolute;left:0;right:0;height:4px;background:#0008}.card .bar i{display:block;height:100%;background:var(--accent)}
.card .watched{position:absolute;top:.4em;right:.4em;background:var(--accent);color:#111;border-radius:50%;width:1.4em;height:1.4em;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}
.hero{position:relative;border-radius:var(--radius);overflow:hidden;min-height:280px;background:var(--bg2) center/cover;margin-bottom:1.5em}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#121214f0 30%,#12121480 70%,#12121420)}
.hero .inner{position:relative;display:flex;gap:1.6em;padding:1.6em}
.hero .poster{width:200px;aspect-ratio:2/3;border-radius:8px;background:var(--bg3) center/cover;flex:none}
.hero .meta{flex:1;min-width:0}
.hero .meta p{max-width:800px}
.hero h1{font-size:1.9rem;margin:0 0 .2em}
.tags{display:flex;gap:.6em;flex-wrap:wrap;color:var(--muted);font-size:.9rem;margin:.4em 0 1em}
.tags span{background:#ffffff14;padding:.1em .6em;border-radius:6px}
.eplist{display:flex;flex-direction:column;gap:.6em}
.ep{display:flex;gap:1em;background:var(--bg2);border-radius:var(--radius);overflow:hidden;align-items:stretch}
.ep .thumb{width:220px;flex:none;aspect-ratio:16/9;background:var(--bg3) center/cover;position:relative}
.ep .body{padding:.7em 1em;flex:1;min-width:0}
.ep .body p{margin:.3em 0 0;color:var(--muted);font-size:.9rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ep .num{color:var(--accent);font-weight:600;margin-right:.5em}
.seasons{display:flex;gap:.6em;flex-wrap:wrap;margin:1em 0}
.seasons a{padding:.3em .9em;border-radius:20px;background:var(--bg3)}.seasons a.active{background:var(--accent);color:#111}
.toolbar{display:flex;gap:.8em;align-items:center;margin:1em 0;flex-wrap:wrap}
table{border-collapse:collapse;width:100%;margin:.6em 0}
th,td{text-align:left;padding:.5em .6em;border-bottom:1px solid #2a2a30;vertical-align:top}
th{color:var(--muted);font-weight:500;font-size:.85rem}
.settings section{background:var(--bg2);border-radius:var(--radius);padding:1em 1.4em;margin-bottom:1.4em}
.settings label{display:block;margin:.6em 0 .2em;color:var(--muted);font-size:.9rem}
.settings input,.settings select{min-width:280px}
.settings .hint{font-size:.85rem;color:var(--muted)}
.ok{color:#5ec269}.bad{color:var(--danger)}
.modal{position:fixed;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:50}
.modal .box{background:var(--bg2);padding:1.4em;border-radius:var(--radius);max-width:720px;width:92%;max-height:85vh;overflow:auto}
.cand{display:flex;gap:1em;padding:.6em 0;border-bottom:1px solid #2a2a30;cursor:pointer}.cand img{width:60px;border-radius:4px}.cand:hover{background:#ffffff08}
code{background:#ffffff14;padding:.1em .4em;border-radius:4px;font-size:.9em}
/* player */
body.playerbody{background:#000;overflow:hidden}
.player{position:fixed;inset:0;background:#000}
.player video{width:100%;height:100%;object-fit:contain;background:#000}
.player .overlay{position:absolute;left:0;right:0;padding:1em 1.4em;transition:opacity .3s;background:linear-gradient(#000c,#0000)}
.player .overlay.top{top:0;display:flex;align-items:center;gap:1.4em}
.player .overlay.bottom{bottom:0;background:linear-gradient(#0000,#000c)}
.player.idle .overlay{opacity:0;pointer-events:none}
.player.idle{cursor:none}
.ptitle{font-weight:600;font-size:1.1rem}.pmethod{margin-left:auto;color:var(--muted);font-size:.85rem}
.seekrow{display:flex;align-items:center;gap:.8em;font-variant-numeric:tabular-nums}
.seekrow input{flex:1;accent-color:var(--accent)}
.buttons{display:flex;gap:.6em;align-items:center;margin-top:.5em;flex-wrap:wrap}
.buttons .spacer{flex:1}
.buttons button{background:#ffffff1a;border-color:transparent}
.buttons select{background:#ffffff1a;border-color:transparent;max-width:200px}
.spinner{position:absolute;top:50%;left:50%;width:48px;height:48px;margin:-24px;border:4px solid #fff3;border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;display:none}
.player.buffering .spinner{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.perror{position:absolute;top:40%;left:50%;transform:translateX(-50%);background:var(--danger);padding:1em 1.4em;border-radius:8px}
video::cue{background:#000b;font-size:1.1em}
@media (max-width:700px){.hero .inner{flex-direction:column}.hero .poster{width:130px}.ep .thumb{width:130px}.searchform input{width:120px}main{padding:.8em}}
.brand{display:flex;align-items:center;gap:.45em}.brandlogo{width:28px;height:28px}
.authbox{text-align:center}.authbox form{text-align:left}.authlogo{width:96px;height:96px;filter:drop-shadow(0 0 18px #e5a00d55)}