.herbie-dashboard-section { padding: 90px 0; background: #0c111d; color: #ffffff; transition: background 0.3s ease; }
.herbie-dashboard-grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 50px; align-items: center; }
.herbie-dash-badge { display: inline-block; font-size: 0.75rem; font-weight: 700; color: var(--dash-badge-color, #93c5fd); letter-spacing: 0.08em; margin-bottom: 16px; }
.herbie-dash-title { font-size: 2.5rem; font-weight: 800; line-height: 1.15; letter-spacing: -0.02em; color: var(--dash-title-color, #ffffff); margin-bottom: 20px; }
.herbie-dash-desc { font-size: 1rem; line-height: 1.6; color: var(--dash-desc-color, #94a3b8); margin-bottom: 30px; }
.herbie-dash-points { list-style: none; margin: 0 0 32px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.herbie-dash-points li { display: flex; align-items: center; gap: 10px; font-size: 0.9375rem; color: var(--dash-desc-color, #f1f5f9); font-weight: 500; }
.herbie-point-check { color: #10b981; font-weight: 800; }
.herbie-dash-link { display: inline-flex; align-items: center; gap: 6px; font-size: 0.9375rem; font-weight: 700; color: #60a5fa; border-bottom: 1.5px solid #3b82f6; padding-bottom: 3px; text-decoration: none; }
.herbie-dash-link:hover { color: #93c5fd; }
.herbie-panel-window { background: #1e293b; border-radius: 18px; border: 1px solid #334155; overflow: hidden; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5); }
.herbie-window-topbar { background: #0f172a; padding: 12px 18px; display: flex; align-items: center; gap: 14px; border-bottom: 1px solid #334155; }
.herbie-window-dots { display: flex; gap: 6px; }
.herbie-window-dots span { width: 10px; height: 10px; border-radius: 50%; background: #475569; }
.herbie-window-dots span:nth-child(1) { background: #ef4444; }
.herbie-window-dots span:nth-child(2) { background: #f59e0b; }
.herbie-window-dots span:nth-child(3) { background: #10b981; }
.herbie-window-title { font-size: 0.75rem; color: #94a3b8; font-weight: 500; }
.herbie-window-body { padding: 24px; }
.herbie-window-img-box { padding: 0 !important; overflow: hidden; }
.herbie-dash-single-img { width: 100%; height: auto; display: block; object-fit: cover; }
.herbie-window-slider-box { position: relative; overflow: hidden; padding: 0 !important; width: 100%; }
.herbie-dash-slider-track { position: relative; width: 100%; }
.herbie-dash-slide { display: none; opacity: 0; transition: opacity 0.4s ease; width: 100%; }
.herbie-dash-slide.is-active { display: block !important; opacity: 1; }
.herbie-dash-slide-img { width: 100%; height: auto; display: block; object-fit: cover; }
.herbie-dash-slider-dots { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 10; }
.herbie-dash-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.4); border: none; cursor: pointer; padding: 0; transition: all 0.2s ease; }
.herbie-dash-dot.is-active { width: 22px; border-radius: 999px; background: #3b82f6; }
.herbie-panel-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.herbie-panel-head strong { display: block; font-size: 1rem; color: #ffffff; }
.herbie-panel-head small { font-size: 0.75rem; color: #94a3b8; }
.herbie-period-pill { font-size: 0.75rem; background: #334155; padding: 4px 10px; border-radius: 6px; color: #cbd5e1; }
.herbie-stat-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 20px; }
.herbie-stat-card { background: #0f172a; border: 1px solid #334155; border-radius: 12px; padding: 14px; }
.herbie-stat-card small { display: block; font-size: 0.75rem; color: #94a3b8; }
.herbie-stat-card strong { display: block; font-size: 1.25rem; color: #ffffff; margin: 4px 0; }
.herbie-stat-up { font-size: 0.6875rem; color: #10b981; font-weight: 600; }
.herbie-chart-fake { background: #0f172a; border: 1px solid #334155; border-radius: 12px; padding: 16px; }
.herbie-chart-header { display: flex; justify-content: space-between; font-size: 0.75rem; margin-bottom: 14px; color: #cbd5e1; }
.herbie-chart-bars { display: flex; align-items: flex-end; justify-content: space-between; height: 100px; gap: 8px; padding-top: 10px; }
.herbie-chart-bars div { flex: 1; background: #3b82f6; border-radius: 4px 4px 0 0; opacity: 0.85; }
@media (max-width: 960px) { .herbie-dashboard-grid { grid-template-columns: 1fr; } }