@import "https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;700&display=swap";:root{--bg-canvas:#f5efe6;--bg-grid:#0000000d;--text-primary:#2c2a29;--text-secondary:#5e5a57;--text-muted:#9c9792;--border-card:#0000000f;--shadow-flat:0 2px 8px #0000000a;--shadow-card:0 10px 30px #2c2a2914;--shadow-card-active:0 15px 40px #2c2a2926;--transition-smooth:all .3s cubic-bezier(.25, .8, .25, 1);--transition-fast:all .15s ease}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-canvas);color:var(--text-primary);-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased;width:100vw;height:100dvh;font-family:Plus Jakarta Sans,Noto Sans SC,sans-serif;overflow:hidden}@media (height<=700px),(width<=900px){body{height:auto;overflow-y:auto}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#0000001a;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#0003}button{cursor:pointer;border:none;outline:none;font-family:inherit}textarea{resize:none;border:none;outline:none;font-family:inherit}.sticky-card{border:1px solid var(--border-card);box-shadow:var(--shadow-card);cursor:grab;transition:box-shadow var(--transition-fast), border-color var(--transition-fast), background-color .4s ease;z-index:10;border-radius:12px;flex-direction:column;padding:12px;display:flex;position:absolute}.sticky-card:hover{box-shadow:var(--shadow-card-active);z-index:20;border-color:#0000001f}.sticky-card:active{cursor:grabbing}.sticky-card.connecting-source{box-shadow:0 0 15px #ef444433;border:2px solid #ef4444!important}.card-header{cursor:grab;justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.card-title-input{color:var(--text-primary);background:0 0;border:none;border-radius:4px;width:70%;padding:2px 4px;font-size:.85rem;font-weight:700}.card-title-input:focus{box-shadow:none;background:#fff6}.card-actions{align-items:center;gap:6px;display:flex}.card-action-btn{color:var(--text-muted);cursor:pointer;width:20px;height:20px;transition:var(--transition-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.card-action-btn:hover{color:var(--text-primary);background:#0000000d}.card-action-btn.danger:hover{color:#ef4444;background:#ef444414}.card-action-btn.color-dot{border-radius:50%;width:14px;height:14px;padding:0}.card-action-btn.color-dot:hover{transform:scale(1.15)}.color-picker-popover{box-shadow:var(--shadow-card);z-index:100;background:#fff;border:1px solid #0000001a;border-radius:8px;gap:6px;padding:6px;display:flex;position:absolute;top:36px;right:12px}.color-picker-btn{cursor:pointer;width:16px;height:16px;transition:var(--transition-fast);border:1px solid #0000001a;border-radius:50%}.color-picker-btn:hover{transform:scale(1.25)}.card-body{flex-direction:column;flex:1;display:flex}.card-textarea{width:100%;height:100%;color:var(--text-secondary);background:0 0;border:none;font-size:.8rem;line-height:1.5;overflow-y:auto}.card-connection-anchor{width:22px;height:22px;box-shadow:var(--shadow-flat);cursor:pointer;transition:var(--transition-fast);z-index:30;border:1px solid #0000001a;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}.card-connection-anchor:hover{box-shadow:var(--shadow-card);border-color:#0003;transform:translate(-50%)scale(1.2)}.pulsing-target{animation:1s ease-in-out infinite alternate anchor-pulse;border-color:#3b82f6!important}@keyframes anchor-pulse{0%{transform:translate(-50%)scale(1);box-shadow:0 0 #3b82f666}to{transform:translate(-50%)scale(1.25);box-shadow:0 0 10px 4px #3b82f61a}}.sticky-card.card-selected{outline-offset:1px;outline:2px solid #2c2a29}.card-markdown-preview{width:100%;height:100%;color:var(--text-secondary);-webkit-user-select:text;user-select:text;cursor:text;font-size:.8rem;line-height:1.5;overflow-y:auto}.card-markdown-preview h3{color:var(--text-primary);margin:6px 0 4px;font-size:.95rem;font-weight:700}.card-markdown-preview h4{color:var(--text-primary);margin:4px 0 2px;font-size:.85rem;font-weight:600}.card-markdown-preview .md-bullet{margin-left:14px;list-style:none;position:relative}.card-markdown-preview .md-bullet:before{content:"•";color:var(--text-muted);position:absolute;left:-10px}.card-preview-toggle-indicator{width:20px;height:20px;color:var(--text-secondary);opacity:0;transition:var(--transition-fast);cursor:pointer;z-index:40;background:#0000000a;border:1px solid #0000000d;border-radius:4px;justify-content:center;align-items:center;display:flex;position:absolute;bottom:8px;right:12px}.sticky-card:hover .card-preview-toggle-indicator{opacity:1}.card-preview-toggle-indicator:hover{color:var(--text-primary);background:#00000014}.connection-group{cursor:pointer}.connection-hitbox{pointer-events:stroke;cursor:pointer}.connection-line{pointer-events:none;transition:stroke .15s,stroke-width .15s}.connection-group:hover .connection-line{stroke:#ef4444;stroke-width:3px;filter:drop-shadow(0 0 4px #ef44444d)}.connection-drawing-line{pointer-events:none;animation:1s linear infinite dash-flow}@keyframes dash-flow{to{stroke-dashoffset:-20px}}.canvas-viewport{background-color:var(--bg-canvas);border:1px solid #0000000d;border-radius:20px;width:100%;height:calc(100dvh - 180px);position:relative;overflow:hidden;box-shadow:inset 0 2px 10px #00000005}.canvas-container{backface-visibility:hidden;width:100%;height:100%;position:absolute;top:0;left:0}.canvas-grid-bg{background-image:radial-gradient(var(--bg-grid) 1px, transparent 1px);z-index:-10;background-size:24px 24px;width:100000px;height:100000px;position:absolute;top:-50000px;left:-50000px}.canvas-toolbar{-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow-card);z-index:50;background:#fffc;border:1px solid #00000014;border-radius:12px;align-items:center;gap:8px;padding:6px;display:flex;position:absolute;top:20px;left:20px}.toolbar-btn{width:32px;height:32px;color:var(--text-secondary);transition:var(--transition-fast);cursor:pointer;background:0 0;border-radius:8px;justify-content:center;align-items:center;display:flex}.toolbar-btn:hover{color:var(--text-primary);background:#0000000a}.toolbar-btn.danger:hover{color:#ef4444;background:#ef44441a}.zoom-indicator{color:var(--text-secondary);text-align:center;min-width:42px;padding:0 4px;font-size:.78rem;font-weight:600}.toolbar-divider{background:#00000014;width:1px;height:20px}.file-upload-label{justify-content:center;align-items:center;display:flex}.canvas-instruction-overlay{color:var(--text-secondary);-webkit-backdrop-filter:blur(8px);box-shadow:var(--shadow-flat);pointer-events:none;z-index:50;background:#fff9;border:1px solid #0000000a;border-radius:20px;padding:6px 14px;font-size:.75rem;font-weight:500;position:absolute;bottom:20px;left:20px}.primary-action-btn{box-shadow:var(--shadow-flat);transition:var(--transition-fast);align-items:center;gap:6px;padding:0 12px;font-size:.8rem;font-weight:600;color:#f5efe6!important;background:#2c2a29!important;border-radius:8px!important;width:auto!important;display:flex!important}.primary-action-btn:hover{transform:translateY(-1px);background:#4a4644!important}.save-status-dot{width:32px;height:32px;transition:var(--transition-smooth);border-radius:50%;justify-content:center;align-items:center;display:flex}.save-status-dot.saved{color:#10b981}.save-status-dot.saving{color:#f59e0b;animation:1s ease-in-out infinite alternate save-dot-pulse}@keyframes save-dot-pulse{to{opacity:.4}}.undo-toast-overlay{color:#f5efe6;box-shadow:var(--shadow-card);z-index:100;background:#2c2a29;border:1px solid #ffffff14;border-radius:30px;align-items:center;gap:16px;padding:8px 16px;font-size:.8rem;font-weight:500;animation:.3s cubic-bezier(.25,.8,.25,1) toast-slide-up;display:flex;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.undo-toast-btn{color:#fef08a;cursor:pointer;transition:var(--transition-fast);background:#ffffff14;border:1px solid #ffffff26;border-radius:20px;align-items:center;padding:3px 10px;font-size:.75rem;font-weight:600;display:flex}.undo-toast-btn:hover{color:#2c2a29;background:#fef08a;border-color:#fef08a}@keyframes toast-slide-up{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.app-viewport{flex-direction:column;justify-content:space-between;align-items:center;width:100vw;min-height:100dvh;padding:30px 24px;display:flex;position:relative}.app-header{text-align:center;margin-bottom:20px}.brand-logo{letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);justify-content:center;align-items:center;gap:8px;margin-bottom:2px;font-size:.72rem;font-weight:700;display:flex}.brand-mark-svg{border-radius:4px;flex-shrink:0;width:20px;height:20px}.brand-app-name{color:var(--text-primary);letter-spacing:-.5px;font-family:Instrument Serif,Georgia,serif;font-size:2.2rem;font-weight:400}.app-main-content{flex-direction:column;flex:1;width:100%;max-width:1400px;display:flex}.app-footer{text-align:center;margin-top:25px}.footer-links{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.footer-link-item{color:var(--text-muted);transition:var(--transition-smooth);font-size:.8rem;font-weight:500;text-decoration:none}.footer-link-item:hover{color:var(--text-primary)}.footer-link-item.active{color:var(--text-primary);font-weight:600}.footer-divider{color:#0000000d;font-size:.8rem}