*{box-sizing:border-box}html{color-scheme:dark;--bg:#11141c;--panel:#191d28;--panel-2:#151923;--raised:#232938;--line:#2c3344;--text:#e1e6f3;--muted:#8994ac;--accent:#9baeff;--strong:#667eea;--preview:#e9edf5}html[data-theme=light]{color-scheme:light;--bg:#e9edf5;--panel:#fff;--panel-2:#f5f7fb;--raised:#e8edf7;--line:#d6ddeb;--text:#20293c;--muted:#67758d;--accent:#425bc0;--strong:#4b66d0;--preview:#dde4f1}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);font-size:13px}button,input,select{font:inherit;color:inherit}button{border:1px solid transparent;border-radius:5px;background:transparent;padding:6px 10px;cursor:pointer;white-space:nowrap}button:hover{background:var(--raised)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}a{color:var(--muted);text-decoration:none}a:hover{color:var(--accent)}button.primary{background:var(--strong);color:#fff;border-color:var(--strong);font-weight:600}button.primary:hover{filter:brightness(1.08)}input,select{border:1px solid var(--line);border-radius:5px;background:var(--panel-2);padding:7px 10px}h2{font-size:10px;font-weight:650;letter-spacing:1.25px;margin:0;color:var(--muted)}small{font-size:10px;color:var(--muted)}.studio{display:grid;grid-template-rows:51px 47px minmax(0,1fr) 27px;height:100%}.titlebar,.toolbar,.statusbar{display:flex;align-items:center;gap:10px;padding:0 19px}.titlebar{border-bottom:1px solid var(--line);background:var(--panel-2);justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;white-space:nowrap}.brand strong{font-size:17px;letter-spacing:-.5px}.brand-mark{display:grid;place-items:center;width:28px;height:28px;background:linear-gradient(145deg,#798ffe,#4752bd);color:white;border-radius:8px;font-weight:700;font-size:17px;box-shadow:inset 0 0 0 1px #ffffff20}.brand-divider,.toolbar-divider{width:1px;height:18px;background:var(--line);margin:0 3px}.brand>span:not(.brand-mark):not(.badge):not(.brand-divider){color:var(--muted)}.badge{font-size:8px;letter-spacing:1px;padding:4px 6px;border:1px solid var(--line);border-radius:4px;color:var(--accent);margin-left:5px}.badge.subtle{color:var(--muted);font-size:8px;padding:2px 5px;letter-spacing:.5px}.titlebar nav{display:flex;align-items:center;gap:15px;font-size:12px}.icon-button{font-size:21px;line-height:1;padding:3px}.toolbar{background:var(--panel);border-bottom:1px solid var(--line);padding:0 14px;gap:7px}.example-picker{display:flex;align-items:center;gap:9px}.example-picker>span{font-size:9px;color:var(--muted);letter-spacing:1px}.example-picker select{padding:5px 25px 5px 9px;max-width:180px;background:var(--panel-2)}.shortcut{font-size:10px;color:var(--muted);margin-left:6px}.toolbar-spacer,.tab-spacer{flex:1}.workspace{display:grid;grid-template-columns:188px minmax(330px,1fr) minmax(360px,1fr);min-height:0;gap:1px;background:var(--line)}.explorer{background:var(--panel-2);padding:20px 11px;display:flex;flex-direction:column;min-height:0}.explorer h2{padding:0 11px 23px}.project-label{font-size:10px;font-weight:650;letter-spacing:.6px;padding:0 8px 11px}.file{text-align:left;padding:9px 10px;display:flex;align-items:center;gap:9px;width:100%;margin:2px 0;font-size:12px;border-radius:4px}.file.selected{background:var(--raised)}.file small{margin-left:auto;font-size:8px}.file-icon{color:var(--accent);font-weight:bold}.explorer-note{border-top:1px solid var(--line);margin:25px 10px 0;padding-top:20px;font-size:11px;line-height:1.7;color:var(--muted)}.eyebrow{font-size:9px;letter-spacing:1.3px;color:var(--accent)}.trust-note{margin:auto 10px 0;color:var(--muted);font-size:10px;line-height:1.7;padding-top:20px}.source-pane{display:grid;grid-template-rows:37px minmax(0,1fr) 165px;background:var(--panel);min-height:0;min-width:0}.tabbar{display:flex;align-items:stretch;background:var(--panel-2);border-bottom:1px solid var(--line);height:37px;min-width:0}.tabbar button{font-size:11px;border-radius:0;padding:0 15px;color:var(--muted);position:relative;border-right:1px solid var(--line)}.tabbar button.active{color:var(--text);background:var(--panel)}.tabbar button.active:before{content:"";height:2px;background:var(--accent);position:absolute;left:0;right:0;top:0}.tabbar small{align-self:center;padding-right:12px;white-space:nowrap}.editor-stack,.inspector-body{position:relative;min-height:0;min-width:0}.editor-page,.inspector-page{position:absolute;inset:0;visibility:hidden}.editor-page.visible,.inspector-page.visible{visibility:visible}.code-editor{height:100%;width:100%;overflow:hidden}.editor-fallback{resize:none;background:var(--panel);color:var(--text);width:100%;height:100%;border:0;outline:0;padding:15px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px;line-height:21px;tab-size:2;white-space:pre;overflow:auto}.diagnostics{border-top:1px solid var(--line);min-height:0;overflow:auto;background:var(--panel)}.panel-heading{display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;gap:10px;background:var(--panel);padding:11px 15px;border-bottom:1px solid var(--line)}.count{display:inline-block;background:var(--raised);border-radius:8px;padding:2px 6px;letter-spacing:0;margin-left:6px}.empty{padding:14px 18px;color:var(--muted);font-size:11px;line-height:1.6;display:flex;align-items:center;gap:8px}.diagnostic-row{display:flex;gap:9px;width:100%;align-items:flex-start;text-align:left;white-space:normal;font-size:11px;border-radius:0;border-bottom:1px solid var(--line);padding:9px 13px}.diagnostic-row>span:nth-of-type(2){flex:1}.diagnostic-row code{font-size:10px}.diagnostic-row small{white-space:nowrap}.success-dot,.error-dot,.warning-dot{display:inline-block;width:6px;height:6px;border-radius:50%;flex:0 0 6px}.success-dot{background:#5dd4a0}.error-dot{background:#ef7a86}.warning-dot{background:#e9b75e}.diagnostic-row>span:first-child{margin-top:4px}.runtime-error{padding:12px 15px;color:#ef8c96;background:#d9415210;font:11px/1.6 ui-monospace,monospace;overflow-wrap:anywhere;border-bottom:1px solid var(--line)}.inspection-pane{display:grid;grid-template-rows:37px minmax(200px,43%) 37px minmax(0,1fr);background:var(--panel);min-height:0;min-width:0}.preview-heading{display:flex;align-items:center;justify-content:space-between;padding:0 13px;background:var(--panel-2);border-bottom:1px solid var(--line)}.preview-heading h2{display:flex;align-items:center;gap:5px}.preview-heading button{font-size:11px;color:var(--muted)}.preview-surface{position:relative;background-color:var(--preview);background-image:radial-gradient(#7f8ca22a 1px,transparent 1px);background-size:16px 16px;overflow:hidden}.avalonia-preview{position:absolute;inset:16px;overflow:hidden;border-radius:9px;background:#fff;box-shadow:0 5px 24px #0d15351a}.preview-placeholder{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;flex-direction:column;color:#586984;text-align:center;pointer-events:none;padding:30px}.preview-placeholder>span{font-size:42px;color:#8c9dcc;line-height:1.5}.preview-placeholder strong{font-size:17px;font-weight:550}.preview-placeholder p{max-width:270px;font-size:12px;line-height:1.6}.inspector-tabs{overflow-x:auto;scrollbar-width:none}.inspector-tabs button{padding:0 12px;font-size:10px;flex-shrink:0}.tree-scroll{position:absolute;inset:0;overflow:auto;padding:10px}.inspection-tree{padding:0;margin:0;list-style:none;font:11px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace}.inspection-tree .inspection-tree{padding-left:15px}.inspection-tree summary{display:flex;align-items:center;cursor:pointer;list-style:none}.inspection-tree summary:before{content:"›";display:inline-block;width:12px;color:var(--muted)}.inspection-tree details[open]>summary:before{content:"⌄"}.inspection-tree button{display:flex;gap:7px;align-items:center;min-width:0;padding:3px 5px;text-align:left;font:inherit;border-radius:3px}.inspection-tree button>span:nth-child(2){max-width:350px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.inspection-tree small{opacity:.65;font-size:9px}.inspection-tree .leaf{margin-left:12px}.node-kind{color:var(--accent);font-weight:600}.properties,.pipeline{position:absolute;inset:0;overflow:auto;padding:20px}.properties h3,.pipeline h3{font-size:14px;margin:0 0 14px}.properties>label{display:grid;grid-template-columns:65px 1fr;align-items:center;gap:10px;margin:15px 0;color:var(--muted);font-size:11px}.properties input{min-width:0}.property-readout{display:grid;grid-template-columns:minmax(70px,1fr) 2fr;font-size:11px;padding:7px 0;border-bottom:1px solid var(--line);gap:10px}.property-readout span{color:var(--muted);overflow-wrap:anywhere}.properties>code{font-size:11px;color:var(--accent);overflow-wrap:anywhere}.properties>p{font-size:11px;color:var(--muted)}.pipeline>p{color:var(--muted);font-size:12px;line-height:1.7}.pipeline>div{display:grid;grid-template-columns:28px 1fr;gap:4px 10px;border:1px solid var(--line);background:var(--panel-2);padding:13px;margin:9px 0;border-radius:7px}.pipeline b{grid-row:span 2;color:var(--accent);font-size:12px}.pipeline strong{font-size:11px}.pipeline span{color:var(--muted);font-size:10px}.statusbar{background:var(--panel-2);border-top:1px solid var(--line);justify-content:space-between;font-size:10px;color:var(--muted);padding:0 12px}.statusbar>span:first-child{display:flex;align-items:center;gap:8px}.status-divider{opacity:.5;margin:0 8px}.boot{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--muted)}.boot .brand-mark{width:45px;height:45px;font-size:28px;border-radius:13px}.boot h1{color:var(--text);font-size:25px;margin:15px 0 3px}.boot p{font-size:12px}.boot progress{width:160px;height:3px;margin-top:10px}#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;background:#732736;color:#fff;padding:15px;z-index:10000}#blazor-error-ui a{color:#fff;text-decoration:underline}#blazor-error-ui button{float:right}.muted{color:var(--muted)}@media(max-width:1100px){.workspace{grid-template-columns:150px minmax(300px,1fr) minmax(300px,1fr)}.shortcut{display:none}.brand>span:not(.brand-mark):not(.badge):not(.brand-divider){font-size:12px}.toolbar button{font-size:11px;padding:6px 8px}.explorer{padding-inline:6px}.panel-heading small{display:none}}@media(max-width:850px){.workspace{grid-template-columns:minmax(280px,1fr) minmax(280px,1fr)}.explorer{display:none}.toolbar{overflow-x:auto;gap:5px;scrollbar-width:none}.example-picker>span{display:none}.toolbar-spacer{display:none}.titlebar{padding-inline:12px}.brand .badge{display:none}.statusbar>span:last-child{display:none}.source-pane{grid-template-rows:37px minmax(0,1fr) 130px}}@media(max-width:620px){html,body,#app{overflow:auto;height:100%;min-height:100%}.studio{height:auto;min-height:100%;grid-template-rows:48px 47px 1fr 27px}.workspace{display:flex;flex-direction:column;gap:1px}.source-pane{height:540px;flex:none}.inspection-pane{height:700px;flex:none;grid-template-rows:37px 290px 37px minmax(0,1fr)}.brand-divider,.brand>span:not(.brand-mark):not(.badge){display:none}.titlebar nav a{font-size:11px}.toolbar{padding:0 8px}.toolbar button{flex-shrink:0}.example-picker select{max-width:140px}.toolbar-divider{display:none}.statusbar{position:sticky;bottom:0;min-height:27px}.inspection-tree button>span:nth-child(2){max-width:230px}}

#studio-storage-error[hidden]{display:none}#studio-storage-error:not([hidden]){position:fixed;bottom:28px;left:12px;right:12px;z-index:1000;padding:9px 12px;border:1px solid #a95b65;border-radius:5px;background:var(--panel);color:#ef8c96;font-size:12px;white-space:normal}