       :root {
            --primary: #2563eb;
            --primary-light: #3b82f6;
            --primary-dark: #1d4ed8;
            --secondary: #f59e0b;
            --secondary-light: #fbbf24;
            --accent: #10b981;
            --light: #ffffff;
            --dark: #1e293b;
            --gray: #64748b;
            --light-gray: #f1f5f9;
            --border: #e2e8f0;
            
            
            --shadow: 0 4px 12px rgba(0,0,0,0.05);
            --card-shadow: 0 2px 8px rgba(0,0,0,0.08);
        }
        
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
        }
        
        a {text-decoration: none !important;}

	  	strong, b {font-weight: 600;}		
        
        body {
            background-color: #ffffff;
            color: #2D2D2D;
            line-height: 1.6;
            font-size: 15px;
            padding-bottom: 90px;
            overflow-x: hidden;
        }
        
        .container {
            max-width: 100%;
            overflow-x: hidden;
        }

        header {
            position: relative;
            color: white;
            padding: 15px;
            box-shadow: var(--shadow);
            z-index: 100;
            overflow: hidden;
            background: linear-gradient(135deg, var(--primary), var(--primary-light));
            box-shadow: 0 4px 12px rgba(30, 41, 59, 0.1);
        }

        .tech-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            opacity: 0.7;
        }
        
        .tech-element {
            position: absolute;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.1);
            animation: float 15s infinite linear;
        }
        
        .tech-element:nth-child(1) {
            width: 120px;
            height: 120px;
            top: -30px;
            left: -30px;
            animation-duration: 20s;
        }
        
        .tech-element:nth-child(2) {
            width: 80px;
            height: 80px;
            bottom: 20px;
            right: 10%;
            animation-duration: 15s;
            animation-direction: reverse;
        }
        
        .tech-element:nth-child(3) {
            width: 150px;
            height: 150px;
            top: 40%;
            right: -50px;
            animation-duration: 25s;
        }
        
        .tech-element:nth-child(4) {
            width: 60px;
            height: 60px;
            bottom: 50px;
            left: 20%;
            animation-duration: 12s;
            animation-direction: reverse;
        }
        
        @keyframes float {
            0% {
                transform: translate(0, 0) rotate(0deg);
            }
            25% {
                transform: translate(10px, 15px) rotate(90deg);
            }
            50% {
                transform: translate(20px, 5px) rotate(180deg);
            }
            75% {
                transform: translate(10px, -10px) rotate(270deg);
            }
            100% {
                transform: translate(0, 0) rotate(360deg);
            }
        }
        
        .top-bar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
            position: relative;
            z-index: 2;
        }
        
        .logo {
            font-size: 22px;
            font-weight: 700;
            display: flex;
            align-items: center;
        }
        
        .logo i {
            margin-right: 4px;
            font-size: 24px;
            
        }
        
        .logo .logo-image {
            display: inline-block;
            width: 100px; /* 根据实际图片比例调整 */
            height: 26px; /* 与原始文字高度匹配 */
            background: url(/yanyoubao/images/logo.svg) no-repeat center center;
            background-size: contain; /* 自适应容器 */
            text-indent: -9999px; /* 隐藏原始文字 */
            overflow: hidden;
        }        
        
        .user-actions i{
            color: white;
            margin-left: 15px;
            font-size: 18px;
        }
        
        .promo-banner {
            background: rgba(255,255,255,0.15);
            border-radius: 8px;
            padding: 10px 15px;
            text-align: center;
            margin-top: 10px;
            font-size: 14px;
            backdrop-filter: blur(4px);
            position: relative;
            z-index: 2;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }
        
        .promo-message {
            position: absolute;
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: opacity 0.5s ease-in-out;
        }
        
        .promo-message.active {
            opacity: 1;
        }
        
        .promo-message strong {
            color: #ffeb3b;
        }

        .slider-container {
            position: relative;
            width: calc(100% - 30px); 
            max-width: 400px;
            height: 200px; /* 固定高度 */
            margin: 15px auto;
            overflow: hidden;
            border-radius: 12px;
            box-shadow: var(--shadow);

        }
        
        /* 响应式调整轮播图高度 */
        @media (max-width: 768px) {
            .slider-container {
                height: calc(100vw * 200 / 400); /* 保持比例 */
                max-height: 200px;
            }
        }	
        
        .slider {
            display: flex;
            transition: transform 0.5s ease;
            height: 100%;
        }
        
        .slide {
   			 min-width: 100%;
            height: 100%;
            position: relative;
            border-radius: var(--radius);
            overflow: hidden;
        }

        .slide img {
        width: 100%;
            height: 100%;
            object-fit: cover; /* 关键属性 - 确保图片填充整个容器 */
            display: block;
            transition: transform 0.3s ease;
			
		    /* 禁用拖拽 */
            user-drag: none;
            -webkit-user-drag: none;
            user-select: none;
            -webkit-user-select: none;
			
        }
        
        .slide-content {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background: linear-gradient(transparent, rgba(0,0,0,0.7));
            color: white;
            padding: 12px 15px;
            font-size: 14px;
            display:none;
        }
        
        .slider-indicators {
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 6px;
        }
        
        .indicator {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: rgba(255,255,255,0.5);
            cursor: pointer;
            transition: all 0.3s ease;
        }
        
        .indicator.active {
            background: white;
            width: 20px;
            border-radius: 4px;
        }
		
        /* 主要内容区域 */
        .section {
	
		background: linear-gradient(
			to left bottom, 
			#fff3e5 0%, 
			#fff3e5 0px,      /* 右上角保持 #fff3e5 */
			#ffffff 110px,      /* 渐变到白色 */
			#ffffff calc(100% - 10px),  /* 接近左下角时保持白色 */
			#fff3e5 100%       /* 左下角恢复 #fff3e5 */
		);

            border-radius: 12px;
            margin: 15px;
            box-shadow: var(--shadow);
            overflow: hidden;
        }
        
        .section-header {
            padding: 15px;
            border-bottom: 1px solid var(--light-gray);
            font-weight: 600;
            color: var(--dark);
            display: flex;
            align-items: center;
            font-size: 17px;
        }
        
        .section-header i {
            color: var(--primary);
            margin-right: 8px;
            font-size: 18px;
        }
        
        .section-content {
            padding: 15px;
        }
        
        .info-item {
            display: flex;
            margin-bottom: 12px;
            padding-bottom: 12px;
            border-bottom: 1px dashed var(--light-gray);
        }
        
        .info-item:last-child {
            border-bottom: none;
            margin-bottom: 0;
            padding-bottom: 0;
        }
        
        .info-icon {
            color: var(--primary);
            font-size: 18px;
            margin-right: 10px;
            min-width: 24px;
            paddingt-top:5px;
        }
        
        .info-text strong {
            color: var(--dark);
            display: block;
            margin-bottom: 3px;
            font-size:14px;
        }
		
        /* 新增标签容器样式 */
        .info-tags-container {
            display: flex;
            justify-content: space-between;
            margin-top: 10px;
        }
        
        .info-tag {
            display: flex;
            align-items: center;
            font-size: 12px;
            background: #f0f7ff;
            color: #3b82f6;
            padding: 5px 10px;
            border-radius: 20px;
            transition: all 0.2s ease;
            border: 1px solid #f0f7ff;

        }
        
        .info-tag:hover {
            transform: translateY(-2px);
            box-shadow: var(--card-shadow);
            background: #e1effe;
			border: 1px solid #dbeafe;
        }
        
        .info-tag i {
            margin-right: 5px;
            font-size: 12px;
        }		
        
        /* 哨兵元素 */
        #tabs-sentinel {
            height: 0;
            position: relative;
            z-index: 1;
        }
        
        /* 可滚动导航标签 */
        .tabs-container {
            position: sticky;
            top: 0;
            z-index: 90;
            background: white;
            border-bottom: 1px solid var(--light-gray);
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            white-space: nowrap;
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            margin-bottom:20px;
        }
        
        .tabs-container.sticky {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            animation: slideDown 0.3s ease-out;
            box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        }
        
        @keyframes slideDown {
            0% { transform: translateY(-100%); }
            100% { transform: translateY(0); }
        }
        
        .tabs-container::-webkit-scrollbar {
            display: none;
        }
        
        .tabs {
            display: flex;
            min-width: 100%;
        }
        
        .tab {
            flex: 0 0 auto;
            padding: 15px 20px;
            font-size: 15px;
            color: var(--gray);
            position: relative;
            transition: all 0.3s;
            font-weight: 500;
            text-align: center;
            width: 33.333%;
            min-width: 100px;
        }
        
        .tab.active {
            color: var(--primary);
            font-weight: 600;
        }
        
        .tab.active::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 60%;
            height: 5px;
            background: var(--primary);
            border-radius: 3px;
            animation: underline 0.3s ease-out forwards;
        }
        
        @keyframes underline {
            0% {
                width: 0%;
            }
            100% {
                width: 60%;
            }
        }
        
        .tab-content {
            display: none;
        }
        
        .tab-content.active {
            display: block;
        }
        
        /* 内容卡片 - 优化折叠动画 */
        .card {
            background: white;
            border-radius: 12px;
            margin: 0 15px 15px;
            overflow: hidden;
            box-shadow: var(--card-shadow);
            border: 1px solid var(--light-gray);
            transition: all 0.3s ease;
        }
        .card:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
        }        
        .card-header {
            padding: 15px 15px 15px 20px;
            background: linear-gradient(to bottom, #ecf7fd, #ffffff);

            color: var(--primary);
            display: flex;
            align-items: center;
            cursor: pointer;
            transition: all 0.3s;
            font-size: 15px;
            position: relative; 
           font-weight:600;
        }
        
        .card-header:hover {
            background-color: #edf5ff;
        }

        .card-header span {
            font-weight:700;
        }
        
        .card-indicator {
            margin-right: 10px;
            position: static;
            top: auto;
            left: auto;
            transform: none; 
            margin-right: 12px;
            padding-top:3px;
            transition: transform 0.3s ease;
        }
        
        .card-header.active .card-indicator {
            transform: rotate(90deg);
        }
        
        .card-content {
            padding: 15px;
            max-height: 2000px;
            overflow: hidden;
            transition: max-height 0.5s ease, padding 0.3s ease;
            background: white;
            text-align: justify;
            font-size:14px;
        }
        
        .card-content.closed {
            padding: 0 15px;
            max-height: 0;
            transition: max-height 0.3s ease, padding 0.3s ease;
        }
        
        .card-content p {
            color: var(--gray);
            line-height: 1.7;
            padding: 0 5px;
        }
        
        .card-content ul {
            padding-left: 17px;
            list-style-type: none;
        }
        
        .card-content li {
            position: relative;
            color: var(--gray);
            line-height: 1.8;
            margin-bottom: 10px;
            transition: all 0.3s;
            padding-left: 10px;
        }
		
 		/* 添加美观的圆形标记 */
       .card-content li::before {
            content: '';
            position: absolute;
            left: -10px;
            top: 10px;
            width: 8px;
            height: 8px;
            background-color: var(--primary);
            border-radius: 50%;
        }
        
        .important-note {
            background: #fff9e6;
            border-left: 5px solid #ffc107;
            padding: 12px 15px;
            margin: 15px 0 5px 0;
            border-radius: 0 7px 7px 0;
            font-size: 14px;
        }
        
        .resource-list a {
            display: flex;
            padding: 12px 0 12px 5px;
            border-bottom: 1px solid var(--light-gray);
            text-decoration: none;
            align-items: center;
            color: var(--gray);
            transition: all 0.3s ease;
        }
		
        .resource-list a:hover {
            font-weight:500;
        }		
        
        .resource-list a:last-child {
            border-bottom: none;
        }
        
        .resource-list a i {
            margin-right: 8px;
            color: var(--accent);
        }

		/* 特殊提示样式 */
		.special-note {
			background: #F0F8FF; /* 浅蓝色背景 */
			border-radius: 12px;
			padding: 10px 15px; /* 左右间距15px */
			margin: 15px 5px 10px 5px; /* 与上文相同的左右间距 */
			display: flex;
			align-items: flex-start;
			font-size: 12px; /* 文字大小12px */
		   color: var(--gray);
			line-height: 1.6;
		}
		
		.special-note i {
			margin-right: 10px;
		   color: var( --primary-light);
			font-size: 14px; /* 图标稍大于文字 */
			flex-shrink: 0;
			margin-top: 4px; /* 微调垂直对齐 */
		}

        /* 用户评价区域 */
        .reviews-container {
            margin: 0px 15px;
			
        }
        
        .reviews-header {
            display: flex;
            align-items: center;
            margin:0 20px 15px 20px;
            justify-content: space-between;
			
        }
        
        .reviews-header h3 {
            font-size: 18px;
            color: var(--primary);
        }
        
        .rating {
            display: flex;
            align-items: center;

        }
        
        .stars {
            color: #ffc107;
            margin-right: 5px;
        }
        
        .rating-value {
            font-weight: bold;
            color: var(--dark);
        }
        
        .review-card {

			
		 background: linear-gradient(to bottom, 
			#ecf7fd 0%, 
			#ecf7fd 10px,  /* 前 10px 是纯色 ecf7fd */
			#ffffff 50px,  /* 从 10px 开始直接变成白色 */
			#ffffff 100%   /* 保持白色到底部 */
		  );			
			
            border-radius: 12px;
            padding: 15px;
            margin-bottom: 15px;
            box-shadow: var(--card-shadow);
            border: 1px solid var(--light-gray);
            transition: all 0.3s ease;
        }
        
        .review-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
        }        
        
        .review-header {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
			
        }
        
        .avatar {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: linear-gradient(45deg, var(--primary), var(--primary-light));
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: bold;
            font-size: 18px;
            margin-right: 12px;
            flex-shrink: 0;
        }
        
        .reviewer-info {
            flex: 1;
        }
        
        .reviewer-name {
            font-weight: 600;
            color: var(--dark);
        }
        
        .review-time {
            font-size: 12px;
            color: var(--gray);
			font-weigt:600;
        }
        
        .review-content {
            color: var(--gray);
            line-height: 1.6;
            font-size: 12px;
        }
        
        .review-stars {
            color: #ffc107;
            margin-top: 8px;
            font-size: 14px;
        }
		.loading-indicator{
            text-align: center;
            padding: 20px;
            color: var(--gray);
			font-size:14px;			
		}
        
        /* 数据看板区域 */
        .dashboard {
            padding: 0 15px 15px;
        }
        
        .stats-container {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 15px;
            margin-bottom: 20px;
        }
        
        .stat-card {
		 background: linear-gradient(to bottom, 
			#ecf7fd 0%, 
			#ecf7fd 10px,  /* 前 10px 是纯色 ecf7fd */
			#ffffff 50px,  /* 从 10px 开始直接变成白色 */
			#ffffff 100%   /* 保持白色到底部 */
		  );	
            border-radius: 12px;
            padding: 15px;
            text-align: center;
            box-shadow: var(--card-shadow);
            border: 1px solid var(--light-gray);
            transition: all 0.3s ease;
        }
        
        .stat-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
        }
        
        .stat-icon {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: var(--light-gray);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 10px;
            color: var(--primary);
            font-size: 20px;
        }
        
        .stat-value {
            font-size: 22px;
            font-weight: 700;
            color: var(--primary);
            margin: 5px 0;
        }
        
        .stat-label {
            font-size: 13px;
            color: var(--gray);
        }
        
        .chart-container {
            		 background: linear-gradient(to bottom, 
			#ecf7fd 0%, 
			#ecf7fd 10px,  /* 前 10px 是纯色 ecf7fd */
			#ffffff 50px,  /* 从 10px 开始直接变成白色 */
			#ffffff 100%   /* 保持白色到底部 */
		  );	
            border-radius: 12px;
            padding: 15px;
            margin-top: 15px;
            box-shadow: var(--card-shadow);
            border: 1px solid var(--light-gray);
            transition: all 0.3s ease;
        }
        
        .chart-container:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
        }
        
        .city-rankings {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }
        
        .city-item {
            display: flex;
            align-items: center;
            padding: 10px 15px;
        }
        
        .city-rank {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background: var(--primary);
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            margin-right: 6px;
            flex-shrink: 0;
        }
        
        .city-name {
            min-width: 50px;
            font-weight: 500;
            flex-shrink: 0;
        }
        
        .city-bar {
            flex: 1;
            height: 10px;
            background: var(--light-gray);
            border-radius: 5px;
            overflow: hidden;
            margin: 0 10px;
        }
        
        .city-progress {
            height: 100%;
            background: linear-gradient(90deg, var(--primary-light), var(--primary));
            border-radius: 5px;
        }
        
        .city-value {
            min-width: 70px;
            text-align: right;
            font-weight: 600;
            color: var(--primary);
            font-size: 14px;
        }
        
        .cities-container {
            display: flex;
            justify-content: space-around;
            margin-top: 20px;
        }
        
        .city-circle {
            display: flex;
            flex-direction: column;
            align-items: center;
			transition: transform 0.3s ease;
        }
		
		.city-circle:hover {
			transform: translateY(-5px);
		}		
        
        .city-badge {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--primary), var(--primary-light));
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight:700;
            margin-bottom: 8px;
            font-size: 14px;
			box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        
        .city-label {
            font-size: 12px;
            color: var(--dark);
            font-weight: 500;
			text-align: center;
			line-height: 1.4;			
        }
		
        /* 页脚按钮区域 */
        .footer-buttons {
            display: flex;
            gap: 12px;
            padding: 15px;
            background: white;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
            z-index: 100;
        }
        
        .footer-btn {
            flex: 1;
            padding: 14px;
            text-align: center;
            border-radius: 12px;
            font-weight: 600;
            font-size: 16px;
            border: none;
            transition: all 0.2s;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }
        
        .btn-query {
            background: linear-gradient(to right, var(--primary), var(--primary-light));
            color: white;
            box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
        }
        
        .btn-access {
            background: linear-gradient(to right, var(--secondary), var(--secondary-light));
            color: white;
            box-shadow: 0 4px 10px rgba(245, 158, 11, 0.3);
        }
        
        .footer-btn:hover {
            opacity: 0.92;
            transform: translateY(-2px);
        }
        
        /* 页脚 */
        footer {
            background: white;
            padding: 15px 0 10px;
            margin-top: 20px;
        }
        
        .footer-links {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            font-size: 12px;
            color: var(--gray);
            padding: 0 15px;
            gap: 10px;
        }
        
        .footer-links a {
            color: var(--gray);
            text-decoration: none;
            white-space: nowrap;
        }
        
        .footer-links a:hover {
            color: var(--primary);
            text-decoration: underline;
        }
        
        .copyright {
            text-align: center;
            font-size: 12px;
            color: var(--gray);
            padding: 15px 15px 0;
            margin-top: 10px;
            border-top: 1px solid var(--light-gray);
        }
        
        /* 响应式调整 */
        @media (max-width: 360px) {
            .footer-btn {
                font-size: 14px;
                padding: 12px;
            }
            
            .section-header {
                font-size: 16px;
            }
            
            .card-header {
                padding: 12px;
                font-size: 15px;
            }
            
            .tab {
                padding: 15px 15px;
                font-size: 14px;
            }
        }
        
        /* 动画效果 */
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }
        
        .card, .stat-card, .chart-container, .review-card {
            animation: fadeIn 0.5s ease-out;
        }

		 /* 热门院校 */
       .chart-container {
            
            border-radius: 12px;
            padding: 15px;
            margin-top: 15px;
            box-shadow: var(--card-shadow);
            border: 1px solid var(--light-gray);
            transition: all 0.3s ease;
        }
        
        .chart-container:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.08);
        }

        .chart-title {
            font-size: 15px;
            font-weight: 600;
            margin:10px 0 20px 0;
            color: var(--dark);
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .chart-title i {
            color: var(--primary);
            margin-right: 8px;
        }
        
        /* 热门院校排行榜样式 */
        .school-rankings {
            display: flex;
            flex-direction: column;
            gap: 10px;
            max-height: 400px;
            overflow-y: auto;
            padding-right: 5px;
        }
        
        .school-item {
            display: flex;
            align-items: center;
            padding: 10px 15px;
            background: var(--light-gray);
            border-radius: 8px;
            transition: all 0.3s ease;
        }
        
        .school-item:hover {
            background: #e0e7ff;
            transform: translateX(5px);
        }
        
        .school-rank {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            margin-right: 12px;
            flex-shrink: 0;
            font-size: 13px;
        }
        
        /* 前3名特殊样式 */
        .school-rank.top1 {
            background: linear-gradient(135deg, #ffd700, #ff9800);
            color: #fff;
            box-shadow: 0 2px 5px rgba(255, 152, 0, 0.3);
        }
        
        .school-rank.top2 {
            background: linear-gradient(135deg, #c0c0c0, #9e9e9e);
            color: #fff;
            box-shadow: 0 2px 5px rgba(158, 158, 158, 0.3);
        }
        
        .school-rank.top3 {
            background: linear-gradient(135deg, #cd7f32, #a97142);
            color: #fff;
            box-shadow: 0 2px 5px rgba(169, 113, 66, 0.3);
        }
        
        .school-rank.other {
            background: linear-gradient(135deg, var(--primary-light), var(--primary));
            color: white;
        }
        
        .school-name {
            flex: 1;
            font-weight: 500;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            min-width: 100px;
        }
        
        .school-bar {
            flex: 2;
            height: 10px;
            background: var(--light-gray);
            border-radius: 5px;
            overflow: hidden;
            margin: 0 10px;
        }
        
        .school-progress {
            height: 100%;
            border-radius: 5px;
            min-width: 10%;
        }
        
        /* 不同排名的不同进度条颜色 */
        .progress-top1 {
            background: linear-gradient(90deg, #ffd700, #ff9800);
        }
        
        .progress-top2 {
            background: linear-gradient(90deg, #c0c0c0, #9e9e9e);
        }
        
        .progress-top3 {
            background: linear-gradient(90deg, #cd7f32, #a97142);
        }
        
        .progress-other {
            background: linear-gradient(90deg, var(--primary-light), var(--primary));
        }
        
        .school-value {
            min-width: 70px;
            text-align: right;
            font-weight: 600;
            font-size: 14px;
            color: var(--primary);
        }
        
        /* 滚动条样式 */
        .school-rankings::-webkit-scrollbar {
            width: 6px;
        }
        
        .school-rankings::-webkit-scrollbar-track {
            background: var(--light-gray);
            border-radius: 10px;
        }
        
        .school-rankings::-webkit-scrollbar-thumb {
            background: var(--primary);
            border-radius: 10px;
        }


		/* 分页样式 */
		.pagination{
			display: flex;
			justify-content: center;
			align-items: center;
			margin-top: 30px;
			padding: 20px 0;
			gap: 10px;
			flex-wrap: wrap;
		}
		
		.pagination a {
			min-width: 40px;
			height: 30px;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 0 15px;
			border-radius: 6px;
			background: linear-gradient(to bottom, #ecf7fd, #ffffff);
			border: 1px solid var(--border);
			color: var(--gray);
			font-weight: 600;
			transition: all 0.3s ease;
			box-shadow: var(--shadow);
			text-decoration: none;
		}
		
		.pagination a:hover {
			transform: translateY(-3px);
			box-shadow: 0 4px 8px rgba(0,0,0,0.1);
			background: linear-gradient(to bottom, #d8edfd, #f0f8ff);
			color: var(--primary-dark);
		}
		
		.pagination a.active {
			background: linear-gradient(135deg, var(--primary), var(--primary-light));
			color: white;
			border-color: var(--primary);
		}
		
		.pagination a.disabled {
			opacity: 0.5;
			cursor: not-allowed;
			pointer-events: none;
		}     

        /* 真实评价数量样式 - 优化后 */
        .review-count {
            position: relative;
            display: inline;
            font-size: 10px;
            color: #888;
            margin-left: 5px;

        }
        
        .tab-content {
            display: none;
        }
        
        .tab-content.active {
            display: block;
        }

	   /* 1. 数据看台优化 */
		.province-rankings {
			display: flex;
			flex-direction: column;
			gap: 12px;
		}
		
		.province-item {
			display: flex;
			align-items: center;
			padding: 10px 15px;
		}
		
		.province-rank {
			width: 28px;
			height: 28px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-weight: bold;
			margin-right: 12px;
			flex-shrink: 0;
			font-size: 13px;
			background: linear-gradient(135deg, var(--primary-light), var(--primary));
			color: white;
		}
		
		.province-name {
			min-width: 70px;
			font-weight: 500;
			flex-shrink: 0;
		}
		
		.province-bar {
			flex: 1;
			height: 10px;
			background: var(--light-gray);
			border-radius: 5px;
			overflow: hidden;
			margin: 0 10px;
		}
		
		.province-progress {
			height: 100%;
			background: linear-gradient(90deg, var(--primary-light), var(--primary));
			border-radius: 5px;
		}
		
		.province-value {
			min-width: 70px;
			text-align: right;
			font-weight: 600;
			color: var(--primary);
			font-size: 14px;
		}


      	/* 图禁用保存 */
        .image-protection {
            position: relative;
            width: 100%;
            height: 100%;
        }
		
        /* 图禁用保存 */
        .protection-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0); 
            z-index: 2;
        }		

		/* 辅助按钮样式 */
		
		.button-container {
			display: flex;
			justify-content: left;
			gap: 20px;
			margin:25px 0 15px 0;
			flex-wrap: wrap;
		}
		
		.btn-style-1 {
			padding: 7px 15px;
			border: none;
			border-radius: 5px;
			background: linear-gradient(to right, rgba(37, 99, 235, 0.1), rgba(37, 99, 235, 0.05));
			color: var(--primary);
			font-size: 14px;
			font-weight: 500;
			transition: all 0.3s ease;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 8px;
			box-shadow: 0 1px 2px rgba(0,0,0,0.05);
		}
		
		.btn-style-1:hover {
			background: linear-gradient(to right, rgba(37, 99, 235, 0.15), rgba(37, 99, 235, 0.1));
			transform: translateY(-1px);
			box-shadow: 0 2px 4px rgba(0,0,0,0.1);
		}

/* 查询记录切换 */
#info-content{position:relative;height:22px;line-height:22px;overflow:hidden}
.jilu_item{position:absolute;top:0;left:0;width:100%;opacity:0;transition:opacity 0.8s ease-in-out;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#1e293b;font-size:12px}
.jilu_item.active{opacity:1;position:relative}
.jilu_item img{width:20px;height:20px;border-radius:50%;margin-right:10px;vertical-align:middle;filter:blur(1px)}
.jilu_item span{vertical-align:middle}
.jilu_item_baoguo{display:inline-block;width:20px;height:20px;border-radius:50%;overflow:hidden;vertical-align:middle;margin-right:10px}
@keyframes fadeIn{from{opacity:0}
to{opacity:1}
}.info-text-updating{animation:fadeIn 0.8s ease-in-out}
.jilu_item span:not(.time-ago) + span:not(.time-ago)::before{content:"";display:inline-block;width:1px;height:6px;background-color:#e2e8f0;margin:0 10px;vertical-align:middle;position:relative;top:-0.5px}

 /* 下划线样式 */
.underline-1{position:relative;display:inline}
.underline-1::after{content:'';position:absolute;left:0;bottom:-4px;width:100%;height:3px;background:linear-gradient(to right,var(--secondary),var(--secondary-light));border-radius:3px}

/*插件25订单滚动*/	  
#dingdan-container1{max-width:100%;margin:10px auto}
.gundong-data-container{height:300px;overflow:hidden;position:relative;background:#fff;border-radius:8px}
.gundong-scroll-inner{position:absolute;top:0;left:0;width:100%;animation:gundong-scroll linear infinite}
.gundong-slide-item{display:flex;align-items:center;height:60px;padding:0 15px;box-sizing:border-box}
.gundong-slide-item:nth-child(odd){background:#FFF}
.gundong-slide-item:nth-child(even){background:#f8fafd}
.gundong-content-box{display:flex;width:100%;gap:12px;align-items:center}
.gundong-avatar{width:28px;height:28px;border-radius:50%;border:1px solid var(--light-gray);flex-shrink:0;filter: blur(2px);}
.gundong-info-main{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.gundong-card-type,.gundong-school{display:block;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gundong-card-type{font-size:12px;color:#ababab}
.gundong-school{font-size:12px;color:var(--dark);font-weight:600}
.gundong-info-right{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;gap:4px;margin-left:auto;margin-top:5px}
.gundong-city,.gundong-time{display:block;margin:0;white-space:nowrap}
.gundong-city{font-size:10px;color:#ffffff;background:var(--primary);border-radius:2px;padding:1px 3px;display:block}
.gundong-time{font-size:12px;color:#ababab}
.gundong-no-data{color:#7a6e6e;font-size:14px;padding:0 20px;text-align:center;width:100%}
@keyframes gundong-scroll{0%{transform:translateY(0)}
100%{transform:translateY(-50%)}
}

#dingdan-container{position:relative;user-select:none;-webkit-user-select:none;-ms-user-select:none}
#dingdan-container::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;pointer-events:all;z-index:9999}

#jilu-container{position:relative;user-select:none;-webkit-user-select:none}
#jilu-container::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;pointer-events:all}
#jilu-container img{-webkit-user-drag:none;user-drag:none;pointer-events:none}	

/*底部导航及右侧悬浮*/
.bottom-nav{position:fixed;bottom:0;left:0;width:100%;height:70px;box-shadow: 0 -2px 10px rgba(0,0,0,0.1);;background:#F0F8FF;border-top-left-radius:20px;border-top-right-radius:20px;display:flex;justify-content:space-around;align-items:center;z-index:500;border:1px solid var(--light-gray)}
.bottom-nav .nav-item{flex:1;text-align:center;font-size:13px;color:var(--dark);transition:color 0.3s ease,font-weight 0.3s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 0}
.bottom-nav .nav-item.active{color:#0288D1;}
.bottom-nav .nav-item i{display:block;width:20px;height:20px;margin-bottom:4px;background-color:#81D4FA;-webkit-mask-size:20px 20px;mask-size:20px 20px;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transition:background-color 0.3s ease}
.bottom-nav .nav-item.active i{background-color:#0288D1}
.nav-home i{-webkit-mask:url('/yanyoubao/images/hang1.png') no-repeat center;mask:url('/yanyoubao/images/hang1.png') no-repeat center}
.nav-query i{-webkit-mask:url('/yanyoubao/images/hang2.png') no-repeat center;mask:url('/yanyoubao/images/hang2.png') no-repeat center}
.nav-auth i{-webkit-mask:url('/yanyoubao/images/hang3.png') no-repeat center;mask:url('/yanyoubao/images/hang3.png') no-repeat center}
.nav-reward i{-webkit-mask:url('/yanyoubao/images/hang4.png') no-repeat center;mask:url('/yanyoubao/images/hang4.png') no-repeat center}
.nav-my i{-webkit-mask:url('/yanyoubao/images/hang5.png') no-repeat center;mask:url('/yanyoubao/images/hang5.png') no-repeat center}

.float-btn{position:fixed;right:15px;bottom:15%;background:rgba(0,0,0,0.7);border-radius:4px;overflow:hidden;font-size:12px;color:#fff;transition:all 0.3s;z-index: 150;}
.float-btn a{color:#fff;text-decoration:none}
.float-btn .float-item{padding:8px;text-align:center;}
.float-btn .float-item:not(:first-child){border-top:1px solid rgba(255,255,255,0.3)}
.float-detail span{display:block;line-height:1.2}
.float-toggle{padding:8px;text-align:center;border-bottom:1px solid rgba(255,255,255,0.3)}
.float-btn.collapsed .float-content{display:none}
.float-top{display:none;background-image:url('/yanyoubao/images/dingbu.png');background-repeat:no-repeat;background-position:center;background-size:16px 16px;width:auto;height:30px;margin:0 auto}	
		
/*版权*/	
.foot{font-size:10px;color:#e0e0e0;text-align:center;width:100%;line-height:20px;padding-top:30px;float:left;margin:30px auto 100px auto;position:relative}
.foot a{color:#e0e0e0;text-decoration:none}	