zm/tougao_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tijiao

Browse Source
This commit is contained in:
始于初见
2025-07-01 17:09:55 +08:00
parent b6f7cf7d3b
commit 2765edb0de
4 changed files with 668 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/common/langs/en.js
View File

@@ -468,6 +468,38 @@ const en = {
11: 'WeChat article publishing in progress...',
fail: 'WeChat article publishing failed',
unknown: 'Unknown status'
},
aiReview: {
Explain: 'Explain',
state0: 'Journal Scope Assessment',
state1: 'Journal Scope Explanation',
state2: 'Scientific and Innovative Assessment',
state3: 'Scientific and Innovative Explanation',
state4: 'Contradiction Assessment',
state5: 'Contradiction Explanation',
state6: 'Unreasonable Assessment',
state7: 'Unreasonable Explanation',
state8: 'Ethics Assessment',
state9: 'Ethics Explanation',
state10: 'Academic Misconduct Assessment',
state11: 'Academic Misconduct Explanation',
state12: 'Conclusion Assessment',
state13: 'Conclusion Explanation',
state14: 'Fund Number',
state15: 'Article Hotspot',
state16: 'Review Direction',
state17: 'AI Publishing Suggestion',
state18: 'Review Time',
state19: 'Reference Evaluation',
state20: 'Clinical registration number and informed consent assessment',
state191: 'Proportion of references from the past three years',
state192: 'Proportion of references from the past five years',
state193: 'Proportion of references from JCR Q1',
state194: 'Proportion of references from JCR Q2',
state21: 'Probability of article being cited',
}

29
src/components/common/langs/zh.js
View File

@@ -461,6 +461,35 @@ const zh = {
fail: '公微文章发布失败',
unknown: '状态未知'
},
aiReview: {
Explain: '解释',
state0: '期刊范围评估',
state1: '期刊范围解释',
state2: '科学性及创新性评估',
state3: '科学性及创新性解释',
state4: '矛盾评估',
state5: '矛盾解释',
state6: '不合理评估',
state7: '不合理解释',
state8: '伦理号评估',
state9: '伦理号解释',
state10: '学术不端评估',
state11: '学术不端解释',
state12: '结论的评估',
state13: '结论的解释',
state14: '基金号',
state15: '文章热点',
state16: '送审方向',
state17: 'AI发表建议',
state18: '审核时间',
state19: '参考文献评估',
state20: '临床注册号和知情同意书评估',
state191: '近三年参考文献的比例',
state192: '近五年参考文献的比例',
state193: '参考文献JCR1区比例',
state194: '参考文献JCR2区比例',
state21: '文章被引用概率',
}
}

343
src/components/page/articleDetailEditor.vue
View File

