.anime-hub-container{
    --anime-bg:#0a0a0a;--anime-card:#161616;--anime-accent:#2196f3;--anime-text:#f0f0f0;
    --anime-hero-title:#FFD700;--nav-bg:#ffffff;--nav-icon:#ff0000;
    --hub-gap:clamp(8px,1.4vw,18px);--hub-pad:clamp(10px,2vw,24px);--hub-cards:2;--hub-muted:#b9b9b9;
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    background-color:var(--anime-bg);color:var(--anime-text);
    padding:var(--hub-pad) 0 calc(var(--hub-pad) + env(safe-area-inset-bottom,0px));
    display:block;width:100%;max-width:none;margin:0;overflow:visible;
}
.anime-hub-container *{box-sizing:border-box;min-width:0;}
.anime-hub-container h1,.anime-hub-container h2,.anime-hub-container h3,.anime-hub-container h4,
.anime-hub-container p,.anime-hub-container div{color:var(--anime-text);}

.trending-hero{width:100%;margin-bottom:clamp(22px,3.5vw,40px);padding:0 var(--hub-pad);}
.anime-slider-wrapper{position:relative;display:flex;align-items:center;width:100%;}
.hero-slider{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
    -ms-overflow-style:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
    border-radius:clamp(10px,1.2vw,15px);width:100%;
}
.anime-hub-container .hero-slider::-webkit-scrollbar,
.anime-hub-container .anime-slider::-webkit-scrollbar{display:none;height:0;}
.hero-item{
    flex:0 0 100%;min-width:100%;scroll-snap-align:start;position:relative;
    height:clamp(200px,34vw,450px);cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.hero-img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(0.5);pointer-events:none;}
