/* ----------------- 基础样式 ----------------- */
*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;}
body{background:linear-gradient(135deg,#1a237e 0%,#0c1445 100%);color:#fff;min-height:100vh;padding:20px;overflow-x:hidden;}
.container{max-width:1200px;margin:0 auto;}
header{text-align:center;padding:30px 0;margin-bottom:30px;position:relative;}
.logo{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:20px;}
h1{font-size:2.5rem;background:linear-gradient(45deg,#ff9a9e,#fad0c4,#a1c4fd);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:10px;line-height:1.3;}
.home-btn{position:absolute;top:20px;left:20px;background:linear-gradient(45deg,#00c6ff,#0072ff);color:white;padding:10px 20px;font-size:1rem;font-weight:bold;border-radius:50px;text-decoration:none;display:flex;align-items:center;gap:8px;box-shadow:0 4px 12px rgba(0,198,255,0.4);transition:transform 0.2s ease;z-index:10;}
.home-btn:hover{transform:translateY(-3px);}
.tabs{display:flex;justify-content:center;margin-bottom:30px;gap:20px;}
.tab-btn{background:rgba(255,255,255,0.1);border:none;color:white;padding:12px 25px;font-size:1.1rem;border-radius:50px;cursor:pointer;transition:all 0.2s ease;backdrop-filter:blur(10px);}
.tab-btn.active{background:linear-gradient(45deg,#ff6b6b,#ff8e53);box-shadow:0 5px 20px rgba(255,107,107,0.4);}
.tab-content{display:none;background:rgba(30,35,80,0.6);border-radius:15px;padding:30px;box-shadow:0 10px 30px rgba(0,0,0,0.4);backdrop-filter:blur(10px);min-height:600px;}
.tab-content.active{display:block;animation:fadeIn 0.3s ease;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
h2{font-size:1.8rem;margin-bottom:25px;color:#64feda;text-align:center;line-height:1.3;}

/* ----------------- 表单样式 ----------------- */
.form-group{margin-bottom:20px;}
label{display:block;margin-bottom:8px;font-weight:500;color:#a0b3ff;}
input,textarea,select{width:100%;padding:12px 15px;border-radius:10px;border:1px solid rgba(255,255,255,0.1);background:rgba(20,25,60,0.5);color:white;font-size:1rem;}
textarea{min-height:150px;resize:vertical;}

/* ----------------- 文件上传 & 图片预览 ----------------- */
.file-upload{display:flex;flex-direction:column;align-items:center;border:2px dashed rgba(255,255,255,0.2);border-radius:10px;padding:30px;text-align:center;cursor:pointer;min-height:180px;}
.file-upload i{font-size:3rem;color:#64feda;margin-bottom:15px;}
.preview-container{display:flex;flex-wrap:wrap;gap:15px;margin-top:20px;min-height:140px;}
.preview-item{width:120px;height:120px;border-radius:10px;overflow:hidden;position:relative;background:rgba(0,0,0,0.3);}
.preview-item img{width:100%;height:100%;object-fit:cover;}
.preview-item .remove{position:absolute;top:5px;right:5px;background:rgba(0,0,0,0.7);width:25px;height:25px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ff6b6b;}

/* ----------------- 提交按钮 ----------------- */
.submit-btn{background:linear-gradient(45deg,#00c6ff,#0072ff);color:white;padding:12px 25px;font-size:1.1rem;font-weight:bold;border-radius:50px;text-decoration:none;border:none;display:block;width:100%;margin-top:20px;cursor:pointer;box-shadow:0 4px 12px rgba(0,198,255,0.4);transition:transform 0.2s ease;}
.submit-btn:hover{transform:translateY(-3px);}

/* ----------------- BUG列表 ----------------- */
.bug-list{display:grid;gap:20px;min-height:500px;}
.bug-item{background:rgba(20,25,60,0.5);border-radius:15px;padding:20px;min-height:180px;}
.bug-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,0.1);}
.bug-title{font-size:1.3rem;font-weight:600;}
.bug-status{padding:5px 15px;border-radius:20px;font-size:0.9rem;font-weight:500;}
.status-new{background:rgba(255,107,107,0.2);color:#ff6b6b;}
.status-progress{background:rgba(255,206,86,0.2);color:#ffce56;}
.status-resolved{background:rgba(76,175,80,0.2);color:#4caf50;}
.bug-meta{display:flex;gap:20px;margin-bottom:15px;font-size:0.9rem;color:#a0b3ff;}
.bug-description{margin-bottom:15px;line-height:1.6;}
.bug-images{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px;}
.bug-image{width:100px;height:100px;border-radius:10px;overflow:hidden;background:rgba(0,0,0,0.3);aspect-ratio:1/1;}
.bug-image img{width:100%;height:100%;object-fit:cover;}
.no-bugs{text-align:center;padding:40px;color:#a0b3ff;font-size:1.1rem;}
.loading{text-align:center;padding:20px;color:#a0b3ff;min-height:100px;}
.loading i{font-size:2rem;margin-bottom:10px;animation:spin 1s linear infinite;}
@keyframes spin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}

/* ----------------- 通知 ----------------- */
.notification{position:fixed;top:20px;right:20px;padding:15px 25px;border-radius:10px;background:rgba(30,30,60,0.9);box-shadow:0 5px 15px rgba(0,0,0,0.3);backdrop-filter:blur(10px);z-index:1000;transform:translateX(120%);transition:transform 0.4s ease;display:flex;align-items:center;gap:10px;}
.notification.show{transform:translateX(0);}
.notification.success{border-left:4px solid #4caf50;}
.notification.error{border-left:4px solid #ff6b6b;}

/* ----------------- 分页 ----------------- */
.pagination{display:flex;justify-content:center;margin-top:20px;gap:10px;}
.page-btn{background:rgba(255,255,255,0.1);border:none;color:white;padding:8px 15px;border-radius:5px;cursor:pointer;}
.page-btn:disabled{opacity:0.5;cursor:not-allowed;}

/* ----------------- 响应式 ----------------- */
@media(max-width:768px){
    .tabs{flex-direction:column;gap:10px;}
    .tab-btn{width:100%;}
    .tab-content{padding:20px;}
    .bug-meta{flex-direction:column;gap:5px;}
    .notification{left:20px;right:20px;transform:translateY(-150%);}
    .notification.show{transform:translateY(0);}
    .home-btn{position:static;margin:15px auto;display:block;width:fit-content;}
    .preview-item{width:80px;height:80px;}
    .bug-image{width:80px;height:80px;}
}
