/* Live output is a reading surface with its own status and scroll controls. */
#view-status #writerModelOutput { position:relative;background:var(--card);border-color:var(--border); }
#view-status #writerModelOutput .writer-model-output-head { display:flex;flex-direction:column;align-items:stretch;gap:12px;min-height:120px!important;flex:0 0 auto;padding:18px 20px 14px!important;background:var(--card);border-bottom:1px solid var(--border); }
.model-output-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:12px; }
.model-output-heading > div { display:grid;gap:5px; }
#view-status .model-output-heading strong { font-size:16px;line-height:1.4;color:var(--text); }
.model-output-heading small { font-size:11px;line-height:1.6;color:var(--text-sub); }
#view-status #writerModelOutputState { display:inline-flex;align-items:center;gap:6px;flex-shrink:0;font-size:11px;font-weight:500;line-height:1.6;border:1px solid var(--border);padding:3px 8px;border-radius:20px;color:var(--text-sub);background:var(--card-2); }
#writerModelOutputState::before { content:'';width:5px;height:5px;border-radius:50%;background:currentColor; }
#view-status #writerModelOutput[data-output-state="streaming"] #writerModelOutputState,
#view-status #writerModelOutput[data-output-state="starting"] #writerModelOutputState { color:var(--brand);border-color:var(--brand);background:var(--brand-soft); }
#view-status #writerModelOutput[data-output-state="completed"] #writerModelOutputState { color:var(--state-done,#247553); }
#view-status #writerModelOutput[data-output-state="error"] #writerModelOutputState { color:var(--state-error,#b44642); }
#view-status #writerModelOutput[data-output-state="paused"] #writerModelOutputState,
#view-status #writerModelOutput[data-output-state="retrying"] #writerModelOutputState { color:var(--state-paused,#966619); }
.model-output-meta { display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0; }
#view-status #writerModelOutput .model-output-meta #writerModelOutputModel { grid-column:auto;grid-row:auto;max-width:none;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;line-height:1.6;color:var(--text-sub); }
#writerModelOutputCount { flex-shrink:0;font-size:11px;line-height:1.6;font-variant-numeric:tabular-nums;color:var(--text-sub); }
.model-output-actions { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.model-output-actions label { display:inline-flex;align-items:center;gap:7px;color:var(--text-sub);font-size:12px;cursor:pointer; }
.model-output-actions input { width:14px;height:14px;margin:0;accent-color:var(--brand); }
.model-output-actions button { font:inherit;font-size:11px;padding:5px 9px;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--text-sub);cursor:pointer; }
.model-output-actions button:disabled { opacity:.45;cursor:default; }
.model-output-actions button:not(:disabled):hover { border-color:var(--brand);color:var(--brand); }
#view-status #writerModelOutput .writer-model-output-body { display:flex;flex-direction:column;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border-strong,var(--border)) transparent;background:var(--card)!important;padding:22px 20px 36px!important; }
#view-status #writerModelOutput #writerModelOutputText { font:14px/1.95 'Microsoft YaHei','PingFang SC',sans-serif!important;color:var(--text)!important;white-space:pre-wrap;word-break:normal;overflow-wrap:anywhere;tab-size:2;margin:0;letter-spacing:.015em; }
.model-output-empty { flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:130px;padding:24px 10px 48px;text-align:center; }
.model-output-empty-mark { display:grid;place-items:center;width:52px;height:52px;margin-bottom:4px;border:1px solid var(--border);border-radius:16px;background:var(--card-2);color:var(--text-sub); }
.model-output-empty-mark svg { width:25px;height:25px; }
.model-output-empty strong { font-size:15px;font-weight:500;line-height:1.6;color:var(--text); }
.model-output-empty p { max-width:260px;margin:0;color:var(--text-sub);font-size:12px;line-height:1.9; }
#writerModelOutputEmpty[hidden],#writerModelOutputText[hidden],#writerModelOutputLatest[hidden] { display:none!important; }
.model-output-latest { position:absolute;bottom:76px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);padding:8px 14px;white-space:nowrap;border:1px solid var(--border);border-radius:20px;background:var(--card);color:var(--brand);box-shadow:0 3px 14px #00000014;cursor:pointer;font:inherit;font-size:12px; }
#writerModelOutput .studio-output-footer { align-items:center;padding:12px 16px;gap:10px;background:var(--card-2); }
#writerModelOutput .studio-output-footer #studioWorkflowNote { font-size:12px;line-height:1.8;color:var(--text-sub); }
#writerModelOutput #writerTopPauseBtn:disabled { display:none; }
#writerModelOutput :is(button,input):focus-visible { outline:2px solid var(--brand);outline-offset:3px; }
@media(max-width:1180px){
    #view-status #writerModelOutput { height:300px;max-height:300px;flex-basis:300px; }
    #view-status #writerModelOutput .writer-model-output-head { min-height:0!important;gap:8px;padding:12px 16px!important; }
    .model-output-heading small { display:none; }
    .model-output-empty { min-height:75px;padding:10px 0;gap:6px; }
    .model-output-empty-mark { display:none; }
    .model-output-latest { bottom:68px; }
}