:root{
  --primary:#C62828;--primary-dark:#8E0000;--primary-light:#FF5F52;
  --secondary:#1A237E;--accent:#FFD600;
  --dark:#121212;--dark-secondary:#1E1E2A;
  --bg:#fcf8f8;--bg2:#f7edee;--ink:#281517;
  --card-bg:rgba(255,255,255,.04);--header-bg:color-mix(in srgb, var(--dark) 80%, transparent);--menu-bg:#2e191b;--bd:rgba(255,255,255,.12);
}

.nav{transition:transform .3s ease;}
@media(max-width:1023px){
 .nav{position:fixed;top:0;right:0;bottom:0;width:82%;max-width:340px;flex-direction:column;background:var(--menu-bg);padding:5.5rem 1.5rem 2rem;transform:translateX(100%);z-index:60;overflow-y:auto;box-shadow:-20px 0 60px -20px rgba(0,0,0,.4);}
 .nav.active{transform:translateX(0);}
 .menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:opacity .3s;z-index:55;}
 .menu-overlay.active{opacity:1;visibility:visible;}
 body.menu-open{overflow:hidden;}
}
.faq-answer{max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease,opacity .3s ease;}
.faq-icon{transition:transform .25s ease;}
.back-to-top{opacity:0;visibility:hidden;transition:opacity .3s;}
.back-to-top.visible{opacity:1;visibility:visible;}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cat-tab.active{font-weight:800;}
@media print{header,footer,nav,.no-print{display:none!important}}

body{background:radial-gradient(1200px 600px at 80% -10%,color-mix(in srgb,var(--primary) 30%,transparent),transparent),var(--dark);}
.glass{background:rgba(255,255,255,.04);backdrop-filter:blur(14px);}
.glass-hover{transition:transform .25s,box-shadow .25s,background .25s;}
.glass-hover:hover{transform:translateY(-4px);background:rgba(255,255,255,.07);box-shadow:0 24px 60px -20px var(--primary);}
.glow{box-shadow:0 0 40px -8px var(--primary);}
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--dark)}::-webkit-scrollbar-thumb{background:var(--primary);border-radius:8px}

html{scroll-behavior:smooth}
.announce{background:var(--primary);color:#fff}
.site-header{backdrop-filter:blur(12px)}
.header-bar{background:var(--header-bg);border-bottom:1px solid var(--bd)}
.logo-badge{display:inline-flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;font-size:1.1rem;border-radius:.7rem;background:var(--primary);color:#fff}
.nav-link.is-active{background:var(--primary);color:#fff;opacity:1}
.search-box{background:rgba(255,255,255,.06);border:1px solid var(--bd)}
.search-box-lg{background:var(--card-bg);border:1px solid var(--bd);box-shadow:0 12px 40px -24px rgba(0,0,0,.4)}
.burger{width:2.6rem;height:2.6rem;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;border:1px solid var(--bd);border-radius:.6rem;background:var(--card-bg)}
.hero-wrap{position:relative}
.alt-section{background:rgba(255,255,255,.03)}
.hero-deco{position:absolute;inset:0;background:radial-gradient(60% 80% at 85% -10%,color-mix(in srgb,var(--primary) 34%,transparent),transparent),radial-gradient(50% 60% at 0% 100%,color-mix(in srgb,var(--secondary) 28%,transparent),transparent);pointer-events:none}
.hero-blob-1{position:absolute;width:22rem;height:22rem;background:var(--primary);top:-4rem;right:-4rem}
.hero-blob-2{position:absolute;width:18rem;height:18rem;background:var(--secondary);bottom:-3rem;left:-3rem}
.hero-cover{box-shadow:0 30px 70px -28px rgba(0,0,0,.55);border:1px solid var(--bd)}
.play-tag{background:var(--accent);color:#111}
.comic-tag{position:absolute;top:.5rem;left:.5rem;font-size:.7rem;font-weight:900;padding:.1rem .5rem;border-radius:.3rem;background:var(--accent);color:#111}
.comic-status{position:absolute;bottom:.5rem;right:.5rem;font-size:.68rem;font-weight:700;padding:.1rem .45rem;border-radius:.3rem;background:rgba(0,0,0,.7);color:#fff}
.stat-box{background:var(--card-bg);border:1px solid var(--bd);padding:.85rem 1rem;text-align:left}
.cat-tab{background:var(--card-bg);border:1px solid var(--bd);transition:all .2s}
.cat-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.step-num{position:absolute;top:-.9rem;left:1.2rem;width:2.4rem;height:2.4rem;border-radius:9999px;display:flex;align-items:center;justify-content:center;font-weight:900;background:var(--primary);color:#fff}
.avatar-char{width:2.8rem;height:2.8rem;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;background:var(--primary);color:#fff}
.stars{color:var(--accent)}
.accent-num{color:var(--primary)}
.rank-badge{width:2.6rem;height:2.6rem;border-radius:.8rem;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.1rem;background:var(--primary);color:#fff;flex:none}
.tag-chip{background:var(--card-bg);border:1px solid var(--bd);opacity:.85;transition:.2s}
.tag-chip:hover{background:var(--primary);color:#fff;border-color:var(--primary);opacity:1}
.page-hero{background:rgba(255,255,255,.03);border-bottom:1px solid var(--bd)}
.site-footer{background:#1f0f11;color:#e7e7e7}
.footer-col-title{color:var(--primary-light)}
.social-ico{background:rgba(255,255,255,.08)}.social-ico:hover{background:var(--primary)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1)}
.back-to-top{background:var(--primary);color:#fff;box-shadow:0 8px 20px -8px var(--primary)}
.load-more{cursor:pointer}
