.st-note { margin: 0; font: 500 13px var(--ui); color: var(--muted); }
.st-title { font: 700 18px var(--ui); }
.st-title:empty { display: none; }
.st-row { display: flex; gap: 8px; flex-wrap: wrap; }
.st-row select { flex: 1 1 220px; }
.st-btn { font: 700 15px var(--ui); padding: 10px 16px; border-radius: 10px; border: 1px solid var(--line); background: #fff; cursor: pointer; }
.st-btn:disabled { opacity: .6; cursor: wait; }
.st-ideas { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.st-ideas:empty { display: none; }
.st-idea { text-align: left; border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 12px; cursor: pointer;
  display: flex; flex-direction: column; gap: 6px; font: 500 13px var(--ui); color: var(--muted); }
.st-idea:hover, .st-idea.on { border-color: var(--brand); box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 25%, transparent); }
.st-idea b { font: 700 15px var(--ui); color: var(--ink); }
.st-idea i { font-style: normal; color: var(--ink); }
.st-idea .fam { font: 700 11px var(--ui); text-transform: uppercase; letter-spacing: .06em; color: var(--brand); }
.st-stage { position: relative; width: 100%; max-width: 360px; aspect-ratio: 9 / 16; margin: 0 auto; background: #000; border-radius: 14px; overflow: hidden; }
.st-stage video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }
.st-stage .sk-wait { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 20px; color: #eee; font: 600 15px var(--ui); }
.st-steps { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; font: 500 14px var(--ui); color: var(--muted); }
.st-steps li.done { color: var(--ink); }
.st-steps li.done::after { content: " ✓"; color: #15803d; font-weight: 700; }
.st-steps li.now { color: var(--ink); font-weight: 700; }
.st-cap { font: 600 14px var(--ui); margin: 8px 0; }
.st-script { margin: 0; padding-left: 22px; font: 500 14px/1.5 var(--ui); }
.st-recent { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.st-recent a { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--ink); font: 600 13px var(--ui); }
.st-recent img { width: 100%; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); background: #000; }
#stForm .sk-grid { grid-template-columns: 1fr 1fr; }
@media (max-width: 520px) { #stForm .sk-grid { grid-template-columns: 1fr; } }