.de-page{min-height:100vh;background:#f0f1f3;display:flex;flex-direction:column}.de-header{background:#fff;border-bottom:1px solid #e5e7eb;padding:.75rem 1.5rem;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}.de-header-left{display:flex;align-items:center;gap:.75rem}.de-back{width:36px;height:36px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#374151}.de-back:hover{background:#f3f4f6}.de-header-left h1{font-size:1rem;font-weight:700;color:#1f2937}.de-product-name{font-size:.8rem;color:#9ca3af;font-weight:500}.de-header-right{display:flex;gap:.5rem}.de-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;border:none;border-radius:8px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s}.de-btn-secondary{background:#f3f4f6;color:#374151}.de-btn-secondary:hover{background:#e5e7eb}.de-btn-primary{background:#4338ca;color:#fff}.de-btn-primary:hover{background:#3730a3}.de-layout{display:flex;flex:1;overflow:hidden}.de-toolbar{width:260px;background:#fff;border-right:1px solid #e5e7eb;padding:1rem;overflow-y:auto;flex-shrink:0}.de-tool-group{display:flex;flex-direction:column;gap:.25rem}.de-tool-btn{display:flex;align-items:center;gap:.6rem;padding:.6rem .75rem;border:none;border-radius:8px;background:none;cursor:pointer;font-size:.8rem;font-weight:500;color:#6b7280;transition:all .2s}.de-tool-btn:hover{background:#f3f4f6;color:#374151}.de-tool-btn.active{background:#eef2ff;color:#4338ca;font-weight:600}.de-tool-btn span{flex:1;text-align:left}.de-tool-divider{height:1px;background:#e5e7eb;margin:.75rem 0}.de-tool-panel{display:flex;flex-direction:column;gap:.75rem}.de-action-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;border:2px dashed #d1d5db;border-radius:8px;background:#fafafe;cursor:pointer;font-size:.8rem;font-weight:600;color:#6b7280;transition:all .2s}.de-action-btn:hover{border-color:#4338ca;color:#4338ca}.de-tool-field{display:flex;flex-direction:column;gap:.3rem}.de-tool-field label{font-size:.7rem;font-weight:600;color:#9ca3af;text-transform:uppercase;letter-spacing:.05em}.de-tool-field select,.de-tool-field input[type=number]{padding:.5rem;border:1px solid #e5e7eb;border-radius:6px;font-size:.8rem;outline:none}.de-tool-field select:focus,.de-tool-field input[type=number]:focus{border-color:#4338ca}.de-tool-field input[type=color]{width:100%;height:32px;border:1px solid #e5e7eb;border-radius:6px;padding:2px;cursor:pointer}.de-tool-row{display:flex;gap:.25rem}.de-format-btn{width:32px;height:32px;border:1px solid #e5e7eb;border-radius:6px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:#374151;transition:all .15s}.de-format-btn:hover{background:#f3f4f6}.de-shapes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}.de-shape-btn{aspect-ratio:1;border:1px solid #e5e7eb;border-radius:8px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#6b7280;transition:all .15s}.de-shape-btn:hover{border-color:#4338ca;color:#4338ca}.de-bg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.4rem}.de-bg-swatch{width:100%;aspect-ratio:1;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .15s}.de-bg-swatch:hover{transform:scale(1.1)}.de-bg-swatch.active{border-color:#4338ca;box-shadow:0 0 0 2px #4338ca33}.de-canvas-area{flex:1;display:flex;flex-direction:column;align-items:center;overflow:auto}.de-canvas-toolbar{width:100%;background:#fff;border-bottom:1px solid #e5e7eb;padding:.5rem 1rem;display:flex;align-items:center;justify-content:space-between}.de-side-tabs{display:flex;background:#f3f4f6;border-radius:8px;padding:2px}.de-side-tabs button{padding:.4rem 1rem;border:none;border-radius:6px;background:none;font-size:.8rem;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s}.de-side-tabs button.active{background:#fff;color:#1f2937;font-weight:600;box-shadow:0 1px 3px #0000001a}.de-canvas-actions{display:flex;align-items:center;gap:.25rem}.de-icon-btn{width:32px;height:32px;border:1px solid #e5e7eb;border-radius:6px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#6b7280;transition:all .15s}.de-icon-btn:hover{background:#f3f4f6;color:#374151}.de-icon-btn:disabled{opacity:.3;cursor:not-allowed}.de-zoom{display:flex;align-items:center;gap:.25rem;margin-left:.5rem;background:#f3f4f6;border-radius:6px;padding:2px}.de-zoom button{width:28px;height:28px;border:none;background:none;cursor:pointer;font-size:1rem;font-weight:600;color:#6b7280;display:flex;align-items:center;justify-content:center;border-radius:4px}.de-zoom button:hover{background:#e5e7eb}.de-zoom span{font-size:.75rem;font-weight:600;color:#374151;min-width:40px;text-align:center}.de-canvas-wrapper{padding:2rem;display:flex;align-items:center;justify-content:center;flex:1;transform-origin:center center;transition:transform .2s}.de-canvas-wrapper canvas{border:1px solid #d1d5db;border-radius:4px;box-shadow:0 4px 20px #0000001a}.de-loading{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#9ca3af}@media(max-width:768px){.de-layout{flex-direction:column}.de-toolbar{width:100%;border-right:none;border-bottom:1px solid #e5e7eb;padding:.75rem;overflow-x:auto}.de-tool-group{flex-direction:row;overflow-x:auto}.de-tool-btn{white-space:nowrap}.de-tool-divider{width:1px;height:auto;margin:0 .5rem}.de-header{padding:.5rem 1rem}.de-header-left h1{font-size:.85rem}.de-product-name{display:none}.de-canvas-wrapper{padding:1rem}}