/* Help: guides, logs & support, about - three glass-card sections stacked,
   matching the Dashboard/Setup/Stream Deck look instead of the old flat
   inspector panel. */
.help2 { display: grid; gap: 18px; }

.hp-sec { border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.02); overflow: hidden; animation: riseIn .5s .05s var(--ease) both; }
.hp-sec > header { display: flex; align-items: center; gap: 10px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.hp-sec > header h3 { font-family: var(--display); font-size: 12.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; flex: 1; }
.hp-sec > header .cur { font-family: var(--mono); font-size: 12px; color: var(--text-3); }
.hp-sec > header .head-actions { flex: none; }
.hp-sec .hp-body { padding: 16px 18px; display: grid; gap: 14px; }

.hp-body details.guide + details.guide { margin-top: 0; }
.hp-body details.guide { background: rgba(255,255,255,.03); }

.hp-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.hp-stat { padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.03); overflow: hidden; }
.hp-stat b { display: block; font-family: var(--mono); font-size: 14px; color: var(--accent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hp-stat span { font-family: var(--display); font-size: 10px; color: var(--text-3); letter-spacing: 1px; text-transform: uppercase; }

.hp-paths { display: grid; gap: 4px; }
.hp-paths .kv { padding: 4px 0; }

@media (max-width: 720px) {
  .hp-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .hp-stats { grid-template-columns: 1fr; }
}