/* One workspace, with a stable circuit iframe and shared diagnostics. */
#simulator-view.firmware-workbench { flex-direction: column; position: relative; container-type: inline-size; }
.firmware-workbench [hidden] { display: none !important; }
.firmware-workbench button:not(.btn), .firmware-workbench select, .firmware-workbench input {
  font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border-hi); border-radius: 5px;
}
.firmware-workbench button:not(.btn) { padding: 6px 9px; cursor: pointer; font-size: 11px; }
.firmware-workbench button:disabled { opacity: .4; cursor: default; }
.firmware-workbench button:hover:not(:disabled) { background: var(--surface3); color: var(--accent); }
.firmware-workbench :focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.fw-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.fw-modes { display: flex; padding: 3px; background: var(--bg); border: 0; border-radius: 7px; flex-shrink: 0; }
.fw-modes button { border: 0 !important; background: transparent !important; padding: 7px 13px !important; }
.fw-modes button[aria-pressed="true"] { background: var(--surface3) !important; color: var(--accent); box-shadow: 0 1px 3px #0003; }
.fw-toolbar-actions { display: flex; align-items: center; gap: 8px; min-width: 0; }
.fw-control-help { position: relative; display: inline-flex; }
#fw-compile { min-width: 148px; justify-content: center; }
#fw-compile-help:focus-visible { border-radius: 5px; }
#fw-compile-tooltip { position: absolute; z-index: 20; top: 100%; right: 0; width: min(280px, calc(100cqw - 32px)); padding: 10px 12px; border: 1px solid var(--border-hi); border-radius: 5px; background: var(--surface2); color: var(--text); font-size: 11px; line-height: 1.6; box-shadow: 0 8px 24px #0006; visibility: hidden; }
.fw-control-help:not([data-dismissed="true"]):is(:hover, :focus-within) #fw-compile-tooltip { visibility: visible; }
.fw-fallback { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding: 10px 16px; font-size: 11px; line-height: 1.6; color: var(--text); border-bottom: 1px solid var(--border); }
.fw-fallback .btn { font-size: 11px; text-transform: none; letter-spacing: 0; flex-shrink: 0; }
.fw-toolbar .btn { border-radius: 5px; min-height: 32px; text-transform: none; letter-spacing: 0; font-size: 11px; }
.fw-save-state { min-width: 0; margin-left: auto; font-size: 10px; color: #8c9cac; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fw-panes { flex: 1; min-height: 0; min-width: 0; display: flex; overflow: hidden; }
#simulation-pane { flex: 1; min-width: 0; min-height: 0; position: relative; display: flex; overflow: hidden; }
#simulation-pane iframe { width: 100%; height: 100%; border: 0; }
#firmware-pane { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; background: #0d1218; container: firmware-pane / inline-size; }
.fw-filebar { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--border); background: var(--surface); }
.fw-file-label { display: flex; align-items: center; gap: 9px; min-width: 0; font-size: 11px; color: var(--text); }
#fw-file-select { min-width: 0; max-width: 100%; width: 280px; padding: 6px; font-size: 11px; }
.fw-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#fw-source { flex: 1; min-height: 0; overflow: auto; padding: 12px 0 20px; font-size: 11px; scrollbar-gutter: stable; line-height: 1.8; tab-size: 2; }
.fw-line { display: flex; width: max-content; min-width: 100%; }
.fw-line-number { flex: 0 0 55px; width: 55px; text-align: right; padding-right: 14px; color: #778796; user-select: none; border-left: 3px solid transparent; }
.fw-line code { display: block; white-space: pre; padding-right: 20px; }
.fw-line.changed { background: rgba(79,211,154,.07); }
.fw-line.changed .fw-line-number { border-left-color: var(--green); color: var(--green); }
.fw-change { margin: 4px 12px 4px 40px; max-width: calc(100% - 52px); color: #a2b1bf; font-size: 10px; }
.fw-change summary { cursor: pointer; padding: 4px 8px; border: 1px solid var(--border-hi); border-radius: 4px; width: fit-content; }
.fw-change pre { padding: 8px 12px; overflow: auto; border-left: 2px solid var(--yellow); background: rgba(213,166,103,.04); white-space: pre; font: inherit; }

#fw-diagnostics { border-top: 1px solid var(--border-hi); flex-shrink: 0; background: var(--bg); }
.fw-diagnostics-bar, .fw-diagnostics-toolbar { display: flex; align-items: center; gap: 12px; padding: 4px 10px; min-height: 36px; }
.fw-diagnostics-tabs, .fw-diagnostics-actions { display: flex; gap: 4px; flex-shrink: 0; }
.fw-diagnostics-tabs button { background: transparent !important; border-color: transparent !important; }
.fw-diagnostics-tabs button[aria-pressed="true"] { color: var(--accent); background: var(--surface2) !important; }
.fw-diagnostics-actions { margin-left: auto; }
.fw-diagnostics-actions button { border: 0 !important; background: transparent !important; }
#fw-build-badge[data-state="error"] { color: var(--red); }
#fw-toggle-logs, #fw-build-badge { background: transparent; border-color: transparent; }
#fw-toggle-logs::before { content: '▸'; display: inline-block; width: 16px; color: var(--text-dim); }
#fw-toggle-logs[aria-expanded="true"]::before { content: '▾'; }
#fw-build-badge { margin-left: auto; color: var(--text-dim); }
.fw-diagnostics-toolbar { min-height: 0; padding-block: 3px; }
#fw-console-details { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; padding: 0 12px 3px; }
#fw-console-context { font-size: 10px; color: #95a6b5; }
#fw-diagnostics-content { display: flex; flex-direction: column; height: clamp(130px, 20vh, 200px); border-top: 1px solid var(--border); }
#fw-log-output, #fw-expanded-output { flex: 1; min-height: 0; margin: 0; overflow: auto; padding: 12px 16px; font: 11px/1.7 'JetBrains Mono', monospace; white-space: pre-wrap; overflow-wrap: anywhere; color: #adbfca; }
#fw-serial-form { display: flex; gap: 8px; padding: 7px 12px; border-top: 1px solid var(--border); }
#fw-serial-input { flex: 1; min-width: 0; padding: 6px 8px; font-size: 11px; }
#fw-notice { position: absolute; bottom: 50px; right: 16px; max-width: calc(100% - 32px); z-index: 10; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border-hi); border-radius: 7px; background: var(--surface2); box-shadow: 0 10px 32px #0006; font-size: 11px; }
#fw-notice button { flex-shrink: 0; border: 0; color: var(--accent); background: transparent; }
#fw-log-dialog { width: min(1000px, 92vw); height: min(650px, 85vh); margin: auto; padding: 0; border: 1px solid var(--border-hi); border-radius: 10px; color: var(--text); background: var(--bg); }
#fw-log-dialog[open] { display: flex; flex-direction: column; }
#fw-log-dialog::backdrop { background: #0009; }
.fw-dialog-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--border-hi); }
.fw-dialog-header h2 { font-size: 13px; font-weight: 500; }
@container (max-width: 759px) {
  .fw-toolbar { padding: 9px 10px; gap: 8px; }
  .fw-modes button { padding: 7px 9px !important; }
}
@container (max-width: 599px) {
  .fw-toolbar { flex-wrap: wrap; }
  .fw-toolbar-actions { margin-left: auto; }
  .fw-save-state { font-size: 9px; }
}
@container (max-width: 440px) {
  .fw-diagnostics-bar { gap: 2px; padding: 5px; }
  .fw-diagnostics-tabs button, .fw-diagnostics-actions button { padding: 6px !important; font-size: 10px !important; }
}

/* Empty workspaces have one invitation; operational chrome arrives with files. */
#fw-welcome { display: flex; flex: 1; min-height: 0; overflow: auto; background: radial-gradient(ellipse at 50% 40%, rgba(69,183,207,.035), transparent 65%); }
.fw-welcome-copy { width: 100%; max-width: 510px; margin: auto; padding: 56px 28px 72px; text-align: center; }
.fw-welcome-symbol { width: 86px; margin: 0 auto 26px; color: var(--accent); }
.fw-welcome-symbol svg { display: block; width: 100%; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.fw-welcome-symbol svg rect:first-child { fill: rgba(69,183,207,.035); }
.fw-welcome-copy h2 { font-size: clamp(18px, 3cqw, 22px); font-weight: 500; letter-spacing: -.025em; color: #dce6ee; line-height: 1.4; }
.fw-welcome-copy p { max-width: 420px; margin: 14px auto 26px; font-size: 12px; line-height: 1.9; color: #95a6b5; }
#fw-start-building { padding: 10px 16px; gap: 16px; border-radius: 6px; font-size: 11px; text-transform: none; letter-spacing: 0; }
#fw-welcome[data-phase="generating"] .fw-welcome-symbol { animation: fw-preparing 2s ease-in-out infinite alternate; }
@keyframes fw-preparing { from { opacity: .45; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { #fw-welcome[data-phase="generating"] .fw-welcome-symbol { animation: none; } }
#firmware-pane[data-empty="true"] > .fw-filebar { display: none; }
.fw-pane-empty { flex: 1; min-width: 0; min-height: 0; display: flex; overflow: auto; background: var(--bg); }
.fw-pane-empty-copy { margin: auto; max-width: 400px; padding: 32px 24px; text-align: center; }
.fw-empty-glyph { display: block; color: var(--accent-dim); font-size: 24px; margin-bottom: 16px; }
.fw-pane-empty h3 { font-size: 13px; font-weight: 500; color: var(--text); line-height: 1.5; }
.fw-pane-empty p { margin: 10px 0 18px; font-size: 11px; line-height: 1.8; color: #95a6b5; }
.fw-pane-empty .btn { font-size: 10px; text-transform: none; letter-spacing: 0; padding: 7px 12px; }
#fw-file-name { overflow-wrap: anywhere; }
.fw-plain-source { margin: 0; padding: 0 16px; font: inherit; white-space: pre; }

/* One Run control, with its destination disclosed on demand. */
.fw-run-control { display: flex; align-items: stretch; }
.fw-run-control #fw-compile { border-radius: 6px 0 0 6px; height: 100%; }
.fw-menu { position: relative; }
.fw-menu summary { list-style: none; cursor: pointer; padding: 8px 10px; color: var(--text-dim); border-radius: 6px; }
.fw-menu summary::-webkit-details-marker { display: none; }
.fw-menu summary:hover, .fw-menu summary:focus-visible { color: var(--text); background: var(--surface3); }
.fw-menu summary:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
.fw-run-control summary { height: 100%; border: 1px solid var(--accent-dim); border-left: 0; border-radius: 0 6px 6px 0; color: var(--accent); background: rgba(69,183,207,.12); }
.fw-menu-items { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; padding: 6px; min-width: 210px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); box-shadow: 0 10px 32px #0005; }
.fw-menu-items button, .fw-menu-items label { display: flex; width: 100%; text-align: left; padding: 10px !important; font: inherit; color: var(--text); background: transparent; border: 0; border-radius: 4px; line-height: 1.4; }
.fw-menu-items button:hover, .fw-menu-items button:focus-visible { background: rgba(69,183,207,.08); color: var(--accent); }
.fw-menu-items button[aria-pressed="true"]::after { content: '✓'; margin-left: auto; color: var(--accent); }
.fw-destination-menu summary { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 34px; padding: 0; }
.fw-destination-menu svg { width: 18px; height: 18px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fw-destination-menu summary svg { width: 14px; height: 14px; }
.fw-destination-menu[open] summary { background: var(--surface3); }
.fw-destination-menu[open] summary svg { transform: rotate(180deg); }
.fw-destination-menu .fw-menu-items { width: min(292px, calc(100cqw - 20px)); min-width: 0; box-sizing: border-box; padding: 5px; border-color: var(--border-hi); border-radius: 10px; }
/* Destination rows override the shared overflow menu's compact padding. */
.fw-destination-menu .fw-menu-items button { align-items: center; gap: 12px; padding: 12px !important; border: 0; border-radius: 6px; background: transparent; }
.fw-destination-menu .fw-menu-items button:hover:not(:disabled), .fw-destination-menu .fw-menu-items button:focus-visible { background: var(--surface3); }
.fw-destination-menu .fw-menu-items button:active:not(:disabled) { background: var(--surface2); }
.fw-destination-menu .fw-menu-items button[aria-pressed="true"] { background: rgba(69,183,207,.07); }
.fw-destination-menu .fw-menu-items button[aria-pressed="true"]::after { content: none; }
.fw-destination-menu .fw-menu-items button > svg { color: var(--text-dim); }
.fw-destination-menu .fw-menu-items button[aria-pressed="true"] > svg { color: var(--accent); }
.fw-destination-menu .fw-destination-check { margin-left: auto; width: 14px; height: 14px; visibility: hidden; }
.fw-destination-menu button[aria-pressed="true"] .fw-destination-check { visibility: visible; }
.fw-destination-copy { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.fw-destination-title { font-size: 12px; color: var(--text); }
.fw-destination-description { font-size: 10px; color: #95a6b5; }
.fw-menu-items label { justify-content: space-between; align-items: center; gap: 10px; font-size: 11px; }
#fw-console-source, #fw-device-baud { background: transparent; border: 0; color: var(--text-dim); font: inherit; font-size: 10px; padding: 6px; max-width: 112px; }
#fw-console-source option, #fw-device-baud option { background: var(--surface); color: var(--text); }
#fw-output-menu .fw-menu-items { top: auto; bottom: calc(100% + 6px); }
#fw-device-dialog { margin: auto; width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); box-sizing: border-box; padding: 24px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); color: var(--text); overflow: auto; font: 12px/1.8 'JetBrains Mono', monospace; }
#fw-device-dialog::backdrop { background: #0008; backdrop-filter: blur(6px); }
#fw-device-dialog .fw-dialog-header { padding: 0; margin-bottom: 20px; border: 0; }
#fw-device-dialog h2 { font-size: 18px; font-weight: 500; letter-spacing: -.02em; }
#fw-device-dialog p { margin: 12px 0; overflow-wrap: anywhere; }
#fw-device-description, .fw-device-footnote { color: #95a6b5; }
#fw-device-state { color: var(--accent); }
#fw-device-review { display: grid; grid-template-columns: auto 1fr; gap: 8px 24px; margin: 20px 0; padding: 16px 0; border-block: 1px solid var(--border); }
#fw-device-review dt { color: var(--text-dim); }
#fw-device-review dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
#fw-device-warning, #fw-device-error { color: #e7b17d; font-size: 11px; }
#fw-device-progress { width: 100%; height: 6px; accent-color: var(--accent); }
.fw-device-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
#fw-device-dialog .btn { text-transform: none; letter-spacing: 0; font-size: 11px; padding: 10px 14px; }
#fw-device-dialog .fw-device-footnote { font-size: 10px; margin: 20px 0 0; }
@container (max-width: 440px) { #fw-console-source { max-width: 80px; padding-inline: 2px; } .fw-toolbar-actions { gap: 4px; } .fw-run-control #fw-compile { padding: 8px !important; font-size: 10px !important; } }

/* Configuration shares the connection sheet's scroll owner and token palette. */
#fw-configuration-form { padding: 14px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
#fw-configuration-form h3 { font-size: 12px; font-weight: 500; }
#fw-configuration-form p { font-size: 11px; line-height: 1.7; overflow-wrap: anywhere; }
.fw-configuration-field { margin: 16px 0; }
.fw-configuration-field label { display: block; margin-bottom: 6px; font-size: 11px; color: var(--text); }
.fw-configuration-input { display: flex; gap: 8px; }
.fw-configuration-input input { flex: 1; min-width: 0; width: 100%; padding: 9px; font: inherit; font-size: 12px; color: var(--text); background: var(--bg); border: 1px solid var(--border); border-radius: 5px; }
.fw-configuration-input input[type="checkbox"] { flex: none; width: 18px; height: 18px; accent-color: var(--accent); }
.fw-configuration-input input:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
.fw-configuration-input input[aria-invalid="true"] { border-color: var(--red); }
#fw-configuration-form .fw-field-error { color: var(--red); }
#fw-configuration-status { min-height: 19px; }