*{box-sizing:border-box;margin:0;padding:0}html,body,#root{color:#1a1a2e;-webkit-user-select:none;user-select:none;background:#f5f5fa;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;overflow:hidden}input,textarea,select{-webkit-user-select:text;user-select:text}#root{flex-direction:column;display:flex}.app-layout{flex:1;display:flex;overflow:hidden}.left-sidebar{-webkit-user-select:none;user-select:none;background:#fff;border-right:1px solid #ddd;flex-direction:column;flex-shrink:0;width:200px;padding:8px 0;display:flex}.left-sidebar h3{text-transform:uppercase;letter-spacing:.5px;color:#888;padding:8px 12px;font-size:11px}.tool-btn{cursor:pointer;color:#333;text-align:left;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 12px;font-size:13px;transition:background .1s;display:flex}.tool-btn:hover{background:#f0f0f5}.tool-btn.active{color:#4040c0;background:#e8e8ff;font-weight:600}.tool-btn .icon{justify-content:center;align-items:center;width:20px;height:20px;font-size:16px;display:flex}.right-sidebar{background:#fff;border-left:1px solid #ddd;flex-shrink:0;width:320px;padding:12px;overflow-y:auto}.right-sidebar h3{color:#333;margin-bottom:12px;font-size:13px;font-weight:600}.right-sidebar label{color:#666;margin-top:10px;margin-bottom:4px;font-size:12px;display:block}.right-sidebar input[type=text],.right-sidebar select{border:1px solid #ccc;border-radius:4px;width:100%;padding:6px 8px;font-size:13px}.right-sidebar input[type=text]:focus,.right-sidebar select:focus{border-color:#6060d0;outline:none;box-shadow:0 0 0 2px #6060d026}.prop-row{margin-bottom:8px}.attr-list{margin-top:4px}.attr-item{align-items:center;gap:4px;padding:4px 0;font-size:12px;display:flex}.attr-item input[type=text]{flex:1;padding:3px 6px;font-size:12px}.attr-item button{cursor:pointer;color:#c00;background:0 0;border:none;padding:2px 4px;font-size:14px}.attr-item button:hover{color:red}.add-btn{cursor:pointer;color:#666;background:0 0;border:1px dashed #aaa;border-radius:4px;align-items:center;gap:4px;margin-top:6px;padding:4px 8px;font-size:12px;display:inline-flex}.add-btn:hover{color:#6060d0;border-color:#6060d0}.canvas-container{background:#f8f8fc;flex:1;position:relative;overflow:hidden}.bottom-toolbar{background:#fff;border-top:1px solid #d0d0d0;flex-shrink:0;align-items:center;gap:6px;height:40px;padding:0 12px;display:flex;box-shadow:0 -1px 3px #0000000a}.bottom-toolbar button{cursor:pointer;color:#333;background:#f5f5f5;border:1px solid #bbb;border-radius:5px;padding:5px 10px;font-size:12px;transition:background .12s,border-color .12s}.bottom-toolbar button:hover:not(:disabled){background:#e6e6f2;border-color:#999}.bottom-toolbar button:active:not(:disabled){background:#dcdcf0}.bottom-toolbar button:disabled{opacity:.35;cursor:default}.toolbar-sep{background:#d0d0d0;flex-shrink:0;width:1px;height:20px;margin:0 4px}.bottom-toolbar .diagram-title-input{color:#333;background:#fafafa;border:1px solid #d0d0d0;border-radius:5px;outline:none;width:160px;padding:5px 8px;font-size:12px;font-weight:500;transition:border-color .12s,box-shadow .12s}.bottom-toolbar .diagram-title-input:focus{border-color:#4040c0;box-shadow:0 0 0 2px #4040c026}.bottom-toolbar .diagram-title-input::placeholder{color:#aaa;font-weight:400}.bottom-toolbar .file-name{color:#555;text-overflow:ellipsis;white-space:nowrap;max-width:240px;font-size:12px;font-weight:500;overflow:hidden}.bottom-toolbar .zoom-display{color:#666;text-align:center;min-width:48px;font-size:12px}.bottom-toolbar .spacer{flex:1}.toggle-group{border:1px solid #ccc;border-radius:4px;margin-top:2px;display:flex;overflow:hidden}.toggle-group button{cursor:pointer;background:#fff;border:none;border-right:1px solid #ccc;flex:1;padding:4px 6px;font-size:12px}.toggle-group button:last-child{border-right:none}.toggle-group button.active{color:#4040c0;background:#e8e8ff;font-weight:600}.toggle-group button:hover:not(.active){background:#f0f0f5}.inline-edit-overlay{z-index:1000;position:absolute}.inline-edit-overlay input{text-align:center;background:#fff;border:2px solid #6060d0;border-radius:3px;outline:none;padding:2px 6px;font-family:inherit;font-size:14px}.key-badge{border-radius:3px;padding:1px 4px;font-size:10px;font-weight:600}.key-badge.pk{color:#333;background:gold}.key-badge.wpk{color:#666;background:#ffecb3;border:1px dashed #cca}.auto-save-label{color:#555;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:4px;font-size:12px;display:flex}.auto-save-label input[type=checkbox]{cursor:pointer;margin:0}.shortcuts-popup{z-index:9999;background:#fff;border:1px solid #ccc;border-radius:8px;min-width:280px;padding:12px 16px;position:absolute;bottom:44px;right:12px;box-shadow:0 4px 24px #0000002e}.shortcuts-popup-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.shortcuts-popup-header strong{font-size:14px}.shortcuts-popup-header button{cursor:pointer;color:#888;background:0 0;border:none;padding:0 4px;font-size:18px}.shortcuts-popup table{border-collapse:collapse;width:100%}.shortcuts-popup td{border-bottom:1px solid #eee;padding:3px 6px;font-size:12px}.shortcuts-popup td:first-child{white-space:nowrap}.shortcuts-popup kbd{background:#f0f0f5;border:1px solid #ccc;border-radius:3px;padding:1px 5px;font-family:inherit;font-size:11px}.stamp-overlay{z-index:99999;pointer-events:none;position:fixed;bottom:20px;right:20px}.stamp-overlay img{display:block}@keyframes stampIn{0%{opacity:0;transform:scale(2)}30%{opacity:.9;transform:scale(2)}60%{opacity:1;transform:scale(.95)}75%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes stampOut{0%{opacity:1}to{opacity:0}}.stamp-enter{animation:.6s cubic-bezier(.22,1,.36,1) forwards stampIn}.stamp-exit{animation:1s ease-out forwards stampOut}.find-bar{z-index:1000;background:#fff;border:1px solid #ccc;border-radius:6px;align-items:flex-start;gap:6px;padding:6px 8px;display:flex;position:absolute;top:8px;right:8px;box-shadow:0 2px 12px #0000001f}.find-bar-toggle{cursor:pointer;color:#666;background:0 0;border:none;padding:4px 2px;font-size:12px;line-height:1}.find-bar-toggle:hover{color:#333}.find-bar-fields{flex-direction:column;gap:4px;display:flex}.find-bar-row{align-items:center;gap:4px;display:flex}.find-bar-row input{background:#fafafa;border:1px solid #ddd;border-radius:4px;outline:none;width:200px;padding:4px 8px;font-size:13px}.find-bar-row input:focus{background:#fff;border-color:#6060d0}.find-bar-count{color:#888;text-align:center;min-width:55px;font-size:11px}.find-bar-row button{cursor:pointer;color:#555;background:0 0;border:none;border-radius:3px;padding:3px 6px;font-size:12px;line-height:1}.find-bar-row button:hover:not(:disabled){color:#333;background:#eee}.find-bar-row button:disabled{opacity:.3;cursor:default}.about-overlay{z-index:10000;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.about-modal{color:#eee;text-align:center;background:#2b2b2b;border-radius:12px;min-width:300px;padding:32px 48px;box-shadow:0 8px 32px #00000080}.about-modal img{border-radius:16px;margin-bottom:16px}.about-modal h2{margin:0 0 8px;font-size:22px;font-weight:700}.about-modal p{color:#bbb;margin:4px 0;font-size:14px}.about-modal .about-subtitle{color:#888;margin-bottom:20px;font-size:12px}.about-modal button{color:#eee;cursor:pointer;background:#3a3a3a;border:1px solid #555;border-radius:6px;padding:6px 28px;font-size:14px}.about-modal button:hover{background:#4a4a4a}
