:root{--bg: #0e1116;--panel: #141a23;--panel-2: #1a2230;--border: #222d3d;--border-soft: #1c2532;--text: #e6edf3;--muted: #8b98a9;--muted-dim: #64707f;--accent: #4c9aff;--accent-strong: #2f7ff0;--accent-soft: rgba(76, 154, 255, .14);--good: #3fb950;--warn: #d29922;--danger: #e5484d;--radius: 10px;--radius-sm: 8px;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}[hidden]{display:none!important}.card,.check,.btn,input,select{scroll-margin-top:88px}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased}body{min-height:100dvh;display:flex;flex-direction:column}h1,h2{margin:0;font-weight:600;letter-spacing:-.01em}h2{font-size:.95rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}code{font-family:var(--mono);font-size:.85em;background:var(--panel-2);border:1px solid var(--border-soft);border-radius:5px;padding:.1em .35em;color:#b9cdf0;overflow-wrap:anywhere}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 22px;background:#0e1116e6;border-bottom:1px solid var(--border-soft);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:12px}.brand h1{font-size:1.05rem}.brand p{margin:2px 0 0;font-size:.8rem;color:var(--muted)}.brand-dot{width:26px;height:26px;flex:none;border-radius:8px;background:radial-gradient(circle at 32% 30%,#7fb6ff,var(--accent-strong));box-shadow:0 0 0 1px #4c9aff59,0 4px 14px #2f7ff047}.topbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.project-menu{position:relative}.io-menu{padding:5px 10px;line-height:1;font-size:1rem}.io-pop{position:absolute;z-index:50;top:calc(100% + 8px);right:0;width:min(230px,calc(100vw - 32px));padding:5px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#161c25;box-shadow:0 14px 34px #00000080}.io-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 11px;border:0;border-radius:6px;background:transparent;color:var(--text);font:inherit;font-size:.84rem;text-align:left;cursor:pointer;transition:background .15s,color .15s}.io-item:hover,.io-item:focus-visible{background:var(--accent-soft);color:var(--accent);outline:none}.io-icon{flex:none;width:16px;color:var(--muted-dim);text-align:center}.io-item:hover .io-icon,.io-item:focus-visible .io-icon{color:var(--accent)}.pill{display:inline-flex;align-items:center;gap:7px;padding:4px 11px;border-radius:999px;border:1px solid var(--border);background:var(--panel);font-size:.76rem;color:var(--muted);white-space:nowrap}.pill:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--muted-dim);flex:none}.pill[data-state=loading]{color:var(--warn);border-color:#d2992259}.pill[data-state=loading]:before{background:var(--warn);animation:pulse 1s ease-in-out infinite}.pill[data-state=ready]{color:var(--good);border-color:#3fb95059}.pill[data-state=ready]:before{background:var(--good)}.pill[data-state=error]{color:var(--danger);border-color:#e5484d59}.pill[data-state=error]:before{background:var(--danger)}@keyframes pulse{50%{opacity:.25}}.foot{flex:none;padding:9px 22px;border-top:1px solid var(--border-soft);background:#0e1116eb;font-size:.75rem;color:var(--muted-dim);text-align:center}.foot a{color:var(--muted);text-decoration:none;border-bottom:1px solid transparent;transition:color .15s,border-color .15s}.foot a:hover,.foot a:focus-visible{color:var(--accent);border-bottom-color:var(--accent)}.foot-sep{margin:0 7px;opacity:.45}.foot-host{font-family:var(--mono);color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(272px,.8fr) minmax(360px,1.3fr) minmax(312px,1.05fr);gap:14px;align-items:stretch;width:100%;max-width:1780px;margin:0 auto;padding:14px 18px;flex:1 1 auto;min-height:0}.layout>*{min-height:0;min-width:0}.stage-col{display:flex;flex-direction:column}.col{display:flex;flex-direction:column;gap:14px;min-width:0}.card-wide{grid-column:1 / -1}.layout:has(#sketch-details:not([open])){align-content:start}.card.card-wide{padding:0}.sketch-summary{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;list-style:none}.sketch-summary::-webkit-details-marker{display:none}.sketch-summary h2,.sketch-summary .hint{margin:0}.chev{margin-left:auto;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--muted-dim);transition:transform .15s}.card-wide[open]>.sketch-summary .chev{transform:rotate(180deg)}.card-wide>.arduino-bar,.card-wide>.code{margin-left:16px;margin-right:16px}.card-wide[open]{padding-bottom:16px}@media (min-width: 1100px) and (min-height: 720px){html,body{height:100%;overflow:hidden}.stage-col{overflow-y:auto;overflow-x:hidden;padding-right:3px}.stage-col .card{flex:0 0 auto}.col{overflow-y:auto;overflow-x:hidden;padding-right:3px}.card-wide>.code{max-height:min(40vh,360px)}.col .log{max-height:104px}html:has(#sketch-details[open]),body:has(#sketch-details[open]){height:auto;overflow:visible}}@media (max-width: 1099.98px){.layout{grid-template-columns:minmax(0,1fr)}}.arduino-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.arduino-bar .ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}.arduino-bar .lbl{white-space:normal}.arduino-bar select{min-width:190px}.arduino-bar input[type=number]{width:84px}.arduino-spacer{flex:1 1 auto}.arduino-bar .btn{align-self:center}.card{position:relative;background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:10px;min-width:0}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.head-actions{display:flex;align-items:center;gap:8px}.card:has(.help-pop:not([hidden])){z-index:30}.help{width:20px;height:20px;flex:none;padding:0;border:1px solid var(--border);border-radius:50%;background:transparent;color:var(--muted-dim);font-size:.72rem;font-weight:700;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .15s,border-color .15s,background .15s}.help:hover,.help:focus-visible,.help[aria-expanded=true]{color:var(--accent);border-color:var(--accent);outline:none}.help-pop{position:absolute;z-index:40;top:46px;right:14px;width:min(310px,calc(100% - 28px));margin:0;padding:11px 13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#161c25;box-shadow:0 14px 34px #00000080;font-size:.78rem;line-height:1.55;color:var(--muted)}.help-pop code{font-family:var(--mono);font-size:.74rem;padding:1px 4px;border-radius:3px;background:#0a0d12;color:#c8d4e2}.help-pop strong{color:var(--text);font-weight:600}.hint{margin:-4px 0 0;font-size:.8rem;color:var(--muted)}.hint.tiny{font-size:.74rem;color:var(--muted-dim)}.hint em{font-style:normal;color:var(--text)}.hint a{color:var(--accent)}.hint a:hover{color:var(--accent-strong)}.stage-note{margin:0;font-size:.78rem;color:var(--muted-dim)}.row{display:flex;align-items:center;gap:8px;min-width:0}.grow{flex:1 1 auto;min-width:0}.narrow{flex:0 0 84px}.lbl{font-size:.78rem;color:var(--muted);white-space:nowrap}.lbl.num{flex:0 0 46px;text-align:right;font-family:var(--mono);color:var(--text)}input[type=text],input[type=url],input[type=number],select{flex:1 1 auto;min-width:0;padding:8px 10px;border-radius:var(--radius-sm);border:1px solid var(--border);background:#0f141b;color:var(--text);font:inherit;font-size:.86rem}input[type=text]:focus,input[type=url]:focus,input[type=number]:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}select{cursor:pointer}select:disabled{opacity:.5;cursor:not-allowed}input[type=number]{font-family:var(--mono)}input[type=range]{flex:1 1 auto;accent-color:var(--accent);min-width:0}.btn{padding:8px 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--panel-2);color:var(--text);font:inherit;font-size:.85rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,transform .05s}.btn:hover:not(:disabled){background:var(--surface-hover, #24303f);border-color:#2d3b4d}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent-strong);border-color:var(--accent-strong);color:#fff}.btn-primary:hover:not(:disabled){background:#3a8cf5;border-color:#3a8cf5}.btn-ghost{background:transparent}.btn-sm{padding:5px 10px;font-size:.78rem}.btn-lg{padding:11px 16px;font-size:.92rem}.check{display:flex;align-items:center;gap:9px;font-size:.83rem;color:var(--muted);cursor:pointer}.check input{accent-color:var(--accent);width:15px;height:15px;flex:none}.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;background:#0f141b;border:1px solid var(--border);border-radius:var(--radius-sm)}.seg-item input{position:absolute;opacity:0;pointer-events:none}.seg-item span{display:block;padding:7px 6px;border-radius:6px;text-align:center;font-size:.82rem;color:var(--muted);cursor:pointer;transition:background .15s,color .15s}.seg-item input:checked+span{background:var(--accent-strong);color:#fff;font-weight:500}.seg-item input:focus-visible+span{box-shadow:0 0 0 2px var(--accent)}.stage-card{padding:16px}.preview{width:100%;max-width:260px;margin:0 auto;flex:0 0 auto;background:#0a0d12;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.stage{position:relative;width:100%;aspect-ratio:1;overflow:hidden;background:#0a0d12}.stage canvas{display:block;width:100%;height:100%}.stage-empty{position:absolute;inset:0;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#0a0d12,#0a0d12 10px,#0d1117 10px 20px);text-align:center;padding:20px}.stage-empty-inner{display:flex;flex-direction:column;gap:4px}.stage-empty strong{font-size:.95rem}.stage-empty span{font-size:.8rem;color:var(--muted)}.hud{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:8px 10px;border-top:1px solid var(--border)}.hud-label{font-size:1.05rem;font-weight:600;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hud-prob{font-family:var(--mono);font-size:.85rem;color:var(--accent);flex:none}.table-wrap{overflow-x:auto;margin:0 -4px;padding:0 4px}.class-table{width:100%;table-layout:fixed;border-collapse:collapse;font-size:.82rem}.class-table th{text-align:left;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-dim);padding:0 8px 7px;border-bottom:1px solid var(--border-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.class-table td{padding:6px 8px;border-bottom:1px solid rgba(28,37,50,.6);vertical-align:middle}.class-table tr:last-child td{border-bottom:none}.col-idx{width:26px;color:var(--muted-dim);font-family:var(--mono);font-size:.75rem}.col-model{width:21%;color:var(--muted-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.col-name{width:auto}.col-blink{width:70px}.col-bar{width:104px}.name-input,.blink-input{width:100%;box-sizing:border-box;padding:5px 8px;font-size:.82rem}.blink-input{text-align:center}.bar{position:relative;height:6px;border-radius:3px;background:#0f141b;border:1px solid var(--border-soft);overflow:hidden;margin-bottom:3px}.bar-fill{height:100%;width:0;border-radius:3px;background:linear-gradient(90deg,var(--accent-strong),#6fb0ff);transition:width .12s linear}.bar-text{font-family:var(--mono);font-size:.7rem;color:var(--muted-dim)}.empty-row td{padding:16px 8px;color:var(--muted-dim);text-align:center}.msg{margin:0;padding:8px 11px;border-radius:var(--radius-sm);font-size:.8rem;background:#4c9aff14;border:1px solid rgba(76,154,255,.22);color:#a9c8f7;overflow-wrap:anywhere}.msg.warn{background:#d2992214;border-color:#d2992247;color:#e0bd72}.modal{--modal-accent: var(--warn);width:min(430px,calc(100vw - 32px));max-height:min(72dvh,520px);overflow-y:auto;padding:0;border:1px solid var(--border);border-top:3px solid var(--modal-accent);border-radius:var(--radius);background:var(--panel);color:var(--text);box-shadow:0 26px 64px #0000009e}.modal[data-kind=error]{--modal-accent: var(--danger)}.modal::backdrop{background:#05080ca8;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.modal-body{display:flex;align-items:flex-start;gap:12px;padding:18px 18px 14px}.modal-badge{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--modal-accent);background:#d2992224;color:var(--modal-accent);font-size:.9rem;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center}.modal[data-kind=error] .modal-badge{background:#e5484d24}.modal h3{margin:2px 0 0;font-size:.95rem;font-weight:600}.modal p{margin:6px 0 0;font-size:.83rem;line-height:1.55;color:var(--muted);overflow-wrap:anywhere}.modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:0 18px 16px}.modal-actions .btn{min-width:84px}.gate-hint,#gate-hint{font-size:.76rem;color:var(--muted);margin:0}#gate-hint.is-idle{color:var(--muted-dim)}.log-head{display:flex;justify-content:space-between;gap:10px;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-dim);padding-top:4px;border-top:1px solid var(--border-soft)}#tx-count{text-transform:none;letter-spacing:0;font-family:var(--mono)}.log{max-height:168px;overflow-y:auto;border-radius:var(--radius-sm);background:#0a0d12;border:1px solid var(--border-soft);padding:6px 8px;font-family:var(--mono);font-size:.74rem}.log-empty{margin:4px 0;color:var(--muted-dim);font-family:inherit}.log-row{display:flex;gap:10px;padding:2px 0;border-bottom:1px solid rgba(28,37,50,.4)}.log-row:last-child{border-bottom:none}.log-time{color:var(--muted-dim);flex:none}.log-text{color:#9ec9a4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.code{margin:0;max-height:520px;overflow:auto;padding:14px 16px;border-radius:var(--radius-sm);background:#0a0d12;border:1px solid var(--border-soft);font-family:var(--mono);font-size:.78rem;line-height:1.6;color:#c8d4e2;white-space:pre;tab-size:2}.code code{background:none;border:none;padding:0;font-size:inherit;color:inherit;overflow-wrap:normal}*{scrollbar-width:thin;scrollbar-color:#2a3648 transparent}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:#2a3648;border-radius:5px}::-webkit-scrollbar-track{background:transparent}@media (max-width: 560px){.layout{padding:14px 12px 48px}.preview{max-width:100%}.col-bar,.col-model{display:none}}