.hero-caption{position:absolute;bottom:clamp(14px,3vw,40px);left:clamp(14px,3vw,40px);right:clamp(14px,3vw,40px);z-index:5;max-width:80%;pointer-events:none;}
.hero-caption h2{font-size:clamp(1.05rem,3.4vw,2.5rem);margin:0;text-shadow:2px 2px 10px rgba(0,0,0,1);color:var(--anime-hero-title)!important;font-weight:800;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.hero-caption p.anime-synopsis{color:#eaeaea!important;font-size:clamp(0.75rem,1.15vw,1rem);-webkit-line-clamp:2;margin-top:8px;text-shadow:0 2px 8px rgba(0,0,0,.95);}

.anime-section{padding:0 var(--hub-pad);margin-bottom:clamp(22px,3.5vw,40px);}
.anime-section-title{font-size:clamp(1.05rem,2vw,1.4rem);margin:0 0 clamp(10px,1.4vw,15px);border-left:4px solid var(--anime-accent);padding-left:12px;color:#fff!important;line-height:1.3;}
.anime-slider{
    display:flex;gap:var(--hub-gap);overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x proximity;
    scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;width:100%;padding:10px 0;
}
.anime-card{
    flex:0 0 calc((100% - (var(--hub-gap) * (var(--hub-cards) - 1))) / var(--hub-cards));
    scroll-snap-align:start;background:var(--anime-card);border-radius:10px;overflow:hidden;
    transition:transform .3s ease;cursor:pointer;box-shadow:0 4px 6px rgba(0,0,0,.3);-webkit-tap-highlight-color:transparent;
}
.anime-cover{display:block;width:100%;aspect-ratio:2/3;height:auto;object-fit:cover;pointer-events:none;background:#222;}
.anime-info{padding:clamp(8px,1vw,12px);}
.anime-title{font-size:clamp(.8rem,1.1vw,.98rem);font-weight:600;margin:0;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#fff!important;}
.anime-synopsis{font-size:clamp(.72rem,.85vw,.84rem);line-height:1.45;margin:6px 0 0;color:var(--hub-muted)!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}

@media (max-width:420px){.anime-hub-container{--hub-cards:2;--hub-gap:8px;--hub-pad:10px;}.anime-synopsis{-webkit-line-clamp:2;}}
@media (min-width:480px){.anime-hub-container{--hub-cards:3;}}
@media (min-width:768px){.anime-hub-container{--hub-cards:4;}}
@media (min-width:1024px){.anime-hub-container{--hub-cards:5;}}
@media (min-width:1440px){.anime-hub-container{--hub-cards:6;}}
@media (min-width:1800px){.anime-hub-container{--hub-cards:7;}}

.nav-btn{
    background:var(--nav-bg);color:var(--nav-icon);border:2px solid #ccc;
    width:clamp(40px,3.2vw,50px);height:clamp(40px,3.2vw,50px);border-radius:50%;cursor:pointer;
    position:absolute;z-index:10;font-weight:900;font-size:clamp(1rem,1.6vw,1.5rem);line-height:1;
    display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(0,0,0,.5);
    transition:transform .2s,background .2s;touch-action:manipulation;user-select:none;
}
.nav-prev{left:6px;}.nav-next{right:6px;}
@media (hover:hover) and (pointer:fine){
    .anime-card:hover{transform:translateY(-5px);outline:1px solid var(--anime-accent);}
    .nav-btn:hover{transform:scale(1.1);background:#f0f0f0;}
}
@media (max-width:767px){.nav-btn{width:36px;height:36px;font-size:.95rem;opacity:.9;}.nav-prev{left:4px;}.nav-next{right:4px;}}
@media (prefers-reduced-motion:reduce){.anime-card,.nav-btn{transition:none;}.anime-slider,.hero-slider{scroll-behavior:auto;}}

.anime-modal-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:2147483000;display:none;
    align-items:center;justify-content:center;padding:14px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
}
.anime-modal-overlay.is-open{display:flex!important;}
.anime-modal{background:#141414;width:100%;max-width:860px;max-height:92vh;min-height:0;border-radius:16px;display:flex;overflow:hidden;position:relative;box-shadow:0 10px 50px rgba(0,0,0,.85);}
.modal-left{flex:0 0 40%;min-height:0;}
.modal-left img{width:100%;height:100%;min-height:260px;max-height:92vh;object-fit:cover;display:block;background:#222;}
.modal-right{flex:1 1 60%;min-height:0;padding:clamp(18px,2.4vw,30px);display:flex;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.modal-close{position:absolute;right:12px;top:10px;width:44px;height:44px;border:none;background:rgba(0,0,0,.55);color:#fff;font-size:1.6rem;line-height:1;border-radius:50%;cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background .2s,transform .2s;}
.modal-close:hover{background:rgba(0,0,0,.85);transform:scale(1.08);}
#modalTitle{margin:0;padding-right:48px;font-size:clamp(1.15rem,2.2vw,1.8rem);color:#fff!important;line-height:1.25;}
.modal-genres{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;}
.genre-tag{background:#2a2a2a;padding:4px 12px;border-radius:20px;font-size:.75rem;color:var(--anime-accent);border:1px solid #444;}
.modal-desc{font-size:clamp(.84rem,1.1vw,.92rem);color:#ddd!important;margin:4px 0 16px;line-height:1.6;white-space:pre-line;overflow-wrap:break-word;}
.modal-next-ep{margin-top:auto;background:#222;padding:clamp(10px,1.6vw,15px);border-radius:10px;text-align:center;border:1px solid #333;}
.modal-next-label{display:block;font-size:.8rem;color:#888;letter-spacing:.04em;}
.modal-timer{display:block;font-size:clamp(1.1rem,1.8vw,1.4rem);font-weight:bold;color:var(--anime-accent);margin-top:4px;}
@media (max-width:640px){
    .anime-modal-overlay{padding:0;align-items:center;}
    .anime-modal{flex-direction:column;max-height:94vh;margin:12px;border-radius:14px;}
    .modal-left{flex:0 0 auto;}
    .modal-left img{height:34vh;min-height:160px;max-height:40vh;}
    .modal-right{padding:18px;}
}
.anime-card:focus-visible,.hero-item:focus-visible,.nav-btn:focus-visible,.modal-close:focus-visible{outline:2px solid var(--anime-accent);outline-offset:2px;}