:root{--font-main: "Inter", system-ui, -apple-system, sans-serif;--bg-color: #f8fafc;--surface-color: #ffffff;--text-primary: #0f172a;--text-secondary: #64748b;--accent-color: #6366f1;--accent-hover: #4f46e5;--border-color: #e2e8f0;--glass-bg: rgba(255, 255, 255, .7);--glass-border: rgba(255, 255, 255, .3);--shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1)}[data-theme=dark]{--bg-color: #0f172a;--surface-color: #1e293b;--text-primary: #f8fafc;--text-secondary: #94a3b8;--accent-color: #818cf8;--accent-hover: #a5b4fc;--border-color: #334155;--glass-bg: rgba(30, 41, 59, .7);--glass-border: rgba(255, 255, 255, .1);--shadow: 0 4px 6px -1px rgb(0 0 0 / .3), 0 2px 4px -2px rgb(0 0 0 / .3)}*{margin:0;padding:0;box-sizing:border-box;transition:background-color .3s ease,color .3s ease,border-color .3s ease}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;font-size:14px}@media(min-width:768px){body{font-size:16px}}h1,h2,h3,h4,h5,h6{font-weight:700;letter-spacing:-.025em}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;background:none;font-family:inherit}.glass{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}@media(min-width:768px){.container{padding:0 1.5rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .5s ease-out forwards}.navbar{position:fixed;top:0;left:0;right:0;height:60px;z-index:1000;display:flex;align-items:center}@media(min-width:768px){.navbar{height:70px}}.nav-content{display:flex;justify-content:space-between;align-items:center;width:100%}.nav-logo{display:flex;align-items:center;gap:8px}@media(min-width:768px){.nav-logo{gap:12px}}.logo-img{height:32px;width:auto}@media(min-width:768px){.logo-img{height:40px}}.logo-text{font-size:1.25rem;font-weight:800;background:linear-gradient(135deg,var(--accent-color),#ec4899);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}@media(min-width:768px){.logo-text{font-size:1.5rem}}.nav-links{display:flex;align-items:center;gap:1rem}@media(min-width:768px){.nav-links{gap:2rem}}.nav-link{font-weight:500;color:var(--text-secondary);transition:color .2s;font-size:.9rem}@media(min-width:768px){.nav-link{font-size:1rem}}.nav-link:hover{color:var(--accent-color)}.theme-toggle{display:flex;align-items:center;justify-content:center;padding:6px;border-radius:10px;background:var(--surface-color);color:var(--text-primary);border:1px solid var(--border-color);transition:all .2s}@media(min-width:768px){.theme-toggle{padding:8px;border-radius:12px}}.theme-toggle:hover{transform:scale(1.05);box-shadow:var(--shadow);border-color:var(--accent-color)}.comic-card{background:var(--surface-color);border-radius:12px;overflow:hidden;border:1px solid var(--border-color);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}@media(min-width:768px){.comic-card{border-radius:16px}}.comic-card:hover{transform:translateY(-4px);box-shadow:0 10px 15px -3px #0000001a;border-color:var(--accent-color)}@media(min-width:768px){.comic-card:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}}.card-image-container{position:relative;aspect-ratio:2/3;overflow:hidden}.card-image{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.comic-card:hover .card-image{transform:scale(1.05)}@media(min-width:768px){.comic-card:hover .card-image{transform:scale(1.1)}}.rating-badge{position:absolute;top:8px;left:8px;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fbbf24;padding:2px 6px;border-radius:6px;font-size:.75rem;font-weight:700;z-index:10}@media(min-width:768px){.rating-badge{top:12px;left:12px;padding:4px 8px;border-radius:8px;font-size:.85rem}}.status-badge{position:absolute;top:8px;right:8px;background:var(--accent-color);color:#fff;padding:2px 8px;border-radius:6px;font-size:.65rem;font-weight:600;z-index:10}@media(min-width:768px){.status-badge{top:12px;right:12px;padding:4px 10px;border-radius:8px;font-size:.75rem}}.card-info{padding:.75rem}@media(min-width:768px){.card-info{padding:1.25rem}}.card-title{font-size:.9rem;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-primary)}@media(min-width:768px){.card-title{font-size:1.1rem}}.comic-detail{padding-top:1rem}@media(min-width:768px){.comic-detail{padding-top:2rem}}.detail-header{display:flex;flex-direction:column;gap:2rem;margin-bottom:2.5rem}@media(min-width:768px){.detail-header{display:grid;grid-template-columns:300px 1fr;gap:3rem;margin-bottom:4rem;flex-direction:row}}.detail-cover{border-radius:16px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border-color);max-width:240px;margin:0 auto}@media(min-width:768px){.detail-cover{border-radius:20px;max-width:100%;margin:0}}.detail-cover img{width:100%;height:auto;display:block}.detail-info{text-align:center}@media(min-width:768px){.detail-info{text-align:left}}.detail-title{font-size:2rem;margin-bottom:.5rem}@media(min-width:768px){.detail-title{font-size:3rem}}.detail-author{color:var(--text-secondary);font-size:1rem;margin-bottom:1rem}@media(min-width:768px){.detail-author{font-size:1.1rem;margin-bottom:1.5rem}}.detail-tags{display:flex;gap:.5rem;margin-bottom:1.5rem;justify-content:center}@media(min-width:768px){.detail-tags{gap:.75rem;margin-bottom:2rem;justify-content:flex-start}}.tag{background:var(--surface-color);padding:4px 10px;border-radius:99px;border:1px solid var(--border-color);font-size:.75rem;font-weight:600}@media(min-width:768px){.tag{padding:4px 12px;font-size:.85rem}}.detail-description{color:var(--text-secondary);font-size:.95rem;max-width:100%;line-height:1.6}@media(min-width:768px){.detail-description{font-size:1.1rem;max-width:800px;line-height:1.7}}.chapters-list{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}@media(min-width:768px){.chapters-list{gap:1rem;margin-top:2rem}}.chapter-item{display:flex;justify-content:space-between;padding:1rem 1.25rem;border-radius:12px;border:1px solid var(--border-color);transition:all .2s;font-size:.9rem}@media(min-width:768px){.chapter-item{padding:1.25rem 2rem;border-radius:16px;font-size:1rem}}.chapter-item:hover{border-color:var(--accent-color);transform:translate(4px);background:var(--surface-color)}@media(min-width:768px){.chapter-item:hover{transform:translate(8px)}}.ch-number{font-weight:700}.ch-title{color:var(--text-secondary)}.reader-page{padding-top:60px;background:#000;min-height:100vh}@media(min-width:768px){.reader-page{padding-top:70px}}.reader-controls{position:fixed;top:60px;left:0;right:0;height:50px;z-index:900;display:flex;align-items:center}@media(min-width:768px){.reader-controls{top:70px;height:60px}}.controls-content{display:flex;justify-content:space-between;align-items:center;width:100%}.back-btn{display:flex;align-items:center;gap:6px;font-weight:600;font-size:.9rem}@media(min-width:768px){.back-btn{gap:8px;font-size:1rem}}.reader-info{font-weight:700;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}@media(min-width:768px){.reader-info{font-size:1.1rem;max-width:none}}.reader-container{width:100%;max-width:100%;margin:50px auto 80px;display:flex;flex-direction:column}@media(min-width:768px){.reader-container{max-width:800px;margin:60px auto 100px}}.reader-page-img{width:100%}.reader-page-img img{width:100%;height:auto;display:block}.reader-footer{position:fixed;bottom:0;left:0;right:0;height:60px;z-index:900;display:flex;align-items:center}@media(min-width:768px){.reader-footer{height:80px}}.footer-nav{display:flex;justify-content:center;gap:1rem;width:100%}@media(min-width:768px){.footer-nav{gap:2rem}}.nav-btn{padding:8px 16px;border-radius:10px;font-weight:700;background:var(--surface-color);border:1px solid var(--border-color);color:var(--text-primary);font-size:.85rem}@media(min-width:768px){.nav-btn{padding:10px 24px;border-radius:12px;font-size:1rem}}.nav-btn.primary{background:var(--accent-color);color:#fff;border:none}.app{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding-top:80px;padding-bottom:30px}@media(min-width:768px){.main-content{padding-top:100px;padding-bottom:50px}}.hero{text-align:center;margin-bottom:2rem;padding:2rem 0;background:radial-gradient(circle at center,rgba(99,102,241,.1) 0%,transparent 70%)}@media(min-width:768px){.hero{margin-bottom:4rem;padding:4rem 0}}.hero-title{font-size:2.25rem;margin-bottom:.75rem;line-height:1.2}@media(min-width:768px){.hero-title{font-size:3.5rem;margin-bottom:1rem}}.gradient-text{background:linear-gradient(135deg,var(--accent-color),#ec4899);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero-subtitle{font-size:1rem;color:var(--text-secondary);max-width:90%;margin:0 auto}@media(min-width:768px){.hero-subtitle{font-size:1.25rem;max-width:600px}}.comics-section{margin-bottom:3rem}@media(min-width:768px){.comics-section{margin-bottom:4rem}}.section-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:1.5rem}@media(min-width:768px){.section-header{margin-bottom:2rem}}.section-title{font-size:1.5rem}@media(min-width:768px){.section-title{font-size:2rem}}.view-all{color:var(--accent-color);font-weight:600;font-size:.85rem}@media(min-width:768px){.view-all{font-size:.95rem}}.comics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}@media(min-width:768px){.comics-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2rem}}.loading{text-align:center;padding:2rem;font-size:1rem;color:var(--text-secondary)}@media(min-width:768px){.loading{padding:4rem;font-size:1.25rem}}.footer{padding:1.5rem 0;margin-top:auto;text-align:center;color:var(--text-secondary);font-size:.8rem}@media(min-width:768px){.footer{padding:2rem 0;font-size:.9rem}}