*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,'Microsoft YaHei',sans-serif;background:#eef2f7;min-height:100vh}
.container{max-width:430px;margin:0 auto;padding:15px;min-height:100vh;background:#f5f7fa;position:relative;overflow-y:auto;scrollbar-width:none}
@media(min-width:500px){
body{display:flex;align-items:center;justify-content:center;padding:32px;background:
radial-gradient(1200px 520px at 50% -5%,rgba(255,255,255,.96),rgba(255,255,255,0) 60%),
linear-gradient(180deg,#f8fbff 0%,#eef3f9 48%,#e8eef6 100%)}
.container{width:min(430px,100%);height:min(880px,calc(100vh - 64px));min-height:760px;max-height:calc(100vh - 64px);box-shadow:0 36px 90px rgba(31,41,55,.12),0 14px 32px rgba(99,102,241,.08),0 1px 0 rgba(255,255,255,.9) inset;border-radius:32px;margin:0;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(245,247,250,.98));scrollbar-width:thin;scrollbar-color:#b7c2d3 transparent;border:1px solid rgba(255,255,255,.96);overflow-y:auto;overflow-x:hidden;padding:18px 14px 18px 16px;position:relative;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.container::before,.container::after{content:none !important;display:none !important}
.container::-webkit-scrollbar{width:8px;display:block}
.container::-webkit-scrollbar-track{background:rgba(148,163,184,.10);border-radius:999px}
.container::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#c1cad8,#9aa8bd);border-radius:999px;border:1px solid rgba(255,255,255,.5)}
.container::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#aeb9ca,#8593ab)}
.header{border-radius:16px;box-shadow:0 10px 24px rgba(102,126,234,.14)}
.card{border-radius:16px;box-shadow:0 10px 24px rgba(15,23,42,.06),0 1px 0 rgba(255,255,255,.82) inset;border:1px solid rgba(240,244,248,.95)}
.school-card{border-radius:16px;box-shadow:0 8px 20px rgba(15,23,42,.05);border:1px solid rgba(235,238,245,.92)}
.float-btn{box-shadow:0 12px 28px rgba(64,158,255,.24)}
}


.header{text-align:center;padding:20px 15px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:12px;margin-bottom:15px}
.header h1{font-size:24px;margin:0;display:inline}
.brand-row{display:flex;align-items:center;justify-content:center;gap:12px;line-height:1}
.brand-logo img{height:54px;width:54px;object-fit:cover;border-radius:50%;background:rgba(255,255,255,.2);padding:2px}
.brand-placeholder{font-size:12px;color:rgba(255,255,255,.6);border:2px dashed rgba(255,255,255,.4);border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;font-weight:500;flex-shrink:0}
.card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 12px rgba(0,0,0,.08);margin-bottom:15px}
.form-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:15px}
.form-item{flex:1;min-width:120px}
.form-item label{display:block;margin-bottom:6px;font-size:13px;color:#666}
.form-item input,.form-item select{width:100%;padding:10px;border:1px solid #e4e7ed;border-radius:8px;font-size:14px}
/* 自动补全样式 */
.autocomplete-wrapper{position: relative}
.autocomplete-input{flex: 1;padding: 10px;border: 1px solid #e4e7ed;border-radius: 8px;font-size: 14px;box-sizing: border-box}
.autocomplete-list{position: absolute;top: 100%;left: 0;right: 0;background: #fff;border: 1px solid #e4e7ed;border-radius: 8px;box-shadow: 0 4px 12px rgba(0,0,0,.15);max-height: 300px;overflow-y: auto;z-index: 100;display: none}
.autocomplete-list.show{display: block}
.autocomplete-list .option{padding: 10px 14px;cursor: pointer;transition: background .2s;font-size: 14px}
.autocomplete-list .option:hover{background: #f5f7fa; color: #409eff}
.autocomplete-list .option.active{background: #ecf5ff; color: #409eff}
.btn{width:100%;padding:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:15px;cursor:pointer;font-weight:500}
.btn:hover{opacity:.9}
.btn:disabled{opacity:.6;cursor:not-allowed}
.btn-outline{background:#fff;color:#667eea;border:1px solid #667eea}
.stats{display:flex;justify-content:space-around;padding:15px;background:#f5f7fa;border-radius:8px;margin-bottom:15px}
.stat-value{font-size:24px;font-weight:700;color:#409eff}
.stat-label{font-size:12px;color:#909399}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.filter-btn{padding:6px 14px;border:1px solid #dcdfe6;border-radius:20px;background:#fff;cursor:pointer;font-size:13px;transition:all .2s}
.filter-btn.active{background:#409eff;color:#fff;border-color:#409eff}
.school-card{border:1px solid #ebeef5;border-radius:12px;margin-bottom:12px;overflow:hidden;position:relative;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.school-header{display:flex;align-items:flex-start;padding:14px;background:linear-gradient(to right,#fafbfc,#f5f7fa)}
.school-logo{width:56px;height:56px;border-radius:10px;background:#fff;margin-right:14px;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.1)}
.school-logo img{width:100%;height:100%;object-fit:cover}
.school-logo .placeholder{font-size:24px}
.school-title{flex:1}
.school-title h3{font-size:16px;margin-bottom:6px;color:#303133;display:flex;align-items:center;gap:8px}
.school-title h3 .score-badge{font-size:13px;font-weight:600;color:#fff;background:linear-gradient(135deg,#409eff,#67c23a);padding:2px 8px;border-radius:12px}
.school-title .major{font-size:14px;color:#606266;margin-bottom:6px}
.school-title .admission-code{font-size:13px;color:#909399;margin-bottom:6px}
.school-tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{padding:3px 10px;border-radius:6px;font-size:12px;font-weight:500}
.tag-green{background:#e1f3d8;color:#67c23a}
.tag-orange{background:#fdf6ec;color:#e6a23c}
.tag-blue{background:#ecf5ff;color:#409eff}
.tag-purple{background:#f4e4ff;color:#a855f7}
.tag-gray{background:#f4f4f5;color:#909399}
.school-body{padding:14px;background:#fff}
.info-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:12px}
@media(min-width:768px){.info-grid{grid-template-columns:repeat(4,1fr);gap:6px}}
.info-item{text-align:center;padding:6px 4px;background:#f9fafc;border-radius:4px;min-width:max-content}
.info-item .label{font-size:10px;color:#909399;margin-bottom:2px;white-space:nowrap;overflow:visible;text-align:center}
.info-item .value{font-size:11px;font-weight:600;color:#303133;white-space:nowrap;overflow:visible;text-align:center}
.info-item .value.highlight{color:#409eff}
.school-desc{font-size:11px;color:#a0a0a0;line-height:1.4;padding:6px 8px;background:#fafbfc;border-radius:4px;white-space:normal;word-break:break-all}
.school-actions{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #f0f0f0;background:#fafbfc}
.action-btn{flex:1;padding:8px;border:1px solid #409eff;background:#fff;color:#409eff;border-radius:6px;cursor:pointer;font-size:13px;text-decoration:none;text-align:center}
.action-btn:hover{background:#409eff;color:#fff}
.action-btn.primary{background:#409eff;color:#fff}
.action-btn.success{background:#67c23a;color:#fff;border-color:#67c23a}
.lock-mask{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.95);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10}
.locked{filter:blur(4px)}
.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:100}
.modal-content{background:#fff;padding:25px;border-radius:12px;width:90%;max-width:360px;text-align:center}
.modal-content input{width:100%;padding:12px;border:1px solid #ddd;border-radius:8px;margin-bottom:12px;font-size:15px}
.empty{text-align:center;padding:40px;color:#909399}
.badge{display:inline-block;padding:2px 6px;background:#f56c6c;color:#fff;border-radius:10px;font-size:11px;margin-left:5px}
.float-btn{position:fixed;bottom:20px;right:20px;width:60px;height:60px;background:linear-gradient(135deg,#67c23a,#409eff);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:0 4px 12px rgba(0,0,0,.2);cursor:pointer;z-index:50}
@media(min-width:500px){.float-btn{right:calc(50% - 215px + 26px);bottom:calc((100vh - min(880px, calc(100vh - 48px))) / 2 + 26px);z-index:60}}

/* 加载动画 */
.loading-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 0}
.loading-spinner{width:36px;height:36px;border:3px solid #e4e7ed;border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{color:#909399;font-size:13px;margin-top:12px}

/* 详情弹窗 */
.detail-modal{max-width:420px;max-height:85vh;overflow-y:auto;padding:0;text-align:left}
.detail-close{position:absolute;top:10px;right:14px;font-size:18px;color:#999;cursor:pointer;z-index:2;background:none;border:none;padding:5px}
.detail-close:hover{color:#333}
.detail-header{display:flex;align-items:flex-start;padding:16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:12px 12px 0 0}
.detail-header .school-logo{width:52px;height:52px;border-radius:10px;background:rgba(255,255,255,.2);margin-right:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.detail-header .school-logo img{width:100%;height:100%;object-fit:cover}
.detail-header .school-logo .placeholder{font-size:22px}
.detail-title h3{font-size:17px;margin-bottom:4px}
.detail-title .detail-major{font-size:13px;opacity:.85;margin-bottom:6px}
.detail-title .school-tags .tag{background:rgba(255,255,255,.2);color:#fff}
.detail-body{padding:14px 16px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.detail-item{background:#f9fafc;border-radius:8px;padding:10px}
.detail-label{font-size:11px;color:#909399;margin-bottom:3px}
.detail-value{font-size:14px;font-weight:600;color:#303133}
.detail-value.highlight{color:#409eff}
.detail-section{margin-bottom:10px}
.detail-section-title{font-size:13px;font-weight:600;color:#303133;margin-bottom:6px}
.detail-section-body{font-size:12px;color:#666;line-height:1.6;background:#f9fafc;border-radius:8px;padding:10px}
.detail-footer{display:flex;gap:8px;padding:12px 16px;border-top:1px solid #f0f0f0}
.detail-footer .btn{flex:1;padding:10px;font-size:13px}
    }
    .detail-title {
        text-align: center;
    }
    .detail-info {
        grid-template-columns: 1fr;
    }
}

/* 移动端详情页优化 */
@media (max-width: 480px) {
    .detail-modal {
        width: calc(100vw - 20px);
        max-height: 95vh;
        padding: 0;
    }
    .detail-close {
        top: 8px;
        flex-wrap: wrap;
        justify-content: center;
        gap: 5px;
    }
    .school-tags .tag {
        font-size: 11px;
        padding: 2px 6px;
    }
    .detail-body {
        padding: 15px;
    }
    .detail-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .detail-item {
        padding: 8px;
    }
    .detail-label {
        font-size: 11px;
    }
    .detail-value {
        font-size: 14px;
    }
    .detail-footer {
        flex-direction: row;
        padding: 12px;
        gap: 10px;
    }
    .detail-footer .btn {
        flex: 1;
        padding: 12px;
        font-size: 14px;
    }
    .detail-section {
        margin-top: 10px;
    }
    .detail-section-title {
        font-size: 14px;
    }
    .detail-section-body {
        font-size: 13px;
        line-height: 1.5;
    }
}

/* 移动端详情页 */
@media (max-width: 480px) {
    .detail-modal {
        width: calc(100vw - 30px);
        margin: 15px;
    }
    .detail-header .school-logo {
        width: 48px;
        height: 48px;
    }
    .detail-title h3 {
        font-size: 15px;
    }
    .detail-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .detail-footer {
        flex-direction: row;
        gap: 10px;
    }
    .detail-footer .btn {
        flex: 1;
    }
}

/* 拖拽样式 */
.drag-item{user-select:none;-webkit-user-select:none;touch-action:none}
.drag-item.dragging{box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:10}


.container::-webkit-scrollbar{display:none}
@media(min-width:500px){.container::-webkit-scrollbar{display:block}}


/* 排名增强样式 */
.rank-tab{flex:1;padding:10px 12px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.12);color:rgba(255,255,255,.92);border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.rank-tab:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}
.rank-active{background:linear-gradient(135deg,#ffd54f,#ffb300);color:#4a3200;border-color:rgba(255,213,79,.9);box-shadow:0 6px 18px rgba(255,179,0,.28)}
.rank-pill{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.18);font-size:12px}
.rank-panel{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:12px}
.rank-table th{font-weight:600;opacity:.88}
.rank-table td,.rank-table th{padding:7px 4px}
.rank-empty{padding:18px 10px;text-align:center;color:rgba(255,255,255,.72);font-size:13px}
@media (max-width:480px){.rank-tab{font-size:12px;padding:9px 8px}}