:root{--bg: #f6f7fb;--panel: #ffffff;--panel-2: #fafbff;--border: #e6e8f0;--text: #20243a;--muted: #6b7194;--accent: #8aa5ff;--accent-2: #b9c8ff;--shadow: 0 1px 2px rgba(20,24,60,.06), 0 8px 24px rgba(20,24,60,.06);--radius: 10px;font-family:ui-sans-serif,-apple-system,Segoe UI,Inter,Roboto,sans-serif}*{box-sizing:border-box}html,body,#app{height:100%;margin:0}body{background:var(--bg);color:var(--text);overflow:hidden}#app{display:grid;grid-template-columns:64px 1fr 280px;grid-template-rows:48px 1fr;grid-template-areas:"top top top" "tool canvas insp";height:100%}#app.side-panel-open{grid-template-columns:260px 64px 1fr 280px;grid-template-areas:"top top top top" "side tool canvas insp"}.topbar{grid-area:top;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:var(--panel);border-bottom:1px solid var(--border);box-shadow:var(--shadow);z-index:5}.brand{font-weight:700;letter-spacing:.5px}.doc-name{margin-left:16px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:6px 12px;font:inherit;color:var(--text);min-width:220px}.doc-name:focus{outline:2px solid var(--accent);outline-offset:-1px}.doc-meta{margin-left:6px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:4px 8px;font:inherit;font-size:12px;color:var(--fg);max-width:160px}.doc-meta:focus{outline:2px solid var(--accent);outline-offset:-1px}.topbar-actions{display:flex;gap:8px;align-items:center}.cloud-status{font-size:11px;color:var(--muted);padding:4px 8px;border:1px solid var(--border);border-radius:999px;background:var(--panel-2);min-width:70px;text-align:center}.cloud-status.saving{color:#b8861b;border-color:#f0d588;background:#fff8e1}.cloud-status.saved{color:#1b8745;border-color:#b2e2c2;background:#eaf8ee}.cloud-status.error{color:#b8281b;border-color:#f0a8a0;background:#ffecea}.topbar-actions button,.topbar-actions select{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:6px 12px;cursor:pointer;font:inherit;color:var(--text)}.topbar-actions button:hover{background:var(--accent-2)}.toolbar{grid-area:tool;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;padding:10px 0;gap:6px}.toolbar button{width:44px;height:44px;border-radius:10px;border:1px solid transparent;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text)}.toolbar button:hover{background:var(--panel-2);border-color:var(--border)}.toolbar button.active{background:var(--accent-2);border-color:var(--accent)}.toolbar svg{width:22px;height:22px}.canvas-wrap{grid-area:canvas;position:relative;overflow:hidden;background:radial-gradient(circle at 20% 10%,#eef1ff 0%,transparent 40%),radial-gradient(circle at 80% 90%,#fff0f6 0%,transparent 40%),var(--bg)}.canvas-wrap svg.scene{width:100%;height:100%;display:block}.inspector{grid-area:insp;background:var(--panel);border-left:1px solid var(--border);padding:14px;overflow-y:auto}.inspector h3{margin:4px 0 10px;font-size:12px;text-transform:uppercase;color:var(--muted);letter-spacing:.8px}.inspector .row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.inspector label{font-size:12px;color:var(--muted);width:80px}.inspector input[type=number],.inspector input[type=text],.inspector select{flex:1;min-width:0;background:var(--panel-2);border:1px solid var(--border);border-radius:6px;padding:4px 8px;font:inherit;color:var(--text)}.inspector input[type=range]{flex:1}.inspector .btn-group{display:flex;gap:4px}.inspector .btn-group button{flex:1;background:var(--panel-2);border:1px solid var(--border);border-radius:6px;padding:4px 6px;cursor:pointer;font:inherit}.inspector .btn-group button.active{background:var(--accent-2);border-color:var(--accent)}.palette{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.palette .swatch{aspect-ratio:1;border-radius:8px;cursor:pointer;border:2px solid transparent}.palette .swatch.active{border-color:var(--text)}.icon-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;max-height:240px;overflow-y:auto;border:1px solid var(--border);border-radius:8px;padding:6px;background:var(--panel-2)}.icon-picker button{aspect-ratio:1;background:transparent;border:1px solid transparent;border-radius:6px;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center}.icon-picker button:hover{background:var(--panel);border-color:var(--border)}.icon-picker svg{width:18px;height:18px}.handle{fill:#fff;stroke:var(--accent);stroke-width:1.5;cursor:nwse-resize}.handle.n,.handle.s{cursor:ns-resize}.handle.e,.handle.w{cursor:ew-resize}.handle.ne,.handle.sw{cursor:nesw-resize}.sel-outline{fill:none;stroke:var(--accent);stroke-width:1.2;stroke-dasharray:4 3;pointer-events:none}.control-point{fill:#fff;stroke:var(--accent);stroke-width:2;cursor:grab}.control-point:hover{fill:var(--accent-2)}.control-point.endpoint{fill:var(--accent)}text.qv-text{-webkit-user-select:none;user-select:none}.qv-node{cursor:move}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#14183c59;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100}.modal{background:var(--panel);border-radius:14px;box-shadow:0 24px 64px #14183c40;width:min(720px,92vw);max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.modal-header{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border)}.modal-header h2{margin:0;font-size:14px;flex:1}.modal-header .close{background:none;border:none;font-size:18px;cursor:pointer;color:var(--muted)}.modal-search{width:100%;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font:inherit;color:var(--text)}.modal-cats{display:flex;flex-wrap:wrap;gap:6px;padding:10px 16px;border-bottom:1px solid var(--border)}.modal-cats button{background:var(--panel-2);border:1px solid var(--border);border-radius:999px;padding:4px 12px;font:inherit;font-size:12px;cursor:pointer;color:var(--text)}.modal-cats button.active{background:var(--accent-2);border-color:var(--accent)}.modal-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;padding:14px 16px;overflow-y:auto}.modal-grid button{aspect-ratio:1;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;color:var(--text)}.modal-grid button:hover{background:var(--accent-2);border-color:var(--accent)}.modal-grid svg{width:22px;height:22px}.modal-footer{padding:8px 16px;border-top:1px solid var(--border);font-size:11px;color:var(--muted)}.export-dialog{width:min(380px,90vw);max-height:none}.export-btn{flex:1;padding:12px 20px;border-radius:10px;border:1px solid var(--border);background:var(--panel-2);font:inherit;font-size:13px;cursor:pointer;color:var(--text);transition:background .15s,border-color .15s}.export-btn:hover{background:var(--accent-2);border-color:var(--accent)}.export-btn:disabled{opacity:.5;cursor:default}.table-menu{position:fixed;z-index:200;min-width:220px;max-width:280px;background:var(--panel, #fff);border:1px solid var(--border, #e2e5ef);border-radius:10px;box-shadow:0 16px 48px #14183c38;padding:6px;font:13px Inter,system-ui,sans-serif;color:var(--text, #20243a);-webkit-user-select:none;user-select:none}.table-menu-item{display:block;width:100%;background:none;border:none;text-align:left;padding:6px 10px;border-radius:6px;font:inherit;color:inherit;cursor:pointer}.table-menu-item:hover{background:var(--panel-2, #f3f5fb)}.table-menu-item.danger{color:#d6336c}.table-menu-item.danger:hover{background:#fdecef}.table-menu-sep{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted, #8a8fa7);padding:8px 10px 4px;border-top:1px solid var(--border, #e2e5ef);margin-top:4px}.table-menu-sep:first-child{border-top:none;margin-top:0}.table-menu-palette{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;padding:6px 10px}.table-menu-palette .swatch{width:16px;height:16px;border-radius:4px;border:1px solid rgba(0,0,0,.1);cursor:pointer}.table-menu-palette .swatch:hover{transform:scale(1.15)}.table-menu-custom{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 10px 8px;font-size:11px;color:var(--muted, #8a8fa7)}.table-menu-custom input[type=color]{width:24px;height:24px;border:1px solid var(--border, #e2e5ef);border-radius:6px;background:none;padding:0;cursor:pointer}.side-panel{grid-area:side;background:var(--panel);border-right:1px solid var(--border);display:none;flex-direction:column;overflow:hidden}.side-panel.open{display:flex}.color-library{position:fixed;z-index:50;width:280px;background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 40px #14183c2e;display:flex;flex-direction:column;overflow:hidden;-webkit-user-select:none;user-select:none}.color-library.hidden{display:none}.color-library-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--panel-2);border-bottom:1px solid var(--border);cursor:grab;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}.color-library-header:active{cursor:grabbing}.color-library-header button{background:none;border:none;cursor:pointer;color:var(--muted);font-size:14px}.color-library-body{display:flex;min-height:180px;max-height:320px}.color-library-tabs{width:80px;border-right:1px solid var(--border);overflow-y:auto;flex-shrink:0}.color-library-tabs button{display:block;width:100%;background:none;border:none;border-bottom:1px solid var(--border);padding:8px 6px;font-size:10px;text-transform:uppercase;letter-spacing:.3px;color:var(--muted);cursor:pointer;text-align:center}.color-library-tabs button:hover{background:var(--panel-2)}.color-library-tabs button.active{background:var(--accent-2);color:var(--text)}.color-library-colors{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:10px;overflow-y:auto;align-content:start}.color-library-colors .swatch{aspect-ratio:1;border-radius:8px;cursor:pointer;border:2px solid transparent;transition:transform .1s}.color-library-colors .swatch:hover{transform:scale(1.12)}.color-library-colors .swatch.empty{border:2px dashed var(--border);background:var(--panel-2)}.color-library-colors .swatch.empty:hover{border-color:var(--accent)}.edit-zone-point{cursor:pointer;transition:r .15s}.edit-zone-point:hover{r:8}