:root{--bg-light: #fafafa;--bg-dots-light: #e5e5e5;--node-bg-light: #ffffff;--border-light: #e5e5e5;--text-primary-light: #171717;--text-secondary-light: #737373;--accent-light: #2563eb;--accent-hover-light: #1d4ed8;--prompt-bg-light: #f5f5f5;--postit-bg-light: #fffeca;--shadow-light: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-hover-light: 0 4px 6px rgba(0,0,0,.07), 0 2px 4px rgba(0,0,0,.04);--bg-dark: #0a0a0a;--bg-dots-dark: #262626;--node-bg-dark: #171717;--border-dark: #262626;--text-primary-dark: #fafafa;--text-secondary-dark: #a3a3a3;--accent-dark: #3b82f6;--accent-hover-dark: #60a5fa;--prompt-bg-dark: #262626;--postit-bg-dark: #4a4a28;--shadow-dark: 0 1px 3px rgba(0,0,0,.3), 0 1px 2px rgba(0,0,0,.2);--shadow-hover-dark: 0 4px 6px rgba(0,0,0,.4), 0 2px 4px rgba(0,0,0,.3);--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--font-hand: "Caveat", cursive;--font-display: "Poppins", sans-serif;--font-body: "Roboto", sans-serif;--transition-base: all .2s cubic-bezier(.4, 0, .2, 1)}html.light{--bg-color: var(--bg-light);--bg-dots: var(--bg-dots-light);--node-bg: var(--node-bg-light);--border-color: var(--border-light);--text-primary: var(--text-primary-light);--text-secondary: var(--text-secondary-light);--accent-color: var(--accent-light);--accent-hover: var(--accent-hover-light);--prompt-bg: var(--prompt-bg-light);--postit-bg: var(--postit-bg-light);--shadow: var(--shadow-light);--shadow-hover: var(--shadow-hover-light)}html.dark{--bg-color: var(--bg-dark);--bg-dots: var(--bg-dots-dark);--node-bg: var(--node-bg-dark);--border-color: var(--border-dark);--text-primary: var(--text-primary-dark);--text-secondary: var(--text-secondary-dark);--accent-color: var(--accent-dark);--accent-hover: var(--accent-hover-dark);--prompt-bg: var(--prompt-bg-dark);--postit-bg: var(--postit-bg-dark);--shadow: var(--shadow-dark);--shadow-hover: var(--shadow-hover-dark)}*{box-sizing:border-box}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-sans);overflow:hidden;overscroll-behavior:none;transition:var(--transition-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#canvas{width:100vw;height:100vh;position:relative;overflow:hidden;cursor:grab;background-image:radial-gradient(circle,var(--bg-dots) 1px,transparent 1px);background-size:24px 24px;background-position:0 0;touch-action:none}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:200;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:var(--node-bg);padding:2rem;border-radius:16px;width:90%;max-width:480px;border:1px solid var(--border-color);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.modal-content h2{font-size:1.25rem;font-weight:600;margin-bottom:1.5rem;color:var(--text-primary)}.modal-buttons{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1.5rem}.modal-buttons button{padding:.5rem 1.25rem;border-radius:8px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;transition:var(--transition-base)}.modal-buttons .cancel-btn{background-color:var(--prompt-bg);color:var(--text-secondary)}.modal-buttons .cancel-btn:hover{background-color:var(--border-color);color:var(--text-primary)}.modal-buttons .save-btn{background-color:var(--accent-color);color:#fff}.modal-buttons .save-btn:hover{background-color:var(--accent-hover)}#sketch-canvas{border:1px solid var(--border-color);border-radius:8px;cursor:crosshair;touch-action:none;background-color:var(--node-bg-light)}html.dark #sketch-canvas{background-color:var(--node-bg-dark)}.sketch-toolbar{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.sketch-toolbar label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--text-secondary)}.sketch-toolbar input[type=color]{width:32px;height:32px;padding:0;border:1px solid var(--border-color);border-radius:6px;cursor:pointer;background-color:transparent}.sketch-toolbar input[type=range]{width:120px}.sketch-toolbar button{background:var(--prompt-bg);border:1px solid var(--border-color);padding:.5rem;border-radius:6px;cursor:pointer;transition:var(--transition-base);display:flex;align-items:center;color:var(--text-secondary)}.sketch-toolbar button:hover{background-color:var(--border-color);color:var(--text-primary)}.sketch-toolbar button.active{background-color:var(--accent-color);color:#fff;border-color:var(--accent-color)}.arrow-target{border:2px dashed var(--accent-color)!important;box-shadow:0 0 0 4px #2563eb1a!important;cursor:crosshair!important}.arrow-target:hover{border-color:var(--accent-hover)!important;box-shadow:0 0 0 4px #2563eb33!important}.text-node{background:transparent!important;border:1px solid transparent;transition:var(--transition-base)}.text-node:hover{border-color:var(--border-color);background:#ffffff0d!important}.text-node.selected{border-color:var(--accent-color)!important;background:#2563eb0d!important;box-shadow:0 0 0 2px #2563eb1a}.text-node-content{background:transparent!important;border:none!important;outline:none!important;padding:8px;min-height:30px;min-width:50px;resize:none}.resize-handle{position:absolute;bottom:-4px;right:-4px;width:12px;height:12px;background:var(--accent-color);border:2px solid var(--node-bg);border-radius:50%;cursor:se-resize;opacity:0;transition:var(--transition-base);z-index:10}.node:hover .resize-handle,.node.selected .resize-handle{opacity:1}.resize-handle:hover{background:var(--accent-hover);transform:scale(1.2)}.node.selected{outline:2px solid var(--accent-color);outline-offset:2px}