:root{--color-background: #1a1a1a;--color-surface: #2a2a2a;--color-primary: #646cff;--color-primary-hover: #747bff;--color-border: #444;--color-text: #e0e0e0;--color-text-secondary: #a0a0a0;--font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--color-background);color:var(--color-text);margin:0;min-height:100vh;display:flex}#root{width:100%;height:100vh;display:flex;flex-direction:column}.app-container{display:grid;grid-template-rows:1fr;height:100%;gap:1rem;padding:1rem;transition:grid-template-columns .3s ease-in-out}.panel{background-color:var(--color-surface);border-radius:8px;border:1px solid var(--color-border);padding:1.5rem;display:flex;flex-direction:column;overflow:hidden}.controls-panel{overflow-y:hidden}.panel h2,.panel h3,.panel h4{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--color-border)}.panel h2{font-size:1.25rem;margin-bottom:1.5rem}.panel h3{font-size:1.1rem}.panel h4{font-size:1rem;margin-top:0;padding-bottom:.5rem}.top-actions{display:flex;justify-content:center;gap:.5rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border)}.top-action-btn{background-color:transparent;border:1px solid var(--color-border);color:var(--color-text-secondary);width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;margin:0;border-radius:6px;cursor:pointer;transition:all .2s}.top-action-btn:hover:not(:disabled){background-color:var(--color-background);border-color:var(--color-primary);color:var(--color-primary)}.top-action-btn:disabled{color:#555;cursor:not-allowed;border-color:#333}.top-action-btn.button-like-label{padding:0}.top-action-btn.button-like-label input[type=file]{display:none}.accordion-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.accordion-header h2,.accordion-header h3{border:none;margin:0;padding:0;border-bottom:none}.accordion-icon{transition:transform .2s ease-in-out;transform-origin:center}.accordion-icon.collapsed{transform:rotate(-90deg)}.controls-tabs{display:flex;border-bottom:1px solid var(--color-border)}.control-tab-btn{flex:1;background-color:transparent;border:none;border-bottom:3px solid transparent;padding:.75rem;margin-bottom:-1px;cursor:pointer;color:var(--color-text-secondary);transition:all .2s;display:flex;justify-content:center;align-items:center}.control-tab-btn:hover:not(:disabled){background-color:var(--color-background);color:var(--color-text)}.control-tab-btn.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.control-tab-btn:disabled{color:#555;cursor:not-allowed}.control-tab-btn svg{width:24px;height:24px}.tab-content{flex:1;overflow-y:auto;min-height:100px;padding-top:1.5rem}.controls-panel .control-group{margin-bottom:1.5rem}.controls-panel label{display:block;font-weight:500;margin-bottom:.5rem;color:var(--color-text-secondary)}.file-input-label{display:flex;justify-content:center;align-items:center;width:100%;padding:.75rem;background-color:var(--color-background);border:2px dashed var(--color-border);border-radius:6px;cursor:pointer;transition:background-color .2s,border-color .2s;text-align:center}.file-input-label:hover{background-color:#333;border-color:var(--color-primary)}.file-input-label input[type=file]{display:none}.file-name{margin-top:.75rem;font-size:.875rem;color:var(--color-primary);word-break:break-all}.placeholder{flex-grow:1;display:flex;justify-content:center;align-items:center;color:var(--color-text-secondary);font-size:1.1rem;text-align:center;height:100%}.canvas-area{padding:0;overflow:hidden}.canvas-tabs{display:flex;border-bottom:1px solid var(--color-border)}.canvas-tabs button{flex:1;padding:.75rem;background-color:transparent;border:none;border-bottom:3px solid transparent;color:var(--color-text-secondary);cursor:pointer;font-size:1rem;margin-bottom:-1px;transition:all .2s}.canvas-tabs button:hover{background-color:var(--color-background);color:var(--color-text)}.canvas-tabs button.active{color:var(--color-primary);border-bottom-color:var(--color-primary);background-color:transparent}.image-container{position:relative;line-height:0;width:fit-content;height:fit-content;margin:auto}.image-container img{max-width:100%;max-height:100%;object-fit:fill;display:block;position:relative;z-index:1}.data-preview h2{flex-shrink:0}.data-preview .table-container{flex:1;min-height:100px;overflow-y:auto;overflow-x:auto}.data-preview table{width:100%;border-collapse:collapse;table-layout:auto}.data-preview th,.data-preview td{padding:.75rem;text-align:left;border-bottom:1px solid var(--color-border);white-space:nowrap}.data-preview th{background-color:var(--color-background);position:sticky;top:0}.data-preview tbody tr{cursor:pointer;transition:background-color .2s}.data-preview tbody tr:hover{background-color:#646cff1a}.selected-field-settings{margin-top:1.5rem}button{width:100%;padding:.75rem;background-color:var(--color-primary);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:1rem;font-weight:500;transition:background-color .2s;margin-bottom:.5rem}button:hover{background-color:var(--color-primary-hover)}button:disabled{background-color:#555;color:#999;cursor:not-allowed}input[type=text],select{width:100%;padding:.75rem;background-color:var(--color-background);color:var(--color-text);border:1px solid var(--color-border);border-radius:6px;font-size:.9rem}input[type=number]{-moz-appearance:textfield;padding:.75rem;background-color:var(--color-background);color:var(--color-text);border:1px solid var(--color-border);border-radius:6px;font-size:.9rem}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.row-navigator{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:1.5rem;border-top:1px solid var(--color-border)}.row-navigator button{width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:0}.row-navigator span{font-weight:500;color:var(--color-text-secondary);flex-grow:1;text-align:center}.text-node{position:absolute;border:2px solid transparent;display:flex;padding:.1em .2em;-webkit-user-select:none;user-select:none;z-index:2;align-items:flex-start;overflow:hidden;white-space:pre-wrap;word-break:break-word}.text-node.inactive-visible{border:2px dashed rgba(100,108,255,.5)}.text-node[style*="text-align: left"]{justify-content:flex-start}.text-node[style*="text-align: center"]{justify-content:center}.text-node[style*="text-align: right"]{justify-content:flex-end}.text-node[style*="text-align: justify"]{justify-content:stretch}.text-node.selected{border:2px solid var(--color-primary);z-index:10}.resize-handle{position:absolute;width:12px;height:12px;background:var(--color-primary);border:2px solid var(--color-surface);border-radius:50%;bottom:-6px;right:-6px;cursor:nwse-resize;z-index:11}.smart-guide{position:absolute;background-color:#f0f;z-index:20}.progress-indicator{margin-top:1rem;text-align:center}.progress-indicator p{font-size:.9rem;color:var(--color-text-secondary);margin-bottom:.5rem}.progress-indicator progress{width:100%;height:8px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.progress-indicator progress::-webkit-progress-bar{background-color:var(--color-background);border-radius:4px}.progress-indicator progress::-webkit-progress-value{background-color:var(--color-primary);border-radius:4px;transition:width .1s linear}.progress-indicator progress::-moz-progress-bar{background-color:var(--color-primary);border-radius:4px}.control-row{display:flex;gap:.5rem;align-items:center}.control-row select{flex-grow:1}.font-size-input{width:70px;flex-shrink:0;flex-grow:0;text-align:center}.control-row input[type=color]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:44px;height:44px;padding:0;border:1px solid var(--color-border);border-radius:6px;background-color:transparent;cursor:pointer}.control-row input[type=color]::-webkit-color-swatch-wrapper{padding:4px}.control-row input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}.control-row input[type=color]::-moz-color-swatch{border:none;border-radius:4px}.button-group{display:flex;flex-grow:1}.button-group button{flex-grow:1;margin:0;border-radius:0;background-color:var(--color-background);border:1px solid var(--color-border);padding:.5rem;min-width:44px;display:flex;align-items:center;justify-content:center}.button-group button:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.button-group button:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.button-group button:not(:first-child){border-left-width:0}.button-group button.active{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff}.button-group button:hover:not(.active){background-color:#333}.font-manager .control-row input{flex-grow:1}.add-font-btn{width:auto;flex-shrink:0;padding:.75rem 1rem;margin-bottom:0}.add-font-toggle-btn{width:44px;height:44px;padding:0;flex-shrink:0;background-color:var(--color-background);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-secondary);font-size:1.5rem;line-height:1;font-weight:500;display:flex;align-items:center;justify-content:center;margin-bottom:0}.add-font-toggle-btn:hover{background-color:#333;border-color:var(--color-primary)}.slider-control{display:flex;align-items:center;gap:.5rem}.slider-control label{margin-bottom:0;flex-shrink:0}.slider-control input[type=range]{flex-grow:1;padding:0}.slider-value{font-variant-numeric:tabular-nums;min-width:2.5em;text-align:right;color:var(--color-text-secondary)}.print-settings .control-row{display:flex;gap:.75rem}.print-settings .input-group{display:flex;flex-direction:column;flex:1}.print-settings .input-group label{font-size:.8rem;margin-bottom:.25rem;color:var(--color-text);font-weight:400}.print-settings .input-group input{width:100%;padding:.5rem}.aspect-lock-btn{background:none;border:none;cursor:pointer;padding:0;margin:0 .5rem;align-self:flex-end;margin-bottom:6px;width:20px;height:20px;color:var(--color-text-secondary)}.aspect-lock-btn:hover{background:none;color:var(--color-primary)}.aspect-lock-btn.locked{color:var(--color-primary)}.aspect-ratio-group{align-items:flex-end}.aspect-ratio-group .input-group{flex-grow:1}.aspect-ratio-group .input-group input{width:100%}.layout-info{margin-top:1rem;padding:.75rem;background-color:var(--color-background);border-radius:6px;text-align:center;font-size:.9rem;color:var(--color-text-secondary)}.edit-form-section{flex:1;padding-top:1.5rem;margin-top:1.5rem;border-top:1px solid var(--color-border);display:flex;flex-direction:column;min-height:100px;overflow:hidden}.edit-form-section h3{flex-shrink:0;border-bottom:none;padding-bottom:0}.edit-form-container{overflow-y:auto;flex-grow:1;padding-right:.5rem}.edit-form-container .form-group{margin-bottom:1rem}.edit-form-container .form-group label{display:block;font-weight:500;margin-bottom:.5rem;color:var(--color-text-secondary)}.checkbox-label{display:flex;align-items:center;cursor:pointer;margin-bottom:0;color:var(--color-text)}.checkbox-label input[type=checkbox]{width:auto;margin-right:.75rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:var(--color-surface);padding:1.5rem;border-radius:8px;border:1px solid var(--color-border);width:90%;max-width:500px;display:flex;flex-direction:column}.modal-content.print-dialog{max-width:850px}.modal-content h2{margin:0;padding-bottom:1rem;border-bottom:1px solid var(--color-border);margin-bottom:1.5rem;font-size:1.25rem}.modal-body{display:flex;flex-direction:column;gap:1.5rem}.modal-body.print-dialog-body{flex-direction:row;align-items:flex-start}.print-dialog-settings{flex:1;min-width:350px;display:flex;flex-direction:column;gap:1.5rem}.print-preview-container{flex:1;display:flex;justify-content:center;align-items:center;background-color:var(--color-background);border-radius:6px;padding:1rem;align-self:stretch}.print-preview-container .placeholder{height:auto}.print-preview-container svg{width:100%;height:100%;max-height:500px}.preview-paper{fill:#fff}.preview-card{fill:#e0e0e0;stroke:#aaa;stroke-width:.25}.preview-card-slot{fill:#f5f5f5;stroke:none}.preview-trim-box{fill:none;stroke:#f0f;stroke-width:.5;stroke-dasharray:2 2}.readonly-field{width:100%;padding:.75rem;background-color:var(--color-background);color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:6px;font-size:.9rem;text-align:center}.modal-actions{display:flex;justify-content:flex-end;gap:1rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--color-border)}.modal-actions button{width:auto;padding:.75rem 1.5rem;margin-bottom:0}.modal-actions button.secondary{background-color:var(--color-background);border:1px solid var(--color-border)}.modal-actions button.secondary:hover{background-color:#333}*{scrollbar-width:thin;scrollbar-color:var(--color-border) var(--color-background)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-background)}::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:4px;border:2px solid var(--color-background)}::-webkit-scrollbar-thumb:hover{background-color:var(--color-primary-hover)}.card-dimension-visualizer{margin-top:1rem;display:flex;justify-content:center;align-items:center;background-color:var(--color-background);border-radius:6px;padding:.5rem;min-height:190px}.card-dimension-visualizer-placeholder{margin-top:1rem;padding:2rem;background-color:var(--color-background);border-radius:6px;text-align:center;font-size:.9rem;color:var(--color-text-secondary);display:flex;justify-content:center;align-items:center;min-height:190px}.card-dimension-visualizer svg rect{fill:none;stroke:var(--color-primary);stroke-width:1.5}.card-dimension-visualizer svg line,.card-dimension-visualizer svg polygon{stroke:var(--color-text-secondary);fill:var(--color-text-secondary);stroke-width:1}.card-dimension-visualizer svg text{fill:var(--color-text-secondary);font-size:11px;font-family:var(--font-family);font-variant-numeric:tabular-nums}.tool-bar{display:flex;gap:.5rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border)}.tool-btn{background-color:var(--color-background);border:1px solid var(--color-border);color:var(--color-text-secondary);width:44px;height:44px;padding:.5rem;display:flex;align-items:center;justify-content:center;margin:0}.tool-btn.active{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff}.tool-btn:hover:not(.active){background-color:#333}.vector-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:5}.vector-overlay .drawn-path{pointer-events:auto}.vector-overlay .drawn-path.selected{stroke:var(--color-primary)!important}.path-anchor{cursor:move;pointer-events:auto;fill:var(--color-surface);stroke:var(--color-primary);stroke-width:1.5px}.path-handle-line{stroke:var(--color-primary-hover);stroke-width:1px;pointer-events:none}.path-handle-control{cursor:move;pointer-events:auto;fill:var(--color-primary-hover)}.tool-select .text-node,.tool-select .drawn-path{cursor:move}.tool-pen{cursor:crosshair}.tool-text{cursor:text}