/* Project chat shares the landing prompt's surfaces, typography and controls. */
#chat { background: var(--surface-primary); }
#msgstream { padding: 14px 20px 26px; }
.project-turn { margin: 0 0 28px; min-width: 0; }
.project-turn .msg { margin: 0; }
.project-turn .msg.user { display: flex; justify-content: flex-end; margin-bottom: 22px; }
.project-turn .msg.user > .b { max-width: 92%; border: 0; border-radius: 22px 22px 5px 22px;
  padding: 13px 17px; background: var(--button-secondary-bg); color: var(--text-primary); }
.turn-user-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.6; }
.project-turn .assistant { display: block; border: 0; background: transparent; padding: 0; color: var(--text-primary); }
.assistant-name { display: inline-block; font-weight: 650; font-size: 14px; margin-bottom: 9px; }
.turn-reply { font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.turn-reply p { margin: 0 0 12px; }
.turn-reply pre, .build-details pre { overflow: auto; max-height: 280px; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; }
.turn-progress { color: var(--text-secondary); font-size: 14px; line-height: 1.6; }
.turn-progress:empty, .turn-moves:empty, .turn-unfinished:empty, .turn-placement:empty { display: none; }
/* The running label's typewriter (projectchat.js `Typewriter`). The caret holds
   the line's height while the text is empty between phrases, so nothing jumps. */
.turn-progress .typer-sr { position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; }
/* Muted, a step below the label's own colour: the phrase is not the answer. */
.turn-progress .typer-text, .turn-progress .typer-caret { color: var(--text-muted); }
.turn-progress .typer-caret { display: inline-block; width: 2px; height: 1.05em; margin-left: 2px;
  vertical-align: -0.15em; background: currentColor; animation: typer-blink 1s steps(1) infinite; }
@keyframes typer-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .turn-progress .typer-caret { animation: none; } }
.turn-moves { font-size: 12px; color: var(--text-secondary); margin-top: 8px; }
.turn-unfinished { font-size: 13px; line-height: 1.6; padding: 4px 0; color: var(--text-secondary); }
.turn-unfinished p { margin: 5px 0; }
.turn-placement { font-size: 13px; line-height: 1.6; padding: 4px 0; color: var(--text-secondary); overflow-wrap: anywhere; }
.turn-placement p { margin: 5px 0; }
.turn-retry { margin: 8px 0; }
.build-details { color: var(--text-secondary); margin-top: 12px; font-size: 12px; }
.build-details summary { cursor: pointer; padding: 6px 0; }
.build-details-body { padding: 8px 12px; background: var(--surface-secondary); border-radius: 12px; }
.child-result { border-top: 1px solid var(--card-border); padding: 10px 0; }
.child-result p { line-height: 1.55; }
.legacy-history { margin-bottom: 16px; }
.chat-history:empty { display: none; }
.chat-history { margin-bottom: 14px; }
#chat #pfoot { font-size: 12px; line-height: 1.5; padding: 8px 20px; color: var(--text-secondary); }
#chat #pfoot[hidden] { display: none; }
#rail .step { min-width: 0; padding: 10px 14px; }
#rail .step .nm { text-transform: none; font-size: 13px; }
#rail .step .st { font-size: 11px; }
#vp-elecview, #vp-devview { display: none !important; }
#project-downloads { padding: 24px 0; color: var(--text-primary); }
#project-downloads h2 { font-size: 24px; margin: 0 0 8px; }
#project-downloads > p { color: var(--text-secondary); line-height: 1.6; font-size: 13px; }
.download-art { padding: 12px 0; border-bottom: 1px solid var(--card-border); }
.download-art summary { cursor: pointer; padding: 6px 0; }
.download-art label { display: block; margin: 8px 0; }
.download-files { display: grid; gap: 8px; max-height: 240px; overflow: auto; padding: 10px 0; }
.download-files a { font-size: 13px; overflow-wrap: anywhere; }
.download-art pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 240px; overflow: auto; font-size: 12px; }
#handoff #ho-buy { margin: 6px 0 24px; }
#handoff .buy-summary { flex: 1 1 280px; min-width: 0; }
#handoff .buy-row { flex-wrap: wrap; }
#handoff .buy-rowblurb { flex: 1 1 150px; }
.turn-stop { margin: 8px 0; }
