/* ═══════════════════════════════════════════════════════════════
   PROPHET AI · ide-preview.css — aba Preview (runner no navegador)
   ═══════════════════════════════════════════════════════════════ */

.ide-pane[data-pane="preview"] { flex-direction: column; }

.pv-bar {
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    padding: 8px; border-bottom: 1px solid var(--line-soft);
}
.pv-entry {
    background: var(--bg2); border: 1px solid var(--line);
    border-radius: var(--r-sm); color: var(--ink);
    padding: 5px 8px; font-size: 12px; font-family: var(--font-mono);
    max-width: 55%; outline: none;
}
.pv-entry:focus { border-color: var(--accent); }
.pv-auto { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--ink-dim); cursor: pointer; user-select: none; }
.pv-auto input { accent-color: var(--accent); }

.pv-status {
    padding: 6px 10px; font-size: 11.5px; font-family: var(--font-mono);
    color: var(--ink-dim); background: var(--bg2);
    border-bottom: 1px solid var(--line-soft);
    white-space: pre-wrap; word-break: break-word;
}
.pv-status.err { color: var(--rose); background: var(--rose-dim); }

.pv-host { flex: 1; min-height: 0; position: relative; background: #fff; }
.pv-frame { width: 100%; height: 100%; border: none; background: #fff; display: block; }
.pv-host .ide-empty { background: var(--bg1); height: 100%; box-sizing: border-box; }