@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;600;800&display=swap');
:root{--bg:#08080b;--card:#101015;--pink:#ff16c7;--blue:#11c8ff;--lime:#c8ff00}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#08080b;color:#fff;font-family:Inter,Arial,sans-serif;min-height:100vh}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:10px 18px;background:#08080bf0;backdrop-filter:blur(15px);border-bottom:1px solid #24242b}.brand{display:block;width:145px;height:62px}.brand img{width:100%;height:100%;object-fit:contain;object-position:left center}.install{border:1px solid #fff;background:#fff;color:#08080b;border-radius:999px;padding:9px 14px;font-weight:800}.hidden{display:none}
.hero{position:relative;overflow:hidden;text-align:center;padding:30px 20px 65px;background:#08080b;min-height:600px;display:flex;flex-direction:column;align-items:center;justify-content:center}.neon-bg{position:absolute;inset:0;background:radial-gradient(circle at 20% 35%,#ff16c71c,transparent 25%),radial-gradient(circle at 80% 30%,#11c8ff1c,transparent 28%),radial-gradient(circle at 55% 80%,#c8ff0014,transparent 30%);pointer-events:none}.hero-logo{position:relative;z-index:1;width:min(900px,94vw);max-height:430px;object-fit:contain;filter:drop-shadow(0 0 18px #ff16c733)}.slogan{position:relative;z-index:1;font-family:'Archivo Black',sans-serif;letter-spacing:1px;font-size:clamp(20px,4vw,34px);margin:8px 0 28px;text-shadow:0 0 12px #ff16c766}.cta{position:relative;z-index:1;display:inline-block;color:#fff;text-decoration:none;font-weight:800;padding:14px 28px;border-radius:12px;border:2px solid transparent;background:linear-gradient(#08080b,#08080b) padding-box,linear-gradient(90deg,var(--pink),var(--blue),var(--lime)) border-box;box-shadow:0 0 22px #ff16c722}
.cards{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:min(1120px,calc(100% - 40px));margin:-15px auto 0;padding:0}.card{min-height:275px;padding:22px;border-radius:20px;background:var(--card);border:1px solid #292931;text-decoration:none;color:#fff;display:flex;flex-direction:column;justify-content:end;transition:.2s}.card:hover{transform:translateY(-4px)}.card span{font-size:42px;margin-bottom:auto}.card strong{font:28px 'Archivo Black',sans-serif}.card small{margin-top:8px;line-height:1.4;color:#c9c9d1}.card b{margin-top:16px;font-size:12px;letter-spacing:.5px}.card img{width:100%;height:120px;object-fit:contain;mix-blend-mode:screen;margin-bottom:auto}.emoji{font-size:42px;margin-bottom:auto}.anime{box-shadow:inset 0 0 55px #ff16c712;border-color:#ff16c766}.pink{box-shadow:inset 0 0 55px #ff16c712}.blue{box-shadow:inset 0 0 55px #11c8ff12}.card-action{margin-top:16px;text-align:left;background:none;border:0;padding:0;color:#fff;font:800 12px Inter;letter-spacing:.5px;cursor:pointer}
.anime-panel{width:min(1120px,calc(100% - 40px));margin:20px auto 0;padding:28px;border:1px solid #ff16c766;border-radius:22px;background:linear-gradient(145deg,#160c18,#0d1016);box-shadow:inset 0 0 70px #ff16c712}.panel-heading h2{font:32px 'Archivo Black',sans-serif;margin:0}.panel-heading p{color:#c9c9d1;margin:7px 0 20px}.anime-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.anime-grid a{display:flex;justify-content:space-between;align-items:center;padding:18px;color:#fff;text-decoration:none;border:1px solid #303039;border-radius:14px;background:#0b0b10;font-weight:800}.anime-grid a:hover{border-color:var(--pink);box-shadow:0 0 18px #ff16c722}.quickcats{max-width:900px;margin:30px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0 20px}.quickcats a,.quickcats button{padding:17px 10px;text-align:center;color:#fff;text-decoration:none;border:1px solid #303039;border-radius:12px;font-weight:800;background:#0d0d12;cursor:pointer}.info{text-align:center;max-width:900px;margin:65px auto;padding:20px}.info h2{font:clamp(28px,6vw,48px) 'Archivo Black',sans-serif}.info p{color:#c9c9d1;margin-bottom:28px}footer{text-align:center;color:#777;padding:40px 20px;border-top:1px solid #222}
@media(max-width:900px){.cards{grid-template-columns:1fr}.anime-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.quickcats{grid-template-columns:1fr}.anime-grid{grid-template-columns:1fr}.hero{min-height:540px;padding-top:20px}.brand{width:120px;height:54px}.anime-panel{padding:20px}}
