:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f7f7fb;background:#0f1218;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{background:#0d0324;min-height:100vh;margin:0}button,input{font:inherit}a{color:inherit;text-decoration:none}.app{max-width:1280px;min-height:100vh;margin:0 auto;padding-left:2rem;padding-right:2rem}@media screen and (width<=500px){.app{padding-left:1rem;padding-right:1rem}}.app--centered{justify-content:center;align-items:center;min-height:100vh;display:flex}.app__header{justify-content:space-between;align-items:center;gap:16px;width:100%;margin-bottom:32px;padding-top:1rem;padding-left:3rem;padding-right:3rem;display:flex}@media screen and (width<=500px){.app__header{padding-left:1rem;padding-right:1rem;font-size:.9rem}}.app__title{margin:0;font-size:1.8rem}.app__logo-link{display:inline-block;position:relative}.app__logo{width:34px;height:34px;transition:opacity 1s}@media screen and (width<=500px){.app__logo{width:32px;height:32px}}.app__logo--rotated{opacity:0;position:absolute;top:0;left:0}.app__logo-link:hover .app__logo--default{opacity:0}.app__logo-link:hover .app__logo--rotated{opacity:1}.app__user{background:#ffffff0a;border:1px solid #ffffff14;border-radius:18px;padding:16px 20px}.app__user-avatar{object-fit:cover;border-radius:50%;width:40px;height:40px}@media screen and (width<=500px){.app__user-avatar{width:36px;height:36px}}.app__info-block{flex-direction:column;align-items:center;display:flex}.app__info-block__title,.app__error{color:#adadc2;margin:20px 0}.app__error{color:#ff7a7a}.login-card{border-radius:24px;flex-direction:column;align-items:center;width:330px;height:400px;padding:60px 54px 54px;display:flex}@media screen and (width<=500px){.login-card{padding:60px 30px 30px;font-size:1.1rem}}.login-card__title,.search-page__title,.recommendations-page__title{border-bottom:1px solid #ffffff4d;margin:0 0 20px;padding-bottom:15px;font-size:1.2rem;font-weight:500}@media screen and (width<=500px){.login-card__title,.search-page__title,.recommendations-page__title{font-size:1.1rem}}.search-page__text,.recommendations-page__text{color:#bbc1d2;margin:0}.login-card__buttons{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.login-card__button{color:#fff;cursor:pointer;border:2px solid;border-radius:14px;justify-content:center;align-items:center;width:100%;height:40px;padding:14px 22px;transition:transform .18s,box-shadow .18s;display:inline-flex}.search-form{width:100%;max-width:500px;margin:24px 0;position:relative}.search-form__field{color:#f8f8ff;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:24px;width:100%;padding:10px 64px 12px 22px}.search-form__button{color:#b6b6b6;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;top:50%;right:18px;transform:translateY(-50%)}.search-form__button:hover{color:#fff;background:0 0}.login-card__button:hover{color:#000;background:#fff;position:relative;transform:translateY(-1px);box-shadow:0 8px 40px #5b66ff2e}.login-card__error{color:#ff8a8a;margin-top:16px}.anime-list{grid-template-columns:repeat(auto-fit,minmax(180px,180px));gap:1.25rem;display:grid}@media screen and (width<=768px){.anime-list{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}}@media screen and (width<=500px){.anime-list{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem .5rem}}@media screen and (width<=380px){.anime-list{gap:.5rem}}@media screen and (width<=300px){.anime-list{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.4rem}}.anime-card{flex-direction:column;gap:10px;min-height:320px;display:flex;overflow:hidden}@media screen and (width<=768px){.anime-card{gap:8px;min-height:280px}}@media screen and (width<=500px){.anime-card{gap:6px;min-height:260px}}@media screen and (width<=380px){.anime-card{gap:4px;min-height:200px}}.anime-card__image{background-position:50%;background-size:cover;border-radius:20px;height:17.5rem}@media (width<=768px){.anime-card__image{height:15rem}}@media (width<=500px){.anime-card__image{height:16rem}}@media (width<=380px){.anime-card__image{height:14rem}}.anime-card__title{text-align:center;white-space:nowrap;text-overflow:ellipsis;width:100%;margin:0;padding-left:5%;padding-right:5%;font-weight:400;overflow:hidden}@media (width<=768px){.anime-card__title{font-size:.9rem}}@media (width<=380px){.anime-card__title{font-size:.8rem}}.anime-card:hover{text-decoration:underline;transition:all .3s;transform:scale(1.01)}.anime-page{gap:48px;margin-top:24px;display:flex}@media screen and (width<=768px){.anime-page{flex-direction:column;gap:24px;margin-top:16px}.anime-page__poster{justify-content:center;display:flex}}.anime-page__poster img{object-fit:cover;border-radius:16px;width:16rem}@media screen and (width<=1024px){.anime-page__poster img{width:14rem}}@media screen and (width<=500px){.anime-page__poster img{width:12rem}}.anime-page__info{flex:1}.anime-page__title{margin:0 0 24px;font-size:2rem}@media screen and (width<=768px){.anime-page__title{text-align:center;margin-bottom:16px;font-size:1.7rem}}@media screen and (width<=500px){.anime-page__title{font-size:1.4rem}}.anime-page__meta{grid-template-columns:max-content 1fr;gap:12px 24px;margin-bottom:32px;display:grid}@media screen and (width<=768px){.anime-page__meta{grid-template-columns:1fr;gap:8px 16px;margin-bottom:24px}.anime-page__meta p:has(strong:contains("Описание")){display:block}.anime-page__meta p:has(strong:contains("Описание")) strong{margin-bottom:6px;display:block}}.anime-page__meta p{margin:0;display:contents}.anime-page__description{margin-bottom:32px}@media screen and (width<=768px){.anime-page__description{margin-bottom:24px}}.anime-page__description p{margin:0}.anime-page__description strong{color:#b6b6b6;margin-bottom:8px;font-weight:400;display:block}.anime-page__description p:last-child{color:#f7f7fb;line-height:1.5}.anime-page__meta strong{color:#b6b6b6;font-weight:400}.anime-page__meta span{color:#f7f7fb}.anime-page__rating{flex-direction:column;align-items:center;gap:16px;padding:10px 30px 30px;display:flex}.stars{gap:8px;margin:16px 0;display:flex}@media screen and (width<=425px){.stars{grid-template-columns:repeat(5,1fr);justify-items:center;gap:0 8px;display:grid}}.star{cursor:pointer;color:#a3a3a3;background:0 0;border:none;padding:0;font-size:34px;transition:color .2s,transform .15s}.star:hover{transform:scale(1.15)}.star--active{color:gold}.anime-page__save-btn{color:#fff;cursor:pointer;background:#e46ae6;border:none;border-radius:10px;padding:10px 20px;font-size:1rem;font-weight:450;transition:opacity .2s}.anime-page__save-btn:hover{transition:all .1s;scale:1.03}.anime-page__save-btn:disabled{color:#cacaca;cursor:not-allowed;background:#fd90ff6e}.footer{border-top:1px solid #ffffff14;justify-content:space-between;align-items:center;margin-top:48px;margin-left:20px;margin-right:20px;padding:24px 50px;display:flex}@media screen and (width<=500px){.footer{flex-direction:column;gap:16px;margin-top:32px;padding:20px 0}}.footer-left,.footer-right{align-items:center;gap:16px;display:flex}.footer-link{color:#b6b6b6;font-size:.9rem;transition:color .2s}.footer-icon{color:#fff;transition:color .2s,transform .2s}.footer-icon:hover{transform:scale(1.1)}.footer-icon--heart{color:#e46ae6}.footer-link:hover{color:#f7f7fb}.privacy-policy{max-width:800px;margin:0 auto;padding:40px 0}@media screen and (width<=500px){.privacy-policy{padding:24px 0}}.privacy-policy__title{margin-bottom:32px;font-size:2rem}@media screen and (width<=768px){.privacy-policy__title{margin-bottom:24px;font-size:1.7rem}}@media screen and (width<=500px){.privacy-policy__title{font-size:1.4rem}}.privacy-policy__section{margin-bottom:24px}.privacy-policy__section h2{color:#f7f7fb;margin-bottom:12px;font-size:1.2rem;font-weight:500}.privacy-policy__section p{color:#bbc1d2;margin:0 0 12px;line-height:1.6}.privacy-policy__section ul{color:#bbc1d2;margin:0 0 12px;padding-left:24px}.privacy-policy__section ul li{margin-bottom:8px}.privacy-policy__section a{color:#e46ae6;text-underline-offset:2px;text-decoration:underline}.privacy-policy__section a:hover{color:#f7f7fb}
