:root{--ui-bg:#c4a47a;--ui-fg:#073642;--ui-muted:#657b83;--ui-border:#07364224;--ui-hover:#07364212;--ui-active:#073642;--ui-active-fg:#fdf6e3;--ui-shadow:0 10px 30px #0736422e;--ui-accent:#268bd2;--canvas-bg:#fdf6e3;color:var(--ui-fg);-webkit-font-smoothing:antialiased;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;font-size:13px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{background:var(--canvas-bg);overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}.stage{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.aura,.aura-cover{pointer-events:none;z-index:11;width:100%;height:100%;position:fixed;inset:0}button{font:inherit;color:inherit}.dock{--ui-inset:16px;left:var(--ui-inset);right:var(--ui-inset);bottom:var(--ui-inset);pointer-events:none;z-index:12;flex-direction:column;align-items:stretch;gap:8px;display:flex;position:fixed}.dock>*{pointer-events:auto}.dock>.toast,.dock>.panel,.dock>.props{align-self:center;max-width:100%}.surface,.toolbar,.props,.panel,.toast,.ctx{background:var(--ui-bg);border:1px solid var(--ui-border);box-shadow:var(--ui-shadow);-webkit-backdrop-filter:blur(14px)}.toolbar{scrollbar-width:none;border-radius:16px;align-items:center;gap:2px;max-width:100%;padding:6px;display:flex;overflow-x:auto}.toolbar.thin{overflow:visible}.toolbar.inline{overflow:hidden}.tb-slot{flex:none;align-items:center;display:flex;position:relative}.tb-slot-icon{transition:width .28s,opacity .2s,margin .28s}.tb-slot.open .tb-slot-icon{opacity:0;pointer-events:none;width:0;min-width:0;margin:0;overflow:hidden}.tb-reveal{max-width:0;transition:max-width .28s;display:flex;overflow:hidden}.tb-slot.open .tb-reveal{max-width:var(--slot-w)}.tb-reveal-inner{transform:translateX(calc(var(--slide) * -18px));gap:2px;transition:transform .28s;display:flex}.tb-slot.open .tb-reveal-inner{transform:translate(0)}.tb-body-probe{visibility:hidden;pointer-events:none;gap:2px;display:flex;position:absolute}.tb-group{align-items:center;gap:2px;display:flex}.tb-seg{align-items:center;display:flex;position:relative}.tb-pop{z-index:6;border-radius:16px;align-items:center;gap:2px;padding:6px;display:flex;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tb-seg:first-child .tb-pop{left:0;transform:none}.tb-seg:last-child .tb-pop{left:auto;right:0;transform:none}.tb-measure{visibility:hidden;pointer-events:none;position:absolute;bottom:0;left:0}.tb-sep{background:var(--ui-border);flex:none;width:2px;height:26px;margin:0 5px}.inline-label{z-index:13;box-shadow:none;box-sizing:border-box;resize:none;white-space:pre-wrap;overflow-wrap:break-word;background:0 0;border:none;border-radius:0;outline:none;margin:0;padding:0;font-family:inherit;font-weight:700;display:block;position:fixed;overflow:hidden}.tb-btn{cursor:pointer;background:0 0;border:none;border-radius:10px;flex:none;place-items:center;width:40px;height:40px;padding:0;transition:background .12s,color .12s;display:grid}.tb-btn.place{cursor:grab;touch-action:none;width:46px}.tb-btn:hover:not(:disabled){background:var(--ui-hover)}.tb-btn.active{background:var(--ui-active);color:var(--ui-active-fg)}.tb-btn:disabled{opacity:.35;cursor:default}.icon{width:20px;height:20px}.icon-shape{width:34px;height:24px;overflow:visible}canvas.icon-shape{display:block}.props{border-radius:14px;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 10px;max-width:100%;padding:6px 8px 6px 14px;display:flex}.props-row{display:contents}.props.props-near{z-index:12;flex-direction:column;align-items:stretch;gap:6px;width:max-content;max-width:calc(100vw - 16px);padding:6px 10px;position:fixed}.props.props-near .props-row{justify-content:center;align-items:center;gap:6px 10px;display:flex}.props.props-near .props-row>.props-group:first-child{border-left:none;padding-left:0}.props.props-near .props-group:has(.color-field.grow){flex:1}.props.props-near .color-field.grow{flex:auto}.props.props-near .color-field.grow .swatch{flex:auto;width:auto;min-width:20px}.props-title{letter-spacing:.01em;font-weight:700}.props-group{border-left:1px solid var(--ui-border);align-items:center;gap:6px;padding-left:10px;display:flex}.props-label{color:var(--ui-muted)}.stepper{border:2px solid var(--ui-border);border-radius:8px;align-items:center;display:flex;overflow:hidden}.stepper button{cursor:pointer;background:0 0;border:none;width:26px;height:28px;font-size:16px;line-height:1}.stepper button:hover:not(:disabled){background:var(--ui-hover)}.stepper button:disabled{opacity:.3}.stepper input{border:none;border-left:2px solid var(--ui-border);border-right:2px solid var(--ui-border);width:44px;height:28px;color:inherit;text-align:center;font:inherit;appearance:textfield;background:0 0}.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-input{border:2px solid var(--ui-border);width:68px;height:28px;color:inherit;font:inherit;background:0 0;border-radius:7px;padding:0 6px}.chip{border:2px solid var(--ui-border);cursor:pointer;background:0 0;border-radius:8px;align-items:center;gap:4px;height:30px;padding:0 10px;font-weight:600;display:inline-flex}.chip:hover{background:var(--ui-hover)}.chip.active{background:var(--ui-active);color:var(--ui-active-fg);border-color:#0000}.chip.danger:hover{color:#fff;background:#e5484d;border-color:#0000}.chip .icon{width:17px;height:17px}.chip.key-bind{font-variant-numeric:tabular-nums;justify-content:center;min-width:4.5em}.warn{color:#b45309;background:#f59e0b29;border-radius:6px;padding:2px 6px;font-size:11px;font-weight:700}.color-field{border:2px solid var(--ui-border);cursor:pointer;border-radius:8px;align-items:center;gap:6px;height:30px;padding:0 8px 0 4px;display:inline-flex;position:relative}.color-field:hover{background:var(--ui-hover)}.color-field input{opacity:0;cursor:pointer;border:none;width:100%;height:100%;padding:0;position:absolute;inset:0}.swatch{border-radius:6px;width:20px;height:20px;box-shadow:inset 0 0 0 1px #80808073}.name-input,.field input{border:2px solid var(--ui-border);width:160px;min-width:0;height:30px;color:inherit;font:inherit;background:0 0;border-radius:8px;padding:0 10px;font-weight:600}.name-input:focus,.field input:focus,.stepper:focus-within{outline:2px solid var(--ui-accent);outline-offset:-1px}.panel{border-radius:16px;flex-direction:column;gap:10px;width:min(460px,100vw - 16px);max-height:calc(100vh - 180px);padding:14px 16px 16px;display:flex;overflow-y:auto}.panel-title{font-size:15px;font-weight:700}.panel-sub{margin-top:4px;font-weight:700}.panel-actions{flex-wrap:wrap;gap:8px;display:flex}.panel-actions.column{flex-direction:column}.panel-actions button,.seg button{border:2px solid var(--ui-border);cursor:pointer;background:0 0;border-radius:10px;justify-content:center;align-items:center;gap:6px;height:36px;padding:0 14px;font-weight:600;display:inline-flex}.panel-actions button:hover,.seg button:hover:not(:disabled){background:var(--ui-hover)}.panel-actions button.primary,.seg button.active{background:var(--ui-active);color:var(--ui-active-fg);border-color:#0000}.panel-actions .icon{width:16px;height:16px}.seg{gap:6px;display:flex}.seg button{flex:1}.seg button:disabled{opacity:.4;cursor:default}.field{align-items:center;gap:10px;display:flex}.field span{color:var(--ui-muted)}.field input{flex:1}.hint{color:var(--ui-muted);margin:0;line-height:1.45}.themes{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;display:grid}.theme-card{cursor:pointer;background:0 0;border:2px solid #0000;border-radius:12px;flex-direction:column;gap:6px;padding:4px 4px 6px;font-weight:600;display:flex}.theme-card svg{aspect-ratio:110/48;width:100%;box-shadow:inset 0 0 0 1px var(--ui-border);border-radius:8px}.theme-card:hover{background:var(--ui-hover)}.theme-card.active{border-color:var(--ui-accent)}.wire-style{flex-direction:column;gap:6px;font-weight:600;display:flex}.part-counts{font-variant-numeric:tabular-nums;grid-template-columns:1fr auto;gap:3px 16px;display:grid}.part-counts>div{display:contents}.part-counts b{text-align:right}.part-total{font-weight:700}.part-total span,.part-total b{border-top:1px solid var(--ui-border);margin-top:2px;padding-top:4px}.placed-empty{opacity:.7;margin:0}.live-code{resize:vertical;border:2px solid var(--ui-border);background:var(--ui-bg);width:100%;min-height:72px;color:inherit;border-radius:8px;padding:8px;font:12px/1.4 ui-monospace,monospace}.live-peer{border-top:1px solid var(--ui-border);flex-direction:column;gap:6px;padding-top:8px;display:flex}.live-status{margin:0;font-weight:600}.live-status.failed{color:#b45309}.keys{flex-direction:column;gap:5px;margin:0;padding-left:18px;line-height:1.4;display:flex}kbd{border:1px solid var(--ui-border);text-align:center;border-bottom-width:2px;border-radius:4px;min-width:18px;padding:0 4px;font:600 11px/16px inherit;display:inline-block}.toast{text-align:center;border-radius:10px;max-width:min(520px,100vw - 16px);padding:8px 14px;font-weight:600;animation:.18s ease-out toast-in}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}}.toast{align-items:center;gap:10px;display:flex}.toast.building{z-index:13;max-width:320px;box-shadow:none;-webkit-backdrop-filter:none;pointer-events:none;text-shadow:0 1px 2px #00000073,0 0 14px #00000059;background:0 0;border:none;padding:0 8px;font-size:22px;font-weight:700;animation:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.icon-chip{padding:0 7px}.open-panel{--open-gap:10px;width:min(560px,100vw - 16px)}.open-big{gap:var(--open-gap);grid-template-columns:1fr 1fr;display:grid}.open-big,.open-wide{width:100%}.open-big button,.open-wide{border:2px solid var(--ui-border);cursor:pointer;background:0 0;border-radius:14px}.open-big button{aspect-ratio:1;flex-direction:column;justify-content:center;align-items:center;gap:6px;font-size:14px;display:flex}.open-big button .icon{width:30px;height:30px;margin-bottom:4px}.open-big button span{color:var(--ui-muted);font-size:12px}.open-big button:hover,.open-wide:hover{background:var(--ui-hover)}.example-card:hover,.example-card:focus-visible{filter:brightness(1.03);box-shadow:0 4px 14px #00000014}.open-wide{padding:0;font-weight:600;display:grid}.open-wide:before{content:"";padding-bottom:calc((100% + 4px - var(--open-gap)) / 4 - 4px);grid-area:1/1}.open-wide>span{grid-area:1/1;justify-content:center;align-items:center;gap:8px;display:flex}.open-wide .icon{width:17px;height:17px}.examples{flex-direction:column;gap:12px;display:flex}.examples-section{--group-hue:220}.examples-group{color:hsl(var(--group-hue), 42%, 38%);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:11px;font-weight:700}.examples-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;display:grid}.example-card{border:1px solid var(--ex-border,var(--ui-border));background:var(--ex-bg,transparent);color:var(--ex-fg,var(--ui-fg));cursor:pointer;text-align:center;border-radius:12px;flex-direction:column;gap:6px;padding:6px 6px 8px;font-weight:600;transition:border-color .15s,box-shadow .15s;display:flex}.example-card-hero{background:var(--ex-bg);box-shadow:inset 0 0 0 1px hsl(var(--group-hue), 50%, 28%)}.example-card-art{aspect-ratio:4/3;background:var(--ex-bg,var(--canvas-bg));border-radius:8px;width:100%;position:relative;overflow:hidden}.example-card-hero .example-card-art{background:#0a0a0c;box-shadow:inset 0 0 0 1px #ffffff24}.example-card-art img{object-fit:contain;will-change:transform;width:100%;height:100%;transition:transform .28s cubic-bezier(.33,1,.68,1);position:absolute;inset:0}.example-icon{z-index:2;box-sizing:border-box;padding:14%;transform:translateY(0)}.example-card-art .example-preview{z-index:1;transform:translateY(100%)}.example-card:hover .example-icon,.example-card:focus-visible .example-icon{transform:translateY(-100%)}.example-card:hover .example-preview,.example-card:focus-visible .example-preview{transform:translateY(0)}.example-name{font-size:12px;line-height:1.2}.example-pieces{opacity:.72;font-size:11px;font-weight:600;line-height:1.2}.tb-row{align-items:end;gap:var(--ui-inset);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);width:100%;display:grid;position:relative}.tb-row>.toolbar{justify-self:center;min-width:0}.tb-row.compact{grid-template-columns:minmax(0,1fr);justify-items:center}.io-measure{visibility:hidden;pointer-events:none;display:flex;position:absolute}.io-wrap{min-width:0;display:flex;position:relative}.io-wrap.inputs{justify-content:flex-end;justify-self:end}.io-wrap.outputs{justify-content:flex-start;justify-self:start}.io-wrap.open{justify-self:stretch;height:0;overflow:visible}.io-wrap.open .io-list{width:auto;position:absolute;bottom:0;left:0;right:0}.io-toggle{border:1px solid var(--ui-border);background:var(--ui-bg);height:54px;box-shadow:var(--ui-shadow);-webkit-backdrop-filter:blur(14px);cursor:pointer;border-radius:16px;flex:none;align-items:center;gap:6px;padding:0 10px 0 12px;font-weight:700;display:flex}.io-toggle:hover{background:var(--ui-hover)}.io-chevron{transition:transform .15s;display:grid}.io-chevron .icon{width:14px;height:14px}.io-list{width:100%;max-height:calc(100vh - 2 * var(--ui-inset));background:var(--ui-bg);border:1px solid var(--ui-border);box-shadow:var(--ui-shadow);-webkit-backdrop-filter:blur(14px);box-sizing:border-box;border-radius:16px;flex-direction:column;gap:8px;padding:12px;display:flex;overflow-y:auto}.io-list-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.io-minimise{cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;width:30px;height:30px;display:grid;transform:rotate(180deg)}.io-minimise:hover{background:var(--ui-hover)}.io-list ul{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.io-list li{border-radius:8px;align-items:center;gap:8px;padding:3px 4px;display:flex}.io-list li.selected{background:var(--ui-hover)}.io-list li input{min-width:0;height:28px;color:inherit;font:inherit;background:0 0;border:2px solid #0000;border-radius:6px;flex:1;padding:0 8px;font-weight:600}.io-list li input:hover{border-color:var(--ui-border)}.io-list li input:focus{outline:2px solid var(--ui-accent);outline-offset:-1px}.io-switch,.io-button,.io-lamp{border:2px solid var(--ui-border);background:var(--ui-hover);flex:none}.io-switch{cursor:pointer;border-radius:10px;width:34px;height:20px;padding:0;position:relative}.io-switch span{background:var(--ui-fg);border-radius:50%;width:14px;height:14px;transition:left .12s;position:absolute;top:2px;left:2px}.io-switch.on span{background:#fff;left:16px}.io-button{cursor:pointer;touch-action:none;border-radius:7px;width:34px;height:22px}.io-lamp{border-radius:50%;width:18px;height:18px;margin:0 8px}.io-locate{cursor:pointer;width:28px;height:28px;color:var(--ui-muted);background:0 0;border:none;border-radius:6px;flex:none;place-items:center;display:grid}.io-locate:hover{background:var(--ui-hover);color:var(--ui-fg)}.io-locate .icon{width:16px;height:16px}@media (width<=900px){.dock{--ui-inset:8px}.io-toggle{height:50px;padding:0 8px}.io-toggle>span:not(.io-chevron){display:none}}.ctx{z-index:20;border-radius:12px;flex-direction:column;min-width:170px;padding:6px;display:flex;position:fixed}.ctx-title{color:var(--ui-muted);text-transform:uppercase;letter-spacing:.05em;padding:4px 8px 6px;font-size:11px;font-weight:700}.ctx button{cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;height:34px;padding:0 8px;font-weight:600;display:flex}.ctx button:hover{background:var(--ui-hover)}.ctx .icon-shape{width:30px;height:20px}@media (width<=720px){.dock{--ui-inset:8px}.tb-btn{width:36px;height:36px}.tb-btn.place{width:40px}}
