/* prompt3d detail-page styles — built on the shared design tokens. */
.p-hero { padding: var(--space-8) 0 var(--space-6); }
.p-back { display: inline-flex; align-items: center; gap: 6px; color: var(--text-muted);
  font: 500 var(--text-xs)/1.6 var(--font-mono); text-decoration: none; margin-bottom: var(--space-5); }
.p-back:hover { color: var(--accent); }
.p-title { font-size: var(--text-3xl); letter-spacing: var(--tracking-tighter); line-height: var(--leading-tight); margin: 0 0 var(--space-3); }
.p-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: var(--space-6); }
.p-stage { position: relative; border: 1px solid var(--border); border-radius: var(--radius-lg);
  overflow: hidden; background: var(--bg-subtle); margin-bottom: var(--space-8); }
.p-stage video, .p-stage img { display: block; width: 100%; height: auto; }
.p-desc { color: var(--text-muted); font-size: var(--text-md); line-height: var(--leading-normal);
  max-width: 72ch; margin: 0 0 var(--space-8); }
.p-prompthead { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
  flex-wrap: wrap; margin-bottom: var(--space-3); }
.p-prompthead h2 { font-size: var(--text-lg); margin: 0; letter-spacing: var(--tracking-tight); }
.p-prompt { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius-lg);
  padding: var(--space-5); font: 400 var(--text-sm)/1.7 var(--font-mono); white-space: pre-wrap;
  word-break: break-word; color: var(--text); max-height: 60vh; overflow-y: auto; }
.p-copied { color: var(--green-500); font: 600 var(--text-2xs)/1.6 var(--font-mono); opacity: 0; transition: opacity var(--dur-fast); }
.p-copied.is-on { opacity: 1; }
@media (max-width: 640px) { .p-hero { padding-top: var(--space-6); } .p-title { font-size: var(--text-2xl); } }