/* npi-dashboard 页 npi-hero 模块样式（自 page-npi-dashboard.css 按业务边界抽出） */
.npi-dashboard-redesign .hero {
		padding: var(--wk-space-4) 0 var(--wk-space-3); background: linear-gradient(135deg, var(--wk-blue-light) 0%, var(--wk-gray-bg) 50%, var(--wk-surface) 100%);
		position: relative; overflow: hidden;
	}
.npi-dashboard-redesign .hero::before {
		content: ''; position: absolute; top: -200px; right: -200px; width: 600px; height: 600px;
		background: radial-gradient(circle, var(--wk-blue-tint-xs) 0%, transparent 70%);
		border-radius: var(--wk-radius-circle);
	}
.npi-dashboard-redesign .hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wk-space-4xl); align-items: center; position: relative; }
@media(max-width:900px) {
.npi-dashboard-redesign .hero-grid { grid-template-columns: 1fr; gap: var(--wk-space-3xl); }
}
.npi-dashboard-redesign .hero-badge {
		display: inline-flex; align-items: center; gap: var(--wk-space-sm);
		background: var(--primary-light); color: var(--primary-text);
		padding: var(--wk-space-sm) var(--wk-space-lg); border-radius: var(--wk-radius-20); font-size: var(--wk-text-sm); font-weight: 600; margin-bottom: var(--wk-space-1);
	}
.npi-dashboard-redesign .hero h1 { font-size: var(--wk-text-h1); line-height: 1.3; color: var(--dark); margin-bottom: var(--wk-space-lg); font-weight: 800; }
.npi-dashboard-redesign .hero h1 .highlight { color: var(--primary-text); }
.npi-dashboard-redesign .hero-sub { font-size: var(--wk-text-lg); color: var(--text-secondary); margin-bottom: var(--wk-space-3xl); line-height: var(--wk-leading); }
.npi-dashboard-redesign .hero-ctas { display: flex; gap: var(--wk-space-lg); flex-wrap: wrap; }
.npi-dashboard-redesign .btn-primary {
		background: var(--primary); color: var(--wk-white); padding: var(--wk-space-lg) var(--wk-space-3xl); border-radius: var(--radius-sm);
		font-size: var(--wk-text-body); font-weight: 600; border: none; cursor: pointer; transition: all .2s;
		display: inline-flex; align-items: center; gap: var(--wk-space-sm);
	}
.npi-dashboard-redesign .btn-primary:hover { background: var(--primary-dark); transform: translateY(-1px); box-shadow: 0 6px 20px var(--wk-blue-tint-lg); }
.npi-dashboard-redesign .btn-secondary {
		background: var(--wk-surface); color: var(--primary-text); padding: var(--wk-space-lg) var(--wk-space-3xl); border-radius: var(--radius-sm);
		font-size: var(--wk-text-body); font-weight: 600; border: 2px solid var(--primary); cursor: pointer; transition: all .2s;
		display: inline-flex; align-items: center; gap: var(--wk-space-sm);
	}
.npi-dashboard-redesign .btn-secondary:hover { background: var(--primary-light); }
.npi-dashboard-redesign .hero-preview {
		background: var(--wk-surface); border-radius: var(--radius); box-shadow: var(--card-shadow-hover);
		padding: var(--wk-space-2xl); border: 1px solid var(--border);
	}
