body.darkmode{margin:0;font-family:Quicksand,Arial,sans-serif;background-color:#121212;color:#e0e0e0;line-height:1.6;transition:background-color .3s ease,color .3s ease}.darkmode .top-bar{display:flex;font-family:Poppins,sans-serif;justify-content:space-between;align-items:center;background:linear-gradient(145deg,#333,#1c1c1c);color:#fff;padding:10px 40px;box-shadow:0 2px 6px #00000080;position:sticky;top:0;z-index:1000;border-bottom:2px solid #444444;transition:background-color .3s ease}.darkmode #website-name{font-family:Poppins,sans-serif;font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:5px;color:#fff;margin:0;text-align:center;padding:10px 0;position:relative;text-shadow:0 0 20px rgba(255,255,255,.9),0 0 40px rgba(255,255,255,.8),0 0 60px rgba(255,255,255,.7)}.darkmode #website-name{background:linear-gradient(to right,#ff5f6d,#ffc3a0);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block;text-shadow:none}.darkmode #website-name:hover{cursor:pointer}.darkmode .menu{display:flex;gap:30px}.darkmode .menu-item{position:relative;cursor:pointer;margin-right:40px;font-size:1.1rem;font-weight:500;color:#fff;transition:color .3s ease,transform .3s ease;text-transform:capitalize}.darkmode .menu-item:hover{color:#ff7043;transform:scale(1.1)}.darkmode .dropdown{position:absolute;top:100%;left:0;background-color:#333;border-radius:8px;min-width:110px;box-shadow:0 6px 15px #00000080;overflow:hidden;z-index:1000;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,visibility 0s linear .3s}.darkmode .dropdown a{display:block;padding:12px 20px;text-decoration:none;color:#e0e0e0;font-size:.9rem;font-weight:400;transition:background-color .3s ease,color .3s ease,padding-left .2s ease}.darkmode .dropdown a:hover{background-color:#ff7043;color:#fff;padding-left:25px}.darkmode .menu-item:hover .dropdown{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .3s ease,visibility 0s linear 0s}.darkmode .login-button{display:inline-block;margin-left:20px;background-color:coral;color:#fff;padding:10px 20px;text-align:center;border-radius:5px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:background-color .3s ease,transform .3s ease;text-decoration:none}.darkmode .login-button a{color:#fff;text-decoration:none}.darkmode .login-button:hover{background-color:#ff7043;transform:scale(1.05)}.darkmode .login-button:focus{outline:3px solid #ff7043}.lightmode-button{width:50px;height:50px;border-radius:50%;background:radial-gradient(circle,gold 40%,#ff8c00 70%,#ff8c0000 80%);border:none;box-shadow:0 0 15px #fc0,0 0 30px #fc09,0 0 50px #ffcc004d;cursor:pointer;position:relative;transition:all .3s ease-in-out,transform .2s ease;transform-style:preserve-3d;transform-origin:center;animation:earth-rotation-light 10s infinite linear}.lightmode-button:before{content:"";position:absolute;top:50%;left:50%;width:130%;height:130%;background:radial-gradient(circle,#ffcc004d 30%,#fc00 80%);border-radius:50%;transform:translate(-50%,-50%);z-index:-1;animation:pulse 2s infinite ease-in-out}.lightmode-button:hover{box-shadow:0 0 25px #fc0,0 0 50px #fc0c,0 0 75px #ffcc004d;transform:scale(1.1) rotateY(15deg)}.lightmode-button:active{background:radial-gradient(circle,#ffec80 40%,#ffae00 70%,#ff8c0000 80%);box-shadow:inset 0 0 15px #0000004d}.darkmode-button{width:50px;height:50px;border-radius:50%;background:radial-gradient(circle,silver 40%,#5a5a5a 70%,#5a5a5a00 80%);margin-left:25px;border:none;box-shadow:0 0 15px #b0b0b0,0 0 30px #b0b0b099,0 0 50px #b0b0b04d;cursor:pointer;position:relative;transition:all .3s ease-in-out,transform .2s ease;transform-style:preserve-3d;transform-origin:center;animation:earth-rotation-dark 10s infinite linear}.darkmode-button:before{content:"";position:absolute;top:50%;left:50%;width:120%;height:120%;background:radial-gradient(circle,#b0b0b04d 30%,#b0b0b000 80%);border-radius:50%;transform:translate(-50%,-50%);z-index:-1;animation:moon-pulse 2s infinite ease-in-out}@keyframes moon-pulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.15);opacity:.4}to{transform:translate(-50%,-50%) scale(1);opacity:.6}}@keyframes earth-rotation-dark{0%{transform:rotateY(0) rotateX(23deg)}to{transform:rotateY(360deg) rotateX(23deg)}}.darkmode-button:hover{box-shadow:0 0 20px #b0b0b0,0 0 40px #b0b0b0cc,0 0 75px #b0b0b04d;transform:scale(1.1) rotateY(15deg)}.darkmode-button:active{background:radial-gradient(circle,#e0e0e0 40%,#6a6a6a 70%,#5a5a5a00 80%);box-shadow:inset 0 0 15px #0000004d}.top-ranked-anime{padding:40px 20px;color:#fff;text-align:center;border-radius:10px;box-shadow:0 4px 10px #00000080;margin-top:40px;margin-bottom:40px;background:#1f1f1f}#website-into{max-width:900px;margin:0 auto;padding:20px;background:#000000b3;border-radius:8px;box-shadow:0 0 20px #0006}.top-ranked-anime p{font-family:Poppins,sans-serif;font-size:1rem;font-weight:100;line-height:1.6;color:#e0e0e0;margin:0;padding:0}@media (max-width: 768px){.top-ranked-anime{padding:20px 15px}.top-ranked-anime p{font-size:1.1rem}}.darkmode .main-titles{font-family:Poppins,sans-serif;font-size:2rem;font-weight:400;line-height:1.6;color:#e0e0e0;margin-top:80px;padding:0}.darkmode #top-five-anime{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;padding:40px 20px;border-radius:10px;color:#fff;text-align:center;box-shadow:0 4px 20px #00000040;background:#121212}.darkmode #top-five-anime .anime-card{background:#00000080;border-radius:8px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;position:relative;width:280px;height:350px;margin:10px;display:flex;flex-direction:column;justify-content:space-between}#top-five-anime .anime-card:hover{transform:scale(1.05);box-shadow:0 4px 15px #00000059}#top-five-anime .anime-card .anime-title{font-family:Poppins,sans-serif;font-size:1rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:1px;background:#00000080;border-radius:8px;position:absolute;bottom:0;width:100%;text-align:center;box-shadow:0 0 15px #0003}#top-five-anime .anime-card img{width:100%;height:auto;object-fit:cover;border-bottom:4px solid #ffffff;border-radius:8px 8px 0 0}@media (max-width: 768px){#top-five-anime{grid-template-columns:1fr 1fr}#top-five-anime .anime-card{max-width:100%}#top-five-anime .anime-title{font-size:1.2rem}}@media (max-width: 480px){#top-five-anime{grid-template-columns:1fr}#top-five-anime .anime-title{font-size:1rem}}#suggestion-form{max-width:600px;margin:40px auto 0;padding:30px;background-color:#333;border-radius:8px;box-shadow:0 4px 10px #00000080;font-family:Quicksand,Arial,sans-serif;color:#e0e0e0}#suggestion-form fieldset{border:1px solid #444444;border-radius:8px;padding:20px;margin-bottom:20px;background-color:#444}#suggestion-form legend{font-family:Poppins,sans-serif;font-size:1.1em;color:#e0e0e0;font-weight:700;margin-bottom:15px}#suggestion-form label{display:inline-block;margin-bottom:15px;font-size:1rem;color:#e0e0e0;padding-left:20px;cursor:pointer;position:relative;transition:color .3s ease}#suggestion-form input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background-color:#444;border:3px solid #ff7f50;position:relative;cursor:pointer;transition:background-color .3s ease,transform .3s ease}#suggestion-form input[type=radio]:checked:after{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;border-radius:50%;background-color:#fff;transform:translate(-50%,-50%)}#suggestion-form input[type=radio]:hover{background-color:#ff7043}#suggestion-form label:hover{color:#ff7043}#suggestion-form button{background-color:#121212;color:#fff;padding:12px 25px;border:none;border-radius:5px;font-size:1.1rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease;display:block;margin-top:20px;width:100%}.darkmode dialog{margin:0;font-family:Quicksand,Arial,sans-serif;background-color:#1f1f1f;color:#e0e0e0;line-height:1.6;transition:background-color .3s ease,color .3s ease}.darkmode dialog button{background-color:#121212;color:#fff;padding:12px 25px;border:none;border-radius:5px;font-size:1.1rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease;display:block;margin-top:20px;width:100%}.darkmode dialog button:hover{background-color:#ff7043;transform:scale(1.05)}.darkmode #render-zone{display:flex;margin-top:40px;gap:20px;padding:40px 20px;border-radius:10px;color:#fff;text-align:center;box-shadow:0 4px 20px #00000040;background:#1c1c1c;align-items:center;justify-content:center}.darkmode .anime-card{background:#00000080;border-radius:8px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;position:relative;width:280px;height:350px;margin:10px;display:flex;flex-direction:column;justify-content:space-between}.darkmode .anime-card:hover{transform:scale(1.05);box-shadow:0 4px 15px #00000059}.darkmode .anime-card .anime-title{font-family:Poppins,sans-serif;font-size:1rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:1px;background:#00000080;border-radius:8px;position:absolute;bottom:0;width:100%;text-align:center;box-shadow:0 0 15px #0003}.anime-card img{width:100%;height:auto;object-fit:cover;border-bottom:4px solid #ffffff;border-radius:8px 8px 0 0}body.lightmode{margin:0;font-family:Quicksand,Arial,sans-serif;background-color:#fff;color:#121212;line-height:1.6;transition:background-color .3s ease,color .3s ease}.lightmode .top-bar{display:flex;font-family:Poppins,sans-serif;justify-content:space-between;align-items:center;background:linear-gradient(145deg,#fff,#e0e0e0);color:#121212;padding:10px 40px;box-shadow:0 2px 6px #0000001a;position:sticky;top:0;z-index:1000;border-bottom:2px solid #ccc;transition:background-color .3s ease}.lightmode #website-name{font-family:Poppins,sans-serif;font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:5px;color:#121212;margin:0;text-align:center;padding:10px 0;position:relative;text-shadow:0 0 20px rgba(0,0,0,.3),0 0 40px rgba(0,0,0,.2),0 0 60px rgba(0,0,0,.1)}.lightmode #website-name{background:linear-gradient(to right,#ff5f6d,#ffc3a0);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block;text-shadow:none}.lightmode #website-name:hover{cursor:pointer}.lightmode .menu{display:flex;gap:30px}.lightmode .menu-item{position:relative;cursor:pointer;margin-right:40px;font-size:1.1rem;font-weight:500;color:#121212;transition:color .3s ease,transform .3s ease;text-transform:capitalize}.lightmode .menu-item:hover{color:#ff7043;transform:scale(1.1)}.lightmode .dropdown{position:absolute;top:100%;left:0;background-color:#e0e0e0;border-radius:8px;min-width:110px;box-shadow:0 6px 15px #00000080;overflow:hidden;z-index:1000;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,visibility 0s linear .3s}.lightmode .dropdown a{display:block;padding:12px 20px;text-decoration:none;color:#121212;font-size:.9rem;font-weight:400;transition:background-color .3s ease,color .3s ease,padding-left .2s ease}.lightmode .dropdown a:hover{background-color:#ff7043;color:#fff;padding-left:25px}.lightmode .menu-item:hover .dropdown{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .3s ease,visibility 0s linear 0s}.lightmode .login-button{display:inline-block;margin-left:20px;background-color:coral;color:#fff;padding:10px 20px;text-align:center;border-radius:5px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:background-color .3s ease,transform .3s ease;text-decoration:none}.lightmode .login-button a{color:#fff;text-decoration:none}.lightmode .login-button:hover{background-color:#ff7043;transform:scale(1.05)}.lightmode .login-button:focus{outline:3px solid #ff7043}.lightmode .lightmode-button{width:50px;height:50px;border-radius:50%;background:radial-gradient(circle,gold 40%,#ff8c00 70%,#ff8c0000 80%);border:none;box-shadow:0 0 15px #fc0,0 0 30px #fc09,0 0 50px #ffcc004d;cursor:pointer;position:relative;transition:all .3s ease-in-out,transform .2s ease;transform-style:preserve-3d;transform-origin:center;animation:earth-rotation-light 10s infinite linear}.lightmode .lightmode-button:before{content:"";position:absolute;top:50%;left:50%;width:130%;height:130%;background:radial-gradient(circle,#ffcc004d 30%,#fc00 80%);border-radius:50%;transform:translate(-50%,-50%);z-index:-1;animation:pulse 2s infinite ease-in-out}@keyframes pulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.5}to{transform:translate(-50%,-50%) scale(1);opacity:.8}}@keyframes earth-rotation-light{0%{transform:rotateY(0) rotateX(23deg)}to{transform:rotateY(360deg) rotateX(23deg)}}.lightmode .lightmode-button:hover{box-shadow:0 0 25px #fc0,0 0 50px #fc0c,0 0 75px #ffcc004d;transform:scale(1.1) rotateY(15deg)}.lightmode .lightmode-button:active{background:radial-gradient(circle,#ffec80 40%,#ffae00 70%,#ff8c0000 80%);box-shadow:inset 0 0 15px #0000004d}.lightmode .main-titles{font-family:Poppins,sans-serif;font-size:2rem;font-weight:400;line-height:1.6;color:#121212;margin-top:80px;padding:0}.lightmode p,.lightmode h2,.lightmode h3{color:#121212}.lightmode .top-ranked-anime{padding:40px 20px;color:#121212;text-align:center;border-radius:10px;box-shadow:0 4px 10px #0000001a;margin-top:40px;margin-bottom:40px;background:#f9f9f9}.lightmode #website-into{max-width:900px;color:#121212;margin:0 auto;padding:20px;background:#ffffffb3;border-radius:8px;box-shadow:0 0 20px #0000001a}.lightmode #top-five-anime{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-top:40px;padding:40px 20px;border-radius:10px;color:#121212;text-align:center;box-shadow:0 4px 20px #0000001a;background:#fff}.lightmode #top-five-anime .anime-card{background:#fffc;border-radius:8px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;position:relative;width:280px;height:350px;margin:0 auto;box-shadow:0 4px 15px #0000001a}.lightmode #top-five-anime .anime-card:hover{transform:scale(1.05);box-shadow:0 4px 15px #00000059}.lightmode #suggestion-form{max-width:600px;margin:40px auto 0;padding:30px;background-color:#f9f9f9;border-radius:8px;box-shadow:0 4px 10px #00000080;font-family:Quicksand,Arial,sans-serif;color:#121212}.lightmode #suggestion-form fieldset{border:1px solid #ffffff;border-radius:8px;padding:20px;margin-bottom:20px;background-color:#fff}.lightmode #suggestion-form legend{font-family:Poppins,sans-serif;font-size:1.1em;color:#121212;font-weight:700;margin-bottom:15px}.lightmode #suggestion-form label{display:inline-block;margin-bottom:15px;font-size:1rem;color:#121212;padding-left:20px;cursor:pointer;position:relative;transition:color .3s ease}.lightmode #suggestion-form input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background-color:#f9f9f9;border:3px solid #ff7f50;position:relative;cursor:pointer;transition:background-color .3s ease,transform .3s ease}#suggestion-form input[type=radio]:checked{background-color:coral}.lightmode #suggestion-form input[type=radio]:checked:after{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;border-radius:50%;background-color:#fff;transform:translate(-50%,-50%)}.lightmode #suggestion-form input[type=radio]:hover{background-color:#ff7043}.lightmode #suggestion-form label:hover{color:#ff7043}.lightmode #suggestion-form button{background-color:#fff;color:#121212;padding:12px 25px;border:none;border-radius:5px;font-size:1.1rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease;display:block;margin-top:20px;width:100%}#suggestion-form button:hover{background-color:#ff7043;transform:scale(1.05)}@media (max-width: 768px){#suggestion-form{padding:20px}#suggestion-form fieldset{padding:15px}#suggestion-form button{padding:12px}}dialog{margin:0;font-family:Quicksand,Arial,sans-serif;background-color:#fff;color:#121212;line-height:1.6;transition:background-color .3s ease,color .3s ease}dialog button{background-color:#fff;color:#121212;padding:12px 25px;border:none;border-radius:5px;font-size:1.1rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease;display:block;margin-top:20px;width:100%}.lightmode button:hover{background-color:#ff7043;transform:scale(1.05)}.lightmode #render-zone{display:flex;margin-top:40px;gap:20px;padding:40px 20px;border-radius:10px;color:#121212;text-align:center;box-shadow:0 4px 20px #00000040;background:#fff;align-items:center;justify-content:center}.lightmode .menu-item:focus,.darkmode .menu-item:focus{outline:3px dashed #ff7043;outline-offset:3px}.lightmode .dropdown,.darkmode .dropdown{transition:opacity .3s ease,visibility .5s ease .3s}html{transition:all .4s ease-in-out}@media (max-width: 1024px){.lightmode .menu,.darkmode .menu{align-items:center;margin-left:10px;gap:0px}#top-five-anime{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.lightmode #website-name,.darkmode #website-name{align-items:center;margin-left:-27px;gap:0px;font-size:1.2rem;font-weight:320}.lightmode .menu-item,.darkmode .menu-item{font-size:.7rem;margin-left:3px;margin-right:15px}.lightmode .username,.darkmode .username{font-size:.7rem;margin-left:5px;margin-right:10px}.lightmode .dropdown a,.darkmode .dropdown a{font-size:.65rem;font-weight:300}#top-five-anime{grid-template-columns:1fr}.anime-card{width:100%}.lightmode .login-button,.darkmode .login-button{padding:3px 8px;font-size:.6rem}}@media (max-width: 768px){.lightmode .login-button,.darkmode .login-button{padding:5px 10px;font-size:.8rem}.lightmode .lightmode-button,.darkmode-button,.darkmode .lightmode-button{width:25px;height:25px;margin-right:8px}}
