/* Compressed on 2026-04-07 22:51:09 */
.card{ background:var(--color-bg-white); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); overflow:hidden; transition:all var(--transition-base)} .card-header{ padding:var(--spacing-base) var(--spacing-lg); border-bottom:1px solid var(--color-border-light); display:flex; align-items:center; justify-content:space-between; background:var(--gradient-card)} .card-title{ font-size:var(--font-size-lg); font-weight:var(--font-weight-semibold); color:var(--color-text); margin:0; display:flex; align-items:center; gap:var(--spacing-sm)} .card-title::before{ content:''; width:4px; height:18px; background:var(--gradient-primary); border-radius:var(--radius-full)} .card-subtitle{ font-size:var(--font-size-sm); color:var(--color-text-muted); margin-top:var(--spacing-xs)} .card-body{ padding:var(--spacing-lg)} .card-footer{ padding:var(--spacing-base) var(--spacing-lg); border-top:1px solid var(--color-border-light); background:var(--gray-50); display:flex; align-items:center; justify-content:flex-end; gap:var(--spacing-sm)} .card-bordered{ border:1px solid var(--color-border); box-shadow:none} .card-flat{ box-shadow:none} .card-hover{ cursor:pointer} .card-hover:hover{ box-shadow:var(--shadow-md); transform:translateY(-4px); border-color:var(--color-primary-200)} .card-primary{ border-top:3px solid var(--color-primary)} .stat-card{ background:var(--color-bg-white); border-radius:var(--radius-lg); padding:var(--spacing-lg); box-shadow:var(--shadow-sm); position:relative; overflow:hidden; transition:all var(--transition-base)} .stat-card::before{ content:''; position:absolute; top:0; right:0; width:80px; height:80px; background:var(--gradient-primary); opacity:0.1; border-radius:0 0 0 100%} .stat-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px)} .stat-card .stat-icon{ width:48px; height:48px; border-radius:var(--radius-md); background:var(--gradient-primary); display:flex; align-items:center; justify-content:center; font-size:24px; color:var(--color-text-white); margin-bottom:var(--spacing-md); box-shadow:var(--shadow-primary)} .stat-card .stat-value{ font-size:var(--font-size-3xl); font-weight:var(--font-weight-bold); background:var(--gradient-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; line-height:1.2} .stat-card .stat-label{ font-size:var(--font-size-sm); color:var(--color-text-muted); margin-top:var(--spacing-xs)} .stat-card .stat-trend{ display:inline-flex; align-items:center; gap:var(--spacing-xs); font-size:var(--font-size-sm); margin-top:var(--spacing-sm); padding:var(--spacing-xs) var(--spacing-sm); border-radius:var(--radius-full)} .stat-card .stat-trend.up{ color:var(--color-success); background:var(--color-success-bg)} .stat-card .stat-trend.down{ color:var(--color-danger); background:var(--color-danger-bg)} .stats-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:var(--spacing-base); margin-bottom:var(--spacing-lg)} .card-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:var(--spacing-base)} .card-list{ display:flex; flex-direction:column; gap:var(--spacing-base)} .card-item{ background:var(--color-bg-white); border-radius:var(--radius-lg); padding:var(--spacing-base); box-shadow:var(--shadow-sm); display:flex; align-items:center; gap:var(--spacing-base); transition:all var(--transition-base)} .card-item:hover{ box-shadow:var(--shadow-md); transform:translateX(4px)} .card-item-icon{ width:48px; height:48px; border-radius:var(--radius-md); background:var(--gradient-primary); display:flex; align-items:center; justify-content:center; font-size:24px; color:var(--color-text-white); flex-shrink:0; box-shadow:var(--shadow-primary)} .card-item-content{ flex:1; min-width:0} .card-item-title{ font-size:var(--font-size-base); font-weight:var(--font-weight-semibold); color:var(--color-text); margin:0} .card-item-desc{ font-size:var(--font-size-sm); color:var(--color-text-muted); margin-top:var(--spacing-xs)} .card-item-actions{ display:flex; gap:var(--spacing-sm)} .card-media{ position:relative; overflow:hidden} .card-media img{ width:100%; height:auto; display:block; transition:transform var(--transition-slow)} .card-media:hover img{ transform:scale(1.05)} .card-media-overlay{ position:absolute; bottom:0; left:0; right:0; padding:var(--spacing-lg); background:linear-gradient(transparent,rgba(0,0,0,0.8)); color:var(--color-text-white)} .empty-card{ text-align:center; padding:var(--spacing-3xl); color:var(--color-text-muted)} .empty-card-icon{ font-size:64px; margin-bottom:var(--spacing-base); opacity:0.5; color:var(--color-primary-light)} .empty-card-title{ font-size:var(--font-size-lg); font-weight:var(--font-weight-semibold); color:var(--color-text); margin-bottom:var(--spacing-sm)} .empty-card-desc{ font-size:var(--font-size-sm); margin-bottom:var(--spacing-lg)} .settings-card{ background:var(--color-bg-white); border-radius:var(--radius-lg); padding:var(--spacing-lg); margin-bottom:var(--spacing-base); box-shadow:var(--shadow-sm)} .settings-card h3{ font-size:var(--font-size-md); font-weight:var(--font-weight-semibold); margin-bottom:var(--spacing-base); padding-bottom:var(--spacing-sm); border-bottom:1px solid var(--color-border-light); display:flex; align-items:center; gap:var(--spacing-sm)} .settings-card h3::before{ content:''; width:4px; height:16px; background:var(--gradient-primary); border-radius:var(--radius-full)} .feature-card{ background:var(--color-bg-white); border-radius:var(--radius-xl); padding:var(--spacing-xl); text-align:center; box-shadow:var(--shadow-sm); transition:all var(--transition-base); border:1px solid transparent} .feature-card:hover{ box-shadow:var(--shadow-lg); border-color:var(--color-primary-200); transform:translateY(-4px)} .feature-card-icon{ width:64px; height:64px; margin:0 auto var(--spacing-base); border-radius:var(--radius-lg); background:var(--gradient-primary); display:flex; align-items:center; justify-content:center; font-size:32px; color:var(--color-text-white); box-shadow:var(--shadow-primary)} .feature-card-title{ font-size:var(--font-size-lg); font-weight:var(--font-weight-semibold); color:var(--color-text); margin-bottom:var(--spacing-sm)} .feature-card-desc{ font-size:var(--font-size-sm); color:var(--color-text-muted); line-height:var(--line-height-relaxed)} .price-card{ background:var(--color-bg-white); border-radius:var(--radius-xl); padding:var(--spacing-xl); text-align:center; box-shadow:var(--shadow-md); position:relative; overflow:hidden} .price-card.featured{ border:2px solid var(--color-primary); transform:scale(1.05)} .price-card.featured::before{ content:'推荐'; position:absolute; top:16px; right:-32px; background:var(--gradient-primary); color:var(--color-text-white); padding:var(--spacing-xs) var(--spacing-2xl); font-size:var(--font-size-xs); font-weight:var(--font-weight-medium); transform:rotate(45deg)} .price-card .price-value{ font-size:var(--font-size-4xl); font-weight:var(--font-weight-bold); background:var(--gradient-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text} .price-card .price-unit{ font-size:var(--font-size-base); color:var(--color-text-muted)} @media (max-width:768px){ .stats-grid{ grid-template-columns:repeat(2,1fr)} .card-grid{ grid-template-columns:1fr} .stat-card .stat-value{ font-size:var(--font-size-2xl)} }