:root{--bg: #eef1f7;--panel: #ffffff;--panel-2: #f7f9fc;--panel-3: #eef2f8;--ink: #16202e;--ink-2: #46536a;--ink-3: #6b7789;--line: #d9e0ec;--line-strong: #c3ccdb;--accent: #1f5fbf;--accent-hover: #1a51a5;--accent-soft: #e6eefb;--header-bg: #187eb2;--header-bg-hover: #146a96;--header-ink: #ffffff;--header-field-bg: rgba(255, 255, 255, .16);--header-field-bg-hover: rgba(255, 255, 255, .26);--header-field-border: rgba(255, 255, 255, .4);--header-label-ink: rgba(255, 255, 255, .85);--run: #12874c;--run-hover: #0e6d3d;--stop: #c0392b;--stop-hover: #a33124;--warn: #b7791f;--ok: #12874c;--off: #6b7789;--radius-lg: 14px;--radius: 10px;--radius-sm: 7px;--shadow-sm: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);--shadow: 0 2px 6px rgba(16, 24, 40, .07), 0 6px 18px rgba(16, 24, 40, .08);--shadow-lg: 0 12px 34px rgba(16, 24, 40, .16);--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--header-h: 56px;--footer-h: 60px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:3px solid #2f80ed;outline-offset:2px;border-radius:4px}.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}.app{display:grid;grid-template-rows:minmax(var(--header-h),auto) auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);height:100%;min-height:0;overflow:hidden}.app>.header{grid-row:1}.app>.mobile-tabs{grid-row:2}.app>.app__main{grid-row:3}.app>.runbar{grid-row:4}.app__main{min-height:0;min-width:0;display:flex;padding:10px;gap:0}.header{display:flex;align-items:center;min-width:0;gap:14px;padding:0 14px;background:var(--header-bg);color:var(--header-ink);border-bottom:1px solid rgba(0,0,0,.12);box-shadow:var(--shadow-sm);z-index:5}.header :focus-visible{outline-color:#fff}.brand{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:-.01em;font-size:17px;white-space:nowrap;color:var(--header-ink)}.brand__mark{width:28px;height:28px;border-radius:8px;background:#fff;color:var(--header-bg);display:grid;place-items:center;box-shadow:0 1px 2px #0003;flex:0 0 auto}.brand__version{font-size:11px;font-weight:600;color:var(--header-ink);background:#fff3;border:1px solid var(--header-field-border);border-radius:999px;padding:1px 7px}.header__spacer{flex:1 1 auto}.field{display:flex;align-items:center;gap:7px}.field__label{font-size:12px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}.header .field__label{color:var(--header-label-ink)}.select,.text-input{background:var(--panel-2);border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:7px 10px;min-height:36px;font-size:14px}.select:hover,.text-input:hover{border-color:var(--accent)}.text-input{min-width:150px}.header .select,.header .text-input{background:var(--header-field-bg);border-color:var(--header-field-border);color:var(--header-ink)}.header .select:hover,.header .text-input:hover{background:var(--header-field-bg-hover);border-color:#fff9}.header .text-input::placeholder{color:#ffffffb3}.header .select option{color:var(--ink)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 14px;border-radius:var(--radius);border:1px solid var(--line-strong);background:var(--panel);color:var(--ink);font-weight:600;font-size:14px;cursor:pointer;transition:background .12s ease,border-color .12s ease,transform 60ms ease;white-space:nowrap}.btn:hover:not(:disabled){background:var(--panel-3);border-color:var(--line-strong)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn--primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn--run{background:var(--run);border-color:var(--run);color:#fff;min-width:108px;font-size:15px;min-height:42px}.btn--run:hover:not(:disabled){background:var(--run-hover);border-color:var(--run-hover)}.btn--stop{background:var(--stop);border-color:var(--stop);color:#fff;min-width:96px;font-size:15px;min-height:42px}.btn--stop:hover:not(:disabled){background:var(--stop-hover);border-color:var(--stop-hover)}.btn--reset{min-width:96px;font-size:15px;min-height:42px}.btn--icon{min-width:38px;padding:8px}.btn--ghost{background:transparent;border-color:transparent}.btn--ghost:hover:not(:disabled){background:var(--panel-3)}.btn--toggled{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-hover)}.btn--sm{min-height:32px;padding:5px 10px;font-size:13px}.header .btn{background:transparent;border-color:transparent;color:var(--header-ink)}.header .btn:hover:not(:disabled){background:#ffffff29;border-color:transparent}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden}.panel__header{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--panel-2);min-height:44px;flex:0 0 auto}.panel__title{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin:0}.panel__body{flex:1 1 auto;min-height:0;position:relative;overflow:auto}.split{display:flex;flex:1 1 auto;min-width:0;min-height:0}.split__pane{min-width:0;min-height:0;display:flex;flex-direction:column}.split__divider{flex:0 0 12px;cursor:col-resize;position:relative;display:grid;place-items:center;background:transparent;border:none;padding:0}.split__divider:after{content:"";width:4px;height:46px;border-radius:999px;background:var(--line-strong);transition:background .12s ease}.split__divider:hover:after,.split__divider:focus-visible:after{background:var(--accent)}.tabs{display:flex;gap:4px}.tab{border:1px solid transparent;background:transparent;border-radius:var(--radius-sm);padding:5px 12px;font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer;min-height:32px}.tab:hover{background:var(--panel-3)}.tab[aria-selected=true]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-hover)}.blockly-host{position:absolute;inset:0}.blockly-host--hidden{visibility:hidden}.code-view{position:absolute;inset:0;margin:0;padding:14px 16px;overflow:auto;font-family:var(--mono);font-size:13px;line-height:1.6;background:#0f1726;color:#dbe4f3;white-space:pre;tab-size:2}.code-view__note{position:sticky;top:0;display:block;color:#8fa6c9}.sim{position:relative;flex:1 1 auto;min-height:0;background:#e9edf5}.sim__canvas{display:block;touch-action:none}.sim__canvas--grab{cursor:grab}.sim__canvas--grabbing{cursor:grabbing}.sim__canvas--draw{cursor:crosshair}.sim__hint{position:absolute;left:10px;bottom:10px;background:#0f1726d1;color:#fff;font-size:12px;font-weight:500;padding:5px 9px;border-radius:var(--radius-sm);pointer-events:none;max-width:62%}.telemetry{display:grid;grid-template-columns:repeat(auto-fill,minmax(126px,1fr));gap:8px;padding:10px}.readout{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);padding:7px 9px;min-width:0}.readout__label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.readout__value{font-family:var(--mono);font-size:19px;font-weight:600;line-height:1.15;letter-spacing:-.02em;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.readout__value--sm{font-size:15px}.readout__unit{font-size:12px;font-weight:600;color:var(--ink-3);margin-left:3px;font-family:var(--font)}.readout--on{border-color:#9fd7bb;background:#eefaf3}.readout--off{border-color:var(--line)}.state-chip{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;font-family:var(--font)}.state-chip__dot{width:10px;height:10px;border-radius:50%;border:2px solid currentColor;flex:0 0 auto}.state-chip--on{color:var(--ok)}.state-chip--on .state-chip__dot{background:currentColor}.state-chip--off{color:var(--off)}.bar{height:5px;border-radius:999px;background:var(--panel-3);overflow:hidden;margin-top:5px;position:relative}.bar__fill{position:absolute;top:0;bottom:0;background:var(--accent);border-radius:999px}.bar__fill--neg{background:var(--warn)}.seven-seg{font-family:var(--mono);font-size:20px;font-weight:700;letter-spacing:.08em;color:#4ade80;background:#101826;border-radius:var(--radius-sm);padding:3px 8px;display:inline-block;min-width:76px;text-align:center}.led-row{display:flex;gap:10px;align-items:center;margin-top:3px}.led-swatch{width:20px;height:20px;border-radius:50%;border:2px solid var(--line-strong);flex:0 0 auto}.led-label{font-size:11px;color:var(--ink-3);font-weight:600}.rail{width:268px;flex:0 0 268px;min-width:0;display:flex;flex-direction:column;gap:10px;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:2px}.rail .panel{flex:0 0 auto}.runbar{display:flex;align-items:center;gap:10px;padding:9px 14px;background:var(--panel);border-top:1px solid var(--line);flex-wrap:wrap;min-height:var(--footer-h)}.runbar__group{display:flex;align-items:center;gap:8px}.runbar__spacer{flex:1 1 auto}.runbar__status{font-size:13px;font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;gap:7px;padding-left:4px}.pulse{width:9px;height:9px;border-radius:50%;background:var(--run);animation:pulse 1.1s ease-in-out infinite;flex:0 0 auto}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.82)}}@media(prefers-reduced-motion:reduce){.pulse{animation:none}*{transition-duration:.01ms!important}}.collapse__toggle{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;padding:0;cursor:pointer;text-align:left}.collapse__chevron{transition:transform .14s ease;color:var(--ink-3);flex:0 0 auto}.collapse__chevron--open{transform:rotate(90deg)}.prose{padding:12px 14px;font-size:14px;color:var(--ink-2)}.prose h3{font-size:14px;color:var(--ink);margin:16px 0 6px}.prose h3:first-child{margin-top:0}.prose p{margin:0 0 9px}.prose ul,.prose ol{margin:0 0 10px;padding-left:20px}.prose li{margin-bottom:4px}.prose code{font-family:var(--mono);font-size:12.5px;background:var(--panel-3);border:1px solid var(--line);border-radius:5px;padding:1px 5px}.prose strong{color:var(--ink)}.challenge{padding:10px 12px 12px}.challenge__goal{font-size:13.5px;color:var(--ink-2);margin:6px 0 8px}.challenge__progress{font-family:var(--mono);font-size:12.5px;background:var(--panel-3);border-radius:var(--radius-sm);padding:6px 9px;color:var(--ink-2)}.challenge__status{margin-top:8px;font-size:13px;font-weight:700;border-radius:var(--radius-sm);padding:7px 9px}.challenge__status--done{background:#e7f7ee;color:#0d6b3c;border:1px solid #a8dcc0}.challenge__status--failed{background:#fdecea;color:#a03026;border:1px solid #f0b4ad}.challenge__hints{margin:8px 0 0;padding-left:18px;font-size:13px;color:var(--ink-2)}.challenge__hints li{margin-bottom:3px}.list{list-style:none;margin:0;padding:6px;display:flex;flex-direction:column;gap:4px}.list__item{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--panel-2)}.list__item-main{flex:1 1 auto;min-width:0}.list__item-name{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list__item-meta{font-size:12px;color:var(--ink-3)}.list__empty{padding:14px;color:var(--ink-3);font-size:13.5px;text-align:center}.drawer-backdrop{position:fixed;inset:0;background:#10182852;z-index:40}.drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,94vw);background:var(--panel);box-shadow:var(--shadow-lg);z-index:41;display:flex;flex-direction:column;border-left:1px solid var(--line)}.drawer__header{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--panel-2)}.drawer__title{margin:0;font-size:16px;font-weight:700;flex:1 1 auto}.drawer__body{flex:1 1 auto;overflow:auto}.toasts{position:fixed;left:50%;bottom:calc(var(--footer-h) + 14px);transform:translate(-50%);z-index:60;display:flex;flex-direction:column;gap:8px;width:min(560px,92vw);pointer-events:none}.toast{display:flex;align-items:flex-start;gap:10px;background:#1b2536;color:#eaf0fa;border-radius:var(--radius);padding:10px 12px;box-shadow:var(--shadow-lg);font-size:14px;pointer-events:auto}.toast--error{background:#7f2019}.toast--success{background:#0f6b3f}.toast__text{flex:1 1 auto}.toast__close{background:none;border:none;color:inherit;cursor:pointer;opacity:.75;padding:0 2px;font-size:18px;line-height:1}.toast__close:hover{opacity:1}.hint-text{font-size:12px;color:var(--ink-3);padding:0 12px 10px;text-align:center}.tools{display:flex;flex-wrap:wrap;gap:5px;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--panel-2)}.mobile-tabs{display:none}@media(max-width:1180px){.rail{width:232px;flex-basis:232px}}@media(max-width:980px){:root{--footer-h: 104px}.header{flex-wrap:wrap;padding:8px 12px;gap:8px 10px}.text-input{min-width:120px}.header__spacer,.runbar__spacer{display:none}.runbar{gap:8px}.app__main{flex-direction:column;gap:10px}.mobile-tabs{display:flex;gap:4px;padding:6px 12px 0}.split{flex-direction:column;flex:1 1 auto;min-height:0}.split__divider{display:none}.split__pane{flex:1 1 auto!important;width:auto!important;min-height:0}.split__pane--hidden{display:none}.rail{width:auto;height:212px;flex:0 0 212px;flex-direction:row;overflow-x:auto;overflow-y:hidden;padding-right:0}.rail .panel{min-width:272px;height:100%}}.setup{padding:10px 12px 12px}.setup__row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;margin-bottom:8px}.setup__label{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}.setup__slider{min-width:0;accent-color:var(--accent)}.setup__number{min-width:0;width:68px;padding:5px 6px;min-height:30px}.setup__unit{font-size:12px;color:var(--ink-3);font-weight:600}@media(max-width:1180px){.setup__row{grid-template-columns:auto 1fr auto}.setup__slider{grid-column:1 / -1;grid-row:2}}.device-panel{padding:10px 12px 12px;display:flex;flex-direction:column;gap:8px}.device-panel__choices{display:flex;flex-wrap:wrap;gap:8px}.device-panel__status{padding:10px 12px;font-size:13.5px;color:var(--ink-2)}.device-panel__question{font-size:14px;font-weight:600;margin:0}.device-panel__connected{display:flex;align-items:center;gap:6px;font-size:14px;margin:0;color:var(--ok)}.device-panel__error{font-size:13.5px;font-weight:600;color:var(--stop);margin:0}.device-panel__storage{display:flex;flex-wrap:wrap;gap:8px}.device-panel__progress{height:8px;border-radius:999px;background:var(--panel-3);overflow:hidden;border:1px solid var(--line)}.device-panel__progress>div{height:100%;background:var(--accent);transition:width .12s ease}.device-debug-panel{padding:10px 12px 12px;display:flex;flex-direction:column;gap:8px}.device-debug-panel__stats{display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:2px;margin:0;font-size:12px;font-family:ui-monospace,monospace}.device-debug-panel__stats dt{color:var(--ink-3)}.device-debug-panel__stats dd{margin:0;color:var(--ink);word-break:break-word}.device-debug-panel__buttons{display:flex;flex-wrap:wrap;gap:6px}.stop-banner{margin:0 12px 12px;padding:12px 14px;border-radius:var(--radius);background:#fdecea;border:1px solid #f0b4ad;color:#7f2019;display:flex;flex-direction:column;gap:8px;font-size:13.5px}.stop-banner strong{font-size:14.5px}.stop-banner__actions{display:flex;gap:8px;flex-wrap:wrap}.preflight-list{list-style:none;margin:0;padding:8px 12px 12px;display:flex;flex-direction:column;gap:6px}.preflight-item{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:var(--radius-sm);border:1px solid var(--line);font-size:13px}.preflight-item--blocking{background:#fdecea;border-color:#f0b4ad}.preflight-item--warning{background:#fbf3e3;border-color:#eccf95}.preflight-item--note{background:var(--panel-2)}.preflight-item__badge{flex:0 0 auto;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 6px;border-radius:999px;background:#0000000f}.preflight-item__text{flex:1 1 auto;color:var(--ink-2)}.diagnostics{padding:10px 12px 12px}.diagnostics__actions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.diagnostics__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;max-height:260px;overflow-y:auto}.diagnostics__event{display:flex;flex-wrap:wrap;gap:6px;padding:6px 8px;border-radius:var(--radius-sm);background:var(--panel-2);font-size:12px}.diagnostics__time{font-family:var(--mono);color:var(--ink-3)}.diagnostics__message{color:var(--ink)}.diagnostics__code{font-family:var(--mono);font-size:11px;color:var(--stop);background:#fdecea;border-radius:4px;padding:0 4px}.diagnostics__detail{flex-basis:100%;font-family:var(--mono);font-size:11px;color:var(--ink-3)}