/* =========================================================
   PROMPT GENERATOR — category grid, generator form, output panel
   ========================================================= */

.prompt-cat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:20px; }
.prompt-cat-card{
  padding:22px; border-radius:var(--radius-lg); background:var(--glass-bg); border:1px solid var(--glass-border);
  cursor:pointer; transition:all var(--transition-base); text-align:left; display:flex; flex-direction:column; gap:12px;
}
.prompt-cat-card:hover, .prompt-cat-card.active{ border-color:var(--accent-cyan); transform:translateY(-4px); box-shadow:var(--shadow-glow-cyan); }
.prompt-cat-card__icon{ font-size:1.8rem; }
.prompt-cat-card__name{ font-weight:700; font-size:1.02rem; }
.prompt-cat-card__count{ font-size:.78rem; color:var(--color-text-muted); }
.prompt-cat-card__tags{ display:flex; flex-wrap:wrap; gap:6px; }
.prompt-cat-card__tags .tag{ font-size:.72rem; padding:3px 9px; }

.prompt-examples-row{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.prompt-example-card{ padding:20px; border-radius:var(--radius-lg); background:var(--glass-bg); border:1px solid var(--glass-border); display:flex; flex-direction:column; gap:10px; }
.prompt-example-card__meta{ display:flex; gap:8px; flex-wrap:wrap; }
.prompt-example-card h4{ font-size:.98rem; }
.prompt-example-card p{ font-size:.84rem; color:var(--color-text-secondary); flex:1; }

.generator-panel{ display:grid; grid-template-columns:1fr; gap:28px; }
.generator-section{ padding:26px; border-radius:var(--radius-lg); }
.generator-section h3{ font-size:1rem; margin-bottom:6px; display:flex; align-items:center; gap:10px; }
.generator-section .section-num{
  width:26px; height:26px; border-radius:50%; background:var(--accent-gradient); color:#04070a;
  display:flex; align-items:center; justify-content:center; font-size:.78rem; font-weight:800; flex-shrink:0;
}
.generator-section__desc{ font-size:.82rem; color:var(--color-text-muted); margin-bottom:18px; }
.form-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:18px; }

.constraint-tags{ display:flex; flex-wrap:wrap; gap:10px; }
.constraint-chip{ position:relative; }
.constraint-chip input{ position:absolute; opacity:0; width:100%; height:100%; cursor:pointer; margin:0; }
.constraint-chip span{
  display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:var(--radius-full);
  background:var(--glass-bg); border:1px solid var(--glass-border); font-size:.85rem; color:var(--color-text-secondary);
  transition:all var(--transition-fast); cursor:pointer;
}
.constraint-chip input:checked + span{ background:var(--accent-gradient-soft); border-color:var(--accent-cyan); color:var(--accent-cyan); font-weight:600; }

.generator-actions{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; padding-top:8px; }

.prompt-output{ padding:0; overflow:hidden; }
.prompt-output__header{ display:flex; align-items:center; justify-content:space-between; padding:18px 24px; border-bottom:1px solid var(--color-border); flex-wrap:wrap; gap:12px; }
.prompt-output__body{ padding:24px; max-height:520px; overflow-y:auto; }
.prompt-output pre{ white-space:pre-wrap; word-wrap:break-word; font-family:'SFMono-Regular',Consolas,monospace; font-size:.88rem; line-height:1.7; color:#e4e4e7; background:none; border:none; padding:0; margin:0; }
.prompt-output__empty{ padding:60px 24px; text-align:center; color:var(--color-text-muted); }
.output-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.step-indicator{ display:flex; align-items:center; gap:8px; justify-content:center; margin-bottom:8px; flex-wrap:wrap; }
.step-indicator span{ font-size:.78rem; color:var(--color-text-muted); padding:6px 14px; border-radius:var(--radius-full); background:var(--glass-bg); border:1px solid var(--glass-border); }

@media (max-width:640px){
  .prompt-output__header{ flex-direction:column; align-items:stretch; }
}