.interchange{display:flex;gap:6px;align-items:center}.interchange .menu-anchor{position:relative}.interchange .menu{position:absolute;top:calc(100% + 4px);left:0;z-index:30;display:flex;flex-direction:column;min-width:280px;padding:4px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 20px #0000001f}.interchange .menu button{text-align:left;white-space:nowrap;border:0;background:transparent;padding:6px 10px;border-radius:6px}.interchange .menu button:hover:not(:disabled),.interchange .menu button:focus-visible{background:var(--paper)}.interchange-busy{position:fixed;top:56px;left:50%;transform:translate(-50%);z-index:40;padding:6px 14px;background:var(--panel);border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:13px}.interchange-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:#0000002e}.interchange-dialog{width:min(440px,calc(100vw - 32px));padding:18px 20px 14px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 36px #0003}.interchange-dialog.warning h2:before{content:"⚠ ";color:var(--danger-ink)}.interchange-dialog h2{margin:0 0 8px;font-size:15px}.interchange-dialog p{margin:0 0 14px;white-space:pre-line;overflow-wrap:anywhere;font-size:13px;line-height:1.6}.interchange-dialog .buttons{display:flex;gap:8px;justify-content:flex-end}.interchange-dialog .buttons button{padding:5px 14px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink)}.interchange-dialog .buttons button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.ai-patch-panel{position:absolute;top:12px;right:12px;z-index:6;display:flex;flex-direction:column;gap:8px;width:380px;max-width:calc(100% - 24px);max-height:calc(100% - 24px);padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 16px #00000029;overflow:auto}.ai-patch-panel header{display:flex;align-items:center;justify-content:space-between}.ai-patch-panel h2{margin:0;font-size:15px}.ai-patch-panel .hint{margin:0;color:var(--muted);font-size:12px}.ai-patch-panel button{font:inherit;height:30px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer}.ai-patch-panel button:disabled{opacity:.45;cursor:default}.ai-patch-panel button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.ai-patch-panel textarea{min-height:180px;resize:vertical;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;padding:8px;border:1px solid var(--line);border-radius:6px}.ai-patch-panel .actions{display:flex;gap:8px;justify-content:flex-end}.ai-patch-panel .result{padding:8px;border-radius:6px;background:#eef4fd;font-size:13px}.ai-patch-panel .result.error{background:var(--danger-bg);color:var(--danger-ink)}.ai-patch-panel .result ul{margin:6px 0 0;padding-left:18px;word-break:break-all}.ai-patch-panel .counts{font-weight:600}.license-panel{position:absolute;top:12px;right:12px;z-index:6;display:flex;flex-direction:column;gap:8px;width:560px;max-width:calc(100% - 24px);max-height:calc(100% - 24px);padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 16px #00000029}.license-panel header{display:flex;align-items:center;justify-content:space-between}.license-panel h2{margin:0;font-size:15px}.license-panel .hint{margin:0;color:var(--muted);font-size:12px}.license-panel button{font:inherit;height:30px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer}.license-panel pre{flex:1;min-height:0;margin:0;padding:8px;overflow:auto;white-space:pre-wrap;word-break:break-word;border:1px solid var(--line);border-radius:6px;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink)}:root{color-scheme:light dark;--paper: #ffffff;--canvas: #fbfaf8;--panel: #ffffff;--ink: rgba(0, 0, 0, .85);--ink-82: rgba(0, 0, 0, .82);--ink-12: rgba(0, 0, 0, .12);--muted: rgba(0, 0, 0, .5);--primary-10: rgba(0, 0, 0, .1);--primary-9: rgba(0, 0, 0, .09);--primary-7: rgba(0, 0, 0, .07);--primary-6: rgba(0, 0, 0, .06);--line: rgba(0, 0, 0, .14);--accent: #296be8;--sys-accent: #007aff;--sys-accent-14: rgba(0, 122, 255, .14);--danger-ink: #ff3b30;--danger-bg: rgba(255, 59, 48, .1);--sticky-yellow: #fcf2cf;--sticky-orange: #f0d3a8;--sticky-mint: #e3f4e5;--sticky-green: #d4f6cc;--sticky-cyan: #cfe7ef;--sticky-blue: #d8dcf3;--sticky-purple: #d3ccee;--sticky-pink: #ebc7e7;--sticky-red: #f0cac9;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Noto Sans CJK SC,Source Han Sans SC,Noto Sans SC,Helvetica Neue,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji";font-size:14px;color:var(--ink);background:var(--paper)}@media(prefers-contrast:more){:root{--canvas: #ffffff;--ink: rgba(0, 0, 0, 1);--muted: rgba(0, 0, 0, .7);--accent: #0d47c7;--sys-accent: #0040dd;--sys-accent-14: rgba(0, 64, 221, .14);--danger-ink: #d70015}}@media(prefers-color-scheme:dark){:root{--paper: #1e1e1e;--canvas: #282828;--panel: #1e1e1e;--ink: rgba(255, 255, 255, .85);--ink-82: rgba(255, 255, 255, .82);--ink-12: rgba(255, 255, 255, .12);--muted: rgba(255, 255, 255, .55);--primary-10: rgba(255, 255, 255, .1);--primary-9: rgba(255, 255, 255, .09);--primary-7: rgba(255, 255, 255, .07);--primary-6: rgba(255, 255, 255, .06);--line: rgba(255, 255, 255, .16);--accent: #669eff;--sys-accent: #0a84ff;--sys-accent-14: rgba(10, 132, 255, .14);--danger-ink: #ff453a;--danger-bg: rgba(255, 69, 58, .16);--sticky-yellow: #4a4126;--sticky-orange: #4d3a22;--sticky-mint: #2b3f30;--sticky-green: #2f4629;--sticky-cyan: #22404a;--sticky-blue: #2e3452;--sticky-purple: #372f52;--sticky-pink: #4a2d47;--sticky-red: #4d2b2b}}@media(prefers-color-scheme:dark)and (prefers-contrast:more){:root{--paper: #000000;--canvas: #000000;--panel: #000000;--ink: rgba(255, 255, 255, 1);--muted: rgba(255, 255, 255, .7);--accent: #9ec7ff;--sys-accent: #409cff;--sys-accent-14: rgba(64, 156, 255, .14);--danger-ink: #ff6961}}*{box-sizing:border-box}html,body,#app{margin:0;height:100%}.app{display:flex;height:100%}.workspace{display:flex;flex:1;min-width:0;flex-direction:column}.library button,.rail button,.zoom button{font:inherit;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer}.toolbar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--line)}.toolbar button,.toolbar select{white-space:nowrap;font:inherit;height:30px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer}.toolbar select{max-width:180px}.toolbar button:disabled{opacity:.45;cursor:default}.toolbar .history{display:flex;gap:4px}.save-state{color:var(--muted);white-space:nowrap;font-size:12px}.save-state.failed,.save-state.unavailable{color:var(--danger-ink)}.notice{padding:6px 12px;background:var(--sticky-yellow);color:var(--ink);border-bottom:1px solid var(--line)}.toolbar button:hover,.toolbar select:hover{border-color:var(--muted)}.toolbar button.primary{background:var(--sys-accent);border-color:var(--sys-accent);color:#fff}.toolbar .title{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toolbar .stats{color:var(--muted);white-space:nowrap}.zoom{position:absolute;z-index:3;right:20px;bottom:22px;display:flex;align-items:center;gap:2px;padding:5px;background:color-mix(in srgb,var(--paper) 97%,transparent);border:.7px solid var(--primary-9);border-radius:10px;box-shadow:0 4px 10px #00000014}.zoom button{width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--ink-82);font-size:11.5px;font-weight:600}.zoom .zoom-value{width:auto;min-width:42px;padding:0 4px;font-weight:500;font-variant-numeric:tabular-nums}.zoom-divider{width:1px;height:18px;margin:0 2px;background:var(--ink-12)}.rail{position:absolute;z-index:6;left:14px;top:42%;transform:translateY(-50%);width:48px;display:flex;flex-direction:column;gap:6px;padding:6px;align-items:center;background:var(--paper);border:.7px solid var(--primary-10);border-radius:10px;box-shadow:0 3px 10px #0000001a}.rail-item{position:relative}.rail-item>button:first-child{width:36px;height:36px;display:flex;align-items:center;justify-content:center;padding:0;border:none;border-radius:7px;background:transparent;color:var(--ink-82)}.rail-item>button:first-child:hover{background:var(--primary-7)}.rail-item>button.active{background:var(--sys-accent-14);color:var(--sys-accent)}.rail .glyph{font-variant-emoji:text;font-size:17px;line-height:1}.rail .label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.rail .more{position:absolute;right:-13px;top:8px;width:12px;height:20px;padding:0;font-size:9px;border:.7px solid var(--primary-10);border-radius:4px;background:var(--paper);color:var(--ink-82)}.rail-panel{position:absolute;left:56px;top:0;background:var(--paper);border-radius:10px;box-shadow:inset 0 0 0 .7px var(--primary-10),0 3px 10px #0000001a;color:var(--ink)}.panel-title{height:16px;margin-bottom:10px;font-size:12px;font-weight:500;line-height:16px;color:var(--ink)}.panel-grid{display:grid}.panel-grid .cell{display:flex;align-items:center;justify-content:center;padding:0;border:none;border-radius:6px;background:transparent;color:var(--ink-82);font:inherit;cursor:pointer}.panel-grid .cell:hover{background:var(--primary-7)}.panel-grid .cell.active{background:var(--sys-accent-14);color:var(--sys-accent)}.rail-panel[data-testid=shape-panel]{padding:12px}.rail-panel[data-testid=shape-panel] .panel-title,.rail-panel[data-testid=connector-panel] .panel-title{display:none}.rail-panel[data-testid=shape-panel] .panel-grid{grid-template-columns:repeat(5,32px);grid-auto-rows:32px;gap:6px}.rail-panel.sticky-panel{top:84px;padding:14px}.sticky-panel .panel-grid{grid-template-columns:repeat(3,52px);grid-auto-rows:52px;gap:8px}.sticky-panel .panel-grid .cell:hover{background:transparent}.rail-panel.connector-panel{top:126px;padding:6px}.connector-panel .panel-grid{grid-template-columns:36px;grid-auto-rows:36px;gap:4px}.swatch-chip{display:block;width:44px;height:44px;border:.5px solid var(--primary-6);box-shadow:0 1.5px 1.5px #0000001a}.swatch-chip.small{width:18px;height:14px;background:var(--sticky-yellow)}.glyph-text{font-size:15px;font-weight:600}.glyph-svg{display:block}.inline-editor{position:absolute;z-index:2;margin:0;border:1.5px solid var(--editor-accent, var(--accent));border-radius:8px;resize:none;outline:none;overflow:auto}.inline-editor.single-line{white-space:pre;overflow:hidden}.inline-editor.centered{text-align:center}.inline-editor.invalid{border-color:var(--editor-error, var(--danger-ink))}.inline-editor-error{position:absolute;z-index:3;overflow:hidden;font-size:11.5px;font-weight:500;line-height:15px;color:var(--danger-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.error{padding:8px 12px;background:var(--danger-bg);color:var(--danger-ink);border-bottom:1px solid var(--line)}.stage{position:relative;flex:1;min-height:0;overflow:hidden;background:var(--canvas)}.stage canvas{position:absolute;inset:0;width:100%;height:100%;cursor:default;touch-action:none}.stage canvas:focus{outline:none}.stage canvas:focus-visible:not([data-pointer-focus]){outline:2px solid var(--accent);outline-offset:-4px;border-radius:8px}.stage canvas.over-blank{cursor:grab}.stage canvas.is-panning{cursor:grabbing}.stage canvas.is-placing{cursor:crosshair}.empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);pointer-events:none}.hint{padding:4px 12px;font-size:12px;color:var(--muted);background:var(--panel);border-top:1px solid var(--line)}.library{width:220px;flex:none;display:flex;flex-direction:column;border-right:1px solid var(--line);background:var(--panel);min-height:0}.library-head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-weight:600;border-bottom:1px solid var(--line)}.library-head button{height:28px;padding:0 8px}.library-list{list-style:none;margin:0;padding:6px;overflow:auto;flex:1}.library-list li{padding:6px;border-radius:6px;margin-bottom:4px}.library-list li.current{background:var(--sys-accent-14)}.library-list .open{display:flex;flex-direction:column;align-items:flex-start;width:100%;border:none;background:transparent;text-align:left;padding:2px 0}.library-list .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.library-list .meta{font-size:11px;color:var(--muted)}.library-list .actions{display:flex;gap:4px;margin-top:4px}.library-list .actions button{font-size:12px;padding:1px 6px}.library-list .actions .danger{color:var(--danger-ink);border-color:var(--danger-ink)}.library-list .rename{width:100%;font:inherit}.stage canvas.is-connecting{cursor:crosshair}.float-toolbar{position:absolute;z-index:4;display:flex;align-items:center;gap:4px;height:36px;box-sizing:border-box;padding:0 6px;background:var(--paper);border:.7px solid var(--primary-10);border-radius:8px;box-shadow:0 3px 10px #0000001f;color:var(--ink)}.float-toolbar>button:not(.swatch){height:26px;padding:0 6px;font-size:12px;white-space:nowrap;border:none;border-radius:6px;background:transparent;color:var(--ink-82)}.float-toolbar button.active{background:var(--sys-accent-14);color:var(--sys-accent)}.connector-toolbar{width:292px}.insert-panel{z-index:5;width:320px;height:200px;box-sizing:border-box;overflow:auto}.insert-panel{padding:8px}.insert-panel .panel-grid{grid-template-columns:repeat(7,36px);grid-auto-rows:32px;gap:4px}.color-toolbar{gap:6px;padding:0 10px}.color-toolbar.sticky{width:248px}.color-toolbar.fill{width:281px}.color-toolbar .swatch{width:20px;height:20px;padding:0;border-radius:50%;border:1px solid var(--primary-10);color:var(--ink);font-size:11px;line-height:18px;flex:none}.color-toolbar .swatch.active{border:2px solid var(--sys-accent)}.color-toolbar .swatch.reset{background:var(--paper);color:var(--danger-ink)}.color-toolbar .separator{width:1px;height:20px;background:var(--line);flex:none}.library-tabs{display:flex;gap:4px;padding:8px 12px 0}.library-tab{flex:1;height:28px}.library-tab[aria-selected=true]{background:var(--sys-accent-14);border-color:var(--sys-accent)}.library-empty{color:var(--muted);font-size:12px}.save-state.sync-offline,.save-state.sync-readOnly{color:var(--danger-ink)}.toolbar .account{color:var(--muted);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.banner-button{margin-left:8px;font:inherit;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer}.dialog-backdrop{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#0000002e}.login-dialog{display:flex;flex-direction:column;gap:10px;width:300px;padding:18px 20px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px #0000001f}.login-dialog .dialog-title{font-weight:600}.login-dialog label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.login-dialog input{font:inherit;height:28px;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink)}.dialog-error{color:var(--danger-ink);font-size:12px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px}.dialog-button{font:inherit;height:30px;padding:0 12px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);cursor:pointer}.dialog-button.primary{background:var(--sys-accent);border-color:var(--sys-accent);color:#fff}