.app{display:flex;height:100vh;width:100vw}.app-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;width:100vw;gap:12px;color:#888;font-size:14px}.app-main{display:flex;flex-direction:column;flex:1;min-width:0}.sidebar{width:220px;background:#1e293b;display:flex;flex-direction:column;border-right:1px solid #334155;flex-shrink:0}.sidebar-new-module{padding:12px 10px 8px}.sidebar-new-module-btn{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:#334155;border:1px dashed #475569;border-radius:6px;color:#e2e8f0;font-size:13px;font-family:inherit;cursor:pointer;transition:background .15s,border-color .15s}.sidebar-new-module-btn:hover{background:#475569;border-color:#64748b}.sidebar-modules{flex:1;overflow-y:auto;padding:4px 0}.sidebar-modules::-webkit-scrollbar{width:4px}.sidebar-modules::-webkit-scrollbar-track{background:transparent}.sidebar-modules::-webkit-scrollbar-thumb{background:#475569;border-radius:2px}.sidebar-module-item{display:flex;align-items:center;gap:6px;padding:7px 10px;margin:1px 6px;border-radius:6px;cursor:pointer;color:#94a3b8;font-size:13px;position:relative;transition:background .1s,color .1s}.sidebar-module-item:hover{background:#334155;color:#e2e8f0}.sidebar-module-item.active{background:#334155;color:#fff}.sidebar-module-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.sidebar-pin-icon{flex-shrink:0;color:#64748b}.sidebar-module-menu-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:none;border:none;color:#64748b;border-radius:4px;cursor:pointer;opacity:0;flex-shrink:0;transition:opacity .15s,background .15s,color .15s;padding:0}.sidebar-module-item:hover .sidebar-module-menu-btn,.sidebar-module-menu-btn:focus{opacity:1}.sidebar-module-menu-btn:hover{background:#475569;color:#e2e8f0}.sidebar-context-menu{position:fixed;z-index:2000;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 8px 24px #00000026;padding:4px;min-width:180px}.sidebar-context-menu button{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:none;border:none;color:#334155;font-size:13px;font-family:inherit;cursor:pointer;border-radius:4px;text-align:left;transition:background .1s}.sidebar-context-menu button:hover:not(:disabled){background:#f1f5f9}.sidebar-context-menu button:disabled{color:#94a3b8;cursor:not-allowed}.sidebar-context-menu button.danger{color:#dc2626}.sidebar-context-menu button.danger:hover{background:#fef2f2}.sidebar-context-menu-divider{height:1px;background:#e2e8f0;margin:4px 0}.sidebar-rename-input{flex:1;min-width:0;background:#1e293b;border:1px solid #3b82f6;border-radius:4px;color:#e2e8f0;font-size:13px;padding:2px 6px;outline:none;font-family:inherit}.sidebar-bottom{padding:8px 6px;border-top:1px solid #334155}.sidebar-settings-btn{display:flex;align-items:center;gap:8px;width:100%;height:38px;padding:0 12px;background:none;border:none;border-radius:6px;color:#94a3b8;font-size:13px;font-family:inherit;cursor:pointer;transition:background .15s,color .15s}.sidebar-settings-btn:hover{background:#334155;color:#e2e8f0}.header{height:52px;background:#fff;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;padding:0 20px;flex-shrink:0}.header-brand{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.header-logo{background:#e8a308;color:#fff;font-weight:700;font-size:14px;padding:4px 8px;border-radius:4px;line-height:1}.header-title{font-size:16px;font-weight:600;color:#1e293b}.header-actions{display:flex;gap:8px}.header-actions button{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#475569;font-size:13px;cursor:pointer;transition:all .15s;white-space:nowrap}.header-actions button:hover{background:#f1f5f9;border-color:#cbd5e1;color:#1e293b}.header-actions button.copied{background:#ecfdf5;border-color:#6ee7b7;color:#059669}.header-actions button svg{width:16px;height:16px;flex-shrink:0}.header-user{display:flex;align-items:center;gap:12px;margin-left:16px;padding-left:16px;border-left:1px solid #e2e8f0}.header-user-email{font-size:13px;color:#64748b;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-signout{padding:6px 12px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#475569;font-size:13px;cursor:pointer;transition:all .15s}.header-signout:hover{background:#fef2f2;border-color:#fecaca;color:#dc2626}.header-guest{display:flex;align-items:center;gap:12px;margin-left:16px;padding-left:16px;border-left:1px solid #e2e8f0}.header-guest-label{font-size:13px;color:#94a3b8}.header-signin{display:inline-flex;align-items:center;padding:6px 12px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#475569;font-size:13px;text-decoration:none;cursor:pointer;transition:all .15s;white-space:nowrap}.header-signin:hover{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}.editor-container{flex:1;min-height:0}.footer{height:28px;background:#f8fafc;border-top:1px solid #e2e8f0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:#94a3b8;flex-shrink:0}.footer-sep{opacity:.5}.settings-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:1000}.settings-panel{background:#fff;border-radius:12px;box-shadow:0 20px 60px #00000040;width:700px;max-width:95vw;max-height:85vh;display:flex;flex-direction:column;overflow:hidden}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 0}.settings-header h2{font-size:20px;font-weight:600;color:#1e293b}.settings-close{background:none;border:none;font-size:24px;line-height:1;color:#94a3b8;cursor:pointer;padding:4px 8px;border-radius:4px}.settings-close:hover{background:#f1f5f9;color:#475569}.settings-section-title{font-size:13px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;padding:16px 24px 12px}.settings-body{display:flex;gap:24px;padding:0 24px;flex:1;min-height:0;overflow:hidden}.settings-list{width:280px;flex-shrink:0;overflow-y:auto;border:1px solid #e2e8f0;border-radius:8px}.settings-list-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;font-size:13px;color:#475569;border-bottom:1px solid #f1f5f9;transition:background .1s;-webkit-user-select:none;user-select:none}.settings-list-item:last-child{border-bottom:none}.settings-list-item:hover{background:#f8fafc}.settings-list-item.active{background:#eff6ff;color:#1e40af;font-weight:500}.settings-color-dot{width:16px;height:16px;border-radius:50%;border:1px solid #cbd5e1;flex-shrink:0}.settings-editor{flex:1;display:flex;flex-direction:column;gap:20px;padding:8px 0}.settings-color-preview{display:flex;align-items:center;gap:16px}.settings-color-swatch{width:48px;height:48px;border-radius:8px;border:1px solid #e2e8f0}.settings-preview-text{font-family:Consolas,Courier New,monospace;font-size:22px;font-weight:500}.settings-rgb-inputs{display:flex;gap:12px}.settings-rgb-inputs label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:#64748b}.settings-rgb-inputs input[type=number]{width:64px;padding:6px 8px;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;text-align:center;font-family:inherit}.settings-rgb-inputs input[type=number]:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.settings-color-picker{display:flex;align-items:center}.settings-color-picker label{display:flex;align-items:center;gap:10px;font-size:13px;color:#64748b;font-weight:500}.settings-color-picker input[type=color]{width:48px;height:36px;padding:2px;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;background:#fff}.settings-color-picker input[type=color]::-webkit-color-swatch-wrapper{padding:2px}.settings-color-picker input[type=color]::-webkit-color-swatch{border:none;border-radius:3px}.settings-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 24px 20px;border-top:1px solid #f1f5f9;margin-top:16px}.settings-checkbox{display:flex;align-items:center;gap:8px;font-size:13px;color:#475569;cursor:pointer;-webkit-user-select:none;user-select:none}.settings-checkbox input[type=checkbox]{width:16px;height:16px;cursor:pointer}.settings-reset-btn{padding:8px 16px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#475569;font-size:13px;font-family:inherit;cursor:pointer;transition:all .15s}.settings-reset-btn:hover{background:#f1f5f9;border-color:#cbd5e1}.editor-bar{height:38px;background:#f8fafc;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;gap:12px;flex-shrink:0}.editor-bar-left{display:flex;align-items:center;gap:8px;min-width:0}.editor-bar-module-name{font-size:13px;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-bar-chip{font-size:11px;font-weight:500;padding:2px 8px;border-radius:10px;white-space:nowrap;flex-shrink:0;line-height:1.6}.chip-guest{background:#f1f5f9;color:#64748b;border:1px solid #e2e8f0}.chip-shared{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}.chip-readonly{background:#fef3c7;color:#92400e;border:1px solid #fde68a}.editor-bar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.editor-bar-btn{display:flex;align-items:center;gap:5px;padding:5px 12px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#475569;font-size:12px;font-family:inherit;cursor:pointer;transition:all .15s;white-space:nowrap}.editor-bar-btn:hover:not(:disabled){background:#f1f5f9;border-color:#cbd5e1;color:#1e293b}.editor-bar-btn:disabled{opacity:.55;cursor:not-allowed}.editor-bar-btn.btn-primary{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}.editor-bar-btn.btn-primary:hover:not(:disabled){background:#dbeafe;border-color:#93c5fd;color:#1e40af}.share-dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:1000}.share-dialog{background:#fff;border-radius:12px;box-shadow:0 20px 60px #00000040;width:480px;max-width:95vw;padding:24px}.share-dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.share-dialog-header h3{font-size:17px;font-weight:600;color:#1e293b;margin:0}.share-dialog-close{background:none;border:none;font-size:24px;line-height:1;color:#94a3b8;cursor:pointer;padding:4px 8px;border-radius:4px}.share-dialog-close:hover{background:#f1f5f9;color:#475569}.share-dialog-url-row{display:flex;gap:8px;margin-bottom:12px}.share-dialog-url-input{flex:1;min-width:0;padding:8px 12px;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;color:#475569;background:#f8fafc;font-family:inherit}.share-dialog-copy-btn{padding:8px 16px;border:1px solid #3b82f6;border-radius:6px;background:#3b82f6;color:#fff;font-size:13px;font-family:inherit;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0}.share-dialog-copy-btn:hover{background:#2563eb;border-color:#2563eb}.share-dialog-copy-btn.copied{background:#059669;border-color:#059669}.share-dialog-hint{font-size:12px;color:#94a3b8;margin:0;line-height:1.5}.shared-page-error{font-size:15px;color:#64748b;margin-bottom:16px}.shared-page-back{font-size:13px;color:#3b82f6;text-decoration:none}.shared-page-back:hover{text-decoration:underline}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1e293b,#334155);padding:20px}.auth-card{background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;padding:40px;width:100%;max-width:400px}.auth-brand{text-align:center;margin-bottom:28px}.auth-logo{display:inline-block;background:#e8a308;color:#fff;font-weight:700;font-size:18px;padding:6px 12px;border-radius:6px;margin-bottom:12px}.auth-title{font-size:22px;font-weight:600;color:#1e293b;margin:0 0 4px}.auth-subtitle{font-size:14px;color:#64748b;margin:0}.auth-form{display:flex;flex-direction:column;gap:18px}.auth-error{padding:10px 14px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#dc2626;font-size:13px}.auth-label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:500;color:#475569}.auth-input{padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;transition:border-color .15s}.auth-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.auth-input::placeholder{color:#94a3b8}.auth-submit{margin-top:8px;padding:12px 20px;background:#3b82f6;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:500;font-family:inherit;cursor:pointer;transition:background .15s}.auth-submit:hover:not(:disabled){background:#2563eb}.auth-submit:disabled{opacity:.7;cursor:not-allowed}.auth-footer{margin-top:24px;text-align:center;font-size:14px;color:#64748b}.auth-link{color:#3b82f6;text-decoration:none;font-weight:500}.auth-link:hover{text-decoration:underline}.auth-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#f5f5f5;color:#64748b;font-size:14px}.auth-loading-spinner{width:32px;height:32px;border:3px solid #e2e8f0;border-top-color:#3b82f6;border-radius:50%;animation:auth-spin .8s linear infinite}@keyframes auth-spin{to{transform:rotate(360deg)}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;color:#334155;background:#f5f5f5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font-family:inherit}