.npi-dashboard-redesign .preview-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--wk-space-lg); }
.npi-dashboard-redesign .preview-title { font-weight: 700; font-size: var(--wk-text-body); }
.npi-dashboard-redesign .preview-tag { background: var(--success); color: var(--wk-white); font-size: var(--wk-text-xs); padding: var(--wk-space-xs) var(--wk-space-md); border-radius: var(--wk-radius-12); }
.npi-dashboard-redesign .preview-board-label { font-size: var(--wk-text-xs); font-weight: 700; color: var(--primary-text); letter-spacing: 2px; margin-bottom: var(--wk-space-xs); }
.npi-dashboard-redesign .preview-bars { display: flex; flex-direction: column; gap: var(--wk-space-md); }
.npi-dashboard-redesign .preview-bar-row { display: flex; align-items: center; gap: var(--wk-space-md); }
.npi-dashboard-redesign .preview-bar-label { font-size: var(--wk-text-xs); color: var(--text-secondary); width: 70px; flex-shrink: 0; }
.npi-dashboard-redesign .gantt-axis { display: flex; align-items: center; gap: var(--wk-space-md); margin-bottom: var(--wk-space-md); }
.npi-dashboard-redesign .gantt-axis-label { width: 70px; flex-shrink: 0; font-size: var(--wk-text-xs); color: var(--text-secondary); }
.npi-dashboard-redesign .gantt-axis-cells { flex: 1; display: grid; grid-template-columns: repeat(8,1fr); }
.npi-dashboard-redesign .gantt-axis-cells span { font-size: var(--wk-text-xs); color: var(--text-secondary); padding-left: var(--wk-space-sm); border-left: 1px solid var(--border); }
.npi-dashboard-redesign .gantt-axis-cells span:first-child { border-left: none; padding-left: var(--wk-space-xs); }
.npi-dashboard-redesign .gantt-track { flex: 1; position: relative; height: 18px; background: var(--gray-bg); border-radius: var(--wk-radius-4); background-image: repeating-linear-gradient(to right, transparent 0, transparent calc(12.5% - 1px), var(--border) calc(12.5% - 1px), var(--border) 12.5%); }
.npi-dashboard-redesign .gantt-bar { position: absolute; top: 2px; bottom: 2px; border-radius: var(--wk-radius); background: var(--wk-border-soft); border: 1px solid var(--wk-border-mid); overflow: hidden; }
.npi-dashboard-redesign .gantt-done { height: 100%; border-radius: var(--wk-radius); }
.npi-dashboard-redesign .gantt-bar--p1 { left: 0%; width: 12.5%; }
.npi-dashboard-redesign .gantt-bar--p2 { left: 12%; width: 25%; }
.npi-dashboard-redesign .gantt-bar--p3 { left: 37%; width: 25%; }
.npi-dashboard-redesign .gantt-bar--p4 { left: 62%; width: 25%; }
.npi-dashboard-redesign .gantt-bar--p5 { left: 81%; width: 19%; }
.npi-dashboard-redesign .gantt-done--full { width: 100%; background: var(--wk-success); }
.npi-dashboard-redesign .gantt-done--mid { width: 75%; background: var(--wk-blue); }
.npi-dashboard-redesign .gantt-done--low { width: 40%; background: var(--wk-brand-bright); }
.npi-dashboard-redesign .gantt-today { position: absolute; top: -4px; bottom: -4px; left: 47%; width: 0; border-left: 2px dashed var(--wk-brand-bright); }
.npi-dashboard-redesign .gantt-legend { display: flex; gap: var(--wk-space-lg); margin-top: var(--wk-space-md); font-size: var(--wk-text-xs); color: var(--text-secondary); align-items: center; }
.npi-dashboard-redesign .gantt-legend .lg-swatch { display: inline-block; width: 14px; height: 8px; border-radius: var(--wk-radius); margin-right: var(--wk-space-xs); vertical-align: middle; }
.npi-dashboard-redesign .gantt-legend .lg-swatch.plan { background: var(--wk-border-soft); border: 1px solid var(--wk-border-mid); }
.npi-dashboard-redesign .gantt-legend .lg-swatch.done { background: var(--wk-blue); }
.npi-dashboard-redesign .gantt-legend .lg-line { display: inline-block; width: 12px; border-top: 2px dashed var(--wk-brand-bright); margin-right: var(--wk-space-xs); vertical-align: middle; }
.npi-dashboard-redesign .preview-bar-pct { font-size: var(--wk-text-xs); font-weight: 600; width: 36px; text-align: right; }
.npi-dashboard-redesign .preview-activity { margin-top: var(--wk-space-lg); padding-top: var(--wk-space-lg); border-top: 1px solid var(--border); font-size: var(--wk-text-xs); color: var(--text-secondary); }
.npi-dashboard-redesign .preview-activity .dot { display: inline-block; width: 8px; height: 8px; border-radius: var(--wk-radius-circle); background: var(--primary); margin-right: var(--wk-space-sm); animation: npiRedesignPulse 2s infinite; }
@keyframes npiRedesignPulse { 0%,100%{opacity:1} 50%{opacity:0.4} }
