*{box-sizing:border-box}
:root{--bg:#07080c;--panel:#11131a;--panel2:#171922;--text:#f7f8fb;--muted:#9da2b1;--line:rgba(255,255,255,.09);--accent:#ff6a00;--accent2:#ff8a3d}
html,body{margin:0;min-height:100%;background:radial-gradient(900px 500px at 50% -100px,rgba(255,106,0,.12),transparent 65%),var(--bg);color:var(--text);font:15px/1.45 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{padding-bottom:110px}.app-shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:20;height:68px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:rgba(7,8,12,.62);backdrop-filter:blur(22px) saturate(150%);border-bottom:1px solid rgba(255,255,255,.05)}
.brand{border:0;background:none;color:var(--text);display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px;padding:0;cursor:pointer}.brand em{font-style:normal;color:#9da2b1;font-weight:650}.brand-mark{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,var(--accent2),var(--accent));box-shadow:0 8px 30px rgba(255,106,0,.22)}
.icon-btn{width:40px;height:40px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;font-size:23px;cursor:pointer}
.page{max-width:1180px;margin:auto;padding:22px 18px 20px}.hero{min-height:390px;border:1px solid var(--line);border-radius:28px;overflow:hidden;position:relative;display:flex;align-items:flex-end;padding:28px;background:linear-gradient(90deg,rgba(5,6,9,.96) 0%,rgba(5,6,9,.74) 42%,rgba(5,6,9,.18) 100%),linear-gradient(135deg,#252735,#11131a 55%,#32180c)}
.hero:after{content:"";position:absolute;inset:auto -20% -55% 35%;height:340px;background:radial-gradient(circle,rgba(255,106,0,.22),transparent 65%);pointer-events:none}
.hero-content{position:relative;z-index:1;max-width:620px}.eyebrow{font-size:11px;letter-spacing:.16em;color:#b8bdc9;font-weight:800;text-transform:uppercase}.hero h1{font-size:clamp(32px,7vw,58px);line-height:1.02;margin:10px 0 12px;letter-spacing:-.04em}.hero p{color:#b8bdc9;max-width:600px;margin:0 0 18px}.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}.chip{border:1px solid var(--line);background:rgba(255,255,255,.07);padding:6px 10px;border-radius:999px;color:#dce0e8;font-size:12px}
.actions{display:flex;gap:10px;flex-wrap:wrap}.btn{border:0;border-radius:13px;padding:12px 16px;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;font-weight:800;cursor:pointer;box-shadow:0 10px 30px rgba(255,106,0,.18)}.btn.secondary{background:rgba(255,255,255,.08);border:1px solid var(--line);box-shadow:none}.btn.small{padding:9px 12px;font-size:13px}
.section{margin-top:30px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:13px}.section h2{font-size:21px;margin:0;letter-spacing:-.02em}.section-head span{font-size:12px;color:var(--muted)}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(155px,1fr);gap:13px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.rail::-webkit-scrollbar{display:none}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}@media(min-width:620px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(min-width:980px){.cards{grid-template-columns:repeat(6,minmax(0,1fr))}}
.card{min-width:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));cursor:pointer;transition:transform .18s ease,border-color .18s ease}.card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.18)}.poster{aspect-ratio:2/3;position:relative;background:linear-gradient(145deg,var(--c1,#252735),var(--c2,#0f1016));display:flex;align-items:flex-end;padding:12px}.poster:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.72))}.poster .poster-title{position:relative;font-weight:850;font-size:15px;line-height:1.05;text-shadow:0 2px 12px #000;max-width:90%}.card-body{padding:10px 11px 12px}.title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta{font-size:12px;color:var(--muted);margin-top:3px}.progress{height:4px;border-radius:999px;background:#30333d;margin-top:9px;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:999px}
.continue-card{display:grid;grid-template-columns:86px 1fr;gap:12px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.045)}.continue-poster{width:86px;aspect-ratio:2/3;border-radius:12px;background:linear-gradient(145deg,#343747,#11131a);display:flex;align-items:end;padding:8px;font-weight:800;font-size:12px}.continue-info .title{font-size:15px}.continue-info .meta{margin-top:5px}.continue-actions{margin-top:9px}
.search-wrap{display:flex;gap:10px;align-items:center}.search{width:100%;padding:15px 16px;border:1px solid var(--line);background:rgba(255,255,255,.055);color:#fff;border-radius:15px;font-size:16px;outline:none}.search:focus{border-color:rgba(255,106,0,.6);box-shadow:0 0 0 4px rgba(255,106,0,.08)}
.notice{padding:15px 16px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.04);color:#b9bec9}.notice strong{color:#fff}.notice a{color:#ff9a5d}
.list-panel{border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.04);padding:16px;margin-top:12px}.list-panel h3{margin:0}.empty{color:var(--muted);padding:18px 4px;text-align:center}
.detail{max-width:1000px;margin:auto}.detail-top{display:grid;grid-template-columns:170px 1fr;gap:20px;align-items:end}.detail-poster{aspect-ratio:2/3;border-radius:22px;background:linear-gradient(145deg,#2a2c3b,#11131a);padding:14px;display:flex;align-items:end;font-size:20px;font-weight:900}@media(max-width:600px){.detail-top{grid-template-columns:110px 1fr}.detail-poster{border-radius:17px;font-size:14px}.detail h1{font-size:28px}}.detail h1{margin:0 0 7px;font-size:38px;line-height:1.05}.back{margin-bottom:15px}.episode-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}@media(min-width:700px){.episode-grid{grid-template-columns:repeat(8,minmax(0,1fr))}}.episode{border:1px solid var(--line);background:rgba(255,255,255,.045);color:#fff;border-radius:12px;padding:11px 8px;cursor:pointer}.episode.active{border-color:rgba(255,106,0,.7);background:rgba(255,106,0,.12)}
.settings{display:grid;gap:10px}.setting{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:18px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:14px}.setting label{font-weight:750}.setting small{display:block;color:var(--muted);font-weight:500;margin-top:3px}.switch{width:48px;height:28px;appearance:none;border-radius:999px;background:#30333d;position:relative;outline:none;cursor:pointer}.switch:before{content:"";position:absolute;width:22px;height:22px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.switch:checked{background:var(--accent)}.switch:checked:before{transform:translateX(20px)}
.bottom-nav{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:30;width:min(620px,calc(100% - 24px));height:72px;display:grid;grid-template-columns:repeat(4,1fr);padding:6px;border:1px solid rgba(255,255,255,.12);border-radius:25px;background:rgba(17,19,26,.66);backdrop-filter:blur(24px) saturate(160%);box-shadow:0 18px 60px rgba(0,0,0,.38)}.bottom-nav button{border:0;background:transparent;color:#8f95a3;border-radius:19px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom-nav button.active{color:#fff;background:rgba(255,255,255,.08)}.bottom-nav button.active .nav-icon{color:var(--accent2)}.nav-icon{font-size:21px;line-height:1}.bottom-nav span:last-child{font-size:10px;font-weight:700}
.footer-space{height:10px}
@media(min-width:800px){body{padding-bottom:100px}.bottom-nav{bottom:20px}}
a{color:inherit;text-decoration:none}
