*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;background:#e5e5e5;-webkit-user-select:none;user-select:none}#app{width:100vw;height:100vh;position:relative;z-index:0}#artCanvas{display:block;width:100%;height:100%;cursor:crosshair;background:transparent;position:absolute;top:0;left:0;z-index:1;pointer-events:auto}.color-picker{position:absolute;top:20px;right:20px;width:120px;height:120px;border-radius:50%;overflow:hidden;box-shadow:0 4px 20px #00000026;cursor:pointer;z-index:1000;background:#fff;border:2px solid #ddd;pointer-events:auto}#colorWheel{display:block;border-radius:50%;width:100%;height:100%}.toolbar{position:absolute;bottom:30px;left:50%;transform:translate(-50%);display:flex;gap:12px;padding:12px 20px;background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:25px;box-shadow:0 4px 20px #0000001a;width:auto;min-width:600px;max-width:90vw;justify-content:center;z-index:1000;pointer-events:auto}.toolbar-btn,.file-input-label{background:none;border:none;padding:8px;border-radius:8px;cursor:pointer;color:#666;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.toolbar-btn:hover,.file-input-label:hover{background:#0000000d;color:#333}.toolbar-btn:active,.toolbar-btn.active,.file-input-label:active,.file-input-label.active{background:#3b82f61a;color:#3b82f6}.artwork-selected{outline:2px solid #3b82f6;outline-offset:4px;border-radius:4px}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;pointer-events:auto}.modal.hidden{display:none}.modal-content{background:#fff;padding:30px;border-radius:12px;max-width:80%;max-height:80%;overflow-y:auto;box-shadow:0 20px 40px #0003}.modal-content h3{margin-bottom:20px;color:#333;font-size:18px}.saved-items-grid{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;margin-bottom:20px;overflow-x:auto;overflow-y:hidden;padding:5px;max-height:200px}.saved-item{border:2px solid #ddd;border-radius:6px;padding:4px;cursor:pointer;transition:all .2s ease;background:#f9f9f9;flex-shrink:0;width:80px;height:80px;display:flex;align-items:center;justify-content:center}.saved-item:hover{border-color:#3b82f6;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.saved-item img,.saved-item canvas{max-width:70px;max-height:70px;width:auto;height:auto;border-radius:3px;object-fit:contain}.close-btn{background:#3b82f6;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-size:14px}.close-btn:hover{background:#2563eb}.loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#666;font-size:16px}#wallSelectorContainer{font-family:inherit;z-index:1100!important;pointer-events:auto}#wallSelectorContainer label{font-family:inherit}#wallSelectorContainer select{font-family:inherit;outline:none}#wallSelectorContainer select:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.wall-item{transition:all .3s ease}.wall-item canvas{width:100%;height:auto;border-radius:4px}.wall-item:hover{transform:translateY(-2px)}.debug-test{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:red;color:#fff;padding:20px;z-index:9999;display:none}.storage-container{position:fixed;top:20px;left:20px;width:250px;max-height:400px;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,122,204,.3);border-radius:8px;box-shadow:0 8px 32px #0000001a;z-index:1000;overflow:hidden;pointer-events:auto}.storage-header{background:#007acc1a;padding:8px 12px;border-bottom:1px solid rgba(0,122,204,.2);cursor:move;display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:500;color:#333;-webkit-user-select:none;user-select:none}.storage-close-btn{background:none;border:none;font-size:16px;cursor:pointer;color:#666;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:background-color .2s}.storage-close-btn:hover{background-color:#0000001a;color:#333}.storage-items{padding:8px;max-height:350px;overflow-y:auto;display:flex;flex-wrap:wrap;gap:4px}.storage-items .saved-item{width:60px;height:60px;border:1px solid rgba(0,122,204,.3);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center;transition:transform .2s,box-shadow .2s;position:relative;background:#f9f9f9}.storage-items .saved-item:hover{transform:scale(1.05);box-shadow:0 4px 12px #007acc4d}.storage-items .saved-item img{max-width:56px;max-height:56px;width:auto;height:auto;object-fit:contain}.nw-resize{cursor:nw-resize!important}.ne-resize{cursor:ne-resize!important}.sw-resize{cursor:sw-resize!important}.se-resize{cursor:se-resize!important}
