.app{display:flex;height:100vh;background-color:#1a1a1a}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.sidebar{width:250px;height:100vh;background-color:#2a2a2a;border-right:1px solid #333;overflow-y:auto;padding:1rem}.sidebar-section{margin-bottom:1rem}.section-header{width:100%;padding:.75rem;background-color:#333;color:#fff;border:none;border-radius:4px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:1rem;transition:background-color .2s}.section-header:hover{background-color:#444}.arrow{font-size:.8rem;transition:transform .2s}.arrow.open{transform:rotate(180deg)}.section-content{padding:.5rem;display:flex;flex-direction:column;gap:.5rem}.section-content button{padding:.5rem;background-color:#444;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s;text-align:left}.section-content button:hover{background-color:#555}.controls{display:flex;justify-content:space-between;gap:20px;padding:1rem;background-color:#2a2a2a;border-bottom:1px solid #333}.canvas-controls{display:flex;gap:15px}.boundary-settings{display:flex;gap:15px;padding:8px 15px;background-color:#333;border-radius:4px;border:1px solid #444;color:#fff}.boundary-settings label{display:flex;align-items:center;gap:8px;color:#fff;font-weight:500}.boundary-settings input{width:60px;padding:4px;border:1px solid #444;border-radius:4px;background-color:#222;color:#fff}.layout-controls{display:flex;gap:10px}.controls button,.controls .file-input-label{padding:8px 16px;background-color:#444;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s}.controls button:hover,.controls .file-input-label:hover{background-color:#555}.canvas-container{flex:1;overflow:hidden}.gallery-container{position:relative;flex:1;display:flex;flex-direction:column}.delete-button{padding:8px 16px;background-color:#dc3545;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s}.delete-button:hover{background-color:#c82333}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.password-protection{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#1a1a1a}.password-form{background:#2a2a2a;padding:2rem;border-radius:8px;box-shadow:0 2px 4px #0003;width:100%;max-width:300px;text-align:center}.password-form h2{margin-bottom:1.5rem;color:#fff}.password-input{width:calc(100% - 1.5rem);padding:.75rem;margin-bottom:1rem;border:1px solid #444;border-radius:4px;font-size:1rem;background-color:#222;color:#fff;box-sizing:border-box}.submit-button{width:calc(100% - 1.5rem);padding:.75rem;background-color:#007bff;color:#fff;border:none;border-radius:4px;font-size:1rem;cursor:pointer;transition:background-color .2s;box-sizing:border-box}.submit-button:hover{background-color:#0056b3}.error{color:#dc3545;margin-bottom:1rem;font-size:.9rem}.sidebar .item-controls{display:flex;flex-direction:column;gap:.75rem;padding:.75rem;background-color:#333;border-radius:4px;margin:.5rem;width:calc(100% - 1rem);box-sizing:border-box}.sidebar .item-controls label{display:flex;flex-direction:column;gap:.5rem;color:#fff;font-size:.9rem;width:100%}.sidebar .item-controls input{width:100%;padding:.5rem;background-color:#222;border:1px solid #444;border-radius:4px;color:#fff;font-size:.9rem;box-sizing:border-box}.sidebar .item-controls input:focus{outline:none;border-color:#666;background-color:#2a2a2a}.sidebar .item-controls input::-webkit-inner-spin-button,.sidebar .item-controls input::-webkit-outer-spin-button{opacity:1;height:20px}.display-settings{display:flex;flex-direction:column;gap:.75rem;padding:.5rem}.setting-toggle{display:flex;align-items:center;gap:.75rem;color:#fff;font-size:.9rem;cursor:pointer}.setting-toggle input[type=checkbox]{width:16px;height:16px;cursor:pointer;accent-color:#444}.setting-toggle:hover{color:#ccc}.text-controls{display:flex;flex-direction:column;gap:.75rem;padding:.5rem}.text-style-controls{display:flex;flex-direction:column;gap:10px;margin-top:10px}.color-select{width:100%;padding:8px;background-color:#333;color:#fff;border:1px solid #444;border-radius:4px}.font-size-control{display:flex;align-items:center}.font-size-control label{display:flex;align-items:center;gap:8px;color:#fff;width:100%}.font-size-input{width:60px;padding:4px 8px;background-color:#333;color:#fff;border:1px solid #444;border-radius:4px}.add-text-btn{width:100%;padding:.5rem;background-color:#444;border:none;border-radius:4px;color:#fff;font-size:.9rem;cursor:pointer;transition:background-color .2s}.add-text-btn:hover{background-color:#555}@media print{@page{size:auto;margin:0}body{margin:0;padding:0}.sidebar,.controls,.password-protection{display:none!important}.app{height:100vh!important;width:100vw!important;position:relative!important;margin:0!important;padding:0!important;display:flex!important;justify-content:center!important;align-items:center!important;background:#fff!important;overflow:visible!important}.main-content{flex:none!important;width:100%!important;height:100%!important;display:flex!important;justify-content:center!important;align-items:center!important;overflow:visible!important;margin:0!important;padding:0!important}.canvas-container{flex:none!important;width:100%!important;height:100%!important;overflow:visible!important;display:flex!important;justify-content:center!important;align-items:center!important;margin:0!important;padding:0!important}.konvajs-content{background:#fff!important;margin:0!important;padding:0!important}.konvajs-content div:first-child{transform-origin:center center!important}.konvajs-content [data-type=Stage]{background:#fff!important}[data-type=Rect][name=background]{fill:#fff!important;stroke:#999!important}[data-type=Line]{stroke:#ddd!important}[data-type=Line][data-dash=true]{stroke:#999!important}[data-type=Line][stroke="#ff0000"]{stroke:red!important}[data-type=Text]{fill:#333!important}[data-type=Text][fill="#666"]{fill:#999!important}[data-type=Rect]:not([name=background]){stroke:#333!important}[data-type=Group][data-name=cable-line] [data-type=Line]{stroke:#333!important}[data-type=Group][data-name=cable-line] [data-type=Text],[data-type=Group][data-name=text-annotation] [data-type=Text]{fill:#333!important}}.print-preview-dialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#2a2a2a;padding:20px;border-radius:8px;box-shadow:0 2px 10px #0000004d;z-index:1000;color:#fff;min-width:300px}.print-preview-dialog h3{margin-top:0;margin-bottom:15px}.print-preview-dialog p{margin-bottom:20px;line-height:1.4}.print-preview-dialog .button-group{display:flex;gap:10px;margin-top:20px;justify-content:flex-end}.print-preview-dialog button{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;min-width:80px}.print-preview-dialog .print-button{background-color:#4caf50;color:#fff}.print-preview-dialog .cancel-button{background-color:#666;color:#fff}.cable-controls{display:flex;flex-direction:column;gap:.75rem;padding:.5rem}.cable-settings{display:flex;flex-direction:column;gap:10px;margin-top:10px}.cable-settings input,.cable-settings select{width:100%;padding:8px;background-color:#333;color:#fff;border:1px solid #444;border-radius:4px}.cable-settings input:focus,.cable-settings select:focus{outline:none;border-color:#666;background-color:#2a2a2a}.custom-component-manager{margin-top:10px}.save-button{width:100%;padding:8px;background:#4a4a4a;border:1px solid #5a5a5a;color:#fff;border-radius:4px;cursor:pointer;margin-bottom:10px}.save-button:hover{background:#5a5a5a}.save-dialog{background:#3a3a3a;padding:15px;border-radius:4px;margin-bottom:10px}.save-dialog input{width:100%;padding:8px;margin-bottom:10px;background:#2a2a2a;border:1px solid #4a4a4a;color:#fff;border-radius:4px}.dialog-buttons{display:flex;gap:10px}.dialog-buttons button{flex:1;padding:8px;background:#4a4a4a;border:1px solid #5a5a5a;color:#fff;border-radius:4px;cursor:pointer}.dialog-buttons button:hover{background:#5a5a5a}.dialog-buttons button:disabled{opacity:.5;cursor:not-allowed}.saved-components h4{margin:0 0 10px;color:#aaa;font-size:14px}.saved-component{display:flex;justify-content:space-between;align-items:center;padding:8px;background:#3a3a3a;border:1px solid #4a4a4a;border-radius:4px;margin-bottom:5px}.component-info{display:flex;flex-direction:column;gap:2px}.component-info .dimensions{font-size:12px;color:#aaa}.component-actions{display:flex;gap:5px}.component-actions button{padding:4px 8px;background:#4a4a4a;border:1px solid #5a5a5a;color:#fff;border-radius:4px;cursor:pointer}.component-actions button:hover{background:#5a5a5a}.component-actions button.delete{background:#5a2828;border-color:#6a3232;font-size:16px;line-height:1}.component-actions button.delete:hover{background:#6a3232}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#2a2a2a;padding:2rem;border-radius:8px;min-width:400px;box-shadow:0 4px 6px #0000004d}.modal-content h3{margin:0 0 1.5rem;color:#fff;font-size:1.2rem}.input-group{margin-bottom:1.5rem}.input-group label{display:block;margin-bottom:.5rem;color:#aaa;font-size:.9rem}.filename-input{display:flex;align-items:center;background:#1a1a1a;border:1px solid #444;border-radius:4px;padding:.5rem}.filename-input input{flex:1;background:none;border:none;color:#fff;font-size:1rem;outline:none;padding:0}.filename-input .extension{color:#888;margin-left:4px}.button-group{display:flex;gap:1rem;justify-content:flex-end}.button-group button{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background-color .2s}.cancel-button{background:#444;color:#fff}.cancel-button:hover{background:#555}.save-button{background:#2b5c8c;color:#fff}.save-button:hover{background:#366fa8}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{width:100%;height:100vh;margin:0;padding:0}