/* SPDX-License-Identifier: Apache-2.0; Copyright 2026 Finn Andre Hotvedt and IntentForce */
:root {
  color-scheme: dark;
  --bg: #07121d; --panel: #0c1c2b; --panel2: #10283a; --line: #21445b;
  --text: #edf7fb; --muted: #95adbb; --cyan: #24d7ef; --lime: #a8ff3f;
  --amber: #ffcc66; --danger: #ff6f79; --catalog-width: 270px; --inspector-width: 290px; --serial-width: 390px; --parts-drawer-width: 390px;
  --canvas-workbench: #08141f; --canvas-grid: #16304455; --canvas-grid-size: 22px 22px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
:root[data-serial-width="300"] { --serial-width: 300px; }
:root[data-serial-width="320"] { --serial-width: 320px; }
:root[data-serial-width="340"] { --serial-width: 340px; }
:root[data-serial-width="360"] { --serial-width: 360px; }
:root[data-serial-width="380"] { --serial-width: 380px; }
:root[data-serial-width="400"] { --serial-width: 400px; }
:root[data-serial-width="420"] { --serial-width: 420px; }
:root[data-serial-width="440"] { --serial-width: 440px; }
:root[data-serial-width="460"] { --serial-width: 460px; }
:root[data-serial-width="480"] { --serial-width: 480px; }
:root[data-serial-width="500"] { --serial-width: 500px; }
:root[data-serial-width="520"] { --serial-width: 520px; }
:root[data-serial-width="540"] { --serial-width: 540px; }
:root[data-serial-width="560"] { --serial-width: 560px; }
:root[data-serial-width="580"] { --serial-width: 580px; }
:root[data-serial-width="600"] { --serial-width: 600px; }
:root[data-serial-width="620"] { --serial-width: 620px; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: radial-gradient(circle at 80% 0%, #12324a 0, var(--bg) 42%); color: var(--text); }
main { width: calc(100% - 32px); margin: 0 auto; padding: 18px 0 36px; }
body.serial-dock-open main,
body:has(> .serial-dock:not([hidden])) main { width: calc(100% - var(--serial-width) - 40px); margin-left: 16px; margin-right: auto; }
.app-header { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 12px; padding: 0 4px; }
.app-introduction { width: min(660px, 58vw); }
.app-introduction .lede { margin: 0; max-width: none; }
.app-introduction .lede strong { color: var(--text); font-size: 1.05rem; }
.app-introduction details { margin-top: 5px; color: var(--muted); font-size: .66rem; }
.app-introduction summary { width: max-content; cursor: pointer; color: var(--cyan); font-weight: 800; }
.app-introduction details p { margin: 5px 0 0; line-height: 1.4; }
.eyebrow { color: var(--lime); font-size: .7rem; font-weight: 800; letter-spacing: .15em; margin: 0 0 9px; }
h1 { font-size: clamp(1.55rem, 3vw, 2.3rem); letter-spacing: -.035em; line-height: 1; margin: 0; }
h2 { font-size: 1.22rem; margin: 0; }
.lede, .truth, footer { color: var(--muted); line-height: 1.55; }
.lede { max-width: 720px; margin: 0; font-size: .86rem; text-align: right; }
.panel { background: color-mix(in srgb, var(--panel) 94%, transparent); border: 1px solid var(--line); border-radius: 16px; padding: 18px; box-shadow: 0 18px 50px #0005; min-width: 0; }
.card-heading { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.state { color: var(--amber); font-size: .78rem; text-align: right; }
.project-bar { display: grid; grid-template-columns: minmax(170px, .35fr) 1fr; gap: 12px 24px; align-items: center; margin-bottom: 16px; }
.project-toolbar .project-file-primary { border-color: var(--lime); }
.project-file-advanced { flex: 1 1 100%; min-width: 100%; border: 1px solid #31536c; border-radius: 9px; background: #07141f; }
.project-file-advanced > summary { padding: 9px 11px; color: var(--cyan); cursor: pointer; font-size: .74rem; font-weight: 800; }
.project-file-advanced-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 10px 10px; }
.project-file-advanced-actions > * { flex: 1 1 150px; }
.desktop-required { margin: 0 0 16px; padding: 12px 16px; border: 1px solid #2a627f; border-radius: 12px; color: var(--muted); background: #081826; line-height: 1.5; }
.desktop-required strong { color: var(--lime); }
.desktop-required a { color: var(--cyan); }
.project-bar .truth { grid-column: 1 / -1; margin: 0; }
.model-library-detail { grid-column: 1 / -1; min-width: 0; border: 1px solid #31536c; border-radius: 9px; background: #07141f; }
.model-library-detail summary { padding: 8px 10px; color: var(--cyan); cursor: pointer; font: 800 .72rem/1.4 ui-monospace, monospace; }
.model-library-detail[open] summary { border-bottom: 1px solid #26475b; }
.model-library-detail > .truth, .model-library-detail ul, .model-library-detail button, .model-library-limit { margin: 8px 10px; }
.model-library-detail ul { padding-left: 18px; color: var(--muted); font-size: .7rem; line-height: 1.5; overflow-wrap: anywhere; }
.local-history { grid-column: 1 / -1; min-width: 0; border: 1px solid #31536c; border-radius: 9px; background: #07141f; }
.local-history summary { padding: 8px 10px; color: var(--cyan); cursor: pointer; font: 800 .72rem/1.4 ui-monospace, monospace; }
.local-history summary span { margin-left: .4rem; color: var(--muted); }
.local-history[data-enabled="true"] summary span { color: var(--green); }
.local-history[open] summary { border-bottom: 1px solid #26475b; }
.local-history > .truth, .local-history-controls, .local-history-list { margin: 10px; }
.local-history-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.local-history-controls label { display: grid; gap: 4px; color: var(--muted); font-size: .7rem; }
.local-history-controls input { min-width: min(300px, 70vw); }
.local-history-list { display: grid; gap: 8px; padding: 0; list-style: none; }
.local-history-row { display: grid; grid-template-columns: minmax(180px, 1fr) auto; gap: 10px; align-items: center; padding: 10px; border: 1px solid #26475b; border-radius: 8px; background: #091a28; }
.local-history-row[data-valid="false"] { border-color: var(--red); }
.local-history-row strong, .local-history-row small { display: block; overflow-wrap: anywhere; }
.local-history-row small { margin-top: 3px; color: var(--muted); font: .65rem/1.45 ui-monospace, monospace; }
.local-history-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
@media (max-width: 760px) { .local-history-row { grid-template-columns: 1fr; } .local-history-actions { justify-content: flex-start; } }
.model-library-limit { color: var(--amber); font-size: .7rem; line-height: 1.45; }
.project-name-field { display: grid; gap: 4px; max-width: 360px; color: var(--muted); font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; }
.project-name-field input { min-width: 0; color: var(--text); font-size: .95rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.project-name-field + #project-state { display: block; margin-top: 6px; }
.toolbar, .build-controls, .inspector-actions, .canvas-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.toolbar select { width: auto; min-width: 150px; }
.starter-launch { display: inline-flex; }
.starter-launch button { color: #06111a; background: var(--lime); border-color: var(--lime); font-weight: 850; }
.starter-launch button span { font-size: .7rem; }
.starter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-top: 14px; }
.starter-card { min-height: 176px; display: flex; flex-direction: column; align-items: stretch; gap: 7px; padding: 14px; border: 1px solid #31536c; border-radius: 10px; text-align: left; background: linear-gradient(145deg, #102d41, #091a28); }
.starter-card strong { color: var(--text); font-size: 1rem; }
.starter-visual { position: relative; display: block; height: 62px; overflow: hidden; border: 1px solid #31536c; border-radius: 8px; background: radial-gradient(circle at 77% 48%,#ff5b65 0 5px,#6e1e2a 6px 10px,transparent 11px),linear-gradient(90deg,transparent 15%,#39dff2 15% 17%,transparent 17% 56%,#a8ff3f 56% 58%,transparent 58%),linear-gradient(145deg,#06131e,#0d2d3f); }
.starter-visual::before { content: ''; position: absolute; left: 18px; top: 16px; width: 72px; height: 31px; border: 2px solid #40b9b0; border-radius: 5px; background: #176e67; box-shadow: inset 0 0 0 6px #176e67,inset 0 0 0 8px #b9c7c7; }
.starter-visual::after { content: ''; position: absolute; left: 92px; top: 29px; width: 78px; height: 3px; background: var(--cyan); box-shadow: 68px 0 0 var(--cyan); }
.starter-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.starter-difficulty { padding: 3px 7px; border: 1px solid #477089; border-radius: 999px; color: #d8eaf2; font-size: .62rem; font-weight: 800; }
.starter-focus { color: var(--lime); font-size: .65rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.starter-description, .starter-outcome { color: var(--muted); font-size: .75rem; line-height: 1.42; }
.starter-parts { color: var(--cyan); font: 650 .69rem ui-monospace, monospace; }
.starter-teaching { width: 100%; border-top: 1px solid #2a4659; }
.starter-teaching > summary { padding: 7px 0 2px; cursor: pointer; color: var(--cyan); font-size: .68rem; font-weight: 800; }
.starter-learning-grid { display: grid; gap: 5px; width: 100%; margin: 3px 0 2px; }
.starter-learning-grid > span { display: grid; grid-template-columns: 52px 1fr; gap: 7px; color: var(--muted); font-size: .68rem; line-height: 1.35; }
.starter-learning-grid > span:last-child { margin-top: 2px; padding-top: 6px; border-top: 1px dashed #31536c; color: #cde6f4; }
.starter-learning-grid b { color: var(--text); font-size: .65rem; letter-spacing: .04em; text-transform: uppercase; }
.starter-action { width: 100%; margin-top: auto; color: #06111a; background: var(--lime); border-color: var(--lime); font-size: .75rem; font-weight: 900; }
.starter-card:hover, .starter-card:focus-within { border-color: var(--cyan); }
.profile-example-picker { margin: 12px 0; padding: 12px; border: 1px solid #29465d; border-radius: 10px; background: #081722; }
.profile-example-picker h3, .profile-example-picker p { margin: 0 0 8px; }
.profile-example-picker p { color: var(--muted); font-size: .82rem; }
.profile-example-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.profile-example-card { min-width: 0; padding: 10px; border: 1px solid #31536c; border-radius: 8px; background: linear-gradient(145deg, #102d41, #091a28); color: var(--text); text-align: left; }
.profile-example-card strong, .profile-example-card span { display: block; }
.profile-example-card span { margin-top: 4px; color: var(--muted); font-size: .78rem; }
.profile-example-card span b { color: var(--cyan); font-weight: 700; }
.profile-example-card:hover, .profile-example-card:focus-visible { border-color: var(--cyan); }
.quick-controls { position: sticky; z-index: 20; top: 8px; display: flex; align-items: center; justify-content: flex-end; gap: 7px; margin: 0 0 12px; padding: 8px 10px; border-radius: 12px; backdrop-filter: blur(16px); pointer-events: none; }
.quick-controls > * { pointer-events: auto; }
.quick-controls > span { display: grid; margin-right: auto; }
.quick-controls small { color: var(--muted); font-size: .67rem; }
.quick-controls button { min-height: 34px; padding-inline: 10px; }
.quick-controls #quick-build { color: #06111a; background: var(--lime); border-color: var(--lime); }
.top-workbench-shell { position: relative; display: grid; gap: 6px; margin-bottom: 6px; }
.top-workbench-sticky-controls { position: sticky; z-index: 40; top: 8px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 6px; padding-bottom: 0; background: #050d15; }
.top-workbench-toolbar, .workbench-popup-controls { grid-column: 1 / -1; }
.top-workbench-toolbar { display: grid; grid-template-columns: auto minmax(520px,1fr) auto; gap: 12px; align-items: center; min-height: 48px; padding: 6px 10px; border: 1px solid #315c72; border-radius: 12px; background: linear-gradient(145deg,#0c2637,#081722); box-shadow: 0 12px 32px #0005; }
.top-workbench-identity .eyebrow { margin-bottom: 2px; font-size: .58rem; }
.top-workbench-identity h2 { font-size: 1rem; white-space: nowrap; }
.workbench-view-switch { display: inline-grid; grid-template-columns: repeat(2,1fr); gap: 2px; margin-top: 5px; padding: 2px; border: 1px solid #315c72; border-radius: 8px; background: #06131e; }
.workbench-view-switch button { min-height: 25px; padding: 2px 8px; border: 0; border-radius: 5px; color: var(--muted); background: transparent; font-size: .62rem; }
.workbench-view-switch button[aria-pressed="true"] { color: #06111a; background: var(--lime); }
.workbench-view-switch button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.beginner-primary { display: grid; grid-template-columns: minmax(170px,auto) auto; gap: 5px 8px; align-items: center; }
.beginner-run { min-height: 44px; padding: 8px 22px; color: #06111a; background: var(--lime); border-color: var(--lime); font-size: 1rem; font-weight: 900; }
.beginner-secondary { display: flex; gap: 5px; }
.beginner-secondary button { min-height: 32px; padding: 4px 8px; font-size: .7rem; }
.beginner-secondary .beginner-new-example { color: #07121d; background: var(--amber); border-color: var(--amber); font-weight: 900; }
.beginner-secondary .beginner-runtime-toggle { color: #06111a; background: var(--amber); border-color: var(--amber); font-weight: 900; }
.beginner-secondary .beginner-runtime-toggle[data-state="paused"] { background: var(--cyan); border-color: var(--cyan); }
.beginner-primary > span { grid-column: 1 / -1; max-width: 390px; color: var(--muted); font-size: .67rem; }
.workbench-more { grid-column: 2; justify-self: end; }
.workbench-more[open] { grid-column: 1 / -1; justify-self: stretch; }
.workbench-more > summary { width: max-content; min-width: 84px; padding: 7px 12px; border: 1px solid #315c72; border-radius: 8px; color: var(--text); background: #0b2130; cursor: pointer; font-weight: 850; list-style-position: inside; }
.workbench-more[open] > summary { margin-bottom: 6px; color: #06111a; background: var(--cyan); border-color: var(--cyan); }
.workbench-more:not([open]) > .workbench-popup-controls { display: none; }
.top-controller-controls { min-width: 0; }
.top-controller-controls .controller-profile-picker { display: grid; grid-template-columns: auto minmax(110px,150px) auto minmax(210px,1fr); gap: 4px 7px; align-items: center; }
.top-controller-controls .controller-profile-picker label { margin: 0; color: var(--muted); font-size: .62rem; font-weight: 800; }
.top-controller-controls .controller-profile-picker select { min-height: 32px; padding: 4px 24px 4px 7px; font-size: .72rem; }
.top-controller-controls .profile-future-note { display: none; }
.top-controller-controls #controller-status { grid-column: 1 / -1; margin: 0; overflow: hidden; color: var(--muted); font-size: .62rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.top-primary-controls .quick-controls { position: static; display: flex; width: auto; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; pointer-events: auto; }
.top-primary-controls .quick-controls > span { display: none; }
.top-primary-controls .quick-controls button { min-height: 32px; padding: 4px 8px; font-size: .7rem; white-space: nowrap; }
.top-primary-controls #quick-pause,
.top-primary-controls #quick-reset { min-width: 64px; }
.runtime-shortcuts { grid-column: 1; display: flex; align-items: center; gap: 5px 12px; min-height: 30px; padding: 4px 10px; overflow-x: auto; border: 1px solid #26475b; border-radius: 9px; color: var(--muted); background: #071620; font-size: .65rem; white-space: nowrap; scrollbar-width: thin; }
.runtime-shortcuts strong { color: var(--lime); }
.runtime-shortcuts span { display: inline-flex; align-items: center; gap: 3px; }
.runtime-shortcuts kbd { min-width: 22px; padding: 2px 5px; border: 1px solid #48738a; border-bottom-width: 2px; border-radius: 5px; color: var(--text); background: #0d2635; text-align: center; font: 800 .62rem/1.15 ui-monospace,monospace; }
.runtime-shortcuts > button { min-height: 26px; padding: 3px 7px; color: #06111a; border-color: var(--cyan); background: var(--cyan); font-size: .62rem; font-weight: 900; }
.runtime-shortcuts .shortcut-sequence-status { color: var(--lime); }
.top-primary-controls .quick-controls button[data-shortcut]::after { content: attr(data-shortcut); display: inline-block; margin-left: 5px; padding: 1px 4px; border: 1px solid currentColor; border-radius: 4px; opacity: .8; font: 800 .56rem/1.1 ui-monospace,monospace; }
.shortcut-settings-dialog { width: min(760px,94vw); max-width: 94vw; max-height: 90vh; margin: auto; padding: 0; overflow: auto; color: var(--text); border: 1px solid #3c718d; border-radius: 16px; background: #081722; box-shadow: 0 28px 90px #000c; }
.shortcut-settings-dialog::backdrop { background: #02070dcc; backdrop-filter: blur(4px); }
.shortcut-settings-dialog > header { position: sticky; z-index: 2; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 14px; border-bottom: 1px solid #31536c; background: #0b2131; }
.shortcut-settings-dialog > p, .shortcut-settings-dialog > section, .shortcut-settings-dialog > footer, .shortcut-binding-list, .shortcut-command-search { margin: 12px 16px; }
.shortcut-command-search { display: grid; grid-template-columns: minmax(180px,1fr) auto; gap: 5px 10px; align-items: end; padding: 10px; border: 1px solid #315c72; border-radius: 9px; background: #071620; }
.shortcut-command-search > label { grid-column: 1 / -1; font-weight: 850; }
.shortcut-command-search > div { display: flex; gap: 7px; }
.shortcut-command-search input { width: min(100%,420px); }
.shortcut-command-search span { align-self: center; color: var(--muted); font-size: .76rem; white-space: nowrap; }
.shortcut-binding-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.shortcut-binding-list label, .shortcut-sequence-editor > label:not(.shortcut-sequence-enabled) { display: grid; grid-template-columns: minmax(100px,1fr) minmax(150px,auto); gap: 4px 8px; align-items: center; padding: 8px; border: 1px solid #294f64; border-radius: 9px; background: #071620; font-weight: 850; }
.shortcut-binding-list small { grid-column: 1 / -1; color: var(--muted); font-weight: 600; }
.shortcut-binding-list input, .shortcut-sequence-editor input[type="text"] { min-height: 34px; color: var(--lime); background: #06111a; font: 800 .75rem/1.2 ui-monospace,monospace; cursor: pointer; }
.shortcut-binding-list input:focus, .shortcut-sequence-editor input[type="text"]:focus { outline: 2px solid var(--cyan); outline-offset: 2px; }
.shortcut-sequence-editor { padding: 12px; border: 1px solid #396d57; border-radius: 12px; background: #092019; }
.shortcut-sequence-editor h3 { margin: 0 0 10px; color: var(--lime); }
.shortcut-sequence-editor ol { margin: 10px 0; padding-left: 24px; }
.shortcut-sequence-enabled { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; }
.shortcut-settings-status { min-height: 34px; padding: 8px 10px; color: var(--cyan); border: 1px solid #315c72; border-radius: 8px; background: #071620; }
.shortcut-settings-status[data-error="true"] { color: #ffd6dc; border-color: var(--red); background: #32131a; }
.shortcut-settings-dialog > footer { display: flex; justify-content: flex-end; gap: 8px; padding-bottom: 14px; }
@media (max-width: 620px) { .shortcut-binding-list { grid-template-columns: 1fr; } .shortcut-command-search { grid-template-columns: 1fr; } .shortcut-command-search > label { grid-column: 1; } .shortcut-settings-dialog > footer { align-items: stretch; flex-direction: column; } }
.workbench-popup-controls { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 6px; }
.workbench-popup-controls button { min-height: 32px; padding: 4px 7px; overflow: hidden; font-size: .7rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.workbench-popup-controls button[aria-expanded="true"] { color: #06111a; background: var(--cyan); border-color: var(--cyan); }
.workbench-popup-controls .workbench-get-started { color: #06111a; background: var(--lime); border-color: var(--lime); }
.workbench-help-summary { padding: 14px; border: 1px solid #315c72; border-radius: 12px; background: #071620; }
.workbench-help-summary h2 { margin: 2px 0 10px; font-size: 1.06rem; }
.workbench-help-choices { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; }
.workbench-help-choices a, .workbench-help-choices button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 6px 9px; border: 1px solid #2a627f; border-radius: 8px; color: var(--text); background: #0b2131; text-align: center; text-decoration: none; font-size: .76rem; font-weight: 800; }
.workbench-help-choices a:hover, .workbench-help-choices a:focus-visible, .workbench-help-choices button:hover, .workbench-help-choices button:focus-visible { border-color: var(--lime); color: var(--lime); }
.build-list-status { min-width: 0; margin: 0; padding: 2px 10px; overflow: hidden; border: 1px solid #29495b; border-radius: 8px; color: var(--muted); background: #071620; font-size: .66rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
body[data-workbench-view="simple"] #brief-tests-open,
body[data-workbench-view="simple"] #x81-assessment-open,
body[data-workbench-view="simple"] #presentation-open,
body[data-workbench-view="simple"] #canvas-annotations-open,
body[data-workbench-view="simple"] #build-list-export,
body[data-workbench-view="simple"] #accessible-svg-export,
body[data-workbench-view="simple"] #build-list-status,
body[data-workbench-view="simple"] #accessible-svg-status,
body[data-workbench-view="simple"] #local-history,
body[data-workbench-view="simple"] #project-navigation,
body[data-workbench-view="simple"] #project-brief,
body[data-workbench-view="simple"] #prompt-drawer,
body[data-workbench-view="simple"] #thermostat-experiment,
body[data-workbench-view="simple"] #regression-matrix { display: none !important; }
body[data-workbench-view="simple"] #pico-rotate, body[data-workbench-view="simple"] #c3-rotate, body[data-workbench-view="simple"] #stm32-rotate,
body[data-workbench-view="simple"] #pico-zoom-out, body[data-workbench-view="simple"] #pico-zoom-value, body[data-workbench-view="simple"] #pico-zoom-in, body[data-workbench-view="simple"] #pico-fit, body[data-workbench-view="simple"] #pico-fullscreen,
body[data-workbench-view="simple"] #c3-zoom-out, body[data-workbench-view="simple"] #c3-zoom-value, body[data-workbench-view="simple"] #c3-zoom-in, body[data-workbench-view="simple"] #c3-fit, body[data-workbench-view="simple"] #c3-fullscreen,
body[data-workbench-view="simple"] #stm32-zoom-out, body[data-workbench-view="simple"] #stm32-zoom-value, body[data-workbench-view="simple"] #stm32-zoom-in, body[data-workbench-view="simple"] #stm32-fit, body[data-workbench-view="simple"] #stm32-fullscreen,
body[data-workbench-view="simple"] #pico-add-bend, body[data-workbench-view="simple"] #pico-route-back, body[data-workbench-view="simple"] #pico-route-forward, body[data-workbench-view="simple"] #pico-wire-color,
body[data-workbench-view="simple"] #c3-add-bend, body[data-workbench-view="simple"] #c3-route-back, body[data-workbench-view="simple"] #c3-route-forward, body[data-workbench-view="simple"] #c3-wire-color,
body[data-workbench-view="simple"] #stm32-add-bend, body[data-workbench-view="simple"] #stm32-route-back, body[data-workbench-view="simple"] #stm32-route-forward, body[data-workbench-view="simple"] #stm32-wire-color { display: none !important; }
body[data-workbench-view="advanced"] #beginner-primary { display: none; }
body[data-workbench-view="advanced"] .workbench-more > summary { display: none; }
body[data-workbench-view="advanced"] .workbench-more { display: contents; }
.workbench-popup-controls > #quick-controls { grid-column: 1 / -1; }
@media (max-width: 760px) {
  .beginner-primary { grid-template-columns: minmax(0,1fr); width: 100%; }
  .beginner-run { width: 100%; }
  .beginner-secondary { flex-wrap: wrap; }
  .beginner-secondary button { flex: 1 1 130px; }
  .beginner-primary > span { grid-column: 1; }
}
.active-canvas-stage { display: grid; grid-template-columns: minmax(0,1fr); min-width: 0; border: 1px solid #315c72; border-radius: 14px; background: #07141f; box-shadow: 0 18px 50px #0006; overflow: hidden; }
#active-canvas-mount { grid-column: 1; min-width: 0; }
#toggle-catalog { position: fixed; z-index: 82; top: 44%; left: 0; display: grid; place-items: center; min-width: 48px; width: 48px; min-height: 112px; padding: 10px 7px; border-left: 0; border-radius: 0 12px 12px 0; color: #07121d; background: var(--cyan); border-color: var(--cyan); writing-mode: vertical-rl; transition: left .18s ease, color .18s ease, background .18s ease; }
#toggle-catalog[aria-expanded="true"] { left: var(--parts-drawer-width); color: var(--text); background: #102d41; border-color: var(--cyan); }
.simple-parts-drawer { position: fixed; z-index: 80; inset: 10px auto 10px 0; display: flex; flex-direction: column; width: var(--parts-drawer-width); min-width: 0; padding: 14px; overflow: hidden; border: 1px solid #31536c; border-left: 0; border-radius: 0 16px 16px 0; background: linear-gradient(180deg,#0a1c29,#07141f); box-shadow: 20px 0 35px #0009; visibility: hidden; pointer-events: none; transform: translateX(calc(-100% - 24px)); transition: transform .18s ease, visibility 0s linear .18s; }
.simple-parts-drawer.is-open { visibility: visible; pointer-events: auto; transform: translateX(0); transition-delay: 0s; }
.simple-parts-drawer > header { display: flex; align-items: start; justify-content: space-between; gap: 8px; margin-bottom: 9px; }
.simple-parts-drawer > header h3 { margin: 0; font-size: 1.05rem; }
.simple-parts-heading-actions { display: grid; justify-items: end; gap: 6px; }
.simple-parts-heading-actions > span { max-width: 150px; color: var(--muted); font: 700 .6rem/1.3 ui-monospace,monospace; text-align: right; }
.simple-parts-heading-actions > button { min-height: 30px; padding: 3px 9px; font-size: .68rem; }
.simple-parts-mount { flex: 1 1 auto; min-height: 0; overflow: auto; scrollbar-gutter: stable; }
.simple-parts-mount > .catalog,
.simple-parts-mount > .shared-parts-surface { position: static; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.simple-parts-mount .catalog > .eyebrow,
.simple-parts-mount .catalog > h2,
.simple-parts-mount .bounded-parts-panel > header { display: none; }
.simple-parts-mount .catalog-list { max-height: none; overflow: visible; }
.simple-parts-mount .bounded-parts-list { grid-template-columns: 1fr; }
.simple-parts-drawer > footer { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-top: 10px; }
.simple-parts-drawer > footer button { min-height: 34px; }
.simple-parts-drawer > p { margin: 8px 0 0; color: var(--muted); font-size: .65rem; line-height: 1.35; }
.catalog-advanced-filters { margin-top: 10px; border-top: 1px solid #29495b; }
.catalog-advanced-filters > summary { padding: 9px 0 5px; color: var(--muted); cursor: pointer; font-size: .7rem; font-weight: 850; }
.catalog-advanced-filters > div { display: grid; gap: 5px; }
body[data-workbench-view="advanced"] .active-canvas-stage { grid-template-columns: minmax(0,1fr); }
body[data-workbench-view="advanced"] #active-canvas-mount,
body[data-workbench-view="advanced"] .top-workbench-status { grid-column: 1; }
#active-canvas-mount > [data-shared-surface="canvas"],
#active-canvas-mount > .board-card { width: 100%; margin: 0; padding: 8px; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
#active-canvas-mount > .board-card .card-heading { display: none; }
#active-canvas-mount .canvas-tools { margin: 0 0 5px; gap: 4px; }
.canvas-primary-controls { display: grid; grid-template-columns: auto minmax(280px,1fr); gap: 8px; align-items: stretch; margin: 0 0 6px; }
.canvas-primary-controls .canvas-mode { align-self: stretch; }
.canvas-primary-controls .canvas-mode button { min-width: 78px; }
.selected-runtime-control { display: flex; align-items: center; gap: 8px 12px; min-width: 0; padding: 6px 9px; border: 1px solid #315c72; border-radius: 9px; background: #071620; font-size: .68rem; }
.selected-runtime-control strong { min-width: 150px; overflow: hidden; color: var(--lime); text-overflow: ellipsis; white-space: nowrap; }
.selected-runtime-control label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-weight: 800; }
.selected-runtime-control input { width: 84px; min-height: 30px; padding: 3px 6px; }
.selected-runtime-control span { min-width: 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.selected-runtime-control button { min-height: 30px; padding: 3px 8px; }
.canvas-view-tools { margin: 0 0 5px; }
.canvas-view-tools > summary { width: max-content; padding: 5px 9px; border: 1px solid #315c72; border-radius: 7px; color: var(--muted); background: #081925; cursor: pointer; font-size: .68rem; font-weight: 850; }
.canvas-view-tools[open] > summary { margin-bottom: 5px; color: #06111a; background: var(--cyan); border-color: var(--cyan); }
#active-canvas-mount .canvas-tools button,
#active-canvas-mount .bounded-circuit-actions button { min-height: 30px; }
#active-canvas-mount .pico-circuit-pane,
#active-canvas-mount .c3-circuit-pane,
#active-canvas-mount .stm32-circuit-pane { gap: 3px; }
#active-canvas-mount .pico-editor-heading { min-height: 26px; margin: 0; }
#active-canvas-mount .pico-editor-heading small { display: none; }
#active-canvas-mount .pico-circuit-actions,
#active-canvas-mount .c3-circuit-actions,
#active-canvas-mount .stm32-circuit-actions { display: flex; flex-wrap: nowrap; gap: 4px; width: 100%; max-width: 100%; min-width: 0; height: 32px; margin: 0; padding: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
#active-canvas-mount .pico-circuit-actions::-webkit-scrollbar,
#active-canvas-mount .c3-circuit-actions::-webkit-scrollbar,
#active-canvas-mount .stm32-circuit-actions::-webkit-scrollbar { display: none; }
#active-canvas-mount .pico-circuit-actions > *,
#active-canvas-mount .c3-circuit-actions > *,
#active-canvas-mount .stm32-circuit-actions > * { flex: 0 0 auto; min-height: 28px; padding: 3px 6px; font-size: .64rem; }
#active-canvas-mount .named-wire-state { box-sizing: border-box; height: 22px; min-height: 22px; margin: 0; padding: 3px 6px; overflow: hidden; font-size: .65rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
#active-canvas-mount .bounded-crossing-key { min-height: 18px; margin: 0; font-size: .62rem; line-height: 1.2; }
#active-canvas-mount .circuit-canvas,
#active-canvas-mount .pico-editor-canvas { height: max(560px, calc(100vh - 200px)); min-height: 560px; max-height: 720px; }
#active-canvas-mount .pico-circuit-state,
#active-canvas-mount .truth:not(.named-wire-state),
#active-canvas-mount .diagnostics { margin: 4px 0 0; font-size: .65rem; line-height: 1.3; }
.top-workbench-status { grid-column: 1; display: grid; grid-template-columns: auto minmax(160px,.45fr) minmax(260px,1fr); gap: 8px; align-items: center; min-height: 30px; padding: 5px 10px; border-top: 1px solid #26475b; color: var(--muted); font-size: .65rem; }
.top-workbench-status strong { color: var(--lime); }
.top-workbench-status span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shared-parking-root { display: none !important; }
body[data-active-profile] main { padding-top: 8px; }
body[data-active-profile] .app-header { min-height: 38px; margin-bottom: 6px; align-items: center; }
body[data-active-profile] .app-header h1 { font-size: 1.35rem; }
body[data-active-profile] .app-header .eyebrow { margin-bottom: 3px; font-size: .58rem; }
body[data-active-profile] .app-header .lede { max-width: 640px; overflow: hidden; font-size: .68rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }

.workbench-popup-dialog { position: fixed; inset: 0; width: min(860px,92vw); max-width: 92vw; height: min(760px,88vh); max-height: 88vh; margin: auto; padding: 0; overflow: hidden; color: var(--text); border: 1px solid #3c718d; border-radius: 16px; background: #081722; box-shadow: 0 28px 90px #000c; }
.workbench-popup-dialog.workbench-popup-wide { width: min(1180px,94vw); max-width: 94vw; }
.workbench-popup-dialog::backdrop { background: #02070dcc; backdrop-filter: blur(4px); }
.workbench-popup-dialog > header { position: sticky; z-index: 3; top: 0; display: flex; justify-content: space-between; align-items: center; min-height: 58px; padding: 10px 14px; border-bottom: 1px solid #31536c; background: #0b2131; }
.workbench-popup-dialog > header .eyebrow { margin-bottom: 3px; }
.workbench-popup-dialog > header h2 { font-size: 1.08rem; }
#x81-assessment-context { white-space: pre-wrap; overflow-wrap: anywhere; }
.presentation-view-dialog { width: min(1180px,94vw); max-width: 94vw; height: min(820px,90vh); max-height: 90vh; margin: auto; padding: 0; overflow: hidden; color: var(--text); border: 1px solid #4a8a72; border-radius: 18px; background: #07151d; box-shadow: 0 28px 90px #000d; }
.presentation-view-dialog::backdrop { background: #02070ddd; backdrop-filter: blur(5px); }
.presentation-view-dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 62px; padding: 12px 16px; border-bottom: 1px solid #315f57; background: linear-gradient(100deg,#0a2430,#102b23); }
.presentation-view-dialog h2, .presentation-view-dialog h3, .presentation-view-dialog p { margin: 0; }
.presentation-layout { height: calc(min(820px,90vh) - 63px); overflow: auto; padding: 18px; }
.presentation-setup, .presentation-stage { display: grid; gap: 16px; }
.presentation-setup > div:first-child p, .presentation-stage .truth { margin-top: 5px; color: var(--muted); line-height: 1.5; }
#presentation-instruments { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 0; padding: 12px; border: 1px solid #2f665d; border-radius: 12px; }
#presentation-instruments legend { padding: 0 6px; color: var(--cyan); font-weight: 800; }
#presentation-instruments label { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 9px; border: 1px solid #244b4b; border-radius: 9px; background: #0a1d25; }
.presentation-step-heading, .presentation-stage-heading, .presentation-stage-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.presentation-step-editors { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.presentation-step-editor { display: grid; grid-template-columns: minmax(150px,.45fr) minmax(240px,1fr) auto; gap: 8px; align-items: end; padding: 11px; border: 1px solid #28576a; border-radius: 10px; background: #081d29; }
.presentation-step-editor label { display: grid; gap: 5px; color: var(--muted); font-size: .7rem; font-weight: 800; }
.presentation-step-editor input { width: 100%; min-width: 0; }
#presentation-start { justify-self: start; color: #07130d; border-color: var(--lime); background: var(--lime); }
.presentation-stage-heading { padding-bottom: 12px; border-bottom: 1px solid #315f57; }
#presentation-step-count { color: var(--lime); font: 800 .78rem ui-monospace,monospace; }
.presentation-step-text { max-width: 76ch; padding: 14px; border-left: 4px solid var(--lime); border-radius: 8px; background: #10221b; font-size: 1.02rem; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.presentation-instrument-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.presentation-instrument-card { min-width: 0; padding: 14px; border: 1px solid #2b6170; border-radius: 12px; background: linear-gradient(145deg,#0b2230,#071720); }
.presentation-instrument-card h4 { margin: 0 0 8px; color: var(--cyan); }
.presentation-instrument-card dl { display: grid; gap: 6px; margin: 0; }
.presentation-instrument-card dl div { display: grid; grid-template-columns: minmax(90px,.35fr) minmax(0,1fr); gap: 8px; }
.presentation-instrument-card dt { color: var(--muted); }
.presentation-instrument-card dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.presentation-stage-actions { justify-content: flex-start; }
.teaching-exercise-dialog { width: min(980px,94vw); max-width: 94vw; max-height: 90vh; margin: auto; padding: 0; overflow: hidden; color: var(--text); border: 1px solid #65824a; border-radius: 18px; background: #07151d; box-shadow: 0 28px 90px #000d; }
.teaching-exercise-dialog::backdrop { background: #02070ddd; backdrop-filter: blur(5px); }
.teaching-exercise-dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 62px; padding: 12px 16px; border-bottom: 1px solid #526b43; background: linear-gradient(100deg,#10251b,#102a31); }
.teaching-exercise-dialog h2, .teaching-exercise-dialog h3, .teaching-exercise-dialog p { margin: 0; }
.teaching-exercise-layout { display: grid; gap: 16px; max-height: calc(90vh - 63px); padding: 18px; overflow: auto; }
.teaching-exercise-summary { display: grid; gap: 12px; }
.teaching-exercise-summary > p:first-child, .teaching-exercise-boundary { color: var(--muted); line-height: 1.5; }
.teaching-exercise-file-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.teaching-exercise-layout fieldset { margin: 0; padding: 12px; border: 1px solid #315f57; border-radius: 12px; }
.teaching-exercise-layout legend { padding: 0 7px; color: var(--cyan); font-weight: 800; }
.teaching-exercise-layout ul { display: grid; gap: 7px; margin: 8px 0 0; padding-left: 23px; }
.teaching-exercise-variants { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.teaching-exercise-variant { display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; align-items: start; padding: 12px; border: 1px solid #31536c; border-radius: 10px; background: #0a1d25; }
.teaching-exercise-variant input { grid-row: 1 / 3; margin-top: 4px; }
.teaching-exercise-variant strong { color: var(--text); }
.teaching-exercise-variant span { color: var(--muted); font-size: .76rem; line-height: 1.45; }
.teaching-exercise-variant[data-known-fault="true"] { border-color: var(--amber); }
#teaching-exercise-install { min-height: 44px; color: #06111a; border-color: var(--lime); background: var(--lime); font-weight: 850; }
.canvas-annotations-dialog { width: min(1100px,94vw); max-width: 94vw; max-height: 90vh; margin: auto; padding: 0; overflow: hidden; color: var(--text); border: 1px solid #665e9f; border-radius: 18px; background: #07151d; box-shadow: 0 28px 90px #000d; }
.canvas-annotations-dialog::backdrop { background: #02070ddd; backdrop-filter: blur(5px); }
.canvas-annotations-dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 62px; padding: 12px 16px; border-bottom: 1px solid #514d7c; background: linear-gradient(100deg,#121c34,#172a2c); }
.canvas-annotations-dialog h2, .canvas-annotations-dialog p { margin: 0; }
.canvas-annotations-layout { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; max-height: calc(90vh - 63px); padding: 18px; overflow: auto; }
.canvas-annotations-boundary, .canvas-annotations-actions, #canvas-annotations-status, .canvas-annotations-list { grid-column: 1 / -1; }
.canvas-annotations-boundary { padding: 11px 13px; border-left: 4px solid #9f8cff; color: var(--muted); background: #171b30; line-height: 1.5; }
.canvas-annotations-create { display: grid; grid-template-columns: minmax(0,1fr) 100px 100px; gap: 8px; align-content: start; padding: 13px; border: 1px solid #343f69; border-radius: 11px; background: #0a1c27; }
.canvas-annotations-create label { display: grid; gap: 5px; color: var(--muted); font-size: .72rem; font-weight: 800; }
.canvas-annotations-create button, .canvas-annotations-create fieldset { grid-column: 1 / -1; }
.canvas-annotations-create fieldset { margin: 0; border: 1px solid #31536c; border-radius: 8px; }
.canvas-net-label-create { grid-column: 1 / -1; grid-template-columns: minmax(180px,1.4fr) minmax(180px,1fr) 100px 100px; }
.canvas-net-label-create small { grid-column: 1 / -1; color: var(--muted); }
.canvas-group-components { display: flex; flex-wrap: wrap; gap: 7px; }
.canvas-group-components label { display: flex; flex-direction: row; align-items: center; gap: 5px; padding: 5px 7px; border-radius: 7px; background: #102536; }
.canvas-annotations-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.canvas-annotations-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.canvas-annotation-editor { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 8px; align-items: end; padding: 12px; border: 1px solid #31536c; border-radius: 10px; background: #091c29; }
.canvas-annotation-editor label { display: grid; gap: 4px; color: var(--muted); font-size: .7rem; font-weight: 800; }
.canvas-annotation-editor small { grid-column: 1 / -1; color: #9f8cff; }
.canvas-annotation-layer { position: absolute; z-index: 7; inset: 0; pointer-events: none; }
.canvas-visual-note { position: absolute; max-width: 220px; padding: 7px 9px; transform: translate(-50%,-50%); border: 1px solid #9f8cff; border-radius: 8px; color: #f1eeff; background: #17172ee8; box-shadow: 0 7px 18px #0008; font-size: .7rem; line-height: 1.35; overflow-wrap: anywhere; pointer-events: auto; }
.canvas-visual-note::before { content: "NOTE · NON-ELECTRICAL"; display: block; margin-bottom: 3px; color: #b8aaff; font-size: .52rem; font-weight: 850; letter-spacing: .08em; }
.canvas-visual-group { position: absolute; min-width: 70px; min-height: 54px; border: 2px dashed #9f8cff; border-radius: 12px; background: #7f67e50d; pointer-events: none; }
.canvas-visual-group button { position: absolute; left: 6px; top: -13px; min-height: 24px; padding: 2px 7px; border-radius: 999px; color: #0a0d16; border-color: #b8aaff; background: #b8aaff; font-size: .58rem; font-weight: 900; white-space: nowrap; pointer-events: auto; }
.canvas-subcircuit-create { border-color: #47d7ac; background: linear-gradient(145deg,#09232a,#0b1e2b); }
.canvas-subcircuit-create h3, .canvas-subcircuit-create p { grid-column: 1 / -1; margin: 0; }
.canvas-subcircuit-create h3 { color: #7dffd2; font-size: .95rem; }
.canvas-subcircuit-create p { color: var(--muted); font-size: .74rem; line-height: 1.45; }
.canvas-subcircuit-editor { grid-template-columns: minmax(72px,.5fr) minmax(72px,.5fr) auto auto auto; border-color: #338d79; }
.canvas-subcircuit-badge { position: absolute; z-index: 3; transform: translate(-50%,-50%); min-height: 27px; padding: 4px 10px; border: 1px solid #63f5c2; border-radius: 999px; color: #051713; background: #63f5c2ed; box-shadow: 0 7px 20px #001b16aa; font-size: .58rem; font-weight: 900; letter-spacing: .05em; white-space: nowrap; pointer-events: auto; }
.canvas-subcircuit-badge.collapsed { color: #dffdf3; background: #12392fef; }
.circuit-component.subcircuit-collapsed-member { opacity: 0; pointer-events: none; }
.canvas-net-label { position: absolute; min-height: 26px; max-width: 220px; padding: 3px 8px; transform: translate(-50%,-50%); border: 2px solid #4fe5ff; border-radius: 5px; color: #dffbff; background: #07212eee; box-shadow: 0 5px 14px #0009; font: 800 .65rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap: anywhere; pointer-events: auto; }
.canvas-net-label-bound-id { display: block; margin-bottom: 2px; color: #73edff; font-size: .48rem; letter-spacing: .06em; }
.canvas-net-label-text { display: block; }
.circuit-component.annotation-highlight { outline: 4px solid #b8aaff; outline-offset: 6px; }
@media (max-width: 760px) { #presentation-instruments, .presentation-instrument-cards, .teaching-exercise-variants, .canvas-net-label-create { grid-template-columns: 1fr; } .presentation-step-editor { grid-template-columns: 1fr; } .presentation-layout { padding: 12px; } }
.workbench-popup-close { color: #06111a; background: var(--lime); border-color: var(--lime); }
.workbench-popup-mount { height: calc(100% - 58px); padding: 12px; overflow: auto; overscroll-behavior: contain; }
.workbench-popup-mount > .panel,
.workbench-popup-mount > details,
.workbench-popup-mount > section,
.workbench-popup-mount > aside { width: 100%; margin: 0 0 10px; box-shadow: none; }
.workbench-popup-mount .shared-source-surface,
.workbench-popup-mount .editor-card { display: block; }
.workbench-popup-mount .code-editor,
.workbench-popup-mount .pico-source,
.workbench-popup-mount .c3-source,
.workbench-popup-mount .stm32-source { min-height: 360px; }
.workbench-popup-mount #serial-dock { position: static; inset: auto; display: block; width: 100%; height: auto; filter: none; }
.workbench-popup-mount #serial-dock > .serial-resizer { display: none; }
.workbench-popup-mount #serial-dock > .instrument-card { width: 100%; }
.workbench-popup-mount .shared-runtime-surface { display: grid; gap: 10px; }
.workbench-popup-mount .catalog,
.workbench-popup-mount .inspector,
.workbench-popup-mount .shared-parts-surface,
.workbench-popup-mount .shared-inspector-surface { position: static; max-height: none; }

@media (max-width: 1180px) {
  .top-workbench-toolbar { grid-template-columns: auto minmax(480px,1fr); }
  .top-primary-controls { grid-column: 1 / -1; }
}
.controller-workbench { display: grid; grid-template-columns: minmax(280px, .85fr) 1.35fr; gap: 16px 24px; margin-bottom: 12px; overflow: hidden; position: relative; }
.project-brief { margin-bottom: 12px; border-color: #315c72; background: linear-gradient(145deg, rgba(12,28,43,.98), rgba(8,24,36,.98)); }
.project-brief-heading, .project-brief-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.project-brief-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.project-brief-grid label { display: grid; gap: 6px; color: var(--text); font-size: .76rem; font-weight: 800; letter-spacing: .03em; }
.project-brief-grid label small { color: var(--muted); font-weight: 500; letter-spacing: 0; }
.project-brief-grid textarea { width: 100%; min-height: 82px; resize: vertical; color: var(--text); background: #06131e; border: 1px solid #31536c; border-radius: 9px; padding: 10px; font: 500 .78rem/1.45 ui-monospace, monospace; }
.project-brief-grid textarea:focus { outline: 2px solid var(--cyan); outline-offset: 1px; }
.project-brief-purpose { grid-column: 1 / -1; }
.project-brief-footer { margin-top: 12px; padding-top: 11px; border-top: 1px solid #26475b; color: var(--muted); font-size: .75rem; }
.project-brief-footer strong, #project-brief-evaluation { color: var(--lime); }
#project-brief-status[data-valid="false"] { color: var(--danger); }
.requirement-trace { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; }
.requirement-trace-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; }
.requirement-trace-heading h3 { margin: 0; font-size: 1rem; }
.requirement-trace-heading .eyebrow { margin-bottom: 5px; }
#requirement-trace-summary { color: var(--amber); font: 700 .72rem ui-monospace, monospace; }
.requirement-trace > p, .requirement-trace-empty { color: var(--muted); font-size: .73rem; line-height: 1.5; }
.requirement-trace-list { display: grid; gap: 9px; margin-top: 10px; }
.requirement-trace-row { display: grid; grid-template-columns: minmax(170px,.8fr) minmax(190px,1fr) minmax(190px,1fr) minmax(220px,1.2fr); gap: 10px; align-items: stretch; padding: 10px; border: 1px solid #284c62; border-radius: 10px; background: #06131e; }
.requirement-trace-cell { min-width: 0; color: var(--muted); font-size: .7rem; line-height: 1.45; }
.requirement-trace-cell strong { display: block; margin-bottom: 4px; color: var(--cyan); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.requirement-trace-cell code { color: var(--text); overflow-wrap: anywhere; }
.requirement-trace-id b { color: var(--text); font: 800 .8rem ui-monospace, monospace; }
.requirement-trace-result { display: grid; gap: 6px; }
.requirement-trace-result [data-result-state="current"] { color: var(--lime); }
.requirement-trace-result [data-result-state="untested"] { color: var(--amber); font-weight: 800; }
.requirement-trace-result button { justify-self: start; min-height: 30px; padding: 5px 9px; }
.open-assumptions { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; }
.open-assumptions > p { color: var(--muted); font-size: .73rem; line-height: 1.5; }
#open-assumptions-summary { color: var(--amber); font: 700 .72rem ui-monospace, monospace; }
.open-assumptions-list { display: grid; gap: 9px; margin-top: 10px; }
.open-assumption-row { display: grid; grid-template-columns: minmax(110px,.45fr) minmax(130px,.5fr) minmax(260px,1.5fr) minmax(180px,.7fr); gap: 10px; padding: 10px; border: 1px solid #5f5130; border-radius: 10px; background: #15150d; }
.open-assumption-row > div { min-width: 0; color: var(--muted); font-size: .72rem; overflow-wrap: anywhere; }
.open-assumption-row strong { display: block; margin-bottom: 4px; color: var(--amber); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.open-assumption-row b { color: var(--text); font: 800 .78rem ui-monospace, monospace; }
.open-assumption-status { color: var(--amber); font-weight: 900; text-transform: uppercase; }
.project-feasibility { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; }
.project-feasibility > p { color: var(--muted); font-size: .73rem; line-height: 1.5; }
#project-feasibility-summary { color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
.project-feasibility-list { display: grid; gap: 9px; margin-top: 10px; }
.feasibility-row { display: grid; grid-template-columns: minmax(120px,.5fr) minmax(210px,.8fr) minmax(130px,.45fr) minmax(280px,1.4fr); gap: 10px; padding: 10px; border: 1px solid #284c62; border-radius: 10px; background: #06131e; }
.feasibility-row > div { min-width: 0; color: var(--muted); font-size: .72rem; overflow-wrap: anywhere; }
.feasibility-row strong { display: block; margin-bottom: 4px; color: var(--cyan); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.feasibility-state { font-weight: 900; text-transform: uppercase; }
.feasibility-state[data-state="available"] { color: var(--lime); }
.feasibility-state[data-state="unsupported"] { color: var(--danger); }
.feasibility-state[data-state="unknown"], .feasibility-state[data-state="unresolved"] { color: var(--amber); }
.project-patch { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; display: grid; gap: 10px; }
.project-patch > p, .project-patch label { color: var(--muted); font-size: .73rem; line-height: 1.5; }
.project-patch label { display: grid; gap: 5px; font-weight: 800; }
.project-patch textarea { width: 100%; resize: vertical; color: var(--text); border: 1px solid #28566d; border-radius: 8px; background: #03101a; font: .7rem/1.5 ui-monospace, monospace; }
#project-patch-summary { color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
#project-patch-status[data-valid="true"] { color: var(--lime); }
#project-patch-status[data-valid="false"] { color: var(--danger); }
.project-patch-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.project-patch-changes { display: grid; gap: 7px; }
.expectation-reference { display: grid; gap: 8px; padding: 12px; border: 1px solid #2d6077; border-radius: 10px; background: #071722; }
.expectation-reference h4, .project-patch-diff-groups h4 { margin: 0; color: var(--text); }
.expectation-reference p { margin: 0; }
#expectation-reference-identity { overflow-wrap: anywhere; color: var(--cyan); }
.experiment-package-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 9px; border-top: 1px solid #26475b; }
#experiment-package-state { color: var(--muted); font: 700 .68rem/1.45 ui-monospace, monospace; }
#experiment-package-state[data-ready="true"] { color: var(--lime); }
#experiment-package-state[data-ready="false"] { color: var(--amber); }
.experiment-package-detail { padding: 8px 10px; border: 1px solid #26475b; border-radius: 8px; background: #04111b; color: var(--muted); font-size: .7rem; line-height: 1.5; }
.experiment-package-detail summary { cursor: pointer; color: var(--cyan); font-weight: 800; }
.experiment-package-detail p { margin: 8px 0 0; }
.experiment-package-comparison { padding: 9px 10px; border: 1px solid #34809a; border-radius: 9px; background: #04111b; color: var(--muted); font-size: .7rem; line-height: 1.5; }
.experiment-package-comparison > summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; color: var(--cyan); font-weight: 800; }
.experiment-package-comparison > summary span:last-child { color: var(--muted); font: 700 .66rem/1.4 ui-monospace, monospace; }
.experiment-package-comparison > p { margin: 9px 0; }
.experiment-package-comparison-actions { display: grid; grid-template-columns: auto minmax(120px,1fr) auto minmax(120px,1fr) auto auto; gap: 7px; align-items: center; }
.experiment-package-comparison-actions span { min-width: 0; overflow-wrap: anywhere; color: var(--muted); font: .65rem/1.35 ui-monospace, monospace; }
#experiment-package-comparison-status[data-valid="true"] { color: var(--lime); }
#experiment-package-comparison-status[data-valid="false"] { color: var(--danger); }
.experiment-package-comparison-review { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 10px; }
.experiment-package-comparison-review[hidden] { display: none; }
.experiment-package-comparison-review > section { min-width: 0; padding: 9px; border: 1px solid #26475b; border-radius: 8px; background: #03101a; }
.experiment-package-comparison-review h5 { margin: 0 0 7px; color: var(--text); }
.experiment-package-comparison-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.experiment-package-comparison-row { min-width: 0; padding: 7px; border: 1px solid #25485b; border-radius: 7px; color: var(--muted); overflow-wrap: anywhere; }
.experiment-package-comparison-row strong { display: block; color: var(--cyan); }
.experiment-package-comparison-row code { color: var(--text); font-size: .64rem; overflow-wrap: anywhere; }
.experiment-package-comparison-row[data-changed="true"] { border-color: var(--amber); }
.experiment-package-comparison-source-diff { min-width: 0; }
.experiment-package-comparison-source-diff summary { cursor: pointer; color: var(--cyan); overflow-wrap: anywhere; }
.experiment-package-comparison-source-diff pre { max-height: 300px; margin: 7px 0 0; padding: 8px; overflow: auto; white-space: pre; color: #d8e8ef; background: #010609; font: .65rem/1.45 ui-monospace, monospace; }
.experiment-package-recipient-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.experiment-package-recipient-actions span { color: var(--muted); font-size: .68rem; }
.guided-replay-dialog { box-sizing: border-box; width: min(1040px, calc(100% - 32px)); max-width: calc(100% - 32px); max-height: calc(100vh - 32px); padding: 0; overflow: hidden; color: var(--text); background: #071521; border: 1px solid #34809a; border-radius: 14px; }
.guided-replay-dialog::backdrop { background: #01070bd9; }
.guided-replay-dialog > header { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 20px 24px; border-bottom: 1px solid #26475b; background: #091b2a; }
.guided-replay-dialog h2, .guided-replay-dialog h3, .guided-replay-dialog h4, .guided-replay-dialog p { margin-top: 0; }
.guided-replay-layout { box-sizing: border-box; display: grid; gap: 14px; width: 100%; min-width: 0; max-height: calc(100vh - 112px); padding: 20px 24px 24px; overflow: auto; overflow-x: hidden; }
.guided-replay-layout > *, .guided-replay-stage, .recipient-exchange { box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%; }
.guided-replay-boundary, .guided-replay-limit { margin-bottom: 0; padding: 10px 12px; border: 1px solid #34809a; border-radius: 8px; color: var(--muted); background: #04111b; }
.guided-replay-boundary strong { color: var(--cyan); }
.guided-replay-identities { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 12px; margin: 0; }
.guided-replay-identities dt { color: var(--muted); }
.guided-replay-identities dd { min-width: 0; margin: 0; overflow-wrap: anywhere; font: .72rem/1.45 ui-monospace, monospace; }
.guided-replay-stage { padding: 16px; border: 1px solid #34809a; border-radius: 10px; background: #04111b; }
.guided-replay-step-heading { display: flex; justify-content: space-between; align-items: end; gap: 18px; }
.guided-replay-step-heading > * { min-width: 0; }
.guided-replay-step-heading label { display: grid; gap: 5px; min-width: min(360px, 45%); color: var(--muted); }
.guided-replay-step-heading select, .recipient-response-grid select, .recipient-response-grid textarea { box-sizing: border-box; min-width: 0; max-width: 100%; }
.guided-replay-code { color: var(--cyan); overflow-wrap: anywhere; font: .72rem/1.45 ui-monospace, monospace; }
.guided-replay-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.guided-replay-cards > section { min-width: 0; padding: 12px; border: 1px solid #26475b; border-radius: 8px; background: #061824; }
.guided-replay-cards ol { margin-bottom: 0; padding-left: 22px; }
.guided-replay-cards li + li { margin-top: 7px; }
.guided-replay-cards dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 12px; margin: 0; }
.guided-replay-cards dd { margin: 0; overflow-wrap: anywhere; }
.guided-replay-explanation { margin: 14px 0; padding: 12px; border-left: 4px solid var(--lime); background: #0a2130; }
.guided-replay-explanation[data-outcome="failed"] { border-color: var(--danger); }
.guided-replay-actions { display: flex; justify-content: space-between; gap: 10px; }
.recipient-exchange { display: grid; gap: 10px; padding: 16px; border: 1px solid #55722b; border-radius: 10px; background: #07180f; }
.recipient-exchange > p { margin-bottom: 0; color: var(--muted); }
.recipient-choice-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.recipient-response-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.recipient-response-grid > section { display: grid; align-content: start; gap: 9px; min-width: 0; padding: 12px; border: 1px solid #355b43; border-radius: 8px; background: #06140d; }
.recipient-response-grid > section > * { box-sizing: border-box; min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.recipient-response-grid label { display: grid; gap: 5px; color: var(--muted); }
.recipient-response-grid textarea { width: 100%; resize: vertical; color: var(--text); background: #03100a; border: 1px solid #41694e; border-radius: 7px; }
.recipient-response-relationship { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 10px; margin: 0; }
.recipient-response-relationship dt { color: var(--muted); }
.recipient-response-relationship dd { min-width: 0; margin: 0; overflow-wrap: anywhere; font: .7rem/1.4 ui-monospace, monospace; }
.guided-replay-dialog .sr-only { display: none; }
@media (max-width: 900px) {
  .experiment-package-comparison-actions { grid-template-columns: auto minmax(0,1fr); }
  .experiment-package-comparison-review { grid-template-columns: 1fr; }
  .guided-replay-step-heading, .guided-replay-cards { display: grid; grid-template-columns: 1fr; }
  .guided-replay-step-heading label { min-width: 0; }
  .recipient-response-grid { grid-template-columns: 1fr; }
}
.project-patch-diff-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.project-patch-diff-groups > section { min-width: 0; padding: 10px; border: 1px solid #26475b; border-radius: 9px; }
.project-patch-change { display: grid; grid-template-columns: 100px 100px minmax(220px,1fr); gap: 10px; padding: 9px 10px; border: 1px solid #28566d; border-radius: 9px; background: #071722; color: var(--muted); font-size: .72rem; }
.project-patch-change strong { color: var(--cyan); text-transform: uppercase; }
.project-patch-change [data-action="added"] { color: var(--lime); }
.project-patch-change [data-action="removed"] { color: var(--danger); }
.project-patch-change [data-action="changed"] { color: var(--amber); }
.authored-change-review { display: grid; gap: 10px; padding: 12px; border: 1px solid #34809a; border-radius: 12px; background: #05141e; }
.authored-change-review[hidden] { display: none; }
.authored-change-review h4, .authored-change-review h5 { margin: 0; color: var(--text); }
#authored-change-review-summary { color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
#authored-change-review-status { margin: 0; color: var(--lime); font-size: .72rem; line-height: 1.5; }
.authored-change-review-identities { display: grid; grid-template-columns: minmax(110px,.35fr) minmax(0,1fr); gap: 6px 10px; padding: 9px; border: 1px solid #26475b; border-radius: 9px; background: #03101a; }
.authored-change-review-identities strong { color: var(--cyan); font-size: .66rem; text-transform: uppercase; }
.authored-change-review-identities code { min-width: 0; color: var(--muted); font-size: .64rem; overflow-wrap: anywhere; }
.authored-change-review-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.authored-change-review-source { display: grid; gap: 8px; padding-top: 10px; border-top: 1px solid #26475b; }
.authored-change-review-source > p { margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.5; }
#authored-change-review-diffs { display: grid; gap: 8px; }
.authored-source-diff { min-width: 0; border: 1px solid #28566d; border-radius: 9px; background: #020a10; }
.authored-source-diff summary { cursor: pointer; padding: 9px 10px; color: var(--cyan); font: 800 .7rem/1.4 ui-monospace, monospace; overflow-wrap: anywhere; }
.authored-source-diff pre { max-height: 420px; margin: 0; padding: 11px; overflow: auto; white-space: pre; color: #d8e8ef; background: #010609; font: .68rem/1.5 ui-monospace, monospace; tab-size: 2; }
@media (max-width: 760px) {
  .project-patch-diff-groups { grid-template-columns: 1fr; }
}
@media (max-height: 700px), (max-width: 900px) {
  .top-workbench-sticky-controls { position: static; }
}
@media (max-width: 1200px) {
  .workbench-popup-controls { grid-template-columns: repeat(5,minmax(0,1fr)); }
  .workbench-help-choices { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
.design-comparison { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; display: grid; gap: 10px; }
.design-comparison > p { color: var(--muted); font-size: .73rem; line-height: 1.5; }
#design-comparison-summary { color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
#design-comparison-status[data-valid="true"] { color: var(--lime); }
#design-comparison-status[data-valid="false"] { color: var(--danger); }
.design-comparison-alternatives { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.design-alternative { min-width: 0; padding: 12px; border: 1px solid #2d6179; border-radius: 12px; background: #061722; display: grid; gap: 9px; }
.design-alternative h4 { margin: 0; color: var(--text); font-size: .88rem; }
.design-alternative code { color: var(--cyan); font-size: .66rem; overflow-wrap: anywhere; }
.design-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
.design-metrics div { padding: 7px; border-radius: 7px; background: #0a2330; color: var(--muted); font-size: .65rem; text-align: center; }
.design-metrics b { display: block; color: var(--text); font-size: .88rem; }
.design-requirements { color: var(--muted); font-size: .68rem; overflow-wrap: anywhere; }
.design-limit { padding: 8px; border-left: 3px solid var(--amber); background: #18170d; color: var(--muted); font-size: .68rem; line-height: 1.45; }
.design-capabilities { display: grid; gap: 5px; }
.design-capability { display: grid; grid-template-columns: minmax(80px,.5fr) minmax(90px,.5fr) minmax(0,1.4fr); gap: 7px; color: var(--muted); font-size: .65rem; }
.design-capability b { color: var(--cyan); }
.design-capability span { text-transform: uppercase; font-weight: 900; }
.design-capability span[data-state="available"] { color: var(--lime); }
.design-capability span[data-state="unsupported"] { color: var(--danger); }
.design-capability span[data-state="unknown"], .design-capability span[data-state="unresolved"] { color: var(--amber); }
@media (max-width: 900px) { .design-comparison-alternatives { grid-template-columns: 1fr; } }
.shared-domain-engine { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; display: grid; gap: 10px; }
.shared-domain-engine > p { color: var(--muted); font-size: .73rem; line-height: 1.5; }
#shared-domain-engine-summary { color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
#shared-domain-engine-status[data-valid="true"] { color: var(--lime); }
#shared-domain-engine-status[data-valid="false"] { color: var(--danger); }
.shared-domain-engine-stages { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.shared-domain-stage { padding: 9px; border: 1px solid #28566d; border-radius: 9px; background: #071722; min-width: 0; }
.shared-domain-stage strong { display: block; color: var(--cyan); font-size: .65rem; text-transform: uppercase; }
.shared-domain-stage code { color: var(--muted); font-size: .64rem; overflow-wrap: anywhere; }
.bounded-actions { margin-top: 14px; padding-top: 14px; border-top: 1px solid #26475b; display: grid; gap: 10px; }
.bounded-actions > p { color: var(--muted); font-size: .73rem; line-height: 1.5; }
.bounded-actions-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(12rem,1fr)); gap: 7px; padding: 0; margin: 0; list-style: none; }
.bounded-actions-list li { display: flex; justify-content: space-between; gap: 9px; padding: 9px; border: 1px solid #28566d; border-radius: 9px; background: #071722; }
.bounded-actions-list span { color: var(--muted); font-size: .64rem; text-align: right; }
#bounded-actions-summary { color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
#bounded-actions-status[data-valid="true"] { color: var(--lime); }
#bounded-actions-status[data-valid="false"] { color: var(--danger); }
.x92-budget { margin-top: 8px; padding: 14px; border: 1px solid #2d6078; border-radius: 12px; background: linear-gradient(145deg,#081b27,#0b2531); display: grid; gap: 10px; min-width: 0; }
.x92-budget h4, .x92-budget h5 { margin: 0; }
.x92-budget > p { margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.5; overflow-wrap: anywhere; }
#x92-budget-summary { color: var(--amber); font: 800 .72rem ui-monospace,monospace; }
.x92-budget[data-active="true"] #x92-budget-summary { color: var(--lime); }
.x92-budget-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.x92-budget-actions button:first-child { background: var(--lime); color: #06130c; }
.x92-budget-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin: 0; }
.x92-budget-metrics div { min-width: 0; padding: 9px; border: 1px solid #28566d; border-radius: 9px; background: #071722; }
.x92-budget-metrics dt { color: var(--muted); font-size: .62rem; text-transform: uppercase; }
.x92-budget-metrics dd { margin: 3px 0 0; color: var(--text); font: 800 .8rem ui-monospace,monospace; overflow-wrap: anywhere; }
.x92-budget-metric-row { display: block; margin-top: 3px; color: var(--muted); font-size: .65rem; font-weight: 650; }
.x92-budget-metric-row[data-kind="consumed"] { color: var(--text); }
.x92-budget-metric-row[data-kind="remaining"] { color: var(--lime); }
.x92-budget-accounting { padding: 8px; border-left: 3px solid var(--amber); background: #17190f; }
.x92-budget-review-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.x92-budget-review-grid section { min-width: 0; padding: 9px; border: 1px solid #26475b; border-radius: 9px; }
.x92-budget-review-grid h5 { color: var(--cyan); font-size: .66rem; text-transform: uppercase; }
.x92-budget-review-grid ol { margin: 7px 0 0; padding-left: 1.25rem; color: var(--muted); font-size: .65rem; overflow-wrap: anywhere; }
#x92-budget-status[data-valid="true"] { color: var(--lime); }
#x92-budget-status[data-valid="false"] { color: var(--danger); }
@media (max-width: 700px) { .x92-budget-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } .x92-budget-review-grid { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .shared-domain-engine-stages { grid-template-columns: 1fr; } }
.controller-workbench::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--lime); }
.controller-workbench[data-mode="c3-preview"]::before,
.controller-workbench[data-mode="c3-source"]::before { background: #24d7ef; }
.controller-workbench[data-mode="rp2040-preview"]::before { background: #d78df2; }
.controller-workbench[data-mode="rp2040-source"]::before { background: #d78df2; }
.profile-future-note { margin: .55rem 0 0; color: var(--muted); font-size: .68rem; line-height: 1.45; }

.pico-public-workbench { display: grid; gap: 1rem; border-color: rgba(215,141,242,.55); }
.pico-public-workbench[hidden] { display: none; }
.pico-public-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.pico-public-heading h2 { margin: .1rem 0 0; }
.pico-public-grid { display: grid; grid-template-columns: minmax(300px,.9fr) minmax(360px,1.1fr); gap: 1rem; }
.pico-public-grid.shared-profile-grid,
.c3-public-grid.shared-profile-grid,
.stm32-public-grid.shared-profile-grid { grid-template-columns: var(--catalog-width) 8px minmax(520px,1fr) 8px var(--inspector-width); grid-template-areas: "parts parts-resizer canvas inspector-resizer inspector"; align-items: start; }
.shared-parts-surface { grid-area: parts; position: sticky; top: 58px; min-width: 0; }
.shared-canvas-surface { grid-area: canvas; }
.shared-inspector-surface { grid-area: inspector; display: grid; gap: .65rem; min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 16px; background: rgba(5,16,27,.72); }
.shared-panel-resizer { align-self: stretch; min-height: 620px; border-radius: 999px; background: linear-gradient(90deg,transparent 2px,#2a627f 3px,#2a627f 5px,transparent 6px); cursor: col-resize; touch-action: none; }
.shared-panel-resizer[data-shared-resizer="parts"] { grid-area: parts-resizer; }
.shared-panel-resizer[data-shared-resizer="inspector"] { grid-area: inspector-resizer; }
.shared-panel-resizer:hover, .shared-panel-resizer:focus-visible { background: linear-gradient(90deg,transparent 1px,var(--lime) 2px,var(--lime) 6px,transparent 7px); outline: 0; }
.shared-project-bar { display: grid; grid-template-columns: minmax(220px,.4fr) 1fr; gap: 16px 24px; align-items: center; margin-bottom: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: 14px; background: rgba(5,16,27,.72); }
.shared-project-heading label { margin-top: 0; }
.shared-project-tools { align-self: center; }
.shared-inspector-surface h2 { font-size: 1rem; }
.shared-runtime-tools::before { content: 'RUNTIME'; width: 100%; color: var(--lime); font: 800 .65rem ui-monospace,monospace; letter-spacing: .12em; }
.shared-source-surface::before { content: '4 · FIRMWARE SOURCE'; color: var(--lime); font: 800 .65rem ui-monospace,monospace; letter-spacing: .12em; }
.shared-workbench-drawer { margin-top: 1rem; }
.shared-runtime-surface { display: grid; gap: .75rem; padding-top: 1rem; }
.shared-build-controls { margin-top: .25rem; }
.shared-serial-surface { margin-top: .1rem; }
.shared-canvas-surface:fullscreen,
.shared-profile-workbench.shared-canvas-focus .shared-canvas-surface { overflow: auto; padding: 20px; border-radius: 0; background: var(--bg); }
.shared-canvas-surface:fullscreen .pico-editor-canvas,
.shared-profile-workbench.shared-canvas-focus .pico-editor-canvas { min-height: max(520px, calc(100vh - 250px)); }
.shared-profile-workbench.shared-canvas-focus .shared-canvas-surface { position: fixed; inset: 0; z-index: 1000; }
body.shared-canvas-focus-open { overflow: hidden; }
.shared-parts-surface .bounded-parts-list { grid-template-columns: 1fr; }
.shared-parts-surface .bounded-part-card small { min-height: 0; }
.shared-inspector-surface .bounded-part-properties { margin-top: .15rem; }
.shared-profile-workbench.parts-collapsed .shared-parts-surface,
.shared-profile-workbench.parts-collapsed [data-shared-resizer="parts"],
.shared-profile-workbench.inspector-collapsed .shared-inspector-surface,
.shared-profile-workbench.inspector-collapsed [data-shared-resizer="inspector"] { display: none; }
.shared-profile-workbench.parts-collapsed:not(.inspector-collapsed) .shared-profile-grid { grid-template-columns: minmax(520px,1fr) 8px var(--inspector-width); grid-template-areas: "canvas inspector-resizer inspector"; }
.shared-profile-workbench.inspector-collapsed:not(.parts-collapsed) .shared-profile-grid { grid-template-columns: var(--catalog-width) 8px minmax(520px,1fr); grid-template-areas: "parts parts-resizer canvas"; }
.shared-profile-workbench.parts-collapsed.inspector-collapsed .shared-profile-grid { grid-template-columns: minmax(520px,1fr); grid-template-areas: "canvas"; }
.pico-project-pane, .pico-circuit-pane { min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 16px; background: rgba(5,16,27,.72); }
.pico-project-pane { display: grid; gap: .65rem; }
.pico-project-pane input:not(.sr-only), .pico-project-pane textarea { width: 100%; }
.pico-source { min-height: 245px; resize: vertical; tab-size: 2; font: 500 .88rem/1.55 var(--mono); color: #dff7ff; background: #050e17; border: 1px solid #315066; border-radius: 12px; padding: .9rem; }
.pico-project-actions, .pico-runtime-actions, .pico-circuit-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.native-file-action[hidden] { display: none; }
.file-connection { margin: .55rem 0 0; color: #a9bfd0; font-size: .72rem; line-height: 1.45; }
.file-connection[data-connected="true"] { color: var(--green); }
.file-connection[data-busy="true"] { color: var(--amber); }
.pico-runtime-actions .primary { background: var(--accent); color: #031018; border-color: var(--accent); }
.pico-message { min-height: 2.8rem; margin: 0; color: #d7e8f3; }
.pico-identities { display: grid; gap: .45rem; margin: 0; }
.pico-identities div { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: .65rem; }
.pico-identities dt { color: var(--muted); }
.pico-identities dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.pico-circuit-pane { display: grid; gap: .8rem; align-content: start; }
.pico-diagram { position: relative; min-height: 340px; overflow: hidden; border: 1px solid #28465b; border-radius: 16px; background-color: #f5f0e6; background-image: linear-gradient(rgba(15,38,54,.07) 1px, transparent 1px),linear-gradient(90deg,rgba(15,38,54,.07) 1px,transparent 1px); background-size: 18px 18px; }
.pico-board-original { position: absolute; left: 8%; top: 10%; width: 31%; height: 78%; border: 4px solid #174663; border-radius: 22px; color: white; background: linear-gradient(145deg,#1688b7,#07516f); box-shadow: 0 16px 28px rgba(0,0,0,.28), inset 0 0 0 2px rgba(255,255,255,.12); }
.pico-board-original > strong { position: absolute; inset: 43% 10% auto; text-align: center; letter-spacing: .12em; font-size: .82rem; }
.pico-usb { position: absolute; left: 31%; top: -4px; width: 38%; padding: .35rem 0; text-align: center; border-radius: 0 0 7px 7px; background: #bec9d0; color: #13232d; font-size: .68rem; }
.pico-chip { position: absolute; left: 28%; top: 30%; width: 44%; padding: .8rem .2rem; text-align: center; border-radius: 5px; background: #14222d; color: #cad5db; font: 600 .65rem var(--mono); }
.pico-pin { position: absolute; left: -7px; display: grid; width: 72%; padding: .28rem .45rem; border: 2px solid #e3b941; border-radius: 8px; background: #102b3b; font: 700 .72rem var(--mono); box-shadow: 0 0 0 3px rgba(227,185,65,.22); }
.pico-pin small { font-size: .58rem; color: #d4e4ed; }
.pico-pin-gp0 { top: 15%; }
.pico-pin-gnd { top: 65%; }
.pico-onboard-led { position: absolute; right: 7%; bottom: 7%; padding: .4rem; border: 1px dashed rgba(255,255,255,.45); border-radius: 8px; color: #e6f6ff; font-size: .64rem; text-align: right; }
.pico-wire { position: absolute; display: block; height: 7px; border-radius: 8px; transform-origin: left center; box-shadow: 0 2px 3px rgba(0,0,0,.25); }
.pico-wire-signal { left: 38%; top: 23%; width: 20%; background: #e7ad16; }
.pico-resistor { position: absolute; left: 55%; top: calc(23% - 10px); z-index: 2; width: 17%; height: 22px; border: 3px solid #b78b5f; border-radius: 10px; background: repeating-linear-gradient(90deg,#e4c9a1 0 20%,#af3f34 20% 27%,#e4c9a1 27% 43%,#222 43% 50%,#e4c9a1 50% 66%,#a8522f 66% 73%,#e4c9a1 73%); }
.pico-resistor-label { position: absolute; left: 63.5%; top: calc(23% - 50px); z-index: 3; transform: translateX(-50%); padding: .18rem .42rem; border: 1px solid #b78b5f; border-radius: 6px; color: #321f14; background: #f5f0e6; white-space: nowrap; font: 800 .68rem/1.2 var(--mono); }
.pico-wire-series { left: 70%; top: 23%; width: 12%; background: #ee3d4f; }
.pico-external-led { position: absolute; left: calc(82% - 18px); top: 16%; z-index: 2; width: 36px; height: 52px; border: 3px solid #942637; border-radius: 18px 18px 6px 6px; background: radial-gradient(circle at 35% 25%,#ffb6bd,#f02e45 45%,#89172a); box-shadow: 0 0 0 4px rgba(238,61,79,.15); }
.pico-wire-led-return { left: calc(82% - 2.5px); top: calc(16% + 46px); width: 5px; height: calc(57% - 42px); background: #252e35; }
.pico-external-led.on { background: radial-gradient(circle at 35% 25%,#fff,#ff6878 30%,#ff243d 58%); box-shadow: 0 0 24px 8px rgba(255,44,69,.72); }
.pico-wire-ground { left: 38%; top: 73%; width: calc(44% + 3px); background: #252e35; }
.pico-diagram[data-connected="false"] .pico-wire-series { width: 5%; opacity: .35; }
.pico-diagram[data-connected="false"] .pico-external-led { box-shadow: none; filter: grayscale(.7); }
.pico-serial-card { border: 1px solid #28465b; border-radius: 12px; background: #030b12; padding: .8rem; }
.pico-serial-card pre { min-height: 72px; margin: .55rem 0 0; color: #a8ff3f; white-space: pre-wrap; }
.pico-editor-heading { display: flex; justify-content: space-between; gap: .8rem; align-items: end; }
.pico-editor-heading div { display: grid; gap: .2rem; }
.pico-editor-heading small, #pico-circuit-selection, #c3-circuit-selection, #stm32-circuit-selection, .pico-editor-help { color: var(--muted); font-size: .72rem; line-height: 1.45; }
#pico-circuit-selection, #c3-circuit-selection, #stm32-circuit-selection { color: var(--cyan); font: 700 .68rem var(--mono); text-align: right; }
.bounded-parts-panel { display: grid; gap: .58rem; padding: .72rem; border: 1px solid #2a5369; border-radius: 12px; background: linear-gradient(145deg,#0b2130,#081722); }
.bounded-parts-panel > header { display: flex; justify-content: space-between; gap: .7rem; align-items: end; }
.bounded-parts-panel > header div { display: grid; gap: .12rem; }
.bounded-parts-panel > header small, .bounded-parts-panel > header > span { color: var(--muted); font-size: .65rem; }
.bounded-parts-panel > header > span { color: var(--lime); font: 750 .62rem var(--mono); white-space: nowrap; }
.bounded-parts-search-label { color: var(--muted); font-size: .68rem; font-weight: 750; }
.bounded-parts-search { min-height: 38px; }
.bounded-parts-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .48rem; }
.bounded-part-card { display: grid; grid-template-columns: 64px minmax(0, 1fr); min-width: 0; gap: .38rem .55rem; align-items: center; padding: .58rem; border: 1px solid #29485b; border-radius: 9px; background: #07141f; }
.bounded-part-card[data-present="false"] { border-color: #a8ff3f99; box-shadow: inset 0 0 0 1px #a8ff3f22; }
.bounded-part-thumbnail { display: grid; place-items: center; width: 64px; height: 58px; overflow: hidden; border: 1px solid #29485b; border-radius: 7px; background: #091b29; }
.bounded-part-thumbnail .component-artwork { width: 58px; height: 52px; object-fit: contain; }
.bounded-part-copy { display: grid; min-width: 0; gap: .2rem; }
.bounded-part-card strong { font-size: .72rem; overflow-wrap: anywhere; }
.bounded-part-card small { min-height: 2.5em; color: var(--muted); font-size: .61rem; line-height: 1.35; }
.bounded-part-card code { color: var(--cyan); font-size: .6rem; overflow-wrap: anywhere; }
.bounded-part-card button { grid-column: 1 / -1; min-height: 31px; padding: .3rem .48rem; font-size: .65rem; }
.bounded-part-card.catalog-item { grid-template-columns: 58px minmax(0,1fr) 70px; gap: 8px; min-height: 70px; padding: 6px; }
.bounded-part-card.catalog-item .bounded-part-thumbnail { width: 56px; height: 52px; }
.bounded-part-card.catalog-item .bounded-part-thumbnail .component-artwork { width: 52px; height: 48px; }
.bounded-part-card.catalog-item .bounded-part-copy { gap: 1px; }
.bounded-part-card.catalog-item .bounded-part-copy small { min-height: 0; }
.bounded-part-card.catalog-item .bounded-part-add { grid-column: 3; grid-row: 1; min-height: 34px; padding: 3px 6px; }
.bounded-part-card[data-present="false"] button { color: #06111a; border-color: var(--lime); background: var(--lime); }
@media (max-width: 430px) {
  .bounded-part-card { grid-template-columns: 54px minmax(0, 1fr); }
  .bounded-part-thumbnail { width: 54px; height: 50px; }
  .bounded-part-thumbnail .component-artwork { width: 49px; height: 45px; }
}
.bounded-part-properties { min-height: 41px; display: grid; align-items: center; padding: .48rem .58rem; border: 1px solid #223f51; border-radius: 9px; background: #050f18; }
.bounded-part-properties > p { margin: 0; color: var(--muted); font-size: .65rem; line-height: 1.4; }
.bounded-property-row { display: grid; grid-template-columns: minmax(110px,.75fr) minmax(120px,1fr); gap: .55rem; align-items: center; }
.bounded-property-row label { display: grid; gap: .1rem; color: var(--text); font-size: .68rem; font-weight: 750; }
.bounded-property-row label small { color: var(--muted); font-size: .59rem; font-weight: 500; }
.bounded-property-row input, .bounded-property-row select { width: 100%; min-width: 0; }
.pico-circuit-actions { align-items: center; }
.pico-circuit-actions button { min-height: 36px; padding-inline: .65rem; font-size: .72rem; }
.named-wire-state { margin: 0; min-height: 2.7em; padding: .55rem .7rem; border: 1px solid #357086; border-radius: 9px; background: #071924; color: #dffaff; font: 700 .68rem/1.45 var(--mono); }
.bounded-wire-colour { display: inline-flex; align-items: center; gap: .35rem; color: var(--muted); font: 700 .65rem/1.2 var(--mono); }
.bounded-wire-colour select { min-width: 6.5rem; }
.bounded-crossing-key { display: flex; align-items: center; gap: .55rem; margin: .45rem 0; color: var(--muted); font: 700 .66rem/1.35 var(--mono); }
.crossing-sample { position: relative; width: 2.2rem; height: 1rem; flex: 0 0 auto; background: linear-gradient(90deg,transparent 45%,#39dff2 45% 55%,transparent 55%); }
.crossing-sample::after { content: ""; position: absolute; left: 0; right: 0; top: .4rem; height: .2rem; border-radius: .2rem; background: #f04f5f; box-shadow: 0 0 0 2px #071924; }
#pico-zoom-value { min-width: 48px; color: var(--cyan); font: 750 .7rem var(--mono); text-align: center; }
.pico-editor-canvas { position: relative; width: 100%; min-height: 500px; overflow: hidden; border: 1px solid #31586a; border-radius: 12px; background-color: var(--canvas-workbench); background-image: linear-gradient(var(--canvas-grid) 1px,transparent 1px),linear-gradient(90deg,var(--canvas-grid) 1px,transparent 1px); background-size: var(--canvas-grid-size); touch-action: none; }
.pico-editor-wires, .pico-editor-components { position: absolute; inset: 0; width: 100%; height: 100%; }
.pico-editor-wires { z-index: 1; overflow: visible; pointer-events: auto; }
.pico-editor-components { z-index: 2; pointer-events: none; }
.pico-editor-part { pointer-events: auto; cursor: grab; filter: drop-shadow(0 8px 8px #24354266); touch-action: none; }
.pico-editor-part.dragging { cursor: grabbing; }
.pico-editor-part.selected { filter: drop-shadow(0 0 6px #4aa817) drop-shadow(0 8px 8px #24354255); }
.pico-editor-part .pin-anchor::after { display: none; }
.pico-editor-part[data-component-type="board.rp2040-pico-v1"] .pin-anchor { width: 24px; min-height: 24px; }
.pico-editor-part-label { position: absolute; left: 50%; top: calc(100% + 7px); transform: translateX(-50%) rotate(calc(-1 * var(--rotation))); width: max-content; max-width: 190px; padding: 3px 6px; border-radius: 4px; background: #06131de8; color: #f6f1e7; font: 700 .62rem/1.25 ui-monospace,monospace; text-align: center; pointer-events: none; }
.pico-editor-pin-label { position: absolute; left: 50%; bottom: calc(100% + 5px); transform: translateX(-50%) rotate(calc(-1 * var(--rotation))); width: max-content; max-width: 180px; padding: 2px 4px; border: 1px solid #35667d; border-radius: 5px; background: #06111af2; color: #f6f1e7; font: 650 .57rem/1.25 ui-monospace,monospace; white-space: nowrap; pointer-events: none; opacity: .94; }
.pico-editor-part[data-component-type="led.basic-v1"] > .pico-editor-part-label { top: auto; bottom: calc(100% + 28px); }
.pico-editor-part[data-component-type="led.basic-v1"] [data-editor-endpoint$=".ANODE"] .pico-editor-pin-label { left: auto; right: 55%; top: calc(100% + 5px); bottom: auto; transform: rotate(calc(-1 * var(--rotation))); transform-origin: 100% 0; }
.pico-editor-part[data-component-type="led.basic-v1"] [data-editor-endpoint$=".CATHODE"] .pico-editor-pin-label { left: 55%; top: calc(100% + 5px); bottom: auto; transform: rotate(calc(-1 * var(--rotation))); transform-origin: 0 0; }
.pico-editor-part[data-component-type="resistor.fixed-v1"] [data-editor-endpoint$=".B"] .pico-editor-pin-label { top: calc(100% - 5px); bottom: auto; }
.pico-editor-part[data-component-type="board.rp2040-pico-v1"] [data-editor-endpoint$=".GND3"] .pico-editor-pin-label,
.pico-editor-part[data-component-type="board.esp32-c3-devmodule-v1"] [data-editor-endpoint$=".GND"] .pico-editor-pin-label,
.pico-editor-part[data-component-type="board.stm32f429zi-nucleo144-v1"] [data-editor-endpoint$=".GND"] .pico-editor-pin-label { top: calc(100% + 5px); bottom: auto; }
.pico-editor-wire { fill: none; stroke: var(--wire-color,#39dff2); stroke-width: 4; vector-effect: non-scaling-stroke; opacity: .96; stroke-linejoin: round; stroke-linecap: round; pointer-events: none; filter: drop-shadow(0 2px 1px #0004); }
.pico-editor-wire.selected { stroke-width: 6; filter: drop-shadow(0 0 5px #5aaf2b); }
.pico-editor-wire-hit { fill: none; stroke: transparent; stroke-width: 22; vector-effect: non-scaling-stroke; pointer-events: stroke; cursor: pointer; }
.pico-editor-wire-hit:focus-visible { outline: none; stroke: #a8ff3f55; }
.pico-editor-segment-hit { fill: none; stroke: transparent; stroke-width: 18; vector-effect: non-scaling-stroke; pointer-events: stroke; cursor: ns-resize; }
.pico-editor-segment-hit[data-orientation="vertical"] { cursor: ew-resize; }
.pico-editor-segment-hit:focus-visible, .pico-editor-segment-hit.selected { stroke: #a8ff3f66; }
.pico-wire-crossing { fill: #071924; stroke: #dffaff; stroke-width: 1.5; vector-effect: non-scaling-stroke; pointer-events: none; }
.pico-editor-help { margin: -.2rem 0 0; }
.pico-board-pcb { fill: #226457; stroke: #0d342d; stroke-width: 2; }
.pico-board-usb { fill: #bbc7cd; stroke: #63737c; stroke-width: 2; }
.pico-board-chip { fill: #16232a; stroke: #6b7b83; stroke-width: 1.4; }
.pico-board-flash { fill: #25373e; stroke: #82939a; stroke-width: 1; }
.pico-board-led { fill: #607367; stroke: #b9d7c5; stroke-width: 1; }
.pico-board-led-label, .pico-board-pin-label, .pico-board-subtitle { fill: #d4eee4; font: 600 5.8px ui-monospace,monospace; letter-spacing: .02em; }
.pico-board-title { fill: #f6fff9; font: 800 16px ui-sans-serif,sans-serif; letter-spacing: .08em; }
.pico-board-pin { fill: #b78f3d; stroke: #f5d880; stroke-width: .8; }
.pico-board-pin.proven { fill: #ecba43; stroke: #fff1a6; stroke-width: 1.3; }
.c3-editor-board-pcb { fill: #147fa2; stroke: #073f59; stroke-width: 3; }
.c3-editor-board-usb { fill: #c7d1d6; stroke: #63737c; stroke-width: 2; }
.c3-editor-board-chip { fill: #14222d; stroke: #6b7b83; stroke-width: 1.5; }
.c3-editor-board-module { fill: #0d526d; stroke: #83cee5; stroke-width: 1.3; }
.c3-editor-board-title { fill: #f5fbff; font: 800 14px ui-sans-serif,sans-serif; letter-spacing: .07em; }
.c3-editor-board-subtitle, .c3-editor-board-pin-label { fill: #d9f4ff; font: 650 6px ui-monospace,monospace; }
.c3-editor-board-pin { fill: #bd8e2d; stroke: #f5d880; stroke-width: .8; }
.c3-editor-board-pin.proven { fill: #ecba43; stroke: #fff1a6; stroke-width: 1.4; }
.stm32-editor-board-pcb { fill: #3157a3; stroke: #19346f; stroke-width: 3; }
.stm32-editor-board-usb { fill: #d7dce2; stroke: #687482; stroke-width: 2; }
.stm32-editor-board-module { fill: #aebac8; stroke: #526477; stroke-width: 2; }
.stm32-editor-board-chip { fill: #171c24; stroke: #7c8b9d; stroke-width: 2; }
.stm32-editor-board-chip-label { fill: #eef4ff; font: 800 10px ui-monospace,monospace; letter-spacing: 1px; }
.stm32-editor-board-title { fill: #f4f7ff; font: 800 13px ui-sans-serif,sans-serif; letter-spacing: .06em; }
.stm32-editor-board-subtitle, .stm32-editor-board-pin-label { fill: #dce7ff; font: 650 6px ui-monospace,monospace; }
.stm32-editor-board-pin { fill: #aa7d29; stroke: #f1d06a; stroke-width: .8; }
.stm32-editor-board-pin.proven { fill: #efbd42; stroke: #fff2ab; stroke-width: 1.4; }

@media (max-width: 860px) {
  .pico-public-grid { grid-template-columns: 1fr; }
  .pico-diagram { min-height: 310px; }
  .pico-editor-canvas { min-height: 470px; }
}

@media (max-width: 430px) {
  .pico-public-workbench { padding: .7rem; }
  .pico-public-grid { gap: .7rem; }
  .pico-project-pane, .pico-circuit-pane { padding: .75rem; }
  .pico-runtime-actions button, .pico-project-actions button, .pico-circuit-actions button { flex: 1 1 120px; }
  .pico-identities div { grid-template-columns: 1fr; gap: .15rem; }
  .pico-diagram { min-height: 280px; }
  .pico-board-original { left: 5%; width: 34%; }
  .pico-editor-canvas { min-height: 430px; }
  .pico-editor-heading { align-items: start; }
  .bounded-parts-list { grid-template-columns: 1fr; }
  .bounded-property-row { grid-template-columns: 1fr; }
  .pico-editor-pin-label { font-size: .52rem; }
  .pico-editor-part[data-component-type="board.rp2040-pico-v1"] .pin-anchor { width: 28px; min-height: 14px; height: 14px; }
  .circuit-component.pico-editor-part { scale: 1; }
}

.c3-public-workbench { display: grid; gap: 1rem; border-color: rgba(36,215,239,.58); background: linear-gradient(145deg,rgba(8,39,53,.95),rgba(6,18,29,.98) 68%); }
.c3-public-workbench[hidden] { display: none; }
.c3-public-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.c3-public-heading h2 { margin: .1rem 0 0; }
.c3-boundary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.c3-boundary-grid article { display: grid; gap: .35rem; padding: .85rem; border: 1px solid #21536a; border-radius: 12px; background: rgba(2,12,20,.68); }
.c3-boundary-grid small { color: var(--cyan); font: 850 .65rem var(--mono); letter-spacing: .09em; }
.c3-boundary-grid strong { color: var(--text); }
.c3-boundary-grid span { color: var(--muted); font-size: .75rem; line-height: 1.45; }
.c3-public-grid { display: grid; grid-template-columns: minmax(300px,.9fr) minmax(360px,1.1fr); gap: 1rem; }
.c3-project-pane, .c3-circuit-pane { min-width: 0; padding: 1rem; border: 1px solid #1e4d63; border-radius: 16px; background: rgba(3,14,23,.78); }
.c3-project-pane { display: grid; gap: .65rem; }
.c3-project-pane input:not(.sr-only), .c3-project-pane textarea { width: 100%; }
.c3-source { min-height: 280px; resize: vertical; tab-size: 2; font: 500 .86rem/1.5 var(--mono); color: #dff7ff; background: #020b12; border: 1px solid #31566b; border-radius: 12px; padding: .9rem; }
.c3-project-actions, .c3-runtime-actions, .c3-circuit-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.c3-circuit-actions { align-items: center; }
.c3-circuit-actions button { min-height: 36px; padding-inline: .65rem; font-size: .72rem; }
#c3-zoom-value { min-width: 48px; color: var(--cyan); font: 750 .7rem var(--mono); text-align: center; }
.c3-editor-canvas { min-height: 500px; }
.c3-runtime-actions .primary { color: #031018; background: var(--lime); border-color: var(--lime); }
.c3-message { min-height: 2.8rem; margin: 0; color: #d7e8f3; }
.c3-identities { display: grid; gap: .45rem; margin: 0; }
.c3-identities div { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: .65rem; }
.c3-identities dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.c3-circuit-pane { display: grid; gap: .8rem; align-content: start; }
.c3-diagram { position: relative; min-height: 350px; overflow: hidden; border: 1px solid #31566b; border-radius: 16px; background-color: #f5f0e6; background-image: linear-gradient(rgba(15,38,54,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(15,38,54,.07) 1px,transparent 1px); background-size: 18px 18px; }
.c3-board-original { position: absolute; left: 5%; top: 8%; width: 36%; height: 80%; border: 4px solid #174663; border-radius: 18px; color: white; background: linear-gradient(145deg,#137ea8,#08455f); box-shadow: 0 16px 28px rgba(0,0,0,.28),inset 0 0 0 2px rgba(255,255,255,.12); }
.c3-board-original > strong { position: absolute; inset: 42% 10% auto; text-align: center; letter-spacing: .1em; font-size: .83rem; }
.c3-usb { position: absolute; left: -4px; top: 32%; width: 28%; padding: .5rem 0; text-align: center; border-radius: 0 7px 7px 0; color: #13232d; background: #bec9d0; font-size: .65rem; }
.c3-chip { position: absolute; left: 39%; top: 29%; width: 42%; padding: .85rem .2rem; text-align: center; border-radius: 6px; color: #cad5db; background: #14222d; font: 600 .65rem var(--mono); }
.c3-pin { position: absolute; right: -8px; display: grid; width: 58%; padding: .28rem .45rem; border: 2px solid #e3b941; border-radius: 8px; color: #fff; background: #102b3b; box-shadow: 0 0 0 3px rgba(227,185,65,.22); font: 700 .7rem var(--mono); }
.c3-pin small { color: #d4e4ed; font-size: .57rem; }
.c3-pin-gpio2 { top: 19%; }
.c3-pin-gnd { top: 69%; }
.c3-wire { position: absolute; display: block; height: 7px; border-radius: 8px; box-shadow: 0 2px 3px rgba(0,0,0,.25); }
.c3-wire-signal { left: 40%; top: 28%; width: 15%; background: #e7ad16; }
.c3-resistor { position: absolute; z-index: 2; left: 53%; top: calc(28% - 10px); width: 16%; height: 22px; border: 3px solid #b78b5f; border-radius: 10px; background: repeating-linear-gradient(90deg,#e4c9a1 0 20%,#af3f34 20% 27%,#e4c9a1 27% 43%,#222 43% 50%,#e4c9a1 50% 66%,#a8522f 66% 73%,#e4c9a1 73%); }
.c3-resistor-label { position: absolute; z-index: 3; left: 61%; top: calc(28% - 46px); transform: translateX(-50%); padding: .18rem .42rem; border: 1px solid #b78b5f; border-radius: 6px; color: #321f14; background: #f5f0e6; white-space: nowrap; font: 800 .68rem/1.2 var(--mono); }
.c3-wire-series { left: 68%; top: 28%; width: 14%; background: #ee3d4f; }
.c3-external-led { position: absolute; z-index: 2; left: calc(82% - 18px); top: 20%; width: 36px; height: 52px; border: 3px solid #942637; border-radius: 18px 18px 6px 6px; background: radial-gradient(circle at 35% 25%,#ffb6bd,#f02e45 45%,#89172a); box-shadow: 0 0 0 4px rgba(238,61,79,.15); }
.c3-wire-return-vertical { left: calc(82% - 2.5px); top: calc(20% + 46px); width: 5px; height: calc(56% - 42px); background: #252e35; }
.c3-wire-ground { left: 40%; top: 76%; width: calc(42% + 3px); background: #252e35; }
.c3-diagram[data-led="on"] .c3-external-led { background: radial-gradient(circle at 35% 25%,#fff,#ff6878 30%,#ff243d 58%); box-shadow: 0 0 24px 8px rgba(255,44,69,.72); }
.c3-diagram[data-connected="false"] .c3-wire-ground { left: 40%; width: 19%; opacity: .35; }
.c3-diagram[data-connected="false"] .c3-wire-return-vertical { height: 12%; opacity: .35; }
.c3-diagram[data-connected="false"] .c3-external-led { box-shadow: none; filter: grayscale(.7); }
.c3-terminal-card { padding: .8rem; border: 1px solid #284f65; border-radius: 12px; background: #020a10; }
.c3-terminal-card pre { min-height: 76px; margin: .55rem 0 0; color: #a8ff3f; white-space: pre-wrap; overflow-wrap: anywhere; }
.c3-model-label { margin: 0; color: #bfd1db; font-size: .74rem; line-height: 1.5; }
.c3-model-label strong:last-child { color: var(--amber); }

@media (max-width: 860px) {
  .c3-public-grid, .c3-boundary-grid { grid-template-columns: 1fr; }
  .c3-diagram { min-height: 320px; }
  .c3-editor-canvas { min-height: 470px; }
}
@media (max-width: 430px) {
  .c3-public-workbench { padding: .7rem; }
  .c3-public-grid { gap: .7rem; }
  .c3-project-pane, .c3-circuit-pane { padding: .75rem; }
  .c3-runtime-actions button, .c3-project-actions button, .c3-circuit-actions button { flex: 1 1 120px; }
  .c3-identities div { grid-template-columns: 1fr; gap: .15rem; }
  .c3-diagram { min-height: 285px; }
  .c3-editor-canvas { min-height: 430px; }
  .c3-board-original { left: 3%; width: 39%; }
}
.stm32-public-workbench { display: grid; gap: 1rem; border-color: rgba(126,167,255,.62); background: linear-gradient(145deg,rgba(21,34,63,.96),rgba(6,18,29,.98) 68%); }
.stm32-public-workbench[hidden] { display: none; }
.stm32-public-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.stm32-public-heading h2 { margin: .1rem 0 0; }
.stm32-boundary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.stm32-boundary-grid article { display: grid; gap: .35rem; padding: .85rem; border: 1px solid #3d5687; border-radius: 12px; background: rgba(4,12,26,.72); }
.stm32-boundary-grid small { color: #9cbbff; font: 850 .65rem var(--mono); letter-spacing: .09em; }
.stm32-boundary-grid strong { color: var(--text); }
.stm32-boundary-grid span { color: var(--muted); font-size: .75rem; line-height: 1.45; }
.stm32-public-grid { display: grid; grid-template-columns: minmax(300px,.9fr) minmax(390px,1.1fr); gap: 1rem; }
.stm32-project-pane, .stm32-circuit-pane { min-width: 0; padding: 1rem; border: 1px solid #324a78; border-radius: 16px; background: rgba(3,10,23,.8); }
.stm32-project-pane { display: grid; gap: .65rem; }
.stm32-project-pane input:not(.sr-only), .stm32-project-pane textarea { width: 100%; }
.stm32-source { min-height: 280px; resize: vertical; tab-size: 2; font: 500 .86rem/1.5 var(--mono); color: #e5ecff; background: #020813; border: 1px solid #405a87; border-radius: 12px; padding: .9rem; }
.stm32-project-actions, .stm32-runtime-actions, .stm32-circuit-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.stm32-runtime-actions .primary { color: #031018; background: var(--lime); border-color: var(--lime); }
.stm32-message { min-height: 2.8rem; margin: 0; color: #dce5fa; }
.stm32-identities { display: grid; gap: .45rem; margin: 0; }
.stm32-identities div { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: .65rem; }
.stm32-identities dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.stm32-circuit-pane { display: grid; gap: .8rem; align-content: start; }
.stm32-editor-canvas { min-height: 500px; border-color: #405a87; }
.stm32-diagram { display: block; width: 100%; height: auto; min-height: 310px; overflow: hidden; border: 1px solid #405a87; border-radius: 16px; background: #f5f0e6; }
.stm32-board-body { fill: #3157a3; stroke: #19346f; stroke-width: 5; filter: drop-shadow(0 14px 12px rgba(0,0,0,.24)); }
.stm32-board-module { fill: #d7dce2; stroke: #687482; stroke-width: 3; }
.stm32-chip { fill: #171c24; stroke: #66717c; stroke-width: 3; }
.stm32-chip-label { fill: #eef4ff; font: 800 19px var(--mono); letter-spacing: 2px; }
.stm32-chip-sub { fill: #9fb4d8; font: 700 12px var(--mono); letter-spacing: 3px; }
.stm32-board-hole { fill: #101a28; stroke: #d6bb5b; stroke-width: 4; }
.stm32-pin-block { fill: #10243b; stroke: #e3b941; stroke-width: 3; }
.stm32-pin-label { fill: #fff; font: 850 13px var(--mono); }
.stm32-pin-number { fill: #bfcfe8; font: 700 9px var(--mono); }
.stm32-wire-signal, .stm32-wire-led, .stm32-wire-ground, .stm32-lead { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.stm32-wire-signal { stroke: #e2ab1b; stroke-width: 9; }
.stm32-wire-led { stroke: #e13e51; stroke-width: 9; }
.stm32-wire-ground { stroke: #202a34; stroke-width: 9; }
.stm32-lead { stroke: #6c7378; stroke-width: 6; }
.stm32-resistor { fill: #e1c79c; stroke: #92724c; stroke-width: 3; }
.stm32-part-label { fill: #342218; font: 850 14px var(--mono); }
.stm32-led { fill: #8d2435; stroke: #ff6878; stroke-width: 4; filter: drop-shadow(0 0 4px rgba(238,61,79,.25)); transition: fill .12s ease, filter .12s ease; }
.stm32-diagram[data-led="on"] .stm32-led { fill: #ff3048; filter: drop-shadow(0 0 17px rgba(255,44,69,.9)); }
.stm32-path-label { fill: #42505a; font: 750 11px var(--mono); }
.stm32-terminal-card { padding: .8rem; border: 1px solid #354e7b; border-radius: 12px; background: #020812; }
.stm32-terminal-card pre { min-height: 96px; margin: .55rem 0 0; color: #a8ff3f; white-space: pre-wrap; overflow-wrap: anywhere; }
.stm32-model-label { margin: 0; color: #bfd0e9; font-size: .74rem; line-height: 1.5; }
.stm32-model-label strong:last-child { color: var(--amber); }
.controller-workbench[data-mode="stm32-source"]::before { background: #7ea7ff; }

@media (max-width: 860px) {
  .stm32-public-grid, .stm32-boundary-grid { grid-template-columns: 1fr; }
  .stm32-diagram { min-height: 0; }
}
@media (max-width: 430px) {
  .stm32-public-workbench { padding: .7rem; }
  .stm32-public-grid { gap: .7rem; }
  .stm32-project-pane, .stm32-circuit-pane { padding: .75rem; }
  .stm32-runtime-actions button, .stm32-project-actions button { flex: 1 1 130px; }
  .stm32-identities div { grid-template-columns: 1fr; gap: .15rem; }
}
.controller-workbench-copy { min-width: 0; }
.controller-profile-picker { display: grid; align-content: start; gap: 7px; padding: 11px 12px; border: 1px solid #1c4157; border-radius: 10px; background: #07141f; }
.controller-profile-picker label { color: var(--cyan); font: 800 .65rem ui-monospace, monospace; letter-spacing: .09em; text-transform: uppercase; }
.controller-profile-picker .truth { margin: 0; }
.controller-title-row { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.controller-title-row h2 { font-size: clamp(1.15rem, 2vw, 1.55rem); }
.controller-badge { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; border: 1px solid #6aa633; border-radius: 999px; color: #08141f; background: var(--lime); font: 850 .64rem ui-monospace, monospace; letter-spacing: .04em; text-transform: uppercase; }
.controller-badge.preview { border-color: #9a6b32; color: #ffe6bd; background: #422b13; }
.controller-summary { margin: 12px 0 0; color: var(--muted); line-height: 1.55; }
.controller-capabilities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.controller-capabilities div { display: block; padding: 11px 12px; border: 1px solid #1c4157; border-radius: 10px; background: #07141f; }
.controller-capabilities dt { margin-bottom: 5px; color: var(--cyan); font: 800 .65rem ui-monospace, monospace; letter-spacing: .09em; text-transform: uppercase; }
.controller-capabilities dd { margin: 0; color: #c7dae3; font: 600 .75rem/1.45 ui-monospace, monospace; text-align: left; }
.profile-migration-explanation { grid-column: 1 / -1; min-width: 0; border: 1px solid #31536c; border-radius: 10px; background: #07141f; }
.profile-migration-explanation[hidden] { display: none; }
.profile-migration-explanation summary { padding: 10px 12px; color: var(--cyan); cursor: pointer; font: 800 .72rem/1.4 ui-monospace, monospace; }
.profile-migration-explanation[open] summary { border-bottom: 1px solid #26475b; }
.profile-migration-explanation > .truth, .profile-migration-warning { margin: 10px 12px; font-size: .72rem; line-height: 1.5; }
.profile-migration-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 0 12px 10px; }
.profile-migration-grid section { min-width: 0; padding: 9px 10px; border: 1px solid #1c4157; border-radius: 8px; background: #06111a; }
.profile-migration-grid h3 { margin: 0 0 6px; color: var(--text); font-size: .75rem; }
.profile-migration-grid ul { margin: 0; padding-left: 18px; color: var(--muted); font-size: .69rem; line-height: 1.5; overflow-wrap: anywhere; }
.profile-migration-warning { color: var(--amber); }
.controller-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.controller-actions #controller-primary-action { color: #06111a; background: var(--lime); border-color: var(--lime); }
.controller-actions #controller-return-avr { border-color: var(--cyan); color: var(--cyan); }
.controller-limitation, .controller-workbench > .truth { margin: 0; font-size: .74rem; line-height: 1.55; }
.controller-limitation { align-self: center; color: var(--amber); }
.controller-workbench > .truth { grid-column: 1 / -1; padding-top: 11px; border-top: 1px solid var(--line); }
.workspace[hidden] { display: none; }
.parked-circuit-notice { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 12px; padding: 11px 12px; border: 1px solid #9a6b32; border-radius: 10px; color: #ffe6bd; background: #422b13; font-size: .76rem; line-height: 1.45; }
.parked-circuit-notice strong { color: var(--amber); }
.parked-circuit-notice span { color: #e8cda8; }
.workspace { display: grid; grid-template-columns: var(--catalog-width) 8px minmax(620px, 1fr) 8px var(--inspector-width); gap: 8px; align-items: start; }
.workspace > .catalog { grid-column: 1; }
.workspace > #catalog-resizer { grid-column: 2; }
.workspace > .board-card { grid-column: 3; }
.workspace > #inspector-resizer { grid-column: 4; }
.workspace > .inspector { grid-column: 5; }
.catalog, .inspector { position: sticky; top: 12px; }
.panel-resizer { align-self: stretch; min-height: 680px; padding: 0; border: 0; border-radius: 999px; background: linear-gradient(90deg, transparent 2px, #2a627f 3px, #2a627f 5px, transparent 6px); cursor: col-resize; box-shadow: none; touch-action: none; }
.panel-resizer:hover, .panel-resizer:focus-visible { background: linear-gradient(90deg, transparent 1px, var(--lime) 2px, var(--lime) 6px, transparent 7px); outline: 0; }
.workspace.catalog-collapsed .catalog, .workspace.catalog-collapsed #catalog-resizer,
.workspace.inspector-collapsed .inspector, .workspace.inspector-collapsed #inspector-resizer { display: none; }
.workspace.catalog-collapsed:not(.inspector-collapsed) { grid-template-columns: minmax(620px, 1fr) 8px var(--inspector-width); }
.workspace.catalog-collapsed:not(.inspector-collapsed) > .board-card { grid-column: 1; }
.workspace.catalog-collapsed:not(.inspector-collapsed) > #inspector-resizer { grid-column: 2; }
.workspace.catalog-collapsed:not(.inspector-collapsed) > .inspector { grid-column: 3; }
.workspace.inspector-collapsed:not(.catalog-collapsed) { grid-template-columns: var(--catalog-width) 8px minmax(620px, 1fr); }
.workspace.inspector-collapsed:not(.catalog-collapsed) > .catalog { grid-column: 1; }
.workspace.inspector-collapsed:not(.catalog-collapsed) > #catalog-resizer { grid-column: 2; }
.workspace.inspector-collapsed:not(.catalog-collapsed) > .board-card { grid-column: 3; }
.workspace.catalog-collapsed.inspector-collapsed { grid-template-columns: minmax(620px, 1fr); }
.workspace.catalog-collapsed.inspector-collapsed > .board-card { grid-column: 1; }
.workspace.canvas-focus { grid-template-columns: minmax(0, 1fr); }
.workspace.canvas-focus .catalog, .workspace.canvas-focus .inspector, .workspace.canvas-focus .panel-resizer { display: none; }
.workspace.canvas-focus .board-card { grid-column: 1; }
body.serial-dock-open .workspace { grid-template-columns: minmax(620px, 1fr) 8px var(--inspector-width); }
body.serial-dock-open .workspace .catalog, body.serial-dock-open .workspace #catalog-resizer { display: none; }
body.serial-dock-open .workspace .board-card { grid-column: 1; }
body.serial-dock-open .workspace #inspector-resizer { grid-column: 2; }
body.serial-dock-open .workspace .inspector { grid-column: 3; }
body.serial-dock-open .workspace.inspector-collapsed { grid-template-columns: minmax(620px, 1fr); }
body.serial-dock-open .workspace.inspector-collapsed .board-card { grid-column: 1; }
label { display: block; color: var(--muted); font-size: .82rem; margin: 14px 0 6px; }
button, select, input { min-height: 42px; border-radius: 8px; border: 1px solid #2a627f; background: #102d41; color: var(--text); font: inherit; }
button, .file-button { padding: 0 12px; font-weight: 740; }
select, input { width: 100%; padding: 0 10px; }
button:enabled:hover, .file-button:hover { border-color: var(--cyan); cursor: pointer; }
button:focus-visible, select:focus-visible, textarea:focus-visible, input:focus-visible, .file-button:focus-visible, .circuit-component:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
button:disabled, select:disabled { opacity: .42; }
.file-button { display: inline-flex; align-items: center; min-height: 42px; margin: 0; border: 1px solid #2a627f; border-radius: 8px; background: #102d41; color: var(--text); }
.check-row { display: flex; align-items: center; gap: 8px; }
.check-row input { width: auto; min-height: auto; }
.catalog-count { margin: 12px 0 4px; color: var(--muted); font-size: .76rem; }
.catalog-release-feature { display: grid; grid-template-columns: 62px minmax(0,1fr); gap: 7px 10px; align-items: center; margin: 10px 0 12px; padding: 9px; border: 1px solid #6aa633; border-radius: 11px; background: linear-gradient(145deg,#112718,#071b22); }
.catalog-release-feature-artwork { display: grid; grid-row: 1 / span 2; place-items: center; width: 62px; height: 68px; overflow: hidden; border: 1px solid #456d2d; border-radius: 8px; background: #091b29; }
.catalog-release-feature-artwork .component-artwork,
.catalog-release-feature-artwork .traffic-light-artwork,
.catalog-release-feature-artwork .dht11-artwork,
.catalog-release-feature-artwork .dht22-artwork { width: 58px; height: 64px; object-fit: contain; }
.catalog-release-feature-copy { display: grid; min-width: 0; gap: 2px; }
.catalog-release-feature-copy strong { font-size: .8rem; }
.catalog-release-feature-copy small { color: var(--muted); font-size: .64rem; line-height: 1.35; }
.catalog-release-feature button { grid-column: 2; min-height: 32px; color: #07121d; background: var(--lime); border-color: var(--lime); font-size: .67rem; }
.catalog-empty { margin: 8px 0; padding: 12px; border: 1px solid #36516a; border-radius: 10px; background: #0b1a28; color: var(--muted); font-size: .76rem; }
.catalog-empty strong, .catalog-empty span { display: block; }
.catalog-empty strong { color: var(--text); margin-bottom: 4px; }
.catalog-empty button { width: 100%; margin-top: 10px; }
.catalog-list { display: grid; gap: 8px; margin-top: 8px; max-height: 520px; overflow: auto; scrollbar-gutter: stable; }
.catalog-pagination { display: grid; grid-template-columns: 1fr auto 1fr; gap: 6px; align-items: center; margin-top: 8px; }
.catalog-pagination button { min-height: 34px; padding: 0 7px; font-size: .68rem; }
.catalog-pagination output { color: var(--muted); font: 650 .66rem ui-monospace, monospace; text-align: center; white-space: nowrap; }
.catalog-item { display: grid; grid-template-columns: 58px minmax(0, 1fr) 34px; gap: 8px; align-items: center; width: 100%; min-height: 70px; padding: 6px; text-align: left; }
.catalog-item[role="listitem"] { cursor: default; }
.catalog-item-copy { min-width: 0; }
.catalog-item strong { display: block; font-size: .78rem; }
.catalog-item small { display: block; color: var(--muted); font-weight: 500; overflow-wrap: anywhere; }
.catalog-favourite { min-height: 34px; padding: 0; font-size: 1rem; }
.catalog-thumbnail { width: 56px; height: 52px; object-fit: contain; pointer-events: none; }
.support-badge { display: inline-block; margin-top: 4px; padding: 2px 6px; border-radius: 999px; color: #07121d; background: var(--lime); font-size: .58rem; font-weight: 850; letter-spacing: .04em; }
.support-badge.partial { background: var(--amber); }
.support-badge.visual { background: #aab5bc; }
.catalog-support-card { margin-top: 12px; padding: 12px; border: 1px solid #2a627f; border-radius: 12px; background: linear-gradient(145deg, #0a1a29, #0d2433); }
.catalog-support-card h3 { margin: 3px 0 6px; font-size: .88rem; }
.catalog-support-card p:not(.eyebrow) { margin: 0 0 10px; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.catalog-support-card button { width: 100%; }
.canvas-tools { margin: 13px 0 8px; }
.canvas-tools button { min-width: 42px; padding: 0 8px; }
.canvas-tools output { min-width: 54px; text-align: center; color: var(--cyan); font: 700 .78rem ui-monospace, monospace; }
.canvas-mode { display: inline-flex; gap: 3px; padding: 3px; border: 1px solid #21445b; border-radius: 10px; background: #07141f; }
.canvas-mode button { min-height: 34px; }
.canvas-mode button[aria-pressed="true"] { color: #07121d; background: var(--lime); border-color: var(--lime); }
.circuit-canvas[data-mode="interact"] .pin-anchor,
.circuit-canvas[data-mode="interact"] .wire-segment-hit { pointer-events: none; }
.circuit-canvas[data-mode="interact"] .circuit-component { cursor: default; }
.circuit-canvas { height: 590px; position: relative; border-radius: 12px; overflow: hidden; background-color: var(--canvas-workbench); background-image: linear-gradient(var(--canvas-grid) 1px, transparent 1px), linear-gradient(90deg, var(--canvas-grid) 1px, transparent 1px); background-size: var(--canvas-grid-size); touch-action: none; }
.workspace.canvas-focus .circuit-canvas { height: min(74vh, 820px); }
.board-card:fullscreen { overflow: auto; border-radius: 0; padding: 22px; background: var(--bg); }
.board-card:fullscreen .circuit-canvas { height: calc(100vh - 190px); }
.canvas-transform { position: absolute; inset: 0; transform-origin: 50% 50%; }
.component-layer, .circuit-wires { position: absolute; inset: 0; width: 100%; height: 100%; }
.component-layer { z-index: 2; pointer-events: none; }
.circuit-component, .pin-anchor { pointer-events: auto; }
.circuit-wires { z-index: 1; overflow: visible; pointer-events: auto; }
.circuit-wire { fill: none; stroke: var(--wire-color, #39dff2); stroke-width: 3; vector-effect: non-scaling-stroke; opacity: .94; stroke-linejoin: round; stroke-linecap: round; pointer-events: none; }
.circuit-wire.drag-source { opacity: .28; }
.wire-segment-hit { fill: none; stroke: transparent; stroke-width: 18; vector-effect: non-scaling-stroke; pointer-events: stroke; touch-action: none; }
.wire-segment-hit.horizontal { cursor: ns-resize; }
.wire-segment-hit.vertical { cursor: ew-resize; }
.wire-segment-highlight { fill: none; stroke: var(--wire-color, #39dff2); stroke-width: 8; vector-effect: non-scaling-stroke; opacity: 0; pointer-events: none; stroke-linecap: round; filter: drop-shadow(0 0 4px #39dff2aa); }
.wire-segment-highlight.hovered { opacity: .55; }
.wire-segment-hit:hover + .wire-segment-highlight,
.wire-segment-hit:focus-visible + .wire-segment-highlight,
.wire-segment-hit.selected + .wire-segment-highlight,
.wire-segment-hit.dragging + .wire-segment-highlight { opacity: .72; }
.wire-segment-hit:focus-visible { outline: none; }
.wire-drag-proposal-group { pointer-events: none; }
.wire-drag-proposal { fill: none; stroke: var(--wire-color, #39dff2); stroke-width: 5; vector-effect: non-scaling-stroke; opacity: 1; pointer-events: none; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 5px #a8ff3f88); }
.junction-dot { fill: var(--cyan); stroke: #06111a; stroke-width: 2; vector-effect: non-scaling-stroke; }
.circuit-component { --rotation: 0deg; position: absolute; width: var(--part-width); height: var(--part-height); transform: translate(-50%, -50%) rotate(var(--rotation)); user-select: none; filter: drop-shadow(0 9px 8px #0008); }
.circuit-component.dragging { z-index: 8; filter: drop-shadow(0 0 7px var(--cyan)) drop-shadow(0 13px 12px #000b); cursor: grabbing; }
.circuit-component.selected { filter: drop-shadow(0 0 5px var(--lime)) drop-shadow(0 10px 8px #0009); }
.circuit-component.selected::after { content: ''; position: absolute; inset: -5px; border: 2px dashed var(--lime); border-radius: 10px; pointer-events: none; }
.component-control-hit { position: absolute; z-index: 4; left: 50%; top: 45%; width: 38px; min-height: 38px; padding: 0; transform: translate(-50%, -50%); border: 2px solid transparent; border-radius: 50%; background: transparent; color: transparent; font-size: 0; pointer-events: none; touch-action: none; }
.circuit-canvas[data-mode="interact"] .component-control-hit { pointer-events: auto; cursor: pointer; border-color: #a8ff3f88; background: #a8ff3f18; }
.circuit-canvas[data-mode="interact"] .component-control-hit:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
.encoder-control-hit { top: 42%; width: 34px; min-height: 48px; border-radius: 10px; transform: translate(-50%, -50%); }
.encoder-control-hit.encoder-ccw { left: 29%; }
.encoder-control-hit.encoder-cw { left: 71%; }
.circuit-canvas[data-mode="interact"] .encoder-control-hit { color: #dffaff; font-size: 22px; font-weight: 800; background: #07151dbb; }
.encoder-runtime-control { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center; }
.encoder-runtime-control small { grid-column: 1 / -1; color: var(--muted); }
.circuit-component.control-pressed .button-cap { transform: translateY(2px); filter: brightness(.78); }
.component-artwork { position: relative; z-index: 0; display: block; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.component-terminal-wires { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
.terminal-wire-stub { stroke: var(--wire-color, #39dff2); stroke-width: 3.5; stroke-linecap: round; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 1px #06111acc); }
.component-wire-overlay-path { fill: none; stroke: var(--wire-color, #39dff2); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; opacity: .94; pointer-events: none; }
.component-wire-overlay-path.drag-source { opacity: .28; }
.component-wire-overlay-path.proposal { stroke-width: 5; opacity: 1; filter: drop-shadow(0 0 5px #a8ff3f88); }
.pin-anchor { position: absolute; left: calc(var(--pin-x) * 100%); top: calc(var(--pin-y) * 100%); width: 30px; min-height: 30px; padding: 0; transform: translate(-50%, -50%); border: 2px solid transparent; border-radius: 50%; background: transparent; color: transparent; font-size: 0; z-index: 2; }
.pin-anchor:hover, .pin-anchor:focus-visible, .pin-anchor.available { border-color: #39dff2cc; background: #39dff228; }
.pin-anchor.recommended-target { border-color: #a8ff3fcc; background: #a8ff3f20; box-shadow: 0 0 0 3px #a8ff3f12; }
.pin-anchor.possible-target { border-color: #39dff2cc; background: #39dff21c; }
.pin-anchor.blocked-target { opacity: .42; border-color: #ff806f88; }
.pin-anchor[data-pin-role="ground"] { border-color: #dce7f288; background: #dce7f21f; }
.pin-anchor[data-pin-role="ground"] .pin-anchor-label { border-color: #dce7f2; color: #fff; background: #07111af7; }
.pin-anchor.pending { border-color: var(--lime); background: #a8ff3f3b; box-shadow: 0 0 0 4px #a8ff3f24; }
.pin-anchor-label { position: absolute; left: 50%; bottom: calc(100% + 5px); transform: translateX(-50%); display: none; width: max-content; max-width: 120px; padding: 4px 7px; border: 1px solid #35667d; border-radius: 5px; background: #06111aee; color: var(--text); font: 650 .66rem ui-monospace, monospace; white-space: nowrap; pointer-events: none; }
.pin-anchor:hover .pin-anchor-label, .pin-anchor:focus-visible .pin-anchor-label, .pin-anchor.pending .pin-anchor-label, .show-pin-labels .pin-anchor-label { display: block; }
.show-pin-labels .pin-anchor-label { opacity: .9; font-size: .57rem; padding: 2px 4px; }
.show-pin-labels .pin-anchor[data-label-side="top"] .pin-anchor-label { bottom: calc(100% + 5px + (var(--pin-label-lane) * 22px)); }
.show-pin-labels .pin-anchor[data-label-side="bottom"] .pin-anchor-label { top: calc(100% + 5px + (var(--pin-label-lane) * 22px)); bottom: auto; }
.art-terminal { fill: #23282d; stroke: #d8e0df; stroke-width: 1; vector-effect: non-scaling-stroke; }
.art-terminal-secondary { fill: #333a40; stroke: #bbc4c7; stroke-width: 1; vector-effect: non-scaling-stroke; }
.metal-lead { stroke: #bfc7ca; stroke-width: 4; stroke-linecap: round; }
.board-pcb { fill: #176e67; stroke: #45b3a6; stroke-width: 1.5; }
.board-usb { fill: #c7cccf; stroke: #6e777d; }
.board-chip { fill: #161a1d; stroke: #464d52; }
.board-module { fill: #24484c; stroke: #83aaa8; }
.board-jack { fill: #191c1e; stroke: #92999c; }
.board-crystal { fill: #c9cdd0; stroke: #6d767b; }
.mount-hole { fill: #07121d; stroke: #c2ad55; stroke-width: 1.5; }
.board-trace { fill: none; stroke: #70a98d; stroke-width: .7; opacity: .7; }
.resistor-body { fill: #d7c49b; stroke: #8a7048; stroke-width: 1.4; }
.resistor-body.appearance-cool-blue { fill: #88a9bb; stroke: #456878; }
.component-led { fill: #831f2c; stroke: #ff6c78; stroke-width: 2; }
.component-led.green { fill: #176332; stroke: #4adf77; }
.component-led.yellow { fill: #75670e; stroke: #ebda48; }
.component-led.blue { fill: #183b79; stroke: #5795ff; }
.component-led.on { fill: #ff2f43; filter: drop-shadow(0 0 8px #ff4355); }
.component-led.green.on { fill: #4cff84; filter: drop-shadow(0 0 8px #4cff84); }
.component-led.yellow.on { fill: #fff15f; filter: drop-shadow(0 0 8px #fff15f); }
.component-led.blue.on { fill: #5aa1ff; filter: drop-shadow(0 0 8px #5aa1ff); }
.rgb-led-artwork { overflow: visible; }
.rgb-led-channel { transition: opacity 80ms linear, filter 80ms linear; }
.rgb-led-channel.on { stroke-width: 7.5; }
.rgb-led-channel.rgb-red { color: #ff4057; }
.rgb-led-channel.rgb-green { color: #49e57b; }
.rgb-led-channel.rgb-blue { color: #55a5ff; }
.rgb-led-mix { transition: fill 80ms linear; filter: drop-shadow(0 0 4px #d7f3ff55); }
.traffic-light-artwork { overflow: visible; }
.traffic-light-lamp { transition: fill 80ms linear, filter 80ms linear, opacity 80ms linear; opacity: .55; }
.traffic-light-lamp[data-traffic-channel="RED"].on { fill: #ff3049; filter: drop-shadow(0 0 9px #ff4057cc); opacity: 1; }
.traffic-light-lamp[data-traffic-channel="AMBER"].on { fill: #ffe052; filter: drop-shadow(0 0 9px #ffd84dcc); opacity: 1; }
.traffic-light-lamp[data-traffic-channel="GREEN"].on { fill: #50f084; filter: drop-shadow(0 0 9px #48ed7ccc); opacity: 1; }
.active-buzzer-artwork { overflow: visible; }
.passive-piezo-artwork { overflow: visible; }
.passive-piezo-disc, .passive-piezo-status, .passive-piezo-transition { transition: fill 80ms linear, stroke 80ms linear, opacity 80ms linear, filter 80ms linear; }
.passive-piezo-disc.on { fill: #4b4212; stroke: #ffe46a; filter: drop-shadow(0 0 8px #f7d44aaa); }
.passive-piezo-status.on { fill: #f7d44a; stroke: #fff2ae; }
.passive-piezo-transition.on { opacity: 0.95; filter: drop-shadow(0 0 4px #f7d44a99); }
.speaker-signal-artwork { overflow: visible; }
.speaker-cone.on { fill: #594615; stroke: #ffe08a; filter: drop-shadow(0 0 7px #ffca5999); }
.speaker-status.on { fill: #ffca59; } .speaker-transition.on { opacity: .95; filter: drop-shadow(0 0 4px #ffca5999); }
.active-buzzer-disc, .buzzer-status, .buzzer-wave { transition: fill 80ms linear, stroke 80ms linear, opacity 80ms linear, filter 80ms linear; }
.active-buzzer-disc.on { fill: #304414; stroke: #b8ff63; filter: drop-shadow(0 0 8px #9cf545aa); }
.buzzer-status.on { fill: #9cf545; stroke: #e6ffbd; filter: drop-shadow(0 0 5px #9cf545); }
.buzzer-wave.on { opacity: 0.92; filter: drop-shadow(0 0 4px #9cf54599); }
.seven-segment-artwork { overflow: visible; }
.seven-segment-bar { transition: fill 70ms linear, stroke 70ms linear, filter 70ms linear; }
.seven-segment-bar.on { fill: #ff3347; stroke: #ff7b88; filter: drop-shadow(0 0 6px #ff3347cc); }
.four-digit-seven-segment-artwork { overflow: visible; }
.four-digit-seven-segment-bar { transition: fill 45ms linear, stroke 45ms linear, filter 45ms linear; }
.four-digit-seven-segment-bar.on { fill: #ff3347; stroke: #ff7b88; filter: drop-shadow(0 0 5px #ff3347cc); }
.character-lcd-artwork { overflow: visible; }
.character-lcd-screen { transition: fill 100ms linear, filter 100ms linear; }
.character-lcd-artwork[data-protocol-state="ready"] .character-lcd-screen { fill: #b8e47a; filter: drop-shadow(0 0 4px #8ccf4f88); }
.character-lcd-line { font-variant-ligatures: none; }
.led-rim, .led-cathode-flat { fill: none; stroke: #d6d9d9; stroke-width: 1.2; }
.led-highlight { fill: #fff8; }
.switch-common { stroke: #899398; stroke-width: 3; }
.button-body { fill: #2c3237; stroke: #aab2b5; stroke-width: 1.5; }
.button-frame { fill: #111619; stroke: #697278; }
.button-cap { fill: #d8463c; stroke: #ff8a81; stroke-width: 2; }
.component-identity-mark { fill: #d9e5eb; font: 700 7px/1 system-ui, sans-serif; letter-spacing: .03em; pointer-events: none; }
.button-identity-mark { fill: #fff; font-size: 6px; }
.pot-body { fill: #7a6545; stroke: #d0b478; }
.pot-case { fill: #92989a; stroke: #e4e7e7; stroke-width: 1.5; }
.pot-shaft { fill: #c5c9ca; stroke: #656d70; }
.pot-index { stroke: #31383b; stroke-width: 3; stroke-linecap: round; }
.selection-name { color: var(--cyan); font-weight: 750; min-height: 24px; }
.lifecycle-state { display: inline-flex; margin: 6px 0 0 9px; padding: 3px 8px; border: 1px solid #35667d; border-radius: 999px; color: var(--cyan); font: 750 .67rem ui-monospace, monospace; text-transform: uppercase; }
.technical-error { margin-top: 9px; border: 1px solid #70434a; border-radius: 7px; background: #2a1117; }
.technical-error summary { cursor: pointer; padding: 7px 9px; color: #ffb4bd; font-size: .75rem; font-weight: 750; }
.technical-error pre { max-height: 150px; overflow: auto; margin: 0; padding: 0 9px 9px; color: #ffd2d7; white-space: pre-wrap; font: .7rem/1.4 ui-monospace, monospace; }
.support-detail { min-height: 54px; color: var(--muted); font-size: .76rem; line-height: 1.45; }
.inspector-actions { margin: 10px 0 16px; }
.inspector-actions button { flex: 1 1 90px; }
.component-editor { display: grid; gap: 10px; margin: 0 0 16px; padding: 12px; border: 1px solid #315468; border-radius: 12px; background: #071722; }
.component-editor[hidden], .component-editor-panel[hidden] { display: none; }
.component-editor-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.component-editor-heading h3, .component-editor-heading p { margin: 0; }
.component-editor-heading > span { padding: 3px 7px; border: 1px solid #35667d; border-radius: 999px; color: var(--cyan); font: 700 .64rem ui-monospace, monospace; white-space: nowrap; }
.component-editor-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 4px; border: 1px solid #274558; border-radius: 10px; background: #050d14; }
.component-editor-tabs button { min-width: 0; }
.component-editor-tabs button[aria-selected="true"] { border-color: var(--lime); color: #07120b; background: var(--lime); }
.component-editor-panel { display: grid; gap: 9px; min-width: 0; }
.component-editor-invariant { margin: 0; padding: 8px; border-left: 3px solid var(--cyan); background: #0a1d2a; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.component-editor-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.component-editor-actions button { width: 100%; }
.appearance-editor { display: grid; gap: 8px; margin: 0 0 16px; padding: 12px; border: 1px solid #315468; border-radius: 12px; background: #071722; }
.component-editor .appearance-editor { margin: 0; padding: 0; border: 0; background: transparent; }
.appearance-editor[hidden] { display: none; }
.appearance-editor h3, .appearance-editor p { margin: 0; }
.appearance-preview { min-height: 72px; display: grid; place-items: center; padding: 8px; border: 1px solid #274558; border-radius: 9px; background: #f5f1e7; overflow: hidden; }
.appearance-preview .component-artwork { width: min(100%, 180px); height: auto; }
.appearance-editor button { width: 100%; }
.appearance-body-controls { display: grid; grid-template-columns: 1fr; gap: 6px; margin: 0; padding: 10px; border: 1px solid #315468; border-radius: 9px; }
.appearance-body-controls legend { padding: 0 5px; color: var(--cyan); font-size: .72rem; font-weight: 800; }
.appearance-body-controls label { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: .72rem; }
.appearance-body-controls output { color: var(--text); font-family: ui-monospace, monospace; }
.appearance-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.property-row { display: grid; grid-template-columns: 1fr 90px; gap: 8px; align-items: center; }
.property-row label { margin: 0; }
.net-members { min-height: 74px; margin-top: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #07141f; color: #c2d2da; font: .73rem/1.45 ui-monospace, monospace; overflow-wrap: anywhere; }
.wire-bends { display: grid; gap: 6px; margin: 8px 0; color: var(--muted); font-size: .72rem; }
.wire-bends button { width: 100%; min-height: 34px; text-align: left; }
.wire-bends button[aria-pressed="true"] { border-color: var(--lime); color: var(--lime); background: #173322; }
.accessible-connections { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; background: #07141f; }
.accessible-connections > summary { cursor: pointer; padding: 10px; color: #e9f5f8; font-weight: 700; }
.accessible-connections-body { display: grid; gap: 10px; padding: 0 10px 10px; min-width: 0; }
.accessible-connection-summary, .accessible-connection-help, .accessible-connection-status { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.accessible-connection-status { min-height: 2.1em; color: #d9f4ff; }
.accessible-connection-components, .accessible-connection-nets { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.accessible-connection-component { display: grid; gap: 5px; padding-top: 7px; border-top: 1px solid rgba(92,130,151,.25); }
.accessible-connection-component > strong { font-size: .76rem; overflow-wrap: anywhere; }
.accessible-connection-pins { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.accessible-connection-pin { width: 100%; min-height: 32px; padding: 5px 7px; text-align: left; font: .68rem/1.35 ui-monospace, monospace; overflow-wrap: anywhere; }
.accessible-connection-pin[data-connected="true"] { border-left: 3px solid var(--cyan); }
.accessible-connection-net { display: grid; gap: 5px; padding: 8px; border: 1px solid rgba(92,130,151,.32); border-radius: 8px; }
.accessible-connection-net p { margin: 0; font: .68rem/1.4 ui-monospace, monospace; overflow-wrap: anywhere; }
.accessible-connection-net-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.accessible-connection-net-actions button { flex: 1 1 68px; min-height: 32px; }
.accessible-connection-form { display: grid; gap: 7px; padding-top: 8px; border-top: 1px solid var(--line); }
.accessible-connection-form label { display: grid; gap: 4px; font-size: .72rem; }
.accessible-connection-form select { width: 100%; min-width: 0; }
.accessible-connection-form button { min-height: 38px; }
.accessible-connection-validation[data-valid="false"] { color: #ffbd72; }
.bend-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: 5px; }
.bend-row input { min-width: 0; min-height: 34px; }
.bend-row button { min-height: 34px; }
.workbench-drawer { margin-top: 16px; }
.workbench-drawer > summary { cursor: pointer; padding: 11px 14px; border: 1px solid var(--line); border-radius: 10px; background: #0b1b29; color: var(--cyan); font-weight: 800; }
.workbench-drawer[open] > summary { border-radius: 10px 10px 0 0; }
.workbench-drawer > .panel, .workbench-drawer > .runtime, .workbench-drawer > .instrument-grid { margin-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; }
.editor-card, .prompt-card { resize: vertical; overflow: auto; }
.source-files { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(170px, 1fr) auto auto; gap: 8px; align-items: end; margin-top: 12px; }
.source-files label { margin-top: 0; }
textarea { width: 100%; min-height: 220px; resize: vertical; margin: 14px 0 10px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: #050d14; color: #d9f6ff; font: .84rem/1.5 ui-monospace, monospace; tab-size: 2; }
.toolchain-boundary { margin-top: 12px; padding: 9px 11px; border-left: 3px solid var(--cyan); background: #07141f; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.toolchain-boundary a { color: var(--cyan); }
.code-editor { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); min-height: 260px; margin: 14px 0 10px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #050d14; }
.code-editor textarea, .source-highlight, .source-lines { min-height: 260px; margin: 0; border: 0; border-radius: 0; resize: vertical; font: .84rem/1.5 ui-monospace, monospace; tab-size: 2; }
.code-editor textarea { grid-column: 2; position: relative; z-index: 2; padding: 14px; background: transparent; color: transparent; caret-color: #f6f1e7; white-space: pre; overflow: auto; }
.code-editor textarea::selection { background: #2a6f8255; color: transparent; }
.source-highlight { grid-column: 2; position: absolute; z-index: 1; inset: 0 0 0 48px; overflow: hidden; padding: 14px; color: #d9f6ff; white-space: pre; pointer-events: none; }
.source-lines { grid-column: 1; z-index: 3; padding: 14px 9px; overflow: hidden; border-right: 1px solid #17364a; background: #07141f; color: #5f8194; text-align: right; user-select: none; }
.tok-comment { color: #7da68a; }.tok-string { color: #f0c975; }.tok-keyword { color: #65d9ff; }.tok-number { color: #f28cf3; }
.diagnostic-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.diagnostic-links button { min-height: 32px; font: .7rem ui-monospace, monospace; color: #ffd0d4; border-color: #70434a; background: #2a1117; }
.source-diagnostics { margin-top: 12px; padding: 11px; border: 1px solid #31495a; border-radius: 9px; background: #07141f; }
.source-diagnostics h3 { margin: 0 0 6px; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: #dceaf0; }
.source-diagnostics p { margin: 0; color: var(--muted); font: .74rem/1.45 ui-monospace, monospace; overflow-wrap: anywhere; }
.source-diagnostics[data-state="error"] { border-color: #70434a; background: #1b0e13; }
.source-diagnostics .diagnostic-message { width: 100%; margin-top: 6px; color: #ffd0d4; }
.build-log { margin-top: 8px; color: var(--muted); font-size: .76rem; }
.build-log pre { max-height: 240px; overflow: auto; padding: 10px; background: #040b11; color: #a9bdc7; white-space: pre-wrap; }
.build-controls button:first-child { background: #194225; border-color: #4e9e4a; }
.diagnostics { min-height: 44px; max-height: 170px; overflow: auto; margin: 10px 0 0; padding: 11px; border-radius: 8px; background: #07141f; color: #b8cbd5; white-space: pre-wrap; overflow-wrap: anywhere; font: .75rem/1.45 ui-monospace, monospace; }
.prompt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.prompt-grid textarea { min-height: 190px; }
.runtime { display: grid; grid-template-columns: minmax(270px, .72fr) 1.28fr; gap: 16px; margin-top: 16px; }
dl { margin: 18px 0; }
dl div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); }
dt { color: var(--muted); } dd { margin: 0; font: 600 .82rem ui-monospace, monospace; overflow-wrap: anywhere; text-align: right; }
.controls { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.component-runtime-controls { display: grid; gap: 9px; margin-top: 16px; }
.component-runtime-controls > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; align-items: center; }
.trace { margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 7px; list-style: none; }
.trace li { border-left: 3px solid var(--cyan); background: #07141f; padding: 9px 11px; color: #bdd0da; font: .76rem ui-monospace, monospace; }
.thermostat-experiment { margin-top: 16px; border-color: color-mix(in srgb, var(--lime) 48%, var(--line)); background: linear-gradient(135deg, #10283a 0%, #0a1825 62%, #102616 145%); }
.thermostat-intro { margin: 12px 0; max-width: 980px; color: var(--muted); line-height: 1.55; }
.thermostat-contract { display: grid; grid-template-columns: repeat(4, minmax(145px, 1fr)); gap: 8px; margin: 12px 0; }
.thermostat-contract span { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); font: .73rem/1.4 ui-monospace, monospace; background: #07141f; }
.thermostat-contract strong { color: var(--cyan); font-family: inherit; }
.thermostat-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.thermostat-actions #thermostat-run-tests { color: #07121d; background: var(--lime); border-color: var(--lime); }
.thermostat-actions #thermostat-load-bad { border-color: var(--amber); }
.scenario-editor { margin: 18px 0; padding: 16px; border: 1px solid #2a627f; border-radius: 14px; background: #071722; }
.scenario-editor-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.scenario-editor-heading h3 { margin: 0; font-size: 1.05rem; }
.scenario-editor > p { color: var(--muted); line-height: 1.5; }
.seeded-property-controls { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(180px, .7fr) auto auto; gap: 10px; align-items: end; margin: 14px 0; padding: 12px; border: 1px solid #315c75; border-radius: 10px; background: #081d2a; }
.seeded-property-controls h4, .seeded-property-controls p { margin: 0; }
.seeded-property-controls label { display: grid; gap: 5px; color: var(--muted); font: 700 .68rem/1.3 ui-monospace, monospace; text-transform: uppercase; }
.seeded-property-controls output { color: #b9d7e8; font: 600 .7rem/1.35 ui-monospace, monospace; text-transform: none; }
.seeded-property-controls .truth { grid-column: 1 / -1; color: var(--muted); font: .72rem/1.45 ui-monospace, monospace; }
.fault-suite-controls { display: grid; grid-template-columns: minmax(260px, 1fr) auto auto; gap: 10px; align-items: end; margin: 14px 0; padding: 12px; border: 1px solid #725a2d; border-radius: 10px; background: #1d170a; }
.fault-suite-controls h4, .fault-suite-controls p { margin: 0; }
.fault-suite-controls .truth { grid-column: 1 / -1; color: var(--muted); font: .72rem/1.45 ui-monospace, monospace; }
.counterexample-reduction-controls { display: grid; grid-template-columns: minmax(260px, 1fr) auto; gap: 10px; align-items: end; margin: 14px 0; padding: 12px; border: 1px solid #48792f; border-radius: 10px; background: #10220d; }
.counterexample-reduction-controls h4, .counterexample-reduction-controls p { margin: 0; }
.counterexample-reduction-controls .truth { grid-column: 1 / -1; color: var(--muted); font: .72rem/1.45 ui-monospace, monospace; }
.scenario-editor-actions, .scenario-add-events { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.scenario-editor-actions #scenario-run { color: #07121d; border-color: var(--lime); background: var(--lime); }
.scenario-list { display: grid; gap: 12px; }
.scenario-card { padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: #091c29; }
.scenario-card-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.scenario-card-heading label { flex: 1; }
.scenario-card label { display: grid; gap: 5px; color: var(--muted); font: 700 .68rem/1.3 ui-monospace, monospace; text-transform: uppercase; }
.scenario-card input, .scenario-card select { min-width: 0; width: 100%; }
.scenario-events { display: grid; gap: 8px; margin: 12px 0; padding: 0; list-style: none; }
.scenario-event { display: grid; grid-template-columns: minmax(145px, 1fr) minmax(95px, .55fr) minmax(150px, .85fr) auto; gap: 9px; align-items: end; padding: 10px; border-left: 3px solid var(--cyan); border-radius: 8px; background: #06121c; }
.scenario-event.expect-pin-level { grid-template-columns: minmax(145px, 1fr) minmax(85px, .45fr) minmax(85px, .45fr) minmax(120px, .7fr) auto; border-left-color: var(--lime); }
.scenario-event strong { align-self: center; color: var(--text); font-size: .75rem; }
.scenario-result { margin: 10px 0 0; padding: 9px 11px; border-radius: 8px; color: var(--muted); background: #06121c; font: .72rem/1.45 ui-monospace, monospace; }
.scenario-result.pass { color: var(--lime); border: 1px solid #3c7438; }
.scenario-result.fail { color: #ffd0d4; border: 1px solid #70434a; }
.scenario-result:not(.pass):not(.fail) { color: var(--amber); border: 1px solid #796126; }
.scenario-empty { padding: 14px; border: 1px dashed var(--line); border-radius: 9px; }
.thermostat-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.thermostat-table { width: 100%; min-width: 780px; border-collapse: collapse; background: #07141f; }
.thermostat-table th, .thermostat-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-size: .75rem; line-height: 1.4; }
.thermostat-table thead th { color: var(--cyan); background: #0c2030; }
.thermostat-table tbody th { color: var(--text); }
.thermostat-table tbody tr:last-child > * { border-bottom: 0; }
.offline-support-table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: #07141f; }
.offline-support-table-wrap:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.offline-support-table { width: 100%; min-width: 980px; border-collapse: collapse; }
.offline-support-table caption { padding: 10px 12px; color: var(--muted); text-align: left; font-size: .72rem; }
.offline-support-table th, .offline-support-table td { padding: 10px 12px; border-top: 1px solid var(--line); text-align: left; vertical-align: top; font-size: .72rem; line-height: 1.45; }
.offline-support-table thead th { color: var(--cyan); background: #0c2030; }
.offline-support-table tbody th { color: var(--text); }
.offline-support-table td[data-offline-state="available-in-loaded-document"] { color: var(--lime); }
.offline-support-table td[data-offline-state="unavailable"],
.offline-support-table td[data-offline-state="unavailable-server-runtime"],
.offline-support-table td[data-offline-state="unavailable-offline-same-origin-server-required"] { color: #ffd28b; }
.experiment-pass { color: var(--lime); font-weight: 850; }
.experiment-fail { color: var(--danger); font-weight: 850; }
.experiment-running, .experiment-pending { color: var(--amber); font-weight: 800; }
.thermostat-limit { margin: 10px 0 0; color: #d7c38f; font-size: .75rem; line-height: 1.5; }
.experiment-fail button { display: block; margin-top: 8px; width: 100%; }
.failure-location { margin-top: 16px; padding: 16px; border: 1px solid #23546d; border-radius: 12px; background: #081b28; }
.failure-location:focus-visible { outline: 3px solid #56d6ff; outline-offset: 3px; }
.failure-location-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 12px 0; }
.failure-location-facts div { min-width: 0; padding: 10px; border: 1px solid #173d52; border-radius: 8px; background: #06141f; }
.failure-location-facts dt { color: #7fa4b8; font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; }
.failure-location-facts dd { margin: 4px 0 0; overflow-wrap: anywhere; }
@media (max-width: 760px) { .failure-location-facts { grid-template-columns: 1fr; } }
.shared-event-timeline { margin-top: 16px; padding: 16px; border: 1px solid #285b70; border-radius: 12px; background: #071923; }
.shared-event-timeline > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; list-style-position: inside; }
.shared-event-timeline > summary strong { display: block; margin-top: 3px; font-size: 1.05rem; }
.shared-event-timeline-content { margin-top: 14px; }
.shared-event-timeline > summary:focus-visible, .shared-event-timeline-wrap:focus-visible { outline: 3px solid #56d6ff; outline-offset: 3px; }
.timeline-order-note { color: #a9c4d2; max-width: 90ch; }
.shared-event-timeline-wrap { max-height: 360px; overflow: auto; border: 1px solid #173d52; border-radius: 8px; background: #06141f; }
.shared-event-timeline-table { width: 100%; min-width: 780px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.shared-event-timeline-table th, .shared-event-timeline-table td { padding: 9px 10px; border-bottom: 1px solid #173d52; text-align: left; vertical-align: top; }
.shared-event-timeline-table th { position: sticky; top: 0; z-index: 1; background: #0d2533; color: #bcd6e3; }
.shared-event-timeline-table tbody tr:focus-visible { outline: 2px solid #9cff45; outline-offset: -2px; }
.shared-event-timeline-table td:nth-child(1), .shared-event-timeline-table td:nth-child(2), .shared-event-timeline-table td:nth-child(3) { white-space: nowrap; }
.regression-matrix { margin: 16px 0; border-color: #34758f; background: linear-gradient(145deg, #0d2534, #081720 70%); }
.advanced-testing-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 54px; padding: 4px 2px; cursor: pointer; list-style-position: inside; }
.advanced-testing-summary > span:first-child { display: grid; gap: 3px; }
.advanced-testing-summary .eyebrow { margin: 0; }
.advanced-testing-summary strong { color: var(--text); font-size: 1.05rem; }
.advanced-testing-summary > span:last-child { color: var(--cyan); font-size: .74rem; font-weight: 850; white-space: nowrap; }
.advanced-testing-summary:focus-visible { outline: 3px solid var(--lime); outline-offset: 4px; border-radius: 7px; }
.advanced-testing-intro { margin: 8px 0 16px; padding: 10px 12px; border-left: 3px solid var(--cyan); color: var(--muted); background: #07151f; font-size: .78rem; line-height: 1.55; }
.regression-matrix:not([open]) { padding-block: 10px; }
.regression-matrix-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.regression-matrix-intro, .regression-matrix-limit { color: var(--muted); font-size: .78rem; line-height: 1.55; }
.regression-matrix-limit strong { color: var(--amber); }
.regression-matrix-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin: 14px 0 10px; }
.regression-matrix-actions label { display: grid; gap: 5px; min-width: min(100%, 340px); color: var(--muted); font-size: .72rem; font-weight: 800; }
.regression-matrix-actions select { width: 100%; }
#regression-matrix-run { color: #06111a; background: var(--lime); border-color: var(--lime); }
#regression-matrix-negative { border-color: var(--amber); }
.regression-matrix-identity { margin: 8px 0; color: var(--cyan); font: .68rem/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
.regression-matrix-table-wrap { overflow-x: auto; border: 1px solid #28566d; border-radius: 12px; }
.regression-matrix-table { width: 100%; min-width: 980px; border-collapse: collapse; background: #06131e; }
.regression-matrix-table th, .regression-matrix-table td { padding: 10px; border-bottom: 1px solid #244559; text-align: left; vertical-align: top; font-size: .7rem; line-height: 1.45; }
.regression-matrix-table thead th { color: var(--cyan); background: #0d2637; }
.regression-matrix-table tbody tr:last-child > * { border-bottom: 0; }
.regression-matrix-table code { color: var(--text); overflow-wrap: anywhere; }
.regression-matrix-outcome[data-status="passed"] { color: var(--lime); font-weight: 900; }
.regression-matrix-outcome[data-status="failed"] { color: var(--danger); font-weight: 900; }
.regression-matrix-outcome[data-status="indeterminate"], .regression-matrix-outcome[data-status="unsupported"] { color: var(--amber); font-weight: 900; }
.coverage-report-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-top: 24px; padding-top: 20px; border-top: 1px solid #34758f; }
.coverage-report-heading h3 { margin: 0; font-size: 1.2rem; }
.checkable-evidence { margin-top: 18px; padding: 12px 14px; border: 1px solid #34758f; border-radius: 12px; background: #06131e; }
.checkable-evidence > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; color: var(--cyan); }
.checkable-evidence > summary span:first-child { display: grid; gap: 3px; }
.checkable-evidence > summary small { color: var(--muted); font-size: .68rem; font-weight: 500; }
.checkable-evidence-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.checkable-evidence-grid section { min-width: 0; padding: 10px; border: 1px solid #244559; border-radius: 10px; background: #081720; }
.checkable-evidence-grid h4 { margin: 0 0 8px; color: var(--text); }
.checkable-evidence-grid ol, .checkable-evidence-grid ul { margin: 0; padding-left: 20px; color: var(--muted); font: .7rem/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
.checkable-evidence-grid li + li { margin-top: 6px; }
.coverage-report-table { min-width: 1180px; }
.precision-check-heading h3 { color: #ffcf66; letter-spacing: .035em; }
.precision-check-table { min-width: 1120px; }
.precision-check-table code { white-space: pre-wrap; overflow-wrap: anywhere; }
.causal-chain-heading { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.causal-chain-heading h3 { color: var(--cyan); letter-spacing: .035em; }
.causal-chain-table { min-width: 1160px; table-layout: fixed; }
.causal-chain-table th:nth-child(1) { width: 14%; }
.causal-chain-table th:nth-child(2) { width: 28%; }
.causal-chain-table th:nth-child(3) { width: 21%; }
.causal-chain-table th:nth-child(4) { width: 22%; }
.causal-chain-table th:nth-child(5) { width: 15%; }
.causal-chain-table td { overflow-wrap: anywhere; }
.causal-chain-table code { white-space: pre-wrap; overflow-wrap: anywhere; }
.failure-replay-heading { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.failure-replay-heading h3 { color: var(--amber); letter-spacing: .035em; }
.failure-replay-actions { flex-wrap: wrap; }
.failure-replay-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 14px 0; }
.failure-replay-card { min-width: 0; padding: 14px; border: 1px solid #315066; border-radius: 12px; background: #07141f; }
.failure-replay-card[data-phase="fault"] { border-color: #7b5b26; background: #181208; }
.failure-replay-card h4 { margin: 0 0 8px; color: #e8f7ff; }
.failure-replay-card dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 10px; margin: 0; }
.failure-replay-card dt { color: var(--muted); }
.failure-replay-card dd { margin: 0; overflow-wrap: anywhere; font-family: var(--mono); }
.long-duration-table-wrap { max-width: 100%; }
.long-duration-table { min-width: 860px; table-layout: fixed; }
.long-duration-table th:nth-child(1) { width: 18%; }
.long-duration-table th:nth-child(2) { width: 22%; }
.long-duration-table th:nth-child(3) { width: 25%; }
.long-duration-table th:nth-child(4) { width: 15%; }
.long-duration-table th:nth-child(5) { width: 20%; }
.long-duration-cell strong, .long-duration-cell code { display: block; }
.long-duration-cell strong { color: var(--text); font-size: .78rem; line-height: 1.35; }
.long-duration-cell code { margin-top: 7px; color: var(--cyan); font-size: .62rem; line-height: 1.45; overflow-wrap: anywhere; }
.long-duration-facts { display: grid; gap: 5px; margin: 0; padding-left: 16px; }
.long-duration-facts li { color: var(--text); overflow-wrap: anywhere; }
.long-duration-outcomes { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.long-duration-outcome-badge { display: inline-flex; width: max-content; max-width: 100%; padding: 4px 7px; border: 1px solid currentColor; border-radius: 999px; white-space: nowrap; font-size: .64rem; line-height: 1; text-transform: uppercase; }
.long-duration-raw summary { color: var(--cyan); cursor: pointer; font-weight: 800; }
.long-duration-raw summary:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
.long-duration-raw pre { max-height: 320px; margin: 8px 0 0; padding: 9px; overflow: auto; border: 1px solid var(--line); border-radius: 8px; background: #030b12; color: #c7dae3; font: .64rem/1.45 ui-monospace, monospace; white-space: pre; }
.time-invariance-table-wrap { max-width: 100%; }
.time-invariance-table { min-width: 980px; table-layout: fixed; }
.time-invariance-table th:nth-child(1) { width: 15%; }
.time-invariance-table th:nth-child(2) { width: 20%; }
.time-invariance-table th:nth-child(3) { width: 23%; }
.time-invariance-table th:nth-child(4) { width: 13%; }
.time-invariance-table th:nth-child(5) { width: 14%; }
.time-invariance-table th:nth-child(6) { width: 15%; }
.time-invariance-cell strong, .time-invariance-cell code { display: block; }
.time-invariance-cell strong { color: var(--text); font-size: .78rem; line-height: 1.35; }
.time-invariance-cell code { margin-top: 7px; color: var(--cyan); font-size: .62rem; line-height: 1.45; overflow-wrap: anywhere; }
.time-invariance-table td { overflow-wrap: anywhere; }
.time-wall-diagnostic { color: var(--muted); }
.event-order-table-wrap { max-width: 100%; }
.event-order-table { min-width: 900px; table-layout: fixed; }
.event-order-table th:nth-child(1) { width: 18%; }
.event-order-table th:nth-child(2) { width: 24%; }
.event-order-table th:nth-child(3) { width: 28%; }
.event-order-table th:nth-child(4) { width: 13%; }
.event-order-table th:nth-child(5) { width: 17%; }
.event-order-cell strong, .event-order-cell code { display: block; }
.event-order-cell strong { color: var(--text); font-size: .78rem; line-height: 1.35; }
.event-order-cell code { margin-top: 7px; color: var(--cyan); font-size: .62rem; line-height: 1.45; overflow-wrap: anywhere; }
.event-order-table td { overflow-wrap: anywhere; }
.reset-class-table-wrap { max-width: 100%; }
.reset-class-table { min-width: 980px; table-layout: fixed; }
.reset-class-table th:nth-child(1) { width: 15%; }
.reset-class-table th:nth-child(2) { width: 25%; }
.reset-class-table th:nth-child(3) { width: 29%; }
.reset-class-table th:nth-child(4) { width: 14%; }
.reset-class-table th:nth-child(5) { width: 17%; }
.reset-class-cell strong, .reset-class-cell code { display: block; }
.reset-class-cell strong { color: var(--text); font-size: .78rem; line-height: 1.35; }
.reset-class-cell code { margin-top: 7px; color: var(--cyan); font-size: .62rem; line-height: 1.45; overflow-wrap: anywhere; }
.reset-class-table td { overflow-wrap: anywhere; }
.reset-class-table .long-duration-outcome-badge[data-status="passed"] { color: var(--lime); }
.unsupported-access-table-wrap { max-width: 100%; }
.unsupported-access-table { min-width: 980px; table-layout: fixed; }
.unsupported-access-table th:nth-child(1) { width: 16%; }
.unsupported-access-table th:nth-child(2) { width: 25%; }
.unsupported-access-table th:nth-child(3) { width: 22%; }
.unsupported-access-table th:nth-child(4) { width: 18%; }
.unsupported-access-table th:nth-child(5) { width: 19%; }
.unsupported-access-table td { overflow-wrap: anywhere; }
.unsupported-access-table .long-duration-outcome-badge[data-status="unsupported"] { color: var(--amber); }
.digital-state-table-wrap { max-width: 100%; }
.digital-state-table { min-width: 1040px; table-layout: fixed; }
.digital-state-table th:nth-child(1) { width: 15%; }
.digital-state-table th:nth-child(2) { width: 24%; }
.digital-state-table th:nth-child(3) { width: 22%; }
.digital-state-table th:nth-child(4) { width: 19%; }
.digital-state-table th:nth-child(5) { width: 20%; }
.digital-state-table td { overflow-wrap: anywhere; }
.digital-state-table .long-duration-outcome-badge[data-status="indeterminate"],
.digital-state-table .long-duration-outcome-badge[data-status="conflict"] { color: var(--amber); }
.instrument-grid { display: grid; grid-template-columns: 1.5fr .72fr; gap: 16px; margin-top: 16px; }
.instrument-evidence { grid-column: 1 / -1; overflow: hidden; background: linear-gradient(135deg, #0a1b29 0%, #0b2531 58%, #10271f 100%); border-color: #2a627f; }
.instrument-evidence::before { content: ''; display: block; height: 3px; margin: -18px -18px 16px; background: linear-gradient(90deg, var(--cyan), var(--lime)); }
.instrument-evidence-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.instrument-evidence-heading h2 { margin-bottom: 0; }
.instrument-evidence-state { flex: 0 0 auto; padding: 7px 11px; border: 1px solid var(--amber); border-radius: 999px; color: var(--amber); font: 850 .7rem ui-monospace, monospace; text-transform: uppercase; }
.instrument-evidence[data-state="recorded-runtime"] .instrument-evidence-state { border-color: var(--lime); color: #07121d; background: var(--lime); }
.instrument-evidence-provenance { color: var(--cyan); font: .76rem/1.45 ui-monospace, monospace; }
.instrument-evidence-facts, .instrument-boundary-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 14px 0 0; }
.instrument-evidence-facts div, .instrument-boundary-list div { min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; background: #06111bc7; }
.instrument-evidence-facts dt, .instrument-boundary-list dt { color: var(--muted); font: 750 .64rem ui-monospace, monospace; text-transform: uppercase; }
.instrument-evidence-facts dd, .instrument-boundary-list dd { margin: 5px 0 0; color: var(--text); font: .72rem/1.45 ui-monospace, monospace; overflow-wrap: anywhere; }
.instrument-summary-heading { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--text); font: 750 .7rem ui-monospace, monospace; text-transform: uppercase; }
.instrument-summary-heading span { color: var(--cyan); }
.instrument-summary-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 9px 0 0; }
.instrument-summary-list div { min-width: 0; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: #06111ba8; }
.instrument-summary-list dt { color: var(--muted); font: 750 .62rem ui-monospace, monospace; text-transform: uppercase; }
.instrument-summary-list dd { margin: 4px 0 0; color: var(--text); font: .68rem/1.4 ui-monospace, monospace; overflow-wrap: anywhere; }
.instrument-summary-list dd[data-classification="recorded-runtime"]::first-line { color: var(--lime); }
.instrument-summary-list dd[data-classification="project-model"]::first-line { color: var(--amber); }
.instrument-boundary { margin: 14px 0; padding: 14px; border: 1px solid #2a627f; border-radius: 12px; background: #071722; }
.instrument-boundary-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.instrument-boundary-heading h3 { margin: 0; font-size: .95rem; }
.instrument-boundary-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.instrument-boundary-list dd[data-status="unavailable"] { color: #d7c38f; }
.shared-instrument-tools { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; margin-top: 12px; }
.shared-instrument-tools > section { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #040d15; }
.shared-instrument-tool-heading { display: flex; justify-content: space-between; gap: 10px; color: var(--text); font: 800 .7rem ui-monospace, monospace; text-transform: uppercase; }
.shared-instrument-tool-heading span { color: var(--cyan); }
.shared-serial-view pre { min-height: 92px; max-height: 180px; overflow: auto; margin: 10px 0 7px; padding: 10px; border: 1px solid #17364a; border-radius: 8px; background: #02070b; color: #baf9cb; white-space: pre-wrap; overflow-wrap: anywhere; font: .72rem/1.45 ui-monospace, monospace; }
.shared-serial-view p, .shared-pin-view p, .shared-trace-view p { margin: 7px 0; color: var(--muted); font: .66rem/1.45 ui-monospace, monospace; overflow-wrap: anywhere; }
.shared-instrument-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.shared-instrument-actions button { min-height: 34px; }
.shared-pin-view label { display: grid; grid-template-columns: auto minmax(100px, 1fr); align-items: center; gap: 9px; margin-top: 10px; color: var(--muted); font: .68rem ui-monospace, monospace; }
.shared-pin-view dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 9px 0; }
.shared-pin-view dl div { display: block; min-width: 0; padding: 7px 8px; border: 1px solid var(--line); border-radius: 7px; }
.shared-pin-view dt { font: 750 .6rem ui-monospace, monospace; text-transform: uppercase; }
.shared-pin-view dd { margin-top: 3px; text-align: left; font: .67rem/1.35 ui-monospace, monospace; }
.shared-pin-view dd[data-status="unavailable"] { color: #d7c38f; }
.shared-trace-view label { display: grid; grid-template-columns: auto minmax(100px, 1fr); align-items: center; gap: 9px; margin-top: 10px; color: var(--muted); font: .68rem ui-monospace, monospace; }
.shared-trace-view ol { min-height: 92px; max-height: 180px; overflow: auto; margin: 8px 0; padding: 8px 8px 8px 30px; border: 1px solid #17364a; border-radius: 8px; background: #02070b; color: #baf9cb; font: .68rem/1.5 ui-monospace, monospace; }
.shared-trace-view li { padding-left: 4px; overflow-wrap: anywhere; }
.shared-trace-view [data-shared-trace-classification="project-model"] { color: var(--amber); }
.x46-uart-panel { grid-column: 1 / -1; min-width: 0; max-width: 100%; }
.x46-uart-panel .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x46-uart-panel .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; color: var(--amber); }
.x46-uart-panel[data-state="current"] .shared-instrument-tool-heading span,
.x46-uart-panel[data-state="empty"] .shared-instrument-tool-heading span { color: #07121d; background: var(--lime); border-color: var(--lime); }
.x46-uart-panel[data-state="partial"] .shared-instrument-tool-heading span,
.x46-uart-panel[data-state="stale"] .shared-instrument-tool-heading span,
.x46-uart-panel[data-state="invalid"] .shared-instrument-tool-heading span { color: #07121d; background: var(--amber); border-color: var(--amber); }
.x46-uart-boundary, .x46-uart-summary, .x46-uart-limits { margin: 8px 0; color: var(--muted); font: .72rem/1.5 ui-monospace, monospace; }
.x46-uart-panel[data-evidence-kind="synthetic-review-fixture"] .x46-uart-boundary { color: var(--amber); font-weight: 800; }
.x46-uart-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 10px 0; }
.x46-uart-facts div { min-width: 0; padding: 8px 10px; border: 1px solid #17364a; border-radius: 8px; background: #06111b; }
.x46-uart-facts dt { color: var(--muted); font: 750 .62rem ui-monospace, monospace; text-transform: uppercase; }
.x46-uart-facts dd { margin: 4px 0 0; color: var(--text); font: .68rem/1.4 ui-monospace, monospace; overflow-wrap: anywhere; }
.x46-uart-table-wrap { min-width: 0; max-width: 100%; max-height: 260px; overflow: auto; border: 1px solid #17364a; border-radius: 8px; background: #02070b; }
.x46-uart-table-wrap table { width: 100%; min-width: 760px; border-collapse: collapse; font: .68rem/1.4 ui-monospace, monospace; }
.x46-uart-table-wrap th { position: sticky; top: 0; z-index: 1; padding: 7px 9px; background: #0b2230; color: var(--cyan); text-align: left; }
.x46-uart-table-wrap td { padding: 7px 9px; border-top: 1px solid #17364a; color: #baf9cb; white-space: nowrap; }
.x46-uart-table-wrap td:nth-child(5) { color: var(--text); }
.x46-uart-limits { color: #d7c38f; }
.x46-framing-details { margin: 10px 0; border: 1px solid #24506a; border-radius: 8px; background: #06111b; }
.x46-framing-details summary { padding: 9px 11px; color: var(--cyan); cursor: pointer; font: 800 .7rem/1.4 ui-monospace, monospace; }
.x46-framing-details[data-x46-framing-state="current"] summary { color: var(--lime); }
.x46-framing-boundary { margin: 0; padding: 0 11px 9px; color: #d7c38f; font: .68rem/1.45 ui-monospace, monospace; }
.x46-framing-list { max-height: 210px; margin: 0 10px 10px 28px; padding: 0 8px 0 0; overflow: auto; color: #baf9cb; font: .66rem/1.55 ui-monospace, monospace; }
.x46-framing-list li { padding: 4px 0; overflow-wrap: anywhere; }
.x46-rx-details { margin: 10px 0; border: 1px solid #24506a; border-radius: 8px; background: #06111b; }
.x46-rx-details summary { padding: 9px 11px; color: var(--cyan); cursor: pointer; font: 800 .7rem/1.4 ui-monospace, monospace; }
.x46-rx-details[data-x46-rx-state="current"] summary { color: var(--lime); }
.x46-rx-boundary { margin: 0; padding: 0 11px 9px; color: #d7c38f; font: .68rem/1.45 ui-monospace, monospace; }
.x46-rx-list { max-height: 210px; margin: 0 10px 10px 28px; padding: 0 8px 0 0; overflow: auto; color: #baf9cb; font: .66rem/1.55 ui-monospace, monospace; }
.x46-rx-list li { padding: 4px 0; overflow-wrap: anywhere; }
.x42-trigger-capture { grid-column: 1 / -1; border-color: #2a627f !important; background: linear-gradient(135deg, #06121c, #0a202c) !important; }
.x42-trigger-capture[data-state="armed"] { border-color: var(--amber) !important; }
.x42-trigger-capture[data-state="triggered"] { border-color: var(--cyan) !important; }
.x42-trigger-capture[data-state="captured"] { border-color: var(--lime) !important; }
.x42-trigger-capture .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x42-trigger-capture .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; }
.x42-trigger-boundary, .x42-trigger-capture [data-x42-limits] { margin: 8px 0; color: #b9ceda; font: .76rem/1.55 ui-monospace, monospace; overflow-wrap: anywhere; }
.x42-trigger-controls { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(120px, .7fr) auto; gap: 8px; align-items: end; }
.x42-trigger-controls label { display: grid; gap: 5px; color: #b9ceda; font: 700 .75rem/1.4 ui-monospace, monospace; text-transform: uppercase; }
.x42-trigger-controls select, .x42-trigger-controls button { width: 100%; min-width: 0; min-height: 38px; }
.x42-trigger-controls button { color: #07121d; border-color: var(--lime); background: var(--lime); font-weight: 850; }
.x42-trigger-controls button:disabled { color: var(--muted); border-color: var(--line); background: #0b1b29; }
.x42-trigger-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 10px 0; }
.x42-trigger-facts div { display: block; min-width: 0; padding: 8px; border: 1px solid var(--line); border-radius: 7px; background: #040d15; }
.x42-trigger-facts dt { color: #b9ceda; font: 750 .75rem/1.4 ui-monospace, monospace; text-transform: uppercase; }
.x42-trigger-facts dd { margin-top: 4px; color: var(--text); text-align: left; font: .76rem/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
.x42-trigger-capture [data-x42-rows] { max-height: min(260px, 38vh); overflow-x: hidden; overflow-y: auto; scrollbar-gutter: stable; margin: 8px 0 0; padding: 8px 8px 8px 34px; border: 1px solid #24516a; border-radius: 8px; background: #02070b; color: #c6fbd4; font: .76rem/1.55 ui-monospace, monospace; }
.x42-trigger-capture [data-x42-rows] li { padding: 2px 5px 2px 4px; overflow-wrap: anywhere; }
.x42-trigger-capture [data-relative-position="0"] { margin-block: 2px; border-left: 3px solid var(--amber); border-radius: 3px; color: #ffe3a3; background: #3b2b0d; font-weight: 850; }
.x43-runtime-profile { grid-column: 1 / -1; border-color: #375f78 !important; background: linear-gradient(135deg, #06121c, #0b1d29) !important; }
.x43-runtime-profile[data-state="observing"] { border-color: var(--amber) !important; }
.x43-runtime-profile[data-state="captured"] { border-color: var(--lime) !important; }
.x43-runtime-profile[data-state="invalidated"] { border-color: #98637a !important; }
.x43-runtime-profile .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x43-runtime-profile .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; }
.x43-profile-boundary { margin: 8px 0; color: #b9ceda; font: .76rem/1.55 ui-monospace, monospace; overflow-wrap: anywhere; }
.x43-profile-controls { display: flex; flex-wrap: wrap; gap: 8px; }
.x43-profile-controls button { min-width: 180px; min-height: 38px; color: #07121d; border-color: var(--lime); background: var(--lime); font: 850 .76rem/1.35 ui-monospace, monospace; }
.x43-profile-controls button:disabled { color: var(--muted); border-color: var(--line); background: #0b1b29; }
.x43-profile-facts, .x43-profile-unsupported { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 10px 0 0; }
.x43-profile-facts div, .x43-profile-unsupported div { min-width: 0; padding: 8px; border: 1px solid var(--line); border-radius: 7px; background: #040d15; }
.x43-profile-facts dt, .x43-profile-unsupported dt { color: #b9ceda; font: 750 .75rem/1.4 ui-monospace, monospace; text-transform: uppercase; }
.x43-profile-facts dd, .x43-profile-unsupported dd { margin-top: 4px; color: var(--text); text-align: left; font: .76rem/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
.x43-profile-unsupported dd[data-status="unavailable"] { color: #d7c38f; }
.x47-pulse-preview { grid-column: 1 / -1; border-color: #4d6f42 !important; background: linear-gradient(135deg, #06120f, #0b201b) !important; }
.x47-pulse-preview[data-state="preview"] { border-color: var(--lime) !important; }
.x47-pulse-preview[data-state="invalidated"] { border-color: #98637a !important; }
.x47-pulse-preview .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x47-pulse-preview .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; }
.x47-pulse-boundary, .x47-pulse-gap, .x47-pulse-preview [data-x47-binding] { margin: 8px 0; color: #b9ceda; font: .76rem/1.55 ui-monospace, monospace; overflow-wrap: anywhere; }
.x47-pulse-boundary strong { color: var(--lime); text-transform: uppercase; }
.x47-pulse-gap { color: #d7c38f; }
.x47-pulse-controls { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(190px, 1fr) minmax(150px, .65fr); gap: 8px; align-items: end; }
.x47-pulse-controls label { display: grid; gap: 5px; color: #b9ceda; font: 700 .75rem/1.4 ui-monospace, monospace; text-transform: uppercase; }
.x47-pulse-controls label span { display: flex; align-items: center; gap: 7px; text-transform: none; }
.x47-pulse-controls input { width: 100%; min-width: 0; min-height: 38px; }
.x47-pulse-controls button { min-height: 38px; color: #07121d; border-color: var(--lime); background: var(--lime); font: 850 .76rem/1.35 ui-monospace, monospace; }
.x47-pulse-controls button:disabled { color: var(--muted); border-color: var(--line); background: #0b1b29; }
.x47-pulse-output { display: grid; grid-template-columns: minmax(220px, .6fr) minmax(300px, 1.4fr); gap: 8px; margin-top: 10px; }
.x47-pulse-output ol, .x47-pulse-output details { min-width: 0; margin: 0; padding: 10px 10px 10px 34px; border: 1px solid #315d4b; border-radius: 8px; background: #020b08; color: #c6fbd4; font: .76rem/1.55 ui-monospace, monospace; }
.x47-pulse-output details { padding: 10px; }
.x47-pulse-output summary { cursor: pointer; color: var(--cyan); font-weight: 800; }
.x47-pulse-output pre { max-height: 180px; overflow: auto; margin: 8px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; color: #c6fbd4; font: inherit; }
.x47-runtime-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.x47-runtime-actions button { min-height: 38px; border-color: #37d4ff; background: #0c2633; color: #d9f8ff; font: 850 .76rem/1.35 ui-monospace, monospace; }
.x47-runtime-actions button[data-x47-apply]:not(:disabled) { border-color: var(--lime); background: var(--lime); color: #07121d; }
.x47-runtime-actions button:disabled { opacity: .56; }
.x47-pulse-preview [data-x47-runtime-state] { margin: 8px 0; color: #d9f8ff; font: 800 .76rem/1.5 ui-monospace, monospace; }
.x47-runtime-facts { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)); margin: 0; border: 1px solid #315d4b; border-radius: 8px; overflow: hidden; }
.x47-runtime-facts div { min-width: 0; padding: 8px; border-inline-end: 1px solid #315d4b; }
.x47-runtime-facts div:last-child { border-inline-end: 0; }
.x47-runtime-facts dt { color: #86a9b8; font: 750 .67rem/1.35 ui-monospace, monospace; text-transform: uppercase; }
.x47-runtime-facts dd { margin: 4px 0 0; color: #e8f3f7; font: .72rem/1.45 ui-monospace, monospace; overflow-wrap: anywhere; }
.x47-repeatable-inputs { grid-column: 1 / -1; border-color: #315d70 !important; background: linear-gradient(135deg, #06131a, #0a2028) !important; }
.x47-repeatable-inputs[data-state="preview"] { border-color: var(--cyan) !important; box-shadow: inset 3px 0 0 var(--cyan); }
.x47-repeatable-inputs[data-state="invalidated"] { border-color: #98637a !important; }
.x47-repeatable-inputs .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x47-repeatable-inputs .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; }
.x47-repeatable-boundary, .x47-repeatable-inputs [data-x47-repeatable-binding],
.x47-repeatable-inputs [data-x47-repeatable-runtime] { margin: 8px 0; color: #b9ceda; font: .76rem/1.55 ui-monospace, monospace; overflow-wrap: anywhere; }
.x47-repeatable-boundary strong { color: var(--cyan); text-transform: uppercase; }
.x47-repeatable-controls { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(190px, .7fr) minmax(190px, .7fr); gap: 8px; align-items: end; }
.x47-repeatable-controls label, .x47-repeatable-parameters { display: grid; gap: 5px; color: #b9ceda; font: 700 .75rem/1.4 ui-monospace, monospace; text-transform: uppercase; }
.x47-repeatable-controls select, .x47-repeatable-controls input,
.x47-repeatable-controls button { min-height: 38px; min-width: 0; }
.x47-repeatable-controls button, .x47-repeatable-actions button { color: #06131a; border-color: var(--cyan); background: var(--cyan); font: 850 .76rem/1.35 ui-monospace, monospace; }
.x47-repeatable-controls button:disabled, .x47-repeatable-actions button:disabled { color: var(--muted); border-color: var(--line); background: #0b1b29; }
.x47-repeatable-parameters { margin-top: 9px; }
.x47-repeatable-parameters textarea { width: 100%; min-height: 84px; resize: vertical; white-space: pre-wrap; color: #d8f8ff; background: #030d13; font: .74rem/1.5 ui-monospace, monospace; }
.x47-repeatable-output { display: grid; grid-template-columns: minmax(240px, .7fr) minmax(320px, 1.3fr); gap: 8px; margin-top: 10px; }
.x47-repeatable-output > div, .x47-repeatable-output details { min-width: 0; margin: 0; padding: 10px; border: 1px solid #315d70; border-radius: 8px; background: #020b10; color: #c9f7ff; font: .76rem/1.55 ui-monospace, monospace; }
.x47-repeatable-output ol { max-height: 180px; overflow: auto; margin: 8px 0 0; padding-left: 24px; }
.x47-repeatable-output summary { cursor: pointer; color: var(--cyan); font-weight: 800; }
.x47-repeatable-output pre { max-height: 180px; overflow: auto; margin: 8px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; color: #c9f7ff; font: inherit; }
.x47-repeatable-actions { display: flex; gap: 8px; margin-top: 10px; }
.x47-repeatable-actions button { min-height: 38px; }
.x49-offset-comparison { grid-column: 1 / -1; border-color: #795f2d !important; background: linear-gradient(135deg, #111006, #201a08) !important; }
.x48-room-loop { grid-column: 1 / -1; border-color: #2f6d74 !important; background: linear-gradient(135deg, #061517, #09252a) !important; }
.x48-room-loop[data-state="running"] { border-color: var(--cyan) !important; box-shadow: inset 3px 0 0 var(--cyan); }
.x48-room-loop[data-state="passed"] { border-color: var(--lime) !important; box-shadow: inset 3px 0 0 var(--lime); }
.x48-room-loop[data-state="failed"], .x48-room-loop[data-state="indeterminate"] { border-color: #f07878 !important; }
.x48-room-loop .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x48-room-loop .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; }
.x48-room-boundary, .x48-room-limit, .x48-room-loop [data-x48-message] { margin: 8px 0; color: #c8d5dc; font: .76rem/1.55 ui-monospace, monospace; overflow-wrap: anywhere; }
.x48-room-boundary strong { color: var(--cyan); text-transform: uppercase; }
.x48-room-limit { color: #d7c38f; }
.x48-room-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.x48-room-actions button { min-height: 38px; color: #07121d; border-color: var(--lime); background: var(--lime); font: 850 .76rem/1.35 ui-monospace, monospace; }
.x48-room-actions [data-x48-cancel] { color: #ffe7e7; border-color: #a64040; background: #401515; }
.x48-room-actions button:disabled { color: var(--muted); border-color: var(--line); background: #0b1b29; }
.x48-room-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 10px 0; }
.x48-room-facts div { min-width: 0; padding: 8px; border: 1px solid #2f5961; border-radius: 7px; background: #040d0f; }
.x48-room-facts dt { color: #9ddbe2; font: 750 .7rem/1.4 ui-monospace, monospace; text-transform: uppercase; }
.x48-room-facts dd { margin: 4px 0 0; color: var(--text); text-align: left; font: .72rem/1.45 ui-monospace, monospace; overflow-wrap: anywhere; }
.x48-room-table-wrap { max-width: 100%; max-height: 300px; overflow: auto; border: 1px solid #2f5961; border-radius: 8px; }
.x48-room-table-wrap table { width: 100%; min-width: 880px; border-collapse: collapse; background: #030b0d; }
.x48-room-table-wrap caption { padding: 8px; color: var(--cyan); text-align: left; font: 800 .7rem/1.4 ui-monospace, monospace; }
.x48-room-table-wrap th, .x48-room-table-wrap td { padding: 7px; border: 1px solid #24474d; text-align: left; vertical-align: top; font: .68rem/1.45 ui-monospace, monospace; }
.x48-room-table-wrap th { color: #9ddbe2; position: sticky; top: 0; background: #07181b; }
.x49-offset-comparison[data-state="preview"] { border-color: var(--amber) !important; }
.x49-offset-comparison[data-state="synthetic-replay"] { border-color: var(--cyan) !important; }
.x49-offset-comparison[data-state="invalidated"] { border-color: #98637a !important; }
.x49-offset-comparison[data-state="building"],
.x49-offset-comparison[data-state="prepared"],
.x49-offset-comparison[data-state^="running-"] { border-color: var(--cyan) !important; box-shadow: inset 3px 0 0 var(--cyan); }
.x49-offset-comparison[data-state="passed"] { border-color: var(--lime) !important; box-shadow: inset 3px 0 0 var(--lime); }
.x49-offset-comparison[data-state="failed"],
.x49-offset-comparison[data-state="indeterminate"] { border-color: #f07878 !important; }
.x49-offset-comparison .shared-instrument-tool-heading { align-items: center; font: 800 .78rem/1.4 ui-monospace, monospace; }
.x49-offset-comparison .shared-instrument-tool-heading span { padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; }
.x49-offset-boundary, .x49-offset-producer, .x49-offset-disclosure, .x49-offset-comparison [data-x49-message] { margin: 8px 0; color: #c8d5dc; font: .76rem/1.55 ui-monospace, monospace; overflow-wrap: anywhere; }
.x49-offset-boundary strong { color: var(--amber); text-transform: uppercase; }
.x49-offset-disclosure { padding: 8px 10px; border-left: 3px solid var(--cyan); background: #071722; }
.x49-offset-disclosure strong { color: var(--cyan); }
.x49-offset-producer { color: #d7c38f; }
.x49-offset-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.x49-offset-actions label { display: grid; gap: 4px; color: #d7c38f; font: 750 .72rem/1.3 ui-monospace, monospace; }
.x49-offset-actions select { min-height: 38px; min-width: 120px; border: 1px solid #665323; border-radius: 6px; color: var(--text); background: #08131d; font: 750 .76rem/1.35 ui-monospace, monospace; }
.x49-offset-actions button { min-height: 38px; color: #07121d; border-color: var(--amber); background: var(--amber); font: 850 .76rem/1.35 ui-monospace, monospace; }
.x49-offset-actions button:disabled { color: var(--muted); border-color: var(--line); background: #0b1b29; }
.x49-offset-actions [data-x49-native] { color: #04130b; border-color: var(--lime); background: var(--lime); }
.x49-offset-actions [data-x49-cancel] { color: #ffe7e7; border-color: #a64040; background: #401515; }
.x49-offset-actions span { color: #d7c38f; font: .72rem/1.45 ui-monospace, monospace; }
.x49-offset-table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid #665323; border-radius: 8px; }
.x49-offset-table-wrap table { width: 100%; min-width: 980px; border-collapse: collapse; background: #090a04; }
.x49-offset-table-wrap caption { padding: 8px; color: var(--cyan); text-align: left; font: 800 .7rem/1.4 ui-monospace, monospace; }
.x49-offset-table-wrap th, .x49-offset-table-wrap td { padding: 8px; border: 1px solid #4c4425; text-align: left; vertical-align: top; font: .69rem/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
.x49-offset-table-wrap th { color: var(--amber); }
.x49-offset-table-wrap td:nth-child(4), .x49-offset-table-wrap td:nth-child(5) { color: #d7c38f; }
@media (max-width: 760px) {
  .x46-uart-facts { grid-template-columns: 1fr; }
  .shared-instrument-tools, .failure-replay-results { grid-template-columns: 1fr; }
  .x42-trigger-controls, .x42-trigger-facts, .x43-profile-facts, .x43-profile-unsupported,
  .x47-pulse-controls, .x47-pulse-output, .x47-runtime-facts,
  .x47-repeatable-controls, .x47-repeatable-output { grid-template-columns: 1fr; }
  .x47-runtime-facts div { border-inline-end: 0; border-block-end: 1px solid #315d4b; }
}
.control-runtime-evidence { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 10px; }
.control-runtime-evidence summary { cursor: pointer; color: var(--cyan); font: 800 .72rem ui-monospace, monospace; }
.control-runtime-evidence > p { color: var(--muted); font-size: .72rem; line-height: 1.5; }
.control-runtime-table-wrap { overflow-x: auto; }
.control-runtime-evidence table { width: 100%; min-width: 760px; border-collapse: collapse; background: #040d15; }
.control-runtime-evidence th, .control-runtime-evidence td { padding: 8px 9px; border: 1px solid var(--line); text-align: left; vertical-align: top; font: .64rem/1.4 ui-monospace, monospace; }
.control-runtime-evidence th { color: var(--cyan); }
.control-runtime-evidence td:last-child { color: var(--lime); }
.instrument-output { min-height: 150px; max-height: 240px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px; border-radius: 9px; background: #040b11; color: #baf9cb; font: .77rem/1.5 ui-monospace, monospace; }
.mode-switch { display: flex; gap: 7px; margin: 12px 0 8px; }
.mode-switch button { min-height: 34px; }
.mode-switch button[aria-pressed="true"] { color: #07121d; background: var(--cyan); border-color: var(--cyan); }
.serial-controls { display: grid; grid-template-columns: minmax(120px, 1fr) 100px auto auto; gap: 8px; }
.serial-controls input { min-width: 0; }
.serial-tab { position: fixed; z-index: 82; top: 44%; right: 0; display: grid; gap: 4px; justify-items: center; min-width: 48px; min-height: 112px; padding: 10px 7px; border-radius: 12px 0 0 12px; border-right: 0; color: #07121d; background: var(--lime); border-color: var(--lime); writing-mode: vertical-rl; transition: right .18s ease; }
.serial-tab[aria-expanded="true"] { right: var(--serial-width); color: var(--text); background: #102d41; border-color: var(--cyan); }
.serial-new-output { padding: 3px 5px; border-radius: 999px; color: #07121d; background: var(--amber); font: 850 .62rem ui-monospace, monospace; writing-mode: horizontal-tb; }
.serial-dock { position: fixed; z-index: 80; inset: 10px 0 10px auto; width: var(--serial-width); display: grid; grid-template-columns: 8px minmax(0, 1fr); filter: drop-shadow(-20px 0 35px #0009); }
.serial-dock > .panel { height: 100%; overflow: hidden; border-radius: 16px 0 0 16px; display: flex; flex-direction: column; }
.serial-resizer { cursor: col-resize; touch-action: none; background: linear-gradient(90deg, transparent 1px, var(--cyan) 2px, var(--cyan) 5px, transparent 6px); }
.serial-resizer:focus-visible { outline: 3px solid var(--lime); outline-offset: -2px; }
.serial-heading-actions { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: .72rem; }
.serial-heading-actions button { min-height: 34px; }
.serial-truth { margin: 8px 0 0; font-size: .74rem; }
.serial-output-wrap { position: relative; min-height: 180px; height: min(52vh, 460px); flex: 0 1 auto; display: flex; }
.serial-dock .instrument-output { width: 100%; height: 100%; min-height: 0; max-height: none; margin: 0; overflow: auto; }
.serial-resume { position: absolute; right: 10px; bottom: 10px; min-height: 34px; color: #07121d; background: var(--amber); border-color: var(--amber); }
.logic-waveform { display: block; width: 100%; min-height: 190px; margin-top: 12px; border: 1px solid #17364a; border-radius: 9px; background: #040b11; }
.wave-grid { stroke: #17364a; stroke-width: 1; vector-effect: non-scaling-stroke; }
.wave-path { fill: none; stroke: var(--cyan); stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.wave-label, .wave-axis { fill: #95adbb; font: 18px ui-monospace, monospace; }
.wave-cursor { stroke: var(--lime); stroke-width: 1.5; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; }
.logic-output { min-height: 150px; max-height: 240px; overflow: auto; margin: 14px 0 0; padding: 0; list-style: none; }
.logic-output li { border-bottom: 1px solid #17364a; padding: 7px 9px; color: #c7dae3; font: .72rem ui-monospace, monospace; }
.logic-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 10px; margin-top: 12px; }
.logic-controls select[multiple] { grid-row: span 3; min-height: 112px; }
.logic-cursor { color: var(--cyan); font: .73rem ui-monospace, monospace; }
.pin-readout { margin-bottom: 0; }
dialog { width: min(620px, calc(100% - 32px)); padding: 0; border: 1px solid #2a627f; border-radius: 18px; background: #0c1c2b; color: var(--text); box-shadow: 0 30px 100px #000c; }
dialog::backdrop { background: #02070bca; backdrop-filter: blur(5px); }
#browser-session-api-dialog { width: min(780px, calc(100% - 24px)); max-width: calc(100% - 24px); max-height: calc(100vh - 24px); overflow: hidden; }
#browser-session-api-dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 18px; border-bottom: 1px solid #2a627f; background: #0a2131; }
#browser-session-api-dialog > header h2, #browser-session-api-dialog > header p { margin: 0; }
.api-pairing-body { display: grid; gap: 16px; width: 100%; min-width: 0; max-height: calc(100vh - 96px); padding: 18px; overflow-y: auto; overflow-x: hidden; }
.api-pairing-body > *, .api-pairing-controls > *, .api-codex-prompt > * { min-width: 0; max-width: 100%; }
.api-pairing-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: api-step; }
.api-pairing-steps li { position: relative; padding: 12px 12px 12px 42px; border: 1px solid #28566d; border-radius: 10px; background: #071722; color: var(--text); counter-increment: api-step; }
.api-pairing-steps li::before { content: counter(api-step); position: absolute; left: 11px; top: 11px; display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #06111a; background: var(--cyan); font-weight: 900; }
.api-pairing-steps strong, .api-pairing-steps span { display: block; }
.api-pairing-steps span { margin-top: 5px; color: var(--muted); font-size: .7rem; line-height: 1.4; }
.api-codex-prompt, .api-pairing-controls { padding: 14px; border: 1px solid #2a627f; border-radius: 12px; background: #07141f; }
.api-codex-prompt-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.api-codex-prompt-heading h3, .api-codex-prompt-heading p { margin: 0; }
.api-codex-prompt textarea { display: block; width: 100%; min-width: 0; height: 210px; margin-top: 12px; padding: 12px; resize: vertical; overflow-wrap: anywhere; white-space: pre-wrap; color: #d9f7ff; border: 1px solid #28566d; border-radius: 8px; background: #020a10; font: .72rem/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; }
.api-resource-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0; }
.api-resource-links a { display: inline-flex; min-height: 34px; align-items: center; padding: 5px 9px; border: 1px solid #2a627f; border-radius: 7px; color: var(--cyan); text-decoration: none; font-size: .72rem; font-weight: 800; }
.api-copy-status { margin: 8px 0 0; color: var(--muted); font-size: .7rem; }
.api-pairing-controls > p { margin: 0 0 10px; }
.api-edit-scope { display: flex; align-items: flex-start; gap: 9px; width: fit-content; max-width: 100%; color: var(--text); font-size: .78rem; font-weight: 800; }
.api-edit-scope input[type="checkbox"] { flex: 0 0 18px; width: 18px; min-width: 18px; height: 18px; min-height: 18px; margin: 1px 0 0; padding: 0; accent-color: var(--lime); }
.api-edit-scope span, .api-edit-scope small { min-width: 0; overflow-wrap: anywhere; }
.api-edit-scope small { color: var(--muted); font-weight: 600; }
.api-secret-field { display: grid; gap: 6px; margin-top: 10px; color: var(--muted); font-size: .72rem; font-weight: 800; }
.api-secret-field input { width: 100%; min-width: 0; font-family: ui-monospace,SFMono-Regular,Consolas,monospace; }
@media (max-width: 620px) { .api-pairing-steps { grid-template-columns: 1fr; } .api-codex-prompt-heading { align-items: stretch; flex-direction: column; } .api-codex-prompt-heading button { width: 100%; } }
dialog form { position: relative; padding: 28px; }
.dialog-close { position: absolute; top: 12px; right: 12px; min-width: 38px; padding: 0; font-size: 1.4rem; }
dialog ol { display: grid; gap: 12px; padding-left: 24px; }
dialog li { color: var(--cyan); padding-left: 8px; }
dialog li span { display: block; color: var(--muted); margin-top: 3px; line-height: 1.45; }
.example-picker-dialog { width: min(1180px, calc(100% - 32px)); max-height: calc(100vh - 32px); }
.example-picker-dialog-inner { position: relative; display: flex; flex-direction: column; max-height: calc(100vh - 34px); padding: 26px; overflow: hidden; }
.example-picker-dialog h2, .example-picker-dialog p { margin-top: 0; }
.example-picker-description { max-width: 820px; margin-bottom: 14px; color: var(--muted); line-height: 1.5; }
.example-picker-search { display: grid; grid-template-columns: auto minmax(220px, 420px); align-items: center; justify-content: start; gap: 10px; color: var(--text); font-size: .78rem; font-weight: 800; }
.example-picker-search input { min-width: 0; }
.example-picker-status { margin: 10px 0 0; color: var(--cyan); font: 700 .72rem ui-monospace, monospace; }
.example-picker-dialog .starter-grid { grid-template-columns: repeat(3, minmax(220px, 1fr)); min-height: 0; max-height: min(65vh, 720px); margin-top: 12px; padding: 2px 8px 10px 2px; overflow: auto; overscroll-behavior: contain; }
.example-picker-dialog .starter-card { min-height: 190px; }
.component-support-dialog { width: min(1120px, calc(100% - 32px)); }
.component-support-dialog-inner { position: relative; padding: 28px; }
.component-support-dialog select { min-width: min(320px, 100%); }
.component-support-summary { margin: 16px 0 4px; color: var(--lime); font-weight: 800; }
.component-support-table-wrap { max-height: min(58vh, 620px); overflow: auto; margin: 16px 0; border: 1px solid var(--line); border-radius: 10px; }
.component-support-table { width: 100%; border-collapse: collapse; font-size: .75rem; }
.component-support-table th, .component-support-table td { padding: 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.component-support-table thead th { position: sticky; top: 0; z-index: 1; color: var(--cyan); background: #07141f; }
.component-support-table tbody th { min-width: 250px; }
.component-support-table tbody th strong, .component-support-table tbody th code { display: block; }
.component-support-table tbody th code { margin-top: 4px; color: var(--muted); font-size: .66rem; }
.matrix-status { display: inline-block; padding: 3px 7px; border-radius: 999px; color: #07121d; background: var(--lime); font-weight: 850; white-space: nowrap; }
.matrix-status.partial { background: var(--amber); }
.matrix-status.unavailable { color: var(--muted); background: #1a2c3a; border: 1px solid #40596c; }
.matrix-doc-link { display: inline-flex; min-height: 40px; align-items: center; color: var(--cyan); font-weight: 750; }
.unsaved-change-form { display: grid; gap: 14px; }
.unsaved-change-form h2, .unsaved-change-form p { margin: 0; }
.unsaved-change-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 8px; }
.unsaved-change-actions .danger-button { border-color: #ff806f; color: #fff; background: #8f2f2a; }
.unsaved-change-actions .danger-button:hover, .unsaved-change-actions .danger-button:focus-visible { background: #aa3932; }
.about { margin-top: 16px; }
.about-intro { display: grid; grid-template-columns: minmax(250px, .65fr) 1.35fr; gap: 22px; align-items: start; }
.about-intro > p, .answer-grid p { margin: 0; color: var(--muted); line-height: 1.6; }
.answer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 18px; }
.answer-grid article { padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #07141f; }
.answer-grid h3 { margin: 0 0 8px; color: var(--cyan); font-size: .94rem; }
.project-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.project-links a { min-height: 42px; display: inline-flex; align-items: center; padding: 0 13px; border: 1px solid #2a627f; border-radius: 8px; color: var(--text); font-weight: 740; text-decoration: none; }
.project-links a:hover, .project-links a:focus-visible { border-color: var(--cyan); color: var(--lime); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
footer { text-align: center; font-size: .76rem; padding-top: 28px; }
.page-view-count { color: var(--text); white-space: nowrap; }

@media (max-width: 1120px) {
  .canvas-primary-controls { grid-template-columns: 1fr; }
  .selected-runtime-control { flex-wrap: wrap; }
  .selected-runtime-control span { flex: 1 1 260px; white-space: normal; }
  .requirement-trace-row, .open-assumption-row, .feasibility-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .starter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workspace { grid-template-columns: 1fr 8px 280px; }
  .workspace > .catalog { grid-column: 1 / -1; position: static; }
  .workspace > #catalog-resizer { display: none; }
  .workspace > .board-card { grid-column: 1; }
  .workspace > #inspector-resizer { grid-column: 2; }
  .workspace > .inspector { grid-column: 3; }
  .workspace.catalog-collapsed:not(.inspector-collapsed) { grid-template-columns: 1fr 8px 280px; }
  .workspace.inspector-collapsed, .workspace.catalog-collapsed.inspector-collapsed { grid-template-columns: 1fr; }
  .workspace.inspector-collapsed > .catalog, .workspace.inspector-collapsed > .board-card,
  .workspace.catalog-collapsed.inspector-collapsed > .board-card { grid-column: 1; }
  .catalog-list { grid-template-columns: repeat(5, minmax(145px, 1fr)); overflow-x: auto; }
  .inspector { position: static; }
  .instrument-grid { grid-template-columns: 1fr 1fr; }
  .pico-public-grid.shared-profile-grid,
  .c3-public-grid.shared-profile-grid,
  .stm32-public-grid.shared-profile-grid,
  .shared-profile-workbench.parts-collapsed:not(.inspector-collapsed) .shared-profile-grid,
  .shared-profile-workbench.inspector-collapsed:not(.parts-collapsed) .shared-profile-grid,
  .shared-profile-workbench.parts-collapsed.inspector-collapsed .shared-profile-grid { grid-template-columns: minmax(0,1fr) 280px; grid-template-areas: "parts parts" "canvas inspector"; }
  .shared-profile-workbench.parts-collapsed .shared-profile-grid { grid-template-areas: "canvas inspector"; }
  .shared-profile-workbench.inspector-collapsed .shared-profile-grid { grid-template-columns: 1fr; grid-template-areas: "parts" "canvas"; }
  .shared-parts-surface { position: static; }
  .shared-panel-resizer { display: none; }
  .logic-card { grid-column: 1 / -1; }
}
@media (max-width: 780px) {
  :root { --parts-drawer-width: min(390px, calc(100vw - 56px)); }
  .desktop-required { border-color: var(--lime); background: #102319; }
  body.serial-dock-open main,
  body:has(> .serial-dock:not([hidden])) main { width: min(100% - 18px, 680px); margin: 0 auto; padding-bottom: calc(44vh + 28px); }
  main { width: min(100% - 18px, 680px); padding-top: 30px; }
  .app-header { align-items: start; flex-direction: column; gap: 8px; }
  .lede { text-align: left; }
  body[data-active-profile] .app-header .lede { width: 100%; max-width: 100%; white-space: normal; }
  .top-workbench-toolbar { grid-template-columns: minmax(0,1fr); }
  .top-controller-controls, .top-primary-controls { width: 100%; min-width: 0; }
  .top-controller-controls .controller-profile-picker { grid-template-columns: minmax(0,1fr); }
  .top-controller-controls #controller-status { white-space: normal; }
  .top-workbench-status { flex-wrap: wrap; }
  .top-workbench-status > * { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  .project-bar, .project-brief-grid, .controller-workbench, .workspace, .runtime, .instrument-grid, .prompt-grid, .about-intro, .answer-grid, .thermostat-contract, .requirement-trace-row, .open-assumption-row, .feasibility-row, .scenario-event, .scenario-event.expect-pin-level { grid-template-columns: 1fr; }
  .example-picker-dialog .starter-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
  .scenario-card-heading, .scenario-editor-heading { align-items: stretch; flex-direction: column; }
  .seeded-property-controls { grid-template-columns: 1fr; }
  .seeded-property-controls .truth { grid-column: 1; }
  .fault-suite-controls { grid-template-columns: 1fr; }
  .fault-suite-controls .truth { grid-column: 1; }
  .counterexample-reduction-controls { grid-template-columns: 1fr; }
  .counterexample-reduction-controls .truth { grid-column: 1; }
  .project-brief-purpose { grid-column: 1; }
  .project-brief-heading, .project-brief-footer, .requirement-trace-heading { align-items: flex-start; flex-direction: column; }
  .regression-matrix-heading { flex-direction: column; }
  .regression-matrix-actions { display: grid; grid-template-columns: 1fr; }
  .instrument-evidence-heading { display: grid; }
  .instrument-evidence-state { justify-self: start; }
  .instrument-evidence-facts, .instrument-boundary-list, .instrument-summary-list { grid-template-columns: 1fr; }
  .unsaved-change-actions { display: grid; grid-template-columns: 1fr; }
  .controller-capabilities { grid-template-columns: 1fr; }
  .profile-migration-grid { grid-template-columns: 1fr; }
  .panel-resizer { display: none; }
  .workspace > .catalog, .workspace > .board-card, .workspace > .inspector, .logic-card { grid-column: 1; }
  body.serial-dock-open .workspace { grid-template-columns: 1fr; }
  body.serial-dock-open .workspace.inspector-collapsed,
  body.serial-dock-open .workspace.catalog-collapsed.inspector-collapsed { grid-template-columns: minmax(0, 1fr); }
  body.serial-dock-open .workspace .catalog, body.serial-dock-open .workspace .inspector { display: block; grid-column: 1; }
  body.serial-dock-open .workspace #catalog-resizer, body.serial-dock-open .workspace #inspector-resizer { display: none; }
  .workspace.catalog-collapsed:not(.inspector-collapsed),
  .workspace.inspector-collapsed:not(.catalog-collapsed),
  .workspace.catalog-collapsed.inspector-collapsed { grid-template-columns: 1fr; }
  .workspace.catalog-collapsed:not(.inspector-collapsed) > .board-card,
  .workspace.inspector-collapsed:not(.catalog-collapsed) > .catalog,
  .workspace.inspector-collapsed:not(.catalog-collapsed) > .board-card,
  .workspace.catalog-collapsed.inspector-collapsed > .board-card { grid-column: 1; }
  .quick-controls { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; }
  .quick-controls > span { grid-column: 1 / -1; min-width: 0; margin-right: 0; }
  .quick-controls #toggle-catalog, .quick-controls #toggle-inspector { grid-column: span 2; }
  .quick-controls button { width: 100%; min-width: 0; padding-inline: 5px; }
  .source-files { grid-template-columns: 1fr 1fr; }
  .catalog-list { grid-template-columns: repeat(2, minmax(130px, 1fr)); overflow: visible; }
  .catalog-pagination { grid-template-columns: 1fr 1fr; }
  .catalog-pagination output { grid-column: 1 / -1; grid-row: 1; }
  .circuit-canvas { height: 620px; }
  .catalog-list { max-height: none; }
  .serial-controls { grid-template-columns: 1fr 1fr; }
  .serial-controls input { grid-column: 1 / -1; }
  .serial-dock { inset: auto 0 0 0; width: 100%; height: 44vh; grid-template-columns: 1fr; grid-template-rows: 8px minmax(0, 1fr); }
  .serial-dock > .panel { border-radius: 16px 16px 0 0; padding: 12px; }
  .serial-resizer { cursor: row-resize; background: linear-gradient(transparent 1px, var(--cyan) 2px, var(--cyan) 5px, transparent 6px); }
  .serial-tab, .serial-tab[aria-expanded="true"] { top: auto; right: 8px; bottom: 0; min-width: 104px; min-height: 42px; border-right: 1px solid var(--lime); border-radius: 10px 10px 0 0; writing-mode: horizontal-tb; }
  .serial-tab[aria-expanded="true"] { bottom: 44vh; }
  .panel { padding: 14px; }
  .pico-public-grid.shared-profile-grid,
  .c3-public-grid.shared-profile-grid,
  .stm32-public-grid.shared-profile-grid,
  .shared-profile-workbench.parts-collapsed:not(.inspector-collapsed) .shared-profile-grid,
  .shared-profile-workbench.inspector-collapsed:not(.parts-collapsed) .shared-profile-grid,
  .shared-profile-workbench.parts-collapsed.inspector-collapsed .shared-profile-grid { grid-template-columns: minmax(0,1fr); grid-template-areas: "parts" "canvas" "inspector"; }
  .shared-project-bar { grid-template-columns: 1fr; }
  .pico-editor-part[data-component-type="resistor.fixed-v1"] [data-editor-endpoint$=".B"] .pico-editor-pin-label { top: calc(100% + 28px); }
  .shared-canvas-surface:fullscreen .pico-editor-part[data-component-type="resistor.fixed-v1"] [data-editor-endpoint$=".B"] .pico-editor-pin-label,
  .shared-profile-workbench.shared-canvas-focus .pico-editor-part[data-component-type="resistor.fixed-v1"] [data-editor-endpoint$=".B"] .pico-editor-pin-label { top: calc(100% - 5px); }
  /* The circuit editor is a desktop workbench, not a separate mobile UI.
     Narrow windows scroll the intact editor instead of compressing pin labels,
     component art and the inspector into overlapping columns. */
  .shared-profile-workbench { overflow-x: auto; overscroll-behavior-inline: contain; }
  .pico-public-grid.shared-profile-grid,
  .c3-public-grid.shared-profile-grid,
  .stm32-public-grid.shared-profile-grid { min-width: 1120px; grid-template-columns: 260px 8px minmax(520px,1fr) 8px 280px;
    grid-template-areas: "parts parts-resizer canvas inspector-resizer inspector"; }
  .shared-profile-workbench .serial-tab, .shared-profile-workbench .serial-tab[aria-expanded="true"] {
    top: 44%; right: 0; bottom: auto; min-width: 48px; min-height: 112px;
    border-right: 0; border-radius: 12px 0 0 12px; writing-mode: vertical-rl;
  }
  .top-workbench-shell { overflow-x: auto; overscroll-behavior-inline: contain; }
  .top-workbench-sticky-controls, .active-canvas-stage { min-width: 980px; }
  .active-canvas-stage { grid-template-columns: minmax(700px,1fr); }
  .simple-parts-mount .catalog-list { grid-template-columns: 1fr; overflow-x: hidden; }
  body[data-workbench-view="simple"] > .serial-tab { display: none; }
}
@media (max-width: 480px) {
  .example-picker-dialog .starter-grid { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 390px) {
  .starter-grid, .example-picker-dialog .starter-grid { grid-template-columns: 1fr; }
  .example-picker-search { grid-template-columns: 1fr; }
  .catalog-list { grid-template-columns: 1fr; }
  .toolbar > *, .build-controls > * { flex: 1 1 130px; }
  .circuit-component { scale: .82; }
}

.project-navigation { margin-block: 10px; }
.project-navigation > summary { cursor: pointer; color: var(--cyan); font-weight: 850; }
.project-navigation > label { display: block; margin: 12px 0 6px; color: var(--muted); }
.project-navigation > input { width: 100%; }
.project-navigation-results { display: grid; gap: 6px; max-height: 320px; overflow: auto; }
.project-navigation-result { display: grid; grid-template-columns: 90px minmax(0,1fr); gap: 8px; width: 100%; text-align: left; }
.project-navigation-result span:first-child { color: var(--lime); text-transform: uppercase; font-size: .72rem; }
.project-navigation-result span:last-child { overflow-wrap: anywhere; }
.docs-main { width: min(960px, calc(100% - 32px)); }
.docs-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.docs-nav a { display: inline-flex; min-height: 42px; align-items: center; padding: 0 12px; border: 1px solid #2a627f; border-radius: 8px; color: var(--text); text-decoration: none; font-weight: 740; }
.docs-nav a:hover, .docs-nav a:focus-visible { border-color: var(--cyan); color: var(--lime); }
.docs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.progression-map { margin-top: 16px; }
.progression-map > summary { cursor: pointer; color: var(--cyan); font-size: 1rem; font-weight: 850; }
.progression-map > summary:focus-visible { outline: 3px solid var(--lime); outline-offset: 4px; }
.progression-map ol { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 0; }
.progression-map li { min-width: 0; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: #081722; }
.progression-map li strong { color: var(--text); }
.progression-map li span { color: var(--muted); }
.docs-card { padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #07141f; }
.docs-card h2, .docs-card h3 { margin-top: 0; color: var(--cyan); }
.docs-card p, .docs-card li, .docs-intro { color: var(--muted); line-height: 1.6; }
.docs-quick-start { margin: 14px 0; padding: 16px; border: 1px solid #3f7a91; border-radius: 14px; background: linear-gradient(145deg,#0b2231,#07141f); }
.docs-quick-start h2 { margin: 0 0 7px; color: var(--text); }
.docs-quick-start p { margin: 0 0 10px; color: var(--muted); line-height: 1.5; }
.docs-quick-menu { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.docs-card-action { display: inline-flex; margin-top: 8px; color: var(--lime); font-weight: 800; text-decoration: none; }
.docs-card-action:hover, .docs-card-action:focus-visible { color: var(--cyan); text-decoration: underline; }
@media (max-width: 700px) { .docs-quick-menu { grid-template-columns: 1fr; } }
.support-table { width: 100%; border-collapse: collapse; margin-top: 14px; }
.support-table th, .support-table td { padding: 12px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.support-table th { color: var(--cyan); background: #07141f; }
.support-table-wrap { overflow-x: auto; }
.component-doc-matrix { min-width: 920px; font-size: .76rem; }
.component-doc-matrix tbody th { min-width: 260px; }
.component-doc-matrix code { color: var(--muted); font-size: .68rem; }
.component-doc-matrix td:not(.status-supported):not(.status-limited) { color: var(--muted); }
.status-supported { color: var(--lime); font-weight: 800; }
.status-limited { color: var(--amber); font-weight: 800; }
.physical-checklist-main { display: grid; gap: 14px; }
.physical-boundary { display: grid; gap: 4px; padding: 14px 16px; border: 2px solid var(--amber); border-radius: 12px; background: #201b0c; color: var(--muted); }
.physical-boundary strong { color: var(--amber); font-size: 1rem; }
.physical-boundary[data-present="true"] { border-color: var(--cyan); background: #08212a; }
.physical-boundary[data-present="true"] strong { color: var(--cyan); }
.physical-checklist-controls { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(260px, 1fr); gap: 10px 18px; align-items: end; }
.physical-checklist-controls > div:first-child, .physical-checklist-controls #physical-status { grid-column: 1 / -1; }
.physical-checklist-controls label, .physical-checklist-item > label { display: grid; gap: 6px; color: var(--muted); font-size: .78rem; font-weight: 800; }
.physical-checklist-controls select, .physical-checklist-item select, .physical-observation input { min-height: 42px; padding: 8px 10px; border: 1px solid #31536c; border-radius: 8px; color: var(--text); background: #06131e; }
.physical-checklist-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.physical-checklist-identity dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.physical-checklist-identity dl div { min-width: 0; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #06131e; }
.physical-checklist-identity dt { color: var(--muted); font-size: .7rem; }
.physical-checklist-identity dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.physical-checklist-list { display: grid; gap: 12px; }
.physical-checklist-item { display: grid; gap: 12px; break-inside: avoid; }
.physical-item-heading { display: flex; justify-content: space-between; gap: 16px; align-items: start; }
.physical-item-heading .eyebrow { display: inline-block; margin: 0 0 5px 8px; }
.physical-item-number { display: inline-grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--cyan); color: #04111b; font-weight: 900; }
.physical-item-heading h2 { margin-top: 4px; }
.physical-basis { padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; color: var(--lime); font: 800 .68rem ui-monospace, monospace; white-space: nowrap; }
.physical-basis[data-basis="project-model"] { color: var(--amber); }
.physical-basis[data-basis="unavailable"] { color: var(--danger); }
.physical-observation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 12px; border: 1px solid #31536c; border-radius: 9px; }
.physical-observation legend { color: var(--amber); font-weight: 800; }
.physical-observation label { display: grid; gap: 4px; color: var(--muted); font-size: .72rem; }
#physical-status[data-valid="false"] { color: var(--danger); }
.physical-certification-boundary { border-color: var(--amber); }
.physical-print-projection { display: none; }
@media (max-width: 640px) {
  .physical-checklist-controls, .physical-checklist-identity dl, .physical-observation { grid-template-columns: 1fr; }
}
@media print {
  :root { color-scheme: light; }
  body { background: #fff; color: #111; }
  .no-print { display: none !important; }
  html[data-physical-print-state] .physical-checklist-identity,
  html[data-physical-print-state] .physical-checklist-list { display: none !important; }
  html[data-physical-print-state] .physical-print-projection { display: block; }
  .physical-print-projection h2 { margin: 0 0 10px; }
  .physical-print-boundary, .physical-print-footer { padding: 10px; border: 2px solid #333; font-weight: 700; }
  .physical-print-identity { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .physical-print-identity div, .physical-print-observation div { min-width: 0; padding: 5px; border: 1px solid #777; }
  .physical-print-identity dt, .physical-print-observation dt { font-weight: 700; }
  .physical-print-identity dd, .physical-print-observation dd { margin: 3px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; }
  .physical-print-items { display: grid; gap: 10px; }
  .physical-print-items article { padding: 10px; border: 1px solid #555; break-inside: avoid; }
  .physical-print-items h3, .physical-print-items p { margin: 0 0 7px; }
  .physical-print-status { font-weight: 800; }
  .physical-print-observation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
  .physical-checklist-main input, .physical-checklist-main select, .physical-checklist-main button { display: none !important; }
  .docs-main { width: 100%; padding: 0; }
  .panel, .physical-boundary { color: #111; background: #fff; border-color: #555; box-shadow: none; }
  .physical-boundary strong, .physical-item-heading h2, .physical-checklist-identity h2, .physical-certification-boundary h2 { color: #111; }
  .physical-checklist-item { page-break-inside: avoid; }
  .physical-observation input, .physical-checklist-item select { color: #111; background: #fff; border-color: #777; }
  .physical-basis { color: #111 !important; border-color: #777; }
  .docs-intro, .truth, footer { color: #222 !important; }
}
@media (max-width: 640px) {
  .checkable-evidence-grid { grid-template-columns: 1fr; }
  .docs-grid { grid-template-columns: 1fr; }
  .progression-map ol { grid-template-columns: 1fr; }
  .support-table { display: block; overflow-x: auto; }
}
