.cockpit-page {
  --cp-surface-soft: var(--cp-soft);
  --cp-text: var(--ink);
  --cp-text-muted: var(--cp-muted);
  --cp-accent: var(--blue);
  --cp-accent-soft: #e2ebf7;
  --cp-accent-fg: #fff;
  --cp-success: var(--cp-green);
  --cp-danger: var(--cp-red);
  --cp-warning: var(--cp-amber);
  --cp-warning-soft: #f7f0e2;
}

.cockpit[data-mode='live'] .demo-only,
.cockpit[data-mode='demo'] .live-only,
.runtime-dialog [hidden] { display:none !important; }
.cockpit[data-mode='live'] { height: min(940px, calc(100svh - 48px)); min-height:700px; }
.runtime-dialog { color:var(--cp-text); background:var(--cp-surface); }
.cockpit[data-mode='live'] #live-model-state { font-size:24px; }
.runtime-banner { display:flex; align-items:center; flex-wrap:wrap; gap:8px; border:1px solid var(--cp-border); background:var(--cp-surface-soft); color:var(--cp-text-muted); padding:12px 16px; border-radius:6px; margin:0 0 16px; font-family:var(--font-display); line-height:1.5; }
.runtime-banner[data-state='error'] { color:var(--cp-danger); }
.runtime-banner[data-state='ready'] { color:var(--cp-success); }
.runtime-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; align-items:start; padding-bottom:12px; }
.runtime-card { min-width:0; border:1px solid var(--cp-border); border-radius:4px; padding:20px; background:var(--cp-surface); }
.runtime-card h4 { font-size:15px; font-weight:500; margin:0 0 12px; }
.runtime-card .cp-section-heading h4 { margin:0; }
.runtime-card .cp-section-heading { align-items:flex-start; }
.runtime-help { font-size:12px; line-height:1.5; color:var(--cp-text-muted); margin:12px 0; overflow-wrap:anywhere; }
.runtime-field { display:flex; flex-direction:column; gap:8px; margin:16px 0; font-family:var(--font-display); font-size:12px; color:var(--cp-text); }
.runtime-field input,.runtime-field textarea,.runtime-field select { width:100%; max-width:none; border:1px solid var(--cp-border); border-radius:4px; background:var(--cp-surface); color:var(--cp-text); padding:10px 12px; font:inherit; line-height:1.5; }
.runtime-field textarea { resize:vertical; min-height:220px; max-height:600px; font-family:var(--font-display); }
.runtime-field textarea:focus-visible { outline:2px solid var(--cp-accent); outline-offset:2px; }
.runtime-count { text-align:right; margin:-8px 0 12px; font-variant-numeric:tabular-nums; }
.runtime-recipient { padding:12px; border-left:3px solid var(--cp-accent); background:var(--cp-accent-soft); font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.runtime-consent { display:flex; align-items:flex-start; gap:10px; font-size:12px; line-height:1.6; margin:16px 0; }
.runtime-consent input { width:18px; height:18px; min-height:18px !important; flex-shrink:0; margin:2px 0 0; accent-color:var(--cp-accent); }
.runtime-primary { background:var(--blue); color:#fff; border-color:var(--blue); font-family:var(--font-display); }
.runtime-primary:hover:not(:disabled) { background:#094ead; border-color:#094ead; }
.cockpit button:disabled,.runtime-dialog button:disabled { opacity:.55; cursor:not-allowed; }
.runtime-message { font-size:12px; color:var(--cp-text-muted); line-height:1.6; overflow-wrap:anywhere; }
.runtime-error { color:var(--cp-danger); border:1px solid var(--cp-border); padding:12px; border-radius:4px; line-height:1.6; font-size:12px; overflow-wrap:anywhere; }
.runtime-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:300px; text-align:center; color:var(--cp-text-muted); }
.runtime-empty > svg { width:36px; height:36px; margin:16px; color:var(--cp-accent); }
.runtime-empty h4 { color:var(--cp-text); }
.runtime-empty p { max-width:290px; line-height:1.7; font-size:13px; }
.runtime-result { overflow-wrap:anywhere; }
.runtime-result h3 { font-family:var(--font-display); font-weight:500; line-height:1.4; }
.runtime-result h5 { font-family:var(--font-display); font-size:13px; font-weight:500; margin:24px 0 8px; }
.runtime-result p,.runtime-result li { font-size:13px; line-height:1.7; }
.runtime-result ul { padding-left:20px; }
.runtime-result li { margin:8px 0; }
.runtime-result .runtime-meta { font-size:12px; color:var(--cp-text-muted); white-space:pre-line; }
.runtime-status { display:inline-flex; align-items:center; padding:4px 8px; border:1px solid var(--cp-border); background:var(--cp-surface-soft); color:var(--cp-text-muted); font-family:var(--font-display); font-size:12px; border-radius:4px; }
.runtime-status[data-state='running'] { color:var(--cp-accent); background:var(--cp-accent-soft); }
.runtime-status[data-state='failed'] { color:var(--cp-danger); }
.runtime-status[data-state='pending'] { color:var(--cp-warning); background:var(--cp-warning-soft); }
.runtime-status[data-state='reviewed'] { color:var(--cp-success); }
.runtime-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.runtime-danger { color:var(--cp-danger); }
.runtime-delete { margin-top:16px; padding:12px; background:var(--cp-surface-soft); border:1px solid var(--cp-border); }
.runtime-source { margin:20px 0; }
.runtime-source summary,.runtime-storage summary { cursor:pointer; color:var(--cp-accent); font-family:var(--font-display); font-size:12px; }
.runtime-source pre { font:12px/1.7 Consolas, 'Courier New', monospace; white-space:pre-wrap; overflow-wrap:anywhere; max-height:260px; overflow:auto; background:var(--cp-surface-soft); padding:12px; }
.runtime-result table { width:100%; border-collapse:collapse; font-size:12px; }
.runtime-result th,.runtime-result td { text-align:left; padding:10px 6px; border-bottom:1px solid var(--cp-border); vertical-align:top; line-height:1.6; }
.runtime-result th { color:var(--cp-text-muted); font-weight:400; }
.runtime-storage { border-top:1px solid var(--cp-border); margin-top:24px; padding-top:16px; }
.runtime-storage p { overflow-wrap:anywhere; font-size:12px; }
.runtime-task-link { border:0; background:none; padding:0; color:var(--cp-accent); text-align:left; font-family:var(--font-display); line-height:1.5; cursor:pointer; overflow-wrap:anywhere; }
.runtime-task-link:hover { text-decoration:underline; }
.cockpit[data-mode='live'] .cp-agent-credits { color:var(--cp-text-muted); font-size:12px; }
.cockpit[data-mode='live'] .cp-agent .runtime-agent-open { grid-column:4; }
.cockpit[data-mode='live'] .cp-agent { min-height:80px; }
.cockpit[data-mode='live'] .cp-event[data-state='failed'] > .cp-event-icon { color:var(--cp-danger); background:var(--cp-surface-soft); }
.cockpit[data-mode='live'] .cp-event[data-state='running'] > .cp-event-icon { color:var(--cp-accent); background:var(--cp-accent-soft); }
.cockpit[data-mode='live'] #overview-activity { height:250px; }

@media(max-width:1100px) {
  .runtime-grid { grid-template-columns:1fr; }
  .runtime-empty { min-height:160px; }
}
@media(max-width:700px) {
  .runtime-card { padding:16px; }
  .runtime-field input,.runtime-field textarea,.runtime-field select { font-size:16px; }
  .runtime-grid { gap:16px; }
  .cockpit[data-mode='live'] .cp-agent .runtime-agent-open { grid-column:3; grid-row:1 / span 2; }
  .runtime-result th,.runtime-result td { padding:8px 4px; }
}

.cockpit[data-mode='live'] .ui-only { display:none !important; }