@@ -6,14 +6,45 @@
</el-breadcrumb>
</div>
<div class="container_state" v-loading="loading" style="margin: 10px 0 0 0">
<div style="margin-bottom: 10px; margin-top: 0px;overflow: hidden;" v-if="AIcontent!=''">
<img src="@/assets/img/ai.png" style="width: 30px; height: 30px; margin-right: 4px;float: left;margin-top: 10px;" />
<p class="beautiful-gradient"style="float: right;width: calc(100% - 40px);font-size: 13px;line-height: 16px;color: #1d45f2;" >{{ AIcontent }}</p>
<div style="margin-bottom: 10px; margin-top: 0px; overflow: hidden">
<!-- <p class="beautiful-gradient"style="float: right;width: calc(100% - 40px);font-size: 13px;line-height: 16px;color: #1d45f2;" >{{ AIcontent }}</p> -->
</div>
<el-row :gutter="30">
<el-col :span="16">
<div class="art_state_">
<div style="position: relative" v-if="currentArticleData.ai_review==''">
<img
src="@/assets/img/ai.png"
class="beautiful-gradient"
style="
opacity: 0.5;
width: 30px;
height: 30px;
margin-right: 4px;
position: absolute;
left: -18px;
top: -18px;
cursor: pointer;
"
@click="creatAI()"
/>
</div>
<div style="position: relative" v-else>
<img
src="@/assets/img/ai.png"
class="beautiful-gradient"
style="
width: 30px;
height: 30px;
margin-right: 4px;
position: absolute;
left: -18px;
top: -18px;
cursor: pointer;
"
@click="openAI()"
/>
</div>
<div class="art_state_message">
<div class="art_state_message_id" style="padding-left: 15px">
<font
@@ -153,7 +184,8 @@
<span style="color: #006699; font-weight: bold; margin-right: 10px"
>Field {{ i + 1 }}:</span
>{{ v.str
}}<i v-if="form.state==0"
}}<i
v-if="form.state == 0"
class="el-icon-delete-solid"
style="color: #f56c6c !important; margin-left: 10px"
@click="handleDeleteMajor(v)"
@@ -543,6 +575,81 @@
frameborder="0"
></iframe>
</el-drawer>
<el-dialog :title="$t('AI.AISummaryAnalysis')" :visible.sync="isShowAI" width="1100px" class="AIDialog">
<div class="AISummaryAnalysis">
<el-collapse class="auth_colla auth_collna_ew" style="margin-bottom: 10px; margin-top: -20px">
<el-collapse-item name="1">
<template slot="title">
Abstract
<font v-if="currentArticleData.keywords" style="margin-left: 3px">, Keywords</font>
</template>
<p>
<font>Abstract :</font><b>{{ currentArticleData.abstrart }}</b>
</p>
<p v-if="currentArticleData.keywords">
<font>Keywords :</font><b>{{ currentArticleData.keywords }}</b>
</p>
</el-collapse-item>
</el-collapse>
<div style="line-height: 20px" v-if="isShowAI">
<p class="beautiful-gradient1">
<span class="title" style="font-size: 18px; font-weight: 700">{{ $t('aiReview.state17') }}</span>
<span style="margin-top: 8px; display: block">{{ currentArticleData.ai_review['overall_evaluation'] }}</span>
</p>
<p style="overflow: hidden; margin-bottom: 8px">
<span style="float: right; color: #3830b9; margin-right: 8px"
>{{ this.$t('aiReview.state18') }} : {{ currentArticleData.ai_review['create_time'] }}</span
>
</p>
<p class="titleBox">
<span class="title" style="color: #fff; font-size: 16px">{{ $t('AI.AIAbstractInfo') }}</span>
</p>
<!-- {{ currentArticleData.ai_review }} -->
<el-form label-width="240">
<el-form-item label="``" v-for="(v, i) in aiReview">
<span slot="label" class="title" :style="v.color ? `color:${v.color}` : ''">
{{ `${i + 1}. ${v.topic} : ` }}
</span>
<div style="">
<div
style="color: #333; width: calc(100% - 180px); margin-left: 180px"
v-if="v.parameter && v.parameter.length > 0"
>
<div label="``" v-for="(item, index) in v.parameter">
<span class="title" style="" :style="item.color ? `color:${item.color}` : ''">
{{ `(${index + 1}) ${item.topic} : ` }}
</span>
<div style="">
<div style="color: #333">
{{ currentArticleData.ai_review[item.value] }}
<span v-if="item.explanationValue">
{{ currentArticleData.ai_review[item.explanationValue] }}
</span>
</div>
</div>
</div>
</div>
<div style="color: #333" v-else>{{ currentArticleData.ai_review[v.value] }}</div>
<div style="color: #888; line-height: 22px" v-if="v.explanationValue">
<span>{{ $t('aiReview.Explain') }} : </span> {{ currentArticleData.ai_review[v.explanationValue] }}
</div>
</div>
</el-form-item>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="isShowAI = false">取 消</el-button> -->
<el-button type="" @click="isShowAI = false">Close</el-button>
</span>
</el-dialog>
</div>
</template>
@@ -554,6 +661,8 @@ export default {
},
data() {
return {
isShowAI: false,
currentArticleData: {},
researchAreas: ['1'],
AIcontent: '',
previewData: {},
@@ -626,7 +735,7 @@ export default {
{
state: 6,
title: this.$t('artstate.state6')
},
}
// {
// state: 5,
// title: this.$t('artstate.state5')
@@ -672,19 +781,136 @@ export default {
},
Resubmitrules: {
journalId: [{ required: true, message: 'Please select the name of the journal to be forwarded to' }]
},
aiReview: [
{
topic: this.$t('aiReview.state0'),
value: 'journal_scope_assessment',
explanationValue: 'journal_scope_explanation'
},
{
topic: this.$t('aiReview.state2'),
value: 'attribute_assessment',
explanationValue: 'attribute_explanation'
},
{
topic: this.$t('aiReview.state4'),
value: 'contradiction_assessment',
explanationValue: 'contradiction_explanation'
},
{
topic: this.$t('aiReview.state6'),
value: 'unreasonable_assessment',
explanationValue: 'unreasonable_explanation'
},
{
topic: this.$t('aiReview.state8'),
value: 'ethics_assessment',
explanationValue: '',
parameter: [
{
topic: this.$t('aiReview.state8'),
value: 'ethics_assessment',
explanationValue: 'ethics_explanation'
},
{
topic: this.$t('aiReview.state20'),
value: 'registration_assessment',
explanationValue: ''
}
]
},
{
topic: this.$t('aiReview.state10'),
value: 'academic_assessment',
explanationValue: 'academic_explanation'
},
{
topic: this.$t('aiReview.state12'),
value: 'conclusion_assessment',
explanationValue: 'conclusion_explanation'
},
{
topic: this.$t('aiReview.state14'),
value: 'fund_number',
explanationValue: ''
},
{
topic: this.$t('aiReview.state15'),
value: 'hotspot',
explanationValue: ''
},
{
topic: this.$t('aiReview.state16'),
value: 'submit_direction',
explanationValue: ''
},
// {
// topic: this.$t('aiReview.state17'),
// value: 'overall_evaluation',
// explanationValue: ''
// },
{
topic: this.$t('aiReview.state19'),
value: 'create_time',
explanationValue: '',
color: 'rgb(0, 112, 192)',
parameter: [
{
topic: this.$t('aiReview.state191'),
value: 'references_past_three',
explanationValue: '',
color: 'rgb(0, 112, 192)'
},
{
topic: this.$t('aiReview.state192'),
value: 'references_past_five',
explanationValue: '',
color: 'rgb(0, 112, 192)'
},
{
topic: this.$t('aiReview.state193'),
value: 'references_ratio_JCR1',
explanationValue: '',
color: 'rgb(0, 112, 192)'
},
{
topic: this.$t('aiReview.state194'),
value: 'references_ratio_JCR2',
explanationValue: '',
color: 'rgb(0, 112, 192)'
}
]
},
{
topic: this.$t('aiReview.state21'),
value: 'cite_rate',
explanationValue: ''
}
// {
// topic: this.$t('aiReview.state18'),
// value: 'create_time',
// explanationValue: ''
// }
]
};
},
created: function () {
this.getAi();
this.initarticle();
async created() {
await this.initarticle();
await this.getAi();
this.initFileList();
this.getWordimgList();
this.getWordTablesList();
},
computed: {
// coverLetterUrl: function() {
// return this.baseUrl + this.form.coverLetter;
// },
@@ -742,16 +968,59 @@ export default {
}
},
methods: {
async getAi(){
var that = this;
async creatAI() {
const loading = this.$loading({
lock: true,
text: 'loading...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
await this.$api
.post('api/Aireview/get', {
article_id: this.$route.query.id
// api/Article/addArticle
.post('api/Aireview/review', {
article_id: this.editform.articleId
})
.then(async(res) => {
console.log('res at line 819:', res)
this.AIcontent = res.data.content?res.data.content:'';
if (res.status==1) {
loading.close();
await this.getAi()
await this.openAI();
}
})
.catch((err) => {
loading.close();
this.$message.error('Please click to view again in 1 minute in AI analysis');
});
},
openAI(data) {
this.isShowAI = true;
},
async getAi() {
await this.$api
// api/Article/addArticle
.post('api/Aireview/get', {
article_id: this.editform.articleId
// article_id: 6332
})
.then((res) => {
this.currentArticleData = {
abstrart: this.form.abstrart,
keywords: this.form.keywords,
ai_review: ''
};
if (res.data != null) {
this.currentArticleData.ai_review = res.data;
}
console.log('this.currentArticleData at line 1312:', this.currentArticleData);
})
.catch((err) => {
// this.$message.error('AI analysis failed');
});
},
async getWordimgList() {
@@ -1422,19 +1691,51 @@ export default {
}
.beautiful-gradient {
background: linear-gradient(135deg, #f0f9fe, #dce6ff, #d7e9fd);
/* background: linear-gradient(135deg, #f0f9fe, #dce6ff, #d7e9fd); */
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.01);
border-radius: 16px;
/* border-radius: 16px;
padding: 10px;
box-sizing: border-box;
color: #333;
font-family: "Segoe UI", sans-serif;
font-family: "Segoe UI", sans-serif; */
transition: transform 0.3s ease, box-shadow 0.3s ease;
border-radius: 30px;
}
.beautiful-gradient:hover {
transform: translateY(-4px);
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}
.AISummaryAnalysis .titleBox {
display: flex;
align-items: center;
justify-content: center;
background-color: #6157fd;
padding: 4px;
border-radius: 4px;
margin-bottom: 20px;
}
.AISummaryAnalysis div .title {
display: inline-block;
width: auto;
color: #6157fd;
/* font-weight: bold; */
}
::v-deep .AISummaryAnalysis .auth_collna_ew .el-collapse-item__header {
padding-left: 30px;
}
::v-deep .AISummaryAnalysis .el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
margin-bottom: 10px;
}.beautiful-gradient1 {
background: linear-gradient(135deg, #f0f9fe, #dce6ff, #d7e9fd);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.01);
border-radius: 10px;
padding: 10px 20px 10px 20px !important;
box-sizing: border-box;
color: #333;
font-family: 'Segoe UI', sans-serif;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border-radius: 30px;
}
</style>

285
src/components/page/articleListEditor_A.vue
View File

@@ -107,15 +107,17 @@
</p>
<div class="mangu_list" style="position: relative">
<img
class="beautiful-gradient"
v-if="item.ai_review != '' && item.ai_review"
src="@/assets/img/ai.png"
@click="openAI(item)"
style="cursor: pointer; width: 30px; height: 30px; position: absolute; right: 6px; top: 6px"
/>
<img
class="beautiful-gradient"
v-else
src="@/assets/img/ai.png"
@click="creatAI(item, ikgn)"
@click="getAi(item, ikgn)"
style="opacity: 0.5; cursor: pointer; width: 30px; height: 30px; position: absolute; right: 6px; top: 6px"
/>
<div>
@@ -1348,9 +1350,9 @@
</div>
</el-dialog>
<el-dialog :title="$t('AI.AISummaryAnalysis')" :visible.sync="isShowAI" width="50%" class="AIDialog">
<el-dialog :title="$t('AI.AISummaryAnalysis')" :visible.sync="isShowAI" width="1100px" class="AIDialog">
<div class="AISummaryAnalysis">
<el-collapse class="auth_colla auth_collna_ew" style="margin-bottom: 0">
<el-collapse class="auth_colla auth_collna_ew" style="margin-bottom: 10px; margin-top: -20px">
<el-collapse-item name="1">
<template slot="title">
Abstract
@@ -1365,14 +1367,61 @@
</el-collapse-item>
</el-collapse>
<p style="line-height: 20px">
<span>{{ $t('AI.AIAbstractInfo') }} :</span>
{{ currentArticleData.ai_review }}
<div style="line-height: 20px" v-if="isShowAI">
<p class="beautiful-gradient1">
<span class="title" style="font-size: 18px; font-weight: 700">{{ $t('aiReview.state17') }}</span>
<span style="margin-top: 8px; display: block">{{ currentArticleData.ai_review['overall_evaluation'] }}</span>
</p>
<p style="overflow: hidden; margin-bottom: 8px">
<span style="float: right; color: #3830b9; margin-right: 8px"
>{{ this.$t('aiReview.state18') }} : {{ currentArticleData.ai_review['create_time'] }}</span
>
</p>
<p class="titleBox">
<span class="title" style="color: #fff; font-size: 16px">{{ $t('AI.AIAbstractInfo') }}</span>
</p>
<!-- {{ currentArticleData.ai_review }} -->
<el-form label-width="240">
<el-form-item label="``" v-for="(v, i) in aiReview">
<span slot="label" class="title" :style="v.color ? `color:${v.color}` : ''">
{{ `${i + 1}. ${v.topic} : ` }}
</span>
<div style="">
<div
style="color: #333; width: calc(100% - 180px); margin-left: 180px"
v-if="v.parameter && v.parameter.length > 0"
>
<div label="``" v-for="(item, index) in v.parameter">
<span class="title" style="" :style="item.color ? `color:${item.color}` : ''">
{{ `(${index + 1}) ${item.topic} : ` }}
</span>
<div style="">
<div style="color: #333">
{{ currentArticleData.ai_review[item.value] }}
<span v-if="item.explanationValue">
{{ currentArticleData.ai_review[item.explanationValue] }}
</span>
</div>
</div>
</div>
</div>
<div style="color: #333" v-else>{{ currentArticleData.ai_review[v.value] }}</div>
<div style="color: #888; line-height: 22px" v-if="v.explanationValue">
<span>{{ $t('aiReview.Explain') }} : </span> {{ currentArticleData.ai_review[v.explanationValue] }}
</div>
</div>
</el-form-item>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="isShowAI = false">取 消</el-button> -->
<el-button type="primary" @click="isShowAI = false">Close</el-button>
<el-button type="" @click="isShowAI = false">Close</el-button>
</span>
</el-dialog>
<el-dialog
@@ -1568,6 +1617,135 @@ export default {
title: this.$t('artstate.state6')
}
],
aiReview: [
//1
{
topic: this.$t('aiReview.state0'),
value: 'journal_scope_assessment',
explanationValue: 'journal_scope_explanation'
},
//3
{
topic: this.$t('aiReview.state4'),
value: 'contradiction_assessment',
explanationValue: 'contradiction_explanation'
},
//4
{
topic: this.$t('aiReview.state6'),
value: 'unreasonable_assessment',
explanationValue: 'unreasonable_explanation'
},
//6
{
topic: this.$t('aiReview.state10'),
value: 'academic_assessment',
explanationValue: 'academic_explanation'
},
//8
{
topic: this.$t('aiReview.state14'),
value: 'fund_number',
explanationValue: ''
},
//9
{
topic: this.$t('aiReview.state15'),
value: 'hotspot',
explanationValue: ''
},
//10
{
topic: this.$t('aiReview.state16'),
value: 'submit_direction',
explanationValue: ''
},
//11
// {
// topic: this.$t('aiReview.state17'),
// value: 'overall_evaluation',
// explanationValue: ''
// },
//2
{
topic: this.$t('aiReview.state2'),
value: 'attribute_assessment',
explanationValue: 'attribute_explanation'
},
//5
{
topic: this.$t('aiReview.state8'),
value: 'ethics_assessment',
explanationValue: '',
parameter: [
{
topic: this.$t('aiReview.state8'),
value: 'ethics_assessment',
explanationValue: 'ethics_explanation'
},
{
topic: this.$t('aiReview.state20'),
value: 'registration_assessment',
explanationValue: ''
}
]
},
//7
{
topic: this.$t('aiReview.state12'),
value: 'conclusion_assessment',
explanationValue: 'conclusion_explanation'
},
//12
{
topic: this.$t('aiReview.state19'),
value: 'create_time',
explanationValue: '',
color: 'rgb(0, 112, 192)',
parameter: [
{
topic: this.$t('aiReview.state191'),
value: 'references_past_three',
explanationValue: '',
color: 'rgb(0, 112, 192)'
},
{
topic: this.$t('aiReview.state192'),
value: 'references_past_five',
explanationValue: '',
color: 'rgb(0, 112, 192)'
},
{
topic: this.$t('aiReview.state193'),
value: 'references_ratio_JCR1',
explanationValue: '',
color: 'rgb(0, 112, 192)'
},
{
topic: this.$t('aiReview.state194'),
value: 'references_ratio_JCR2',
explanationValue: '',
color: 'rgb(0, 112, 192)'
}
]
},
//13
{
topic: this.$t('aiReview.state21'),
value: 'cite_rate',
explanationValue: ''
}
// {
// topic: this.$t('aiReview.state18'),
// value: 'create_time',
// explanationValue: ''
// }
],
bankVisible: false,
majorData: {},
googleSearchInfo: ''
@@ -1652,32 +1830,70 @@ export default {
},
openAI(data) {
this.isShowAI = true;
this.currentArticleData = { ...data };
console.log('this.currentArticleData at line 1312:', this.currentArticleData);
this.$api
// api/Article/addArticle
.post('api/Aireview/get', {
article_id: data.article_id
// article_id: 6332
})
.then((res) => {
this.currentArticleData = { ...data, ai_review: res.data };
})
.catch((err) => {
loading.close();
this.$message.error('AI analysis failed');
});
},
creatAI(data, i) {
async getAi(data, i) {
const loading = this.$loading({
lock: true,
text: 'Loading...',
text: 'loading...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
console.log('data at line 1336:', data);
await this.$api
.post('api/Aireview/get', {
article_id: data.article_id
})
.then((res) => {
this.currentArticleData = {
...data,
ai_review: ''
};
if (res.data != null) {
this.tableData[i].ai_review = { ...res.data };
this.currentArticleData.ai_review = res.data;
loading.close();
this.isShowAI = true;
} else {
this.creatAI(data, i, loading);
}
console.log('this.currentArticleData at line 1312:', this.currentArticleData);
})
.catch((err) => {
loading.close();
// this.$message.error('AI analysis failed');
});
},
creatAI(data, i, loading) {
loading.text = 'In AI analysis, please be patient and wait...';
this.$api
// api/Article/addArticle
.post('api/Aireview/review', {
article_id: data.article_id
})
.then((res) => {
if (res.data.content) {
this.tableData[i].ai_review = res.data.content;
if (res.status == 1) {
this.tableData[i].ai_review = { ...res.data };
loading.close();
this.openAI({ ...data, ai_review: res.data.content });
this.openAI({ ...data, ai_review: { ...res.data } });
}
})
.catch((err) => {
loading.close();
this.$message.error('AI analysis failed');
this.$message.error('Please click to view again in 1 minute in AI analysis');
});
},
// 保存个人信息
@@ -3069,11 +3285,20 @@ export default {
padding-left: 10px;
box-sizing: border-box;
}
.AISummaryAnalysis p span {
.AISummaryAnalysis .titleBox {
display: flex;
align-items: center;
justify-content: center;
background-color: #6157fd;
padding: 4px;
border-radius: 4px;
margin-bottom: 20px;
}
.AISummaryAnalysis div .title {
display: inline-block;
width: auto;
color: #6157fd;
font-weight: bold;
/* font-weight: bold; */
}
::v-deep .AIDialog .el-dialog__body {
padding: 20px !important;
@@ -3095,6 +3320,15 @@ export default {
transition: transform 0.3s ease, box-shadow 0.3s ease !important; */
}
.beautiful-gradient {
/* background: linear-gradient(135deg, #f0f9fe, #dce6ff, #d7e9fd); */
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.01);
border-radius: 30px;
/* border-radius: 16px;
padding: 10px;
box-sizing: border-box;
color: #333;
font-family: "Segoe UI", sans-serif; */
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.beautiful-gradient:hover {
@@ -3135,4 +3369,19 @@ export default {
.mangu_list div.fi_new div > div:nth-child(1) {
margin-top: 0px;
}
::v-deep .AISummaryAnalysis .el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
margin-bottom: 10px;
}
.beautiful-gradient1 {
background: linear-gradient(135deg, #f0f9fe, #dce6ff, #d7e9fd);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.01);
border-radius: 10px;
padding: 10px 20px 10px 20px !important;
box-sizing: border-box;
color: #333;
font-family: 'Segoe UI', sans-serif;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border-radius: 30px;
}
</style>