@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600;700&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#eef1ef;font-synthesis:none;--accent:#baff63;--accent-soft:#baff631f;--panel:#101316;--panel-raised:#15191c;--border:#ffffff14;--border-strong:#ffffff21;--muted:#747b79;--soft:#aab0ae;background:#090b0d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-width:1040px;height:100%;margin:0;overflow:hidden}button,input,select,textarea{color:inherit;font:inherit}button{cursor:pointer;border:0}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:1px solid var(--accent);outline-offset:1px}.studio-shell{background:#0a0c0e;grid-template-rows:56px minmax(0,1fr);grid-template-columns:224px minmax(560px,1fr) 326px;width:100vw;height:100vh;display:grid}.app-header{z-index:20;border-bottom:1px solid var(--border);background:#0c0e10f5;grid-column:1/-1;grid-template-columns:224px 1fr auto;align-items:center;min-width:0;display:grid;position:relative}.brand{border-right:1px solid var(--border);align-items:center;gap:11px;height:100%;padding:0 16px;display:flex}.brand>i{color:#0b0d0c;background:var(--accent);border-radius:7px;place-items:center;width:25px;height:25px;font-size:13px;font-style:normal;font-weight:800;display:grid;box-shadow:0 0 18px #baff6326}.brand>span{letter-spacing:.13em;font-size:11px;font-weight:700}.brand em{color:var(--accent);font-style:normal}.project-crumbs{align-items:center;gap:9px;min-width:0;padding:0 18px;font-size:11px;display:flex}.project-crumbs span{color:var(--muted)}.project-crumbs b{color:#424744;font-weight:400}.project-crumbs strong{text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.saved-indicator{background:var(--accent);border-radius:50%;width:5px;height:5px;margin-left:2px}.header-actions{align-items:center;gap:7px;padding-right:12px;display:flex}.header-actions button{border-radius:7px;height:32px;font-size:11px;font-weight:600}.icon-button{width:34px;color:var(--soft);background:#171a1d;border:1px solid var(--border)!important}.share-button{color:#d5d9d6;background:#171a1d;padding:0 12px;border:1px solid var(--border)!important}.run-button{color:#0b0e0c;background:var(--accent);min-width:112px;padding:0 14px}.avatar{color:#c7d2c8;background:#263229;width:31px;margin-left:3px;border-radius:50%!important;font-size:9px!important}.scene-panel,.inspector{background:var(--panel);min-height:0}.scene-panel{border-right:1px solid var(--border);padding-bottom:76px;position:relative;overflow:auto}.sidebar-tabs{border-bottom:1px solid var(--border);grid-template-columns:1fr 1fr;height:42px;display:grid}.sidebar-tabs button{color:var(--muted);background:0 0;font-size:11px;position:relative}.sidebar-tabs button.active{color:#eef2ef}.sidebar-tabs button.active:after{content:"";background:var(--accent);height:1px;position:absolute;bottom:0;left:18px;right:18px}.scene-tools{color:#5d6562;letter-spacing:.12em;justify-content:space-between;align-items:center;height:39px;padding:0 12px 0 15px;font-size:9px;font-weight:700;display:flex}.scene-tools button{color:#79807d;background:0 0;width:24px;height:24px;font-size:15px}.scene-tree{padding:0 6px 8px}.tree-row{color:#9ca39f;text-align:left;background:0 0;border-radius:5px;align-items:center;width:100%;height:29px;padding-right:8px;font-size:10.5px;display:flex}.tree-row:hover{color:#dfe4e0;background:#ffffff09}.tree-row.active{color:#eff4ef;background:#baff6317}.tree-row .disclosure{color:#58605d;flex:0 0 12px;font-size:13px}.tree-row>i{color:#68716d;text-align:center;width:20px;font-style:normal}.tree-row.active>i{color:var(--accent)}.tree-row>span:last-of-type{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.tree-row>b{color:#68706d;letter-spacing:1px;margin-left:auto;font-size:8px}.sidebar-section{border-top:1px solid var(--border)}.atom-library section{border-bottom:1px solid var(--border);padding-bottom:6px}.atom-library .scene-tools b{color:#4f5753;font-size:8px;font-weight:500}.atom-row{color:#9da59f;text-align:left;background:#141719;border:1px solid #ffffff0e;border-radius:6px;align-items:center;gap:9px;width:calc(100% - 12px);min-height:39px;margin:0 6px 4px;padding:0 8px;display:flex}.atom-row:hover{background:#baff6309;border-color:#baff632e}.atom-row>i{width:20px;height:20px;color:var(--accent);background:#baff6312;border-radius:4px;place-items:center;font-size:9px;font-style:normal;display:grid}.atom-row>span{min-width:0}.atom-row b,.atom-row small{display:block}.atom-row b{font-size:9px;font-weight:500}.atom-row small{color:#525a56;text-overflow:ellipsis;margin-top:3px;font-family:DM Mono,monospace;font-size:6.5px;overflow:hidden}.atom-row em{color:#626a65;margin-left:auto;font-style:normal}.connection-card{z-index:3;border:1px solid var(--border);background:#15191b;border-radius:8px;align-items:center;gap:9px;width:204px;height:52px;padding:0 10px;display:flex;position:fixed;bottom:10px;left:10px;box-shadow:0 8px 24px #0000003d}.live-dot{background:var(--accent);border-radius:50%;flex:none;width:6px;height:6px;box-shadow:0 0 8px #baff6380}.connection-card div{min-width:0}.connection-card b,.connection-card small{display:block}.connection-card b{font-size:10px;font-weight:500}.connection-card small{color:var(--muted);margin-top:4px;font-size:8.5px}.connection-card button{color:#6b726f;background:0 0;margin-left:auto;font-size:9px}.workspace{background:#090b0d;grid-template-rows:42px minmax(0,1fr) 92px;min-width:0;min-height:0;display:grid;overflow:hidden}.workspace-toolbar{border-bottom:1px solid var(--border);background:#111416;grid-template-columns:1fr auto 1fr;align-items:center;display:grid}.view-tabs{align-self:stretch;padding-left:10px;display:flex}.view-tabs button{color:#6e7572;background:0 0;padding:0 11px;font-size:10px;position:relative}.view-tabs button.active{color:#e8ede9}.view-tabs button.active:after{content:"";background:var(--accent);height:1px;position:absolute;bottom:0;left:10px;right:10px}.device-selector{border:1px solid var(--border);background:#171a1d;border-radius:6px;align-items:center;gap:10px;height:27px;padding:0 6px 0 10px;font-size:9px;display:flex}.device-selector span{color:#c8ceca}.device-selector b{color:#646b68;font-weight:400}.device-selector button{color:#656b68;background:0 0}.zoom-controls{border:1px solid var(--border);border-radius:6px;justify-self:end;align-items:center;margin-right:10px;display:flex;overflow:hidden}.zoom-controls button,.zoom-controls span{color:#858c89;background:#16191c;place-items:center;width:27px;height:25px;font-size:10px;display:grid}.zoom-controls span{color:#6f7673;border-right:1px solid var(--border);border-left:1px solid var(--border);width:36px;font-size:8px}.canvas-stage{background:radial-gradient(at 50% 46%,#171c1e 0,#0d1012 52%,#090b0d 78%);place-items:center;min-width:0;min-height:0;display:grid;position:relative;overflow:hidden}.canvas-grid{opacity:.34;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:20px 20px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#000,#0000 75%);mask-image:radial-gradient(circle,#000,#0000 75%)}.cockpit-label{flex-direction:column;gap:4px;display:flex;position:absolute;top:19px;left:21px}.cockpit-label span{color:var(--accent);letter-spacing:.16em;font-size:8px;font-weight:700}.cockpit-label b{color:#666e6a;letter-spacing:.09em;font-size:8px;font-weight:500}.cockpit-shell{background:linear-gradient(145deg,#24292b,#07090a 35%,#171a1c 75%,#050606);border:1px solid #ffffff1a;border-radius:31px;width:min(91%,1120px);padding:10px;position:relative;box-shadow:0 42px 90px #0000008c,inset 0 1px 1px #ffffff2e,inset 0 -2px 4px #000000bf}.cockpit-shell:before{content:"";z-index:-1;filter:blur(27px);background:#00000085;border-radius:50%;position:absolute;inset:38% -6% -20%}.screen-bezel{aspect-ratio:2;background:#060809;border:1px solid #ffffff1f;border-radius:22px;width:100%;position:relative;overflow:hidden;box-shadow:inset 0 0 34px #000c}.scene-viewport{position:absolute;inset:0;overflow:hidden}.scene-viewport canvas{width:100%;height:100%;display:block}.scene-viewport.renderer-fallback{background:radial-gradient(at 50% 32%,#345b4547,#0000 28%),linear-gradient(#070a0b 28%,#101615 100%)}.fallback-road{clip-path:polygon(43% 0,57% 0,100% 100%,0 100%);background:linear-gradient(90deg,#baff631f 0 1px,#0000 1px calc(50% - 1px),#ffffff12 50% calc(50% + 1px),#0000 calc(50% + 1px) calc(100% - 1px),#baff631f calc(100% - 1px));width:62%;position:absolute;top:44%;bottom:-36%;left:50%;transform:translate(-50%)}.fallback-road i{background:linear-gradient(#baff631a,#baff63b3);width:1px;position:absolute;top:0;bottom:0}.fallback-road i:first-child{left:30%;transform:rotate(-5deg)}.fallback-road i:last-child{right:30%;transform:rotate(5deg)}.hmi-frame{z-index:2;background:0 0;border:0;width:100%;height:100%;display:block;position:absolute;inset:0}.screen-glint{z-index:3;pointer-events:none;border-radius:inherit;background:linear-gradient(118deg,#ffffff06,#0000 27% 74%,#ffffff05);position:absolute;inset:0;box-shadow:inset 0 1px #ffffff1c,inset 0 0 80px #080c0d42}.canvas-status{color:#535a57;justify-content:space-between;font-family:DM Mono,monospace;font-size:8px;display:flex;position:absolute;bottom:13px;left:18px;right:17px}.canvas-status span{align-items:center;gap:6px;display:flex}.canvas-status i{background:#66706a;border-radius:50%;width:5px;height:5px}.canvas-status i.pulse{background:var(--accent);animation:1s infinite pulse}.event-toast{z-index:6;color:#d9dfda;text-align:left;background:#181314f0;border:1px solid #ff756d42;border-radius:9px;align-items:center;gap:10px;min-width:240px;min-height:50px;padding:9px 12px;display:flex;position:absolute;top:18px;right:18px;box-shadow:0 16px 40px #00000059}.event-toast>i{color:#ff8a82;background:#ff756d1a;border-radius:7px;place-items:center;width:24px;height:24px;font-style:normal;font-weight:700;display:grid}.event-toast b,.event-toast small{display:block}.event-toast b{font-size:9px;font-weight:500}.event-toast small{color:#817778;margin-top:4px;font-size:7px}@keyframes pulse{50%{opacity:.35;box-shadow:0 0 0 4px #baff631a}}.timeline{border-top:1px solid var(--border);background:#111416;grid-template-columns:250px minmax(200px,1fr) 80px;align-items:center;min-width:0;display:grid}.timeline-controls{align-items:center;gap:7px;padding-left:12px;display:flex}.play-button,.skip-button{border-radius:6px;place-items:center;width:28px;height:28px;display:grid}.play-button{color:#111411;background:var(--accent);font-size:10px}.skip-button{color:#89908d;border:1px solid var(--border);background:#1a1e20}.timeline-controls select{border:1px solid var(--border);color:#b8bfbb;background:#171a1d;border-radius:6px;width:158px;height:28px;padding:0 24px 0 9px;font-size:9px}.timeline-track-wrap{height:48px;padding-top:17px;position:relative}.timeline-ruler{color:#4e5552;font-family:DM Mono,monospace;font-size:7px;position:absolute;top:2px;left:0;right:0}.timeline-ruler span{position:absolute;transform:translate(-50%)}.timeline-track{background:#292d2f;border-radius:4px;height:8px;position:relative}.timeline-progress{border-radius:inherit;background:#baff6338;height:100%}.timeline-track input{z-index:3;opacity:0;cursor:ew-resize;width:100%;height:24px;margin:0;position:absolute;top:-8px;left:0}.keyframe{z-index:2;background:#3c4938;border:1px solid #a7be8c;width:7px;height:7px;position:absolute;top:50%;transform:translate(-50%,-50%)rotate(45deg)}.timeline>time{color:#d2d7d3;justify-self:center;font-family:DM Mono,monospace;font-size:9px}.timeline>time small{color:#555c59}.inspector{border-left:1px solid var(--border);min-width:0;overflow:hidden}.inspector-tabs{border-bottom:1px solid var(--border);grid-template-columns:1fr 1fr 1fr;height:42px;display:grid}.inspector-tabs button{color:#69706d;background:0 0;font-size:10px;position:relative}.inspector-tabs button.active{color:#ebefec}.inspector-tabs button.active:after{content:"";background:var(--accent);height:1px;position:absolute;bottom:0;left:18px;right:18px}.signal-panel,.properties-panel,.ai-panel{scrollbar-width:thin;scrollbar-color:#303532 transparent;height:calc(100vh - 98px);overflow-y:auto}.panel-intro{border-bottom:1px solid var(--border);color:#7e8581;letter-spacing:.09em;align-items:center;gap:7px;height:45px;padding:0 14px;font-size:8px;font-weight:600;display:flex}.panel-intro b{color:#525956;margin-left:auto;font-size:7px;font-weight:500}.signal-group{border-bottom:1px solid var(--border);padding:13px 14px 10px}.signal-group h3,.properties-panel h3{color:#59605d;letter-spacing:.14em;text-transform:uppercase;margin:0 0 11px;font-size:8px;font-weight:700}.signal-slider{margin-bottom:14px;display:block}.signal-label{justify-content:space-between;align-items:flex-start;margin-bottom:8px;display:flex}.signal-label>span,.signal-row>span{min-width:0}.signal-label b,.signal-label small,.signal-row b,.signal-row small{display:block}.signal-label b,.signal-row b{color:#c4cac6;font-size:10px;font-weight:500}.signal-label small,.signal-row small{color:#525a56;text-overflow:ellipsis;margin-top:3px;font-family:DM Mono,monospace;font-size:7px;overflow:hidden}.signal-label output{color:#e6ece7;padding-top:2px;font-family:DM Mono,monospace;font-size:9px}.signal-label output em{color:#646c68;font-size:7px;font-style:normal}.signal-slider input[type=range]{appearance:none;background:linear-gradient(90deg, var(--accent) var(--range-progress), #292e2b var(--range-progress));border-radius:3px;width:100%;height:3px;margin:0}.signal-slider input::-webkit-slider-thumb{appearance:none;background:var(--accent);border:2px solid #171b18;border-radius:50%;width:10px;height:10px;box-shadow:0 0 0 1px #baff6359}.signal-row{justify-content:space-between;align-items:center;min-height:37px;margin-bottom:5px;display:flex}.signal-row select{border:1px solid var(--border);color:#c8cdca;background:#191d1f;border-radius:5px;min-width:72px;height:27px;padding:0 7px;font-size:9px}.switch{background:#2a2f2c;border-radius:10px;width:30px;height:17px;padding:0;transition:background .12s;position:relative}.switch i{background:#737a76;border-radius:50%;width:11px;height:11px;transition:transform .12s,background .12s;position:absolute;top:3px;left:3px}.switch.is-on{background:#baff6338}.switch.is-on i{background:var(--accent);transform:translate(13px)}.properties-panel{padding:0 14px}.properties-panel section{border-bottom:1px solid var(--border);padding:17px 0}.property-grid{grid-template-columns:1fr 1fr;gap:7px;display:grid}.property-grid label{border:1px solid var(--border);color:#5f6663;border-radius:5px;align-items:center;height:28px;padding-left:8px;font-size:8px;display:flex}.property-grid input{color:#b7bdb9;text-align:right;background:0 0;border:0;width:100%;min-width:0;font-size:9px}.property-row{color:#777f7b;justify-content:space-between;align-items:center;height:30px;font-size:9px;display:flex}.property-row b{color:#bbc1bd;align-items:center;gap:7px;font-weight:400;display:flex}.property-row b i{border-radius:3px;width:13px;height:13px}.info-box{background:#baff630b;border:1px solid #baff631f;border-radius:8px;margin:15px 0;padding:13px}.info-box b{color:#cfd6cf;font-size:10px}.info-box p{color:#717a74;margin:7px 0 0;font-size:8.5px;line-height:1.55}.ai-panel{padding:26px 16px 18px}.ai-orb{width:34px;height:34px;color:var(--accent);background:radial-gradient(circle,#baff6326,#baff6308);border:1px solid #baff6347;border-radius:10px;place-items:center;display:grid;box-shadow:0 0 24px #baff6314}.ai-panel h2{letter-spacing:-.02em;margin:14px 0 7px;font-size:16px;font-weight:550}.ai-panel>p{color:#747d77;margin:0 0 18px;font-size:9.5px;line-height:1.55}.ai-prompt{border:1px solid var(--border-strong);background:#171b1d;border-radius:9px;display:block;overflow:hidden}.ai-prompt textarea{resize:none;color:#cdd3cf;background:0 0;border:0;width:100%;height:92px;padding:11px;font-size:9.5px;line-height:1.5;display:block}.ai-prompt button{color:#121512;background:var(--accent);border-radius:5px;width:calc(100% - 12px);height:29px;margin:0 6px 6px;font-size:9px;font-weight:600;display:block}.quick-prompts{flex-direction:column;align-items:stretch;gap:6px;margin-top:18px;display:flex}.quick-prompts>span{color:#525956;letter-spacing:.15em;margin-bottom:2px;font-size:7px;font-weight:700}.quick-prompts button{border:1px solid var(--border);color:#959d98;text-align:left;background:#141719;border-radius:6px;padding:9px 10px;font-size:8.5px}.quick-prompts button:hover{color:#d5dbd6;border-color:#baff6333}.open-source-button{border:1px solid var(--border);color:#abb2ae;background:#181c1e;border-radius:6px;width:100%;height:31px;margin-top:18px;font-size:9px}.ai-panel>small{color:#545b57;text-align:center;margin-top:13px;font-size:7.5px;display:block}.ai-panel code{color:#828b85;font-family:DM Mono,monospace}.source-workspace{background:#0c0f11;grid-template-columns:minmax(360px,1.1fr) minmax(300px,.9fr);min-height:0;display:grid}.code-pane,.mini-preview{min-width:0;min-height:0;display:grid}.code-pane{border-right:1px solid var(--border);grid-template-rows:38px minmax(0,1fr) 41px}.code-pane header,.mini-preview header{border-bottom:1px solid var(--border);background:#121517;align-items:center;gap:8px;padding:0 12px;font-size:9px;display:flex}.code-pane header b{color:#c5ccc7;font-weight:500}.code-pane header small{color:#555d59;margin-left:auto}.file-dot{color:#fff;border-radius:3px;place-items:center;width:15px;height:15px;font-size:7px;font-style:normal;display:grid}.file-dot.html{background:#cb643d}.code-pane textarea{resize:none;color:#bfc8c0;tab-size:2;white-space:pre;background:#0d1012;border:0;width:100%;height:100%;padding:15px 18px;font-family:DM Mono,monospace;font-size:9px;line-height:1.65}.code-pane footer{border-top:1px solid var(--border);color:#555d59;background:#121517;justify-content:space-between;align-items:center;padding:0 9px 0 13px;font-size:8px;display:flex}.code-pane footer div{gap:6px;display:flex}.code-pane footer button{border:1px solid var(--border);color:#818985;background:#181b1e;border-radius:5px;height:26px;padding:0 9px;font-size:8px}.code-pane footer button.apply-code{color:#111411;background:var(--accent);border-color:var(--accent)}.mini-preview{grid-template-rows:38px minmax(0,1fr)}.mini-preview header{color:#636b67;letter-spacing:.1em;justify-content:space-between;font-size:7.5px}.mini-preview header b{color:#6d776f;letter-spacing:0;font-weight:400}.mini-preview>div{aspect-ratio:2;background:#050708;border:7px solid #222729;border-radius:15px;align-self:center;width:94%;margin:auto;position:relative;overflow:hidden;box-shadow:0 28px 60px #00000080}.load-state{background:radial-gradient(circle,#171d19,#090b0d 55%);align-content:center;place-items:center;gap:16px;width:100vw;height:100vh;display:grid}.load-state>span{color:var(--accent);letter-spacing:.18em;font-size:10px;font-weight:700}.load-state p{color:#6e7771;margin:0;font-size:11px}.loader{border:2px solid #29302b;border-top-color:var(--accent);border-radius:50%;width:25px;height:25px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error-state h1{margin:0;font-size:20px}.error-state button{color:#111;background:var(--accent);border-radius:6px;height:32px;padding:0 13px;font-size:10px}@media (width<=1260px){.studio-shell{grid-template-columns:196px minmax(540px,1fr) 292px}.app-header{grid-template-columns:196px 1fr auto}.connection-card{width:176px}.timeline{grid-template-columns:225px minmax(180px,1fr) 72px}.timeline-controls select{width:134px}.cockpit-shell{width:95%}}