@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap');
:root {
  color-scheme: dark;
  --bg: #0b0e15;
  --bg-soft: #111620;
  --panel: #161b26;
  --border: #262b36;
  --text: #f9f5f0;
  --muted: #8f95a4;
  --subtle: #5e6473;
  --accent: #ff8a63;
  --accent-strong: #f87557;
  --font: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --display: 'Outfit', var(--font);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
input, textarea { color: var(--text); }
::selection { background: #ff8a6366; color: white; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.app-shell { min-height: 100vh; }
.sidebar { width: 242px; position: fixed; left: 0; top: 0; bottom: 0; background: #0d1119; border-right: 1px solid #20242f; display: flex; flex-direction: column; z-index: 20; }
.logo { height: 98px; display: flex; align-items: center; gap: 10px; padding: 0 26px; }
.logo-mark { width: 39px; height: 39px; display: inline-flex; align-items: center; justify-content: center; background: var(--accent); color: #17141a; font-family: var(--display); font-size: 27px; font-weight: 800; border-radius: 12px; letter-spacing: -3px; padding-right: 3px; padding-bottom: 7px; transform: rotate(-7deg); flex-shrink: 0; }
.logo-dot { margin-left: 1px; }
.logo-word { font-family: var(--display); font-size: 20px; font-weight: 800; letter-spacing: -.9px; white-space: nowrap; }
.logo-word span { font-weight: 400; color: #a6a6b0; }
.sidebar-scroll { padding: 21px 14px; overflow-y: auto; flex: 1; }
.nav-caption { padding: 0 15px; color: #646a77; letter-spacing: 2px; font-weight: 800; font-size: 10px; margin: 9px 0 13px; }
.nav-caption-second { margin-top: 37px; }
.nav { display: flex; flex-direction: column; gap: 5px; }
.nav-link { display: flex; align-items: center; gap: 13px; font-size: 13px; font-weight: 700; padding: 14px 14px; color: #9da3af; border-radius: 11px; transition: all .18s; }
.nav-link svg { width: 19px; height: 19px; stroke-width: 1.75; }
.nav-link:hover { color: white; background: #1a1e29; }
.nav-link.active { color: var(--accent); background: #31231f; }
.nav-count { margin-left: auto; padding: 2px 7px; border-radius: 50px; background: #262b36; color: #b5b9c4; font-size: 10px; }
.sidebar-feature { position: relative; background: linear-gradient(150deg,#282534,#1e1c29 75%); border: 1px solid #3b3340; border-radius: 16px; margin: 53px 5px 10px; padding: 19px 18px 20px; overflow: hidden; }
.sidebar-feature::after { content: ''; position: absolute; height: 130px; width: 130px; right: -75px; top: -55px; border-radius: 100%; background: #f2846125; }
.sidebar-feature-icon { color: var(--accent); height: 32px; }
.sidebar-feature-title { font-family: var(--display); font-weight: 700; letter-spacing: -.2px; font-size: 16px; margin-top: 9px; line-height: 1.4; }
.sidebar-feature p { color: #aaa3af; font-size: 11px; line-height: 1.7; margin: 10px 0 19px; }
.small-feature-link { color: var(--accent); font-weight: 800; font-size: 11px; }
.small-feature-link span { margin-left: 6px; }
.sidebar-bottom { border-top: 1px solid #222630; padding: 19px 25px; font-size: 10px; color: #828995; display: flex; align-items: center; gap: 8px; }
.online-dot, .seed-dot { width: 6px; height: 6px; border-radius: 50%; background: #73d6a7; display: inline-block; box-shadow: 0 0 9px #73d6a744; }
.version { margin-left: auto; color: #565c6a; }
.workspace { margin-left: 242px; min-width: 0; min-height: 100vh; display: flex; flex-direction: column; }
.topbar { height: 98px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(25px, 4.1vw, 70px); gap: 30px; }
.mobile-brand { display: none; }
.search-box { width: min(430px,55vw); height: 46px; background: #151a24; border: 1px solid #262a36; display: flex; align-items: center; gap: 12px; padding: 0 16px; border-radius: 11px; color: #7e8593; transition: border-color .2s; }
.search-box:focus-within { border-color: #aa675c; }
.search-box svg { width: 18px; height: 18px; flex-shrink: 0; }
.search-box input { background: none; border: 0; outline: none; min-width: 0; width: 100%; font-size: 12px; }
.search-box input::placeholder { color: #828792; }
.search-box kbd { font-size: 11px; color: #838995; border: 1px solid #353a47; min-width: 22px; text-align: center; padding: 2px; border-radius: 5px; }
.top-actions { display: flex; align-items: center; gap: 16px; }
.icon-button { width: 42px; height: 42px; border: 1px solid #2b303b; background: #161a23; border-radius: 12px; display: grid; place-items: center; color: #b9bdc7; transition: all .2s; }
.icon-button:hover { color: white; border-color: var(--accent); }
.install-button { height: 42px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid #5a3a31; background: #2a1f1d; color: var(--accent); border-radius: 12px; font-size: 12px; font-weight: 800; transition: all .2s; }
.install-button:hover { background: #3d2a27; border-color: var(--accent); }
.install-button[hidden] { display: none; }
.install-button svg { width: 18px; height: 18px; }
.profile-button { width: 40px; height: 40px; background: #f9bc91; border: 3px solid #42352f; border-radius: 50%; font-weight: 800; color: #542f24; }
.main { width: 100%; flex: 1; padding: 10px clamp(25px, 4.1vw, 70px) 72px; }
.home-view { display: flex; flex-direction: column; gap: 40px; }
.welcome-line { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: -14px; color: #b0a7a4; letter-spacing: 2px; font-size: 10px; font-weight: 800; }
.welcome-line span:last-child { color: #5f6571; }
.welcome-sun { color: var(--accent); font-size: 17px; margin-left: 5px; }
.hero { min-height: 398px; border-radius: 18px; position: relative; overflow: hidden; isolation: isolate; background: #1f2330; display: flex; align-items: end; }
.hero-image { position: absolute; inset: 0; height: 100%; width: 100%; object-fit: cover; object-position: center 33%; z-index: -3; opacity: .86; }
.hero-wash { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11,14,21,.97) 0%,rgba(11,14,21,.82) 32%,rgba(11,14,21,.33) 69%,rgba(11,14,21,.1) 100%),linear-gradient(0deg, rgba(11,14,21,.7),transparent 60%); }
.hero-content { padding: clamp(29px, 4vw, 57px); width: min(680px, 82%); position: relative; z-index: 2; }
.hero-label { color: #ffa57f; letter-spacing: 1.8px; font-weight: 800; font-size: 10px; display: inline-flex; align-items: center; gap: 9px; margin-bottom: 13px; }
.hero h1 { font-size: clamp(30px, 3.4vw, 49px); font-family: var(--display); font-weight: 800; line-height: 1.08; max-width: 540px; letter-spacing: -1.5px; margin: 0 0 15px; text-wrap: balance; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 15px; align-items: center; color: #e5e2e1; font-size: 12px; font-weight: 700; }
.hero-meta span:first-child { display: flex; align-items: center; gap: 5px; color: #ffc08e; }
.hero p { color: #d4d0d0; max-width: 470px; font-size: 12px; line-height: 1.9; margin: 16px 0 21px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.btn { border: 1px solid transparent; border-radius: 10px; display: inline-flex; justify-content: center; align-items: center; gap: 9px; padding: 13px 19px; font-size: 12px; font-weight: 800; transition: .18s ease; white-space: nowrap; }
.btn-primary { color: #1f1513; background: var(--accent); }
.btn-primary:hover { background: #ffab82; box-shadow: 0 7px 18px #fa89652b; }
.btn-secondary { color: #f4eee9; background: #ffffff18; border-color: #ffffff30; backdrop-filter: blur(12px); }
.btn-secondary:hover { background: #ffffff29; }
.btn-outline { border-color: #353947; background: #242833; color: var(--text); }
.btn-outline:hover { border-color: var(--accent); }
.hero-buttons { display: flex; align-items: center; gap: 10px; }
.hero-index { position: absolute; bottom: 23px; right: 26px; color: #ece9e7aa; font-size: 9px; font-weight: 700; letter-spacing: 2px; }
.media-section { min-width: 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 19px; gap: 15px; }
.eyebrow { color: var(--accent); font-size: 10px; letter-spacing: 2.1px; font-weight: 800; line-height: 1.5; }
.section-heading h2 { font-family: var(--display); font-size: 25px; letter-spacing: -.8px; font-weight: 700; margin: 5px 0 0; }
.rail-controls { display: flex; align-items: center; gap: 7px; }
.rail-controls button { color: #b8bdc9; border: 1px solid #2c303d; width: 30px; height: 30px; border-radius: 8px; background: #161a24; font-size: 22px; line-height: 1; }
.rail-controls button:hover { color: var(--accent); }
.anime-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(148px, 1fr); gap: 17px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.anime-rail::-webkit-scrollbar { display: none; }
.anime-rail .anime-card { min-width: 0; scroll-snap-align: start; }
.anime-rail .anime-card:nth-child(n+7) { display: none; }
.anime-card { min-width: 0; display: block; transition: transform .2s; }
.anime-card:hover { transform: translateY(-4px); }
.poster { position: relative; background: #272a36; aspect-ratio: .74; border-radius: 11px; overflow: hidden; border: 1px solid #222630; }
.poster img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.anime-card:hover img { transform: scale(1.06); }
.poster::after { content: ''; position: absolute; inset: 50% 0 0; background: linear-gradient(transparent,#13141d5c); pointer-events: none; }
.poster-score { position: absolute; display: flex; align-items: center; gap: 5px; right: 9px; bottom: 9px; color: #fbe2bc; background: #161721dc; padding: 6px 9px; border-radius: 7px; font-size: 11px; font-weight: 700; z-index: 1; backdrop-filter: blur(6px); }
.poster-score svg { fill: #f5c078; stroke: #f5c078; }
.anime-card h3 { font-family: var(--display); margin: 11px 0 4px; font-weight: 600; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.anime-card p { color: #8f95a1; font-size: 11px; margin: 0; text-transform: capitalize; }
.dot-separator { margin: 0 4px; color: #616775; }
.page-heading { margin: 23px 0 36px; }
.page-heading h1 { font-family: var(--display); font-size: clamp(32px,4.1vw,50px); margin: 7px 0 10px; letter-spacing: -1.5px; }
.page-heading p { color: var(--muted); font-size: 13px; margin: 0; }
.collection-head { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); margin: 0 0 17px; }
.collection-filter { display: flex; align-items: center; gap: 9px; font-weight: 800; font-size: 10px; letter-spacing: 1px; }
.anime-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(152px,1fr)); gap: 32px 19px; }
.detail-view { margin: -10px calc(-1 * clamp(25px, 4.1vw, 70px)) 0; }
.detail-backdrop { position: absolute; top: 98px; left: 242px; right: 0; height: 505px; pointer-events: none; overflow: hidden; z-index: -1; }
.detail-backdrop img { width: 100%; height: 100%; object-fit: cover; opacity: .33; filter: blur(3px); }
.detail-backdrop div { position: absolute; inset: 0; background: linear-gradient(0deg,var(--bg) 0%,#0b0e1588 28%,#0b0e1544 100%),linear-gradient(90deg,#0b0e15ee,transparent); }
.detail-top { padding: 12px clamp(25px, 4.1vw, 70px) 45px; }
.back-link { color: #afb1bd; font-size: 12px; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.back-link:hover { color: var(--accent); }
.detail-main { display: flex; align-items: end; gap: clamp(25px,4vw,52px); margin-top: 53px; }
.detail-poster { flex: 0 0 220px; width: 220px; aspect-ratio: .7; border: 4px solid #ffffff17; border-radius: 15px; overflow: hidden; box-shadow: 0 25px 60px #0006; background: var(--panel); }
.detail-poster img { display:block; width:100%; height:100%; object-fit:cover; }
.detail-info { flex: 1; min-width: 0; padding-bottom: 2px; }
.detail-info .eyebrow span { color: #858995; margin: 0 5px; }
.detail-info h1 { font-family:var(--display); font-size:clamp(32px,4vw,53px); font-weight:800; line-height:1.08; letter-spacing:-1.8px; margin:10px 0; max-width:800px; text-wrap:balance; }
.alt-title { color:#c9c1bc; font-size:13px; margin-bottom:13px; }
.detail-stats { display:flex; align-items:center; flex-wrap:wrap; gap:15px; font-size:12px; font-weight:700; color:#ceccd0; margin:15px 0; }
.detail-stats .rating { display:flex; align-items:center; gap:6px; color:#ffcc89; font-size:15px; }
.detail-stats .rating svg { fill:#ffc07a; stroke:#ffc07a; }
.detail-stats small { font-weight:500; color:#979ba4; }
.tag-row { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.tag { color:#c8c5ca; font-size:11px; font-weight:700; border-radius:6px; background:#252734b5; border:1px solid #3c3b48; padding:6px 10px; }
.synopsis { line-height:1.85; font-size:12px; color:#c5c3ca; max-width:760px; max-height:123px; overflow:auto; margin:17px 0 23px; }
.detail-actions { display:flex; gap:10px; align-items:center; }
.episode-area,.source-area { padding:34px clamp(25px,4.1vw,70px) 18px; }
.episode-area { background: #0f131c; border-top:1px solid #272b36; }
.source-area { scroll-margin-top:10px; padding-top:39px; }
.episode-hint { color:var(--muted); font-size:12px; margin:-3px 0 22px; }
.episode-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(84px,1fr)); gap:11px; }
.episode-button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:13px 7px; color:#dadce2; background:#1a1f2a; border:1px solid #2d3240; border-radius:11px; transition:.17s; }
.episode-button span { color:#888e9f; font-size:9px; letter-spacing:1.3px; font-weight:800; }
.episode-button strong { font-family:var(--display); font-size:24px; font-weight:600; }
.episode-button:hover,.episode-button.selected { background:#3d2a27; border-color:#fb8a67; color:#ffaf8c; }
.episode-button.selected span { color:#ffa482; }
.show-all { border:0; background:transparent; color:var(--accent); padding:15px 0; font-size:12px; font-weight:800; }
.custom-episode { border-top:1px solid #2b2d39; margin-top:23px; padding-top:19px; display:flex; flex-wrap:wrap; align-items:center; gap:12px; font-size:12px; color:#aaaebb; }
.custom-episode input,.episode-custom-label input { background:#1e2330; border:1px solid #373c49; border-radius:8px; padding:12px; width:90px; font-weight:700; }
.custom-episode .btn { padding:12px 15px; }
.episode-custom-label { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; }
.source-state { color:#9f8790; letter-spacing:1px; font-weight:800; font-size:11px; }
.source-intro { border:1px dashed #323746; background:#121722; color:#8992a1; padding:49px 20px; border-radius:16px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; font-size:12px; }
.source-intro svg { color:var(--accent); }
.source-intro strong { color:#f0ede9; font-family:var(--display); font-size:17px; }
.release-search { display:flex; flex-direction:column; gap:7px; margin:14px 0 19px; }
.release-search form { border:1px solid #2e3340; background:#181d28; height:53px; border-radius:12px; display:flex; align-items:center; gap:12px; padding:5px 5px 5px 16px; color:#a6acb8; }
.release-search input { border:0; background:none; outline:0; flex:1; min-width:0; font-size:12px; }
.release-search .btn { padding:12px 19px; }
.release-search p { margin:0; font-size:11px; color:#848996; }
.release-table { background:#151a24; border:1px solid #292e3a; border-radius:14px; overflow:hidden; }
.release-table-head { display:grid; grid-template-columns:minmax(0,1fr) 90px 75px 74px; padding:16px 21px; gap:13px; font-size:9px; font-weight:800; color:#747c8c; letter-spacing:1.2px; border-bottom:1px solid #313540; }
.release-row { display:grid; grid-template-columns:minmax(0,1fr) 90px 75px 74px; gap:13px; align-items:center; padding:18px 21px; border-bottom:1px solid #272c39; }
.release-row:last-child { border:0; }
.release-row:hover { background:#1b202b; }
.release-name { min-width:0; }
.release-title { color:#dddfe8; font-weight:700; line-height:1.5; font-size:12px; overflow-wrap:anywhere; }
.release-labels { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:8px; }
.release-labels > span { font-weight:800; border-radius:4px; font-size:9px; padding:4px 6px; white-space:nowrap; }
.mini-quality { color:#96c9f6; background:#243447; }
.mini-match { color:#78d8a6; background:#1b3a30; }
.mini-warning { color:#d6b07d; background:#393126; }
.mini-trusted { color:#cea1eb; background:#32263d; }
.release-labels a { font-size:10px; color:#949cad; display:inline-flex; align-items:center; gap:4px; }
.release-labels a:hover { color:var(--accent); }
.release-size,.release-seeds { color:#abb1be; font-size:11px; font-weight:700; }
.release-seeds { color:#8cd6a4; display:flex; align-items:center; gap:7px; }
.release-play { background:#4c332e; border:1px solid #785044; padding:11px 9px; border-radius:9px; color:#ffa07b; display:flex; align-items:center; justify-content:center; gap:6px; font-size:11px; font-weight:800; }
.release-play:hover { background:#70453a; }
.legal-note { color:#767d8a; display:flex; align-items:flex-start; gap:8px; font-size:11px; line-height:1.6; margin:22px 0; }
.legal-note svg { flex-shrink:0; }
.page-loading,.initial-loading,.releases-loading { min-height:380px; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:13px; color:#8f95a3; text-align:center; font-size:12px; }
.releases-loading { min-height:185px; }
.releases-loading strong { font-size:14px; color:white; }
.releases-loading p,.page-loading p { margin:0; }
.page-loading h2 { color:#f2f0f2; font-family:var(--display); font-size:22px; margin:0; }
.spinner { width:27px; height:27px; border-radius:50%; border:3px solid #3f3540; border-top-color:var(--accent); animation:spin .85s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.empty-state { margin:50px 0; min-height:265px; padding:35px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px dashed #353a48; background:linear-gradient(180deg,#171b25,#11141e); border-radius:19px; }
.empty-symbol { color:var(--accent); }
.empty-state h2 { font-family:var(--display); font-size:23px; letter-spacing:-.5px; margin:15px 0 5px; }
.empty-state p { color:#949cab; font-size:12px; max-width:420px; line-height:1.7; }
.empty-state .btn { margin-top:13px; }
.mini-best { color:#1f1513; background:var(--accent); }
.mini-codec { color:#b9bfcc; background:#2a2f3b; }
.release-row.best { background:#1f1a1c; box-shadow:inset 3px 0 0 var(--accent); }
.episode-button { position:relative; overflow:hidden; }
.episode-button.upcoming { opacity:.45; cursor:not-allowed; }
.episode-button.upcoming:hover { background:#1a1f2a; border-color:#2d3240; color:#dadce2; }
.episode-progress { position:absolute; left:0; bottom:0; height:3px; background:var(--accent); }
.episode-pages { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.episode-pages button { background:#1a1f2a; border:1px solid #2d3240; color:#aeb3bf; border-radius:8px; padding:8px 12px; font-size:11px; font-weight:800; }
.episode-pages button.active,.episode-pages button:hover { border-color:var(--accent); color:var(--accent); }
.watch-actions { display:flex; gap:10px; align-items:center; }
.watch-actions .btn { padding:10px 13px; font-size:11px; }
.watch-releases { margin-bottom:34px; }
.player-shell { position:relative; width:100%; height:100%; background:#000; color:#fff; }
.player-shell video { width:100%; height:100%; display:block; background:#000; object-fit:contain; cursor:pointer; }
.player-shell:fullscreen { border-radius:0; }
.subtitle-layer { position:absolute; left:6%; right:6%; bottom:13%; text-align:center; pointer-events:none; font-size:clamp(15px,2.6vw,34px); line-height:1.35; font-weight:700; transition:bottom .2s; }
.player-shell.idle .subtitle-layer { bottom:7%; }
.subtitle-layer span { display:inline; padding:.08em .35em; background:#000a; border-radius:4px; box-decoration-break:clone; -webkit-box-decoration-break:clone; text-shadow:0 1px 3px #000; }
.player-status { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; font-size:13px; color:#d9dce3; background:#0008; pointer-events:none; text-align:center; padding:20px; }
.player-status[hidden] { display:none; }
.player-controls { position:absolute; left:0; right:0; bottom:0; padding:28px 16px 10px; background:linear-gradient(transparent,#000c); transition:opacity .25s; }
.player-shell.idle .player-controls { opacity:0; }
.player-shell.idle { cursor:none; }
.control-row { display:flex; align-items:center; gap:10px; }
.control-spacer { flex:1; }
.control-button { background:none; border:0; color:#fff; width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; }
.control-button:hover { background:#ffffff1f; color:var(--accent); }
.player-time { font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; color:#e9eaee; }
.control-select { display:inline-flex; align-items:center; gap:6px; color:#d7d9df; }
.control-select[hidden] { display:none; }
.control-select select { background:#1b1f29e6; color:#f2f2f4; border:1px solid #3a3f4c; border-radius:7px; padding:6px 8px; font-size:11px; max-width:170px; }
.seek-bar,.volume-bar { -webkit-appearance:none; appearance:none; background:transparent; cursor:pointer; margin:0; }
.seek-bar { width:100%; height:16px; display:block; margin-bottom:4px; --pct:0%; }
.volume-bar { width:80px; height:16px; }
.seek-bar::-webkit-slider-runnable-track { height:4px; border-radius:4px; background:linear-gradient(90deg,var(--accent) var(--pct),#ffffff40 var(--pct)); }
.volume-bar::-webkit-slider-runnable-track { height:4px; border-radius:4px; background:#ffffff55; }
.seek-bar::-moz-range-track,.volume-bar::-moz-range-track { height:4px; border-radius:4px; background:#ffffff40; }
.seek-bar::-moz-range-progress,.volume-bar::-moz-range-progress { height:4px; border-radius:4px; background:var(--accent); }
.seek-bar::-webkit-slider-thumb,.volume-bar::-webkit-slider-thumb { -webkit-appearance:none; width:13px; height:13px; margin-top:-4.5px; border-radius:50%; background:#fff; border:0; }
.seek-bar::-moz-range-thumb,.volume-bar::-moz-range-thumb { width:13px; height:13px; border-radius:50%; background:#fff; border:0; }
.watch-view { padding-top:17px; }
.watch-nav { display:flex; justify-content:space-between; align-items:center; margin-bottom:38px; }
.stop-button { color:#ed9b90; background:#34252b; border:1px solid #644048; border-radius:9px; padding:10px 13px; display:flex; align-items:center; gap:6px; font-size:11px; font-weight:800; }
.stop-button:hover { background:#62333a; }
.watch-view h1 { font-size:clamp(25px,3.3vw,42px); font-family:var(--display); letter-spacing:-1.2px; margin:6px 0 5px; }
.watch-subtitle { color:#a4abb5; font-size:12px; margin:0 0 24px; }
.player-wrap { aspect-ratio:16/9; background:#050609; border:1px solid #30343c; border-radius:16px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.player-wrap video { width:100%; height:100%; display:block; background:#000; }
.external-player { text-align:center; display:flex; align-items:center; flex-direction:column; justify-content:center; padding:28px; max-width:540px; }
.external-player > div { color:var(--accent); }
.external-player h2 { font-size:clamp(18px,2vw,27px); font-family:var(--display); margin:10px 0; }
.external-player p { font-size:12px; color:#a0a6b2; line-height:1.8; }
.external-player .btn { margin-top:12px; }
.stream-panel { background:#171b26; border:1px solid #2a2f3c; border-radius:12px; margin:18px 0 34px; padding:19px 22px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.stream-panel strong { font-family:var(--display); font-size:14px; }
.stream-panel p { color:#878e9b; font-size:11px; margin:4px 0 0; }
.stat-line { display:flex; gap:26px; }
.stat-line > div { text-align:right; display:flex; flex-direction:column; gap:3px; }
.stat-line strong { color:#f7f4f3; font-size:15px; }
.stat-line span { font-size:10px; color:#9298a6; }
.files-heading { display:flex; justify-content:space-between; align-items:center; margin:15px 0; }
.files-heading h2 { font-family:var(--display); font-size:23px; margin:4px 0; }
.files-heading > span { font-size:11px; color:#9298a6; }
.file-list { border:1px solid #2c3040; border-radius:12px; overflow:hidden; }
.file-option { display:flex; gap:14px; align-items:center; padding:15px 19px; background:#171b26; width:100%; border:0; border-bottom:1px solid #292d39; text-align:left; color:#c7ccd5; }
.file-option:last-child { border:0; }
.file-option:hover,.file-option.active { background:#29252d; color:var(--accent); }
.file-name { min-width:0; flex:1; overflow-wrap:anywhere; font-size:12px; font-weight:700; }
.file-option small { color:#9ba2ad; white-space:nowrap; }
.playing-chip { color:#ffb38f; font-size:9px; font-weight:800; letter-spacing:1px; }
.recent-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; }
.recent-item { display:flex; gap:16px; align-items:center; background:#171c25; border:1px solid #2a2f3b; border-radius:12px; padding:14px; min-width:0; }
.recent-item img { width:68px; height:96px; object-fit:cover; border-radius:8px; background:#272c36; }
.recent-item > div { flex:1; min-width:0; }
.recent-item h3 { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:0 0 10px; }
.recent-item p { font-size:11px; color:#9aa1af; }
.recent-item > svg { color:#858b99; }
.progress-track { height:4px; background:#393845; border-radius:4px; overflow:hidden; }
.progress-track span { height:100%; display:block; border-radius:4px; background:var(--accent); }
.footer { border-top:1px solid #242834; display:flex; gap:18px; justify-content:space-between; align-items:center; flex-wrap:wrap; padding:22px clamp(25px,4.1vw,70px); font-size:10px; color:#6f7581; }
.mobile-nav { display:none; }
.toast { position:fixed; bottom:24px; right:24px; padding:14px 20px; color:#f9f7f3; background:#283a35; border:1px solid #3c6b5d; border-radius:11px; box-shadow:0 14px 43px #0008; font-size:12px; font-weight:700; max-width:390px; opacity:0; transform:translateY(25px); pointer-events:none; z-index:90; transition:.23s ease; }
.toast.show { opacity:1; transform:translateY(0); }
.toast.error { background:#422b30; border-color:#a75056; }
.dialog { width:min(480px,calc(100vw - 30px)); background:#1a1e29; color:#f4f1ed; padding:24px; border:1px solid #49434b; box-shadow:0 30px 120px #000c; border-radius:19px; }
.dialog::backdrop { background:#070910d4; backdrop-filter:blur(5px); }
.dialog-header { display:flex; justify-content:space-between; align-items:center; }
.dialog-header strong { font-family:var(--display); font-size:22px; }
.dialog-header .icon-button { width:32px; height:32px; }
.dialog p { font-size:12px; line-height:1.8; color:#a6adba; margin:13px 0 22px; }
.dialog-form { display:flex; flex-direction:column; gap:9px; }
.dialog-form label { font-size:11px; font-weight:800; color:#f2e9e5; }
.dialog-form textarea { width:100%; resize:vertical; min-height:105px; border-radius:9px; border:1px solid #474b59; background:#11151e; padding:11px; font-size:12px; }
.dialog-form .btn { margin-top:9px; }
@media (min-width:1600px) {
  .anime-rail { grid-auto-columns:minmax(160px,1fr); }
  .anime-rail .anime-card:nth-child(n+8) { display:none; }
}
@media (min-width:1150px) and (max-width:1599px) {
  .anime-rail { grid-auto-columns:minmax(137px,1fr); }
}
@media (max-width:1150px) {
  .sidebar { width:204px; }
  .workspace { margin-left:204px; }
  .detail-backdrop { left:204px; }
  .logo { padding:0 14px; }
  .logo-word { font-size:18px; }
  .anime-rail { grid-auto-columns: minmax(147px,1fr); }
  .anime-rail .anime-card:nth-child(n+5) { display:none; }
  .detail-poster { flex-basis:175px; width:175px; }
}
@media (max-width:780px) {
  .sidebar { width:70px; }
  .workspace { margin-left:70px; }
  .detail-backdrop { left:70px; }
  .sidebar .logo { justify-content:center; padding:0; }
  .sidebar .logo-word,.nav-caption,.sidebar-feature,.sidebar-bottom,.nav-count { display:none; }
  .sidebar-scroll { padding:0 10px; }
  .nav-link { justify-content:center; font-size:0; padding:15px; }
  .nav-link svg { width:22px; height:22px; }
  .nav { margin:15px 0 34px; }
  .topbar { height:80px; }
  .hero { min-height:375px; }
  .detail-backdrop { top:80px; }
  .detail-main { align-items:start; }
  .detail-poster { flex-basis:140px; width:140px; }
  .detail-info h1 { font-size:32px; }
}
@media (max-width:600px) {
  .sidebar { display:none; }
  .workspace { margin-left:0; }
  .topbar { padding:15px 17px; height:auto; flex-wrap:wrap; gap:16px; }
  .mobile-brand { display:flex; align-items:center; gap:8px; }
  .mobile-brand .logo-mark { width:31px; height:31px; border-radius:9px; font-size:22px; padding-bottom:5px; }
  .mobile-brand .logo-word { font-size:17px; }
  .search-box { width:100%; flex:1 0 100%; order:2; height:43px; }
  .top-actions { margin-left:auto; gap:9px; }
  .top-actions .icon-button,.profile-button { width:35px; height:35px; }
  .install-button { height:35px; padding:0 9px; }
  .install-label { display:none; }
  .main { padding:13px 17px 56px; }
  .home-view { gap:34px; }
  .welcome-line { font-size:9px; }
  .welcome-line span:last-child { display:none; }
  .hero { min-height:430px; border-radius:14px; }
  .hero-content { width:100%; padding:25px 23px; }
  .hero-image { object-position:center; }
  .hero-wash { background:linear-gradient(0deg,#0b0e15f7 0%,#0b0e15e8 35%,#0b0e1555 100%); }
  .hero h1 { font-size:34px; }
  .hero p { font-size:11px; }
  .hero-index { display:none; }
  .section-heading h2 { font-size:22px; }
  .anime-rail { grid-auto-columns: 144px; gap:13px; margin-right:-17px; padding-right:17px; }
  .anime-rail .anime-card:nth-child(n+5) { display:block; }
  .anime-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap:26px 14px; }
  .detail-view { margin:-13px -17px 0; }
  .detail-backdrop { top:126px; left:0; height:440px; }
  .detail-top { padding:14px 18px 35px; }
  .detail-main { display:block; margin-top:39px; }
  .detail-poster { float:left; width:113px; height:164px; margin:0 18px 15px 0; }
  .detail-info h1 { font-size:27px; letter-spacing:-.8px; }
  .detail-info .eyebrow { font-size:9px; }
  .detail-stats { gap:8px; font-size:11px; }
  .detail-stats .rating { font-size:12px; }
  .tag-row { gap:5px; }
  .tag { font-size:10px; padding:5px; }
  .synopsis { clear:both; max-height:170px; padding-top:10px; }
  .detail-actions { clear:both; }
  .episode-area,.source-area { padding:30px 18px 15px; }
  .episode-grid { grid-template-columns:repeat(4,1fr); gap:8px; }
  .source-state { font-size:9px; }
  .release-table-head { display:none; }
  .release-row { grid-template-columns:minmax(0,1fr) auto; padding:14px; gap:10px; }
  .release-name { grid-column:1/3; }
  .release-size { grid-column:1; }
  .release-seeds { grid-row:2; grid-column:2; }
  .release-play { grid-row:3; grid-column:1/3; }
  .release-search form { height:50px; }
  .release-search .btn { padding:11px 13px; }
  .watch-nav { margin-bottom:24px; }
  .player-wrap { border-radius:10px; }
  .stream-panel { flex-direction:column; align-items:stretch; }
  .stat-line { justify-content:space-between; }
  .stat-line > div { text-align:left; }
  .footer { padding:23px 17px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.001s!important; transition-duration:.001s!important; } }

.stream-overlay[hidden] { display:none; }
.stream-overlay { position:fixed; inset:0; z-index:80; display:flex; justify-content:center; align-items:center; background:#070910d9; backdrop-filter:blur(9px); padding:20px; }
.stream-overlay-card { background:#1b202b; border:1px solid #5b4440; box-shadow:0 20px 90px #000a; border-radius:19px; padding:34px; max-width:400px; width:100%; text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px; }
.stream-overlay-card h2 { font-family:var(--display); margin:4px 0 0; font-size:24px; }
.stream-overlay-card p { font-size:12px; color:#9aa2ad; line-height:1.8; margin:0; }

@media (max-width:600px) {
  .mobile-nav { display:flex; position:fixed; z-index:48; left:0; right:0; bottom:0; height:70px; background:#11151ff2; border-top:1px solid #35323b; justify-content:space-around; align-items:center; backdrop-filter:blur(18px); padding-bottom:env(safe-area-inset-bottom); }
  .mobile-nav a { color:#a5a8b4; flex:1; height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:3px; }
  .mobile-nav a:active,.mobile-nav a:hover { color:var(--accent); }
  .mobile-nav svg { width:20px; height:20px; }
  .mobile-nav small { font-size:9px; font-weight:800; }
  .workspace { padding-bottom:70px; }
  .toast { bottom:85px; right:12px; left:12px; }
}
@media (max-width:600px) {
  .volume-bar,.player-time { display:none; }
  .control-select select { max-width:110px; }
  .watch-nav { flex-wrap:wrap; gap:10px; }
}