@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
:root{--primary:#9300e2;--primary-light:#a33bff;--primary-dark:#7a00c7;--text-light:#fff;--text-dim:#b0b0b0;--error:#dc2626;--transition:0.3s}
*{margin:0;padding:0;box-sizing:border-box}
body{background:#0e0e0e;font-family:Poppins;min-height:100vh;overflow-x:hidden}
a{text-decoration:none!important;color:inherit}
.search-container .fa-search{cursor:pointer}
.profile-avatar{width:39px;height:39px;border-radius:100%;overflow:hidden;cursor:pointer;border:2px solid rgba(147,0,226,0.4);transition:all var(--transition);box-shadow:0 3px 10px rgba(0,0,0,0.2)}
.profile-avatar:hover{transform:scale(1.1)}
.profile-avatar img{width:100%;height:100%;object-fit:cover}
.menu-trigger i{transition:all var(--transition);font-size:16px;line-height:1}
.anime-logo{width:120px;height:auto}
.menu.active{opacity:1;transform:translateY(0);pointer-events:auto}
.menu-item:hover{color:#ccc}
.menu-item i{font-size:12px;color:#bec4cc}
.menu-section{margin:10px 0}
.menu-section h3{color:#6f7a88;font-size:12px;text-transform:uppercase;margin-bottom:5px;margin-top:25px}
.search-container i{color:#b33bff}
.search-container:focus-within{border-color:#9300e2;box-shadow:0 0 0 2px rgba(147,0,226,0.3)}
.search-input{background:transparent;border:none;color:#fff;outline:none;width:100%;margin-left:10px;font-weight:500}
.search-input::placeholder{color:rgba(255,255,255,0.6)}
.search-suggestions{position:absolute;top:calc(100% + 20px);left:0;right:0;background:rgba(26,26,26,.9);backdrop-filter:blur(10px);border-radius:10px;box-shadow:0 5px 20px rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.1);overflow:hidden;z-index:10;max-height:400px;overflow-y:auto;animation:.2s ease-out fadeIn;display:none}
.upcoming-badge{position:absolute;top:8px;left:8px;background:linear-gradient(135deg,#9300e2,#7a00c7);color:#fff;font-size:.7em;font-weight:700;padding:4px 8px;border-radius:4px;z-index:2;text-transform:uppercase;letter-spacing:.6px;box-shadow:0 2px 6px rgba(147,0,226,.3);}
.release-date-tag{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.75);color:#fff;font-size:.65em;padding:3px 7px;border-radius:4px;z-index:2;font-weight:500;}
.search-suggestions.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(-10px) scale(0.95)}to{opacity:1;transform:translateY(0) scale(1)}}
.suggestion-item{padding:12px 15px;background:rgba(29,27,26,0.1);cursor:pointer;display:flex;align-items:center;transition:all .2s ease}
.suggestion-item:hover{background:rgba(147,0,226,0.15)}
.suggestion-item:not(:last-child){border-bottom:1px solid rgba(255,255,255,0.05)}
.suggestion-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;margin-right:12px;color:#9300e2}
.suggestion-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;color:#fff}
.suggestion-type{font-size:12px;color:#a0aec0;margin-left:8px;padding:2px 6px;background:rgba(255,255,255,0.1);border-radius:4px}
.content-identifier{display:inline-flex;align-items:center;margin-left:6px;padding:1px 4px;border-radius:3px;font-size:8px;font-weight:600;text-transform:uppercase;background:rgba(255,0,0,0.6);border:1px solid rgba(255,0,0,0.3);color:#fff}
.content-identifier i{margin-right:2px;font-size:7px}
.user-menu.active{display:block}
.user-menu-item{padding:12px 16px;display:flex;align-items:center;cursor:pointer;transition:all .2s ease;font-weight:500;font-size:14px;color:var(--text-light);text-decoration:none}
.user-menu-item:hover{background:rgba(147,0,226,0.2);transform:translateX(3px)}
.user-menu-item i{margin-right:10px;width:14px;color:rgba(255,255,255,0.8)}
.user-menu-item.logout{border-top:1px solid rgba(255,255,255,0.1);color:var(--error)}
.user-menu-item.logout:hover{background:rgba(220,38,38,0.15)}
.user-menu-item.logout i{color:rgba(220,38,38,0.8)}
.forgot-modal,.login-modal,.register-modal{position:fixed;inset:0;display:flex!important;justify-content:center;align-items:center;z-index:10000;opacity:0;visibility:hidden;pointer-events:none;background:rgba(0,0,0,0);backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);transition:opacity 650ms cubic-bezier(.25, .8, .25, 1),visibility 650ms linear,background 650ms cubic-bezier(.25, .8, .25, 1),backdrop-filter 650ms cubic-bezier(.25, .8, .25, 1)}.forgot-modal.active,.login-modal.active,.register-modal.active{opacity:1;visibility:visible;pointer-events:all;background:rgba(0,0,0,.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.forgot-modal-content,.login-modal-content,.register-modal-content{position:relative;background:rgba(33,33,38,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:40px 30px;border-radius:15px;width:100%;max-width:420px;max-height:85vh;overflow-y:auto;box-shadow:0 20px 40px rgba(0,0,0,.6);text-align:center;color:#fff;margin:20px;transform:translateY(40px) scale(.9);opacity:0;transition:transform 650ms cubic-bezier(.25, .8, .25, 1),opacity 650ms cubic-bezier(.25, .8, .25, 1)}.forgot-modal-content::-webkit-scrollbar,.login-modal-content::-webkit-scrollbar,.register-modal-content::-webkit-scrollbar{width:3px}.forgot-modal-content::-webkit-scrollbar-thumb,.login-modal-content::-webkit-scrollbar-thumb,.register-modal-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:3px}.forgot-modal.active .forgot-modal-content,.login-modal.active .login-modal-content,.register-modal.active .register-modal-content{opacity:1;transform:translateY(0) scale(1)}.forgot-modal-close,.login-modal-close,.register-modal-close{position:absolute;top:15px;right:20px;background:0 0;border:none;color:#ccc;font-size:24px;cursor:pointer;transition:color .3s}.forgot-modal-close:hover,.login-modal-close:hover,.register-modal-close:hover{color:#fff}
.login-modal .logo,.register-modal .logo,.forgot-modal .logo{width:80px;margin:0 auto 20px;display:block}
.login-modal h2,.register-modal h2,.forgot-modal h2{margin:0 0 8px;font-size:26px;font-weight:600}
.login-modal p,.register-modal p,.forgot-modal p{color:#ccc;margin:0 0 25px;font-size:14px}
.login-modal .input-group,.register-modal .input-group,.forgot-modal .input-group{position:relative;margin-bottom:18px;text-align:left}
.login-modal input[type=text],.login-modal input[type=email],.login-modal input[type=password],.register-modal input[type=text],.register-modal input[type=email],.register-modal input[type=password],.forgot-modal input[type=text],.forgot-modal input[type=password]{width:100%;padding:14px 45px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);border-radius:10px;color:#fff;font-size:14px;outline:none;transition:all var(--transition);box-sizing:border-box}
.login-modal input::placeholder,.register-modal input::placeholder,.forgot-modal input::placeholder{color:#aaa}
.login-modal input:focus,.register-modal input:focus,.forgot-modal input:focus{border-color:#9300e2;background:rgba(147,0,226,0.1);box-shadow:0 0 0 2px rgba(147,0,226,0.2)}
.login-modal .input-icon,.register-modal .input-icon,.forgot-modal .input-icon{position:absolute;top:50%;transform:translateY(-50%);color:#aaa;font-size:16px;transition:color var(--transition)}
.login-modal .input-icon.left,.register-modal .input-icon.left,.forgot-modal .input-icon.left{left:15px}
.login-modal .input-icon.right,.register-modal .input-icon.right,.forgot-modal .input-icon.right{right:15px;cursor:pointer}
.login-modal .input-group:focus-within .input-icon.left,.register-modal .input-group:focus-within .input-icon.left,.forgot-modal .input-group:focus-within .input-icon.left{color:#9300e2}
.login-btn,.register-modal .register-btn,.forgot-modal .login-btn{width:100%;padding:14px;background:linear-gradient(135deg,#9300e2,#7a00c7);border:none;border-radius:10px;font-size:16px;font-weight:600;color:#fff;cursor:pointer;transition:all var(--transition);margin-bottom:20px}
.login-btn:hover,.register-modal .register-btn:hover,.forgot-modal .login-btn:hover{background:linear-gradient(135deg,#7a00c7,#6600a8);transform:translateY(-1px);box-shadow:0 5px 15px rgba(147,0,226,0.3)}
.login-btn:disabled,.register-modal .register-btn:disabled,.forgot-modal .login-btn:disabled{opacity:0.6;cursor:not-allowed;transform:none;box-shadow:none}
.login-modal .error-message,.register-modal .error-message,.forgot-modal .error-message{background:rgba(248,215,218,0.9);color:#721c24;border:1px solid rgba(245,198,203,0.8);padding:12px 15px;border-radius:8px;font-size:14px;margin-bottom:20px;text-align:center;display:none}
.forgot-modal .success-message{background:rgba(212,237,218,0.9);color:#155724;border:1px solid rgba(195,230,203,0.8);padding:12px 15px;border-radius:8px;font-size:14px;margin-bottom:20px;text-align:center;display:none}
.login-modal .other-links,.register-modal .other-links,.forgot-modal .other-links{margin-top:20px;font-size:13px;color:#bdbdbd;line-height:1.8}
.login-modal .other-links a,.register-modal .other-links a,.forgot-modal .other-links a{color:#a33bff;text-decoration:none;transition:color var(--transition)}
.login-modal .other-links a:hover,.register-modal .other-links a:hover,.forgot-modal .other-links a:hover{color:#9300e2}
.login-modal .google-login,.register-modal .google-login{margin-top:25px;display:flex;justify-content:center}
.login-modal .divider,.register-modal .divider,.forgot-modal .divider{display:flex;align-items:center;margin:25px 0;color:#666;font-size:14px}
.login-modal .divider::before,.login-modal .divider::after,.register-modal .divider::before,.register-modal .divider::after,.forgot-modal .divider::before,.forgot-modal .divider::after{content:'';flex:1;height:1px;background:rgba(255,255,255,0.2)}
.login-modal .divider span,.register-modal .divider span,.forgot-modal .divider span{padding:0 15px}
.cf-turnstile{margin:15px auto}
@media (min-width:769px){.search-trigger{transition:transform .03s ease}.search-trigger.active{transform:translateX(-315px)}}
@media (max-width:768px){.profile-avatar{width:41px;height:41px}.login-modal-content,.register-modal-content,.forgot-modal-content{padding:30px 20px;margin:15px}}
@media (max-width:480px){.search-container{top:100%;right:0;transform:none;margin-top:10px;width:85vw;opacity:0;transform:translateY(-10px)}.search-container.active{opacity:1;transform:translateY(0)}.menu{width:160px}.user-menu{min-width:170px;top:55px}.user-menu-item{padding:12px 16px;font-size:14px}.user-menu-item i{margin-right:12px;width:16px}.login-modal-content,.register-modal-content,.forgot-modal-content{padding:25px 15px;margin:10px}}
.filter-link{display:flex;align-items:center;gap:5px;color:#b366ff;text-decoration:none;font-weight:500;margin-left:10px;transition:color .2s}.filter-link:hover{color:#9300e2}.search-history{position:absolute;top:calc(100% + 10px);left:0;right:0;background:rgba(26,26,26,.9);backdrop-filter:blur(10px);border-radius:10px;box-shadow:0 5px 20px rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.1);z-index:998}.search-history-header{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;font-size:13px;color:#a0aec0;border-bottom:1px solid rgba(255,255,255,.05)}.clear-history,.clear-item-btn{background:0 0;border:none;cursor:pointer}.clear-history{color:#9300e2;font-size:13px}.search-history-list{padding:0;margin:0}.search-history-list li{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;cursor:pointer;color:#fff;list-style:none}.search-history-list li:hover{background:rgba(147,0,226,.15)}.search-text{flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.clear-item-btn{color:#a0aec0;margin-left:10px;padding:0;font-size:14px;transition:color .2s;flex-shrink:0}.clear-item-btn:hover{color:#ff4d4d}
.language-block{padding:0 7px;margin-bottom:10px;margin:0 40px}
.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.language-title{font-weight:600;margin-left:10px;font-size:18px;margin:30px 0 1px;background:linear-gradient(to right,#9300e2,#b33bff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}
.language-title i{margin-right:8px;font-size:1em;vertical-align:middle;background:linear-gradient(45deg,#9300e2,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:blink 2.5s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.anime-container{display:flex;gap:50px;max-width:1200px;margin:0 auto;justify-content:center}
.anime-column{display:flex;flex-direction:column;gap:15px;width:23%}
.anime-card{background:rgba(147,0,226,0.08);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:16px;padding:15px;display:flex;align-items:center;height:90px;box-shadow:0 8px 32px rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.1);transition:all .3s cubic-bezier(.25,.8,.25,1);position:relative;overflow:hidden;cursor:pointer}
.anime-card::before{content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(to bottom,#a33bff,#e066ff);transition:width .3s ease}
.anime-card:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(0,0,0,0.3);background:rgba(255,255,255,0.12)}
.anime-card:hover::before{width:8px}
.anime-poster{width:60px;height:80px;object-fit:cover;border-radius:8px;margin-right:15px;box-shadow:0 4px 15px rgba(0,0,0,0.3);transition:transform .3s ease}
.anime-card:hover .anime-poster{transform:scale(1.05)}
.anime-info{display:flex;flex-direction:column;flex:1;min-width:0}
.anime-name{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:8px;color:#fff;position:relative}
.anime-name a{text-decoration:none;color:inherit}
.anime-details{display:flex;gap:12px;font-size:12px;color:rgba(255,255,255,0.8)}
.anime-detail{display:flex;align-items:center;gap:5px}
.anime-detail i{font-size:12px;color:#e066ff}
@media (max-width:1023px) and (min-width:560px){.anime-container{flex-wrap:wrap;margin:0 15px;gap:20px}.anime-column{width:48%}}
@media (max-width:559px){.anime-container{flex-wrap:wrap;margin:0 15px;gap:15px}.anime-column{width:100%}}
.content-scroll-container{position:relative;padding:10px 0 0 0;width:100%;overflow:hidden}
.content-scroll-wrapper.swiper-wrapper{display:flex;width:auto!important;padding-right:0!important;margin-right:0!important}
.swiper{overflow:hidden!important}
.swiper-button-prev,.swiper-button-next{display:none;position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;background:rgba(0,0,0,0.5);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border-radius:50%;color:#fff;font-size:20px;line-height:50px;text-align:center;cursor:pointer;z-index:10;transition:opacity .3s ease}
.swiper-button-prev{left:10px}
.swiper-button-next{right:10px}
.swiper-button-prev::after,.swiper-button-next::after{font-family:"Font Awesome 5 Free";font-weight:900;font-size:18px}
.swiper-button-prev::after{content:"\f053"}
.swiper-button-next::after{content:"\f054"}
.content-scroll-container:hover .swiper-button-prev,.content-scroll-container:hover .swiper-button-next{display:block}
.content-card{background:#0e0e0e;cursor:pointer;overflow:hidden;transition:transform .3s ease,opacity .5s ease;position:relative;opacity:0;transform:translateY(20px);flex:0 0 auto;width:calc(33.33% - 7px)}
@media (min-width:480px){.content-card{width:calc(25% - 8px)}}
@media (min-width:768px){.content-card{width:calc(20% - 8px)}}
@media (min-width:1024px){.content-card{width:calc(16.66% - 8px)}}
.content-card:hover{transform:translateY(-5px)}
.card-link{text-decoration:none;color:inherit;display:block;height:100%}
.card-img{position:relative;aspect-ratio:2/3;overflow:hidden;border-radius:6px 6px 0 0}
.card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}
.content-card:hover .card-img img{transform:scale(1.03)}
.card-img::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:40%;background:linear-gradient(to top,#0e0e0e 0%,rgba(14,14,14,0.6) 15%,rgba(14,14,14,0.3) 35%,rgba(14,14,14,0.1) 60%,rgba(14,14,14,0) 100%);pointer-events:none;border-radius:inherit}
.card-content .info{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:6px;font-size:12px;color:#aaa;flex-wrap:wrap}
.card-content .info>span:last-child{margin-left:auto}
.card-content .info span{display:flex;align-items:center;gap:1px}
.card-content .info img{width:18px;height:18px;object-fit:contain;background:rgba(14,14,14,0.8)}
.card-content .info b{color:#fff;font-weight:600}
@media(max-width:1024px){.card-content .info{font-size:11px;gap:5px}.card-content .info img{width:16px;height:16px}}
@media(max-width:768px){.card-content .info{font-size:10px;gap:4px;margin-top:4px}.card-content .info img{width:15px;height:15px}}
@media(max-width:480px){.card-content .info{font-size:9px;gap:3px;margin-top:3px}.card-content .info img{width:14px;height:14px}.card-content .info b{font-weight:500}}
.card-img .episode-tag{position:absolute;top:6px;right:0;background:#ffb300;color:#000;font-size:clamp(10px,1.1vw,12px);padding:2px 6px 2px 20px;border-radius:10px 0 0 10px;z-index:2;display:inline-flex;align-items:center;line-height:1;box-shadow:0 1px 2px rgba(0,0,0,.12);white-space:nowrap}.card-img .episode-tag::before{content:"";display:inline-block;width:14px;height:14px;background:url('/images/ep.svg') center/contain no-repeat;margin-right:4px;margin-left:-16px}@media(max-width:480px){.anime-logo{width:100px;height:auto}.card-img .episode-tag{top:4px;font-size:10px;padding:1px 5px 1px 18px}.card-img .episode-tag::before{width:12px;height:12px;margin-left:-14px}}@media(max-width:360px){.card-img .episode-tag{top:3px;font-size:9px;padding:1px 4px 1px 16px}.card-img .episode-tag::before{width:11px;height:11px;margin-left:-13px}}.card-content .info .dub,.card-content .info .sub{color:#fff!important;font-weight:600}
.card-content.info.na{display:none!important;}
.card-content{padding:8px;background:transparent;color:#fff;font-family:Arial,sans-serif}
.card-title{font-size:14px;font-weight:600;color:#e0e7e9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px;transition:all .3s ease;font-family:Arial,sans-serif}
.card-title:hover{color:#a33bff;transform:scale(1.03)}
.card-title a{text-decoration:none;color:inherit}
.trending-card .trending-number-large{position:absolute;bottom:18px;left:10px;font-size:40px;font-weight:900;color:#fff;line-height:1;z-index:2;font-family:'Poppins',Arial,sans-serif;pointer-events:none;background:rgba(0,0,0,0.55);padding:2px 8px;border-radius:6px}
@media (max-width:768px){.trending-card .trending-number-large{font-size:32px;bottom:14px}}
@media (max-width:480px){.trending-card .trending-number-large{font-size:28px;bottom:12px}}
.card-img .quality-tag{position:absolute;top:6px;left:0;background:#7a00c7;color:#fff;font-size:clamp(10px,1.1vw,12px);padding:2px 6px 2px 4px;border-radius:0 10px 10px 0;z-index:2;text-align:center;display:inline-flex;align-items:center;justify-content:center;line-height:1;white-space:nowrap;box-shadow:0 1px 2px rgba(0,0,0,.12)}
@media(max-width:480px){.card-img .quality-tag{top:4px;font-size:10px;padding:1px 5px 1px 3px;border-radius:0 8px 8px 0}}
@media(max-width:360px){.card-img .quality-tag{top:3px;font-size:9px;padding:1px 4px 1px 3px;border-radius:0 6px 6px 0}}
.loader{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:10px;text-align:center;z-index:20}
.loader::before,.loader::after,.loader span{content:'';display:inline-block;width:8px;height:8px;background:#9300e2;border-radius:50%;animation:dots 1.2s infinite;margin:0 2px}
.loader::before{animation-delay:0s}
.loader span{animation-delay:.4s}
.loader::after{animation-delay:.8s}
@keyframes dots{0%,80%,100%{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}
.anime-card.loading .loader,.content-card.loading .loader{display:block}
.anime-card.loading::before{display:none}
.content-card.loading .card-img::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);z-index:15}
.anime-card.loading .anime-poster,.anime-card.loading .anime-info,.content-card.loading .preview-modal,.content-card.loading .card-img img,.content-card.loading .card-content{opacity:0;visibility:hidden}
.preview-modal{position:absolute;top:0;left:0;right:0;width:100%;background-color:rgba(28,37,38,0.95);border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,0.35);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.1);z-index:15;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(0);transition:all .3s ease;pointer-events:none}
.content-card:hover .preview-modal{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
@media (max-width:768px){.language-block{padding:0 7px;margin-bottom:10px;margin:0 5px}}
@media (max-width:1400px){.preview-modal,.content-card .loader,.content-card.loading .loader{display:none!important;}}
.preview-content{padding:12px}
.preview-title{font-size:16px;font-weight:600;margin-bottom:6px;color:#e0e7e9;line-height:1.3}
.preview-details{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:8px}
.preview-detail-item{display:flex;align-items:center;font-size:11px;color:#fff}
.preview-detail-item .icon{color:#9300e2;margin-right:5px;width:10px}
.preview-genres{display:flex;align-items:center;margin-top:8px;font-size:11px;color:#fff}
.preview-genres .icon{color:#9300e2;margin-right:5px;width:10px}
.preview-buttons{display:flex;align-items:center;gap:8px;margin-top:8px}
.preview-play-button{display:inline-flex;align-items:center;justify-content:center;padding:6px 17px;background:#d9a3ff;border-radius:20px;font-size:13px;font-weight:600;color:#000;text-decoration:none;box-shadow:0 2px 4px rgba(0,0,0,0.2);transition:transform .2s ease}
.preview-play-button:hover{transform:scale(1.05)}
.preview-play-button i{margin-right:4px;font-size:13px}
.preview-add-button{display:inline-flex;align-items:center;justify-content:center;width:25px;height:25px;background:#fff;border-radius:50%;font-size:16px;color:#000;text-decoration:none;box-shadow:0 2px 4px rgba(0,0,0,0.2);transition:transform .2s ease}
.preview-add-button:hover{transform:scale(1.05)}
.preview-sub-dub{display:flex;gap:10px;margin-bottom:8px}
.sub-dub-tag{padding:2px 6px;background:#fff;border-radius:20px;font-size:10px;color:#000;font-weight:500;margin-bottom:8px}
.preview-additional-info{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:8px;font-size:11px;color:#fff}
.preview-additional-item{display:flex;align-items:center}
.preview-additional-item .icon{color:#9300e2;margin-right:5px;width:10px}
.search-container{position:absolute;top:100%;right:0;margin-top:13px;margin-right:4px;width:85vw;padding:18px 15px;display:none;gap:12px;align-items:center;background:rgba(26,26,26,.7);border-radius:20px;border:1px solid rgba(147,0,226,.4);box-shadow:0 3px 10px rgba(0,0,0,.2);z-index:999;backdrop-filter:blur(5px);opacity:0;transform:translateY(-10px);transition:opacity .3s,transform .3s}.search-container.active{display:flex;opacity:1;transform:translateY(0)}.search-container i{color:#b33bff}.header{position:absolute;top:22px;left:50%;transform:translateX(-50%);width:calc(100% - 60px);display:flex;align-items:center;justify-content:space-between;padding:10px 15px;background:linear-gradient(to right,#1f0138 0,#12051c 40%,#12051c 55%,#09010f 75%,#000 100%);border-radius:18px;z-index:1000}
.header-item{display:flex;align-items:center;justify-content:center;cursor:pointer;transform:var(--transition);width:40px;height:40px}
.header-item:hover,.header-item.active{transform:scale(1.1)}
.header-item i{color:#fff;font-size:20px}
.header-item.search-trigger svg{color:#fff;width:20px;height:20px}
.header-right{display:flex;align-items:center;gap:8px;position:relative}
.header-left{display:flex;align-items:center;gap:8px}
.menu{position:absolute;top:60px;left:20px;width:200px;background:rgba(18,5,28,0.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(15px);border-radius:15px;border:1px solid #5c5b5b;padding:20px;margin-top:30px;opacity:0;transform:translateY(-10px);pointer-events:none;transition: opacity var(--transition), transform var(--transition), width 0.3s ease-in-out;z-index:999;overflow: hidden}
.user-menu{position:absolute;top:60px;right:10px!important;background:rgba(18,5,28,0.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(15px);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.12);overflow:hidden;z-index:100;min-width:200px;animation:fadeIn .2s ease-out;display:none}
.menu-item{text-transform:uppercase;color:#f2f0f0;padding:10px 0;font-size:14px;cursor:pointer;transition:color var(--transition);display:flex;align-items:center;gap:10px}
.genres-submenu,.submenu-content{position:absolute;top:0;left:100%;width:260px;height:100%;padding:20px;transition:transform .3s ease-in-out}.genres-submenu,.menu-wrapper,.submenu-content{transition:transform .3s ease-in-out}.menu.expanded{width:260px!important}.menu.expanded .genres-submenu,.menu.expanded .menu-wrapper{transform:translateX(-100%)}.genres-submenu{overflow-y:auto}.genres-submenu::-webkit-scrollbar{width:8px}.genres-submenu::-webkit-scrollbar-track{background:#181818}.genres-submenu::-webkit-scrollbar-thumb{background:#333;border-radius:4px}.genres-content{display:flex;gap:20px;margin-top:10px}.genre-column{display:flex;flex-direction:column;flex:1}.submenu-content{display:none}.menu.expanded .submenu-content.active{display:block!important;transform:translateX(-100%)!important}.menu:not(.expanded) .submenu-content{display:none!important}.back-to-main{color:#fff;font-weight:700;margin-bottom:10px;cursor:pointer}.menu.expanded.narrow{width:195px!important}.menu.expanded.narrow .submenu-content{width:195px!important;padding:20px 23px;box-sizing:border-box}
@media (max-width:768px){.menu.expanded.narrow,.menu.expanded.narrow .submenu-content{width:175px!important}.notification-dropdown{right:0!important;width:320px!important;max-height:auto!important;margin-top:0!important}}.desktop-nav-menu{display:none}@media (min-width:1631px){.desktop-nav-menu{display:block;margin-right:auto}.menu{display:none}.header-left .menu-trigger{display:none!important}}.desktop-nav-menu .nav-list{list-style:none;padding:0;margin:0;display:flex;align-items:center;gap:20px}.desktop-nav-menu .nav-item{position:relative}.desktop-nav-menu .nav-link{color:#fff;text-decoration:none;font-weight:600;font-size:14px;padding:10px 0;transition:color .2s}.desktop-nav-menu .nav-link:hover{color:#ffc107}.dropdown-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:10px;min-width:200px;background:rgba(18,5,28,0.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(15px);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.12);padding:15px;display:none;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:1001}.genres-dropdown,.types-dropdown{left:-10px;transform:translateX(0)}.types-dropdown{min-width:130px}.genres-dropdown{min-width:600px}.dropdown-column{display:flex;flex-direction:column;flex:1}.dropdown-item{color:#ccc;text-decoration:none;padding:5px 0;font-size:14px;white-space:nowrap;transition:color .2s}.dropdown-item:hover{color:#fff}.nav-item.has-dropdown:hover>.dropdown-menu{display:flex;opacity:1;pointer-events:auto;transform:translateY(0)}
@media (max-width:768px){.header{top:19px;width:calc(100% - 40px);padding:8px 13px}.menu{width:180px;top:50px}.user-menu{min-width:180px;top:50px}.header-item i,.header-item.search-trigger svg{font-size:18px;width:18px;height:18px}}@media (max-width:480px){.header{top:15px;width:calc(100% - 20px);padding:7px 12px}.header-item i,.header-item.search-trigger svg{font-size:16px;width:16px;height:16px}.notification-dropdown{width:290px!important}}.full-search-box{position:relative;display:flex;align-items:center;background:linear-gradient(to right,#3b0f5c 0,#1a001f 100%);border-radius:15px;padding:8px 15px;height:40px;width:500px;box-shadow:0 2px 5px rgba(0,0,0,.2)}
.mark-read-btn i,.pure-mark-as-read:hover{color:#fff}.pure-mark-as-read{font-size:.875rem;line-height:1.25rem;color:#9ca3af;background:0 0;border:none;cursor:pointer;transition:color .2s}.header-item.notification-trigger{position:relative;cursor:pointer;transition:transform .25s,opacity .25s}.header-item.notification-trigger:hover{transform:scale(1.08);opacity:.9}.notification-badge{position:absolute;top:-5px;right:-5px;background:#ff4757;color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;border:2px solid #1a1a1a;transition:transform .25s,opacity .25s}.header-item.notification-trigger:hover .notification-badge{transform:scale(1.12)}.pure-mark-as-read i{margin-right:.25rem}.notification-item.read{opacity:.58;background:0 0!important;border-left:none!important;transition:.3s}.notification-item.read .notification-text,.notification-item.read .notification-time{color:#94a3b8!important}.notification-item{transition:.3s;position:relative;border-left:4px solid transparent}.notification-item.read .mark-read-btn{display:none!important}
.desktop-search-history-header{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;font-size:13px;color:#a0aec0;border-bottom:1px solid rgba(255,255,255,.05)}.desktop-clear-history{background:0 0;border:none;color:#9300e2;cursor:pointer;font-size:13px}.desktop-search-history-list{padding:0;margin:0}.desktop-search-history-list li{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;cursor:pointer;color:#fff;list-style:none}.desktop-search-history-list li:hover{background:rgba(147,0,226,.15)}.desktop-search-history-list .search-text{flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.desktop-search-history-list .clear-item-btn{background:0 0;border:none;color:#a0aec0;cursor:pointer;margin-left:10px;padding:0;font-size:14px;transition:color .2s;flex-shrink:0}.desktop-search-history-list .clear-item-btn:hover{color:#ff4d4d}.search-icon-wrapper{color:#fff;margin-right:10px;display:flex;align-items:center}.search-icon-wrapper svg{width:20px;height:20px;fill:currentColor}.search-input-full{flex-grow:1;border:none;background:0 0;color:#fff;font-size:16px;outline:0;padding:0}.search-input-full::placeholder{color:#aaa}.desktop-search-history{display:none;position:absolute;top:100%;left:0;width:100%;margin-top:10px;background-color:#1a1a1a;border-radius:8px;box-shadow:0 8px 16px rgba(0,0,0,.5);padding:15px;z-index:1002}.desktop-search-history.is-active{display:block!important}.search-trigger-mobile{display:flex}.search-box-desktop{display:none}
.notification-dropdown{background:rgba(18,5,28,0.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(15px);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.12);}
@media (min-width:1061px){.search-container,.search-trigger-mobile{display:none!important}.search-box-desktop{display:flex!important}.header-right{gap:15px}}
.tab-button,.view-all-link{text-align:center;font-weight:500}.notification-dropdown{position:absolute;top:60px;right:10px;width:350px;max-height:80vh;overflow:hidden;display:none;opacity:0;transform:translateY(-10px);transition:opacity .2s ease-out,transform .2s ease-out;z-index:1000}.notification-dropdown.active{display:block;opacity:1;transform:translateY(0)}.notification-header{display:flex;justify-content:space-between;align-items:center;padding:15px;border-bottom:1px solid rgba(255,255,255,.05)}.notification-tabs{display:flex;padding:10px 15px 0;gap:10px;align-items:center;justify-content:center}.tab-button{flex:1;padding:6px 0;border-radius:10px;color:#5b5b5b;background-color:#11161b;transition:color .3s;font-size:14px;font-family:Poppins}.tab-button:hover{color:#fff}.tab-button.active{background-color:#36cb68;color:#0c1116}.notification-content{padding:10px 0;max-height:calc(80vh - 150px);overflow-y:auto}.notification-item{display:flex;align-items:flex-start;padding:10px 15px;cursor:pointer;transition:background-color .15s}.notification-details{flex-grow:1;color:#fff;font-size:14px}.notification-time{display:block;font-size:12px;color:#aaa;margin-bottom:2px}.view-all-link{display:block;padding:10px 15px;color:#848484;border-top:1px solid rgba(255,255,255,.05);transition:color .2s}.view-all-link:hover{color:#ccc}.tab-pane{display:none}.tab-pane.active{display:block}